jamiejohnsonkc

From https://www.npmjs.com/package/check-peer-dependencies

Checks peer dependencies of the current NodeJS package. Offers solutions for any that are unmet.

This utility will recursively find all peerDependencies in your project's dependencies list. It checks if you have installed a package that meets the required peer dependency versions. If any peer dependencies are unmet, it will search for a compatible version to install.

Note: you must run npm install or yarn first in order to install all normal dependencies.

usage:

jamiejohnsonkc

<Text variant={`text.${props.textVariant}`}>
//
<component textVariant="caption"/>

jamiejohnsonkc

/** @jsx jsx */
import { jsx } from 'theme-ui'
export default props => (
  <div
    {...props}
    sx={{
      boxShadow: theme => `0 0 4px ${theme.colors.primary}`,
    }}
  />
)

jamiejohnsonkc

/** @jsx jsx */
import { jsx, Card, Text, Image, Button } from "theme-ui"
import { StaticQuery, graphql } from "gatsby"
import React from "react"
import PropTypes from "prop-types"
import TestCompItem from "../TestCompItem"

const TestComp = (children) => (
  <StaticQuery
    query={graphql`

jamiejohnsonkc

/** @jsx jsx */
import { jsx, Card, Text, Image, Button } from "theme-ui"
import { StaticQuery, graphql } from "gatsby"
import React from "react"
import PropTypes from "prop-types"

const MonoCompTest = (children) => (
  <StaticQuery
    query={graphql`
      {

jamiejohnsonkc

/** @jsx jsx */
import { jsx, Card, Image, Text } from "theme-ui"
import { useStaticQuery, graphql } from "gatsby"
import React from "react"
import PropTypes from "prop-types"

const CardImageWCaption = () => {
  const data = useStaticQuery(graphql`
    {
      imageWCaptionJson {

jamiejohnsonkc

/** @jsx jsx */
import { jsx, Card, Text, Image } from "theme-ui"
import React from "react"
import PropTypes from "prop-types"
import workshopImg from "../../../images/workshop.jpg"

const ThreeCards = (props) => (
  <Card
    {...props}
    as="div"

jamiejohnsonkc

import React from "react"
import Foo from "./New-My-JSON-Content.json"

const JsonComponent = () => (
  <div style={{ maxWidth: `960px`, margin: `1.45rem` }}>
    <h1>{Foo.title}</h1>
    <ul>
      {Foo.content.map((data, index) => {
        return <li key={`content_item_${index}`}>{data.item}</li>
      })}

jamiejohnsonkc

import React from "react"
import { graphql } from "gatsby"
import Layout from "../components/layout"

export default function BlogPost({ data }) {
  const post = data.markdownRemark
  return (
    <Layout>
      <div>
        <h1>{post.frontmatter.title}</h1>

jamiejohnsonkc

const path = require(`path`)
const { createFilePath } = require(`gatsby-source-filesystem`)

exports.onCreateNode = ({ node, getNode, actions }) => {
  const { createNodeField } = actions
  if (node.internal.type === `MarkdownRemark`) {
    const slug = createFilePath({ node, getNode, basePath: `pages` })
    createNodeField({
      node,
      name: `slug`,