@exsto/ds 0.0.1-rc.2 → 0.0.1-rc.22

package/dist/ui/src/components/ui/scroll-area/scroll-area.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scroll-area.js","names":[],"sources":["../../../../../../../ui/src/components/ui/scroll-area/scroll-area.tsx"],"sourcesContent":["import { ScrollArea as BaseScrollArea } from '@base-ui/react/scroll-area';\nimport { useHoldsFocusable } from '@edyn/ui/hooks/use-holds-focusable';\nimport { useMergedRefs } from '@edyn/ui/hooks/use-merged-refs';\nimport { cn } from '@edyn/ui/lib/utils';\nimport { type ComponentProps, type RefObject, useEffect, useRef } from 'react';\n\n/**\n * When the bar shows: 'hover' on area hover or while scrolling (default),\n * 'scroll' only while scrolling, 'always' permanent. In every mode the bar is\n * mounted only while that axis actually overflows, so 'always' means \"always\n * when there is something to scroll\", never a bar on a list that fits.\n */\nexport type TScrollbarVisibility = 'hover' | 'scroll' | 'always';\n\n/**\n * Surface the edge fades blended into, back when they were painted.\n *\n * @deprecated The fades are cut into the content by a mask, so they match any\n * surface without being told which one. Still accepted, and ignored.\n */\nexport type TScrollAreaFadeFrom = 'card' | 'background' | 'sidebar' | 'popover';\n\nexport interface IScrollBarProps extends ComponentProps<typeof BaseScrollArea.Scrollbar> {\n  visibility?: TScrollbarVisibility;\n}\n\nexport const ScrollBar = ({ className, orientation = 'vertical', visibility = 'hover', ...props }: IScrollBarProps) => {\n  return (\n    <BaseScrollArea.Scrollbar\n      data-slot=\"scroll-area-scrollbar\"\n      orientation={orientation}\n      className={cn(\n        'peer/scrollbar z-100 flex touch-none select-none motion-safe:transition-opacity motion-safe:duration-150',\n        // Size, gap and start read --scroll-bar-size, --scroll-bar-gap and --scroll-bar-start (see scroll-bar.css), whose\n        // defaults are the 8px bar flush with the box that it has always been.\n        orientation === 'vertical' &&\n          'h-(--scroll-bar-length) w-(--scroll-bar-size) me-(--scroll-bar-gap) mt-(--scroll-bar-offset-top) border-l border-l-transparent p-px',\n        orientation === 'horizontal' &&\n          'h-(--scroll-bar-size) ms-(--scroll-bar-gap) me-(--scroll-bar-gap) mb-(--scroll-bar-gap) flex-col border-t border-t-transparent p-px',\n        visibility !== 'always' && 'opacity-0 data-scrolling:opacity-100',\n        visibility === 'hover' && 'data-hovering:opacity-100 group-hover/scroll-area:opacity-100',\n        className,\n      )}\n      {...props}\n    >\n      <BaseScrollArea.Thumb className=\"relative flex-1 rounded-full bg-muted-foreground/50 transition-colors hover:bg-muted-foreground/70 data-scrolling:bg-muted-foreground/70\" />\n    </BaseScrollArea.Scrollbar>\n  );\n};\n\nexport interface IScrollAreaProps extends ComponentProps<typeof BaseScrollArea.Root> {\n  /** Which axes get a styled scrollbar; content decides what actually overflows. */\n  orientation?: 'horizontal' | 'vertical' | 'both';\n  /** Scrollbar reveal behavior (mirrors the Radix ScrollArea `type` prop). */\n  type?: TScrollbarVisibility;\n  /** Edge fades hinting at clipped content; each one shows only while its own edge hides something. */\n  fade?: boolean;\n  /**\n   * @deprecated No longer read. The fades mask the content, so they sit correctly\n   * on any surface; passing this does nothing and is safe to delete.\n   */\n  fadeFrom?: TScrollAreaFadeFrom;\n  /** Places both bars, for a host that gives them a gutter of their own (a sidebar menu). */\n  scrollbarClassName?: string;\n  viewportId?: string;\n  /** Access to the scrollable viewport (e.g. to reset scroll position on route changes). */\n  viewportRef?: RefObject<HTMLDivElement | null>;\n  viewportClassName?: string;\n  /** Published on the viewport as data-scroll-restoration-id, for a router that restores scroll position. */\n  scrollRestorationId?: string;\n  /**\n   * Whether the viewport may be a tab stop (default). It is one only while it overflows and nothing inside can take Tab\n   * (axe's scrollable-region-focusable), with a 1px keyboard-only line. Off inside a menu, whose items are the tab stops.\n   */\n  focusable?: boolean;\n  /** @deprecated Use `viewportId`. */\n  viewPortId?: string;\n  /** @deprecated Use `viewportRef`. */\n  viewPortRef?: RefObject<HTMLDivElement | null>;\n  /** @deprecated Use `viewportClassName`. */\n  viewPortClassName?: string;\n  /** Places the vertical bar only; `scrollbarClassName` covers both. */\n  scrollVerticalClassName?: string;\n  /** Places the horizontal bar only; `scrollbarClassName` covers both. */\n  scrollHorizontalClassName?: string;\n}\n\n/**\n * Which axes fade, published for scroll-fade.css to key its mask off. The\n * stylesheet reaches this element's own viewport through a child combinator, so a\n * ScrollArea nested in another one cannot pick up its ancestor's edges.\n */\n/** Base UI's explicit `role=\"presentation\"` on the parts fails axe's aria-required-children inside a menu or listbox; clearing it does not. */\nconst NO_ROLE = { role: undefined } as const;\n\n/** Base UI makes the viewport a tab stop (0, or -1 with nothing to scroll); undefined takes that away. */\nconst NO_TAB_STOP = { tabIndex: undefined } as const;\n\nconst FADE_AXIS = {\n  vertical: 'block',\n  horizontal: 'inline',\n  both: 'both',\n} as const;\n\n/**\n * Themed scroll container (Base UI): overflowing content scrolls INSIDE the component\n * with a slim overlay scrollbar instead of exposing a native browser scrollbar. House\n * rule: wide/tall content (tables, lists, code) always goes through this, never a bare\n * overflow-* utility.\n *\n * Cap the height with a plain class on the component itself, e.g.\n * `<ScrollArea className=\"max-h-88\">`. The viewport picks the cap up through\n * `max-h-inherit`, which matters because the viewport is the element that actually\n * scrolls: a cap that lands only on the root leaves tall content spilling out\n * underneath with no scrollbar, and that reads as a working height right up until the\n * content outgrows it.\n *\n * `fade` fades out each edge that is currently hiding content, rather than always\n * fading one: a permanent fade is a lie half the time, dimming the last row that fits\n * and promising more below when the reader is already at the end. It is cut into the\n * content by a mask (@edyn/theme/scroll-fade.css), so it needs no surface colour and\n * reads correctly over a tint, a gradient or a glow. A host that keeps something\n * unscrolled at the top, such as a sticky table header, exempts that band by setting\n * --scroll-fade-offset on the ScrollArea. The static faded-* utilities in\n * @edyn/theme/utilities.css are the other tool, for DECORATIVE edges that do not\n * track scroll position.\n *\n * The viewport publishes its size as --scroll-area-width/--scroll-area-height CSS vars\n * so children can size against the visible area.\n */\nexport const ScrollArea = ({\n  className,\n  children,\n  orientation = 'vertical',\n  type = 'hover',\n  fade = false,\n  fadeFrom = 'card',\n  scrollbarClassName,\n  viewportId,\n  viewportRef,\n  viewportClassName,\n  scrollRestorationId,\n  focusable = true,\n  viewPortId,\n  viewPortRef,\n  viewPortClassName,\n  scrollVerticalClassName,\n  scrollHorizontalClassName,\n  ...props\n}: IScrollAreaProps) => {\n  const refInner = useRef<HTMLDivElement | null>(null);\n  // The viewPort* spellings are the pre-rc.4 names, kept so existing callers\n  // keep working; the viewport* ones match the rest of the ecosystem.\n  const refsViewport = useMergedRefs(refInner, viewportRef ?? viewPortRef);\n\n  const holdsFocusable = useHoldsFocusable(refInner, focusable);\n\n  useEffect(() => {\n    const el = refInner.current;\n    if (!el) {\n      return;\n    }\n    const root = el.parentElement;\n    const content = el.firstElementChild;\n    const observer = new ResizeObserver(() => {\n      el.style.setProperty('--scroll-area-width', `${el.clientWidth}px`);\n      el.style.setProperty('--scroll-area-height', `${el.clientHeight}px`);\n      if (orientation !== 'vertical' && root && content instanceof HTMLElement) {\n        // Content that fits the box but not with the bar's room under it would scroll for the bar: the bar overlays it instead.\n        root.removeAttribute('data-bar-over');\n        const style = getComputedStyle(root);\n        const room = root.offsetHeight - content.offsetHeight;\n        const bar = Number.parseFloat(style.getPropertyValue('--scroll-bar-size')) + Number.parseFloat(style.getPropertyValue('--scroll-bar-gap'));\n        if (root.hasAttribute('data-has-overflow-x') && room >= 0 && room < bar) {\n          root.setAttribute('data-bar-over', '');\n        }\n      }\n    });\n    observer.observe(el);\n    if (orientation !== 'vertical' && root && content) {\n      observer.observe(root);\n      observer.observe(content);\n    }\n    return () => {\n      observer.disconnect();\n    };\n  }, [orientation]);\n\n  return (\n    <BaseScrollArea.Root\n      data-slot=\"scroll-area\"\n      // Everything inside clips at this box, so a focus ring drawn outside an\n      // element at the edge would be cut off; see @edyn/theme/focus.css.\n      data-focus=\"inset\"\n      // A single-row grid sizes the viewport from the root's used height, which `h-full` cannot do in a flex column; the bar's\n      // room is the root's padding, and data-bar-over overlays the bar where that room would only make content scroll.\n      className={cn(\n        'group/scroll-area relative grid min-w-0 grid-rows-1 overflow-hidden',\n        orientation !== 'vertical' && 'data-has-overflow-x:not-data-bar-over:pb-(--scroll-bar-reserve)',\n        className,\n      )}\n      data-fade={fade ? FADE_AXIS[orientation] : undefined}\n      {...NO_ROLE}\n      {...props}\n    >\n      {(orientation === 'vertical' || orientation === 'both') && (\n        <ScrollBar orientation=\"vertical\" visibility={type} className={cn(scrollbarClassName, scrollVerticalClassName)} />\n      )}\n      {(orientation === 'horizontal' || orientation === 'both') && (\n        <ScrollBar orientation=\"horizontal\" visibility={type} className={cn(scrollbarClassName, scrollHorizontalClassName)} />\n      )}\n      <BaseScrollArea.Corner />\n      <BaseScrollArea.Viewport\n        data-slot=\"scroll-area-viewport\"\n        id={viewportId ?? viewPortId}\n        ref={refsViewport}\n        data-scroll-restoration-id={scrollRestorationId}\n        {...NO_ROLE}\n        {...(focusable && !holdsFocusable ? null : NO_TAB_STOP)}\n        // One axis means one axis. Base UI leaves both axes scrollable, so a\n        // vertical list could still be dragged sideways, and anything that put a\n        // row in view (focus moving, scrollIntoView with inline: nearest) slid\n        // the whole list across. The clamp is marked important because Base UI\n        // sets the viewport's overflow itself.\n        className={cn(\n          'max-h-inherit w-full rounded-[inherit]',\n          orientation === 'vertical' && 'overflow-x-hidden!',\n          orientation === 'horizontal' && 'overflow-y-hidden!',\n          viewportClassName ?? viewPortClassName,\n        )}\n      >\n        {/* Content is NOT optional: it carries the ResizeObserver that recomputes the\n            thumb when the CONTENT resizes without the viewport resizing (e.g. a route\n            swap to a shorter page). Without it the thumb keeps the previous page's\n            geometry and a fully-visible page still shows a scrollbar.\n\n            A vertical scroller also pins its content to the viewport's width, so a\n            long label truncates instead of widening the list and inventing a\n            horizontal scroll. Base UI sets min-width: fit-content inline, which is\n            what makes that happen and why this is an inline style too. */}\n        <BaseScrollArea.Content {...NO_ROLE} style={orientation === 'vertical' ? { minWidth: 0 } : undefined}>\n          {children}\n        </BaseScrollArea.Content>\n      </BaseScrollArea.Viewport>\n    </BaseScrollArea.Root>\n  );\n};\n"],"mappings":"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"}

