@rinzai/zen 0.14.0 → 0.16.0

package/CHANGELOG.md

@@ -0,0 +1,153 @@
+# Changelog
+
+## 0.16.0
+
+### Added to existing components
+
+- **MenuContent**: `sheet` makes the menu a bottom sheet on phones (below `md`), as music apps show a song's menu: across the bottom of the screen over a scrim, with a grip, swiped down or tapped outside to close. Its submenus slide in over it, with a row at the top that goes back (the arrow back and Escape still do), and open only when chosen, not on hover. Wider screens keep the popover.
+- **SortableList**: works with a virtualized list. Give it `itemHeight` and render only the rows in view (from `useVirtualList`), each at its place in `value`; a drag works from `value`, not the rows on screen, and rows that come into view as it scrolls the list take their places. `onLiftedChange` says which item is picked up (by its handle or from the keyboard), to keep its row rendered. An item moved with the keyboard is scrolled into view.
+- **useVirtualList**: `keep` renders a row even when it's out of view, such as the one being dragged, with the rows between.
+- **SeekBar**: `times="below"` puts the time played and the length under the ends of the bar, as on a phone's Now Playing screen.
+- **TooltipContent**: `side="beside"` puts the tooltip after its trigger (before it if there's no room) instead of below, centred on it, as for the icons of a collapsed sidebar, where a tooltip below would cover the next icon. `align` lines up its top or bottom with the trigger's instead.
+- **Anchored popups** (`anchoredStyle`): beside the trigger, `align` now chooses top (start, as before), middle (center) or bottom (end).
+
+### Fixes
+
+- **ToastProvider**: once its toasts were gone, the empty toast area kept its last height (the height it was given went negative, which browsers ignore) and caught clicks meant for what was under it, such as a player bar's controls. It now shrinks to nothing.
+
+## 0.15.0
+
+### New components
+
+- **PlayerBar**: what's playing, in a glass bar along the bottom of the screen, laid out as you like. On phones it sits on the TabBar beside it.
+- **SeekBar**: where playback is, filled to the time played and shaded on to what's loaded, between the time played and the length. Pass `playing` and it glides between the player's time updates, moved by the browser's compositor rather than per-frame renders. Dragging doesn't interrupt playback; letting go seeks; the arrow keys seek 5 seconds.
+- **Marquee**: one line of text cut off with an ellipsis that scrolls to show the rest: on hover or keyboard focus of itself or of its `data-zen-marquee-host` (a row, a tile), or always (`trigger="always"`, for what's playing). Only text that doesn't fit moves, at the same speed whatever its length, with fades at the edges. Stays an ellipsis for reduced motion; the accessible name is the text.
+- **useMediaPlayer**: drives your own `<audio>` or `<video>` (`const [ref, player] = useMediaPlayer()`, then `<audio ref={ref} />`) and keeps its state: playing, waiting, time, duration, buffered, volume. With `play`, `pause`, `toggle`, `seek`, `setVolume` and `setMuted`.
+- **useMediaSession**: puts what's playing on the lock screen and the OS media controls (title, artist, cover, position), and lets play, pause, seek, previous, next and the media keys control your player.
+- **formatDuration**: seconds as a clock reads them (3:07, 1:02:07).
+
+### Renamed
+
+- **TextArea** is now **Textarea** (and `TextAreaProps` is `TextareaProps`), like the element. The old names still work, marked deprecated, until the next breaking release.
+
+### Added to existing components
+
+- **TabBar**: its height is kept in `--zen-tab-bar-height` on its parent (0px while hidden), for a PlayerBar to sit on and the page to pad its end by. PlayerBar keeps `--zen-player-bar-height` the same way.
+- **Segmented**, **RadioCards**: `label` is optional. Without it, name the group with `aria-label` or `aria-labelledby`, as on RadioGroup.
+- **Slider**: `step="any"` for no snapping.
+
+### Fixes
+
+- **SegmentedItem**: an icon and its text sit side by side; they stacked.
+- **Popover, Menu, Select and every anchored popup**: with no room below the trigger, a centred popup wider than its trigger stayed below it, off screen (Chrome) or over the trigger (Firefox), instead of flipping above. It flips now, and a popup lined up with an edge also switches edges when there's no room beside it.
+- **Carousel**: where the slides don't fill the view evenly, Next stopped short of the end, the last slide cut off. The end is now the last stop, with its own dot.
+- **TabBarItem**, **MenuItem**: with `asChild`, `icon` was dropped; it now goes ahead of your link's content, also when that content is a render function (a NavLink's).
+
+### Docs
+
+- The docs ship in the package as markdown, for AI agents: `node_modules/@rinzai/zen/dist/docs` has a page per component with every example's source, and the CHANGELOG is included. The site serves the same pages at `/docs/<component>.md`, with `/llms.txt` and `/llms-full.txt`.
+- Props tables cover parts kept outside a package's `index.tsx`, such as SortableTree, SortableItem, DonutChart and the table's selection and swipe parts.
+- The package's markdown pages have the props tables too, the same as the site's. Their README and `llms.txt` carry the README's guide: setup, the props every component takes, values and forms, languages, theming, overlays and browser support. The README now says Zen exports no icons.
+
+## 0.14.0
+
+### Added to existing components
+
+- **NumberField**: `onValueChange` gets a second argument saying how the number changed: `{ reason: 'step', delta }` for − +, ↑↓ and Page Up/Down, `'input'` for typing, `'limit'` for Home and End. `onValueCommit` fires once per finished change: each step, and what's typed on Enter or on leaving the field. So a step can be sent on as a step to whatever keeps the number (see Number Field → Steps).
+
+## 0.13.0
+
+Since 0.12.0. This release renames things. Every breaking change is listed first, with what to change.
+
+### Breaking changes
+
+#### Callbacks are named for what they change
+
+| Before                                             | After                                                                                                                                                                                                                                                                       |
+| -------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| `onChange`                                         | `onValueChange` on Select, Segmented, RadioGroup, RadioCards, Calendar, DatePicker, DateRangePicker, MonthPicker, MoneyInput, ColorPicker, ColorPanel, IconPicker, RepeatPicker and SortableList (Combobox, Keypad, Slider, RangeSlider, TagInput and Tabs already used it) |
+| `onChange(checked)` on Checkbox, Toggle            | `onCheckedChange(checked)`; `onChange` is the native event again                                                                                                                                                                                                            |
+| Canvas `onChange` / `onChangeEnd` / `onSelect`     | `onItemsChange` / `onItemsChangeEnd` / `onSelectedChange`                                                                                                                                                                                                                   |
+| CalendarHeatmap `onSelect`                         | `onSelectedChange`                                                                                                                                                                                                                                                          |
+| DatePicker, DateRangePicker, MonthPicker `onClear` | `clearable`; clearing calls `onValueChange(null)`                                                                                                                                                                                                                           |
+
+`value` is optional wherever it was required. Leave it out and pass `defaultValue` to let the control keep its own.
+
+#### One tone scale: `default`, `positive`, `negative`
+
+| Before                                                          | After                                      |
+| --------------------------------------------------------------- | ------------------------------------------ |
+| `destructive` (Button, Badge, ChartReference, TableSwipeAction) | `tone="negative"`                          |
+| `danger` (Meter), `error` (Toast, FormMessage)                  | `negative`                                 |
+| `success`                                                       | `positive`                                 |
+| `info` (Toast, FormMessage), `primary` (Sparkline)              | `default`                                  |
+| MenuItem, ConfirmDialog `destructive`                           | `tone="negative"`                          |
+| Button `variant="destructive"`                                  | `tone="negative"` (on the default variant) |
+| Button `variant="icon"`                                         | `variant="ghost"` with an icon size        |
+
+#### Sizes
+
+- Icon buttons line up with fields and buttons of the same size: `icon-sm` is 32px, `icon` is 40px (was 36), `icon-lg` is 44px. The old 24px `icon-sm` is now `icon-xs`.
+- ThemeToggle is 40px.
+- Input's `size` is `"sm" | "lg"` (Button's heights). It no longer passes through the native `size` attribute.
+
+#### Right to left
+
+- Table: `sticky="left"` is `sticky="start"`.
+- TableContainer's `data-under-left` attribute is `data-under-start`.
+- The `.zen__sticky-left` class is `.zen__sticky-start`.
+- Spacing, corners and positions use logical sides, so a class you override may now be `ps-*`/`pe-*`/`start-*`/`end-*`/`text-start` rather than `pl-*`/`left-*`/`text-left`.
+
+#### Forms
+
+- MoneyInput with `name` submits the amount in minor units, from a hidden input (e.g. `123450` for $1,234.50). It used to submit the visible text.
+
+#### Words
+
+- `ICON_COLORS` entries no longer have English labels: `IconColor.label` is optional, and the names come from the messages.
+- `ImageCropError` takes a `reason` code first, `new ImageCropError(reason, message)`, so you can show the error in your own words.
+- `describeRepeat` takes the words as an optional last argument.
+
+### New components
+
+- **Accordion**: disclosures where one or several (`multiple`) open at a time, with ↑↓, Home and End between headings.
+- **Separator**: across or upright, and `decorative` when it's only visual.
+- **ToggleGroup**: buttons that stay pressed, one or several (`multiple`).
+- **Toolbar**: one Tab stop, with arrow keys through its controls, a ToggleGroup's items included. Runs across or upright.
+- **ButtonGroup**: buttons joined into one control, a split button's menu included.
+- **HoverCard**: a glass preview of what a link points to, on hover or keyboard focus.
+- **NumberField**: a number with − and + buttons and arrow keys (PageUp/PageDown for larger steps). Typed and shown in the locale's format, including percent.
+- **TimeField**: hours, minutes and AM/PM as segments, in the locale's order and clock.
+- **Carousel**: native scroll snapping, with glass previous/next buttons and dots in CarouselControls, and the arrow keys.
+- **Resizable** (ResizablePanelGroup, ResizablePanel, ResizableHandle): drag a handle or use the arrow keys, within each panel's limits. Groups nest, and `onLayout` reports the sizes.
+- **Menubar**: a row of menus with one Tab stop. ←→ move between them; with one open, ←→ open the next and hover switches.
+- **NavigationMenu**: site navigation with panels of links that open on hover or click.
+- **SortableTree**: drag-and-drop for groups and nested items. Drop into another group, into an open sub-item, or under another item; `accepts` says what goes where. Keyboard: ↑↓ through every allowed place, ←→ a level out or in, each step announced. Works on table rows (see Table → Reorder).
+- **LocaleProvider**: the locale and every word Zen shows or announces. Pass a partial `messages` to translate or reword any of them (`ENGLISH` lists them all).
+
+### Added to existing components
+
+- **Menu**:
+    - Submenus (MenuSub, MenuSubTrigger, MenuSubContent).
+    - MenuCheckboxItem, and MenuRadioGroup with MenuRadioItem.
+    - ↓ or ↑ on a MenuTrigger opens the menu at its first or last item.
+- **SortableList**: `asChild` on the list and its items, to sort your own elements, such as a TableBody's rows.
+- **Fields** (Input, InputGroup, MoneyInput, Select, Combobox, DatePicker, DateRangePicker, MonthPicker, ColorPicker): `size="sm" | "lg"`, at Button's heights.
+- **Form submission and reset**: custom controls with a `name` are submitted with their form and reset with it. These are Combobox, the date and month pickers, MoneyInput, ColorPicker, TagInput, RepeatPicker, RangeSlider and IconPicker.
+- **Props and refs**: `id`, `data-*`, `aria-*`, `style`, handlers and `ref` reach every component's element. Where a component keeps its own ref, yours is merged with it.
+- **Exported props types**: every component's props type is exported (`ButtonProps`, `TabsProps`…).
+- **Server components**: `'use client'` marks only modules that use React. Money, dates, `cx`, colours and the package entry can be called from server components.
+- **Right to left**: layout, arrow keys, chevrons and slider fills follow `dir`. Calendar, CalendarHeatmap and Pagination use the locale's digits.
+- **Focus**: every control uses the same keyboard focus ring (the `focus-ring` utility).
+
+### Fixes
+
+- Calendar marks today only once hydrated, so server and client render the same.
+- Combobox's list is named after its field.
+- Tabs without panels no longer point `aria-controls` at nothing.
+- Closed popovers and dialogs stay hidden whatever `className` lays them out with.
+- HoverCard and Tooltip are placed against their trigger in browsers without CSS anchor positioning.
+
+### Tests
+
+- Behaviour tests now run in Chromium, Firefox and WebKit, with new keyboard tests and accessibility checks of open popups in both themes. CI runs them.

