@tcn/ui 0.0.3 → 0.1.1

package/dist/stacks/v_collapsible_box.js

@@ -1,21 +1,21 @@
-import { jsx as f } from "react/jsx-runtime";
+import { jsx as m } from "react/jsx-runtime";
 import t, { useLayoutEffect as p } from "react";
 import "../utils/focus_redirect.js";
 import "../utils/click_away_listener.js";
 import "../utils/scroll_away_listener.js";
 import { useForkRef as u } from "../utils/hooks/use_fork_ref.js";
 import "../utils/hooks/use_resize_observer.js";
-import d from "classnames";
+import { clsx as d } from "clsx";
 import { Box as R } from "./box/box.js";
-import { s as z } from "../collapsible_box.module-BiS98xXA.js";
-import { useIsCollapsed as x } from "./utils/use_is_collapsed.js";
+import { s as x } from "../collapsible_box.module-BiS98xXA.js";
+import { useIsCollapsed as z } from "./utils/use_is_collapsed.js";
 const v = t.forwardRef(function({ open: l = !1, defaultHeight: i = "400px", ...e }, a) {
   const s = t.useRef(null), n = u(a, s), [c, r] = t.useState(!1);
   p(() => {
     s.current?.style.setProperty("--collapsible-size", i);
   }, [i]);
-  const m = x(l, s) && !l ? null : e.children;
-  return /* @__PURE__ */ f(
+  const f = z(l, s) && !l ? null : e.children;
+  return /* @__PURE__ */ m(
     R,
     {
       ref: n,
@@ -29,8 +29,8 @@ const v = t.forwardRef(function({ open: l = !1, defaultHeight: i = "400px", ...e
       onHeightResizeEnd: (o) => {
         r(!1), s.current?.style.setProperty("--collapsible-size", `${o}px`), e.onHeightResizeEnd?.(o);
       },
-      className: d(e.className, z["collapsible-box"]),
-      children: m
+      className: d(e.className, x["collapsible-box"]),
+      children: f
     }
   );
 });

package/dist/stacks/v_collapsible_box.js.map

@@ -1 +1 @@
-{"version":3,"file":"v_collapsible_box.js","sources":["../../src/stacks/v_collapsible_box.tsx"],"sourcesContent":["import React, { useLayoutEffect } from 'react';\nimport { useForkRef } from '../utils/index.js';\nimport classNames from 'classnames';\nimport { Box, BoxProps } from './box/box.js';\nimport styles from './collapsible_box.module.css';\nimport { useIsCollapsed } from './utils/use_is_collapsed.js';\n\nexport interface VCollapsibleBoxProps extends BoxProps {\n  open?: boolean;\n  defaultHeight?: string;\n}\n\nexport const VCollapsibleBox = React.forwardRef(function CollapsibleBox(\n  { open = false, defaultHeight = '400px', ...props }: VCollapsibleBoxProps,\n  ref: React.Ref<HTMLDivElement>\n) {\n  const collapsibleRef = React.useRef<HTMLDivElement | null>(null);\n  const forkRef = useForkRef(ref, collapsibleRef);\n  const [resizing, setIsResizing] = React.useState(false);\n\n  useLayoutEffect(() => {\n    collapsibleRef.current?.style.setProperty('--collapsible-size', defaultHeight);\n  }, [defaultHeight]);\n\n  const isCollapsed = useIsCollapsed(open, collapsibleRef);\n  const children = isCollapsed && !open ? null : props.children;\n\n  return (\n    <Box\n      ref={forkRef}\n      {...props}\n      data-is-collapsed={!open}\n      data-collapse-orientation=\"vertical\"\n      data-is-resizing={resizing}\n      onHeightResize={height => {\n        setIsResizing(true);\n        props.onHeightResize?.(height);\n      }}\n      onHeightResizeEnd={height => {\n        setIsResizing(false);\n        collapsibleRef.current?.style.setProperty('--collapsible-size', `${height}px`);\n        props.onHeightResizeEnd?.(height);\n      }}\n      className={classNames(props.className, styles['collapsible-box'])}\n      children={children}\n    />\n  );\n});\n"],"names":["VCollapsibleBox","React","open","defaultHeight","props","ref","collapsibleRef","forkRef","useForkRef","resizing","setIsResizing","useLayoutEffect","children","useIsCollapsed","jsx","Box","height","classNames","styles"],"mappings":";;;;;;;;;;;AAYO,MAAMA,IAAkBC,EAAM,WAAW,SAC9C,EAAE,MAAAC,IAAO,IAAO,eAAAC,IAAgB,SAAS,GAAGC,EAAA,GAC5CC,GACA;AACA,QAAMC,IAAiBL,EAAM,OAA8B,IAAI,GACzDM,IAAUC,EAAWH,GAAKC,CAAc,GACxC,CAACG,GAAUC,CAAa,IAAIT,EAAM,SAAS,EAAK;AAEtD,EAAAU,EAAgB,MAAM;AACpB,IAAAL,EAAe,SAAS,MAAM,YAAY,sBAAsBH,CAAa;AAAA,EAC/E,GAAG,CAACA,CAAa,CAAC;AAGlB,QAAMS,IADcC,EAAeX,GAAMI,CAAc,KACvB,CAACJ,IAAO,OAAOE,EAAM;AAErD,SACE,gBAAAU;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAKR;AAAA,MACJ,GAAGH;AAAA,MACJ,qBAAmB,CAACF;AAAA,MACpB,6BAA0B;AAAA,MAC1B,oBAAkBO;AAAA,MAClB,gBAAgB,CAAAO,MAAU;AACxB,QAAAN,EAAc,EAAI,GAClBN,EAAM,iBAAiBY,CAAM;AAAA,MAC/B;AAAA,MACA,mBAAmB,CAAAA,MAAU;AAC3B,QAAAN,EAAc,EAAK,GACnBJ,EAAe,SAAS,MAAM,YAAY,sBAAsB,GAAGU,CAAM,IAAI,GAC7EZ,EAAM,oBAAoBY,CAAM;AAAA,MAClC;AAAA,MACA,WAAWC,EAAWb,EAAM,WAAWc,EAAO,iBAAiB,CAAC;AAAA,MAChE,UAAAN;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;"}
+{"version":3,"file":"v_collapsible_box.js","sources":["../../src/stacks/v_collapsible_box.tsx"],"sourcesContent":["import React, { useLayoutEffect } from 'react';\nimport { useForkRef } from '../utils/index.js';\nimport { clsx } from 'clsx';\nimport { Box, BoxProps } from './box/box.js';\nimport styles from './collapsible_box.module.css';\nimport { useIsCollapsed } from './utils/use_is_collapsed.js';\n\nexport interface VCollapsibleBoxProps extends BoxProps {\n  open?: boolean;\n  defaultHeight?: string;\n}\n\nexport const VCollapsibleBox = React.forwardRef(function CollapsibleBox(\n  { open = false, defaultHeight = '400px', ...props }: VCollapsibleBoxProps,\n  ref: React.Ref<HTMLDivElement>\n) {\n  const collapsibleRef = React.useRef<HTMLDivElement | null>(null);\n  const forkRef = useForkRef(ref, collapsibleRef);\n  const [resizing, setIsResizing] = React.useState(false);\n\n  useLayoutEffect(() => {\n    collapsibleRef.current?.style.setProperty('--collapsible-size', defaultHeight);\n  }, [defaultHeight]);\n\n  const isCollapsed = useIsCollapsed(open, collapsibleRef);\n  const children = isCollapsed && !open ? null : props.children;\n\n  return (\n    <Box\n      ref={forkRef}\n      {...props}\n      data-is-collapsed={!open}\n      data-collapse-orientation=\"vertical\"\n      data-is-resizing={resizing}\n      onHeightResize={height => {\n        setIsResizing(true);\n        props.onHeightResize?.(height);\n      }}\n      onHeightResizeEnd={height => {\n        setIsResizing(false);\n        collapsibleRef.current?.style.setProperty('--collapsible-size', `${height}px`);\n        props.onHeightResizeEnd?.(height);\n      }}\n      className={clsx(props.className, styles['collapsible-box'])}\n      children={children}\n    />\n  );\n});\n"],"names":["VCollapsibleBox","React","open","defaultHeight","props","ref","collapsibleRef","forkRef","useForkRef","resizing","setIsResizing","useLayoutEffect","children","useIsCollapsed","jsx","Box","height","clsx","styles"],"mappings":";;;;;;;;;;;AAYO,MAAMA,IAAkBC,EAAM,WAAW,SAC9C,EAAE,MAAAC,IAAO,IAAO,eAAAC,IAAgB,SAAS,GAAGC,EAAA,GAC5CC,GACA;AACA,QAAMC,IAAiBL,EAAM,OAA8B,IAAI,GACzDM,IAAUC,EAAWH,GAAKC,CAAc,GACxC,CAACG,GAAUC,CAAa,IAAIT,EAAM,SAAS,EAAK;AAEtD,EAAAU,EAAgB,MAAM;AACpB,IAAAL,EAAe,SAAS,MAAM,YAAY,sBAAsBH,CAAa;AAAA,EAC/E,GAAG,CAACA,CAAa,CAAC;AAGlB,QAAMS,IADcC,EAAeX,GAAMI,CAAc,KACvB,CAACJ,IAAO,OAAOE,EAAM;AAErD,SACE,gBAAAU;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAKR;AAAA,MACJ,GAAGH;AAAA,MACJ,qBAAmB,CAACF;AAAA,MACpB,6BAA0B;AAAA,MAC1B,oBAAkBO;AAAA,MAClB,gBAAgB,CAAAO,MAAU;AACxB,QAAAN,EAAc,EAAI,GAClBN,EAAM,iBAAiBY,CAAM;AAAA,MAC/B;AAAA,MACA,mBAAmB,CAAAA,MAAU;AAC3B,QAAAN,EAAc,EAAK,GACnBJ,EAAe,SAAS,MAAM,YAAY,sBAAsB,GAAGU,CAAM,IAAI,GAC7EZ,EAAM,oBAAoBY,CAAM;AAAA,MAClC;AAAA,MACA,WAAWC,EAAKb,EAAM,WAAWc,EAAO,iBAAiB,CAAC;AAAA,MAC1D,UAAAN;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;"}

package/dist/stacks/v_stack.js

@@ -1,16 +1,16 @@
 import { jsx as J } from "react/jsx-runtime";
-import K from "classnames";
+import { clsx as K } from "clsx";
 import L from "react";
 import { removeUndefinedProperties as M } from "./utils/remove_undefined_properties.js";
 import { s as O } from "../stack.module-CBV1f12Z.js";
-import { isCustomSizeProp as r } from "./utils/isCustomSizeProp.js";
+import { isCustomSizeProp as s } from "./utils/isCustomSizeProp.js";
 const tt = L.forwardRef(function({
   as: i = "div",
   children: l,
   style: d,
   className: n,
-  hAlign: m = "center",
-  vAlign: f = "start",
+  hAlign: f = "center",
+  vAlign: m = "start",
   inline: t,
   allowFlow: c,
   width: a = "default",
@@ -19,25 +19,25 @@ const tt = L.forwardRef(function({
   height: o = "default",
   minHeight: u,
   maxHeight: k,
-  growWeight: y,
-  shrinkWeight: g,
-  padding: x,
+  growWeight: x,
+  shrinkWeight: y,
+  padding: g,
   paddingBlock: S,
   paddingInline: h,
   paddingInlineStart: w,
   paddingInlineEnd: B,
-  paddingTop: N,
-  paddingBottom: P,
-  margin: R,
-  marginBlock: V,
-  marginInline: W,
-  marginInlineStart: j,
-  marginInlineEnd: z,
-  marginTop: A,
-  marginBottom: C,
+  paddingTop: P,
+  paddingBottom: R,
+  margin: V,
+  marginBlock: W,
+  marginInline: j,
+  marginInlineStart: z,
+  marginInlineEnd: A,
+  marginTop: C,
+  marginBottom: N,
   zIndex: U,
   overflowY: e,
-  overflowX: s,
+  overflowX: r,
   gap: b,
   rowGap: q,
   columnGap: D,
@@ -46,30 +46,30 @@ const tt = L.forwardRef(function({
   const G = i, H = {
     display: t == null ? void 0 : t ? "inline-flex" : "flex",
     minWidth: p,
-    width: r(a) ? void 0 : a,
+    width: s(a) ? void 0 : a,
     maxWidth: v,
     minHeight: u,
-    height: r(o) ? void 0 : o,
+    height: s(o) ? void 0 : o,
     maxHeight: k,
-    flexGrow: y,
-    flexShrink: g,
+    flexGrow: x,
+    flexShrink: y,
     zIndex: U,
-    overflowX: s,
+    overflowX: r,
     overflowY: e,
-    padding: x,
+    padding: g,
     paddingBlock: S,
     paddingInline: h,
     paddingInlineStart: w,
     paddingInlineEnd: B,
-    paddingTop: N,
-    paddingBottom: P,
-    margin: R,
-    marginBlock: V,
-    marginInline: W,
-    marginInlineStart: j,
-    marginInlineEnd: z,
-    marginTop: A,
-    marginBottom: C,
+    paddingTop: P,
+    paddingBottom: R,
+    margin: V,
+    marginBlock: W,
+    marginInline: j,
+    marginInlineStart: z,
+    marginInlineEnd: A,
+    marginTop: C,
+    marginBottom: N,
     gap: b,
     rowGap: q,
     columnGap: D
@@ -85,12 +85,12 @@ const tt = L.forwardRef(function({
       style: I,
       "data-inline": !!t,
       "data-allow-flow": !!c,
-      "data-v-alignment": f,
-      "data-h-alignment": m,
+      "data-v-alignment": m,
+      "data-h-alignment": f,
       "data-height": o,
       "data-width": a,
       "data-overflow-y": e,
-      "data-overflow-x": s,
+      "data-overflow-x": r,
       ...E,
       children: l
     }

package/dist/stacks/v_stack.js.map

@@ -1 +1 @@
-{"version":3,"file":"v_stack.js","sources":["../../src/stacks/v_stack.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport React, { HTMLAttributes } from 'react';\nimport { removeUndefinedProperties } from './utils/remove_undefined_properties.js';\nimport { CommonProps } from './types/common.js';\nimport { StackStyleProps, VerticalProps } from './types/styles.js';\nimport styles from './stack.module.css';\nimport { isCustomSizeProp } from './utils/isCustomSizeProp.js';\n\nexport type VStackOwnProps = CommonProps & StackStyleProps & VerticalProps;\n\nexport interface VStackProps<T extends HTMLElement = HTMLElement>\n  extends VStackOwnProps,\n    HTMLAttributes<T> {\n  as?: string;\n  children?: React.ReactNode;\n}\n\nexport const VStack = React.forwardRef(function VStack<\n  T extends HTMLElement = HTMLElement,\n>(\n  {\n    as = 'div',\n    children,\n    style,\n    className,\n    hAlign = 'center',\n    vAlign = 'start',\n    inline,\n    allowFlow,\n    width = 'default',\n    minWidth,\n    maxWidth,\n    height = 'default',\n    minHeight,\n    maxHeight,\n    growWeight: flexGrow,\n    shrinkWeight: flexShrink,\n    padding,\n    paddingBlock,\n    paddingInline,\n    paddingInlineStart,\n    paddingInlineEnd,\n    paddingTop,\n    paddingBottom,\n    margin,\n    marginBlock,\n    marginInline,\n    marginInlineStart,\n    marginInlineEnd,\n    marginTop,\n    marginBottom,\n    zIndex,\n    overflowY,\n    overflowX,\n    gap,\n    rowGap,\n    columnGap,\n    ...attr\n  }: VStackProps<T>,\n  ref: React.Ref<T>\n) {\n  const As = as as React.ElementType;\n  const defaultStyles: any = {\n    display: inline == null ? undefined : inline ? 'inline-flex' : 'flex',\n    minWidth,\n    width: !isCustomSizeProp(width) ? width : undefined,\n    maxWidth,\n    minHeight,\n    height: !isCustomSizeProp(height) ? height : undefined,\n    maxHeight,\n    flexGrow,\n    flexShrink,\n    zIndex,\n    overflowX,\n    overflowY,\n    padding,\n    paddingBlock,\n    paddingInline,\n    paddingInlineStart,\n    paddingInlineEnd,\n    paddingTop,\n    paddingBottom,\n    margin,\n    marginBlock,\n    marginInline,\n    marginInlineStart,\n    marginInlineEnd,\n    marginTop,\n    marginBottom,\n    gap,\n    rowGap,\n    columnGap,\n  };\n\n  const finalStyles: React.CSSProperties = {\n    ...removeUndefinedProperties(defaultStyles),\n    ...style,\n  };\n\n  return (\n    <As\n      ref={ref}\n      className={classNames(styles['v-stack'], className, 'v-stack', 'stack')}\n      style={finalStyles}\n      data-inline={Boolean(inline)}\n      data-allow-flow={Boolean(allowFlow)}\n      data-v-alignment={vAlign}\n      data-h-alignment={hAlign}\n      data-height={height}\n      data-width={width}\n      data-overflow-y={overflowY}\n      data-overflow-x={overflowX}\n      {...attr}\n    >\n      {children}\n    </As>\n  );\n});\n"],"names":["VStack","React","as","children","style","className","hAlign","vAlign","inline","allowFlow","width","minWidth","maxWidth","height","minHeight","maxHeight","flexGrow","flexShrink","padding","paddingBlock","paddingInline","paddingInlineStart","paddingInlineEnd","paddingTop","paddingBottom","margin","marginBlock","marginInline","marginInlineStart","marginInlineEnd","marginTop","marginBottom","zIndex","overflowY","overflowX","gap","rowGap","columnGap","attr","ref","As","defaultStyles","isCustomSizeProp","finalStyles","removeUndefinedProperties","jsx","classNames","styles"],"mappings":";;;;;;AAiBO,MAAMA,KAASC,EAAM,WAAW,SAGrC;AAAA,EACE,IAAAC,IAAK;AAAA,EACL,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,QAAAC,IAAS;AAAA,EACT,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,YAAYC;AAAA,EACZ,cAAcC;AAAA,EACd,SAAAC;AAAA,EACA,cAAAC;AAAA,EACA,eAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,YAAAC;AAAA,EACA,eAAAC;AAAA,EACA,QAAAC;AAAA,EACA,aAAAC;AAAA,EACA,cAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,WAAAC;AAAA,EACA,cAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,KAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,QAAMC,IAAKtC,GACLuC,IAAqB;AAAA,IACzB,SAASjC,KAAU,OAAO,SAAYA,IAAS,gBAAgB;AAAA,IAC/D,UAAAG;AAAA,IACA,OAAQ+B,EAAiBhC,CAAK,IAAY,SAARA;AAAA,IAClC,UAAAE;AAAA,IACA,WAAAE;AAAA,IACA,QAAS4B,EAAiB7B,CAAM,IAAa,SAATA;AAAA,IACpC,WAAAE;AAAA,IACA,UAAAC;AAAA,IACA,YAAAC;AAAA,IACA,QAAAe;AAAA,IACA,WAAAE;AAAA,IACA,WAAAD;AAAA,IACA,SAAAf;AAAA,IACA,cAAAC;AAAA,IACA,eAAAC;AAAA,IACA,oBAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,YAAAC;AAAA,IACA,eAAAC;AAAA,IACA,QAAAC;AAAA,IACA,aAAAC;AAAA,IACA,cAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,WAAAC;AAAA,IACA,cAAAC;AAAA,IACA,KAAAI;AAAA,IACA,QAAAC;AAAA,IACA,WAAAC;AAAA,EAAA,GAGIM,IAAmC;AAAA,IACvC,GAAGC,EAA0BH,CAAa;AAAA,IAC1C,GAAGrC;AAAA,EAAA;AAGL,SACE,gBAAAyC;AAAA,IAACL;AAAA,IAAA;AAAA,MACC,KAAAD;AAAA,MACA,WAAWO,EAAWC,EAAO,SAAS,GAAG1C,GAAW,WAAW,OAAO;AAAA,MACtE,OAAOsC;AAAA,MACP,eAAa,EAAQnC;AAAA,MACrB,mBAAiB,EAAQC;AAAA,MACzB,oBAAkBF;AAAA,MAClB,oBAAkBD;AAAA,MAClB,eAAaO;AAAA,MACb,cAAYH;AAAA,MACZ,mBAAiBuB;AAAA,MACjB,mBAAiBC;AAAA,MAChB,GAAGI;AAAA,MAEH,UAAAnC;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;"}
+{"version":3,"file":"v_stack.js","sources":["../../src/stacks/v_stack.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport React, { HTMLAttributes } from 'react';\nimport { removeUndefinedProperties } from './utils/remove_undefined_properties.js';\nimport { CommonProps } from './types/common.js';\nimport { StackStyleProps, VerticalProps } from './types/styles.js';\nimport styles from './stack.module.css';\nimport { isCustomSizeProp } from './utils/isCustomSizeProp.js';\n\nexport type VStackOwnProps = CommonProps & StackStyleProps & VerticalProps;\n\nexport interface VStackProps<T extends HTMLElement = HTMLElement>\n  extends VStackOwnProps,\n    HTMLAttributes<T> {\n  as?: string;\n  children?: React.ReactNode;\n}\n\nexport const VStack = React.forwardRef(function VStack<\n  T extends HTMLElement = HTMLElement,\n>(\n  {\n    as = 'div',\n    children,\n    style,\n    className,\n    hAlign = 'center',\n    vAlign = 'start',\n    inline,\n    allowFlow,\n    width = 'default',\n    minWidth,\n    maxWidth,\n    height = 'default',\n    minHeight,\n    maxHeight,\n    growWeight: flexGrow,\n    shrinkWeight: flexShrink,\n    padding,\n    paddingBlock,\n    paddingInline,\n    paddingInlineStart,\n    paddingInlineEnd,\n    paddingTop,\n    paddingBottom,\n    margin,\n    marginBlock,\n    marginInline,\n    marginInlineStart,\n    marginInlineEnd,\n    marginTop,\n    marginBottom,\n    zIndex,\n    overflowY,\n    overflowX,\n    gap,\n    rowGap,\n    columnGap,\n    ...attr\n  }: VStackProps<T>,\n  ref: React.Ref<T>\n) {\n  const As = as as React.ElementType;\n  const defaultStyles: any = {\n    display: inline == null ? undefined : inline ? 'inline-flex' : 'flex',\n    minWidth,\n    width: !isCustomSizeProp(width) ? width : undefined,\n    maxWidth,\n    minHeight,\n    height: !isCustomSizeProp(height) ? height : undefined,\n    maxHeight,\n    flexGrow,\n    flexShrink,\n    zIndex,\n    overflowX,\n    overflowY,\n    padding,\n    paddingBlock,\n    paddingInline,\n    paddingInlineStart,\n    paddingInlineEnd,\n    paddingTop,\n    paddingBottom,\n    margin,\n    marginBlock,\n    marginInline,\n    marginInlineStart,\n    marginInlineEnd,\n    marginTop,\n    marginBottom,\n    gap,\n    rowGap,\n    columnGap,\n  };\n\n  const finalStyles: React.CSSProperties = {\n    ...removeUndefinedProperties(defaultStyles),\n    ...style,\n  };\n\n  return (\n    <As\n      ref={ref}\n      className={clsx(styles['v-stack'], className, 'v-stack', 'stack')}\n      style={finalStyles}\n      data-inline={Boolean(inline)}\n      data-allow-flow={Boolean(allowFlow)}\n      data-v-alignment={vAlign}\n      data-h-alignment={hAlign}\n      data-height={height}\n      data-width={width}\n      data-overflow-y={overflowY}\n      data-overflow-x={overflowX}\n      {...attr}\n    >\n      {children}\n    </As>\n  );\n});\n"],"names":["VStack","React","as","children","style","className","hAlign","vAlign","inline","allowFlow","width","minWidth","maxWidth","height","minHeight","maxHeight","flexGrow","flexShrink","padding","paddingBlock","paddingInline","paddingInlineStart","paddingInlineEnd","paddingTop","paddingBottom","margin","marginBlock","marginInline","marginInlineStart","marginInlineEnd","marginTop","marginBottom","zIndex","overflowY","overflowX","gap","rowGap","columnGap","attr","ref","As","defaultStyles","isCustomSizeProp","finalStyles","removeUndefinedProperties","jsx","clsx","styles"],"mappings":";;;;;;AAiBO,MAAMA,KAASC,EAAM,WAAW,SAGrC;AAAA,EACE,IAAAC,IAAK;AAAA,EACL,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,QAAAC,IAAS;AAAA,EACT,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,YAAYC;AAAA,EACZ,cAAcC;AAAA,EACd,SAAAC;AAAA,EACA,cAAAC;AAAA,EACA,eAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,YAAAC;AAAA,EACA,eAAAC;AAAA,EACA,QAAAC;AAAA,EACA,aAAAC;AAAA,EACA,cAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,WAAAC;AAAA,EACA,cAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,KAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,QAAMC,IAAKtC,GACLuC,IAAqB;AAAA,IACzB,SAASjC,KAAU,OAAO,SAAYA,IAAS,gBAAgB;AAAA,IAC/D,UAAAG;AAAA,IACA,OAAQ+B,EAAiBhC,CAAK,IAAY,SAARA;AAAA,IAClC,UAAAE;AAAA,IACA,WAAAE;AAAA,IACA,QAAS4B,EAAiB7B,CAAM,IAAa,SAATA;AAAA,IACpC,WAAAE;AAAA,IACA,UAAAC;AAAA,IACA,YAAAC;AAAA,IACA,QAAAe;AAAA,IACA,WAAAE;AAAA,IACA,WAAAD;AAAA,IACA,SAAAf;AAAA,IACA,cAAAC;AAAA,IACA,eAAAC;AAAA,IACA,oBAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,YAAAC;AAAA,IACA,eAAAC;AAAA,IACA,QAAAC;AAAA,IACA,aAAAC;AAAA,IACA,cAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,WAAAC;AAAA,IACA,cAAAC;AAAA,IACA,KAAAI;AAAA,IACA,QAAAC;AAAA,IACA,WAAAC;AAAA,EAAA,GAGIM,IAAmC;AAAA,IACvC,GAAGC,EAA0BH,CAAa;AAAA,IAC1C,GAAGrC;AAAA,EAAA;AAGL,SACE,gBAAAyC;AAAA,IAACL;AAAA,IAAA;AAAA,MACC,KAAAD;AAAA,MACA,WAAWO,EAAKC,EAAO,SAAS,GAAG1C,GAAW,WAAW,OAAO;AAAA,MAChE,OAAOsC;AAAA,MACP,eAAa,EAAQnC;AAAA,MACrB,mBAAiB,EAAQC;AAAA,MACzB,oBAAkBF;AAAA,MAClB,oBAAkBD;AAAA,MAClB,eAAaO;AAAA,MACb,cAAYH;AAAA,MACZ,mBAAiBuB;AAAA,MACjB,mBAAiBC;AAAA,MAChB,GAAGI;AAAA,MAEH,UAAAnC;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;"}

package/dist/stacks/z_stack.js

@@ -1,5 +1,5 @@
-import { jsx as o } from "react/jsx-runtime";
-import E from "classnames";
+import { jsx as a } from "react/jsx-runtime";
+import { clsx as E } from "clsx";
 import F from "react";
 import { removeUndefinedProperties as G } from "./utils/remove_undefined_properties.js";
 import { s as H } from "../stack.module-CBV1f12Z.js";
@@ -11,10 +11,10 @@ const T = F.forwardRef(function({
   hAlign: n = "center",
   vAlign: m = "center",
   inline: f,
-  width: a = "default",
+  width: e = "default",
   minWidth: c,
   maxWidth: d,
-  height: e = "default",
+  height: o = "default",
   minHeight: l,
   maxHeight: p,
   growWeight: g,
@@ -24,47 +24,47 @@ const T = F.forwardRef(function({
   paddingInline: y,
   paddingInlineStart: S,
   paddingInlineEnd: h,
-  paddingTop: z,
-  paddingBottom: w,
-  margin: x,
-  marginBlock: N,
-  marginInline: P,
-  marginInlineStart: R,
-  marginInlineEnd: W,
-  marginTop: Z,
-  marginBottom: j,
-  zIndex: A,
-  className: B,
-  overflow: C,
+  paddingTop: x,
+  paddingBottom: z,
+  margin: w,
+  marginBlock: P,
+  marginInline: R,
+  marginInlineStart: W,
+  marginInlineEnd: Z,
+  marginTop: j,
+  marginBottom: A,
+  zIndex: B,
+  className: C,
+  overflow: N,
   ...U
 }, b) {
   const q = s, D = {
     minWidth: c,
-    width: r(a) ? void 0 : a,
+    width: r(e) ? void 0 : e,
     maxWidth: d,
     minHeight: l,
-    height: r(e) ? void 0 : e,
+    height: r(o) ? void 0 : o,
     maxHeight: p,
     flexGrow: g,
     flexShrink: k,
-    zIndex: A,
-    overflow: C,
+    zIndex: B,
+    overflow: N,
     padding: u,
     paddingBlock: v,
     paddingInline: y,
     paddingInlineStart: S,
     paddingInlineEnd: h,
-    paddingTop: z,
-    paddingBottom: w,
-    margin: x,
-    marginBlock: N,
-    marginInline: P,
-    marginInlineStart: R,
-    marginInlineEnd: W,
-    marginTop: Z,
-    marginBottom: j
+    paddingTop: x,
+    paddingBottom: z,
+    margin: w,
+    marginBlock: P,
+    marginInline: R,
+    marginInlineStart: W,
+    marginInlineEnd: Z,
+    marginTop: j,
+    marginBottom: A
   };
-  return /* @__PURE__ */ o(
+  return /* @__PURE__ */ a(
     q,
     {
       ref: b,
@@ -72,14 +72,14 @@ const T = F.forwardRef(function({
         ...G(D),
         ...i
       },
-      className: E(H["z-stack"], B, "z-stack", "stack"),
+      className: E(H["z-stack"], C, "z-stack", "stack"),
       "data-inline": !!f,
       "data-v-alignment": m,
       "data-h-alignment": n,
-      "data-height": e,
-      "data-width": a,
+      "data-height": o,
+      "data-width": e,
       ...U,
-      children: typeof t == "string" ? /* @__PURE__ */ o("span", { children: t }) : t
+      children: typeof t == "string" ? /* @__PURE__ */ a("span", { children: t }) : t
     }
   );
 });

package/dist/stacks/z_stack.js.map

@@ -1 +1 @@
-{"version":3,"file":"z_stack.js","sources":["../../src/stacks/z_stack.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport React, { HTMLAttributes } from 'react';\nimport { removeUndefinedProperties } from './utils/remove_undefined_properties.js';\nimport { CommonProps } from './types/common.js';\nimport { StackStyleProps } from './types/styles.js';\nimport styles from './stack.module.css';\nimport { isCustomSizeProp } from './utils/isCustomSizeProp.js';\n\nexport type ZStackOwnProps = CommonProps &\n  StackStyleProps & {\n    overflow?: 'hidden' | 'visible';\n  };\n\nexport interface ZStackProps<T extends HTMLElement = HTMLElement>\n  extends ZStackOwnProps,\n    HTMLAttributes<T> {\n  as?: string;\n  children?: React.ReactNode;\n}\n\nexport const ZStack = React.forwardRef(function ZStack<T extends HTMLElement>(\n  {\n    as = 'div',\n    children,\n    style,\n    hAlign = 'center',\n    vAlign = 'center',\n    inline,\n    width = 'default',\n    minWidth,\n    maxWidth,\n    height = 'default',\n    minHeight,\n    maxHeight,\n    growWeight: flexGrow,\n    shrinkWeight: flexShrink,\n    padding,\n    paddingBlock,\n    paddingInline,\n    paddingInlineStart,\n    paddingInlineEnd,\n    paddingTop,\n    paddingBottom,\n    margin,\n    marginBlock,\n    marginInline,\n    marginInlineStart,\n    marginInlineEnd,\n    marginTop,\n    marginBottom,\n    zIndex,\n    className,\n    overflow,\n    ...attr\n  }: ZStackProps<T>,\n  ref: React.Ref<T>\n) {\n  const As = as as React.ElementType;\n  const defaultStyles = {\n    minWidth,\n    width: !isCustomSizeProp(width) ? width : undefined,\n    maxWidth,\n    minHeight,\n    height: !isCustomSizeProp(height) ? height : undefined,\n    maxHeight,\n    flexGrow,\n    flexShrink,\n    zIndex,\n    overflow,\n    padding,\n    paddingBlock,\n    paddingInline,\n    paddingInlineStart,\n    paddingInlineEnd,\n    paddingTop,\n    paddingBottom,\n    margin,\n    marginBlock,\n    marginInline,\n    marginInlineStart,\n    marginInlineEnd,\n    marginTop,\n    marginBottom,\n  };\n\n  return (\n    <As\n      ref={ref}\n      style={{\n        ...removeUndefinedProperties(defaultStyles),\n        ...style,\n      }}\n      className={classNames(styles['z-stack'], className, 'z-stack', 'stack')}\n      data-inline={Boolean(inline)}\n      data-v-alignment={vAlign}\n      data-h-alignment={hAlign}\n      data-height={height}\n      data-width={width}\n      {...attr}\n    >\n      {typeof children === 'string' ? <span>{children}</span> : children}\n    </As>\n  );\n});\n"],"names":["ZStack","React","as","children","style","hAlign","vAlign","inline","width","minWidth","maxWidth","height","minHeight","maxHeight","flexGrow","flexShrink","padding","paddingBlock","paddingInline","paddingInlineStart","paddingInlineEnd","paddingTop","paddingBottom","margin","marginBlock","marginInline","marginInlineStart","marginInlineEnd","marginTop","marginBottom","zIndex","className","overflow","attr","ref","As","defaultStyles","isCustomSizeProp","jsx","removeUndefinedProperties","classNames","styles"],"mappings":";;;;;;AAoBO,MAAMA,IAASC,EAAM,WAAW,SACrC;AAAA,EACE,IAAAC,IAAK;AAAA,EACL,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,QAAAC,IAAS;AAAA,EACT,QAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,YAAYC;AAAA,EACZ,cAAcC;AAAA,EACd,SAAAC;AAAA,EACA,cAAAC;AAAA,EACA,eAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,YAAAC;AAAA,EACA,eAAAC;AAAA,EACA,QAAAC;AAAA,EACA,aAAAC;AAAA,EACA,cAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,WAAAC;AAAA,EACA,cAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,QAAMC,IAAKjC,GACLkC,IAAgB;AAAA,IACpB,UAAA3B;AAAA,IACA,OAAQ4B,EAAiB7B,CAAK,IAAY,SAARA;AAAA,IAClC,UAAAE;AAAA,IACA,WAAAE;AAAA,IACA,QAASyB,EAAiB1B,CAAM,IAAa,SAATA;AAAA,IACpC,WAAAE;AAAA,IACA,UAAAC;AAAA,IACA,YAAAC;AAAA,IACA,QAAAe;AAAA,IACA,UAAAE;AAAA,IACA,SAAAhB;AAAA,IACA,cAAAC;AAAA,IACA,eAAAC;AAAA,IACA,oBAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,YAAAC;AAAA,IACA,eAAAC;AAAA,IACA,QAAAC;AAAA,IACA,aAAAC;AAAA,IACA,cAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,WAAAC;AAAA,IACA,cAAAC;AAAA,EAAA;AAGF,SACE,gBAAAS;AAAA,IAACH;AAAA,IAAA;AAAA,MACC,KAAAD;AAAA,MACA,OAAO;AAAA,QACL,GAAGK,EAA0BH,CAAa;AAAA,QAC1C,GAAGhC;AAAA,MAAA;AAAA,MAEL,WAAWoC,EAAWC,EAAO,SAAS,GAAGV,GAAW,WAAW,OAAO;AAAA,MACtE,eAAa,EAAQxB;AAAA,MACrB,oBAAkBD;AAAA,MAClB,oBAAkBD;AAAA,MAClB,eAAaM;AAAA,MACb,cAAYH;AAAA,MACX,GAAGyB;AAAA,MAEH,iBAAO9B,KAAa,WAAW,gBAAAmC,EAAC,QAAA,EAAM,UAAAnC,GAAS,IAAUA;AAAA,IAAA;AAAA,EAAA;AAGhE,CAAC;"}
+{"version":3,"file":"z_stack.js","sources":["../../src/stacks/z_stack.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport React, { HTMLAttributes } from 'react';\nimport { removeUndefinedProperties } from './utils/remove_undefined_properties.js';\nimport { CommonProps } from './types/common.js';\nimport { StackStyleProps } from './types/styles.js';\nimport styles from './stack.module.css';\nimport { isCustomSizeProp } from './utils/isCustomSizeProp.js';\n\nexport type ZStackOwnProps = CommonProps &\n  StackStyleProps & {\n    overflow?: 'hidden' | 'visible';\n  };\n\nexport interface ZStackProps<T extends HTMLElement = HTMLElement>\n  extends ZStackOwnProps,\n    HTMLAttributes<T> {\n  as?: string;\n  children?: React.ReactNode;\n}\n\nexport const ZStack = React.forwardRef(function ZStack<T extends HTMLElement>(\n  {\n    as = 'div',\n    children,\n    style,\n    hAlign = 'center',\n    vAlign = 'center',\n    inline,\n    width = 'default',\n    minWidth,\n    maxWidth,\n    height = 'default',\n    minHeight,\n    maxHeight,\n    growWeight: flexGrow,\n    shrinkWeight: flexShrink,\n    padding,\n    paddingBlock,\n    paddingInline,\n    paddingInlineStart,\n    paddingInlineEnd,\n    paddingTop,\n    paddingBottom,\n    margin,\n    marginBlock,\n    marginInline,\n    marginInlineStart,\n    marginInlineEnd,\n    marginTop,\n    marginBottom,\n    zIndex,\n    className,\n    overflow,\n    ...attr\n  }: ZStackProps<T>,\n  ref: React.Ref<T>\n) {\n  const As = as as React.ElementType;\n  const defaultStyles = {\n    minWidth,\n    width: !isCustomSizeProp(width) ? width : undefined,\n    maxWidth,\n    minHeight,\n    height: !isCustomSizeProp(height) ? height : undefined,\n    maxHeight,\n    flexGrow,\n    flexShrink,\n    zIndex,\n    overflow,\n    padding,\n    paddingBlock,\n    paddingInline,\n    paddingInlineStart,\n    paddingInlineEnd,\n    paddingTop,\n    paddingBottom,\n    margin,\n    marginBlock,\n    marginInline,\n    marginInlineStart,\n    marginInlineEnd,\n    marginTop,\n    marginBottom,\n  };\n\n  return (\n    <As\n      ref={ref}\n      style={{\n        ...removeUndefinedProperties(defaultStyles),\n        ...style,\n      }}\n      className={clsx(styles['z-stack'], className, 'z-stack', 'stack')}\n      data-inline={Boolean(inline)}\n      data-v-alignment={vAlign}\n      data-h-alignment={hAlign}\n      data-height={height}\n      data-width={width}\n      {...attr}\n    >\n      {typeof children === 'string' ? <span>{children}</span> : children}\n    </As>\n  );\n});\n"],"names":["ZStack","React","as","children","style","hAlign","vAlign","inline","width","minWidth","maxWidth","height","minHeight","maxHeight","flexGrow","flexShrink","padding","paddingBlock","paddingInline","paddingInlineStart","paddingInlineEnd","paddingTop","paddingBottom","margin","marginBlock","marginInline","marginInlineStart","marginInlineEnd","marginTop","marginBottom","zIndex","className","overflow","attr","ref","As","defaultStyles","isCustomSizeProp","jsx","removeUndefinedProperties","clsx","styles"],"mappings":";;;;;;AAoBO,MAAMA,IAASC,EAAM,WAAW,SACrC;AAAA,EACE,IAAAC,IAAK;AAAA,EACL,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,QAAAC,IAAS;AAAA,EACT,QAAAC;AAAA,EACA,OAAAC,IAAQ;AAAA,EACR,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,YAAYC;AAAA,EACZ,cAAcC;AAAA,EACd,SAAAC;AAAA,EACA,cAAAC;AAAA,EACA,eAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,YAAAC;AAAA,EACA,eAAAC;AAAA,EACA,QAAAC;AAAA,EACA,aAAAC;AAAA,EACA,cAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,WAAAC;AAAA,EACA,cAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,QAAMC,IAAKjC,GACLkC,IAAgB;AAAA,IACpB,UAAA3B;AAAA,IACA,OAAQ4B,EAAiB7B,CAAK,IAAY,SAARA;AAAA,IAClC,UAAAE;AAAA,IACA,WAAAE;AAAA,IACA,QAASyB,EAAiB1B,CAAM,IAAa,SAATA;AAAA,IACpC,WAAAE;AAAA,IACA,UAAAC;AAAA,IACA,YAAAC;AAAA,IACA,QAAAe;AAAA,IACA,UAAAE;AAAA,IACA,SAAAhB;AAAA,IACA,cAAAC;AAAA,IACA,eAAAC;AAAA,IACA,oBAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,YAAAC;AAAA,IACA,eAAAC;AAAA,IACA,QAAAC;AAAA,IACA,aAAAC;AAAA,IACA,cAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,iBAAAC;AAAA,IACA,WAAAC;AAAA,IACA,cAAAC;AAAA,EAAA;AAGF,SACE,gBAAAS;AAAA,IAACH;AAAA,IAAA;AAAA,MACC,KAAAD;AAAA,MACA,OAAO;AAAA,QACL,GAAGK,EAA0BH,CAAa;AAAA,QAC1C,GAAGhC;AAAA,MAAA;AAAA,MAEL,WAAWoC,EAAKC,EAAO,SAAS,GAAGV,GAAW,WAAW,OAAO;AAAA,MAChE,eAAa,EAAQxB;AAAA,MACrB,oBAAkBD;AAAA,MAClB,oBAAkBD;AAAA,MAClB,eAAaM;AAAA,MACb,cAAYH;AAAA,MACX,GAAGyB;AAAA,MAEH,iBAAO9B,KAAa,WAAW,gBAAAmC,EAAC,QAAA,EAAM,UAAAnC,GAAS,IAAUA;AAAA,IAAA;AAAA,EAAA;AAGhE,CAAC;"}

package/dist/surfaces/alert/alert.js

@@ -1,21 +1,21 @@
 import { jsx as r } from "react/jsx-runtime";
-import p from "classnames";
+import { clsx as p } from "clsx";
 import e from "react";
 import "../../actions/button/base_button/base_button.js";
 import "../../actions/button/button_group/button_group.js";
 import "../../actions/button/slim_button/slim_button.js";
-import { Button as a } from "../../actions/button/button/button.js";
+import { Button as c } from "../../actions/button/button/button.js";
 import "../../actions/button/select_group/select_group.js";
 import "../../actions/button/select_group/single_select_group.js";
-import { Confirm as c } from "../confirm/confirm.js";
-const C = e.forwardRef(function({ className: o, onAccept: t, ...m }, i) {
+import { Confirm as f } from "../confirm/confirm.js";
+const C = e.forwardRef(function({ className: o, onAccept: t, ...i }, m) {
   return /* @__PURE__ */ r(
-    c,
+    f,
     {
-      ref: i,
+      ref: m,
       className: p(o, "alert"),
-      ...m,
-      actions: /* @__PURE__ */ r(a, { onClick: t, hierarchy: "primary", width: "100%", children: "OK" })
+      ...i,
+      actions: /* @__PURE__ */ r(c, { onClick: t, hierarchy: "primary", width: "100%", children: "OK" })
     }
   );
 });

package/dist/surfaces/alert/alert.js.map

@@ -1 +1 @@
-{"version":3,"file":"alert.js","sources":["../../../src/surfaces/alert/alert.tsx"],"sourcesContent":["import classNames from 'classnames';\nimport React from 'react';\nimport { Button } from '../../actions/index.js';\nimport { Confirm, ConfirmProps } from '../confirm/confirm.js';\n\nexport interface AlertProps extends Omit<ConfirmProps, 'actions'> {\n  open?: boolean;\n  graphic?: React.ReactNode;\n  title?: string;\n  description?: string;\n  onAccept?: () => void;\n}\n\nexport const Alert = React.forwardRef(function Alert(\n  { className, onAccept, ...props }: AlertProps,\n  ref: React.Ref<HTMLDivElement>\n) {\n  return (\n    <Confirm\n      ref={ref}\n      className={classNames(className, 'alert')}\n      {...props}\n      actions={\n        <Button onClick={onAccept} hierarchy=\"primary\" width=\"100%\">\n          OK\n        </Button>\n      }\n    />\n  );\n});\n"],"names":["Alert","React","className","onAccept","props","ref","jsx","Confirm","classNames","Button"],"mappings":";;;;;;;;;;AAaO,MAAMA,IAAQC,EAAM,WAAW,SACpC,EAAE,WAAAC,GAAW,UAAAC,GAAU,GAAGC,EAAA,GAC1BC,GACA;AACA,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAF;AAAA,MACA,WAAWG,EAAWN,GAAW,OAAO;AAAA,MACvC,GAAGE;AAAA,MACJ,2BACGK,GAAA,EAAO,SAASN,GAAU,WAAU,WAAU,OAAM,QAAO,UAAA,KAAA,CAE5D;AAAA,IAAA;AAAA,EAAA;AAIR,CAAC;"}
+{"version":3,"file":"alert.js","sources":["../../../src/surfaces/alert/alert.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport React from 'react';\nimport { Button } from '../../actions/index.js';\nimport { Confirm, ConfirmProps } from '../confirm/confirm.js';\n\nexport interface AlertProps extends Omit<ConfirmProps, 'actions'> {\n  open?: boolean;\n  graphic?: React.ReactNode;\n  title?: string;\n  description?: string;\n  onAccept?: () => void;\n}\n\nexport const Alert = React.forwardRef(function Alert(\n  { className, onAccept, ...props }: AlertProps,\n  ref: React.Ref<HTMLDivElement>\n) {\n  return (\n    <Confirm\n      ref={ref}\n      className={clsx(className, 'alert')}\n      {...props}\n      actions={\n        <Button onClick={onAccept} hierarchy=\"primary\" width=\"100%\">\n          OK\n        </Button>\n      }\n    />\n  );\n});\n"],"names":["Alert","React","className","onAccept","props","ref","jsx","Confirm","clsx","Button"],"mappings":";;;;;;;;;;AAaO,MAAMA,IAAQC,EAAM,WAAW,SACpC,EAAE,WAAAC,GAAW,UAAAC,GAAU,GAAGC,EAAA,GAC1BC,GACA;AACA,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAF;AAAA,MACA,WAAWG,EAAKN,GAAW,OAAO;AAAA,MACjC,GAAGE;AAAA,MACJ,2BACGK,GAAA,EAAO,SAASN,GAAU,WAAU,WAAU,OAAM,QAAO,UAAA,KAAA,CAE5D;AAAA,IAAA;AAAA,EAAA;AAIR,CAAC;"}

package/dist/surfaces/card/card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../../src/surfaces/card/card.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAEnE,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,WAAW,EAAE,IAAI,GAAG,UAAU,CAAC;IACrE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,IAAI,+EAcf,CAAC"}
+{"version":3,"file":"card.d.ts","sourceRoot":"","sources":["../../../src/surfaces/card/card.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,yBAAyB,CAAC;AAEnE,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,WAAW,EAAE,IAAI,GAAG,UAAU,CAAC;IACrE,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B;AAED,eAAO,MAAM,IAAI,+EASf,CAAC"}

package/dist/surfaces/card/card.js

@@ -1,18 +1,9 @@
-import { jsx as t } from "react/jsx-runtime";
-import { VStack as s } from "../../stacks/v_stack.js";
-import m from "classnames";
-import e from "react";
-import '../../card.css';const n = "_card_a3c9492", f = { card: n }, x = e.forwardRef(function({ children: r, className: a, ...o }, c) {
-  return /* @__PURE__ */ t(
-    s,
-    {
-      ref: c,
-      as: "section",
-      className: m(a, f.card, "card"),
-      ...o,
-      children: r
-    }
-  );
+import { jsx as c } from "react/jsx-runtime";
+import { VStack as m } from "../../stacks/v_stack.js";
+import { clsx as f } from "clsx";
+import s from "react";
+const x = s.forwardRef(function({ children: r, className: o, ...t }, a) {
+  return /* @__PURE__ */ c(m, { ref: a, as: "section", className: f(o, "tcn-card"), ...t, children: r });
 });
 export {
   x as Card

package/dist/surfaces/card/card.js.map

@@ -1 +1 @@
-{"version":3,"file":"card.js","sources":["../../../src/surfaces/card/card.tsx"],"sourcesContent":["import { VStack, type VStackProps } from '../../stacks/v_stack.js';\nimport classNames from 'classnames';\nimport React from 'react';\nimport styles from './card.module.css';\n\nexport interface CardProps extends Omit<VStackProps, 'as' | 'children'> {\n  children?: React.ReactNode;\n}\n\nexport const Card = React.forwardRef<HTMLElement, CardProps>(function VPanel(\n  { children, className, ...props }: CardProps,\n  ref\n) {\n  return (\n    <VStack\n      ref={ref}\n      as=\"section\"\n      className={classNames(className, styles.card, 'card')}\n      {...props}\n    >\n      {children}\n    </VStack>\n  );\n});\n"],"names":["Card","React","children","className","props","ref","jsx","VStack","classNames","styles"],"mappings":";;;;4CASaA,IAAOC,EAAM,WAAmC,SAC3D,EAAE,UAAAC,GAAU,WAAAC,GAAW,GAAGC,EAAA,GAC1BC,GACA;AACA,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAF;AAAA,MACA,IAAG;AAAA,MACH,WAAWG,EAAWL,GAAWM,EAAO,MAAM,MAAM;AAAA,MACnD,GAAGL;AAAA,MAEH,UAAAF;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;"}
+{"version":3,"file":"card.js","sources":["../../../src/surfaces/card/card.tsx"],"sourcesContent":["import { VStack, type VStackProps } from '../../stacks/v_stack.js';\nimport { clsx } from 'clsx';\nimport React from 'react';\n\nexport interface CardProps extends Omit<VStackProps, 'as' | 'children'> {\n  children?: React.ReactNode;\n}\n\nexport const Card = React.forwardRef<HTMLElement, CardProps>(function Card(\n  { children, className, ...props }: CardProps,\n  ref\n) {\n  return (\n    <VStack ref={ref} as=\"section\" className={clsx(className, 'tcn-card')} {...props}>\n      {children}\n    </VStack>\n  );\n});\n"],"names":["Card","React","children","className","props","ref","jsx","VStack","clsx"],"mappings":";;;;AAQO,MAAMA,IAAOC,EAAM,WAAmC,SAC3D,EAAE,UAAAC,GAAU,WAAAC,GAAW,GAAGC,EAAA,GAC1BC,GACA;AACA,SACE,gBAAAC,EAACC,GAAA,EAAO,KAAAF,GAAU,IAAG,WAAU,WAAWG,EAAKL,GAAW,UAAU,GAAI,GAAGC,GACxE,UAAAF,EAAA,CACH;AAEJ,CAAC;"}

package/dist/surfaces/confirm/confirm.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"confirm.d.ts","sourceRoot":"","sources":["../../../src/surfaces/confirm/confirm.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4C,MAAM,OAAO,CAAC;AAQjE,OAAO,EAAO,KAAK,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAE7D,MAAM,WAAW,YAAa,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACxE,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,QAAQ,CAAC;CACtB;AAED,eAAO,MAAM,OAAO,qFAuElB,CAAC"}
+{"version":3,"file":"confirm.d.ts","sourceRoot":"","sources":["../../../src/surfaces/confirm/confirm.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4C,MAAM,OAAO,CAAC;AAQjE,OAAO,EAAO,KAAK,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAE7D,MAAM,WAAW,YAAa,SAAQ,KAAK,CAAC,cAAc,CAAC,cAAc,CAAC;IACxE,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC1B,SAAS,CAAC,EAAE,QAAQ,CAAC;CACtB;AAED,eAAO,MAAM,OAAO,qFAoElB,CAAC"}

package/dist/surfaces/confirm/confirm.js

@@ -1,19 +1,19 @@
 import { jsx as r, Fragment as _, jsxs as i } from "react/jsx-runtime";
-import w, { useRef as N, useState as S, useLayoutEffect as s } from "react";
-import n from "classnames";
-import { Spacer as C } from "../../stacks/spacer.js";
+import w, { useRef as S, useState as C, useLayoutEffect as n } from "react";
+import { clsx as s } from "clsx";
+import { Spacer as N } from "../../stacks/spacer.js";
 import { VStack as T } from "../../stacks/v_stack.js";
 import { ZStack as R } from "../../stacks/z_stack.js";
-import { P as j } from "../../portal-qqIp4SIl.js";
+import { Portal as j } from "../../overlay/portal/portal.js";
 import { BodyText as B } from "../../typography/body_text/body_text.js";
 import "../../callout.module-D8ECmxpO.js";
 import "../../caption.module-DDq0H4xZ.js";
 import "../../footnote.module-DEyFuqOr.js";
 import "../../headline.module-BiwHBtGf.js";
 import "../../subheadline.module-C-v7zMkQ.js";
-import { Title as P } from "../../typography/title/title.js";
+import { Title as b } from "../../typography/title/title.js";
 import { Box as c } from "../../stacks/box/box.js";
-import '../../confirm.css';const b = "_confirm_e53f865", v = "_shake_d5d9154", z = "_actions_b7ffee5", m = { confirm: b, shake: v, actions: z }, U = w.forwardRef(function({
+import '../../confirm.css';const v = "_confirm_e53f865", z = "_shake_d5d9154", A = "_actions_b7ffee5", m = { confirm: v, shake: z, actions: A }, U = w.forwardRef(function({
   open: a,
   graphic: f,
   title: h,
@@ -22,11 +22,11 @@ import '../../confirm.css';const b = "_confirm_e53f865", v = "_shake_d5d9154", z
   veilProps: d,
   className: u,
   ...k
-}, g) {
-  const t = N(!1), [e, o] = S(!1);
-  s(() => (t.current = !0, () => {
+}, x) {
+  const t = S(!1), [e, o] = C(!1);
+  n(() => (t.current = !0, () => {
     t.current = !1;
-  }), []), s(() => {
+  }), []), n(() => {
     if (e && t.current) {
       const y = window.setTimeout(() => {
         o(!1);
@@ -34,31 +34,24 @@ import '../../confirm.css';const b = "_confirm_e53f865", v = "_shake_d5d9154", z
       return () => window.clearTimeout(y);
     }
   }, [e]);
-  function x() {
+  function g() {
     o(!0);
   }
   return /* @__PURE__ */ r(_, { children: a && /* @__PURE__ */ r(j, { children: /* @__PURE__ */ i(R, { height: "100%", style: { position: "fixed" }, children: [
-    /* @__PURE__ */ r(c, { onClick: x, ...d, height: "100%" }),
+    /* @__PURE__ */ r(c, { onClick: g, ...d, height: "100%" }),
     /* @__PURE__ */ r(
       "div",
       {
-        ref: g,
-        className: n(m.confirm, u, "confirm"),
+        ref: x,
+        className: s(m.confirm, u, "confirm"),
         "data-shake": e,
         ...k,
         children: /* @__PURE__ */ i(T, { hAlign: "center", children: [
           f,
-          /* @__PURE__ */ r(P, { className: "confirm-title", emphasis: "strong", size: "sm", children: h }),
+          /* @__PURE__ */ r(b, { className: "confirm-title", emphasis: "strong", size: "sm", children: h }),
           /* @__PURE__ */ r(B, { className: "confirm-description", hierarchy: "tertiary", children: l }),
-          /* @__PURE__ */ r(C, { height: "16px" }),
-          /* @__PURE__ */ r(
-            c,
-            {
-              className: n(m.actions, "confirm-actions"),
-              height: "auto",
-              children: p
-            }
-          )
+          /* @__PURE__ */ r(N, { height: "16px" }),
+          /* @__PURE__ */ r(c, { className: s(m.actions, "confirm-actions"), height: "auto", children: p })
         ] })
       }
     )

package/dist/surfaces/confirm/confirm.js.map

@@ -1 +1 @@
-{"version":3,"file":"confirm.js","sources":["../../../src/surfaces/confirm/confirm.tsx"],"sourcesContent":["import React, { useLayoutEffect, useRef, useState } from 'react';\nimport classNames from 'classnames';\nimport { Spacer } from '../../stacks/spacer.js';\nimport { VStack } from '../../stacks/v_stack.js';\nimport { ZStack } from '../../stacks/z_stack.js';\nimport { Portal } from '../../overlay/portal/portal.js';\nimport { BodyText, Title } from '../../typography/index.js';\nimport styles from './confirm.module.css';\nimport { Box, type BoxProps } from '../../stacks/box/box.js';\n\nexport interface ConfirmProps extends React.HTMLAttributes<HTMLDivElement> {\n  open?: boolean;\n  graphic?: React.ReactNode;\n  title?: string;\n  description?: string;\n  actions?: React.ReactNode;\n  veilProps?: BoxProps;\n}\n\nexport const Confirm = React.forwardRef(function Confirm(\n  {\n    open,\n    graphic,\n    title,\n    description,\n    actions,\n    veilProps,\n    className,\n    ...props\n  }: ConfirmProps,\n  ref: React.Ref<HTMLDivElement>\n) {\n  const isMounted = useRef(false);\n  const [shake, setShake] = useState(false);\n\n  useLayoutEffect(() => {\n    isMounted.current = true;\n    return () => {\n      isMounted.current = false;\n    };\n  }, []);\n\n  useLayoutEffect(() => {\n    if (shake && isMounted.current) {\n      const id = window.setTimeout(() => {\n        setShake(false);\n      }, 600);\n\n      return () => window.clearTimeout(id);\n    }\n  }, [shake]);\n\n  function shakeConfirm() {\n    setShake(true);\n  }\n\n  return (\n    <>\n      {open && (\n        <Portal>\n          <ZStack height=\"100%\" style={{ position: 'fixed' }}>\n            <Box onClick={shakeConfirm} {...veilProps} height=\"100%\"></Box>\n            <div\n              ref={ref}\n              className={classNames(styles.confirm, className, 'confirm')}\n              data-shake={shake}\n              {...props}\n            >\n              <VStack hAlign=\"center\">\n                {graphic}\n                <Title className=\"confirm-title\" emphasis=\"strong\" size=\"sm\">\n                  {title}\n                </Title>\n                <BodyText className=\"confirm-description\" hierarchy=\"tertiary\">\n                  {description}\n                </BodyText>\n                <Spacer height=\"16px\" />\n                <Box\n                  className={classNames(styles.actions, 'confirm-actions')}\n                  height=\"auto\"\n                >\n                  {actions}\n                </Box>\n              </VStack>\n            </div>\n          </ZStack>\n        </Portal>\n      )}\n    </>\n  );\n});\n"],"names":["Confirm","React","open","graphic","title","description","actions","veilProps","className","props","ref","isMounted","useRef","shake","setShake","useState","useLayoutEffect","id","shakeConfirm","jsx","Fragment","Portal","jsxs","ZStack","Box","classNames","styles","VStack","Title","BodyText","Spacer"],"mappings":";;;;;;;;;;;;;;;sHAmBaA,IAAUC,EAAM,WAAW,SACtC;AAAA,EACE,MAAAC;AAAA,EACA,SAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,QAAMC,IAAYC,EAAO,EAAK,GACxB,CAACC,GAAOC,CAAQ,IAAIC,EAAS,EAAK;AAExC,EAAAC,EAAgB,OACdL,EAAU,UAAU,IACb,MAAM;AACX,IAAAA,EAAU,UAAU;AAAA,EACtB,IACC,CAAA,CAAE,GAELK,EAAgB,MAAM;AACpB,QAAIH,KAASF,EAAU,SAAS;AAC9B,YAAMM,IAAK,OAAO,WAAW,MAAM;AACjC,QAAAH,EAAS,EAAK;AAAA,MAChB,GAAG,GAAG;AAEN,aAAO,MAAM,OAAO,aAAaG,CAAE;AAAA,IACrC;AAAA,EACF,GAAG,CAACJ,CAAK,CAAC;AAEV,WAASK,IAAe;AACtB,IAAAJ,EAAS,EAAI;AAAA,EACf;AAEA,SACE,gBAAAK,EAAAC,GAAA,EACG,UAAAlB,KACC,gBAAAiB,EAACE,GAAA,EACC,UAAA,gBAAAC,EAACC,GAAA,EAAO,QAAO,QAAO,OAAO,EAAE,UAAU,QAAA,GACvC,UAAA;AAAA,IAAA,gBAAAJ,EAACK,KAAI,SAASN,GAAe,GAAGX,GAAW,QAAO,QAAO;AAAA,IACzD,gBAAAY;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAT;AAAA,QACA,WAAWe,EAAWC,EAAO,SAASlB,GAAW,SAAS;AAAA,QAC1D,cAAYK;AAAA,QACX,GAAGJ;AAAA,QAEJ,UAAA,gBAAAa,EAACK,GAAA,EAAO,QAAO,UACZ,UAAA;AAAA,UAAAxB;AAAA,UACD,gBAAAgB,EAACS,KAAM,WAAU,iBAAgB,UAAS,UAAS,MAAK,MACrD,UAAAxB,EAAA,CACH;AAAA,4BACCyB,GAAA,EAAS,WAAU,uBAAsB,WAAU,YACjD,UAAAxB,GACH;AAAA,UACA,gBAAAc,EAACW,GAAA,EAAO,QAAO,OAAA,CAAO;AAAA,UACtB,gBAAAX;AAAA,YAACK;AAAA,YAAA;AAAA,cACC,WAAWC,EAAWC,EAAO,SAAS,iBAAiB;AAAA,cACvD,QAAO;AAAA,cAEN,UAAApB;AAAA,YAAA;AAAA,UAAA;AAAA,QACH,EAAA,CACF;AAAA,MAAA;AAAA,IAAA;AAAA,EACF,EAAA,CACF,GACF,GAEJ;AAEJ,CAAC;"}
+{"version":3,"file":"confirm.js","sources":["../../../src/surfaces/confirm/confirm.tsx"],"sourcesContent":["import React, { useLayoutEffect, useRef, useState } from 'react';\nimport { clsx } from 'clsx';\nimport { Spacer } from '../../stacks/spacer.js';\nimport { VStack } from '../../stacks/v_stack.js';\nimport { ZStack } from '../../stacks/z_stack.js';\nimport { Portal } from '../../overlay/portal/portal.js';\nimport { BodyText, Title } from '../../typography/index.js';\nimport styles from './confirm.module.css';\nimport { Box, type BoxProps } from '../../stacks/box/box.js';\n\nexport interface ConfirmProps extends React.HTMLAttributes<HTMLDivElement> {\n  open?: boolean;\n  graphic?: React.ReactNode;\n  title?: string;\n  description?: string;\n  actions?: React.ReactNode;\n  veilProps?: BoxProps;\n}\n\nexport const Confirm = React.forwardRef(function Confirm(\n  {\n    open,\n    graphic,\n    title,\n    description,\n    actions,\n    veilProps,\n    className,\n    ...props\n  }: ConfirmProps,\n  ref: React.Ref<HTMLDivElement>\n) {\n  const isMounted = useRef(false);\n  const [shake, setShake] = useState(false);\n\n  useLayoutEffect(() => {\n    isMounted.current = true;\n    return () => {\n      isMounted.current = false;\n    };\n  }, []);\n\n  useLayoutEffect(() => {\n    if (shake && isMounted.current) {\n      const id = window.setTimeout(() => {\n        setShake(false);\n      }, 600);\n\n      return () => window.clearTimeout(id);\n    }\n  }, [shake]);\n\n  function shakeConfirm() {\n    setShake(true);\n  }\n\n  return (\n    <>\n      {open && (\n        <Portal>\n          <ZStack height=\"100%\" style={{ position: 'fixed' }}>\n            <Box onClick={shakeConfirm} {...veilProps} height=\"100%\"></Box>\n            <div\n              ref={ref}\n              className={clsx(styles.confirm, className, 'confirm')}\n              data-shake={shake}\n              {...props}\n            >\n              <VStack hAlign=\"center\">\n                {graphic}\n                <Title className=\"confirm-title\" emphasis=\"strong\" size=\"sm\">\n                  {title}\n                </Title>\n                <BodyText className=\"confirm-description\" hierarchy=\"tertiary\">\n                  {description}\n                </BodyText>\n                <Spacer height=\"16px\" />\n                <Box className={clsx(styles.actions, 'confirm-actions')} height=\"auto\">\n                  {actions}\n                </Box>\n              </VStack>\n            </div>\n          </ZStack>\n        </Portal>\n      )}\n    </>\n  );\n});\n"],"names":["Confirm","React","open","graphic","title","description","actions","veilProps","className","props","ref","isMounted","useRef","shake","setShake","useState","useLayoutEffect","id","shakeConfirm","jsx","Fragment","Portal","jsxs","ZStack","Box","clsx","styles","VStack","Title","BodyText","Spacer"],"mappings":";;;;;;;;;;;;;;;sHAmBaA,IAAUC,EAAM,WAAW,SACtC;AAAA,EACE,MAAAC;AAAA,EACA,SAAAC;AAAA,EACA,OAAAC;AAAA,EACA,aAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,QAAMC,IAAYC,EAAO,EAAK,GACxB,CAACC,GAAOC,CAAQ,IAAIC,EAAS,EAAK;AAExC,EAAAC,EAAgB,OACdL,EAAU,UAAU,IACb,MAAM;AACX,IAAAA,EAAU,UAAU;AAAA,EACtB,IACC,CAAA,CAAE,GAELK,EAAgB,MAAM;AACpB,QAAIH,KAASF,EAAU,SAAS;AAC9B,YAAMM,IAAK,OAAO,WAAW,MAAM;AACjC,QAAAH,EAAS,EAAK;AAAA,MAChB,GAAG,GAAG;AAEN,aAAO,MAAM,OAAO,aAAaG,CAAE;AAAA,IACrC;AAAA,EACF,GAAG,CAACJ,CAAK,CAAC;AAEV,WAASK,IAAe;AACtB,IAAAJ,EAAS,EAAI;AAAA,EACf;AAEA,SACE,gBAAAK,EAAAC,GAAA,EACG,UAAAlB,KACC,gBAAAiB,EAACE,GAAA,EACC,UAAA,gBAAAC,EAACC,GAAA,EAAO,QAAO,QAAO,OAAO,EAAE,UAAU,QAAA,GACvC,UAAA;AAAA,IAAA,gBAAAJ,EAACK,KAAI,SAASN,GAAe,GAAGX,GAAW,QAAO,QAAO;AAAA,IACzD,gBAAAY;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,KAAAT;AAAA,QACA,WAAWe,EAAKC,EAAO,SAASlB,GAAW,SAAS;AAAA,QACpD,cAAYK;AAAA,QACX,GAAGJ;AAAA,QAEJ,UAAA,gBAAAa,EAACK,GAAA,EAAO,QAAO,UACZ,UAAA;AAAA,UAAAxB;AAAA,UACD,gBAAAgB,EAACS,KAAM,WAAU,iBAAgB,UAAS,UAAS,MAAK,MACrD,UAAAxB,EAAA,CACH;AAAA,4BACCyB,GAAA,EAAS,WAAU,uBAAsB,WAAU,YACjD,UAAAxB,GACH;AAAA,UACA,gBAAAc,EAACW,GAAA,EAAO,QAAO,OAAA,CAAO;AAAA,UACtB,gBAAAX,EAACK,GAAA,EAAI,WAAWC,EAAKC,EAAO,SAAS,iBAAiB,GAAG,QAAO,QAC7D,UAAApB,EAAA,CACH;AAAA,QAAA,EAAA,CACF;AAAA,MAAA;AAAA,IAAA;AAAA,EACF,EAAA,CACF,GACF,GAEJ;AAEJ,CAAC;"}

package/dist/surfaces/drawers/drawer_bottom/drawer_bottom.js

@@ -1,11 +1,11 @@
-import { jsx as a } from "react/jsx-runtime";
-import { VStack as e } from "../../../stacks/v_stack.js";
-import s from "classnames";
+import { jsx as e } from "react/jsx-runtime";
+import { VStack as a } from "../../../stacks/v_stack.js";
+import { clsx as s } from "clsx";
 import c from "react";
 import '../../../drawer_bottom.css';const f = "_drawerBottom_9359033", n = { drawerBottom: f }, l = c.forwardRef(
   function({ children: o, className: t, ...r }, m) {
-    return /* @__PURE__ */ a(
-      e,
+    return /* @__PURE__ */ e(
+      a,
       {
         ref: m,
         as: "section",

package/dist/surfaces/drawers/drawer_bottom/drawer_bottom.js.map

@@ -1 +1 @@
-{"version":3,"file":"drawer_bottom.js","sources":["../../../../src/surfaces/drawers/drawer_bottom/drawer_bottom.tsx"],"sourcesContent":["import { VStack, type VStackProps } from '../../../stacks/v_stack.js';\nimport classNames from 'classnames';\nimport React from 'react';\nimport styles from './drawer_bottom.module.css';\n\nexport interface DrawerBottomProps extends Omit<VStackProps, 'as' | 'children'> {\n  children?: React.ReactNode;\n}\n\nexport const DrawerBottom = React.forwardRef<HTMLElement, DrawerBottomProps>(\n  function DrawerBottom({ children, className, ...props }: DrawerBottomProps, ref) {\n    return (\n      <VStack\n        ref={ref}\n        as=\"section\"\n        className={classNames(styles.drawerBottom, className, 'drawer-bottom')}\n        {...props}\n      >\n        {children}\n      </VStack>\n    );\n  }\n);\n"],"names":["DrawerBottom","React","children","className","props","ref","jsx","VStack","classNames","styles"],"mappings":";;;;4DASaA,IAAeC,EAAM;AAAA,EAChC,SAAsB,EAAE,UAAAC,GAAU,WAAAC,GAAW,GAAGC,EAAA,GAA4BC,GAAK;AAC/E,WACE,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,KAAAF;AAAA,QACA,IAAG;AAAA,QACH,WAAWG,EAAWC,EAAO,cAAcN,GAAW,eAAe;AAAA,QACpE,GAAGC;AAAA,QAEH,UAAAF;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AACF;"}
+{"version":3,"file":"drawer_bottom.js","sources":["../../../../src/surfaces/drawers/drawer_bottom/drawer_bottom.tsx"],"sourcesContent":["import { VStack, type VStackProps } from '../../../stacks/v_stack.js';\nimport { clsx } from 'clsx';\nimport React from 'react';\nimport styles from './drawer_bottom.module.css';\n\nexport interface DrawerBottomProps extends Omit<VStackProps, 'as' | 'children'> {\n  children?: React.ReactNode;\n}\n\nexport const DrawerBottom = React.forwardRef<HTMLElement, DrawerBottomProps>(\n  function DrawerBottom({ children, className, ...props }: DrawerBottomProps, ref) {\n    return (\n      <VStack\n        ref={ref}\n        as=\"section\"\n        className={clsx(styles.drawerBottom, className, 'drawer-bottom')}\n        {...props}\n      >\n        {children}\n      </VStack>\n    );\n  }\n);\n"],"names":["DrawerBottom","React","children","className","props","ref","jsx","VStack","clsx","styles"],"mappings":";;;;4DASaA,IAAeC,EAAM;AAAA,EAChC,SAAsB,EAAE,UAAAC,GAAU,WAAAC,GAAW,GAAGC,EAAA,GAA4BC,GAAK;AAC/E,WACE,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,KAAAF;AAAA,QACA,IAAG;AAAA,QACH,WAAWG,EAAKC,EAAO,cAAcN,GAAW,eAAe;AAAA,QAC9D,GAAGC;AAAA,QAEH,UAAAF;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AACF;"}

package/dist/surfaces/drawers/drawer_end/drawer_end.js

@@ -1,15 +1,15 @@
-import { jsx as t } from "react/jsx-runtime";
+import { jsx as e } from "react/jsx-runtime";
 import { VStack as n } from "../../../stacks/v_stack.js";
-import s from "classnames";
-import d from "react";
-import '../../../drawer_end.css';const c = "_drawerEnd_39acb27", m = { drawerEnd: c }, l = d.forwardRef(function({ children: r, className: a, ...o }, e) {
-  return /* @__PURE__ */ t(
+import { clsx as d } from "clsx";
+import s from "react";
+import '../../../drawer_end.css';const c = "_drawerEnd_39acb27", m = { drawerEnd: c }, l = s.forwardRef(function({ children: r, className: o, ...t }, a) {
+  return /* @__PURE__ */ e(
     n,
     {
-      ref: e,
+      ref: a,
       as: "section",
-      className: s(m.drawerEnd, a, "drawerEnd"),
-      ...o,
+      className: d(m.drawerEnd, o, "drawerEnd"),
+      ...t,
       children: r
     }
   );

package/dist/surfaces/drawers/drawer_end/drawer_end.js.map

@@ -1 +1 @@
-{"version":3,"file":"drawer_end.js","sources":["../../../../src/surfaces/drawers/drawer_end/drawer_end.tsx"],"sourcesContent":["import { VStack, type VStackProps } from '../../../stacks/v_stack.js';\nimport classNames from 'classnames';\nimport React from 'react';\nimport styles from './drawer_end.module.css';\n\nexport interface DrawerEndProps extends Omit<VStackProps, 'as' | 'children'> {\n  children?: React.ReactNode;\n}\n\nexport const DrawerEnd = React.forwardRef<HTMLElement, DrawerEndProps>(function DrawerEnd(\n  { children, className, ...props }: DrawerEndProps,\n  ref\n) {\n  return (\n    <VStack\n      ref={ref}\n      as=\"section\"\n      className={classNames(styles.drawerEnd, className, 'drawerEnd')}\n      {...props}\n    >\n      {children}\n    </VStack>\n  );\n});\n"],"names":["DrawerEnd","React","children","className","props","ref","jsx","VStack","classNames","styles"],"mappings":";;;;sDASaA,IAAYC,EAAM,WAAwC,SACrE,EAAE,UAAAC,GAAU,WAAAC,GAAW,GAAGC,EAAA,GAC1BC,GACA;AACA,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAF;AAAA,MACA,IAAG;AAAA,MACH,WAAWG,EAAWC,EAAO,WAAWN,GAAW,WAAW;AAAA,MAC7D,GAAGC;AAAA,MAEH,UAAAF;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;"}
+{"version":3,"file":"drawer_end.js","sources":["../../../../src/surfaces/drawers/drawer_end/drawer_end.tsx"],"sourcesContent":["import { VStack, type VStackProps } from '../../../stacks/v_stack.js';\nimport { clsx } from 'clsx';\nimport React from 'react';\nimport styles from './drawer_end.module.css';\n\nexport interface DrawerEndProps extends Omit<VStackProps, 'as' | 'children'> {\n  children?: React.ReactNode;\n}\n\nexport const DrawerEnd = React.forwardRef<HTMLElement, DrawerEndProps>(function DrawerEnd(\n  { children, className, ...props }: DrawerEndProps,\n  ref\n) {\n  return (\n    <VStack\n      ref={ref}\n      as=\"section\"\n      className={clsx(styles.drawerEnd, className, 'drawerEnd')}\n      {...props}\n    >\n      {children}\n    </VStack>\n  );\n});\n"],"names":["DrawerEnd","React","children","className","props","ref","jsx","VStack","clsx","styles"],"mappings":";;;;sDASaA,IAAYC,EAAM,WAAwC,SACrE,EAAE,UAAAC,GAAU,WAAAC,GAAW,GAAGC,EAAA,GAC1BC,GACA;AACA,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAF;AAAA,MACA,IAAG;AAAA,MACH,WAAWG,EAAKC,EAAO,WAAWN,GAAW,WAAW;AAAA,MACvD,GAAGC;AAAA,MAEH,UAAAF;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;"}