@epilot/zenith-react 0.1.0-next.0 → 0.1.0-next.1
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 +61 -16
- package/dist/components/appearance-boundary/appearance-boundary.js.map +1 -1
- package/dist/components/badge/badge.js.map +1 -1
- package/dist/components/breadcrumb/breadcrumb.js.map +1 -1
- package/dist/components/button-group/button-group.js.map +1 -1
- package/dist/components/callout/callout.js.map +1 -1
- package/dist/components/card/card.js.map +1 -1
- package/dist/components/code-editor/code-editor.js.map +1 -1
- package/dist/components/code-editor/indent.js.map +1 -1
- package/dist/components/command/command.js +1 -7
- package/dist/components/command/command.js.map +1 -1
- package/dist/components/date-range-picker/date-range-picker.js +3 -8
- package/dist/components/date-range-picker/date-range-picker.js.map +1 -1
- package/dist/components/date-time-picker/time-picker.js.map +1 -1
- package/dist/components/density-provider/density-provider.js.map +1 -1
- package/dist/components/field/field.js.map +1 -1
- package/dist/components/label/label.js +0 -28
- package/dist/components/label/label.js.map +1 -1
- package/dist/components/list/list.js +2 -12
- package/dist/components/list/list.js.map +1 -1
- package/dist/components/pill/pill.js.map +1 -1
- package/dist/components/separator/separator.js.map +1 -1
- package/dist/components/skeleton/skeleton.js.map +1 -1
- package/dist/components/slot/compose-as-child.js.map +1 -1
- package/dist/components/spinner/spinner.js.map +1 -1
- package/dist/components/switch/switch.js.map +1 -1
- package/dist/components/table/table.js.map +1 -1
- package/dist/components/text/text.js.map +1 -1
- package/dist/components/toast/toast.js +4 -6
- package/dist/components/toast/toast.js.map +1 -1
- package/dist/delivery/index.d.ts +10 -44
- package/dist/delivery/index.js +5 -9
- package/dist/index.d.ts +69 -410
- package/dist/lib/clear-button.js.map +1 -1
- package/dist/lib/code-highlight.js.map +1 -1
- package/dist/lib/code-tokens.js.map +1 -1
- package/dist/lib/pagination.js.map +1 -1
- package/dist/packages/tokens/dist/delivery/index.js +18 -48
- package/dist/packages/tokens/dist/delivery/index.js.map +1 -1
- package/dist/{token-assets/core/5cd4072decf5df2a664f0b1d5f2ec250a3309101ded3056c1f87c8bbe3738d50.css → packages/tokens/dist/generated/core.generated.js} +8 -3
- package/dist/packages/tokens/dist/generated/core.generated.js.map +1 -0
- package/dist/packages/tokens/dist/install.js +4 -4
- package/dist/packages/tokens/dist/install.js.map +1 -1
- package/dist/styles/document-context.js.map +1 -1
- package/dist/styles/make-styles.js.map +1 -1
- package/dist/tokens/core.meta.generated.js.map +1 -1
- package/dist/tokens/use-palette-tokens.js.map +1 -1
- package/dist/tokens.json +1 -1
- package/package.json +3 -4
- package/scripts/migration-diagnostics-core.mjs +19 -90
- package/scripts/migration-diagnostics.mjs +1 -16
- package/scripts/migration-sweep.mjs +2 -12
- package/ADOPTING.md +0 -73
- package/dist/packages/tokens/dist/delivery/internal.js +0 -181
- package/dist/packages/tokens/dist/delivery/internal.js.map +0 -1
- package/dist/packages/tokens/dist/generated/core.meta.generated.js +0 -10
- package/dist/packages/tokens/dist/generated/core.meta.generated.js.map +0 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"time-picker.js","sources":["../../../src/components/date-time-picker/time-picker.tsx"],"sourcesContent":["import * as React from \"react\"\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\nimport {\n getHours,\n getMinutes,\n padNumber,\n updateTime,\n} from \"./date-time-picker-utils\"\n\nconst HOURS = Array.from({ length: 24 }, (_, i) => i)\n\nexport type TimePickerProps = {\n value: Date | null\n onChange: (date: Date) => void\n onTimeSelect?: () => void\n disablePast?: boolean\n currentTimeInTimezone?: Date\n fillHeight?: boolean\n minuteStep?: number\n className?: string\n /**\n * Accessible name for the hours column. Pass a translated string.\n *\n * These are ACCESSIBLE NAMES, not visible headers, and the distinction is deliberate. v1 ≤1.3.x\n * had `hoursLabel`/`minutesLabel` that rendered visible \"HH\"/\"MM\" headings; v1 deleted them in\n * `138fe05` (2026-06-25) and this package mirrors v1's current output, which Rule 0 makes the\n * fidelity target. But v1 replaced them with nothing, so both libraries now hand a screen reader\n * two unnamed columns of bare numbers. Naming them via `aria-label` closes that without moving a\n * pixel — the VR gate still matches v1 specimen for specimen.\n */\n hoursLabel?: string\n /** Accessible name for the minutes column. Pass a translated string. See `hoursLabel`. */\n minutesLabel?: string\n}\n\nconst useStyles = makeZenithStyles({\n root: {\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"stretch\",\n justifyContent: \"center\",\n ...shorthands.gap(tokens.spacingElement1),\n },\n fillHeight: {\n height: \"100%\",\n },\n column: {\n display: \"flex\",\n flexDirection: \"column\",\n alignItems: \"center\",\n width: \"3.5rem\",\n },\n columnFillHeight: {\n minHeight: \"0\",\n },\n scroll: {\n display: \"flex\",\n flexDirection: \"column\",\n overflowY: \"auto\",\n overflowX: \"hidden\",\n width: \"100%\",\n alignItems: \"center\",\n ...shorthands.borderRadius(tokens.radiusMd),\n ...shorthands.border(\"1px\", \"solid\", tokens.grayA5),\n scrollbarWidth: \"thin\",\n scrollbarColor: `${tokens.grayA6} transparent`,\n },\n scrollFixed: {\n height: \"8rem\",\n },\n scrollFill: {\n flexGrow: 1,\n flexShrink: 1,\n flexBasis: \"0%\",\n minHeight: \"0\",\n },\n separator: {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n fontSize: tokens.textBase,\n lineHeight: tokens.leadingBase,\n fontWeight: tokens.fontWeightSemibold,\n color: tokens.grayA8,\n },\n timeBtn: {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n ...shorthands.borderRadius(tokens.radiusMd),\n transitionProperty: \"background-color, color\",\n transitionDuration: \"150ms\",\n minHeight: \"2rem\",\n width: \"100%\",\n maxWidth: \"3rem\",\n ...shorthands.border(\"0\"),\n outlineStyle: \"none\",\n },\n timeBtnDefault: {\n backgroundColor: \"transparent\",\n color: tokens.grayA11,\n \":hover\": {\n backgroundColor: tokens.grayA4,\n },\n },\n timeBtnSelected: {\n fontWeight: tokens.fontWeightSemibold,\n backgroundColor: tokens.semAccentSolid,\n color: tokens.semAccentContrast,\n \":hover\": {\n backgroundColor: tokens.semAccentSolidHover,\n },\n },\n timeBtnDisabled: {\n cursor: \"not-allowed\",\n opacity: 0.5,\n },\n timeBtnEnabled: {\n cursor: \"pointer\",\n },\n})\n\ntype TimeButtonProps = {\n value: number\n isSelected: boolean\n isDisabled: boolean\n onClick: (value: number) => void\n}\n\nconst TimeButton = React.memo(function TimeButton({\n value,\n isSelected,\n isDisabled,\n onClick,\n}: TimeButtonProps) {\n const styles = useStyles()\n const handleClick = React.useCallback(() => {\n if (!isDisabled) {\n onClick(value)\n }\n }, [onClick, value, isDisabled])\n\n return (\n <button\n aria-disabled={isDisabled}\n aria-pressed={isSelected}\n className={mergeClasses(\n styles.timeBtn,\n !isSelected && styles.timeBtnDefault,\n isSelected && styles.timeBtnSelected,\n isDisabled ? styles.timeBtnDisabled : styles.timeBtnEnabled\n )}\n data-selected={isSelected}\n data-slot=\"time-button\"\n {...{ [SLOT_ATTR]: \"time-button\" }}\n data-value={value}\n disabled={isDisabled}\n onClick={handleClick}\n type=\"button\"\n >\n {padNumber(value)}\n </button>\n )\n})\n\nTimeButton.displayName = \"TimeButton\"\n\nexport const TimePicker = React.forwardRef<HTMLDivElement, TimePickerProps>(\n function TimePicker(\n {\n value,\n onChange,\n onTimeSelect,\n disablePast = false,\n currentTimeInTimezone,\n fillHeight = false,\n minuteStep = 1,\n className,\n hoursLabel = \"Hours\",\n minutesLabel = \"Minutes\",\n },\n ref\n ) {\n const styles = useStyles()\n const step = Math.max(1, Math.floor(minuteStep))\n\n // Enumerate buckets 0, step, 2·step… stopping at <60 so a step that\n // doesn't divide 60 evenly (e.g. 7) can never produce an out-of-range\n // value like 63.\n const MINUTES = React.useMemo(() => {\n const buckets: number[] = []\n for (let m = 0; m < 60; m += step) buckets.push(m)\n\n return buckets\n }, [step])\n\n const selectedHour = value !== null ? getHours(value) : -1\n const rawMinute = value !== null ? getMinutes(value) : -1\n const selectedMinute =\n value === null\n ? -1\n : step === 1\n ? rawMinute\n : Math.min(\n MINUTES[MINUTES.length - 1],\n Math.round(rawMinute / step) * step\n )\n\n const hoursRef = React.useRef<HTMLDivElement>(null)\n const minutesRef = React.useRef<HTMLDivElement>(null)\n\n const now = React.useMemo(\n () => currentTimeInTimezone || new Date(),\n [currentTimeInTimezone]\n )\n const isToday = React.useMemo(() => {\n if (!value) return false\n\n return (\n value.getFullYear() === now.getFullYear() &&\n value.getMonth() === now.getMonth() &&\n value.getDate() === now.getDate()\n )\n }, [value, now])\n\n const currentHour = now.getHours()\n const currentMinute = now.getMinutes()\n\n const isHourDisabled = React.useCallback(\n (hour: number) => {\n if (!disablePast || !isToday) return false\n\n return hour < currentHour\n },\n [disablePast, isToday, currentHour]\n )\n\n const isMinuteDisabled = React.useCallback(\n (minute: number) => {\n if (!disablePast || !isToday) return false\n if (selectedHour < currentHour) return true\n if (selectedHour === currentHour) return minute < currentMinute\n\n return false\n },\n [disablePast, isToday, selectedHour, currentHour, currentMinute]\n )\n\n const handleHourChange = React.useCallback(\n (hour: number) => {\n const base = value || now\n const minute = selectedMinute >= 0 ? selectedMinute : 0\n\n onChange(updateTime(base, hour, minute))\n },\n [onChange, value, now, selectedMinute]\n )\n\n const handleMinuteChange = React.useCallback(\n (minute: number) => {\n const base = value || now\n const hour = selectedHour >= 0 ? selectedHour : 0\n\n onChange(updateTime(base, hour, minute))\n onTimeSelect?.()\n },\n [onChange, onTimeSelect, value, now, selectedHour]\n )\n\n React.useEffect(() => {\n if (hoursRef.current) {\n const selectedElement = hoursRef.current.querySelector(\n `[data-value=\"${selectedHour}\"]`\n )\n\n if (selectedElement) {\n selectedElement.scrollIntoView?.({\n block: \"center\",\n behavior: \"auto\",\n })\n }\n }\n if (minutesRef.current) {\n const selectedElement = minutesRef.current.querySelector(\n `[data-value=\"${selectedMinute}\"]`\n )\n\n if (selectedElement) {\n selectedElement.scrollIntoView?.({\n block: \"center\",\n behavior: \"auto\",\n })\n }\n }\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n return (\n <div\n ref={ref}\n className={mergeClasses(\n styles.root,\n fillHeight && styles.fillHeight,\n className\n )}\n data-slot=\"timepicker\"\n {...{ [SLOT_ATTR]: \"timepicker\" }}\n >\n <div\n className={mergeClasses(\n styles.column,\n fillHeight && styles.columnFillHeight\n )}\n >\n <div\n className={mergeClasses(\n styles.scroll,\n fillHeight ? styles.scrollFill : styles.scrollFixed\n )}\n aria-label={hoursLabel}\n data-slot=\"timepicker-scroll\"\n role=\"group\"\n {...{ [SLOT_ATTR]: \"timepicker-scroll\" }}\n ref={hoursRef}\n >\n {HOURS.map((hour) => (\n <TimeButton\n isDisabled={isHourDisabled(hour)}\n isSelected={hour === selectedHour}\n key={hour}\n onClick={handleHourChange}\n value={hour}\n />\n ))}\n </div>\n </div>\n\n <div className={styles.separator}>:</div>\n\n <div\n className={mergeClasses(\n styles.column,\n fillHeight && styles.columnFillHeight\n )}\n >\n <div\n className={mergeClasses(\n styles.scroll,\n fillHeight ? styles.scrollFill : styles.scrollFixed\n )}\n aria-label={minutesLabel}\n data-slot=\"timepicker-scroll\"\n role=\"group\"\n {...{ [SLOT_ATTR]: \"timepicker-scroll\" }}\n ref={minutesRef}\n >\n {MINUTES.map((minute) => (\n <TimeButton\n isDisabled={isMinuteDisabled(minute)}\n isSelected={minute === selectedMinute}\n key={minute}\n onClick={handleMinuteChange}\n value={minute}\n />\n ))}\n </div>\n </div>\n </div>\n )\n }\n)\n"],"names":["HOURS","_","i","useStyles","makeZenithStyles","shorthands","tokens.spacingElement1","tokens.radiusMd","tokens.grayA5","tokens.grayA6","tokens.textBase","tokens.leadingBase","tokens.fontWeightSemibold","tokens.grayA8","tokens.textSm","tokens.leadingSm","tokens.grayA11","tokens.grayA4","tokens.semAccentSolid","tokens.semAccentContrast","tokens.semAccentSolidHover","TimeButton","React","value","isSelected","isDisabled","onClick","styles","handleClick","jsx","mergeClasses","SLOT_ATTR","TimePicker","onChange","onTimeSelect","disablePast","currentTimeInTimezone","fillHeight","minuteStep","className","hoursLabel","minutesLabel","ref","step","MINUTES","buckets","m","selectedHour","getHours","rawMinute","getMinutes","selectedMinute","hoursRef","minutesRef","now","isToday","currentHour","currentMinute","isHourDisabled","hour","isMinuteDisabled","minute","handleHourChange","base","updateTime","handleMinuteChange","selectedElement","_a","_b","jsxs"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"time-picker.js","sources":["../../../src/components/date-time-picker/time-picker.tsx"],"sourcesContent":["import * as React from \"react\"\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\nimport {\n getHours,\n getMinutes,\n padNumber,\n updateTime,\n} from \"./date-time-picker-utils\"\n\nconst HOURS = Array.from({ length: 24 }, (_, i) => i)\n\nexport type TimePickerProps = {\n value: Date | null\n onChange: (date: Date) => void\n onTimeSelect?: () => void\n disablePast?: boolean\n currentTimeInTimezone?: Date\n fillHeight?: boolean\n minuteStep?: number\n className?: string\n /**\n * Accessible name for the hours column. Pass a translated string. These are ACCESSIBLE NAMES,\n * not visible headers, and the distinction is deliberate.\n */\n hoursLabel?: string\n /** Accessible name for the minutes column. Pass a translated string. See `hoursLabel`. */\n minutesLabel?: string\n}\n\nconst useStyles = makeZenithStyles({\n root: {\n display: \"flex\",\n flexDirection: \"row\",\n alignItems: \"stretch\",\n justifyContent: \"center\",\n ...shorthands.gap(tokens.spacingElement1),\n },\n fillHeight: {\n height: \"100%\",\n },\n column: {\n display: \"flex\",\n flexDirection: \"column\",\n alignItems: \"center\",\n width: \"3.5rem\",\n },\n columnFillHeight: {\n minHeight: \"0\",\n },\n scroll: {\n display: \"flex\",\n flexDirection: \"column\",\n overflowY: \"auto\",\n overflowX: \"hidden\",\n width: \"100%\",\n alignItems: \"center\",\n ...shorthands.borderRadius(tokens.radiusMd),\n ...shorthands.border(\"1px\", \"solid\", tokens.grayA5),\n scrollbarWidth: \"thin\",\n scrollbarColor: `${tokens.grayA6} transparent`,\n },\n scrollFixed: {\n height: \"8rem\",\n },\n scrollFill: {\n flexGrow: 1,\n flexShrink: 1,\n flexBasis: \"0%\",\n minHeight: \"0\",\n },\n separator: {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n fontSize: tokens.textBase,\n lineHeight: tokens.leadingBase,\n fontWeight: tokens.fontWeightSemibold,\n color: tokens.grayA8,\n },\n timeBtn: {\n display: \"flex\",\n alignItems: \"center\",\n justifyContent: \"center\",\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n ...shorthands.borderRadius(tokens.radiusMd),\n transitionProperty: \"background-color, color\",\n transitionDuration: \"150ms\",\n minHeight: \"2rem\",\n width: \"100%\",\n maxWidth: \"3rem\",\n ...shorthands.border(\"0\"),\n outlineStyle: \"none\",\n },\n timeBtnDefault: {\n backgroundColor: \"transparent\",\n color: tokens.grayA11,\n \":hover\": {\n backgroundColor: tokens.grayA4,\n },\n },\n timeBtnSelected: {\n fontWeight: tokens.fontWeightSemibold,\n backgroundColor: tokens.semAccentSolid,\n color: tokens.semAccentContrast,\n \":hover\": {\n backgroundColor: tokens.semAccentSolidHover,\n },\n },\n timeBtnDisabled: {\n cursor: \"not-allowed\",\n opacity: 0.5,\n },\n timeBtnEnabled: {\n cursor: \"pointer\",\n },\n})\n\ntype TimeButtonProps = {\n value: number\n isSelected: boolean\n isDisabled: boolean\n onClick: (value: number) => void\n}\n\nconst TimeButton = React.memo(function TimeButton({\n value,\n isSelected,\n isDisabled,\n onClick,\n}: TimeButtonProps) {\n const styles = useStyles()\n const handleClick = React.useCallback(() => {\n if (!isDisabled) {\n onClick(value)\n }\n }, [onClick, value, isDisabled])\n\n return (\n <button\n aria-disabled={isDisabled}\n aria-pressed={isSelected}\n className={mergeClasses(\n styles.timeBtn,\n !isSelected && styles.timeBtnDefault,\n isSelected && styles.timeBtnSelected,\n isDisabled ? styles.timeBtnDisabled : styles.timeBtnEnabled\n )}\n data-selected={isSelected}\n data-slot=\"time-button\"\n {...{ [SLOT_ATTR]: \"time-button\" }}\n data-value={value}\n disabled={isDisabled}\n onClick={handleClick}\n type=\"button\"\n >\n {padNumber(value)}\n </button>\n )\n})\n\nTimeButton.displayName = \"TimeButton\"\n\nexport const TimePicker = React.forwardRef<HTMLDivElement, TimePickerProps>(\n function TimePicker(\n {\n value,\n onChange,\n onTimeSelect,\n disablePast = false,\n currentTimeInTimezone,\n fillHeight = false,\n minuteStep = 1,\n className,\n hoursLabel = \"Hours\",\n minutesLabel = \"Minutes\",\n },\n ref\n ) {\n const styles = useStyles()\n const step = Math.max(1, Math.floor(minuteStep))\n\n // Enumerate buckets 0, step, 2·step… stopping at <60 so a step that\n // doesn't divide 60 evenly (e.g. 7) can never produce an out-of-range\n // value like 63.\n const MINUTES = React.useMemo(() => {\n const buckets: number[] = []\n for (let m = 0; m < 60; m += step) buckets.push(m)\n\n return buckets\n }, [step])\n\n const selectedHour = value !== null ? getHours(value) : -1\n const rawMinute = value !== null ? getMinutes(value) : -1\n const selectedMinute =\n value === null\n ? -1\n : step === 1\n ? rawMinute\n : Math.min(\n MINUTES[MINUTES.length - 1],\n Math.round(rawMinute / step) * step\n )\n\n const hoursRef = React.useRef<HTMLDivElement>(null)\n const minutesRef = React.useRef<HTMLDivElement>(null)\n\n const now = React.useMemo(\n () => currentTimeInTimezone || new Date(),\n [currentTimeInTimezone]\n )\n const isToday = React.useMemo(() => {\n if (!value) return false\n\n return (\n value.getFullYear() === now.getFullYear() &&\n value.getMonth() === now.getMonth() &&\n value.getDate() === now.getDate()\n )\n }, [value, now])\n\n const currentHour = now.getHours()\n const currentMinute = now.getMinutes()\n\n const isHourDisabled = React.useCallback(\n (hour: number) => {\n if (!disablePast || !isToday) return false\n\n return hour < currentHour\n },\n [disablePast, isToday, currentHour]\n )\n\n const isMinuteDisabled = React.useCallback(\n (minute: number) => {\n if (!disablePast || !isToday) return false\n if (selectedHour < currentHour) return true\n if (selectedHour === currentHour) return minute < currentMinute\n\n return false\n },\n [disablePast, isToday, selectedHour, currentHour, currentMinute]\n )\n\n const handleHourChange = React.useCallback(\n (hour: number) => {\n const base = value || now\n const minute = selectedMinute >= 0 ? selectedMinute : 0\n\n onChange(updateTime(base, hour, minute))\n },\n [onChange, value, now, selectedMinute]\n )\n\n const handleMinuteChange = React.useCallback(\n (minute: number) => {\n const base = value || now\n const hour = selectedHour >= 0 ? selectedHour : 0\n\n onChange(updateTime(base, hour, minute))\n onTimeSelect?.()\n },\n [onChange, onTimeSelect, value, now, selectedHour]\n )\n\n React.useEffect(() => {\n if (hoursRef.current) {\n const selectedElement = hoursRef.current.querySelector(\n `[data-value=\"${selectedHour}\"]`\n )\n\n if (selectedElement) {\n selectedElement.scrollIntoView?.({\n block: \"center\",\n behavior: \"auto\",\n })\n }\n }\n if (minutesRef.current) {\n const selectedElement = minutesRef.current.querySelector(\n `[data-value=\"${selectedMinute}\"]`\n )\n\n if (selectedElement) {\n selectedElement.scrollIntoView?.({\n block: \"center\",\n behavior: \"auto\",\n })\n }\n }\n }, []) // eslint-disable-line react-hooks/exhaustive-deps\n\n return (\n <div\n ref={ref}\n className={mergeClasses(\n styles.root,\n fillHeight && styles.fillHeight,\n className\n )}\n data-slot=\"timepicker\"\n {...{ [SLOT_ATTR]: \"timepicker\" }}\n >\n <div\n className={mergeClasses(\n styles.column,\n fillHeight && styles.columnFillHeight\n )}\n >\n <div\n className={mergeClasses(\n styles.scroll,\n fillHeight ? styles.scrollFill : styles.scrollFixed\n )}\n aria-label={hoursLabel}\n data-slot=\"timepicker-scroll\"\n role=\"group\"\n {...{ [SLOT_ATTR]: \"timepicker-scroll\" }}\n ref={hoursRef}\n >\n {HOURS.map((hour) => (\n <TimeButton\n isDisabled={isHourDisabled(hour)}\n isSelected={hour === selectedHour}\n key={hour}\n onClick={handleHourChange}\n value={hour}\n />\n ))}\n </div>\n </div>\n\n <div className={styles.separator}>:</div>\n\n <div\n className={mergeClasses(\n styles.column,\n fillHeight && styles.columnFillHeight\n )}\n >\n <div\n className={mergeClasses(\n styles.scroll,\n fillHeight ? styles.scrollFill : styles.scrollFixed\n )}\n aria-label={minutesLabel}\n data-slot=\"timepicker-scroll\"\n role=\"group\"\n {...{ [SLOT_ATTR]: \"timepicker-scroll\" }}\n ref={minutesRef}\n >\n {MINUTES.map((minute) => (\n <TimeButton\n isDisabled={isMinuteDisabled(minute)}\n isSelected={minute === selectedMinute}\n key={minute}\n onClick={handleMinuteChange}\n value={minute}\n />\n ))}\n </div>\n </div>\n </div>\n )\n }\n)\n"],"names":["HOURS","_","i","useStyles","makeZenithStyles","shorthands","tokens.spacingElement1","tokens.radiusMd","tokens.grayA5","tokens.grayA6","tokens.textBase","tokens.leadingBase","tokens.fontWeightSemibold","tokens.grayA8","tokens.textSm","tokens.leadingSm","tokens.grayA11","tokens.grayA4","tokens.semAccentSolid","tokens.semAccentContrast","tokens.semAccentSolidHover","TimeButton","React","value","isSelected","isDisabled","onClick","styles","handleClick","jsx","mergeClasses","SLOT_ATTR","TimePicker","onChange","onTimeSelect","disablePast","currentTimeInTimezone","fillHeight","minuteStep","className","hoursLabel","minutesLabel","ref","step","MINUTES","buckets","m","selectedHour","getHours","rawMinute","getMinutes","selectedMinute","hoursRef","minutesRef","now","isToday","currentHour","currentMinute","isHourDisabled","hour","isMinuteDisabled","minute","handleHourChange","base","updateTime","handleMinuteChange","selectedElement","_a","_b","jsxs"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"density-provider.js","sources":["../../../src/components/density-provider/density-provider.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\n\n/**\n * DENSITY-SPEC.md §4.4 — the two density mechanisms, and why this component is the only one that\n * does both
|
|
1
|
+
{"version":3,"file":"density-provider.js","sources":["../../../src/components/density-provider/density-provider.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\n\n/**\n * DENSITY-SPEC.md §4.4 — the two density mechanisms, and why this component is the only one that\n * does both: - CSS custom-property inheritance (no JavaScript) already delivers the shell's\n * AMBIENT default to every element, portalled or not — a Radix portal root is still an ordinary\n * DOM descendant of `<html>`, so it inherits `<html data-density=\"...\">` with zero wiring.\n */\n\nexport type Density = \"compact\" | \"normal\" | \"comfortable\"\n\nconst CANONICAL_DENSITIES: readonly Density[] = [\n \"compact\",\n \"normal\",\n \"comfortable\",\n]\n\n/**\n * Invalid runtime input (a bad string slipping past TypeScript) normalizes to \"normal\". Exported\n * (package-internal — NOT added to `src/index.ts`, no new public export) so `Table`/`DataTable`/\n * `TableHead`/`TableCell` can apply the exact same normalization to their own DOM `data-density`\n * stamp that `DensityContextBoundary` already applies to the context value — one function, so the\n * two can never independently disagree on what an invalid input normalizes to.\n */\nexport const canonicalDensity = (density: Density): Density =>\n CANONICAL_DENSITIES.includes(density) ? density : \"normal\"\n\n/**\n * Unexported by design, same as `ListContext` — read only through `useDensity()`. Default\n * `undefined`: a component nested with no `DensityProvider` ancestor gets `undefined`, never a\n * fabricated \"normal\" — that would be a JS reading of ambient CSS this hook explicitly does not do.\n */\nconst DensityContext = React.createContext<Density | undefined>(undefined)\n\nexport type DensityProviderProps = React.ComponentProps<\"div\"> & {\n /** The explicit density boundary for this subtree. No default — always a real caller choice. */\n density: Density\n}\n\n/**\n * Ordinary HTML div semantics: forwards `ref`/`className`/`style`/every other div prop, no\n * polymorphic `asChild`. Renders one real DOM node (the boundary) wrapping a React context\n * provider around `children` — not two independent trees, so context and DOM boundary can never\n * disagree about which density is active.\n */\nexport const DensityProvider = React.forwardRef<\n HTMLDivElement,\n DensityProviderProps\n>(function DensityProvider({ density, className, children, ...props }, ref) {\n const value = canonicalDensity(density)\n\n return (\n <div\n ref={ref}\n data-slot=\"density-provider\"\n {...{ [SLOT_ATTR]: \"density-provider\" }}\n className={className}\n {...props}\n // Authoritative, spread LAST: a raw caller `data-density` prop (part of `...props`, since\n // `DensityProviderProps` extends every native div prop) must never win over the normalized\n // `density` prop — the DOM attribute and the context value below both derive from the same\n // `value`, and this ordering is what keeps that invariant true even when a caller passes a\n // conflicting literal `data-density` alongside `density` (finish-line integration fix).\n data-density={value}\n >\n <DensityContext.Provider value={value}>\n {children}\n </DensityContext.Provider>\n </div>\n )\n})\n\n/**\n * Returns the nearest explicit `DensityProvider` value, or `undefined` if none exists. Never reads\n * `getComputedStyle`/CSS custom properties — an `undefined` result means \"no explicit override in\n * the React tree,\" not \"ambient density is unknown\"; the caller's job (portal content components)\n * is to stamp nothing in that case and let ordinary CSS inheritance supply the ambient value.\n */\nexport const useDensity = (): Density | undefined =>\n React.useContext(DensityContext)\n\n/**\n * Internal, package-private — NOT exported from `src/index.ts`. `DensityProvider` is the only\n * public density-boundary API; this is a context-only variant for a component that already owns a\n * real DOM boundary of its own (e.g.\n *\n * @no-host-element A pure context provider — it renders no host element, so there is no DOM node\n * for a forwarded ref to reach.\n */\nexport const DensityContextBoundary = ({\n density,\n children,\n}: {\n density: Density | undefined\n children: React.ReactNode\n}): React.ReactElement => {\n if (density === undefined) return <>{children}</>\n return (\n <DensityContext.Provider value={canonicalDensity(density)}>\n {children}\n </DensityContext.Provider>\n )\n}\n"],"names":["CANONICAL_DENSITIES","canonicalDensity","density","DensityContext","React","DensityProvider","className","children","props","ref","value","jsx","SLOT_ATTR","useDensity","DensityContextBoundary","Fragment"],"mappings":";;;AAaA,MAAMA,IAA0C;AAAA,EAC9C;AAAA,EACA;AAAA,EACA;AACF,GASaC,IAAmB,CAACC,MAC/BF,EAAoB,SAASE,CAAO,IAAIA,IAAU,UAO9CC,IAAiBC,EAAM,cAAmC,MAAS,GAa5DC,IAAkBD,EAAM,WAGnC,SAAyB,EAAE,SAAAF,GAAS,WAAAI,GAAW,UAAAC,GAAU,GAAGC,EAAA,GAASC,GAAK;AAC1E,QAAMC,IAAQT,EAAiBC,CAAO;AAEtC,SACE,gBAAAS;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAF;AAAA,MACA,aAAU;AAAA,MACJ,CAACG,CAAS,GAAG;AAAA,MACnB,WAAAN;AAAA,MACC,GAAGE;AAAA,MAMJ,gBAAcE;AAAA,MAEd,UAAA,gBAAAC,EAACR,EAAe,UAAf,EAAwB,OAAAO,GACtB,UAAAH,EAAA,CACH;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC,GAQYM,IAAa,MACxBT,EAAM,WAAWD,CAAc,GAUpBW,IAAyB,CAAC;AAAA,EACrC,SAAAZ;AAAA,EACA,UAAAK;AACF,MAIML,MAAY,SAAkB,gBAAAS,EAAAI,GAAA,EAAG,UAAAR,GAAS,IAE5C,gBAAAI,EAACR,EAAe,UAAf,EAAwB,OAAOF,EAAiBC,CAAO,GACrD,UAAAK,GACH;"}
|
|
@@ -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.\n *\n * v1's Field uses no Radix primitive at all — it is a custom implementation with its own context,\n * and v2 already had the same context (`FieldContext`, carrying `inputRef`). Base UI's Field parts\n * were only supplying the elements, and these are the elements they rendered: Root a div, Label a\n * label, Control an input, Description a p, Error a div. Substituting them is element-identical, so\n * nothing moves visually.\n *\n * **What is genuinely lost:** Base UI's Field also wired label-to-control association and\n * `aria-describedby` automatically. v1 does not do that either — its context carries only `inputRef`\n * — so this matches production rather than regressing against it, but it is a real accessibility\n * affordance that Base UI gave for free and is worth revisiting on its own terms.\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 a\n * Field.\n *\n * `useFieldContext` throws by design, which is right for FieldInput (it is meaningless on its own)\n * and wrong for SelectTrigger and the combobox trigger, which are legitimate standalone components\n * that merely pick up field wiring when nested. Those were calling the throwing hook inside a\n * try/catch, i.e. using an exception for control flow on every render of a perfectly valid tree.\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.semFocusRing,\n },\n \"&[data-invalid]\": {\n backgroundColor: tokens.semErrorSoft,\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.semErrorSoft,\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.semErrorOnSoft,\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.semErrorOnSoft,\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.semFocusRing","tokens.semErrorSoft","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.semErrorOnSoft","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\"\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.semFocusRing,\n },\n \"&[data-invalid]\": {\n backgroundColor: tokens.semErrorSoft,\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.semErrorSoft,\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.semErrorOnSoft,\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.semErrorOnSoft,\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.semFocusRing","tokens.semErrorSoft","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.semErrorOnSoft","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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"}
|
|
@@ -10,40 +10,12 @@ const A = g({
|
|
|
10
10
|
...f.gap(z),
|
|
11
11
|
// The leading lives on the size slots below, and which value it takes is a decided question --
|
|
12
12
|
// see DECISIONS.md D9 and the label specimens in vr/specimens that pin it.
|
|
13
|
-
//
|
|
14
|
-
// v1's source string is `text-sm leading-none`, and `leading-none` never reaches the DOM: v1's
|
|
15
|
-
// cn() runs tailwind-merge, which treats the later `text-sm` as also owning line-height (true in
|
|
16
|
-
// Tailwind v3) and drops it. So the class that actually ships is `.volt-text-sm`, and what v1
|
|
17
|
-
// DECLARES for a label is text-sm's own leading -- 1.25rem at the base size, not 1.
|
|
18
|
-
//
|
|
19
|
-
// v1 never renders that either. `.volt-text-sm` reads
|
|
20
|
-
// line-height: var(--volt-leading, var(--text-sm--line-height))
|
|
21
|
-
// and neither name resolves in the shipped sheet: the prefixer rewrote the DEFINITION to
|
|
22
|
-
// --volt-text-sm--line-height and left this REFERENCE unprefixed, so the declaration is invalid
|
|
23
|
-
// and falls back to inherited -- 1.5 under root-config's Tailwind preflight, i.e. 21px at 14px.
|
|
24
|
-
//
|
|
25
|
-
// v2 renders the declared intent: `lineHeight: tokens.leadingSm` at size `base`, paired with the
|
|
26
|
-
// size the same way every other text slot in this package now is. Against what broken v1 renders
|
|
27
|
-
// that is 2px shorter per line at `sm`, 1px shorter at `base` and identical at `lg` -- small, but
|
|
28
|
-
// a real re-measure for a form, which is why D9 exists. The VR harness compares against
|
|
29
|
-
// v1-as-DECLARED via one documented shim on the v1 arm.
|
|
30
|
-
//
|
|
31
|
-
// Two v1 bugs compound here -- the unprefixed prefixer reference and the tailwind-merge drop --
|
|
32
|
-
// and both belong in a STABLE360 ticket against v1. When v1 is fixed, delete the VR shim (see
|
|
33
|
-
// vr/run.mjs V1_DECLARED_LEADING_SHIM); vr/v1-leading-references.test.ts fails on purpose to
|
|
34
|
-
// force that, so the decision gets revisited together with the fix rather than silently.
|
|
35
13
|
fontWeight: u,
|
|
36
14
|
"&[for]": {
|
|
37
15
|
cursor: "pointer"
|
|
38
16
|
},
|
|
39
17
|
// The disabled-by-ANCESTOR and disabled-by-SIBLING rules are not here; they live on Field,
|
|
40
18
|
// which owns the elements those selectors are rooted at. See field.tsx.
|
|
41
|
-
//
|
|
42
|
-
// v1 expresses them with Tailwind's `group-data-[disabled=true]:` and `peer-disabled:`, which
|
|
43
|
-
// work only because Tailwind emits GLOBAL utility classes that can be rooted anywhere. Scoped
|
|
44
|
-
// atomic CSS cannot: a rule has to be declared by the component that owns the element the
|
|
45
|
-
// selector starts from. That is a real capability difference, and the consequence is recorded in
|
|
46
|
-
// field.tsx — a Label used OUTSIDE a Field, next to a disabled input, will not dim.
|
|
47
19
|
"&[data-disabled]": {
|
|
48
20
|
pointerEvents: "none",
|
|
49
21
|
opacity: 0.5
|
|
@@ -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
|
|
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;"}
|
|
@@ -83,12 +83,7 @@ const Ht = (n) => /* @__PURE__ */ D(
|
|
|
83
83
|
...p.padding(0),
|
|
84
84
|
...p.margin(0)
|
|
85
85
|
},
|
|
86
|
-
// ListItem base — density-bound (DENSITY-SPEC.md §2.2, WP9B2A-ACCEPTANCE-LIST).
|
|
87
|
-
// a compact/relaxed pair: the three CSS tiers are resolved by [data-density] inheritance, so
|
|
88
|
-
// there is no longer a JS branch to pick between "compact" and "everything else" — normal
|
|
89
|
-
// resolves to the same values `itemRelaxed` used to hardcode, and an explicit `relaxed` is
|
|
90
|
-
// normalized to the DOM's canonical `data-density="normal"` before it ever reaches this class,
|
|
91
|
-
// so it resolves through the identical selector. Typography is unchanged across every tier.
|
|
86
|
+
// ListItem base — density-bound (DENSITY-SPEC.md §2.2, WP9B2A-ACCEPTANCE-LIST).
|
|
92
87
|
item: {
|
|
93
88
|
position: "relative",
|
|
94
89
|
display: "flex",
|
|
@@ -162,12 +157,7 @@ const Ht = (n) => /* @__PURE__ */ D(
|
|
|
162
157
|
itemDragging: {
|
|
163
158
|
opacity: 0.4
|
|
164
159
|
},
|
|
165
|
-
// Index gutter — density-bound.
|
|
166
|
-
// padding to keep the index flush to the row edge at every tier; `calc(-1 * var(...))`
|
|
167
|
-
// (WP9B2A-ACCEPTANCE-LIST: "negative token expressions for that existing cancellation are
|
|
168
|
-
// authorized") tracks whichever tier is active without a separate JS branch, same reasoning as
|
|
169
|
-
// `item` above. `index-padding-x` is the one matrix completion this slice adds (DENSITY-SPEC.md
|
|
170
|
-
// §2.2): 6/8/8px — comfortable reuses the normal inset, no separate source value exists for it.
|
|
160
|
+
// Index gutter — density-bound.
|
|
171
161
|
indexBase: {
|
|
172
162
|
display: "flex",
|
|
173
163
|
flexShrink: 0,
|