package/dist/ui/src/components/ui/select/select.js

@@ -0,0 +1,97 @@
+import { cn } from "../../../lib/utils.js";
+import { useExposedFocusGuards } from "../../../lib/focus-guards.js";
+import { POPUP_FRAME_CLASS, POPUP_GROUP_LABEL_CLASS, POPUP_ITEM_INDICATOR_CLASS, POPUP_LAYER_CLASS, POPUP_LIST_WIDTH_CLASS, popupItemClass } from "../../../lib/popup-list.js";
+import { PopupListScroll } from "../scroll-area/popup-list-scroll.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { IconCheck, IconChevronDown } from "@tabler/icons-react";
+import { Select } from "@base-ui/react/select";
+//#region ../ui/src/components/ui/select/select.tsx
+var Select$1 = ({ ...props }) => {
+	return /* @__PURE__ */ jsx(Select.Root, {
+		"data-slot": "select",
+		...props
+	});
+};
+var SelectTrigger = ({ className, size = "default", children, ...props }) => {
+	return /* @__PURE__ */ jsxs(Select.Trigger, {
+		"data-slot": "select-trigger",
+		className: cn("flex w-full cursor-pointer items-center justify-between gap-2 rounded-lg border border-control bg-transparent text-sm text-foreground transition-colors outline-none", "", "disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50", "aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20", "data-popup-open:outline-solid", "dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40", size === "sm" ? "h-7 px-2.5 text-xs" : "h-8 px-2.5", className),
+		...props,
+		children: [children, /* @__PURE__ */ jsx(Select.Icon, {
+			"data-slot": "select-icon",
+			className: "shrink-0 text-muted-foreground",
+			children: /* @__PURE__ */ jsx(IconChevronDown, { className: "size-4" })
+		})]
+	});
+};
+var SelectValue = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx(Select.Value, {
+		"data-slot": "select-value",
+		className: cn("truncate data-placeholder:text-muted-foreground", className),
+		...props
+	});
+};
+var SelectContent = ({ className, children, portalContainer, ...props }) => {
+	useExposedFocusGuards();
+	return /* @__PURE__ */ jsx(Select.Portal, {
+		container: portalContainer,
+		children: /* @__PURE__ */ jsx(Select.Positioner, {
+			"data-slot": "select-positioner",
+			sideOffset: 4,
+			align: "start",
+			alignItemWithTrigger: false,
+			className: POPUP_LAYER_CLASS,
+			children: /* @__PURE__ */ jsx(Select.Popup, {
+				"data-slot": "select-content",
+				className: cn("z-50 flex max-h-(--available-height) flex-col overflow-hidden", POPUP_FRAME_CLASS, POPUP_LIST_WIDTH_CLASS, "origin-[var(--transform-origin)]", "transition-[transform,scale,opacity] motion-reduce:animate-none motion-reduce:transition-none data-open:scale-100 data-open:opacity-100 data-closed:scale-95 data-closed:opacity-0 data-open:animate-in data-closed:animate-out data-open:fade-in-0 data-closed:fade-out-0", className),
+				...props,
+				children: /* @__PURE__ */ jsx(PopupListScroll, { children: /* @__PURE__ */ jsx(Select.List, {
+					"data-slot": "select-list",
+					className: "px-1",
+					children
+				}) })
+			})
+		})
+	});
+};
+var SelectGroup = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx(Select.Group, {
+		"data-slot": "select-group",
+		className,
+		...props
+	});
+};
+var SelectLabel = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx(Select.GroupLabel, {
+		"data-slot": "select-label",
+		className: cn(POPUP_GROUP_LABEL_CLASS, className),
+		...props
+	});
+};
+var SelectItem = ({ className, children, ...props }) => {
+	return /* @__PURE__ */ jsxs(Select.Item, {
+		"data-slot": "select-item",
+		className: cn(popupItemClass("base-ui", true), className),
+		...props,
+		children: [/* @__PURE__ */ jsx(Select.ItemText, {
+			"data-slot": "select-item-text",
+			children
+		}), /* @__PURE__ */ jsx(Select.ItemIndicator, {
+			"data-slot": "select-item-indicator",
+			className: POPUP_ITEM_INDICATOR_CLASS,
+			children: /* @__PURE__ */ jsx(IconCheck, { className: "size-3.5" })
+		})]
+	});
+};
+var SelectSeparator = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "select-separator",
+		className: cn("-mx-1 my-1 h-px bg-border", className),
+		"aria-hidden": "true",
+		...props
+	});
+};
+//#endregion
+export { Select$1 as Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectSeparator, SelectTrigger, SelectValue };
+
+//# sourceMappingURL=select.js.map

