@epilot/zenith-react 0.2.0-next.4 → 0.2.0-next.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +12 -1
- package/codemods/README.md +18 -4
- package/codemods/format.ts +86 -0
- package/codemods/migrate/from-base-elements.ts +8 -2
- package/codemods/migrate/from-volt.ts +8 -2
- package/codemods/radix-to-base-ui.ts +300 -12
- package/dist/_virtual/_zenith-runtime-family_accordion.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_alert-dialog.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_avatar.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_button.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_checkbox.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_csp-provider.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_dialog.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_direction-provider.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_menu.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_merge-props.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_popover.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_radio-group.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_radio.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_scroll-area.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_select.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_separator.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_switch.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_tabs.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_toast.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_toggle-group.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_toggle.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_tooltip.js +1 -1
- package/dist/_virtual/_zenith-runtime-family_use-render.js +1 -1
- package/dist/components/accordion/accordion.js +1 -1
- package/dist/components/accordion/accordion.js.map +1 -1
- package/dist/components/alert-dialog/alert-dialog.js +1 -1
- package/dist/components/alert-dialog/alert-dialog.js.map +1 -1
- package/dist/components/appearance-boundary/appearance-boundary.js +1 -1
- package/dist/components/appearance-boundary/appearance-boundary.js.map +1 -1
- package/dist/components/avatar/avatar-group.js +1 -1
- package/dist/components/avatar/avatar-group.js.map +1 -1
- package/dist/components/avatar/avatar.js +1 -1
- package/dist/components/avatar/avatar.js.map +1 -1
- package/dist/components/badge/badge.js +1 -1
- package/dist/components/badge/badge.js.map +1 -1
- package/dist/components/breadcrumb/breadcrumb.js +1 -1
- package/dist/components/breadcrumb/breadcrumb.js.map +1 -1
- package/dist/components/button/button.js +1 -1
- package/dist/components/button/button.js.map +1 -1
- package/dist/components/button-group/button-group.js +1 -1
- package/dist/components/button-group/button-group.js.map +1 -1
- package/dist/components/callout/callout.js +1 -1
- package/dist/components/callout/callout.js.map +1 -1
- package/dist/components/card/card.js +1 -1
- package/dist/components/card/card.js.map +1 -1
- package/dist/components/checkbox/checkbox.js +1 -1
- package/dist/components/checkbox/checkbox.js.map +1 -1
- package/dist/components/code-block/code-block.js +1 -1
- package/dist/components/code-block/code-block.js.map +1 -1
- package/dist/components/code-editor/code-editor.js +1 -1
- package/dist/components/code-editor/code-editor.js.map +1 -1
- package/dist/components/collapsible-sidebar/collapsible-sidebar.js +1 -1
- package/dist/components/collapsible-sidebar/collapsible-sidebar.js.map +1 -1
- package/dist/components/command/command.js +1 -1
- package/dist/components/command/command.js.map +1 -1
- package/dist/components/data-table/data-table-body.js +1 -1
- package/dist/components/data-table/data-table-body.js.map +1 -1
- package/dist/components/data-table/data-table-column-header.js +1 -1
- package/dist/components/data-table/data-table-column-header.js.map +1 -1
- package/dist/components/data-table/data-table-column-order.js +1 -1
- package/dist/components/data-table/data-table-column-order.js.map +1 -1
- package/dist/components/data-table/data-table-column-visibility.js +1 -1
- package/dist/components/data-table/data-table-column-visibility.js.map +1 -1
- package/dist/components/data-table/data-table-content.js +1 -1
- package/dist/components/data-table/data-table-content.js.map +1 -1
- package/dist/components/data-table/data-table-error.js +1 -1
- package/dist/components/data-table/data-table-error.js.map +1 -1
- package/dist/components/data-table/data-table-footer.js +1 -1
- package/dist/components/data-table/data-table-footer.js.map +1 -1
- package/dist/components/data-table/data-table-header-draggable.js +1 -1
- package/dist/components/data-table/data-table-header-draggable.js.map +1 -1
- package/dist/components/data-table/data-table-header.js +1 -1
- package/dist/components/data-table/data-table-header.js.map +1 -1
- package/dist/components/data-table/data-table-loading.js +1 -1
- package/dist/components/data-table/data-table-loading.js.map +1 -1
- package/dist/components/data-table/data-table-resize-handle.js +1 -1
- package/dist/components/data-table/data-table-resize-handle.js.map +1 -1
- package/dist/components/data-table/data-table-row.js +1 -1
- package/dist/components/data-table/data-table-row.js.map +1 -1
- package/dist/components/data-table/data-table-toolbar.js +1 -1
- package/dist/components/data-table/data-table-toolbar.js.map +1 -1
- package/dist/components/data-table/data-table.js +1 -1
- package/dist/components/data-table/data-table.js.map +1 -1
- package/dist/components/date-range-picker/date-range-picker.js +1 -1
- package/dist/components/date-range-picker/date-range-picker.js.map +1 -1
- package/dist/components/date-range-picker/range-calendar.js +1 -1
- package/dist/components/date-range-picker/range-calendar.js.map +1 -1
- package/dist/components/date-time-picker/calendar.js +1 -1
- package/dist/components/date-time-picker/calendar.js.map +1 -1
- package/dist/components/date-time-picker/date-time-picker-input.js +1 -1
- package/dist/components/date-time-picker/date-time-picker-input.js.map +1 -1
- package/dist/components/date-time-picker/date-time-picker-panel.js +1 -1
- package/dist/components/date-time-picker/date-time-picker-panel.js.map +1 -1
- package/dist/components/date-time-picker/date-time-picker.js +1 -1
- package/dist/components/date-time-picker/date-time-picker.js.map +1 -1
- package/dist/components/date-time-picker/time-picker.js +1 -1
- package/dist/components/date-time-picker/time-picker.js.map +1 -1
- package/dist/components/density-provider/density-provider.js +1 -1
- package/dist/components/dialog/dialog.js +1 -1
- package/dist/components/dialog/dialog.js.map +1 -1
- package/dist/components/drawer/drawer.js +1 -1
- package/dist/components/drawer/drawer.js.map +1 -1
- package/dist/components/dropdown-menu/dropdown-menu.js +1 -1
- package/dist/components/dropdown-menu/dropdown-menu.js.map +1 -1
- package/dist/components/field/field-combobox.js +190 -181
- package/dist/components/field/field-combobox.js.map +1 -1
- package/dist/components/field/field-select.js +37 -22
- package/dist/components/field/field-select.js.map +1 -1
- package/dist/components/field/field.js +1 -1
- package/dist/components/field/field.js.map +1 -1
- package/dist/components/label/label.js +1 -1
- package/dist/components/label/label.js.map +1 -1
- package/dist/components/list/list.js +1 -1
- package/dist/components/list/list.js.map +1 -1
- package/dist/components/option-card/option-card.js +1 -1
- package/dist/components/option-card/option-card.js.map +1 -1
- package/dist/components/pill/pill.js +1 -1
- package/dist/components/pill/pill.js.map +1 -1
- package/dist/components/popover/popover.js +1 -1
- package/dist/components/popover/popover.js.map +1 -1
- package/dist/components/radio/radio.js +1 -1
- package/dist/components/radio/radio.js.map +1 -1
- package/dist/components/scroll-area/scroll-area.js +1 -1
- package/dist/components/scroll-area/scroll-area.js.map +1 -1
- package/dist/components/scroll-area/scrollbar-styles.js +1 -1
- package/dist/components/scroll-area/scrollbar-styles.js.map +1 -1
- package/dist/components/scroll-overflow/scroll-overflow.js +22 -22
- package/dist/components/scroll-overflow/scroll-overflow.js.map +1 -1
- package/dist/components/segmented-control/segmented-control.js +133 -122
- package/dist/components/segmented-control/segmented-control.js.map +1 -1
- package/dist/components/select/select.js +1 -1
- package/dist/components/select/select.js.map +1 -1
- package/dist/components/separator/separator.js +1 -1
- package/dist/components/separator/separator.js.map +1 -1
- package/dist/components/skeleton/skeleton.js +1 -1
- package/dist/components/skeleton/skeleton.js.map +1 -1
- package/dist/components/slot/compose-as-child.js +1 -1
- package/dist/components/slot/compose-as-child.js.map +1 -1
- package/dist/components/spinner/spinner.js +1 -1
- package/dist/components/spinner/spinner.js.map +1 -1
- package/dist/components/surface/surface.js +1 -1
- package/dist/components/surface/surface.js.map +1 -1
- package/dist/components/switch/switch.js +1 -1
- package/dist/components/switch/switch.js.map +1 -1
- package/dist/components/table/table-pagination.js +1 -1
- package/dist/components/table/table-pagination.js.map +1 -1
- package/dist/components/table/table.js +1 -1
- package/dist/components/table/table.js.map +1 -1
- package/dist/components/tabs/tabs.js +1 -1
- package/dist/components/tabs/tabs.js.map +1 -1
- package/dist/components/text/text.js +1 -1
- package/dist/components/text/text.js.map +1 -1
- package/dist/components/toast/toast.js +1 -1
- package/dist/components/toast/toast.js.map +1 -1
- package/dist/components/toggle/toggle-group.js +1 -1
- package/dist/components/toggle/toggle-group.js.map +1 -1
- package/dist/components/toggle/toggle.js +29 -26
- package/dist/components/toggle/toggle.js.map +1 -1
- package/dist/components/tooltip/tooltip.js +1 -1
- package/dist/components/tooltip/tooltip.js.map +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +1 -1
- package/dist/lib/clear-button.js +1 -1
- package/dist/lib/clear-button.js.map +1 -1
- package/dist/packages/tokens/dist/delivery/index.js +1 -1
- package/dist/packages/tokens/dist/delivery/index.js.map +1 -1
- package/dist/packages/tokens/dist/install.js +1 -1
- package/dist/packages/tokens/dist/install.js.map +1 -1
- package/dist/renderer/served.js +19 -14
- package/dist/renderer/served.js.map +1 -1
- package/dist/styles/host-reset.js.map +1 -1
- package/dist/styles/make-styles.js +1 -1
- package/dist/styles/make-styles.js.map +1 -1
- package/dist/styles/text-box.js.map +1 -1
- package/dist/tokens.json +1 -1
- package/package.json +5 -3
- package/scripts/migration-diagnostics-core.mjs +284 -0
- package/scripts/migration-sweep.mjs +10 -10
- package/testing/setup.cjs +87 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"date-time-picker-panel.js","sources":["../../../src/components/date-time-picker/date-time-picker-panel.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1\"\n\nimport { Button } from \"../button/button\"\nimport { PopoverContent, PopoverPortal } from \"../popover/popover\"\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { boxModel } from \"../../styles/host-reset\"\nimport * as tokens from \"../../tokens\"\n\nimport { Calendar } from \"./calendar\"\nimport { TimePicker } from \"./time-picker\"\nimport { useDateTimePickerContext } from \"./date-time-picker-context\"\n\nexport type DateTimePickerPanelProps = {\n showTimePicker?: boolean\n timePickerPosition?: \"bottom\" | \"side\"\n okLabel?: string\n cancelLabel?: string\n previousMonthLabel?: string\n nextMonthLabel?: string\n hoursLabel?: string\n minutesLabel?: string\n showTodayButton?: boolean\n todayLabel?: string\n showWeekNumbers?: boolean\n className?: string\n minuteStep?: number\n}\n\nconst useStyles = makeZenithStyles({\n content: {\n overflowX: \"hidden\",\n overflowY: \"hidden\",\n },\n contentNarrow: {\n ...boxModel,\n width: \"300px\",\n },\n panelContent: {\n ...boxModel,\n display: \"flex\",\n flexDirection: \"column\",\n ...shorthands.gap(tokens.spacingGroup2),\n ...shorthands.padding(tokens.spacingElement3),\n },\n body: {\n display: \"flex\",\n },\n bodyBottom: {\n flexDirection: \"column\",\n ...shorthands.gap(tokens.spacingGroup1),\n },\n bodySide: {\n flexDirection: \"row\",\n ...shorthands.gap(tokens.spacingGroup1),\n position: \"relative\",\n },\n dateSection: {\n ...boxModel,\n flexGrow: 1,\n flexShrink: 1,\n flexBasis: \"0%\",\n minWidth: \"0\",\n },\n timeSpacer: {\n ...boxModel,\n width: \"9rem\",\n flexShrink: 0,\n },\n timeSection: {\n ...boxModel,\n position: \"absolute\",\n top: 0,\n bottom: 0,\n right: 0,\n width: \"9rem\",\n overflowX: \"hidden\",\n overflowY: \"hidden\",\n display: \"flex\",\n alignItems: \"stretch\",\n },\n footer: {\n display: \"flex\",\n justifyContent: \"flex-end\",\n ...shorthands.gap(tokens.spacingElement2),\n },\n})\n\nexport const DateTimePickerPanel = React.forwardRef<\n HTMLDivElement,\n DateTimePickerPanelProps\n>(function DateTimePickerPanel(\n {\n showTimePicker = true,\n timePickerPosition = \"bottom\",\n okLabel = \"Apply\",\n cancelLabel = \"Cancel\",\n previousMonthLabel = \"Previous month\",\n nextMonthLabel = \"Next month\",\n hoursLabel,\n minutesLabel,\n showTodayButton = false,\n todayLabel = \"Today\",\n showWeekNumbers = false,\n className,\n minuteStep = 1,\n },\n ref\n) {\n const styles = useStyles()\n const {\n tempValue,\n isOpen,\n locale,\n disablePast,\n currentTimeInTimezone,\n handleDateChange,\n confirm,\n cancel,\n } = useDateTimePickerContext()\n\n // Responsive: fall back to bottom layout on narrow viewports.\n const [isWideEnough, setIsWideEnough] = React.useState(true)\n\n React.useEffect(() => {\n if (timePickerPosition !== \"side\") return\n\n const update = () => setIsWideEnough(window.innerWidth >= 480)\n\n update()\n window.addEventListener(\"resize\", update)\n\n return () => window.removeEventListener(\"resize\", update)\n }, [timePickerPosition])\n\n // Fix viewport overflow: Floating UI's shift middleware may not work in all\n // environments (e.g. microfrontend hosts). Manually detect overflow and\n // adjust the positioner's transform to keep the popover within viewport.\n const contentRef = React.useRef<HTMLDivElement>(null)\n\n React.useLayoutEffect(() => {\n if (!isOpen) return\n\n const adjustPosition = () => {\n const el = contentRef.current\n if (!el) return\n\n // Lock popover width on first open to prevent resizing on calendar view changes\n if (!el.dataset.widthLocked) {\n el.style.width = `${el.offsetWidth}px`\n el.dataset.widthLocked = \"true\"\n }\n\n // Base UI's Positioner, the popup's parent, is the element Floating UI\n // translates into place.\n const wrapper =\n el.closest(`[${SLOT_ATTR}=\"popover-content\"]`)?.parentElement ?? null\n if (!wrapper) return\n\n // Reset previous constraints so we measure natural size\n const body = el.querySelector(\n `[${SLOT_ATTR}=\"datetimepicker-body\"]`\n ) as HTMLElement | null\n if (body) {\n body.style.maxHeight = \"\"\n body.style.overflowY = \"\"\n }\n\n const rect = wrapper.getBoundingClientRect()\n const vh = window.innerHeight\n const vw = window.innerWidth\n const pad = 8\n const maxH = vh - 2 * pad\n\n let matrix = { m41: 0, m42: 0 }\n try {\n const computedTransform = getComputedStyle(wrapper).transform\n if (\n typeof DOMMatrixReadOnly !== \"undefined\" &&\n computedTransform &&\n computedTransform !== \"none\"\n ) {\n matrix = new DOMMatrixReadOnly(computedTransform)\n }\n } catch {\n // Fallback if transform cannot be parsed\n }\n let dy = 0\n let dx = 0\n\n if (rect.height > maxH) {\n // Popover is taller than viewport — constrain the body area\n // (keep footer visible) and pin to top padding\n if (body) {\n // Everything but the body (footer, padding, gaps) keeps its height.\n // offsetHeight: the popup may still be scaling in.\n const fixedH = rect.height - body.offsetHeight\n body.style.maxHeight = `${maxH - fixedH}px`\n body.style.overflowY = \"auto\"\n }\n dy = pad - rect.top\n } else {\n // Fits in viewport — just shift to stay within bounds\n if (rect.bottom > vh - pad) {\n dy = vh - pad - rect.bottom\n }\n if (rect.top + dy < pad) {\n dy = pad - rect.top\n }\n }\n\n // Keep the popover on-screen horizontally\n if (rect.right > vw - pad) {\n dx = vw - pad - rect.right\n }\n if (rect.left + dx < pad) {\n dx = pad - rect.left\n }\n\n if (dx !== 0 || dy !== 0) {\n wrapper.style.transform = `translate(${matrix.m41 + dx}px, ${matrix.m42 + dy}px)`\n }\n }\n\n // Wait for Floating UI to finish positioning\n const raf = requestAnimationFrame(() => {\n requestAnimationFrame(adjustPosition)\n })\n\n let resizeRaf = 0\n const onResize = () => {\n const el = contentRef.current\n if (el) {\n el.style.width = \"\"\n delete el.dataset.widthLocked\n }\n cancelAnimationFrame(resizeRaf)\n resizeRaf = requestAnimationFrame(() => {\n resizeRaf = requestAnimationFrame(adjustPosition)\n })\n }\n window.addEventListener(\"resize\", onResize)\n\n const el = contentRef.current\n\n return () => {\n cancelAnimationFrame(raf)\n cancelAnimationFrame(resizeRaf)\n window.removeEventListener(\"resize\", onResize)\n // Reset locked width on close so next open re-measures\n if (el) {\n el.style.width = \"\"\n delete el.dataset.widthLocked\n }\n }\n }, [isOpen])\n\n const isSideLayout =\n showTimePicker && timePickerPosition === \"side\" && isWideEnough\n\n return (\n <PopoverPortal>\n <PopoverContent\n align=\"start\"\n className={mergeClasses(\n styles.content,\n !isSideLayout && styles.contentNarrow,\n className\n )}\n collisionPadding={8}\n flush\n ref={ref}\n side=\"bottom\"\n sideOffset={4}\n sticky=\"always\"\n >\n <div\n className={styles.panelContent}\n data-slot=\"datetimepicker-content\"\n {...{ [SLOT_ATTR]: \"datetimepicker-content\" }}\n ref={contentRef}\n >\n <div\n className={mergeClasses(\n styles.body,\n isSideLayout ? styles.bodySide : styles.bodyBottom\n )}\n data-slot=\"datetimepicker-body\"\n {...{ [SLOT_ATTR]: \"datetimepicker-body\" }}\n >\n {isSideLayout && showTimePicker ? (\n <div\n className={styles.dateSection}\n data-slot=\"datetimepicker-date-section\"\n {...{ [SLOT_ATTR]: \"datetimepicker-date-section\" }}\n >\n <Calendar\n currentTimeInTimezone={currentTimeInTimezone}\n disablePast={disablePast}\n locale={locale}\n nextMonthLabel={nextMonthLabel}\n onChange={handleDateChange}\n previousMonthLabel={previousMonthLabel}\n showTodayButton={showTodayButton}\n showWeekNumbers={showWeekNumbers}\n todayLabel={todayLabel}\n value={tempValue}\n />\n </div>\n ) : (\n <Calendar\n currentTimeInTimezone={currentTimeInTimezone}\n disablePast={disablePast}\n locale={locale}\n nextMonthLabel={nextMonthLabel}\n onChange={handleDateChange}\n previousMonthLabel={previousMonthLabel}\n showTodayButton={showTodayButton}\n showWeekNumbers={showWeekNumbers}\n todayLabel={todayLabel}\n value={tempValue}\n />\n )}\n {showTimePicker && (\n <>\n {isSideLayout ? (\n <>\n <div\n className={styles.timeSpacer}\n data-slot=\"datetimepicker-time-spacer\"\n {...{ [SLOT_ATTR]: \"datetimepicker-time-spacer\" }}\n />\n <div\n className={styles.timeSection}\n data-slot=\"datetimepicker-time-section\"\n {...{ [SLOT_ATTR]: \"datetimepicker-time-section\" }}\n >\n <TimePicker\n currentTimeInTimezone={currentTimeInTimezone}\n disablePast={disablePast}\n fillHeight\n hoursLabel={hoursLabel}\n minuteStep={minuteStep}\n minutesLabel={minutesLabel}\n onChange={handleDateChange}\n value={tempValue}\n />\n </div>\n </>\n ) : (\n <TimePicker\n currentTimeInTimezone={currentTimeInTimezone}\n disablePast={disablePast}\n hoursLabel={hoursLabel}\n minuteStep={minuteStep}\n minutesLabel={minutesLabel}\n onChange={handleDateChange}\n value={tempValue}\n />\n )}\n </>\n )}\n </div>\n <div\n className={styles.footer}\n data-slot=\"datetimepicker-footer\"\n {...{ [SLOT_ATTR]: \"datetimepicker-footer\" }}\n >\n <Button onClick={cancel} size=\"sm\" variant=\"secondary\">\n {cancelLabel}\n </Button>\n <Button onClick={confirm} size=\"sm\" variant=\"primary\">\n {okLabel}\n </Button>\n </div>\n </div>\n </PopoverContent>\n </PopoverPortal>\n )\n})\n"],"names":["useStyles","makeZenithStyles","boxModel","shorthands","tokens.spacingGroup2","tokens.spacingElement3","tokens.spacingGroup1","tokens.spacingElement2","DateTimePickerPanel","React","showTimePicker","timePickerPosition","okLabel","cancelLabel","previousMonthLabel","nextMonthLabel","hoursLabel","minutesLabel","showTodayButton","todayLabel","showWeekNumbers","className","minuteStep","ref","styles","tempValue","isOpen","locale","disablePast","currentTimeInTimezone","handleDateChange","confirm","cancel","useDateTimePickerContext","isWideEnough","setIsWideEnough","update","contentRef","adjustPosition","el","wrapper","SLOT_ATTR","body","rect","vh","vw","pad","maxH","matrix","computedTransform","dy","dx","fixedH","raf","resizeRaf","onResize","isSideLayout","PopoverPortal","jsx","PopoverContent","mergeClasses","jsxs","Calendar","Fragment","TimePicker","Button"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"date-time-picker-panel.js","sources":["../../../src/components/date-time-picker/date-time-picker-panel.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1/core\"\n\nimport { Button } from \"../button/button\"\nimport { PopoverContent, PopoverPortal } from \"../popover/popover\"\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { boxModel } from \"../../styles/host-reset\"\nimport * as tokens from \"../../tokens\"\n\nimport { Calendar } from \"./calendar\"\nimport { TimePicker } from \"./time-picker\"\nimport { useDateTimePickerContext } from \"./date-time-picker-context\"\n\nexport type DateTimePickerPanelProps = {\n showTimePicker?: boolean\n timePickerPosition?: \"bottom\" | \"side\"\n okLabel?: string\n cancelLabel?: string\n previousMonthLabel?: string\n nextMonthLabel?: string\n hoursLabel?: string\n minutesLabel?: string\n showTodayButton?: boolean\n todayLabel?: string\n showWeekNumbers?: boolean\n className?: string\n minuteStep?: number\n}\n\nconst useStyles = makeZenithStyles({\n content: {\n overflowX: \"hidden\",\n overflowY: \"hidden\",\n },\n contentNarrow: {\n ...boxModel,\n width: \"300px\",\n },\n panelContent: {\n ...boxModel,\n display: \"flex\",\n flexDirection: \"column\",\n ...shorthands.gap(tokens.spacingGroup2),\n ...shorthands.padding(tokens.spacingElement3),\n },\n body: {\n display: \"flex\",\n },\n bodyBottom: {\n flexDirection: \"column\",\n ...shorthands.gap(tokens.spacingGroup1),\n },\n bodySide: {\n flexDirection: \"row\",\n ...shorthands.gap(tokens.spacingGroup1),\n position: \"relative\",\n },\n dateSection: {\n ...boxModel,\n flexGrow: 1,\n flexShrink: 1,\n flexBasis: \"0%\",\n minWidth: \"0\",\n },\n timeSpacer: {\n ...boxModel,\n width: \"9rem\",\n flexShrink: 0,\n },\n timeSection: {\n ...boxModel,\n position: \"absolute\",\n top: 0,\n bottom: 0,\n right: 0,\n width: \"9rem\",\n overflowX: \"hidden\",\n overflowY: \"hidden\",\n display: \"flex\",\n alignItems: \"stretch\",\n },\n footer: {\n display: \"flex\",\n justifyContent: \"flex-end\",\n ...shorthands.gap(tokens.spacingElement2),\n },\n})\n\nexport const DateTimePickerPanel = React.forwardRef<\n HTMLDivElement,\n DateTimePickerPanelProps\n>(function DateTimePickerPanel(\n {\n showTimePicker = true,\n timePickerPosition = \"bottom\",\n okLabel = \"Apply\",\n cancelLabel = \"Cancel\",\n previousMonthLabel = \"Previous month\",\n nextMonthLabel = \"Next month\",\n hoursLabel,\n minutesLabel,\n showTodayButton = false,\n todayLabel = \"Today\",\n showWeekNumbers = false,\n className,\n minuteStep = 1,\n },\n ref\n) {\n const styles = useStyles()\n const {\n tempValue,\n isOpen,\n locale,\n disablePast,\n currentTimeInTimezone,\n handleDateChange,\n confirm,\n cancel,\n } = useDateTimePickerContext()\n\n // Responsive: fall back to bottom layout on narrow viewports.\n const [isWideEnough, setIsWideEnough] = React.useState(true)\n\n React.useEffect(() => {\n if (timePickerPosition !== \"side\") return\n\n const update = () => setIsWideEnough(window.innerWidth >= 480)\n\n update()\n window.addEventListener(\"resize\", update)\n\n return () => window.removeEventListener(\"resize\", update)\n }, [timePickerPosition])\n\n // Fix viewport overflow: Floating UI's shift middleware may not work in all\n // environments (e.g. microfrontend hosts). Manually detect overflow and\n // adjust the positioner's transform to keep the popover within viewport.\n const contentRef = React.useRef<HTMLDivElement>(null)\n\n React.useLayoutEffect(() => {\n if (!isOpen) return\n\n const adjustPosition = () => {\n const el = contentRef.current\n if (!el) return\n\n // Lock popover width on first open to prevent resizing on calendar view changes\n if (!el.dataset.widthLocked) {\n el.style.width = `${el.offsetWidth}px`\n el.dataset.widthLocked = \"true\"\n }\n\n // Base UI's Positioner, the popup's parent, is the element Floating UI\n // translates into place.\n const wrapper =\n el.closest(`[${SLOT_ATTR}=\"popover-content\"]`)?.parentElement ?? null\n if (!wrapper) return\n\n // Reset previous constraints so we measure natural size\n const body = el.querySelector(\n `[${SLOT_ATTR}=\"datetimepicker-body\"]`\n ) as HTMLElement | null\n if (body) {\n body.style.maxHeight = \"\"\n body.style.overflowY = \"\"\n }\n\n const rect = wrapper.getBoundingClientRect()\n const vh = window.innerHeight\n const vw = window.innerWidth\n const pad = 8\n const maxH = vh - 2 * pad\n\n let matrix = { m41: 0, m42: 0 }\n try {\n const computedTransform = getComputedStyle(wrapper).transform\n if (\n typeof DOMMatrixReadOnly !== \"undefined\" &&\n computedTransform &&\n computedTransform !== \"none\"\n ) {\n matrix = new DOMMatrixReadOnly(computedTransform)\n }\n } catch {\n // Fallback if transform cannot be parsed\n }\n let dy = 0\n let dx = 0\n\n if (rect.height > maxH) {\n // Popover is taller than viewport — constrain the body area\n // (keep footer visible) and pin to top padding\n if (body) {\n // Everything but the body (footer, padding, gaps) keeps its height.\n // offsetHeight: the popup may still be scaling in.\n const fixedH = rect.height - body.offsetHeight\n body.style.maxHeight = `${maxH - fixedH}px`\n body.style.overflowY = \"auto\"\n }\n dy = pad - rect.top\n } else {\n // Fits in viewport — just shift to stay within bounds\n if (rect.bottom > vh - pad) {\n dy = vh - pad - rect.bottom\n }\n if (rect.top + dy < pad) {\n dy = pad - rect.top\n }\n }\n\n // Keep the popover on-screen horizontally\n if (rect.right > vw - pad) {\n dx = vw - pad - rect.right\n }\n if (rect.left + dx < pad) {\n dx = pad - rect.left\n }\n\n if (dx !== 0 || dy !== 0) {\n wrapper.style.transform = `translate(${matrix.m41 + dx}px, ${matrix.m42 + dy}px)`\n }\n }\n\n // Wait for Floating UI to finish positioning\n const raf = requestAnimationFrame(() => {\n requestAnimationFrame(adjustPosition)\n })\n\n let resizeRaf = 0\n const onResize = () => {\n const el = contentRef.current\n if (el) {\n el.style.width = \"\"\n delete el.dataset.widthLocked\n }\n cancelAnimationFrame(resizeRaf)\n resizeRaf = requestAnimationFrame(() => {\n resizeRaf = requestAnimationFrame(adjustPosition)\n })\n }\n window.addEventListener(\"resize\", onResize)\n\n const el = contentRef.current\n\n return () => {\n cancelAnimationFrame(raf)\n cancelAnimationFrame(resizeRaf)\n window.removeEventListener(\"resize\", onResize)\n // Reset locked width on close so next open re-measures\n if (el) {\n el.style.width = \"\"\n delete el.dataset.widthLocked\n }\n }\n }, [isOpen])\n\n const isSideLayout =\n showTimePicker && timePickerPosition === \"side\" && isWideEnough\n\n return (\n <PopoverPortal>\n <PopoverContent\n align=\"start\"\n className={mergeClasses(\n styles.content,\n !isSideLayout && styles.contentNarrow,\n className\n )}\n collisionPadding={8}\n flush\n ref={ref}\n side=\"bottom\"\n sideOffset={4}\n sticky=\"always\"\n >\n <div\n className={styles.panelContent}\n data-slot=\"datetimepicker-content\"\n {...{ [SLOT_ATTR]: \"datetimepicker-content\" }}\n ref={contentRef}\n >\n <div\n className={mergeClasses(\n styles.body,\n isSideLayout ? styles.bodySide : styles.bodyBottom\n )}\n data-slot=\"datetimepicker-body\"\n {...{ [SLOT_ATTR]: \"datetimepicker-body\" }}\n >\n {isSideLayout && showTimePicker ? (\n <div\n className={styles.dateSection}\n data-slot=\"datetimepicker-date-section\"\n {...{ [SLOT_ATTR]: \"datetimepicker-date-section\" }}\n >\n <Calendar\n currentTimeInTimezone={currentTimeInTimezone}\n disablePast={disablePast}\n locale={locale}\n nextMonthLabel={nextMonthLabel}\n onChange={handleDateChange}\n previousMonthLabel={previousMonthLabel}\n showTodayButton={showTodayButton}\n showWeekNumbers={showWeekNumbers}\n todayLabel={todayLabel}\n value={tempValue}\n />\n </div>\n ) : (\n <Calendar\n currentTimeInTimezone={currentTimeInTimezone}\n disablePast={disablePast}\n locale={locale}\n nextMonthLabel={nextMonthLabel}\n onChange={handleDateChange}\n previousMonthLabel={previousMonthLabel}\n showTodayButton={showTodayButton}\n showWeekNumbers={showWeekNumbers}\n todayLabel={todayLabel}\n value={tempValue}\n />\n )}\n {showTimePicker && (\n <>\n {isSideLayout ? (\n <>\n <div\n className={styles.timeSpacer}\n data-slot=\"datetimepicker-time-spacer\"\n {...{ [SLOT_ATTR]: \"datetimepicker-time-spacer\" }}\n />\n <div\n className={styles.timeSection}\n data-slot=\"datetimepicker-time-section\"\n {...{ [SLOT_ATTR]: \"datetimepicker-time-section\" }}\n >\n <TimePicker\n currentTimeInTimezone={currentTimeInTimezone}\n disablePast={disablePast}\n fillHeight\n hoursLabel={hoursLabel}\n minuteStep={minuteStep}\n minutesLabel={minutesLabel}\n onChange={handleDateChange}\n value={tempValue}\n />\n </div>\n </>\n ) : (\n <TimePicker\n currentTimeInTimezone={currentTimeInTimezone}\n disablePast={disablePast}\n hoursLabel={hoursLabel}\n minuteStep={minuteStep}\n minutesLabel={minutesLabel}\n onChange={handleDateChange}\n value={tempValue}\n />\n )}\n </>\n )}\n </div>\n <div\n className={styles.footer}\n data-slot=\"datetimepicker-footer\"\n {...{ [SLOT_ATTR]: \"datetimepicker-footer\" }}\n >\n <Button onClick={cancel} size=\"sm\" variant=\"secondary\">\n {cancelLabel}\n </Button>\n <Button onClick={confirm} size=\"sm\" variant=\"primary\">\n {okLabel}\n </Button>\n </div>\n </div>\n </PopoverContent>\n </PopoverPortal>\n )\n})\n"],"names":["useStyles","makeZenithStyles","boxModel","shorthands","tokens.spacingGroup2","tokens.spacingElement3","tokens.spacingGroup1","tokens.spacingElement2","DateTimePickerPanel","React","showTimePicker","timePickerPosition","okLabel","cancelLabel","previousMonthLabel","nextMonthLabel","hoursLabel","minutesLabel","showTodayButton","todayLabel","showWeekNumbers","className","minuteStep","ref","styles","tempValue","isOpen","locale","disablePast","currentTimeInTimezone","handleDateChange","confirm","cancel","useDateTimePickerContext","isWideEnough","setIsWideEnough","update","contentRef","adjustPosition","el","wrapper","SLOT_ATTR","body","rect","vh","vw","pad","maxH","matrix","computedTransform","dy","dx","fixedH","raf","resizeRaf","onResize","isSideLayout","PopoverPortal","jsx","PopoverContent","mergeClasses","jsxs","Calendar","Fragment","TimePicker","Button"],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as e, jsxs as s } from "react/jsx-runtime";
|
|
2
2
|
import * as o from "react";
|
|
3
|
-
import { SLOT_ATTR as w, mergeClasses as z } from "@epilot/zenith-runtime/v1";
|
|
3
|
+
import { SLOT_ATTR as w, mergeClasses as z } from "@epilot/zenith-runtime/v1/core.js";
|
|
4
4
|
import { Field as G, FieldLabel as H, FieldError as J } from "../field/field.js";
|
|
5
5
|
import { makeZenithStyles as K } from "../../styles/make-styles.js";
|
|
6
6
|
import { boxModel as Q } from "../../styles/host-reset.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"date-time-picker.js","sources":["../../../src/components/date-time-picker/date-time-picker.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { mergeClasses } from \"@epilot/zenith-runtime/v1\"\n\nimport { Field, FieldError, FieldLabel } from \"../field/field\"\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { boxModel } from \"../../styles/host-reset\"\n\nimport { DateTimePickerRoot } from \"./date-time-picker-context\"\nimport type { DateTimePickerRootProps } from \"./date-time-picker-context\"\nimport {\n DateTimePickerInput,\n DateTimePickerLabelProvider,\n} from \"./date-time-picker-input\"\nimport type { DateTimePickerInputProps } from \"./date-time-picker-input\"\nimport { DateTimePickerPopover } from \"./date-time-picker-popover\"\nimport type { DateTimePickerPopoverProps } from \"./date-time-picker-popover\"\nimport { DateTimePickerPanel } from \"./date-time-picker-panel\"\nimport type { DateTimePickerPanelProps } from \"./date-time-picker-panel\"\nimport { Calendar } from \"./calendar\"\nimport type { CalendarProps } from \"./calendar\"\nimport { TimePicker } from \"./time-picker\"\nimport type { TimePickerProps } from \"./time-picker\"\nimport type { DateTimePickerLocale } from \"./date-time-picker-utils\"\n\ntype DateTimePickerProps = {\n value: Date | null\n onChange: (date: Date | null) => void\n onBlur?: () => void\n disabled?: boolean\n disablePast?: boolean\n label?: string\n error?: string\n placeholder?: string\n format?: string\n locale?: DateTimePickerLocale\n className?: string\n keyboardIcon?: React.ReactNode\n okLabel?: string\n cancelLabel?: string\n inputAriaLabel?: string\n openPickerAriaLabel?: string\n previousMonthLabel?: string\n nextMonthLabel?: string\n hoursLabel?: string\n minutesLabel?: string\n showTodayButton?: boolean\n todayLabel?: string\n showWeekNumbers?: boolean\n testId?: string\n currentTimeInTimezone?: Date\n timePickerPosition?: \"bottom\" | \"side\"\n showTimePicker?: boolean\n editable?: boolean\n iconPosition?: \"start\" | \"end\"\n minuteStep?: number\n}\n\nconst useStyles = makeZenithStyles({\n root: {\n ...boxModel,\n width: \"100%\",\n },\n})\n\nconst DateTimePicker = React.forwardRef<HTMLDivElement, DateTimePickerProps>(\n function DateTimePicker(\n {\n value,\n onChange,\n onBlur,\n disabled = false,\n disablePast = false,\n label,\n error,\n placeholder,\n format,\n locale,\n className,\n keyboardIcon,\n okLabel,\n cancelLabel,\n inputAriaLabel,\n openPickerAriaLabel,\n previousMonthLabel,\n nextMonthLabel,\n hoursLabel,\n minutesLabel,\n showTodayButton,\n todayLabel,\n showWeekNumbers,\n testId,\n currentTimeInTimezone,\n timePickerPosition,\n showTimePicker = true,\n editable,\n iconPosition,\n minuteStep,\n },\n ref\n ) {\n const styles = useStyles()\n const fieldVariant = error ? \"destructive\" : \"highlight\"\n // This component renders both the label and the input, so it connects them (#16).\n const inputId = React.useId()\n const labelId = React.useId()\n const labelling = React.useMemo(\n () =>\n label\n ? { inputId, labelId, namedByLabel: inputAriaLabel === undefined }\n : null,\n [label, inputId, labelId, inputAriaLabel]\n )\n const resolvedFormat = format ?? (showTimePicker ? undefined : \"dd/MM/yyyy\")\n const resolvedPlaceholder =\n placeholder ?? (showTimePicker ? undefined : \"dd/MM/yyyy\")\n\n return (\n <DateTimePickerRoot\n currentTimeInTimezone={currentTimeInTimezone}\n disabled={disabled}\n disablePast={disablePast}\n format={resolvedFormat}\n locale={locale}\n onBlur={onBlur}\n onChange={onChange}\n value={value}\n >\n <Field\n className={mergeClasses(styles.root, className)}\n data-slot=\"datetimepicker\"\n {...{ [SLOT_ATTR]: \"datetimepicker\" }}\n ref={ref}\n variant={fieldVariant}\n >\n {label && (\n <FieldLabel id={labelId} htmlFor={inputId}>\n {label}\n </FieldLabel>\n )}\n <DateTimePickerLabelProvider value={labelling}>\n <DateTimePickerPopover>\n <DateTimePickerInput\n editable={editable}\n iconPosition={iconPosition}\n inputAriaLabel={inputAriaLabel}\n keyboardIcon={keyboardIcon}\n openPickerAriaLabel={openPickerAriaLabel}\n placeholder={resolvedPlaceholder}\n testId={testId}\n />\n <DateTimePickerPanel\n cancelLabel={cancelLabel}\n hoursLabel={hoursLabel}\n minuteStep={minuteStep}\n minutesLabel={minutesLabel}\n nextMonthLabel={nextMonthLabel}\n okLabel={okLabel}\n previousMonthLabel={previousMonthLabel}\n showTimePicker={showTimePicker}\n showTodayButton={showTodayButton}\n showWeekNumbers={showWeekNumbers}\n timePickerPosition={timePickerPosition}\n todayLabel={todayLabel}\n />\n </DateTimePickerPopover>\n </DateTimePickerLabelProvider>\n {error && <FieldError>{error}</FieldError>}\n </Field>\n </DateTimePickerRoot>\n )\n }\n)\n\nexport {\n DateTimePicker,\n DateTimePickerRoot,\n DateTimePickerInput,\n DateTimePickerPopover,\n DateTimePickerPanel,\n Calendar,\n TimePicker,\n}\n\nexport type {\n DateTimePickerProps,\n DateTimePickerRootProps,\n DateTimePickerInputProps,\n DateTimePickerPopoverProps,\n DateTimePickerPanelProps,\n CalendarProps,\n TimePickerProps,\n DateTimePickerLocale,\n}\n"],"names":["useStyles","makeZenithStyles","boxModel","DateTimePicker","React","value","onChange","onBlur","disabled","disablePast","label","error","placeholder","format","locale","className","keyboardIcon","okLabel","cancelLabel","inputAriaLabel","openPickerAriaLabel","previousMonthLabel","nextMonthLabel","hoursLabel","minutesLabel","showTodayButton","todayLabel","showWeekNumbers","testId","currentTimeInTimezone","timePickerPosition","showTimePicker","editable","iconPosition","minuteStep","ref","styles","fieldVariant","inputId","labelId","labelling","resolvedFormat","resolvedPlaceholder","jsx","DateTimePickerRoot","jsxs","Field","mergeClasses","SLOT_ATTR","FieldLabel","DateTimePickerLabelProvider","DateTimePickerPopover","DateTimePickerInput","DateTimePickerPanel","FieldError"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"date-time-picker.js","sources":["../../../src/components/date-time-picker/date-time-picker.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { mergeClasses } from \"@epilot/zenith-runtime/v1/core\"\n\nimport { Field, FieldError, FieldLabel } from \"../field/field\"\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { boxModel } from \"../../styles/host-reset\"\n\nimport { DateTimePickerRoot } from \"./date-time-picker-context\"\nimport type { DateTimePickerRootProps } from \"./date-time-picker-context\"\nimport {\n DateTimePickerInput,\n DateTimePickerLabelProvider,\n} from \"./date-time-picker-input\"\nimport type { DateTimePickerInputProps } from \"./date-time-picker-input\"\nimport { DateTimePickerPopover } from \"./date-time-picker-popover\"\nimport type { DateTimePickerPopoverProps } from \"./date-time-picker-popover\"\nimport { DateTimePickerPanel } from \"./date-time-picker-panel\"\nimport type { DateTimePickerPanelProps } from \"./date-time-picker-panel\"\nimport { Calendar } from \"./calendar\"\nimport type { CalendarProps } from \"./calendar\"\nimport { TimePicker } from \"./time-picker\"\nimport type { TimePickerProps } from \"./time-picker\"\nimport type { DateTimePickerLocale } from \"./date-time-picker-utils\"\n\ntype DateTimePickerProps = {\n value: Date | null\n onChange: (date: Date | null) => void\n onBlur?: () => void\n disabled?: boolean\n disablePast?: boolean\n label?: string\n error?: string\n placeholder?: string\n format?: string\n locale?: DateTimePickerLocale\n className?: string\n keyboardIcon?: React.ReactNode\n okLabel?: string\n cancelLabel?: string\n inputAriaLabel?: string\n openPickerAriaLabel?: string\n previousMonthLabel?: string\n nextMonthLabel?: string\n hoursLabel?: string\n minutesLabel?: string\n showTodayButton?: boolean\n todayLabel?: string\n showWeekNumbers?: boolean\n testId?: string\n currentTimeInTimezone?: Date\n timePickerPosition?: \"bottom\" | \"side\"\n showTimePicker?: boolean\n editable?: boolean\n iconPosition?: \"start\" | \"end\"\n minuteStep?: number\n}\n\nconst useStyles = makeZenithStyles({\n root: {\n ...boxModel,\n width: \"100%\",\n },\n})\n\nconst DateTimePicker = React.forwardRef<HTMLDivElement, DateTimePickerProps>(\n function DateTimePicker(\n {\n value,\n onChange,\n onBlur,\n disabled = false,\n disablePast = false,\n label,\n error,\n placeholder,\n format,\n locale,\n className,\n keyboardIcon,\n okLabel,\n cancelLabel,\n inputAriaLabel,\n openPickerAriaLabel,\n previousMonthLabel,\n nextMonthLabel,\n hoursLabel,\n minutesLabel,\n showTodayButton,\n todayLabel,\n showWeekNumbers,\n testId,\n currentTimeInTimezone,\n timePickerPosition,\n showTimePicker = true,\n editable,\n iconPosition,\n minuteStep,\n },\n ref\n ) {\n const styles = useStyles()\n const fieldVariant = error ? \"destructive\" : \"highlight\"\n // This component renders both the label and the input, so it connects them (#16).\n const inputId = React.useId()\n const labelId = React.useId()\n const labelling = React.useMemo(\n () =>\n label\n ? { inputId, labelId, namedByLabel: inputAriaLabel === undefined }\n : null,\n [label, inputId, labelId, inputAriaLabel]\n )\n const resolvedFormat = format ?? (showTimePicker ? undefined : \"dd/MM/yyyy\")\n const resolvedPlaceholder =\n placeholder ?? (showTimePicker ? undefined : \"dd/MM/yyyy\")\n\n return (\n <DateTimePickerRoot\n currentTimeInTimezone={currentTimeInTimezone}\n disabled={disabled}\n disablePast={disablePast}\n format={resolvedFormat}\n locale={locale}\n onBlur={onBlur}\n onChange={onChange}\n value={value}\n >\n <Field\n className={mergeClasses(styles.root, className)}\n data-slot=\"datetimepicker\"\n {...{ [SLOT_ATTR]: \"datetimepicker\" }}\n ref={ref}\n variant={fieldVariant}\n >\n {label && (\n <FieldLabel id={labelId} htmlFor={inputId}>\n {label}\n </FieldLabel>\n )}\n <DateTimePickerLabelProvider value={labelling}>\n <DateTimePickerPopover>\n <DateTimePickerInput\n editable={editable}\n iconPosition={iconPosition}\n inputAriaLabel={inputAriaLabel}\n keyboardIcon={keyboardIcon}\n openPickerAriaLabel={openPickerAriaLabel}\n placeholder={resolvedPlaceholder}\n testId={testId}\n />\n <DateTimePickerPanel\n cancelLabel={cancelLabel}\n hoursLabel={hoursLabel}\n minuteStep={minuteStep}\n minutesLabel={minutesLabel}\n nextMonthLabel={nextMonthLabel}\n okLabel={okLabel}\n previousMonthLabel={previousMonthLabel}\n showTimePicker={showTimePicker}\n showTodayButton={showTodayButton}\n showWeekNumbers={showWeekNumbers}\n timePickerPosition={timePickerPosition}\n todayLabel={todayLabel}\n />\n </DateTimePickerPopover>\n </DateTimePickerLabelProvider>\n {error && <FieldError>{error}</FieldError>}\n </Field>\n </DateTimePickerRoot>\n )\n }\n)\n\nexport {\n DateTimePicker,\n DateTimePickerRoot,\n DateTimePickerInput,\n DateTimePickerPopover,\n DateTimePickerPanel,\n Calendar,\n TimePicker,\n}\n\nexport type {\n DateTimePickerProps,\n DateTimePickerRootProps,\n DateTimePickerInputProps,\n DateTimePickerPopoverProps,\n DateTimePickerPanelProps,\n CalendarProps,\n TimePickerProps,\n DateTimePickerLocale,\n}\n"],"names":["useStyles","makeZenithStyles","boxModel","DateTimePicker","React","value","onChange","onBlur","disabled","disablePast","label","error","placeholder","format","locale","className","keyboardIcon","okLabel","cancelLabel","inputAriaLabel","openPickerAriaLabel","previousMonthLabel","nextMonthLabel","hoursLabel","minutesLabel","showTodayButton","todayLabel","showWeekNumbers","testId","currentTimeInTimezone","timePickerPosition","showTimePicker","editable","iconPosition","minuteStep","ref","styles","fieldVariant","inputId","labelId","labelling","resolvedFormat","resolvedPlaceholder","jsx","DateTimePickerRoot","jsxs","Field","mergeClasses","SLOT_ATTR","FieldLabel","DateTimePickerLabelProvider","DateTimePickerPopover","DateTimePickerInput","DateTimePickerPanel","FieldError"],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsxs as U, jsx as m } from "react/jsx-runtime";
|
|
2
2
|
import * as n from "react";
|
|
3
|
-
import { SLOT_ATTR as M, mergeClasses as g, shorthands as y } from "@epilot/zenith-runtime/v1";
|
|
3
|
+
import { SLOT_ATTR as M, mergeClasses as g, shorthands as y } from "@epilot/zenith-runtime/v1/core.js";
|
|
4
4
|
import { makeZenithStyles as V } from "../../styles/make-styles.js";
|
|
5
5
|
import { nativeControl as _, boxModel as h } from "../../styles/host-reset.js";
|
|
6
6
|
import { accentSolidHover as z, accentContrast as G, accentSolid as L, fontWeightSemibold as N, grayA4 as X, grayA11 as Z, leadingSm as J, textSm as K, grayA8 as P, leadingBase as Q, textBase as tt, grayA6 as et, radiusMd as R, grayA5 as rt, spacingElement1 as ot } from "../../tokens/index.js";
|
|
@@ -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 { boxModel, nativeControl } from \"../../styles/host-reset\"\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 ...boxModel,\n height: \"100%\",\n },\n column: {\n ...boxModel,\n display: \"flex\",\n flexDirection: \"column\",\n alignItems: \"center\",\n width: \"3.5rem\",\n },\n columnFillHeight: {\n ...boxModel,\n minHeight: \"0\",\n },\n scroll: {\n ...boxModel,\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 ...boxModel,\n height: \"8rem\",\n },\n scrollFill: {\n ...boxModel,\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 ...nativeControl,\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.accentSolid,\n color: tokens.accentContrast,\n \":hover\": {\n backgroundColor: tokens.accentSolidHover,\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","boxModel","tokens.radiusMd","tokens.grayA5","tokens.grayA6","tokens.textBase","tokens.leadingBase","tokens.fontWeightSemibold","tokens.grayA8","nativeControl","tokens.textSm","tokens.leadingSm","tokens.grayA11","tokens.grayA4","tokens.accentSolid","tokens.accentContrast","tokens.accentSolidHover","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/core\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { boxModel, nativeControl } from \"../../styles/host-reset\"\nimport * as tokens from \"../../tokens\"\n\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 ...boxModel,\n height: \"100%\",\n },\n column: {\n ...boxModel,\n display: \"flex\",\n flexDirection: \"column\",\n alignItems: \"center\",\n width: \"3.5rem\",\n },\n columnFillHeight: {\n ...boxModel,\n minHeight: \"0\",\n },\n scroll: {\n ...boxModel,\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 ...boxModel,\n height: \"8rem\",\n },\n scrollFill: {\n ...boxModel,\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 ...nativeControl,\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.accentSolid,\n color: tokens.accentContrast,\n \":hover\": {\n backgroundColor: tokens.accentSolidHover,\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","boxModel","tokens.radiusMd","tokens.grayA5","tokens.grayA6","tokens.textBase","tokens.leadingBase","tokens.fontWeightSemibold","tokens.grayA8","nativeControl","tokens.textSm","tokens.leadingSm","tokens.grayA11","tokens.grayA4","tokens.accentSolid","tokens.accentContrast","tokens.accentSolidHover","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,7 +1,7 @@
|
|
|
1
1
|
import { jsx as r, jsxs as T, Fragment as _ } from "react/jsx-runtime";
|
|
2
2
|
import * as l from "react";
|
|
3
3
|
import { Dialog as d } from "../../_virtual/_zenith-runtime-family_dialog.js";
|
|
4
|
-
import { mergeClasses as f, SLOT_ATTR as g, shorthands as c } from "@epilot/zenith-runtime/v1";
|
|
4
|
+
import { mergeClasses as f, SLOT_ATTR as g, shorthands as c } from "@epilot/zenith-runtime/v1/core.js";
|
|
5
5
|
import { useAppearanceAttributes as E } from "../appearance-boundary/appearance-boundary.js";
|
|
6
6
|
import { useDensity as j } from "../density-provider/density-provider.js";
|
|
7
7
|
import { makeZenithStyles as Z } from "../../styles/make-styles.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"dialog.js","sources":["../../../src/components/dialog/dialog.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { Dialog as DialogPrimitive } from \"@base-ui/react/dialog\"\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1\"\n\nimport { useAppearanceAttributes } from \"../appearance-boundary/appearance-boundary\"\nimport { useDensity } from \"../density-provider/density-provider\"\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { boxModel, nativeControl } from \"../../styles/host-reset\"\nimport { OVERLAY_Z_INDEX } from \"../../styles/overlay-layer\"\nimport * as tokens from \"../../tokens\"\n\nconst easeOut = \"cubic-bezier(0.4, 0, 0.2, 1)\"\nconst easeIn = \"cubic-bezier(0.4, 0, 1, 1)\"\n\nconst useStyles = makeZenithStyles({\n // For the bare native `<button>` a Trigger/Close renders. Not applied under `asChild`, where the\n // child owns its own element and two atom sets would race for the same properties.\n nativeTrigger: {\n ...nativeControl,\n },\n overlay: {\n position: \"fixed\",\n ...shorthands.inset(0),\n zIndex: OVERLAY_Z_INDEX,\n backgroundColor: \"rgb(0 0 0 / 50%)\",\n transitionProperty: \"opacity\",\n transitionDuration: \"150ms\",\n transitionTimingFunction: easeOut,\n \"&[data-starting-style]\": { opacity: 0 },\n \"&[data-ending-style]\": { opacity: 0, transitionTimingFunction: easeIn },\n \"@media (prefers-reduced-motion: reduce)\": {\n transitionDuration: \"0.01ms\",\n },\n },\n content: {\n ...boxModel,\n backgroundColor: tokens.body,\n position: \"fixed\",\n top: \"50%\",\n left: \"50%\",\n zIndex: OVERLAY_Z_INDEX,\n display: \"grid\",\n width: \"100%\",\n maxWidth: \"calc(100% - 2rem)\",\n transform: \"translate(-50%, -50%)\",\n ...shorthands.gap(tokens.spacingLayout1),\n ...shorthands.borderRadius(tokens.radiusXl),\n ...shorthands.border(\"1px\", \"solid\", tokens.grayA1),\n // v1 shadow-lg; elevation has no token in this package.\n boxShadow: \"0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a\",\n transitionProperty: \"opacity, transform\",\n transitionDuration: \"150ms\",\n transitionTimingFunction: easeOut,\n \"&[data-starting-style]\": {\n opacity: 0,\n transform: \"translate(-50%, -50%) scale(0.95)\",\n },\n \"&[data-ending-style]\": {\n opacity: 0,\n transform: \"translate(-50%, -50%) scale(0.95)\",\n transitionTimingFunction: easeIn,\n },\n \"@media (prefers-reduced-motion: reduce)\": {\n transitionDuration: \"0.01ms\",\n },\n \"&[data-size='sm']\": { maxWidth: tokens.containerSm },\n \"&[data-size='md']\": { maxWidth: tokens.containerMd },\n \"&[data-size='lg']\": { maxWidth: tokens.containerLg },\n \"&[data-size='xl']\": { maxWidth: tokens.containerXl },\n \"&[data-size='2xl']\": { maxWidth: tokens.container2xl },\n \"&[data-size='3xl']\": { maxWidth: tokens.container3xl },\n \"&[data-size='4xl']\": { maxWidth: tokens.container4xl },\n \"&[data-size='5xl']\": { maxWidth: tokens.container5xl },\n \"&[data-size='full-width']\": { maxWidth: \"100%\" },\n },\n contentPadding: {\n ...boxModel,\n ...shorthands.padding(tokens.spacingGroup2),\n },\n close: {\n \":focus-visible\": {\n outlineWidth: \"2px\",\n outlineStyle: \"solid\",\n outlineOffset: \"2px\",\n outlineColor: tokens.focusRing,\n },\n },\n closeButton: {\n ...nativeControl,\n position: \"absolute\",\n top: tokens.spacingGroup2,\n right: tokens.spacingGroup2,\n ...shorthands.padding(tokens.spacingElement2),\n // v1 rounded-full; no full-radius token exists in this package.\n borderRadius: \"9999px\",\n cursor: \"pointer\",\n color: tokens.accentA11,\n \":hover\": {\n backgroundColor: tokens.accentSoft,\n },\n \":focus-visible\": {\n outlineWidth: \"2px\",\n outlineStyle: \"solid\",\n outlineOffset: \"2px\",\n outlineColor: tokens.focusRing,\n },\n \":disabled\": {\n pointerEvents: \"none\",\n },\n \"& svg\": {\n display: \"block\",\n pointerEvents: \"none\",\n flexShrink: 0,\n width: \"1rem\",\n height: \"1rem\",\n },\n },\n header: {\n display: \"flex\",\n flexDirection: \"column\",\n ...shorthands.gap(tokens.spacingElement2),\n textAlign: \"left\",\n },\n footer: {\n display: \"flex\",\n ...shorthands.gap(tokens.spacingElement2),\n justifyContent: \"flex-end\",\n },\n title: {\n ...shorthands.margin(0),\n fontSize: tokens.textLg,\n lineHeight: tokens.leadingLg,\n fontWeight: tokens.fontWeightSemibold,\n color: tokens.grayA12,\n },\n description: {\n ...shorthands.margin(0),\n color: tokens.grayA11,\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n },\n srOnly: {\n ...boxModel,\n position: \"absolute\",\n width: \"1px\",\n height: \"1px\",\n padding: 0,\n margin: \"-1px\",\n overflow: \"hidden\",\n clip: \"rect(0, 0, 0, 0)\",\n whiteSpace: \"nowrap\",\n },\n})\n\nconst XIcon = React.forwardRef<SVGSVGElement, React.SVGProps<SVGSVGElement>>(\n function XIcon(props, ref) {\n return (\n <svg\n ref={ref}\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 9 9\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n {...props}\n >\n <path\n d=\"M4.38333 5.31667L1.11667 8.58333C0.994445 8.70556 0.838889 8.76667 0.65 8.76667C0.461111 8.76667 0.305556 8.70556 0.183333 8.58333C0.0611111 8.46111 0 8.30556 0 8.11667C0 7.92778 0.0611111 7.77222 0.183333 7.65L3.45 4.38333L0.183333 1.11667C0.0611111 0.994445 0 0.838889 0 0.65C0 0.461111 0.0611111 0.305556 0.183333 0.183333C0.305556 0.0611111 0.461111 0 0.65 0C0.838889 0 0.994445 0.0611111 1.11667 0.183333L4.38333 3.45L7.65 0.183333C7.77222 0.0611111 7.92778 0 8.11667 0C8.30556 0 8.46111 0.0611111 8.58333 0.183333C8.70556 0.305556 8.76667 0.461111 8.76667 0.65C8.76667 0.838889 8.70556 0.994445 8.58333 1.11667L5.31667 4.38333L8.58333 7.65C8.70556 7.77222 8.76667 7.92778 8.76667 8.11667C8.76667 8.30556 8.70556 8.46111 8.58333 8.58333C8.46111 8.70556 8.30556 8.76667 8.11667 8.76667C7.92778 8.76667 7.77222 8.70556 7.65 8.58333L4.38333 5.31667Z\"\n fill=\"currentColor\"\n />\n </svg>\n )\n }\n)\n\n// A single child can arrive wrapped in a one-element array depending on the JSX runtime (MDX call\n// sites do this). Radix's Slot normalised that, so the `asChild` shim has to as well.\nfunction onlySlotChild(children: React.ReactNode) {\n const elements = React.Children.toArray(children).filter(React.isValidElement)\n return elements.length === 1 ? elements[0] : undefined\n}\n\n/**\n * Radix's `asChild` over Base UI's `render`: the single child element becomes the part and keeps\n * its own children, since Base UI lets the rendered element's props win the merge.\n */\nfunction slotProps(asChild: boolean, children: React.ReactNode) {\n const child = asChild ? onlySlotChild(children) : undefined\n return child ? { render: child } : { children }\n}\n\n/**\n * A part's props as they were under Radix: its native element's own (DOM attributes, React's\n * handler types, a `CSSProperties` style, a string `className`, `ref`) plus `asChild`. Base UI's\n * prop types widen `style` and `className` to functions of the part's state, wrap every handler's\n * event in `BaseUIEvent` and add props of their own; none of that reaches the public surface.\n */\ntype NativePartProps<Tag extends \"button\" | \"div\" | \"h2\" | \"p\"> =\n React.ComponentProps<Tag> & {\n /** Renders the single child element as this part, merging its props and behaviour onto it. */\n asChild?: boolean\n }\n\n/**\n * Radix-shaped focus interception over Base UI's `initialFocus`/`finalFocus`. `preventDefault()`\n * leaves focus where it is; otherwise the default move happens, because Base UI reads a callback\n * that returns `undefined` as \"move nothing\".\n */\nfunction radixFocusCallback(handler: ((event: Event) => void) | undefined) {\n if (!handler) return undefined\n\n return () => {\n const event = new Event(\"focus\", { cancelable: true })\n const before = document.activeElement\n handler(event)\n const moved = document.activeElement\n // Base UI calls `finalFocus` inside React's commit, and React then restores the focus it saw\n // before the commit. Radix ran this handler after the commit, so a handler that moves focus\n // itself has its move applied again once the commit is done.\n if (moved !== before && moved instanceof HTMLElement) {\n queueMicrotask(() => moved.focus())\n }\n return !event.defaultPrevented\n }\n}\n\n/**\n * What `onOpenChange` receives as its second argument: Base UI's change details, declared in\n * Zenith. Base UI's own type drags its dialog store into the published declarations, and\n * TypeScript 4 cannot parse that store. `event` narrows with `reason`, as it does in Base UI.\n */\ntype DialogOpenChangeDetails = (\n | {\n reason: \"trigger-press\"\n event: MouseEvent | PointerEvent | TouchEvent | KeyboardEvent\n }\n | { reason: \"outside-press\"; event: MouseEvent | PointerEvent | TouchEvent }\n | { reason: \"escape-key\"; event: KeyboardEvent }\n | { reason: \"close-press\"; event: MouseEvent | KeyboardEvent | PointerEvent }\n | { reason: \"focus-out\"; event: FocusEvent | KeyboardEvent }\n | { reason: \"imperative-action\"; event: Event }\n | { reason: \"none\"; event: Event }\n) & {\n /** Keeps the dialog in its current state. */\n cancel: () => void\n /** Lets the event propagate where the dialog would otherwise stop it. */\n allowPropagation: () => void\n isCanceled: boolean\n isPropagationAllowed: boolean\n /** The element that caused the change, if any. */\n trigger: Element | undefined\n /** Keeps the dialog's elements mounted after it closes. */\n preventUnmountOnClose: () => void\n}\n\nexport type DialogProps = {\n children?: React.ReactNode\n open?: boolean\n defaultOpen?: boolean\n modal?: boolean\n /**\n * Called when the dialog opens or closes. `eventDetails.reason` says why (`trigger-press`,\n * `escape-key`, `outside-press`, `focus-out`, `close-press`) and `eventDetails.cancel()` keeps\n * the dialog in its current state.\n */\n onOpenChange?: (open: boolean, eventDetails: DialogOpenChangeDetails) => void\n}\n\nexport const Dialog = React.forwardRef<HTMLElement, DialogProps>(\n function Dialog({ onOpenChange, ...props }, _ref) {\n return (\n <DialogPrimitive.Root\n data-slot=\"dialog\"\n onOpenChange={(open, eventDetails) => {\n // A layer inside (a Volt select or popover, which run on Radix, or a control handling\n // the key itself) prevents the Escape it consumes, but Base UI dismisses regardless, so\n // one Escape would close both. Honour the handled event. Consumers still mix Zenith with\n // Volt on one page, so this stays after the Radix teardown (D12).\n if (\n eventDetails.reason === \"escape-key\" &&\n eventDetails.event.defaultPrevented\n ) {\n eventDetails.cancel()\n return\n }\n onOpenChange?.(open, eventDetails)\n }}\n {...props}\n />\n )\n }\n)\n\nexport type DialogTriggerProps = NativePartProps<\"button\">\n\nexport const DialogTrigger = React.forwardRef<\n HTMLButtonElement,\n DialogTriggerProps\n>(function DialogTrigger(\n { asChild = false, children, className, ...props },\n ref\n) {\n const styles = useStyles()\n\n return (\n <DialogPrimitive.Trigger\n ref={ref}\n data-slot=\"dialog-trigger\"\n {...{ [SLOT_ATTR]: \"dialog-trigger\" }}\n className={mergeClasses(!asChild && styles.nativeTrigger, className)}\n {...props}\n {...slotProps(asChild, children)}\n />\n )\n})\n\n// Lets DialogContent supply Base UI's required Portal itself when no DialogPortal wraps it, as\n// Radix rendered content inline without one.\nconst DialogPortalPresenceContext = React.createContext(false)\n\nexport type DialogPortalProps = {\n children?: React.ReactNode\n /** The element the overlay and the content portal into; `document.body` when omitted or null. */\n container?: Element | DocumentFragment | null\n /** Keeps the overlay and the content mounted while the dialog is closed. */\n forceMount?: true\n}\n\nexport const DialogPortal = React.forwardRef<HTMLElement, DialogPortalProps>(\n function DialogPortal({ container, forceMount, ...props }, ref) {\n return (\n <DialogPortalPresenceContext.Provider value={true}>\n <DialogPrimitive.Portal\n // Base UI types the ref as its portal div, which any HTMLElement ref can hold.\n ref={ref as React.Ref<HTMLDivElement>}\n data-slot=\"dialog-portal\"\n {...{ [SLOT_ATTR]: \"dialog-portal\" }}\n // Radix took any Element or DocumentFragment, null meaning the body. Base UI hands a\n // node straight to createPortal, which takes either, but reads null as \"wait for one\".\n container={(container ?? undefined) as HTMLElement | undefined}\n keepMounted={forceMount}\n {...props}\n />\n </DialogPortalPresenceContext.Provider>\n )\n }\n)\n\nexport type DialogOverlayProps = NativePartProps<\"div\"> & {\n /** Kept for compatibility: the overlay stays mounted whenever DialogPortal's `forceMount` keeps the portal mounted. */\n forceMount?: true\n}\n\nexport const DialogOverlay = React.forwardRef<\n HTMLDivElement,\n DialogOverlayProps\n>(function DialogOverlay(\n { asChild = false, children, className, forceMount: _forceMount, ...props },\n ref\n) {\n const styles = useStyles()\n // The overlay is portalled too, so it re-stamps the boundary's appearance like the content (#8).\n const appearance = useAppearanceAttributes()\n\n return (\n <DialogPrimitive.Backdrop\n ref={ref}\n // Base UI renders no backdrop for a dialog nested in another; Radix's overlay always rendered,\n // dimming the dialog beneath.\n forceRender\n data-slot=\"dialog-overlay\"\n {...{ [SLOT_ATTR]: \"dialog-overlay\" }}\n {...appearance}\n className={mergeClasses(styles.overlay, className)}\n {...props}\n {...slotProps(asChild, children)}\n />\n )\n})\n\nexport type DialogContentSize =\n \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\" | \"3xl\" | \"4xl\" | \"5xl\" | \"full-width\"\n\nexport type DialogContentProps = NativePartProps<\"div\"> & {\n showCloseButton?: boolean\n /**\n * Accessible name of the built-in close button, read by screen readers. Pass a translated\n * string for any locale other than English. Defaults to \"Close\".\n */\n closeButtonLabel?: string\n size?: DialogContentSize\n flush?: boolean\n /**\n * Keeps the content mounted while the dialog is closed. Inside DialogPortal, the portal's\n * `forceMount` decides.\n */\n forceMount?: true\n /** Called before focus moves into the dialog; `preventDefault()` leaves focus where it is. */\n onOpenAutoFocus?: (event: Event) => void\n /** Called before focus returns on close; `preventDefault()` skips the return. */\n onCloseAutoFocus?: (event: Event) => void\n}\n\nexport const DialogContent = React.forwardRef<\n HTMLDivElement,\n DialogContentProps\n>(function DialogContent(\n {\n asChild = false,\n className,\n children,\n showCloseButton = true,\n closeButtonLabel = \"Close\",\n flush = false,\n size = \"lg\",\n forceMount,\n onOpenAutoFocus,\n onCloseAutoFocus,\n ...props\n },\n ref\n) {\n const styles = useStyles()\n const hasPortal = React.useContext(DialogPortalPresenceContext)\n // DENSITY-SPEC.md §4.4 — portal content boundary: stamp only an explicit override, never a\n // default, so an ambient shell density (already reaching this portal via ordinary DOM\n // inheritance) isn't masked.\n const override = useDensity()\n // SPEC.md §2 rule 3 — the same portal asymmetry, for the appearance pair: re-stamp the\n // nearest explicit AppearanceBoundary's mode+surface, or neither attribute when there is\n // none, leaving live shell inheritance in place.\n const appearance = useAppearanceAttributes()\n\n const closeButton = showCloseButton && (\n <DialogPrimitive.Close\n data-slot=\"dialog-close\"\n {...{ [SLOT_ATTR]: \"dialog-close\" }}\n className={styles.closeButton}\n >\n <XIcon />\n <span className={styles.srOnly}>{closeButtonLabel}</span>\n </DialogPrimitive.Close>\n )\n const child = asChild ? onlySlotChild(children) : undefined\n // The child keeps its own children, so the built-in close button joins them there.\n const content = child\n ? {\n render: React.cloneElement(\n child,\n undefined,\n (child.props as { children?: React.ReactNode }).children,\n closeButton\n ),\n }\n : {\n children: (\n <>\n {children}\n {closeButton}\n </>\n ),\n }\n\n const popup = (\n <DialogPrimitive.Popup\n ref={ref}\n data-slot=\"dialog-content\"\n {...{ [SLOT_ATTR]: \"dialog-content\" }}\n {...(override !== undefined ? { \"data-density\": override } : {})}\n {...appearance}\n data-size={size}\n initialFocus={radixFocusCallback(onOpenAutoFocus)}\n finalFocus={radixFocusCallback(onCloseAutoFocus)}\n className={mergeClasses(\n styles.content,\n !flush && styles.contentPadding,\n className\n )}\n {...props}\n {...content}\n />\n )\n\n // Base UI's Popup requires a Portal ancestor; Radix rendered inline without one.\n return hasPortal ? (\n popup\n ) : (\n <DialogPrimitive.Portal keepMounted={forceMount}>\n {popup}\n </DialogPrimitive.Portal>\n )\n})\n\nexport type DialogCloseProps = NativePartProps<\"button\">\n\nexport const DialogClose = React.forwardRef<\n HTMLButtonElement,\n DialogCloseProps\n>(function DialogClose(\n { asChild = false, className, children, ...props },\n ref\n) {\n const styles = useStyles()\n\n return (\n <DialogPrimitive.Close\n ref={ref}\n data-slot=\"dialog-close\"\n {...{ [SLOT_ATTR]: \"dialog-close\" }}\n className={mergeClasses(\n !asChild && styles.nativeTrigger,\n styles.close,\n className\n )}\n {...props}\n {...slotProps(asChild, children)}\n />\n )\n})\n\nexport type DialogHeaderProps = React.ComponentProps<\"div\">\n\nexport const DialogHeader = React.forwardRef<HTMLDivElement, DialogHeaderProps>(\n function DialogHeader({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <div\n ref={ref}\n data-slot=\"dialog-header\"\n {...{ [SLOT_ATTR]: \"dialog-header\" }}\n className={mergeClasses(styles.header, className)}\n {...props}\n />\n )\n }\n)\n\nexport type DialogFooterProps = React.ComponentProps<\"div\">\n\nexport const DialogFooter = React.forwardRef<HTMLDivElement, DialogFooterProps>(\n function DialogFooter({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <div\n ref={ref}\n data-slot=\"dialog-footer\"\n {...{ [SLOT_ATTR]: \"dialog-footer\" }}\n className={mergeClasses(styles.footer, className)}\n {...props}\n />\n )\n }\n)\n\nexport type DialogTitleProps = NativePartProps<\"h2\">\n\nexport const DialogTitle = React.forwardRef<\n HTMLHeadingElement,\n DialogTitleProps\n>(function DialogTitle(\n { asChild = false, children, className, ...props },\n ref\n) {\n const styles = useStyles()\n\n return (\n <DialogPrimitive.Title\n ref={ref}\n data-slot=\"dialog-title\"\n {...{ [SLOT_ATTR]: \"dialog-title\" }}\n className={mergeClasses(styles.title, className)}\n {...props}\n {...slotProps(asChild, children)}\n />\n )\n})\n\nexport type DialogDescriptionProps = NativePartProps<\"p\">\n\nexport const DialogDescription = React.forwardRef<\n HTMLParagraphElement,\n DialogDescriptionProps\n>(function DialogDescription(\n { asChild = false, children, className, ...props },\n ref\n) {\n const styles = useStyles()\n\n return (\n <DialogPrimitive.Description\n ref={ref}\n data-slot=\"dialog-description\"\n {...{ [SLOT_ATTR]: \"dialog-description\" }}\n className={mergeClasses(styles.description, className)}\n {...props}\n {...slotProps(asChild, children)}\n />\n )\n})\n"],"names":["easeOut","easeIn","useStyles","makeZenithStyles","nativeControl","shorthands","OVERLAY_Z_INDEX","boxModel","tokens.body","tokens.spacingLayout1","tokens.radiusXl","tokens.grayA1","tokens.containerSm","tokens.containerMd","tokens.containerLg","tokens.containerXl","tokens.container2xl","tokens.container3xl","tokens.container4xl","tokens.container5xl","tokens.spacingGroup2","tokens.focusRing","tokens.spacingElement2","tokens.accentA11","tokens.accentSoft","tokens.textLg","tokens.leadingLg","tokens.fontWeightSemibold","tokens.grayA12","tokens.grayA11","tokens.textSm","tokens.leadingSm","XIcon","React","props","ref","jsx","onlySlotChild","children","elements","slotProps","asChild","child","radixFocusCallback","handler","event","before","moved","Dialog","onOpenChange","_ref","DialogPrimitive","open","eventDetails","DialogTrigger","className","styles","SLOT_ATTR","mergeClasses","DialogPortalPresenceContext","DialogPortal","container","forceMount","DialogOverlay","_forceMount","appearance","useAppearanceAttributes","DialogContent","showCloseButton","closeButtonLabel","flush","size","onOpenAutoFocus","onCloseAutoFocus","hasPortal","override","useDensity","closeButton","jsxs","content","Fragment","popup","DialogClose","DialogHeader","DialogFooter","DialogTitle","DialogDescription"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"dialog.js","sources":["../../../src/components/dialog/dialog.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { Dialog as DialogPrimitive } from \"@base-ui/react/dialog\"\nimport { mergeClasses, shorthands } from \"@epilot/zenith-runtime/v1/core\"\n\nimport { useAppearanceAttributes } from \"../appearance-boundary/appearance-boundary\"\nimport { useDensity } from \"../density-provider/density-provider\"\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport { boxModel, nativeControl } from \"../../styles/host-reset\"\nimport { OVERLAY_Z_INDEX } from \"../../styles/overlay-layer\"\nimport * as tokens from \"../../tokens\"\n\nconst easeOut = \"cubic-bezier(0.4, 0, 0.2, 1)\"\nconst easeIn = \"cubic-bezier(0.4, 0, 1, 1)\"\n\nconst useStyles = makeZenithStyles({\n // For the bare native `<button>` a Trigger/Close renders. Not applied under `asChild`, where the\n // child owns its own element and two atom sets would race for the same properties.\n nativeTrigger: {\n ...nativeControl,\n },\n overlay: {\n position: \"fixed\",\n ...shorthands.inset(0),\n zIndex: OVERLAY_Z_INDEX,\n backgroundColor: \"rgb(0 0 0 / 50%)\",\n transitionProperty: \"opacity\",\n transitionDuration: \"150ms\",\n transitionTimingFunction: easeOut,\n \"&[data-starting-style]\": { opacity: 0 },\n \"&[data-ending-style]\": { opacity: 0, transitionTimingFunction: easeIn },\n \"@media (prefers-reduced-motion: reduce)\": {\n transitionDuration: \"0.01ms\",\n },\n },\n content: {\n ...boxModel,\n backgroundColor: tokens.body,\n position: \"fixed\",\n top: \"50%\",\n left: \"50%\",\n zIndex: OVERLAY_Z_INDEX,\n display: \"grid\",\n width: \"100%\",\n maxWidth: \"calc(100% - 2rem)\",\n transform: \"translate(-50%, -50%)\",\n ...shorthands.gap(tokens.spacingLayout1),\n ...shorthands.borderRadius(tokens.radiusXl),\n ...shorthands.border(\"1px\", \"solid\", tokens.grayA1),\n // v1 shadow-lg; elevation has no token in this package.\n boxShadow: \"0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a\",\n transitionProperty: \"opacity, transform\",\n transitionDuration: \"150ms\",\n transitionTimingFunction: easeOut,\n \"&[data-starting-style]\": {\n opacity: 0,\n transform: \"translate(-50%, -50%) scale(0.95)\",\n },\n \"&[data-ending-style]\": {\n opacity: 0,\n transform: \"translate(-50%, -50%) scale(0.95)\",\n transitionTimingFunction: easeIn,\n },\n \"@media (prefers-reduced-motion: reduce)\": {\n transitionDuration: \"0.01ms\",\n },\n \"&[data-size='sm']\": { maxWidth: tokens.containerSm },\n \"&[data-size='md']\": { maxWidth: tokens.containerMd },\n \"&[data-size='lg']\": { maxWidth: tokens.containerLg },\n \"&[data-size='xl']\": { maxWidth: tokens.containerXl },\n \"&[data-size='2xl']\": { maxWidth: tokens.container2xl },\n \"&[data-size='3xl']\": { maxWidth: tokens.container3xl },\n \"&[data-size='4xl']\": { maxWidth: tokens.container4xl },\n \"&[data-size='5xl']\": { maxWidth: tokens.container5xl },\n \"&[data-size='full-width']\": { maxWidth: \"100%\" },\n },\n contentPadding: {\n ...boxModel,\n ...shorthands.padding(tokens.spacingGroup2),\n },\n close: {\n \":focus-visible\": {\n outlineWidth: \"2px\",\n outlineStyle: \"solid\",\n outlineOffset: \"2px\",\n outlineColor: tokens.focusRing,\n },\n },\n closeButton: {\n ...nativeControl,\n position: \"absolute\",\n top: tokens.spacingGroup2,\n right: tokens.spacingGroup2,\n ...shorthands.padding(tokens.spacingElement2),\n // v1 rounded-full; no full-radius token exists in this package.\n borderRadius: \"9999px\",\n cursor: \"pointer\",\n color: tokens.accentA11,\n \":hover\": {\n backgroundColor: tokens.accentSoft,\n },\n \":focus-visible\": {\n outlineWidth: \"2px\",\n outlineStyle: \"solid\",\n outlineOffset: \"2px\",\n outlineColor: tokens.focusRing,\n },\n \":disabled\": {\n pointerEvents: \"none\",\n },\n \"& svg\": {\n display: \"block\",\n pointerEvents: \"none\",\n flexShrink: 0,\n width: \"1rem\",\n height: \"1rem\",\n },\n },\n header: {\n display: \"flex\",\n flexDirection: \"column\",\n ...shorthands.gap(tokens.spacingElement2),\n textAlign: \"left\",\n },\n footer: {\n display: \"flex\",\n ...shorthands.gap(tokens.spacingElement2),\n justifyContent: \"flex-end\",\n },\n title: {\n ...shorthands.margin(0),\n fontSize: tokens.textLg,\n lineHeight: tokens.leadingLg,\n fontWeight: tokens.fontWeightSemibold,\n color: tokens.grayA12,\n },\n description: {\n ...shorthands.margin(0),\n color: tokens.grayA11,\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n },\n srOnly: {\n ...boxModel,\n position: \"absolute\",\n width: \"1px\",\n height: \"1px\",\n padding: 0,\n margin: \"-1px\",\n overflow: \"hidden\",\n clip: \"rect(0, 0, 0, 0)\",\n whiteSpace: \"nowrap\",\n },\n})\n\nconst XIcon = React.forwardRef<SVGSVGElement, React.SVGProps<SVGSVGElement>>(\n function XIcon(props, ref) {\n return (\n <svg\n ref={ref}\n width=\"12\"\n height=\"12\"\n viewBox=\"0 0 9 9\"\n fill=\"none\"\n xmlns=\"http://www.w3.org/2000/svg\"\n {...props}\n >\n <path\n d=\"M4.38333 5.31667L1.11667 8.58333C0.994445 8.70556 0.838889 8.76667 0.65 8.76667C0.461111 8.76667 0.305556 8.70556 0.183333 8.58333C0.0611111 8.46111 0 8.30556 0 8.11667C0 7.92778 0.0611111 7.77222 0.183333 7.65L3.45 4.38333L0.183333 1.11667C0.0611111 0.994445 0 0.838889 0 0.65C0 0.461111 0.0611111 0.305556 0.183333 0.183333C0.305556 0.0611111 0.461111 0 0.65 0C0.838889 0 0.994445 0.0611111 1.11667 0.183333L4.38333 3.45L7.65 0.183333C7.77222 0.0611111 7.92778 0 8.11667 0C8.30556 0 8.46111 0.0611111 8.58333 0.183333C8.70556 0.305556 8.76667 0.461111 8.76667 0.65C8.76667 0.838889 8.70556 0.994445 8.58333 1.11667L5.31667 4.38333L8.58333 7.65C8.70556 7.77222 8.76667 7.92778 8.76667 8.11667C8.76667 8.30556 8.70556 8.46111 8.58333 8.58333C8.46111 8.70556 8.30556 8.76667 8.11667 8.76667C7.92778 8.76667 7.77222 8.70556 7.65 8.58333L4.38333 5.31667Z\"\n fill=\"currentColor\"\n />\n </svg>\n )\n }\n)\n\n// A single child can arrive wrapped in a one-element array depending on the JSX runtime (MDX call\n// sites do this). Radix's Slot normalised that, so the `asChild` shim has to as well.\nfunction onlySlotChild(children: React.ReactNode) {\n const elements = React.Children.toArray(children).filter(React.isValidElement)\n return elements.length === 1 ? elements[0] : undefined\n}\n\n/**\n * Radix's `asChild` over Base UI's `render`: the single child element becomes the part and keeps\n * its own children, since Base UI lets the rendered element's props win the merge.\n */\nfunction slotProps(asChild: boolean, children: React.ReactNode) {\n const child = asChild ? onlySlotChild(children) : undefined\n return child ? { render: child } : { children }\n}\n\n/**\n * A part's props as they were under Radix: its native element's own (DOM attributes, React's\n * handler types, a `CSSProperties` style, a string `className`, `ref`) plus `asChild`. Base UI's\n * prop types widen `style` and `className` to functions of the part's state, wrap every handler's\n * event in `BaseUIEvent` and add props of their own; none of that reaches the public surface.\n */\ntype NativePartProps<Tag extends \"button\" | \"div\" | \"h2\" | \"p\"> =\n React.ComponentProps<Tag> & {\n /** Renders the single child element as this part, merging its props and behaviour onto it. */\n asChild?: boolean\n }\n\n/**\n * Radix-shaped focus interception over Base UI's `initialFocus`/`finalFocus`. `preventDefault()`\n * leaves focus where it is; otherwise the default move happens, because Base UI reads a callback\n * that returns `undefined` as \"move nothing\".\n */\nfunction radixFocusCallback(handler: ((event: Event) => void) | undefined) {\n if (!handler) return undefined\n\n return () => {\n const event = new Event(\"focus\", { cancelable: true })\n const before = document.activeElement\n handler(event)\n const moved = document.activeElement\n // Base UI calls `finalFocus` inside React's commit, and React then restores the focus it saw\n // before the commit. Radix ran this handler after the commit, so a handler that moves focus\n // itself has its move applied again once the commit is done.\n if (moved !== before && moved instanceof HTMLElement) {\n queueMicrotask(() => moved.focus())\n }\n return !event.defaultPrevented\n }\n}\n\n/**\n * What `onOpenChange` receives as its second argument: Base UI's change details, declared in\n * Zenith. Base UI's own type drags its dialog store into the published declarations, and\n * TypeScript 4 cannot parse that store. `event` narrows with `reason`, as it does in Base UI.\n */\ntype DialogOpenChangeDetails = (\n | {\n reason: \"trigger-press\"\n event: MouseEvent | PointerEvent | TouchEvent | KeyboardEvent\n }\n | { reason: \"outside-press\"; event: MouseEvent | PointerEvent | TouchEvent }\n | { reason: \"escape-key\"; event: KeyboardEvent }\n | { reason: \"close-press\"; event: MouseEvent | KeyboardEvent | PointerEvent }\n | { reason: \"focus-out\"; event: FocusEvent | KeyboardEvent }\n | { reason: \"imperative-action\"; event: Event }\n | { reason: \"none\"; event: Event }\n) & {\n /** Keeps the dialog in its current state. */\n cancel: () => void\n /** Lets the event propagate where the dialog would otherwise stop it. */\n allowPropagation: () => void\n isCanceled: boolean\n isPropagationAllowed: boolean\n /** The element that caused the change, if any. */\n trigger: Element | undefined\n /** Keeps the dialog's elements mounted after it closes. */\n preventUnmountOnClose: () => void\n}\n\nexport type DialogProps = {\n children?: React.ReactNode\n open?: boolean\n defaultOpen?: boolean\n modal?: boolean\n /**\n * Called when the dialog opens or closes. `eventDetails.reason` says why (`trigger-press`,\n * `escape-key`, `outside-press`, `focus-out`, `close-press`) and `eventDetails.cancel()` keeps\n * the dialog in its current state.\n */\n onOpenChange?: (open: boolean, eventDetails: DialogOpenChangeDetails) => void\n}\n\nexport const Dialog = React.forwardRef<HTMLElement, DialogProps>(\n function Dialog({ onOpenChange, ...props }, _ref) {\n return (\n <DialogPrimitive.Root\n data-slot=\"dialog\"\n onOpenChange={(open, eventDetails) => {\n // A layer inside (a Volt select or popover, which run on Radix, or a control handling\n // the key itself) prevents the Escape it consumes, but Base UI dismisses regardless, so\n // one Escape would close both. Honour the handled event. Consumers still mix Zenith with\n // Volt on one page, so this stays after the Radix teardown (D12).\n if (\n eventDetails.reason === \"escape-key\" &&\n eventDetails.event.defaultPrevented\n ) {\n eventDetails.cancel()\n return\n }\n onOpenChange?.(open, eventDetails)\n }}\n {...props}\n />\n )\n }\n)\n\nexport type DialogTriggerProps = NativePartProps<\"button\">\n\nexport const DialogTrigger = React.forwardRef<\n HTMLButtonElement,\n DialogTriggerProps\n>(function DialogTrigger(\n { asChild = false, children, className, ...props },\n ref\n) {\n const styles = useStyles()\n\n return (\n <DialogPrimitive.Trigger\n ref={ref}\n data-slot=\"dialog-trigger\"\n {...{ [SLOT_ATTR]: \"dialog-trigger\" }}\n className={mergeClasses(!asChild && styles.nativeTrigger, className)}\n {...props}\n {...slotProps(asChild, children)}\n />\n )\n})\n\n// Lets DialogContent supply Base UI's required Portal itself when no DialogPortal wraps it, as\n// Radix rendered content inline without one.\nconst DialogPortalPresenceContext = React.createContext(false)\n\nexport type DialogPortalProps = {\n children?: React.ReactNode\n /** The element the overlay and the content portal into; `document.body` when omitted or null. */\n container?: Element | DocumentFragment | null\n /** Keeps the overlay and the content mounted while the dialog is closed. */\n forceMount?: true\n}\n\nexport const DialogPortal = React.forwardRef<HTMLElement, DialogPortalProps>(\n function DialogPortal({ container, forceMount, ...props }, ref) {\n return (\n <DialogPortalPresenceContext.Provider value={true}>\n <DialogPrimitive.Portal\n // Base UI types the ref as its portal div, which any HTMLElement ref can hold.\n ref={ref as React.Ref<HTMLDivElement>}\n data-slot=\"dialog-portal\"\n {...{ [SLOT_ATTR]: \"dialog-portal\" }}\n // Radix took any Element or DocumentFragment, null meaning the body. Base UI hands a\n // node straight to createPortal, which takes either, but reads null as \"wait for one\".\n container={(container ?? undefined) as HTMLElement | undefined}\n keepMounted={forceMount}\n {...props}\n />\n </DialogPortalPresenceContext.Provider>\n )\n }\n)\n\nexport type DialogOverlayProps = NativePartProps<\"div\"> & {\n /** Kept for compatibility: the overlay stays mounted whenever DialogPortal's `forceMount` keeps the portal mounted. */\n forceMount?: true\n}\n\nexport const DialogOverlay = React.forwardRef<\n HTMLDivElement,\n DialogOverlayProps\n>(function DialogOverlay(\n { asChild = false, children, className, forceMount: _forceMount, ...props },\n ref\n) {\n const styles = useStyles()\n // The overlay is portalled too, so it re-stamps the boundary's appearance like the content (#8).\n const appearance = useAppearanceAttributes()\n\n return (\n <DialogPrimitive.Backdrop\n ref={ref}\n // Base UI renders no backdrop for a dialog nested in another; Radix's overlay always rendered,\n // dimming the dialog beneath.\n forceRender\n data-slot=\"dialog-overlay\"\n {...{ [SLOT_ATTR]: \"dialog-overlay\" }}\n {...appearance}\n className={mergeClasses(styles.overlay, className)}\n {...props}\n {...slotProps(asChild, children)}\n />\n )\n})\n\nexport type DialogContentSize =\n \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\" | \"3xl\" | \"4xl\" | \"5xl\" | \"full-width\"\n\nexport type DialogContentProps = NativePartProps<\"div\"> & {\n showCloseButton?: boolean\n /**\n * Accessible name of the built-in close button, read by screen readers. Pass a translated\n * string for any locale other than English. Defaults to \"Close\".\n */\n closeButtonLabel?: string\n size?: DialogContentSize\n flush?: boolean\n /**\n * Keeps the content mounted while the dialog is closed. Inside DialogPortal, the portal's\n * `forceMount` decides.\n */\n forceMount?: true\n /** Called before focus moves into the dialog; `preventDefault()` leaves focus where it is. */\n onOpenAutoFocus?: (event: Event) => void\n /** Called before focus returns on close; `preventDefault()` skips the return. */\n onCloseAutoFocus?: (event: Event) => void\n}\n\nexport const DialogContent = React.forwardRef<\n HTMLDivElement,\n DialogContentProps\n>(function DialogContent(\n {\n asChild = false,\n className,\n children,\n showCloseButton = true,\n closeButtonLabel = \"Close\",\n flush = false,\n size = \"lg\",\n forceMount,\n onOpenAutoFocus,\n onCloseAutoFocus,\n ...props\n },\n ref\n) {\n const styles = useStyles()\n const hasPortal = React.useContext(DialogPortalPresenceContext)\n // DENSITY-SPEC.md §4.4 — portal content boundary: stamp only an explicit override, never a\n // default, so an ambient shell density (already reaching this portal via ordinary DOM\n // inheritance) isn't masked.\n const override = useDensity()\n // SPEC.md §2 rule 3 — the same portal asymmetry, for the appearance pair: re-stamp the\n // nearest explicit AppearanceBoundary's mode+surface, or neither attribute when there is\n // none, leaving live shell inheritance in place.\n const appearance = useAppearanceAttributes()\n\n const closeButton = showCloseButton && (\n <DialogPrimitive.Close\n data-slot=\"dialog-close\"\n {...{ [SLOT_ATTR]: \"dialog-close\" }}\n className={styles.closeButton}\n >\n <XIcon />\n <span className={styles.srOnly}>{closeButtonLabel}</span>\n </DialogPrimitive.Close>\n )\n const child = asChild ? onlySlotChild(children) : undefined\n // The child keeps its own children, so the built-in close button joins them there.\n const content = child\n ? {\n render: React.cloneElement(\n child,\n undefined,\n (child.props as { children?: React.ReactNode }).children,\n closeButton\n ),\n }\n : {\n children: (\n <>\n {children}\n {closeButton}\n </>\n ),\n }\n\n const popup = (\n <DialogPrimitive.Popup\n ref={ref}\n data-slot=\"dialog-content\"\n {...{ [SLOT_ATTR]: \"dialog-content\" }}\n {...(override !== undefined ? { \"data-density\": override } : {})}\n {...appearance}\n data-size={size}\n initialFocus={radixFocusCallback(onOpenAutoFocus)}\n finalFocus={radixFocusCallback(onCloseAutoFocus)}\n className={mergeClasses(\n styles.content,\n !flush && styles.contentPadding,\n className\n )}\n {...props}\n {...content}\n />\n )\n\n // Base UI's Popup requires a Portal ancestor; Radix rendered inline without one.\n return hasPortal ? (\n popup\n ) : (\n <DialogPrimitive.Portal keepMounted={forceMount}>\n {popup}\n </DialogPrimitive.Portal>\n )\n})\n\nexport type DialogCloseProps = NativePartProps<\"button\">\n\nexport const DialogClose = React.forwardRef<\n HTMLButtonElement,\n DialogCloseProps\n>(function DialogClose(\n { asChild = false, className, children, ...props },\n ref\n) {\n const styles = useStyles()\n\n return (\n <DialogPrimitive.Close\n ref={ref}\n data-slot=\"dialog-close\"\n {...{ [SLOT_ATTR]: \"dialog-close\" }}\n className={mergeClasses(\n !asChild && styles.nativeTrigger,\n styles.close,\n className\n )}\n {...props}\n {...slotProps(asChild, children)}\n />\n )\n})\n\nexport type DialogHeaderProps = React.ComponentProps<\"div\">\n\nexport const DialogHeader = React.forwardRef<HTMLDivElement, DialogHeaderProps>(\n function DialogHeader({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <div\n ref={ref}\n data-slot=\"dialog-header\"\n {...{ [SLOT_ATTR]: \"dialog-header\" }}\n className={mergeClasses(styles.header, className)}\n {...props}\n />\n )\n }\n)\n\nexport type DialogFooterProps = React.ComponentProps<\"div\">\n\nexport const DialogFooter = React.forwardRef<HTMLDivElement, DialogFooterProps>(\n function DialogFooter({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <div\n ref={ref}\n data-slot=\"dialog-footer\"\n {...{ [SLOT_ATTR]: \"dialog-footer\" }}\n className={mergeClasses(styles.footer, className)}\n {...props}\n />\n )\n }\n)\n\nexport type DialogTitleProps = NativePartProps<\"h2\">\n\nexport const DialogTitle = React.forwardRef<\n HTMLHeadingElement,\n DialogTitleProps\n>(function DialogTitle(\n { asChild = false, children, className, ...props },\n ref\n) {\n const styles = useStyles()\n\n return (\n <DialogPrimitive.Title\n ref={ref}\n data-slot=\"dialog-title\"\n {...{ [SLOT_ATTR]: \"dialog-title\" }}\n className={mergeClasses(styles.title, className)}\n {...props}\n {...slotProps(asChild, children)}\n />\n )\n})\n\nexport type DialogDescriptionProps = NativePartProps<\"p\">\n\nexport const DialogDescription = React.forwardRef<\n HTMLParagraphElement,\n DialogDescriptionProps\n>(function DialogDescription(\n { asChild = false, children, className, ...props },\n ref\n) {\n const styles = useStyles()\n\n return (\n <DialogPrimitive.Description\n ref={ref}\n data-slot=\"dialog-description\"\n {...{ [SLOT_ATTR]: \"dialog-description\" }}\n className={mergeClasses(styles.description, className)}\n {...props}\n {...slotProps(asChild, children)}\n />\n )\n})\n"],"names":["easeOut","easeIn","useStyles","makeZenithStyles","nativeControl","shorthands","OVERLAY_Z_INDEX","boxModel","tokens.body","tokens.spacingLayout1","tokens.radiusXl","tokens.grayA1","tokens.containerSm","tokens.containerMd","tokens.containerLg","tokens.containerXl","tokens.container2xl","tokens.container3xl","tokens.container4xl","tokens.container5xl","tokens.spacingGroup2","tokens.focusRing","tokens.spacingElement2","tokens.accentA11","tokens.accentSoft","tokens.textLg","tokens.leadingLg","tokens.fontWeightSemibold","tokens.grayA12","tokens.grayA11","tokens.textSm","tokens.leadingSm","XIcon","React","props","ref","jsx","onlySlotChild","children","elements","slotProps","asChild","child","radixFocusCallback","handler","event","before","moved","Dialog","onOpenChange","_ref","DialogPrimitive","open","eventDetails","DialogTrigger","className","styles","SLOT_ATTR","mergeClasses","DialogPortalPresenceContext","DialogPortal","container","forceMount","DialogOverlay","_forceMount","appearance","useAppearanceAttributes","DialogContent","showCloseButton","closeButtonLabel","flush","size","onOpenAutoFocus","onCloseAutoFocus","hasPortal","override","useDensity","closeButton","jsxs","content","Fragment","popup","DialogClose","DialogHeader","DialogFooter","DialogTitle","DialogDescription"],"mappings":"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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx as i, jsxs as P, Fragment as j } from "react/jsx-runtime";
|
|
2
2
|
import * as s from "react";
|
|
3
3
|
import { Dialog as f } from "../../_virtual/_zenith-runtime-family_dialog.js";
|
|
4
|
-
import { mergeClasses as p, SLOT_ATTR as u, shorthands as c } from "@epilot/zenith-runtime/v1";
|
|
4
|
+
import { mergeClasses as p, SLOT_ATTR as u, shorthands as c } from "@epilot/zenith-runtime/v1/core.js";
|
|
5
5
|
import { useAppearanceAttributes as M } from "../appearance-boundary/appearance-boundary.js";
|
|
6
6
|
import { useDensity as Z } from "../density-provider/density-provider.js";
|
|
7
7
|
import { makeZenithStyles as V } from "../../styles/make-styles.js";
|