Merge branch 'develop' into stable

system-ui · Oct 24, 2024 · a4105e3 · a4105e3
2 parents 3076d30 + 401b794
commit a4105e3
Show file tree

Hide file tree

Showing 41 changed files with 52 additions and 160 deletions.
diff --git a/packages/color-modes/package.json b/packages/color-modes/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@theme-ui/color-modes",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "main": "dist/theme-ui-color-modes.cjs.js",
   "module": "dist/theme-ui-color-modes.esm.js",
   "types": "dist/theme-ui-color-modes.cjs.d.ts",

diff --git a/packages/color/package.json b/packages/color/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@theme-ui/color",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "source": "src/index.ts",
   "main": "dist/theme-ui-color.cjs.js",
   "module": "dist/theme-ui-color.esm.js",

diff --git a/packages/components/package.json b/packages/components/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@theme-ui/components",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "main": "dist/theme-ui-components.cjs.js",
   "module": "dist/theme-ui-components.esm.js",
   "types": "dist/theme-ui-components.cjs.d.ts",

diff --git a/packages/core/package.json b/packages/core/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@theme-ui/core",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "source": "src/index.ts",
   "main": "dist/theme-ui-core.cjs.js",
   "module": "dist/theme-ui-core.esm.js",

diff --git a/packages/css/package.json b/packages/css/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@theme-ui/css",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "source": "src/index.ts",
   "main": "dist/theme-ui-css.cjs.js",
   "module": "dist/theme-ui-css.esm.js",