package/dist/ui/src/components/ui/select/select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"select.js","names":[],"sources":["../../../../../../../ui/src/components/ui/select/select.tsx"],"sourcesContent":["import { Select as SelectPrimitive } from '@base-ui/react/select';\nimport { useExposedFocusGuards } from '@edyn/ui/lib/focus-guards';\nimport {\n  POPUP_FRAME_CLASS,\n  POPUP_GROUP_LABEL_CLASS,\n  POPUP_ITEM_INDICATOR_CLASS,\n  POPUP_LAYER_CLASS,\n  POPUP_LIST_WIDTH_CLASS,\n  popupItemClass,\n} from '@edyn/ui/lib/popup-list';\nimport { cn } from '@edyn/ui/lib/utils';\nimport { IconCheck, IconChevronDown } from '@tabler/icons-react';\nimport type * as React from 'react';\nimport { PopupListScroll } from '../scroll-area';\n\nexport const Select = <TValue,>({ ...props }: SelectPrimitive.Root.Props<TValue>) => {\n  return <SelectPrimitive.Root data-slot=\"select\" {...props} />;\n};\n\nexport type TSelectTriggerSize = 'sm' | 'default';\n\nexport interface ISelectTriggerProps extends SelectPrimitive.Trigger.Props {\n  size?: TSelectTriggerSize;\n}\n\nexport const SelectTrigger = ({ className, size = 'default', children, ...props }: ISelectTriggerProps) => {\n  return (\n    <SelectPrimitive.Trigger\n      data-slot=\"select-trigger\"\n      className={cn(\n        'flex w-full cursor-pointer items-center justify-between gap-2 rounded-lg border border-control bg-transparent text-sm text-foreground transition-colors outline-none',\n        '',\n        'disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50',\n        'aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20',\n        'data-popup-open:outline-solid',\n        'dark:bg-input/30 dark:disabled:bg-input/80 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40',\n        size === 'sm' ? 'h-7 px-2.5 text-xs' : 'h-8 px-2.5',\n        className,\n      )}\n      {...props}\n    >\n      {children}\n      <SelectPrimitive.Icon data-slot=\"select-icon\" className=\"shrink-0 text-muted-foreground\">\n        <IconChevronDown className=\"size-4\" />\n      </SelectPrimitive.Icon>\n    </SelectPrimitive.Trigger>\n  );\n};\n\nexport const SelectValue = ({ className, ...props }: SelectPrimitive.Value.Props) => {\n  return <SelectPrimitive.Value data-slot=\"select-value\" className={cn('truncate data-placeholder:text-muted-foreground', className)} {...props} />;\n};\n\nexport interface ISelectContentProps extends SelectPrimitive.Popup.Props {\n  portalContainer?: SelectPrimitive.Portal.Props['container'];\n}\n\nexport const SelectContent = ({ className, children, portalContainer, ...props }: ISelectContentProps) => {\n  useExposedFocusGuards();\n  return (\n    <SelectPrimitive.Portal container={portalContainer}>\n      {/* alignItemWithTrigger=false: drop below the trigger (shadcn style), not Base UI's macOS-style overlay */}\n      <SelectPrimitive.Positioner\n        data-slot=\"select-positioner\"\n        sideOffset={4}\n        align=\"start\"\n        alignItemWithTrigger={false}\n        className={POPUP_LAYER_CLASS}\n      >\n        <SelectPrimitive.Popup\n          data-slot=\"select-content\"\n          className={cn(\n            'z-50 flex max-h-(--available-height) flex-col overflow-hidden',\n            POPUP_FRAME_CLASS,\n            POPUP_LIST_WIDTH_CLASS,\n            'origin-[var(--transform-origin)]',\n            'transition-[transform,scale,opacity] motion-reduce:animate-none motion-reduce:transition-none data-open:scale-100 data-open:opacity-100 data-closed:scale-95 data-closed:opacity-0 data-open:animate-in data-closed:animate-out data-open:fade-in-0 data-closed:fade-out-0',\n            className,\n          )}\n          {...props}\n        >\n          {/* A long option list has to scroll inside the popup: the popup clips\n              (overflow-hidden) and carries no height of its own, so the options\n              past the fold were simply unreachable. POPUP_LIST_HEIGHT_CLASS caps\n              it at eight rows, or at the whole rows the room the positioner\n              measured allows, so the foot of the list is never a half row. */}\n          {/* Select.List is what makes the wrappers legal: with a list present Base\n              UI moves `role=\"listbox\"` off the popup and onto it, so the options\n              stay direct children of the role and the ScrollArea sits outside it.\n              The list keeps only the sideways padding: the air above and\n              below the rows is POPUP_LIST_HEIGHT_CLASS's margin, outside what scrolls. */}\n          <PopupListScroll>\n            <SelectPrimitive.List data-slot=\"select-list\" className=\"px-1\">\n              {children}\n            </SelectPrimitive.List>\n          </PopupListScroll>\n        </SelectPrimitive.Popup>\n      </SelectPrimitive.Positioner>\n    </SelectPrimitive.Portal>\n  );\n};\n\nexport const SelectGroup = ({ className, ...props }: SelectPrimitive.Group.Props) => {\n  // No gap between the rows of a group: a gap would put them 34px apart in a group and 32px apart outside one, and the list's\n  // whole-row height is counted in 32s.\n  return <SelectPrimitive.Group data-slot=\"select-group\" className={className} {...props} />;\n};\n\nexport const SelectLabel = ({ className, ...props }: SelectPrimitive.GroupLabel.Props) => {\n  return <SelectPrimitive.GroupLabel data-slot=\"select-label\" className={cn(POPUP_GROUP_LABEL_CLASS, className)} {...props} />;\n};\n\nexport const SelectItem = ({ className, children, ...props }: SelectPrimitive.Item.Props) => {\n  return (\n    <SelectPrimitive.Item data-slot=\"select-item\" className={cn(popupItemClass('base-ui', true), className)} {...props}>\n      <SelectPrimitive.ItemText data-slot=\"select-item-text\">{children}</SelectPrimitive.ItemText>\n      {/* After the text, not before it: the check marks the end of the item in\n          every list in the system, so the labels all start on one line. */}\n      <SelectPrimitive.ItemIndicator data-slot=\"select-item-indicator\" className={POPUP_ITEM_INDICATOR_CLASS}>\n        <IconCheck className=\"size-3.5\" />\n      </SelectPrimitive.ItemIndicator>\n    </SelectPrimitive.Item>\n  );\n};\n\nexport const SelectSeparator = ({ className, ...props }: React.ComponentProps<'div'>) => {\n  return <div data-slot=\"select-separator\" className={cn('-mx-1 my-1 h-px bg-border', className)} aria-hidden=\"true\" {...props} />;\n};\n"],"mappings":";;;;;;;;AAeA,IAAa,YAAmB,EAAE,GAAG,YAAgD;CACnF,OAAO,oBAAC,OAAgB,MAAjB;EAAsB,aAAU;EAAS,GAAI;CAAQ,CAAA;AAC9D;AAQA,IAAa,iBAAiB,EAAE,WAAW,OAAO,WAAW,UAAU,GAAG,YAAiC;CACzG,OACE,qBAAC,OAAgB,SAAjB;EACE,aAAU;EACV,WAAW,GACT,wKACA,IACA,gFACA,wFACA,iCACA,4HACA,SAAS,OAAO,uBAAuB,cACvC,SACF;EACA,GAAI;EAZN,UAAA,CAcG,UACD,oBAAC,OAAgB,MAAjB;GAAsB,aAAU;GAAc,WAAU;GACtD,UAAA,oBAAC,iBAAD,EAAiB,WAAU,SAAU,CAAA;EACjB,CAAA,CACC;;AAE7B;AAEA,IAAa,eAAe,EAAE,WAAW,GAAG,YAAyC;CACnF,OAAO,oBAAC,OAAgB,OAAjB;EAAuB,aAAU;EAAe,WAAW,GAAG,mDAAmD,SAAS;EAAG,GAAI;CAAQ,CAAA;AAClJ;AAMA,IAAa,iBAAiB,EAAE,WAAW,UAAU,iBAAiB,GAAG,YAAiC;CACxG,sBAAsB;CACtB,OACE,oBAAC,OAAgB,QAAjB;EAAwB,WAAW;EAEjC,UAAA,oBAAC,OAAgB,YAAjB;GACE,aAAU;GACV,YAAY;GACZ,OAAM;GACN,sBAAsB;GACtB,WAAW;GAEX,UAAA,oBAAC,OAAgB,OAAjB;IACE,aAAU;IACV,WAAW,GACT,iEACA,mBACA,wBACA,oCACA,8QACA,SACF;IACA,GAAI;IAYJ,UAAA,oBAAC,iBAAD,EAAA,UACE,oBAAC,OAAgB,MAAjB;KAAsB,aAAU;KAAc,WAAU;KACrD;IACmB,CAAA,EACP,CAAA;GACI,CAAA;EACG,CAAA;CACN,CAAA;AAE5B;AAEA,IAAa,eAAe,EAAE,WAAW,GAAG,YAAyC;CAGnF,OAAO,oBAAC,OAAgB,OAAjB;EAAuB,aAAU;EAA0B;EAAW,GAAI;CAAQ,CAAA;AAC3F;AAEA,IAAa,eAAe,EAAE,WAAW,GAAG,YAA8C;CACxF,OAAO,oBAAC,OAAgB,YAAjB;EAA4B,aAAU;EAAe,WAAW,GAAG,yBAAyB,SAAS;EAAG,GAAI;CAAQ,CAAA;AAC7H;AAEA,IAAa,cAAc,EAAE,WAAW,UAAU,GAAG,YAAwC;CAC3F,OACE,qBAAC,OAAgB,MAAjB;EAAsB,aAAU;EAAc,WAAW,GAAG,eAAe,WAAW,IAAI,GAAG,SAAS;EAAG,GAAI;EAA7G,UAAA,CACE,oBAAC,OAAgB,UAAjB;GAA0B,aAAU;GAAoB;EAAmC,CAAA,GAG3F,oBAAC,OAAgB,eAAjB;GAA+B,aAAU;GAAwB,WAAW;GAC1E,UAAA,oBAAC,WAAD,EAAW,WAAU,WAAY,CAAA;EACJ,CAAA,CACX;;AAE1B;AAEA,IAAa,mBAAmB,EAAE,WAAW,GAAG,YAAyC;CACvF,OAAO,oBAAC,OAAD;EAAK,aAAU;EAAmB,WAAW,GAAG,6BAA6B,SAAS;EAAG,eAAY;EAAO,GAAI;CAAQ,CAAA;AACjI"}

