@zyncat/ui 0.8.0

package/dist/chunk-O4N2OBTR.js

@@ -0,0 +1,94 @@
+'use client';import { useAnchorPosition } from './chunk-EQ32F2QJ.js';
+import { useReturnFocus } from './chunk-LDC3RIYA.js';
+import { ovCloneTrigger, OverlayPortal, useOverlayEntry, useOutsidePress } from './chunk-GY7JOPUQ.js';
+import { resolveMotionTiming } from './chunk-NEF5XAHG.js';
+import { Presence } from './chunk-MXOPCFWR.js';
+import { useMotion } from './chunk-W3SHPKSB.js';
+import { useControllable } from './chunk-MMRIQNEN.js';
+import { cx } from './chunk-QGNC7LH5.js';
+import './popover.css';
+import { useRef, useId, Fragment } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var POPOVER_TIMING = {
+  open: { duration: "base", ease: "entrance" },
+  close: { duration: "fast", ease: "exit" }
+};
+function PopoverPanel({
+  panelId,
+  side,
+  align,
+  arrow,
+  dismissible,
+  requestClose,
+  triggerRef,
+  htmlProps,
+  animate,
+  exit,
+  children
+}) {
+  const panelRef = useRef(null);
+  const entry = useOverlayEntry({ nodeRef: panelRef, dismissible, requestClose });
+  useMotion(panelRef, { animate, exit });
+  useReturnFocus(panelRef);
+  useAnchorPosition({ side, align, arrow, triggerRef, panelRef });
+  useOutsidePress({ entry, refs: [triggerRef, panelRef], enabled: dismissible, onPress: requestClose });
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ...htmlProps,
+      id: panelId,
+      ref: panelRef,
+      className: cx("overlay-popover", htmlProps?.className),
+      children: [
+        arrow && /* @__PURE__ */ jsx("span", { className: "overlay-popover__arrow", "aria-hidden": "true" }),
+        children
+      ]
+    }
+  );
+}
+function Popover({
+  open: controlledOpen,
+  defaultOpen = false,
+  onOpenChange,
+  trigger = null,
+  side = "bottom",
+  align = "start",
+  arrow = false,
+  dismissible = true,
+  id,
+  htmlProps,
+  animation,
+  children
+}) {
+  const [open, setOpen] = useControllable(controlledOpen, defaultOpen, onOpenChange);
+  const triggerRef = useRef(null);
+  const autoId = useId();
+  const panelId = id || "popover-" + autoId;
+  const close = () => setOpen(false);
+  const timings = resolveMotionTiming(animation, POPOVER_TIMING);
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    ovCloneTrigger(trigger, { open, onPress: () => setOpen(!open), panelId, haspopup: "true", triggerRef }),
+    /* @__PURE__ */ jsx(OverlayPortal, { children: /* @__PURE__ */ jsx(Presence, { children: open && /* @__PURE__ */ jsx(
+      PopoverPanel,
+      {
+        animate: { opacity: [0, 1], scale: [0.96, 1], timing: timings.open },
+        exit: { opacity: [0], scale: [0.96], timing: timings.close },
+        panelId,
+        side,
+        align,
+        arrow,
+        dismissible,
+        requestClose: close,
+        triggerRef,
+        htmlProps,
+        children
+      },
+      "panel"
+    ) }) })
+  ] });
+}
+
+export { Popover };
+//# sourceMappingURL=chunk-O4N2OBTR.js.map
+//# sourceMappingURL=chunk-O4N2OBTR.js.map