@@ -35,7 +35,7 @@
     "access": "public"
   },
   "dependencies": {
-    "csstype": "3.0.10"
+    "csstype": "^3.0.10"
   },
   "peerDependencies": {
     "@emotion/react": "^11.11.1"

diff --git a/packages/css/test/errors-and-inference.ts b/packages/css/test/errors-and-inference.ts
@@ -7,42 +7,6 @@ const expectSnippet = expecter(`
 `)
 
 describe('Theme', () => {
-  test('shows friendly error only on bad property', () => {
-    expectSnippet(`
-      css({
-        bg: 'salmon',
-        whiteSpace: 'no-works',
-        '> form': {
-          color: 'blue',
-          widows: 'bar',
-          // unknown CSS property is accepted
-          whitePace: 'this-works',
-        },
-      })
-    `).toFail(
-      /Error snippet\.tsx \(\d+,\d+\): Type '"no-works"' is not assignable to type [\s\S]+'./
-    )
-  })
-
-  test('shows friendly error on nested object', () => {
-    expectSnippet(`
-      css({
-        bg: 'salmon',
-        '> form': {
-          color: 'blue',
-          whiteSpace: 'banana',
-        },
-      })
-    `).toFail(
-      new RegExp(
-        `Error snippet\\.tsx \\(\\d+,\\d+\\): Type '{ color: "blue"; whiteSpace: "banana"; }'` +
-          ` is not assignable to type '[\\s\\S]+'.\\n\\s+` +
-          `Types of property 'whiteSpace' are incompatible.\\n\\s+` +
-          `Type '"banana"' is not assignable to type [\\s\\S]+`
-      )
-    )
-  })
-
   test('accepts unknown CSS property without error', () => {
     expect(css({ '> form': { windows: 'baz' } })({})).toStrictEqual({
       '> form': { windows: 'baz' },
@@ -96,9 +60,6 @@ describe('Theme', () => {
     css({ size: (t) => get(t, 'space.3') + get(t, 'sizes.5') })
 
     const parse = (x: string | number | undefined | {}) => parseInt(String(x))
-    css({
-      size: (t) => parse(t.space?.[3]) + parse(t.sizes?.[5]),
-    })
 
     // Current limitation. If you broke this one, that's actually pretty awesome,
     // but TypeScript chapter in the docs needs an update.
@@ -110,30 +71,6 @@ describe('Theme', () => {
   })
 })
 
-// This is not a feature, but the TypeScript chapter in the docs will need an
-// update if this test fails.
-test('inferred type `string` is too wide for `whiteSpace`', () => {
-  expectSnippet(`
-    const style = {
-      whiteSpace: 'pre-line'
-    }
-
-    css(style);
-  `).toFail(
-    /Type '{ whiteSpace: string; }' is not assignable to type 'ThemeUICSSObject'./
-  )
-
-  expectSnippet(`
-    import { ThemeUICSSObject } from './packages/css'
-
-    const style: ThemeUICSSObject = {
-      whiteSpace: 'pre-line'
-    }
-
-    css(style);
-  `).toSucceed()
-})
-
 describe('ColorMode', () => {
   const expectedSnippet = expectSnippet(`
     import { ColorMode } from './packages/css/src'

diff --git a/packages/css/test/past-bugs.ts b/packages/css/test/past-bugs.ts
@@ -32,3 +32,10 @@ describe('theme scales, get and default object property (#1439)', () => {
     expect(actual).toStrictEqual({ zIndex: 1 })
   })
 })
+
+// https://github.com/system-ui/theme-ui/issues/2520
+it('accepts number as aspect ratio', () => {
+  const actual = css({ aspectRatio: 0.5 })({})
+
+  expect(actual).toStrictEqual({ aspectRatio: 0.5 })
+})
diff --git a/packages/custom-properties/package.json b/packages/custom-properties/package.json
@@ -1,7 +1,7 @@
 {
   "name": "@theme-ui/custom-properties",
   "description": "Generate CSS custom properties for use with Theme UI",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "source": "src/index.ts",
   "main": "dist/theme-ui-custom-properties.cjs.js",
   "module": "dist/theme-ui-custom-properties.esm.js",

diff --git a/packages/docs/package.json b/packages/docs/package.json
@@ -1,7 +1,7 @@
 {
   "private": true,
   "name": "docs",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "main": "dist/docs.cjs.js",
   "author": "Brent Jackson <[email protected]>",
   "license": "MIT",

diff --git a/packages/docs/src/pages/guides/typescript.mdx b/packages/docs/src/pages/guides/typescript.mdx
@@ -127,50 +127,3 @@ const syntaxHighlighting = theme.syntaxHighlighting
 
 _[Try it in TypeScript Playground.](https://www.typescriptlang.org/v2/en/play?#code/JYWwDg9gTgLgBAbzgFQBYFMTrgXzgMyghDgHIYMsBaAV2FIG4AoJ4AOxnSnwEMBjbAFkAngGVhHHgA8AEsADmqADYLUMdvLSZsCJnALR08ojTYATAFxwAzjCgbmOFmfR8lPKNhAQzNJdnJKdFp6RD04dk5ufmwtLDD9fWsJGGk5RRVFdTZ5KxFxSVlVTLUNOPRwpycmPgg2WzgKbStyuABeBJsUtOLVbNzO-XxDYwhTSzIAYgAmWdIAGkqmHGYauobkwvTlPo12xqCAOk3UoozdnLX6+C4iKH2mrGPhGDYe86yNJiA)_
 
-## Common Problems
-
-### Union types are not inferred without explicit annotation
-
-Style objects defined outside of `css` function and `sx` prop need explicit
-annotation to prevent following error.
-
-```tsx
-/** @jsxImportSource theme-ui */
-
-const style = { whiteSpace: 'pre-line' }
-
-// Type '{ whiteSpace: string; }' is not assignable to type 'ThemeUICSSObject'.
-// Type 'string' is not assignable to type '"inherit" | "initial" | "revert" | "unset" | "normal" | "break-spaces"
-return <div sx={style} />
-```
-
-_[Try it on CodeSandbox.](https://codesandbox.io/s/theme-ui-inferrence-too-wide-vkrf5?file=/src/index.tsx&view=editor&previewwindow=tests)_
-
-TypeScript assumes that `whiteSpace` here is a `string`, but the `whiteSpace`
-property in `ThemeUICSSObject` is a union of possible white-space values
-([see on MDN](https://developer.mozilla.org/en-US/docs/Web/CSS/white-space#Values))
-or a nested style object.
-
-We can explicitly annotate `style` ensure that it is a correct Theme UI style
-object and that `whiteSpace` is one of appropriate values.
-
-```tsx
-/** @jsxImportSource theme-ui */
-import { ThemeUICSSObject } from 'theme-ui'
-
-const style: ThemeUICSSObject = { whiteSpace: 'pre-line' }
-
-// No error
-return <div sx={style} />
-```
-
-_[Try it on CodeSandbox.](https://codesandbox.io/s/theme-ui-inferrence-too-wide-vkrf5?file=/src/index.tsx&view=editor&previewwindow=tests)_
-
-We could also fix our problem by narrowing the type of `style` with a
-[const assertion](https://www.typescriptlang.org/docs/handbook/release-notes/typescript-3-4.html#const-assertions).
-
-```tsx
-const style = { whiteSpace: 'pre-line' } as const
-```
-
-This is succinct, but error prone, because we won't get TS intellisense support inside of this object.
diff --git a/packages/e2e/package.json b/packages/e2e/package.json
@@ -1,7 +1,7 @@
 {
   "name": "e2e",
   "private": true,
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "description": "Cypress tests ran against Theme UI docs and examples",
   "scripts": {
     "open": "cypress open",

diff --git 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.17.0",
+  "version": "0.17.0-develop.1",
   "main": "dist/gatsby-plugin-theme-ui.cjs.js",
   "module": "dist/gatsby-plugin-theme-ui.esm.js",
   "browser": {

diff --git 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.17.0",
+  "version": "0.17.0-develop.1",
   "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
@@ -1,6 +1,6 @@
 {
   "name": "gatsby-theme-ui-layout",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "main": "dist/gatsby-theme-ui-layout.cjs.js",
   "repository": "system-ui/theme-ui",
   "peerDependencies": {

diff --git a/packages/global/package.json b/packages/global/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@theme-ui/global",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "repository": "system-ui/theme-ui",
   "main": "dist/theme-ui-global.cjs.js",
   "module": "dist/theme-ui-global.esm.js",

diff --git a/packages/match-media/package.json b/packages/match-media/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@theme-ui/match-media",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "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
@@ -1,6 +1,6 @@
 {
   "name": "@theme-ui/mdx",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "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
@@ -1,6 +1,6 @@
 {
   "name": "@theme-ui/preset-base",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "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
@@ -1,6 +1,6 @@
 {
   "name": "@theme-ui/preset-bootstrap",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "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
@@ -1,6 +1,6 @@
 {
   "name": "@theme-ui/preset-bulma",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "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
@@ -1,6 +1,6 @@
 {
   "name": "@theme-ui/preset-dark",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "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
@@ -1,6 +1,6 @@
 {
   "name": "@theme-ui/preset-deep",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "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
@@ -1,6 +1,6 @@
 {
   "name": "@theme-ui/preset-funk",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "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
@@ -1,6 +1,6 @@
 {
   "name": "@theme-ui/preset-future",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "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
@@ -1,6 +1,6 @@
 {
   "name": "@theme-ui/preset-polaris",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "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
@@ -1,6 +1,6 @@
 {
   "name": "@theme-ui/preset-roboto",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "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
@@ -1,6 +1,6 @@
 {
   "name": "@theme-ui/preset-sketchy",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "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
@@ -1,6 +1,6 @@
 {
   "name": "@theme-ui/preset-swiss",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "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
@@ -1,6 +1,6 @@
 {
   "name": "@theme-ui/preset-system",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "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
@@ -1,6 +1,6 @@
 {
   "name": "@theme-ui/preset-tailwind",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "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
@@ -1,6 +1,6 @@
 {
   "name": "@theme-ui/preset-tosh",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "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
@@ -1,6 +1,6 @@
 {
   "name": "@theme-ui/presets",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "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
@@ -1,6 +1,6 @@
 {
   "name": "@theme-ui/prism",
-  "version": "0.17.0",
+  "version": "0.17.0-develop.1",
   "main": "dist/theme-ui-prism.cjs.js",
   "module": "dist/theme-ui-prism.esm.js",
   "types": "dist/theme-ui-prism.cjs.d.ts",