package/dist/ui/src/components/ui/separator/separator.behavior.test.d.ts

@@ -0,0 +1,14 @@
+/**
+ * Orientation styling for Separator, and a guard for the bug class behind it.
+ *
+ * Base UI publishes orientation as `data-orientation="horizontal|vertical"`. It
+ * has no `data-horizontal` / `data-vertical` attribute, so a bare
+ * `data-vertical:` variant compiles to a selector that matches nothing: the
+ * component looks styled, and silently is not. A vertical Separator came out
+ * with no width at all that way.
+ *
+ * PATH TAKEN: happy-dom renders no layout, so this asserts the class the
+ * component chose per orientation plus the attribute Base UI emitted, and the
+ * second block greps the package for the dead variant form.
+ */
+export {};

package/dist/ui/src/components/ui/separator/separator.d.ts

@@ -1,2 +1,16 @@
 import { Separator as SeparatorPrimitive } from '@base-ui/react/separator';
+/**
+ * Hairline rule between content, announced as `role="separator"`.
+ *
+ * The orientation styles are branched in TS rather than written as
+ * `data-[orientation=*]:` variants on purpose. A variant carries two
+ * selectors' worth of specificity, so it would outrank a plain class passed in
+ * by the caller: the sidebar's own `w-auto` lost to `w-full` that way. Branching
+ * emits one plain class per axis, which `cn` can dedupe and a caller can
+ * override.
+ *
+ * Vertical uses `self-stretch` instead of `h-full`: a percentage height needs a
+ * definite parent, and the usual host is an `items-center` row whose height
+ * comes from its content.
+ */
 export declare const Separator: ({ className, orientation, ...props }: SeparatorPrimitive.Props) => import('react').JSX.Element;

