@epilot/zenith-react 0.2.0-next.6 → 0.2.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -1
- 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 +41 -39
- 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 +1 -1
- package/dist/components/field/field-combobox.js.map +1 -1
- package/dist/components/field/field-select.js +1 -1
- 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 +15 -12
- 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 +1 -1
- package/dist/components/scroll-overflow/scroll-overflow.js.map +1 -1
- package/dist/components/segmented-control/segmented-control.js +1 -1
- package/dist/components/segmented-control/segmented-control.js.map +1 -1
- package/dist/components/select/select.js +178 -176
- 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 +59 -57
- 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 +1 -1
- 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.js +1 -1
- package/dist/lib/clear-button.js +1 -1
- package/dist/lib/clear-button.js.map +1 -1
- package/dist/lib/hidden-input-box.js +26 -0
- package/dist/lib/hidden-input-box.js.map +1 -0
- 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 +1 -1
- 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 +3 -4
package/README.md
CHANGED
|
@@ -152,7 +152,7 @@ page in the documentation's setup section has the steps for each agent.
|
|
|
152
152
|
## Which version you get
|
|
153
153
|
|
|
154
154
|
`npm install @epilot/zenith-react` resolves the `latest` dist-tag, which points
|
|
155
|
-
at `0.
|
|
155
|
+
at `0.2.0` — published to `next`, verified, then promoted by hand.
|
|
156
156
|
|
|
157
157
|
Unproven builds stay on `next` with a prerelease version:
|
|
158
158
|
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { servedFamily as o } from "../renderer/served.js";
|
|
2
|
-
import { accordion as r } from "@epilot/zenith-runtime/v1
|
|
2
|
+
import { accordion as r } from "@epilot/zenith-runtime/v1";
|
|
3
3
|
const c = o("accordion", r), n = c.Accordion;
|
|
4
4
|
export {
|
|
5
5
|
n as Accordion
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { servedFamily as o } from "../renderer/served.js";
|
|
2
|
-
import { alertDialog as r } from "@epilot/zenith-runtime/v1
|
|
2
|
+
import { alertDialog as r } from "@epilot/zenith-runtime/v1";
|
|
3
3
|
const e = o("alertDialog", r), a = e.AlertDialog;
|
|
4
4
|
export {
|
|
5
5
|
a as AlertDialog
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { servedFamily as r } from "../renderer/served.js";
|
|
2
|
-
import { cspProvider as o } from "@epilot/zenith-runtime/v1
|
|
2
|
+
import { cspProvider as o } from "@epilot/zenith-runtime/v1";
|
|
3
3
|
const e = r("cspProvider", o), s = e.CSPProvider;
|
|
4
4
|
export {
|
|
5
5
|
s as CSPProvider
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { servedFamily as i } from "../renderer/served.js";
|
|
2
|
-
import { directionProvider as o } from "@epilot/zenith-runtime/v1
|
|
2
|
+
import { directionProvider as o } from "@epilot/zenith-runtime/v1";
|
|
3
3
|
const r = i("directionProvider", o), d = r.DirectionProvider;
|
|
4
4
|
r.useDirection;
|
|
5
5
|
export {
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { servedFamily as r } from "../renderer/served.js";
|
|
2
|
-
import { mergeProps as m } from "@epilot/zenith-runtime/v1
|
|
2
|
+
import { mergeProps as m } from "@epilot/zenith-runtime/v1";
|
|
3
3
|
const e = r("mergeProps", m);
|
|
4
4
|
e.makeEventPreventable;
|
|
5
5
|
e.mergeClassNames;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { servedFamily as o } from "../renderer/served.js";
|
|
2
|
-
import { radioGroup as r } from "@epilot/zenith-runtime/v1
|
|
2
|
+
import { radioGroup as r } from "@epilot/zenith-runtime/v1";
|
|
3
3
|
const i = o("radioGroup", r), a = i.RadioGroup;
|
|
4
4
|
export {
|
|
5
5
|
a as RadioGroup
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { servedFamily as r } from "../renderer/served.js";
|
|
2
|
-
import { scrollArea as o } from "@epilot/zenith-runtime/v1
|
|
2
|
+
import { scrollArea as o } from "@epilot/zenith-runtime/v1";
|
|
3
3
|
const e = r("scrollArea", o), s = e.ScrollArea;
|
|
4
4
|
export {
|
|
5
5
|
s as ScrollArea
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { servedFamily as r } from "../renderer/served.js";
|
|
2
|
-
import { separator as o } from "@epilot/zenith-runtime/v1
|
|
2
|
+
import { separator as o } from "@epilot/zenith-runtime/v1";
|
|
3
3
|
const a = r("separator", o), p = a.Separator;
|
|
4
4
|
export {
|
|
5
5
|
p as Separator
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { servedFamily as o } from "../renderer/served.js";
|
|
2
|
-
import { toggleGroup as r } from "@epilot/zenith-runtime/v1
|
|
2
|
+
import { toggleGroup as r } from "@epilot/zenith-runtime/v1";
|
|
3
3
|
const e = o("toggleGroup", r), t = e.ToggleGroup;
|
|
4
4
|
export {
|
|
5
5
|
t as ToggleGroup
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { servedFamily as e } from "../renderer/served.js";
|
|
2
|
-
import { useRender as r } from "@epilot/zenith-runtime/v1
|
|
2
|
+
import { useRender as r } from "@epilot/zenith-runtime/v1";
|
|
3
3
|
const s = e("useRender", r), o = s.useRender;
|
|
4
4
|
export {
|
|
5
5
|
o as useRender
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx as a, jsxs as L, Fragment as O } from "react/jsx-runtime";
|
|
2
2
|
import * as s from "react";
|
|
3
3
|
import { Accordion as h } from "../../_virtual/_zenith-runtime-family_accordion.js";
|
|
4
|
-
import { mergeClasses as v, SLOT_ATTR as m, shorthands as S } from "@epilot/zenith-runtime/v1
|
|
4
|
+
import { mergeClasses as v, SLOT_ATTR as m, shorthands as S } from "@epilot/zenith-runtime/v1";
|
|
5
5
|
import { makeZenithStyles as B } from "../../styles/make-styles.js";
|
|
6
6
|
import { boxModel as A, nativeControl as N } from "../../styles/host-reset.js";
|
|
7
7
|
import { spacingElement2 as P, spacingElement1 as F, spacingElement3 as b, leadingSm as k, textSm as E, grayA11 as H, grayA3 as _, fontWeightMedium as j, radiusMd as D, accentA8 as W } from "../../tokens/index.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"accordion.js","sources":["../../../src/components/accordion/accordion.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { Accordion as AccordionPrimitive } from \"@base-ui/react/accordion\"\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\nconst useStyles = makeZenithStyles({\n header: {\n // Radix renders the header as an `<h3>`, whose UA margin and type would otherwise show.\n ...shorthands.margin(0),\n fontSize: \"inherit\",\n fontWeight: \"inherit\",\n display: \"flex\",\n },\n trigger: {\n ...nativeControl,\n outlineColor: tokens.accentA8,\n ...shorthands.paddingInline(tokens.spacingElement3),\n ...shorthands.paddingBlock(\"1rem\"),\n cursor: \"pointer\",\n display: \"flex\",\n flexGrow: 1,\n flexShrink: 1,\n flexBasis: \"0%\",\n alignItems: \"flex-start\",\n gap: tokens.spacingElement3,\n borderRadius: tokens.radiusMd,\n textAlign: \"left\",\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n fontWeight: tokens.fontWeightMedium,\n transitionProperty: \"all\",\n transitionTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n transitionDuration: \"150ms\",\n \":hover\": { backgroundColor: tokens.grayA3 },\n \":focus-visible\": {\n outlineOffset: \"2px\",\n outlineWidth: \"2px\",\n outlineStyle: \"solid\",\n },\n \":disabled, &[data-disabled]\": {\n pointerEvents: \"none\",\n opacity: 0.5,\n },\n \"&[data-panel-open] > [data-zenith-slot='accordion-icon']\": {\n transform: \"rotate(180deg)\",\n },\n },\n alignStart: {\n justifyContent: \"flex-start\",\n },\n alignEnd: {\n justifyContent: \"space-between\",\n },\n icon: {\n ...boxModel,\n width: \"1.25rem\",\n height: \"1.25rem\",\n color: tokens.grayA11,\n pointerEvents: \"none\",\n flexShrink: 0,\n transform: \"translateY(0)\",\n transitionProperty: \"transform\",\n transitionTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n transitionDuration: \"150ms\",\n },\n panel: {\n ...boxModel,\n overflow: \"hidden\",\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n height: \"var(--accordion-panel-height)\",\n transitionProperty: \"height\",\n transitionDuration: \"200ms\",\n transitionTimingFunction: \"cubic-bezier(0, 0, 0.2, 1)\",\n \"&[data-starting-style], &[data-ending-style]\": { height: 0 },\n // Transitions pause in a background tab, so a close there never ends and Base UI keeps the\n // panel mounted at full height. A closed panel is empty whether or not it has unmounted.\n \"&[data-closed]\": { height: 0 },\n },\n // Padding sits inside the panel so the measured height includes it and a close reaches 0.\n padding: {\n ...boxModel,\n paddingInline: tokens.spacingElement3,\n paddingBlockStart: tokens.spacingElement1,\n paddingBlockEnd: tokens.spacingElement2,\n },\n inner: {\n ...boxModel,\n paddingInline: \"0\",\n paddingBlock: \"0\",\n },\n})\n\nexport type AccordionType = \"single\" | \"multiple\"\nexport type AccordionAlign = \"start\" | \"end\"\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 and wrap every handler's\n * event in `BaseUIEvent`; none of that reaches the public surface.\n */\ntype NativePartProps<Tag extends \"button\" | \"div\"> =\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\ntype AccordionRootProps = Omit<\n NativePartProps<\"div\">,\n \"defaultValue\" | \"dir\"\n> & {\n /** Whether the whole accordion ignores user interaction. @default false */\n disabled?: boolean\n /**\n * Which arrow keys move between triggers: up and down when vertical, left and right when\n * horizontal.\n * @default \"vertical\"\n */\n orientation?: React.AriaAttributes[\"aria-orientation\"]\n /** The reading direction, which mirrors the horizontal arrow keys when `\"rtl\"`. */\n dir?: \"ltr\" | \"rtl\"\n}\n\ntype AccordionSingleProps = AccordionRootProps & {\n type: \"single\"\n /** The controlled item that is expanded; `\"\"` for none. */\n value?: string\n /**\n * The item that is expanded when the accordion first renders. Use `defaultValue` if you do not\n * need to control the state of an accordion.\n */\n defaultValue?: string\n /** Called with the value of the item that is now expanded, or `\"\"` when it was collapsed. */\n onValueChange?(value: string): void\n /**\n * Whether an item can be collapsed after it has been opened.\n * @default false\n */\n collapsible?: boolean\n}\n\ntype AccordionMultipleProps = AccordionRootProps & {\n type: \"multiple\"\n /** The controlled items that are expanded. */\n value?: string[]\n /**\n * The items that are expanded when the accordion first renders. Use `defaultValue` if you do not\n * need to control the state of an accordion.\n */\n defaultValue?: string[]\n /** Called with the values of the items that are now expanded. */\n onValueChange?(value: string[]): void\n}\n\nexport type AccordionProps = AccordionSingleProps | AccordionMultipleProps\n\nexport type AccordionItemProps = NativePartProps<\"div\"> & {\n /** Whether the item ignores user interaction. @default false */\n disabled?: boolean\n /** A string value for the item. All items within an accordion should use a unique value. */\n value: string\n}\n\nexport type AccordionTriggerProps = NativePartProps<\"button\"> & {\n align?: AccordionAlign\n}\n\nexport type AccordionContentProps = NativePartProps<\"div\"> & {\n /** Keeps the panel mounted, and hidden, while its item is collapsed. */\n forceMount?: true\n}\n\n// Base UI 1.7.0 left roving focus out of its accordion (`loopFocus` and `orientation` are deprecated\n// no-ops), so the root hands its key bindings to the triggers, which move focus as Radix's did.\ntype AccordionKeyboard = {\n orientation: \"horizontal\" | \"vertical\" | undefined\n dir: \"ltr\" | \"rtl\" | undefined\n}\nconst AccordionKeyboardContext = React.createContext<AccordionKeyboard>({\n orientation: undefined,\n dir: undefined,\n})\n\n// The Zenith marker, not `data-slot`: the isolation gate reserves `data-slot` selectors for v1.\nconst TRIGGER_SELECTOR = `[${SLOT_ATTR}='accordion-trigger']`\nconst ROOT_SELECTOR = `[${SLOT_ATTR}='accordion']`\n\nfunction moveFocusAmongTriggers(\n event: React.KeyboardEvent<HTMLButtonElement>,\n { orientation = \"vertical\", dir = \"ltr\" }: Partial<AccordionKeyboard>\n) {\n const trigger = event.currentTarget\n const root = trigger.closest(ROOT_SELECTOR)\n if (!root) return\n\n const horizontal = orientation === \"horizontal\"\n const forward = horizontal\n ? dir === \"rtl\"\n ? \"ArrowLeft\"\n : \"ArrowRight\"\n : \"ArrowDown\"\n const backward = horizontal\n ? dir === \"rtl\"\n ? \"ArrowRight\"\n : \"ArrowLeft\"\n : \"ArrowUp\"\n if (![\"Home\", \"End\", forward, backward].includes(event.key)) return\n\n // This accordion's own enabled triggers: a nested accordion's belong to it.\n const triggers = Array.from(\n root.querySelectorAll<HTMLElement>(TRIGGER_SELECTOR)\n ).filter(\n (candidate) =>\n candidate.closest(ROOT_SELECTOR) === root &&\n !candidate.hasAttribute(\"data-disabled\")\n )\n const current = triggers.indexOf(trigger)\n if (current === -1) return\n\n event.preventDefault()\n const last = triggers.length - 1\n const next =\n event.key === \"Home\"\n ? 0\n : event.key === \"End\"\n ? last\n : event.key === forward\n ? current === last\n ? 0\n : current + 1\n : current === 0\n ? last\n : current - 1\n triggers[next].focus()\n}\n\n// Base UI types a part's props for its default element, with `className` and `style` as functions of\n// state and handlers over `BaseUIEvent`. The public props are the native element's, so they are\n// handed over as Base UI's own.\ntype PrimitiveRootProps = React.ComponentProps<typeof AccordionPrimitive.Root>\ntype PrimitiveItemProps = React.ComponentProps<typeof AccordionPrimitive.Item>\ntype PrimitiveTriggerProps = React.ComponentProps<\n typeof AccordionPrimitive.Trigger\n>\ntype PrimitivePanelProps = React.ComponentProps<typeof AccordionPrimitive.Panel>\n\n// Base UI's single mode is a one-item array that always lets an open item close; Radix's takes a\n// string and keeps the open item open unless `collapsible`. The wrapper owns the state so it can\n// veto the close, which makes the primitive controlled in this mode.\nconst AccordionSingle = React.forwardRef<\n HTMLDivElement,\n Omit<AccordionSingleProps, \"type\">\n>(function AccordionSingle(\n {\n asChild = false,\n children,\n collapsible = false,\n defaultValue = \"\",\n dir: _dir,\n onValueChange,\n value: valueProp,\n ...props\n },\n ref\n) {\n const [uncontrolled, setUncontrolled] = React.useState(defaultValue)\n const isControlled = valueProp !== undefined\n const value = isControlled ? valueProp : uncontrolled\n const items = React.useMemo(() => (value === \"\" ? [] : [value]), [value])\n\n return (\n <AccordionPrimitive.Root\n ref={ref}\n multiple={false}\n value={items}\n onValueChange={(next) => {\n const nextValue = (next[0] ?? \"\") as string\n if (nextValue === \"\" && !collapsible) return\n if (!isControlled) setUncontrolled(nextValue)\n onValueChange?.(nextValue)\n }}\n {...(props as PrimitiveRootProps)}\n {...slotProps(asChild, children)}\n />\n )\n})\n\nconst AccordionMultiple = React.forwardRef<\n HTMLDivElement,\n Omit<AccordionMultipleProps, \"type\">\n>(function AccordionMultiple(\n { asChild = false, children, dir: _dir, onValueChange, ...props },\n ref\n) {\n return (\n <AccordionPrimitive.Root\n ref={ref}\n multiple\n onValueChange={onValueChange && ((next) => onValueChange(next))}\n {...(props as PrimitiveRootProps)}\n {...slotProps(asChild, children)}\n />\n )\n})\n\nexport const Accordion = React.forwardRef<HTMLDivElement, AccordionProps>(\n function Accordion({ className, type = \"single\", ...props }, ref) {\n const { orientation, dir } = props as AccordionRootProps\n const keyboard = React.useMemo(\n () => ({ orientation, dir }),\n [orientation, dir]\n )\n const root = {\n ref,\n \"data-slot\": \"accordion\",\n [SLOT_ATTR]: \"accordion\",\n className,\n }\n\n return (\n <AccordionKeyboardContext.Provider value={keyboard}>\n {type === \"multiple\" ? (\n <AccordionMultiple\n {...root}\n {...(props as Omit<AccordionMultipleProps, \"type\">)}\n />\n ) : (\n <AccordionSingle\n {...root}\n {...(props as Omit<AccordionSingleProps, \"type\">)}\n />\n )}\n </AccordionKeyboardContext.Provider>\n )\n }\n)\n\nexport const AccordionItem = React.forwardRef<\n HTMLDivElement,\n AccordionItemProps\n>(function AccordionItem(\n { asChild = false, children, className, ...props },\n ref\n) {\n return (\n <AccordionPrimitive.Item\n ref={ref}\n data-slot=\"accordion-item\"\n {...{ [SLOT_ATTR]: \"accordion-item\" }}\n className={className}\n {...(props as PrimitiveItemProps)}\n {...slotProps(asChild, children)}\n />\n )\n})\n\nconst AccordionDownIcon = React.forwardRef<\n SVGSVGElement,\n React.SVGProps<SVGSVGElement>\n>(function AccordionDownIcon({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <svg\n ref={ref}\n data-slot=\"accordion-icon\"\n {...{ [SLOT_ATTR]: \"accordion-icon\" }}\n className={mergeClasses(styles.icon, className)}\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 -960 960 960\"\n fill=\"currentColor\"\n {...props}\n >\n <path d=\"M480-361q-8 0-15-2.5t-13-8.5L268-556q-11-11-11-28t11-28q11-11 28-11t28 11l156 156 156-156q11-11 28-11t28 11q11 11 11 28t-11 28L508-372q-6 6-13 8.5t-15 2.5Z\" />\n </svg>\n )\n})\n\nexport const AccordionTrigger = React.forwardRef<\n HTMLButtonElement,\n AccordionTriggerProps\n>(function AccordionTrigger(\n { align = \"end\", asChild = false, children, className, onKeyDown, ...props },\n ref\n) {\n const styles = useStyles()\n const keyboard = React.useContext(AccordionKeyboardContext)\n // Under `asChild` the child is the trigger and keeps its own content, chevron included or not.\n const child = asChild ? onlySlotChild(children) : undefined\n\n return (\n <AccordionPrimitive.Header className={styles.header}>\n <AccordionPrimitive.Trigger\n ref={ref}\n data-slot=\"accordion-trigger\"\n {...{ [SLOT_ATTR]: \"accordion-trigger\" }}\n className={mergeClasses(\n styles.trigger,\n align === \"start\" ? styles.alignStart : styles.alignEnd,\n className\n )}\n onKeyDown={(event) => {\n onKeyDown?.(event)\n if (!event.defaultPrevented) moveFocusAmongTriggers(event, keyboard)\n }}\n {...(props as PrimitiveTriggerProps)}\n {...(child\n ? { render: child }\n : {\n children: (\n <>\n {align === \"start\" && <AccordionDownIcon />}\n {children}\n {align === \"end\" && <AccordionDownIcon />}\n </>\n ),\n })}\n />\n </AccordionPrimitive.Header>\n )\n})\n\nexport const AccordionContent = React.forwardRef<\n HTMLDivElement,\n AccordionContentProps\n>(function AccordionContent(\n { asChild = false, children, className, forceMount, ...props },\n ref\n) {\n const styles = useStyles()\n\n return (\n <AccordionPrimitive.Panel\n ref={ref}\n data-slot=\"accordion-content\"\n {...{ [SLOT_ATTR]: \"accordion-content\" }}\n className={styles.panel}\n keepMounted={forceMount}\n {...(props as PrimitivePanelProps)}\n {...(asChild\n ? slotProps(true, children)\n : {\n children: (\n <div className={styles.padding}>\n <div className={mergeClasses(styles.inner, className)}>\n {children}\n </div>\n </div>\n ),\n })}\n />\n )\n})\n"],"names":["useStyles","makeZenithStyles","shorthands","nativeControl","tokens.accentA8","tokens.spacingElement3","tokens.radiusMd","tokens.textSm","tokens.leadingSm","tokens.fontWeightMedium","tokens.grayA3","boxModel","tokens.grayA11","tokens.spacingElement1","tokens.spacingElement2","onlySlotChild","children","elements","React","slotProps","asChild","child","AccordionKeyboardContext","TRIGGER_SELECTOR","SLOT_ATTR","ROOT_SELECTOR","moveFocusAmongTriggers","event","orientation","dir","trigger","root","horizontal","forward","triggers","candidate","current","last","next","AccordionSingle","collapsible","defaultValue","_dir","onValueChange","valueProp","props","ref","uncontrolled","setUncontrolled","isControlled","value","items","jsx","AccordionPrimitive","nextValue","AccordionMultiple","Accordion","className","type","keyboard","AccordionItem","AccordionDownIcon","styles","mergeClasses","AccordionTrigger","align","onKeyDown","jsxs","Fragment","AccordionContent","forceMount"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"accordion.js","sources":["../../../src/components/accordion/accordion.tsx"],"sourcesContent":["import * as React from \"react\"\nimport { Accordion as AccordionPrimitive } from \"@base-ui/react/accordion\"\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\nconst useStyles = makeZenithStyles({\n header: {\n // Radix renders the header as an `<h3>`, whose UA margin and type would otherwise show.\n ...shorthands.margin(0),\n fontSize: \"inherit\",\n fontWeight: \"inherit\",\n display: \"flex\",\n },\n trigger: {\n ...nativeControl,\n outlineColor: tokens.accentA8,\n ...shorthands.paddingInline(tokens.spacingElement3),\n ...shorthands.paddingBlock(\"1rem\"),\n cursor: \"pointer\",\n display: \"flex\",\n flexGrow: 1,\n flexShrink: 1,\n flexBasis: \"0%\",\n alignItems: \"flex-start\",\n gap: tokens.spacingElement3,\n borderRadius: tokens.radiusMd,\n textAlign: \"left\",\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n fontWeight: tokens.fontWeightMedium,\n transitionProperty: \"all\",\n transitionTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n transitionDuration: \"150ms\",\n \":hover\": { backgroundColor: tokens.grayA3 },\n \":focus-visible\": {\n outlineOffset: \"2px\",\n outlineWidth: \"2px\",\n outlineStyle: \"solid\",\n },\n \":disabled, &[data-disabled]\": {\n pointerEvents: \"none\",\n opacity: 0.5,\n },\n \"&[data-panel-open] > [data-zenith-slot='accordion-icon']\": {\n transform: \"rotate(180deg)\",\n },\n },\n alignStart: {\n justifyContent: \"flex-start\",\n },\n alignEnd: {\n justifyContent: \"space-between\",\n },\n icon: {\n ...boxModel,\n width: \"1.25rem\",\n height: \"1.25rem\",\n color: tokens.grayA11,\n pointerEvents: \"none\",\n flexShrink: 0,\n transform: \"translateY(0)\",\n transitionProperty: \"transform\",\n transitionTimingFunction: \"cubic-bezier(0.4, 0, 0.2, 1)\",\n transitionDuration: \"150ms\",\n },\n panel: {\n ...boxModel,\n overflow: \"hidden\",\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n height: \"var(--accordion-panel-height)\",\n transitionProperty: \"height\",\n transitionDuration: \"200ms\",\n transitionTimingFunction: \"cubic-bezier(0, 0, 0.2, 1)\",\n \"&[data-starting-style], &[data-ending-style]\": { height: 0 },\n // Transitions pause in a background tab, so a close there never ends and Base UI keeps the\n // panel mounted at full height. A closed panel is empty whether or not it has unmounted.\n \"&[data-closed]\": { height: 0 },\n },\n // Padding sits inside the panel so the measured height includes it and a close reaches 0.\n padding: {\n ...boxModel,\n paddingInline: tokens.spacingElement3,\n paddingBlockStart: tokens.spacingElement1,\n paddingBlockEnd: tokens.spacingElement2,\n },\n inner: {\n ...boxModel,\n paddingInline: \"0\",\n paddingBlock: \"0\",\n },\n})\n\nexport type AccordionType = \"single\" | \"multiple\"\nexport type AccordionAlign = \"start\" | \"end\"\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 and wrap every handler's\n * event in `BaseUIEvent`; none of that reaches the public surface.\n */\ntype NativePartProps<Tag extends \"button\" | \"div\"> =\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\ntype AccordionRootProps = Omit<\n NativePartProps<\"div\">,\n \"defaultValue\" | \"dir\"\n> & {\n /** Whether the whole accordion ignores user interaction. @default false */\n disabled?: boolean\n /**\n * Which arrow keys move between triggers: up and down when vertical, left and right when\n * horizontal.\n * @default \"vertical\"\n */\n orientation?: React.AriaAttributes[\"aria-orientation\"]\n /** The reading direction, which mirrors the horizontal arrow keys when `\"rtl\"`. */\n dir?: \"ltr\" | \"rtl\"\n}\n\ntype AccordionSingleProps = AccordionRootProps & {\n type: \"single\"\n /** The controlled item that is expanded; `\"\"` for none. */\n value?: string\n /**\n * The item that is expanded when the accordion first renders. Use `defaultValue` if you do not\n * need to control the state of an accordion.\n */\n defaultValue?: string\n /** Called with the value of the item that is now expanded, or `\"\"` when it was collapsed. */\n onValueChange?(value: string): void\n /**\n * Whether an item can be collapsed after it has been opened.\n * @default false\n */\n collapsible?: boolean\n}\n\ntype AccordionMultipleProps = AccordionRootProps & {\n type: \"multiple\"\n /** The controlled items that are expanded. */\n value?: string[]\n /**\n * The items that are expanded when the accordion first renders. Use `defaultValue` if you do not\n * need to control the state of an accordion.\n */\n defaultValue?: string[]\n /** Called with the values of the items that are now expanded. */\n onValueChange?(value: string[]): void\n}\n\nexport type AccordionProps = AccordionSingleProps | AccordionMultipleProps\n\nexport type AccordionItemProps = NativePartProps<\"div\"> & {\n /** Whether the item ignores user interaction. @default false */\n disabled?: boolean\n /** A string value for the item. All items within an accordion should use a unique value. */\n value: string\n}\n\nexport type AccordionTriggerProps = NativePartProps<\"button\"> & {\n align?: AccordionAlign\n}\n\nexport type AccordionContentProps = NativePartProps<\"div\"> & {\n /** Keeps the panel mounted, and hidden, while its item is collapsed. */\n forceMount?: true\n}\n\n// Base UI 1.7.0 left roving focus out of its accordion (`loopFocus` and `orientation` are deprecated\n// no-ops), so the root hands its key bindings to the triggers, which move focus as Radix's did.\ntype AccordionKeyboard = {\n orientation: \"horizontal\" | \"vertical\" | undefined\n dir: \"ltr\" | \"rtl\" | undefined\n}\nconst AccordionKeyboardContext = React.createContext<AccordionKeyboard>({\n orientation: undefined,\n dir: undefined,\n})\n\n// The Zenith marker, not `data-slot`: the isolation gate reserves `data-slot` selectors for v1.\nconst TRIGGER_SELECTOR = `[${SLOT_ATTR}='accordion-trigger']`\nconst ROOT_SELECTOR = `[${SLOT_ATTR}='accordion']`\n\nfunction moveFocusAmongTriggers(\n event: React.KeyboardEvent<HTMLButtonElement>,\n { orientation = \"vertical\", dir = \"ltr\" }: Partial<AccordionKeyboard>\n) {\n const trigger = event.currentTarget\n const root = trigger.closest(ROOT_SELECTOR)\n if (!root) return\n\n const horizontal = orientation === \"horizontal\"\n const forward = horizontal\n ? dir === \"rtl\"\n ? \"ArrowLeft\"\n : \"ArrowRight\"\n : \"ArrowDown\"\n const backward = horizontal\n ? dir === \"rtl\"\n ? \"ArrowRight\"\n : \"ArrowLeft\"\n : \"ArrowUp\"\n if (![\"Home\", \"End\", forward, backward].includes(event.key)) return\n\n // This accordion's own enabled triggers: a nested accordion's belong to it.\n const triggers = Array.from(\n root.querySelectorAll<HTMLElement>(TRIGGER_SELECTOR)\n ).filter(\n (candidate) =>\n candidate.closest(ROOT_SELECTOR) === root &&\n !candidate.hasAttribute(\"data-disabled\")\n )\n const current = triggers.indexOf(trigger)\n if (current === -1) return\n\n event.preventDefault()\n const last = triggers.length - 1\n const next =\n event.key === \"Home\"\n ? 0\n : event.key === \"End\"\n ? last\n : event.key === forward\n ? current === last\n ? 0\n : current + 1\n : current === 0\n ? last\n : current - 1\n triggers[next].focus()\n}\n\n// Base UI types a part's props for its default element, with `className` and `style` as functions of\n// state and handlers over `BaseUIEvent`. The public props are the native element's, so they are\n// handed over as Base UI's own.\ntype PrimitiveRootProps = React.ComponentProps<typeof AccordionPrimitive.Root>\ntype PrimitiveItemProps = React.ComponentProps<typeof AccordionPrimitive.Item>\ntype PrimitiveTriggerProps = React.ComponentProps<\n typeof AccordionPrimitive.Trigger\n>\ntype PrimitivePanelProps = React.ComponentProps<typeof AccordionPrimitive.Panel>\n\n// Base UI's single mode is a one-item array that always lets an open item close; Radix's takes a\n// string and keeps the open item open unless `collapsible`. The wrapper owns the state so it can\n// veto the close, which makes the primitive controlled in this mode.\nconst AccordionSingle = React.forwardRef<\n HTMLDivElement,\n Omit<AccordionSingleProps, \"type\">\n>(function AccordionSingle(\n {\n asChild = false,\n children,\n collapsible = false,\n defaultValue = \"\",\n dir: _dir,\n onValueChange,\n value: valueProp,\n ...props\n },\n ref\n) {\n const [uncontrolled, setUncontrolled] = React.useState(defaultValue)\n const isControlled = valueProp !== undefined\n const value = isControlled ? valueProp : uncontrolled\n const items = React.useMemo(() => (value === \"\" ? [] : [value]), [value])\n\n return (\n <AccordionPrimitive.Root\n ref={ref}\n multiple={false}\n value={items}\n onValueChange={(next) => {\n const nextValue = (next[0] ?? \"\") as string\n if (nextValue === \"\" && !collapsible) return\n if (!isControlled) setUncontrolled(nextValue)\n onValueChange?.(nextValue)\n }}\n {...(props as PrimitiveRootProps)}\n {...slotProps(asChild, children)}\n />\n )\n})\n\nconst AccordionMultiple = React.forwardRef<\n HTMLDivElement,\n Omit<AccordionMultipleProps, \"type\">\n>(function AccordionMultiple(\n { asChild = false, children, dir: _dir, onValueChange, ...props },\n ref\n) {\n return (\n <AccordionPrimitive.Root\n ref={ref}\n multiple\n onValueChange={onValueChange && ((next) => onValueChange(next))}\n {...(props as PrimitiveRootProps)}\n {...slotProps(asChild, children)}\n />\n )\n})\n\nexport const Accordion = React.forwardRef<HTMLDivElement, AccordionProps>(\n function Accordion({ className, type = \"single\", ...props }, ref) {\n const { orientation, dir } = props as AccordionRootProps\n const keyboard = React.useMemo(\n () => ({ orientation, dir }),\n [orientation, dir]\n )\n const root = {\n ref,\n \"data-slot\": \"accordion\",\n [SLOT_ATTR]: \"accordion\",\n className,\n }\n\n return (\n <AccordionKeyboardContext.Provider value={keyboard}>\n {type === \"multiple\" ? (\n <AccordionMultiple\n {...root}\n {...(props as Omit<AccordionMultipleProps, \"type\">)}\n />\n ) : (\n <AccordionSingle\n {...root}\n {...(props as Omit<AccordionSingleProps, \"type\">)}\n />\n )}\n </AccordionKeyboardContext.Provider>\n )\n }\n)\n\nexport const AccordionItem = React.forwardRef<\n HTMLDivElement,\n AccordionItemProps\n>(function AccordionItem(\n { asChild = false, children, className, ...props },\n ref\n) {\n return (\n <AccordionPrimitive.Item\n ref={ref}\n data-slot=\"accordion-item\"\n {...{ [SLOT_ATTR]: \"accordion-item\" }}\n className={className}\n {...(props as PrimitiveItemProps)}\n {...slotProps(asChild, children)}\n />\n )\n})\n\nconst AccordionDownIcon = React.forwardRef<\n SVGSVGElement,\n React.SVGProps<SVGSVGElement>\n>(function AccordionDownIcon({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <svg\n ref={ref}\n data-slot=\"accordion-icon\"\n {...{ [SLOT_ATTR]: \"accordion-icon\" }}\n className={mergeClasses(styles.icon, className)}\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 -960 960 960\"\n fill=\"currentColor\"\n {...props}\n >\n <path d=\"M480-361q-8 0-15-2.5t-13-8.5L268-556q-11-11-11-28t11-28q11-11 28-11t28 11l156 156 156-156q11-11 28-11t28 11q11 11 11 28t-11 28L508-372q-6 6-13 8.5t-15 2.5Z\" />\n </svg>\n )\n})\n\nexport const AccordionTrigger = React.forwardRef<\n HTMLButtonElement,\n AccordionTriggerProps\n>(function AccordionTrigger(\n { align = \"end\", asChild = false, children, className, onKeyDown, ...props },\n ref\n) {\n const styles = useStyles()\n const keyboard = React.useContext(AccordionKeyboardContext)\n // Under `asChild` the child is the trigger and keeps its own content, chevron included or not.\n const child = asChild ? onlySlotChild(children) : undefined\n\n return (\n <AccordionPrimitive.Header className={styles.header}>\n <AccordionPrimitive.Trigger\n ref={ref}\n data-slot=\"accordion-trigger\"\n {...{ [SLOT_ATTR]: \"accordion-trigger\" }}\n className={mergeClasses(\n styles.trigger,\n align === \"start\" ? styles.alignStart : styles.alignEnd,\n className\n )}\n onKeyDown={(event) => {\n onKeyDown?.(event)\n if (!event.defaultPrevented) moveFocusAmongTriggers(event, keyboard)\n }}\n {...(props as PrimitiveTriggerProps)}\n {...(child\n ? { render: child }\n : {\n children: (\n <>\n {align === \"start\" && <AccordionDownIcon />}\n {children}\n {align === \"end\" && <AccordionDownIcon />}\n </>\n ),\n })}\n />\n </AccordionPrimitive.Header>\n )\n})\n\nexport const AccordionContent = React.forwardRef<\n HTMLDivElement,\n AccordionContentProps\n>(function AccordionContent(\n { asChild = false, children, className, forceMount, ...props },\n ref\n) {\n const styles = useStyles()\n\n return (\n <AccordionPrimitive.Panel\n ref={ref}\n data-slot=\"accordion-content\"\n {...{ [SLOT_ATTR]: \"accordion-content\" }}\n className={styles.panel}\n keepMounted={forceMount}\n {...(props as PrimitivePanelProps)}\n {...(asChild\n ? slotProps(true, children)\n : {\n children: (\n <div className={styles.padding}>\n <div className={mergeClasses(styles.inner, className)}>\n {children}\n </div>\n </div>\n ),\n })}\n />\n )\n})\n"],"names":["useStyles","makeZenithStyles","shorthands","nativeControl","tokens.accentA8","tokens.spacingElement3","tokens.radiusMd","tokens.textSm","tokens.leadingSm","tokens.fontWeightMedium","tokens.grayA3","boxModel","tokens.grayA11","tokens.spacingElement1","tokens.spacingElement2","onlySlotChild","children","elements","React","slotProps","asChild","child","AccordionKeyboardContext","TRIGGER_SELECTOR","SLOT_ATTR","ROOT_SELECTOR","moveFocusAmongTriggers","event","orientation","dir","trigger","root","horizontal","forward","triggers","candidate","current","last","next","AccordionSingle","collapsible","defaultValue","_dir","onValueChange","valueProp","props","ref","uncontrolled","setUncontrolled","isControlled","value","items","jsx","AccordionPrimitive","nextValue","AccordionMultiple","Accordion","className","type","keyboard","AccordionItem","AccordionDownIcon","styles","mergeClasses","AccordionTrigger","align","onKeyDown","jsxs","Fragment","AccordionContent","forceMount"],"mappings":"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"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx as l, jsxs as I } from "react/jsx-runtime";
|
|
2
2
|
import * as a from "react";
|
|
3
3
|
import { AlertDialog as c } from "../../_virtual/_zenith-runtime-family_alert-dialog.js";
|
|
4
|
-
import { SLOT_ATTR as d, mergeClasses as g, shorthands as f } from "@epilot/zenith-runtime/v1
|
|
4
|
+
import { SLOT_ATTR as d, mergeClasses as g, shorthands as f } from "@epilot/zenith-runtime/v1";
|
|
5
5
|
import { useAppearanceAttributes as k } from "../appearance-boundary/appearance-boundary.js";
|
|
6
6
|
import { useDensity as L } from "../density-provider/density-provider.js";
|
|
7
7
|
import { makeZenithStyles as j } from "../../styles/make-styles.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"alert-dialog.js","sources":["../../../src/components/alert-dialog/alert-dialog.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { AlertDialog as AlertDialogPrimitive } from \"@base-ui/react/alert-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\"\nimport {\n Button,\n type ButtonProps,\n type ButtonSize,\n type ButtonVariant,\n} from \"../button/button\"\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 top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n zIndex: OVERLAY_Z_INDEX,\n backgroundColor: \"rgba(0, 0, 0, 0.5)\",\n transitionProperty: \"opacity\",\n transitionDuration: \"150ms\",\n transitionTimingFunction: easeOut,\n \"&[data-starting-style]\": { opacity: 0 },\n \"&[data-ending-style]\": {\n opacity: 0,\n transitionDuration: \"100ms\",\n transitionTimingFunction: easeIn,\n },\n \"@media (prefers-reduced-motion: reduce)\": {\n transitionDuration: \"0.01ms\",\n \"&[data-ending-style]\": { transitionDuration: \"0.01ms\" },\n },\n },\n content: {\n ...boxModel,\n backgroundColor: tokens.body,\n position: \"fixed\",\n top: \"50%\",\n left: \"50%\",\n transform: \"translate(-50%, -50%)\",\n zIndex: OVERLAY_Z_INDEX,\n display: \"grid\",\n width: \"100%\",\n maxWidth: \"calc(100% - 2rem)\",\n ...shorthands.gap(tokens.spacingGroup2),\n ...shorthands.borderRadius(tokens.radiusXl),\n ...shorthands.border(\"1px\", \"solid\", tokens.grayA1),\n ...shorthands.padding(tokens.spacingGroup2),\n // v1 shadow-lg\n boxShadow: \"0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a\",\n outlineStyle: \"none\",\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 transitionDuration: \"100ms\",\n transitionTimingFunction: easeIn,\n },\n \"@media (prefers-reduced-motion: reduce)\": {\n transitionDuration: \"0.01ms\",\n \"&[data-ending-style]\": { transitionDuration: \"0.01ms\" },\n },\n },\n sm: {\n ...boxModel,\n maxWidth: tokens.containerSm,\n },\n md: {\n ...boxModel,\n maxWidth: tokens.containerMd,\n },\n lg: {\n ...boxModel,\n maxWidth: tokens.containerLg,\n },\n xl: {\n ...boxModel,\n \"@media (min-width: 640px)\": {\n maxWidth: tokens.containerXl,\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.textXl,\n lineHeight: tokens.leadingXl,\n fontWeight: tokens.fontWeightSemibold,\n color: tokens.grayA12,\n },\n description: {\n ...shorthands.margin(0),\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n color: tokens.grayA11,\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 AlertDialogOpenChangeDetails = (\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 alert dialog in its current state. */\n cancel: () => void\n /** Lets the event propagate where the alert 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 alert dialog's elements mounted after it closes. */\n preventUnmountOnClose: () => void\n}\n\nexport type AlertDialogProps = {\n children?: React.ReactNode\n open?: boolean\n defaultOpen?: boolean\n /**\n * Called when the alert dialog opens or closes. `eventDetails.reason` says why (`trigger-press`,\n * `escape-key`, `close-press`) and `eventDetails.cancel()` keeps the alert dialog in its current\n * state.\n */\n onOpenChange?: (\n open: boolean,\n eventDetails: AlertDialogOpenChangeDetails\n ) => void\n}\n\nexport const AlertDialog = React.forwardRef<HTMLElement, AlertDialogProps>(\n function AlertDialog({ onOpenChange, ...props }, _ref) {\n return (\n <AlertDialogPrimitive.Root\n data-slot=\"alert-dialog\"\n onOpenChange={(open, eventDetails) => {\n // A layer above (a Volt select or tooltip, 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 AlertDialogTriggerProps = NativePartProps<\"button\">\n\nexport const AlertDialogTrigger = React.forwardRef<\n HTMLButtonElement,\n AlertDialogTriggerProps\n>(function AlertDialogTrigger(\n { asChild = false, children, className, ...props },\n ref\n) {\n const styles = useStyles()\n\n return (\n <AlertDialogPrimitive.Trigger\n ref={ref}\n data-slot=\"alert-dialog-trigger\"\n {...{ [SLOT_ATTR]: \"alert-dialog-trigger\" }}\n className={mergeClasses(!asChild && styles.nativeTrigger, className)}\n {...props}\n {...slotProps(asChild, children)}\n />\n )\n})\n\n// Lets AlertDialogContent supply Base UI's required Portal itself when no AlertDialogPortal wraps\n// it, as Radix rendered content inline without one.\nconst AlertDialogPortalPresenceContext = React.createContext(false)\n\nexport type AlertDialogPortalProps = {\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 alert dialog is closed. */\n forceMount?: true\n}\n\nexport const AlertDialogPortal = React.forwardRef<\n HTMLElement,\n AlertDialogPortalProps\n>(function AlertDialogPortal({ container, forceMount, ...props }, ref) {\n return (\n <AlertDialogPortalPresenceContext.Provider value={true}>\n <AlertDialogPrimitive.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=\"alert-dialog-portal\"\n {...{ [SLOT_ATTR]: \"alert-dialog-portal\" }}\n // Radix took any Element or DocumentFragment, null meaning the body. Base UI hands a node\n // 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 </AlertDialogPortalPresenceContext.Provider>\n )\n})\n\nexport type AlertDialogOverlayProps = NativePartProps<\"div\"> & {\n /** Kept for compatibility: the overlay stays mounted whenever AlertDialogPortal's `forceMount` keeps the portal mounted. */\n forceMount?: true\n}\n\nexport const AlertDialogOverlay = React.forwardRef<\n HTMLDivElement,\n AlertDialogOverlayProps\n>(function AlertDialogOverlay(\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 <AlertDialogPrimitive.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 an alert dialog confirms over.\n forceRender\n data-slot=\"alert-dialog-overlay\"\n {...{ [SLOT_ATTR]: \"alert-dialog-overlay\" }}\n {...appearance}\n className={mergeClasses(styles.overlay, className)}\n {...props}\n {...slotProps(asChild, children)}\n />\n )\n})\n\n// Radix moved focus to Cancel on open, wherever it sits in the content; Base UI moves it to the\n// first tabbable element. AlertDialogCancel registers its button here so the content can keep\n// Radix's target.\nconst AlertDialogCancelRegistryContext = React.createContext<\n ((node: HTMLButtonElement | null) => void) | undefined\n>(undefined)\n\nexport type AlertDialogSize = \"xl\" | \"lg\" | \"md\" | \"sm\"\n\nexport type AlertDialogContentProps = NativePartProps<\"div\"> & {\n size?: AlertDialogSize\n /**\n * Keeps the content mounted while the alert dialog is closed. Inside AlertDialogPortal, the\n * portal's `forceMount` decides.\n */\n forceMount?: true\n /**\n * Called before focus moves into the alert dialog, to AlertDialogCancel; `preventDefault()`\n * leaves focus where it is.\n */\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 AlertDialogContent = React.forwardRef<\n HTMLDivElement,\n AlertDialogContentProps\n>(function AlertDialogContent(\n {\n asChild = false,\n className,\n size = \"xl\",\n children,\n forceMount,\n onOpenAutoFocus,\n onCloseAutoFocus,\n ...props\n },\n ref\n) {\n const styles = useStyles()\n const hasPortal = React.useContext(AlertDialogPortalPresenceContext)\n // DENSITY-SPEC.md §4.4 — portal content boundary; see dialog.tsx's identical comment.\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 const cancelRef = React.useRef<HTMLButtonElement | null>(null)\n const registerCancel = React.useCallback((node: HTMLButtonElement | null) => {\n cancelRef.current = node\n }, [])\n const openAutoFocus = radixFocusCallback(onOpenAutoFocus)\n\n const popup = (\n <AlertDialogPrimitive.Popup\n ref={ref}\n data-slot=\"alert-dialog-content\"\n {...{ [SLOT_ATTR]: \"alert-dialog-content\" }}\n {...(override !== undefined ? { \"data-density\": override } : {})}\n {...appearance}\n // Cancel when there is one; otherwise Base UI's default (`true`), the first tabbable element.\n initialFocus={() =>\n openAutoFocus?.() === false ? false : (cancelRef.current ?? true)\n }\n finalFocus={radixFocusCallback(onCloseAutoFocus)}\n className={mergeClasses(styles.content, styles[size], className)}\n {...props}\n {...slotProps(asChild, children)}\n />\n )\n\n const content = (\n <AlertDialogCancelRegistryContext.Provider value={registerCancel}>\n <AlertDialogOverlay />\n {popup}\n </AlertDialogCancelRegistryContext.Provider>\n )\n\n // Base UI's Popup requires a Portal ancestor; Radix rendered inline without one.\n return hasPortal ? (\n content\n ) : (\n <AlertDialogPrimitive.Portal keepMounted={forceMount}>\n {content}\n </AlertDialogPrimitive.Portal>\n )\n})\n\nexport type AlertDialogHeaderProps = React.ComponentProps<\"div\">\n\nexport const AlertDialogHeader = React.forwardRef<\n HTMLDivElement,\n AlertDialogHeaderProps\n>(function AlertDialogHeader({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <div\n ref={ref}\n data-slot=\"alert-dialog-header\"\n {...{ [SLOT_ATTR]: \"alert-dialog-header\" }}\n className={mergeClasses(styles.header, className)}\n {...props}\n />\n )\n})\n\nexport type AlertDialogFooterProps = React.ComponentProps<\"div\">\n\nexport const AlertDialogFooter = React.forwardRef<\n HTMLDivElement,\n AlertDialogFooterProps\n>(function AlertDialogFooter({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <div\n ref={ref}\n data-slot=\"alert-dialog-footer\"\n {...{ [SLOT_ATTR]: \"alert-dialog-footer\" }}\n className={mergeClasses(styles.footer, className)}\n {...props}\n />\n )\n})\n\nexport type AlertDialogTitleProps = NativePartProps<\"h2\">\n\nexport const AlertDialogTitle = React.forwardRef<\n HTMLHeadingElement,\n AlertDialogTitleProps\n>(function AlertDialogTitle(\n { asChild = false, children, className, ...props },\n ref\n) {\n const styles = useStyles()\n\n return (\n <AlertDialogPrimitive.Title\n ref={ref}\n data-slot=\"alert-dialog-title\"\n {...{ [SLOT_ATTR]: \"alert-dialog-title\" }}\n className={mergeClasses(styles.title, className)}\n {...props}\n {...slotProps(asChild, children)}\n />\n )\n})\n\nexport type AlertDialogDescriptionProps = NativePartProps<\"p\">\n\nexport const AlertDialogDescription = React.forwardRef<\n HTMLParagraphElement,\n AlertDialogDescriptionProps\n>(function AlertDialogDescription(\n { asChild = false, children, className, ...props },\n ref\n) {\n const styles = useStyles()\n\n return (\n <AlertDialogPrimitive.Description\n ref={ref}\n data-slot=\"alert-dialog-description\"\n {...{ [SLOT_ATTR]: \"alert-dialog-description\" }}\n className={mergeClasses(styles.description, className)}\n {...props}\n {...slotProps(asChild, children)}\n />\n )\n})\n\nexport type AlertDialogActionProps = Omit<\n ButtonProps,\n \"variant\" | \"size\" | \"destructive\"\n> & {\n variant?: ButtonVariant\n size?: ButtonSize\n destructive?: boolean\n}\n\n// Radix's Action closed the alert dialog on click, like Cancel; both compose Base UI's Close and\n// differ only in their default variant.\nexport const AlertDialogAction = React.forwardRef<\n HTMLButtonElement,\n AlertDialogActionProps\n>(function AlertDialogAction(\n {\n variant = \"primary\",\n size = \"base\",\n destructive = false,\n className,\n ...props\n },\n ref\n) {\n return (\n <AlertDialogPrimitive.Close\n render={\n <Button\n ref={ref}\n data-slot=\"alert-dialog-action\"\n {...{ [SLOT_ATTR]: \"alert-dialog-action\" }}\n variant={variant}\n size={size}\n destructive={destructive}\n className={className}\n {...props}\n />\n }\n />\n )\n})\n\nexport type AlertDialogCancelProps = Omit<\n ButtonProps,\n \"variant\" | \"size\" | \"destructive\"\n> & {\n variant?: ButtonVariant\n size?: ButtonSize\n destructive?: boolean\n}\n\nexport const AlertDialogCancel = React.forwardRef<\n HTMLButtonElement,\n AlertDialogCancelProps\n>(function AlertDialogCancel(\n {\n variant = \"secondary\",\n size = \"base\",\n destructive = false,\n className,\n ...props\n },\n ref\n) {\n const registerCancel = React.useContext(AlertDialogCancelRegistryContext)\n\n return (\n <AlertDialogPrimitive.Close\n ref={registerCancel}\n render={\n <Button\n ref={ref}\n data-slot=\"alert-dialog-cancel\"\n {...{ [SLOT_ATTR]: \"alert-dialog-cancel\" }}\n variant={variant}\n size={size}\n destructive={destructive}\n className={className}\n {...props}\n />\n }\n />\n )\n})\n"],"names":["easeOut","easeIn","useStyles","makeZenithStyles","nativeControl","OVERLAY_Z_INDEX","boxModel","tokens.body","shorthands","tokens.spacingGroup2","tokens.radiusXl","tokens.grayA1","tokens.containerSm","tokens.containerMd","tokens.containerLg","tokens.containerXl","tokens.spacingElement2","tokens.textXl","tokens.leadingXl","tokens.fontWeightSemibold","tokens.grayA12","tokens.textSm","tokens.leadingSm","tokens.grayA11","onlySlotChild","children","elements","React","slotProps","asChild","child","radixFocusCallback","handler","event","before","moved","AlertDialog","onOpenChange","props","_ref","jsx","AlertDialogPrimitive","open","eventDetails","AlertDialogTrigger","className","ref","styles","SLOT_ATTR","mergeClasses","AlertDialogPortalPresenceContext","AlertDialogPortal","container","forceMount","AlertDialogOverlay","_forceMount","appearance","useAppearanceAttributes","AlertDialogCancelRegistryContext","AlertDialogContent","size","onOpenAutoFocus","onCloseAutoFocus","hasPortal","override","useDensity","cancelRef","registerCancel","node","openAutoFocus","popup","content","jsxs","AlertDialogHeader","AlertDialogFooter","AlertDialogTitle","AlertDialogDescription","AlertDialogAction","variant","destructive","Button","AlertDialogCancel"],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"alert-dialog.js","sources":["../../../src/components/alert-dialog/alert-dialog.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { AlertDialog as AlertDialogPrimitive } from \"@base-ui/react/alert-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\"\nimport {\n Button,\n type ButtonProps,\n type ButtonSize,\n type ButtonVariant,\n} from \"../button/button\"\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 top: 0,\n right: 0,\n bottom: 0,\n left: 0,\n zIndex: OVERLAY_Z_INDEX,\n backgroundColor: \"rgba(0, 0, 0, 0.5)\",\n transitionProperty: \"opacity\",\n transitionDuration: \"150ms\",\n transitionTimingFunction: easeOut,\n \"&[data-starting-style]\": { opacity: 0 },\n \"&[data-ending-style]\": {\n opacity: 0,\n transitionDuration: \"100ms\",\n transitionTimingFunction: easeIn,\n },\n \"@media (prefers-reduced-motion: reduce)\": {\n transitionDuration: \"0.01ms\",\n \"&[data-ending-style]\": { transitionDuration: \"0.01ms\" },\n },\n },\n content: {\n ...boxModel,\n backgroundColor: tokens.body,\n position: \"fixed\",\n top: \"50%\",\n left: \"50%\",\n transform: \"translate(-50%, -50%)\",\n zIndex: OVERLAY_Z_INDEX,\n display: \"grid\",\n width: \"100%\",\n maxWidth: \"calc(100% - 2rem)\",\n ...shorthands.gap(tokens.spacingGroup2),\n ...shorthands.borderRadius(tokens.radiusXl),\n ...shorthands.border(\"1px\", \"solid\", tokens.grayA1),\n ...shorthands.padding(tokens.spacingGroup2),\n // v1 shadow-lg\n boxShadow: \"0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a\",\n outlineStyle: \"none\",\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 transitionDuration: \"100ms\",\n transitionTimingFunction: easeIn,\n },\n \"@media (prefers-reduced-motion: reduce)\": {\n transitionDuration: \"0.01ms\",\n \"&[data-ending-style]\": { transitionDuration: \"0.01ms\" },\n },\n },\n sm: {\n ...boxModel,\n maxWidth: tokens.containerSm,\n },\n md: {\n ...boxModel,\n maxWidth: tokens.containerMd,\n },\n lg: {\n ...boxModel,\n maxWidth: tokens.containerLg,\n },\n xl: {\n ...boxModel,\n \"@media (min-width: 640px)\": {\n maxWidth: tokens.containerXl,\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.textXl,\n lineHeight: tokens.leadingXl,\n fontWeight: tokens.fontWeightSemibold,\n color: tokens.grayA12,\n },\n description: {\n ...shorthands.margin(0),\n fontSize: tokens.textSm,\n lineHeight: tokens.leadingSm,\n color: tokens.grayA11,\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 AlertDialogOpenChangeDetails = (\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 alert dialog in its current state. */\n cancel: () => void\n /** Lets the event propagate where the alert 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 alert dialog's elements mounted after it closes. */\n preventUnmountOnClose: () => void\n}\n\nexport type AlertDialogProps = {\n children?: React.ReactNode\n open?: boolean\n defaultOpen?: boolean\n /**\n * Called when the alert dialog opens or closes. `eventDetails.reason` says why (`trigger-press`,\n * `escape-key`, `close-press`) and `eventDetails.cancel()` keeps the alert dialog in its current\n * state.\n */\n onOpenChange?: (\n open: boolean,\n eventDetails: AlertDialogOpenChangeDetails\n ) => void\n}\n\nexport const AlertDialog = React.forwardRef<HTMLElement, AlertDialogProps>(\n function AlertDialog({ onOpenChange, ...props }, _ref) {\n return (\n <AlertDialogPrimitive.Root\n data-slot=\"alert-dialog\"\n onOpenChange={(open, eventDetails) => {\n // A layer above (a Volt select or tooltip, 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 AlertDialogTriggerProps = NativePartProps<\"button\">\n\nexport const AlertDialogTrigger = React.forwardRef<\n HTMLButtonElement,\n AlertDialogTriggerProps\n>(function AlertDialogTrigger(\n { asChild = false, children, className, ...props },\n ref\n) {\n const styles = useStyles()\n\n return (\n <AlertDialogPrimitive.Trigger\n ref={ref}\n data-slot=\"alert-dialog-trigger\"\n {...{ [SLOT_ATTR]: \"alert-dialog-trigger\" }}\n className={mergeClasses(!asChild && styles.nativeTrigger, className)}\n {...props}\n {...slotProps(asChild, children)}\n />\n )\n})\n\n// Lets AlertDialogContent supply Base UI's required Portal itself when no AlertDialogPortal wraps\n// it, as Radix rendered content inline without one.\nconst AlertDialogPortalPresenceContext = React.createContext(false)\n\nexport type AlertDialogPortalProps = {\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 alert dialog is closed. */\n forceMount?: true\n}\n\nexport const AlertDialogPortal = React.forwardRef<\n HTMLElement,\n AlertDialogPortalProps\n>(function AlertDialogPortal({ container, forceMount, ...props }, ref) {\n return (\n <AlertDialogPortalPresenceContext.Provider value={true}>\n <AlertDialogPrimitive.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=\"alert-dialog-portal\"\n {...{ [SLOT_ATTR]: \"alert-dialog-portal\" }}\n // Radix took any Element or DocumentFragment, null meaning the body. Base UI hands a node\n // 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 </AlertDialogPortalPresenceContext.Provider>\n )\n})\n\nexport type AlertDialogOverlayProps = NativePartProps<\"div\"> & {\n /** Kept for compatibility: the overlay stays mounted whenever AlertDialogPortal's `forceMount` keeps the portal mounted. */\n forceMount?: true\n}\n\nexport const AlertDialogOverlay = React.forwardRef<\n HTMLDivElement,\n AlertDialogOverlayProps\n>(function AlertDialogOverlay(\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 <AlertDialogPrimitive.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 an alert dialog confirms over.\n forceRender\n data-slot=\"alert-dialog-overlay\"\n {...{ [SLOT_ATTR]: \"alert-dialog-overlay\" }}\n {...appearance}\n className={mergeClasses(styles.overlay, className)}\n {...props}\n {...slotProps(asChild, children)}\n />\n )\n})\n\n// Radix moved focus to Cancel on open, wherever it sits in the content; Base UI moves it to the\n// first tabbable element. AlertDialogCancel registers its button here so the content can keep\n// Radix's target.\nconst AlertDialogCancelRegistryContext = React.createContext<\n ((node: HTMLButtonElement | null) => void) | undefined\n>(undefined)\n\nexport type AlertDialogSize = \"xl\" | \"lg\" | \"md\" | \"sm\"\n\nexport type AlertDialogContentProps = NativePartProps<\"div\"> & {\n size?: AlertDialogSize\n /**\n * Keeps the content mounted while the alert dialog is closed. Inside AlertDialogPortal, the\n * portal's `forceMount` decides.\n */\n forceMount?: true\n /**\n * Called before focus moves into the alert dialog, to AlertDialogCancel; `preventDefault()`\n * leaves focus where it is.\n */\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 AlertDialogContent = React.forwardRef<\n HTMLDivElement,\n AlertDialogContentProps\n>(function AlertDialogContent(\n {\n asChild = false,\n className,\n size = \"xl\",\n children,\n forceMount,\n onOpenAutoFocus,\n onCloseAutoFocus,\n ...props\n },\n ref\n) {\n const styles = useStyles()\n const hasPortal = React.useContext(AlertDialogPortalPresenceContext)\n // DENSITY-SPEC.md §4.4 — portal content boundary; see dialog.tsx's identical comment.\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 const cancelRef = React.useRef<HTMLButtonElement | null>(null)\n const registerCancel = React.useCallback((node: HTMLButtonElement | null) => {\n cancelRef.current = node\n }, [])\n const openAutoFocus = radixFocusCallback(onOpenAutoFocus)\n\n const popup = (\n <AlertDialogPrimitive.Popup\n ref={ref}\n data-slot=\"alert-dialog-content\"\n {...{ [SLOT_ATTR]: \"alert-dialog-content\" }}\n {...(override !== undefined ? { \"data-density\": override } : {})}\n {...appearance}\n // Cancel when there is one; otherwise Base UI's default (`true`), the first tabbable element.\n initialFocus={() =>\n openAutoFocus?.() === false ? false : (cancelRef.current ?? true)\n }\n finalFocus={radixFocusCallback(onCloseAutoFocus)}\n className={mergeClasses(styles.content, styles[size], className)}\n {...props}\n {...slotProps(asChild, children)}\n />\n )\n\n const content = (\n <AlertDialogCancelRegistryContext.Provider value={registerCancel}>\n <AlertDialogOverlay />\n {popup}\n </AlertDialogCancelRegistryContext.Provider>\n )\n\n // Base UI's Popup requires a Portal ancestor; Radix rendered inline without one.\n return hasPortal ? (\n content\n ) : (\n <AlertDialogPrimitive.Portal keepMounted={forceMount}>\n {content}\n </AlertDialogPrimitive.Portal>\n )\n})\n\nexport type AlertDialogHeaderProps = React.ComponentProps<\"div\">\n\nexport const AlertDialogHeader = React.forwardRef<\n HTMLDivElement,\n AlertDialogHeaderProps\n>(function AlertDialogHeader({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <div\n ref={ref}\n data-slot=\"alert-dialog-header\"\n {...{ [SLOT_ATTR]: \"alert-dialog-header\" }}\n className={mergeClasses(styles.header, className)}\n {...props}\n />\n )\n})\n\nexport type AlertDialogFooterProps = React.ComponentProps<\"div\">\n\nexport const AlertDialogFooter = React.forwardRef<\n HTMLDivElement,\n AlertDialogFooterProps\n>(function AlertDialogFooter({ className, ...props }, ref) {\n const styles = useStyles()\n\n return (\n <div\n ref={ref}\n data-slot=\"alert-dialog-footer\"\n {...{ [SLOT_ATTR]: \"alert-dialog-footer\" }}\n className={mergeClasses(styles.footer, className)}\n {...props}\n />\n )\n})\n\nexport type AlertDialogTitleProps = NativePartProps<\"h2\">\n\nexport const AlertDialogTitle = React.forwardRef<\n HTMLHeadingElement,\n AlertDialogTitleProps\n>(function AlertDialogTitle(\n { asChild = false, children, className, ...props },\n ref\n) {\n const styles = useStyles()\n\n return (\n <AlertDialogPrimitive.Title\n ref={ref}\n data-slot=\"alert-dialog-title\"\n {...{ [SLOT_ATTR]: \"alert-dialog-title\" }}\n className={mergeClasses(styles.title, className)}\n {...props}\n {...slotProps(asChild, children)}\n />\n )\n})\n\nexport type AlertDialogDescriptionProps = NativePartProps<\"p\">\n\nexport const AlertDialogDescription = React.forwardRef<\n HTMLParagraphElement,\n AlertDialogDescriptionProps\n>(function AlertDialogDescription(\n { asChild = false, children, className, ...props },\n ref\n) {\n const styles = useStyles()\n\n return (\n <AlertDialogPrimitive.Description\n ref={ref}\n data-slot=\"alert-dialog-description\"\n {...{ [SLOT_ATTR]: \"alert-dialog-description\" }}\n className={mergeClasses(styles.description, className)}\n {...props}\n {...slotProps(asChild, children)}\n />\n )\n})\n\nexport type AlertDialogActionProps = Omit<\n ButtonProps,\n \"variant\" | \"size\" | \"destructive\"\n> & {\n variant?: ButtonVariant\n size?: ButtonSize\n destructive?: boolean\n}\n\n// Radix's Action closed the alert dialog on click, like Cancel; both compose Base UI's Close and\n// differ only in their default variant.\nexport const AlertDialogAction = React.forwardRef<\n HTMLButtonElement,\n AlertDialogActionProps\n>(function AlertDialogAction(\n {\n variant = \"primary\",\n size = \"base\",\n destructive = false,\n className,\n ...props\n },\n ref\n) {\n return (\n <AlertDialogPrimitive.Close\n render={\n <Button\n ref={ref}\n data-slot=\"alert-dialog-action\"\n {...{ [SLOT_ATTR]: \"alert-dialog-action\" }}\n variant={variant}\n size={size}\n destructive={destructive}\n className={className}\n {...props}\n />\n }\n />\n )\n})\n\nexport type AlertDialogCancelProps = Omit<\n ButtonProps,\n \"variant\" | \"size\" | \"destructive\"\n> & {\n variant?: ButtonVariant\n size?: ButtonSize\n destructive?: boolean\n}\n\nexport const AlertDialogCancel = React.forwardRef<\n HTMLButtonElement,\n AlertDialogCancelProps\n>(function AlertDialogCancel(\n {\n variant = \"secondary\",\n size = \"base\",\n destructive = false,\n className,\n ...props\n },\n ref\n) {\n const registerCancel = React.useContext(AlertDialogCancelRegistryContext)\n\n return (\n <AlertDialogPrimitive.Close\n ref={registerCancel}\n render={\n <Button\n ref={ref}\n data-slot=\"alert-dialog-cancel\"\n {...{ [SLOT_ATTR]: \"alert-dialog-cancel\" }}\n variant={variant}\n size={size}\n destructive={destructive}\n className={className}\n {...props}\n />\n }\n />\n )\n})\n"],"names":["easeOut","easeIn","useStyles","makeZenithStyles","nativeControl","OVERLAY_Z_INDEX","boxModel","tokens.body","shorthands","tokens.spacingGroup2","tokens.radiusXl","tokens.grayA1","tokens.containerSm","tokens.containerMd","tokens.containerLg","tokens.containerXl","tokens.spacingElement2","tokens.textXl","tokens.leadingXl","tokens.fontWeightSemibold","tokens.grayA12","tokens.textSm","tokens.leadingSm","tokens.grayA11","onlySlotChild","children","elements","React","slotProps","asChild","child","radixFocusCallback","handler","event","before","moved","AlertDialog","onOpenChange","props","_ref","jsx","AlertDialogPrimitive","open","eventDetails","AlertDialogTrigger","className","ref","styles","SLOT_ATTR","mergeClasses","AlertDialogPortalPresenceContext","AlertDialogPortal","container","forceMount","AlertDialogOverlay","_forceMount","appearance","useAppearanceAttributes","AlertDialogCancelRegistryContext","AlertDialogContent","size","onOpenAutoFocus","onCloseAutoFocus","hasPortal","override","useDensity","cancelRef","registerCancel","node","openAutoFocus","popup","content","jsxs","AlertDialogHeader","AlertDialogFooter","AlertDialogTitle","AlertDialogDescription","AlertDialogAction","variant","destructive","Button","AlertDialogCancel"],"mappings":"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"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as s } from "react/jsx-runtime";
|
|
2
2
|
import * as o from "react";
|
|
3
|
-
import { mergeClasses as v, SLOT_ATTR as y } from "@epilot/zenith-runtime/v1
|
|
3
|
+
import { mergeClasses as v, SLOT_ATTR as y } from "@epilot/zenith-runtime/v1";
|
|
4
4
|
import { makeZenithStyles as h } from "../../styles/make-styles.js";
|
|
5
5
|
import { body as b } from "../../tokens/index.js";
|
|
6
6
|
import { ComposeAsChild as S } from "../slot/compose-as-child.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"appearance-boundary.js","sources":["../../../src/components/appearance-boundary/appearance-boundary.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { mergeClasses } from \"@epilot/zenith-runtime/v1
|
|
1
|
+
{"version":3,"file":"appearance-boundary.js","sources":["../../../src/components/appearance-boundary/appearance-boundary.tsx"],"sourcesContent":["import * as React from \"react\"\n\nimport { mergeClasses } from \"@epilot/zenith-runtime/v1\"\n\nimport { SLOT_ATTR } from \"../../renderer/contract\"\nimport { makeZenithStyles } from \"../../styles/make-styles\"\nimport * as tokens from \"../../tokens\"\nimport { ComposeAsChild } from \"../slot/compose-as-child\"\n\n/**\n * A region that carries its own appearance — `packages/tokens/SPEC.md` §2 rule 3's document\n * boundary, as a component instead of two hand-written DOM attributes.\n */\n\nexport type AppearanceMode = \"light\" | \"dark\"\n\n/**\n * Reduced from five to two on 2026-09-17: `glass`, `tint` and `card` were removed and `plain`\n * was renamed `flat`. `flat` is the root anchor, `bordered` the inheritance base (SPEC §2 rule 3).\n */\nexport type AppearanceSurface = \"flat\" | \"bordered\"\n\nexport type Appearance = {\n mode: AppearanceMode\n surface: AppearanceSurface\n}\n\nconst CANONICAL_MODES: readonly AppearanceMode[] = [\"light\", \"dark\"]\nconst CANONICAL_SURFACES: readonly AppearanceSurface[] = [\"flat\", \"bordered\"]\n\n/** Per-axis normalization of invalid runtime input, mirroring `canonicalDensity`. */\nexport const canonicalAppearance = (appearance: Appearance): Appearance => ({\n mode: CANONICAL_MODES.includes(appearance.mode) ? appearance.mode : \"light\",\n surface: CANONICAL_SURFACES.includes(appearance.surface)\n ? appearance.surface\n : \"flat\",\n})\n\n/**\n * Unexported, same as `DensityContext` — read only through `useAppearance()`. Default `undefined`:\n * a component with no `AppearanceBoundary` ancestor gets `undefined`, never a fabricated\n * `{light, plain}`, which would be this package inventing a reading of the live shell attributes it\n * deliberately does not read.\n */\nconst AppearanceContext = React.createContext<Appearance | undefined>(undefined)\n\n/**\n * A mode is a canvas, so a region that restates one has to paint it. `flat` leaves\n * `surface.object` transparent, which means a boundary that only stamped the attributes let the\n * page behind it show through: a `mode=\"light\"` region on a dark page rendered light ink onto the\n * dark page at 1.08:1. Painting `body` is what makes \"regardless of the page's\" true.\n *\n * Skipped when the nearest ancestor boundary already declares this mode, so restating a mode\n * inside a region that has one stays transparent and composes as before.\n */\nconst useCanvasStyles = makeZenithStyles({\n canvas: { backgroundColor: tokens.body },\n})\n\ntype AppearanceBoundaryBaseProps = Omit<\n React.ComponentProps<\"div\">,\n \"children\"\n> & {\n /** The mode this region renders in, regardless of the page's. No default. */\n mode: AppearanceMode\n /** The treatment this region restates. Required — see the note on both props above. */\n surface: AppearanceSurface\n}\n\nexport type AppearanceBoundaryProps =\n | (AppearanceBoundaryBaseProps & {\n asChild?: false\n children?: React.ReactNode\n })\n | (AppearanceBoundaryBaseProps & {\n asChild: true\n children: React.ReactElement\n })\n\n/**\n * The default is one ordinary HTML div. `asChild` stamps the same authoritative pair on one actual\n * child without a wrapper, while keeping the context provider around it so portal descendants keep\n * their nearest explicit appearance. Child markers remain the child's identity.\n */\nexport const AppearanceBoundary = React.forwardRef<\n HTMLDivElement,\n AppearanceBoundaryProps\n>(function AppearanceBoundary(\n { mode, surface, asChild = false, className, children, ...props },\n ref\n) {\n const value = React.useMemo(\n () => canonicalAppearance({ mode, surface }),\n [mode, surface]\n )\n\n const inherited = useAppearance()\n const styles = useCanvasStyles()\n const merged =\n inherited?.mode === value.mode\n ? className\n : mergeClasses(styles.canvas, className)\n\n const content = asChild ? (\n <ComposeAsChild\n {...props}\n ref={ref}\n className={merged}\n forceProps={{ \"data-theme\": value.mode, \"data-surface\": value.surface }}\n // Authoritative, spread LAST: required normalized props win over conflicting child attrs.\n data-theme={value.mode}\n data-surface={value.surface}\n >\n {children as React.ReactElement}\n </ComposeAsChild>\n ) : (\n <div\n ref={ref}\n data-slot=\"appearance-boundary\"\n {...{ [SLOT_ATTR]: \"appearance-boundary\" }}\n className={merged}\n {...props}\n // Authoritative, spread LAST — the same ordering rule `DensityProvider` applies to\n // `data-density`. `AppearanceBoundaryProps` extends every native div prop, so a caller can\n // pass a raw conflicting `data-theme`/`data-surface`; the normalized required props win, and\n // the DOM attributes then always agree with the context value below.\n data-theme={value.mode}\n data-surface={value.surface}\n >\n {children}\n </div>\n )\n\n return (\n <AppearanceContext.Provider value={value}>\n {content}\n </AppearanceContext.Provider>\n )\n})\n\n/**\n * The nearest explicit boundary, or `undefined` when there is none. Package-internal — NOT exported\n * from `src/index.ts`; `AppearanceBoundary` is the whole public surface. Never reads\n * `getComputedStyle` or `documentElement`: `undefined` means \"no explicit boundary in the React\n * tree\", not \"the ambient appearance is unknown\".\n */\nexport const useAppearance = (): Appearance | undefined =>\n React.useContext(AppearanceContext)\n\n/**\n * The attributes a portal-content element re-stamps, or nothing at all. Portalled content is a\n * React-tree descendant but a DOM sibling, so a boundary's DOM attributes do not reach it while\n * its context does — exactly the asymmetry `DensityProvider` was built around (DENSITY-SPEC.md\n * §4.4).\n */\nexport const useAppearanceAttributes = (): {\n \"data-theme\"?: AppearanceMode\n \"data-surface\"?: AppearanceSurface\n} => {\n const appearance = useAppearance()\n return appearance === undefined\n ? {}\n : { \"data-theme\": appearance.mode, \"data-surface\": appearance.surface }\n}\n"],"names":["CANONICAL_MODES","CANONICAL_SURFACES","canonicalAppearance","appearance","AppearanceContext","React","useCanvasStyles","makeZenithStyles","tokens.body","AppearanceBoundary","mode","surface","asChild","className","children","props","ref","value","inherited","useAppearance","styles","merged","mergeClasses","content","jsx","ComposeAsChild","SLOT_ATTR","useAppearanceAttributes"],"mappings":";;;;;;AA2BA,MAAMA,IAA6C,CAAC,SAAS,MAAM,GAC7DC,IAAmD,CAAC,QAAQ,UAAU,GAG/DC,IAAsB,CAACC,OAAwC;AAAA,EAC1E,MAAMH,EAAgB,SAASG,EAAW,IAAI,IAAIA,EAAW,OAAO;AAAA,EACpE,SAASF,EAAmB,SAASE,EAAW,OAAO,IACnDA,EAAW,UACX;AACN,IAQMC,IAAoBC,EAAM,cAAsC,MAAS,GAWzEC,IAAkBC,EAAiB;AAAA,EACvC,QAAQ,EAAE,iBAAiBC,EAAO;AACpC,CAAC,GA2BYC,IAAqBJ,EAAM,WAGtC,SACA,EAAE,MAAAK,GAAM,SAAAC,GAAS,SAAAC,IAAU,IAAO,WAAAC,GAAW,UAAAC,GAAU,GAAGC,EAAA,GAC1DC,GACA;AACA,QAAMC,IAAQZ,EAAM;AAAA,IAClB,MAAMH,EAAoB,EAAE,MAAAQ,GAAM,SAAAC,GAAS;AAAA,IAC3C,CAACD,GAAMC,CAAO;AAAA,EAAA,GAGVO,IAAYC,EAAA,GACZC,IAASd,EAAA,GACTe,KACJH,KAAA,gBAAAA,EAAW,UAASD,EAAM,OACtBJ,IACAS,EAAaF,EAAO,QAAQP,CAAS,GAErCU,IAAUX,IACd,gBAAAY;AAAA,IAACC;AAAA,IAAA;AAAA,MACE,GAAGV;AAAA,MACJ,KAAAC;AAAA,MACA,WAAWK;AAAA,MACX,YAAY,EAAE,cAAcJ,EAAM,MAAM,gBAAgBA,EAAM,QAAA;AAAA,MAE9D,cAAYA,EAAM;AAAA,MAClB,gBAAcA,EAAM;AAAA,MAEnB,UAAAH;AAAA,IAAA;AAAA,EAAA,IAGH,gBAAAU;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAR;AAAA,MACA,aAAU;AAAA,MACJ,CAACU,CAAS,GAAG;AAAA,MACnB,WAAWL;AAAA,MACV,GAAGN;AAAA,MAKJ,cAAYE,EAAM;AAAA,MAClB,gBAAcA,EAAM;AAAA,MAEnB,UAAAH;AAAA,IAAA;AAAA,EAAA;AAIL,SACE,gBAAAU,EAACpB,EAAkB,UAAlB,EAA2B,OAAAa,GACzB,UAAAM,GACH;AAEJ,CAAC,GAQYJ,IAAgB,MAC3Bd,EAAM,WAAWD,CAAiB,GAQvBuB,IAA0B,MAGlC;AACH,QAAMxB,IAAagB,EAAA;AACnB,SAAOhB,MAAe,SAClB,CAAA,IACA,EAAE,cAAcA,EAAW,MAAM,gBAAgBA,EAAW,QAAA;AAClE;"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { jsx as r, jsxs as c } from "react/jsx-runtime";
|
|
2
2
|
import * as a from "react";
|
|
3
|
-
import { mergeClasses as g, SLOT_ATTR as m, shorthands as S } from "@epilot/zenith-runtime/v1
|
|
3
|
+
import { mergeClasses as g, SLOT_ATTR as m, shorthands as S } from "@epilot/zenith-runtime/v1";
|
|
4
4
|
import { makeZenithStyles as I } from "../../styles/make-styles.js";
|
|
5
5
|
import { boxModel as w } from "../../styles/host-reset.js";
|
|
6
6
|
import { grayA11 as E, leadingSm as L, textSm as P, spacingElement2 as h, spacingElement1 as k, radiusMd as C, body as z } from "../../tokens/index.js";
|