@tcn/ui 0.3.0 → 0.3.2

package/dist/surfaces/panel/h_panel.js

@@ -1,9 +1,9 @@
 import { jsx as p } from "react/jsx-runtime";
-import i from "react";
+import u from "react";
 import { clsx as r } from "clsx";
-import { Box as u } from "../../stacks/box/box.js";
-import { HStack as P } from "../../stacks/h_stack.js";
-import '../../h_panel.css';const R = "_panel-stack_f1896f3", f = { "panel-stack": R }, B = i.forwardRef(function({
+import { Box as x } from "../../stacks/box/box.js";
+import { HStack as i } from "../../stacks/h_stack.js";
+import '../../h_panel.css';const P = "_panel-stack_f1896f3", f = { "panel-stack": P }, B = u.forwardRef(function({
   children: m,
   width: k,
   height: d,
@@ -13,13 +13,13 @@ import '../../h_panel.css';const R = "_panel-stack_f1896f3", f = { "panel-stack"
   maxHeight: e,
   hAlign: c,
   vAlign: o = "start",
-  className: s,
-  ...x
-}, l) {
+  className: l,
+  ..._
+}, s) {
   return /* @__PURE__ */ p(
-    u,
+    x,
     {
-      ref: l,
+      ref: s,
       width: k,
       height: d,
       minWidth: a,
@@ -28,10 +28,10 @@ import '../../h_panel.css';const R = "_panel-stack_f1896f3", f = { "panel-stack"
       maxHeight: e,
       "data-h-alignment": c,
       "data-v-alignment": o,
-      className: r(f.panel, s, "panel", "tcn-panel", "tcn-h-panel"),
-      ...x,
+      className: r(f.panel, l, "panel", "tcn-panel", "tcn-h-panel"),
+      ..._,
       children: /* @__PURE__ */ p(
-        P,
+        i,
         {
           as: "section",
           minWidth: a,
@@ -40,10 +40,10 @@ import '../../h_panel.css';const R = "_panel-stack_f1896f3", f = { "panel-stack"
           maxHeight: e,
           hAlign: c,
           vAlign: o,
-          ref: l,
+          ref: s,
           className: r(
             f["panel-stack"],
-            s,
+            l,
             "panel-stack",
             "tcn-panel-stack"
           ),

package/dist/surfaces/panel/v_panel.js

@@ -1,13 +1,13 @@
-import { jsx as a } from "react/jsx-runtime";
-import c from "react";
-import { Scaffold as e } from "../../layouts/scaffold/scaffold.js";
-import f from "clsx";
-const u = c.forwardRef(function({ children: r, className: o, ...t }, n) {
-  return /* @__PURE__ */ a(
-    e,
+import { jsx as e } from "react/jsx-runtime";
+import f from "react";
+import { Scaffold as n } from "../../layouts/scaffold/scaffold.js";
+import c from "clsx";
+const u = f.forwardRef(function({ children: r, className: o, ...t }, a) {
+  return /* @__PURE__ */ e(
+    n,
     {
-      ref: n,
-      className: f("tcn-surface", "tcn-panel", "tcn-v-panel", o),
+      ref: a,
+      className: c("tcn-surface", "tcn-panel", "tcn-v-panel", o),
       ...t,
       children: r
     }

package/dist/surfaces/pop_confirm/pop_confirm.js

@@ -17,21 +17,21 @@ import "../../layouts/footer/footer.js";
 import "../../layouts/header/header.js";
 import "../../layouts/utility_bar/utility_bar.js";
 import { PopperDismissal as s } from "../../overlay/popper/base/dismissal_decorator.js";
-const W = f.forwardRef(
-  function({ children: r, className: m, dismissals: i = [s.CLICK_AWAY], ...p }, t) {
+const S = f.forwardRef(
+  function({ children: r, className: m, dismissals: t = [s.CLICK_AWAY], ...i }, p) {
     return /* @__PURE__ */ o(
       n,
       {
-        ref: t,
+        ref: p,
         className: e(m, "tcn-pop-confirm"),
-        dismissals: i,
-        ...p,
+        dismissals: t,
+        ...i,
         children: /* @__PURE__ */ o(c, { width: "100%", height: "100%", children: r })
       }
     );
   }
 );
 export {
-  W as PopConfirm
+  S as PopConfirm
 };
 //# sourceMappingURL=pop_confirm.js.map

package/dist/surfaces/popconfirm/pop_confirm.js

@@ -1,13 +1,13 @@
-import { jsx as t } from "react/jsx-runtime";
-import f from "react";
-import { clsx as n } from "clsx";
-import { ElementPopper as e } from "../../overlay/popper/element_popper.js";
-const x = f.forwardRef(
-  function({ children: o, className: r, ...m }, p) {
-    return /* @__PURE__ */ t(e, { ref: p, className: n(r, "tcn-popconfirm"), ...m, children: o });
+import { jsx as f } from "react/jsx-runtime";
+import p from "react";
+import { clsx as e } from "clsx";
+import { ElementPopper as n } from "../../overlay/popper/element_popper.js";
+const u = p.forwardRef(
+  function({ children: o, className: r, ...m }, t) {
+    return /* @__PURE__ */ f(n, { ref: t, className: e(r, "tcn-popconfirm"), ...m, children: o });
   }
 );
 export {
-  x as PopConfirm
+  u as PopConfirm
 };
 //# sourceMappingURL=pop_confirm.js.map

package/dist/surfaces/popover/popover.js

@@ -42,7 +42,7 @@ function q({
       disableClickAway: h,
       open: c,
       onClose: f,
-      children: /* @__PURE__ */ o(w, { inline: !0, width: "auto", className: k(P, "popover"), ...j, children: v })
+      children: /* @__PURE__ */ o(w, { inline: !0, width: "auto", className: k(P, "tcn-popover"), ...j, children: v })
     }
   );
 }

package/dist/surfaces/popover/popover.js.map

@@ -1 +1 @@
-{"version":3,"file":"popover.js","sources":["../../../src/surfaces/popover/popover.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { VStack } from '../../stacks/v_stack.js';\nimport { Popper, type PopperProps } from '../../overlay/popper/legacy/popper.js';\nimport { VStackProps } from '../../stacks/v_stack.js';\n\nexport interface PopoverProps extends Omit<PopperProps, 'children'>, VStackProps {}\n\nexport function Popover({\n  anchorElement,\n  verticalAnchor,\n  verticalOrigin,\n  verticalOffset,\n  horizontalAnchor,\n  horizontalOrigin,\n  horizontalOffset,\n  open,\n  onClose,\n  restoreFocus,\n  veil,\n  onVeilClick,\n  clickAwayRefs,\n  isClickAwayException,\n  isScrollAwayException,\n  disableClickAway,\n  children,\n  className,\n  ...props\n}: PopoverProps) {\n  return (\n    <Popper\n      anchorElement={anchorElement}\n      verticalAnchor={verticalAnchor}\n      verticalOrigin={verticalOrigin}\n      verticalOffset={verticalOffset}\n      horizontalAnchor={horizontalAnchor}\n      horizontalOrigin={horizontalOrigin}\n      horizontalOffset={horizontalOffset}\n      restoreFocus={restoreFocus}\n      veil={veil}\n      onVeilClick={onVeilClick}\n      clickAwayRefs={clickAwayRefs}\n      isClickAwayException={isClickAwayException}\n      isScrollAwayException={isScrollAwayException}\n      disableClickAway={disableClickAway}\n      open={open}\n      onClose={onClose}\n    >\n      <VStack inline width=\"auto\" className={clsx(className, 'popover')} {...props}>\n        {children}\n      </VStack>\n    </Popper>\n  );\n}\n"],"names":["Popover","anchorElement","verticalAnchor","verticalOrigin","verticalOffset","horizontalAnchor","horizontalOrigin","horizontalOffset","open","onClose","restoreFocus","veil","onVeilClick","clickAwayRefs","isClickAwayException","isScrollAwayException","disableClickAway","children","className","props","jsx","Popper","VStack","clsx"],"mappings":";;;;AAOO,SAASA,EAAQ;AAAA,EACtB,eAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,MAAAC;AAAA,EACA,SAAAC;AAAA,EACA,cAAAC;AAAA,EACA,MAAAC;AAAA,EACA,aAAAC;AAAA,EACA,eAAAC;AAAA,EACA,sBAAAC;AAAA,EACA,uBAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,GAAGC;AACL,GAAiB;AACf,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,eAAApB;AAAA,MACA,gBAAAC;AAAA,MACA,gBAAAC;AAAA,MACA,gBAAAC;AAAA,MACA,kBAAAC;AAAA,MACA,kBAAAC;AAAA,MACA,kBAAAC;AAAA,MACA,cAAAG;AAAA,MACA,MAAAC;AAAA,MACA,aAAAC;AAAA,MACA,eAAAC;AAAA,MACA,sBAAAC;AAAA,MACA,uBAAAC;AAAA,MACA,kBAAAC;AAAA,MACA,MAAAR;AAAA,MACA,SAAAC;AAAA,MAEA,UAAA,gBAAAW,EAACE,GAAA,EAAO,QAAM,IAAC,OAAM,QAAO,WAAWC,EAAKL,GAAW,SAAS,GAAI,GAAGC,GACpE,UAAAF,EAAA,CACH;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"popover.js","sources":["../../../src/surfaces/popover/popover.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { VStack } from '../../stacks/v_stack.js';\nimport { Popper, type PopperProps } from '../../overlay/popper/legacy/popper.js';\nimport { VStackProps } from '../../stacks/v_stack.js';\n\nexport interface PopoverProps extends Omit<PopperProps, 'children'>, VStackProps {}\n\nexport function Popover({\n  anchorElement,\n  verticalAnchor,\n  verticalOrigin,\n  verticalOffset,\n  horizontalAnchor,\n  horizontalOrigin,\n  horizontalOffset,\n  open,\n  onClose,\n  restoreFocus,\n  veil,\n  onVeilClick,\n  clickAwayRefs,\n  isClickAwayException,\n  isScrollAwayException,\n  disableClickAway,\n  children,\n  className,\n  ...props\n}: PopoverProps) {\n  return (\n    <Popper\n      anchorElement={anchorElement}\n      verticalAnchor={verticalAnchor}\n      verticalOrigin={verticalOrigin}\n      verticalOffset={verticalOffset}\n      horizontalAnchor={horizontalAnchor}\n      horizontalOrigin={horizontalOrigin}\n      horizontalOffset={horizontalOffset}\n      restoreFocus={restoreFocus}\n      veil={veil}\n      onVeilClick={onVeilClick}\n      clickAwayRefs={clickAwayRefs}\n      isClickAwayException={isClickAwayException}\n      isScrollAwayException={isScrollAwayException}\n      disableClickAway={disableClickAway}\n      open={open}\n      onClose={onClose}\n    >\n      <VStack inline width=\"auto\" className={clsx(className, 'tcn-popover')} {...props}>\n        {children}\n      </VStack>\n    </Popper>\n  );\n}\n"],"names":["Popover","anchorElement","verticalAnchor","verticalOrigin","verticalOffset","horizontalAnchor","horizontalOrigin","horizontalOffset","open","onClose","restoreFocus","veil","onVeilClick","clickAwayRefs","isClickAwayException","isScrollAwayException","disableClickAway","children","className","props","jsx","Popper","VStack","clsx"],"mappings":";;;;AAOO,SAASA,EAAQ;AAAA,EACtB,eAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,MAAAC;AAAA,EACA,SAAAC;AAAA,EACA,cAAAC;AAAA,EACA,MAAAC;AAAA,EACA,aAAAC;AAAA,EACA,eAAAC;AAAA,EACA,sBAAAC;AAAA,EACA,uBAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,GAAGC;AACL,GAAiB;AACf,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,eAAApB;AAAA,MACA,gBAAAC;AAAA,MACA,gBAAAC;AAAA,MACA,gBAAAC;AAAA,MACA,kBAAAC;AAAA,MACA,kBAAAC;AAAA,MACA,kBAAAC;AAAA,MACA,cAAAG;AAAA,MACA,MAAAC;AAAA,MACA,aAAAC;AAAA,MACA,eAAAC;AAAA,MACA,sBAAAC;AAAA,MACA,uBAAAC;AAAA,MACA,kBAAAC;AAAA,MACA,MAAAR;AAAA,MACA,SAAAC;AAAA,MAEA,UAAA,gBAAAW,EAACE,GAAA,EAAO,QAAM,IAAC,OAAM,QAAO,WAAWC,EAAKL,GAAW,aAAa,GAAI,GAAGC,GACxE,UAAAF,EAAA,CACH;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/surfaces/tooltip/tooltip.js

@@ -1,9 +1,9 @@
 import { jsx as e, jsxs as f, Fragment as u } from "react/jsx-runtime";
-import { clsx as x } from "clsx";
-import R, { useRef as d, isValidElement as h, cloneElement as E } from "react";
-import { PreviewPopper as b } from "../../overlay/popper/preview_popper.js";
-import { HStack as j } from "../../stacks/h_stack.js";
-import '../../tooltip.css';const w = "_tooltip_b8c58d5", P = { tooltip: w }, F = R.forwardRef(function({
+import { clsx as d } from "clsx";
+import x, { useRef as R, isValidElement as _, cloneElement as h } from "react";
+import { PreviewPopper as E } from "../../overlay/popper/preview_popper.js";
+import { HStack as b } from "../../stacks/h_stack.js";
+import '../../tooltip.css';const j = "_tooltip_b8c58d5", w = { tooltip: j }, F = x.forwardRef(function({
   children: o,
   className: r,
   verticalAnchor: n = "top",
@@ -13,11 +13,11 @@ import '../../tooltip.css';const w = "_tooltip_b8c58d5", P = { tooltip: w }, F =
   label: m,
   ...p
 }, i) {
-  const t = d(null), a = h(o) ? E(o, { ref: t }) : /* @__PURE__ */ e(j, { as: "span", ref: t, children: o });
+  const t = R(null), a = _(o) ? h(o, { ref: t }) : /* @__PURE__ */ e(b, { as: "span", ref: t, children: o });
   return /* @__PURE__ */ f(u, { children: [
     a,
     /* @__PURE__ */ e(
-      b,
+      E,
       {
         ref: i,
         anchorElement: t,
@@ -25,7 +25,7 @@ import '../../tooltip.css';const w = "_tooltip_b8c58d5", P = { tooltip: w }, F =
         verticalOrigin: c,
         horizontalAnchor: s,
         horizontalOrigin: l,
-        className: x(r, P.tooltip, "tcn-surface", "tcn-tooltip"),
+        className: d(r, w.tooltip, "tcn-surface", "tcn-tooltip"),
         ...p,
         children: m
       }

package/dist/surfaces/window/window.js

@@ -1,23 +1,23 @@
 import { jsx as o } from "react/jsx-runtime";
-import { clsx as m } from "clsx";
-import w from "react";
-import { Frame as d } from "../../overlay/frame/frame.js";
-import { Scaffold as s } from "../../layouts/scaffold/scaffold.js";
-import '../../window.css';const a = "_window_7610fdb", l = { window: a }, _ = w.forwardRef(function({ children: t, className: r, isOpen: i, draggable: n = !0, veil: f = !1, ...c }, e) {
+import { clsx as d } from "clsx";
+import m from "react";
+import { Frame as w } from "../../overlay/frame/frame.js";
+import { Scaffold as a } from "../../layouts/scaffold/scaffold.js";
+import '../../window.css';const s = "_window_7610fdb", l = { window: s }, W = m.forwardRef(function({ children: t, className: r, isOpen: i, draggable: n = !0, veil: f = !1, ...e }, c) {
   return /* @__PURE__ */ o(
-    d,
+    w,
     {
       isOpen: i,
       draggable: n,
       veil: f,
-      className: m(l.window, "tcn-surface", "tcn-window", r),
+      className: d(l.window, "tcn-surface", "tcn-window", r),
       width: "auto",
       height: "auto",
-      children: /* @__PURE__ */ o(s, { ref: e, ...c, children: t })
+      children: /* @__PURE__ */ o(a, { ref: c, ...e, children: t })
     }
   );
 });
 export {
-  _ as Window
+  W as Window
 };
 //# sourceMappingURL=window.js.map

package/dist/switch.css

@@ -1 +1 @@
-._switch-wrapper_db1838e{position:relative;display:inline-block;width:calc(36px * var(--scalar, 1));height:calc(18px * var(--scalar, 1));border-radius:13px;cursor:pointer;box-sizing:border-box;background-color:#aaa;border:1px solid #aaa;transition:background-color .2s ease-out,border-color .2s ease-out}._switch-wrapper_db1838e[data-focused=true][data-is-checked=false],._switch-wrapper_db1838e[data-focused=true][data-is-checked=true]{outline:3px solid color-mix(in srgb,var(--accent-color) 40%,transparent)}._switch_bf6748b{-webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important;outline:0!important;height:100%!important;width:100%!important;margin:0;-webkit-tap-highlight-color:transparent}._switch-wrapper_db1838e[data-is-disabled=true]{cursor:not-allowed}._switch-wrapper_db1838e[data-is-disabled=true]{background-color:#d3d3d3;border-color:#d3d3d3}._switch-wrapper_db1838e[data-is-checked=true][data-is-disabled=false]{background-color:var(--accent-color);border-color:var(--accent-color)}._switch_bf6748b:after{content:"";position:absolute;top:0;transition:transform .2s ease-out;width:calc(16px * var(--scalar, 1));height:calc(16px * var(--scalar, 1));border-radius:12px;background-color:var(--surface, #fff);box-sizing:border-box}._switch-wrapper_db1838e[data-is-disabled=true]>._switch_bf6748b:after,._switch-wrapper_db1838e[data-is-disabled=true]>._switch_bf6748b,._switch-wrapper_db1838e[data-is-disabled=true]{cursor:not-allowed}._switch-wrapper_db1838e[data-is-disabled=false]>._switch_bf6748b:after,._switch-wrapper_db1838e[data-is-disabled=false]>._switch_bf6748b,._switch-wrapper_db1838e[data-is-disabled=false]{cursor:pointer}._switch_bf6748b:dir(ltr):after{transform:translate(0);left:0}._switch_bf6748b:dir(rtl):after{transform:translate(0);right:0}._switch-wrapper_db1838e[data-is-checked=true] ._switch_bf6748b:dir(ltr):after{transform:translate(112%)}._switch-wrapper_db1838e[data-is-checked=true] ._switch_bf6748b:dir(rtl):after{transform:translate(-112%)}._switch-icon_d615789{position:absolute;display:inline-block;color:#fff;top:50%;left:calc(3px * var(--scalar, 1) - 1px);height:calc(16px * var(--scalar, 1) - 2px);width:calc(16px * var(--scalar, 1) - 2px);pointer-events:none;translate:0 -50%}._switch-icon_d615789[data-is-checked=false]:dir(ltr),._switch-icon_d615789[data-is-checked=true]:dir(rtl){translate:calc(16px * var(--scalar, 1)) -50%}
+@layer tcn-system{:where(._switch-wrapper_db1838e){position:relative;display:inline-block;width:calc(36px * var(--scalar, 1));height:calc(18px * var(--scalar, 1));border-radius:13px;cursor:pointer;box-sizing:border-box;background-color:#aaa;border:1px solid #aaa;transition:background-color .2s ease-out,border-color .2s ease-out}:where(._switch-wrapper_db1838e[data-focused=true][data-is-checked=false]),:where(._switch-wrapper_db1838e[data-focused=true][data-is-checked=true]){outline:3px solid color-mix(in srgb,var(--accent-color) 40%,transparent)}:where(._switch_bf6748b){-webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important;outline:0!important;height:100%!important;width:100%!important;margin:0;-webkit-tap-highlight-color:transparent}:where(._switch-wrapper_db1838e[data-is-disabled=true]){cursor:not-allowed}:where(._switch-wrapper_db1838e[data-is-disabled=true]){background-color:#d3d3d3;border-color:#d3d3d3}:where(._switch-wrapper_db1838e[data-is-checked=true][data-is-disabled=false]){background-color:var(--accent-color);border-color:var(--accent-color)}:where(._switch_bf6748b):after{content:"";position:absolute;top:0;transition:transform .2s ease-out;width:calc(16px * var(--scalar, 1));height:calc(16px * var(--scalar, 1));border-radius:12px;background-color:var(--surface, #fff);box-sizing:border-box}:where(._switch-wrapper_db1838e[data-is-disabled=true]>._switch_bf6748b):after,:where(._switch-wrapper_db1838e[data-is-disabled=true]>._switch_bf6748b),:where(._switch-wrapper_db1838e[data-is-disabled=true]){cursor:not-allowed}:where(._switch-wrapper_db1838e[data-is-disabled=false]>._switch_bf6748b):after,:where(._switch-wrapper_db1838e[data-is-disabled=false]>._switch_bf6748b),:where(._switch-wrapper_db1838e[data-is-disabled=false]){cursor:pointer}:where(._switch_bf6748b:dir(ltr)):after{transform:translate(0);left:0}:where(._switch_bf6748b:dir(rtl)):after{transform:translate(0);right:0}:where(._switch-wrapper_db1838e[data-is-checked=true]>._switch_bf6748b:dir(ltr)):after{transform:translate(112%)}:where(._switch-wrapper_db1838e[data-is-checked=true]>._switch_bf6748b:dir(rtl)):after{transform:translate(-112%)}:where(._switch-icon_d615789){position:absolute;display:inline-block;color:#fff;top:50%;left:calc(3px * var(--scalar, 1) - 1px);height:calc(16px * var(--scalar, 1) - 2px);width:calc(16px * var(--scalar, 1) - 2px);pointer-events:none;translate:0 -50%}:where(._switch-icon_d615789[data-is-checked=false]):dir(ltr),:where(._switch-icon_d615789[data-is-checked=true]):dir(rtl){translate:calc(16px * var(--scalar, 1)) -50%}}