package/dist/ui/src/components/ui/separator/separator.js

@@ -0,0 +1,30 @@
+import { cn } from "../../../lib/utils.js";
+import { jsx } from "react/jsx-runtime";
+import { Separator } from "@base-ui/react/separator";
+//#region ../ui/src/components/ui/separator/separator.tsx
+/**
+* Hairline rule between content, announced as `role="separator"`.
+*
+* The orientation styles are branched in TS rather than written as
+* `data-[orientation=*]:` variants on purpose. A variant carries two
+* selectors' worth of specificity, so it would outrank a plain class passed in
+* by the caller: the sidebar's own `w-auto` lost to `w-full` that way. Branching
+* emits one plain class per axis, which `cn` can dedupe and a caller can
+* override.
+*
+* Vertical uses `self-stretch` instead of `h-full`: a percentage height needs a
+* definite parent, and the usual host is an `items-center` row whose height
+* comes from its content.
+*/
+var Separator$1 = ({ className, orientation = "horizontal", ...props }) => {
+	return /* @__PURE__ */ jsx(Separator, {
+		"data-slot": "separator",
+		orientation,
+		className: cn("shrink-0 bg-border", orientation === "horizontal" ? "h-px w-full" : "w-px self-stretch", className),
+		...props
+	});
+};
+//#endregion
+export { Separator$1 as Separator };
+
+//# sourceMappingURL=separator.js.map

