@epilot/zenith-react 0.1.0 → 0.2.0-next.0
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 +34 -0
- package/dist/components/alert-dialog/alert-dialog.js +48 -47
- package/dist/components/alert-dialog/alert-dialog.js.map +1 -1
- package/dist/components/callout/callout.js +51 -49
- package/dist/components/callout/callout.js.map +1 -1
- package/dist/components/date-range-picker/date-range-picker.js +194 -184
- package/dist/components/date-range-picker/date-range-picker.js.map +1 -1
- package/dist/components/date-time-picker/date-time-picker-input.js +127 -114
- package/dist/components/date-time-picker/date-time-picker-input.js.map +1 -1
- package/dist/components/date-time-picker/date-time-picker.js +91 -88
- package/dist/components/date-time-picker/date-time-picker.js.map +1 -1
- package/dist/components/dialog/dialog.js +74 -72
- package/dist/components/dialog/dialog.js.map +1 -1
- package/dist/components/drawer/drawer.js +69 -67
- package/dist/components/drawer/drawer.js.map +1 -1
- package/dist/components/field/field.js +215 -184
- package/dist/components/field/field.js.map +1 -1
- package/dist/components/tabs/tabs.js +131 -76
- package/dist/components/tabs/tabs.js.map +1 -1
- package/dist/index.d.ts +10 -0
- package/dist/tokens.json +1 -1
- package/package.json +3 -3
|
@@ -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 * 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\nconst useStyles = makeZenithStyles({\n root: {\n position: \"relative\",\n display: \"flex\",\n flexDirection: \"column\",\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 ...shorthands.gap(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.\n [`&[data-disabled] [${SLOT_ATTR}=\"label\"]`]: {\n pointerEvents: \"none\",\n opacity: 0.5,\n },\n [`& :disabled ~ [${SLOT_ATTR}=\"label\"]`]: {\n cursor: \"not-allowed\",\n opacity: 0.5,\n },\n [`& [data-disabled] ~ [${SLOT_ATTR}=\"label\"]`]: {\n cursor: \"not-allowed\",\n opacity: 0.5,\n },\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 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 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 minHeight: \"1rem\",\n fontSize: tokens.textXs,\n lineHeight: tokens.leadingXs,\n display: \"flex\",\n width: \"fit-content\",\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 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 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 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 display: \"flex\",\n alignItems: \"center\",\n ...shorthands.gap(tokens.spacingElement1),\n width: \"100%\",\n },\n textarea: {\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 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","useStyles","makeZenithStyles","tokens.fieldPaddingY","tokens.fieldPaddingX","shorthands","tokens.spacingElement1","tokens.radiusLg","tokens.focusRing","tokens.errorSoft","SLOT_ATTR","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","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":";;;;;AAaA,MAAMA,IAAgB,OAChBC,IAAiB,SACjBC,IAAmB,SACnBC,IAAuB,KACvBC,IAAiB,OAajBC,IAAeC,EAAM,cAAwC,IAAI,GAE1DC,IAAkB,MAAM;AACnC,QAAMC,IAAUF,EAAM,WAAWD,CAAY;AAC7C,MAAI,CAACG;AACH,UAAM,IAAI,MAAM,kDAAkD;AAEpE,SAAOA;AACT,GAMaC,KAA0B,MACrCH,EAAM,WAAWD,CAAY,GAIzBK,IAAYC,EAAiB;AAAA,EACjC,MAAM;AAAA,IACJ,UAAU;AAAA,IACV,SAAS;AAAA,IACT,eAAe;AAAA,IACf,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAMP,YAAYC;AAAAA,IACZ,eAAeA;AAAAA,IACf,aAAaC;AAAAA,IACb,cAAcA;AAAAA,IACd,GAAGC,EAAW,IAAIC,CAAsB;AAAA,IACxC,GAAGD,EAAW,aAAaE,CAAe;AAAA,IAC1C,oBAAoB;AAAA,IACpB,oBAAoB;AAAA,IACpB,eAAe;AAAA,IACf,cAAc;AAAA,IACd,cAAc;AAAA,IACd,2CAA2C;AAAA,MACzC,oBAAoB;AAAA,IAAA;AAAA,IAEtB,iDAAiD;AAAA,MAC/C,cAAc;AAAA,MACd,cAAcC;AAAAA,IAAO;AAAA,IAEvB,mBAAmB;AAAA,MACjB,iBAAiBC;AAAAA,IAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAQ1B,CAAC,qBAAqBC,CAAS,WAAW,GAAG;AAAA,MAC3C,eAAe;AAAA,MACf,SAAS;AAAA,IAAA;AAAA,IAEX,CAAC,kBAAkBA,CAAS,WAAW,GAAG;AAAA,MACxC,QAAQ;AAAA,MACR,SAAS;AAAA,IAAA;AAAA,IAEX,CAAC,wBAAwBA,CAAS,WAAW,GAAG;AAAA,MAC9C,QAAQ;AAAA,MACR,SAAS;AAAA,IAAA;AAAA,EACX;AAAA,EAEF,aAAa;AAAA,IACX,iBAAiBC;AAAAA,IACjB,UAAU;AAAA,MACR,iBAAiBC;AAAAA,IAAO;AAAA,EAC1B;AAAA,EAEF,eAAe;AAAA,IACb,iBAAiBC;AAAAA,IACjB,UAAU;AAAA,MACR,iBAAiBC;AAAAA,IAAO;AAAA,EAC1B;AAAA,EAEF,cAAc;AAAA,IACZ,iBAAiBH;AAAAA,EAAO;AAAA,EAE1B,iBAAiB;AAAA,IACf,iBAAiBF;AAAAA,IACjB,UAAU;AAAA,MACR,iBAAiBM;AAAAA,IAAO;AAAA,EAC1B;AAAA,EAEF,UAAU;AAAA,IACR,SAAS;AAAA,IACT,eAAe;AAAA;AAAA;AAAA,IAGf,GAAGV,EAAW,IAAIW,CAAkB;AAAA,IACpC,GAAGX,EAAW,OAAO,GAAG;AAAA,IACxB,GAAGA,EAAW,QAAQ,CAAC;AAAA,IACvB,GAAGA,EAAW,OAAO,CAAC;AAAA,EAAA;AAAA,EAExB,YAAY;AAAA,IACV,SAAS;AAAA,IACT,OAAO;AAAA,IACP,GAAGA,EAAW,IAAIY,CAAsB;AAAA,EAAA;AAAA,EAE1C,kBAAkB;AAAA,IAChB,eAAe;AAAA,EAAA;AAAA,EAEjB,eAAe;AAAA,IACb,eAAe;AAAA,EAAA;AAAA,EAEjB,cAAc;AAAA,IACZ,SAAS;AAAA,IACT,UAAU;AAAA,IACV,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,eAAe;AAAA,IACf,GAAGZ,EAAW,IAAIY,CAAsB;AAAA,IACxC,YAAY;AAAA,EAAA;AAAA,EAEd,OAAO;AAAA,IACL,WAAW;AAAA,IACX,UAAUC;AAAAA,IACV,YAAYC;AAAAA,IACZ,SAAS;AAAA,IACT,OAAO;AAAA,IACP,GAAGd,EAAW,IAAIY,CAAsB;AAAA,IACxC,QAAQ;AAAA,IACR,OAAOG;AAAAA,IACP,oBAAoB;AAAA,MAClB,SAAS;AAAA,IAAA;AAAA,EACX;AAAA,EAEF,cAAc;AAAA,IACZ,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,GAAGf,EAAW,IAAIC,CAAsB;AAAA,IACxC,oBAAoB;AAAA,IACpB,oBAAoB;AAAA,IACpB,2CAA2C;AAAA,MACzC,oBAAoB;AAAA,IAAA;AAAA,EACtB;AAAA,EAEF,mBAAmB;AAAA,IACjB,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,WAAW;AAAA,IACX,SAAS;AAAA,IACT,eAAe;AAAA,EAAA;AAAA,EAEjB,aAAa;AAAA,IACX,UAAUY;AAAAA,IACV,YAAY;AAAA,IACZ,YAAYG;AAAAA,IACZ,GAAGhB,EAAW,OAAO,CAAC;AAAA,IACtB,OAAO;AAAA,MACL,oBAAoB;AAAA,MACpB,qBAAqB;AAAA,IAAA;AAAA,EACvB;AAAA,EAEF,oBAAoB;AAAA,IAClB,OAAOe;AAAAA,EAAO;AAAA,EAEhB,mBAAmB;AAAA,IACjB,OAAOE;AAAAA,EAAO;AAAA,EAEhB,OAAO;AAAA,IACL,OAAOC;AAAAA,IACP,UAAUL;AAAAA,IACV,YAAYC;AAAAA,IACZ,YAAYE;AAAAA,EAAO;AAAA,EAErB,WAAW;AAAA,IACT,SAAS;AAAA,IACT,eAAe;AAAA,IACf,GAAGhB,EAAW,OAAO,CAAC;AAAA,IACtB,aAAa;AAAA,IACb,eAAe;AAAA,EAAA;AAAA,EAEjB,eAAe;AAAA,IACb,OAAOkB;AAAAA,IACP,UAAUL;AAAAA,IACV,YAAYC;AAAAA,IACZ,YAAYE;AAAAA,IACZ,WAAW;AAAA,IACX,cAAc;AAAA,EAAA;AAAA,EAEhB,OAAO;AAAA,IACL,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA,IAKP,QAAQG;AAAAA,IACR,cAAc;AAAA,IACd,UAAUC;AAAAA,IACV,YAAYC;AAAAA,IACZ,OAAON;AAAAA,IACP,iBAAiB;AAAA,IACjB,GAAGf,EAAW,OAAO,GAAG;AAAA,IACxB,GAAGA,EAAW,QAAQ,CAAC;AAAA,IACvB,iBAAiB;AAAA,MACf,OAAOsB;AAAAA,IAAO;AAAA,IAEhB,aAAa;AAAA,MACX,QAAQ;AAAA,IAAA;AAAA,EACV;AAAA,EAEF,YAAY;AAAA,IACV,SAAS;AAAA,IACT,YAAY;AAAA,IACZ,GAAGtB,EAAW,IAAIC,CAAsB;AAAA,IACxC,OAAO;AAAA,EAAA;AAAA,EAET,UAAU;AAAA,IACR,OAAO;AAAA,IACP,cAAc;AAAA,IACd,UAAUmB;AAAAA,IACV,YAAYC;AAAAA,IACZ,OAAON;AAAAA,IACP,iBAAiB;AAAA,IACjB,GAAGf,EAAW,OAAO,GAAG;AAAA,IACxB,GAAGA,EAAW,QAAQ,CAAC;AAAA,IACvB,iBAAiB;AAAA,MACf,OAAOsB;AAAAA,IAAO;AAAA,IAEhB,aAAa;AAAA,MACX,QAAQ;AAAA,IAAA;AAAA,EACV;AAAA,EAEF,YAAY;AAAA,IACV,QAAQ;AAAA,EAAA;AAAA,EAEV,gBAAgB;AAAA,IACd,QAAQ;AAAA,EAAA;AAAA,EAEV,kBAAkB;AAAA,IAChB,QAAQ;AAAA,EAAA;AAAA,EAEV,OAAO;AAAA,IACL,OAAOL;AAAAA,IACP,SAAS;AAAA,IACT,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,YAAY;AAAA,IACZ,YAAY;AAAA,IACZ,gBAAgB;AAAA,IAChB,GAAGjB,EAAW,IAAIY,CAAsB;AAAA,IACxC,UAAUQ;AAAAA,IACV,YAAYC;AAAAA,IACZ,YAAYL;AAAAA,IACZ,YAAY;AAAA,EAAA;AAAA,EAEd,YAAY;AAAA,IACV,OAAO;AAAA,EAAA;AAAA,EAET,UAAU;AAAA,IACR,OAAO;AAAA,EAAA;AAEX,CAAC,GAGYO,KAAgB,CAAC;AAAA,EAC5B,SAAAC,IAAU;AACZ,IAAgC,OACvBA,GAQIC,KAAQjC,EAAM;AAAA,EACzB,SACE;AAAA,IACE,WAAAkC;AAAA,IACA,SAAAF,IAAU;AAAA,IACV,UAAAG;AAAA,IACA,gBAAAC;AAAA,IACA,eAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,GAELC,GACA;AACA,UAAMC,IAASpC,EAAA,GACTqC,IAAWzC,EAAM,OAAsB,IAAI,GAC3C,CAAC0C,GAAWC,CAAY,IAAI3C,EAAM,SAAS,EAAK,GAEhD4C,IAAoE,CACxEC,MACG;AACH,MAAAF,EAAa,EAAI,GACjBP,KAAA,QAAAA,EAAiBS;AAAA,IACnB,GAEMC,IAAkE,CACtED,MACG;AACH,MAAAF,EAAa,EAAK,GAClBN,KAAA,QAAAA,EAAgBQ;AAAA,IAClB,GAEME,IACJf,MAAY,cACRQ,EAAO,gBACPR,MAAY,aACVQ,EAAO,eACPR,MAAY,gBACVQ,EAAO,kBACPA,EAAO;AAEjB,6BACGzC,EAAa,UAAb,EAAsB,OAAO,EAAE,UAAA0C,KAC9B,UAAA,gBAAAO;AAAA,MAACtD;AAAA,MAAA;AAAA,QACC,KAAA6C;AAAA,QACA,MAAK;AAAA,QACL,aAAU;AAAA,QACJ,CAAC1B,CAAS,GAAG;AAAA,QACnB,gBAAc6B,IAAY,SAAS;AAAA,QACnC,WAAWO,EAAaT,EAAO,MAAMO,GAAcb,CAAS;AAAA,QAC5D,gBAAgBU;AAAA,QAChB,eAAeE;AAAA,QACd,GAAGR;AAAA,QAEH,UAAAH;AAAA,MAAA;AAAA,IAAA,GAEL;AAAA,EAEJ;AACF,GAIae,KAAWlD,EAAM;AAAA,EAC5B,SAAkB,EAAE,WAAAkC,GAAW,GAAGI,EAAA,GAASC,GAAK;AAC9C,UAAMC,IAASpC,EAAA;AAEf,WACE,gBAAA4C;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAT;AAAA,QACA,aAAU;AAAA,QACJ,CAAC1B,CAAS,GAAG;AAAA,QACnB,WAAWoC,EAAaT,EAAO,UAAUN,CAAS;AAAA,QACjD,GAAGI;AAAA,MAAA;AAAA,IAAA;AAAA,EAGV;AACF,GAMaa,KAAanD,EAAM;AAAA,EAC9B,SAAoB,EAAE,WAAAkC,GAAW,WAAAkB,IAAY,UAAU,GAAGd,EAAA,GAASC,GAAK;AACtE,UAAMC,IAASpC,EAAA;AAEf,WACE,gBAAA4C;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAT;AAAA,QACA,aAAU;AAAA,QACJ,CAAC1B,CAAS,GAAG;AAAA,QACnB,WAAWoC;AAAA,UACTT,EAAO;AAAA,UACPY,MAAc,QAAQZ,EAAO,gBAAgBA,EAAO;AAAA,UACpDN;AAAA,QAAA;AAAA,QAED,GAAGI;AAAA,MAAA;AAAA,IAAA;AAAA,EAGV;AACF,GAIae,KAAerD,EAAM;AAAA,EAChC,SAAsB,EAAE,WAAAkC,GAAW,GAAGI,EAAA,GAASC,GAAK;AAClD,UAAMC,IAASpC,EAAA;AAEf,WACE,gBAAA4C;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAT;AAAA,QACA,aAAU;AAAA,QACJ,CAAC1B,CAAS,GAAG;AAAA,QACnB,WAAWoC,EAAaT,EAAO,cAAcN,CAAS;AAAA,QACrD,GAAGI;AAAA,MAAA;AAAA,IAAA;AAAA,EAGV;AACF,GASagB,KAAatD,EAAM;AAAA,EAC9B,SAAoB,EAAE,WAAAkC,GAAW,GAAGI,EAAA,GAASC,GAAK;AAChD,UAAMC,IAASpC,EAAA;AAEf,WACE,gBAAA4C;AAAA,MAACrD;AAAA,MAAA;AAAA,QACC,KAAA4C;AAAA,QACA,aAAU;AAAA,QACJ,CAAC1B,CAAS,GAAG;AAAA,QACnB,WAAWoC,EAAaT,EAAO,OAAON,CAAS;AAAA,QAC9C,GAAGI;AAAA,MAAA;AAAA,IAAA;AAAA,EAGV;AACF,GAMaiB,KAAoBvD,EAAM,WAGrC,SAA2B,EAAE,WAAAkC,GAAW,aAAAsB,IAAc,IAAM,GAAGlB,EAAA,GAASC,GAAK;AAC7E,QAAMC,IAASpC,EAAA;AAEf,SACE,gBAAA4C;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAT;AAAA,MACA,aAAU;AAAA,MACJ,CAAC1B,CAAS,GAAG;AAAA,MACnB,WAAWoC;AAAA,QACTT,EAAO;AAAA,QACPgB,KAAehB,EAAO;AAAA,QACtBN;AAAA,MAAA;AAAA,MAED,GAAGI;AAAA,IAAA;AAAA,EAAA;AAGV,CAAC,GAIYmB,KAA2B,CAAC;AAAA,EACvC,SAAAzB,IAAU;AACZ,IAA2C,OAClCA,GAWI0B,KAAmB1D,EAAM,WAGpC,SAA0B,EAAE,WAAAkC,GAAW,SAAAF,IAAU,WAAW,GAAGM,EAAA,GAASC,GAAK;AAC7E,QAAMC,IAASpC,EAAA,GAET2C,IACJf,MAAY,WAAWQ,EAAO,oBAAoBA,EAAO;AAE3D,SACE,gBAAAQ;AAAA,IAACnD;AAAA,IAAA;AAAA,MACC,KAAA0C;AAAA,MACA,aAAU;AAAA,MACJ,CAAC1B,CAAS,GAAG;AAAA,MACnB,WAAWoC,EAAaT,EAAO,aAAaO,GAAcb,CAAS;AAAA,MAClE,GAAGI;AAAA,IAAA;AAAA,EAAA;AAGV,CAAC,GAOYqB,KAAa3D,EAAM;AAAA,EAC9B,SAAoB,EAAE,WAAAkC,GAAW,UAAAC,GAAU,QAAAyB,GAAQ,GAAGtB,EAAA,GAASC,GAAK;AAClE,UAAMC,IAASpC,EAAA,GAETyD,IAAU7D,EAAM,QAAQ,MAAM;;AAClC,UAAImC;AACF,eAAOA;AAGT,UAAI,EAACyB,KAAA,QAAAA,EAAQ;AACX,eAAO;AAGT,YAAME,IAAe;AAAA,QACnB,GAAG,IAAI,IAAIF,EAAO,IAAI,CAACG,MAAU,CAACA,KAAA,gBAAAA,EAAO,SAASA,CAAK,CAAC,CAAC,EAAE,OAAA;AAAA,MAAO;AAGpE,aAAID,EAAa,WAAW,KACnBE,IAAAF,EAAa,CAAC,MAAd,gBAAAE,EAAiB,UAIxB,gBAAAhB,EAAC,MAAA,EAAG,WAAWR,EAAO,WACnB,UAAAsB,EAAa;AAAA,QACZ,CAACC,GAAOE,OACNF,KAAA,gBAAAA,EAAO,YACL,gBAAAf,EAAC,MAAA,EAAG,WAAWR,EAAO,eACnB,UAAAuB,EAAM,QAAA,GADiCE,CAE1C;AAAA,MAAA,GAGR;AAAA,IAEJ,GAAG,CAAC9B,GAAUyB,GAAQpB,EAAO,WAAWA,EAAO,aAAa,CAAC;AAE7D,WAAKqB,IAKH,gBAAAb;AAAA,MAAClD;AAAA,MAAA;AAAA,QACC,KAAAyC;AAAA,QACA,MAAK;AAAA,QACL,aAAU;AAAA,QACJ,CAAC1B,CAAS,GAAG;AAAA,QACnB,WAAWoC,EAAaT,EAAO,OAAON,CAAS;AAAA,QAC9C,GAAGI;AAAA,QAEH,UAAAuB;AAAA,MAAA;AAAA,IAAA,IAZI;AAAA,EAeX;AACF,GASaK,KAAalE,EAAM;AAAA,EAC9B,SAAoB,EAAE,WAAAkC,GAAW,GAAGI,EAAA,GAAS6B,GAAc;AACzD,UAAM3B,IAASpC,EAAA,GACT,EAAE,UAAAqC,EAAA,IAAaxC,EAAA;AAErB,WACE,gBAAA+C;AAAA,MAACpD;AAAA,MAAA;AAAA,QACC,KAAK,CAACwE,MAA2B;AAC/B,UAAA3B,EAAS,UAAU2B,GACf,OAAOD,KAAiB,aAC1BA,EAAaC,CAAsB,IAC1BD,MACTA,EAAa,UAAUC;AAAA,QAE3B;AAAA,QACA,iBAAe9B,EAAM;AAAA,QACrB,aAAU;AAAA,QACJ,CAACzB,CAAS,GAAG;AAAA,QACnB,WAAWoC,EAAaT,EAAO,OAAON,CAAS;AAAA,QAC9C,GAAGI;AAAA,MAAA;AAAA,IAAA;AAAA,EAGV;AACF,GAIa+B,KAAkBrE,EAAM,WAGnC,SAAyB,EAAE,WAAAkC,GAAW,GAAGI,EAAA,GAASC,GAAK;AACvD,QAAMC,IAASpC,EAAA;AAEf,SACE,gBAAA4C;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAT;AAAA,MACA,aAAU;AAAA,MACJ,CAAC1B,CAAS,GAAG;AAAA,MACnB,WAAWoC,EAAaT,EAAO,YAAYN,CAAS;AAAA,MACnD,GAAGI;AAAA,IAAA;AAAA,EAAA;AAGV,CAAC,GAQYgC,KAAgBtE,EAAM,WAGjC,SACA,EAAE,WAAAkC,GAAW,QAAAqC,IAAS,QAAQ,GAAGjC,EAAA,GACjC6B,GACA;AACA,QAAM3B,IAASpC,EAAA,GACT,EAAE,UAAAqC,EAAA,IAAaxC,EAAA,GAEfuE,IACJD,MAAW,aACP/B,EAAO,iBACP+B,MAAW,eACT/B,EAAO,mBACPA,EAAO;AAEf,SACE,gBAAAQ;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGV;AAAA,MACJ,KAAK,CAAC8B,MAAmC;AACvC,QAAA3B,EAAS,UAAU2B,GACf,OAAOD,KAAiB,aAC1BA,EAAaC,CAAE,IACND,MACTA,EAAa,UAAUC;AAAA,MAE3B;AAAA,MACA,iBAAe9B,EAAM;AAAA,MACrB,aAAU;AAAA,MACJ,CAACzB,CAAS,GAAG;AAAA,MACnB,eAAa0D;AAAA,MACb,WAAWtB,EAAaT,EAAO,UAAUgC,GAAatC,CAAS;AAAA,IAAA;AAAA,EAAA;AAGrE,CAAC,GAIYuC,KAA0B,CAAC;AAAA,EACtC,OAAAC,IAAQ;AACV,IAAsC,OAC7BA,GAOIC,KAAkB3E,EAAM,WAGnC,SAAyB,EAAE,WAAAkC,GAAW,OAAAwC,IAAQ,SAAS,GAAGpC,EAAA,GAASC,GAAK;AACxE,QAAMC,IAASpC,EAAA;AAEf,SACE,gBAAA4C;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAT;AAAA,MACA,MAAK;AAAA,MACL,aAAU;AAAA,MACJ,CAAC1B,CAAS,GAAG;AAAA,MACnB,cAAY6D;AAAA,MACZ,WAAWzB;AAAA,QACTT,EAAO;AAAA,QACPkC,MAAU,QAAQlC,EAAO,WAAWA,EAAO;AAAA,QAC3CN;AAAA,MAAA;AAAA,MAED,GAAGI;AAAA,IAAA;AAAA,EAAA;AAGV,CAAC;"}
|
|
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 * 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 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 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 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 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 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 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 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 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 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 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","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","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,52 +1,52 @@
|
|
|
1
|
-
import { jsx as
|
|
2
|
-
import * as
|
|
3
|
-
import { Root as
|
|
4
|
-
import { mergeClasses as
|
|
5
|
-
import { makeZenithStyles as
|
|
6
|
-
import { errorA3 as
|
|
7
|
-
const
|
|
1
|
+
import { jsx as C } from "react/jsx-runtime";
|
|
2
|
+
import * as r from "react";
|
|
3
|
+
import { Root as w, Content as z, List as G, Trigger as O } from "../../vendor/.bun/@radix-ui_react-tabs@1.1.13_2b23df507bdda662/vendor/@radix-ui/react-tabs/dist/index.js";
|
|
4
|
+
import { mergeClasses as x, SLOT_ATTR as T, shorthands as e } from "@epilot/zenith-runtime/v1";
|
|
5
|
+
import { makeZenithStyles as W } from "../../styles/make-styles.js";
|
|
6
|
+
import { errorA3 as B, errorA8 as F, errorA4 as H, errorA11 as K, accentA3 as U, accentA8 as Z, accentA4 as _, accentA12 as q, grayA3 as D, grayA8 as J, grayA4 as Q, grayA12 as E, leadingSm as X, textSm as Y, spacingElement3 as I, spacingGroup2 as $, spacingElement2 as g, radiusLg as N, spacingElement1 as M } from "../../tokens/index.js";
|
|
7
|
+
const P = r.createContext({
|
|
8
8
|
size: "base",
|
|
9
9
|
variant: "default"
|
|
10
|
-
}),
|
|
10
|
+
}), k = W({
|
|
11
11
|
root: {
|
|
12
12
|
display: "flex",
|
|
13
13
|
flexDirection: "column",
|
|
14
|
-
...
|
|
14
|
+
...e.gap(g),
|
|
15
15
|
"&[data-orientation='vertical']": {
|
|
16
16
|
flexDirection: "row",
|
|
17
17
|
alignItems: "flex-start",
|
|
18
|
-
...
|
|
18
|
+
...e.gap(g)
|
|
19
19
|
}
|
|
20
20
|
},
|
|
21
21
|
list: {
|
|
22
22
|
backgroundColor: "transparent",
|
|
23
|
-
color:
|
|
23
|
+
color: E,
|
|
24
24
|
height: "auto",
|
|
25
25
|
display: "inline-flex",
|
|
26
26
|
alignItems: "center",
|
|
27
27
|
justifyContent: "center",
|
|
28
|
-
...
|
|
29
|
-
...
|
|
30
|
-
...
|
|
28
|
+
...e.gap(g),
|
|
29
|
+
...e.borderRadius(N),
|
|
30
|
+
...e.paddingBlock(g),
|
|
31
31
|
"&[data-orientation='vertical']": {
|
|
32
32
|
flexDirection: "column",
|
|
33
33
|
alignItems: "stretch",
|
|
34
34
|
justifyContent: "flex-start",
|
|
35
|
-
...
|
|
36
|
-
...
|
|
35
|
+
...e.gap(M),
|
|
36
|
+
...e.paddingBlock(0)
|
|
37
37
|
}
|
|
38
38
|
},
|
|
39
39
|
trigger: {
|
|
40
40
|
display: "inline-flex",
|
|
41
41
|
alignItems: "center",
|
|
42
|
-
...
|
|
42
|
+
...e.gap(g),
|
|
43
43
|
backgroundColor: "transparent",
|
|
44
|
-
...
|
|
45
|
-
...
|
|
46
|
-
...
|
|
44
|
+
...e.borderStyle("none"),
|
|
45
|
+
...e.borderWidth(0),
|
|
46
|
+
...e.borderRadius(N),
|
|
47
47
|
cursor: "pointer",
|
|
48
|
-
fontSize:
|
|
49
|
-
lineHeight:
|
|
48
|
+
fontSize: Y,
|
|
49
|
+
lineHeight: X,
|
|
50
50
|
transitionProperty: "all",
|
|
51
51
|
transitionDuration: "150ms",
|
|
52
52
|
transitionTimingFunction: "cubic-bezier(0.4, 0, 0.2, 1)",
|
|
@@ -63,49 +63,49 @@ const x = s.createContext({
|
|
|
63
63
|
},
|
|
64
64
|
// Sizes
|
|
65
65
|
sm: {
|
|
66
|
-
...
|
|
66
|
+
...e.padding("0.375rem", g)
|
|
67
67
|
},
|
|
68
68
|
base: {
|
|
69
|
-
...
|
|
69
|
+
...e.padding(g, I)
|
|
70
70
|
},
|
|
71
71
|
lg: {
|
|
72
|
-
...
|
|
72
|
+
...e.padding(I, $)
|
|
73
73
|
},
|
|
74
74
|
// Variants
|
|
75
75
|
defaultVariant: {
|
|
76
|
-
color:
|
|
76
|
+
color: E,
|
|
77
77
|
":hover": {
|
|
78
|
-
backgroundColor:
|
|
78
|
+
backgroundColor: Q
|
|
79
79
|
},
|
|
80
80
|
":focus-visible": {
|
|
81
|
-
outlineColor:
|
|
81
|
+
outlineColor: J
|
|
82
82
|
},
|
|
83
83
|
"&[data-state='active']": {
|
|
84
|
-
backgroundColor:
|
|
84
|
+
backgroundColor: D
|
|
85
85
|
}
|
|
86
86
|
},
|
|
87
87
|
highlightVariant: {
|
|
88
|
-
color:
|
|
88
|
+
color: q,
|
|
89
89
|
":hover": {
|
|
90
|
-
backgroundColor:
|
|
90
|
+
backgroundColor: _
|
|
91
91
|
},
|
|
92
92
|
":focus-visible": {
|
|
93
|
-
outlineColor:
|
|
93
|
+
outlineColor: Z
|
|
94
94
|
},
|
|
95
95
|
"&[data-state='active']": {
|
|
96
|
-
backgroundColor:
|
|
96
|
+
backgroundColor: U
|
|
97
97
|
}
|
|
98
98
|
},
|
|
99
99
|
destructiveVariant: {
|
|
100
|
-
color:
|
|
100
|
+
color: K,
|
|
101
101
|
":hover": {
|
|
102
|
-
backgroundColor:
|
|
102
|
+
backgroundColor: H
|
|
103
103
|
},
|
|
104
104
|
":focus-visible": {
|
|
105
|
-
outlineColor:
|
|
105
|
+
outlineColor: F
|
|
106
106
|
},
|
|
107
107
|
"&[data-state='active']": {
|
|
108
|
-
backgroundColor:
|
|
108
|
+
backgroundColor: B
|
|
109
109
|
}
|
|
110
110
|
},
|
|
111
111
|
content: {
|
|
@@ -114,66 +114,121 @@ const x = s.createContext({
|
|
|
114
114
|
flexBasis: "0%",
|
|
115
115
|
outlineStyle: "none"
|
|
116
116
|
}
|
|
117
|
-
}),
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
117
|
+
}), nt = r.forwardRef(function({
|
|
118
|
+
className: l,
|
|
119
|
+
size: n = "base",
|
|
120
|
+
variant: a = "default",
|
|
121
|
+
value: o,
|
|
122
|
+
defaultValue: h,
|
|
123
|
+
onValueChange: b,
|
|
124
|
+
...c
|
|
125
|
+
}, R) {
|
|
126
|
+
const d = k(), [S, V] = r.useState(h), u = o !== void 0, f = (u ? o : S) ?? "", y = r.useRef({ value: f, isControlled: u, onValueChange: b });
|
|
127
|
+
y.current = { value: f, isControlled: u, onValueChange: b };
|
|
128
|
+
const s = r.useRef(null), v = r.useCallback((i) => {
|
|
129
|
+
const t = { value: i, reported: !1 };
|
|
130
|
+
s.current = t, setTimeout(() => {
|
|
131
|
+
s.current === t && (s.current = null);
|
|
132
|
+
}, 0);
|
|
133
|
+
}, []), p = r.useCallback((i) => {
|
|
134
|
+
var j;
|
|
135
|
+
const t = y.current, m = s.current;
|
|
136
|
+
if (m !== null && m.value === i) {
|
|
137
|
+
if (m.reported) return;
|
|
138
|
+
m.reported = !0;
|
|
139
|
+
}
|
|
140
|
+
i !== t.value && (t.isControlled || V(i), (j = t.onValueChange) == null || j.call(t, i));
|
|
141
|
+
}, []), L = r.useMemo(
|
|
142
|
+
() => ({ size: n, variant: a, select: p, beginPress: v }),
|
|
143
|
+
[n, a, p, v]
|
|
144
|
+
);
|
|
145
|
+
return /* @__PURE__ */ C(P.Provider, { value: L, children: /* @__PURE__ */ C(
|
|
146
|
+
w,
|
|
121
147
|
{
|
|
122
|
-
ref:
|
|
148
|
+
ref: R,
|
|
123
149
|
"data-slot": "tabs",
|
|
124
|
-
[
|
|
125
|
-
"data-size":
|
|
150
|
+
[T]: "tabs",
|
|
151
|
+
"data-size": n,
|
|
126
152
|
"data-variant": a,
|
|
127
|
-
className:
|
|
128
|
-
...
|
|
153
|
+
className: x(d.root, l),
|
|
154
|
+
...c,
|
|
155
|
+
value: f,
|
|
156
|
+
onValueChange: p
|
|
129
157
|
}
|
|
130
158
|
) });
|
|
131
|
-
}),
|
|
132
|
-
const
|
|
133
|
-
return /* @__PURE__ */
|
|
134
|
-
|
|
159
|
+
}), st = r.forwardRef(function({ className: l, ...n }, a) {
|
|
160
|
+
const o = k();
|
|
161
|
+
return /* @__PURE__ */ C(
|
|
162
|
+
G,
|
|
135
163
|
{
|
|
136
164
|
ref: a,
|
|
137
165
|
"data-slot": "tabs-list",
|
|
138
|
-
[
|
|
139
|
-
className:
|
|
140
|
-
...
|
|
166
|
+
[T]: "tabs-list",
|
|
167
|
+
className: x(o.list, l),
|
|
168
|
+
...n
|
|
141
169
|
}
|
|
142
170
|
);
|
|
143
|
-
}),
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
171
|
+
}), it = r.forwardRef(function({
|
|
172
|
+
className: l,
|
|
173
|
+
variant: n = "default",
|
|
174
|
+
onClick: a,
|
|
175
|
+
onKeyDown: o,
|
|
176
|
+
onBlur: h,
|
|
177
|
+
onMouseDown: b,
|
|
178
|
+
...c
|
|
179
|
+
}, R) {
|
|
180
|
+
const d = k(), {
|
|
181
|
+
size: S,
|
|
182
|
+
variant: V,
|
|
183
|
+
select: u,
|
|
184
|
+
beginPress: f
|
|
185
|
+
} = r.useContext(P), y = (t) => {
|
|
186
|
+
b == null || b(t), !t.defaultPrevented && t.button === 0 && !t.ctrlKey && !c.disabled && (f == null || f(c.value));
|
|
187
|
+
}, s = r.useRef(!1), v = (t) => {
|
|
188
|
+
o == null || o(t), s.current = !t.defaultPrevented && (t.key === "Enter" || t.key === " ");
|
|
189
|
+
}, p = (t) => {
|
|
190
|
+
h == null || h(t), s.current = !1;
|
|
191
|
+
}, L = (t) => {
|
|
192
|
+
a == null || a(t);
|
|
193
|
+
const m = s.current;
|
|
194
|
+
s.current = !1, !(m || t.detail !== 0 || t.defaultPrevented || t.ctrlKey || c.disabled) && (u == null || u(c.value));
|
|
195
|
+
}, i = n === "destructive" ? d.destructiveVariant : V === "highlight" ? d.highlightVariant : d.defaultVariant;
|
|
196
|
+
return /* @__PURE__ */ C(
|
|
197
|
+
O,
|
|
147
198
|
{
|
|
148
|
-
ref:
|
|
199
|
+
ref: R,
|
|
149
200
|
"data-slot": "tabs-trigger",
|
|
150
|
-
[
|
|
151
|
-
className:
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
201
|
+
[T]: "tabs-trigger",
|
|
202
|
+
className: x(
|
|
203
|
+
d.trigger,
|
|
204
|
+
d[S],
|
|
205
|
+
i,
|
|
206
|
+
l
|
|
156
207
|
),
|
|
157
|
-
...
|
|
208
|
+
...c,
|
|
209
|
+
onClick: L,
|
|
210
|
+
onKeyDown: v,
|
|
211
|
+
onBlur: p,
|
|
212
|
+
onMouseDown: y
|
|
158
213
|
}
|
|
159
214
|
);
|
|
160
|
-
}),
|
|
161
|
-
const
|
|
162
|
-
return /* @__PURE__ */
|
|
163
|
-
|
|
215
|
+
}), lt = r.forwardRef(function({ className: l, ...n }, a) {
|
|
216
|
+
const o = k();
|
|
217
|
+
return /* @__PURE__ */ C(
|
|
218
|
+
z,
|
|
164
219
|
{
|
|
165
220
|
ref: a,
|
|
166
221
|
"data-slot": "tabs-content",
|
|
167
|
-
[
|
|
168
|
-
className:
|
|
169
|
-
...
|
|
222
|
+
[T]: "tabs-content",
|
|
223
|
+
className: x(o.content, l),
|
|
224
|
+
...n
|
|
170
225
|
}
|
|
171
226
|
);
|
|
172
227
|
});
|
|
173
228
|
export {
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
229
|
+
nt as Tabs,
|
|
230
|
+
lt as TabsContent,
|
|
231
|
+
st as TabsList,
|
|
232
|
+
it as TabsTrigger
|
|
178
233
|
};
|
|
179
234
|
//# sourceMappingURL=tabs.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"tabs.js","sources":["../../../src/components/tabs/tabs.tsx"],"sourcesContent":["import * as React from \"react\"\nimport * as TabsPrimitive from \"@radix-ui/react-tabs\"\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\nexport type TabsSize = \"sm\" | \"base\" | \"lg\"\nexport type TabsRootVariant = \"default\" | \"highlight\"\nexport type TabsTriggerVariant = \"default\" | \"destructive\"\n\ntype TabsContextValue = {\n size: TabsSize\n variant: TabsRootVariant\n}\n\nconst TabsContext = React.createContext<TabsContextValue>({\n size: \"base\",\n variant: \"default\",\n})\n\nconst useStyles = makeZenithStyles({\n root: {\n display: \"flex\",\n flexDirection: \"column\",\n ...shorthands.gap(tokens.spacingElement2),\n \"&[data-orientation='vertical']\": {\n flexDirection: \"row\",\n alignItems: \"flex-start\",\n ...shorthands.gap(tokens.spacingElement2),\n },\n },\n list: {\n backgroundColor: \"transparent\",\n color: tokens.grayA12,\n height: \"auto\",\n display: \"inline-flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n ...shorthands.gap(tokens.spacingElement2),\n ...shorthands.borderRadius(tokens.radiusLg),\n ...shorthands.paddingBlock(tokens.spacingElement2),\n \"&[data-orientation='vertical']\": {\n flexDirection: \"column\",\n alignItems: \"stretch\",\n justifyContent: \"flex-start\",\n ...shorthands.gap(tokens.spacingElement1),\n ...shorthands.paddingBlock(0),\n },\n },\n trigger: {\n display: \"inline-flex\",\n alignItems: \"center\",\n ...shorthands.gap(tokens.spacingElement2),\n backgroundColor: \"transparent\",\n ...shorthands.borderStyle(\"none\"),\n ...shorthands.borderWidth(0),\n ...shorthands.borderRadius(tokens.radiusLg),\n cursor: \"pointer\",\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n transitionProperty: \"all\",\n transitionDuration: \"150ms\",\n transitionTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n \":focus-visible\": {\n outlineWidth: \"2px\",\n outlineOffset: \"2px\",\n outlineStyle: \"solid\",\n },\n \"&[data-orientation='vertical']\": {\n justifyContent: \"flex-start\",\n textAlign: \"left\",\n width: \"100%\",\n },\n },\n // Sizes\n sm: {\n ...shorthands.padding(\"0.375rem\", tokens.spacingElement2),\n },\n base: {\n ...shorthands.padding(tokens.spacingElement2, tokens.spacingElement3),\n },\n lg: {\n ...shorthands.padding(tokens.spacingElement3, tokens.spacingGroup2),\n },\n // Variants\n defaultVariant: {\n color: tokens.grayA12,\n \":hover\": {\n backgroundColor: tokens.grayA4,\n },\n \":focus-visible\": {\n outlineColor: tokens.grayA8,\n },\n \"&[data-state='active']\": {\n backgroundColor: tokens.grayA3,\n },\n },\n highlightVariant: {\n color: tokens.accentA12,\n \":hover\": {\n backgroundColor: tokens.accentA4,\n },\n \":focus-visible\": {\n outlineColor: tokens.accentA8,\n },\n \"&[data-state='active']\": {\n backgroundColor: tokens.accentA3,\n },\n },\n destructiveVariant: {\n color: tokens.errorA11,\n \":hover\": {\n backgroundColor: tokens.errorA4,\n },\n \":focus-visible\": {\n outlineColor: tokens.errorA8,\n },\n \"&[data-state='active']\": {\n backgroundColor: tokens.errorA3,\n },\n },\n content: {\n flexGrow: 1,\n flexShrink: 1,\n flexBasis: \"0%\",\n outlineStyle: \"none\",\n },\n})\n\nexport type TabsProps = React.ComponentProps<typeof TabsPrimitive.Root> & {\n size?: TabsSize\n variant?: TabsRootVariant\n}\n\nexport const Tabs = React.forwardRef<\n React.ComponentRef<typeof TabsPrimitive.Root>,\n TabsProps\n>(function Tabs(\n { className, size = \"base\", variant = \"default\", ...props },\n ref\n) {\n const styles = useStyles()\n const contextValue = React.useMemo(() => ({ size, variant }), [size, variant])\n\n return (\n <TabsContext.Provider value={contextValue}>\n <TabsPrimitive.Root\n ref={ref}\n data-slot=\"tabs\"\n {...{ [SLOT_ATTR]: \"tabs\" }}\n data-size={size}\n data-variant={variant}\n className={mergeClasses(styles.root, className)}\n {...props}\n />\n </TabsContext.Provider>\n )\n})\n\nexport type TabsListProps = React.ComponentProps<typeof TabsPrimitive.List>\n\nexport const TabsList = React.forwardRef<\n React.ComponentRef<typeof TabsPrimitive.List>,\n TabsListProps\n>(function TabsList({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <TabsPrimitive.List\n ref={ref}\n data-slot=\"tabs-list\"\n {...{ [SLOT_ATTR]: \"tabs-list\" }}\n className={mergeClasses(styles.list, className)}\n {...props}\n />\n )\n})\n\nexport type TabsTriggerProps = React.ComponentProps<\n typeof TabsPrimitive.Trigger\n> & {\n variant?: TabsTriggerVariant\n}\n\nexport const TabsTrigger = React.forwardRef<\n React.ComponentRef<typeof TabsPrimitive.Trigger>,\n TabsTriggerProps\n>(function TabsTrigger({ className, variant = \"default\", ...props }, ref) {\n const styles = useStyles()\n const { size, variant: rootVariant } = React.useContext(TabsContext)\n\n const resolvedVariantClass =\n variant === \"destructive\"\n ? styles.destructiveVariant\n : rootVariant === \"highlight\"\n ? styles.highlightVariant\n : styles.defaultVariant\n\n return (\n <TabsPrimitive.Trigger\n ref={ref}\n data-slot=\"tabs-trigger\"\n {...{ [SLOT_ATTR]: \"tabs-trigger\" }}\n className={mergeClasses(\n styles.trigger,\n styles[size],\n resolvedVariantClass,\n className\n )}\n {...props}\n />\n )\n})\n\nexport type TabsContentProps = React.ComponentProps<\n typeof TabsPrimitive.Content\n>\n\nexport const TabsContent = React.forwardRef<\n React.ComponentRef<typeof TabsPrimitive.Content>,\n TabsContentProps\n>(function TabsContent({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <TabsPrimitive.Content\n ref={ref}\n data-slot=\"tabs-content\"\n {...{ [SLOT_ATTR]: \"tabs-content\" }}\n className={mergeClasses(styles.content, className)}\n {...props}\n />\n )\n})\n"],"names":["TabsContext","React","useStyles","makeZenithStyles","shorthands","tokens.spacingElement2","tokens.grayA12","tokens.radiusLg","tokens.spacingElement1","tokens.textSm","tokens.leadingSm","tokens.spacingElement3","tokens.spacingGroup2","tokens.grayA4","tokens.grayA8","tokens.grayA3","tokens.accentA12","tokens.accentA4","tokens.accentA8","tokens.accentA3","tokens.errorA11","tokens.errorA4","tokens.errorA8","tokens.errorA3","Tabs","className","size","variant","props","ref","styles","contextValue","jsx","TabsPrimitive.Root","SLOT_ATTR","mergeClasses","TabsList","TabsPrimitive.List","TabsTrigger","rootVariant","resolvedVariantClass","TabsPrimitive.Trigger","TabsContent","TabsPrimitive.Content"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"tabs.js","sources":["../../../src/components/tabs/tabs.tsx"],"sourcesContent":["import * as React from \"react\"\nimport * as TabsPrimitive from \"@radix-ui/react-tabs\"\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\nexport type TabsSize = \"sm\" | \"base\" | \"lg\"\nexport type TabsRootVariant = \"default\" | \"highlight\"\nexport type TabsTriggerVariant = \"default\" | \"destructive\"\n\ntype TabsContextValue = {\n size: TabsSize\n variant: TabsRootVariant\n /** Selects a tab. Absent when a trigger renders outside `Tabs`. */\n select?: (value: string) => void\n /** Marks the start of a pointer press on a trigger; see `beginPress` in `Tabs`. */\n beginPress?: (value: string) => void\n}\n\nconst TabsContext = React.createContext<TabsContextValue>({\n size: \"base\",\n variant: \"default\",\n})\n\nconst useStyles = makeZenithStyles({\n root: {\n display: \"flex\",\n flexDirection: \"column\",\n ...shorthands.gap(tokens.spacingElement2),\n \"&[data-orientation='vertical']\": {\n flexDirection: \"row\",\n alignItems: \"flex-start\",\n ...shorthands.gap(tokens.spacingElement2),\n },\n },\n list: {\n backgroundColor: \"transparent\",\n color: tokens.grayA12,\n height: \"auto\",\n display: \"inline-flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n ...shorthands.gap(tokens.spacingElement2),\n ...shorthands.borderRadius(tokens.radiusLg),\n ...shorthands.paddingBlock(tokens.spacingElement2),\n \"&[data-orientation='vertical']\": {\n flexDirection: \"column\",\n alignItems: \"stretch\",\n justifyContent: \"flex-start\",\n ...shorthands.gap(tokens.spacingElement1),\n ...shorthands.paddingBlock(0),\n },\n },\n trigger: {\n display: \"inline-flex\",\n alignItems: \"center\",\n ...shorthands.gap(tokens.spacingElement2),\n backgroundColor: \"transparent\",\n ...shorthands.borderStyle(\"none\"),\n ...shorthands.borderWidth(0),\n ...shorthands.borderRadius(tokens.radiusLg),\n cursor: \"pointer\",\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n transitionProperty: \"all\",\n transitionDuration: \"150ms\",\n transitionTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n \":focus-visible\": {\n outlineWidth: \"2px\",\n outlineOffset: \"2px\",\n outlineStyle: \"solid\",\n },\n \"&[data-orientation='vertical']\": {\n justifyContent: \"flex-start\",\n textAlign: \"left\",\n width: \"100%\",\n },\n },\n // Sizes\n sm: {\n ...shorthands.padding(\"0.375rem\", tokens.spacingElement2),\n },\n base: {\n ...shorthands.padding(tokens.spacingElement2, tokens.spacingElement3),\n },\n lg: {\n ...shorthands.padding(tokens.spacingElement3, tokens.spacingGroup2),\n },\n // Variants\n defaultVariant: {\n color: tokens.grayA12,\n \":hover\": {\n backgroundColor: tokens.grayA4,\n },\n \":focus-visible\": {\n outlineColor: tokens.grayA8,\n },\n \"&[data-state='active']\": {\n backgroundColor: tokens.grayA3,\n },\n },\n highlightVariant: {\n color: tokens.accentA12,\n \":hover\": {\n backgroundColor: tokens.accentA4,\n },\n \":focus-visible\": {\n outlineColor: tokens.accentA8,\n },\n \"&[data-state='active']\": {\n backgroundColor: tokens.accentA3,\n },\n },\n destructiveVariant: {\n color: tokens.errorA11,\n \":hover\": {\n backgroundColor: tokens.errorA4,\n },\n \":focus-visible\": {\n outlineColor: tokens.errorA8,\n },\n \"&[data-state='active']\": {\n backgroundColor: tokens.errorA3,\n },\n },\n content: {\n flexGrow: 1,\n flexShrink: 1,\n flexBasis: \"0%\",\n outlineStyle: \"none\",\n },\n})\n\nexport type TabsProps = React.ComponentProps<typeof TabsPrimitive.Root> & {\n size?: TabsSize\n variant?: TabsRootVariant\n}\n\nexport const Tabs = React.forwardRef<\n React.ComponentRef<typeof TabsPrimitive.Root>,\n TabsProps\n>(function Tabs(\n {\n className,\n size = \"base\",\n variant = \"default\",\n value: valueProp,\n defaultValue,\n onValueChange,\n ...props\n },\n ref\n) {\n const styles = useStyles()\n\n // Zenith owns the value so a trigger can select on click, which Radix does not do (it selects on\n // mousedown, Enter/Space and focus). Radix always receives it controlled; \"\" selects nothing,\n // which is what an uncontrolled Root without a defaultValue shows.\n const [uncontrolled, setUncontrolled] = React.useState(defaultValue)\n const isControlled = valueProp !== undefined\n const value = (isControlled ? valueProp : uncontrolled) ?? \"\"\n const latest = React.useRef({ value, isControlled, onValueChange })\n latest.current = { value, isControlled, onValueChange }\n\n // One pointer press on a trigger can reach `select` twice for the same tab: Radix selects on\n // mousedown, then again on the focus that press causes if the tab is still unselected, which it\n // is when a controlled owner declined (#17; unchanged through Radix Tabs 1.2.1). A press opens a\n // window in which only the first report for its tab goes through. Mousedown and the focus it\n // causes run in one task, so the window closes on the next one and a later focus is reported.\n const press = React.useRef<{ value: string; reported: boolean } | null>(null)\n const beginPress = React.useCallback((pressed: string) => {\n const token = { value: pressed, reported: false }\n press.current = token\n setTimeout(() => {\n if (press.current === token) press.current = null\n }, 0)\n }, [])\n\n const select = React.useCallback((next: string) => {\n const current = latest.current\n const pressed = press.current\n if (pressed !== null && pressed.value === next) {\n if (pressed.reported) return\n pressed.reported = true\n }\n if (next === current.value) return\n if (!current.isControlled) setUncontrolled(next)\n current.onValueChange?.(next)\n }, [])\n\n const contextValue = React.useMemo(\n () => ({ size, variant, select, beginPress }),\n [size, variant, select, beginPress]\n )\n\n return (\n <TabsContext.Provider value={contextValue}>\n <TabsPrimitive.Root\n ref={ref}\n data-slot=\"tabs\"\n {...{ [SLOT_ATTR]: \"tabs\" }}\n data-size={size}\n data-variant={variant}\n className={mergeClasses(styles.root, className)}\n {...props}\n value={value}\n onValueChange={select}\n />\n </TabsContext.Provider>\n )\n})\n\nexport type TabsListProps = React.ComponentProps<typeof TabsPrimitive.List>\n\nexport const TabsList = React.forwardRef<\n React.ComponentRef<typeof TabsPrimitive.List>,\n TabsListProps\n>(function TabsList({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <TabsPrimitive.List\n ref={ref}\n data-slot=\"tabs-list\"\n {...{ [SLOT_ATTR]: \"tabs-list\" }}\n className={mergeClasses(styles.list, className)}\n {...props}\n />\n )\n})\n\nexport type TabsTriggerProps = React.ComponentProps<\n typeof TabsPrimitive.Trigger\n> & {\n variant?: TabsTriggerVariant\n}\n\nexport const TabsTrigger = React.forwardRef<\n React.ComponentRef<typeof TabsPrimitive.Trigger>,\n TabsTriggerProps\n>(function TabsTrigger(\n {\n className,\n variant = \"default\",\n onClick,\n onKeyDown,\n onBlur,\n onMouseDown,\n ...props\n },\n ref\n) {\n const styles = useStyles()\n const {\n size,\n variant: rootVariant,\n select,\n beginPress,\n } = React.useContext(TabsContext)\n\n // Runs before Radix's own mousedown handler, under the same conditions Radix selects on.\n const handleMouseDown: TabsTriggerProps[\"onMouseDown\"] = (event) => {\n onMouseDown?.(event)\n if (\n !event.defaultPrevented &&\n event.button === 0 &&\n !event.ctrlKey &&\n !props.disabled\n ) {\n beginPress?.(props.value)\n }\n }\n\n // Radix has already selected on the key that synthesises this click; selecting again would\n // report the change twice to an owner that declined it.\n const keyActivated = React.useRef(false)\n\n const handleKeyDown: TabsTriggerProps[\"onKeyDown\"] = (event) => {\n onKeyDown?.(event)\n // Only a key Radix acted on synthesises a click. A prevented one skips Radix and produces no\n // click, so flagging it would leave nothing to clear the flag and swallow the next bare click.\n keyActivated.current =\n !event.defaultPrevented && (event.key === \"Enter\" || event.key === \" \")\n }\n\n const handleBlur: TabsTriggerProps[\"onBlur\"] = (event) => {\n onBlur?.(event)\n keyActivated.current = false\n }\n\n // A click with no mousedown before it — `element.click()`, assistive technology, automation —\n // reaches none of Radix's handlers. `detail` is 0 for exactly those clicks; a pointer click\n // carries its count and was already handled, or deliberately refused, on mousedown.\n const handleClick: TabsTriggerProps[\"onClick\"] = (event) => {\n onClick?.(event)\n const fromKey = keyActivated.current\n keyActivated.current = false\n if (\n fromKey ||\n event.detail !== 0 ||\n event.defaultPrevented ||\n event.ctrlKey ||\n props.disabled\n ) {\n return\n }\n select?.(props.value)\n }\n\n const resolvedVariantClass =\n variant === \"destructive\"\n ? styles.destructiveVariant\n : rootVariant === \"highlight\"\n ? styles.highlightVariant\n : styles.defaultVariant\n\n return (\n <TabsPrimitive.Trigger\n ref={ref}\n data-slot=\"tabs-trigger\"\n {...{ [SLOT_ATTR]: \"tabs-trigger\" }}\n className={mergeClasses(\n styles.trigger,\n styles[size],\n resolvedVariantClass,\n className\n )}\n {...props}\n onClick={handleClick}\n onKeyDown={handleKeyDown}\n onBlur={handleBlur}\n onMouseDown={handleMouseDown}\n />\n )\n})\n\nexport type TabsContentProps = React.ComponentProps<\n typeof TabsPrimitive.Content\n>\n\nexport const TabsContent = React.forwardRef<\n React.ComponentRef<typeof TabsPrimitive.Content>,\n TabsContentProps\n>(function TabsContent({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <TabsPrimitive.Content\n ref={ref}\n data-slot=\"tabs-content\"\n {...{ [SLOT_ATTR]: \"tabs-content\" }}\n className={mergeClasses(styles.content, className)}\n {...props}\n />\n )\n})\n"],"names":["TabsContext","React","useStyles","makeZenithStyles","shorthands","tokens.spacingElement2","tokens.grayA12","tokens.radiusLg","tokens.spacingElement1","tokens.textSm","tokens.leadingSm","tokens.spacingElement3","tokens.spacingGroup2","tokens.grayA4","tokens.grayA8","tokens.grayA3","tokens.accentA12","tokens.accentA4","tokens.accentA8","tokens.accentA3","tokens.errorA11","tokens.errorA4","tokens.errorA8","tokens.errorA3","Tabs","className","size","variant","valueProp","defaultValue","onValueChange","props","ref","styles","uncontrolled","setUncontrolled","isControlled","value","latest","press","beginPress","pressed","token","select","next","current","_a","contextValue","jsx","TabsPrimitive.Root","SLOT_ATTR","mergeClasses","TabsList","TabsPrimitive.List","TabsTrigger","onClick","onKeyDown","onBlur","onMouseDown","rootVariant","handleMouseDown","event","keyActivated","handleKeyDown","handleBlur","handleClick","fromKey","resolvedVariantClass","TabsPrimitive.Trigger","TabsContent","TabsPrimitive.Content"],"mappings":"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"}
|
package/dist/index.d.ts
CHANGED
|
@@ -4565,6 +4565,11 @@ declare const DialogOverlay: React.ForwardRefExoticComponent<Omit<DialogOverlayP
|
|
|
4565
4565
|
type DialogContentSize = "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | "4xl" | "5xl" | "full-width";
|
|
4566
4566
|
type DialogContentProps = React.ComponentProps<typeof Content$7> & {
|
|
4567
4567
|
showCloseButton?: boolean;
|
|
4568
|
+
/**
|
|
4569
|
+
* Accessible name of the built-in close button, read by screen readers. Pass a translated
|
|
4570
|
+
* string for any locale other than English. Defaults to "Close".
|
|
4571
|
+
*/
|
|
4572
|
+
closeButtonLabel?: string;
|
|
4568
4573
|
size?: DialogContentSize;
|
|
4569
4574
|
flush?: boolean;
|
|
4570
4575
|
};
|
|
@@ -4591,6 +4596,11 @@ declare const DrawerOverlay: React.ForwardRefExoticComponent<Omit<DialogOverlayP
|
|
|
4591
4596
|
type DrawerSide = "left" | "right" | "top" | "bottom";
|
|
4592
4597
|
type DrawerContentProps = React.ComponentProps<typeof Content$7> & {
|
|
4593
4598
|
showCloseButton?: boolean;
|
|
4599
|
+
/**
|
|
4600
|
+
* Accessible name of the built-in close button, read by screen readers. Pass a translated
|
|
4601
|
+
* string for any locale other than English. Defaults to "Close".
|
|
4602
|
+
*/
|
|
4603
|
+
closeButtonLabel?: string;
|
|
4594
4604
|
side?: DrawerSide;
|
|
4595
4605
|
flush?: boolean;
|
|
4596
4606
|
};
|
package/dist/tokens.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"$comment": "GENERATED. Design token values for consumers that do not render this package's React components. Compile these into your own CSS under your own names at your own build time; do not reference this package's runtime custom properties, whose names are content-hashed and change with their values. `themes.light`/`themes.dark` are mode-resolved; `densities.compact`/`densities.normal`/`densities.comfortable` resolve the component layer's geometry tokens (WP9A-ACCEPTANCE-WP9B1) and carry no mode of their own — do not read a value out of `themes` for a key that only exists under `densities`, or the reverse. This file is copied verbatim to this package's public `tokens.json` export (`package.json`'s `build` script, `cp src/generated/values.generated.json dist/tokens.json`).",
|
|
3
3
|
"package": "@epilot/zenith-react",
|
|
4
|
-
"version": "0.
|
|
4
|
+
"version": "0.2.0-next.0",
|
|
5
5
|
"themes": {
|
|
6
6
|
"light": {
|
|
7
7
|
"accent-1": "#fcfdfe",
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@epilot/zenith-react",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.2.0-next.0",
|
|
4
4
|
"description": "Zenith React components, styled with Griffel and designed for isolated micro-frontend delivery",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"repository": {
|
|
@@ -73,7 +73,7 @@
|
|
|
73
73
|
"verify:consumer": "bun ../../scripts/verify-packed-consumer.ts"
|
|
74
74
|
},
|
|
75
75
|
"dependencies": {
|
|
76
|
-
"@epilot/zenith-runtime": "0.
|
|
76
|
+
"@epilot/zenith-runtime": "0.2.0-next.0"
|
|
77
77
|
},
|
|
78
78
|
"peerDependencies": {
|
|
79
79
|
"react": ">=18",
|
|
@@ -83,7 +83,7 @@
|
|
|
83
83
|
"@dnd-kit/core": "6.3.1",
|
|
84
84
|
"@dnd-kit/sortable": "10.0.0",
|
|
85
85
|
"@dnd-kit/utilities": "3.2.2",
|
|
86
|
-
"@epilot/zenith-tokens": "0.
|
|
86
|
+
"@epilot/zenith-tokens": "0.2.0-next.0",
|
|
87
87
|
"@radix-ui/react-accordion": "1.2.12",
|
|
88
88
|
"@radix-ui/react-alert-dialog": "1.1.15",
|
|
89
89
|
"@radix-ui/react-avatar": "1.1.10",
|