@yamada-ui/react 2.1.5 → 2.1.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +3 -20
- package/dist/cjs/core/css/utils.cjs +4 -0
- package/dist/cjs/core/css/utils.cjs.map +1 -1
- package/dist/cjs/core/system/var.cjs +2 -1
- package/dist/cjs/core/system/var.cjs.map +1 -1
- package/dist/esm/core/css/utils.js +4 -1
- package/dist/esm/core/css/utils.js.map +1 -1
- package/dist/esm/core/system/var.js +3 -2
- package/dist/esm/core/system/var.js.map +1 -1
- package/dist/types/components/accordion/accordion.d.ts +4 -2
- package/dist/types/components/accordion/use-accordion.d.ts +11 -11
- package/dist/types/components/airy/airy.d.ts +3 -2
- package/dist/types/components/alert/alert.d.ts +5 -2
- package/dist/types/components/alert/alert.style.d.ts +1 -1
- package/dist/types/components/alpha-slider/alpha-slider.d.ts +3 -2
- package/dist/types/components/aspect-ratio/aspect-ratio.d.ts +2 -2
- package/dist/types/components/autocomplete/autocomplete.d.ts +4 -2
- package/dist/types/components/autocomplete/autocomplete.style.d.ts +1 -1
- package/dist/types/components/autocomplete/use-autocomplete.d.ts +7 -5
- package/dist/types/components/avatar/avatar.d.ts +5 -5
- package/dist/types/components/avatar/use-avatar-group.d.ts +2 -2
- package/dist/types/components/badge/badge.d.ts +2 -2
- package/dist/types/components/bleed/bleed.d.ts +2 -2
- package/dist/types/components/blockquote/blockquote.d.ts +2 -2
- package/dist/types/components/breadcrumb/breadcrumb.d.ts +2 -2
- package/dist/types/components/breadcrumb/breadcrumb.style.d.ts +1 -1
- package/dist/types/components/breadcrumb/use-breadcrumb.d.ts +2 -2
- package/dist/types/components/button/button-group.d.ts +1 -0
- package/dist/types/components/button/button.d.ts +3 -2
- package/dist/types/components/button/icon-button.d.ts +2 -2
- package/dist/types/components/calendar/calendar.d.ts +3 -2
- package/dist/types/components/calendar/calendar.style.d.ts +2 -2
- package/dist/types/components/calendar/use-calendar.d.ts +9 -8
- package/dist/types/components/card/card.d.ts +2 -2
- package/dist/types/components/carousel/carousel.d.ts +3 -2
- package/dist/types/components/carousel/carousel.style.d.ts +2 -2
- package/dist/types/components/carousel/use-carousel.d.ts +3 -3
- package/dist/types/components/center/center.d.ts +2 -2
- package/dist/types/components/chart/cartesian-chart.style.d.ts +1 -1
- package/dist/types/components/chart/chart.d.ts +5 -5
- package/dist/types/components/chart/pie-chart.d.ts +2 -2
- package/dist/types/components/chart/polar-chart.style.d.ts +1 -1
- package/dist/types/components/chart/radar-chart.d.ts +2 -2
- package/dist/types/components/chart/use-chart.d.ts +2 -2
- package/dist/types/components/checkbox/checkbox-group.d.ts +2 -0
- package/dist/types/components/checkbox/checkbox.d.ts +5 -4
- package/dist/types/components/checkbox/use-checkbox-group.d.ts +3 -2
- package/dist/types/components/checkbox/use-checkbox.d.ts +1 -0
- package/dist/types/components/checkbox-card/checkbox-card-group.d.ts +3 -0
- package/dist/types/components/checkbox-card/checkbox-card.d.ts +7 -5
- package/dist/types/components/checkbox-card/checkbox-card.style.d.ts +1 -1
- package/dist/types/components/circle-progress/circle-progress.d.ts +3 -2
- package/dist/types/components/close-button/close-button.d.ts +3 -2
- package/dist/types/components/code/code.d.ts +2 -2
- package/dist/types/components/collapse/collapse.d.ts +3 -2
- package/dist/types/components/color-picker/color-picker.d.ts +6 -2
- package/dist/types/components/color-picker/color-picker.style.d.ts +1 -1
- package/dist/types/components/color-picker/use-color-picker.d.ts +5 -2
- package/dist/types/components/color-selector/color-selector.d.ts +6 -2
- package/dist/types/components/color-selector/color-selector.style.d.ts +2 -2
- package/dist/types/components/color-selector/use-color-selector.d.ts +5 -3
- package/dist/types/components/color-swatch/color-swatch.d.ts +2 -2
- package/dist/types/components/container/container.d.ts +2 -2
- package/dist/types/components/data-list/data-list.d.ts +2 -2
- package/dist/types/components/data-list/data-list.style.d.ts +1 -1
- package/dist/types/components/date-picker/date-picker.d.ts +5 -2
- package/dist/types/components/date-picker/date-picker.style.d.ts +1 -1
- package/dist/types/components/date-picker/use-date-picker.d.ts +7 -4
- package/dist/types/components/drawer/drawer.d.ts +5 -2
- package/dist/types/components/drawer/use-drawer.d.ts +2 -0
- package/dist/types/components/dropzone/dropzone.d.ts +8 -5
- package/dist/types/components/dropzone/dropzone.style.d.ts +1 -1
- package/dist/types/components/dropzone/use-dropzone.d.ts +1 -0
- package/dist/types/components/editable/editable.d.ts +5 -4
- package/dist/types/components/editable/use-editable.d.ts +3 -2
- package/dist/types/components/em/em.d.ts +2 -2
- package/dist/types/components/empty-state/empty-state.d.ts +2 -2
- package/dist/types/components/empty-state/empty-state.style.d.ts +2 -2
- package/dist/types/components/fade/fade.d.ts +3 -2
- package/dist/types/components/fade-scale/fade-scale.d.ts +1 -0
- package/dist/types/components/field/field.d.ts +3 -3
- package/dist/types/components/field/use-field-props.d.ts +3 -3
- package/dist/types/components/fieldset/fieldset.d.ts +4 -3
- package/dist/types/components/file-button/file-button.d.ts +4 -2
- package/dist/types/components/file-button/use-file-button.d.ts +20 -18
- package/dist/types/components/file-input/file-input.d.ts +4 -2
- package/dist/types/components/file-input/use-file-input.d.ts +18 -17
- package/dist/types/components/flex/flex.d.ts +2 -2
- package/dist/types/components/flip/flip.d.ts +5 -4
- package/dist/types/components/float/float.d.ts +2 -2
- package/dist/types/components/form/form.d.ts +4 -3
- package/dist/types/components/form/form.style.d.ts +1 -1
- package/dist/types/components/format/format-byte.d.ts +2 -2
- package/dist/types/components/format/format-date-time.d.ts +4 -4
- package/dist/types/components/format/format-number.d.ts +2 -2
- package/dist/types/components/format/use-format-byte.d.ts +1 -0
- package/dist/types/components/format/use-format-date-time.d.ts +1 -0
- package/dist/types/components/format/use-format-number.d.ts +1 -0
- package/dist/types/components/grid/grid-item.d.ts +2 -2
- package/dist/types/components/grid/grid.d.ts +2 -2
- package/dist/types/components/group/group.d.ts +3 -2
- package/dist/types/components/group/use-group.d.ts +2 -2
- package/dist/types/components/heading/heading.d.ts +2 -2
- package/dist/types/components/highlight/highlight.d.ts +2 -0
- package/dist/types/components/hue-slider/hue-slider.d.ts +4 -3
- package/dist/types/components/icon/icon.d.ts +5 -5
- package/dist/types/components/image/image.d.ts +2 -2
- package/dist/types/components/indicator/indicator.d.ts +5 -4
- package/dist/types/components/infinite-scroll-area/infinite-scroll-area.d.ts +2 -2
- package/dist/types/components/input/input-addon.d.ts +2 -2
- package/dist/types/components/input/input-element.d.ts +2 -2
- package/dist/types/components/input/input-group.d.ts +2 -0
- package/dist/types/components/input/input.d.ts +3 -2
- package/dist/types/components/kbd/kbd.d.ts +2 -2
- package/dist/types/components/link/link.d.ts +2 -2
- package/dist/types/components/link-box/link-box.d.ts +2 -2
- package/dist/types/components/list/list.d.ts +2 -2
- package/dist/types/components/loading/loading-provider.d.ts +2 -2
- package/dist/types/components/loading/loading.d.ts +4 -3
- package/dist/types/components/loading/use-loading-component.d.ts +1 -0
- package/dist/types/components/mark/mark.d.ts +2 -2
- package/dist/types/components/menu/menu.d.ts +3 -2
- package/dist/types/components/menu/menu.style.d.ts +2 -2
- package/dist/types/components/menu/use-menu.d.ts +11 -11
- package/dist/types/components/modal/modal.d.ts +6 -2
- package/dist/types/components/native-accordion/native-accordion.d.ts +2 -2
- package/dist/types/components/native-accordion/use-native-accordion.d.ts +2 -2
- package/dist/types/components/native-popover/native-popover.d.ts +2 -2
- package/dist/types/components/native-select/native-select.d.ts +4 -2
- package/dist/types/components/native-select/use-native-select.d.ts +1 -0
- package/dist/types/components/native-table/native-table.d.ts +4 -4
- package/dist/types/components/notice/use-notice.d.ts +3 -0
- package/dist/types/components/number-input/number-input.d.ts +3 -2
- package/dist/types/components/number-input/number-input.style.d.ts +1 -1
- package/dist/types/components/number-input/use-number-input.d.ts +1 -0
- package/dist/types/components/pagination/pagination.d.ts +3 -2
- package/dist/types/components/pagination/use-pagination.d.ts +2 -2
- package/dist/types/components/password-input/password-input.d.ts +3 -2
- package/dist/types/components/password-input/strength-meter.d.ts +2 -2
- package/dist/types/components/password-input/use-password-input.d.ts +3 -2
- package/dist/types/components/picture/picture.d.ts +1 -0
- package/dist/types/components/pin-input/pin-input.d.ts +4 -2
- package/dist/types/components/pin-input/use-pin-input.d.ts +8 -7
- package/dist/types/components/popover/popover.d.ts +3 -2
- package/dist/types/components/progress/progress.d.ts +4 -4
- package/dist/types/components/progress/use-progress.d.ts +706 -706
- package/dist/types/components/qr-code/qr-code.d.ts +2 -2
- package/dist/types/components/radio/radio-group.d.ts +2 -0
- package/dist/types/components/radio/radio.d.ts +5 -4
- package/dist/types/components/radio/use-radio-group.d.ts +3 -2
- package/dist/types/components/radio/use-radio.d.ts +1 -0
- package/dist/types/components/radio-card/radio-card-group.d.ts +3 -0
- package/dist/types/components/radio-card/radio-card.d.ts +7 -5
- package/dist/types/components/radio-card/radio-card.style.d.ts +1 -1
- package/dist/types/components/rating/rating.style.d.ts +2 -2
- package/dist/types/components/rating/use-rating.d.ts +8 -7
- package/dist/types/components/reorder/reorder.d.ts +3 -2
- package/dist/types/components/reorder/use-reorder.d.ts +3 -3
- package/dist/types/components/resizable/resizable.d.ts +2 -2
- package/dist/types/components/resizable/use-resizable.d.ts +2 -2
- package/dist/types/components/ripple/ripple.d.ts +3 -2
- package/dist/types/components/ripple/use-ripple.d.ts +2 -2
- package/dist/types/components/rotate/rotate.d.ts +3 -2
- package/dist/types/components/saturation-slider/saturation-slider.d.ts +2 -2
- package/dist/types/components/saturation-slider/use-saturation-slider.d.ts +3 -2
- package/dist/types/components/scroll-area/scroll-area.d.ts +2 -2
- package/dist/types/components/segmented-control/segmented-control.d.ts +3 -2
- package/dist/types/components/segmented-control/segmented-control.style.d.ts +2 -2
- package/dist/types/components/segmented-control/use-segmented-control.d.ts +10 -9
- package/dist/types/components/select/select.d.ts +4 -2
- package/dist/types/components/select/select.style.d.ts +1 -1
- package/dist/types/components/select/use-select.d.ts +6 -4
- package/dist/types/components/separator/separator.d.ts +2 -2
- package/dist/types/components/simple-grid/simple-grid.d.ts +3 -2
- package/dist/types/components/skeleton/skeleton.d.ts +2 -2
- package/dist/types/components/slide/slide.d.ts +3 -2
- package/dist/types/components/slide-fade/slide-fade.d.ts +3 -2
- package/dist/types/components/slider/slider.d.ts +2 -2
- package/dist/types/components/slider/use-slider.d.ts +3 -2
- package/dist/types/components/snacks/snacks.d.ts +2 -0
- package/dist/types/components/snacks/use-snacks.d.ts +1 -0
- package/dist/types/components/stack/h-stack.d.ts +2 -2
- package/dist/types/components/stack/stack.d.ts +2 -2
- package/dist/types/components/stack/v-stack.d.ts +2 -2
- package/dist/types/components/stack/z-stack.d.ts +2 -2
- package/dist/types/components/stat/stat.d.ts +2 -2
- package/dist/types/components/status/status.d.ts +2 -2
- package/dist/types/components/steps/steps.d.ts +2 -2
- package/dist/types/components/steps/steps.style.d.ts +1 -1
- package/dist/types/components/steps/use-steps.d.ts +10 -10
- package/dist/types/components/switch/switch.d.ts +2 -2
- package/dist/types/components/switch/use-switch.d.ts +1 -0
- package/dist/types/components/table/table.d.ts +4 -2
- package/dist/types/components/tabs/tabs.d.ts +2 -2
- package/dist/types/components/tabs/tabs.style.d.ts +1 -1
- package/dist/types/components/tabs/use-tabs.d.ts +16 -16
- package/dist/types/components/tag/tag.d.ts +2 -2
- package/dist/types/components/text/text.d.ts +2 -2
- package/dist/types/components/textarea/textarea.d.ts +4 -2
- package/dist/types/components/textarea/use-autosize.d.ts +2 -2
- package/dist/types/components/timeline/timeline.d.ts +5 -5
- package/dist/types/components/timeline/timeline.style.d.ts +2 -2
- package/dist/types/components/tip/tip.d.ts +2 -0
- package/dist/types/components/toggle/toggle-group.d.ts +1 -1
- package/dist/types/components/toggle/toggle.d.ts +7 -5
- package/dist/types/components/toggle/use-toggle-group.d.ts +2 -2
- package/dist/types/components/toggle/use-toggle.d.ts +3 -2
- package/dist/types/components/tooltip/tooltip.d.ts +4 -2
- package/dist/types/components/visually-hidden/visually-hidden.d.ts +2 -2
- package/dist/types/components/wrap/wrap.d.ts +3 -2
- package/dist/types/core/components/create-component.d.ts +7 -8
- package/dist/types/core/components/index.types.d.ts +0 -1
- package/dist/types/core/components/use-component-style.d.ts +0 -1
- package/dist/types/core/css/utils.d.ts +0 -1
- package/dist/types/core/index.d.ts +0 -1
- package/dist/types/core/system/color-mode-provider.d.ts +2 -2
- package/dist/types/core/system/config.d.ts +0 -1
- package/dist/types/core/system/create-system.d.ts +0 -1
- package/dist/types/core/system/factory.d.ts +0 -1
- package/dist/types/core/system/index.types.d.ts +0 -1
- package/dist/types/core/system/storage-script.d.ts +3 -3
- package/dist/types/core/system/styled.d.ts +2 -3
- package/dist/types/core/system/system-provider.d.ts +2 -2
- package/dist/types/core/system/var.d.ts +0 -1
- package/dist/types/hooks/use-async-callback/index.d.ts +1 -0
- package/dist/types/hooks/use-breakpoint/use-breakpoint-state.d.ts +2 -2
- package/dist/types/hooks/use-clickable/index.d.ts +9 -9
- package/dist/types/hooks/use-combobox/index.d.ts +1 -0
- package/dist/types/hooks/use-descendants/index.d.ts +2 -2
- package/dist/types/hooks/use-field-sizing/index.d.ts +2 -2
- package/dist/types/hooks/use-hover/index.d.ts +2 -2
- package/dist/types/hooks/use-popper/index.d.ts +2 -2
- package/dist/types/hooks/use-resize-observer/index.d.ts +3 -3
- package/dist/types/index.d.ts +103 -0
- package/dist/types/providers/i18n-provider/i18n-provider.d.ts +3 -3
- package/dist/types/providers/ui-provider/ui-provider.d.ts +3 -2
- package/package.json +25 -6
package/README.md
CHANGED
|
@@ -1,23 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
<img src="https://raw.githubusercontent.com/yamada-ui/yamada-ui/main/logo/logo-colored@2x.png" alt="Yamada UI" width="480" />
|
|
3
|
-
</p>
|
|
4
|
-
|
|
5
|
-
<p align="center">
|
|
6
|
-
<a href="https://www.npmjs.com/package/@yamada-ui/react">
|
|
7
|
-
<img alt="MIT License" src="https://img.shields.io/npm/v/@yamada-ui/react"/>
|
|
8
|
-
</a>
|
|
9
|
-
<img alt="NPM Downloads" src="https://img.shields.io/npm/dm/@yamada-ui/react.svg?style=flat"/>
|
|
10
|
-
<a href="https://codecov.io/gh/yamada-ui/yamada-ui" >
|
|
11
|
-
<img src="https://codecov.io/gh/yamada-ui/yamada-ui/graph/badge.svg?token=LRQMRQNE7N"/>
|
|
12
|
-
</a>
|
|
13
|
-
<a href="https://github.com/yamada-ui/yamada-ui/blob/main/LICENSE">
|
|
14
|
-
<img alt="MIT License" src="https://img.shields.io/github/license/yamada-ui/yamada-ui"/>
|
|
15
|
-
</a>
|
|
16
|
-
<img alt="Github Stars" src="https://img.shields.io/github/stars/yamada-ui/yamada-ui" />
|
|
17
|
-
<a href="https://discord.gg/H7V5RfEDTR">
|
|
18
|
-
<img alt="MIT License" src="https://img.shields.io/badge/Chat%20on-Discord-%235865f2"/>
|
|
19
|
-
</a>
|
|
20
|
-
</p>
|
|
1
|
+
# Yamada UI
|
|
21
2
|
|
|
22
3
|
Yamada UI provides a design system that delivers beautiful, consistent, accessible components and advanced styling. Bring your ideas to life.
|
|
23
4
|
|
|
@@ -45,6 +26,8 @@ Please support this project with you or your organization. Your logo will appear
|
|
|
45
26
|
|
|
46
27
|
<a href="https://opencollective.com/yamada-ui"><img src="https://opencollective.com/yamada-ui/organizations.svg?avatarHeight=40&button=false" /></a>
|
|
47
28
|
|
|
29
|
+
<a href="https://vercel.com/oss"><img alt="Vercel OSS Program" src="https://vercel.com/oss/program-badge.svg" /></a>
|
|
30
|
+
|
|
48
31
|
### Individuals
|
|
49
32
|
|
|
50
33
|
<a href="https://opencollective.com/yamada-ui"><img src="https://opencollective.com/yamada-ui/individuals.svg?avatarHeight=40" /></a>
|
|
@@ -42,6 +42,9 @@ function splitValues(values, cb = (current) => current === ",", addSeparator = f
|
|
|
42
42
|
function isCSSVar(value) {
|
|
43
43
|
return /^var\(--.+\)$/.test(value);
|
|
44
44
|
}
|
|
45
|
+
function isInterpolation(value) {
|
|
46
|
+
return /\{.+\}/.test(value);
|
|
47
|
+
}
|
|
45
48
|
function isCSSToken({ cssMap }) {
|
|
46
49
|
return function(value) {
|
|
47
50
|
return (0, require_utils_index.utils_exports.isObject)(cssMap) && value in cssMap && !!cssMap[value]?.ref;
|
|
@@ -113,6 +116,7 @@ exports.isCSSFunction = isCSSFunction;
|
|
|
113
116
|
exports.isCSSToken = isCSSToken;
|
|
114
117
|
exports.isCSSVar = isCSSVar;
|
|
115
118
|
exports.isImportant = isImportant;
|
|
119
|
+
exports.isInterpolation = isInterpolation;
|
|
116
120
|
exports.omitImportant = omitImportant;
|
|
117
121
|
exports.pipe = pipe;
|
|
118
122
|
exports.splitValues = splitValues;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.cjs","names":["value","isColorScheme","getColorSchemeVar"],"sources":["../../../../src/core/css/utils.ts"],"sourcesContent":["import type { Dict } from \"../../utils\"\nimport type { ColorMode, System, ThemeToken, UsageTheme } from \"../system\"\nimport type { StyleConfig } from \"./config\"\nimport type { CSSFunction, CSSProperties } from \"./index.types\"\nimport { isObject, isString, isUndefined } from \"../../utils\"\nimport { getColorSchemeVar, isColorScheme } from \"../system\"\n\nexport interface TransformOptions {\n system: System\n css?: CSSFunction\n fallback?: any\n prev?: Dict\n properties?: CSSProperties[]\n theme?: UsageTheme\n}\n\nexport interface Transform {\n (value: any, options: TransformOptions): any\n}\n\nexport const globalValues = new Set([\n \"inherit\",\n \"initial\",\n \"none\",\n \"revert\",\n \"unset\",\n])\n\nexport function isCSSFunction(value: any) {\n return isString(value) && value.includes(\"(\") && value.includes(\")\")\n}\n\nexport function getCSSFunction(value: any) {\n const regex = /(^[a-z-A-Z]+)\\((.*)\\)/g\n const [, type, values] = regex.exec(value) ?? []\n\n return { type, values }\n}\n\nexport function splitValues(\n values: string,\n cb: (\n current: string,\n prev: string | undefined,\n next: string | undefined,\n ) => boolean = (current) => current === \",\",\n addSeparator = false,\n) {\n const result = []\n\n let value = \"\"\n let depth = 0\n\n for (let i = 0; i < values.length; i++) {\n const current = values[i]\n const prev = values[i - 1]\n const next = values[i + 1]\n\n if (current === \"(\") depth++\n if (current === \")\") depth--\n\n if (!isUndefined(current) && cb(current, prev, next) && depth === 0) {\n if (value) result.push(value.trim())\n\n if (addSeparator) result.push(current)\n\n value = \"\"\n } else {\n value += current\n }\n }\n\n if (value) result.push(value.trim())\n\n return result.filter(Boolean)\n}\n\nexport function isCSSVar(value: string) {\n return /^var\\(--.+\\)$/.test(value)\n}\n\nexport function isCSSToken({ cssMap }: System) {\n return function (value: any) {\n return isObject(cssMap) && value in cssMap && !!cssMap[value]?.ref\n }\n}\n\nexport function isImportant(value: any): boolean {\n return (\n isString(value) && (/\\s*!important$/.test(value) || /\\s*!$/.test(value))\n )\n}\n\nexport function omitImportant(value: any): string {\n return isString(value) ? value.replace(/(!important|!)$/, \"\").trim() : value\n}\n\nexport function insertImportant(value: any, style?: StyleConfig): any {\n if (isString(value)) {\n return value + \" !important\"\n } else if (isObject(value)) {\n if (style?.important) {\n return Object.fromEntries(\n Object.entries(value).map(([key, value]) => [\n key,\n value + \" !important\",\n ]),\n )\n } else {\n if (!style?.properties) return value\n\n for (const property of style.properties) {\n value[property] += \" !important\"\n }\n }\n }\n\n return value\n}\n\nexport function analyzeCSSValue(value: any) {\n let n = parseFloat(value.toString())\n const unit = value.toString().replace(String(n), \"\")\n\n return { unit, unitless: !unit, value }\n}\n\nexport function tokenToVar(system: System) {\n return function (token: ThemeToken, value: any, fallbackValue?: any) {\n if (isColorScheme(value)) return getColorSchemeVar(system)(value)\n\n const resolvedToken = `${token}.${value}`\n\n if (isCSSToken(system)(resolvedToken)) {\n return system.cssMap[resolvedToken]!.ref\n } else {\n return fallbackValue || value\n }\n }\n}\n\nexport function varToValue(system: System) {\n return function (variable: string): string {\n const value = system.cssVars[variable]\n\n if (isCSSVar(value)) {\n return varToValue(system)(value.replace(/^var\\(/, \"\").replace(/\\)$/, \"\"))\n } else {\n return value\n }\n }\n}\n\nexport function tokenToValue(system: System) {\n return function (token: ThemeToken, value: any, fallbackValue?: any) {\n const resolvedToken = `${token}.${value}`\n\n if (isCSSToken(system)(resolvedToken)) {\n const variable = system.cssMap[resolvedToken]!.var\n\n return varToValue(system)(variable)\n } else {\n return fallbackValue || value\n }\n }\n}\n\nexport function mode<L, D>(light: L, dark: D) {\n return function (colorMode: ColorMode | undefined = \"light\"): D | L {\n return colorMode === \"light\" ? light : dark\n }\n}\n\nfunction combineFunctions(a: Transform, b: Transform): Transform {\n return function (value, ...args) {\n return b(a(value, ...args), ...args)\n }\n}\n\nexport function pipe(...transformers: Transform[]) {\n return transformers.reduce(combineFunctions)\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"utils.cjs","names":["value","isColorScheme","getColorSchemeVar"],"sources":["../../../../src/core/css/utils.ts"],"sourcesContent":["import type { Dict } from \"../../utils\"\nimport type { ColorMode, System, ThemeToken, UsageTheme } from \"../system\"\nimport type { StyleConfig } from \"./config\"\nimport type { CSSFunction, CSSProperties } from \"./index.types\"\nimport { isObject, isString, isUndefined } from \"../../utils\"\nimport { getColorSchemeVar, isColorScheme } from \"../system\"\n\nexport interface TransformOptions {\n system: System\n css?: CSSFunction\n fallback?: any\n prev?: Dict\n properties?: CSSProperties[]\n theme?: UsageTheme\n}\n\nexport interface Transform {\n (value: any, options: TransformOptions): any\n}\n\nexport const globalValues = new Set([\n \"inherit\",\n \"initial\",\n \"none\",\n \"revert\",\n \"unset\",\n])\n\nexport function isCSSFunction(value: any) {\n return isString(value) && value.includes(\"(\") && value.includes(\")\")\n}\n\nexport function getCSSFunction(value: any) {\n const regex = /(^[a-z-A-Z]+)\\((.*)\\)/g\n const [, type, values] = regex.exec(value) ?? []\n\n return { type, values }\n}\n\nexport function splitValues(\n values: string,\n cb: (\n current: string,\n prev: string | undefined,\n next: string | undefined,\n ) => boolean = (current) => current === \",\",\n addSeparator = false,\n) {\n const result = []\n\n let value = \"\"\n let depth = 0\n\n for (let i = 0; i < values.length; i++) {\n const current = values[i]\n const prev = values[i - 1]\n const next = values[i + 1]\n\n if (current === \"(\") depth++\n if (current === \")\") depth--\n\n if (!isUndefined(current) && cb(current, prev, next) && depth === 0) {\n if (value) result.push(value.trim())\n\n if (addSeparator) result.push(current)\n\n value = \"\"\n } else {\n value += current\n }\n }\n\n if (value) result.push(value.trim())\n\n return result.filter(Boolean)\n}\n\nexport function isCSSVar(value: string) {\n return /^var\\(--.+\\)$/.test(value)\n}\n\nexport function isInterpolation(value: string) {\n return /\\{.+\\}/.test(value)\n}\n\nexport function isCSSToken({ cssMap }: System) {\n return function (value: any) {\n return isObject(cssMap) && value in cssMap && !!cssMap[value]?.ref\n }\n}\n\nexport function isImportant(value: any): boolean {\n return (\n isString(value) && (/\\s*!important$/.test(value) || /\\s*!$/.test(value))\n )\n}\n\nexport function omitImportant(value: any): string {\n return isString(value) ? value.replace(/(!important|!)$/, \"\").trim() : value\n}\n\nexport function insertImportant(value: any, style?: StyleConfig): any {\n if (isString(value)) {\n return value + \" !important\"\n } else if (isObject(value)) {\n if (style?.important) {\n return Object.fromEntries(\n Object.entries(value).map(([key, value]) => [\n key,\n value + \" !important\",\n ]),\n )\n } else {\n if (!style?.properties) return value\n\n for (const property of style.properties) {\n value[property] += \" !important\"\n }\n }\n }\n\n return value\n}\n\nexport function analyzeCSSValue(value: any) {\n let n = parseFloat(value.toString())\n const unit = value.toString().replace(String(n), \"\")\n\n return { unit, unitless: !unit, value }\n}\n\nexport function tokenToVar(system: System) {\n return function (token: ThemeToken, value: any, fallbackValue?: any) {\n if (isColorScheme(value)) return getColorSchemeVar(system)(value)\n\n const resolvedToken = `${token}.${value}`\n\n if (isCSSToken(system)(resolvedToken)) {\n return system.cssMap[resolvedToken]!.ref\n } else {\n return fallbackValue || value\n }\n }\n}\n\nexport function varToValue(system: System) {\n return function (variable: string): string {\n const value = system.cssVars[variable]\n\n if (isCSSVar(value)) {\n return varToValue(system)(value.replace(/^var\\(/, \"\").replace(/\\)$/, \"\"))\n } else {\n return value\n }\n }\n}\n\nexport function tokenToValue(system: System) {\n return function (token: ThemeToken, value: any, fallbackValue?: any) {\n const resolvedToken = `${token}.${value}`\n\n if (isCSSToken(system)(resolvedToken)) {\n const variable = system.cssMap[resolvedToken]!.var\n\n return varToValue(system)(variable)\n } else {\n return fallbackValue || value\n }\n }\n}\n\nexport function mode<L, D>(light: L, dark: D) {\n return function (colorMode: ColorMode | undefined = \"light\"): D | L {\n return colorMode === \"light\" ? light : dark\n }\n}\n\nfunction combineFunctions(a: Transform, b: Transform): Transform {\n return function (value, ...args) {\n return b(a(value, ...args), ...args)\n }\n}\n\nexport function pipe(...transformers: Transform[]) {\n return transformers.reduce(combineFunctions)\n}\n"],"mappings":"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"}
|
|
@@ -220,7 +220,8 @@ function injectVars(objOrArray, targets, isInvalidProp) {
|
|
|
220
220
|
const result = [];
|
|
221
221
|
if (target) {
|
|
222
222
|
const { token } = require_css.getStyle(prop) ?? {};
|
|
223
|
-
result.push([`--${target}`,
|
|
223
|
+
if (require_utils.isCSSVar(value) || require_utils.isInterpolation(value)) result.push([`--${target}`, value]);
|
|
224
|
+
else result.push([`--${target}`, token ? `{${token}.${value}, ${value}}` : value]);
|
|
224
225
|
} else if ((0, require_utils_index.utils_exports.isObject)(value)) result.push([prop, injectVars(value, targets)]);
|
|
225
226
|
else result.push([prop, value]);
|
|
226
227
|
return result;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"var.cjs","names":["value","DEFAULT_VAR_PREFIX","system: System","defaultSystem","colorMix","animation","gradient","injectKeyframes","css","conditions","computedValue: DefineThemeValue","resolvedValue: DefineThemeValue | Dict","cssMap: CSSMap","cssVars: Dict","isCSSFunction","objOrArray","result: [string, any][]","getStyle"],"sources":["../../../../src/core/system/var.ts"],"sourcesContent":["import type { Dict } from \"../../utils\"\nimport type { CSSProperties, StyleValueWithCondition } from \"../css\"\nimport type {\n CSSMap,\n DefineThemeValue,\n System,\n ThemeToken,\n UsageTheme,\n VariableTokens,\n VariableValue,\n} from \"../system\"\nimport type { Breakpoints } from \"./breakpoint\"\nimport {\n calc,\n escape,\n isArray,\n isNull,\n isObject,\n isString,\n isUndefined,\n merge,\n replaceObject,\n} from \"../../utils\"\nimport { DEFAULT_VAR_PREFIX } from \"../constant\"\nimport {\n animation,\n colorMix,\n conditions,\n css,\n getStyle,\n gradient,\n injectKeyframes,\n isCSSFunction,\n} from \"../css\"\nimport { defaultSystem } from \"../system\"\n\ntype ParsedValue = number | string | undefined\n\ninterface Variable {\n reference: string\n variable: string\n}\n\nexport function transformInterpolation(\n value: any,\n callback: (value: string, fallbackValue?: string) => string,\n) {\n if (isString(value)) {\n return value.replace(/\\{(.*?)\\}/g, (_, value) => {\n const [token, fallbackValue] = value.split(/,(.+)/)\n\n return callback(token.trim(), fallbackValue?.trim())\n })\n } else {\n return value\n }\n}\n\nexport function getVar(token: string, fallback?: string) {\n if (!token.startsWith(\"--\")) token = `--${token}`\n\n token = token.replace(/[^-_a-zA-Z0-9]/g, \"\")\n\n return fallback ? `var(${token}, ${fallback})` : `var(${token})`\n}\n\nexport function getVarName(system: System) {\n return function (token: string) {\n const prefix = system.config.css?.varPrefix ?? DEFAULT_VAR_PREFIX\n\n return `--${prefix}-${token}`\n }\n}\n\nexport function getColorSchemeVar(system: System) {\n return function (value: any, fallback?: string) {\n if (!isString(value)) return value\n\n const prefix = system.config.css?.varPrefix ?? DEFAULT_VAR_PREFIX\n\n const [, token] = value.split(\".\")\n\n return getVar(`${prefix}-colorScheme-${token}`, fallback)\n }\n}\n\nconst isGradient = (token: string) => token.startsWith(\"gradients.\")\nconst isKeyframes = (token: string) => token.startsWith(\"keyframes.\")\nconst isAnimation = (token: string) => token.startsWith(\"animations.\")\nconst isSpace = (token: string) => token.startsWith(\"spaces.\")\nconst isColor = (token: string) => token.startsWith(\"colors.\")\nexport const isColorScheme = (token: any) =>\n isString(token) && token.startsWith(\"colorScheme.\") && !token.includes(\"/\")\n\nexport function createVars(\n prefix: string = DEFAULT_VAR_PREFIX,\n theme: UsageTheme,\n breakpoints: Breakpoints,\n) {\n return function (tokens: VariableTokens) {\n const { getQuery, isResponsive } = breakpoints\n\n function tokenToVar(token: string): Variable {\n token = token.replace(/\\./g, \"-\")\n token = token.replace(/\\//g, \"\\\\/\")\n\n const variable = `--${[prefix, escape(token, \"-\")].filter(Boolean).join(\"-\")}`\n const reference = `var(${variable})`\n\n return { reference, variable }\n }\n\n return function (\n cssMap: CSSMap = {},\n cssVars: Dict = {},\n prevTokens?: VariableTokens,\n ): { cssMap: CSSMap; cssVars: Dict } {\n const system: System = { ...defaultSystem, cssMap }\n const options = { css, system, theme }\n\n function getRelatedReference(\n token: string,\n value: ParsedValue = \"\",\n ): [ParsedValue, Exclude<ParsedValue, undefined>] {\n const relatedToken = [token.split(\".\")[0], value].join(\".\")\n\n if (token === relatedToken) return [undefined, value]\n\n const targetToken = tokens[relatedToken] ?? prevTokens?.[relatedToken]\n\n if (!targetToken) return [undefined, value]\n\n const { reference, variable } = tokenToVar(relatedToken)\n\n return [variable, reference]\n }\n\n function valueToVar(value: any) {\n return transformInterpolation(value, (value, fallbackValue) => {\n if (value.includes(\"colors.\") || value.includes(\"colorScheme.\")) {\n if (isColorScheme(value)) return getColorSchemeVar(system)(value)\n\n return colorMix(value, { fallback: fallbackValue, system })\n } else {\n const token = tokens[value] ?? prevTokens?.[value]\n\n if (token) {\n return tokenToVar(value).reference\n } else if (value in cssMap && cssMap[value]?.ref) {\n return cssMap[value].ref\n } else if (fallbackValue) {\n fallbackValue =\n fallbackValue in cssMap && cssMap[fallbackValue]?.ref\n ? cssMap[fallbackValue]?.ref\n : fallbackValue\n\n return `var(--${prefix}-${value}, ${fallbackValue})`\n } else {\n return `var(--${prefix}-${value})`\n }\n }\n })\n }\n\n function createNegativeVar(token: string, reference: string) {\n const paths = token.split(\".\")\n const [start, ...rest] = paths\n\n const negativeToken = `${start}.-${rest.join(\".\")}`\n\n const negativeReference = calc.negate(reference)\n\n return { negativeReference, negativeToken }\n }\n\n function createAnimationVar(value: VariableValue) {\n if (isArray(value)) {\n return value.map((value) => animation(value, options)).join(\",\")\n } else {\n return animation(value, options)\n }\n }\n\n function createGradientVar(token: string, value: DefineThemeValue) {\n return function (semantic: boolean) {\n if (!semantic) {\n return gradient(value, options)\n } else {\n const [variable, reference] = getRelatedReference(token, value)\n\n return variable ? reference : gradient(value, options)\n }\n }\n }\n\n function createKeyframesVar(token: string, value: any) {\n return function (semantic: boolean) {\n if (!semantic) {\n return injectKeyframes(css(system, theme)(value))\n } else {\n const [variable, reference] = getRelatedReference(token, value)\n\n return variable\n ? reference\n : injectKeyframes(css(system, theme)(value))\n }\n }\n }\n\n function createColorVar(\n token: string,\n properties: string[],\n value: DefineThemeValue,\n ) {\n return function (semantic: boolean) {\n if (!semantic) {\n return colorMix(value, { ...options, properties })\n } else {\n const [variable, reference] = getRelatedReference(token, value)\n\n return variable\n ? reference\n : colorMix(value, { ...options, properties })\n }\n }\n }\n\n function createVar(\n token: string,\n value: VariableValue,\n variable: string,\n ) {\n return function (semantic: boolean, queries: string[] = []) {\n if (isAnimation(token)) value = createAnimationVar(value)\n\n if (isArray(value)) {\n const [lightValue, darkValue] = value\n\n createVar(token, lightValue, variable)(semantic, queries)\n createVar(\n token,\n darkValue,\n variable,\n )(semantic, [...queries, conditions._dark])\n } else if (isResponsive(value, true)) {\n Object.entries(value).forEach(([key, value]) => {\n if (key === \"base\") {\n createVar(token, value, variable)(semantic, queries)\n } else {\n const query = getQuery(key)\n\n if (!query) return\n\n createVar(token, value, variable)(semantic, [...queries, query])\n }\n })\n } else {\n const computedValue: DefineThemeValue = valueToVar(value)\n\n let resolvedValue: DefineThemeValue | Dict = computedValue\n\n if (isKeyframes(token)) {\n resolvedValue = createKeyframesVar(token, computedValue)(semantic)\n } else if (isGradient(token)) {\n resolvedValue = createGradientVar(token, computedValue)(semantic)\n } else if (isColor(token)) {\n resolvedValue = createColorVar(\n token,\n [variable],\n computedValue,\n )(semantic)\n } else if (semantic) {\n const [, reference] = getRelatedReference(token, computedValue)\n\n resolvedValue = reference\n }\n\n if (!isObject(resolvedValue))\n resolvedValue = { [variable]: resolvedValue }\n\n const resolvedCssVars = queries.reduceRight<Dict>(\n (prev, key) => ({ [key]: prev }),\n resolvedValue,\n )\n\n cssVars = merge(cssVars, resolvedCssVars)\n }\n }\n }\n\n for (let [token, { semantic, value }] of Object.entries(tokens)) {\n const { reference, variable } = tokenToVar(token)\n\n createVar(token, value, variable)(semantic)\n\n if (isSpace(token)) {\n const { negativeReference, negativeToken } = createNegativeVar(\n token,\n reference,\n )\n\n cssMap[negativeToken] = { ref: negativeReference, var: variable }\n }\n\n cssMap[token] = { ref: reference, var: variable }\n }\n\n return { cssMap, cssVars }\n }\n }\n}\n\nexport type CreateVars = ReturnType<ReturnType<typeof createVars>>\n\nexport function mergeVars(...fns: CreateVars[]) {\n return function (prevTokens?: VariableTokens) {\n let cssMap: CSSMap = {}\n let cssVars: Dict = {}\n\n for (const fn of fns) {\n const result = fn(cssMap, cssVars, prevTokens)\n\n cssMap = { ...cssMap, ...result.cssMap }\n cssVars = { ...cssVars, ...result.cssVars }\n }\n\n return { cssMap, cssVars }\n }\n}\n\nexport function varAttr<Y = StyleValueWithCondition<number | string>>(\n value: undefined | Y,\n token?: ThemeToken,\n fallbackValue?: string,\n): undefined | Y {\n if (isUndefined(value) || isNull(value) || isCSSFunction(value)) return value\n\n if (isObject(value) || isArray(value)) {\n return replaceObject(value, (value) => varAttr(value, token, fallbackValue))\n } else {\n return token\n ? (`{${token}.${value}, ${fallbackValue ?? value}}` as Y)\n : value\n }\n}\n\nexport function injectVars<Y extends Dict | Dict[] | undefined>(\n objOrArray: Y,\n targets: { [key in CSSProperties]?: string },\n isInvalidProp?: (prop: string) => boolean,\n): Y {\n if (!objOrArray) return objOrArray\n\n function callback(objOrArray: Dict) {\n return Object.fromEntries(\n Object.entries(objOrArray).flatMap(function ([prop, value]) {\n if (isInvalidProp?.(prop)) return [[prop, value]]\n\n const target = targets[prop]\n const result: [string, any][] = []\n\n if (target) {\n const { token } = getStyle(prop) ?? {}\n\n result.push([\n `--${target}`,\n token ? `{${token}.${value}, ${value}}` : value,\n ])\n } else if (isObject(value)) {\n result.push([prop, injectVars(value, targets)])\n } else {\n result.push([prop, value])\n }\n\n return result\n }),\n )\n }\n\n if (isArray(objOrArray)) {\n return objOrArray.map(callback) as Y\n } else {\n return callback(objOrArray) as Y\n }\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"var.cjs","names":["value","DEFAULT_VAR_PREFIX","system: System","defaultSystem","colorMix","animation","gradient","injectKeyframes","css","conditions","computedValue: DefineThemeValue","resolvedValue: DefineThemeValue | Dict","cssMap: CSSMap","cssVars: Dict","isCSSFunction","objOrArray","result: [string, any][]","getStyle","isCSSVar","isInterpolation"],"sources":["../../../../src/core/system/var.ts"],"sourcesContent":["import type { Dict } from \"../../utils\"\nimport type { CSSProperties, StyleValueWithCondition } from \"../css\"\nimport type {\n CSSMap,\n DefineThemeValue,\n System,\n ThemeToken,\n UsageTheme,\n VariableTokens,\n VariableValue,\n} from \"../system\"\nimport type { Breakpoints } from \"./breakpoint\"\nimport {\n calc,\n escape,\n isArray,\n isNull,\n isObject,\n isString,\n isUndefined,\n merge,\n replaceObject,\n} from \"../../utils\"\nimport { DEFAULT_VAR_PREFIX } from \"../constant\"\nimport {\n animation,\n colorMix,\n conditions,\n css,\n getStyle,\n gradient,\n injectKeyframes,\n isCSSFunction,\n isCSSVar,\n} from \"../css\"\nimport { isInterpolation } from \"../css/utils\"\nimport { defaultSystem } from \"../system\"\n\ntype ParsedValue = number | string | undefined\n\ninterface Variable {\n reference: string\n variable: string\n}\n\nexport function transformInterpolation(\n value: any,\n callback: (value: string, fallbackValue?: string) => string,\n) {\n if (isString(value)) {\n return value.replace(/\\{(.*?)\\}/g, (_, value) => {\n const [token, fallbackValue] = value.split(/,(.+)/)\n\n return callback(token.trim(), fallbackValue?.trim())\n })\n } else {\n return value\n }\n}\n\nexport function getVar(token: string, fallback?: string) {\n if (!token.startsWith(\"--\")) token = `--${token}`\n\n token = token.replace(/[^-_a-zA-Z0-9]/g, \"\")\n\n return fallback ? `var(${token}, ${fallback})` : `var(${token})`\n}\n\nexport function getVarName(system: System) {\n return function (token: string) {\n const prefix = system.config.css?.varPrefix ?? DEFAULT_VAR_PREFIX\n\n return `--${prefix}-${token}`\n }\n}\n\nexport function getColorSchemeVar(system: System) {\n return function (value: any, fallback?: string) {\n if (!isString(value)) return value\n\n const prefix = system.config.css?.varPrefix ?? DEFAULT_VAR_PREFIX\n\n const [, token] = value.split(\".\")\n\n return getVar(`${prefix}-colorScheme-${token}`, fallback)\n }\n}\n\nconst isGradient = (token: string) => token.startsWith(\"gradients.\")\nconst isKeyframes = (token: string) => token.startsWith(\"keyframes.\")\nconst isAnimation = (token: string) => token.startsWith(\"animations.\")\nconst isSpace = (token: string) => token.startsWith(\"spaces.\")\nconst isColor = (token: string) => token.startsWith(\"colors.\")\nexport const isColorScheme = (token: any) =>\n isString(token) && token.startsWith(\"colorScheme.\") && !token.includes(\"/\")\n\nexport function createVars(\n prefix: string = DEFAULT_VAR_PREFIX,\n theme: UsageTheme,\n breakpoints: Breakpoints,\n) {\n return function (tokens: VariableTokens) {\n const { getQuery, isResponsive } = breakpoints\n\n function tokenToVar(token: string): Variable {\n token = token.replace(/\\./g, \"-\")\n token = token.replace(/\\//g, \"\\\\/\")\n\n const variable = `--${[prefix, escape(token, \"-\")].filter(Boolean).join(\"-\")}`\n const reference = `var(${variable})`\n\n return { reference, variable }\n }\n\n return function (\n cssMap: CSSMap = {},\n cssVars: Dict = {},\n prevTokens?: VariableTokens,\n ): { cssMap: CSSMap; cssVars: Dict } {\n const system: System = { ...defaultSystem, cssMap }\n const options = { css, system, theme }\n\n function getRelatedReference(\n token: string,\n value: ParsedValue = \"\",\n ): [ParsedValue, Exclude<ParsedValue, undefined>] {\n const relatedToken = [token.split(\".\")[0], value].join(\".\")\n\n if (token === relatedToken) return [undefined, value]\n\n const targetToken = tokens[relatedToken] ?? prevTokens?.[relatedToken]\n\n if (!targetToken) return [undefined, value]\n\n const { reference, variable } = tokenToVar(relatedToken)\n\n return [variable, reference]\n }\n\n function valueToVar(value: any) {\n return transformInterpolation(value, (value, fallbackValue) => {\n if (value.includes(\"colors.\") || value.includes(\"colorScheme.\")) {\n if (isColorScheme(value)) return getColorSchemeVar(system)(value)\n\n return colorMix(value, { fallback: fallbackValue, system })\n } else {\n const token = tokens[value] ?? prevTokens?.[value]\n\n if (token) {\n return tokenToVar(value).reference\n } else if (value in cssMap && cssMap[value]?.ref) {\n return cssMap[value].ref\n } else if (fallbackValue) {\n fallbackValue =\n fallbackValue in cssMap && cssMap[fallbackValue]?.ref\n ? cssMap[fallbackValue]?.ref\n : fallbackValue\n\n return `var(--${prefix}-${value}, ${fallbackValue})`\n } else {\n return `var(--${prefix}-${value})`\n }\n }\n })\n }\n\n function createNegativeVar(token: string, reference: string) {\n const paths = token.split(\".\")\n const [start, ...rest] = paths\n\n const negativeToken = `${start}.-${rest.join(\".\")}`\n\n const negativeReference = calc.negate(reference)\n\n return { negativeReference, negativeToken }\n }\n\n function createAnimationVar(value: VariableValue) {\n if (isArray(value)) {\n return value.map((value) => animation(value, options)).join(\",\")\n } else {\n return animation(value, options)\n }\n }\n\n function createGradientVar(token: string, value: DefineThemeValue) {\n return function (semantic: boolean) {\n if (!semantic) {\n return gradient(value, options)\n } else {\n const [variable, reference] = getRelatedReference(token, value)\n\n return variable ? reference : gradient(value, options)\n }\n }\n }\n\n function createKeyframesVar(token: string, value: any) {\n return function (semantic: boolean) {\n if (!semantic) {\n return injectKeyframes(css(system, theme)(value))\n } else {\n const [variable, reference] = getRelatedReference(token, value)\n\n return variable\n ? reference\n : injectKeyframes(css(system, theme)(value))\n }\n }\n }\n\n function createColorVar(\n token: string,\n properties: string[],\n value: DefineThemeValue,\n ) {\n return function (semantic: boolean) {\n if (!semantic) {\n return colorMix(value, { ...options, properties })\n } else {\n const [variable, reference] = getRelatedReference(token, value)\n\n return variable\n ? reference\n : colorMix(value, { ...options, properties })\n }\n }\n }\n\n function createVar(\n token: string,\n value: VariableValue,\n variable: string,\n ) {\n return function (semantic: boolean, queries: string[] = []) {\n if (isAnimation(token)) value = createAnimationVar(value)\n\n if (isArray(value)) {\n const [lightValue, darkValue] = value\n\n createVar(token, lightValue, variable)(semantic, queries)\n createVar(\n token,\n darkValue,\n variable,\n )(semantic, [...queries, conditions._dark])\n } else if (isResponsive(value, true)) {\n Object.entries(value).forEach(([key, value]) => {\n if (key === \"base\") {\n createVar(token, value, variable)(semantic, queries)\n } else {\n const query = getQuery(key)\n\n if (!query) return\n\n createVar(token, value, variable)(semantic, [...queries, query])\n }\n })\n } else {\n const computedValue: DefineThemeValue = valueToVar(value)\n\n let resolvedValue: DefineThemeValue | Dict = computedValue\n\n if (isKeyframes(token)) {\n resolvedValue = createKeyframesVar(token, computedValue)(semantic)\n } else if (isGradient(token)) {\n resolvedValue = createGradientVar(token, computedValue)(semantic)\n } else if (isColor(token)) {\n resolvedValue = createColorVar(\n token,\n [variable],\n computedValue,\n )(semantic)\n } else if (semantic) {\n const [, reference] = getRelatedReference(token, computedValue)\n\n resolvedValue = reference\n }\n\n if (!isObject(resolvedValue))\n resolvedValue = { [variable]: resolvedValue }\n\n const resolvedCssVars = queries.reduceRight<Dict>(\n (prev, key) => ({ [key]: prev }),\n resolvedValue,\n )\n\n cssVars = merge(cssVars, resolvedCssVars)\n }\n }\n }\n\n for (let [token, { semantic, value }] of Object.entries(tokens)) {\n const { reference, variable } = tokenToVar(token)\n\n createVar(token, value, variable)(semantic)\n\n if (isSpace(token)) {\n const { negativeReference, negativeToken } = createNegativeVar(\n token,\n reference,\n )\n\n cssMap[negativeToken] = { ref: negativeReference, var: variable }\n }\n\n cssMap[token] = { ref: reference, var: variable }\n }\n\n return { cssMap, cssVars }\n }\n }\n}\n\nexport type CreateVars = ReturnType<ReturnType<typeof createVars>>\n\nexport function mergeVars(...fns: CreateVars[]) {\n return function (prevTokens?: VariableTokens) {\n let cssMap: CSSMap = {}\n let cssVars: Dict = {}\n\n for (const fn of fns) {\n const result = fn(cssMap, cssVars, prevTokens)\n\n cssMap = { ...cssMap, ...result.cssMap }\n cssVars = { ...cssVars, ...result.cssVars }\n }\n\n return { cssMap, cssVars }\n }\n}\n\nexport function varAttr<Y = StyleValueWithCondition<number | string>>(\n value: undefined | Y,\n token?: ThemeToken,\n fallbackValue?: string,\n): undefined | Y {\n if (isUndefined(value) || isNull(value) || isCSSFunction(value)) return value\n\n if (isObject(value) || isArray(value)) {\n return replaceObject(value, (value) => varAttr(value, token, fallbackValue))\n } else {\n return token\n ? (`{${token}.${value}, ${fallbackValue ?? value}}` as Y)\n : value\n }\n}\n\nexport function injectVars<Y extends Dict | Dict[] | undefined>(\n objOrArray: Y,\n targets: { [key in CSSProperties]?: string },\n isInvalidProp?: (prop: string) => boolean,\n): Y {\n if (!objOrArray) return objOrArray\n\n function callback(objOrArray: Dict) {\n return Object.fromEntries(\n Object.entries(objOrArray).flatMap(function ([prop, value]) {\n if (isInvalidProp?.(prop)) return [[prop, value]]\n\n const target = targets[prop]\n const result: [string, any][] = []\n\n if (target) {\n const { token } = getStyle(prop) ?? {}\n\n if (isCSSVar(value) || isInterpolation(value)) {\n result.push([`--${target}`, value])\n } else {\n result.push([\n `--${target}`,\n token ? `{${token}.${value}, ${value}}` : value,\n ])\n }\n } else if (isObject(value)) {\n result.push([prop, injectVars(value, targets)])\n } else {\n result.push([prop, value])\n }\n\n return result\n }),\n )\n }\n\n if (isArray(objOrArray)) {\n return objOrArray.map(callback) as Y\n } else {\n return callback(objOrArray) as Y\n }\n}\n"],"mappings":"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"}
|
|
@@ -42,6 +42,9 @@ function splitValues(values, cb = (current) => current === ",", addSeparator = f
|
|
|
42
42
|
function isCSSVar(value) {
|
|
43
43
|
return /^var\(--.+\)$/.test(value);
|
|
44
44
|
}
|
|
45
|
+
function isInterpolation(value) {
|
|
46
|
+
return /\{.+\}/.test(value);
|
|
47
|
+
}
|
|
45
48
|
function isCSSToken({ cssMap }) {
|
|
46
49
|
return function(value) {
|
|
47
50
|
return (0, utils_exports.isObject)(cssMap) && value in cssMap && !!cssMap[value]?.ref;
|
|
@@ -105,5 +108,5 @@ function pipe(...transformers) {
|
|
|
105
108
|
}
|
|
106
109
|
|
|
107
110
|
//#endregion
|
|
108
|
-
export { analyzeCSSValue, getCSSFunction, globalValues, insertImportant, isCSSFunction, isCSSToken, isCSSVar, isImportant, omitImportant, pipe, splitValues, tokenToValue, tokenToVar, varToValue };
|
|
111
|
+
export { analyzeCSSValue, getCSSFunction, globalValues, insertImportant, isCSSFunction, isCSSToken, isCSSVar, isImportant, isInterpolation, omitImportant, pipe, splitValues, tokenToValue, tokenToVar, varToValue };
|
|
109
112
|
//# sourceMappingURL=utils.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.js","names":["value"],"sources":["../../../../src/core/css/utils.ts"],"sourcesContent":["import type { Dict } from \"../../utils\"\nimport type { ColorMode, System, ThemeToken, UsageTheme } from \"../system\"\nimport type { StyleConfig } from \"./config\"\nimport type { CSSFunction, CSSProperties } from \"./index.types\"\nimport { isObject, isString, isUndefined } from \"../../utils\"\nimport { getColorSchemeVar, isColorScheme } from \"../system\"\n\nexport interface TransformOptions {\n system: System\n css?: CSSFunction\n fallback?: any\n prev?: Dict\n properties?: CSSProperties[]\n theme?: UsageTheme\n}\n\nexport interface Transform {\n (value: any, options: TransformOptions): any\n}\n\nexport const globalValues = new Set([\n \"inherit\",\n \"initial\",\n \"none\",\n \"revert\",\n \"unset\",\n])\n\nexport function isCSSFunction(value: any) {\n return isString(value) && value.includes(\"(\") && value.includes(\")\")\n}\n\nexport function getCSSFunction(value: any) {\n const regex = /(^[a-z-A-Z]+)\\((.*)\\)/g\n const [, type, values] = regex.exec(value) ?? []\n\n return { type, values }\n}\n\nexport function splitValues(\n values: string,\n cb: (\n current: string,\n prev: string | undefined,\n next: string | undefined,\n ) => boolean = (current) => current === \",\",\n addSeparator = false,\n) {\n const result = []\n\n let value = \"\"\n let depth = 0\n\n for (let i = 0; i < values.length; i++) {\n const current = values[i]\n const prev = values[i - 1]\n const next = values[i + 1]\n\n if (current === \"(\") depth++\n if (current === \")\") depth--\n\n if (!isUndefined(current) && cb(current, prev, next) && depth === 0) {\n if (value) result.push(value.trim())\n\n if (addSeparator) result.push(current)\n\n value = \"\"\n } else {\n value += current\n }\n }\n\n if (value) result.push(value.trim())\n\n return result.filter(Boolean)\n}\n\nexport function isCSSVar(value: string) {\n return /^var\\(--.+\\)$/.test(value)\n}\n\nexport function isCSSToken({ cssMap }: System) {\n return function (value: any) {\n return isObject(cssMap) && value in cssMap && !!cssMap[value]?.ref\n }\n}\n\nexport function isImportant(value: any): boolean {\n return (\n isString(value) && (/\\s*!important$/.test(value) || /\\s*!$/.test(value))\n )\n}\n\nexport function omitImportant(value: any): string {\n return isString(value) ? value.replace(/(!important|!)$/, \"\").trim() : value\n}\n\nexport function insertImportant(value: any, style?: StyleConfig): any {\n if (isString(value)) {\n return value + \" !important\"\n } else if (isObject(value)) {\n if (style?.important) {\n return Object.fromEntries(\n Object.entries(value).map(([key, value]) => [\n key,\n value + \" !important\",\n ]),\n )\n } else {\n if (!style?.properties) return value\n\n for (const property of style.properties) {\n value[property] += \" !important\"\n }\n }\n }\n\n return value\n}\n\nexport function analyzeCSSValue(value: any) {\n let n = parseFloat(value.toString())\n const unit = value.toString().replace(String(n), \"\")\n\n return { unit, unitless: !unit, value }\n}\n\nexport function tokenToVar(system: System) {\n return function (token: ThemeToken, value: any, fallbackValue?: any) {\n if (isColorScheme(value)) return getColorSchemeVar(system)(value)\n\n const resolvedToken = `${token}.${value}`\n\n if (isCSSToken(system)(resolvedToken)) {\n return system.cssMap[resolvedToken]!.ref\n } else {\n return fallbackValue || value\n }\n }\n}\n\nexport function varToValue(system: System) {\n return function (variable: string): string {\n const value = system.cssVars[variable]\n\n if (isCSSVar(value)) {\n return varToValue(system)(value.replace(/^var\\(/, \"\").replace(/\\)$/, \"\"))\n } else {\n return value\n }\n }\n}\n\nexport function tokenToValue(system: System) {\n return function (token: ThemeToken, value: any, fallbackValue?: any) {\n const resolvedToken = `${token}.${value}`\n\n if (isCSSToken(system)(resolvedToken)) {\n const variable = system.cssMap[resolvedToken]!.var\n\n return varToValue(system)(variable)\n } else {\n return fallbackValue || value\n }\n }\n}\n\nexport function mode<L, D>(light: L, dark: D) {\n return function (colorMode: ColorMode | undefined = \"light\"): D | L {\n return colorMode === \"light\" ? light : dark\n }\n}\n\nfunction combineFunctions(a: Transform, b: Transform): Transform {\n return function (value, ...args) {\n return b(a(value, ...args), ...args)\n }\n}\n\nexport function pipe(...transformers: Transform[]) {\n return transformers.reduce(combineFunctions)\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"utils.js","names":["value"],"sources":["../../../../src/core/css/utils.ts"],"sourcesContent":["import type { Dict } from \"../../utils\"\nimport type { ColorMode, System, ThemeToken, UsageTheme } from \"../system\"\nimport type { StyleConfig } from \"./config\"\nimport type { CSSFunction, CSSProperties } from \"./index.types\"\nimport { isObject, isString, isUndefined } from \"../../utils\"\nimport { getColorSchemeVar, isColorScheme } from \"../system\"\n\nexport interface TransformOptions {\n system: System\n css?: CSSFunction\n fallback?: any\n prev?: Dict\n properties?: CSSProperties[]\n theme?: UsageTheme\n}\n\nexport interface Transform {\n (value: any, options: TransformOptions): any\n}\n\nexport const globalValues = new Set([\n \"inherit\",\n \"initial\",\n \"none\",\n \"revert\",\n \"unset\",\n])\n\nexport function isCSSFunction(value: any) {\n return isString(value) && value.includes(\"(\") && value.includes(\")\")\n}\n\nexport function getCSSFunction(value: any) {\n const regex = /(^[a-z-A-Z]+)\\((.*)\\)/g\n const [, type, values] = regex.exec(value) ?? []\n\n return { type, values }\n}\n\nexport function splitValues(\n values: string,\n cb: (\n current: string,\n prev: string | undefined,\n next: string | undefined,\n ) => boolean = (current) => current === \",\",\n addSeparator = false,\n) {\n const result = []\n\n let value = \"\"\n let depth = 0\n\n for (let i = 0; i < values.length; i++) {\n const current = values[i]\n const prev = values[i - 1]\n const next = values[i + 1]\n\n if (current === \"(\") depth++\n if (current === \")\") depth--\n\n if (!isUndefined(current) && cb(current, prev, next) && depth === 0) {\n if (value) result.push(value.trim())\n\n if (addSeparator) result.push(current)\n\n value = \"\"\n } else {\n value += current\n }\n }\n\n if (value) result.push(value.trim())\n\n return result.filter(Boolean)\n}\n\nexport function isCSSVar(value: string) {\n return /^var\\(--.+\\)$/.test(value)\n}\n\nexport function isInterpolation(value: string) {\n return /\\{.+\\}/.test(value)\n}\n\nexport function isCSSToken({ cssMap }: System) {\n return function (value: any) {\n return isObject(cssMap) && value in cssMap && !!cssMap[value]?.ref\n }\n}\n\nexport function isImportant(value: any): boolean {\n return (\n isString(value) && (/\\s*!important$/.test(value) || /\\s*!$/.test(value))\n )\n}\n\nexport function omitImportant(value: any): string {\n return isString(value) ? value.replace(/(!important|!)$/, \"\").trim() : value\n}\n\nexport function insertImportant(value: any, style?: StyleConfig): any {\n if (isString(value)) {\n return value + \" !important\"\n } else if (isObject(value)) {\n if (style?.important) {\n return Object.fromEntries(\n Object.entries(value).map(([key, value]) => [\n key,\n value + \" !important\",\n ]),\n )\n } else {\n if (!style?.properties) return value\n\n for (const property of style.properties) {\n value[property] += \" !important\"\n }\n }\n }\n\n return value\n}\n\nexport function analyzeCSSValue(value: any) {\n let n = parseFloat(value.toString())\n const unit = value.toString().replace(String(n), \"\")\n\n return { unit, unitless: !unit, value }\n}\n\nexport function tokenToVar(system: System) {\n return function (token: ThemeToken, value: any, fallbackValue?: any) {\n if (isColorScheme(value)) return getColorSchemeVar(system)(value)\n\n const resolvedToken = `${token}.${value}`\n\n if (isCSSToken(system)(resolvedToken)) {\n return system.cssMap[resolvedToken]!.ref\n } else {\n return fallbackValue || value\n }\n }\n}\n\nexport function varToValue(system: System) {\n return function (variable: string): string {\n const value = system.cssVars[variable]\n\n if (isCSSVar(value)) {\n return varToValue(system)(value.replace(/^var\\(/, \"\").replace(/\\)$/, \"\"))\n } else {\n return value\n }\n }\n}\n\nexport function tokenToValue(system: System) {\n return function (token: ThemeToken, value: any, fallbackValue?: any) {\n const resolvedToken = `${token}.${value}`\n\n if (isCSSToken(system)(resolvedToken)) {\n const variable = system.cssMap[resolvedToken]!.var\n\n return varToValue(system)(variable)\n } else {\n return fallbackValue || value\n }\n }\n}\n\nexport function mode<L, D>(light: L, dark: D) {\n return function (colorMode: ColorMode | undefined = \"light\"): D | L {\n return colorMode === \"light\" ? light : dark\n }\n}\n\nfunction combineFunctions(a: Transform, b: Transform): Transform {\n return function (value, ...args) {\n return b(a(value, ...args), ...args)\n }\n}\n\nexport function pipe(...transformers: Transform[]) {\n return transformers.reduce(combineFunctions)\n}\n"],"mappings":"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"}
|
|
@@ -2,7 +2,7 @@ import { utils_exports } from "../../utils/index.js";
|
|
|
2
2
|
import { DEFAULT_VAR_PREFIX } from "../constant.js";
|
|
3
3
|
import { defaultSystem } from "./create-system.js";
|
|
4
4
|
import "./index.js";
|
|
5
|
-
import { isCSSFunction } from "../css/utils.js";
|
|
5
|
+
import { isCSSFunction, isCSSVar, isInterpolation } from "../css/utils.js";
|
|
6
6
|
import { animation, injectKeyframes } from "../css/animation.js";
|
|
7
7
|
import { colorMix } from "../css/color-mix.js";
|
|
8
8
|
import { conditions } from "../css/conditions.js";
|
|
@@ -220,7 +220,8 @@ function injectVars(objOrArray, targets, isInvalidProp) {
|
|
|
220
220
|
const result = [];
|
|
221
221
|
if (target) {
|
|
222
222
|
const { token } = getStyle(prop) ?? {};
|
|
223
|
-
result.push([`--${target}`,
|
|
223
|
+
if (isCSSVar(value) || isInterpolation(value)) result.push([`--${target}`, value]);
|
|
224
|
+
else result.push([`--${target}`, token ? `{${token}.${value}, ${value}}` : value]);
|
|
224
225
|
} else if ((0, utils_exports.isObject)(value)) result.push([prop, injectVars(value, targets)]);
|
|
225
226
|
else result.push([prop, value]);
|
|
226
227
|
return result;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"var.js","names":["value","system: System","calc","computedValue: DefineThemeValue","resolvedValue: DefineThemeValue | Dict","cssMap: CSSMap","cssVars: Dict","objOrArray","result: [string, any][]"],"sources":["../../../../src/core/system/var.ts"],"sourcesContent":["import type { Dict } from \"../../utils\"\nimport type { CSSProperties, StyleValueWithCondition } from \"../css\"\nimport type {\n CSSMap,\n DefineThemeValue,\n System,\n ThemeToken,\n UsageTheme,\n VariableTokens,\n VariableValue,\n} from \"../system\"\nimport type { Breakpoints } from \"./breakpoint\"\nimport {\n calc,\n escape,\n isArray,\n isNull,\n isObject,\n isString,\n isUndefined,\n merge,\n replaceObject,\n} from \"../../utils\"\nimport { DEFAULT_VAR_PREFIX } from \"../constant\"\nimport {\n animation,\n colorMix,\n conditions,\n css,\n getStyle,\n gradient,\n injectKeyframes,\n isCSSFunction,\n} from \"../css\"\nimport { defaultSystem } from \"../system\"\n\ntype ParsedValue = number | string | undefined\n\ninterface Variable {\n reference: string\n variable: string\n}\n\nexport function transformInterpolation(\n value: any,\n callback: (value: string, fallbackValue?: string) => string,\n) {\n if (isString(value)) {\n return value.replace(/\\{(.*?)\\}/g, (_, value) => {\n const [token, fallbackValue] = value.split(/,(.+)/)\n\n return callback(token.trim(), fallbackValue?.trim())\n })\n } else {\n return value\n }\n}\n\nexport function getVar(token: string, fallback?: string) {\n if (!token.startsWith(\"--\")) token = `--${token}`\n\n token = token.replace(/[^-_a-zA-Z0-9]/g, \"\")\n\n return fallback ? `var(${token}, ${fallback})` : `var(${token})`\n}\n\nexport function getVarName(system: System) {\n return function (token: string) {\n const prefix = system.config.css?.varPrefix ?? DEFAULT_VAR_PREFIX\n\n return `--${prefix}-${token}`\n }\n}\n\nexport function getColorSchemeVar(system: System) {\n return function (value: any, fallback?: string) {\n if (!isString(value)) return value\n\n const prefix = system.config.css?.varPrefix ?? DEFAULT_VAR_PREFIX\n\n const [, token] = value.split(\".\")\n\n return getVar(`${prefix}-colorScheme-${token}`, fallback)\n }\n}\n\nconst isGradient = (token: string) => token.startsWith(\"gradients.\")\nconst isKeyframes = (token: string) => token.startsWith(\"keyframes.\")\nconst isAnimation = (token: string) => token.startsWith(\"animations.\")\nconst isSpace = (token: string) => token.startsWith(\"spaces.\")\nconst isColor = (token: string) => token.startsWith(\"colors.\")\nexport const isColorScheme = (token: any) =>\n isString(token) && token.startsWith(\"colorScheme.\") && !token.includes(\"/\")\n\nexport function createVars(\n prefix: string = DEFAULT_VAR_PREFIX,\n theme: UsageTheme,\n breakpoints: Breakpoints,\n) {\n return function (tokens: VariableTokens) {\n const { getQuery, isResponsive } = breakpoints\n\n function tokenToVar(token: string): Variable {\n token = token.replace(/\\./g, \"-\")\n token = token.replace(/\\//g, \"\\\\/\")\n\n const variable = `--${[prefix, escape(token, \"-\")].filter(Boolean).join(\"-\")}`\n const reference = `var(${variable})`\n\n return { reference, variable }\n }\n\n return function (\n cssMap: CSSMap = {},\n cssVars: Dict = {},\n prevTokens?: VariableTokens,\n ): { cssMap: CSSMap; cssVars: Dict } {\n const system: System = { ...defaultSystem, cssMap }\n const options = { css, system, theme }\n\n function getRelatedReference(\n token: string,\n value: ParsedValue = \"\",\n ): [ParsedValue, Exclude<ParsedValue, undefined>] {\n const relatedToken = [token.split(\".\")[0], value].join(\".\")\n\n if (token === relatedToken) return [undefined, value]\n\n const targetToken = tokens[relatedToken] ?? prevTokens?.[relatedToken]\n\n if (!targetToken) return [undefined, value]\n\n const { reference, variable } = tokenToVar(relatedToken)\n\n return [variable, reference]\n }\n\n function valueToVar(value: any) {\n return transformInterpolation(value, (value, fallbackValue) => {\n if (value.includes(\"colors.\") || value.includes(\"colorScheme.\")) {\n if (isColorScheme(value)) return getColorSchemeVar(system)(value)\n\n return colorMix(value, { fallback: fallbackValue, system })\n } else {\n const token = tokens[value] ?? prevTokens?.[value]\n\n if (token) {\n return tokenToVar(value).reference\n } else if (value in cssMap && cssMap[value]?.ref) {\n return cssMap[value].ref\n } else if (fallbackValue) {\n fallbackValue =\n fallbackValue in cssMap && cssMap[fallbackValue]?.ref\n ? cssMap[fallbackValue]?.ref\n : fallbackValue\n\n return `var(--${prefix}-${value}, ${fallbackValue})`\n } else {\n return `var(--${prefix}-${value})`\n }\n }\n })\n }\n\n function createNegativeVar(token: string, reference: string) {\n const paths = token.split(\".\")\n const [start, ...rest] = paths\n\n const negativeToken = `${start}.-${rest.join(\".\")}`\n\n const negativeReference = calc.negate(reference)\n\n return { negativeReference, negativeToken }\n }\n\n function createAnimationVar(value: VariableValue) {\n if (isArray(value)) {\n return value.map((value) => animation(value, options)).join(\",\")\n } else {\n return animation(value, options)\n }\n }\n\n function createGradientVar(token: string, value: DefineThemeValue) {\n return function (semantic: boolean) {\n if (!semantic) {\n return gradient(value, options)\n } else {\n const [variable, reference] = getRelatedReference(token, value)\n\n return variable ? reference : gradient(value, options)\n }\n }\n }\n\n function createKeyframesVar(token: string, value: any) {\n return function (semantic: boolean) {\n if (!semantic) {\n return injectKeyframes(css(system, theme)(value))\n } else {\n const [variable, reference] = getRelatedReference(token, value)\n\n return variable\n ? reference\n : injectKeyframes(css(system, theme)(value))\n }\n }\n }\n\n function createColorVar(\n token: string,\n properties: string[],\n value: DefineThemeValue,\n ) {\n return function (semantic: boolean) {\n if (!semantic) {\n return colorMix(value, { ...options, properties })\n } else {\n const [variable, reference] = getRelatedReference(token, value)\n\n return variable\n ? reference\n : colorMix(value, { ...options, properties })\n }\n }\n }\n\n function createVar(\n token: string,\n value: VariableValue,\n variable: string,\n ) {\n return function (semantic: boolean, queries: string[] = []) {\n if (isAnimation(token)) value = createAnimationVar(value)\n\n if (isArray(value)) {\n const [lightValue, darkValue] = value\n\n createVar(token, lightValue, variable)(semantic, queries)\n createVar(\n token,\n darkValue,\n variable,\n )(semantic, [...queries, conditions._dark])\n } else if (isResponsive(value, true)) {\n Object.entries(value).forEach(([key, value]) => {\n if (key === \"base\") {\n createVar(token, value, variable)(semantic, queries)\n } else {\n const query = getQuery(key)\n\n if (!query) return\n\n createVar(token, value, variable)(semantic, [...queries, query])\n }\n })\n } else {\n const computedValue: DefineThemeValue = valueToVar(value)\n\n let resolvedValue: DefineThemeValue | Dict = computedValue\n\n if (isKeyframes(token)) {\n resolvedValue = createKeyframesVar(token, computedValue)(semantic)\n } else if (isGradient(token)) {\n resolvedValue = createGradientVar(token, computedValue)(semantic)\n } else if (isColor(token)) {\n resolvedValue = createColorVar(\n token,\n [variable],\n computedValue,\n )(semantic)\n } else if (semantic) {\n const [, reference] = getRelatedReference(token, computedValue)\n\n resolvedValue = reference\n }\n\n if (!isObject(resolvedValue))\n resolvedValue = { [variable]: resolvedValue }\n\n const resolvedCssVars = queries.reduceRight<Dict>(\n (prev, key) => ({ [key]: prev }),\n resolvedValue,\n )\n\n cssVars = merge(cssVars, resolvedCssVars)\n }\n }\n }\n\n for (let [token, { semantic, value }] of Object.entries(tokens)) {\n const { reference, variable } = tokenToVar(token)\n\n createVar(token, value, variable)(semantic)\n\n if (isSpace(token)) {\n const { negativeReference, negativeToken } = createNegativeVar(\n token,\n reference,\n )\n\n cssMap[negativeToken] = { ref: negativeReference, var: variable }\n }\n\n cssMap[token] = { ref: reference, var: variable }\n }\n\n return { cssMap, cssVars }\n }\n }\n}\n\nexport type CreateVars = ReturnType<ReturnType<typeof createVars>>\n\nexport function mergeVars(...fns: CreateVars[]) {\n return function (prevTokens?: VariableTokens) {\n let cssMap: CSSMap = {}\n let cssVars: Dict = {}\n\n for (const fn of fns) {\n const result = fn(cssMap, cssVars, prevTokens)\n\n cssMap = { ...cssMap, ...result.cssMap }\n cssVars = { ...cssVars, ...result.cssVars }\n }\n\n return { cssMap, cssVars }\n }\n}\n\nexport function varAttr<Y = StyleValueWithCondition<number | string>>(\n value: undefined | Y,\n token?: ThemeToken,\n fallbackValue?: string,\n): undefined | Y {\n if (isUndefined(value) || isNull(value) || isCSSFunction(value)) return value\n\n if (isObject(value) || isArray(value)) {\n return replaceObject(value, (value) => varAttr(value, token, fallbackValue))\n } else {\n return token\n ? (`{${token}.${value}, ${fallbackValue ?? value}}` as Y)\n : value\n }\n}\n\nexport function injectVars<Y extends Dict | Dict[] | undefined>(\n objOrArray: Y,\n targets: { [key in CSSProperties]?: string },\n isInvalidProp?: (prop: string) => boolean,\n): Y {\n if (!objOrArray) return objOrArray\n\n function callback(objOrArray: Dict) {\n return Object.fromEntries(\n Object.entries(objOrArray).flatMap(function ([prop, value]) {\n if (isInvalidProp?.(prop)) return [[prop, value]]\n\n const target = targets[prop]\n const result: [string, any][] = []\n\n if (target) {\n const { token } = getStyle(prop) ?? {}\n\n result.push([\n `--${target}`,\n token ? `{${token}.${value}, ${value}}` : value,\n ])\n } else if (isObject(value)) {\n result.push([prop, injectVars(value, targets)])\n } else {\n result.push([prop, value])\n }\n\n return result\n }),\n )\n }\n\n if (isArray(objOrArray)) {\n return objOrArray.map(callback) as Y\n } else {\n return callback(objOrArray) as Y\n }\n}\n"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"var.js","names":["value","system: System","calc","computedValue: DefineThemeValue","resolvedValue: DefineThemeValue | Dict","cssMap: CSSMap","cssVars: Dict","objOrArray","result: [string, any][]"],"sources":["../../../../src/core/system/var.ts"],"sourcesContent":["import type { Dict } from \"../../utils\"\nimport type { CSSProperties, StyleValueWithCondition } from \"../css\"\nimport type {\n CSSMap,\n DefineThemeValue,\n System,\n ThemeToken,\n UsageTheme,\n VariableTokens,\n VariableValue,\n} from \"../system\"\nimport type { Breakpoints } from \"./breakpoint\"\nimport {\n calc,\n escape,\n isArray,\n isNull,\n isObject,\n isString,\n isUndefined,\n merge,\n replaceObject,\n} from \"../../utils\"\nimport { DEFAULT_VAR_PREFIX } from \"../constant\"\nimport {\n animation,\n colorMix,\n conditions,\n css,\n getStyle,\n gradient,\n injectKeyframes,\n isCSSFunction,\n isCSSVar,\n} from \"../css\"\nimport { isInterpolation } from \"../css/utils\"\nimport { defaultSystem } from \"../system\"\n\ntype ParsedValue = number | string | undefined\n\ninterface Variable {\n reference: string\n variable: string\n}\n\nexport function transformInterpolation(\n value: any,\n callback: (value: string, fallbackValue?: string) => string,\n) {\n if (isString(value)) {\n return value.replace(/\\{(.*?)\\}/g, (_, value) => {\n const [token, fallbackValue] = value.split(/,(.+)/)\n\n return callback(token.trim(), fallbackValue?.trim())\n })\n } else {\n return value\n }\n}\n\nexport function getVar(token: string, fallback?: string) {\n if (!token.startsWith(\"--\")) token = `--${token}`\n\n token = token.replace(/[^-_a-zA-Z0-9]/g, \"\")\n\n return fallback ? `var(${token}, ${fallback})` : `var(${token})`\n}\n\nexport function getVarName(system: System) {\n return function (token: string) {\n const prefix = system.config.css?.varPrefix ?? DEFAULT_VAR_PREFIX\n\n return `--${prefix}-${token}`\n }\n}\n\nexport function getColorSchemeVar(system: System) {\n return function (value: any, fallback?: string) {\n if (!isString(value)) return value\n\n const prefix = system.config.css?.varPrefix ?? DEFAULT_VAR_PREFIX\n\n const [, token] = value.split(\".\")\n\n return getVar(`${prefix}-colorScheme-${token}`, fallback)\n }\n}\n\nconst isGradient = (token: string) => token.startsWith(\"gradients.\")\nconst isKeyframes = (token: string) => token.startsWith(\"keyframes.\")\nconst isAnimation = (token: string) => token.startsWith(\"animations.\")\nconst isSpace = (token: string) => token.startsWith(\"spaces.\")\nconst isColor = (token: string) => token.startsWith(\"colors.\")\nexport const isColorScheme = (token: any) =>\n isString(token) && token.startsWith(\"colorScheme.\") && !token.includes(\"/\")\n\nexport function createVars(\n prefix: string = DEFAULT_VAR_PREFIX,\n theme: UsageTheme,\n breakpoints: Breakpoints,\n) {\n return function (tokens: VariableTokens) {\n const { getQuery, isResponsive } = breakpoints\n\n function tokenToVar(token: string): Variable {\n token = token.replace(/\\./g, \"-\")\n token = token.replace(/\\//g, \"\\\\/\")\n\n const variable = `--${[prefix, escape(token, \"-\")].filter(Boolean).join(\"-\")}`\n const reference = `var(${variable})`\n\n return { reference, variable }\n }\n\n return function (\n cssMap: CSSMap = {},\n cssVars: Dict = {},\n prevTokens?: VariableTokens,\n ): { cssMap: CSSMap; cssVars: Dict } {\n const system: System = { ...defaultSystem, cssMap }\n const options = { css, system, theme }\n\n function getRelatedReference(\n token: string,\n value: ParsedValue = \"\",\n ): [ParsedValue, Exclude<ParsedValue, undefined>] {\n const relatedToken = [token.split(\".\")[0], value].join(\".\")\n\n if (token === relatedToken) return [undefined, value]\n\n const targetToken = tokens[relatedToken] ?? prevTokens?.[relatedToken]\n\n if (!targetToken) return [undefined, value]\n\n const { reference, variable } = tokenToVar(relatedToken)\n\n return [variable, reference]\n }\n\n function valueToVar(value: any) {\n return transformInterpolation(value, (value, fallbackValue) => {\n if (value.includes(\"colors.\") || value.includes(\"colorScheme.\")) {\n if (isColorScheme(value)) return getColorSchemeVar(system)(value)\n\n return colorMix(value, { fallback: fallbackValue, system })\n } else {\n const token = tokens[value] ?? prevTokens?.[value]\n\n if (token) {\n return tokenToVar(value).reference\n } else if (value in cssMap && cssMap[value]?.ref) {\n return cssMap[value].ref\n } else if (fallbackValue) {\n fallbackValue =\n fallbackValue in cssMap && cssMap[fallbackValue]?.ref\n ? cssMap[fallbackValue]?.ref\n : fallbackValue\n\n return `var(--${prefix}-${value}, ${fallbackValue})`\n } else {\n return `var(--${prefix}-${value})`\n }\n }\n })\n }\n\n function createNegativeVar(token: string, reference: string) {\n const paths = token.split(\".\")\n const [start, ...rest] = paths\n\n const negativeToken = `${start}.-${rest.join(\".\")}`\n\n const negativeReference = calc.negate(reference)\n\n return { negativeReference, negativeToken }\n }\n\n function createAnimationVar(value: VariableValue) {\n if (isArray(value)) {\n return value.map((value) => animation(value, options)).join(\",\")\n } else {\n return animation(value, options)\n }\n }\n\n function createGradientVar(token: string, value: DefineThemeValue) {\n return function (semantic: boolean) {\n if (!semantic) {\n return gradient(value, options)\n } else {\n const [variable, reference] = getRelatedReference(token, value)\n\n return variable ? reference : gradient(value, options)\n }\n }\n }\n\n function createKeyframesVar(token: string, value: any) {\n return function (semantic: boolean) {\n if (!semantic) {\n return injectKeyframes(css(system, theme)(value))\n } else {\n const [variable, reference] = getRelatedReference(token, value)\n\n return variable\n ? reference\n : injectKeyframes(css(system, theme)(value))\n }\n }\n }\n\n function createColorVar(\n token: string,\n properties: string[],\n value: DefineThemeValue,\n ) {\n return function (semantic: boolean) {\n if (!semantic) {\n return colorMix(value, { ...options, properties })\n } else {\n const [variable, reference] = getRelatedReference(token, value)\n\n return variable\n ? reference\n : colorMix(value, { ...options, properties })\n }\n }\n }\n\n function createVar(\n token: string,\n value: VariableValue,\n variable: string,\n ) {\n return function (semantic: boolean, queries: string[] = []) {\n if (isAnimation(token)) value = createAnimationVar(value)\n\n if (isArray(value)) {\n const [lightValue, darkValue] = value\n\n createVar(token, lightValue, variable)(semantic, queries)\n createVar(\n token,\n darkValue,\n variable,\n )(semantic, [...queries, conditions._dark])\n } else if (isResponsive(value, true)) {\n Object.entries(value).forEach(([key, value]) => {\n if (key === \"base\") {\n createVar(token, value, variable)(semantic, queries)\n } else {\n const query = getQuery(key)\n\n if (!query) return\n\n createVar(token, value, variable)(semantic, [...queries, query])\n }\n })\n } else {\n const computedValue: DefineThemeValue = valueToVar(value)\n\n let resolvedValue: DefineThemeValue | Dict = computedValue\n\n if (isKeyframes(token)) {\n resolvedValue = createKeyframesVar(token, computedValue)(semantic)\n } else if (isGradient(token)) {\n resolvedValue = createGradientVar(token, computedValue)(semantic)\n } else if (isColor(token)) {\n resolvedValue = createColorVar(\n token,\n [variable],\n computedValue,\n )(semantic)\n } else if (semantic) {\n const [, reference] = getRelatedReference(token, computedValue)\n\n resolvedValue = reference\n }\n\n if (!isObject(resolvedValue))\n resolvedValue = { [variable]: resolvedValue }\n\n const resolvedCssVars = queries.reduceRight<Dict>(\n (prev, key) => ({ [key]: prev }),\n resolvedValue,\n )\n\n cssVars = merge(cssVars, resolvedCssVars)\n }\n }\n }\n\n for (let [token, { semantic, value }] of Object.entries(tokens)) {\n const { reference, variable } = tokenToVar(token)\n\n createVar(token, value, variable)(semantic)\n\n if (isSpace(token)) {\n const { negativeReference, negativeToken } = createNegativeVar(\n token,\n reference,\n )\n\n cssMap[negativeToken] = { ref: negativeReference, var: variable }\n }\n\n cssMap[token] = { ref: reference, var: variable }\n }\n\n return { cssMap, cssVars }\n }\n }\n}\n\nexport type CreateVars = ReturnType<ReturnType<typeof createVars>>\n\nexport function mergeVars(...fns: CreateVars[]) {\n return function (prevTokens?: VariableTokens) {\n let cssMap: CSSMap = {}\n let cssVars: Dict = {}\n\n for (const fn of fns) {\n const result = fn(cssMap, cssVars, prevTokens)\n\n cssMap = { ...cssMap, ...result.cssMap }\n cssVars = { ...cssVars, ...result.cssVars }\n }\n\n return { cssMap, cssVars }\n }\n}\n\nexport function varAttr<Y = StyleValueWithCondition<number | string>>(\n value: undefined | Y,\n token?: ThemeToken,\n fallbackValue?: string,\n): undefined | Y {\n if (isUndefined(value) || isNull(value) || isCSSFunction(value)) return value\n\n if (isObject(value) || isArray(value)) {\n return replaceObject(value, (value) => varAttr(value, token, fallbackValue))\n } else {\n return token\n ? (`{${token}.${value}, ${fallbackValue ?? value}}` as Y)\n : value\n }\n}\n\nexport function injectVars<Y extends Dict | Dict[] | undefined>(\n objOrArray: Y,\n targets: { [key in CSSProperties]?: string },\n isInvalidProp?: (prop: string) => boolean,\n): Y {\n if (!objOrArray) return objOrArray\n\n function callback(objOrArray: Dict) {\n return Object.fromEntries(\n Object.entries(objOrArray).flatMap(function ([prop, value]) {\n if (isInvalidProp?.(prop)) return [[prop, value]]\n\n const target = targets[prop]\n const result: [string, any][] = []\n\n if (target) {\n const { token } = getStyle(prop) ?? {}\n\n if (isCSSVar(value) || isInterpolation(value)) {\n result.push([`--${target}`, value])\n } else {\n result.push([\n `--${target}`,\n token ? `{${token}.${value}, ${value}}` : value,\n ])\n }\n } else if (isObject(value)) {\n result.push([prop, injectVars(value, targets)])\n } else {\n result.push([prop, value])\n }\n\n return result\n }),\n )\n }\n\n if (isArray(objOrArray)) {\n return objOrArray.map(callback) as Y\n } else {\n return callback(objOrArray) as Y\n }\n}\n"],"mappings":"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"}
|
|
@@ -3,11 +3,13 @@ import { ThemeProps } from "../../core/system/index.types.js";
|
|
|
3
3
|
import { Component, HTMLStyledProps } from "../../core/components/index.types.js";
|
|
4
4
|
import "../../core/index.js";
|
|
5
5
|
import { WithTransitionProps } from "../motion/index.types.js";
|
|
6
|
+
import "../motion/index.js";
|
|
6
7
|
import { CollapseProps } from "../collapse/collapse.js";
|
|
8
|
+
import "../collapse/index.js";
|
|
7
9
|
import "../../index.js";
|
|
8
10
|
import { AccordionStyle } from "./accordion.style.js";
|
|
9
11
|
import { UseAccordionItemProps, UseAccordionProps } from "./use-accordion.js";
|
|
10
|
-
import * as
|
|
12
|
+
import * as react155 from "react";
|
|
11
13
|
|
|
12
14
|
//#region src/components/accordion/accordion.d.ts
|
|
13
15
|
interface AccordionCallBackProps {
|
|
@@ -31,7 +33,7 @@ interface AccordionRootProps extends Omit<HTMLStyledProps, "onChange">, ThemePro
|
|
|
31
33
|
*/
|
|
32
34
|
items?: AccordionItem[];
|
|
33
35
|
}
|
|
34
|
-
declare const AccordionPropsContext:
|
|
36
|
+
declare const AccordionPropsContext: react155.Context<Partial<AccordionRootProps> | undefined>, useAccordionPropsContext: () => Partial<AccordionRootProps> | undefined;
|
|
35
37
|
/**
|
|
36
38
|
* `Accordion` is a component for a list that displays information in an expandable or collapsible manner.
|
|
37
39
|
*
|
|
@@ -2,10 +2,10 @@ import { HTMLProps, PropGetter } from "../../core/components/index.types.js";
|
|
|
2
2
|
import "../../core/index.js";
|
|
3
3
|
import { Descendant } from "../../hooks/use-descendants/index.js";
|
|
4
4
|
import "../../index.js";
|
|
5
|
-
import * as
|
|
5
|
+
import * as react143 from "react";
|
|
6
6
|
|
|
7
7
|
//#region src/components/accordion/use-accordion.d.ts
|
|
8
|
-
declare const AccordionDescendantsContext:
|
|
8
|
+
declare const AccordionDescendantsContext: react143.Context<{
|
|
9
9
|
active: (target?: HTMLButtonElement | Descendant<HTMLButtonElement, {}> | null | undefined, options?: FocusOptions) => void;
|
|
10
10
|
count: (props?: Partial<{}> | undefined) => number;
|
|
11
11
|
destroy: () => void;
|
|
@@ -24,7 +24,7 @@ declare const AccordionDescendantsContext: react942.Context<{
|
|
|
24
24
|
prevValue: (indexOrNode: number | HTMLButtonElement | Descendant<HTMLButtonElement, {}> | null, loop?: boolean, props?: Partial<{}> | undefined) => Descendant<HTMLButtonElement, {}> | undefined;
|
|
25
25
|
register: (props?: {
|
|
26
26
|
disabled?: boolean | ((node: HTMLButtonElement) => boolean) | undefined;
|
|
27
|
-
} | undefined) =>
|
|
27
|
+
} | undefined) => react143.RefCallback<HTMLButtonElement>;
|
|
28
28
|
unregister: (node?: HTMLButtonElement | null | undefined) => void;
|
|
29
29
|
value: (indexOrNode: number | HTMLButtonElement | null) => Descendant<HTMLButtonElement, {}> | undefined;
|
|
30
30
|
values: (props?: Partial<{}> | undefined) => Descendant<HTMLButtonElement, {}>[];
|
|
@@ -50,12 +50,12 @@ declare const AccordionDescendantsContext: react942.Context<{
|
|
|
50
50
|
prevValue: (indexOrNode: number | HTMLButtonElement | Descendant<HTMLButtonElement, {}> | null, loop?: boolean, props?: Partial<{}> | undefined) => Descendant<HTMLButtonElement, {}> | undefined;
|
|
51
51
|
register: (props?: {
|
|
52
52
|
disabled?: boolean | ((node: HTMLButtonElement) => boolean) | undefined;
|
|
53
|
-
} | undefined) =>
|
|
53
|
+
} | undefined) => react143.RefCallback<HTMLButtonElement>;
|
|
54
54
|
unregister: (node?: HTMLButtonElement | null | undefined) => void;
|
|
55
55
|
value: (indexOrNode: number | HTMLButtonElement | null) => Descendant<HTMLButtonElement, {}> | undefined;
|
|
56
56
|
values: (props?: Partial<{}> | undefined) => Descendant<HTMLButtonElement, {}>[];
|
|
57
57
|
};
|
|
58
|
-
register:
|
|
58
|
+
register: react143.RefCallback<HTMLButtonElement>;
|
|
59
59
|
}, useAccordionDescendants: () => {
|
|
60
60
|
active: (target?: HTMLButtonElement | Descendant<HTMLButtonElement, {}> | null | undefined, options?: FocusOptions) => void;
|
|
61
61
|
count: (props?: Partial<{}> | undefined) => number;
|
|
@@ -75,15 +75,15 @@ declare const AccordionDescendantsContext: react942.Context<{
|
|
|
75
75
|
prevValue: (indexOrNode: number | HTMLButtonElement | Descendant<HTMLButtonElement, {}> | null, loop?: boolean, props?: Partial<{}> | undefined) => Descendant<HTMLButtonElement, {}> | undefined;
|
|
76
76
|
register: (props?: {
|
|
77
77
|
disabled?: boolean | ((node: HTMLButtonElement) => boolean) | undefined;
|
|
78
|
-
} | undefined) =>
|
|
78
|
+
} | undefined) => react143.RefCallback<HTMLButtonElement>;
|
|
79
79
|
unregister: (node?: HTMLButtonElement | null | undefined) => void;
|
|
80
80
|
value: (indexOrNode: number | HTMLButtonElement | null) => Descendant<HTMLButtonElement, {}> | undefined;
|
|
81
81
|
values: (props?: Partial<{}> | undefined) => Descendant<HTMLButtonElement, {}>[];
|
|
82
82
|
};
|
|
83
83
|
interface AccordionContext extends Omit<UseAccordionReturn, "descendants" | "getRootProps"> {}
|
|
84
|
-
declare const AccordionContext:
|
|
84
|
+
declare const AccordionContext: react143.Context<AccordionContext>, useAccordionContext: () => AccordionContext;
|
|
85
85
|
interface AccordionItemContext extends Omit<UseAccordionItemReturn, "getItemProps"> {}
|
|
86
|
-
declare const AccordionItemContext:
|
|
86
|
+
declare const AccordionItemContext: react143.Context<AccordionItemContext>, useAccordionItemContext: () => AccordionItemContext;
|
|
87
87
|
interface UseAccordionProps extends Omit<HTMLProps, "onChange"> {
|
|
88
88
|
/**
|
|
89
89
|
* The initial index(es) of the accordion item to expand.
|
|
@@ -137,7 +137,7 @@ declare const useAccordion: ({
|
|
|
137
137
|
prevValue: (indexOrNode: number | HTMLButtonElement | Descendant<HTMLButtonElement, {}> | null, loop?: boolean, props?: Partial<{}> | undefined) => Descendant<HTMLButtonElement, {}> | undefined;
|
|
138
138
|
register: (props?: {
|
|
139
139
|
disabled?: boolean | ((node: HTMLButtonElement) => boolean) | undefined;
|
|
140
|
-
} | undefined) =>
|
|
140
|
+
} | undefined) => react143.RefCallback<HTMLButtonElement>;
|
|
141
141
|
unregister: (node?: HTMLButtonElement | null | undefined) => void;
|
|
142
142
|
value: (indexOrNode: number | HTMLButtonElement | null) => Descendant<HTMLButtonElement, {}> | undefined;
|
|
143
143
|
values: (props?: Partial<{}> | undefined) => Descendant<HTMLButtonElement, {}>[];
|
|
@@ -145,8 +145,8 @@ declare const useAccordion: ({
|
|
|
145
145
|
focusedIndex: number;
|
|
146
146
|
index: number | number[];
|
|
147
147
|
multiple: boolean | undefined;
|
|
148
|
-
setFocusedIndex:
|
|
149
|
-
setIndex:
|
|
148
|
+
setFocusedIndex: react143.Dispatch<react143.SetStateAction<number>>;
|
|
149
|
+
setIndex: react143.Dispatch<react143.SetStateAction<number | number[]>>;
|
|
150
150
|
toggle: boolean | undefined;
|
|
151
151
|
getRootProps: PropGetter<"div", undefined, undefined>;
|
|
152
152
|
};
|
|
@@ -3,8 +3,9 @@ import { Component } from "../../core/components/index.types.js";
|
|
|
3
3
|
import "../../core/index.js";
|
|
4
4
|
import { AiryStyle } from "./airy.style.js";
|
|
5
5
|
import { HTMLMotionProps } from "../motion/index.types.js";
|
|
6
|
+
import "../motion/index.js";
|
|
6
7
|
import "../../index.js";
|
|
7
|
-
import * as
|
|
8
|
+
import * as react199 from "react";
|
|
8
9
|
import { ReactNode } from "react";
|
|
9
10
|
|
|
10
11
|
//#region src/components/airy/airy.d.ts
|
|
@@ -56,7 +57,7 @@ interface AiryProps extends Omit<HTMLMotionProps<"button">, "onChange">, ThemePr
|
|
|
56
57
|
*/
|
|
57
58
|
onChange?: (value: KeyframeIdent) => void;
|
|
58
59
|
}
|
|
59
|
-
declare const AiryPropsContext:
|
|
60
|
+
declare const AiryPropsContext: react199.Context<Partial<AiryProps> | undefined>, useAiryPropsContext: () => Partial<AiryProps> | undefined;
|
|
60
61
|
/**
|
|
61
62
|
* `Airy` is a component that creates an airy animation, switching between two elements when one is clicked.
|
|
62
63
|
*
|
|
@@ -3,10 +3,13 @@ import { Component, HTMLStyledProps } from "../../core/components/index.types.js
|
|
|
3
3
|
import "../../core/index.js";
|
|
4
4
|
import { AlertStyle } from "./alert.style.js";
|
|
5
5
|
import { IconProps } from "../icon/icon.js";
|
|
6
|
+
import "../icon/index.js";
|
|
6
7
|
import { LoadingProps } from "../loading/loading.js";
|
|
8
|
+
import "../loading/index.js";
|
|
7
9
|
import { StatusScheme } from "../status/status.js";
|
|
10
|
+
import "../status/index.js";
|
|
8
11
|
import "../../index.js";
|
|
9
|
-
import * as
|
|
12
|
+
import * as react142 from "react";
|
|
10
13
|
|
|
11
14
|
//#region src/components/alert/alert.d.ts
|
|
12
15
|
interface AlertRootProps extends HTMLStyledProps, ThemeProps<AlertStyle> {
|
|
@@ -17,7 +20,7 @@ interface AlertRootProps extends HTMLStyledProps, ThemeProps<AlertStyle> {
|
|
|
17
20
|
*/
|
|
18
21
|
status?: StatusScheme;
|
|
19
22
|
}
|
|
20
|
-
declare const AlertPropsContext:
|
|
23
|
+
declare const AlertPropsContext: react142.Context<Partial<AlertRootProps> | undefined>, useAlertPropsContext: () => Partial<AlertRootProps> | undefined;
|
|
21
24
|
/**
|
|
22
25
|
* `Alert` is a component that conveys information to the user.
|
|
23
26
|
*
|
|
@@ -3,7 +3,7 @@ import { CSSModifierObject, CSSPropObject, CSSSlotObject } from "../../core/css/
|
|
|
3
3
|
import "../../index.js";
|
|
4
4
|
|
|
5
5
|
//#region src/components/alert/alert.style.d.ts
|
|
6
|
-
declare const alertStyle: ComponentSlotStyle<"title" | "loading" | "icon" | "
|
|
6
|
+
declare const alertStyle: ComponentSlotStyle<"title" | "loading" | "icon" | "description" | "root", CSSPropObject<CSSSlotObject<"title" | "loading" | "icon" | "description" | "root">>, CSSModifierObject<CSSSlotObject<"title" | "loading" | "icon" | "description" | "root">>, {
|
|
7
7
|
island: {
|
|
8
8
|
description: {
|
|
9
9
|
color: "fg.muted";
|
|
@@ -3,8 +3,9 @@ import { Component } from "../../core/components/index.types.js";
|
|
|
3
3
|
import "../../core/index.js";
|
|
4
4
|
import { AlphaSliderStyle } from "./alpha-slider.style.js";
|
|
5
5
|
import { HueSliderOverlayProps, HueSliderRootProps, HueSliderThumbProps, HueSliderTrackProps } from "../hue-slider/hue-slider.js";
|
|
6
|
+
import "../hue-slider/index.js";
|
|
6
7
|
import "../../index.js";
|
|
7
|
-
import * as
|
|
8
|
+
import * as react134 from "react";
|
|
8
9
|
|
|
9
10
|
//#region src/components/alpha-slider/alpha-slider.d.ts
|
|
10
11
|
interface AlphaSliderRootProps extends WithoutThemeProps<Omit<HueSliderRootProps, "color" | "max" | "step" | "thumbProps" | "trackProps">, AlphaSliderStyle> {
|
|
@@ -37,7 +38,7 @@ interface AlphaSliderRootProps extends WithoutThemeProps<Omit<HueSliderRootProps
|
|
|
37
38
|
*/
|
|
38
39
|
trackProps?: AlphaSliderTrackProps;
|
|
39
40
|
}
|
|
40
|
-
declare const AlphaSliderPropsContext:
|
|
41
|
+
declare const AlphaSliderPropsContext: react134.Context<Partial<AlphaSliderRootProps> | undefined>, useAlphaSliderPropsContext: () => Partial<AlphaSliderRootProps> | undefined;
|
|
41
42
|
/**
|
|
42
43
|
* `AlphaSlider` is a component used to allow the user to select color transparency.
|
|
43
44
|
*
|
|
@@ -2,7 +2,7 @@ import { StyleValue } from "../../core/css/index.types.js";
|
|
|
2
2
|
import { Component, HTMLStyledProps } from "../../core/components/index.types.js";
|
|
3
3
|
import "../../core/index.js";
|
|
4
4
|
import "../../index.js";
|
|
5
|
-
import * as
|
|
5
|
+
import * as react133 from "react";
|
|
6
6
|
|
|
7
7
|
//#region src/components/aspect-ratio/aspect-ratio.d.ts
|
|
8
8
|
interface AspectRatioProps extends HTMLStyledProps {
|
|
@@ -13,7 +13,7 @@ interface AspectRatioProps extends HTMLStyledProps {
|
|
|
13
13
|
*/
|
|
14
14
|
ratio?: StyleValue<number>;
|
|
15
15
|
}
|
|
16
|
-
declare const AspectRatioPropsContext:
|
|
16
|
+
declare const AspectRatioPropsContext: react133.Context<Partial<AspectRatioProps> | undefined>, useAspectRatioPropsContext: () => Partial<AspectRatioProps> | undefined;
|
|
17
17
|
/**
|
|
18
18
|
* `AspectRatio` is a component for embedding things like videos and maps while maintaining the aspect ratio.
|
|
19
19
|
*
|
|
@@ -3,13 +3,15 @@ import { Component, GenericsComponent, HTMLStyledProps } from "../../core/compon
|
|
|
3
3
|
import "../../core/index.js";
|
|
4
4
|
import { AutocompleteStyle } from "./autocomplete.style.js";
|
|
5
5
|
import { PopoverContentProps, PopupAnimationProps } from "../popover/popover.js";
|
|
6
|
+
import "../popover/index.js";
|
|
6
7
|
import { UseComboboxGroupProps } from "../../hooks/use-combobox/index.js";
|
|
7
8
|
import { UseInputBorderProps } from "../input/use-input-border.js";
|
|
8
9
|
import { InputElementProps } from "../input/input-element.js";
|
|
9
10
|
import { InputGroupRootProps } from "../input/input-group.js";
|
|
11
|
+
import "../input/index.js";
|
|
10
12
|
import { UseAutocompleteOptionProps, UseAutocompleteProps } from "./use-autocomplete.js";
|
|
11
13
|
import "../../index.js";
|
|
12
|
-
import * as
|
|
14
|
+
import * as react141 from "react";
|
|
13
15
|
import { ReactElement, ReactNode } from "react";
|
|
14
16
|
|
|
15
17
|
//#region src/components/autocomplete/autocomplete.d.ts
|
|
@@ -65,7 +67,7 @@ interface AutocompleteRootProps<Multiple extends boolean = false> extends Omit<H
|
|
|
65
67
|
*/
|
|
66
68
|
rootProps?: InputGroupRootProps;
|
|
67
69
|
}
|
|
68
|
-
declare const AutocompletePropsContext:
|
|
70
|
+
declare const AutocompletePropsContext: react141.Context<Partial<AutocompleteRootProps<false>> | undefined>, useAutocompletePropsContext: () => Partial<AutocompleteRootProps<false>> | undefined;
|
|
69
71
|
/**
|
|
70
72
|
* `Autocomplete` is a component used to display suggestions in response to user text input.
|
|
71
73
|
*
|
|
@@ -3,7 +3,7 @@ import { CSSPropObject, CSSSlotObject } from "../../core/css/index.types.js";
|
|
|
3
3
|
import "../../index.js";
|
|
4
4
|
|
|
5
5
|
//#region src/components/autocomplete/autocomplete.style.d.ts
|
|
6
|
-
declare const autocompleteStyle: ComponentSlotStyle<"input" | "label" | "option" | "content" | "
|
|
6
|
+
declare const autocompleteStyle: ComponentSlotStyle<"input" | "label" | "option" | "content" | "group" | "separator" | "icon" | "root" | "field" | "empty" | "indicator" | "valueText", CSSPropObject<CSSSlotObject<"input" | "label" | "option" | "content" | "group" | "separator" | "icon" | "root" | "field" | "empty" | "indicator" | "valueText">>, {
|
|
7
7
|
xs: {
|
|
8
8
|
empty: {
|
|
9
9
|
gap: "1.5";
|