diff --git a/.github/workflows/e2e.yml b/.github/workflows/e2e.yml index 3fe644fc1..9b1964438 100644 --- a/.github/workflows/e2e.yml +++ b/.github/workflows/e2e.yml @@ -36,7 +36,7 @@ jobs: - run: pnpm build:docs - run: cd packages/e2e && pnpm cypress install - - uses: cypress-io/github-action@v4.2.0 + - uses: cypress-io/github-action@v5.0.0 with: record: true parallel: true diff --git a/examples/next/components/Header.tsx b/examples/next/components/Header.tsx index 77fcc0bd8..f4e916d1c 100644 --- a/examples/next/components/Header.tsx +++ b/examples/next/components/Header.tsx @@ -2,9 +2,11 @@ import { Button, useColorMode } from 'theme-ui' const Header = () => { const [colorMode, setColorMode] = useColorMode() + return (
- })) -} - -// OUTPUT - - - - -// ... -``` +By default, this works by setting CSS Custom Properties for each theme color, then when the color mode is changed, updating the properties. This makes color modes SSR-safe, since the generated CSS for your components doesn’t rely on knowing the user’s color mode to render. See below how to access the raw color values or disable the use off Custom Properties. ## Setting the color mode @@ -167,9 +71,11 @@ export default (props) => { } ``` -## Applying colors +See our [guide to color mode toggles](/guides/color-mode-toggles) for more. + +## Applying page-wide colors -The ThemeProvider component will automatically apply color mode styles to the +The `ThemeProvider` component will automatically apply color mode styles (by setting `color` and `background-color`) to the `` element. ```jsx @@ -181,62 +87,26 @@ export default (props) => ( ) ``` -- To disable this behavior, add the `useRootStyles: false` flag to your theme. +To disable this behavior, add the `useRootStyles: false` flag to your theme. -## Gatsby plugin +If you’d like to apply your theme color to the browser, [see our guide to the theme color meta tag](/guides/theme-color-meta-tag). + +### Gatsby plugin For use in a Gatsby site, install and use `gatsby-plugin-theme-ui` to add the ThemeProvider to the root of your application. The plugin will also help prevent the flash of colors that can happen during page load when a user has a non-default color mode set. -```sh -npm i gatsby-plugin-theme-ui -``` - This plugin will look for a `src/gatsby-plugin-theme-ui/index.js` file to import and pass to the ThemeProvider. -```js filename=gatsby-config.js -module.exports = { - plugins: ['gatsby-plugin-theme-ui'], -} -``` - -See the [Gatsby plugin docs](/packages/gatsby-plugin) for more info. +See the [Gatsby plugin docs](/packages/gatsby-plugin) for more info & examples. -## Advanced +## Configuration Theme UI includes a few advanced configuration options for color modes. -### Turn off custom properties - -Theme UI uses [CSS custom properties](https://caniuse.com/#feat=css-variables) -under the hood to help prevent the flash of color on load. If you’re targeting -browsers that don't support custom properties you can turn off this setting. -This will cause the colors to flash on initial page load. - -```js -// example theme colors -{ - config: { - useCustomProperties: false, - }, - colors: { - text: '#000', - background: '#fff', - primary: '#07c', - modes: { - dark: { - text: '#fff', - background: '#000', - primary: '#0cf', - } - } - } -} -``` - ### Responding to the `prefers-color-scheme` media query The `useColorSchemeMediaQuery` option on the theme configuration initializes a @@ -264,9 +134,7 @@ enabled by default. } ``` -- To enable the color mode to update when a user's current - `prefers-color-scheme` media query value changes, set - `useColorSchemeMediaQuery` to `'system'`. +To enable the color mode to update when a user's current `prefers-color-scheme` media query value changes, set `useColorSchemeMediaQuery` to `'system'`. ### Disable persisting color mode on `localStorage` @@ -294,9 +162,11 @@ configuration. ### Set a custom color mode for printing By default, when printing a webpage, browsers will use the current color mode -enabled. (This means if a user is currently using a dark or colored-background -mode, their printed page will share that styling). If you’d like to set a color -mode to be used on printing, set that color mode with the configuration option +enabled. This means if a user is currently using a dark or colored-background +mode, their printed page will share that styling. + +If you’d like to set a color +mode to be used on printing, such as light mode, set that color mode with the configuration option `printColorModeName`, set to one of your `colors.modes` names, the `initialColorModeName` value, or the string `'initial'`. @@ -321,3 +191,113 @@ no additional client-side JavaScript for printing. } } ``` + +### Turn off custom properties + +Theme UI uses [CSS custom properties](https://caniuse.com/#feat=css-variables) +under the hood to help prevent the flash of color on load. If you’re targeting +browsers that don't support custom properties, you can turn off this setting with `useCustomProperties: false`. +This will cause the colors to flash on initial page load. + +```js +// example theme colors +{ + config: { + useCustomProperties: false, + }, + colors: { + text: '#000', + background: '#fff', + primary: '#07c', + modes: { + dark: { + text: '#fff', + background: '#000', + primary: '#0cf', + } + } + } +} +``` + +## Advanced: Accessing theme colors explicitly + +### Colors object + +The `colors` object contains Custom CSS Properties + +```js +{ + colors: { + text: 'var(--theme-ui-colors-text)', + background: 'var(--theme-ui-colors-background)', + primary: 'var(--theme-ui-colors-primary)', + } +} +``` + +### rawColors object + +If you need to pass original value somewhere where CSS Properties (e.g. WebGL +Canvas) won't work, use `rawColors`. + +```js +{ + rawColors: { + text: '#000', + background: '#fff', + primary: '#07c', + } +} +``` + +All colors found in `colors.modes` will be referenced by their key in the +context object `rawColors.modes`. + +### With the `sx` prop + +```jsx +export default (props) => ( +
({ + color: theme.rawColors.modes?.dark?.text + bg: theme.rawColors.modes?.dark?.bg + })} + /> +) +``` + +### With Theme UI context + +Use the [`useThemeUI`](/hooks#usethemeui) hook to access the context object +directly in a component. The theme object it includes contains `colors` and `rawColors`. + +
+ +Code example + +```jsx +import { useThemeUI } from 'theme-ui' + +export default (props) => { + const { theme: { rawColors }, setColorMode } = useThemeUI() + + return Object.entries(rawColors?.modes).map(([mode, values]) => ({ + + })) +} + +// OUTPUT + + + + +// ... +``` + +
diff --git a/packages/docs/src/pages/components/spinner.mdx b/packages/docs/src/pages/components/spinner.mdx index 01ab9fd8e..7abfacebc 100644 --- a/packages/docs/src/pages/components/spinner.mdx +++ b/packages/docs/src/pages/components/spinner.mdx @@ -19,12 +19,13 @@ import { Spinner } from 'theme-ui' | Name | Type | Description | | ------------- | ------ | ------------------------------------------------ | | `title` | String | (default `'loading'`) Text for SVG `` tag | -| `size` | Number | (default `48`) chart diameter | +| `size` | Number | (default `48`) indicator diameter | | `strokeWidth` | Number | (default `4`) stroke width | +| `duration` | Number | (default `750`) duration of animation in ms | -A `title` attribute should be provided to the component for accessibility purposes. -The element uses `role='img'` by default. -Pass any overrides or additional attributes for the SVG element as props. +A `title` attribute should be provided to the component for accessibility +purposes. The element uses `role='img'` by default. Pass any overrides or +additional attributes for the SVG element as props. ## Variants diff --git a/packages/docs/src/pages/getting-started/gatsby.mdx b/packages/docs/src/pages/getting-started/gatsby.mdx index 293308a30..f7b88f34f 100755 --- a/packages/docs/src/pages/getting-started/gatsby.mdx +++ b/packages/docs/src/pages/getting-started/gatsby.mdx @@ -8,7 +8,7 @@ To use Theme UI with [Gatsby][], install and use [`gatsby-plugin-theme-ui`](/packages/gatsby-plugin). ```sh -npm i theme-ui gatsby-plugin-theme-ui @emotion/react @mdx-js/react@v1 +npm i theme-ui @theme-ui/mdx gatsby-plugin-theme-ui @emotion/react @mdx-js/react ``` Add the plugin to your `gatsby-config.js`. diff --git a/packages/docs/src/pages/guides/global-styles.mdx b/packages/docs/src/pages/guides/global-styles.mdx index c95228cc1..9939fd96f 100644 --- a/packages/docs/src/pages/guides/global-styles.mdx +++ b/packages/docs/src/pages/guides/global-styles.mdx @@ -4,10 +4,15 @@ title: 'Global Styles' # Global Styles -Use the Emotion `Global` component to add global CSS with theme-based values. +Theme UI offers a `Global` component (that wraps Emotion’s) for adding global +CSS with theme-based values. -By default, the `ThemeProvider` component will apply styles in `theme.styles.root` to the `<html>` element. -It will also apply `color` and `background-color` styles based on `theme.colors.text` and `theme.colors.background` respectively. +By default (or, unless the +[`useRootStyles` configuration option](/theming#configuration-flags)is +disabled), the `ThemeProvider` component will apply styles in +`theme.styles.root` to the `<html>` element. It will also apply `color` and +`background-color` styles based on `theme.colors.text` and +`theme.colors.background` respectively. <Note> Generally, you should try to avoid adding CSS to global scope. Many styles can @@ -15,23 +20,18 @@ It will also apply `color` and `background-color` styles based on `theme.colors. </Note> ```jsx -import { Global } from '@emotion/react' +import { Global } from 'theme-ui' export default (props) => ( <Global - styles={(theme) => ({ - '*': { - boxSizing: 'border-box', + styles={{ + button: { + m: 0, + bg: 'primary', + color: 'background', + border: 0, }, - })} + }} /> ) ``` - -<Note> - - If you are upgrading from a version of theme-ui older that v0.6.0, be aware the import - package has changed from `@emotion/core` to `@emotion/react`. For more information see - the [Migration Notes for 0.6](https://theme-ui.com/migrating/#breaking-changes). - -</Note> diff --git a/packages/docs/src/pages/mdx/styling.mdx b/packages/docs/src/pages/mdx/styling.mdx index 954d339c3..2baa38a6f 100644 --- a/packages/docs/src/pages/mdx/styling.mdx +++ b/packages/docs/src/pages/mdx/styling.mdx @@ -14,7 +14,7 @@ of MDX pages, or at the root level of your project, such as in `pages/_app.js` for Next.js. ```jsx -import { MDXProvider } from '@mdx-js/react' +import { MDXProvider, useMDXComponents } from '@mdx-js/react' import { useThemedStylesWithMdx } from '@theme-ui/mdx' import { ThemeProvider } from 'theme-ui' diff --git a/packages/docs/src/pages/packages/global.mdx b/packages/docs/src/pages/packages/global.mdx new file mode 100644 index 000000000..c0bbbf9a4 --- /dev/null +++ b/packages/docs/src/pages/packages/global.mdx @@ -0,0 +1,7 @@ +--- +title: '@theme-ui/global' +--- + +import Readme from '@theme-ui/global/README.md' + +<Readme /> diff --git a/packages/docs/src/sidebar.mdx b/packages/docs/src/sidebar.mdx index 1c833bd65..3bb6d819e 100644 --- a/packages/docs/src/sidebar.mdx +++ b/packages/docs/src/sidebar.mdx @@ -58,6 +58,7 @@ - [@theme-ui/core](/packages/core) - [@theme-ui/components](/packages/components) - [@theme-ui/mdx](/packages/mdx) + - [@theme-ui/global](/packages/global) - [@theme-ui/presets](/packages/presets) - [@theme-ui/prism](/packages/prism) - [@theme-ui/color](/packages/color) diff --git a/packages/docs/static/card.svg b/packages/docs/static/card.svg index 2ee23e931..56a73676b 100644 --- a/packages/docs/static/card.svg +++ b/packages/docs/static/card.svg @@ -1,4 +1,4 @@ -<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 720" width="1280" height="720" style="color:white;max-width:100%;height:auto"><rect width="1280" height="720" fill="black"></rect><g transform="translate(512 232)"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="256" height="256" style="font-family:Inter, sans-serif;font-size:12px;letter-spacing:0.1em;fill:currentcolor;color:inherit"><defs><style type="text/css"> +<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1280 720" width="1280" height="720" style="display:block;color:white;width:1280px;height:720px"><rect width="1280" height="720" fill="black"></rect><g transform="translate(512 232)"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="256" height="256" style="font-family:Inter, sans-serif;font-size:12px;letter-spacing:0.1em;fill:currentcolor;color:inherit;pointer-events:none"><defs><style type="text/css"> <![CDATA[ @font-face { font-family: 'Inter'; diff --git a/packages/docs/static/logo.svg b/packages/docs/static/logo.svg index b2ac761dc..a85c5509c 100644 --- a/packages/docs/static/logo.svg +++ b/packages/docs/static/logo.svg @@ -1,4 +1,4 @@ -<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="256" height="256" style="font-family:Inter, sans-serif;font-size:12px;letter-spacing:0.1em;fill:currentcolor;color:inherit"><defs><style type="text/css"> +<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" width="256" height="256" style="font-family:Inter, sans-serif;font-size:12px;letter-spacing:0.1em;fill:currentcolor;color:inherit;pointer-events:none"><defs><style type="text/css"> <![CDATA[ @font-face { font-family: 'Inter'; diff --git a/packages/e2e/package.json b/packages/e2e/package.json index c1dc7a986..7f516c3c3 100644 --- a/packages/e2e/package.json +++ b/packages/e2e/package.json @@ -1,7 +1,7 @@ { "name": "e2e", "private": true, - "version": "0.15.4", + "version": "0.15.5-develop.2", "description": "Cypress tests ran against Theme UI docs and examples", "scripts": { "open": "cypress open", diff --git a/packages/gatsby-plugin-theme-ui/README.md b/packages/gatsby-plugin-theme-ui/README.md index 0d1c47541..2d73f930d 100755 --- a/packages/gatsby-plugin-theme-ui/README.md +++ b/packages/gatsby-plugin-theme-ui/README.md @@ -3,7 +3,7 @@ Gatsby plugin for adding Theme UI context ```sh -npm i theme-ui gatsby-plugin-theme-ui @emotion/react @mdx-js/react@v1 +npm i theme-ui @theme-ui/mdx gatsby-plugin-theme-ui @emotion/react @mdx-js/react ``` ```js diff --git a/packages/gatsby-plugin-theme-ui/package.json b/packages/gatsby-plugin-theme-ui/package.json index 93649208a..d1b921ee3 100644 --- a/packages/gatsby-plugin-theme-ui/package.json +++ b/packages/gatsby-plugin-theme-ui/package.json @@ -1,6 +1,6 @@ { "name": "gatsby-plugin-theme-ui", - "version": "0.15.4", + "version": "0.15.5-develop.2", "main": "dist/gatsby-plugin-theme-ui.cjs.js", "author": "Brent Jackson", "license": "MIT", diff --git a/packages/gatsby-theme-style-guide/package.json b/packages/gatsby-theme-style-guide/package.json index 51d64d498..c80c4ada0 100644 --- a/packages/gatsby-theme-style-guide/package.json +++ b/packages/gatsby-theme-style-guide/package.json @@ -1,6 +1,6 @@ { "name": "gatsby-theme-style-guide", - "version": "0.15.4", + "version": "0.15.5-develop.2", "main": "dist/gatsby-theme-style-guide.cjs.js", "license": "MIT", "repository": "system-ui/theme-ui", diff --git a/packages/gatsby-theme-ui-layout/package.json b/packages/gatsby-theme-ui-layout/package.json index fa046be71..2027f0205 100644 --- a/packages/gatsby-theme-ui-layout/package.json +++ b/packages/gatsby-theme-ui-layout/package.json @@ -1,6 +1,6 @@ { "name": "gatsby-theme-ui-layout", - "version": "0.15.4", + "version": "0.15.5-develop.2", "main": "dist/gatsby-theme-ui-layout.cjs.js", "repository": "system-ui/theme-ui", "peerDependencies": { diff --git a/packages/global/README.md b/packages/global/README.md new file mode 100644 index 000000000..c1c8f0af2 --- /dev/null +++ b/packages/global/README.md @@ -0,0 +1,27 @@ +# @theme-ui/global + +Wrapper around the Emotion `Global` component, made Theme UI theme-aware. + +**Note:** _This package is included in the main `theme-ui` package and a +separate installation is not required unless you’re using `@theme-ui/core`._ + +```sh +npm i @theme-ui/global @theme-ui/core @emotion/react +``` + +```jsx +import Global from '@theme-ui/global' + +export default (props) => ( + <Global + styles={{ + button: { + m: 0, + bg: 'primary', + color: 'background', + border: 0, + }, + }} + /> +) +``` diff --git a/packages/global/package.json b/packages/global/package.json new file mode 100644 index 000000000..f7532cf0a --- /dev/null +++ b/packages/global/package.json @@ -0,0 +1,27 @@ +{ + "name": "@theme-ui/global", + "version": "0.15.5-develop.2", + "repository": "system-ui/theme-ui", + "main": "dist/theme-ui-global.cjs.js", + "module": "dist/theme-ui-global.esm.js", + "source": "src/index.tsx", + "author": "Lachlan Campbell", + "license": "MIT", + "sideEffects": false, + "publishConfig": { + "access": "public" + }, + "dependencies": { + "@theme-ui/core": "workspace:^", + "@theme-ui/css": "workspace:^" + }, + "peerDependencies": { + "@emotion/react": "^11", + "react": ">=18" + }, + "devDependencies": { + "@babel/core": "^7.0.0", + "@types/react": "^18", + "@theme-ui/test-utils": "workspace:^" + } +} diff --git a/packages/global/src/index.tsx b/packages/global/src/index.tsx new file mode 100644 index 000000000..c0d91da5b --- /dev/null +++ b/packages/global/src/index.tsx @@ -0,0 +1,16 @@ +import { jsx, type ThemeUIStyleObject } from '@theme-ui/core' +import { css, type Theme } from '@theme-ui/css' +import { Global as EmotionGlobal } from '@emotion/react' + +export interface GlobalProps { + styles: ThemeUIStyleObject +} +const Global = ({ styles }: GlobalProps): JSX.Element => + jsx(EmotionGlobal, { + styles: (emotionTheme: unknown) => { + const theme = emotionTheme as Theme + return css(styles)(theme) + }, + }) + +export default Global diff --git a/packages/global/test/__snapshots__/index.tsx.snap b/packages/global/test/__snapshots__/index.tsx.snap new file mode 100644 index 000000000..15fe640dd --- /dev/null +++ b/packages/global/test/__snapshots__/index.tsx.snap @@ -0,0 +1,77 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`renders global and component styles 1`] = ` +.emotion-0 { + color: pink; +} + +<html> + <head> + <style + data-emotion="css" + data-s="" + > + + .css-2cx43c{} + </style> + <style + data-emotion="css" + data-s="" + > + + .css-2cx43c html{background-color:hotpink;} + </style> + <style + data-emotion="css" + data-s="" + > + + .emotion-0{color:pink;} + </style> + </head> + <body> + <div> + <header> + <div + class="emotion-0" + /> + </header> + </div> + </body> +</html> +`; + +exports[`renders global styles 1`] = ` +<html> + <head> + <style + data-emotion="css-global" + data-s="" + > + + @font-face{font-family:some-name;} + </style> + <style + data-emotion="css-global" + data-s="" + > + + body{font-family:Georgia,serif;margin:0;} + </style> + <style + data-emotion="css-global" + data-s="" + > + + h1{color:salmon;} + </style> + </head> + <body> + <div> + <h1> + Hello + </h1> + </div> + </body> +</html> +`; diff --git a/packages/global/test/index.tsx b/packages/global/test/index.tsx new file mode 100644 index 000000000..0dedc22a7 --- /dev/null +++ b/packages/global/test/index.tsx @@ -0,0 +1,82 @@ +/** + * @jest-environment jsdom + * @jsx jsx + */ + +import { jsx } from '@theme-ui/core' +import { cleanup } from '@testing-library/react' +import { render } from '@theme-ui/test-utils' +import { matchers } from '@emotion/jest' + +import { ThemeProvider } from '@theme-ui/core' +import Global from '../src' + +expect.extend(matchers) + +beforeEach(() => { + document.head.innerHTML = '' + jest.resetAllMocks() +}) + +afterEach(cleanup) + +test.only('renders global styles', async () => { + const root = ( + <ThemeProvider + theme={{ + config: { + useRootStyles: false, + }, + fonts: { + body: 'Georgia,serif', + }, + colors: { + primary: 'salmon', + }, + }} + > + <Global + styles={{ + '@font-face': { + fontFamily: 'some-name', + }, + body: { + fontFamily: 'body', + margin: 0, + }, + h1: { + color: 'primary', + }, + }} + /> + <h1>Hello</h1> + </ThemeProvider> + ) + + const document = render(root) + expect(document.baseElement.parentElement).toMatchSnapshot() + + const bodyStyle = global.getComputedStyle(document.baseElement) + expect(bodyStyle.fontFamily).toBe('Georgia,serif') + expect(bodyStyle.margin).toBe('0px') + + const h1 = document.baseElement.querySelector('h1')! + expect(global.getComputedStyle(h1).color).toBe('salmon') +}) + +test('renders global and component styles', () => { + const root = ( + <header> + <Global + styles={{ + html: { + backgroundColor: 'hotpink', + }, + }} + /> + <div sx={{ color: 'pink' }} /> + </header> + ) + const { baseElement } = render(root) + expect(baseElement.parentElement).toMatchSnapshot() +}) diff --git a/packages/match-media/package.json b/packages/match-media/package.json index 2aafc5861..ad38e587d 100644 --- a/packages/match-media/package.json +++ b/packages/match-media/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/match-media", - "version": "0.15.4", + "version": "0.15.5-develop.2", "description": "React hooks for theme-ui breakpoints", "source": "src/index.ts", "main": "dist/theme-ui-match-media.cjs.js", diff --git a/packages/mdx/package.json b/packages/mdx/package.json index 8850d16e8..53aa87192 100644 --- a/packages/mdx/package.json +++ b/packages/mdx/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/mdx", - "version": "0.15.4", + "version": "0.15.5-develop.2", "source": "src/index.ts", "main": "dist/theme-ui-mdx.cjs.js", "module": "dist/theme-ui-mdx.esm.js", diff --git a/packages/preset-base/package.json b/packages/preset-base/package.json index be2eeec53..eb292a0f1 100644 --- a/packages/preset-base/package.json +++ b/packages/preset-base/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/preset-base", - "version": "0.15.4", + "version": "0.15.5-develop.2", "main": "dist/theme-ui-preset-base.cjs.js", "module": "dist/theme-ui-preset-base.esm.js", "author": "Brent Jackson", diff --git a/packages/preset-bootstrap/package.json b/packages/preset-bootstrap/package.json index a64756dd5..638b4eee2 100644 --- a/packages/preset-bootstrap/package.json +++ b/packages/preset-bootstrap/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/preset-bootstrap", - "version": "0.15.4", + "version": "0.15.5-develop.2", "main": "dist/theme-ui-preset-bootstrap.cjs.js", "module": "dist/theme-ui-preset-bootstrap.esm.js", "types": "dist/theme-ui-preset-bootstrap.cjs.d.ts", diff --git a/packages/preset-bulma/package.json b/packages/preset-bulma/package.json index 2ececc32b..78d29bfc4 100644 --- a/packages/preset-bulma/package.json +++ b/packages/preset-bulma/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/preset-bulma", - "version": "0.15.4", + "version": "0.15.5-develop.2", "main": "dist/theme-ui-preset-bulma.cjs.js", "module": "dist/theme-ui-preset-bulma.esm.js", "source": "src/index.ts", diff --git a/packages/preset-dark/package.json b/packages/preset-dark/package.json index 1e0e6a711..279691c65 100644 --- a/packages/preset-dark/package.json +++ b/packages/preset-dark/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/preset-dark", - "version": "0.15.4", + "version": "0.15.5-develop.2", "main": "dist/theme-ui-preset-dark.cjs.js", "module": "dist/theme-ui-preset-dark.esm.js", "types": "dist/theme-ui-preset-dark.cjs.d.ts", diff --git a/packages/preset-deep/package.json b/packages/preset-deep/package.json index c6ac04032..f94dd8b4a 100644 --- a/packages/preset-deep/package.json +++ b/packages/preset-deep/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/preset-deep", - "version": "0.15.4", + "version": "0.15.5-develop.2", "main": "dist/theme-ui-preset-deep.cjs.js", "module": "dist/theme-ui-preset-deep.esm.js", "source": "src/index.ts", diff --git a/packages/preset-funk/package.json b/packages/preset-funk/package.json index d35d23d82..fa98d7546 100644 --- a/packages/preset-funk/package.json +++ b/packages/preset-funk/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/preset-funk", - "version": "0.15.4", + "version": "0.15.5-develop.2", "main": "dist/theme-ui-preset-funk.cjs.js", "module": "dist/theme-ui-preset-funk.esm.js", "source": "src/index.ts", diff --git a/packages/preset-future/package.json b/packages/preset-future/package.json index 468e7cd7d..f2a421945 100644 --- a/packages/preset-future/package.json +++ b/packages/preset-future/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/preset-future", - "version": "0.15.4", + "version": "0.15.5-develop.2", "main": "dist/theme-ui-preset-future.cjs.js", "module": "dist/theme-ui-preset-future.esm.js", "source": "src/index.ts", diff --git a/packages/preset-polaris/package.json b/packages/preset-polaris/package.json index b7bafea5e..ef4ae54a4 100644 --- a/packages/preset-polaris/package.json +++ b/packages/preset-polaris/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/preset-polaris", - "version": "0.15.4", + "version": "0.15.5-develop.2", "main": "dist/theme-ui-preset-polaris.cjs.js", "module": "dist/theme-ui-preset-polaris.esm.js", "source": "src/index.ts", diff --git a/packages/preset-roboto/package.json b/packages/preset-roboto/package.json index 9136b9348..e83fbfde0 100644 --- a/packages/preset-roboto/package.json +++ b/packages/preset-roboto/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/preset-roboto", - "version": "0.15.4", + "version": "0.15.5-develop.2", "main": "dist/theme-ui-preset-roboto.cjs.js", "module": "dist/theme-ui-preset-roboto.esm.js", "types": "dist/theme-ui-preset-roboto.cjs.d.ts", diff --git a/packages/preset-sketchy/package.json b/packages/preset-sketchy/package.json index e3e16f30c..69b064314 100644 --- a/packages/preset-sketchy/package.json +++ b/packages/preset-sketchy/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/preset-sketchy", - "version": "0.15.4", + "version": "0.15.5-develop.2", "main": "dist/theme-ui-preset-sketchy.cjs.js", "module": "dist/theme-ui-preset-sketchy.esm.js", "types": "dist/theme-ui-preset-sketchy.cjs.d.ts", diff --git a/packages/preset-swiss/package.json b/packages/preset-swiss/package.json index 2791ea86e..708ef412d 100644 --- a/packages/preset-swiss/package.json +++ b/packages/preset-swiss/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/preset-swiss", - "version": "0.15.4", + "version": "0.15.5-develop.2", "main": "dist/theme-ui-preset-swiss.cjs.js", "module": "dist/theme-ui-preset-swiss.esm.js", "types": "dist/theme-ui-preset-swiss.cjs.d.ts", diff --git a/packages/preset-system/package.json b/packages/preset-system/package.json index 1e1a070da..1fd6173fb 100644 --- a/packages/preset-system/package.json +++ b/packages/preset-system/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/preset-system", - "version": "0.15.4", + "version": "0.15.5-develop.2", "main": "dist/theme-ui-preset-system.cjs.js", "module": "dist/theme-ui-preset-system.esm.js", "types": "dist/theme-ui-preset-system.cjs.d.ts", diff --git a/packages/preset-tailwind/package.json b/packages/preset-tailwind/package.json index 8651cb185..460e05613 100644 --- a/packages/preset-tailwind/package.json +++ b/packages/preset-tailwind/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/preset-tailwind", - "version": "0.15.4", + "version": "0.15.5-develop.2", "main": "dist/theme-ui-preset-tailwind.cjs.js", "module": "dist/theme-ui-preset-tailwind.esm.js", "types": "dist/theme-ui-preset-tailwind.cjs.d.ts", diff --git a/packages/preset-tosh/package.json b/packages/preset-tosh/package.json index 425f7f717..c003f3926 100644 --- a/packages/preset-tosh/package.json +++ b/packages/preset-tosh/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/preset-tosh", - "version": "0.15.4", + "version": "0.15.5-develop.2", "main": "dist/theme-ui-preset-tosh.cjs.js", "module": "dist/theme-ui-preset-tosh.esm.js", "types": "dist/theme-ui-preset-tosh.cjs.d.ts", diff --git a/packages/presets/package.json b/packages/presets/package.json index 021666f04..f58364856 100644 --- a/packages/presets/package.json +++ b/packages/presets/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/presets", - "version": "0.15.4", + "version": "0.15.5-develop.2", "main": "dist/theme-ui-presets.cjs.js", "module": "dist/theme-ui-presets.esm.js", "types": "dist/theme-ui-presets.cjs.d.ts", diff --git a/packages/prism/package.json b/packages/prism/package.json index f73d5cc47..57d350a97 100644 --- a/packages/prism/package.json +++ b/packages/prism/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/prism", - "version": "0.15.4", + "version": "0.15.5-develop.2", "main": "dist/theme-ui-prism.cjs.js", "module": "dist/theme-ui-prism.esm.js", "types": "dist/theme-ui-prism.cjs.d.ts", diff --git a/packages/sidenav/package.json b/packages/sidenav/package.json index 69d853dc6..c9010bd58 100644 --- a/packages/sidenav/package.json +++ b/packages/sidenav/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/sidenav", - "version": "0.15.4", + "version": "0.15.5-develop.2", "main": "dist/theme-ui-sidenav.cjs.js", "module": "dist/theme-ui-sidenav.esm.js", "types": "dist/theme-ui-sidenav.cjs.d.ts", diff --git a/packages/sidenav/src/index.tsx b/packages/sidenav/src/index.tsx index d5be456bb..8bf496b66 100644 --- a/packages/sidenav/src/index.tsx +++ b/packages/sidenav/src/index.tsx @@ -1,5 +1,5 @@ /** @jsx jsx */ -import { jsx, ThemeProvider, Theme, ThemeStyles } from 'theme-ui' +import { jsx, ThemeProvider, Theme, ThemeStyles, Global } from 'theme-ui' import { MDXProvider, MDXProviderComponents } from '@mdx-js/react' import React, { useState, @@ -11,7 +11,6 @@ import React, { ReactComponentElement, ReactElement, } from 'react' -import { Global } from '@emotion/react' import merge from 'deepmerge' const createNestedLinks = ( diff --git a/packages/style-guide/package.json b/packages/style-guide/package.json index b3d771591..7eaa032c5 100644 --- a/packages/style-guide/package.json +++ b/packages/style-guide/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/style-guide", - "version": "0.15.4", + "version": "0.15.5-develop.2", "main": "dist/theme-ui-style-guide.cjs.js", "module": "dist/theme-ui-style-guide.esm.js", "types": "dist/theme-ui-style-guide.cjs.d.ts", diff --git a/packages/tachyons/package.json b/packages/tachyons/package.json index 00e22bdc6..ef6a5f55c 100644 --- a/packages/tachyons/package.json +++ b/packages/tachyons/package.json @@ -1,7 +1,7 @@ { "name": "@theme-ui/tachyons", "description": "⚠ DEPRECATED: Generate static CSS for use outside of React with Theme UI and Tachyons", - "version": "0.15.4", + "version": "0.15.5-develop.2", "private": true, "main": "dist/theme-ui-tachyons.cjs.js", "module": "dist/theme-ui-tachyons.esm.js", diff --git a/packages/tailwind/package.json b/packages/tailwind/package.json index a43797251..fc68e213a 100644 --- a/packages/tailwind/package.json +++ b/packages/tailwind/package.json @@ -1,7 +1,7 @@ { "name": "@theme-ui/tailwind", "description": "Generate static CSS for use outside of React with Theme UI and Tailwind.css", - "version": "0.15.4", + "version": "0.15.5-develop.2", "main": "dist/theme-ui-tailwind.cjs.js", "module": "dist/theme-ui-tailwind.esm.js", "source": "src/index.ts", diff --git a/packages/test-utils/package.json b/packages/test-utils/package.json index 65eaf7fcd..157972209 100644 --- a/packages/test-utils/package.json +++ b/packages/test-utils/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/test-utils", - "version": "0.15.4", + "version": "0.15.5-develop.2", "private": true, "license": "MIT", "repository": "system-ui/theme-ui", diff --git a/packages/theme-provider/package.json b/packages/theme-provider/package.json index 9d8db6a23..fb96c8d1c 100644 --- a/packages/theme-provider/package.json +++ b/packages/theme-provider/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/theme-provider", - "version": "0.15.4", + "version": "0.15.5-develop.2", "repository": "system-ui/theme-ui", "main": "dist/theme-ui-theme-provider.cjs.js", "module": "dist/theme-ui-theme-provider.esm.js", diff --git a/packages/theme-ui/package.json b/packages/theme-ui/package.json index 981a835e0..e1397ab5b 100644 --- a/packages/theme-ui/package.json +++ b/packages/theme-ui/package.json @@ -1,6 +1,6 @@ { "name": "theme-ui", - "version": "0.15.4", + "version": "0.15.5-develop.2", "description": "The Design Graph Framework", "source": "src/index.ts", "main": "dist/theme-ui.cjs.js", @@ -16,6 +16,7 @@ "@theme-ui/components": "workspace:^", "@theme-ui/core": "workspace:^", "@theme-ui/css": "workspace:^", + "@theme-ui/global": "workspace:^", "@theme-ui/theme-provider": "workspace:^" }, "peerDependencies": { diff --git a/packages/theme-ui/src/index.ts b/packages/theme-ui/src/index.ts index 44bdd5af5..5fb68470f 100644 --- a/packages/theme-ui/src/index.ts +++ b/packages/theme-ui/src/index.ts @@ -29,6 +29,7 @@ export type { } from '@theme-ui/core' export { useColorMode, InitializeColorMode } from '@theme-ui/color-modes' export { ThemeProvider } from '@theme-ui/theme-provider' +export { default as Global } from '@theme-ui/global' export * from '@theme-ui/components' export { css, get } from '@theme-ui/css' diff --git a/packages/typography/package.json b/packages/typography/package.json index 0747e8f7c..d19cd4aeb 100644 --- a/packages/typography/package.json +++ b/packages/typography/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/typography", - "version": "0.15.4", + "version": "0.15.5-develop.2", "main": "dist/theme-ui-typography.cjs.js", "module": "dist/theme-ui-typography.esm.js", "source": "src/index.ts", diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 7b1901aa1..5de5a5132 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -138,8 +138,8 @@ importers: '@mdx-js/react': 2.1.3_react@18.2.0 '@theme-ui/mdx': link:../../packages/mdx gatsby: 4.21.1_ygwdrcfl3m6rdu4ibcq7rpa2au - gatsby-plugin-mdx: 4.0.0_ve3aao32jeear4r54inaytsdlm - gatsby-source-filesystem: 5.0.0_gatsby@4.21.1 + gatsby-plugin-mdx: 4.0.0_p463e5ujixl6uoianntvxnxv6u + gatsby-source-filesystem: 5.4.0_gatsby@4.21.1 react: 18.2.0 react-dom: 18.2.0_react@18.2.0 theme-ui: link:../../packages/theme-ui @@ -182,6 +182,7 @@ importers: '@mdx-js/loader': ^2.1.2 '@mdx-js/react': ^2.1.2 '@next/mdx': ^12.0.7 + '@theme-ui/css': workspace:^ '@types/react': ^18.0.8 next: ^12.1.0 react: ^18 @@ -194,6 +195,7 @@ importers: '@mdx-js/loader': 2.1.3_webpack@4.46.0 '@mdx-js/react': 2.1.3_react@18.2.0 '@next/mdx': 12.2.5_hbo3tj2k5fhsh63l2ltjrymaq4 + '@theme-ui/css': link:../../packages/css next: 12.2.5_rlaikcoslzwwtqyk7brpdzej5y react: 18.2.0 react-dom: 18.2.0_react@18.2.0 @@ -390,6 +392,7 @@ importers: '@theme-ui/components': workspace:^ '@theme-ui/core': workspace:^ '@theme-ui/css': workspace:^ + '@theme-ui/global': workspace:^ '@theme-ui/match-media': workspace:^ '@theme-ui/mdx': workspace:^ '@theme-ui/presets': workspace:^ @@ -470,6 +473,7 @@ importers: '@theme-ui/components': link:../components '@theme-ui/core': link:../core '@theme-ui/css': link:../css + '@theme-ui/global': link:../global '@theme-ui/match-media': link:../match-media '@theme-ui/mdx': link:../mdx '@theme-ui/presets': link:../presets @@ -628,6 +632,25 @@ importers: babel-eslint: 10.1.0_eslint@8.23.0 typescript: 4.8.2 + packages/global: + specifiers: + '@babel/core': ^7.0.0 + '@emotion/react': ^11 + '@theme-ui/core': workspace:^ + '@theme-ui/css': workspace:^ + '@theme-ui/test-utils': workspace:^ + '@types/react': ^18.0.8 + react: '>=18 || 18' + dependencies: + '@emotion/react': 11.10.0_tu23i5xxn6kbev62oblybgbdem + '@theme-ui/core': link:../core + '@theme-ui/css': link:../css + react: 18.2.0 + devDependencies: + '@babel/core': 7.18.13 + '@theme-ui/test-utils': link:../test-utils + '@types/react': 18.0.17 + packages/match-media: specifiers: '@theme-ui/core': workspace:^ @@ -942,6 +965,7 @@ importers: '@theme-ui/components': workspace:^ '@theme-ui/core': workspace:^ '@theme-ui/css': workspace:^ + '@theme-ui/global': workspace:^ '@theme-ui/test-utils': workspace:^ '@theme-ui/theme-provider': workspace:^ '@types/react': ^18.0.8 @@ -952,6 +976,7 @@ importers: '@theme-ui/components': link:../components '@theme-ui/core': link:../core '@theme-ui/css': link:../css + '@theme-ui/global': link:../global '@theme-ui/theme-provider': link:../theme-provider devDependencies: '@theme-ui/test-utils': link:../test-utils @@ -1078,7 +1103,7 @@ packages: '@babel/core': 7.18.13 '@babel/generator': 7.18.13 '@babel/parser': 7.18.13 - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 '@babel/traverse': 7.18.13 '@babel/types': 7.18.13 babel-preset-fbjs: 3.4.0_@babel+core@7.18.13 @@ -2639,7 +2664,7 @@ packages: engines: {node: '>=6.9.0'} dependencies: core-js-pure: 3.25.0 - regenerator-runtime: 0.13.9 + regenerator-runtime: 0.13.11 /@babel/runtime/7.18.9: resolution: {integrity: sha512-lkqXDcvlFT5rvEjiu6+QYO+1GXrEHRo2LOtS7E4GtX5ESIZOgepqsZBVIj6Pv+a6zqsya9VCgiK1KAK4BvJDAw==} @@ -2647,6 +2672,12 @@ packages: dependencies: regenerator-runtime: 0.13.9 + /@babel/runtime/7.20.7: + resolution: {integrity: sha512-UF0tvkUtxwAgZ5W/KrkHf0Rn0fdnLDU9ScxBrEVNUprE/MzirjK4MJUX1/BVDv00Sv8cljtukVK1aky++X1SjQ==} + engines: {node: '>=6.9.0'} + dependencies: + regenerator-runtime: 0.13.11 + /@babel/template/7.18.10: resolution: {integrity: sha512-TI+rCtooWHr3QJ27kJxfjutghu44DLnasDMwpDqCXVTal9RLp3RSYNh4NdBrRP2cQAoG9A8juOQl6P6oZG4JxA==} engines: {node: '>=6.9.0'} @@ -2802,7 +2833,7 @@ packages: '@babel/core': 7.18.13 '@babel/helper-module-imports': 7.18.6 '@babel/plugin-syntax-jsx': 7.18.6_@babel+core@7.18.13 - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 '@emotion/hash': 0.9.0 '@emotion/memoize': 0.8.0 '@emotion/serialize': 1.1.0 @@ -2980,7 +3011,7 @@ packages: resolution: {integrity: sha512-Z5RuA+CuhVTb/xyZePxzFG5KhzDkRzs3e6sBz+WOZnTKGEleN8yxGpATjINL9V7suO9by7bKY3RdRv77qMP+rA==} engines: {node: '>=14.15.0', parcel: 2.x} dependencies: - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 '@parcel/namer-default': 2.6.2_@parcel+core@2.6.2 '@parcel/plugin': 2.6.2_@parcel+core@2.6.2 gatsby-core-utils: 3.24.0 @@ -4461,7 +4492,7 @@ packages: browserslist: 4.21.3 detect-libc: 1.0.3 nullthrows: 1.1.1 - regenerator-runtime: 0.13.9 + regenerator-runtime: 0.13.11 semver: 5.7.1 /@parcel/transformer-json/2.6.2_@parcel+core@2.6.2: @@ -5079,7 +5110,7 @@ packages: engines: {node: '>=12'} dependencies: '@babel/code-frame': 7.18.6 - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 '@types/aria-query': 4.2.2 aria-query: 5.0.2 chalk: 4.1.2 @@ -6294,7 +6325,7 @@ packages: engines: {node: '>=4'} hasBin: true dependencies: - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 async: 3.2.4 chalk: 4.1.2 didyoumean: 1.2.2 @@ -6433,7 +6464,7 @@ packages: resolution: {integrity: sha512-o/HelwhuKpTj/frsOsbNLNgnNGVIFsVP/SW2BSF14gVl7kAfMOJ6/8wUAUvG1R1NHKrfG+2sHZTu0yauT1qBrA==} engines: {node: '>=6.0'} dependencies: - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 '@babel/runtime-corejs3': 7.18.9 /aria-query/5.0.2: @@ -6821,7 +6852,7 @@ packages: resolution: {integrity: sha512-Cg7TFGpIr01vOQNODXOOaGz2NpCU5gl8x1qJFbb6hbZxR7XrcE2vtbAsTAbJ7/xwJtUuJEw8K8Zr/AE0LHlesg==} engines: {node: '>=10', npm: '>=6'} dependencies: - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 cosmiconfig: 7.0.1 resolve: 1.22.1 @@ -6866,7 +6897,7 @@ packages: gatsby: ^4.0.0-next || ^4 || ^5 dependencies: '@babel/core': 7.18.13 - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 '@babel/types': 7.18.13 gatsby: 4.21.1_ygwdrcfl3m6rdu4ibcq7rpa2au gatsby-core-utils: 3.24.0 @@ -6996,7 +7027,7 @@ packages: '@babel/preset-env': 7.18.10_@babel+core@7.18.13 '@babel/preset-react': 7.18.6_@babel+core@7.18.13 '@babel/preset-typescript': 7.18.6_@babel+core@7.18.13 - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 babel-plugin-macros: 3.1.0 babel-plugin-transform-react-remove-prop-types: 0.4.24 transitivePeerDependencies: @@ -8443,7 +8474,7 @@ packages: resolution: {integrity: sha512-fVkaAtlfNwitTyIZHLNzPoU+WfnXkDBMt6Gfh4E2mpocG5O3QS6hD10k1rVwTO+zzLON0BSi9OXHWy0PopMwmQ==} hasBin: true dependencies: - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 /create-hash/1.2.0: resolution: {integrity: sha512-z00bCGNHDG8mHAkP7CtT1qVu+bFQUPjYq/4Iv3C3kWjTFV10zIjfSoeqXo9Asws8gwSHDGj/hl2u4OGIjapeCg==} @@ -10124,7 +10155,7 @@ packages: peerDependencies: graphql: ^0.12.0 || ^0.13.0 || ^14.0.0 || ^15.0.0 dependencies: - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 graphql: 15.8.0 graphql-config: 3.4.1_bd4dqfuh23qh62sufat7weqjza lodash.flatten: 4.4.0 @@ -10256,7 +10287,7 @@ packages: peerDependencies: eslint: ^3 || ^4 || ^5 || ^6 || ^7 || ^8 || 8 dependencies: - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 aria-query: 4.2.2 array-includes: 3.1.5 ast-types-flow: 0.0.7 @@ -10278,7 +10309,7 @@ packages: peerDependencies: eslint: ^3 || ^4 || ^5 || ^6 || ^7 || ^8 || 8 dependencies: - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 aria-query: 4.2.2 array-includes: 3.1.5 ast-types-flow: 0.0.7 @@ -11346,7 +11377,7 @@ packages: '@babel/generator': 7.18.13 '@babel/helper-plugin-utils': 7.18.9 '@babel/preset-typescript': 7.18.6_@babel+core@7.18.13 - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 '@babel/template': 7.18.10 '@babel/types': 7.18.13 '@jridgewell/trace-mapping': 0.3.15 @@ -11407,7 +11438,7 @@ packages: resolution: {integrity: sha512-pCDa9EGU8niRJQVv7ow3ijzmG0PegZaBc5Yt6z4enc4m7Dl5ZT6Edkcw9p8q/FhGiZUkzQhWaRDxUvtaoPwAOQ==} engines: {node: '>=14.15.0'} dependencies: - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 ci-info: 2.0.0 configstore: 5.0.1 fastq: 1.13.0 @@ -11427,7 +11458,7 @@ packages: resolution: {integrity: sha512-P4tbcYOJ1DSYKRP4gIAR9Xta/d/AzjmsK2C6PzX7sNcGnviDKtAIoeV9sE0kNXOqBfUCez25zmAi2cq8NlaxKw==} engines: {node: '>=14.15.0'} dependencies: - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 ci-info: 2.0.0 configstore: 5.0.1 fastq: 1.13.0 @@ -11443,11 +11474,11 @@ packages: tmp: 0.2.1 xdg-basedir: 4.0.0 - /gatsby-core-utils/4.0.0: - resolution: {integrity: sha512-ucrEUfVWVUMTEfqZO4o9XHZgVg2airwm2WJSSFUroIAZ2/7YjEiKtZV3RDO1iEqB1beNjrSLa+eZ1LJhbvsHDQ==} + /gatsby-core-utils/4.4.0: + resolution: {integrity: sha512-/ibilcGENKH6qqkcT17SIZgc2kjZn3HiGpD+ixbXYkMGqHiM5pj9XIHjy3DfvZvDt2ujkYV5EinmUdqx7CI81w==} engines: {node: '>=18.0.0'} dependencies: - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 ci-info: 2.0.0 configstore: 5.0.1 fastq: 1.13.0 @@ -11468,12 +11499,12 @@ packages: resolution: {integrity: sha512-aFHIH7HDb6uozq0uWI+Xn4k7KaWbd1NkKo88q9rhigKfcUpEkux8UV6n5x9QMz/AUOg430pDC6/33h7f0OGX9Q==} engines: {node: '>=14.15.0'} dependencies: - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 /gatsby-legacy-polyfills/2.21.0: resolution: {integrity: sha512-GUvL4M4JabC59N1B9PmXGHXmVESliKEqqIjqb96yOG5aA3xgt/uDGt2bKhUmjFfkJ20fyTYUu49absLuUXzaxg==} dependencies: - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 core-js-compat: 3.9.0 /gatsby-link/4.21.0_jrmehtgkntpgvrzvp7eiismjfa: @@ -11495,7 +11526,7 @@ packages: resolution: {integrity: sha512-Oxw2Kq0xkjKLeBVPav5Vw+XHEorn/0koy3TSyCOxH3XedrV7Y6Xk1K8IbHqDbguNiK+wxRaKnMl0eyVwxUVC7Q==} engines: {node: '>=14.15.0'} dependencies: - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 bluebird: 3.7.2 chokidar: 3.5.3 fs-exists-cached: 1.0.0 @@ -11697,7 +11728,7 @@ packages: - supports-color dev: false - /gatsby-plugin-mdx/4.0.0_ve3aao32jeear4r54inaytsdlm: + /gatsby-plugin-mdx/4.0.0_p463e5ujixl6uoianntvxnxv6u: resolution: {integrity: sha512-/n9ys4/n6cNZaQ/JmTukv3SuWorpbDCPnfilBlH/ZwmGrb7DIOnzk0Q1wSYaBXopZir8FAwq6JRTT1uCzfAxTQ==} peerDependencies: '@mdx-js/react': ^2.0.0 @@ -11717,7 +11748,7 @@ packages: gatsby: 4.21.1_ygwdrcfl3m6rdu4ibcq7rpa2au gatsby-core-utils: 3.21.0 gatsby-plugin-utils: 3.15.0_fnjxbvnvq6hi5rysf65llm6zjq - gatsby-source-filesystem: 5.0.0_gatsby@4.21.1 + gatsby-source-filesystem: 5.4.0_gatsby@4.21.1 gray-matter: 4.0.3 mdast-util-mdx: 2.0.0 mdast-util-to-hast: 10.2.0 @@ -11740,7 +11771,7 @@ packages: peerDependencies: gatsby: ^4.0.0-next || ^4 || ^5 dependencies: - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 '@babel/traverse': 7.18.13 '@sindresorhus/slugify': 1.1.2 chokidar: 3.5.3 @@ -11791,7 +11822,7 @@ packages: '@babel/plugin-proposal-numeric-separator': 7.18.6_@babel+core@7.18.13 '@babel/plugin-proposal-optional-chaining': 7.18.9_@babel+core@7.18.13 '@babel/preset-typescript': 7.18.6_@babel+core@7.18.13 - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 babel-plugin-remove-graphql-queries: 4.21.0_qnprua7uctaly7jm4ovouj4biu gatsby: 4.21.1_ygwdrcfl3m6rdu4ibcq7rpa2au transitivePeerDependencies: @@ -11804,7 +11835,7 @@ packages: gatsby: ^4.0.0-next || ^4 || ^5 graphql: ^15.0.0 dependencies: - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 '@gatsbyjs/potrace': 2.3.0 fastq: 1.13.0 fs-extra: 10.1.0 @@ -11827,7 +11858,7 @@ packages: react: ^16.9.0 || ^17.0.0 || ^18.0.0 || 18 react-dom: ^16.9.0 || ^17.0.0 || ^18.0.0 dependencies: - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 '@gatsbyjs/reach-router': 1.3.9_biqbaboplfbrettd7655fr4n2y prop-types: 15.8.1 react: 18.2.0 @@ -11886,23 +11917,23 @@ packages: xstate: 4.32.1 dev: false - /gatsby-source-filesystem/5.0.0_gatsby@4.21.1: - resolution: {integrity: sha512-GBHqJ+NXQhru83DFssgJQkgqM2h1ZALb0+4+TXvRUPQWIK9UyZ1Yb4nXAC6EWi+vx2m/B1W+mZH77WTNdh32Bw==} + /gatsby-source-filesystem/5.4.0_gatsby@4.21.1: + resolution: {integrity: sha512-vYJM5mJu3vJAo9x5i1k+teBNHi2Fn9aPIrF2zgzqMz6x3iAaila0rD3hMLhNBCzo+GosCnkkQW9g/Tk4OcR0gg==} engines: {node: '>=18.0.0'} peerDependencies: gatsby: ^5.0.0-next || ^4 || ^5 dependencies: - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 chokidar: 3.5.3 file-type: 16.5.4 fs-extra: 10.1.0 gatsby: 4.21.1_ygwdrcfl3m6rdu4ibcq7rpa2au - gatsby-core-utils: 4.0.0 + gatsby-core-utils: 4.4.0 md5-file: 5.0.0 mime: 2.6.0 pretty-bytes: 5.6.0 valid-url: 1.0.9 - xstate: 4.32.1 + xstate: 4.35.2 dev: false /gatsby-telemetry/3.21.0: @@ -11911,7 +11942,7 @@ packages: requiresBuild: true dependencies: '@babel/code-frame': 7.18.6 - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 '@turist/fetch': 7.2.0_node-fetch@2.6.7 '@turist/time': 0.0.2 async-retry-ng: 2.0.1 @@ -11931,7 +11962,7 @@ packages: engines: {node: '>=14.15.0'} dependencies: '@babel/core': 7.18.13 - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 transitivePeerDependencies: - supports-color @@ -12023,7 +12054,7 @@ packages: fs-exists-cached: 1.0.0 fs-extra: 10.1.0 gatsby-cli: 4.21.0 - gatsby-core-utils: 3.24.0 + gatsby-core-utils: 3.21.0 gatsby-graphiql-explorer: 2.21.0 gatsby-legacy-polyfills: 2.21.0 gatsby-link: 4.21.0_jrmehtgkntpgvrzvp7eiismjfa @@ -14727,7 +14758,7 @@ packages: resolution: {integrity: sha512-9VINeH7NYVcdoNybe82oubnm9WqsJ0GsPppIqPQgxrjoUxwMq5ObCE8d+39CBBDnb/TPi9ymRCJ5twklYebdqQ==} engines: {node: '>=10'} dependencies: - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 chalk: 4.1.2 pegjs: 0.10.0 dev: true @@ -18755,7 +18786,7 @@ packages: /redux/4.1.2: resolution: {integrity: sha512-SH8PglcebESbd/shgf6mii6EIoRM0zrQyjcuQ+ojmfxjTtE0z9Y8pa62iA/OJ58qjP6j27uyW4kUF4jl/jd6sw==} dependencies: - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 /regenerate-unicode-properties/10.0.1: resolution: {integrity: sha512-vn5DU6yg6h8hP/2OkQo3K7uVILvY4iu0oI4t3HFa81UPkhGJwkRwM10JEc3upjdhHjs/k8GJY1sRBhk5sr69Bw==} @@ -18781,13 +18812,16 @@ packages: resolution: {integrity: sha512-MguG95oij0fC3QV3URf4V2SDYGJhJnJGqvIIgdECeODCT98wSWDAJ94SSuVpYQUoTcGUIL6L4yNB7j1DFFHSBg==} dev: true + /regenerator-runtime/0.13.11: + resolution: {integrity: sha512-kY1AZVr2Ra+t+piVaJ4gxaFaReZVH40AKNo7UCX6W+dEwBo/2oZJzqfuN1qLq1oL45o56cPaTXELwrTh8Fpggg==} + /regenerator-runtime/0.13.9: resolution: {integrity: sha512-p3VT+cOEgxFsRRA9X4lkI1E+k2/CtnKtU4gcxyaCUreilL/vqI6CdZ3wxVUx3UOUg+gnUOQQcRI7BmSI656MYA==} /regenerator-transform/0.15.0: resolution: {integrity: sha512-LsrGtPmbYg19bcPHwdtmXwbW+TqNvtY4riE3P83foeHRroMbH6/2ddFBfab3t7kbzc7v7p4wbkIecHImqt0QNg==} dependencies: - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 /regex-escape/3.4.10: resolution: {integrity: sha512-qEqf7uzW+iYcKNLMDFnMkghhQBnGdivT6KqVQyKsyjSWnoFyooXVnxrw9dtv3AFLnD6VBGXxtZGAQNFGFTnCqA==} @@ -18882,7 +18916,7 @@ packages: /relay-runtime/12.0.0: resolution: {integrity: sha512-QU6JKr1tMsry22DXNy9Whsq5rmvwr3LSZiiWV/9+DFpuTWvp+WFhobWMc8TC4OjKFfNhEZy7mOiqUAn5atQtug==} dependencies: - '@babel/runtime': 7.18.9 + '@babel/runtime': 7.20.7 fbjs: 3.0.4 invariant: 2.2.4 transitivePeerDependencies: @@ -22303,6 +22337,10 @@ packages: /xstate/4.32.1: resolution: {integrity: sha512-QYUd+3GkXZ8i6qdixnOn28bL3EvA++LONYL/EMWwKlFSh/hiLndJ8YTnz77FDs+JUXcwU7NZJg7qoezoRHc4GQ==} + /xstate/4.35.2: + resolution: {integrity: sha512-5X7EyJv5OHHtGQwN7DsmCAbSnDs3Mxl1cXQ4PVaLwi+7p/RRapERnd1dFyHjYin+KQoLLfuXpl1dPBThgyIGNg==} + dev: false + /xtend/4.0.2: resolution: {integrity: sha512-LKYU1iAXJXUgAXn9URjiu+MWhyUXHsvfp7mcuYm9dSUKK0/CjtrUwFAxD82/mCWbtLsGjFIad0wIsod4zrTAEQ==} engines: {node: '>=0.4'}