package/dist/ui/src/components/ui/separator/separator.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"separator.js","names":[],"sources":["../../../../../../../ui/src/components/ui/separator/separator.tsx"],"sourcesContent":["import { Separator as SeparatorPrimitive } from '@base-ui/react/separator';\n\nimport { cn } from '@edyn/ui/lib/utils';\n\n/**\n * Hairline rule between content, announced as `role=\"separator\"`.\n *\n * The orientation styles are branched in TS rather than written as\n * `data-[orientation=*]:` variants on purpose. A variant carries two\n * selectors' worth of specificity, so it would outrank a plain class passed in\n * by the caller: the sidebar's own `w-auto` lost to `w-full` that way. Branching\n * emits one plain class per axis, which `cn` can dedupe and a caller can\n * override.\n *\n * Vertical uses `self-stretch` instead of `h-full`: a percentage height needs a\n * definite parent, and the usual host is an `items-center` row whose height\n * comes from its content.\n */\nexport const Separator = ({ className, orientation = 'horizontal', ...props }: SeparatorPrimitive.Props) => {\n  return (\n    <SeparatorPrimitive\n      data-slot=\"separator\"\n      orientation={orientation}\n      className={cn('shrink-0 bg-border', orientation === 'horizontal' ? 'h-px w-full' : 'w-px self-stretch', className)}\n      {...props}\n    />\n  );\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;AAkBA,IAAa,eAAa,EAAE,WAAW,cAAc,cAAc,GAAG,YAAsC;CAC1G,OACE,oBAAC,WAAD;EACE,aAAU;EACG;EACb,WAAW,GAAG,sBAAsB,gBAAgB,eAAe,gBAAgB,qBAAqB,SAAS;EACjH,GAAI;CACL,CAAA;AAEL"}

package/dist/ui/src/components/ui/sheet/sheet.d.ts

@@ -7,6 +7,14 @@ export declare const SheetContent: ({ className, children, side, showCloseButton
     side?: "top" | "right" | "bottom" | "left";
     showCloseButton?: boolean;
 }) => React.JSX.Element;
+/**
+ * A Sheet's header and footer keep the rhythm of a Dialog's, so the two read as one family: a 16px title with the description 8px
+ * under it, and the actions in a row at the end (Cancel first, the primary last) where there is room, the primary on top where
+ * there is not. They used to differ: the title took the body's 24px line, the description sat 2px under it, so the header was a
+ * different height for every description, and the footer stacked a full-width Cancel over the primary at every width.
+ *
+ * The padding lives on the sections here rather than on the content as in a Dialog, so a body may run edge to edge between them.
+ */
 export declare const SheetHeader: ({ className, ...props }: React.ComponentProps<"div">) => React.JSX.Element;
 export declare const SheetFooter: ({ className, ...props }: React.ComponentProps<"div">) => React.JSX.Element;
 export declare const SheetTitle: ({ className, ...props }: SheetPrimitive.Title.Props) => React.JSX.Element;

package/dist/ui/src/components/ui/sheet/sheet.js

