@tcn/ui 0.12.5 → 0.12.6

package/dist/inputs/textarea/textarea.js

@@ -1,14 +1,14 @@
-import { jsx as n } from "react/jsx-runtime";
-import { clsx as x } from "clsx";
+import { jsx as x } from "react/jsx-runtime";
+import { clsx as l } from "clsx";
 import f from "react";
-import '../../textarea.css';const d = "_textarea_8286394", i = { textarea: d }, b = f.forwardRef(function({ className: r, width: o, height: s, style: c, onChange: t, ...e }, l) {
-  return /* @__PURE__ */ n(
+import '../../textarea.css';const d = "_textarea_8286394", i = { textarea: d }, T = f.forwardRef(function({ className: r, width: s, height: o, style: c, onChange: t, ...e }, n) {
+  return /* @__PURE__ */ x(
     "textarea",
     {
-      style: { width: o, height: s, ...c },
-      className: x(r, i.textarea, "tcn-textarea", "tcn-control"),
+      style: { width: s, height: o, ...c },
+      className: l(r, i.textarea, "tcn-textarea", "tcn-entry"),
       "data-is-disabled": e.disabled || !1,
-      ref: l,
+      ref: n,
       onChange: (a) => {
         t && t(a.currentTarget.value, a);
       },
@@ -17,6 +17,6 @@ import '../../textarea.css';const d = "_textarea_8286394", i = { textarea: d },
   );
 });
 export {
-  b as Textarea
+  T as Textarea
 };
 //# sourceMappingURL=textarea.js.map

package/dist/inputs/textarea/textarea.js.map

@@ -1 +1 @@
-{"version":3,"file":"textarea.js","sources":["../../../src/inputs/textarea/textarea.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport React from 'react';\nimport { TextareaHTMLAttributes } from 'react';\nimport styles from './textarea.module.css';\n\nexport interface TextareaProps\n  extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'onChange'> {\n  value?: string;\n  width?: string;\n  height?: string;\n  disabled?: boolean;\n  placeholder?: string;\n  onChange?: (value: string, event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n}\n\nexport const Textarea = React.forwardRef(function Textarea(\n  { className, width, height, style, onChange, ...props }: TextareaProps,\n  ref: React.Ref<HTMLTextAreaElement>\n) {\n  return (\n    <textarea\n      style={{ width, height, ...style }}\n      className={clsx(className, styles.textarea, 'tcn-textarea', 'tcn-control')}\n      data-is-disabled={props.disabled || false}\n      ref={ref}\n      onChange={e => {\n        onChange && onChange(e.currentTarget.value, e);\n      }}\n      {...props}\n    />\n  );\n});\n"],"names":["Textarea","React","className","width","height","style","onChange","props","ref","jsx","clsx","styles","e"],"mappings":";;;oDAeaA,IAAWC,EAAM,WAAW,SACvC,EAAE,WAAAC,GAAW,OAAAC,GAAO,QAAAC,GAAQ,OAAAC,GAAO,UAAAC,GAAU,GAAGC,EAAA,GAChDC,GACA;AACA,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAO,EAAE,OAAAN,GAAO,QAAAC,GAAQ,GAAGC,EAAA;AAAA,MAC3B,WAAWK,EAAKR,GAAWS,EAAO,UAAU,gBAAgB,aAAa;AAAA,MACzE,oBAAkBJ,EAAM,YAAY;AAAA,MACpC,KAAAC;AAAA,MACA,UAAU,CAAAI,MAAK;AACb,QAAAN,KAAYA,EAASM,EAAE,cAAc,OAAOA,CAAC;AAAA,MAC/C;AAAA,MACC,GAAGL;AAAA,IAAA;AAAA,EAAA;AAGV,CAAC;"}
+{"version":3,"file":"textarea.js","sources":["../../../src/inputs/textarea/textarea.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport React from 'react';\nimport { TextareaHTMLAttributes } from 'react';\nimport styles from './textarea.module.css';\n\nexport interface TextareaProps\n  extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'onChange'> {\n  value?: string;\n  width?: string;\n  height?: string;\n  disabled?: boolean;\n  placeholder?: string;\n  onChange?: (value: string, event: React.ChangeEvent<HTMLTextAreaElement>) => void;\n}\n\nexport const Textarea = React.forwardRef(function Textarea(\n  { className, width, height, style, onChange, ...props }: TextareaProps,\n  ref: React.Ref<HTMLTextAreaElement>\n) {\n  return (\n    <textarea\n      style={{ width, height, ...style }}\n      className={clsx(className, styles.textarea, 'tcn-textarea', 'tcn-entry')}\n      data-is-disabled={props.disabled || false}\n      ref={ref}\n      onChange={e => {\n        onChange && onChange(e.currentTarget.value, e);\n      }}\n      {...props}\n    />\n  );\n});\n"],"names":["Textarea","React","className","width","height","style","onChange","props","ref","jsx","clsx","styles","e"],"mappings":";;;oDAeaA,IAAWC,EAAM,WAAW,SACvC,EAAE,WAAAC,GAAW,OAAAC,GAAO,QAAAC,GAAQ,OAAAC,GAAO,UAAAC,GAAU,GAAGC,EAAA,GAChDC,GACA;AACA,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,OAAO,EAAE,OAAAN,GAAO,QAAAC,GAAQ,GAAGC,EAAA;AAAA,MAC3B,WAAWK,EAAKR,GAAWS,EAAO,UAAU,gBAAgB,WAAW;AAAA,MACvE,oBAAkBJ,EAAM,YAAY;AAAA,MACpC,KAAAC;AAAA,MACA,UAAU,CAAAI,MAAK;AACb,QAAAN,KAAYA,EAASM,EAAE,cAAc,OAAOA,CAAC;AAAA,MAC/C;AAAA,MACC,GAAGL;AAAA,IAAA;AAAA,EAAA;AAGV,CAAC;"}

package/dist/inputs/unit_input/unit_input.js

@@ -10,10 +10,10 @@ import "../../utils/dnd/context.js";
 import "../../draggable.module-BgelQsuJ.js";
 import { Input as v } from "../input/input.js";
 import { Select as w } from "../select/select.js";
-import { InputGroup as h } from "../input_group/input_group.js";
+import { ControlSet as h } from "../control_set/control_set.js";
 import '../../unit_input.css';const j = "_unit-input_4bd8bc8", k = "_unit-input-flex-box_8db2f9b", F = "_unit-input-number_c95f85a", H = "_unit-input-select_1bbbad9", l = { "unit-input": j, "unit-input-flex-box": k, "unit-input-number": F, "unit-input-select": H };
-function U(p) {
-  return p.replace(/[^.\d-]/g, "").replace(/(?!^)-/g, "").replace(/(\..*?)\.+/g, "$1");
+function U(s) {
+  return s.replace(/[^.\d-]/g, "").replace(/(?!^)-/g, "").replace(/(\..*?)\.+/g, "$1");
 }
 const Q = y.forwardRef(function({
   value: A,
@@ -22,27 +22,27 @@ const Q = y.forwardRef(function({
   onChange: t,
   inputRef: b,
   unitRef: x,
-  disabled: s,
+  disabled: p,
   ...R
-}, I) {
-  const c = E(null), N = V(b, c);
-  function _(u, e) {
-    if (e == null)
+}, N) {
+  const c = E(null), _ = V(b, c);
+  function I(e, u) {
+    if (u == null)
       return;
-    const n = e.currentTarget, a = n.selectionStart || 0, i = U(u), f = Number(i);
-    n.value = i, i.length < u.length && n.setSelectionRange(a - 1, a - 1), i === "" ? t && t(null, r || "") : isNaN(f) || t && t(f, r || "");
+    const n = u.currentTarget, a = n.selectionStart || 0, i = U(e), f = Number(i);
+    n.value = i, i.length < e.length && n.setSelectionRange(a - 1, a - 1), i === "" ? t && t(null, r || "") : isNaN(f) || t && t(f, r || "");
   }
-  function S(u) {
-    const e = c.current;
-    if (e == null)
+  function S(e) {
+    const u = c.current;
+    if (u == null)
       return;
-    const n = Number(e.value);
-    isNaN(n) ? t && t(null, u) : t && t(n, u);
+    const n = Number(u.value);
+    isNaN(n) ? t && t(null, e) : t && t(n, e);
   }
   return /* @__PURE__ */ g(
     h,
     {
-      ref: I,
+      ref: N,
       className: o(l["unit-input"], "tcn-unit-input"),
       height: "auto",
       ...R,
@@ -52,9 +52,9 @@ const Q = y.forwardRef(function({
           {
             width: "flex",
             className: o(l["unit-input-number"], "tcn-unit-input-number"),
-            ref: N,
-            onChange: _,
-            disabled: s,
+            ref: _,
+            onChange: I,
+            disabled: p,
             style: {
               borderEndEndRadius: 0,
               borderStartEndRadius: 0,
@@ -70,7 +70,7 @@ const Q = y.forwardRef(function({
             width: "auto",
             value: r,
             onChange: S,
-            disabled: s,
+            disabled: p,
             style: { borderStartStartRadius: 0, borderEndStartRadius: 0 },
             children: d
           }

package/dist/inputs/unit_input/unit_input.js.map

@@ -1 +1 @@
-{"version":3,"file":"unit_input.js","sources":["../../../src/inputs/unit_input/unit_input.tsx"],"sourcesContent":["import React, { useRef } from 'react';\nimport { clsx } from 'clsx';\nimport { useForkRef } from '../../utils/index.js';\nimport { type HStackProps } from '../../stacks/h_stack.js';\nimport { Input } from '../input/input.js';\nimport { Select } from '../select/select.js';\nimport { OptionProps } from '../options/option.js';\nimport styles from './unit_input.module.css';\n\nimport { InputGroup } from '../input_group/input_group.js';\n\nfunction getDisplayValue(value: string) {\n  return value\n    .replace(/[^.\\d-]/g, '') // Remove invalid characters\n    .replace(/(?!^)-/g, '') // Ensure `-` only at the start\n    .replace(/(\\..*?)\\.+/g, '$1'); // Allow only one dot\n}\n\nexport interface UnitInputProps extends Omit<HStackProps, 'onChange' | 'children'> {\n  value?: number | null;\n  unit?: string;\n  children: React.ReactElement<OptionProps> | React.ReactElement<OptionProps>[];\n  onChange?: (value: number | null, unit: string) => void;\n  inputRef?: React.Ref<HTMLInputElement>;\n  unitRef?: React.Ref<HTMLButtonElement>;\n  disabled?: boolean;\n}\n\nexport const UnitInput = React.forwardRef(function UnitInput(\n  {\n    value,\n    unit,\n    children,\n    onChange,\n    inputRef,\n    unitRef,\n    disabled,\n    ...props\n  }: UnitInputProps,\n  ref: React.Ref<HTMLElement>\n) {\n  const internalInputRef = useRef<HTMLInputElement>(null);\n  const forkedInputRef = useForkRef(inputRef, internalInputRef);\n\n  function valueHandler(value: string, event?: React.ChangeEvent<HTMLInputElement>) {\n    if (event == null) {\n      return;\n    }\n\n    const input = event.currentTarget;\n    const cursorPosition = input.selectionStart || 0;\n    const displayValue = getDisplayValue(value);\n    const potentialValue = Number(displayValue);\n\n    input.value = displayValue;\n\n    if (displayValue.length < value.length) {\n      input.setSelectionRange(cursorPosition - 1, cursorPosition - 1);\n    }\n\n    if (displayValue === '') {\n      onChange && onChange(null, unit || '');\n    } else if (!isNaN(potentialValue)) {\n      onChange && onChange(potentialValue, unit || '');\n    }\n  }\n\n  function unitHandler(unit: string) {\n    const input = internalInputRef.current;\n    if (input == null) {\n      return;\n    }\n\n    const potentialValue = Number(input.value);\n    if (isNaN(potentialValue)) {\n      onChange && onChange(null, unit);\n    } else {\n      onChange && onChange(potentialValue, unit);\n    }\n  }\n\n  return (\n    <InputGroup\n      ref={ref}\n      className={clsx(styles['unit-input'], 'tcn-unit-input')}\n      height=\"auto\"\n      {...props}\n    >\n      <Input\n        width=\"flex\"\n        className={clsx(styles['unit-input-number'], 'tcn-unit-input-number')}\n        ref={forkedInputRef}\n        onChange={valueHandler}\n        disabled={disabled}\n        style={{\n          borderEndEndRadius: 0,\n          borderStartEndRadius: 0,\n          textAlign: 'start',\n        }}\n      />\n\n      <Select\n        className={clsx(styles['unit-input-select'], 'tcn-unit-input-select')}\n        ref={unitRef}\n        width=\"auto\"\n        value={unit}\n        onChange={unitHandler}\n        disabled={disabled}\n        style={{ borderStartStartRadius: 0, borderEndStartRadius: 0 }}\n      >\n        {children}\n      </Select>\n    </InputGroup>\n  );\n});\n"],"names":["getDisplayValue","value","UnitInput","React","unit","children","onChange","inputRef","unitRef","disabled","props","ref","internalInputRef","useRef","forkedInputRef","useForkRef","valueHandler","event","input","cursorPosition","displayValue","potentialValue","unitHandler","jsxs","InputGroup","clsx","styles","jsx","Input","Select"],"mappings":";;;;;;;;;;;;;;AAWA,SAASA,EAAgBC,GAAe;AACtC,SAAOA,EACJ,QAAQ,YAAY,EAAE,EACtB,QAAQ,WAAW,EAAE,EACrB,QAAQ,eAAe,IAAI;AAChC;AAYO,MAAMC,IAAYC,EAAM,WAAW,SACxC;AAAA,EACE,OAAAF;AAAA,EACA,MAAAG;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,QAAMC,IAAmBC,EAAyB,IAAI,GAChDC,IAAiBC,EAAWR,GAAUK,CAAgB;AAE5D,WAASI,EAAaf,GAAegB,GAA6C;AAChF,QAAIA,KAAS;AACX;AAGF,UAAMC,IAAQD,EAAM,eACdE,IAAiBD,EAAM,kBAAkB,GACzCE,IAAepB,EAAgBC,CAAK,GACpCoB,IAAiB,OAAOD,CAAY;AAE1C,IAAAF,EAAM,QAAQE,GAEVA,EAAa,SAASnB,EAAM,UAC9BiB,EAAM,kBAAkBC,IAAiB,GAAGA,IAAiB,CAAC,GAG5DC,MAAiB,KACnBd,KAAYA,EAAS,MAAMF,KAAQ,EAAE,IAC3B,MAAMiB,CAAc,KAC9Bf,KAAYA,EAASe,GAAgBjB,KAAQ,EAAE;AAAA,EAEnD;AAEA,WAASkB,EAAYlB,GAAc;AACjC,UAAMc,IAAQN,EAAiB;AAC/B,QAAIM,KAAS;AACX;AAGF,UAAMG,IAAiB,OAAOH,EAAM,KAAK;AACzC,IAAI,MAAMG,CAAc,IACtBf,KAAYA,EAAS,MAAMF,CAAI,IAE/BE,KAAYA,EAASe,GAAgBjB,CAAI;AAAA,EAE7C;AAEA,SACE,gBAAAmB;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAb;AAAA,MACA,WAAWc,EAAKC,EAAO,YAAY,GAAG,gBAAgB;AAAA,MACtD,QAAO;AAAA,MACN,GAAGhB;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAiB;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,OAAM;AAAA,YACN,WAAWH,EAAKC,EAAO,mBAAmB,GAAG,uBAAuB;AAAA,YACpE,KAAKZ;AAAA,YACL,UAAUE;AAAA,YACV,UAAAP;AAAA,YACA,OAAO;AAAA,cACL,oBAAoB;AAAA,cACpB,sBAAsB;AAAA,cACtB,WAAW;AAAA,YAAA;AAAA,UACb;AAAA,QAAA;AAAA,QAGF,gBAAAkB;AAAA,UAACE;AAAA,UAAA;AAAA,YACC,WAAWJ,EAAKC,EAAO,mBAAmB,GAAG,uBAAuB;AAAA,YACpE,KAAKlB;AAAA,YACL,OAAM;AAAA,YACN,OAAOJ;AAAA,YACP,UAAUkB;AAAA,YACV,UAAAb;AAAA,YACA,OAAO,EAAE,wBAAwB,GAAG,sBAAsB,EAAA;AAAA,YAEzD,UAAAJ;AAAA,UAAA;AAAA,QAAA;AAAA,MACH;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;"}
+{"version":3,"file":"unit_input.js","sources":["../../../src/inputs/unit_input/unit_input.tsx"],"sourcesContent":["import React, { useRef } from 'react';\nimport { clsx } from 'clsx';\nimport { useForkRef } from '../../utils/index.js';\nimport { type HStackProps } from '../../stacks/h_stack.js';\nimport { Input } from '../input/input.js';\nimport { Select } from '../select/select.js';\nimport { OptionProps } from '../options/option.js';\nimport styles from './unit_input.module.css';\n\nimport { ControlSet } from '../control_set/control_set.js';\n\nfunction getDisplayValue(value: string) {\n  return value\n    .replace(/[^.\\d-]/g, '') // Remove invalid characters\n    .replace(/(?!^)-/g, '') // Ensure `-` only at the start\n    .replace(/(\\..*?)\\.+/g, '$1'); // Allow only one dot\n}\n\nexport interface UnitInputProps extends Omit<HStackProps, 'onChange' | 'children'> {\n  value?: number | null;\n  unit?: string;\n  children: React.ReactElement<OptionProps> | React.ReactElement<OptionProps>[];\n  onChange?: (value: number | null, unit: string) => void;\n  inputRef?: React.Ref<HTMLInputElement>;\n  unitRef?: React.Ref<HTMLButtonElement>;\n  disabled?: boolean;\n}\n\nexport const UnitInput = React.forwardRef(function UnitInput(\n  {\n    value,\n    unit,\n    children,\n    onChange,\n    inputRef,\n    unitRef,\n    disabled,\n    ...props\n  }: UnitInputProps,\n  ref: React.Ref<HTMLElement>\n) {\n  const internalInputRef = useRef<HTMLInputElement>(null);\n  const forkedInputRef = useForkRef(inputRef, internalInputRef);\n\n  function valueHandler(value: string, event?: React.ChangeEvent<HTMLInputElement>) {\n    if (event == null) {\n      return;\n    }\n\n    const input = event.currentTarget;\n    const cursorPosition = input.selectionStart || 0;\n    const displayValue = getDisplayValue(value);\n    const potentialValue = Number(displayValue);\n\n    input.value = displayValue;\n\n    if (displayValue.length < value.length) {\n      input.setSelectionRange(cursorPosition - 1, cursorPosition - 1);\n    }\n\n    if (displayValue === '') {\n      onChange && onChange(null, unit || '');\n    } else if (!isNaN(potentialValue)) {\n      onChange && onChange(potentialValue, unit || '');\n    }\n  }\n\n  function unitHandler(unit: string) {\n    const input = internalInputRef.current;\n    if (input == null) {\n      return;\n    }\n\n    const potentialValue = Number(input.value);\n    if (isNaN(potentialValue)) {\n      onChange && onChange(null, unit);\n    } else {\n      onChange && onChange(potentialValue, unit);\n    }\n  }\n\n  return (\n    <ControlSet\n      ref={ref}\n      className={clsx(styles['unit-input'], 'tcn-unit-input')}\n      height=\"auto\"\n      {...props}\n    >\n      <Input\n        width=\"flex\"\n        className={clsx(styles['unit-input-number'], 'tcn-unit-input-number')}\n        ref={forkedInputRef}\n        onChange={valueHandler}\n        disabled={disabled}\n        style={{\n          borderEndEndRadius: 0,\n          borderStartEndRadius: 0,\n          textAlign: 'start',\n        }}\n      />\n\n      <Select\n        className={clsx(styles['unit-input-select'], 'tcn-unit-input-select')}\n        ref={unitRef}\n        width=\"auto\"\n        value={unit}\n        onChange={unitHandler}\n        disabled={disabled}\n        style={{ borderStartStartRadius: 0, borderEndStartRadius: 0 }}\n      >\n        {children}\n      </Select>\n    </ControlSet>\n  );\n});\n"],"names":["getDisplayValue","value","UnitInput","React","unit","children","onChange","inputRef","unitRef","disabled","props","ref","internalInputRef","useRef","forkedInputRef","useForkRef","valueHandler","event","input","cursorPosition","displayValue","potentialValue","unitHandler","jsxs","ControlSet","clsx","styles","jsx","Input","Select"],"mappings":";;;;;;;;;;;;;;AAWA,SAASA,EAAgBC,GAAe;AACtC,SAAOA,EACJ,QAAQ,YAAY,EAAE,EACtB,QAAQ,WAAW,EAAE,EACrB,QAAQ,eAAe,IAAI;AAChC;AAYO,MAAMC,IAAYC,EAAM,WAAW,SACxC;AAAA,EACE,OAAAF;AAAA,EACA,MAAAG;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,QAAMC,IAAmBC,EAAyB,IAAI,GAChDC,IAAiBC,EAAWR,GAAUK,CAAgB;AAE5D,WAASI,EAAaf,GAAegB,GAA6C;AAChF,QAAIA,KAAS;AACX;AAGF,UAAMC,IAAQD,EAAM,eACdE,IAAiBD,EAAM,kBAAkB,GACzCE,IAAepB,EAAgBC,CAAK,GACpCoB,IAAiB,OAAOD,CAAY;AAE1C,IAAAF,EAAM,QAAQE,GAEVA,EAAa,SAASnB,EAAM,UAC9BiB,EAAM,kBAAkBC,IAAiB,GAAGA,IAAiB,CAAC,GAG5DC,MAAiB,KACnBd,KAAYA,EAAS,MAAMF,KAAQ,EAAE,IAC3B,MAAMiB,CAAc,KAC9Bf,KAAYA,EAASe,GAAgBjB,KAAQ,EAAE;AAAA,EAEnD;AAEA,WAASkB,EAAYlB,GAAc;AACjC,UAAMc,IAAQN,EAAiB;AAC/B,QAAIM,KAAS;AACX;AAGF,UAAMG,IAAiB,OAAOH,EAAM,KAAK;AACzC,IAAI,MAAMG,CAAc,IACtBf,KAAYA,EAAS,MAAMF,CAAI,IAE/BE,KAAYA,EAASe,GAAgBjB,CAAI;AAAA,EAE7C;AAEA,SACE,gBAAAmB;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAb;AAAA,MACA,WAAWc,EAAKC,EAAO,YAAY,GAAG,gBAAgB;AAAA,MACtD,QAAO;AAAA,MACN,GAAGhB;AAAA,MAEJ,UAAA;AAAA,QAAA,gBAAAiB;AAAA,UAACC;AAAA,UAAA;AAAA,YACC,OAAM;AAAA,YACN,WAAWH,EAAKC,EAAO,mBAAmB,GAAG,uBAAuB;AAAA,YACpE,KAAKZ;AAAA,YACL,UAAUE;AAAA,YACV,UAAAP;AAAA,YACA,OAAO;AAAA,cACL,oBAAoB;AAAA,cACpB,sBAAsB;AAAA,cACtB,WAAW;AAAA,YAAA;AAAA,UACb;AAAA,QAAA;AAAA,QAGF,gBAAAkB;AAAA,UAACE;AAAA,UAAA;AAAA,YACC,WAAWJ,EAAKC,EAAO,mBAAmB,GAAG,uBAAuB;AAAA,YACpE,KAAKlB;AAAA,YACL,OAAM;AAAA,YACN,OAAOJ;AAAA,YACP,UAAUkB;AAAA,YACV,UAAAb;AAAA,YACA,OAAO,EAAE,wBAAwB,GAAG,sBAAsB,EAAA;AAAA,YAEzD,UAAAJ;AAAA,UAAA;AAAA,QAAA;AAAA,MACH;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;"}

package/dist/overlay/frame/frame.d.ts

@@ -6,8 +6,8 @@ export interface FrameOwnProps {
     veil?: boolean;
     resizable?: boolean;
 }
-export type FrameProps = Omit<BoxProps, 'enableResizeOnLeft' | 'enableResizeOnRight' | 'enableResizeOnTop' | 'enableResizeOnBottom'> & FrameOwnProps;
-export declare const Frame: React.ForwardRefExoticComponent<Omit<BoxProps<HTMLElement>, "enableResizeOnTop" | "enableResizeOnBottom" | "enableResizeOnLeft" | "enableResizeOnRight"> & FrameOwnProps & React.RefAttributes<HTMLElement>>;
+export type FrameProps = BoxProps & FrameOwnProps;
+export declare const Frame: React.ForwardRefExoticComponent<BoxProps<HTMLElement> & FrameOwnProps & React.RefAttributes<HTMLElement>>;
 interface FrameDialogProps extends BoxProps {
 }
 export declare const FrameDialog: React.ForwardRefExoticComponent<FrameDialogProps & React.RefAttributes<HTMLElement>>;

package/dist/overlay/frame/frame.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"frame.d.ts","sourceRoot":"","sources":["../../../src/overlay/frame/frame.tsx"],"names":[],"mappings":"AACA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAE3C,OAAO,EAGL,KAAK,QAAQ,EAGd,MAAM,uBAAuB,CAAC;AAO/B,MAAM,WAAW,aAAa;IAC5B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,MAAM,UAAU,GAAG,IAAI,CAC3B,QAAQ,EACN,oBAAoB,GACpB,qBAAqB,GACrB,mBAAmB,GACnB,sBAAsB,CACzB,GACC,aAAa,CAAC;AAEhB,eAAO,MAAM,KAAK,8MAqChB,CAAC;AACH,UAAU,gBAAiB,SAAQ,QAAQ;CAAG;AAE9C,eAAO,MAAM,WAAW,sFAkEvB,CAAC"}
+{"version":3,"file":"frame.d.ts","sourceRoot":"","sources":["../../../src/overlay/frame/frame.tsx"],"names":[],"mappings":"AACA,OAAO,KAAsB,MAAM,OAAO,CAAC;AAE3C,OAAO,EAGL,KAAK,QAAQ,EAGd,MAAM,uBAAuB,CAAC;AAO/B,MAAM,WAAW,aAAa;IAC5B,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,MAAM,MAAM,UAAU,GAAG,QAAQ,GAAG,aAAa,CAAC;AAElD,eAAO,MAAM,KAAK,2GAyChB,CAAC;AACH,UAAU,gBAAiB,SAAQ,QAAQ;CAAG;AAE9C,eAAO,MAAM,WAAW,sFAkEvB,CAAC"}

package/dist/overlay/frame/frame.js

@@ -1,7 +1,7 @@
-import { jsx as e } from "react/jsx-runtime";
-import { clsx as O } from "clsx";
-import h, { useCallback as _ } from "react";
-import { flushSync as R } from "react-dom";
+import { jsx as i } from "react/jsx-runtime";
+import { clsx as F } from "clsx";
+import R, { useCallback as _ } from "react";
+import { flushSync as p } from "react-dom";
 import { Box as k } from "../../stacks/box/box.js";
 import "../../stacks/h_collapsible_box.js";
 import "../../stacks/h_stack.js";
@@ -12,82 +12,90 @@ import { ZStack as w } from "../../stacks/z_stack.js";
 import { useDragContainer as z } from "../../utils/dnd/context.js";
 import { Draggable as C } from "../../utils/dnd/draggable/draggable.js";
 import { Portal as P } from "../portal/portal.js";
-import '../../frame.css';const B = "_frame-dialog_2a77c1d", N = { "frame-dialog": B }, J = h.forwardRef(function({
-  children: f,
+import '../../frame.css';const S = "_frame-dialog_2a77c1d", B = { "frame-dialog": S }, J = R.forwardRef(function({
+  children: a,
   isOpen: c = !1,
-  draggable: i = !0,
-  veil: a = !1,
+  draggable: o = !0,
+  veil: l = !1,
   resizable: t = !0,
-  className: o,
-  ...n
-}, l) {
-  return c ? /* @__PURE__ */ e(P, { children: /* @__PURE__ */ e(w, { width: "100%", height: "100%", "data-is-veil": a, className: "tcn-frame-veil", children: /* @__PURE__ */ e(C, { draggable: i, children: /* @__PURE__ */ e(
-    S,
+  className: s,
+  enableResizeOnTop: m = !0,
+  enableResizeOnBottom: u = !0,
+  enableResizeOnStart: h = !0,
+  enableResizeOnEnd: r = !0,
+  enableResizeOnLeft: d = !1,
+  enableResizeOnRight: g = !1,
+  ...e
+}, n) {
+  return c ? /* @__PURE__ */ i(P, { children: /* @__PURE__ */ i(w, { width: "100%", height: "100%", "data-is-veil": l, className: "tcn-frame-veil", children: /* @__PURE__ */ i(C, { draggable: o, children: /* @__PURE__ */ i(
+    N,
     {
-      className: o,
-      ref: l,
-      enableResizeOnLeft: t,
-      enableResizeOnRight: t,
-      enableResizeOnTop: t,
-      enableResizeOnBottom: t,
-      draggable: i,
-      ...n,
-      children: f
+      className: s,
+      ref: n,
+      enableResizeOnStart: t && h,
+      enableResizeOnEnd: t && r,
+      enableResizeOnTop: t && m,
+      enableResizeOnBottom: t && u,
+      enableResizeOnRight: t && g,
+      enableResizeOnLeft: t && d,
+      draggable: o,
+      ...e,
+      children: a
     }
   ) }) }) }) : null;
-}), S = h.forwardRef(
+}), N = R.forwardRef(
   function({
-    as: f = "div",
+    as: a = "div",
     role: c = "dialog",
-    children: i,
-    className: a,
+    children: o,
+    className: l,
     draggable: t,
-    onWidthResize: o,
-    onHeightResize: n,
-    ...l
-  }, D) {
-    const m = z(), p = h.useCallback(
-      (r) => {
-        if (!t || r.currentDelta === 0) return;
-        const u = r.origin === "right" ? 1 : -1, g = r.currentDelta / 2 * u;
-        R(() => {
-          m.setPosition((s) => ({
-            x: s.x + g,
-            y: s.y
+    onWidthResize: s,
+    onHeightResize: m,
+    ...u
+  }, h) {
+    const r = z(), d = R.useCallback(
+      (e) => {
+        if (!t || e.currentDelta === 0) return;
+        const n = e.origin === "right" ? 1 : -1, x = e.currentDelta / 2 * n;
+        p(() => {
+          r.setPosition((f) => ({
+            x: f.x + x,
+            y: f.y
           }));
-        }), o?.(r);
+        }), s?.(e);
       },
-      [o, m, t]
-    ), F = _(
-      (r) => {
-        if (!t || r.currentDelta === 0) return;
-        const u = r.origin === "bottom" ? 1 : -1, s = r.currentDelta / 2 * u;
-        R(() => {
-          m.setPosition((d) => ({
-            x: d.x,
-            y: d.y + s
+      [s, r, t]
+    ), g = _(
+      (e) => {
+        if (!t || e.currentDelta === 0) return;
+        const n = e.origin === "bottom" ? 1 : -1, f = e.currentDelta / 2 * n;
+        p(() => {
+          r.setPosition((D) => ({
+            x: D.x,
+            y: D.y + f
           }));
-        }), n?.(r);
+        }), m?.(e);
       },
-      [n, m, t]
+      [m, r, t]
     );
-    return /* @__PURE__ */ e(
+    return /* @__PURE__ */ i(
       k,
       {
-        className: O(N["frame-dialog"], "tcn-frame-dialog", a),
-        ref: D,
-        onWidthResize: p,
-        onHeightResize: F,
-        as: f,
+        className: F(B["frame-dialog"], "tcn-frame-dialog", l),
+        ref: h,
+        onWidthResize: d,
+        onHeightResize: g,
+        as: a,
         role: c,
-        ...l,
-        children: i
+        ...u,
+        children: o
       }
     );
   }
 );
 export {
   J as Frame,
-  S as FrameDialog
+  N as FrameDialog
 };
 //# sourceMappingURL=frame.js.map

package/dist/overlay/frame/frame.js.map

@@ -1 +1 @@
-{"version":3,"file":"frame.js","sources":["../../../src/overlay/frame/frame.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport React, { useCallback } from 'react';\nimport { flushSync } from 'react-dom';\nimport {\n  Box,\n  ZStack,\n  type BoxProps,\n  type OnHeightResizePayload,\n  type OnWidthResizePayload,\n} from '../../stacks/index.js';\nimport { useDragContainer } from '../../utils/dnd/context.js';\nimport { Draggable } from '../../utils/dnd/draggable/draggable.js';\nimport { Portal } from '../portal/portal.js';\n\n// Styles\nimport styles from './frame.module.css';\nexport interface FrameOwnProps {\n  isOpen?: boolean;\n  draggable?: boolean;\n  veil?: boolean;\n  resizable?: boolean;\n}\n\nexport type FrameProps = Omit<\n  BoxProps,\n  | 'enableResizeOnLeft'\n  | 'enableResizeOnRight'\n  | 'enableResizeOnTop'\n  | 'enableResizeOnBottom'\n> &\n  FrameOwnProps;\n\nexport const Frame = React.forwardRef<HTMLElement, FrameProps>(function Frame(\n  {\n    children,\n    isOpen = false,\n    draggable = true,\n    veil = false,\n    resizable = true,\n    className,\n    ...rest\n  }: FrameProps,\n  ref\n) {\n  if (!isOpen) return null;\n  return (\n    <Portal>\n      <ZStack width=\"100%\" height=\"100%\" data-is-veil={veil} className=\"tcn-frame-veil\">\n        <Draggable draggable={draggable}>\n          <FrameDialog\n            className={className}\n            ref={ref}\n            enableResizeOnLeft={resizable}\n            enableResizeOnRight={resizable}\n            enableResizeOnTop={resizable}\n            enableResizeOnBottom={resizable}\n            // TODO: check to see if these should be enabled, and if so - if left/right should be disabled.\n            // Could add a \"directional\" prop and use that in conjunction with enableResizeOnStart/End and deprecate enableResizeOnLeft/Right.\n            // enableResizeOnStart={resizable}\n            // enableResizeOnEnd={resizable}\n            draggable={draggable}\n            {...rest}\n          >\n            {children}\n          </FrameDialog>\n        </Draggable>\n      </ZStack>\n    </Portal>\n  );\n});\ninterface FrameDialogProps extends BoxProps {}\n\nexport const FrameDialog = React.forwardRef<HTMLElement, FrameDialogProps>(\n  function FrameDialog(\n    {\n      as = 'div',\n      role = 'dialog',\n      children,\n      className,\n      draggable,\n      onWidthResize,\n      onHeightResize,\n      ...rest\n    }: FrameDialogProps,\n    ref: React.Ref<HTMLElement>\n  ) {\n    const drag = useDragContainer();\n\n    const handleWidthResize = React.useCallback(\n      (payload: OnWidthResizePayload) => {\n        if (!draggable) return;\n        if (payload.currentDelta === 0) return;\n        const sign = payload.origin === 'right' ? 1 : -1;\n        const dx = (payload.currentDelta / 2) * sign;\n        flushSync(() => {\n          drag.setPosition(prev => ({\n            x: prev.x + dx,\n            y: prev.y,\n          }));\n        });\n\n        onWidthResize?.(payload);\n      },\n      [onWidthResize, drag, draggable]\n    );\n\n    const handleHeightResize = useCallback(\n      (payload: OnHeightResizePayload) => {\n        if (!draggable) return;\n        if (payload.currentDelta === 0) return;\n        const sign = payload.origin === 'bottom' ? 1 : -1;\n        const half = payload.currentDelta / 2;\n        const dy = half * sign;\n        flushSync(() => {\n          drag.setPosition(prev => ({\n            x: prev.x,\n            y: prev.y + dy,\n          }));\n        });\n        onHeightResize?.(payload);\n      },\n      [onHeightResize, drag, draggable]\n    );\n\n    return (\n      <Box\n        className={clsx(styles['frame-dialog'], 'tcn-frame-dialog', className)}\n        ref={ref}\n        onWidthResize={handleWidthResize}\n        onHeightResize={handleHeightResize}\n        as={as}\n        role={role}\n        {...rest}\n      >\n        {children}\n      </Box>\n    );\n  }\n);\n"],"names":["Frame","React","children","isOpen","draggable","veil","resizable","className","rest","ref","jsx","Portal","ZStack","Draggable","FrameDialog","as","role","onWidthResize","onHeightResize","drag","useDragContainer","handleWidthResize","payload","sign","dx","flushSync","prev","handleHeightResize","useCallback","dy","Box","clsx","styles"],"mappings":";;;;;;;;;;;;;;8DAgCaA,IAAQC,EAAM,WAAoC,SAC7D;AAAA,EACE,UAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,WAAAC,IAAY;AAAA,EACZ,MAAAC,IAAO;AAAA,EACP,WAAAC,IAAY;AAAA,EACZ,WAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,SAAKN,IAEH,gBAAAO,EAACC,GAAA,EACC,UAAA,gBAAAD,EAACE,GAAA,EAAO,OAAM,QAAO,QAAO,QAAO,gBAAcP,GAAM,WAAU,kBAC/D,UAAA,gBAAAK,EAACG,KAAU,WAAAT,GACT,UAAA,gBAAAM;AAAA,IAACI;AAAA,IAAA;AAAA,MACC,WAAAP;AAAA,MACA,KAAAE;AAAA,MACA,oBAAoBH;AAAA,MACpB,qBAAqBA;AAAA,MACrB,mBAAmBA;AAAA,MACnB,sBAAsBA;AAAA,MAKtB,WAAAF;AAAA,MACC,GAAGI;AAAA,MAEH,UAAAN;AAAA,IAAA;AAAA,EAAA,EACH,CACF,GACF,GACF,IAvBkB;AAyBtB,CAAC,GAGYY,IAAcb,EAAM;AAAA,EAC/B,SACE;AAAA,IACE,IAAAc,IAAK;AAAA,IACL,MAAAC,IAAO;AAAA,IACP,UAAAd;AAAA,IACA,WAAAK;AAAA,IACA,WAAAH;AAAA,IACA,eAAAa;AAAA,IACA,gBAAAC;AAAA,IACA,GAAGV;AAAA,EAAA,GAELC,GACA;AACA,UAAMU,IAAOC,EAAA,GAEPC,IAAoBpB,EAAM;AAAA,MAC9B,CAACqB,MAAkC;AAEjC,YADI,CAAClB,KACDkB,EAAQ,iBAAiB,EAAG;AAChC,cAAMC,IAAOD,EAAQ,WAAW,UAAU,IAAI,IACxCE,IAAMF,EAAQ,eAAe,IAAKC;AACxC,QAAAE,EAAU,MAAM;AACd,UAAAN,EAAK,YAAY,CAAAO,OAAS;AAAA,YACxB,GAAGA,EAAK,IAAIF;AAAA,YACZ,GAAGE,EAAK;AAAA,UAAA,EACR;AAAA,QACJ,CAAC,GAEDT,IAAgBK,CAAO;AAAA,MACzB;AAAA,MACA,CAACL,GAAeE,GAAMf,CAAS;AAAA,IAAA,GAG3BuB,IAAqBC;AAAA,MACzB,CAACN,MAAmC;AAElC,YADI,CAAClB,KACDkB,EAAQ,iBAAiB,EAAG;AAChC,cAAMC,IAAOD,EAAQ,WAAW,WAAW,IAAI,IAEzCO,IADOP,EAAQ,eAAe,IAClBC;AAClB,QAAAE,EAAU,MAAM;AACd,UAAAN,EAAK,YAAY,CAAAO,OAAS;AAAA,YACxB,GAAGA,EAAK;AAAA,YACR,GAAGA,EAAK,IAAIG;AAAA,UAAA,EACZ;AAAA,QACJ,CAAC,GACDX,IAAiBI,CAAO;AAAA,MAC1B;AAAA,MACA,CAACJ,GAAgBC,GAAMf,CAAS;AAAA,IAAA;AAGlC,WACE,gBAAAM;AAAA,MAACoB;AAAA,MAAA;AAAA,QACC,WAAWC,EAAKC,EAAO,cAAc,GAAG,oBAAoBzB,CAAS;AAAA,QACrE,KAAAE;AAAA,QACA,eAAeY;AAAA,QACf,gBAAgBM;AAAA,QAChB,IAAAZ;AAAA,QACA,MAAAC;AAAA,QACC,GAAGR;AAAA,QAEH,UAAAN;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AACF;"}
+{"version":3,"file":"frame.js","sources":["../../../src/overlay/frame/frame.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport React, { useCallback } from 'react';\nimport { flushSync } from 'react-dom';\nimport {\n  Box,\n  ZStack,\n  type BoxProps,\n  type OnHeightResizePayload,\n  type OnWidthResizePayload,\n} from '../../stacks/index.js';\nimport { useDragContainer } from '../../utils/dnd/context.js';\nimport { Draggable } from '../../utils/dnd/draggable/draggable.js';\nimport { Portal } from '../portal/portal.js';\n\n// Styles\nimport styles from './frame.module.css';\nexport interface FrameOwnProps {\n  isOpen?: boolean;\n  draggable?: boolean;\n  veil?: boolean;\n  resizable?: boolean;\n}\n\nexport type FrameProps = BoxProps & FrameOwnProps;\n\nexport const Frame = React.forwardRef<HTMLElement, FrameProps>(function Frame(\n  {\n    children,\n    isOpen = false,\n    draggable = true,\n    veil = false,\n    resizable = true,\n    className,\n    enableResizeOnTop = true,\n    enableResizeOnBottom = true,\n    enableResizeOnStart = true,\n    enableResizeOnEnd = true,\n    enableResizeOnLeft = false,\n    enableResizeOnRight = false,\n    ...rest\n  }: FrameProps,\n  ref\n) {\n  if (!isOpen) return null;\n  return (\n    <Portal>\n      <ZStack width=\"100%\" height=\"100%\" data-is-veil={veil} className=\"tcn-frame-veil\">\n        <Draggable draggable={draggable}>\n          <FrameDialog\n            className={className}\n            ref={ref}\n            enableResizeOnStart={resizable && enableResizeOnStart}\n            enableResizeOnEnd={resizable && enableResizeOnEnd}\n            enableResizeOnTop={resizable && enableResizeOnTop}\n            enableResizeOnBottom={resizable && enableResizeOnBottom}\n            enableResizeOnRight={resizable && enableResizeOnRight}\n            enableResizeOnLeft={resizable && enableResizeOnLeft}\n            draggable={draggable}\n            {...rest}\n          >\n            {children}\n          </FrameDialog>\n        </Draggable>\n      </ZStack>\n    </Portal>\n  );\n});\ninterface FrameDialogProps extends BoxProps {}\n\nexport const FrameDialog = React.forwardRef<HTMLElement, FrameDialogProps>(\n  function FrameDialog(\n    {\n      as = 'div',\n      role = 'dialog',\n      children,\n      className,\n      draggable,\n      onWidthResize,\n      onHeightResize,\n      ...rest\n    }: FrameDialogProps,\n    ref: React.Ref<HTMLElement>\n  ) {\n    const drag = useDragContainer();\n\n    const handleWidthResize = React.useCallback(\n      (payload: OnWidthResizePayload) => {\n        if (!draggable) return;\n        if (payload.currentDelta === 0) return;\n        const sign = payload.origin === 'right' ? 1 : -1;\n        const dx = (payload.currentDelta / 2) * sign;\n        flushSync(() => {\n          drag.setPosition(prev => ({\n            x: prev.x + dx,\n            y: prev.y,\n          }));\n        });\n\n        onWidthResize?.(payload);\n      },\n      [onWidthResize, drag, draggable]\n    );\n\n    const handleHeightResize = useCallback(\n      (payload: OnHeightResizePayload) => {\n        if (!draggable) return;\n        if (payload.currentDelta === 0) return;\n        const sign = payload.origin === 'bottom' ? 1 : -1;\n        const half = payload.currentDelta / 2;\n        const dy = half * sign;\n        flushSync(() => {\n          drag.setPosition(prev => ({\n            x: prev.x,\n            y: prev.y + dy,\n          }));\n        });\n        onHeightResize?.(payload);\n      },\n      [onHeightResize, drag, draggable]\n    );\n\n    return (\n      <Box\n        className={clsx(styles['frame-dialog'], 'tcn-frame-dialog', className)}\n        ref={ref}\n        onWidthResize={handleWidthResize}\n        onHeightResize={handleHeightResize}\n        as={as}\n        role={role}\n        {...rest}\n      >\n        {children}\n      </Box>\n    );\n  }\n);\n"],"names":["Frame","React","children","isOpen","draggable","veil","resizable","className","enableResizeOnTop","enableResizeOnBottom","enableResizeOnStart","enableResizeOnEnd","enableResizeOnLeft","enableResizeOnRight","rest","ref","jsx","Portal","ZStack","Draggable","FrameDialog","as","role","onWidthResize","onHeightResize","drag","useDragContainer","handleWidthResize","payload","sign","dx","flushSync","prev","handleHeightResize","useCallback","dy","Box","clsx","styles"],"mappings":";;;;;;;;;;;;;;8DAyBaA,IAAQC,EAAM,WAAoC,SAC7D;AAAA,EACE,UAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,WAAAC,IAAY;AAAA,EACZ,MAAAC,IAAO;AAAA,EACP,WAAAC,IAAY;AAAA,EACZ,WAAAC;AAAA,EACA,mBAAAC,IAAoB;AAAA,EACpB,sBAAAC,IAAuB;AAAA,EACvB,qBAAAC,IAAsB;AAAA,EACtB,mBAAAC,IAAoB;AAAA,EACpB,oBAAAC,IAAqB;AAAA,EACrB,qBAAAC,IAAsB;AAAA,EACtB,GAAGC;AACL,GACAC,GACA;AACA,SAAKZ,IAEH,gBAAAa,EAACC,GAAA,EACC,UAAA,gBAAAD,EAACE,GAAA,EAAO,OAAM,QAAO,QAAO,QAAO,gBAAcb,GAAM,WAAU,kBAC/D,UAAA,gBAAAW,EAACG,KAAU,WAAAf,GACT,UAAA,gBAAAY;AAAA,IAACI;AAAA,IAAA;AAAA,MACC,WAAAb;AAAA,MACA,KAAAQ;AAAA,MACA,qBAAqBT,KAAaI;AAAA,MAClC,mBAAmBJ,KAAaK;AAAA,MAChC,mBAAmBL,KAAaE;AAAA,MAChC,sBAAsBF,KAAaG;AAAA,MACnC,qBAAqBH,KAAaO;AAAA,MAClC,oBAAoBP,KAAaM;AAAA,MACjC,WAAAR;AAAA,MACC,GAAGU;AAAA,MAEH,UAAAZ;AAAA,IAAA;AAAA,EAAA,EACH,CACF,GACF,GACF,IArBkB;AAuBtB,CAAC,GAGYkB,IAAcnB,EAAM;AAAA,EAC/B,SACE;AAAA,IACE,IAAAoB,IAAK;AAAA,IACL,MAAAC,IAAO;AAAA,IACP,UAAApB;AAAA,IACA,WAAAK;AAAA,IACA,WAAAH;AAAA,IACA,eAAAmB;AAAA,IACA,gBAAAC;AAAA,IACA,GAAGV;AAAA,EAAA,GAELC,GACA;AACA,UAAMU,IAAOC,EAAA,GAEPC,IAAoB1B,EAAM;AAAA,MAC9B,CAAC2B,MAAkC;AAEjC,YADI,CAACxB,KACDwB,EAAQ,iBAAiB,EAAG;AAChC,cAAMC,IAAOD,EAAQ,WAAW,UAAU,IAAI,IACxCE,IAAMF,EAAQ,eAAe,IAAKC;AACxC,QAAAE,EAAU,MAAM;AACd,UAAAN,EAAK,YAAY,CAAAO,OAAS;AAAA,YACxB,GAAGA,EAAK,IAAIF;AAAA,YACZ,GAAGE,EAAK;AAAA,UAAA,EACR;AAAA,QACJ,CAAC,GAEDT,IAAgBK,CAAO;AAAA,MACzB;AAAA,MACA,CAACL,GAAeE,GAAMrB,CAAS;AAAA,IAAA,GAG3B6B,IAAqBC;AAAA,MACzB,CAACN,MAAmC;AAElC,YADI,CAACxB,KACDwB,EAAQ,iBAAiB,EAAG;AAChC,cAAMC,IAAOD,EAAQ,WAAW,WAAW,IAAI,IAEzCO,IADOP,EAAQ,eAAe,IAClBC;AAClB,QAAAE,EAAU,MAAM;AACd,UAAAN,EAAK,YAAY,CAAAO,OAAS;AAAA,YACxB,GAAGA,EAAK;AAAA,YACR,GAAGA,EAAK,IAAIG;AAAA,UAAA,EACZ;AAAA,QACJ,CAAC,GACDX,IAAiBI,CAAO;AAAA,MAC1B;AAAA,MACA,CAACJ,GAAgBC,GAAMrB,CAAS;AAAA,IAAA;AAGlC,WACE,gBAAAY;AAAA,MAACoB;AAAA,MAAA;AAAA,QACC,WAAWC,EAAKC,EAAO,cAAc,GAAG,oBAAoB/B,CAAS;AAAA,QACrE,KAAAQ;AAAA,QACA,eAAeY;AAAA,QACf,gBAAgBM;AAAA,QAChB,IAAAZ;AAAA,QACA,MAAAC;AAAA,QACC,GAAGR;AAAA,QAEH,UAAAZ;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AACF;"}

package/dist/overlay/slide/slide.d.ts

@@ -0,0 +1,9 @@
+import { default as React } from 'react';
+import { FrameProps } from '../frame/frame.js';
+export type SlideSide = 'top' | 'bottom' | 'start' | 'end';
+export interface SlideOwnProps {
+    side: SlideSide;
+}
+export type SlideProps = Omit<FrameProps, 'draggable' | 'enableResizeOnLeft' | 'enableResizeOnRight' | 'enableResizeOnTop' | 'enableResizeOnBottom' | 'enableResizeOnStart' | 'enableResizeOnEnd'> & SlideOwnProps;
+export declare const Slide: React.ForwardRefExoticComponent<Omit<FrameProps, "draggable" | "enableResizeOnTop" | "enableResizeOnEnd" | "enableResizeOnBottom" | "enableResizeOnStart" | "enableResizeOnLeft" | "enableResizeOnRight"> & SlideOwnProps & React.RefAttributes<HTMLElement>>;
+//# sourceMappingURL=slide.d.ts.map

package/dist/overlay/slide/slide.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"slide.d.ts","sourceRoot":"","sources":["../../../src/overlay/slide/slide.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,mBAAmB,CAAC;AAM3D,MAAM,MAAM,SAAS,GAAG,KAAK,GAAG,QAAQ,GAAG,OAAO,GAAG,KAAK,CAAC;AAE3D,MAAM,WAAW,aAAa;IAC5B,IAAI,EAAE,SAAS,CAAC;CACjB;AAED,MAAM,MAAM,UAAU,GAAG,IAAI,CAC3B,UAAU,EACR,WAAW,GACX,oBAAoB,GACpB,qBAAqB,GACrB,mBAAmB,GACnB,sBAAsB,GACtB,qBAAqB,GACrB,mBAAmB,CACtB,GACC,aAAa,CAAC;AAGhB,eAAO,MAAM,KAAK,+PAwBhB,CAAC"}

package/dist/overlay/slide/slide.js

@@ -0,0 +1,29 @@
+import { jsx as s } from "react/jsx-runtime";
+import i from "react";
+import { Frame as m } from "../frame/frame.js";
+import { clsx as c } from "clsx";
+import '../../slide.css';const f = "_slide_d303bac", d = { slide: f }, _ = i.forwardRef(function({ children: a, side: t, resizable: o = !1, className: r, ...l }, n) {
+  const e = t === "top" || t === "bottom";
+  return /* @__PURE__ */ s(
+    m,
+    {
+      "data-side": t,
+      className: c(d.slide, r),
+      draggable: !1,
+      ref: n,
+      "data-is-vertical": e,
+      "data-is-horizontal": !e,
+      resizable: o,
+      enableResizeOnTop: t === "bottom",
+      enableResizeOnBottom: t === "top",
+      enableResizeOnStart: t === "end",
+      enableResizeOnEnd: t === "start",
+      ...l,
+      children: a
+    }
+  );
+});
+export {
+  _ as Slide
+};
+//# sourceMappingURL=slide.js.map

package/dist/overlay/slide/slide.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"slide.js","sources":["../../../src/overlay/slide/slide.tsx"],"sourcesContent":["import React from 'react';\nimport { Frame, type FrameProps } from '../frame/frame.js';\nimport { clsx } from 'clsx';\n\n// Styles\nimport styles from './slide.module.css';\n\nexport type SlideSide = 'top' | 'bottom' | 'start' | 'end';\n\nexport interface SlideOwnProps {\n  side: SlideSide;\n}\n\nexport type SlideProps = Omit<\n  FrameProps,\n  | 'draggable'\n  | 'enableResizeOnLeft'\n  | 'enableResizeOnRight'\n  | 'enableResizeOnTop'\n  | 'enableResizeOnBottom'\n  | 'enableResizeOnStart'\n  | 'enableResizeOnEnd'\n> &\n  SlideOwnProps;\n\n// A Frame fixed to a side of a container (top, bottom, start, end) - disables dragging - and limits resizing to one side\nexport const Slide = React.forwardRef<HTMLElement, SlideProps>(function Slide(\n  { children, side, resizable = false, className, ...rest },\n  ref\n) {\n  const isVertical = side === 'top' || side === 'bottom';\n\n  return (\n    <Frame\n      data-side={side}\n      className={clsx(styles['slide'], className)}\n      draggable={false}\n      ref={ref}\n      data-is-vertical={isVertical}\n      data-is-horizontal={!isVertical}\n      resizable={resizable}\n      enableResizeOnTop={side === 'bottom'}\n      enableResizeOnBottom={side === 'top'}\n      enableResizeOnStart={side === 'end'}\n      enableResizeOnEnd={side === 'start'}\n      {...rest}\n    >\n      {children}\n    </Frame>\n  );\n});\n"],"names":["Slide","React","children","side","resizable","className","rest","ref","isVertical","jsx","Frame","clsx","styles"],"mappings":";;;;8CA0BaA,IAAQC,EAAM,WAAoC,SAC7D,EAAE,UAAAC,GAAU,MAAAC,GAAM,WAAAC,IAAY,IAAO,WAAAC,GAAW,GAAGC,EAAA,GACnDC,GACA;AACA,QAAMC,IAAaL,MAAS,SAASA,MAAS;AAE9C,SACE,gBAAAM;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,aAAWP;AAAA,MACX,WAAWQ,EAAKC,EAAO,OAAUP,CAAS;AAAA,MAC1C,WAAW;AAAA,MACX,KAAAE;AAAA,MACA,oBAAkBC;AAAA,MAClB,sBAAoB,CAACA;AAAA,MACrB,WAAAJ;AAAA,MACA,mBAAmBD,MAAS;AAAA,MAC5B,sBAAsBA,MAAS;AAAA,MAC/B,qBAAqBA,MAAS;AAAA,MAC9B,mBAAmBA,MAAS;AAAA,MAC3B,GAAGG;AAAA,MAEH,UAAAJ;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;"}

package/dist/slide.css

@@ -0,0 +1 @@
+@layer tcn-system{:where(._slide_d303bac){position:absolute}:where(._slide_d303bac)[data-side=top],:where(._slide_d303bac)[data-side=bottom]{width:100%}:where(._slide_d303bac)[data-side=start],:where(._slide_d303bac)[data-side=end]{height:100%}:where(._slide_d303bac)[data-side=top]{top:0}:where(._slide_d303bac)[data-side=bottom]{bottom:0}:where(._slide_d303bac)[data-side=start]{left:0}:where(._slide_d303bac)[data-side=end]{right:0}}

package/dist/surfaces/drawers/drawer.d.ts

@@ -0,0 +1,5 @@
+import { default as React } from 'react';
+import { SlideProps } from '../../overlay/slide/slide.js';
+export type DrawerProps = SlideProps;
+export declare const Drawer: React.ForwardRefExoticComponent<Omit<import('../../overlay/index.js').FrameProps, "draggable" | "enableResizeOnTop" | "enableResizeOnEnd" | "enableResizeOnBottom" | "enableResizeOnStart" | "enableResizeOnLeft" | "enableResizeOnRight"> & import('../../overlay/slide/slide.js').SlideOwnProps & React.RefAttributes<HTMLElement>>;
+//# sourceMappingURL=drawer.d.ts.map

package/dist/surfaces/drawers/drawer.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"drawer.d.ts","sourceRoot":"","sources":["../../../src/surfaces/drawers/drawer.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAEtE,MAAM,MAAM,WAAW,GAAG,UAAU,CAAC;AAErC,eAAO,MAAM,MAAM,uUAkBjB,CAAC"}

package/dist/surfaces/drawers/drawer.js

@@ -0,0 +1,23 @@
+import { jsx as r } from "react/jsx-runtime";
+import { clsx as s } from "clsx";
+import i from "react";
+import { Scaffold as l } from "../../layouts/scaffold/scaffold.js";
+import { Slide as d } from "../../overlay/slide/slide.js";
+const D = i.forwardRef(function({ children: e, className: a, isOpen: f, veil: o = !1, resizable: t = !1, ...c }, m) {
+  return /* @__PURE__ */ r(
+    d,
+    {
+      ref: m,
+      isOpen: f,
+      veil: o,
+      resizable: t,
+      className: s("tcn-surface", "tcn-drawer", a),
+      ...c,
+      children: /* @__PURE__ */ r(l, { className: "tcn-drawer-scaffold", width: "100%", height: "100%", children: e })
+    }
+  );
+});
+export {
+  D as Drawer
+};
+//# sourceMappingURL=drawer.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"drawer.js","sources":["../../../src/surfaces/drawers/drawer.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport React from 'react';\nimport { Scaffold } from '../../layouts/scaffold/scaffold.js';\nimport { Slide, type SlideProps } from '../../overlay/slide/slide.js';\n\nexport type DrawerProps = SlideProps;\n\nexport const Drawer = React.forwardRef<HTMLElement, DrawerProps>(function Drawer(\n  { children, className, isOpen, veil = false, resizable = false, ...props }: DrawerProps,\n  ref\n) {\n  return (\n    <Slide\n      ref={ref}\n      isOpen={isOpen}\n      veil={veil}\n      resizable={resizable}\n      className={clsx('tcn-surface', 'tcn-drawer', className)}\n      {...props}\n    >\n      <Scaffold className={'tcn-drawer-scaffold'} width=\"100%\" height=\"100%\">\n        {children}\n      </Scaffold>\n    </Slide>\n  );\n});\n"],"names":["Drawer","React","children","className","isOpen","veil","resizable","props","ref","jsx","Slide","clsx","Scaffold"],"mappings":";;;;;AAOO,MAAMA,IAASC,EAAM,WAAqC,SAC/D,EAAE,UAAAC,GAAU,WAAAC,GAAW,QAAAC,GAAQ,MAAAC,IAAO,IAAO,WAAAC,IAAY,IAAO,GAAGC,EAAA,GACnEC,GACA;AACA,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAF;AAAA,MACA,QAAAJ;AAAA,MACA,MAAAC;AAAA,MACA,WAAAC;AAAA,MACA,WAAWK,EAAK,eAAe,cAAcR,CAAS;AAAA,MACrD,GAAGI;AAAA,MAEJ,UAAA,gBAAAE,EAACG,KAAS,WAAW,uBAAuB,OAAM,QAAO,QAAO,QAC7D,UAAAV,EAAA,CACH;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;"}

package/dist/surfaces/index.d.ts

@@ -5,10 +5,7 @@ export * from './page/h_page.js';
 export * from './page/v_page.js';
 export * from './panel/panel.js';
 export * from './popover/popover.js';
-export * from './drawers/drawer_bottom/drawer_bottom.js';
-export * from './drawers/drawer_top/drawer_top.js';
-export * from './drawers/drawer_start/drawer_start.js';
-export * from './drawers/drawer_end/drawer_end.js';
+export { Drawer, type DrawerProps } from './drawers/drawer.js';
 export { Window, type WindowProps } from './window/window.js';
 export { Modal, type ModalProps } from './modal/modal.js';
 export { Tooltip, type TooltipProps } from './tooltip/tooltip.js';

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/surfaces/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC;AACjC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,sBAAsB,CAAC;AACrC,cAAc,kBAAkB,CAAC;AACjC,cAAc,kBAAkB,CAAC;AACjC,cAAc,kBAAkB,CAAC;AACjC,cAAc,sBAAsB,CAAC;AACrC,cAAc,0CAA0C,CAAC;AACzD,cAAc,oCAAoC,CAAC;AACnD,cAAc,wCAAwC,CAAC;AACvD,cAAc,oCAAoC,CAAC;AACnD,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAC9D,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EAAE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,8BAA8B,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/surfaces/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC;AACjC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,sBAAsB,CAAC;AACrC,cAAc,kBAAkB,CAAC;AACjC,cAAc,kBAAkB,CAAC;AACjC,cAAc,kBAAkB,CAAC;AACjC,cAAc,sBAAsB,CAAC;AACrC,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAC/D,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAC9D,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EAAE,OAAO,EAAE,KAAK,YAAY,EAAE,MAAM,sBAAsB,CAAC;AAClE,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,8BAA8B,CAAC"}

package/dist/surfaces/index.js

@@ -1,33 +1,27 @@
 import { Alert as e } from "./alert/alert.js";
-import { Card as p } from "./card/card.js";
-import { Confirm as f } from "./confirm/confirm.js";
+import { Card as f } from "./card/card.js";
+import { Confirm as t } from "./confirm/confirm.js";
 import { HPage as a } from "./page/h_page.js";
-import { VPage as w } from "./page/v_page.js";
-import { Panel as d } from "./panel/panel.js";
-import { Popover as l } from "./popover/popover.js";
-import { DrawerBottom as C } from "./drawers/drawer_bottom/drawer_bottom.js";
-import { DrawerTop as T } from "./drawers/drawer_top/drawer_top.js";
-import { DrawerStart as A } from "./drawers/drawer_start/drawer_start.js";
-import { DrawerEnd as E } from "./drawers/drawer_end/drawer_end.js";
-import { Window as M } from "./window/window.js";
-import { Modal as V } from "./modal/modal.js";
-import { Tooltip as b } from "./tooltip/tooltip.js";
-import { PopConfirm as h } from "./pop_confirm/pop_confirm.js";
+import { VPage as i } from "./page/v_page.js";
+import { Panel as n } from "./panel/panel.js";
+import { Popover as C } from "./popover/popover.js";
+import { Drawer as w } from "./drawers/drawer.js";
+import { Window as A } from "./window/window.js";
+import { Modal as H } from "./modal/modal.js";
+import { Tooltip as T } from "./tooltip/tooltip.js";
+import { PopConfirm as W } from "./pop_confirm/pop_confirm.js";
 export {
   e as Alert,
-  p as Card,
-  f as Confirm,
-  C as DrawerBottom,
-  E as DrawerEnd,
-  A as DrawerStart,
-  T as DrawerTop,
+  f as Card,
+  t as Confirm,
+  w as Drawer,
   a as HPage,
-  V as Modal,
-  d as Panel,
-  h as PopConfirm,
-  l as Popover,
-  b as Tooltip,
-  w as VPage,
-  M as Window
+  H as Modal,
+  n as Panel,
+  W as PopConfirm,
+  C as Popover,
+  T as Tooltip,
+  i as VPage,
+  A as Window
 };
 //# sourceMappingURL=index.js.map

package/dist/surfaces/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}

package/dist/surfaces/modal/modal.d.ts

@@ -1,5 +1,5 @@
 import { default as React } from 'react';
 import { FrameProps } from '../../overlay/frame/frame.js';
 export type ModalProps = FrameProps;
-export declare const Modal: React.ForwardRefExoticComponent<Omit<import('../../stacks/index.js').BoxProps<HTMLElement>, "enableResizeOnTop" | "enableResizeOnBottom" | "enableResizeOnLeft" | "enableResizeOnRight"> & import('../../overlay/index.js').FrameOwnProps & React.RefAttributes<HTMLElement>>;
+export declare const Modal: React.ForwardRefExoticComponent<import('../../stacks/index.js').BoxProps<HTMLElement> & import('../../overlay/index.js').FrameOwnProps & React.RefAttributes<HTMLElement>>;
 //# sourceMappingURL=modal.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../../../src/surfaces/modal/modal.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAMtE,MAAM,MAAM,UAAU,GAAG,UAAU,CAAC;AAEpC,eAAO,MAAM,KAAK,+QA2BhB,CAAC"}
+{"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../../../src/surfaces/modal/modal.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAMtE,MAAM,MAAM,UAAU,GAAG,UAAU,CAAC;AAEpC,eAAO,MAAM,KAAK,4KA2BhB,CAAC"}

package/dist/surfaces/window/window.d.ts

@@ -1,5 +1,5 @@
 import { default as React } from 'react';
 import { FrameProps } from '../../overlay/frame/frame.js';
 export type WindowProps = FrameProps;
-export declare const Window: React.ForwardRefExoticComponent<Omit<import('../../stacks/index.js').BoxProps<HTMLElement>, "enableResizeOnTop" | "enableResizeOnBottom" | "enableResizeOnLeft" | "enableResizeOnRight"> & import('../../overlay/index.js').FrameOwnProps & React.RefAttributes<HTMLElement>>;
+export declare const Window: React.ForwardRefExoticComponent<import('../../stacks/index.js').BoxProps<HTMLElement> & import('../../overlay/index.js').FrameOwnProps & React.RefAttributes<HTMLElement>>;
 //# sourceMappingURL=window.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"window.d.ts","sourceRoot":"","sources":["../../../src/surfaces/window/window.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAMtE,MAAM,MAAM,WAAW,GAAG,UAAU,CAAC;AAErC,eAAO,MAAM,MAAM,+QA2BjB,CAAC"}
+{"version":3,"file":"window.d.ts","sourceRoot":"","sources":["../../../src/surfaces/window/window.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAMtE,MAAM,MAAM,WAAW,GAAG,UAAU,CAAC;AAErC,eAAO,MAAM,MAAM,4KA2BjB,CAAC"}

package/dist/themes/stylesheets/reset.css

@@ -1 +1 @@
-@layer tcn-reset{html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,button,video,dialog{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,hgroup,menu,nav{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}legend{all:unset;display:block;margin:0;padding:0;font:inherit;color:inherit}dialog{max-width:none;max-height:none;background:transparent;color:inherit}}
+@layer tcn-reset{html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,button,video,dialog{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}header,section,article,aside,details,figcaption,figure,footer,hgroup,menu,nav{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}legend{all:unset;display:block;margin:0;padding:0;font:inherit;color:inherit}dialog{max-width:none;max-height:none;background:transparent;color:inherit}}

package/dist/themes/stylesheets/reset.js

@@ -91,8 +91,8 @@ const n = `/* https://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 */
     vertical-align: baseline;
   }
   /* HTML5 display-role reset for older browsers */
-  /* FIXME: sometimes reset breaks stacks display value (flex) */
-  /* header, section */
+  header,
+  section,
   article,
   aside,
   details,

package/dist/themes/stylesheets/reset.js.map

@@ -1 +1 @@
-{"version":3,"file":"reset.js","sources":["../../../src/themes/stylesheets/reset.css?raw","../../../src/themes/stylesheets/reset.ts"],"sourcesContent":["export default \"/* https://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 */\\n@layer tcn-reset {\\n  html,\\n  body,\\n  div,\\n  span,\\n  applet,\\n  object,\\n  iframe,\\n  h1,\\n  h2,\\n  h3,\\n  h4,\\n  h5,\\n  h6,\\n  p,\\n  blockquote,\\n  pre,\\n  a,\\n  abbr,\\n  acronym,\\n  address,\\n  big,\\n  cite,\\n  code,\\n  del,\\n  dfn,\\n  em,\\n  img,\\n  ins,\\n  kbd,\\n  q,\\n  s,\\n  samp,\\n  small,\\n  strike,\\n  strong,\\n  sub,\\n  sup,\\n  tt,\\n  var,\\n  b,\\n  u,\\n  i,\\n  center,\\n  dl,\\n  dt,\\n  dd,\\n  ol,\\n  ul,\\n  li,\\n  fieldset,\\n  form,\\n  label,\\n  legend,\\n  table,\\n  caption,\\n  tbody,\\n  tfoot,\\n  thead,\\n  tr,\\n  th,\\n  td,\\n  article,\\n  aside,\\n  canvas,\\n  details,\\n  embed,\\n  figure,\\n  figcaption,\\n  footer,\\n  header,\\n  hgroup,\\n  menu,\\n  nav,\\n  output,\\n  ruby,\\n  section,\\n  summary,\\n  time,\\n  mark,\\n  audio,\\n  button,\\n  video,\\n  dialog {\\n    margin: 0;\\n    padding: 0;\\n    border: 0;\\n    font-size: 100%;\\n    font: inherit;\\n    vertical-align: baseline;\\n  }\\n  /* HTML5 display-role reset for older browsers */\\n  /* FIXME: sometimes reset breaks stacks display value (flex) */\\n  /* header, section */\\n  article,\\n  aside,\\n  details,\\n  figcaption,\\n  figure,\\n  footer,\\n  hgroup,\\n  menu,\\n  nav {\\n    display: block;\\n  }\\n  body {\\n    line-height: 1;\\n  }\\n  ol,\\n  ul {\\n    list-style: none;\\n  }\\n  blockquote,\\n  q {\\n    quotes: none;\\n  }\\n  blockquote:before,\\n  blockquote:after,\\n  q:before,\\n  q:after {\\n    content: \\\"\\\";\\n    content: none;\\n  }\\n  table {\\n    border-collapse: collapse;\\n    border-spacing: 0;\\n  }\\n\\n  legend {\\n    all: unset;\\n    display: block;\\n    margin: 0;\\n    padding: 0;\\n    font: inherit;\\n    color: inherit;\\n  }\\n  dialog {\\n    max-width: none;\\n    max-height: none;\\n    background: transparent;\\n    color: inherit;\\n  }\\n}\\n\"","import css from './reset.css?raw';\n\nexport const reset = new CSSStyleSheet();\nreset.replaceSync(css);\n"],"names":["css","reset"],"mappings":"AAAA,MAAAA,IAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GCEFC,IAAQ,IAAI,cAAA;AACzBA,EAAM,YAAYD,CAAG;"}
+{"version":3,"file":"reset.js","sources":["../../../src/themes/stylesheets/reset.css?raw","../../../src/themes/stylesheets/reset.ts"],"sourcesContent":["export default \"/* https://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 */\\n@layer tcn-reset {\\n  html,\\n  body,\\n  div,\\n  span,\\n  applet,\\n  object,\\n  iframe,\\n  h1,\\n  h2,\\n  h3,\\n  h4,\\n  h5,\\n  h6,\\n  p,\\n  blockquote,\\n  pre,\\n  a,\\n  abbr,\\n  acronym,\\n  address,\\n  big,\\n  cite,\\n  code,\\n  del,\\n  dfn,\\n  em,\\n  img,\\n  ins,\\n  kbd,\\n  q,\\n  s,\\n  samp,\\n  small,\\n  strike,\\n  strong,\\n  sub,\\n  sup,\\n  tt,\\n  var,\\n  b,\\n  u,\\n  i,\\n  center,\\n  dl,\\n  dt,\\n  dd,\\n  ol,\\n  ul,\\n  li,\\n  fieldset,\\n  form,\\n  label,\\n  legend,\\n  table,\\n  caption,\\n  tbody,\\n  tfoot,\\n  thead,\\n  tr,\\n  th,\\n  td,\\n  article,\\n  aside,\\n  canvas,\\n  details,\\n  embed,\\n  figure,\\n  figcaption,\\n  footer,\\n  header,\\n  hgroup,\\n  menu,\\n  nav,\\n  output,\\n  ruby,\\n  section,\\n  summary,\\n  time,\\n  mark,\\n  audio,\\n  button,\\n  video,\\n  dialog {\\n    margin: 0;\\n    padding: 0;\\n    border: 0;\\n    font-size: 100%;\\n    font: inherit;\\n    vertical-align: baseline;\\n  }\\n  /* HTML5 display-role reset for older browsers */\\n  header,\\n  section,\\n  article,\\n  aside,\\n  details,\\n  figcaption,\\n  figure,\\n  footer,\\n  hgroup,\\n  menu,\\n  nav {\\n    display: block;\\n  }\\n  body {\\n    line-height: 1;\\n  }\\n  ol,\\n  ul {\\n    list-style: none;\\n  }\\n  blockquote,\\n  q {\\n    quotes: none;\\n  }\\n  blockquote:before,\\n  blockquote:after,\\n  q:before,\\n  q:after {\\n    content: \\\"\\\";\\n    content: none;\\n  }\\n  table {\\n    border-collapse: collapse;\\n    border-spacing: 0;\\n  }\\n\\n  legend {\\n    all: unset;\\n    display: block;\\n    margin: 0;\\n    padding: 0;\\n    font: inherit;\\n    color: inherit;\\n  }\\n  dialog {\\n    max-width: none;\\n    max-height: none;\\n    background: transparent;\\n    color: inherit;\\n  }\\n}\\n\"","import css from './reset.css?raw';\n\nexport const reset = new CSSStyleSheet();\nreset.replaceSync(css);\n"],"names":["css","reset"],"mappings":"AAAA,MAAAA,IAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GCEFC,IAAQ,IAAI,cAAA;AACzBA,EAAM,YAAYD,CAAG;"}