package/README.md

@@ -57,18 +57,33 @@ export default function App() {
 }
 ```
 
+## For AI agents
+
+Every docs page ships with the package as markdown, matching the installed version: `node_modules/@rinzai/zen/dist/docs` (README.md lists them), with the CHANGELOG at the package root. Point your agent there from your `AGENTS.md` or `CLAUDE.md`:
+
+```md
+UI components come from @rinzai/zen. Its docs, with every example's source, are in node_modules/@rinzai/zen/dist/docs; start at README.md there.
+```
+
+The site has them too: [llms.txt](https://zen.rinzai.dev/llms.txt), [llms-full.txt](https://zen.rinzai.dev/llms-full.txt) (everything in one file) and `/docs/<component>.md`.
+
 ## What's inside
 
 - **Surfaces:** Card, Inset, Alert, Stat, Dialog (and sheets from an edge), ConfirmDialog, Popover, Tooltip, HoverCard, Toast (a stacked deck), Disclosure, Accordion, Separator, Resizable panels, Carousel, Backdrop (aurora, contours or dots, and a pointer light)
-- **Inputs:** Button, ButtonGroup, Toggle, ToggleGroup, Toolbar, Input, TextArea, InputGroup, NumberField, TimeField, MoneyInput (with currency conversion), Select, Combobox, Calendar, DatePicker, DateRangePicker, MonthPicker, ColorPicker, Checkbox, RadioGroup, RadioCards, Segmented, Slider, Chip, Field
+- **Inputs:** Button, ButtonGroup, Toggle, ToggleGroup, Toolbar, Input, Textarea, InputGroup, NumberField, TimeField, MoneyInput (with currency conversion), Select, Combobox, Calendar, DatePicker, DateRangePicker, MonthPicker, ColorPicker, Checkbox, RadioGroup, RadioCards, Segmented, Slider, Chip, Field
 - **Data:** Chart (areas, lines, bars) and DonutChart in plain SVG, composable Table with sticky edges, sorting and rows reordered by drag and drop, tree rows, editable cells, virtual rows, SortableList and SortableTree, Meter, ProgressRing, AnimatedNumber, Badge, StatusPill (a live save status), Skeleton, Spinner, Canvas (items placed freely, with snapping)
 - **Navigation:** Header, NavigationMenu, Pills, Tabs, TabBar, SideNav, TableOfContents, Menu (with submenus, checkbox and radio items, and context menus), Menubar
+- **Media:** PlayerBar (sits on a TabBar), SeekBar, Marquee (cut-off titles that scroll to show the rest), `useMediaPlayer` for your own `<audio>` or `<video>`, `useMediaSession` for the lock screen and media keys, `formatDuration`
 - **Theming:** dark and light, OKLCH tokens, and a theme generator (presets or any hue) that keeps contrast readable
 - **Languages:** LocaleProvider for the locale and every word, and right-to-left layout
 - **Hooks and utilities:** `themeWave` (the theme spreads from the switch like a drop falling into water: ripples, glints and a rainbow edge, drawn on the GPU; `prepareThemeWave` readies it when the pointer reaches your own switch), `useAnchoredPopup`, `useVirtualList`, `useTree`, `useSort`, `useCopyToClipboard`, money, currency, month and date helpers, `hexToOklch` and `oklchToHex`, `cx` (Tailwind-aware class merging), `cva`
 
+## Props
+
 Every component takes `className`, and a class you pass always overrides the component's default. Other props (`id`, `aria-*`, `data-*`, handlers) and `ref` reach its element, and parts that render a link or button take `asChild` to use your own (a router's Link, say).
 
+Zen exports no icons. Use any icon set (the examples use [Heroicons](https://heroicons.com)) and pass icons in as elements, such as `icon={<HomeIcon />}`.
+
 ## Values and forms
 
 Controls report changes with `onValueChange` (`onCheckedChange` for Checkbox and Toggle). Pass `value` to control one, or `defaultValue` to let it keep its own. Give a control a `name` and it's submitted with its form, the custom ones (Combobox, the date pickers, MoneyInput, ColorPicker, TagInput…) included, and goes back to its first value when the form is reset.

package/dist/animated-number/index.js

@@ -1,14 +1,14 @@
 "use client";
-import { cx as e } from "../utils/cx.js";
-import { useLocale as t } from "../locale-provider/index.js";
+import { useLocale as e } from "../locale-provider/index.js";
+import { cx as t } from "../utils/cx.js";
 import { formatMoney as n } from "../utils/money.js";
 import { reducedMotion as r } from "../utils/motion.js";
 import { useEffect as i, useLayoutEffect as a, useRef as o, useState as s } from "react";
 import { jsx as c, jsxs as l } from "react/jsx-runtime";
 //#region packages/animated-number/index.tsx
 var u = typeof window > "u" ? i : a, d = (e) => 1 - (1 - e) ** 3;
-function f({ value: t, format: n = String, duration: a = 650, fromZero: f = !0, roll: p = !1, className: h }) {
-	let [g, _] = s(f ? 0 : t), v = o(f ? 0 : t), [y, b] = s(!f);
+function f({ value: e, format: n = String, duration: a = 650, fromZero: f = !0, roll: p = !1, className: h }) {
+	let [g, _] = s(f ? 0 : e), v = o(f ? 0 : e), [y, b] = s(!f);
 	if (i(() => {
 		if (!p || y) return;
 		let e = requestAnimationFrame(() => b(!0));
@@ -16,22 +16,22 @@ function f({ value: t, format: n = String, duration: a = 650, fromZero: f = !0,
 	}, [p, y]), u(() => {
 		if (p) return;
 		if (r() || a <= 0) {
-			v.current = t, _(t);
+			v.current = e, _(e);
 			return;
 		}
-		let e = v.current, n = performance.now(), i = requestAnimationFrame(function r(o) {
-			let s = Math.min(1, (o - n) / a), c = Math.round(e + (t - e) * d(s));
+		let t = v.current, n = performance.now(), i = requestAnimationFrame(function r(o) {
+			let s = Math.min(1, (o - n) / a), c = Math.round(t + (e - t) * d(s));
 			v.current = c, _(c), s < 1 && (i = requestAnimationFrame(r));
 		});
 		return () => cancelAnimationFrame(i);
 	}, [
-		t,
+		e,
 		a,
 		p
 	]), p) {
-		let r = n(t);
+		let r = n(e);
 		return /* @__PURE__ */ l("span", {
-			className: e("zen__animated-number inline-flex items-start tabular-nums", h),
+			className: t("zen__animated-number inline-flex items-start tabular-nums", h),
 			children: [/* @__PURE__ */ c("span", {
 				className: "sr-only",
 				children: r
@@ -46,7 +46,7 @@ function f({ value: t, format: n = String, duration: a = 650, fromZero: f = !0,
 		});
 	}
 	return /* @__PURE__ */ c("span", {
-		className: e("zen__animated-number tabular-nums", h),
+		className: t("zen__animated-number tabular-nums", h),
 		children: n(g)
 	});
 }
@@ -75,10 +75,10 @@ function m({ digit: e, duration: t }) {
 		})
 	});
 }
-function h({ value: e, currency: r, locale: i, showDecimals: a = !1, ...o }) {
-	let s = t(i);
+function h({ value: t, currency: r, locale: i, showDecimals: a = !1, ...o }) {
+	let s = e(i);
 	return /* @__PURE__ */ c(f, {
-		value: e,
+		value: t,
 		format: (e) => n(e, r, s, { showDecimals: a }),
 		...o
 	});

package/dist/breadcrumbs/index.js

@@ -1,37 +1,37 @@
 "use client";
-import e from "../icons/micro/chevron-right.js";
-import { cx as t } from "../utils/cx.js";
-import { Slot as n } from "../utils/slot.js";
-import { useMessages as r } from "../locale-provider/index.js";
+import { useMessages as e } from "../locale-provider/index.js";
+import t from "../icons/micro/chevron-right.js";
+import { cx as n } from "../utils/cx.js";
+import { Slot as r } from "../utils/slot.js";
 import { Children as i, Fragment as a, isValidElement as o } from "react";
 import { jsx as s, jsxs as c } from "react/jsx-runtime";
 //#region packages/breadcrumbs/index.tsx
-function l({ className: n, children: l, "aria-label": u, ...d }) {
-	let f = r(), p = u ?? f.breadcrumb, m = i.toArray(l).filter(o);
+function l({ className: r, children: l, "aria-label": u, ...d }) {
+	let f = e(), p = u ?? f.breadcrumb, m = i.toArray(l).filter(o);
 	return /* @__PURE__ */ s("nav", {
 		"aria-label": p,
-		className: t("zen__breadcrumbs", n),
+		className: n("zen__breadcrumbs", r),
 		...d,
 		children: /* @__PURE__ */ s("ol", {
 			className: "text-muted-foreground flex flex-wrap items-center gap-1.5 text-sm",
-			children: m.map((t, n) => /* @__PURE__ */ c(a, { children: [n > 0 && /* @__PURE__ */ s("li", {
+			children: m.map((e, n) => /* @__PURE__ */ c(a, { children: [n > 0 && /* @__PURE__ */ s("li", {
 				"aria-hidden": !0,
 				className: "text-muted-foreground/60 flex",
-				children: /* @__PURE__ */ s(e, { className: "size-3.5 rtl:-scale-x-100" })
+				children: /* @__PURE__ */ s(t, { className: "size-3.5 rtl:-scale-x-100" })
 			}), /* @__PURE__ */ s("li", {
 				className: "flex min-w-0",
-				children: t
-			})] }, t.key ?? n))
+				children: e
+			})] }, e.key ?? n))
 		})
 	});
 }
-function u({ current: e, asChild: r, className: i, ...a }) {
-	let o = t("truncate rounded-sm outline-hidden transition-colors focus-ring", e ? "text-foreground font-medium" : "hover:text-foreground touch-target", i);
+function u({ current: e, asChild: t, className: i, ...a }) {
+	let o = n("truncate rounded-sm outline-hidden transition-colors focus-ring", e ? "text-foreground font-medium" : "hover:text-foreground touch-target", i);
 	return e ? /* @__PURE__ */ s("span", {
 		"aria-current": "page",
 		className: o,
 		...a
-	}) : s(r ? n : "a", {
+	}) : s(t ? r : "a", {
 		className: o,
 		...a
 	});

package/dist/calendar/index.js

@@ -1,8 +1,8 @@
 "use client";
-import { cx as e } from "../utils/cx.js";
-import { readingKey as t } from "../utils/direction.js";
-import { useControllable as n } from "../utils/useControllable.js";
-import { useLocale as r, useMessages as i } from "../locale-provider/index.js";
+import { useLocale as e, useMessages as t } from "../locale-provider/index.js";
+import { cx as n } from "../utils/cx.js";
+import { readingKey as r } from "../utils/direction.js";
+import { useControllable as i } from "../utils/useControllable.js";
 import { PICKER_MONTH as a, PICKER_NAV as o } from "../utils/styles.js";
 import s from "../icons/chevron-left.js";
 import c from "../icons/chevron-right.js";
@@ -13,7 +13,7 @@ import { useEffect as ae, useId as oe, useRef as _, useState as v } from "react"
 import { jsx as y, jsxs as b } from "react/jsx-runtime";
 //#region packages/calendar/index.tsx
 function se(se) {
-	let { locale: le, min: x, max: S, isDisabled: ue, weekStartsOn: de, months: C = 1, defaultMonth: fe, className: w, autoFocus: pe, mode: T, value: me, defaultValue: he = null, onValueChange: ge, ...E } = se, D = r(le), _e = new Intl.NumberFormat(D), O = i(), k = de ?? re(D), [A, j] = n(me, he, ge), M = T === "range" ? A : null, N = T === "range" ? null : A, P = N ?? M?.start ?? null, F = ne(), I = ie() ? F : null, [L, R] = v(() => fe ?? (P ?? F).slice(0, 7)), [z, B] = v(() => P ?? F), [V, H] = v(null), [U, W] = v("days"), [G, K] = v(() => Number(L.slice(0, 4))), q = _(null), J = _(pe ?? !1), ve = oe(), ye = l(L, C - 1), be = (e) => e.slice(0, 7) >= L && e.slice(0, 7) <= ye, xe = (e) => !!x && e < x || !!S && e > S || !!ue?.(e), Y = be(z) ? z : m(z, f(z.slice(0, 7), L));
+	let { locale: le, min: x, max: S, isDisabled: ue, weekStartsOn: de, months: C = 1, defaultMonth: fe, className: w, autoFocus: pe, mode: T, value: me, defaultValue: he = null, onValueChange: ge, ...E } = se, D = e(le), _e = new Intl.NumberFormat(D), O = t(), k = de ?? re(D), [A, j] = i(me, he, ge), M = T === "range" ? A : null, N = T === "range" ? null : A, P = N ?? M?.start ?? null, F = ne(), I = ie() ? F : null, [L, R] = v(() => fe ?? (P ?? F).slice(0, 7)), [z, B] = v(() => P ?? F), [V, H] = v(null), [U, W] = v("days"), [G, K] = v(() => Number(L.slice(0, 4))), q = _(null), J = _(pe ?? !1), ve = oe(), ye = l(L, C - 1), be = (e) => e.slice(0, 7) >= L && e.slice(0, 7) <= ye, xe = (e) => !!x && e < x || !!S && e > S || !!ue?.(e), Y = be(z) ? z : m(z, f(z.slice(0, 7), L));
 	ae(() => {
 		J.current && (J.current = !1, q.current?.querySelector(`[data-date="${Y}"]`)?.focus());
 	}, [Y, U]);
@@ -36,16 +36,16 @@ function se(se) {
 			} else j(e);
 		}
 	}, we = (e) => {
-		let n = Y, r = (h(n) - k + 7) % 7, i = {
-			ArrowLeft: p(n, -1),
-			ArrowRight: p(n, 1),
-			ArrowUp: p(n, -7),
-			ArrowDown: p(n, 7),
-			Home: p(n, -r),
-			End: p(n, 6 - r),
-			PageUp: m(n, e.shiftKey ? -12 : -1),
-			PageDown: m(n, e.shiftKey ? 12 : 1)
-		}[t(e.key, e.currentTarget)];
+		let t = Y, n = (h(t) - k + 7) % 7, i = {
+			ArrowLeft: p(t, -1),
+			ArrowRight: p(t, 1),
+			ArrowUp: p(t, -7),
+			ArrowDown: p(t, 7),
+			Home: p(t, -n),
+			End: p(t, 6 - n),
+			PageUp: m(t, e.shiftKey ? -12 : -1),
+			PageDown: m(t, e.shiftKey ? 12 : 1)
+		}[r(e.key, e.currentTarget)];
 		i && (e.preventDefault(), Se(i));
 	}, X = M && M.end === null ? M.start : null, Te = X && V ? V < X ? [V, X] : [X, V] : null, [Z, Q] = M?.end ? [M.start, M.end] : Te ?? [null, null], Ee = (e) => {
 		R((t) => l(t, e));
@@ -80,16 +80,16 @@ function se(se) {
 		]
 	});
 	if (U === "months") {
-		let t = d(D);
+		let e = d(D);
 		return /* @__PURE__ */ b("div", {
-			className: e("zen__calendar w-fit", w),
+			className: n("zen__calendar w-fit", w),
 			...E,
 			children: [$, /* @__PURE__ */ y("div", {
 				className: "grid w-64 grid-cols-3 gap-1",
 				role: "group",
 				"aria-labelledby": ve,
-				children: t.map((t, n) => {
-					let r = `${G}-${String(n + 1).padStart(2, "0")}`, i = !!x && r < x.slice(0, 7) || !!S && r > S.slice(0, 7);
+				children: e.map((e, t) => {
+					let r = `${G}-${String(t + 1).padStart(2, "0")}`, i = !!x && r < x.slice(0, 7) || !!S && r > S.slice(0, 7);
 					return /* @__PURE__ */ y("button", {
 						type: "button",
 						disabled: i,
@@ -98,8 +98,8 @@ function se(se) {
 						onClick: () => {
 							R(r), J.current = !0, B(m(z, f(z.slice(0, 7), r))), W("days");
 						},
-						className: e(a, r === L && "bg-primary text-primary-foreground hover:bg-primary"),
-						children: t
+						className: n(a, r === L && "bg-primary text-primary-foreground hover:bg-primary"),
+						children: e
 					}, r);
 				})
 			})]
@@ -107,15 +107,15 @@ function se(se) {
 	}
 	let De = g(D, "narrow"), Oe = g(D, "long"), ke = Array.from({ length: 7 }, (e, t) => (k + t) % 7);
 	return /* @__PURE__ */ b("div", {
-		className: e("zen__calendar w-fit", w),
+		className: n("zen__calendar w-fit", w),
 		...E,
 		children: [$, /* @__PURE__ */ y("div", {
 			ref: q,
 			className: "flex gap-4",
 			onKeyDown: we,
 			onMouseLeave: () => H(null),
-			children: Array.from({ length: C }, (t, n) => {
-				let r = l(L, n), i = `${r}-01`, a = `${r}-${ee(r)}`, o = p(i, -((h(i) - k + 7) % 7));
+			children: Array.from({ length: C }, (e, t) => {
+				let r = l(L, t), i = `${r}-01`, a = `${r}-${ee(r)}`, o = p(i, -((h(i) - k + 7) % 7));
 				return /* @__PURE__ */ b("table", {
 					role: "grid",
 					"aria-label": u(r, D, "long"),
@@ -131,14 +131,14 @@ function se(se) {
 							className: "text-muted-foreground size-9 text-xs font-medium",
 							children: De[e]
 						}, e)) }) }),
-						/* @__PURE__ */ y("tbody", { children: Array.from({ length: 6 }, (t, n) => /* @__PURE__ */ y("tr", { children: Array.from({ length: 7 }, (t, s) => {
-							let c = p(o, n * 7 + s), l = c.slice(0, 7) === r;
+						/* @__PURE__ */ y("tbody", { children: Array.from({ length: 6 }, (e, t) => /* @__PURE__ */ y("tr", { children: Array.from({ length: 7 }, (e, s) => {
+							let c = p(o, t * 7 + s), l = c.slice(0, 7) === r;
 							if (!l && C > 1) return /* @__PURE__ */ y("td", { role: "gridcell" }, c);
 							let u = c === Z, d = c === Q, f = !!Z && !!Q && c > Z && c < Q, m = c === N || c === M?.start || c === M?.end, h = xe(c);
 							return /* @__PURE__ */ y("td", {
 								role: "gridcell",
 								"aria-selected": m || f || void 0,
-								className: e("p-0", (f || (u || d) && Z !== Q) && "bg-primary/15", u && "rounded-s-lg", d && "rounded-e-lg", f && (s === 0 || C > 1 && c === i) && "rounded-s-lg", f && (s === 6 || C > 1 && c === a) && "rounded-e-lg"),
+								className: n("p-0", (f || (u || d) && Z !== Q) && "bg-primary/15", u && "rounded-s-lg", d && "rounded-e-lg", f && (s === 0 || C > 1 && c === i) && "rounded-s-lg", f && (s === 6 || C > 1 && c === a) && "rounded-e-lg"),
 								children: /* @__PURE__ */ y("button", {
 									type: "button",
 									"data-date": c,
@@ -152,11 +152,11 @@ function se(se) {
 										B(c), X && H(c);
 									},
 									onMouseEnter: () => X && H(c),
-									className: e(ce, !l && "text-muted-foreground", h && "cursor-not-allowed opacity-35", m ? "bg-primary text-primary-foreground shadow-[0_0_20px_-4px_oklch(var(--glow)/calc(0.8*var(--glow-k)))]" : !h && "hover:bg-tint/[0.08]", c === I && "after:bg-primary after:absolute after:bottom-1 after:left-1/2 after:size-1 after:-translate-x-1/2 after:rounded-full", c === I && m && "after:bg-primary-foreground"),
+									className: n(ce, !l && "text-muted-foreground", h && "cursor-not-allowed opacity-35", m ? "bg-primary text-primary-foreground shadow-[0_0_20px_-4px_oklch(var(--glow)/calc(0.8*var(--glow-k)))]" : !h && "hover:bg-tint/[0.08]", c === I && "after:bg-primary after:absolute after:bottom-1 after:left-1/2 after:size-1 after:-translate-x-1/2 after:rounded-full", c === I && m && "after:bg-primary-foreground"),
 									children: _e.format(Number(c.slice(8)))
 								})
 							}, c);
-						}) }, n)) })
+						}) }, t)) })
 					]
 				}, r);
 			})

package/dist/calendar-heatmap/index.js

@@ -1,28 +1,28 @@
 "use client";
-import { cx as e } from "../utils/cx.js";
-import { useLocale as t } from "../locale-provider/index.js";
+import { useLocale as e } from "../locale-provider/index.js";
+import { cx as t } from "../utils/cx.js";
 import { formatMonth as n } from "../utils/month.js";
 import { dayOfWeek as r, daysInMonth as i, formatDate as a, weekStart as o, weekdayNames as s } from "../utils/date.js";
 import { Fragment as c, jsx as l, jsxs as u } from "react/jsx-runtime";
 //#region packages/calendar-heatmap/index.tsx
 function d({ month: d, values: f, locale: p, format: m = String, weekStartsOn: h, onSelectedChange: g, selected: _, label: v, className: y, ...b }) {
-	let x = t(p), S = new Intl.NumberFormat(x), C = h ?? o(x), w = i(d), T = Array.from({ length: w }, (e, t) => `${d}-${String(t + 1).padStart(2, "0")}`), E = (r(T[0]) - C + 7) % 7, D = [...Array(E).fill(null), ...T];
+	let x = e(p), S = new Intl.NumberFormat(x), C = h ?? o(x), w = i(d), T = Array.from({ length: w }, (e, t) => `${d}-${String(t + 1).padStart(2, "0")}`), E = (r(T[0]) - C + 7) % 7, D = [...Array(E).fill(null), ...T];
 	for (; D.length % 7;) D.push(null);
 	let O = Array.from({ length: D.length / 7 }, (e, t) => D.slice(t * 7, t * 7 + 7)), k = s(x, "narrow"), A = s(x, "long"), j = Array.from({ length: 7 }, (e, t) => (C + t) % 7), M = Math.max(0, ...T.map((e) => f[e] ?? 0));
 	return /* @__PURE__ */ u("table", {
 		"aria-label": v ?? n(d, x, "long"),
 		...b,
-		className: e("zen__calendar-heatmap w-full table-fixed border-separate border-spacing-1", y),
+		className: t("zen__calendar-heatmap w-full table-fixed border-separate border-spacing-1", y),
 		children: [/* @__PURE__ */ l("thead", { children: /* @__PURE__ */ l("tr", { children: j.map((e) => /* @__PURE__ */ l("th", {
 			scope: "col",
 			abbr: A[e],
 			className: "text-muted-foreground pb-1 text-xs font-normal",
 			children: k[e]
-		}, e)) }) }), /* @__PURE__ */ l("tbody", { children: O.map((t, n) => /* @__PURE__ */ l("tr", { children: t.map((t, n) => {
-			if (!t) return /* @__PURE__ */ l("td", {}, n);
-			let r = f[t], i = M > 0 && r ? Math.sqrt(r / M) : 0, o = `${a(t, x, "day")}: ${m(r || 0)}`, s = e("relative grid aspect-square w-full place-items-center rounded-md text-[0.65rem] tabular-nums transition-[box-shadow]", i ? i > .6 ? "text-primary-foreground" : "text-foreground/80" : "bg-tint/[0.04] text-muted-foreground", t === _ && "ring-ring ring-2"), d = i ? { background: `oklch(var(--primary) / ${+(.14 + .81 * i).toFixed(2)})` } : void 0, p = /* @__PURE__ */ u(c, { children: [/* @__PURE__ */ l("span", {
+		}, e)) }) }), /* @__PURE__ */ l("tbody", { children: O.map((e, n) => /* @__PURE__ */ l("tr", { children: e.map((e, n) => {
+			if (!e) return /* @__PURE__ */ l("td", {}, n);
+			let r = f[e], i = M > 0 && r ? Math.sqrt(r / M) : 0, o = `${a(e, x, "day")}: ${m(r || 0)}`, s = t("relative grid aspect-square w-full place-items-center rounded-md text-[0.65rem] tabular-nums transition-[box-shadow]", i ? i > .6 ? "text-primary-foreground" : "text-foreground/80" : "bg-tint/[0.04] text-muted-foreground", e === _ && "ring-ring ring-2"), d = i ? { background: `oklch(var(--primary) / ${+(.14 + .81 * i).toFixed(2)})` } : void 0, p = /* @__PURE__ */ u(c, { children: [/* @__PURE__ */ l("span", {
 				"aria-hidden": !0,
-				children: S.format(Number(t.slice(8)))
+				children: S.format(Number(e.slice(8)))
 			}), /* @__PURE__ */ l("span", {
 				className: "sr-only",
 				children: o
@@ -32,9 +32,9 @@ function d({ month: d, values: f, locale: p, format: m = String, weekStartsOn: h
 				className: "p-0",
 				children: g ? /* @__PURE__ */ l("button", {
 					type: "button",
-					"aria-pressed": t === _,
-					onClick: () => g(t),
-					className: e(s, " cursor-pointer outline-hidden hover:shadow-[0_0_0_1px_oklch(var(--tint)/0.3)] focus-ring"),
+					"aria-pressed": e === _,
+					onClick: () => g(e),
+					className: t(s, " cursor-pointer outline-hidden hover:shadow-[0_0_0_1px_oklch(var(--tint)/0.3)] focus-ring"),
 					style: d,
 					children: p
 				}) : /* @__PURE__ */ l("span", {
@@ -42,7 +42,7 @@ function d({ month: d, values: f, locale: p, format: m = String, weekStartsOn: h
 					style: d,
 					children: p
 				})
-			}, t);
+			}, e);
 		}) }, n)) })]
 	});
 }

package/dist/canvas/index.js

@@ -1,7 +1,7 @@
 "use client";
-import { cx as e } from "../utils/cx.js";
-import { useMergedRefs as t } from "../utils/refs.js";
-import { useMessages as n } from "../locale-provider/index.js";
+import { useMessages as e } from "../locale-provider/index.js";
+import { cx as t } from "../utils/cx.js";
+import { useMergedRefs as n } from "../utils/refs.js";
 import { boundsOf as r, intersects as i, moveRect as a, resizeRect as o } from "./geometry.js";
 import { createContext as s, useContext as c, useEffect as l, useId as u, useLayoutEffect as d, useRef as f, useState as p } from "react";
 import { jsx as m, jsxs as h } from "react/jsx-runtime";
@@ -31,7 +31,7 @@ var g = typeof window > "u" ? l : d, _ = 3, ee = "input, textarea, select, butto
 	ArrowDown: [0, 1]
 }, x = (e, t) => e.x === t.x && e.y === t.y && e.w === t.w && e.h === t.h, S = (e, t) => e.length === t.length && e.every((e, n) => e === t[n]), C = s(null);
 function w({ width: s, height: c, scale: l = 1, items: d, onItemsChange: v, onItemsChangeEnd: y, selected: w = [], onSelectedChange: T, minSize: E = 8, snap: D = !1, grid: O, className: te, style: ne, children: re, onPointerDown: ie, ref: ae, ...k }) {
-	let A = n(), j = f(null), oe = t(j, ae), M = f(!1), [N, se] = p(null), [ce, P] = p([]), [F, I] = p(null), [L, R] = p(null), [le, z] = p(!1), [B, V] = p(""), H = u();
+	let A = e(), j = f(null), oe = n(j, ae), M = f(!1), [N, se] = p(null), [ce, P] = p([]), [F, I] = p(null), [L, R] = p(null), [le, z] = p(!1), [B, V] = p(""), H = u();
 	g(() => {
 		let e = j.current;
 		if (l !== "fit" || !e) return;
@@ -190,7 +190,7 @@ function w({ width: s, height: c, scale: l = 1, items: d, onItemsChange: v, onIt
 						height: c * U
 					}
 				},
-				className: e("zen__canvas bg-tint/[0.03] relative shrink-0 overflow-hidden rounded-lg shadow-[inset_0_0_0_1px_oklch(var(--tint)/0.08)] select-none", te),
+				className: t("zen__canvas bg-tint/[0.03] relative shrink-0 overflow-hidden rounded-lg shadow-[inset_0_0_0_1px_oklch(var(--tint)/0.08)] select-none", te),
 				children: [/* @__PURE__ */ m("div", {
 					style: {
 						width: s,
@@ -198,7 +198,7 @@ function w({ width: s, height: c, scale: l = 1, items: d, onItemsChange: v, onIt
 						scale: String(U),
 						"--canvas-scale": U
 					},
-					className: e("absolute top-0 left-0 origin-top-left", l === "fit" && N === null && "invisible"),
+					className: t("absolute top-0 left-0 origin-top-left", l === "fit" && N === null && "invisible"),
 					children: re
 				}), /* @__PURE__ */ h("div", {
 					"aria-hidden": !0,
@@ -260,30 +260,30 @@ function w({ width: s, height: c, scale: l = 1, items: d, onItemsChange: v, onIt
 		]
 	});
 }
-function T({ id: t, label: n, className: r, style: i, children: a, ...o }) {
+function T({ id: e, label: n, className: r, style: i, children: a, ...o }) {
 	let s = c(C);
 	if (!s) throw Error("<CanvasItem> must be inside <Canvas>");
-	let l = s.item(t);
+	let l = s.item(e);
 	if (!l) return null;
-	let u = s.selected.includes(t), d = u && s.selected.length === 1;
+	let u = s.selected.includes(e), d = u && s.selected.length === 1;
 	return /* @__PURE__ */ h("div", {
 		role: "group",
 		"aria-roledescription": l.locked ? "locked item" : "movable item",
 		"aria-label": n,
 		"aria-describedby": l.locked ? void 0 : s.hintId,
 		tabIndex: 0,
-		"data-canvas-id": t,
+		"data-canvas-id": e,
 		"data-selected": u || void 0,
 		"data-locked": l.locked || void 0,
 		...o,
-		onFocus: (e) => {
-			o.onFocus?.(e), e.target === e.currentTarget && s.focus(t);
+		onFocus: (t) => {
+			o.onFocus?.(t), t.target === t.currentTarget && s.focus(e);
 		},
-		onPointerDown: (e) => {
-			o.onPointerDown?.(e), s.grab(e, t, n);
+		onPointerDown: (t) => {
+			o.onPointerDown?.(t), s.grab(t, e, n);
 		},
-		onKeyDown: (e) => {
-			o.onKeyDown?.(e), s.key(e, t, n);
+		onKeyDown: (t) => {
+			o.onKeyDown?.(t), s.key(t, e, n);
 		},
 		style: {
 			...i,
@@ -292,12 +292,12 @@ function T({ id: t, label: n, className: r, style: i, children: a, ...o }) {
 			width: l.w,
 			height: l.h
 		},
-		className: e("zen__canvas-item absolute cursor-move touch-none outline-hidden data-locked:cursor-default data-locked:touch-auto", "[outline-offset:calc(1px/var(--canvas-scale))]", "not-data-selected:hover:outline-solid not-data-selected:hover:outline-[length:calc(1px/var(--canvas-scale))] not-data-selected:hover:outline-[color:oklch(var(--tint)/0.35)]", "data-selected:outline-solid data-selected:outline-[length:calc(2px/var(--canvas-scale))] data-selected:outline-[color:oklch(var(--primary)/0.8)]", "focus-visible:outline-solid focus-visible:outline-[length:calc(2px/var(--canvas-scale))] focus-visible:outline-[color:oklch(var(--ring)/0.7)]", r),
+		className: t("zen__canvas-item absolute cursor-move touch-none outline-hidden data-locked:cursor-default data-locked:touch-auto", "[outline-offset:calc(1px/var(--canvas-scale))]", "not-data-selected:hover:outline-solid not-data-selected:hover:outline-[length:calc(1px/var(--canvas-scale))] not-data-selected:hover:outline-[color:oklch(var(--tint)/0.35)]", "data-selected:outline-solid data-selected:outline-[length:calc(2px/var(--canvas-scale))] data-selected:outline-[color:oklch(var(--primary)/0.8)]", "focus-visible:outline-solid focus-visible:outline-[length:calc(2px/var(--canvas-scale))] focus-visible:outline-[color:oklch(var(--ring)/0.7)]", r),
 		children: [a, d && !l.locked && v.map((r) => /* @__PURE__ */ m("span", {
 			"aria-hidden": !0,
 			"data-handle": r,
-			onPointerDown: (e) => s.grab(e, t, n, r),
-			className: e("bg-foreground absolute z-10 size-[calc(10px/var(--canvas-scale))] -translate-1/2 rounded-full border-[length:calc(2px/var(--canvas-scale))] border-[color:oklch(var(--primary))] shadow-[0_0_8px_oklch(var(--glow)/0.6)]", "after:absolute after:-inset-[calc(6px/var(--canvas-scale))] pointer-coarse:after:-inset-[calc(14px/var(--canvas-scale))]", y[r])
+			onPointerDown: (t) => s.grab(t, e, n, r),
+			className: t("bg-foreground absolute z-10 size-[calc(10px/var(--canvas-scale))] -translate-1/2 rounded-full border-[length:calc(2px/var(--canvas-scale))] border-[color:oklch(var(--primary))] shadow-[0_0_8px_oklch(var(--glow)/0.6)]", "after:absolute after:-inset-[calc(6px/var(--canvas-scale))] pointer-coarse:after:-inset-[calc(14px/var(--canvas-scale))]", y[r])
 		}, r))]
 	});
 }

package/dist/carousel/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../packages/carousel/index.tsx"],"names":[],"mappings":"AAMA,OAAO,EACH,cAAc,EASjB,MAAM,OAAO,CAAC;AA8Bf;;;;;;GAMG;AACH,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EAAE,aAAa,+BAoE/E;AAED,mCAAmC;AACnC,wBAAgB,eAAe,CAAC,EAAE,GAAG,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,cAAc,CAAC,KAAK,CAAC,+BAiBjF;AAED,sDAAsD;AACtD,wBAAgB,YAAY,CAAC,EAAE,GAAG,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,cAAc,CAAC,KAAK,CAAC,+BAoB9E;AAKD;;;;GAIG;AACH,wBAAgB,gBAAgB,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,IAAI,EAAE,EAAE,cAAc,CAAC,QAAQ,CAAC,+BAoBzF;AAED,mEAAmE;AACnE,wBAAgB,YAAY,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,IAAI,EAAE,EAAE,cAAc,CAAC,QAAQ,CAAC,+BAmBrF;AAED,sGAAsG;AACtG,wBAAgB,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,cAAc,CAAC,KAAK,CAAC,sCA6BzE;AAED,8GAA8G;AAC9G,wBAAgB,gBAAgB,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,cAAc,CAAC,KAAK,CAAC,+BAE7E;AAED,MAAM,MAAM,aAAa,GAAG,cAAc,CAAC,SAAS,CAAC,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../packages/carousel/index.tsx"],"names":[],"mappings":"AAMA,OAAO,EACH,cAAc,EASjB,MAAM,OAAO,CAAC;AA8Bf;;;;;;GAMG;AACH,MAAM,CAAC,OAAO,UAAU,QAAQ,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,GAAG,IAAI,EAAE,EAAE,aAAa,+BA0E/E;AAED,mCAAmC;AACnC,wBAAgB,eAAe,CAAC,EAAE,GAAG,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,cAAc,CAAC,KAAK,CAAC,+BAiBjF;AAED,sDAAsD;AACtD,wBAAgB,YAAY,CAAC,EAAE,GAAG,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,cAAc,CAAC,KAAK,CAAC,+BAoB9E;AAKD;;;;GAIG;AACH,wBAAgB,gBAAgB,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,IAAI,EAAE,EAAE,cAAc,CAAC,QAAQ,CAAC,+BAoBzF;AAED,mEAAmE;AACnE,wBAAgB,YAAY,CAAC,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,IAAI,EAAE,EAAE,cAAc,CAAC,QAAQ,CAAC,+BAmBrF;AAED,sGAAsG;AACtG,wBAAgB,YAAY,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,cAAc,CAAC,KAAK,CAAC,sCA6BzE;AAED,8GAA8G;AAC9G,wBAAgB,gBAAgB,CAAC,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,cAAc,CAAC,KAAK,CAAC,+BAE7E;AAED,MAAM,MAAM,aAAa,GAAG,cAAc,CAAC,SAAS,CAAC,CAAC"}