@@ -0,0 +1,99 @@
+import { cn } from "../../../lib/utils.js";
+import { Button } from "../button/button.js";
+import { useExposedFocusGuards } from "../../../lib/focus-guards.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { IconX } from "@tabler/icons-react";
+import { Dialog } from "@base-ui/react/dialog";
+//#region ../ui/src/components/ui/sheet/sheet.tsx
+var Sheet = ({ ...props }) => {
+	return /* @__PURE__ */ jsx(Dialog.Root, {
+		"data-slot": "sheet",
+		...props
+	});
+};
+var SheetTrigger = ({ ...props }) => {
+	return /* @__PURE__ */ jsx(Dialog.Trigger, {
+		"data-slot": "sheet-trigger",
+		...props
+	});
+};
+var SheetClose = ({ ...props }) => {
+	return /* @__PURE__ */ jsx(Dialog.Close, {
+		"data-slot": "sheet-close",
+		...props
+	});
+};
+var SheetPortal = ({ ...props }) => {
+	return /* @__PURE__ */ jsx(Dialog.Portal, {
+		"data-slot": "sheet-portal",
+		...props
+	});
+};
+var SheetOverlay = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx(Dialog.Backdrop, {
+		"data-slot": "sheet-overlay",
+		className: cn("fixed inset-0 z-50 bg-overlay transition-opacity duration-150 motion-reduce:transition-none data-ending-style:opacity-0 data-starting-style:opacity-0 supports-backdrop-filter:backdrop-blur-xs", className),
+		...props
+	});
+};
+var SheetContent = ({ className, children, side = "right", showCloseButton = true, ...props }) => {
+	useExposedFocusGuards();
+	return /* @__PURE__ */ jsxs(SheetPortal, { children: [/* @__PURE__ */ jsx(SheetOverlay, {}), /* @__PURE__ */ jsxs(Dialog.Popup, {
+		"data-slot": "sheet-content",
+		"data-side": side,
+		className: cn("fixed z-50 flex flex-col gap-4 bg-popover bg-clip-padding text-sm text-popover-foreground shadow-lg transition duration-200 motion-reduce:transition-none ease-in-out data-ending-style:opacity-0 data-starting-style:opacity-0 data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-0 data-[side=bottom]:h-auto data-[side=bottom]:border-t data-[side=bottom]:data-ending-style:translate-y-[2.5rem] data-[side=bottom]:data-starting-style:translate-y-[2.5rem] data-[side=left]:inset-y-0 data-[side=left]:left-0 data-[side=left]:h-full data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=left]:data-ending-style:translate-x-[-2.5rem] data-[side=left]:data-starting-style:translate-x-[-2.5rem] data-[side=right]:inset-y-0 data-[side=right]:right-0 data-[side=right]:h-full data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=right]:data-ending-style:translate-x-[2.5rem] data-[side=right]:data-starting-style:translate-x-[2.5rem] data-[side=top]:inset-x-0 data-[side=top]:top-0 data-[side=top]:h-auto data-[side=top]:border-b data-[side=top]:data-ending-style:translate-y-[-2.5rem] data-[side=top]:data-starting-style:translate-y-[-2.5rem] data-[side=left]:sm:max-w-sm data-[side=right]:sm:max-w-sm", className),
+		...props,
+		children: [children, showCloseButton && /* @__PURE__ */ jsxs(Dialog.Close, {
+			"data-slot": "sheet-close",
+			render: /* @__PURE__ */ jsx(Button, {
+				variant: "ghost",
+				className: "absolute top-3 right-3",
+				size: "icon-sm"
+			}),
+			children: [/* @__PURE__ */ jsx(IconX, {}), /* @__PURE__ */ jsx("span", {
+				className: "sr-only",
+				children: "Close"
+			})]
+		})]
+	})] });
+};
+/**
+* A Sheet's header and footer keep the rhythm of a Dialog's, so the two read as one family: a 16px title with the description 8px
+* under it, and the actions in a row at the end (Cancel first, the primary last) where there is room, the primary on top where
+* there is not. They used to differ: the title took the body's 24px line, the description sat 2px under it, so the header was a
+* different height for every description, and the footer stacked a full-width Cancel over the primary at every width.
+*
+* The padding lives on the sections here rather than on the content as in a Dialog, so a body may run edge to edge between them.
+*/
+var SheetHeader = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "sheet-header",
+		className: cn("flex flex-col gap-2 p-4", className),
+		...props
+	});
+};
+var SheetFooter = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "sheet-footer",
+		className: cn("mt-auto flex flex-col-reverse gap-2 p-4 sm:flex-row sm:justify-end", className),
+		...props
+	});
+};
+var SheetTitle = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx(Dialog.Title, {
+		"data-slot": "sheet-title",
+		className: cn("text-base leading-none font-medium", className),
+		...props
+	});
+};
+var SheetDescription = ({ className, ...props }) => {
+	return /* @__PURE__ */ jsx(Dialog.Description, {
+		"data-slot": "sheet-description",
+		className: cn("text-sm text-muted-foreground", className),
+		...props
+	});
+};
+//#endregion
+export { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger };
+
+//# sourceMappingURL=sheet.js.map

