Files
Segun Adebayo 7b6e66a15b build: refactor all components to single package (#8153)
* refactor: component setup

* refactor: component setup

* chore: refactor tests

* chore: cleanup

* refactor: get typecheck working

* chore: flatten package structure

* refactor: packages

* refactor: utilities and hooks

* refactor: prefer granular imports

* chore: get build working for packages

* chore: remove redundant cra templates

* refactor: move cli to packages

* chore: move all things to packages

* chore: ensure all builds work as expected

* chore: save progress

* chore: refactor more components

* chore: refactor more components

* chore: refactor more components

* chore: get tests working

* fix: remaining tests

* chore: update tests

* chore: update scripts

* chore: update dev script

* chore: rm plop

* fix: stories and cleanup providers

* refactor: packages

* chore: update

* chore: cleanup scripts

* chore: update

* fix: storybook build

* chore: mv color-mode and system into react

* chore: improve scripts

* chore: updates

* chore: cleanup changelog

* docs: cleanup changelog

* refactor: props docs scripts

* fix: typecheck

* fix: eslint

* chore: udpate slack scripts

* refactor: split layout compoents into folders
2024-01-09 18:50:17 +00:00

1.4 KiB

@chakra-ui/cli

Generate TypeScript types to provide autocomplete for your custom theme.

Usage

npx @chakra-ui/cli tokens <path/to/your/theme.(js|ts)>

or

npx @chakra-ui/cli tokens <@your-org/chakra-theme-package>
$ npx @chakra-ui/cli tokens --help

Usage: chakra-cli tokens [options] <source>

Options:
  --out <path>              output file e.g. node_modules/@chakra-ui/styled-system/dist/declarations/src/theming.types.d.ts
  --strict-component-types  Generate strict types for props variant and size
  --strict-token-types      Generate strict types for theme tokens (e.g. color, spacing)
  --no-format               Disable auto formatting
  --watch [path]            Watch directory for changes and rebuild
  --template <template>     Choose the template to use for the generation (choices: "default", "augmentation", default: "default"
  -h, --help                display help for command

Example call:
  $ chakra-cli tokens theme.ts

Note 🚨: If you delete the node_modules directory, you'll need to re-run the command to get proper typings again.

For convenience, you can add a postinstall script to your package.json, so you don't have to think about this every time you re-install your dependencies.

"scripts": {
  "gen:theme-typings": "chakra-cli tokens <path/to/your/theme.(js|ts)>",
  "postinstall": "npm run gen:theme-typings"
}