package/dist/chunk-O4N2OBTR.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/composites/popover/Popover.tsx"],"names":[],"mappings":";;;;;;;;;;;;AAeA,IAAM,cAAA,GAAiB;AAAA,EACrB,IAAA,EAAM,EAAE,QAAA,EAAU,MAAA,EAAQ,MAAM,UAAA,EAAW;AAAA,EAC3C,KAAA,EAAO,EAAE,QAAA,EAAU,MAAA,EAAQ,MAAM,MAAA;AACnC,CAAA;AAiCA,SAAS,YAAA,CAAa;AAAA,EACpB,OAAA;AAAA,EACA,IAAA;AAAA,EACA,KAAA;AAAA,EACA,KAAA;AAAA,EACA,WAAA;AAAA,EACA,YAAA;AAAA,EACA,UAAA;AAAA,EACA,SAAA;AAAA,EACA,OAAA;AAAA,EACA,IAAA;AAAA,EACA;AACF,CAAA,EAUiB;AACf,EAAA,MAAM,QAAA,GAAW,OAAoB,IAAI,CAAA;AACzC,EAAA,MAAM,QAAQ,eAAA,CAAgB,EAAE,SAAS,QAAA,EAAU,WAAA,EAAa,cAAc,CAAA;AAC9E,EAAA,SAAA,CAAU,QAAA,EAAU,EAAE,OAAA,EAAS,IAAA,EAAM,CAAA;AACrC,EAAA,cAAA,CAAe,QAAQ,CAAA;AACvB,EAAA,iBAAA,CAAkB,EAAE,IAAA,EAAM,KAAA,EAAO,KAAA,EAAO,UAAA,EAAY,UAAU,CAAA;AAC9D,EAAA,eAAA,CAAgB,EAAE,KAAA,EAAO,IAAA,EAAM,CAAC,UAAA,EAAY,QAAQ,CAAA,EAAG,OAAA,EAAS,WAAA,EAAa,OAAA,EAAS,YAAA,EAAc,CAAA;AACpG,EAAA,uBACE,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACE,GAAG,SAAA;AAAA,MACJ,EAAA,EAAI,OAAA;AAAA,MACJ,GAAA,EAAK,QAAA;AAAA,MACL,SAAA,EAAW,EAAA,CAAG,iBAAA,EAAmB,SAAA,EAAW,SAAS,CAAA;AAAA,MAEpD,QAAA,EAAA;AAAA,QAAA,KAAA,oBAAS,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,wBAAA,EAAyB,eAAY,MAAA,EAAO,CAAA;AAAA,QACrE;AAAA;AAAA;AAAA,GACH;AAEJ;AAEO,SAAS,OAAA,CAAQ;AAAA,EACtB,IAAA,EAAM,cAAA;AAAA,EACN,WAAA,GAAc,KAAA;AAAA,EACd,YAAA;AAAA,EACA,OAAA,GAAU,IAAA;AAAA,EACV,IAAA,GAAO,QAAA;AAAA,EACP,KAAA,GAAQ,OAAA;AAAA,EACR,KAAA,GAAQ,KAAA;AAAA,EACR,WAAA,GAAc,IAAA;AAAA,EACd,EAAA;AAAA,EACA,SAAA;AAAA,EACA,SAAA;AAAA,EACA;AACF,CAAA,EAAiB;AACf,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,IAAI,eAAA,CAAgB,cAAA,EAAgB,aAAa,YAAY,CAAA;AACjF,EAAA,MAAM,UAAA,GAAa,OAAoB,IAAI,CAAA;AAC3C,EAAA,MAAM,SAAS,KAAA,EAAM;AACrB,EAAA,MAAM,OAAA,GAAU,MAAM,UAAA,GAAa,MAAA;AACnC,EAAA,MAAM,KAAA,GAAQ,MAAM,OAAA,CAAQ,KAAK,CAAA;AACjC,EAAA,MAAM,OAAA,GAAU,mBAAA,CAAoB,SAAA,EAAW,cAAc,CAAA;AAE7D,EAAA,4BACG,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,IAAA,cAAA,CAAe,OAAA,EAAS,EAAE,IAAA,EAAM,OAAA,EAAS,MAAM,OAAA,CAAQ,CAAC,IAAI,CAAA,EAAG,OAAA,EAAS,QAAA,EAAU,MAAA,EAAQ,YAAY,CAAA;AAAA,oBACvG,GAAA,CAAC,aAAA,EAAA,EACC,QAAA,kBAAA,GAAA,CAAC,QAAA,EAAA,EACE,QAAA,EAAA,IAAA,oBACC,GAAA;AAAA,MAAC,YAAA;AAAA,MAAA;AAAA,QAEC,OAAA,EAAS,EAAE,OAAA,EAAS,CAAC,GAAG,CAAC,CAAA,EAAG,KAAA,EAAO,CAAC,IAAA,EAAM,CAAC,CAAA,EAAG,MAAA,EAAQ,QAAQ,IAAA,EAAK;AAAA,QACnE,IAAA,EAAM,EAAE,OAAA,EAAS,CAAC,CAAC,CAAA,EAAG,KAAA,EAAO,CAAC,IAAI,CAAA,EAAG,MAAA,EAAQ,OAAA,CAAQ,KAAA,EAAM;AAAA,QAC3D,OAAA;AAAA,QACA,IAAA;AAAA,QACA,KAAA;AAAA,QACA,KAAA;AAAA,QACA,WAAA;AAAA,QACA,YAAA,EAAc,KAAA;AAAA,QACd,UAAA;AAAA,QACA,SAAA;AAAA,QAEC;AAAA,OAAA;AAAA,MAZG;AAAA,OAeV,CAAA,EACF;AAAA,GAAA,EACF,CAAA;AAEJ","file":"chunk-O4N2OBTR.js","sourcesContent":["'use client';\n\nimport './popover.css';\nimport { Fragment, useId, useRef, type HTMLAttributes, type ReactElement, type ReactNode, type RefObject } from 'react';\nimport { Presence } from '../../../motion/presence';\nimport { useMotion, type MotionSpecs } from '../../../motion/use-motion';\nimport { resolveMotionTiming } from '../../../motion/motion-timing';\nimport type { DisableableAnimation } from '../../../motion/timing';\nimport { useControllable } from '../../internal/hooks/use-controllable';\nimport { ovCloneTrigger, useOverlayEntry, useOutsidePress, OverlayPortal } from '../../internal/overlay/layer';\nimport { useReturnFocus } from '../../internal/overlay/focus';\nimport { useAnchorPosition } from '../../internal/overlay/position';\nimport type { DataAttributes } from '../../../dom-props';\nimport { cx } from '../../internal/utils/cx';\n\nconst POPOVER_TIMING = {\n  open: { duration: 'base', ease: 'entrance' },\n  close: { duration: 'fast', ease: 'exit' },\n} as const;\n\nexport interface PopoverProps {\n  /** Controlled open state. Omit to stay uncontrolled. */\n  open?: boolean;\n  /** Initial state when uncontrolled. Default false. */\n  defaultOpen?: boolean;\n  /** Fires whenever the open state changes. Pair with `open` for controlled use. */\n  onOpenChange?: (open: boolean) => void;\n\n  /** Cloned to toggle the panel; required as the anchor. */\n  trigger?: ReactElement | null;\n\n  /** Preferred side; flips to the opposite side when cramped. Default 'bottom'. */\n  side?: 'top' | 'bottom' | 'left' | 'right';\n  /** Cross-axis alignment against the trigger. Default 'start'. */\n  align?: 'start' | 'center' | 'end';\n  /** Caret tracking the trigger center. Default false. */\n  arrow?: boolean;\n\n  /** Esc + outside-press dismissal. Default true. */\n  dismissible?: boolean;\n\n  /** Base id for the panel; drives the trigger's `aria-controls`. Auto-generated when omitted. */\n  id?: string;\n  /** Standard attributes (className, style, data-*, ...) forwarded to the popover panel. */\n  htmlProps?: HTMLAttributes<HTMLDivElement> & DataAttributes;\n  /** Open/close timing - motion tokens only, or `null` to disable. @default open 'base'/'entrance', close 'fast'/'exit' */\n  animation?: DisableableAnimation;\n  /** The ENTIRE surface - paint AND semantics. Drive dismissal with `open`/`onOpenChange`. */\n  children: ReactNode;\n}\n\nfunction PopoverPanel({\n  panelId,\n  side,\n  align,\n  arrow,\n  dismissible,\n  requestClose,\n  triggerRef,\n  htmlProps,\n  animate,\n  exit,\n  children,\n}: {\n  panelId: string;\n  side: 'top' | 'bottom' | 'left' | 'right';\n  align: 'start' | 'center' | 'end';\n  arrow: boolean;\n  dismissible: boolean;\n  requestClose: () => void;\n  triggerRef: RefObject<HTMLElement>;\n  htmlProps?: HTMLAttributes<HTMLDivElement> & DataAttributes;\n  children: ReactNode;\n} & MotionSpecs) {\n  const panelRef = useRef<HTMLElement>(null);\n  const entry = useOverlayEntry({ nodeRef: panelRef, dismissible, requestClose });\n  useMotion(panelRef, { animate, exit });\n  useReturnFocus(panelRef);\n  useAnchorPosition({ side, align, arrow, triggerRef, panelRef });\n  useOutsidePress({ entry, refs: [triggerRef, panelRef], enabled: dismissible, onPress: requestClose });\n  return (\n    <div\n      {...htmlProps}\n      id={panelId}\n      ref={panelRef as RefObject<HTMLDivElement>}\n      className={cx('overlay-popover', htmlProps?.className)}\n    >\n      {arrow && <span className=\"overlay-popover__arrow\" aria-hidden=\"true\"></span>}\n      {children}\n    </div>\n  );\n}\n\nexport function Popover({\n  open: controlledOpen,\n  defaultOpen = false,\n  onOpenChange,\n  trigger = null,\n  side = 'bottom',\n  align = 'start',\n  arrow = false,\n  dismissible = true,\n  id,\n  htmlProps,\n  animation,\n  children,\n}: PopoverProps) {\n  const [open, setOpen] = useControllable(controlledOpen, defaultOpen, onOpenChange);\n  const triggerRef = useRef<HTMLElement>(null);\n  const autoId = useId();\n  const panelId = id || 'popover-' + autoId;\n  const close = () => setOpen(false);\n  const timings = resolveMotionTiming(animation, POPOVER_TIMING);\n\n  return (\n    <Fragment>\n      {ovCloneTrigger(trigger, { open, onPress: () => setOpen(!open), panelId, haspopup: 'true', triggerRef })}\n      <OverlayPortal>\n        <Presence>\n          {open && (\n            <PopoverPanel\n              key=\"panel\"\n              animate={{ opacity: [0, 1], scale: [0.96, 1], timing: timings.open }}\n              exit={{ opacity: [0], scale: [0.96], timing: timings.close }}\n              panelId={panelId}\n              side={side}\n              align={align}\n              arrow={arrow}\n              dismissible={dismissible}\n              requestClose={close}\n              triggerRef={triggerRef}\n              htmlProps={htmlProps}\n            >\n              {children}\n            </PopoverPanel>\n          )}\n        </Presence>\n      </OverlayPortal>\n    </Fragment>\n  );\n}\n"]}

package/dist/chunk-PMECHR3A.js

@@ -0,0 +1,38 @@
+'use client';import { cx } from './chunk-QGNC7LH5.js';
+import './badge.css';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function Badge({
+  tone = "neutral",
+  variant = "glass",
+  size = "md",
+  dot = false,
+  live = false,
+  pill = false,
+  icon = null,
+  className = "",
+  style,
+  children,
+  htmlProps
+}) {
+  const isGlass = variant !== "outline";
+  const cls = cx(
+    isGlass && "glass glass--interactive",
+    "badge",
+    `badge--${tone}`,
+    variant === "outline" && "badge--outline",
+    size !== "md" && `badge--${size}`,
+    pill && "badge--pill",
+    className
+  );
+  const showDot = (dot || live) && !icon;
+  return /* @__PURE__ */ jsxs("span", { className: cls, style, ...htmlProps, children: [
+    showDot ? /* @__PURE__ */ jsx("span", { className: `badge__dot${live ? " badge__dot--live" : ""}`, "aria-hidden": "true" }) : null,
+    icon ? /* @__PURE__ */ jsx("span", { className: "badge__icon", "aria-hidden": "true", children: icon }) : null,
+    /* @__PURE__ */ jsx("span", { className: "badge__label", children })
+  ] });
+}
+
+export { Badge };
+//# sourceMappingURL=chunk-PMECHR3A.js.map
+//# sourceMappingURL=chunk-PMECHR3A.js.map

package/dist/chunk-PMECHR3A.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/badge/Badge.tsx"],"names":[],"mappings":";;;;AAqCO,SAAS,KAAA,CAAM;AAAA,EACpB,IAAA,GAAO,SAAA;AAAA,EACP,OAAA,GAAU,OAAA;AAAA,EACV,IAAA,GAAO,IAAA;AAAA,EACP,GAAA,GAAM,KAAA;AAAA,EACN,IAAA,GAAO,KAAA;AAAA,EACP,IAAA,GAAO,KAAA;AAAA,EACP,IAAA,GAAO,IAAA;AAAA,EACP,SAAA,GAAY,EAAA;AAAA,EACZ,KAAA;AAAA,EACA,QAAA;AAAA,EACA;AACF,CAAA,EAAe;AACb,EAAA,MAAM,UAAU,OAAA,KAAY,SAAA;AAC5B,EAAA,MAAM,GAAA,GAAM,EAAA;AAAA,IACV,OAAA,IAAW,0BAAA;AAAA,IACX,OAAA;AAAA,IACA,UAAU,IAAI,CAAA,CAAA;AAAA,IACd,YAAY,SAAA,IAAa,gBAAA;AAAA,IACzB,IAAA,KAAS,IAAA,IAAQ,CAAA,OAAA,EAAU,IAAI,CAAA,CAAA;AAAA,IAC/B,IAAA,IAAQ,aAAA;AAAA,IACR;AAAA,GACF;AAEA,EAAA,MAAM,OAAA,GAAA,CAAW,GAAA,IAAO,IAAA,KAAS,CAAC,IAAA;AAElC,EAAA,4BACG,MAAA,EAAA,EAAK,SAAA,EAAW,GAAA,EAAK,KAAA,EAAe,GAAG,SAAA,EACrC,QAAA,EAAA;AAAA,IAAA,OAAA,mBAAU,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAW,CAAA,UAAA,EAAa,IAAA,GAAO,sBAAsB,EAAE,CAAA,CAAA,EAAI,aAAA,EAAY,MAAA,EAAO,CAAA,GAAK,IAAA;AAAA,IACnG,IAAA,uBACE,MAAA,EAAA,EAAK,SAAA,EAAU,eAAc,aAAA,EAAY,MAAA,EACvC,gBACH,CAAA,GACE,IAAA;AAAA,oBACJ,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,cAAA,EAAgB,QAAA,EAAS;AAAA,GAAA,EAC3C,CAAA;AAEJ","file":"chunk-PMECHR3A.js","sourcesContent":["'use client';\n\nimport './badge.css';\nimport type { CSSProperties, HTMLAttributes, ReactNode } from 'react';\nimport type { DataAttributes } from '../../../dom-props';\nimport { cx } from '../../internal/utils/cx';\n\nexport type BadgeTone = 'neutral' | 'info' | 'success' | 'warning' | 'danger';\n\ninterface BadgeOwnProps {\n  /** Status hue. @default 'neutral' */\n  tone?: BadgeTone;\n  /** Surface. @default 'glass' */\n  variant?: 'glass' | 'outline';\n  /** @default 'md' */\n  size?: 'sm' | 'md';\n  /** Leading status dot. */\n  dot?: boolean;\n  /** Dot pulses (implies dot) - for in-progress status. */\n  live?: boolean;\n  /** Fully-rounded shape. */\n  pill?: boolean;\n  /** Optional leading <Icon> (overrides dot if both set). */\n  icon?: ReactNode;\n  /** Extra class(es) merged onto the chip. */\n  className?: string;\n  /** Inline styles merged onto the chip. */\n  style?: CSSProperties;\n  /** Chip label. */\n  children?: ReactNode;\n}\n\nexport interface BadgeProps extends BadgeOwnProps {\n  /** Standard <span> attributes (aria-*, data-*, title, ...) forwarded to the chip. */\n  htmlProps?: Omit<HTMLAttributes<HTMLSpanElement>, keyof BadgeOwnProps> & DataAttributes;\n}\n\nexport function Badge({\n  tone = 'neutral',\n  variant = 'glass',\n  size = 'md',\n  dot = false,\n  live = false,\n  pill = false,\n  icon = null,\n  className = '',\n  style,\n  children,\n  htmlProps,\n}: BadgeProps) {\n  const isGlass = variant !== 'outline';\n  const cls = cx(\n    isGlass && 'glass glass--interactive',\n    'badge',\n    `badge--${tone}`,\n    variant === 'outline' && 'badge--outline',\n    size !== 'md' && `badge--${size}`,\n    pill && 'badge--pill',\n    className,\n  );\n\n  const showDot = (dot || live) && !icon;\n\n  return (\n    <span className={cls} style={style} {...htmlProps}>\n      {showDot ? <span className={`badge__dot${live ? ' badge__dot--live' : ''}`} aria-hidden=\"true\" /> : null}\n      {icon ? (\n        <span className=\"badge__icon\" aria-hidden=\"true\">\n          {icon}\n        </span>\n      ) : null}\n      <span className=\"badge__label\">{children}</span>\n    </span>\n  );\n}\n"]}

package/dist/chunk-QDK66S4G.js

@@ -0,0 +1,44 @@
+'use client';import { CheckGlyph } from './chunk-NNXJCLTV.js';
+import { cx } from './chunk-QGNC7LH5.js';
+import './checkbox.css';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function Checkbox({
+  checked,
+  defaultChecked,
+  indeterminate = false,
+  error = false,
+  disabled = false,
+  size = "md",
+  label,
+  description,
+  className = "",
+  style,
+  onChange,
+  htmlProps
+}) {
+  const cls = cx("cbx", size === "sm" && "cbx--sm", error && "cbx--error", disabled && "cbx--disabled", className);
+  const controlled = checked !== void 0;
+  const checkedProps = controlled ? { checked } : { defaultChecked };
+  return /* @__PURE__ */ jsxs("label", { className: cls, style, children: [
+    /* @__PURE__ */ jsx(
+      CheckGlyph,
+      {
+        indeterminate,
+        disabled,
+        "aria-invalid": error || void 0,
+        onChange,
+        ...checkedProps,
+        ...htmlProps
+      }
+    ),
+    label || description ? /* @__PURE__ */ jsxs("span", { className: "cbx__text", children: [
+      label ? /* @__PURE__ */ jsx("span", { className: "cbx__label", children: label }) : null,
+      description ? /* @__PURE__ */ jsx("span", { className: "cbx__desc", children: description }) : null
+    ] }) : null
+  ] });
+}
+
+export { Checkbox };
+//# sourceMappingURL=chunk-QDK66S4G.js.map
+//# sourceMappingURL=chunk-QDK66S4G.js.map

package/dist/chunk-QDK66S4G.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/primitives/checkbox/Checkbox.tsx"],"names":[],"mappings":";;;;;AAsCO,SAAS,QAAA,CAAS;AAAA,EACvB,OAAA;AAAA,EACA,cAAA;AAAA,EACA,aAAA,GAAgB,KAAA;AAAA,EAChB,KAAA,GAAQ,KAAA;AAAA,EACR,QAAA,GAAW,KAAA;AAAA,EACX,IAAA,GAAO,IAAA;AAAA,EACP,KAAA;AAAA,EACA,WAAA;AAAA,EACA,SAAA,GAAY,EAAA;AAAA,EACZ,KAAA;AAAA,EACA,QAAA;AAAA,EACA;AACF,CAAA,EAAkB;AAChB,EAAA,MAAM,GAAA,GAAM,EAAA,CAAG,KAAA,EAAO,IAAA,KAAS,IAAA,IAAQ,WAAW,KAAA,IAAS,YAAA,EAAc,QAAA,IAAY,eAAA,EAAiB,SAAS,CAAA;AAE/G,EAAA,MAAM,aAAa,OAAA,KAAY,MAAA;AAC/B,EAAA,MAAM,eAAe,UAAA,GAAa,EAAE,OAAA,EAAQ,GAAI,EAAE,cAAA,EAAe;AAEjE,EAAA,uBACE,IAAA,CAAC,OAAA,EAAA,EAAM,SAAA,EAAW,GAAA,EAAK,KAAA,EACrB,QAAA,EAAA;AAAA,oBAAA,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,aAAA;AAAA,QACA,QAAA;AAAA,QACA,gBAAc,KAAA,IAAS,MAAA;AAAA,QACvB,QAAA;AAAA,QACC,GAAG,YAAA;AAAA,QACH,GAAG;AAAA;AAAA,KACN;AAAA,IACC,KAAA,IAAS,WAAA,mBACR,IAAA,CAAC,MAAA,EAAA,EAAK,WAAU,WAAA,EACb,QAAA,EAAA;AAAA,MAAA,KAAA,mBAAQ,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,YAAA,EAAc,iBAAM,CAAA,GAAU,IAAA;AAAA,MACtD,8BAAc,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,WAAA,EAAa,uBAAY,CAAA,GAAU;AAAA,KAAA,EACpE,CAAA,GACE;AAAA,GAAA,EACN,CAAA;AAEJ","file":"chunk-QDK66S4G.js","sourcesContent":["'use client';\n\nimport './checkbox.css';\nimport type { ChangeEventHandler, CSSProperties, InputHTMLAttributes, ReactNode } from 'react';\nimport { CheckGlyph } from './check-glyph';\nimport type { DataAttributes } from '../../../dom-props';\nimport { cx } from '../../internal/utils/cx';\n\ninterface CheckboxOwnProps {\n  /** Controlled checked state. Omit for uncontrolled (use `defaultChecked`). */\n  checked?: boolean;\n  /** Uncontrolled initial state. */\n  defaultChecked?: boolean;\n  /** Indeterminate - the \"some, not all\" select-all state; visually wins over `checked`. @default false */\n  indeterminate?: boolean;\n  /** Single error state for consent gates (\"you must agree\"); also sets `aria-invalid`. @default false */\n  error?: boolean;\n  /** Disabled - inert and de-emphasized (distinct fill when checked). */\n  disabled?: boolean;\n  /** Box size: `md` 18px - `sm` 16px for dense table rows. @default 'md' */\n  size?: 'sm' | 'md';\n  /** Label text beside the box. */\n  label?: ReactNode;\n  /** Optional secondary line under the label (settings rows). */\n  description?: ReactNode;\n  /** Fires on toggle - read `e.target.checked`. */\n  onChange?: ChangeEventHandler<HTMLInputElement>;\n  /** Extra class(es) merged onto the root label. */\n  className?: string;\n  /** Inline styles merged onto the root label. */\n  style?: CSSProperties;\n}\n\nexport interface CheckboxProps extends CheckboxOwnProps {\n  /** Standard <input> attributes (name, value, required, aria-*, ...) forwarded to the checkbox input. */\n  htmlProps?: Omit<InputHTMLAttributes<HTMLInputElement>, keyof CheckboxOwnProps | 'type'> & DataAttributes;\n}\n\nexport function Checkbox({\n  checked,\n  defaultChecked,\n  indeterminate = false,\n  error = false,\n  disabled = false,\n  size = 'md',\n  label,\n  description,\n  className = '',\n  style,\n  onChange,\n  htmlProps,\n}: CheckboxProps) {\n  const cls = cx('cbx', size === 'sm' && 'cbx--sm', error && 'cbx--error', disabled && 'cbx--disabled', className);\n\n  const controlled = checked !== undefined;\n  const checkedProps = controlled ? { checked } : { defaultChecked };\n\n  return (\n    <label className={cls} style={style}>\n      <CheckGlyph\n        indeterminate={indeterminate}\n        disabled={disabled}\n        aria-invalid={error || undefined}\n        onChange={onChange}\n        {...checkedProps}\n        {...htmlProps}\n      />\n      {label || description ? (\n        <span className=\"cbx__text\">\n          {label ? <span className=\"cbx__label\">{label}</span> : null}\n          {description ? <span className=\"cbx__desc\">{description}</span> : null}\n        </span>\n      ) : null}\n    </label>\n  );\n}\n"]}

package/dist/chunk-QGNC7LH5.js

@@ -0,0 +1,8 @@
+// src/components/internal/utils/cx.ts
+function cx(...parts) {
+  return parts.filter(Boolean).join(" ");
+}
+
+export { cx };
+//# sourceMappingURL=chunk-QGNC7LH5.js.map
+//# sourceMappingURL=chunk-QGNC7LH5.js.map

package/dist/chunk-QGNC7LH5.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/internal/utils/cx.ts"],"names":[],"mappings":";AAAO,SAAS,MAAM,KAAA,EAAyD;AAC7E,EAAA,OAAO,KAAA,CAAM,MAAA,CAAO,OAAO,CAAA,CAAE,KAAK,GAAG,CAAA;AACvC","file":"chunk-QGNC7LH5.js","sourcesContent":["export function cx(...parts: Array<string | false | null | undefined>): string {\n  return parts.filter(Boolean).join(' ');\n}\n"]}

package/dist/chunk-QMSJZCK3.js

@@ -0,0 +1,398 @@
+'use client';import { useAnchorPosition } from './chunk-EQ32F2QJ.js';
+import { OverlayPortal, useOverlayEntry, useOutsidePress } from './chunk-GY7JOPUQ.js';
+import { useGlide, GlidePill } from './chunk-MKIQFK7S.js';
+import { resolveMotionTiming } from './chunk-NEF5XAHG.js';
+import { Presence } from './chunk-MXOPCFWR.js';
+import { useMotion } from './chunk-W3SHPKSB.js';
+import { IconSlot } from './chunk-2ERBBFZS.js';
+import { Icon } from './chunk-3SBCBYB7.js';
+import { UIMotion } from './chunk-S5ZTZANS.js';
+import { Button } from './chunk-U5QQZC3U.js';
+import { Collapse } from './chunk-7SZCJ7WI.js';
+import { useState, useRef, useId, useMemo, useEffect, useLayoutEffect, Fragment } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+// src/components/composites/select/core/types.ts
+function normalize(options) {
+  const grouped = options.length > 0 && options[0] && Array.isArray(options[0].options);
+  const groups = grouped ? options.map((g) => ({ label: g.label, options: g.options || [] })) : [{ label: null, options }];
+  return { groups, flat: groups.flatMap((g) => g.options) };
+}
+var matches = (o, q) => !q || (o.label + " " + (o.description || "")).toLowerCase().includes(q.toLowerCase());
+
+// src/components/composites/select/core/use-listbox.ts
+function useListbox({
+  options,
+  disabled,
+  loading,
+  searchable,
+  id,
+  idPrefix,
+  isSelected,
+  onCommit,
+  closeOnCommit
+}) {
+  const [open, setOpen] = useState(false);
+  const [query, setQuery] = useState("");
+  const [activeIdx, setActiveIdx] = useState(-1);
+  const typeahead = useRef({ buf: "", t: 0 });
+  const triggerRef = useRef(null), listRef = useRef(null), searchRef = useRef(null);
+  const autoId = useId();
+  const baseId = id || idPrefix + autoId;
+  const menuId = baseId + "-menu";
+  const listId = baseId + "-list";
+  const glide = useGlide(listRef);
+  const { groups, flat } = useMemo(() => normalize(options), [options]);
+  const navItems = useMemo(() => flat.filter((o) => matches(o, query)), [flat, query]);
+  const show = () => {
+    if (!disabled && !loading) setOpen(true);
+  };
+  const requestClose = () => setOpen(false);
+  const returnFocus = () => triggerRef.current && triggerRef.current.focus();
+  function commit(opt) {
+    if (!opt || opt.disabled) return;
+    onCommit(opt);
+    if (closeOnCommit) {
+      requestClose();
+      returnFocus();
+    }
+  }
+  useEffect(() => {
+    if (!open) setQuery("");
+  }, [open]);
+  useEffect(() => {
+    if (!open) return;
+    const sel = navItems.findIndex((o) => isSelected(o.value) && !o.disabled);
+    const first = navItems.findIndex((o) => !o.disabled);
+    setActiveIdx(sel >= 0 ? sel : first);
+    const ref = searchable ? searchRef : listRef;
+    setTimeout(() => {
+      if (ref.current) ref.current.focus();
+    }, 0);
+  }, [open]);
+  useEffect(() => {
+    const list = listRef.current;
+    if (!open || activeIdx < 0 || !list) return;
+    const el = list.querySelector('[data-idx="' + activeIdx + '"]');
+    if (!el) return;
+    if (el.offsetTop < list.scrollTop) list.scrollTop = el.offsetTop;
+    else if (el.offsetTop + el.offsetHeight > list.scrollTop + list.clientHeight)
+      list.scrollTop = el.offsetTop + el.offsetHeight - list.clientHeight;
+  }, [activeIdx, open]);
+  useLayoutEffect(() => {
+    const list = listRef.current;
+    const el = open && activeIdx >= 0 && list && list.querySelector('[data-idx="' + activeIdx + '"]');
+    if (el) glide.enter(el);
+    else glide.leave();
+  }, [open, activeIdx, query]);
+  function moveActive(dir) {
+    if (!navItems.length) return;
+    let i = activeIdx;
+    for (let s = 0; s < navItems.length; s++) {
+      i = (i + dir + navItems.length) % navItems.length;
+      if (!navItems[i].disabled) return setActiveIdx(i);
+    }
+  }
+  function edgeActive(toEnd) {
+    const order = [...navItems.keys()];
+    if (toEnd) order.reverse();
+    for (const i of order) if (!navItems[i].disabled) return setActiveIdx(i);
+  }
+  function typeAhead(ch) {
+    const ta = typeahead.current;
+    clearTimeout(ta.t);
+    ta.buf += ch.toLowerCase();
+    ta.t = setTimeout(() => ta.buf = "", 600);
+    const i = navItems.findIndex((o) => !o.disabled && o.value.toLowerCase().startsWith(ta.buf));
+    if (i >= 0) setActiveIdx(i);
+  }
+  function onMenuKeyDown(e) {
+    switch (e.key) {
+      case "Escape":
+        e.preventDefault();
+        requestClose();
+        returnFocus();
+        break;
+      case "ArrowDown":
+        e.preventDefault();
+        moveActive(1);
+        break;
+      case "ArrowUp":
+        e.preventDefault();
+        moveActive(-1);
+        break;
+      case "Home":
+        e.preventDefault();
+        edgeActive(false);
+        break;
+      case "End":
+        e.preventDefault();
+        edgeActive(true);
+        break;
+      case "Enter":
+        e.preventDefault();
+        if (activeIdx >= 0) commit(navItems[activeIdx]);
+        break;
+      case "Tab":
+        requestClose();
+        break;
+      default:
+        if (!searchable && e.key.length === 1 && !e.metaKey && !e.ctrlKey) typeAhead(e.key);
+    }
+  }
+  const optId = (value) => baseId + "-opt-" + encodeURIComponent(value);
+  const active = activeIdx >= 0 ? navItems[activeIdx] : void 0;
+  const adId = open && active ? optId(active.value) : void 0;
+  return {
+    open,
+    query,
+    setQuery,
+    triggerRef,
+    listRef,
+    searchRef,
+    baseId,
+    menuId,
+    listId,
+    optId,
+    adId,
+    groups,
+    flat,
+    navItems,
+    glide,
+    isSelected,
+    show,
+    requestClose,
+    commit,
+    activeIdx,
+    setActiveIdx,
+    onMenuKeyDown
+  };
+}
+function SelectTrigger({
+  lb,
+  invalid,
+  ariaLabel,
+  leading,
+  text,
+  isPlaceholder,
+  count,
+  htmlProps,
+  ...rest
+}) {
+  const { triggerRef, baseId, open, adId, show, requestClose } = lb;
+  return /* @__PURE__ */ jsxs(
+    Button,
+    {
+      type: "button",
+      ref: triggerRef,
+      variant: "ghost",
+      htmlProps: {
+        id: baseId + "-trigger",
+        role: "combobox",
+        "aria-haspopup": "listbox",
+        "aria-expanded": open,
+        "aria-controls": baseId + "-list",
+        "aria-activedescendant": adId,
+        "aria-label": ariaLabel,
+        "aria-invalid": invalid || void 0,
+        onKeyDown: (e) => {
+          if (!open && (e.key === "ArrowDown" || e.key === "ArrowUp")) {
+            e.preventDefault();
+            show();
+          }
+        },
+        ...htmlProps
+      },
+      onClick: () => open ? requestClose() : show(),
+      iconRight: /* @__PURE__ */ jsx("span", { className: "select__caret", children: /* @__PURE__ */ jsx(Icon, { name: "caret-down", size: "sm" }) }),
+      iconLeft: leading && /* @__PURE__ */ jsx("span", { className: "select__leading", children: /* @__PURE__ */ jsx(IconSlot, { size: "sm", children: leading }) }),
+      ...rest,
+      children: [
+        /* @__PURE__ */ jsx("span", { className: "select__value", "data-placeholder": isPlaceholder ? "true" : void 0, children: text }),
+        count != null && count > 0 && /* @__PURE__ */ jsxs("span", { className: "select__count", children: [
+          "+",
+          count
+        ] })
+      ]
+    }
+  );
+}
+var SELECT_MENU_TIMING = {
+  open: { duration: "base", ease: "entrance" },
+  close: { duration: "base", ease: "exit" }
+};
+function selectMenuLayers(animation, dir) {
+  const t = resolveMotionTiming(animation, SELECT_MENU_TIMING)[dir];
+  const fade = (d) => ({ duration: d.duration === 0 ? 0 : UIMotion.dur.fast, ease: d.ease });
+  return dir === "open" ? [
+    { y: [-6, 0], scale: [0.96, 1], timing: t },
+    { opacity: [0, 1], timing: fade(t) }
+  ] : [
+    { y: [-6], scale: [0.96], timing: t },
+    { opacity: [0], timing: fade(t) }
+  ];
+}
+function MenuSurface({
+  menuId,
+  requestClose,
+  triggerRef,
+  multiple,
+  animate,
+  exit,
+  children
+}) {
+  const menuRef = useRef(null);
+  const entry = useOverlayEntry({ nodeRef: menuRef, dismissible: true, requestClose });
+  useMotion(menuRef, { animate, exit });
+  useLayoutEffect(() => {
+    const apply = () => {
+      const t = triggerRef.current;
+      if (t && menuRef.current) menuRef.current.style.minWidth = t.getBoundingClientRect().width + "px";
+    };
+    apply();
+    window.addEventListener("resize", apply);
+    return () => window.removeEventListener("resize", apply);
+  }, []);
+  useAnchorPosition({ side: "bottom", align: "start", arrow: false, triggerRef, panelRef: menuRef });
+  useOutsidePress({ entry, refs: [menuRef, triggerRef], enabled: true, onPress: requestClose });
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref: menuRef,
+      className: "select__menu",
+      id: menuId,
+      role: "presentation",
+      "data-multiple": multiple ? "true" : void 0,
+      children
+    }
+  );
+}
+function SelectMenu({ open, menuId, requestClose, triggerRef, multiple, animation, children }) {
+  return /* @__PURE__ */ jsx(OverlayPortal, { children: /* @__PURE__ */ jsx(Presence, { children: open && /* @__PURE__ */ jsx(
+    MenuSurface,
+    {
+      animate: selectMenuLayers(animation, "open"),
+      exit: selectMenuLayers(animation, "close"),
+      menuId,
+      requestClose,
+      triggerRef,
+      multiple,
+      children
+    },
+    "menu"
+  ) }) });
+}
+var defaultCheck = (selected) => selected ? /* @__PURE__ */ jsx(Icon, { name: "check", size: "sm", weight: "bold" }, "on") : null;
+function LoadingRows() {
+  return /* @__PURE__ */ jsx("div", { className: "select__loading", "aria-busy": "true", "aria-live": "polite", children: [0, 1, 2].map((i) => /* @__PURE__ */ jsxs("div", { className: "select__skeleton", children: [
+    /* @__PURE__ */ jsx("span", { className: "select__skeleton-dot", "data-pulse": true }),
+    /* @__PURE__ */ jsx("span", { className: "select__skeleton-bar", "data-pulse": true })
+  ] }, i)) });
+}
+function EmptyRow({ query }) {
+  return /* @__PURE__ */ jsx("div", { className: "select__empty", children: query ? 'No matches for "' + query + '"' : "No options available" });
+}
+function ListboxPanel({
+  lb,
+  loading,
+  searchable,
+  searchPlaceholder,
+  ariaLabel,
+  multiple,
+  animation,
+  size = "md",
+  check = defaultCheck
+}) {
+  const navIndex = useMemo(() => new Map(lb.navItems.map((o, i) => [o.value, i])), [lb.navItems]);
+  return /* @__PURE__ */ jsxs(
+    SelectMenu,
+    {
+      open: lb.open,
+      menuId: lb.menuId,
+      requestClose: lb.requestClose,
+      triggerRef: lb.triggerRef,
+      multiple,
+      animation,
+      children: [
+        searchable && !loading && /* @__PURE__ */ jsxs("div", { className: "select__search", children: [
+          /* @__PURE__ */ jsx(Icon, { name: "magnifying-glass", size: "sm" }),
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              ref: lb.searchRef,
+              className: "select__search-input",
+              type: "text",
+              value: lb.query,
+              placeholder: searchPlaceholder,
+              "aria-label": searchPlaceholder,
+              "aria-controls": lb.listId,
+              "aria-activedescendant": lb.adId,
+              onChange: (e) => lb.setQuery(e.target.value),
+              onKeyDown: lb.onMenuKeyDown
+            }
+          )
+        ] }),
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: "select__list",
+            ref: lb.listRef,
+            id: lb.listId,
+            role: "listbox",
+            "aria-multiselectable": multiple || void 0,
+            tabIndex: -1,
+            "aria-label": ariaLabel,
+            onKeyDown: searchable ? void 0 : lb.onMenuKeyDown,
+            children: [
+              /* @__PURE__ */ jsx(GlidePill, { className: "select__glide", glide: lb.glide }),
+              loading ? /* @__PURE__ */ jsx(LoadingRows, {}) : /* @__PURE__ */ jsxs(Fragment, { children: [
+                lb.groups.map((g, gi) => /* @__PURE__ */ jsxs("div", { className: "select__group", role: "group", "aria-label": g.label || void 0, children: [
+                  g.label && g.options.some((o) => navIndex.has(o.value)) && /* @__PURE__ */ jsx("div", { className: "select__group-label", children: g.label }),
+                  g.options.map((opt) => {
+                    const i = navIndex.get(opt.value) ?? -1;
+                    const visible = i !== -1;
+                    const isSel = lb.isSelected(opt.value);
+                    const row = /* @__PURE__ */ jsxs(
+                      "div",
+                      {
+                        id: visible ? lb.optId(opt.value) : void 0,
+                        "data-idx": visible ? i : void 0,
+                        className: "select__option",
+                        role: "option",
+                        "aria-selected": isSel,
+                        "aria-hidden": !visible || void 0,
+                        "aria-disabled": opt.disabled || void 0,
+                        "data-selected": isSel ? "true" : void 0,
+                        "data-active": visible && i === lb.activeIdx ? "true" : void 0,
+                        "data-disabled": opt.disabled ? "true" : void 0,
+                        onMouseEnter: () => visible && !opt.disabled && lb.setActiveIdx(i),
+                        onMouseDown: (e) => e.preventDefault(),
+                        onClick: () => visible && lb.commit(opt),
+                        "data-size": size,
+                        children: [
+                          opt.icon && /* @__PURE__ */ jsx("span", { className: "select__option-icon", children: /* @__PURE__ */ jsx(IconSlot, { size: "sm", children: opt.icon }) }),
+                          /* @__PURE__ */ jsxs("span", { className: "select__option-text", children: [
+                            /* @__PURE__ */ jsx("span", { className: "select__option-label", children: opt.label }),
+                            opt.description && /* @__PURE__ */ jsx("span", { className: "select__option-desc", children: opt.description })
+                          ] }),
+                          check(isSel) ? /* @__PURE__ */ jsx("span", { className: "select__option-check", children: check(isSel) }) : null
+                        ]
+                      },
+                      opt.value
+                    );
+                    return searchable ? /* @__PURE__ */ jsx(Collapse, { open: visible, fade: true, children: row }, opt.value) : row;
+                  })
+                ] }, gi)),
+                lb.navItems.length === 0 && /* @__PURE__ */ jsx(EmptyRow, { query: lb.query })
+              ] })
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+
+export { ListboxPanel, SelectTrigger, useListbox };
+//# sourceMappingURL=chunk-QMSJZCK3.js.map
+//# sourceMappingURL=chunk-QMSJZCK3.js.map