package/dist/ui/src/components/ui/sheet/sheet.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sheet.js","names":[],"sources":["../../../../../../../ui/src/components/ui/sheet/sheet.tsx"],"sourcesContent":["import { Dialog as SheetPrimitive } from '@base-ui/react/dialog';\nimport { useExposedFocusGuards } from '@edyn/ui/lib/focus-guards';\nimport { cn } from '@edyn/ui/lib/utils';\nimport { IconX } from '@tabler/icons-react';\nimport type * as React from 'react';\nimport { Button } from '../button';\n\nexport const Sheet = ({ ...props }: SheetPrimitive.Root.Props) => {\n  return <SheetPrimitive.Root data-slot=\"sheet\" {...props} />;\n};\n\nexport const SheetTrigger = ({ ...props }: SheetPrimitive.Trigger.Props) => {\n  return <SheetPrimitive.Trigger data-slot=\"sheet-trigger\" {...props} />;\n};\n\nexport const SheetClose = ({ ...props }: SheetPrimitive.Close.Props) => {\n  return <SheetPrimitive.Close data-slot=\"sheet-close\" {...props} />;\n};\n\nconst SheetPortal = ({ ...props }: SheetPrimitive.Portal.Props) => {\n  return <SheetPrimitive.Portal data-slot=\"sheet-portal\" {...props} />;\n};\n\nconst SheetOverlay = ({ className, ...props }: SheetPrimitive.Backdrop.Props) => {\n  return (\n    <SheetPrimitive.Backdrop\n      data-slot=\"sheet-overlay\"\n      className={cn(\n        'fixed inset-0 z-50 bg-overlay transition-opacity duration-150 motion-reduce:transition-none data-ending-style:opacity-0 data-starting-style:opacity-0 supports-backdrop-filter:backdrop-blur-xs',\n        className,\n      )}\n      {...props}\n    />\n  );\n};\n\nexport const SheetContent = ({\n  className,\n  children,\n  side = 'right',\n  showCloseButton = true,\n  ...props\n}: SheetPrimitive.Popup.Props & {\n  side?: 'top' | 'right' | 'bottom' | 'left';\n  showCloseButton?: boolean;\n}) => {\n  useExposedFocusGuards();\n  return (\n    <SheetPortal>\n      <SheetOverlay />\n      <SheetPrimitive.Popup\n        data-slot=\"sheet-content\"\n        data-side={side}\n        className={cn(\n          'fixed z-50 flex flex-col gap-4 bg-popover bg-clip-padding text-sm text-popover-foreground shadow-lg transition duration-200 motion-reduce:transition-none ease-in-out data-ending-style:opacity-0 data-starting-style:opacity-0 data-[side=bottom]:inset-x-0 data-[side=bottom]:bottom-0 data-[side=bottom]:h-auto data-[side=bottom]:border-t data-[side=bottom]:data-ending-style:translate-y-[2.5rem] data-[side=bottom]:data-starting-style:translate-y-[2.5rem] data-[side=left]:inset-y-0 data-[side=left]:left-0 data-[side=left]:h-full data-[side=left]:w-3/4 data-[side=left]:border-r data-[side=left]:data-ending-style:translate-x-[-2.5rem] data-[side=left]:data-starting-style:translate-x-[-2.5rem] data-[side=right]:inset-y-0 data-[side=right]:right-0 data-[side=right]:h-full data-[side=right]:w-3/4 data-[side=right]:border-l data-[side=right]:data-ending-style:translate-x-[2.5rem] data-[side=right]:data-starting-style:translate-x-[2.5rem] data-[side=top]:inset-x-0 data-[side=top]:top-0 data-[side=top]:h-auto data-[side=top]:border-b data-[side=top]:data-ending-style:translate-y-[-2.5rem] data-[side=top]:data-starting-style:translate-y-[-2.5rem] data-[side=left]:sm:max-w-sm data-[side=right]:sm:max-w-sm',\n          className,\n        )}\n        {...props}\n      >\n        {children}\n        {showCloseButton && (\n          <SheetPrimitive.Close data-slot=\"sheet-close\" render={<Button variant=\"ghost\" className=\"absolute top-3 right-3\" size=\"icon-sm\" />}>\n            <IconX />\n            <span className=\"sr-only\">Close</span>\n          </SheetPrimitive.Close>\n        )}\n      </SheetPrimitive.Popup>\n    </SheetPortal>\n  );\n};\n\n/**\n * A Sheet's header and footer keep the rhythm of a Dialog's, so the two read as one family: a 16px title with the description 8px\n * under it, and the actions in a row at the end (Cancel first, the primary last) where there is room, the primary on top where\n * there is not. They used to differ: the title took the body's 24px line, the description sat 2px under it, so the header was a\n * different height for every description, and the footer stacked a full-width Cancel over the primary at every width.\n *\n * The padding lives on the sections here rather than on the content as in a Dialog, so a body may run edge to edge between them.\n */\nexport const SheetHeader = ({ className, ...props }: React.ComponentProps<'div'>) => {\n  return <div data-slot=\"sheet-header\" className={cn('flex flex-col gap-2 p-4', className)} {...props} />;\n};\n\nexport const SheetFooter = ({ className, ...props }: React.ComponentProps<'div'>) => {\n  return <div data-slot=\"sheet-footer\" className={cn('mt-auto flex flex-col-reverse gap-2 p-4 sm:flex-row sm:justify-end', className)} {...props} />;\n};\n\nexport const SheetTitle = ({ className, ...props }: SheetPrimitive.Title.Props) => {\n  return <SheetPrimitive.Title data-slot=\"sheet-title\" className={cn('text-base leading-none font-medium', className)} {...props} />;\n};\n\nexport const SheetDescription = ({ className, ...props }: SheetPrimitive.Description.Props) => {\n  return <SheetPrimitive.Description data-slot=\"sheet-description\" className={cn('text-sm text-muted-foreground', className)} {...props} />;\n};\n"],"mappings":";;;;;;;AAOA,IAAa,SAAS,EAAE,GAAG,YAAuC;CAChE,OAAO,oBAAC,OAAe,MAAhB;EAAqB,aAAU;EAAQ,GAAI;CAAQ,CAAA;AAC5D;AAEA,IAAa,gBAAgB,EAAE,GAAG,YAA0C;CAC1E,OAAO,oBAAC,OAAe,SAAhB;EAAwB,aAAU;EAAgB,GAAI;CAAQ,CAAA;AACvE;AAEA,IAAa,cAAc,EAAE,GAAG,YAAwC;CACtE,OAAO,oBAAC,OAAe,OAAhB;EAAsB,aAAU;EAAc,GAAI;CAAQ,CAAA;AACnE;AAEA,IAAM,eAAe,EAAE,GAAG,YAAyC;CACjE,OAAO,oBAAC,OAAe,QAAhB;EAAuB,aAAU;EAAe,GAAI;CAAQ,CAAA;AACrE;AAEA,IAAM,gBAAgB,EAAE,WAAW,GAAG,YAA2C;CAC/E,OACE,oBAAC,OAAe,UAAhB;EACE,aAAU;EACV,WAAW,GACT,mMACA,SACF;EACA,GAAI;CACL,CAAA;AAEL;AAEA,IAAa,gBAAgB,EAC3B,WACA,UACA,OAAO,SACP,kBAAkB,MAClB,GAAG,YAIC;CACJ,sBAAsB;CACtB,OACE,qBAAC,aAAD,EAAA,UAAA,CACE,oBAAC,cAAD,CAAe,CAAA,GACf,qBAAC,OAAe,OAAhB;EACE,aAAU;EACV,aAAW;EACX,WAAW,GACT,2rCACA,SACF;EACA,GAAI;EAPN,UAAA,CASG,UACA,mBACC,qBAAC,OAAe,OAAhB;GAAsB,aAAU;GAAc,QAAQ,oBAAC,QAAD;IAAQ,SAAQ;IAAQ,WAAU;IAAyB,MAAK;GAAW,CAAA;GAAjI,UAAA,CACE,oBAAC,OAAD,CAAQ,CAAA,GACR,oBAAC,QAAD;IAAM,WAAU;IAAU,UAAA;GAAW,CAAA,CACjB;EAEJ,CAAA,CAAA;CACX,CAAA,CAAA,EAAA,CAAA;AAEjB;;;;;;;;;AAUA,IAAa,eAAe,EAAE,WAAW,GAAG,YAAyC;CACnF,OAAO,oBAAC,OAAD;EAAK,aAAU;EAAe,WAAW,GAAG,2BAA2B,SAAS;EAAG,GAAI;CAAQ,CAAA;AACxG;AAEA,IAAa,eAAe,EAAE,WAAW,GAAG,YAAyC;CACnF,OAAO,oBAAC,OAAD;EAAK,aAAU;EAAe,WAAW,GAAG,sEAAsE,SAAS;EAAG,GAAI;CAAQ,CAAA;AACnJ;AAEA,IAAa,cAAc,EAAE,WAAW,GAAG,YAAwC;CACjF,OAAO,oBAAC,OAAe,OAAhB;EAAsB,aAAU;EAAc,WAAW,GAAG,sCAAsC,SAAS;EAAG,GAAI;CAAQ,CAAA;AACnI;AAEA,IAAa,oBAAoB,EAAE,WAAW,GAAG,YAA8C;CAC7F,OAAO,oBAAC,OAAe,aAAhB;EAA4B,aAAU;EAAoB,WAAW,GAAG,iCAAiC,SAAS;EAAG,GAAI;CAAQ,CAAA;AAC1I"}