From 28d1a879f97dcd4f006f8f11def83b157964e636 Mon Sep 17 00:00:00 2001 From: Piotr Monwid-Olechnowicz Date: Fri, 18 Oct 2024 17:06:30 +0000 Subject: [PATCH 1/2] Bump versions to: 0.17.0-develop.1 [skip ci] --- packages/color-modes/package.json | 2 +- packages/color/package.json | 2 +- packages/components/package.json | 2 +- packages/core/package.json | 2 +- packages/css/package.json | 2 +- packages/custom-properties/package.json | 2 +- packages/docs/package.json | 2 +- packages/e2e/package.json | 2 +- packages/gatsby-plugin-theme-ui/package.json | 2 +- packages/gatsby-theme-style-guide/package.json | 2 +- packages/gatsby-theme-ui-layout/package.json | 2 +- packages/global/package.json | 2 +- packages/match-media/package.json | 2 +- packages/mdx/package.json | 2 +- packages/preset-base/package.json | 2 +- packages/preset-bootstrap/package.json | 2 +- packages/preset-bulma/package.json | 2 +- packages/preset-dark/package.json | 2 +- packages/preset-deep/package.json | 2 +- packages/preset-funk/package.json | 2 +- packages/preset-future/package.json | 2 +- packages/preset-polaris/package.json | 2 +- packages/preset-roboto/package.json | 2 +- packages/preset-sketchy/package.json | 2 +- packages/preset-swiss/package.json | 2 +- packages/preset-system/package.json | 2 +- packages/preset-tailwind/package.json | 2 +- packages/preset-tosh/package.json | 2 +- packages/presets/package.json | 2 +- packages/prism/package.json | 2 +- packages/style-guide/package.json | 2 +- packages/tachyons/package.json | 2 +- packages/tailwind/package.json | 2 +- packages/test-utils/package.json | 2 +- packages/theme-provider/package.json | 2 +- packages/theme-ui/package.json | 2 +- packages/typography/package.json | 2 +- 37 files changed, 37 insertions(+), 37 deletions(-) diff --git a/packages/color-modes/package.json b/packages/color-modes/package.json index cf9deee4e..5f178d1c6 100644 --- 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-develop.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 index 87b9ffeb0..4bec2a99c 100644 --- a/packages/color/package.json +++ b/packages/color/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/color", - "version": "0.17.0-develop.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 index 296212374..b5284310d 100644 --- a/packages/components/package.json +++ b/packages/components/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/components", - "version": "0.17.0-develop.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 index 75d5fb098..a33476c61 100644 --- a/packages/core/package.json +++ b/packages/core/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/core", - "version": "0.17.0-develop.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 index 0f0f94b7f..4a3f5de63 100644 --- a/packages/css/package.json +++ b/packages/css/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/css", - "version": "0.17.0-develop.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", diff --git a/packages/custom-properties/package.json b/packages/custom-properties/package.json index 7488c3374..386152843 100644 --- 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-develop.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 index e9a875cea..afbc0a4eb 100644 --- a/packages/docs/package.json +++ b/packages/docs/package.json @@ -1,7 +1,7 @@ { "private": true, "name": "docs", - "version": "0.17.0-develop.0", + "version": "0.17.0-develop.1", "main": "dist/docs.cjs.js", "author": "Brent Jackson ", "license": "MIT", diff --git a/packages/e2e/package.json b/packages/e2e/package.json index c0e0a5f82..0c21e3ec2 100644 --- a/packages/e2e/package.json +++ b/packages/e2e/package.json @@ -1,7 +1,7 @@ { "name": "e2e", "private": true, - "version": "0.17.0-develop.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 index b4ff94b2d..ee36f3a7c 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.17.0-develop.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 index 0e87a9167..99fc084c0 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.17.0-develop.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 index 6071ced12..8078fa4d0 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.17.0-develop.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 index df94a1243..031869f31 100644 --- a/packages/global/package.json +++ b/packages/global/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/global", - "version": "0.17.0-develop.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 index 983d8d528..d70e542b8 100644 --- 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-develop.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 index c3390e81f..00d65ad90 100644 --- a/packages/mdx/package.json +++ b/packages/mdx/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/mdx", - "version": "0.17.0-develop.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 index b1527238a..2a0a4db0c 100644 --- 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-develop.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 index df2fecc5c..913f216a5 100644 --- 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-develop.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 index fc5b24c15..11aeb3e61 100644 --- 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-develop.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 index f3378796e..63554acb7 100644 --- 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-develop.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 index 38f6901cc..204852c0a 100644 --- 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-develop.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 index 31d382670..d95426484 100644 --- 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-develop.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 index 93a436987..7bc328578 100644 --- 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-develop.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 index 030bc7c24..0b4a1e9fa 100644 --- 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-develop.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 index fd92f0783..2e99b914f 100644 --- 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-develop.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 index 759ec75ad..59b7bbd5c 100644 --- 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-develop.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 index 74c977da5..5a7f90bb8 100644 --- 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-develop.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 index ca677038e..499a91e6c 100644 --- 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-develop.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 index 30fc5eb71..82b8d1c02 100644 --- 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-develop.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 index 5b1091f3e..67dc6a52c 100644 --- 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-develop.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 index 34066549e..c3c201a92 100644 --- a/packages/presets/package.json +++ b/packages/presets/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/presets", - "version": "0.17.0-develop.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 index 622135ad7..430d77c1c 100644 --- a/packages/prism/package.json +++ b/packages/prism/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/prism", - "version": "0.17.0-develop.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", diff --git a/packages/style-guide/package.json b/packages/style-guide/package.json index 57f05efac..e6f12a16b 100644 --- a/packages/style-guide/package.json +++ b/packages/style-guide/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/style-guide", - "version": "0.17.0-develop.0", + "version": "0.17.0-develop.1", "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 a3b89c6f7..ad12197ae 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.17.0-develop.0", + "version": "0.17.0-develop.1", "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 3847b02bd..669550519 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.17.0-develop.0", + "version": "0.17.0-develop.1", "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 750a7bb14..e9eb03616 100644 --- a/packages/test-utils/package.json +++ b/packages/test-utils/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/test-utils", - "version": "0.17.0-develop.0", + "version": "0.17.0-develop.1", "private": true, "license": "MIT", "repository": "system-ui/theme-ui", diff --git a/packages/theme-provider/package.json b/packages/theme-provider/package.json index 1d840a860..6a1eaa8a5 100644 --- a/packages/theme-provider/package.json +++ b/packages/theme-provider/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/theme-provider", - "version": "0.17.0-develop.0", + "version": "0.17.0-develop.1", "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 778c4cd37..43bd9d121 100644 --- a/packages/theme-ui/package.json +++ b/packages/theme-ui/package.json @@ -1,6 +1,6 @@ { "name": "theme-ui", - "version": "0.17.0-develop.0", + "version": "0.17.0-develop.1", "description": "The Design Graph Framework", "source": "src/index.ts", "main": "dist/theme-ui.cjs.js", diff --git a/packages/typography/package.json b/packages/typography/package.json index 12d020973..7cd4c0d0c 100644 --- a/packages/typography/package.json +++ b/packages/typography/package.json @@ -1,6 +1,6 @@ { "name": "@theme-ui/typography", - "version": "0.17.0-develop.0", + "version": "0.17.0-develop.1", "main": "dist/theme-ui-typography.cjs.js", "module": "dist/theme-ui-typography.esm.js", "source": "src/index.ts", From 401b7945a61aa5001e8abaaf1c56751c503d5d89 Mon Sep 17 00:00:00 2001 From: Piotr Monwid-Olechnowicz Date: Thu, 24 Oct 2024 12:50:49 +0200 Subject: [PATCH 2/2] fix(types): don't lock csstype version --- packages/css/package.json | 2 +- packages/css/test/errors-and-inference.ts | 63 ------------------- packages/css/test/past-bugs.ts | 7 +++ packages/docs/src/pages/guides/typescript.mdx | 47 -------------- packages/typography/package.json | 2 +- pnpm-lock.yaml | 17 ++--- 6 files changed, 15 insertions(+), 123 deletions(-) diff --git a/packages/css/package.json b/packages/css/package.json index 4a3f5de63..c2295536f 100644 --- a/packages/css/package.json +++ b/packages/css/package.json @@ -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 index 2fc453bc2..7d33a00d7 100644 --- 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 index dfed52e38..ada329b71 100644 --- 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/docs/src/pages/guides/typescript.mdx b/packages/docs/src/pages/guides/typescript.mdx index 468456b33..3cb19fb49 100644 --- 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
-``` - -_[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
-``` - -_[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/typography/package.json b/packages/typography/package.json index 7cd4c0d0c..8a1cbf81d 100644 --- a/packages/typography/package.json +++ b/packages/typography/package.json @@ -13,7 +13,7 @@ "@types/modularscale": "^2.0.0", "@types/typography": "^0.16.4", "compass-vertical-rhythm": "^1.4.5", - "csstype": "3.0.10", + "csstype": "^3.0.10", "modularscale": "^2.0.1", "type-fest": "^2.18.0" }, diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index adb6732bf..6cb32cebb 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -446,8 +446,8 @@ importers: packages/css: dependencies: csstype: - specifier: 3.0.10 - version: 3.0.10 + specifier: ^3.0.10 + version: 3.1.3 devDependencies: '@emotion/react': specifier: ^11.11.1 @@ -1280,8 +1280,8 @@ importers: specifier: ^1.4.5 version: 1.4.5 csstype: - specifier: 3.0.10 - version: 3.0.10 + specifier: ^3.0.10 + version: 3.1.3 modularscale: specifier: ^2.0.1 version: 2.0.1 @@ -5287,9 +5287,6 @@ packages: resolution: {integrity: sha512-AZL67abkUzIuvcHqk7c09cezpGNcxUxU4Ioi/05xHk4DQeTkWmGYftIE6ctU6AEt+Gn4n1lDStOtj7FKycP71A==} engines: {node: '>=8'} - csstype@3.0.10: - resolution: {integrity: sha512-2u44ZG2OcNUO9HDp/Jl8C07x6pU/eTR3ncV91SiK3dhG9TWvRVsCoJw14Ckx5DgWkzGA3waZWO3d7pgqpUI/XA==} - csstype@3.1.2: resolution: {integrity: sha512-I7K1Uu0MBPzaFKg4nI5Q7Vs2t+3gWWW648spaF+Rg7pI9ds18Ugn+lvg4SHczUdKlHI5LWBXyqfS8+DufyBsgQ==} @@ -13127,7 +13124,7 @@ snapshots: '@emotion/memoize': 0.9.0 '@emotion/unitless': 0.10.0 '@emotion/utils': 1.4.1 - csstype: 3.0.10 + csstype: 3.1.3 '@emotion/sheet@1.4.0': {} @@ -14939,7 +14936,7 @@ snapshots: dependencies: '@types/prop-types': 15.7.5 '@types/scheduler': 0.16.3 - csstype: 3.0.10 + csstype: 3.1.3 '@types/react@18.3.11': dependencies: @@ -17067,8 +17064,6 @@ snapshots: dependencies: cssom: 0.3.8 - csstype@3.0.10: {} - csstype@3.1.2: {} csstype@3.1.3: {}