@saas-ui/react 3.0.0-alpha.1 → 3.0.0-alpha.10
Sign up to get free protection for your applications and to get access to all the features.
- package/CHANGELOG.md +73 -0
- package/dist/chunk-2EUACKRH.js +26 -0
- package/dist/chunk-3MO37LYW.js +326 -0
- package/dist/chunk-4TR3AOMG.js +33 -0
- package/dist/chunk-6LOMIKR5.js +69 -0
- package/dist/chunk-6ZNR6N2K.js +45 -0
- package/dist/chunk-7VSTNV2B.js +53 -0
- package/dist/chunk-BCNPBZZK.js +45 -0
- package/dist/chunk-CB52LBJK.js +71 -0
- package/dist/chunk-CD2JUFI2.js +231 -0
- package/dist/chunk-FJFNGSPL.js +23 -0
- package/dist/chunk-GGAKUS66.js +141 -0
- package/dist/chunk-H6TFEHY4.js +63 -0
- package/dist/chunk-HELHPHIQ.js +35 -0
- package/dist/chunk-I2RXEKTB.js +38 -0
- package/dist/chunk-JGHXJ3PI.js +102 -0
- package/dist/chunk-L356FPLY.js +20 -0
- package/dist/chunk-LIYUBUOP.js +119 -0
- package/dist/chunk-M7FOBCOV.js +184 -0
- package/dist/chunk-NSD5HRIP.js +46 -0
- package/dist/chunk-Q6SNJJO2.js +63 -0
- package/dist/chunk-QSNSWCTM.js +32 -0
- package/dist/chunk-S3CQW7GD.js +100 -0
- package/dist/chunk-SA3OGTOO.js +23 -0
- package/dist/chunk-SKXSBAOS.js +35 -0
- package/dist/{components/breadcrumbs/index.js → chunk-TT4C5VXB.js} +6 -7
- package/dist/chunk-TZBAM4AD.js +20 -0
- package/dist/chunk-UCQ3LZIE.js +43 -0
- package/dist/chunk-ULAJ3JEO.js +32 -0
- package/dist/chunk-WYLMBMAH.js +22 -0
- package/dist/components/app-shell/index.cjs +1 -1
- package/dist/components/app-shell/index.d.cts +1 -1
- package/dist/components/app-shell/index.d.ts +1 -1
- package/dist/components/app-shell/index.js +3 -40
- package/dist/components/avatar/index.cjs +69 -0
- package/dist/components/avatar/index.d.cts +18 -0
- package/dist/components/avatar/index.d.ts +18 -0
- package/dist/components/avatar/index.js +10 -0
- package/dist/components/{breadcrumbs → breadcrumb}/index.cjs +8 -10
- package/dist/components/{breadcrumbs → breadcrumb}/index.d.cts +3 -4
- package/dist/components/{breadcrumbs → breadcrumb}/index.d.ts +3 -4
- package/dist/components/breadcrumb/index.js +8 -0
- package/dist/components/button/index.js +3 -40
- package/dist/components/checkbox/index.js +3 -15
- package/dist/components/command/index.cjs +1 -1
- package/dist/components/command/index.js +3 -28
- package/dist/components/dialog/index.cjs +19 -58
- package/dist/components/dialog/index.js +4 -67
- package/dist/components/drawer/index.cjs +23 -64
- package/dist/components/drawer/index.d.cts +2 -2
- package/dist/components/drawer/index.d.ts +2 -2
- package/dist/components/drawer/index.js +4 -59
- package/dist/components/empty-state/index.cjs +48 -0
- package/dist/components/empty-state/index.d.cts +11 -0
- package/dist/components/empty-state/index.d.ts +11 -0
- package/dist/components/empty-state/index.js +8 -0
- package/dist/components/grid-list/index.cjs +68 -0
- package/dist/components/grid-list/index.d.cts +22 -0
- package/dist/components/grid-list/index.d.ts +22 -0
- package/dist/components/grid-list/index.js +8 -0
- package/dist/components/icon-badge/index.cjs +1 -1
- package/dist/components/icon-badge/index.d.cts +1 -1
- package/dist/components/icon-badge/index.d.ts +1 -1
- package/dist/components/icon-badge/index.js +3 -33
- package/dist/components/link/index.js +3 -14
- package/dist/components/loading-overlay/index.cjs +42 -1879
- package/dist/components/loading-overlay/index.d.cts +19 -6
- package/dist/components/loading-overlay/index.d.ts +19 -6
- package/dist/components/loading-overlay/index.js +7 -1874
- package/dist/components/menu/index.cjs +249 -0
- package/dist/components/menu/index.d.cts +39 -0
- package/dist/components/menu/index.d.ts +39 -0
- package/dist/components/menu/index.js +11 -0
- package/dist/components/navbar/index.cjs +61 -15
- package/dist/components/navbar/index.d.cts +12 -9
- package/dist/components/navbar/index.d.ts +12 -9
- package/dist/components/navbar/index.js +5 -38
- package/dist/components/number-input/index.js +3 -26
- package/dist/components/password-input/index.js +3 -225
- package/dist/components/persona/index.cjs +52 -15
- package/dist/components/persona/index.d.cts +22 -2
- package/dist/components/persona/index.d.ts +22 -2
- package/dist/components/persona/index.js +7 -144
- package/dist/components/pin-input/index.js +3 -21
- package/dist/components/radio/index.js +4 -16
- package/dist/components/search-input/index.js +4 -114
- package/dist/components/segmented-control/index.cjs +60 -0
- package/dist/components/segmented-control/index.d.cts +14 -0
- package/dist/components/segmented-control/index.d.ts +14 -0
- package/dist/components/segmented-control/index.js +8 -0
- package/dist/components/select/index.js +4 -94
- package/dist/components/sidebar/index.cjs +64 -32
- package/dist/components/sidebar/index.d.cts +24 -23
- package/dist/components/sidebar/index.d.ts +24 -23
- package/dist/components/sidebar/index.js +7 -101
- package/dist/components/steps/index.cjs +7 -9
- package/dist/components/steps/index.d.cts +2 -2
- package/dist/components/steps/index.d.ts +2 -2
- package/dist/components/steps/index.js +6 -67
- package/dist/components/switch/index.js +3 -18
- package/dist/components/toaster/index.cjs +54 -0
- package/dist/components/toaster/index.d.cts +10 -0
- package/dist/components/toaster/index.d.ts +10 -0
- package/dist/components/toaster/index.js +10 -0
- package/dist/components/tooltip/index.cjs +57 -0
- package/dist/components/tooltip/index.d.cts +14 -0
- package/dist/components/tooltip/index.d.ts +14 -0
- package/dist/components/tooltip/index.js +8 -0
- package/dist/index.cjs +2357 -220
- package/dist/index.d.cts +38 -2
- package/dist/index.d.ts +38 -2
- package/dist/index.js +515 -276
- package/dist/theme/tokens/colors.cjs +349 -0
- package/dist/theme/tokens/colors.d.cts +856 -0
- package/dist/theme/tokens/colors.d.ts +856 -0
- package/dist/theme/tokens/colors.js +8 -0
- package/package.json +12 -7
- package/dist/chunk-VBIVLREP.js +0 -45
- package/src/components/app-shell/app-shell.recipe.ts +0 -52
- package/src/components/app-shell/app-shell.stories.tsx +0 -51
- package/src/components/app-shell/app-shell.tsx +0 -94
- package/src/components/app-shell/index.ts +0 -3
- package/src/components/breadcrumbs/breadcrumb.stories.tsx +0 -17
- package/src/components/breadcrumbs/breadcrumb.tsx +0 -36
- package/src/components/breadcrumbs/index.ts +0 -1
- package/src/components/breadcrumbs/namespace.ts +0 -8
- package/src/components/button/button.recipe.ts +0 -182
- package/src/components/button/button.stories.tsx +0 -99
- package/src/components/button/button.tsx +0 -55
- package/src/components/button/index.ts +0 -2
- package/src/components/checkbox/checkbox.tsx +0 -26
- package/src/components/checkbox/index.ts +0 -2
- package/src/components/close-button/close-button.stories.tsx +0 -12
- package/src/components/close-button/close-button.tsx +0 -18
- package/src/components/close-button/index.ts +0 -2
- package/src/components/command/command.recipe.ts +0 -17
- package/src/components/command/command.stories.tsx +0 -47
- package/src/components/command/command.tsx +0 -50
- package/src/components/command/index.ts +0 -1
- package/src/components/dialog/dialog.tsx +0 -67
- package/src/components/dialog/index.ts +0 -1
- package/src/components/dialog/namespace.ts +0 -18
- package/src/components/drawer/drawer.tsx +0 -57
- package/src/components/drawer/index.ts +0 -3
- package/src/components/drawer/namespace.ts +0 -19
- package/src/components/grid-list/grid-list.recipe.ts +0 -113
- package/src/components/icon-badge/icon-badge.recipe.ts +0 -57
- package/src/components/icon-badge/icon-badge.stories.tsx +0 -38
- package/src/components/icon-badge/icon-badge.tsx +0 -59
- package/src/components/icon-badge/index.ts +0 -2
- package/src/components/icons/create-icon.tsx +0 -41
- package/src/components/icons/icons.tsx +0 -119
- package/src/components/icons/index.ts +0 -1
- package/src/components/input-group/index.ts +0 -1
- package/src/components/input-group/input-group.tsx +0 -46
- package/src/components/link/index.ts +0 -2
- package/src/components/link/link.stories.tsx +0 -17
- package/src/components/link/link.test.tsx +0 -33
- package/src/components/link/link.tsx +0 -27
- package/src/components/loading-overlay/index.ts +0 -1
- package/src/components/loading-overlay/loading-overlay.recipe.ts +0 -61
- package/src/components/loading-overlay/loading-overlay.stories.tsx +0 -68
- package/src/components/loading-overlay/loading-overlay.tsx +0 -54
- package/src/components/loading-overlay/namespace.ts +0 -7
- package/src/components/navbar/index.ts +0 -1
- package/src/components/navbar/namespace.ts +0 -9
- package/src/components/navbar/navbar.recipe.ts +0 -109
- package/src/components/navbar/navbar.stories.tsx +0 -435
- package/src/components/navbar/navbar.test.tsx +0 -49
- package/src/components/navbar/navbar.tsx +0 -39
- package/src/components/number-input/index.ts +0 -2
- package/src/components/number-input/number-input.tsx +0 -41
- package/src/components/password-input/index.ts +0 -2
- package/src/components/password-input/password-input.tsx +0 -93
- package/src/components/persona/index.ts +0 -2
- package/src/components/persona/namespace.ts +0 -18
- package/src/components/persona/persona-primitive.tsx +0 -220
- package/src/components/persona/persona.recipe.ts +0 -94
- package/src/components/persona/persona.stories.tsx +0 -101
- package/src/components/persona/persona.tsx +0 -142
- package/src/components/pin-input/index.ts +0 -2
- package/src/components/pin-input/pin-input.tsx +0 -36
- package/src/components/radio/index.ts +0 -2
- package/src/components/radio/radio.tsx +0 -27
- package/src/components/search-input/index.ts +0 -2
- package/src/components/search-input/search-input.stories.tsx +0 -63
- package/src/components/search-input/search-input.tsx +0 -134
- package/src/components/select/index.ts +0 -1
- package/src/components/select/namespace.ts +0 -18
- package/src/components/select/select.tsx +0 -135
- package/src/components/sidebar/index.ts +0 -7
- package/src/components/sidebar/namespace.ts +0 -27
- package/src/components/sidebar/sidebar-item.recipe.ts +0 -65
- package/src/components/sidebar/sidebar.recipe.ts +0 -237
- package/src/components/sidebar/sidebar.stories.tsx +0 -903
- package/src/components/sidebar/sidebar.tsx +0 -208
- package/src/components/spinner/index.ts +0 -2
- package/src/components/spinner/spinner.stories.tsx +0 -19
- package/src/components/spinner/spinner.tsx +0 -21
- package/src/components/steps/index.ts +0 -1
- package/src/components/steps/namespace.ts +0 -16
- package/src/components/steps/steps.tsx +0 -82
- package/src/components/switch/index.ts +0 -3
- package/src/components/switch/switch.tsx +0 -39
- package/src/compositions/accordion.tsx +0 -47
- package/src/compositions/action-bar.tsx +0 -40
- package/src/compositions/alert.tsx +0 -51
- package/src/compositions/avatar.tsx +0 -74
- package/src/compositions/blockquote.tsx +0 -31
- package/src/compositions/checkbox-card.tsx +0 -57
- package/src/compositions/checkbox.tsx +0 -25
- package/src/compositions/clipboard.tsx +0 -107
- package/src/compositions/color-mode.tsx +0 -65
- package/src/compositions/data-list.tsx +0 -37
- package/src/compositions/empty-state.tsx +0 -34
- package/src/compositions/field.tsx +0 -33
- package/src/compositions/file-button.tsx +0 -166
- package/src/compositions/hover-card.tsx +0 -35
- package/src/compositions/link-button.tsx +0 -12
- package/src/compositions/menu.tsx +0 -108
- package/src/compositions/native-select.tsx +0 -57
- package/src/compositions/pagination.tsx +0 -207
- package/src/compositions/popover.tsx +0 -58
- package/src/compositions/progress-circle.tsx +0 -37
- package/src/compositions/progress.tsx +0 -40
- package/src/compositions/prose.tsx +0 -264
- package/src/compositions/provider.tsx +0 -12
- package/src/compositions/radio-card.tsx +0 -57
- package/src/compositions/radio.tsx +0 -24
- package/src/compositions/rating.tsx +0 -27
- package/src/compositions/segmented-control.tsx +0 -47
- package/src/compositions/skeleton.tsx +0 -44
- package/src/compositions/slider.tsx +0 -53
- package/src/compositions/stat.tsx +0 -75
- package/src/compositions/status.tsx +0 -29
- package/src/compositions/stepper-input.tsx +0 -49
- package/src/compositions/tag.tsx +0 -39
- package/src/compositions/timeline.tsx +0 -17
- package/src/compositions/toaster.tsx +0 -43
- package/src/compositions/toggle-tip.tsx +0 -62
- package/src/compositions/tooltip.tsx +0 -46
- package/src/index.ts +0 -7
- package/src/preset.ts +0 -9
- package/src/provider/index.ts +0 -4
- package/src/provider/sui-provider.tsx +0 -34
- package/src/provider/use-link.test.tsx +0 -60
- package/src/provider/use-link.tsx +0 -13
- package/src/styled-system/create-recipe-context.tsx +0 -91
- package/src/styled-system/create-slot-recipe-context.tsx +0 -188
- package/src/styled-system/empty.ts +0 -7
- package/src/styled-system/factory.types.ts +0 -11
- package/src/theme/animation-styles.ts +0 -53
- package/src/theme/breakpoints.ts +0 -11
- package/src/theme/conditions.ts +0 -26
- package/src/theme/fluid-font-sizes.ts +0 -65
- package/src/theme/global-css.ts +0 -94
- package/src/theme/index.ts +0 -72
- package/src/theme/layer-styles.ts +0 -116
- package/src/theme/recipes/chakra/accordion.ts +0 -145
- package/src/theme/recipes/chakra/action-bar.ts +0 -62
- package/src/theme/recipes/chakra/alert.ts +0 -157
- package/src/theme/recipes/chakra/avatar.ts +0 -141
- package/src/theme/recipes/chakra/badge.ts +0 -67
- package/src/theme/recipes/chakra/blockquote.ts +0 -83
- package/src/theme/recipes/chakra/breadcrumb.ts +0 -94
- package/src/theme/recipes/chakra/card.ts +0 -99
- package/src/theme/recipes/chakra/checkbox-card.ts +0 -212
- package/src/theme/recipes/chakra/checkbox.ts +0 -70
- package/src/theme/recipes/chakra/checkmark.ts +0 -83
- package/src/theme/recipes/chakra/code.ts +0 -17
- package/src/theme/recipes/chakra/collapsible.ts +0 -20
- package/src/theme/recipes/chakra/container.ts +0 -26
- package/src/theme/recipes/chakra/data-list.ts +0 -80
- package/src/theme/recipes/chakra/dialog.ts +0 -225
- package/src/theme/recipes/chakra/drawer.ts +0 -201
- package/src/theme/recipes/chakra/editable.ts +0 -88
- package/src/theme/recipes/chakra/empty-state.ts +0 -88
- package/src/theme/recipes/chakra/field.ts +0 -68
- package/src/theme/recipes/chakra/fieldset.ts +0 -62
- package/src/theme/recipes/chakra/file-upload.ts +0 -96
- package/src/theme/recipes/chakra/heading.ts +0 -27
- package/src/theme/recipes/chakra/hover-card.ts +0 -68
- package/src/theme/recipes/chakra/icon.ts +0 -30
- package/src/theme/recipes/chakra/input-addon.ts +0 -40
- package/src/theme/recipes/chakra/input.ts +0 -96
- package/src/theme/recipes/chakra/kbd.ts +0 -60
- package/src/theme/recipes/chakra/link.ts +0 -37
- package/src/theme/recipes/chakra/list.ts +0 -67
- package/src/theme/recipes/chakra/mark.ts +0 -27
- package/src/theme/recipes/chakra/menu.ts +0 -124
- package/src/theme/recipes/chakra/native-select.ts +0 -140
- package/src/theme/recipes/chakra/number-input.ts +0 -115
- package/src/theme/recipes/chakra/pin-input.ts +0 -27
- package/src/theme/recipes/chakra/popover.ts +0 -86
- package/src/theme/recipes/chakra/progress-circle.ts +0 -94
- package/src/theme/recipes/chakra/progress.ts +0 -127
- package/src/theme/recipes/chakra/radio-card.ts +0 -220
- package/src/theme/recipes/chakra/radio-group.ts +0 -72
- package/src/theme/recipes/chakra/radiomark.ts +0 -107
- package/src/theme/recipes/chakra/rating-group.ts +0 -94
- package/src/theme/recipes/chakra/segment-group.ts +0 -117
- package/src/theme/recipes/chakra/select.ts +0 -282
- package/src/theme/recipes/chakra/separator.ts +0 -51
- package/src/theme/recipes/chakra/skeleton.ts +0 -53
- package/src/theme/recipes/chakra/skip-nav-link.ts +0 -34
- package/src/theme/recipes/chakra/slider.ts +0 -178
- package/src/theme/recipes/chakra/spinner.ts +0 -32
- package/src/theme/recipes/chakra/stat.ts +0 -79
- package/src/theme/recipes/chakra/status.ts +0 -48
- package/src/theme/recipes/chakra/steps.ts +0 -218
- package/src/theme/recipes/chakra/switch.ts +0 -167
- package/src/theme/recipes/chakra/table.ts +0 -172
- package/src/theme/recipes/chakra/tabs.ts +0 -280
- package/src/theme/recipes/chakra/tag.ts +0 -131
- package/src/theme/recipes/chakra/textarea.ts +0 -88
- package/src/theme/recipes/chakra/timeline.ts +0 -138
- package/src/theme/recipes/chakra/toast.ts +0 -96
- package/src/theme/recipes/chakra/tooltip.ts +0 -40
- package/src/theme/recipes.ts +0 -46
- package/src/theme/semantic-tokens/colors.ts +0 -403
- package/src/theme/semantic-tokens/radii.ts +0 -7
- package/src/theme/semantic-tokens/shadows.ts +0 -52
- package/src/theme/slot-recipes.ts +0 -104
- package/src/theme/text-styles.ts +0 -39
- package/src/theme/tokens/animations.ts +0 -8
- package/src/theme/tokens/aspect-ratios.ts +0 -10
- package/src/theme/tokens/blurs.ts +0 -12
- package/src/theme/tokens/borders.ts +0 -9
- package/src/theme/tokens/colors.ts +0 -177
- package/src/theme/tokens/cursor.ts +0 -12
- package/src/theme/tokens/durations.ts +0 -11
- package/src/theme/tokens/easings.ts +0 -10
- package/src/theme/tokens/font-sizes.ts +0 -20
- package/src/theme/tokens/font-weights.ts +0 -13
- package/src/theme/tokens/fonts.ts +0 -15
- package/src/theme/tokens/keyframes.ts +0 -173
- package/src/theme/tokens/letter-spacing.ts +0 -9
- package/src/theme/tokens/line-heights.ts +0 -19
- package/src/theme/tokens/radius.ts +0 -18
- package/src/theme/tokens/sizes.ts +0 -71
- package/src/theme/tokens/spacing.ts +0 -38
- package/src/theme/tokens/z-indices.ts +0 -34
- package/src/theme/utils.ts +0 -46
- /package/dist/{chunk-KHRLZUV4.js → chunk-O2WVT2BP.js} +0 -0
@@ -1,104 +0,0 @@
|
|
1
|
-
import { appShellSlotRecipe } from '#components/app-shell/app-shell.recipe.ts'
|
2
|
-
import { gridListSlotRecipe } from '#components/grid-list/grid-list.recipe.ts'
|
3
|
-
import { loadingOverlaySlotRecipe } from '#components/loading-overlay/loading-overlay.recipe.ts'
|
4
|
-
import { navbarSlotRecipe } from '#components/navbar/navbar.recipe.ts'
|
5
|
-
import { personaSlotRecipe } from '#components/persona/persona.recipe.ts'
|
6
|
-
import { sidebarNavItemSlotRecipe } from '#components/sidebar/sidebar-item.recipe.ts'
|
7
|
-
import { sidebarSlotRecipe } from '#components/sidebar/sidebar.recipe.ts'
|
8
|
-
|
9
|
-
import { accordionSlotRecipe } from './recipes/chakra/accordion'
|
10
|
-
import { actionBarSlotRecipe } from './recipes/chakra/action-bar'
|
11
|
-
import { alertSlotRecipe } from './recipes/chakra/alert'
|
12
|
-
import { avatarSlotRecipe } from './recipes/chakra/avatar'
|
13
|
-
import { blockquoteSlotRecipe } from './recipes/chakra/blockquote'
|
14
|
-
import { breadcrumbSlotRecipe } from './recipes/chakra/breadcrumb'
|
15
|
-
import { cardSlotRecipe } from './recipes/chakra/card'
|
16
|
-
import { checkboxSlotRecipe } from './recipes/chakra/checkbox'
|
17
|
-
import { checkboxCardSlotRecipe } from './recipes/chakra/checkbox-card'
|
18
|
-
import { collapsibleSlotRecipe } from './recipes/chakra/collapsible'
|
19
|
-
import { dataListSlotRecipe } from './recipes/chakra/data-list'
|
20
|
-
import { dialogSlotRecipe } from './recipes/chakra/dialog'
|
21
|
-
import { drawerSlotRecipe } from './recipes/chakra/drawer'
|
22
|
-
import { editableSlotRecipe } from './recipes/chakra/editable'
|
23
|
-
import { emptyStateSlotRecipe } from './recipes/chakra/empty-state'
|
24
|
-
import { fieldSlotRecipe } from './recipes/chakra/field'
|
25
|
-
import { fileUploadSlotRecipe } from './recipes/chakra/file-upload'
|
26
|
-
import { hoverCardSlotRecipe } from './recipes/chakra/hover-card'
|
27
|
-
import { listSlotRecipe } from './recipes/chakra/list'
|
28
|
-
import { menuSlotRecipe } from './recipes/chakra/menu'
|
29
|
-
import { nativeSelectSlotRecipe } from './recipes/chakra/native-select'
|
30
|
-
import { numberInputSlotRecipe } from './recipes/chakra/number-input'
|
31
|
-
import { pinInputSlotRecipe } from './recipes/chakra/pin-input'
|
32
|
-
import { popoverSlotRecipe } from './recipes/chakra/popover'
|
33
|
-
import { progressSlotRecipe } from './recipes/chakra/progress'
|
34
|
-
import { progressCircleSlotRecipe } from './recipes/chakra/progress-circle'
|
35
|
-
import { radioCardSlotRecipe } from './recipes/chakra/radio-card'
|
36
|
-
import { radioGroupSlotRecipe } from './recipes/chakra/radio-group'
|
37
|
-
import { ratingGroupSlotRecipe } from './recipes/chakra/rating-group'
|
38
|
-
import { segmentGroupSlotRecipe } from './recipes/chakra/segment-group'
|
39
|
-
import { selectSlotRecipe } from './recipes/chakra/select'
|
40
|
-
import { sliderSlotRecipe } from './recipes/chakra/slider'
|
41
|
-
import { statSlotRecipe } from './recipes/chakra/stat'
|
42
|
-
import { statusSlotRecipe } from './recipes/chakra/status'
|
43
|
-
import { stepsSlotRecipe } from './recipes/chakra/steps'
|
44
|
-
import { switchSlotRecipe } from './recipes/chakra/switch'
|
45
|
-
import { tableSlotRecipe } from './recipes/chakra/table'
|
46
|
-
import { tabsSlotRecipe } from './recipes/chakra/tabs'
|
47
|
-
import { tagSlotRecipe } from './recipes/chakra/tag'
|
48
|
-
import { timelineSlotRecipe } from './recipes/chakra/timeline'
|
49
|
-
import { toastSlotRecipe } from './recipes/chakra/toast'
|
50
|
-
import { tooltipSlotRecipe } from './recipes/chakra/tooltip'
|
51
|
-
|
52
|
-
export const slotRecipes = {
|
53
|
-
// Chakra UI Recipes
|
54
|
-
accordion: accordionSlotRecipe,
|
55
|
-
actionBar: actionBarSlotRecipe,
|
56
|
-
alert: alertSlotRecipe,
|
57
|
-
avatar: avatarSlotRecipe,
|
58
|
-
blockquote: blockquoteSlotRecipe,
|
59
|
-
breadcrumb: breadcrumbSlotRecipe,
|
60
|
-
card: cardSlotRecipe,
|
61
|
-
checkbox: checkboxSlotRecipe,
|
62
|
-
checkboxCard: checkboxCardSlotRecipe,
|
63
|
-
collapsible: collapsibleSlotRecipe,
|
64
|
-
dataList: dataListSlotRecipe,
|
65
|
-
dialog: dialogSlotRecipe,
|
66
|
-
drawer: drawerSlotRecipe,
|
67
|
-
editable: editableSlotRecipe,
|
68
|
-
emptyState: emptyStateSlotRecipe,
|
69
|
-
field: fieldSlotRecipe,
|
70
|
-
fileUpload: fileUploadSlotRecipe,
|
71
|
-
hoverCard: hoverCardSlotRecipe,
|
72
|
-
list: listSlotRecipe,
|
73
|
-
menu: menuSlotRecipe,
|
74
|
-
nativeSelect: nativeSelectSlotRecipe,
|
75
|
-
numberInput: numberInputSlotRecipe,
|
76
|
-
pinInput: pinInputSlotRecipe,
|
77
|
-
popover: popoverSlotRecipe,
|
78
|
-
progress: progressSlotRecipe,
|
79
|
-
progressCircle: progressCircleSlotRecipe,
|
80
|
-
radioCard: radioCardSlotRecipe,
|
81
|
-
radioGroup: radioGroupSlotRecipe,
|
82
|
-
ratingGroup: ratingGroupSlotRecipe,
|
83
|
-
segmentGroup: segmentGroupSlotRecipe,
|
84
|
-
select: selectSlotRecipe,
|
85
|
-
slider: sliderSlotRecipe,
|
86
|
-
stat: statSlotRecipe,
|
87
|
-
steps: stepsSlotRecipe,
|
88
|
-
switch: switchSlotRecipe,
|
89
|
-
table: tableSlotRecipe,
|
90
|
-
tabs: tabsSlotRecipe,
|
91
|
-
tag: tagSlotRecipe,
|
92
|
-
toast: toastSlotRecipe,
|
93
|
-
tooltip: tooltipSlotRecipe,
|
94
|
-
status: statusSlotRecipe,
|
95
|
-
timeline: timelineSlotRecipe,
|
96
|
-
// Saas UI Recipes
|
97
|
-
appShell: appShellSlotRecipe,
|
98
|
-
loadingOverlay: loadingOverlaySlotRecipe,
|
99
|
-
persona: personaSlotRecipe,
|
100
|
-
gridList: gridListSlotRecipe,
|
101
|
-
navbar: navbarSlotRecipe,
|
102
|
-
sidebar: sidebarSlotRecipe,
|
103
|
-
sidebarNavItem: sidebarNavItemSlotRecipe,
|
104
|
-
}
|
package/src/theme/text-styles.ts
DELETED
@@ -1,39 +0,0 @@
|
|
1
|
-
import { defineTextStyles } from '@chakra-ui/react'
|
2
|
-
|
3
|
-
export const textStyles: any = defineTextStyles({
|
4
|
-
'2xs': { value: { fontSize: '2xs', lineHeight: '0.75rem' } },
|
5
|
-
xs: { value: { fontSize: 'xs', lineHeight: '1rem' } },
|
6
|
-
sm: { value: { fontSize: 'sm', lineHeight: '1.25rem' } },
|
7
|
-
md: { value: { fontSize: 'md', lineHeight: '1.5rem' } },
|
8
|
-
lg: { value: { fontSize: 'lg', lineHeight: '1.75rem' } },
|
9
|
-
xl: { value: { fontSize: 'xl', lineHeight: '1.875rem' } },
|
10
|
-
'2xl': { value: { fontSize: '2xl', lineHeight: '2rem' } },
|
11
|
-
'3xl': { value: { fontSize: '3xl', lineHeight: '2.375rem' } },
|
12
|
-
'4xl': {
|
13
|
-
value: {
|
14
|
-
fontSize: '4xl',
|
15
|
-
lineHeight: '2.75rem',
|
16
|
-
letterSpacing: '-0.025em',
|
17
|
-
},
|
18
|
-
},
|
19
|
-
'5xl': {
|
20
|
-
value: {
|
21
|
-
fontSize: '5xl',
|
22
|
-
lineHeight: '3.75rem',
|
23
|
-
letterSpacing: '-0.025em',
|
24
|
-
},
|
25
|
-
},
|
26
|
-
'6xl': {
|
27
|
-
value: { fontSize: '6xl', lineHeight: '4.5rem', letterSpacing: '-0.025em' },
|
28
|
-
},
|
29
|
-
'7xl': {
|
30
|
-
value: {
|
31
|
-
fontSize: '7xl',
|
32
|
-
lineHeight: '5.75rem',
|
33
|
-
letterSpacing: '-0.025em',
|
34
|
-
},
|
35
|
-
},
|
36
|
-
none: {
|
37
|
-
value: {},
|
38
|
-
},
|
39
|
-
})
|
@@ -1,8 +0,0 @@
|
|
1
|
-
import { defineTokens } from '@chakra-ui/react'
|
2
|
-
|
3
|
-
export const animations = defineTokens.animations({
|
4
|
-
spin: { value: 'spin 1s linear infinite' },
|
5
|
-
ping: { value: 'ping 1s cubic-bezier(0, 0, 0.2, 1) infinite' },
|
6
|
-
pulse: { value: 'pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite' },
|
7
|
-
bounce: { value: 'bounce 1s infinite' },
|
8
|
-
})
|
@@ -1,10 +0,0 @@
|
|
1
|
-
import { defineTokens } from '@chakra-ui/react'
|
2
|
-
|
3
|
-
export const aspectRatios = defineTokens.aspectRatios({
|
4
|
-
square: { value: '1 / 1' },
|
5
|
-
landscape: { value: '4 / 3' },
|
6
|
-
portrait: { value: '3 / 4' },
|
7
|
-
wide: { value: '16 / 9' },
|
8
|
-
ultrawide: { value: '18 / 5' },
|
9
|
-
golden: { value: '1.618 / 1' },
|
10
|
-
})
|
@@ -1,12 +0,0 @@
|
|
1
|
-
import { defineTokens } from '@chakra-ui/react'
|
2
|
-
|
3
|
-
export const blurs = defineTokens.blurs({
|
4
|
-
none: { value: ' ' },
|
5
|
-
sm: { value: '4px' },
|
6
|
-
md: { value: '8px' },
|
7
|
-
lg: { value: '12px' },
|
8
|
-
xl: { value: '16px' },
|
9
|
-
'2xl': { value: '24px' },
|
10
|
-
'3xl': { value: '40px' },
|
11
|
-
'4xl': { value: '64px' },
|
12
|
-
})
|
@@ -1,177 +0,0 @@
|
|
1
|
-
import { defineTokens } from '@chakra-ui/react'
|
2
|
-
|
3
|
-
export const colors = defineTokens.colors({
|
4
|
-
transparent: { value: 'transparent' },
|
5
|
-
current: { value: 'currentColor' },
|
6
|
-
black: { value: '#09090B' },
|
7
|
-
white: { value: '#FFFFFF' },
|
8
|
-
whiteAlpha: {
|
9
|
-
50: { value: 'rgba(255, 255, 255, 0.04)' },
|
10
|
-
100: { value: 'rgba(255, 255, 255, 0.06)' },
|
11
|
-
200: { value: 'rgba(255, 255, 255, 0.08)' },
|
12
|
-
300: { value: 'rgba(255, 255, 255, 0.16)' },
|
13
|
-
400: { value: 'rgba(255, 255, 255, 0.24)' },
|
14
|
-
500: { value: 'rgba(255, 255, 255, 0.36)' },
|
15
|
-
600: { value: 'rgba(255, 255, 255, 0.48)' },
|
16
|
-
700: { value: 'rgba(255, 255, 255, 0.64)' },
|
17
|
-
800: { value: 'rgba(255, 255, 255, 0.80)' },
|
18
|
-
900: { value: 'rgba(255, 255, 255, 0.92)' },
|
19
|
-
950: { value: 'rgba(255, 255, 255, 0.95)' },
|
20
|
-
},
|
21
|
-
blackAlpha: {
|
22
|
-
50: { value: 'rgba(0, 0, 0, 0.04)' },
|
23
|
-
100: { value: 'rgba(0, 0, 0, 0.06)' },
|
24
|
-
200: { value: 'rgba(0, 0, 0, 0.08)' },
|
25
|
-
300: { value: 'rgba(0, 0, 0, 0.16)' },
|
26
|
-
400: { value: 'rgba(0, 0, 0, 0.24)' },
|
27
|
-
500: { value: 'rgba(0, 0, 0, 0.36)' },
|
28
|
-
600: { value: 'rgba(0, 0, 0, 0.48)' },
|
29
|
-
700: { value: 'rgba(0, 0, 0, 0.64)' },
|
30
|
-
800: { value: 'rgba(0, 0, 0, 0.80)' },
|
31
|
-
900: { value: 'rgba(0, 0, 0, 0.92)' },
|
32
|
-
950: { value: 'rgba(0, 0, 0, 0.95)' },
|
33
|
-
},
|
34
|
-
gray: {
|
35
|
-
50: { value: '#fafafa' },
|
36
|
-
100: { value: '#f4f4f5' },
|
37
|
-
200: { value: '#e4e4e7' },
|
38
|
-
300: { value: '#d4d4d8' },
|
39
|
-
400: { value: '#a1a1aa' },
|
40
|
-
500: { value: '#71717a' },
|
41
|
-
600: { value: '#52525b' },
|
42
|
-
700: { value: '#3f3f46' },
|
43
|
-
800: { value: '#27272a' },
|
44
|
-
900: { value: '#18181b' },
|
45
|
-
950: { value: '#111111' },
|
46
|
-
},
|
47
|
-
red: {
|
48
|
-
50: { value: '#fef2f2' },
|
49
|
-
100: { value: '#fee2e2' },
|
50
|
-
200: { value: '#fecaca' },
|
51
|
-
300: { value: '#fca5a5' },
|
52
|
-
400: { value: '#f87171' },
|
53
|
-
500: { value: '#ef4444' },
|
54
|
-
600: { value: '#dc2626' },
|
55
|
-
700: { value: '#991919' },
|
56
|
-
800: { value: '#511111' },
|
57
|
-
900: { value: '#300c0c' },
|
58
|
-
950: { value: '#1f0808' },
|
59
|
-
},
|
60
|
-
orange: {
|
61
|
-
50: { value: '#fff7ed' },
|
62
|
-
100: { value: '#ffedd5' },
|
63
|
-
200: { value: '#fed7aa' },
|
64
|
-
300: { value: '#fdba74' },
|
65
|
-
400: { value: '#fb923c' },
|
66
|
-
500: { value: '#f97316' },
|
67
|
-
600: { value: '#ea580c' },
|
68
|
-
700: { value: '#92310a' },
|
69
|
-
800: { value: '#6c2710' },
|
70
|
-
900: { value: '#3b1106' },
|
71
|
-
950: { value: '#220a04' },
|
72
|
-
},
|
73
|
-
yellow: {
|
74
|
-
50: { value: '#fefce8' },
|
75
|
-
100: { value: '#fef9c3' },
|
76
|
-
200: { value: '#fef08a' },
|
77
|
-
300: { value: '#fde047' },
|
78
|
-
400: { value: '#facc15' },
|
79
|
-
500: { value: '#eab308' },
|
80
|
-
600: { value: '#ca8a04' },
|
81
|
-
700: { value: '#845209' },
|
82
|
-
800: { value: '#713f12' },
|
83
|
-
900: { value: '#422006' },
|
84
|
-
950: { value: '#281304' },
|
85
|
-
},
|
86
|
-
green: {
|
87
|
-
50: { value: '#f0fdf4' },
|
88
|
-
100: { value: '#dcfce7' },
|
89
|
-
200: { value: '#bbf7d0' },
|
90
|
-
300: { value: '#86efac' },
|
91
|
-
400: { value: '#4ade80' },
|
92
|
-
500: { value: '#22c55e' },
|
93
|
-
600: { value: '#16a34a' },
|
94
|
-
700: { value: '#116932' },
|
95
|
-
800: { value: '#124a28' },
|
96
|
-
900: { value: '#042713' },
|
97
|
-
950: { value: '#03190c' },
|
98
|
-
},
|
99
|
-
teal: {
|
100
|
-
50: { value: '#f0fdfa' },
|
101
|
-
100: { value: '#ccfbf1' },
|
102
|
-
200: { value: '#99f6e4' },
|
103
|
-
300: { value: '#5eead4' },
|
104
|
-
400: { value: '#2dd4bf' },
|
105
|
-
500: { value: '#14b8a6' },
|
106
|
-
600: { value: '#0d9488' },
|
107
|
-
700: { value: '#0c5d56' },
|
108
|
-
800: { value: '#114240' },
|
109
|
-
900: { value: '#032726' },
|
110
|
-
950: { value: '#021716' },
|
111
|
-
},
|
112
|
-
blue: {
|
113
|
-
50: { value: '#eff6ff' },
|
114
|
-
100: { value: '#dbeafe' },
|
115
|
-
200: { value: '#bfdbfe' },
|
116
|
-
300: { value: '#a3cfff' },
|
117
|
-
400: { value: '#60a5fa' },
|
118
|
-
500: { value: '#3b82f6' },
|
119
|
-
600: { value: '#2563eb' },
|
120
|
-
700: { value: '#173da6' },
|
121
|
-
800: { value: '#1a3478' },
|
122
|
-
900: { value: '#14204a' },
|
123
|
-
950: { value: '#0c142e' },
|
124
|
-
},
|
125
|
-
cyan: {
|
126
|
-
50: { value: '#ecfeff' },
|
127
|
-
100: { value: '#cffafe' },
|
128
|
-
200: { value: '#a5f3fc' },
|
129
|
-
300: { value: '#67e8f9' },
|
130
|
-
400: { value: '#22d3ee' },
|
131
|
-
500: { value: '#06b6d4' },
|
132
|
-
600: { value: '#0891b2' },
|
133
|
-
700: { value: '#0c5c72' },
|
134
|
-
800: { value: '#134152' },
|
135
|
-
900: { value: '#072a38' },
|
136
|
-
950: { value: '#051b24' },
|
137
|
-
},
|
138
|
-
indigo: {
|
139
|
-
50: { value: '#eef2ff' },
|
140
|
-
100: { value: '#e0e7ff' },
|
141
|
-
200: { value: '#c7d2fe' },
|
142
|
-
300: { value: '#a5b4fc' },
|
143
|
-
400: { value: '#818cf8' },
|
144
|
-
500: { value: '#6366f1' },
|
145
|
-
600: { value: '#4f46e5' },
|
146
|
-
700: { value: '#4338ca' },
|
147
|
-
800: { value: '#3730a3' },
|
148
|
-
900: { value: '#312e81' },
|
149
|
-
950: { value: '#1e1b4b' },
|
150
|
-
},
|
151
|
-
purple: {
|
152
|
-
50: { value: '#faf5ff' },
|
153
|
-
100: { value: '#f3e8ff' },
|
154
|
-
200: { value: '#e9d5ff' },
|
155
|
-
300: { value: '#d8b4fe' },
|
156
|
-
400: { value: '#c084fc' },
|
157
|
-
500: { value: '#a855f7' },
|
158
|
-
600: { value: '#9333ea' },
|
159
|
-
700: { value: '#641ba3' },
|
160
|
-
800: { value: '#4a1772' },
|
161
|
-
900: { value: '#2f0553' },
|
162
|
-
950: { value: '#1a032e' },
|
163
|
-
},
|
164
|
-
pink: {
|
165
|
-
50: { value: '#fdf2f8' },
|
166
|
-
100: { value: '#fce7f3' },
|
167
|
-
200: { value: '#fbcfe8' },
|
168
|
-
300: { value: '#f9a8d4' },
|
169
|
-
400: { value: '#f472b6' },
|
170
|
-
500: { value: '#ec4899' },
|
171
|
-
600: { value: '#db2777' },
|
172
|
-
700: { value: '#a41752' },
|
173
|
-
800: { value: '#6d0e34' },
|
174
|
-
900: { value: '#45061f' },
|
175
|
-
950: { value: '#2c0514' },
|
176
|
-
},
|
177
|
-
})
|
@@ -1,12 +0,0 @@
|
|
1
|
-
import { defineTokens } from '@chakra-ui/react'
|
2
|
-
|
3
|
-
export const cursor = defineTokens.cursor({
|
4
|
-
button: { value: 'pointer' },
|
5
|
-
checkbox: { value: 'default' },
|
6
|
-
disabled: { value: 'not-allowed' },
|
7
|
-
menuitem: { value: 'default' },
|
8
|
-
option: { value: 'default' },
|
9
|
-
radio: { value: 'default' },
|
10
|
-
slider: { value: 'default' },
|
11
|
-
switch: { value: 'pointer' },
|
12
|
-
})
|
@@ -1,11 +0,0 @@
|
|
1
|
-
import { defineTokens } from '@chakra-ui/react'
|
2
|
-
|
3
|
-
export const durations = defineTokens.durations({
|
4
|
-
fastest: { value: '50ms' },
|
5
|
-
faster: { value: '100ms' },
|
6
|
-
fast: { value: '150ms' },
|
7
|
-
moderate: { value: '200ms' },
|
8
|
-
slow: { value: '300ms' },
|
9
|
-
slower: { value: '400ms' },
|
10
|
-
slowest: { value: '500ms' },
|
11
|
-
})
|
@@ -1,10 +0,0 @@
|
|
1
|
-
import { defineTokens } from '@chakra-ui/react'
|
2
|
-
|
3
|
-
export const easings = defineTokens.easings({
|
4
|
-
'ease-in': { value: 'cubic-bezier(0.42, 0, 1, 1)' },
|
5
|
-
'ease-out': { value: 'cubic-bezier(0, 0, 0.58, 1)' },
|
6
|
-
'ease-in-out': { value: 'cubic-bezier(0.42, 0, 0.58, 1)' },
|
7
|
-
'ease-in-smooth': { value: 'cubic-bezier(0.32, 0.72, 0, 1)' },
|
8
|
-
'bounce-in': { value: 'cubic-bezier(0.34, 1.24, 0.64, 1)' },
|
9
|
-
'bounce-out': { value: 'cubic-bezier(0.34, 1.16, 0.64, 1)' },
|
10
|
-
})
|
@@ -1,20 +0,0 @@
|
|
1
|
-
import { defineTokens } from '@chakra-ui/react'
|
2
|
-
|
3
|
-
import { scaleToken } from '../utils'
|
4
|
-
|
5
|
-
export const fontSizes = defineTokens.fontSizes({
|
6
|
-
'2xs': { value: scaleToken('0.65rem') },
|
7
|
-
xs: { value: scaleToken('0.725rem') },
|
8
|
-
sm: { value: scaleToken('0.875rem') },
|
9
|
-
md: { value: scaleToken('1rem') },
|
10
|
-
lg: { value: scaleToken('1.125rem') },
|
11
|
-
xl: { value: scaleToken('1.25rem') },
|
12
|
-
'2xl': { value: scaleToken('1.5rem') },
|
13
|
-
'3xl': { value: scaleToken('1.875rem') },
|
14
|
-
'4xl': { value: scaleToken('2.25rem') },
|
15
|
-
'5xl': { value: scaleToken('3rem') },
|
16
|
-
'6xl': { value: scaleToken('3.75rem') },
|
17
|
-
'7xl': { value: scaleToken('4.5rem') },
|
18
|
-
'8xl': { value: scaleToken('6rem') },
|
19
|
-
'9xl': { value: scaleToken('8rem') },
|
20
|
-
})
|
@@ -1,13 +0,0 @@
|
|
1
|
-
import { defineTokens } from '@chakra-ui/react'
|
2
|
-
|
3
|
-
export const fontWeights = defineTokens.fontWeights({
|
4
|
-
thin: { value: '100' },
|
5
|
-
extralight: { value: '200' },
|
6
|
-
light: { value: '300' },
|
7
|
-
normal: { value: '400' },
|
8
|
-
medium: { value: '500' },
|
9
|
-
semibold: { value: '600' },
|
10
|
-
bold: { value: '700' },
|
11
|
-
extrabold: { value: '800' },
|
12
|
-
black: { value: '900' },
|
13
|
-
})
|
@@ -1,15 +0,0 @@
|
|
1
|
-
import { defineTokens } from '@chakra-ui/react'
|
2
|
-
|
3
|
-
const fallback = `-apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"`
|
4
|
-
|
5
|
-
export const fonts = defineTokens.fonts({
|
6
|
-
heading: {
|
7
|
-
value: `Inter Variable, Inter, ${fallback}`,
|
8
|
-
},
|
9
|
-
body: {
|
10
|
-
value: `Inter Variable, Inter, ${fallback}`,
|
11
|
-
},
|
12
|
-
mono: {
|
13
|
-
value: `SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace`,
|
14
|
-
},
|
15
|
-
})
|
@@ -1,173 +0,0 @@
|
|
1
|
-
import { defineKeyframes } from '@chakra-ui/react'
|
2
|
-
|
3
|
-
type CssKeyframes = Record<string, Record<string, object>>
|
4
|
-
|
5
|
-
export const keyframes: CssKeyframes = defineKeyframes({
|
6
|
-
spin: {
|
7
|
-
'0%': { transform: 'rotate(0deg)' },
|
8
|
-
'100%': { transform: 'rotate(360deg)' },
|
9
|
-
},
|
10
|
-
|
11
|
-
pulse: {
|
12
|
-
'50%': { opacity: '0.5' },
|
13
|
-
},
|
14
|
-
|
15
|
-
ping: {
|
16
|
-
'75%, 100%': {
|
17
|
-
transform: 'scale(2)',
|
18
|
-
opacity: '0',
|
19
|
-
},
|
20
|
-
},
|
21
|
-
|
22
|
-
bounce: {
|
23
|
-
'0%, 100%': {
|
24
|
-
transform: 'translateY(-25%)',
|
25
|
-
animationTimingFunction: 'cubic-bezier(0.8,0,1,1)',
|
26
|
-
},
|
27
|
-
'50%': {
|
28
|
-
transform: 'none',
|
29
|
-
animationTimingFunction: 'cubic-bezier(0,0,0.2,1)',
|
30
|
-
},
|
31
|
-
},
|
32
|
-
|
33
|
-
'bg-position': {
|
34
|
-
from: { backgroundPosition: 'var(--animate-from, 1rem) 0' },
|
35
|
-
to: { backgroundPosition: 'var(--animate-to, 0) 0' },
|
36
|
-
},
|
37
|
-
|
38
|
-
position: {
|
39
|
-
from: {
|
40
|
-
insetInlineStart: 'var(--animate-from-x)',
|
41
|
-
insetBlockStart: 'var(--animate-from-y)',
|
42
|
-
},
|
43
|
-
to: {
|
44
|
-
insetInlineStart: 'var(--animate-to-x)',
|
45
|
-
insetBlockStart: 'var(--animate-to-y)',
|
46
|
-
},
|
47
|
-
},
|
48
|
-
|
49
|
-
'circular-progress': {
|
50
|
-
'0%': {
|
51
|
-
strokeDasharray: '1, 400',
|
52
|
-
strokeDashoffset: '0',
|
53
|
-
},
|
54
|
-
'50%': {
|
55
|
-
strokeDasharray: '400, 400',
|
56
|
-
strokeDashoffset: '-100%',
|
57
|
-
},
|
58
|
-
'100%': {
|
59
|
-
strokeDasharray: '400, 400',
|
60
|
-
strokeDashoffset: '-260%',
|
61
|
-
},
|
62
|
-
},
|
63
|
-
|
64
|
-
// collapse
|
65
|
-
'expand-height': {
|
66
|
-
from: { height: '0' },
|
67
|
-
to: { height: 'var(--height)' },
|
68
|
-
},
|
69
|
-
'collapse-height': {
|
70
|
-
from: { height: 'var(--height)' },
|
71
|
-
to: { height: '0' },
|
72
|
-
},
|
73
|
-
'expand-width': {
|
74
|
-
from: { width: '0' },
|
75
|
-
to: { width: 'var(--width)' },
|
76
|
-
},
|
77
|
-
'collapse-width': {
|
78
|
-
from: { height: 'var(--width)' },
|
79
|
-
to: { height: '0' },
|
80
|
-
},
|
81
|
-
|
82
|
-
// fade
|
83
|
-
'fade-in': {
|
84
|
-
from: { opacity: 0 },
|
85
|
-
to: { opacity: 1 },
|
86
|
-
},
|
87
|
-
'fade-out': {
|
88
|
-
from: { opacity: 1 },
|
89
|
-
to: { opacity: 0 },
|
90
|
-
},
|
91
|
-
|
92
|
-
// slide from (full)
|
93
|
-
'slide-from-left-full': {
|
94
|
-
from: { translate: '-100% 0' },
|
95
|
-
to: { translate: '0 0' },
|
96
|
-
},
|
97
|
-
'slide-from-right-full': {
|
98
|
-
from: { translate: '100% 0' },
|
99
|
-
to: { translate: '0 0' },
|
100
|
-
},
|
101
|
-
'slide-from-top-full': {
|
102
|
-
from: { translate: '0 -100%' },
|
103
|
-
to: { translate: '0 0' },
|
104
|
-
},
|
105
|
-
'slide-from-bottom-full': {
|
106
|
-
from: { translate: '0 100%' },
|
107
|
-
to: { translate: '0 0' },
|
108
|
-
},
|
109
|
-
|
110
|
-
// slide to (full)
|
111
|
-
'slide-to-left-full': {
|
112
|
-
from: { translate: '0 0' },
|
113
|
-
to: { translate: '-100% 0' },
|
114
|
-
},
|
115
|
-
'slide-to-right-full': {
|
116
|
-
from: { translate: '0 0' },
|
117
|
-
to: { translate: '100% 0' },
|
118
|
-
},
|
119
|
-
'slide-to-top-full': {
|
120
|
-
from: { translate: '0 0' },
|
121
|
-
to: { translate: '0 -100%' },
|
122
|
-
},
|
123
|
-
'slide-to-bottom-full': {
|
124
|
-
from: { translate: '0 0' },
|
125
|
-
to: { translate: '0 100%' },
|
126
|
-
},
|
127
|
-
|
128
|
-
// slide from
|
129
|
-
'slide-from-top': {
|
130
|
-
'0%': { translate: '0 -0.5rem' },
|
131
|
-
to: { translate: '0' },
|
132
|
-
},
|
133
|
-
'slide-from-bottom': {
|
134
|
-
'0%': { translate: '0 0.5rem' },
|
135
|
-
to: { translate: '0' },
|
136
|
-
},
|
137
|
-
'slide-from-left': {
|
138
|
-
'0%': { translate: '-0.5rem 0' },
|
139
|
-
to: { translate: '0' },
|
140
|
-
},
|
141
|
-
'slide-from-right': {
|
142
|
-
'0%': { translate: '0.5rem 0' },
|
143
|
-
to: { translate: '0' },
|
144
|
-
},
|
145
|
-
|
146
|
-
// slide to
|
147
|
-
'slide-to-top': {
|
148
|
-
'0%': { translate: '0' },
|
149
|
-
to: { translate: '0 -0.5rem' },
|
150
|
-
},
|
151
|
-
'slide-to-bottom': {
|
152
|
-
'0%': { translate: '0' },
|
153
|
-
to: { translate: '0 0.5rem' },
|
154
|
-
},
|
155
|
-
'slide-to-left': {
|
156
|
-
'0%': { translate: '0' },
|
157
|
-
to: { translate: '-0.5rem 0' },
|
158
|
-
},
|
159
|
-
'slide-to-right': {
|
160
|
-
'0%': { translate: '0' },
|
161
|
-
to: { translate: '0.5rem 0' },
|
162
|
-
},
|
163
|
-
|
164
|
-
// scale
|
165
|
-
'scale-in': {
|
166
|
-
from: { scale: '0.95' },
|
167
|
-
to: { scale: '1' },
|
168
|
-
},
|
169
|
-
'scale-out': {
|
170
|
-
from: { scale: '1' },
|
171
|
-
to: { scale: '0.95' },
|
172
|
-
},
|
173
|
-
})
|
@@ -1,9 +0,0 @@
|
|
1
|
-
import { defineTokens } from '@chakra-ui/react'
|
2
|
-
|
3
|
-
export const letterSpacings = defineTokens.letterSpacings({
|
4
|
-
tighter: { value: '-0.05em' },
|
5
|
-
tight: { value: '-0.025em' },
|
6
|
-
wide: { value: '0.025em' },
|
7
|
-
wider: { value: '0.05em' },
|
8
|
-
widest: { value: '0.1em' },
|
9
|
-
})
|
@@ -1,19 +0,0 @@
|
|
1
|
-
import { defineTokens } from '@chakra-ui/react'
|
2
|
-
|
3
|
-
import { scaleToken } from '../utils'
|
4
|
-
|
5
|
-
export const lineHeights = defineTokens.lineHeights({
|
6
|
-
shorter: { value: scaleToken('1.25') },
|
7
|
-
short: { value: scaleToken('1.375') },
|
8
|
-
moderate: { value: scaleToken('1.5') },
|
9
|
-
tall: { value: scaleToken('1.625') },
|
10
|
-
taller: { value: scaleToken('2') },
|
11
|
-
'3': { value: scaleToken('0.75rem') },
|
12
|
-
'4': { value: scaleToken('1rem') },
|
13
|
-
'5': { value: scaleToken('1.25rem') },
|
14
|
-
'6': { value: scaleToken('1.5rem') },
|
15
|
-
'7': { value: scaleToken('1.75rem') },
|
16
|
-
'8': { value: scaleToken('2rem') },
|
17
|
-
'9': { value: scaleToken('2.25rem') },
|
18
|
-
'10': { value: scaleToken('2.5rem') },
|
19
|
-
})
|
@@ -1,18 +0,0 @@
|
|
1
|
-
import { defineTokens } from '@chakra-ui/react'
|
2
|
-
|
3
|
-
import { radiusToken } from '../utils'
|
4
|
-
|
5
|
-
export const radii = defineTokens.radii({
|
6
|
-
'2xs': {
|
7
|
-
value: radiusToken('0.0625rem'),
|
8
|
-
},
|
9
|
-
xs: { value: radiusToken('0.125rem') },
|
10
|
-
sm: { value: radiusToken('0.25rem') },
|
11
|
-
md: { value: radiusToken('0.375rem') },
|
12
|
-
lg: { value: radiusToken('0.5rem') },
|
13
|
-
xl: { value: radiusToken('0.75rem') },
|
14
|
-
'2xl': { value: radiusToken('1rem') },
|
15
|
-
'3xl': { value: radiusToken('1.5rem') },
|
16
|
-
'4xl': { value: radiusToken('2rem') },
|
17
|
-
full: { value: 'var(--radius-full)' },
|
18
|
-
})
|