@epilot/zenith-react 0.2.0-next.4 → 0.2.0-next.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 +12 -1
- package/codemods/README.md +18 -4
- package/codemods/format.ts +86 -0
- package/codemods/migrate/from-base-elements.ts +8 -2
- package/codemods/migrate/from-volt.ts +8 -2
- package/codemods/radix-to-base-ui.ts +300 -12
- package/dist/_virtual/_zenith-runtime-family_accordion.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_alert-dialog.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_avatar.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_button.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_checkbox.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_csp-provider.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_dialog.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_direction-provider.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_menu.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_merge-props.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_popover.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_radio-group.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_radio.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_scroll-area.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_select.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_separator.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_switch.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_tabs.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_toast.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_toggle-group.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_toggle.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_tooltip.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_use-render.js +1 -1
- package/dist/components/accordion/accordion.js +1 -1
- package/dist/components/accordion/accordion.js.map +1 -1
- package/dist/components/alert-dialog/alert-dialog.js +1 -1
- package/dist/components/alert-dialog/alert-dialog.js.map +1 -1
- package/dist/components/appearance-boundary/appearance-boundary.js +1 -1
- package/dist/components/appearance-boundary/appearance-boundary.js.map +1 -1
- package/dist/components/avatar/avatar-group.js +1 -1
- package/dist/components/avatar/avatar-group.js.map +1 -1
- package/dist/components/avatar/avatar.js +1 -1
- package/dist/components/avatar/avatar.js.map +1 -1
- package/dist/components/badge/badge.js +1 -1
- package/dist/components/badge/badge.js.map +1 -1
- package/dist/components/breadcrumb/breadcrumb.js +1 -1
- package/dist/components/breadcrumb/breadcrumb.js.map +1 -1
- package/dist/components/button/button.js +1 -1
- package/dist/components/button/button.js.map +1 -1
- package/dist/components/button-group/button-group.js +1 -1
- package/dist/components/button-group/button-group.js.map +1 -1
- package/dist/components/callout/callout.js +1 -1
- package/dist/components/callout/callout.js.map +1 -1
- package/dist/components/card/card.js +1 -1
- package/dist/components/card/card.js.map +1 -1
- package/dist/components/checkbox/checkbox.js +1 -1
- package/dist/components/checkbox/checkbox.js.map +1 -1
- package/dist/components/code-block/code-block.js +1 -1
- package/dist/components/code-block/code-block.js.map +1 -1
- package/dist/components/code-editor/code-editor.js +1 -1
- package/dist/components/code-editor/code-editor.js.map +1 -1
- package/dist/components/collapsible-sidebar/collapsible-sidebar.js +1 -1
- package/dist/components/collapsible-sidebar/collapsible-sidebar.js.map +1 -1
- package/dist/components/command/command.js +1 -1
- package/dist/components/command/command.js.map +1 -1
- package/dist/components/data-table/data-table-body.js +1 -1
- package/dist/components/data-table/data-table-body.js.map +1 -1
- package/dist/components/data-table/data-table-column-header.js +1 -1
- package/dist/components/data-table/data-table-column-header.js.map +1 -1
- package/dist/components/data-table/data-table-column-order.js +1 -1
- package/dist/components/data-table/data-table-column-order.js.map +1 -1
- package/dist/components/data-table/data-table-column-visibility.js +1 -1
- package/dist/components/data-table/data-table-column-visibility.js.map +1 -1
- package/dist/components/data-table/data-table-content.js +1 -1
- package/dist/components/data-table/data-table-content.js.map +1 -1
- package/dist/components/data-table/data-table-error.js +1 -1
- package/dist/components/data-table/data-table-error.js.map +1 -1
- package/dist/components/data-table/data-table-footer.js +1 -1
- package/dist/components/data-table/data-table-footer.js.map +1 -1
- package/dist/components/data-table/data-table-header-draggable.js +1 -1
- package/dist/components/data-table/data-table-header-draggable.js.map +1 -1
- package/dist/components/data-table/data-table-header.js +1 -1
- package/dist/components/data-table/data-table-header.js.map +1 -1
- package/dist/components/data-table/data-table-loading.js +1 -1
- package/dist/components/data-table/data-table-loading.js.map +1 -1
- package/dist/components/data-table/data-table-resize-handle.js +1 -1
- package/dist/components/data-table/data-table-resize-handle.js.map +1 -1
- package/dist/components/data-table/data-table-row.js +1 -1
- package/dist/components/data-table/data-table-row.js.map +1 -1
- package/dist/components/data-table/data-table-toolbar.js +1 -1
- package/dist/components/data-table/data-table-toolbar.js.map +1 -1
- package/dist/components/data-table/data-table.js +1 -1
- package/dist/components/data-table/data-table.js.map +1 -1
- package/dist/components/date-range-picker/date-range-picker.js +1 -1
- package/dist/components/date-range-picker/date-range-picker.js.map +1 -1
- package/dist/components/date-range-picker/range-calendar.js +1 -1
- package/dist/components/date-range-picker/range-calendar.js.map +1 -1
- package/dist/components/date-time-picker/calendar.js +1 -1
- package/dist/components/date-time-picker/calendar.js.map +1 -1
- package/dist/components/date-time-picker/date-time-picker-input.js +1 -1
- package/dist/components/date-time-picker/date-time-picker-input.js.map +1 -1
- package/dist/components/date-time-picker/date-time-picker-panel.js +1 -1
- package/dist/components/date-time-picker/date-time-picker-panel.js.map +1 -1
- package/dist/components/date-time-picker/date-time-picker.js +1 -1
- package/dist/components/date-time-picker/date-time-picker.js.map +1 -1
- package/dist/components/date-time-picker/time-picker.js +1 -1
- package/dist/components/date-time-picker/time-picker.js.map +1 -1
- package/dist/components/density-provider/density-provider.js +1 -1
- package/dist/components/dialog/dialog.js +1 -1
- package/dist/components/dialog/dialog.js.map +1 -1
- package/dist/components/drawer/drawer.js +1 -1
- package/dist/components/drawer/drawer.js.map +1 -1
- package/dist/components/dropdown-menu/dropdown-menu.js +1 -1
- package/dist/components/dropdown-menu/dropdown-menu.js.map +1 -1
- package/dist/components/field/field-combobox.js +190 -181
- package/dist/components/field/field-combobox.js.map +1 -1
- package/dist/components/field/field-select.js +37 -22
- package/dist/components/field/field-select.js.map +1 -1
- package/dist/components/field/field.js +1 -1
- package/dist/components/field/field.js.map +1 -1
- package/dist/components/label/label.js +1 -1
- package/dist/components/label/label.js.map +1 -1
- package/dist/components/list/list.js +1 -1
- package/dist/components/list/list.js.map +1 -1
- package/dist/components/option-card/option-card.js +1 -1
- package/dist/components/option-card/option-card.js.map +1 -1
- package/dist/components/pill/pill.js +1 -1
- package/dist/components/pill/pill.js.map +1 -1
- package/dist/components/popover/popover.js +1 -1
- package/dist/components/popover/popover.js.map +1 -1
- package/dist/components/radio/radio.js +1 -1
- package/dist/components/radio/radio.js.map +1 -1
- package/dist/components/scroll-area/scroll-area.js +1 -1
- package/dist/components/scroll-area/scroll-area.js.map +1 -1
- package/dist/components/scroll-area/scrollbar-styles.js +1 -1
- package/dist/components/scroll-area/scrollbar-styles.js.map +1 -1
- package/dist/components/scroll-overflow/scroll-overflow.js +22 -22
- package/dist/components/scroll-overflow/scroll-overflow.js.map +1 -1
- package/dist/components/segmented-control/segmented-control.js +133 -122
- package/dist/components/segmented-control/segmented-control.js.map +1 -1
- package/dist/components/select/select.js +1 -1
- package/dist/components/select/select.js.map +1 -1
- package/dist/components/separator/separator.js +1 -1
- package/dist/components/separator/separator.js.map +1 -1
- package/dist/components/skeleton/skeleton.js +1 -1
- package/dist/components/skeleton/skeleton.js.map +1 -1
- package/dist/components/slot/compose-as-child.js +1 -1
- package/dist/components/slot/compose-as-child.js.map +1 -1
- package/dist/components/spinner/spinner.js +1 -1
- package/dist/components/spinner/spinner.js.map +1 -1
- package/dist/components/surface/surface.js +1 -1
- package/dist/components/surface/surface.js.map +1 -1
- package/dist/components/switch/switch.js +1 -1
- package/dist/components/switch/switch.js.map +1 -1
- package/dist/components/table/table-pagination.js +1 -1
- package/dist/components/table/table-pagination.js.map +1 -1
- package/dist/components/table/table.js +1 -1
- package/dist/components/table/table.js.map +1 -1
- package/dist/components/tabs/tabs.js +1 -1
- package/dist/components/tabs/tabs.js.map +1 -1
- package/dist/components/text/text.js +1 -1
- package/dist/components/text/text.js.map +1 -1
- package/dist/components/toast/toast.js +1 -1
- package/dist/components/toast/toast.js.map +1 -1
- package/dist/components/toggle/toggle-group.js +1 -1
- package/dist/components/toggle/toggle-group.js.map +1 -1
- package/dist/components/toggle/toggle.js +29 -26
- package/dist/components/toggle/toggle.js.map +1 -1
- package/dist/components/tooltip/tooltip.js +1 -1
- package/dist/components/tooltip/tooltip.js.map +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +1 -1
- package/dist/lib/clear-button.js +1 -1
- package/dist/lib/clear-button.js.map +1 -1
- package/dist/packages/tokens/dist/delivery/index.js +1 -1
- package/dist/packages/tokens/dist/delivery/index.js.map +1 -1
- package/dist/packages/tokens/dist/install.js +1 -1
- package/dist/packages/tokens/dist/install.js.map +1 -1
- package/dist/renderer/served.js +19 -14
- package/dist/renderer/served.js.map +1 -1
- package/dist/styles/host-reset.js.map +1 -1
- package/dist/styles/make-styles.js +1 -1
- package/dist/styles/make-styles.js.map +1 -1
- package/dist/styles/text-box.js.map +1 -1
- package/dist/tokens.json +1 -1
- package/package.json +5 -3
- package/scripts/migration-diagnostics-core.mjs +284 -0
- package/scripts/migration-sweep.mjs +10 -10
- package/testing/setup.cjs +87 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"field-combobox.js","sources":["../../../src/components/field/field-combobox.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { boxModel, nativeControl } from \"../../styles/host-reset\"\nimport * as tokens from \"../../tokens\"\nimport {\n Command,\n CommandEmpty,\n CommandGroup,\n CommandInput,\n CommandItem,\n CommandList,\n CommandLoading,\n CommandSeparator,\n type CommandEmptyProps,\n type CommandGroupProps,\n type CommandInputProps,\n type CommandItemProps,\n type CommandListProps,\n type CommandLoadingProps,\n type CommandSeparatorProps,\n} from \"../command/command\"\nimport { Label, type LabelProps } from \"../label/label\"\nimport {\n Popover,\n PopoverContent,\n PopoverPortal,\n PopoverTrigger,\n type PopoverContentProps,\n type PopoverPortalProps,\n type PopoverProps,\n type PopoverTriggerProps,\n} from \"../popover/popover\"\nimport { useOptionalFieldContext } from \"./field\"\n\nconst CheckIcon = (props: React.ComponentProps<\"svg\">) => (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24px\"\n viewBox=\"0 -960 960 960\"\n width=\"24px\"\n fill=\"currentColor\"\n {...props}\n >\n <path d=\"m382-354 339-339q12-12 28-12t28 12q12 12 12 28.5T777-636L410-268q-12 12-28 12t-28-12L182-440q-12-12-11.5-28.5T183-497q12-12 28.5-12t28.5 12l142 143Z\" />\n </svg>\n)\n\nconst ChevronDownIcon = (props: React.SVGProps<SVGSVGElement>) => (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24px\"\n viewBox=\"0 -960 960 960\"\n width=\"24px\"\n fill=\"currentColor\"\n {...props}\n >\n <path d=\"M459-381 314-526q-3-3-4.5-6.5T308-540q0-8 5.5-14t14.5-6h304q9 0 14.5 6t5.5 14q0 2-6 14L501-381q-5 5-10 7t-11 2q-6 0-11-2t-10-7Z\" />\n </svg>\n)\n\nconst XIcon = (props: React.SVGProps<SVGSVGElement>) => (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24px\"\n viewBox=\"0 -960 960 960\"\n width=\"24px\"\n fill=\"currentColor\"\n {...props}\n >\n <path d=\"M480-424 284-228q-11 11-28 11t-28-11q-11-11-11-28t11-28l196-196-196-196q-11-11-11-28t11-28q11-11 28-11t28 11l196 196 196-196q11-11 28-11t28 11q11 11 11 28t-11 28L536-480l196 196q11 11 11 28t-11 28q-11 11-28 11t-28-11L480-424Z\" />\n </svg>\n)\n\nconst useStyles = makeZenithStyles({\n trigger: {\n ...nativeControl,\n width: \"100%\",\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"space-between\",\n ...shorthands.gap(tokens.spacingElement2),\n ...shorthands.borderRadius(tokens.radiusLg),\n backgroundColor: \"transparent\",\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n whiteSpace: \"nowrap\",\n outlineStyle: \"none\",\n ...shorthands.border(\"0\"),\n ...shorthands.padding(0),\n \":focus-visible\": {\n outlineWidth: \"2px\",\n outlineStyle: \"solid\",\n outlineOffset: \"2px\",\n outlineColor: tokens.focusRing,\n },\n \":disabled\": {\n cursor: \"not-allowed\",\n opacity: 0.5,\n },\n\n // The open-state chevron rotation is declared HERE, on the trigger that carries the state\n // attribute, reaching the chevron by SLOT_ATTR.\n [`&[data-popup-open] [${SLOT_ATTR}=\"combobox-icon\"]`]: {\n transform: \"rotate(180deg)\",\n },\n },\n triggerChevron: {\n ...boxModel,\n width: \"1.5rem\",\n height: \"1.5rem\",\n flexShrink: 0,\n transitionProperty: \"transform\",\n transitionDuration: \"150ms\",\n transitionTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n \"@media (prefers-reduced-motion: reduce)\": {\n transitionDuration: \"0.01ms\",\n },\n color: tokens.grayA11,\n },\n value: {\n ...boxModel,\n color: tokens.grayA12,\n width: \"100%\",\n textAlign: \"left\",\n flexWrap: \"wrap\",\n display: \"flex\",\n ...shorthands.gap(tokens.spacingElement2),\n position: \"relative\",\n whiteSpace: \"normal\",\n marginRight: \"1.25rem\",\n },\n content: {\n ...boxModel,\n ...shorthands.padding(0),\n },\n command: {\n ...boxModel,\n width: \"100%\",\n ...shorthands.borderRadius(0),\n },\n input: {\n ...nativeControl,\n width: \"100%\",\n },\n list: {\n ...boxModel,\n ...shorthands.padding(tokens.spacingElement2),\n },\n item: {\n ...boxModel,\n paddingLeft: tokens.spacingGroup1,\n paddingRight: \"2rem\",\n paddingTop: \"0.375rem\",\n paddingBottom: \"0.375rem\",\n color: tokens.grayA12,\n position: \"relative\",\n display: \"flex\",\n width: \"100%\",\n cursor: \"default\",\n alignItems: \"center\",\n ...shorthands.gap(tokens.spacingElement2),\n ...shorthands.borderRadius(tokens.radiusMd),\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n outlineStyle: \"none\",\n userSelect: \"none\",\n },\n itemCheckIcon: {\n ...boxModel,\n position: \"absolute\",\n right: tokens.spacingElement2,\n display: \"flex\",\n width: \"1rem\",\n height: \"1rem\",\n alignItems: \"center\",\n justifyContent: \"center\",\n },\n checkSvg: {\n ...boxModel,\n width: \"1rem\",\n height: \"1rem\",\n color: tokens.grayA12,\n },\n empty: {\n ...boxModel,\n paddingTop: \"1.5rem\",\n paddingBottom: \"1.5rem\",\n textAlign: \"center\",\n color: tokens.grayA12,\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n },\n group: {\n ...boxModel,\n ...shorthands.padding(0),\n },\n groupLabel: {\n ...boxModel,\n color: tokens.grayA11,\n fontWeight: tokens.fontWeightSemibold,\n paddingLeft: tokens.spacingElement2,\n paddingRight: tokens.spacingElement2,\n paddingTop: tokens.spacingElement2,\n paddingBottom: tokens.spacingElement2,\n fontSize: tokens.textXs,\n lineHeight: tokens.leadingXs,\n },\n separator: {\n ...boxModel,\n backgroundColor: tokens.graySoft,\n pointerEvents: \"none\",\n marginLeft: `calc(-1 * ${tokens.spacingElement1})`,\n marginRight: `calc(-1 * ${tokens.spacingElement1})`,\n marginTop: tokens.spacingElement2,\n marginBottom: tokens.spacingElement2,\n height: \"1px\",\n },\n loading: {\n ...boxModel,\n color: tokens.grayA11,\n paddingLeft: tokens.spacingGroup1,\n paddingRight: tokens.spacingGroup1,\n paddingTop: tokens.spacingElement2,\n paddingBottom: tokens.spacingElement2,\n },\n clear: {\n ...boxModel,\n position: \"absolute\",\n right: \"2.75rem\",\n cursor: \"pointer\",\n minHeight: \"auto\",\n ...shorthands.padding(\"0.125rem\"),\n display: \"inline-flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n ...shorthands.borderRadius(\"9999px\"),\n backgroundColor: \"transparent\",\n ...shorthands.border(\"0\"),\n color: tokens.accentA11,\n \":focus-visible\": {\n outlineWidth: \"2px\",\n outlineStyle: \"solid\",\n outlineOffset: \"2px\",\n outlineColor: tokens.focusRing,\n },\n },\n clearSvg: {\n ...boxModel,\n width: \"1.25rem\",\n height: \"1.25rem\",\n },\n clearValue: {\n ...boxModel,\n cursor: \"pointer\",\n \":hover\": {\n opacity: 0.7,\n },\n color: \"currentColor\",\n ...shorthands.borderRadius(\"9999px\"),\n display: \"inline-flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n },\n clearValueSvg: {\n ...boxModel,\n width: \"1rem\",\n height: \"1rem\",\n color: \"currentColor\",\n },\n placeholder: {\n color: tokens.grayA8,\n },\n})\n\nexport type FieldComboboxProps = PopoverProps\n\nexport const FieldCombobox = React.forwardRef<HTMLElement, FieldComboboxProps>(\n function FieldCombobox(props, _ref) {\n return (\n <Popover\n data-slot=\"combobox\"\n {...{ [SLOT_ATTR]: \"combobox\" }}\n {...props}\n />\n )\n }\n)\n\nexport type FieldComboboxTriggerProps = PopoverTriggerProps\n\nexport const FieldComboboxTrigger = React.forwardRef<\n HTMLButtonElement,\n FieldComboboxTriggerProps\n>(function FieldComboboxTrigger(\n { className, children, ...props },\n forwardedRef\n) {\n const styles = useStyles()\n // Optional on purpose: this part is valid standalone and only picks up field wiring\n // when nested inside one. See useOptionalFieldContext.\n const inputRef = useOptionalFieldContext()?.inputRef ?? null\n\n const handleRef = (el: HTMLButtonElement | null) => {\n if (inputRef) {\n inputRef.current = el\n }\n if (typeof forwardedRef === \"function\") {\n forwardedRef(el)\n } else if (forwardedRef) {\n forwardedRef.current = el\n }\n }\n\n return (\n <PopoverTrigger\n ref={handleRef}\n data-slot=\"select-trigger\"\n {...{ [SLOT_ATTR]: \"select-trigger\" }}\n className={mergeClasses(styles.trigger, className)}\n {...props}\n >\n {children}\n <ChevronDownIcon\n data-slot=\"combobox-icon\"\n {...{ [SLOT_ATTR]: \"combobox-icon\" }}\n className={styles.triggerChevron}\n />\n </PopoverTrigger>\n )\n})\n\nexport type FieldComboboxContentProps = PopoverContentProps & {\n container?: PopoverPortalProps[\"container\"]\n}\n\nexport const FieldComboboxContent = React.forwardRef<\n HTMLDivElement,\n FieldComboboxContentProps\n>(function FieldComboboxContent(\n { className, children, container, ...props },\n ref\n) {\n const styles = useStyles()\n\n return (\n <PopoverPortal container={container}>\n <PopoverContent\n ref={ref}\n data-slot=\"combobox-content\"\n {...{ [SLOT_ATTR]: \"combobox-content\" }}\n className={mergeClasses(styles.content, className)}\n {...props}\n >\n <Command\n data-slot=\"combobox-command\"\n {...{ [SLOT_ATTR]: \"combobox-command\" }}\n className={styles.command}\n >\n {children}\n </Command>\n </PopoverContent>\n </PopoverPortal>\n )\n})\n\nexport type FieldComboboxValueProps = React.ComponentProps<\"div\">\n\nexport const FieldComboboxValue = React.forwardRef<\n HTMLDivElement,\n FieldComboboxValueProps\n>(function FieldComboboxValue({ className, children, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <div\n ref={ref}\n data-slot=\"combobox-value\"\n {...{ [SLOT_ATTR]: \"combobox-value\" }}\n className={mergeClasses(styles.value, className)}\n {...props}\n >\n {children}\n </div>\n )\n})\n\nexport type FieldComboboxInputProps = CommandInputProps\n\nexport const FieldComboboxInput = React.forwardRef<\n HTMLInputElement,\n FieldComboboxInputProps\n>(function FieldComboboxInput({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <CommandInput\n ref={ref}\n data-slot=\"combobox-command-input\"\n {...{ [SLOT_ATTR]: \"combobox-command-input\" }}\n className={mergeClasses(styles.input, className)}\n {...props}\n />\n )\n})\n\nexport type FieldComboboxListProps = CommandListProps\n\nexport const FieldComboboxList = React.forwardRef<\n HTMLDivElement,\n FieldComboboxListProps\n>(function FieldComboboxList({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <CommandList\n ref={ref}\n data-slot=\"combobox-command-list\"\n {...{ [SLOT_ATTR]: \"combobox-command-list\" }}\n className={mergeClasses(styles.list, className)}\n {...props}\n />\n )\n})\n\nexport type FieldComboboxItemProps = CommandItemProps\n\nexport const FieldComboboxItem = React.forwardRef<\n HTMLDivElement,\n FieldComboboxItemProps\n>(function FieldComboboxItem({ className, children, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <CommandItem\n ref={ref}\n data-slot=\"combobox-item\"\n {...{ [SLOT_ATTR]: \"combobox-item\" }}\n className={mergeClasses(styles.item, className)}\n {...props}\n >\n {children}\n </CommandItem>\n )\n})\n\nexport type FieldComboboxItemCheckIconProps = React.ComponentProps<\"span\">\n\nexport const FieldComboboxItemCheckIcon = React.forwardRef<\n HTMLSpanElement,\n FieldComboboxItemCheckIconProps\n>(function FieldComboboxItemCheckIcon({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <span\n ref={ref}\n className={mergeClasses(styles.itemCheckIcon, className)}\n {...props}\n >\n <CheckIcon className={styles.checkSvg} />\n </span>\n )\n})\n\nexport type FieldComboboxEmptyProps = CommandEmptyProps\n\nexport const FieldComboboxEmpty = React.forwardRef<\n HTMLDivElement,\n FieldComboboxEmptyProps\n>(function FieldComboboxEmpty({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <CommandEmpty\n ref={ref}\n data-slot=\"combobox-empty\"\n {...{ [SLOT_ATTR]: \"combobox-empty\" }}\n className={mergeClasses(styles.empty, className)}\n {...props}\n />\n )\n})\n\nexport type FieldComboboxGroupProps = CommandGroupProps\n\nexport const FieldComboboxGroup = React.forwardRef<\n HTMLDivElement,\n FieldComboboxGroupProps\n>(function FieldComboboxGroup({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <CommandGroup\n ref={ref}\n data-slot=\"combobox-group\"\n {...{ [SLOT_ATTR]: \"combobox-group\" }}\n className={mergeClasses(styles.group, className)}\n {...props}\n />\n )\n})\n\nexport type FieldComboboxGroupLabelProps = LabelProps\n\nexport const FieldComboboxGroupLabel = React.forwardRef<\n HTMLLabelElement,\n FieldComboboxGroupLabelProps\n>(function FieldComboboxGroupLabel({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <Label\n ref={ref}\n data-slot=\"combobox-group-label\"\n {...{ [SLOT_ATTR]: \"combobox-group-label\" }}\n className={mergeClasses(styles.groupLabel, className)}\n {...props}\n />\n )\n})\n\nexport type FieldComboboxSeparatorProps = CommandSeparatorProps\n\nexport const FieldComboboxSeparator = React.forwardRef<\n HTMLDivElement,\n FieldComboboxSeparatorProps\n>(function FieldComboboxSeparator({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <CommandSeparator\n ref={ref}\n data-slot=\"select-separator\"\n {...{ [SLOT_ATTR]: \"select-separator\" }}\n className={mergeClasses(styles.separator, className)}\n {...props}\n />\n )\n})\n\nexport type FieldComboboxLoadingProps = CommandLoadingProps\n\nexport const FieldComboboxLoading = React.forwardRef<\n HTMLDivElement,\n FieldComboboxLoadingProps\n>(function FieldComboboxLoading({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <CommandLoading\n ref={ref}\n data-slot=\"combobox-command-loading\"\n {...{ [SLOT_ATTR]: \"combobox-command-loading\" }}\n className={mergeClasses(styles.loading, className)}\n {...props}\n />\n )\n})\n\nexport type FieldComboboxClearProps = React.ComponentProps<\"span\">\n\nexport const FieldComboboxClear = React.forwardRef<\n HTMLSpanElement,\n FieldComboboxClearProps\n>(function FieldComboboxClear({ className, onClick, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <span\n ref={ref}\n role=\"button\"\n tabIndex={0}\n className={mergeClasses(styles.clear, className)}\n onPointerDown={(event) => {\n event.preventDefault()\n event.stopPropagation()\n }}\n onClick={(event) => {\n event.preventDefault()\n event.stopPropagation()\n onClick?.(event)\n }}\n {...props}\n >\n <XIcon className={styles.clearSvg} />\n </span>\n )\n})\n\nexport type FieldComboboxPlaceholderProps = React.ComponentProps<\"span\">\n\nexport const FieldComboboxPlaceholder = React.forwardRef<\n HTMLSpanElement,\n FieldComboboxPlaceholderProps\n>(function FieldComboboxPlaceholder({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <span\n ref={ref}\n className={mergeClasses(styles.placeholder, className)}\n {...props}\n />\n )\n})\n\nexport type FieldComboboxClearValueProps = React.ComponentProps<\"span\">\n\nexport const FieldComboboxClearValue = React.forwardRef<\n HTMLSpanElement,\n FieldComboboxClearValueProps\n>(function FieldComboboxClearValue({ className, onClick, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <span\n ref={ref}\n role=\"button\"\n tabIndex={0}\n className={mergeClasses(styles.clearValue, className)}\n onPointerDown={(event) => {\n event.preventDefault()\n event.stopPropagation()\n }}\n onClick={(event) => {\n event.preventDefault()\n event.stopPropagation()\n onClick?.(event)\n }}\n {...props}\n >\n <XIcon className={styles.clearValueSvg} />\n </span>\n )\n})\n\nexport {\n FieldCombobox as Combobox,\n FieldComboboxGroup as ComboboxGroup,\n FieldComboboxGroupLabel as ComboboxGroupLabel,\n FieldComboboxValue as ComboboxValue,\n FieldComboboxTrigger as ComboboxTrigger,\n FieldComboboxContent as ComboboxContent,\n FieldComboboxItem as ComboboxItem,\n FieldComboboxItemCheckIcon as ComboboxItemCheckIcon,\n FieldComboboxEmpty as ComboboxEmpty,\n FieldComboboxSeparator as ComboboxSeparator,\n FieldComboboxInput as ComboboxInput,\n FieldComboboxList as ComboboxList,\n FieldComboboxLoading as ComboboxLoading,\n FieldComboboxClear as ComboboxClear,\n FieldComboboxClearValue as ComboboxClearValue,\n FieldComboboxPlaceholder as ComboboxPlaceholder,\n}\n"],"names":["CheckIcon","props","jsx","ChevronDownIcon","XIcon","useStyles","makeZenithStyles","nativeControl","shorthands","tokens.spacingElement2","tokens.radiusLg","tokens.textSm","tokens.leadingSm","tokens.focusRing","SLOT_ATTR","boxModel","tokens.grayA11","tokens.grayA12","tokens.spacingGroup1","tokens.radiusMd","tokens.fontWeightSemibold","tokens.textXs","tokens.leadingXs","tokens.graySoft","tokens.spacingElement1","tokens.accentA11","tokens.grayA8","FieldCombobox","React","_ref","Popover","FieldComboboxTrigger","className","children","forwardedRef","styles","inputRef","_a","useOptionalFieldContext","jsxs","PopoverTrigger","el","mergeClasses","FieldComboboxContent","container","ref","PopoverPortal","PopoverContent","Command","FieldComboboxValue","FieldComboboxInput","CommandInput","FieldComboboxList","CommandList","FieldComboboxItem","CommandItem","FieldComboboxItemCheckIcon","FieldComboboxEmpty","CommandEmpty","FieldComboboxGroup","CommandGroup","FieldComboboxGroupLabel","Label","FieldComboboxSeparator","CommandSeparator","FieldComboboxLoading","CommandLoading","FieldComboboxClear","onClick","event","FieldComboboxPlaceholder","FieldComboboxClearValue"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"field-combobox.js","sources":["../../../src/components/field/field-combobox.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1/core\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { boxModel, nativeControl } from \"../../styles/host-reset\"\nimport * as tokens from \"../../tokens\"\nimport {\n Command,\n CommandEmpty,\n CommandGroup,\n CommandInput,\n CommandItem,\n CommandList,\n CommandLoading,\n CommandSeparator,\n type CommandEmptyProps,\n type CommandGroupProps,\n type CommandInputProps,\n type CommandItemProps,\n type CommandListProps,\n type CommandLoadingProps,\n type CommandSeparatorProps,\n} from \"../command/command\"\nimport { Label, type LabelProps } from \"../label/label\"\nimport {\n Popover,\n PopoverContent,\n PopoverPortal,\n PopoverTrigger,\n type PopoverContentProps,\n type PopoverPortalProps,\n type PopoverProps,\n type PopoverTriggerProps,\n} from \"../popover/popover\"\nimport { useOptionalFieldContext } from \"./field\"\n\nconst CheckIcon = (props: React.ComponentProps<\"svg\">) => (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24px\"\n viewBox=\"0 -960 960 960\"\n width=\"24px\"\n fill=\"currentColor\"\n {...props}\n >\n <path d=\"m382-354 339-339q12-12 28-12t28 12q12 12 12 28.5T777-636L410-268q-12 12-28 12t-28-12L182-440q-12-12-11.5-28.5T183-497q12-12 28.5-12t28.5 12l142 143Z\" />\n </svg>\n)\n\nconst ChevronDownIcon = (props: React.SVGProps<SVGSVGElement>) => (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24px\"\n viewBox=\"0 -960 960 960\"\n width=\"24px\"\n fill=\"currentColor\"\n {...props}\n >\n <path d=\"M459-381 314-526q-3-3-4.5-6.5T308-540q0-8 5.5-14t14.5-6h304q9 0 14.5 6t5.5 14q0 2-6 14L501-381q-5 5-10 7t-11 2q-6 0-11-2t-10-7Z\" />\n </svg>\n)\n\nconst XIcon = (props: React.SVGProps<SVGSVGElement>) => (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n height=\"24px\"\n viewBox=\"0 -960 960 960\"\n width=\"24px\"\n fill=\"currentColor\"\n {...props}\n >\n <path d=\"M480-424 284-228q-11 11-28 11t-28-11q-11-11-11-28t11-28l196-196-196-196q-11-11-11-28t11-28q11-11 28-11t28 11l196 196 196-196q11-11 28-11t28 11q11 11 11 28t-11 28L536-480l196 196q11 11 11 28t-11 28q-11 11-28 11t-28-11L480-424Z\" />\n </svg>\n)\n\nconst useStyles = makeZenithStyles({\n trigger: {\n ...nativeControl,\n width: \"100%\",\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"space-between\",\n ...shorthands.gap(tokens.spacingElement2),\n ...shorthands.borderRadius(tokens.radiusLg),\n backgroundColor: \"transparent\",\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n whiteSpace: \"nowrap\",\n outlineStyle: \"none\",\n ...shorthands.border(\"0\"),\n ...shorthands.padding(0),\n \":focus-visible\": {\n outlineWidth: \"2px\",\n outlineStyle: \"solid\",\n outlineOffset: \"2px\",\n outlineColor: tokens.focusRing,\n },\n \":disabled\": {\n cursor: \"not-allowed\",\n opacity: 0.5,\n },\n\n // The open-state chevron rotation is declared HERE, on the trigger that carries the state\n // attribute, reaching the chevron by SLOT_ATTR.\n [`&[data-popup-open] [${SLOT_ATTR}=\"combobox-icon\"]`]: {\n transform: \"rotate(180deg)\",\n },\n },\n triggerInField: {\n outlineStyle: \"none\",\n \":focus-visible\": {\n outlineStyle: \"none\",\n },\n },\n triggerChevron: {\n ...boxModel,\n width: \"1.5rem\",\n height: \"1.5rem\",\n flexShrink: 0,\n transitionProperty: \"transform\",\n transitionDuration: \"150ms\",\n transitionTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n \"@media (prefers-reduced-motion: reduce)\": {\n transitionDuration: \"0.01ms\",\n },\n color: tokens.grayA11,\n },\n value: {\n ...boxModel,\n color: tokens.grayA12,\n width: \"100%\",\n textAlign: \"left\",\n flexWrap: \"wrap\",\n display: \"flex\",\n ...shorthands.gap(tokens.spacingElement2),\n position: \"relative\",\n whiteSpace: \"normal\",\n marginRight: \"1.25rem\",\n },\n content: {\n ...boxModel,\n ...shorthands.padding(0),\n },\n command: {\n ...boxModel,\n width: \"100%\",\n ...shorthands.borderRadius(0),\n },\n input: {\n ...nativeControl,\n width: \"100%\",\n },\n list: {\n ...boxModel,\n ...shorthands.padding(tokens.spacingElement2),\n },\n item: {\n ...boxModel,\n paddingLeft: tokens.spacingGroup1,\n paddingRight: \"2rem\",\n paddingTop: \"0.375rem\",\n paddingBottom: \"0.375rem\",\n color: tokens.grayA12,\n position: \"relative\",\n display: \"flex\",\n width: \"100%\",\n cursor: \"default\",\n alignItems: \"center\",\n ...shorthands.gap(tokens.spacingElement2),\n ...shorthands.borderRadius(tokens.radiusMd),\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n outlineStyle: \"none\",\n userSelect: \"none\",\n },\n itemCheckIcon: {\n ...boxModel,\n position: \"absolute\",\n right: tokens.spacingElement2,\n display: \"flex\",\n width: \"1rem\",\n height: \"1rem\",\n alignItems: \"center\",\n justifyContent: \"center\",\n },\n checkSvg: {\n ...boxModel,\n width: \"1rem\",\n height: \"1rem\",\n color: tokens.grayA12,\n },\n empty: {\n ...boxModel,\n paddingTop: \"1.5rem\",\n paddingBottom: \"1.5rem\",\n textAlign: \"center\",\n color: tokens.grayA12,\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n },\n group: {\n ...boxModel,\n ...shorthands.padding(0),\n },\n groupLabel: {\n ...boxModel,\n color: tokens.grayA11,\n fontWeight: tokens.fontWeightSemibold,\n paddingLeft: tokens.spacingElement2,\n paddingRight: tokens.spacingElement2,\n paddingTop: tokens.spacingElement2,\n paddingBottom: tokens.spacingElement2,\n fontSize: tokens.textXs,\n lineHeight: tokens.leadingXs,\n },\n separator: {\n ...boxModel,\n backgroundColor: tokens.graySoft,\n pointerEvents: \"none\",\n marginLeft: `calc(-1 * ${tokens.spacingElement1})`,\n marginRight: `calc(-1 * ${tokens.spacingElement1})`,\n marginTop: tokens.spacingElement2,\n marginBottom: tokens.spacingElement2,\n height: \"1px\",\n },\n loading: {\n ...boxModel,\n color: tokens.grayA11,\n paddingLeft: tokens.spacingGroup1,\n paddingRight: tokens.spacingGroup1,\n paddingTop: tokens.spacingElement2,\n paddingBottom: tokens.spacingElement2,\n },\n clear: {\n ...boxModel,\n position: \"absolute\",\n right: \"2.75rem\",\n cursor: \"pointer\",\n minHeight: \"auto\",\n ...shorthands.padding(\"0.125rem\"),\n display: \"inline-flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n ...shorthands.borderRadius(\"9999px\"),\n backgroundColor: \"transparent\",\n ...shorthands.border(\"0\"),\n color: tokens.accentA11,\n \":focus-visible\": {\n outlineWidth: \"2px\",\n outlineStyle: \"solid\",\n outlineOffset: \"2px\",\n outlineColor: tokens.focusRing,\n },\n },\n clearSvg: {\n ...boxModel,\n width: \"1.25rem\",\n height: \"1.25rem\",\n },\n clearValue: {\n ...boxModel,\n cursor: \"pointer\",\n \":hover\": {\n opacity: 0.7,\n },\n color: \"currentColor\",\n ...shorthands.borderRadius(\"9999px\"),\n display: \"inline-flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n },\n clearValueSvg: {\n ...boxModel,\n width: \"1rem\",\n height: \"1rem\",\n color: \"currentColor\",\n },\n placeholder: {\n color: tokens.grayA8,\n },\n})\n\nexport type FieldComboboxProps = PopoverProps\n\nexport const FieldCombobox = React.forwardRef<HTMLElement, FieldComboboxProps>(\n function FieldCombobox(props, _ref) {\n return (\n <Popover\n data-slot=\"combobox\"\n {...{ [SLOT_ATTR]: \"combobox\" }}\n {...props}\n />\n )\n }\n)\n\nexport type FieldComboboxTriggerProps = PopoverTriggerProps\n\nexport const FieldComboboxTrigger = React.forwardRef<\n HTMLButtonElement,\n FieldComboboxTriggerProps\n>(function FieldComboboxTrigger(\n { className, children, ...props },\n forwardedRef\n) {\n const styles = useStyles()\n // Optional on purpose: this part is valid standalone and only picks up field wiring\n // when nested inside one. See useOptionalFieldContext.\n const fieldContext = useOptionalFieldContext()\n const inField = fieldContext !== null\n const inputRef = fieldContext?.inputRef ?? null\n\n const handleRef = (el: HTMLButtonElement | null) => {\n if (inputRef) {\n inputRef.current = el\n }\n if (typeof forwardedRef === \"function\") {\n forwardedRef(el)\n } else if (forwardedRef) {\n forwardedRef.current = el\n }\n }\n\n return (\n <PopoverTrigger\n ref={handleRef}\n data-slot=\"select-trigger\"\n {...{ [SLOT_ATTR]: \"select-trigger\" }}\n className={mergeClasses(\n styles.trigger,\n inField && styles.triggerInField,\n className\n )}\n {...props}\n >\n {children}\n <ChevronDownIcon\n data-slot=\"combobox-icon\"\n {...{ [SLOT_ATTR]: \"combobox-icon\" }}\n className={styles.triggerChevron}\n />\n </PopoverTrigger>\n )\n})\n\nexport type FieldComboboxContentProps = PopoverContentProps & {\n container?: PopoverPortalProps[\"container\"]\n}\n\nexport const FieldComboboxContent = React.forwardRef<\n HTMLDivElement,\n FieldComboboxContentProps\n>(function FieldComboboxContent(\n { className, children, container, ...props },\n ref\n) {\n const styles = useStyles()\n\n return (\n <PopoverPortal container={container}>\n <PopoverContent\n ref={ref}\n data-slot=\"combobox-content\"\n {...{ [SLOT_ATTR]: \"combobox-content\" }}\n className={mergeClasses(styles.content, className)}\n {...props}\n >\n <Command\n data-slot=\"combobox-command\"\n {...{ [SLOT_ATTR]: \"combobox-command\" }}\n className={styles.command}\n >\n {children}\n </Command>\n </PopoverContent>\n </PopoverPortal>\n )\n})\n\nexport type FieldComboboxValueProps = React.ComponentProps<\"div\">\n\nexport const FieldComboboxValue = React.forwardRef<\n HTMLDivElement,\n FieldComboboxValueProps\n>(function FieldComboboxValue({ className, children, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <div\n ref={ref}\n data-slot=\"combobox-value\"\n {...{ [SLOT_ATTR]: \"combobox-value\" }}\n className={mergeClasses(styles.value, className)}\n {...props}\n >\n {children}\n </div>\n )\n})\n\nexport type FieldComboboxInputProps = CommandInputProps\n\nexport const FieldComboboxInput = React.forwardRef<\n HTMLInputElement,\n FieldComboboxInputProps\n>(function FieldComboboxInput({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <CommandInput\n ref={ref}\n data-slot=\"combobox-command-input\"\n {...{ [SLOT_ATTR]: \"combobox-command-input\" }}\n className={mergeClasses(styles.input, className)}\n {...props}\n />\n )\n})\n\nexport type FieldComboboxListProps = CommandListProps\n\nexport const FieldComboboxList = React.forwardRef<\n HTMLDivElement,\n FieldComboboxListProps\n>(function FieldComboboxList({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <CommandList\n ref={ref}\n data-slot=\"combobox-command-list\"\n {...{ [SLOT_ATTR]: \"combobox-command-list\" }}\n className={mergeClasses(styles.list, className)}\n {...props}\n />\n )\n})\n\nexport type FieldComboboxItemProps = CommandItemProps\n\nexport const FieldComboboxItem = React.forwardRef<\n HTMLDivElement,\n FieldComboboxItemProps\n>(function FieldComboboxItem({ className, children, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <CommandItem\n ref={ref}\n data-slot=\"combobox-item\"\n {...{ [SLOT_ATTR]: \"combobox-item\" }}\n className={mergeClasses(styles.item, className)}\n {...props}\n >\n {children}\n </CommandItem>\n )\n})\n\nexport type FieldComboboxItemCheckIconProps = React.ComponentProps<\"span\">\n\nexport const FieldComboboxItemCheckIcon = React.forwardRef<\n HTMLSpanElement,\n FieldComboboxItemCheckIconProps\n>(function FieldComboboxItemCheckIcon({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <span\n ref={ref}\n className={mergeClasses(styles.itemCheckIcon, className)}\n {...props}\n >\n <CheckIcon className={styles.checkSvg} />\n </span>\n )\n})\n\nexport type FieldComboboxEmptyProps = CommandEmptyProps\n\nexport const FieldComboboxEmpty = React.forwardRef<\n HTMLDivElement,\n FieldComboboxEmptyProps\n>(function FieldComboboxEmpty({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <CommandEmpty\n ref={ref}\n data-slot=\"combobox-empty\"\n {...{ [SLOT_ATTR]: \"combobox-empty\" }}\n className={mergeClasses(styles.empty, className)}\n {...props}\n />\n )\n})\n\nexport type FieldComboboxGroupProps = CommandGroupProps\n\nexport const FieldComboboxGroup = React.forwardRef<\n HTMLDivElement,\n FieldComboboxGroupProps\n>(function FieldComboboxGroup({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <CommandGroup\n ref={ref}\n data-slot=\"combobox-group\"\n {...{ [SLOT_ATTR]: \"combobox-group\" }}\n className={mergeClasses(styles.group, className)}\n {...props}\n />\n )\n})\n\nexport type FieldComboboxGroupLabelProps = LabelProps\n\nexport const FieldComboboxGroupLabel = React.forwardRef<\n HTMLLabelElement,\n FieldComboboxGroupLabelProps\n>(function FieldComboboxGroupLabel({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <Label\n ref={ref}\n data-slot=\"combobox-group-label\"\n {...{ [SLOT_ATTR]: \"combobox-group-label\" }}\n className={mergeClasses(styles.groupLabel, className)}\n {...props}\n />\n )\n})\n\nexport type FieldComboboxSeparatorProps = CommandSeparatorProps\n\nexport const FieldComboboxSeparator = React.forwardRef<\n HTMLDivElement,\n FieldComboboxSeparatorProps\n>(function FieldComboboxSeparator({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <CommandSeparator\n ref={ref}\n data-slot=\"select-separator\"\n {...{ [SLOT_ATTR]: \"select-separator\" }}\n className={mergeClasses(styles.separator, className)}\n {...props}\n />\n )\n})\n\nexport type FieldComboboxLoadingProps = CommandLoadingProps\n\nexport const FieldComboboxLoading = React.forwardRef<\n HTMLDivElement,\n FieldComboboxLoadingProps\n>(function FieldComboboxLoading({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <CommandLoading\n ref={ref}\n data-slot=\"combobox-command-loading\"\n {...{ [SLOT_ATTR]: \"combobox-command-loading\" }}\n className={mergeClasses(styles.loading, className)}\n {...props}\n />\n )\n})\n\nexport type FieldComboboxClearProps = React.ComponentProps<\"span\">\n\nexport const FieldComboboxClear = React.forwardRef<\n HTMLSpanElement,\n FieldComboboxClearProps\n>(function FieldComboboxClear({ className, onClick, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <span\n ref={ref}\n role=\"button\"\n tabIndex={0}\n className={mergeClasses(styles.clear, className)}\n onPointerDown={(event) => {\n event.preventDefault()\n event.stopPropagation()\n }}\n onClick={(event) => {\n event.preventDefault()\n event.stopPropagation()\n onClick?.(event)\n }}\n {...props}\n >\n <XIcon className={styles.clearSvg} />\n </span>\n )\n})\n\nexport type FieldComboboxPlaceholderProps = React.ComponentProps<\"span\">\n\nexport const FieldComboboxPlaceholder = React.forwardRef<\n HTMLSpanElement,\n FieldComboboxPlaceholderProps\n>(function FieldComboboxPlaceholder({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <span\n ref={ref}\n className={mergeClasses(styles.placeholder, className)}\n {...props}\n />\n )\n})\n\nexport type FieldComboboxClearValueProps = React.ComponentProps<\"span\">\n\nexport const FieldComboboxClearValue = React.forwardRef<\n HTMLSpanElement,\n FieldComboboxClearValueProps\n>(function FieldComboboxClearValue({ className, onClick, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <span\n ref={ref}\n role=\"button\"\n tabIndex={0}\n className={mergeClasses(styles.clearValue, className)}\n onPointerDown={(event) => {\n event.preventDefault()\n event.stopPropagation()\n }}\n onClick={(event) => {\n event.preventDefault()\n event.stopPropagation()\n onClick?.(event)\n }}\n {...props}\n >\n <XIcon className={styles.clearValueSvg} />\n </span>\n )\n})\n\nexport {\n FieldCombobox as Combobox,\n FieldComboboxGroup as ComboboxGroup,\n FieldComboboxGroupLabel as ComboboxGroupLabel,\n FieldComboboxValue as ComboboxValue,\n FieldComboboxTrigger as ComboboxTrigger,\n FieldComboboxContent as ComboboxContent,\n FieldComboboxItem as ComboboxItem,\n FieldComboboxItemCheckIcon as ComboboxItemCheckIcon,\n FieldComboboxEmpty as ComboboxEmpty,\n FieldComboboxSeparator as ComboboxSeparator,\n FieldComboboxInput as ComboboxInput,\n FieldComboboxList as ComboboxList,\n FieldComboboxLoading as ComboboxLoading,\n FieldComboboxClear as ComboboxClear,\n FieldComboboxClearValue as ComboboxClearValue,\n FieldComboboxPlaceholder as ComboboxPlaceholder,\n}\n"],"names":["CheckIcon","props","jsx","ChevronDownIcon","XIcon","useStyles","makeZenithStyles","nativeControl","shorthands","tokens.spacingElement2","tokens.radiusLg","tokens.textSm","tokens.leadingSm","tokens.focusRing","SLOT_ATTR","boxModel","tokens.grayA11","tokens.grayA12","tokens.spacingGroup1","tokens.radiusMd","tokens.fontWeightSemibold","tokens.textXs","tokens.leadingXs","tokens.graySoft","tokens.spacingElement1","tokens.accentA11","tokens.grayA8","FieldCombobox","React","_ref","Popover","FieldComboboxTrigger","className","children","forwardedRef","styles","fieldContext","useOptionalFieldContext","inField","inputRef","jsxs","PopoverTrigger","el","mergeClasses","FieldComboboxContent","container","ref","PopoverPortal","PopoverContent","Command","FieldComboboxValue","FieldComboboxInput","CommandInput","FieldComboboxList","CommandList","FieldComboboxItem","CommandItem","FieldComboboxItemCheckIcon","FieldComboboxEmpty","CommandEmpty","FieldComboboxGroup","CommandGroup","FieldComboboxGroupLabel","Label","FieldComboboxSeparator","CommandSeparator","FieldComboboxLoading","CommandLoading","FieldComboboxClear","onClick","event","FieldComboboxPlaceholder","FieldComboboxClearValue"],"mappings":"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"}
|
|
@@ -1,26 +1,41 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import * as
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
1
|
+
import { jsx as s } from "react/jsx-runtime";
|
|
2
|
+
import * as S from "react";
|
|
3
|
+
import { mergeClasses as u } from "@epilot/zenith-runtime/v1/core.js";
|
|
4
|
+
import { makeZenithStyles as m } from "../../styles/make-styles.js";
|
|
5
|
+
import { SelectTrigger as g } from "../select/select.js";
|
|
6
|
+
import { Select as B, SelectContent as j, SelectGroup as k, SelectItem as v, SelectLabel as D, SelectScrollDownButton as G, SelectScrollUpButton as L, SelectSeparator as N, SelectTriggerClear as O, SelectValue as U } from "../select/select.js";
|
|
7
|
+
import { useOptionalFieldContext as p } from "./field.js";
|
|
8
|
+
const f = m({
|
|
9
|
+
triggerInField: {
|
|
10
|
+
outlineStyle: "none",
|
|
11
|
+
":focus-visible": {
|
|
12
|
+
outlineStyle: "none"
|
|
13
|
+
}
|
|
14
|
+
}
|
|
15
|
+
}), I = S.forwardRef(function({ className: o, ...n }, e) {
|
|
16
|
+
const c = f(), t = p(), i = t !== null, r = (t == null ? void 0 : t.inputRef) ?? null;
|
|
17
|
+
return /* @__PURE__ */ s(
|
|
18
|
+
g,
|
|
19
|
+
{
|
|
20
|
+
ref: (l) => {
|
|
21
|
+
r && (r.current = l), typeof e == "function" ? e(l) : e && (e.current = l);
|
|
22
|
+
},
|
|
23
|
+
className: u(i && c.triggerInField, o),
|
|
24
|
+
...n
|
|
25
|
+
}
|
|
26
|
+
);
|
|
12
27
|
});
|
|
13
28
|
export {
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
29
|
+
B as Select,
|
|
30
|
+
j as SelectContent,
|
|
31
|
+
k as SelectGroup,
|
|
32
|
+
v as SelectItem,
|
|
33
|
+
D as SelectLabel,
|
|
34
|
+
G as SelectScrollDownButton,
|
|
35
|
+
L as SelectScrollUpButton,
|
|
36
|
+
N as SelectSeparator,
|
|
37
|
+
I as SelectTrigger,
|
|
38
|
+
O as SelectTriggerClear,
|
|
39
|
+
U as SelectValue
|
|
25
40
|
};
|
|
26
41
|
//# sourceMappingURL=field-select.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"field-select.js","sources":["../../../src/components/field/field-select.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport {\n Select,\n SelectContent,\n SelectGroup,\n SelectItem,\n SelectLabel,\n SelectScrollDownButton,\n SelectScrollUpButton,\n SelectSeparator,\n SelectTrigger as SelectTriggerBase,\n SelectTriggerClear,\n SelectValue,\n type SelectContentProps,\n type SelectGroupProps,\n type SelectItemProps,\n type SelectLabelProps,\n type SelectProps,\n type SelectScrollDownButtonProps,\n type SelectScrollUpButtonProps,\n type SelectSeparatorProps,\n type SelectTriggerClearProps,\n type SelectTriggerProps,\n type SelectValueProps,\n} from \"../select/select\"\nimport { useOptionalFieldContext } from \"./field\"\n\nexport const SelectTrigger = React.forwardRef<\n HTMLButtonElement,\n SelectTriggerProps\n>(function SelectTrigger({ ...props }, forwardedRef) {\n // Optional on purpose: this part is valid standalone and only picks up field wiring\n // when nested inside one. See useOptionalFieldContext.\n const
|
|
1
|
+
{"version":3,"file":"field-select.js","sources":["../../../src/components/field/field-select.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { mergeClasses } from \"@epilot/zenith-runtime/v1/core\"\n\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport {\n Select,\n SelectContent,\n SelectGroup,\n SelectItem,\n SelectLabel,\n SelectScrollDownButton,\n SelectScrollUpButton,\n SelectSeparator,\n SelectTrigger as SelectTriggerBase,\n SelectTriggerClear,\n SelectValue,\n type SelectContentProps,\n type SelectGroupProps,\n type SelectItemProps,\n type SelectLabelProps,\n type SelectProps,\n type SelectScrollDownButtonProps,\n type SelectScrollUpButtonProps,\n type SelectSeparatorProps,\n type SelectTriggerClearProps,\n type SelectTriggerProps,\n type SelectValueProps,\n} from \"../select/select\"\nimport { useOptionalFieldContext } from \"./field\"\n\nconst useStyles = makeZenithStyles({\n triggerInField: {\n outlineStyle: \"none\",\n \":focus-visible\": {\n outlineStyle: \"none\",\n },\n },\n})\n\nexport const SelectTrigger = React.forwardRef<\n HTMLButtonElement,\n SelectTriggerProps\n>(function SelectTrigger({ className, ...props }, forwardedRef) {\n const styles = useStyles()\n // Optional on purpose: this part is valid standalone and only picks up field wiring\n // when nested inside one. See useOptionalFieldContext.\n const fieldContext = useOptionalFieldContext()\n const inField = fieldContext !== null\n const inputRef = fieldContext?.inputRef ?? null\n\n const handleRef = (el: HTMLButtonElement | null) => {\n if (inputRef) {\n inputRef.current = el\n }\n if (typeof forwardedRef === \"function\") {\n forwardedRef(el)\n } else if (forwardedRef) {\n forwardedRef.current = el\n }\n }\n\n return (\n <SelectTriggerBase\n ref={handleRef}\n className={mergeClasses(inField && styles.triggerInField, className)}\n {...props}\n />\n )\n})\n\nexport {\n Select,\n SelectContent,\n SelectGroup,\n SelectItem,\n SelectLabel,\n SelectScrollDownButton,\n SelectScrollUpButton,\n SelectSeparator,\n SelectTriggerClear,\n SelectValue,\n type SelectContentProps,\n type SelectGroupProps,\n type SelectItemProps,\n type SelectLabelProps,\n type SelectProps,\n type SelectScrollDownButtonProps,\n type SelectScrollUpButtonProps,\n type SelectSeparatorProps,\n type SelectTriggerClearProps,\n type SelectTriggerProps,\n type SelectValueProps,\n}\n"],"names":["useStyles","makeZenithStyles","SelectTrigger","React","className","props","forwardedRef","styles","fieldContext","useOptionalFieldContext","inField","inputRef","jsx","SelectTriggerBase","el","mergeClasses"],"mappings":";;;;;;;AA8BA,MAAMA,IAAYC,EAAiB;AAAA,EACjC,gBAAgB;AAAA,IACd,cAAc;AAAA,IACd,kBAAkB;AAAA,MAChB,cAAc;AAAA,IAAA;AAAA,EAChB;AAEJ,CAAC,GAEYC,IAAgBC,EAAM,WAGjC,SAAuB,EAAE,WAAAC,GAAW,GAAGC,EAAA,GAASC,GAAc;AAC9D,QAAMC,IAASP,EAAA,GAGTQ,IAAeC,EAAA,GACfC,IAAUF,MAAiB,MAC3BG,KAAWH,KAAA,gBAAAA,EAAc,aAAY;AAa3C,SACE,gBAAAI;AAAA,IAACC;AAAAA,IAAA;AAAA,MACC,KAbc,CAACC,MAAiC;AAClD,QAAIH,MACFA,EAAS,UAAUG,IAEjB,OAAOR,KAAiB,aAC1BA,EAAaQ,CAAE,IACNR,MACTA,EAAa,UAAUQ;AAAA,MAE3B;AAAA,MAKI,WAAWC,EAAaL,KAAWH,EAAO,gBAAgBH,CAAS;AAAA,MAClE,GAAGC;AAAA,IAAA;AAAA,EAAA;AAGV,CAAC;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as c } from "react/jsx-runtime";
|
|
2
2
|
import * as a from "react";
|
|
3
|
-
import { mergeClasses as f, SLOT_ATTR as r, shorthands as d } from "@epilot/zenith-runtime/v1";
|
|
3
|
+
import { mergeClasses as f, SLOT_ATTR as r, shorthands as d } from "@epilot/zenith-runtime/v1/core.js";
|
|
4
4
|
import { makeZenithStyles as P } from "../../styles/make-styles.js";
|
|
5
5
|
import { boxModel as m, nativeControl as N } from "../../styles/host-reset.js";
|
|
6
6
|
import { fontWeightNormal as S, leadingSm as R, textSm as D, grayA11 as O, grayA8 as G, grayA12 as x, fieldPaddingY as w, fieldInputHeight as V, leadingXs as E, textXs as C, errorOnSoft as H, errorA4 as j, errorSoft as I, grayA3 as T, accentA4 as X, accentA3 as Y, grayA4 as q, focusRing as U, spacingElement1 as L, fieldPaddingX as A, spacingElement2 as F, fieldSetGap as Z, radiusLg as J } from "../../tokens/index.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"field.js","sources":["../../../src/components/field/field.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { boxModel, nativeControl } from \"../../styles/host-reset\"\nimport * as tokens from \"../../tokens\"\n\n/**\n * Plain elements, not a primitive. v1's Field uses no Radix primitive at all — it is a custom\n * implementation with its own context, and v2 already had the same context (`FieldContext`,\n * carrying `inputRef`).\n */\nconst FieldRootBase = \"div\" as const\nconst FieldLabelBase = \"label\" as const\nconst FieldControlBase = \"input\" as const\nconst FieldDescriptionBase = \"p\" as const\nconst FieldErrorBase = \"div\" as const\n\nexport type FieldInputRef =\n | HTMLInputElement\n | HTMLTextAreaElement\n | HTMLSelectElement\n | HTMLButtonElement\n | null\n\nexport interface FieldContextValue {\n inputRef: React.RefObject<FieldInputRef>\n}\n\nconst FieldContext = React.createContext<FieldContextValue | null>(null)\n\nexport const useFieldContext = () => {\n const context = React.useContext(FieldContext)\n if (!context) {\n throw new Error(\"FieldInput must be used within a Field component\")\n }\n return context\n}\n\n/**\n * Field context when there is one, `null` otherwise — for parts that work both inside and outside\n * a Field.\n */\nexport const useOptionalFieldContext = (): FieldContextValue | null =>\n React.useContext(FieldContext)\n\nexport type FieldVariant = \"default\" | \"highlight\" | \"readonly\" | \"destructive\"\n\n/** The controls a Field wraps; their `:disabled` is what makes the field disabled. */\nconst FIELD_CONTROL_SLOTS = [\"field-input\", \"field-textarea\", \"select-trigger\"]\n/** FieldLabel, and the standalone Label when a caller uses it inside a Field. */\nconst FIELD_LABEL_SLOTS = [\"field-label\", \"label\"]\nconst DISABLED_LABEL = { cursor: \"not-allowed\", opacity: 0.5 }\n\n/**\n * One rule per (disabled condition, label slot). Each `:has()` names a single control rather than\n * any `:disabled` descendant, so an unrelated disabled button beside an enabled control (a clear\n * button with nothing to clear) does not dim the label. One key per selector: no comma lists.\n */\nconst disabledLabelRules = () =>\n Object.fromEntries(\n [\n \"&[data-disabled]\",\n ...FIELD_CONTROL_SLOTS.map(\n (slot) => `&:has([${SLOT_ATTR}=\"${slot}\"]:disabled)`\n ),\n ].flatMap((condition) =>\n FIELD_LABEL_SLOTS.map((label) => [\n `${condition} [${SLOT_ATTR}=\"${label}\"]`,\n DISABLED_LABEL,\n ])\n )\n )\n\n/**\n * Password managers (1Password, NordPass) inject a button next to the control, sometimes inline. In\n * a column the injection became a new row and the field grew (#5). It is placed in a second column\n * beside the control instead, centred on the control's row, with negative block margins as deep as\n * the field's padding so a button taller than the control does not stretch the row either.\n * Recognised as an element directly after a control that is not one of Zenith's own parts.\n */\nconst BESIDE_CONTROL = {\n alignSelf: \"center\",\n marginTop: `calc(-1 * ${tokens.fieldPaddingY})`,\n marginBottom: `calc(-1 * ${tokens.fieldPaddingY})`,\n}\n\n/** The parts that sit in the control's row: the controls, or a group holding one. */\nconst CONTROL_ROW_SLOTS = [...FIELD_CONTROL_SLOTS, \"field-input-group\"]\n\n/** Every part spans both columns, as it stacked before; a control takes the first column. */\nconst controlRowRules = () =>\n Object.fromEntries([\n [\"& > *\", { gridColumnStart: 1, gridColumnEnd: -1 }],\n ...CONTROL_ROW_SLOTS.flatMap((slot) => [\n [\n `& > [${SLOT_ATTR}=\"${slot}\"]`,\n { gridColumnStart: 1, gridColumnEnd: 2 },\n ],\n [\n `& > [${SLOT_ATTR}=\"${slot}\"] + :not([${SLOT_ATTR}])`,\n {\n gridColumnStart: 2,\n gridColumnEnd: 3,\n marginLeft: tokens.spacingElement1,\n ...BESIDE_CONTROL,\n },\n ],\n ]),\n ])\n\nconst useStyles = makeZenithStyles({\n root: {\n ...boxModel,\n position: \"relative\",\n // A grid, not a column, so an injected button can sit beside the control (see BESIDE_CONTROL).\n // The second column is empty and zero-wide unless something is injected.\n display: \"grid\",\n gridTemplateColumns: \"minmax(0, 1fr) auto\",\n width: \"100%\",\n // Density-bound (DENSITY-SPEC.md §2.3, WP9B1-ACCEPTANCE-WP9B2A): normal resolves to the same\n // spacingElement2/spacingElement3 values this used before binding — `spacingGroup1` (0.5rem)\n // is a half-step short of the 0.75rem v1 actually uses, which three components got wrong by\n // reaching for it directly; that pitfall is why fieldPaddingX's normal tier aliases\n // spacingElement3, not spacingGroup1 (packages/tokens/spec/density.yaml).\n paddingTop: tokens.fieldPaddingY,\n paddingBottom: tokens.fieldPaddingY,\n paddingLeft: tokens.fieldPaddingX,\n paddingRight: tokens.fieldPaddingX,\n // Row gap only: a column gap would narrow the control even while the second column is empty.\n rowGap: tokens.spacingElement1,\n ...shorthands.borderRadius(tokens.radiusLg),\n transitionProperty: \"all\",\n transitionDuration: \"75ms\",\n outlineOffset: \"2px\",\n outlineWidth: \"2px\",\n outlineStyle: \"none\",\n \"@media (prefers-reduced-motion: reduce)\": {\n transitionDuration: \"0.01ms\",\n },\n \"&[data-focused='true'], &[data-focus-visible]\": {\n outlineStyle: \"solid\",\n outlineColor: tokens.focusRing,\n },\n \"&[data-invalid]\": {\n backgroundColor: tokens.errorSoft,\n },\n\n // Label's disabled styling, declared here because Field owns the elements these selectors are\n // rooted at. On Label they were written as \"[data-disabled] &\", \":disabled ~ &\" and\n // \"[data-disabled] ~ &\"; Griffel does not substitute `&` in that position and emits\n // `.hash<selector> .hash`, which never matches, so a label in a disabled field never dimmed.\n // See src/ancestor-selector.test.ts. The port of those rules still missed: they named the\n // `label` slot while FieldLabel emits `field-label`, and the `~` forms needed the label AFTER\n // the control, but it comes first. `:has()` reaches the control wherever it sits.\n ...disabledLabelRules(),\n ...controlRowRules(),\n },\n rootDefault: {\n backgroundColor: tokens.grayA3,\n \":hover\": {\n backgroundColor: tokens.grayA4,\n },\n },\n rootHighlight: {\n backgroundColor: tokens.accentA3,\n \":hover\": {\n backgroundColor: tokens.accentA4,\n },\n },\n rootReadonly: {\n backgroundColor: tokens.grayA3,\n },\n rootDestructive: {\n backgroundColor: tokens.errorSoft,\n \":hover\": {\n backgroundColor: tokens.errorA4,\n },\n },\n fieldSet: {\n ...boxModel,\n display: \"flex\",\n flexDirection: \"column\",\n // Density-bound (DENSITY-SPEC.md §2.3): normal resolves to the same spacingLayout2 (32px)\n // this used before binding.\n ...shorthands.gap(tokens.fieldSetGap),\n ...shorthands.border(\"0\"),\n ...shorthands.padding(0),\n ...shorthands.margin(0),\n },\n fieldGroup: {\n ...boxModel,\n display: \"flex\",\n width: \"100%\",\n ...shorthands.gap(tokens.spacingElement2),\n },\n fieldGroupColumn: {\n flexDirection: \"column\",\n },\n fieldGroupRow: {\n flexDirection: \"row\",\n },\n fieldContent: {\n display: \"flex\",\n flexGrow: 1,\n flexShrink: 1,\n flexBasis: \"0%\",\n flexDirection: \"column\",\n ...shorthands.gap(tokens.spacingElement2),\n lineHeight: \"1.375\",\n },\n label: {\n ...boxModel,\n minHeight: \"1rem\",\n fontSize: tokens.textXs,\n lineHeight: tokens.leadingXs,\n // No width: the label stretches across the field's column, so the whole label row is a hit\n // area for the control rather than only the text. Field reads as one box and is aimed at as one.\n display: \"flex\",\n ...shorthands.gap(tokens.spacingElement2),\n cursor: \"default\",\n color: tokens.grayA12,\n \"&[data-disabled]\": {\n opacity: 0.5,\n },\n },\n labelContent: {\n display: \"inline-flex\",\n alignItems: \"center\",\n ...shorthands.gap(tokens.spacingElement1),\n transitionProperty: \"opacity\",\n transitionDuration: \"150ms\",\n \"@media (prefers-reduced-motion: reduce)\": {\n transitionDuration: \"0.01ms\",\n },\n },\n labelContentHover: {\n ...boxModel,\n width: 0,\n height: 0,\n overflowX: \"visible\",\n overflowY: \"visible\",\n opacity: 0,\n pointerEvents: \"none\",\n },\n description: {\n fontSize: tokens.textXs,\n lineHeight: \"1.5\",\n fontWeight: tokens.fontWeightNormal,\n ...shorthands.margin(0),\n \"& a\": {\n textDecorationLine: \"underline\",\n textUnderlineOffset: \"4px\",\n },\n },\n descriptionDefault: {\n color: tokens.grayA12,\n },\n descriptionHelper: {\n color: tokens.grayA11,\n },\n error: {\n color: tokens.errorOnSoft,\n fontSize: tokens.textXs,\n lineHeight: tokens.leadingXs,\n fontWeight: tokens.fontWeightNormal,\n },\n errorList: {\n ...boxModel,\n display: \"flex\",\n flexDirection: \"column\",\n ...shorthands.margin(0),\n paddingLeft: \"1.25rem\",\n listStyleType: \"disc\",\n },\n errorListItem: {\n color: tokens.errorOnSoft,\n fontSize: tokens.textXs,\n lineHeight: tokens.leadingXs,\n fontWeight: tokens.fontWeightNormal,\n marginTop: \"0.25rem\",\n marginBottom: \"0.25rem\",\n },\n input: {\n ...nativeControl,\n width: \"100%\",\n // Density-bound (DENSITY-SPEC.md §2.3): normal resolves to the same \"1.5rem\" this used before\n // binding. FieldComboboxInput (field-combobox.tsx) has its OWN separate makeZenithStyles call\n // and its own unrelated \"input\" key (width: \"100%\" only, no height) — this binding does not\n // reach it; review corrected an earlier claim that it did.\n height: tokens.fieldInputHeight,\n outlineStyle: \"none\",\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n color: tokens.grayA12,\n backgroundColor: \"transparent\",\n ...shorthands.border(\"0\"),\n ...shorthands.padding(0),\n \"::placeholder\": {\n color: tokens.grayA8,\n },\n \":disabled\": {\n cursor: \"not-allowed\",\n },\n },\n inputGroup: {\n ...boxModel,\n display: \"flex\",\n alignItems: \"center\",\n ...shorthands.gap(tokens.spacingElement1),\n width: \"100%\",\n // Already a row, so an injected button lands beside the input; it must not stretch the row.\n [`& > [${SLOT_ATTR}=\"field-input\"] + :not([${SLOT_ATTR}])`]: BESIDE_CONTROL,\n },\n textarea: {\n ...nativeControl,\n width: \"100%\",\n outlineStyle: \"none\",\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n color: tokens.grayA12,\n backgroundColor: \"transparent\",\n ...shorthands.border(\"0\"),\n ...shorthands.padding(0),\n \"::placeholder\": {\n color: tokens.grayA8,\n },\n \":disabled\": {\n cursor: \"not-allowed\",\n },\n },\n resizeNone: {\n resize: \"none\",\n },\n resizeVertical: {\n resize: \"vertical\",\n },\n resizeHorizontal: {\n resize: \"horizontal\",\n },\n addon: {\n ...boxModel,\n color: tokens.grayA11,\n display: \"flex\",\n height: \"auto\",\n cursor: \"text\",\n whiteSpace: \"nowrap\",\n alignItems: \"center\",\n justifyContent: \"center\",\n ...shorthands.gap(tokens.spacingElement2),\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n fontWeight: tokens.fontWeightNormal,\n userSelect: \"none\",\n },\n addonStart: {\n order: -1,\n },\n addonEnd: {\n order: 1,\n },\n})\n\n// fieldVariants helper for v1 API compatibility\nexport const fieldVariants = ({\n variant = \"default\",\n}: { variant?: FieldVariant } = {}) => {\n return variant\n}\n\nexport type FieldProps = Omit<React.ComponentProps<\"div\">, \"className\"> & {\n className?: string\n variant?: FieldVariant\n}\n\nexport const Field = React.forwardRef<HTMLDivElement, FieldProps>(\n function Field(\n {\n className,\n variant = \"default\",\n children,\n onFocusCapture,\n onBlurCapture,\n ...props\n },\n ref\n ) {\n const styles = useStyles()\n const inputRef = React.useRef<FieldInputRef>(null)\n const [isFocused, setIsFocused] = React.useState(false)\n\n const handleFocusCapture: React.ComponentProps<\"div\">[\"onFocusCapture\"] = (\n event\n ) => {\n setIsFocused(true)\n onFocusCapture?.(event)\n }\n\n const handleBlurCapture: React.ComponentProps<\"div\">[\"onBlurCapture\"] = (\n event\n ) => {\n setIsFocused(false)\n onBlurCapture?.(event)\n }\n\n const variantStyle =\n variant === \"highlight\"\n ? styles.rootHighlight\n : variant === \"readonly\"\n ? styles.rootReadonly\n : variant === \"destructive\"\n ? styles.rootDestructive\n : styles.rootDefault\n\n return (\n <FieldContext.Provider value={{ inputRef }}>\n <FieldRootBase\n ref={ref}\n role=\"group\"\n data-slot=\"field\"\n {...{ [SLOT_ATTR]: \"field\" }}\n data-focused={isFocused ? \"true\" : \"false\"}\n className={mergeClasses(styles.root, variantStyle, className)}\n onFocusCapture={handleFocusCapture}\n onBlurCapture={handleBlurCapture}\n {...props}\n >\n {children}\n </FieldRootBase>\n </FieldContext.Provider>\n )\n }\n)\n\nexport type FieldSetProps = React.ComponentProps<\"fieldset\">\n\nexport const FieldSet = React.forwardRef<HTMLFieldSetElement, FieldSetProps>(\n function FieldSet({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <fieldset\n ref={ref}\n data-slot=\"field-set\"\n {...{ [SLOT_ATTR]: \"field-set\" }}\n className={mergeClasses(styles.fieldSet, className)}\n {...props}\n />\n )\n }\n)\n\nexport type FieldGroupProps = React.ComponentProps<\"div\"> & {\n direction?: \"column\" | \"row\"\n}\n\nexport const FieldGroup = React.forwardRef<HTMLDivElement, FieldGroupProps>(\n function FieldGroup({ className, direction = \"column\", ...props }, ref) {\n const styles = useStyles()\n\n return (\n <div\n ref={ref}\n data-slot=\"field-group\"\n {...{ [SLOT_ATTR]: \"field-group\" }}\n className={mergeClasses(\n styles.fieldGroup,\n direction === \"row\" ? styles.fieldGroupRow : styles.fieldGroupColumn,\n className\n )}\n {...props}\n />\n )\n }\n)\n\nexport type FieldContentProps = React.ComponentProps<\"div\">\n\nexport const FieldContent = React.forwardRef<HTMLDivElement, FieldContentProps>(\n function FieldContent({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <div\n ref={ref}\n data-slot=\"field-content\"\n {...{ [SLOT_ATTR]: \"field-content\" }}\n className={mergeClasses(styles.fieldContent, className)}\n {...props}\n />\n )\n }\n)\n\nexport type FieldLabelProps = Omit<\n React.ComponentProps<\"label\">,\n \"className\"\n> & {\n className?: string\n}\n\nexport const FieldLabel = React.forwardRef<HTMLLabelElement, FieldLabelProps>(\n function FieldLabel({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <FieldLabelBase\n ref={ref}\n data-slot=\"field-label\"\n {...{ [SLOT_ATTR]: \"field-label\" }}\n className={mergeClasses(styles.label, className)}\n {...props}\n />\n )\n }\n)\n\nexport type FieldLabelContentProps = React.ComponentProps<\"div\"> & {\n showOnHover?: boolean\n}\n\nexport const FieldLabelContent = React.forwardRef<\n HTMLDivElement,\n FieldLabelContentProps\n>(function FieldLabelContent({ className, showOnHover = true, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <div\n ref={ref}\n data-slot=\"field-label-content\"\n {...{ [SLOT_ATTR]: \"field-label-content\" }}\n className={mergeClasses(\n styles.labelContent,\n showOnHover && styles.labelContentHover,\n className\n )}\n {...props}\n />\n )\n})\n\nexport type FieldDescriptionVariant = \"default\" | \"helper\"\n\nexport const fieldDescriptionVariants = ({\n variant = \"default\",\n}: { variant?: FieldDescriptionVariant } = {}) => {\n return variant\n}\n\nexport type FieldDescriptionProps = Omit<\n React.ComponentProps<\"p\">,\n \"className\"\n> & {\n className?: string\n variant?: FieldDescriptionVariant\n}\n\nexport const FieldDescription = React.forwardRef<\n HTMLParagraphElement,\n FieldDescriptionProps\n>(function FieldDescription({ className, variant = \"default\", ...props }, ref) {\n const styles = useStyles()\n\n const variantStyle =\n variant === \"helper\" ? styles.descriptionHelper : styles.descriptionDefault\n\n return (\n <FieldDescriptionBase\n ref={ref}\n data-slot=\"field-description\"\n {...{ [SLOT_ATTR]: \"field-description\" }}\n className={mergeClasses(styles.description, variantStyle, className)}\n {...props}\n />\n )\n})\n\nexport type FieldErrorProps = Omit<React.ComponentProps<\"div\">, \"className\"> & {\n className?: string\n errors?: Array<{ message?: string } | undefined>\n}\n\nexport const FieldError = React.forwardRef<HTMLDivElement, FieldErrorProps>(\n function FieldError({ className, children, errors, ...props }, ref) {\n const styles = useStyles()\n\n const content = React.useMemo(() => {\n if (children) {\n return children\n }\n\n if (!errors?.length) {\n return null\n }\n\n const uniqueErrors = [\n ...new Map(errors.map((error) => [error?.message, error])).values(),\n ]\n\n if (uniqueErrors.length === 1) {\n return uniqueErrors[0]?.message\n }\n\n return (\n <ul className={styles.errorList}>\n {uniqueErrors.map(\n (error, index) =>\n error?.message && (\n <li className={styles.errorListItem} key={index}>\n {error.message}\n </li>\n )\n )}\n </ul>\n )\n }, [children, errors, styles.errorList, styles.errorListItem])\n\n if (!content) {\n return null\n }\n\n return (\n <FieldErrorBase\n ref={ref}\n role=\"alert\"\n data-slot=\"field-error\"\n {...{ [SLOT_ATTR]: \"field-error\" }}\n className={mergeClasses(styles.error, className)}\n {...props}\n >\n {content}\n </FieldErrorBase>\n )\n }\n)\n\nexport type FieldInputProps = Omit<\n React.ComponentProps<\"input\">,\n \"className\"\n> & {\n className?: string\n}\n\nexport const FieldInput = React.forwardRef<HTMLInputElement, FieldInputProps>(\n function FieldInput({ className, ...props }, forwardedRef) {\n const styles = useStyles()\n const { inputRef } = useFieldContext()\n\n return (\n <FieldControlBase\n ref={(el: HTMLElement | null) => {\n inputRef.current = el as HTMLInputElement | null\n if (typeof forwardedRef === \"function\") {\n forwardedRef(el as HTMLInputElement)\n } else if (forwardedRef) {\n forwardedRef.current = el as HTMLInputElement | null\n }\n }}\n data-readonly={props.readOnly}\n data-slot=\"field-input\"\n {...{ [SLOT_ATTR]: \"field-input\" }}\n className={mergeClasses(styles.input, className)}\n {...props}\n />\n )\n }\n)\n\nexport type FieldInputGroupProps = React.ComponentProps<\"div\">\n\nexport const FieldInputGroup = React.forwardRef<\n HTMLDivElement,\n FieldInputGroupProps\n>(function FieldInputGroup({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <div\n ref={ref}\n data-slot=\"field-input-group\"\n {...{ [SLOT_ATTR]: \"field-input-group\" }}\n className={mergeClasses(styles.inputGroup, className)}\n {...props}\n />\n )\n})\n\nexport type FieldTextareaResize = \"none\" | \"vertical\" | \"horizontal\"\n\nexport type FieldTextareaProps = React.ComponentProps<\"textarea\"> & {\n resize?: FieldTextareaResize\n}\n\nexport const FieldTextarea = React.forwardRef<\n HTMLTextAreaElement,\n FieldTextareaProps\n>(function FieldTextarea(\n { className, resize = \"none\", ...props },\n forwardedRef\n) {\n const styles = useStyles()\n const { inputRef } = useFieldContext()\n\n const resizeStyle =\n resize === \"vertical\"\n ? styles.resizeVertical\n : resize === \"horizontal\"\n ? styles.resizeHorizontal\n : styles.resizeNone\n\n return (\n <textarea\n {...props}\n ref={(el: HTMLTextAreaElement | null) => {\n inputRef.current = el\n if (typeof forwardedRef === \"function\") {\n forwardedRef(el)\n } else if (forwardedRef) {\n forwardedRef.current = el\n }\n }}\n data-readonly={props.readOnly}\n data-slot=\"field-textarea\"\n {...{ [SLOT_ATTR]: \"field-textarea\" }}\n data-resize={resize}\n className={mergeClasses(styles.textarea, resizeStyle, className)}\n />\n )\n})\n\nexport type FieldGroupAddonAlign = \"start\" | \"end\"\n\nexport const inputGroupAddonVariants = ({\n align = \"start\",\n}: { align?: FieldGroupAddonAlign } = {}) => {\n return align\n}\n\nexport type FieldGroupAddonProps = React.ComponentProps<\"div\"> & {\n align?: FieldGroupAddonAlign\n}\n\nexport const FieldGroupAddon = React.forwardRef<\n HTMLDivElement,\n FieldGroupAddonProps\n>(function FieldGroupAddon({ className, align = \"start\", ...props }, ref) {\n const styles = useStyles()\n\n return (\n <div\n ref={ref}\n role=\"group\"\n data-slot=\"input-group-addon\"\n {...{ [SLOT_ATTR]: \"input-group-addon\" }}\n data-align={align}\n className={mergeClasses(\n styles.addon,\n align === \"end\" ? styles.addonEnd : styles.addonStart,\n className\n )}\n {...props}\n />\n )\n})\n"],"names":["FieldRootBase","FieldLabelBase","FieldControlBase","FieldDescriptionBase","FieldErrorBase","FieldContext","React","useFieldContext","context","useOptionalFieldContext","FIELD_CONTROL_SLOTS","FIELD_LABEL_SLOTS","DISABLED_LABEL","disabledLabelRules","slot","SLOT_ATTR","condition","label","BESIDE_CONTROL","tokens.fieldPaddingY","CONTROL_ROW_SLOTS","controlRowRules","tokens.spacingElement1","useStyles","makeZenithStyles","boxModel","tokens.fieldPaddingX","shorthands","tokens.radiusLg","tokens.focusRing","tokens.errorSoft","tokens.grayA3","tokens.grayA4","tokens.accentA3","tokens.accentA4","tokens.errorA4","tokens.fieldSetGap","tokens.spacingElement2","tokens.textXs","tokens.leadingXs","tokens.grayA12","tokens.fontWeightNormal","tokens.grayA11","tokens.errorOnSoft","nativeControl","tokens.fieldInputHeight","tokens.textSm","tokens.leadingSm","tokens.grayA8","fieldVariants","variant","Field","className","children","onFocusCapture","onBlurCapture","props","ref","styles","inputRef","isFocused","setIsFocused","handleFocusCapture","event","handleBlurCapture","variantStyle","jsx","mergeClasses","FieldSet","FieldGroup","direction","FieldContent","FieldLabel","FieldLabelContent","showOnHover","fieldDescriptionVariants","FieldDescription","FieldError","errors","content","uniqueErrors","error","_a","index","FieldInput","forwardedRef","el","FieldInputGroup","FieldTextarea","resize","resizeStyle","inputGroupAddonVariants","align","FieldGroupAddon"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"field.js","sources":["../../../src/components/field/field.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1/core\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { boxModel, nativeControl } from \"../../styles/host-reset\"\nimport * as tokens from \"../../tokens\"\n\n/**\n * Plain elements, not a primitive. v1's Field uses no Radix primitive at all — it is a custom\n * implementation with its own context, and v2 already had the same context (`FieldContext`,\n * carrying `inputRef`).\n */\nconst FieldRootBase = \"div\" as const\nconst FieldLabelBase = \"label\" as const\nconst FieldControlBase = \"input\" as const\nconst FieldDescriptionBase = \"p\" as const\nconst FieldErrorBase = \"div\" as const\n\nexport type FieldInputRef =\n | HTMLInputElement\n | HTMLTextAreaElement\n | HTMLSelectElement\n | HTMLButtonElement\n | null\n\nexport interface FieldContextValue {\n inputRef: React.RefObject<FieldInputRef>\n}\n\nconst FieldContext = React.createContext<FieldContextValue | null>(null)\n\nexport const useFieldContext = () => {\n const context = React.useContext(FieldContext)\n if (!context) {\n throw new Error(\"FieldInput must be used within a Field component\")\n }\n return context\n}\n\n/**\n * Field context when there is one, `null` otherwise — for parts that work both inside and outside\n * a Field.\n */\nexport const useOptionalFieldContext = (): FieldContextValue | null =>\n React.useContext(FieldContext)\n\nexport type FieldVariant = \"default\" | \"highlight\" | \"readonly\" | \"destructive\"\n\n/** The controls a Field wraps; their `:disabled` is what makes the field disabled. */\nconst FIELD_CONTROL_SLOTS = [\"field-input\", \"field-textarea\", \"select-trigger\"]\n/** FieldLabel, and the standalone Label when a caller uses it inside a Field. */\nconst FIELD_LABEL_SLOTS = [\"field-label\", \"label\"]\nconst DISABLED_LABEL = { cursor: \"not-allowed\", opacity: 0.5 }\n\n/**\n * One rule per (disabled condition, label slot). Each `:has()` names a single control rather than\n * any `:disabled` descendant, so an unrelated disabled button beside an enabled control (a clear\n * button with nothing to clear) does not dim the label. One key per selector: no comma lists.\n */\nconst disabledLabelRules = () =>\n Object.fromEntries(\n [\n \"&[data-disabled]\",\n ...FIELD_CONTROL_SLOTS.map(\n (slot) => `&:has([${SLOT_ATTR}=\"${slot}\"]:disabled)`\n ),\n ].flatMap((condition) =>\n FIELD_LABEL_SLOTS.map((label) => [\n `${condition} [${SLOT_ATTR}=\"${label}\"]`,\n DISABLED_LABEL,\n ])\n )\n )\n\n/**\n * Password managers (1Password, NordPass) inject a button next to the control, sometimes inline. In\n * a column the injection became a new row and the field grew (#5). It is placed in a second column\n * beside the control instead, centred on the control's row, with negative block margins as deep as\n * the field's padding so a button taller than the control does not stretch the row either.\n * Recognised as an element directly after a control that is not one of Zenith's own parts.\n */\nconst BESIDE_CONTROL = {\n alignSelf: \"center\",\n marginTop: `calc(-1 * ${tokens.fieldPaddingY})`,\n marginBottom: `calc(-1 * ${tokens.fieldPaddingY})`,\n}\n\n/** The parts that sit in the control's row: the controls, or a group holding one. */\nconst CONTROL_ROW_SLOTS = [...FIELD_CONTROL_SLOTS, \"field-input-group\"]\n\n/** Every part spans both columns, as it stacked before; a control takes the first column. */\nconst controlRowRules = () =>\n Object.fromEntries([\n [\"& > *\", { gridColumnStart: 1, gridColumnEnd: -1 }],\n ...CONTROL_ROW_SLOTS.flatMap((slot) => [\n [\n `& > [${SLOT_ATTR}=\"${slot}\"]`,\n { gridColumnStart: 1, gridColumnEnd: 2 },\n ],\n [\n `& > [${SLOT_ATTR}=\"${slot}\"] + :not([${SLOT_ATTR}])`,\n {\n gridColumnStart: 2,\n gridColumnEnd: 3,\n marginLeft: tokens.spacingElement1,\n ...BESIDE_CONTROL,\n },\n ],\n ]),\n ])\n\nconst useStyles = makeZenithStyles({\n root: {\n ...boxModel,\n position: \"relative\",\n // A grid, not a column, so an injected button can sit beside the control (see BESIDE_CONTROL).\n // The second column is empty and zero-wide unless something is injected.\n display: \"grid\",\n gridTemplateColumns: \"minmax(0, 1fr) auto\",\n width: \"100%\",\n // Density-bound (DENSITY-SPEC.md §2.3, WP9B1-ACCEPTANCE-WP9B2A): normal resolves to the same\n // spacingElement2/spacingElement3 values this used before binding — `spacingGroup1` (0.5rem)\n // is a half-step short of the 0.75rem v1 actually uses, which three components got wrong by\n // reaching for it directly; that pitfall is why fieldPaddingX's normal tier aliases\n // spacingElement3, not spacingGroup1 (packages/tokens/spec/density.yaml).\n paddingTop: tokens.fieldPaddingY,\n paddingBottom: tokens.fieldPaddingY,\n paddingLeft: tokens.fieldPaddingX,\n paddingRight: tokens.fieldPaddingX,\n // Row gap only: a column gap would narrow the control even while the second column is empty.\n rowGap: tokens.spacingElement1,\n ...shorthands.borderRadius(tokens.radiusLg),\n transitionProperty: \"all\",\n transitionDuration: \"75ms\",\n outlineOffset: \"2px\",\n outlineWidth: \"2px\",\n outlineStyle: \"none\",\n \"@media (prefers-reduced-motion: reduce)\": {\n transitionDuration: \"0.01ms\",\n },\n \"&[data-focused='true'], &[data-focus-visible]\": {\n outlineStyle: \"solid\",\n outlineColor: tokens.focusRing,\n },\n \"&[data-invalid]\": {\n backgroundColor: tokens.errorSoft,\n },\n\n // Label's disabled styling, declared here because Field owns the elements these selectors are\n // rooted at. On Label they were written as \"[data-disabled] &\", \":disabled ~ &\" and\n // \"[data-disabled] ~ &\"; Griffel does not substitute `&` in that position and emits\n // `.hash<selector> .hash`, which never matches, so a label in a disabled field never dimmed.\n // See src/ancestor-selector.test.ts. The port of those rules still missed: they named the\n // `label` slot while FieldLabel emits `field-label`, and the `~` forms needed the label AFTER\n // the control, but it comes first. `:has()` reaches the control wherever it sits.\n ...disabledLabelRules(),\n ...controlRowRules(),\n },\n rootDefault: {\n backgroundColor: tokens.grayA3,\n \":hover\": {\n backgroundColor: tokens.grayA4,\n },\n },\n rootHighlight: {\n backgroundColor: tokens.accentA3,\n \":hover\": {\n backgroundColor: tokens.accentA4,\n },\n },\n rootReadonly: {\n backgroundColor: tokens.grayA3,\n },\n rootDestructive: {\n backgroundColor: tokens.errorSoft,\n \":hover\": {\n backgroundColor: tokens.errorA4,\n },\n },\n fieldSet: {\n ...boxModel,\n display: \"flex\",\n flexDirection: \"column\",\n // Density-bound (DENSITY-SPEC.md §2.3): normal resolves to the same spacingLayout2 (32px)\n // this used before binding.\n ...shorthands.gap(tokens.fieldSetGap),\n ...shorthands.border(\"0\"),\n ...shorthands.padding(0),\n ...shorthands.margin(0),\n },\n fieldGroup: {\n ...boxModel,\n display: \"flex\",\n width: \"100%\",\n ...shorthands.gap(tokens.spacingElement2),\n },\n fieldGroupColumn: {\n flexDirection: \"column\",\n },\n fieldGroupRow: {\n flexDirection: \"row\",\n },\n fieldContent: {\n display: \"flex\",\n flexGrow: 1,\n flexShrink: 1,\n flexBasis: \"0%\",\n flexDirection: \"column\",\n ...shorthands.gap(tokens.spacingElement2),\n lineHeight: \"1.375\",\n },\n label: {\n ...boxModel,\n minHeight: \"1rem\",\n fontSize: tokens.textXs,\n lineHeight: tokens.leadingXs,\n // No width: the label stretches across the field's column, so the whole label row is a hit\n // area for the control rather than only the text. Field reads as one box and is aimed at as one.\n display: \"flex\",\n ...shorthands.gap(tokens.spacingElement2),\n cursor: \"default\",\n color: tokens.grayA12,\n \"&[data-disabled]\": {\n opacity: 0.5,\n },\n },\n labelContent: {\n display: \"inline-flex\",\n alignItems: \"center\",\n ...shorthands.gap(tokens.spacingElement1),\n transitionProperty: \"opacity\",\n transitionDuration: \"150ms\",\n \"@media (prefers-reduced-motion: reduce)\": {\n transitionDuration: \"0.01ms\",\n },\n },\n labelContentHover: {\n ...boxModel,\n width: 0,\n height: 0,\n overflowX: \"visible\",\n overflowY: \"visible\",\n opacity: 0,\n pointerEvents: \"none\",\n },\n description: {\n fontSize: tokens.textXs,\n lineHeight: \"1.5\",\n fontWeight: tokens.fontWeightNormal,\n ...shorthands.margin(0),\n \"& a\": {\n textDecorationLine: \"underline\",\n textUnderlineOffset: \"4px\",\n },\n },\n descriptionDefault: {\n color: tokens.grayA12,\n },\n descriptionHelper: {\n color: tokens.grayA11,\n },\n error: {\n color: tokens.errorOnSoft,\n fontSize: tokens.textXs,\n lineHeight: tokens.leadingXs,\n fontWeight: tokens.fontWeightNormal,\n },\n errorList: {\n ...boxModel,\n display: \"flex\",\n flexDirection: \"column\",\n ...shorthands.margin(0),\n paddingLeft: \"1.25rem\",\n listStyleType: \"disc\",\n },\n errorListItem: {\n color: tokens.errorOnSoft,\n fontSize: tokens.textXs,\n lineHeight: tokens.leadingXs,\n fontWeight: tokens.fontWeightNormal,\n marginTop: \"0.25rem\",\n marginBottom: \"0.25rem\",\n },\n input: {\n ...nativeControl,\n width: \"100%\",\n // Density-bound (DENSITY-SPEC.md §2.3): normal resolves to the same \"1.5rem\" this used before\n // binding. FieldComboboxInput (field-combobox.tsx) has its OWN separate makeZenithStyles call\n // and its own unrelated \"input\" key (width: \"100%\" only, no height) — this binding does not\n // reach it; review corrected an earlier claim that it did.\n height: tokens.fieldInputHeight,\n outlineStyle: \"none\",\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n color: tokens.grayA12,\n backgroundColor: \"transparent\",\n ...shorthands.border(\"0\"),\n ...shorthands.padding(0),\n \"::placeholder\": {\n color: tokens.grayA8,\n },\n \":disabled\": {\n cursor: \"not-allowed\",\n },\n },\n inputGroup: {\n ...boxModel,\n display: \"flex\",\n alignItems: \"center\",\n ...shorthands.gap(tokens.spacingElement1),\n width: \"100%\",\n // Already a row, so an injected button lands beside the input; it must not stretch the row.\n [`& > [${SLOT_ATTR}=\"field-input\"] + :not([${SLOT_ATTR}])`]: BESIDE_CONTROL,\n },\n textarea: {\n ...nativeControl,\n width: \"100%\",\n outlineStyle: \"none\",\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n color: tokens.grayA12,\n backgroundColor: \"transparent\",\n ...shorthands.border(\"0\"),\n ...shorthands.padding(0),\n \"::placeholder\": {\n color: tokens.grayA8,\n },\n \":disabled\": {\n cursor: \"not-allowed\",\n },\n },\n resizeNone: {\n resize: \"none\",\n },\n resizeVertical: {\n resize: \"vertical\",\n },\n resizeHorizontal: {\n resize: \"horizontal\",\n },\n addon: {\n ...boxModel,\n color: tokens.grayA11,\n display: \"flex\",\n height: \"auto\",\n cursor: \"text\",\n whiteSpace: \"nowrap\",\n alignItems: \"center\",\n justifyContent: \"center\",\n ...shorthands.gap(tokens.spacingElement2),\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n fontWeight: tokens.fontWeightNormal,\n userSelect: \"none\",\n },\n addonStart: {\n order: -1,\n },\n addonEnd: {\n order: 1,\n },\n})\n\n// fieldVariants helper for v1 API compatibility\nexport const fieldVariants = ({\n variant = \"default\",\n}: { variant?: FieldVariant } = {}) => {\n return variant\n}\n\nexport type FieldProps = Omit<React.ComponentProps<\"div\">, \"className\"> & {\n className?: string\n variant?: FieldVariant\n}\n\nexport const Field = React.forwardRef<HTMLDivElement, FieldProps>(\n function Field(\n {\n className,\n variant = \"default\",\n children,\n onFocusCapture,\n onBlurCapture,\n ...props\n },\n ref\n ) {\n const styles = useStyles()\n const inputRef = React.useRef<FieldInputRef>(null)\n const [isFocused, setIsFocused] = React.useState(false)\n\n const handleFocusCapture: React.ComponentProps<\"div\">[\"onFocusCapture\"] = (\n event\n ) => {\n setIsFocused(true)\n onFocusCapture?.(event)\n }\n\n const handleBlurCapture: React.ComponentProps<\"div\">[\"onBlurCapture\"] = (\n event\n ) => {\n setIsFocused(false)\n onBlurCapture?.(event)\n }\n\n const variantStyle =\n variant === \"highlight\"\n ? styles.rootHighlight\n : variant === \"readonly\"\n ? styles.rootReadonly\n : variant === \"destructive\"\n ? styles.rootDestructive\n : styles.rootDefault\n\n return (\n <FieldContext.Provider value={{ inputRef }}>\n <FieldRootBase\n ref={ref}\n role=\"group\"\n data-slot=\"field\"\n {...{ [SLOT_ATTR]: \"field\" }}\n data-focused={isFocused ? \"true\" : \"false\"}\n className={mergeClasses(styles.root, variantStyle, className)}\n onFocusCapture={handleFocusCapture}\n onBlurCapture={handleBlurCapture}\n {...props}\n >\n {children}\n </FieldRootBase>\n </FieldContext.Provider>\n )\n }\n)\n\nexport type FieldSetProps = React.ComponentProps<\"fieldset\">\n\nexport const FieldSet = React.forwardRef<HTMLFieldSetElement, FieldSetProps>(\n function FieldSet({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <fieldset\n ref={ref}\n data-slot=\"field-set\"\n {...{ [SLOT_ATTR]: \"field-set\" }}\n className={mergeClasses(styles.fieldSet, className)}\n {...props}\n />\n )\n }\n)\n\nexport type FieldGroupProps = React.ComponentProps<\"div\"> & {\n direction?: \"column\" | \"row\"\n}\n\nexport const FieldGroup = React.forwardRef<HTMLDivElement, FieldGroupProps>(\n function FieldGroup({ className, direction = \"column\", ...props }, ref) {\n const styles = useStyles()\n\n return (\n <div\n ref={ref}\n data-slot=\"field-group\"\n {...{ [SLOT_ATTR]: \"field-group\" }}\n className={mergeClasses(\n styles.fieldGroup,\n direction === \"row\" ? styles.fieldGroupRow : styles.fieldGroupColumn,\n className\n )}\n {...props}\n />\n )\n }\n)\n\nexport type FieldContentProps = React.ComponentProps<\"div\">\n\nexport const FieldContent = React.forwardRef<HTMLDivElement, FieldContentProps>(\n function FieldContent({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <div\n ref={ref}\n data-slot=\"field-content\"\n {...{ [SLOT_ATTR]: \"field-content\" }}\n className={mergeClasses(styles.fieldContent, className)}\n {...props}\n />\n )\n }\n)\n\nexport type FieldLabelProps = Omit<\n React.ComponentProps<\"label\">,\n \"className\"\n> & {\n className?: string\n}\n\nexport const FieldLabel = React.forwardRef<HTMLLabelElement, FieldLabelProps>(\n function FieldLabel({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <FieldLabelBase\n ref={ref}\n data-slot=\"field-label\"\n {...{ [SLOT_ATTR]: \"field-label\" }}\n className={mergeClasses(styles.label, className)}\n {...props}\n />\n )\n }\n)\n\nexport type FieldLabelContentProps = React.ComponentProps<\"div\"> & {\n showOnHover?: boolean\n}\n\nexport const FieldLabelContent = React.forwardRef<\n HTMLDivElement,\n FieldLabelContentProps\n>(function FieldLabelContent({ className, showOnHover = true, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <div\n ref={ref}\n data-slot=\"field-label-content\"\n {...{ [SLOT_ATTR]: \"field-label-content\" }}\n className={mergeClasses(\n styles.labelContent,\n showOnHover && styles.labelContentHover,\n className\n )}\n {...props}\n />\n )\n})\n\nexport type FieldDescriptionVariant = \"default\" | \"helper\"\n\nexport const fieldDescriptionVariants = ({\n variant = \"default\",\n}: { variant?: FieldDescriptionVariant } = {}) => {\n return variant\n}\n\nexport type FieldDescriptionProps = Omit<\n React.ComponentProps<\"p\">,\n \"className\"\n> & {\n className?: string\n variant?: FieldDescriptionVariant\n}\n\nexport const FieldDescription = React.forwardRef<\n HTMLParagraphElement,\n FieldDescriptionProps\n>(function FieldDescription({ className, variant = \"default\", ...props }, ref) {\n const styles = useStyles()\n\n const variantStyle =\n variant === \"helper\" ? styles.descriptionHelper : styles.descriptionDefault\n\n return (\n <FieldDescriptionBase\n ref={ref}\n data-slot=\"field-description\"\n {...{ [SLOT_ATTR]: \"field-description\" }}\n className={mergeClasses(styles.description, variantStyle, className)}\n {...props}\n />\n )\n})\n\nexport type FieldErrorProps = Omit<React.ComponentProps<\"div\">, \"className\"> & {\n className?: string\n errors?: Array<{ message?: string } | undefined>\n}\n\nexport const FieldError = React.forwardRef<HTMLDivElement, FieldErrorProps>(\n function FieldError({ className, children, errors, ...props }, ref) {\n const styles = useStyles()\n\n const content = React.useMemo(() => {\n if (children) {\n return children\n }\n\n if (!errors?.length) {\n return null\n }\n\n const uniqueErrors = [\n ...new Map(errors.map((error) => [error?.message, error])).values(),\n ]\n\n if (uniqueErrors.length === 1) {\n return uniqueErrors[0]?.message\n }\n\n return (\n <ul className={styles.errorList}>\n {uniqueErrors.map(\n (error, index) =>\n error?.message && (\n <li className={styles.errorListItem} key={index}>\n {error.message}\n </li>\n )\n )}\n </ul>\n )\n }, [children, errors, styles.errorList, styles.errorListItem])\n\n if (!content) {\n return null\n }\n\n return (\n <FieldErrorBase\n ref={ref}\n role=\"alert\"\n data-slot=\"field-error\"\n {...{ [SLOT_ATTR]: \"field-error\" }}\n className={mergeClasses(styles.error, className)}\n {...props}\n >\n {content}\n </FieldErrorBase>\n )\n }\n)\n\nexport type FieldInputProps = Omit<\n React.ComponentProps<\"input\">,\n \"className\"\n> & {\n className?: string\n}\n\nexport const FieldInput = React.forwardRef<HTMLInputElement, FieldInputProps>(\n function FieldInput({ className, ...props }, forwardedRef) {\n const styles = useStyles()\n const { inputRef } = useFieldContext()\n\n return (\n <FieldControlBase\n ref={(el: HTMLElement | null) => {\n inputRef.current = el as HTMLInputElement | null\n if (typeof forwardedRef === \"function\") {\n forwardedRef(el as HTMLInputElement)\n } else if (forwardedRef) {\n forwardedRef.current = el as HTMLInputElement | null\n }\n }}\n data-readonly={props.readOnly}\n data-slot=\"field-input\"\n {...{ [SLOT_ATTR]: \"field-input\" }}\n className={mergeClasses(styles.input, className)}\n {...props}\n />\n )\n }\n)\n\nexport type FieldInputGroupProps = React.ComponentProps<\"div\">\n\nexport const FieldInputGroup = React.forwardRef<\n HTMLDivElement,\n FieldInputGroupProps\n>(function FieldInputGroup({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <div\n ref={ref}\n data-slot=\"field-input-group\"\n {...{ [SLOT_ATTR]: \"field-input-group\" }}\n className={mergeClasses(styles.inputGroup, className)}\n {...props}\n />\n )\n})\n\nexport type FieldTextareaResize = \"none\" | \"vertical\" | \"horizontal\"\n\nexport type FieldTextareaProps = React.ComponentProps<\"textarea\"> & {\n resize?: FieldTextareaResize\n}\n\nexport const FieldTextarea = React.forwardRef<\n HTMLTextAreaElement,\n FieldTextareaProps\n>(function FieldTextarea(\n { className, resize = \"none\", ...props },\n forwardedRef\n) {\n const styles = useStyles()\n const { inputRef } = useFieldContext()\n\n const resizeStyle =\n resize === \"vertical\"\n ? styles.resizeVertical\n : resize === \"horizontal\"\n ? styles.resizeHorizontal\n : styles.resizeNone\n\n return (\n <textarea\n {...props}\n ref={(el: HTMLTextAreaElement | null) => {\n inputRef.current = el\n if (typeof forwardedRef === \"function\") {\n forwardedRef(el)\n } else if (forwardedRef) {\n forwardedRef.current = el\n }\n }}\n data-readonly={props.readOnly}\n data-slot=\"field-textarea\"\n {...{ [SLOT_ATTR]: \"field-textarea\" }}\n data-resize={resize}\n className={mergeClasses(styles.textarea, resizeStyle, className)}\n />\n )\n})\n\nexport type FieldGroupAddonAlign = \"start\" | \"end\"\n\nexport const inputGroupAddonVariants = ({\n align = \"start\",\n}: { align?: FieldGroupAddonAlign } = {}) => {\n return align\n}\n\nexport type FieldGroupAddonProps = React.ComponentProps<\"div\"> & {\n align?: FieldGroupAddonAlign\n}\n\nexport const FieldGroupAddon = React.forwardRef<\n HTMLDivElement,\n FieldGroupAddonProps\n>(function FieldGroupAddon({ className, align = \"start\", ...props }, ref) {\n const styles = useStyles()\n\n return (\n <div\n ref={ref}\n role=\"group\"\n data-slot=\"input-group-addon\"\n {...{ [SLOT_ATTR]: \"input-group-addon\" }}\n data-align={align}\n className={mergeClasses(\n styles.addon,\n align === \"end\" ? styles.addonEnd : styles.addonStart,\n className\n )}\n {...props}\n />\n )\n})\n"],"names":["FieldRootBase","FieldLabelBase","FieldControlBase","FieldDescriptionBase","FieldErrorBase","FieldContext","React","useFieldContext","context","useOptionalFieldContext","FIELD_CONTROL_SLOTS","FIELD_LABEL_SLOTS","DISABLED_LABEL","disabledLabelRules","slot","SLOT_ATTR","condition","label","BESIDE_CONTROL","tokens.fieldPaddingY","CONTROL_ROW_SLOTS","controlRowRules","tokens.spacingElement1","useStyles","makeZenithStyles","boxModel","tokens.fieldPaddingX","shorthands","tokens.radiusLg","tokens.focusRing","tokens.errorSoft","tokens.grayA3","tokens.grayA4","tokens.accentA3","tokens.accentA4","tokens.errorA4","tokens.fieldSetGap","tokens.spacingElement2","tokens.textXs","tokens.leadingXs","tokens.grayA12","tokens.fontWeightNormal","tokens.grayA11","tokens.errorOnSoft","nativeControl","tokens.fieldInputHeight","tokens.textSm","tokens.leadingSm","tokens.grayA8","fieldVariants","variant","Field","className","children","onFocusCapture","onBlurCapture","props","ref","styles","inputRef","isFocused","setIsFocused","handleFocusCapture","event","handleBlurCapture","variantStyle","jsx","mergeClasses","FieldSet","FieldGroup","direction","FieldContent","FieldLabel","FieldLabelContent","showOnHover","fieldDescriptionVariants","FieldDescription","FieldError","errors","content","uniqueErrors","error","_a","index","FieldInput","forwardedRef","el","FieldInputGroup","FieldTextarea","resize","resizeStyle","inputGroupAddonVariants","align","FieldGroupAddon"],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as i } from "react/jsx-runtime";
|
|
2
2
|
import * as l from "react";
|
|
3
|
-
import { mergeClasses as n, SLOT_ATTR as m, shorthands as f } from "@epilot/zenith-runtime/v1";
|
|
3
|
+
import { mergeClasses as n, SLOT_ATTR as m, shorthands as f } from "@epilot/zenith-runtime/v1/core.js";
|
|
4
4
|
import { makeZenithStyles as g } from "../../styles/make-styles.js";
|
|
5
5
|
import { leadingBase as p, textBase as c, leadingSm as d, textSm as b, leadingXs as h, textXs as y, errorA12 as S, grayA12 as x, fontWeightNormal as u, spacingElement2 as z } from "../../tokens/index.js";
|
|
6
6
|
const A = g({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"label.js","sources":["../../../src/components/label/label.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport * as tokens from \"../../tokens\"\n\n/** Label — a native `<label>` element styled with Griffel atoms. */\n\nexport type LabelVariant = \"primary\" | \"destructive\"\nexport type LabelSize = \"sm\" | \"base\" | \"lg\"\n\nconst useStyles = makeZenithStyles({\n root: {\n display: \"flex\",\n alignItems: \"center\",\n ...shorthands.gap(tokens.spacingElement2),\n // The leading lives on the size slots below, and which value it takes is a decided question --\n // see DECISIONS.md D9 and the label specimens in vr/specimens that pin it.\n fontWeight: tokens.fontWeightNormal,\n \"&[for]\": {\n cursor: \"pointer\",\n },\n // The disabled-by-ANCESTOR and disabled-by-SIBLING rules are not here; they live on Field,\n // which owns the elements those selectors are rooted at. See field.tsx.\n \"&[data-disabled]\": {\n pointerEvents: \"none\",\n opacity: 0.5,\n },\n },\n // Variants\n primary: {\n color: tokens.grayA12,\n },\n destructive: {\n color: tokens.errorA12,\n },\n // Sizes\n sm: {\n fontSize: tokens.textXs,\n lineHeight: tokens.leadingXs,\n },\n base: {\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n },\n lg: {\n fontSize: tokens.textBase,\n lineHeight: tokens.leadingBase,\n },\n})\n\nexport type LabelProps = React.ComponentProps<\"label\"> & {\n variant?: LabelVariant\n size?: LabelSize\n}\n\nexport const Label = React.forwardRef<HTMLLabelElement, LabelProps>(\n function Label(\n { variant = \"primary\", size = \"base\", className, ...props },\n ref\n ) {\n const styles = useStyles()\n\n return (\n <label\n ref={ref}\n data-slot=\"label\"\n {...{ [SLOT_ATTR]: \"label\" }}\n className={mergeClasses(\n styles.root,\n styles[variant],\n styles[size],\n className\n )}\n {...props}\n />\n )\n }\n)\n"],"names":["useStyles","makeZenithStyles","shorthands","tokens.spacingElement2","tokens.fontWeightNormal","tokens.grayA12","tokens.errorA12","tokens.textXs","tokens.leadingXs","tokens.textSm","tokens.leadingSm","tokens.textBase","tokens.leadingBase","Label","React","variant","size","className","props","ref","styles","jsx","SLOT_ATTR","mergeClasses"],"mappings":";;;;;AAaA,MAAMA,IAAYC,EAAiB;AAAA,EACjC,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,GAAGC,EAAW,IAAIC,CAAsB;AAAA;AAAA;AAAA,IAGxC,YAAYC;AAAAA,IACZ,UAAU;AAAA,MACR,QAAQ;AAAA,IAAA;AAAA;AAAA;AAAA,IAIV,oBAAoB;AAAA,MAClB,eAAe;AAAA,MACf,SAAS;AAAA,IAAA;AAAA,EACX;AAAA;AAAA,EAGF,SAAS;AAAA,IACP,OAAOC;AAAAA,EAAO;AAAA,EAEhB,aAAa;AAAA,IACX,OAAOC;AAAAA,EAAO;AAAA;AAAA,EAGhB,IAAI;AAAA,IACF,UAAUC;AAAAA,IACV,YAAYC;AAAAA,EAAO;AAAA,EAErB,MAAM;AAAA,IACJ,UAAUC;AAAAA,IACV,YAAYC;AAAAA,EAAO;AAAA,EAErB,IAAI;AAAA,IACF,UAAUC;AAAAA,IACV,YAAYC;AAAAA,EAAO;AAEvB,CAAC,GAOYC,IAAQC,EAAM;AAAA,EACzB,SACE,EAAE,SAAAC,IAAU,WAAW,MAAAC,IAAO,QAAQ,WAAAC,GAAW,GAAGC,EAAA,GACpDC,GACA;AACA,UAAMC,IAASpB,EAAA;AAEf,WACE,gBAAAqB;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAF;AAAA,QACA,aAAU;AAAA,QACJ,CAACG,CAAS,GAAG;AAAA,QACnB,WAAWC;AAAA,UACTH,EAAO;AAAA,UACPA,EAAOL,CAAO;AAAA,UACdK,EAAOJ,CAAI;AAAA,UACXC;AAAA,QAAA;AAAA,QAED,GAAGC;AAAA,MAAA;AAAA,IAAA;AAAA,EAGV;AACF;"}
|
|
1
|
+
{"version":3,"file":"label.js","sources":["../../../src/components/label/label.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1/core\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport * as tokens from \"../../tokens\"\n\n/** Label — a native `<label>` element styled with Griffel atoms. */\n\nexport type LabelVariant = \"primary\" | \"destructive\"\nexport type LabelSize = \"sm\" | \"base\" | \"lg\"\n\nconst useStyles = makeZenithStyles({\n root: {\n display: \"flex\",\n alignItems: \"center\",\n ...shorthands.gap(tokens.spacingElement2),\n // The leading lives on the size slots below, and which value it takes is a decided question --\n // see DECISIONS.md D9 and the label specimens in vr/specimens that pin it.\n fontWeight: tokens.fontWeightNormal,\n \"&[for]\": {\n cursor: \"pointer\",\n },\n // The disabled-by-ANCESTOR and disabled-by-SIBLING rules are not here; they live on Field,\n // which owns the elements those selectors are rooted at. See field.tsx.\n \"&[data-disabled]\": {\n pointerEvents: \"none\",\n opacity: 0.5,\n },\n },\n // Variants\n primary: {\n color: tokens.grayA12,\n },\n destructive: {\n color: tokens.errorA12,\n },\n // Sizes\n sm: {\n fontSize: tokens.textXs,\n lineHeight: tokens.leadingXs,\n },\n base: {\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n },\n lg: {\n fontSize: tokens.textBase,\n lineHeight: tokens.leadingBase,\n },\n})\n\nexport type LabelProps = React.ComponentProps<\"label\"> & {\n variant?: LabelVariant\n size?: LabelSize\n}\n\nexport const Label = React.forwardRef<HTMLLabelElement, LabelProps>(\n function Label(\n { variant = \"primary\", size = \"base\", className, ...props },\n ref\n ) {\n const styles = useStyles()\n\n return (\n <label\n ref={ref}\n data-slot=\"label\"\n {...{ [SLOT_ATTR]: \"label\" }}\n className={mergeClasses(\n styles.root,\n styles[variant],\n styles[size],\n className\n )}\n {...props}\n />\n )\n }\n)\n"],"names":["useStyles","makeZenithStyles","shorthands","tokens.spacingElement2","tokens.fontWeightNormal","tokens.grayA12","tokens.errorA12","tokens.textXs","tokens.leadingXs","tokens.textSm","tokens.leadingSm","tokens.textBase","tokens.leadingBase","Label","React","variant","size","className","props","ref","styles","jsx","SLOT_ATTR","mergeClasses"],"mappings":";;;;;AAaA,MAAMA,IAAYC,EAAiB;AAAA,EACjC,MAAM;AAAA,IACJ,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,GAAGC,EAAW,IAAIC,CAAsB;AAAA;AAAA;AAAA,IAGxC,YAAYC;AAAAA,IACZ,UAAU;AAAA,MACR,QAAQ;AAAA,IAAA;AAAA;AAAA;AAAA,IAIV,oBAAoB;AAAA,MAClB,eAAe;AAAA,MACf,SAAS;AAAA,IAAA;AAAA,EACX;AAAA;AAAA,EAGF,SAAS;AAAA,IACP,OAAOC;AAAAA,EAAO;AAAA,EAEhB,aAAa;AAAA,IACX,OAAOC;AAAAA,EAAO;AAAA;AAAA,EAGhB,IAAI;AAAA,IACF,UAAUC;AAAAA,IACV,YAAYC;AAAAA,EAAO;AAAA,EAErB,MAAM;AAAA,IACJ,UAAUC;AAAAA,IACV,YAAYC;AAAAA,EAAO;AAAA,EAErB,IAAI;AAAA,IACF,UAAUC;AAAAA,IACV,YAAYC;AAAAA,EAAO;AAEvB,CAAC,GAOYC,IAAQC,EAAM;AAAA,EACzB,SACE,EAAE,SAAAC,IAAU,WAAW,MAAAC,IAAO,QAAQ,WAAAC,GAAW,GAAGC,EAAA,GACpDC,GACA;AACA,UAAMC,IAASpB,EAAA;AAEf,WACE,gBAAAqB;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAF;AAAA,QACA,aAAU;AAAA,QACJ,CAACG,CAAS,GAAG;AAAA,QACnB,WAAWC;AAAA,UACTH,EAAO;AAAA,UACPA,EAAOL,CAAO;AAAA,UACdK,EAAOJ,CAAI;AAAA,UACXC;AAAA,QAAA;AAAA,QAED,GAAGC;AAAA,MAAA;AAAA,IAAA;AAAA,EAGV;AACF;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as t, jsxs as I } from "react/jsx-runtime";
|
|
2
2
|
import * as n from "react";
|
|
3
|
-
import { mergeClasses as g, SLOT_ATTR as u, shorthands as p } from "@epilot/zenith-runtime/v1";
|
|
3
|
+
import { mergeClasses as g, SLOT_ATTR as u, shorthands as p } from "@epilot/zenith-runtime/v1/core.js";
|
|
4
4
|
import { makeZenithStyles as Y } from "../../styles/make-styles.js";
|
|
5
5
|
import { boxModel as d } from "../../styles/host-reset.js";
|
|
6
6
|
import { successLight as _, warningLight as q, errorLight as J, spacingGroup2 as B, grayA12 as G, fontWeightSemibold as Q, leadingSm as R, textSm as E, grayA10 as tt, fontWeightMedium as et, accentSolid as ot, accentA8 as rt, grayA11 as C, grayA8 as nt, leadingXs as it, textXs as st, listIndexPaddingX as O, listItemPaddingX as H, listItemPaddingY as T, listIndexMinWidth as at, grayA2 as P, radiusMd as D, successSoftHover as lt, warningSoftHover as ct, errorSoftHover as dt, accentSoft as pt, successDefault as ut, successSoft as gt, warningDefault as mt, warningSoft as ft, errorDefault as ht, errorSoft as xt, listItemMinHeight as wt, spacingElement3 as vt, grayA5 as yt, spacingElement1 as bt, spacingElement2 as It, listItemGap as St } from "../../tokens/index.js";
|