@tcn/ui 0.0.1 → 0.0.3

package/dist/surfaces/index.d.ts

@@ -8,4 +8,8 @@ export * from './panel/h_panel.js';
 export * from './panel/v_panel.js';
 export * from './popover/popover.js';
 export * from './window/window.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';
 //# sourceMappingURL=index.d.ts.map

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,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC;AACnC,cAAc,sBAAsB,CAAC;AACrC,cAAc,oBAAoB,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,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC;AACnC,cAAc,sBAAsB,CAAC;AACrC,cAAc,oBAAoB,CAAC;AACnC,cAAc,0CAA0C,CAAC;AACzD,cAAc,oCAAoC,CAAC;AACnD,cAAc,wCAAwC,CAAC;AACvD,cAAc,oCAAoC,CAAC"}

package/dist/surfaces/index.js

@@ -1,23 +1,31 @@
 import { Alert as e } from "./alert/alert.js";
 import { Card as m } from "./card/card.js";
-import { Confirm as t } from "./confirm/confirm.js";
+import { Confirm as f } from "./confirm/confirm.js";
 import { Modal as a } from "./modal/modal.js";
-import { HPage as l } from "./page/h_page.js";
+import { HPage as w } from "./page/h_page.js";
 import { VPage as d } from "./page/v_page.js";
-import { HPanel as i } from "./panel/h_panel.js";
-import { VPanel as H } from "./panel/v_panel.js";
-import { Popover as v } from "./popover/popover.js";
-import { Window as A } from "./window/window.js";
+import { HPanel as D } from "./panel/h_panel.js";
+import { VPanel as i } from "./panel/v_panel.js";
+import { Popover as H } from "./popover/popover.js";
+import { Window as v } from "./window/window.js";
+import { DrawerBottom as B } from "./drawers/drawer_bottom/drawer_bottom.js";
+import { DrawerTop as M } from "./drawers/drawer_top/drawer_top.js";
+import { DrawerStart as T } from "./drawers/drawer_start/drawer_start.js";
+import { DrawerEnd as b } from "./drawers/drawer_end/drawer_end.js";
 export {
   e as Alert,
   m as Card,
-  t as Confirm,
-  l as HPage,
-  i as HPanel,
+  f as Confirm,
+  B as DrawerBottom,
+  b as DrawerEnd,
+  T as DrawerStart,
+  M as DrawerTop,
+  w as HPage,
+  D as HPanel,
   a as Modal,
-  v as Popover,
+  H as Popover,
   d as VPage,
-  H as VPanel,
-  A as Window
+  i as VPanel,
+  v 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/panel/h_panel.d.ts

@@ -1,6 +1,6 @@
+import { default as React } from 'react';
 import { BoxProps } from '../../stacks/box/box.js';
 import { Alignment } from '../../stacks/types/alignment.js';
-import { default as React } from 'react';
 export interface HPanelProps extends Omit<BoxProps, 'as'> {
     vAlign?: Alignment;
     hAlign?: Alignment;

package/dist/surfaces/panel/h_panel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"h_panel.d.ts","sourceRoot":"","sources":["../../../src/surfaces/panel/h_panel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAE5D,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC;IACvD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB;AAED,eAAO,MAAM,MAAM,iFA8CjB,CAAC"}
+{"version":3,"file":"h_panel.d.ts","sourceRoot":"","sources":["../../../src/surfaces/panel/h_panel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAO,KAAK,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAE7D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAIjE,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC;IACvD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB;AAED,eAAO,MAAM,MAAM,iFAyDjB,CAAC"}

package/dist/surfaces/panel/h_panel.js

@@ -1,48 +1,59 @@
 import { jsx as p } from "react/jsx-runtime";
-import { Box as u } from "../../stacks/box/box.js";
-import c from "classnames";
-import x from "react";
-import { s as l } from "../../panel.module-CtikcmYB.js";
+import u from "react";
+import l from "classnames";
+import { Box as x } from "../../stacks/box/box.js";
 import { HStack as N } from "../../stacks/h_stack.js";
-const H = x.forwardRef(function({
+import { s as m } from "../../panel.module-DwGKncon.js";
+const H = u.forwardRef(function({
   children: f,
-  width: d,
-  height: i,
+  width: k,
+  height: d,
   minWidth: a,
-  maxWidth: o,
-  minHeight: r,
-  maxHeight: t,
-  hAlign: s,
-  vAlign: e = "start",
-  className: n,
-  ...k
-}, m) {
+  maxWidth: t,
+  minHeight: n,
+  maxHeight: e,
+  hAlign: o,
+  vAlign: r = "start",
+  className: s,
+  ...i
+}, c) {
   return /* @__PURE__ */ p(
-    u,
+    x,
     {
-      ref: m,
-      width: d,
-      height: i,
+      ref: c,
+      width: k,
+      height: d,
       minWidth: a,
-      maxWidth: o,
-      minHeight: r,
-      maxHeight: t,
-      "data-h-alignment": s,
-      "data-v-alignment": e,
-      className: c(n, l.panel, "panel"),
-      ...k,
+      maxWidth: t,
+      minHeight: n,
+      maxHeight: e,
+      "data-h-alignment": o,
+      "data-v-alignment": r,
+      className: l(
+        m.panel,
+        s,
+        "panel",
+        "tcn-panel",
+        "tcn-h-panel"
+      ),
+      ...i,
       children: /* @__PURE__ */ p(
         N,
         {
           as: "section",
           minWidth: a,
-          maxWidth: o,
-          minHeight: r,
-          maxHeight: t,
-          hAlign: s,
-          vAlign: e,
-          ref: m,
-          className: c(l["panel-stack"], n, "panel-stack"),
+          maxWidth: t,
+          minHeight: n,
+          maxHeight: e,
+          hAlign: o,
+          vAlign: r,
+          ref: c,
+          className: l(
+            m["panel-stack"],
+            s,
+            "panel-stack",
+            "tcn-panel-stack"
+          ),
           zIndex: 0,
           children: f
         }

package/dist/surfaces/panel/h_panel.js.map

@@ -1 +1 @@
-{"version":3,"file":"h_panel.js","sources":["../../../src/surfaces/panel/h_panel.tsx"],"sourcesContent":["import { Box, type BoxProps } from '../../stacks/box/box.js';\nimport { Alignment } from '../../stacks/types/alignment.js';\nimport classNames from 'classnames';\nimport React from 'react';\nimport styles from './panel.module.css';\nimport { HStack } from '../../stacks/h_stack.js';\n\nexport interface HPanelProps extends Omit<BoxProps, 'as'> {\n  vAlign?: Alignment;\n  hAlign?: Alignment;\n}\n\nexport const HPanel = React.forwardRef<HTMLElement, HPanelProps>(function HPanel(\n  {\n    children,\n    width,\n    height,\n    minWidth,\n    maxWidth,\n    minHeight,\n    maxHeight,\n    hAlign,\n    vAlign = 'start',\n    className,\n    ...props\n  }: HPanelProps,\n  ref\n) {\n  return (\n    <Box\n      ref={ref}\n      width={width}\n      height={height}\n      minWidth={minWidth}\n      maxWidth={maxWidth}\n      minHeight={minHeight}\n      maxHeight={maxHeight}\n      data-h-alignment={hAlign}\n      data-v-alignment={vAlign}\n      className={classNames(className, styles['panel'], 'panel')}\n      {...props}\n    >\n      <HStack\n        as=\"section\"\n        minWidth={minWidth}\n        maxWidth={maxWidth}\n        minHeight={minHeight}\n        maxHeight={maxHeight}\n        hAlign={hAlign}\n        vAlign={vAlign}\n        ref={ref}\n        className={classNames(styles['panel-stack'], className, 'panel-stack')}\n        zIndex={0}\n      >\n        {children}\n      </HStack>\n    </Box>\n  );\n});\n"],"names":["HPanel","React","children","width","height","minWidth","maxWidth","minHeight","maxHeight","hAlign","vAlign","className","props","ref","jsx","Box","classNames","styles","HStack"],"mappings":";;;;;;AAYO,MAAMA,IAASC,EAAM,WAAqC,SAC/D;AAAA,EACE,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,WAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAF;AAAA,MACA,OAAAV;AAAA,MACA,QAAAC;AAAA,MACA,UAAAC;AAAA,MACA,UAAAC;AAAA,MACA,WAAAC;AAAA,MACA,WAAAC;AAAA,MACA,oBAAkBC;AAAA,MAClB,oBAAkBC;AAAA,MAClB,WAAWM,EAAWL,GAAWM,EAAO,OAAU,OAAO;AAAA,MACxD,GAAGL;AAAA,MAEJ,UAAA,gBAAAE;AAAA,QAACI;AAAA,QAAA;AAAA,UACC,IAAG;AAAA,UACH,UAAAb;AAAA,UACA,UAAAC;AAAA,UACA,WAAAC;AAAA,UACA,WAAAC;AAAA,UACA,QAAAC;AAAA,UACA,QAAAC;AAAA,UACA,KAAAG;AAAA,UACA,WAAWG,EAAWC,EAAO,aAAa,GAAGN,GAAW,aAAa;AAAA,UACrE,QAAQ;AAAA,UAEP,UAAAT;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EAAA;AAGN,CAAC;"}
+{"version":3,"file":"h_panel.js","sources":["../../../src/surfaces/panel/h_panel.tsx"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport { Box, type BoxProps } from '../../stacks/box/box.js';\nimport { HStack } from '../../stacks/h_stack.js';\nimport type { Alignment } from '../../stacks/types/alignment.js';\n// Styles\nimport styles from './panel.module.css';\n\nexport interface HPanelProps extends Omit<BoxProps, 'as'> {\n  vAlign?: Alignment;\n  hAlign?: Alignment;\n}\n\nexport const HPanel = React.forwardRef<HTMLElement, HPanelProps>(function HPanel(\n  {\n    children,\n    width,\n    height,\n    minWidth,\n    maxWidth,\n    minHeight,\n    maxHeight,\n    hAlign,\n    vAlign = 'start',\n    className,\n    ...props\n  }: HPanelProps,\n  ref\n) {\n  return (\n    <Box\n      ref={ref}\n      width={width}\n      height={height}\n      minWidth={minWidth}\n      maxWidth={maxWidth}\n      minHeight={minHeight}\n      maxHeight={maxHeight}\n      data-h-alignment={hAlign}\n      data-v-alignment={vAlign}\n      className={classNames(\n        styles['panel'],\n        className,\n        'panel',\n        'tcn-panel',\n        'tcn-h-panel'\n      )}\n      {...props}\n    >\n      <HStack\n        as=\"section\"\n        minWidth={minWidth}\n        maxWidth={maxWidth}\n        minHeight={minHeight}\n        maxHeight={maxHeight}\n        hAlign={hAlign}\n        vAlign={vAlign}\n        ref={ref}\n        className={classNames(\n          styles['panel-stack'],\n          className,\n          'panel-stack',\n          'tcn-panel-stack'\n        )}\n        zIndex={0}\n      >\n        {children}\n      </HStack>\n    </Box>\n  );\n});\n"],"names":["HPanel","React","children","width","height","minWidth","maxWidth","minHeight","maxHeight","hAlign","vAlign","className","props","ref","jsx","Box","classNames","styles","HStack"],"mappings":";;;;;;AAaO,MAAMA,IAASC,EAAM,WAAqC,SAC/D;AAAA,EACE,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,WAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAF;AAAA,MACA,OAAAV;AAAA,MACA,QAAAC;AAAA,MACA,UAAAC;AAAA,MACA,UAAAC;AAAA,MACA,WAAAC;AAAA,MACA,WAAAC;AAAA,MACA,oBAAkBC;AAAA,MAClB,oBAAkBC;AAAA,MAClB,WAAWM;AAAA,QACTC,EAAO;AAAA,QACPN;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MAAA;AAAA,MAED,GAAGC;AAAA,MAEJ,UAAA,gBAAAE;AAAA,QAACI;AAAA,QAAA;AAAA,UACC,IAAG;AAAA,UACH,UAAAb;AAAA,UACA,UAAAC;AAAA,UACA,WAAAC;AAAA,UACA,WAAAC;AAAA,UACA,QAAAC;AAAA,UACA,QAAAC;AAAA,UACA,KAAAG;AAAA,UACA,WAAWG;AAAA,YACTC,EAAO,aAAa;AAAA,YACpBN;AAAA,YACA;AAAA,YACA;AAAA,UAAA;AAAA,UAEF,QAAQ;AAAA,UAEP,UAAAT;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EAAA;AAGN,CAAC;"}

package/dist/surfaces/panel/v_panel.d.ts

@@ -1,6 +1,6 @@
+import { default as React } from 'react';
 import { BoxProps } from '../../stacks/box/box.js';
 import { Alignment } from '../../stacks/types/alignment.js';
-import { default as React } from 'react';
 export interface VPanelProps extends Omit<BoxProps, 'as'> {
     vAlign?: Alignment;
     hAlign?: Alignment;

package/dist/surfaces/panel/v_panel.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"v_panel.d.ts","sourceRoot":"","sources":["../../../src/surfaces/panel/v_panel.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAO,KAAK,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAE7D,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAE5D,OAAO,KAAK,MAAM,OAAO,CAAC;AAG1B,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC;IACvD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB;AAED,eAAO,MAAM,MAAM,iFA8CjB,CAAC"}
+{"version":3,"file":"v_panel.d.ts","sourceRoot":"","sources":["../../../src/surfaces/panel/v_panel.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAO,KAAK,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAC7D,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAKjE,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC;IACvD,MAAM,CAAC,EAAE,SAAS,CAAC;IACnB,MAAM,CAAC,EAAE,SAAS,CAAC;CACpB;AAED,eAAO,MAAM,MAAM,iFAmDjB,CAAC"}

package/dist/surfaces/panel/v_panel.js

@@ -1,56 +1,61 @@
 import { jsx as p } from "react/jsx-runtime";
+import i from "react";
+import l from "classnames";
 import { Box as V } from "../../stacks/box/box.js";
 import { VStack as u } from "../../stacks/v_stack.js";
-import c from "classnames";
-import x from "react";
-import { s as l } from "../../panel.module-CtikcmYB.js";
-const B = x.forwardRef(function({
-  children: f,
-  width: d,
-  height: i = "100%",
+import { s as x } from "../../panel.module-DwGKncon.js";
+const z = i.forwardRef(function({
+  children: m,
+  width: f,
+  height: k = "100%",
   minWidth: a,
-  maxWidth: o,
-  minHeight: r,
-  maxHeight: t,
-  hAlign: s,
+  maxWidth: t,
+  minHeight: n,
+  maxHeight: o,
+  hAlign: r,
   vAlign: e = "start",
-  className: n,
-  ...k
-}, m) {
+  className: s,
+  ...d
+}, c) {
   return /* @__PURE__ */ p(
     V,
     {
-      ref: m,
-      width: d,
-      height: i,
+      ref: c,
+      width: f,
+      height: k,
       minWidth: a,
-      maxWidth: o,
-      minHeight: r,
-      maxHeight: t,
-      "data-h-alignment": s,
+      maxWidth: t,
+      minHeight: n,
+      maxHeight: o,
+      "data-h-alignment": r,
       "data-v-alignment": e,
-      className: c(n, l.panel, "panel"),
-      ...k,
+      className: l(s, "panel", "tcn-panel", "tcn-v-panel"),
+      ...d,
       children: /* @__PURE__ */ p(
         u,
         {
           as: "section",
           minWidth: a,
-          maxWidth: o,
-          minHeight: r,
-          maxHeight: t,
-          hAlign: s,
+          maxWidth: t,
+          minHeight: n,
+          maxHeight: o,
+          hAlign: r,
           vAlign: e,
-          ref: m,
-          className: c(l["panel-stack"], n, "panel-stack"),
+          ref: c,
+          className: l(
+            x["panel-stack"],
+            s,
+            "panel-stack",
+            "tcn-panel-stack"
+          ),
           zIndex: 0,
-          children: f
+          children: m
         }
       )
     }
   );
 });
 export {
-  B as VPanel
+  z as VPanel
 };
 //# sourceMappingURL=v_panel.js.map

package/dist/surfaces/panel/v_panel.js.map

@@ -1 +1 @@
-{"version":3,"file":"v_panel.js","sources":["../../../src/surfaces/panel/v_panel.tsx"],"sourcesContent":["import { Box, type BoxProps } from '../../stacks/box/box.js';\nimport { VStack } from '../../stacks/v_stack.js';\nimport { Alignment } from '../../stacks/types/alignment.js';\nimport classNames from 'classnames';\nimport React from 'react';\nimport styles from './panel.module.css';\n\nexport interface VPanelProps extends Omit<BoxProps, 'as'> {\n  vAlign?: Alignment;\n  hAlign?: Alignment;\n}\n\nexport const VPanel = React.forwardRef<HTMLElement, VPanelProps>(function VPanel(\n  {\n    children,\n    width,\n    height = '100%',\n    minWidth,\n    maxWidth,\n    minHeight,\n    maxHeight,\n    hAlign,\n    vAlign = 'start',\n    className,\n    ...props\n  }: VPanelProps,\n  ref\n) {\n  return (\n    <Box\n      ref={ref}\n      width={width}\n      height={height}\n      minWidth={minWidth}\n      maxWidth={maxWidth}\n      minHeight={minHeight}\n      maxHeight={maxHeight}\n      data-h-alignment={hAlign}\n      data-v-alignment={vAlign}\n      className={classNames(className, styles['panel'], 'panel')}\n      {...props}\n    >\n      <VStack\n        as=\"section\"\n        minWidth={minWidth}\n        maxWidth={maxWidth}\n        minHeight={minHeight}\n        maxHeight={maxHeight}\n        hAlign={hAlign}\n        vAlign={vAlign}\n        ref={ref}\n        className={classNames(styles['panel-stack'], className, 'panel-stack')}\n        zIndex={0}\n      >\n        {children}\n      </VStack>\n    </Box>\n  );\n});\n"],"names":["VPanel","React","children","width","height","minWidth","maxWidth","minHeight","maxHeight","hAlign","vAlign","className","props","ref","jsx","Box","classNames","styles","VStack"],"mappings":";;;;;;AAYO,MAAMA,IAASC,EAAM,WAAqC,SAC/D;AAAA,EACE,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,WAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAF;AAAA,MACA,OAAAV;AAAA,MACA,QAAAC;AAAA,MACA,UAAAC;AAAA,MACA,UAAAC;AAAA,MACA,WAAAC;AAAA,MACA,WAAAC;AAAA,MACA,oBAAkBC;AAAA,MAClB,oBAAkBC;AAAA,MAClB,WAAWM,EAAWL,GAAWM,EAAO,OAAU,OAAO;AAAA,MACxD,GAAGL;AAAA,MAEJ,UAAA,gBAAAE;AAAA,QAACI;AAAA,QAAA;AAAA,UACC,IAAG;AAAA,UACH,UAAAb;AAAA,UACA,UAAAC;AAAA,UACA,WAAAC;AAAA,UACA,WAAAC;AAAA,UACA,QAAAC;AAAA,UACA,QAAAC;AAAA,UACA,KAAAG;AAAA,UACA,WAAWG,EAAWC,EAAO,aAAa,GAAGN,GAAW,aAAa;AAAA,UACrE,QAAQ;AAAA,UAEP,UAAAT;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EAAA;AAGN,CAAC;"}
+{"version":3,"file":"v_panel.js","sources":["../../../src/surfaces/panel/v_panel.tsx"],"sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport { Box, type BoxProps } from '../../stacks/box/box.js';\nimport type { Alignment } from '../../stacks/types/alignment.js';\nimport { VStack } from '../../stacks/v_stack.js';\n// Styles\nimport styles from './panel.module.css';\n\nexport interface VPanelProps extends Omit<BoxProps, 'as'> {\n  vAlign?: Alignment;\n  hAlign?: Alignment;\n}\n\nexport const VPanel = React.forwardRef<HTMLElement, VPanelProps>(function VPanel(\n  {\n    children,\n    width,\n    height = '100%',\n    minWidth,\n    maxWidth,\n    minHeight,\n    maxHeight,\n    hAlign,\n    vAlign = 'start',\n    className,\n    ...props\n  }: VPanelProps,\n  ref\n) {\n  return (\n    <Box\n      ref={ref}\n      width={width}\n      height={height}\n      minWidth={minWidth}\n      maxWidth={maxWidth}\n      minHeight={minHeight}\n      maxHeight={maxHeight}\n      data-h-alignment={hAlign}\n      data-v-alignment={vAlign}\n      className={classNames(className, 'panel', 'tcn-panel', 'tcn-v-panel')}\n      {...props}\n    >\n      <VStack\n        as=\"section\"\n        minWidth={minWidth}\n        maxWidth={maxWidth}\n        minHeight={minHeight}\n        maxHeight={maxHeight}\n        hAlign={hAlign}\n        vAlign={vAlign}\n        ref={ref}\n        className={classNames(\n          styles['panel-stack'],\n          className,\n          'panel-stack',\n          'tcn-panel-stack'\n        )}\n        zIndex={0}\n      >\n        {children}\n      </VStack>\n    </Box>\n  );\n});\n"],"names":["VPanel","React","children","width","height","minWidth","maxWidth","minHeight","maxHeight","hAlign","vAlign","className","props","ref","jsx","Box","classNames","VStack","styles"],"mappings":";;;;;;AAaO,MAAMA,IAASC,EAAM,WAAqC,SAC/D;AAAA,EACE,UAAAC;AAAA,EACA,OAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,QAAAC,IAAS;AAAA,EACT,WAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAF;AAAA,MACA,OAAAV;AAAA,MACA,QAAAC;AAAA,MACA,UAAAC;AAAA,MACA,UAAAC;AAAA,MACA,WAAAC;AAAA,MACA,WAAAC;AAAA,MACA,oBAAkBC;AAAA,MAClB,oBAAkBC;AAAA,MAClB,WAAWM,EAAWL,GAAW,SAAS,aAAa,aAAa;AAAA,MACnE,GAAGC;AAAA,MAEJ,UAAA,gBAAAE;AAAA,QAACG;AAAA,QAAA;AAAA,UACC,IAAG;AAAA,UACH,UAAAZ;AAAA,UACA,UAAAC;AAAA,UACA,WAAAC;AAAA,UACA,WAAAC;AAAA,UACA,QAAAC;AAAA,UACA,QAAAC;AAAA,UACA,KAAAG;AAAA,UACA,WAAWG;AAAA,YACTE,EAAO,aAAa;AAAA,YACpBP;AAAA,YACA;AAAA,YACA;AAAA,UAAA;AAAA,UAEF,QAAQ;AAAA,UAEP,UAAAT;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EAAA;AAGN,CAAC;"}

package/dist/themes/index.js

@@ -1,6 +1,6 @@
-import { theme as l } from "./theme_variables.js";
-import { Theme as i } from "./theme.js";
-import { windows98StyleSheet as f } from "./themes/windows_98/windows_98_theme.js";
+import { theme as i } from "./theme_variables.js";
+import { Theme as l } from "./theme.js";
+import { windows98StyleSheet as s } from "./themes/windows_98/windows_98_theme.js";
 const n = `/* https://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 */
 html,
 body,
@@ -139,13 +139,13 @@ legend {
 /* ===== CSS VARIABLES ===== */
 :root {
   --scalar: 1;
-  --gap-small: 2px;
-  --gap-medium: 4px;
-  --gap-large: 8px;
+  --gap-small: 4px;
+  --gap-medium: 8px;
+  --gap-large: 16px;
 
-  --padding-small: 2px;
-  --padding-medium: 4px;
-  --padding-large: 8px;
+  --padding-small: 4px;
+  --padding-medium: 8px;
+  --padding-large: 16px;
 
   --status-color-disabled: #7f7f7f;
   --status-color-info: #008cff;
@@ -173,9 +173,8 @@ legend {
   --quaternary-color: #008cff;
   --quaternary-color-strong: #008cff;
 
-  --font-color: #222222;
-  --font-family:
-    "Arial", "Helvetica Neue", Helvetica, "Liberation Sans", "Arimo", sans-serif;
+  --font-color: #395578;
+  --font-family: "Lato", sans-serif;
   --font-size: 12px;
 
   --background-color-primary: #ffffff;
@@ -183,21 +182,84 @@ legend {
   --background-color-tertiary: #ffffff;
   --background-color-quaternary: #ffffff;
 
-  --foreground-color-primary: #222222;
+  --foreground-color-primary: #aaa;
   --foreground-color-secondary: #222222;
   --foreground-color-tertiary: #222222;
   --foreground-color-quaternary: #222222;
 
   --accent-color: #008cff;
+
+  --shape-radius-small: 2px;
+  --shape-radius-medium: 4px;
+  --shape-radius-large: 8px;
 }
 
 * {
   position: relative;
   box-sizing: border-box;
 }
+
+/* ===== SURFACES ===== */
+
+/* PANEL */
+.tcn-panel {
+  --v-inset: var(--padding-large);
+  background-color: var(--background-color-primary);
+  border-radius: var(--shape-radius-medium);
+
+  :where(.tcn-header) {
+    min-height: 40px;
+    border-bottom: 1px solid var(--foreground-color-primary);
+    padding: 0 var(--v-inset);
+    gap: var(--gap-medium);
+
+    :where(.tcn-title) {
+      font-weight: 700;
+    }
+
+    :where(.tcn-button) {
+      padding: 0;
+      min-width: 18px;
+      min-height: 18px;
+    }
+
+    :where(.tcn-divider) {
+      padding: 4px 0;
+      :where(.tcn-divider-line) {
+        width: 1.5px;
+        min-height: 18px;
+        height: auto;
+      }
+    }
+  }
+
+  :where(.tcn-utility-bar) {
+    min-height: 32px;
+    border-bottom: 1px solid var(--foreground-color-primary);
+    padding: 0 var(--v-inset);
+
+    :where(.tcn-button) {
+      padding: 0;
+      min-width: 18px;
+      min-height: 18px;
+    }
+  }
+
+  :where(.tcn-body) {
+    padding: 0 var(--v-inset);
+    gap: var(--gap-medium);
+  }
+
+  :where(.tcn-footer) {
+    gap: var(--gap-medium);
+    min-height: 40px;
+    border-top: 1px solid var(--foreground-color-primary);
+    padding: 0 var(--v-inset);
+  }
+}
 `, e = new CSSStyleSheet();
 e.replaceSync(n);
-const o = `/* https://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 */
+const r = `/* https://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 */
 html,
 body,
 div,
@@ -331,13 +393,13 @@ legend {
   font: inherit;
   color: inherit;
 }
-`, r = new CSSStyleSheet();
-r.replaceSync(o);
+`, o = new CSSStyleSheet();
+o.replaceSync(r);
 export {
-  i as Theme,
+  l as Theme,
   e as ergoStyleSheet,
-  r as reset,
-  l as theme,
-  f as windows98StyleSheet
+  o as reset,
+  i as theme,
+  s as windows98StyleSheet
 };
 //# sourceMappingURL=index.js.map

package/dist/themes/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../src/themes/themes/ergo/ergo_theme.css?raw","../../src/themes/themes/ergo/ergo_theme.ts","../../src/themes/stylesheets/reset.css?raw","../../src/themes/stylesheets/reset.ts"],"sourcesContent":["export default \"/* https://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 */\\nhtml,\\nbody,\\ndiv,\\nspan,\\napplet,\\nobject,\\niframe,\\nh1,\\nh2,\\nh3,\\nh4,\\nh5,\\nh6,\\np,\\nblockquote,\\npre,\\na,\\nabbr,\\nacronym,\\naddress,\\nbig,\\ncite,\\ncode,\\ndel,\\ndfn,\\nem,\\nimg,\\nins,\\nkbd,\\nq,\\ns,\\nsamp,\\nsmall,\\nstrike,\\nstrong,\\nsub,\\nsup,\\ntt,\\nvar,\\nb,\\nu,\\ni,\\ncenter,\\ndl,\\ndt,\\ndd,\\nol,\\nul,\\nli,\\nfieldset,\\nform,\\nlabel,\\nlegend,\\ntable,\\ncaption,\\ntbody,\\ntfoot,\\nthead,\\ntr,\\nth,\\ntd,\\narticle,\\naside,\\ncanvas,\\ndetails,\\nembed,\\nfigure,\\nfigcaption,\\nfooter,\\nheader,\\nhgroup,\\nmenu,\\nnav,\\noutput,\\nruby,\\nsection,\\nsummary,\\ntime,\\nmark,\\naudio,\\nvideo {\\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 */\\narticle,\\naside,\\ndetails,\\nfigcaption,\\nfigure,\\nfooter,\\nheader,\\nhgroup,\\nmenu,\\nnav,\\nsection {\\n  display: block;\\n}\\nbody {\\n  line-height: 1;\\n}\\nol,\\nul {\\n  list-style: none;\\n}\\nblockquote,\\nq {\\n  quotes: none;\\n}\\nblockquote:before,\\nblockquote:after,\\nq:before,\\nq:after {\\n  content: \\\"\\\";\\n  content: none;\\n}\\ntable {\\n  border-collapse: collapse;\\n  border-spacing: 0;\\n}\\n\\nlegend {\\n  all: unset;\\n  display: block;\\n  margin: 0;\\n  padding: 0;\\n  font: inherit;\\n  color: inherit;\\n}\\n\\n/* ===== CSS VARIABLES ===== */\\n:root {\\n  --scalar: 1;\\n  --gap-small: 2px;\\n  --gap-medium: 4px;\\n  --gap-large: 8px;\\n\\n  --padding-small: 2px;\\n  --padding-medium: 4px;\\n  --padding-large: 8px;\\n\\n  --status-color-disabled: #7f7f7f;\\n  --status-color-info: #008cff;\\n  --status-color-warning: #ff0000;\\n  --status-color-error: #ff0000;\\n\\n  --async-color-initial: #c0c0c0;\\n  --async-color-pending: #008cff;\\n  --async-color-success: #00ff00;\\n  --async-color-failed: #ff0000;\\n\\n  --primary-color-faint: #c0c0c0;\\n  --primary-color: #008cff;\\n  --primary-color-strong: #008cff;\\n\\n  --secondary-color-faint: #c0c0c0;\\n  --secondary-color: #008cff;\\n  --secondary-color-strong: #008cff;\\n\\n  --tertiary-color-faint: #c0c0c0;\\n  --tertiary-color: #008cff;\\n  --tertiary-color-strong: #008cff;\\n\\n  --quaternary-color-faint: #c0c0c0;\\n  --quaternary-color: #008cff;\\n  --quaternary-color-strong: #008cff;\\n\\n  --font-color: #222222;\\n  --font-family:\\n    \\\"Arial\\\", \\\"Helvetica Neue\\\", Helvetica, \\\"Liberation Sans\\\", \\\"Arimo\\\", sans-serif;\\n  --font-size: 12px;\\n\\n  --background-color-primary: #ffffff;\\n  --background-color-secondary: #ffffff;\\n  --background-color-tertiary: #ffffff;\\n  --background-color-quaternary: #ffffff;\\n\\n  --foreground-color-primary: #222222;\\n  --foreground-color-secondary: #222222;\\n  --foreground-color-tertiary: #222222;\\n  --foreground-color-quaternary: #222222;\\n\\n  --accent-color: #008cff;\\n}\\n\\n* {\\n  position: relative;\\n  box-sizing: border-box;\\n}\\n\"","import css from './ergo_theme.css?raw';\n\nexport const ergoStyleSheet = new CSSStyleSheet();\nergoStyleSheet.replaceSync(css);\n","export default \"/* https://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 */\\nhtml,\\nbody,\\ndiv,\\nspan,\\napplet,\\nobject,\\niframe,\\nh1,\\nh2,\\nh3,\\nh4,\\nh5,\\nh6,\\np,\\nblockquote,\\npre,\\na,\\nabbr,\\nacronym,\\naddress,\\nbig,\\ncite,\\ncode,\\ndel,\\ndfn,\\nem,\\nimg,\\nins,\\nkbd,\\nq,\\ns,\\nsamp,\\nsmall,\\nstrike,\\nstrong,\\nsub,\\nsup,\\ntt,\\nvar,\\nb,\\nu,\\ni,\\ncenter,\\ndl,\\ndt,\\ndd,\\nol,\\nul,\\nli,\\nfieldset,\\nform,\\nlabel,\\nlegend,\\ntable,\\ncaption,\\ntbody,\\ntfoot,\\nthead,\\ntr,\\nth,\\ntd,\\narticle,\\naside,\\ncanvas,\\ndetails,\\nembed,\\nfigure,\\nfigcaption,\\nfooter,\\nheader,\\nhgroup,\\nmenu,\\nnav,\\noutput,\\nruby,\\nsection,\\nsummary,\\ntime,\\nmark,\\naudio,\\nvideo {\\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 */\\narticle,\\naside,\\ndetails,\\nfigcaption,\\nfigure,\\nfooter,\\nheader,\\nhgroup,\\nmenu,\\nnav,\\nsection {\\n  display: block;\\n}\\nbody {\\n  line-height: 1;\\n}\\nol,\\nul {\\n  list-style: none;\\n}\\nblockquote,\\nq {\\n  quotes: none;\\n}\\nblockquote:before,\\nblockquote:after,\\nq:before,\\nq:after {\\n  content: \\\"\\\";\\n  content: none;\\n}\\ntable {\\n  border-collapse: collapse;\\n  border-spacing: 0;\\n}\\n\\nlegend {\\n  all: unset;\\n  display: block;\\n  margin: 0;\\n  padding: 0;\\n  font: inherit;\\n  color: inherit;\\n}\\n\"","import css from './reset.css?raw';\n\nexport const reset = new CSSStyleSheet();\nreset.replaceSync(css);\n"],"names":["css$1","ergoStyleSheet","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;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,IAAiB,IAAI,cAAA;AAClCA,EAAe,YAAYC,CAAG;ACH9B,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,GCEFC,IAAQ,IAAI,cAAA;AACzBA,EAAM,YAAYD,CAAG;"}
+{"version":3,"file":"index.js","sources":["../../src/themes/themes/ergo/ergo_theme.css?raw","../../src/themes/themes/ergo/ergo_theme.ts","../../src/themes/stylesheets/reset.css?raw","../../src/themes/stylesheets/reset.ts"],"sourcesContent":["export default \"/* https://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 */\\nhtml,\\nbody,\\ndiv,\\nspan,\\napplet,\\nobject,\\niframe,\\nh1,\\nh2,\\nh3,\\nh4,\\nh5,\\nh6,\\np,\\nblockquote,\\npre,\\na,\\nabbr,\\nacronym,\\naddress,\\nbig,\\ncite,\\ncode,\\ndel,\\ndfn,\\nem,\\nimg,\\nins,\\nkbd,\\nq,\\ns,\\nsamp,\\nsmall,\\nstrike,\\nstrong,\\nsub,\\nsup,\\ntt,\\nvar,\\nb,\\nu,\\ni,\\ncenter,\\ndl,\\ndt,\\ndd,\\nol,\\nul,\\nli,\\nfieldset,\\nform,\\nlabel,\\nlegend,\\ntable,\\ncaption,\\ntbody,\\ntfoot,\\nthead,\\ntr,\\nth,\\ntd,\\narticle,\\naside,\\ncanvas,\\ndetails,\\nembed,\\nfigure,\\nfigcaption,\\nfooter,\\nheader,\\nhgroup,\\nmenu,\\nnav,\\noutput,\\nruby,\\nsection,\\nsummary,\\ntime,\\nmark,\\naudio,\\nvideo {\\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 */\\narticle,\\naside,\\ndetails,\\nfigcaption,\\nfigure,\\nfooter,\\nheader,\\nhgroup,\\nmenu,\\nnav,\\nsection {\\n  display: block;\\n}\\nbody {\\n  line-height: 1;\\n}\\nol,\\nul {\\n  list-style: none;\\n}\\nblockquote,\\nq {\\n  quotes: none;\\n}\\nblockquote:before,\\nblockquote:after,\\nq:before,\\nq:after {\\n  content: \\\"\\\";\\n  content: none;\\n}\\ntable {\\n  border-collapse: collapse;\\n  border-spacing: 0;\\n}\\n\\nlegend {\\n  all: unset;\\n  display: block;\\n  margin: 0;\\n  padding: 0;\\n  font: inherit;\\n  color: inherit;\\n}\\n\\n/* ===== CSS VARIABLES ===== */\\n:root {\\n  --scalar: 1;\\n  --gap-small: 4px;\\n  --gap-medium: 8px;\\n  --gap-large: 16px;\\n\\n  --padding-small: 4px;\\n  --padding-medium: 8px;\\n  --padding-large: 16px;\\n\\n  --status-color-disabled: #7f7f7f;\\n  --status-color-info: #008cff;\\n  --status-color-warning: #ff0000;\\n  --status-color-error: #ff0000;\\n\\n  --async-color-initial: #c0c0c0;\\n  --async-color-pending: #008cff;\\n  --async-color-success: #00ff00;\\n  --async-color-failed: #ff0000;\\n\\n  --primary-color-faint: #c0c0c0;\\n  --primary-color: #008cff;\\n  --primary-color-strong: #008cff;\\n\\n  --secondary-color-faint: #c0c0c0;\\n  --secondary-color: #008cff;\\n  --secondary-color-strong: #008cff;\\n\\n  --tertiary-color-faint: #c0c0c0;\\n  --tertiary-color: #008cff;\\n  --tertiary-color-strong: #008cff;\\n\\n  --quaternary-color-faint: #c0c0c0;\\n  --quaternary-color: #008cff;\\n  --quaternary-color-strong: #008cff;\\n\\n  --font-color: #395578;\\n  --font-family: \\\"Lato\\\", sans-serif;\\n  --font-size: 12px;\\n\\n  --background-color-primary: #ffffff;\\n  --background-color-secondary: #ffffff;\\n  --background-color-tertiary: #ffffff;\\n  --background-color-quaternary: #ffffff;\\n\\n  --foreground-color-primary: #aaa;\\n  --foreground-color-secondary: #222222;\\n  --foreground-color-tertiary: #222222;\\n  --foreground-color-quaternary: #222222;\\n\\n  --accent-color: #008cff;\\n\\n  --shape-radius-small: 2px;\\n  --shape-radius-medium: 4px;\\n  --shape-radius-large: 8px;\\n}\\n\\n* {\\n  position: relative;\\n  box-sizing: border-box;\\n}\\n\\n/* ===== SURFACES ===== */\\n\\n/* PANEL */\\n.tcn-panel {\\n  --v-inset: var(--padding-large);\\n  background-color: var(--background-color-primary);\\n  border-radius: var(--shape-radius-medium);\\n\\n  :where(.tcn-header) {\\n    min-height: 40px;\\n    border-bottom: 1px solid var(--foreground-color-primary);\\n    padding: 0 var(--v-inset);\\n    gap: var(--gap-medium);\\n\\n    :where(.tcn-title) {\\n      font-weight: 700;\\n    }\\n\\n    :where(.tcn-button) {\\n      padding: 0;\\n      min-width: 18px;\\n      min-height: 18px;\\n    }\\n\\n    :where(.tcn-divider) {\\n      padding: 4px 0;\\n      :where(.tcn-divider-line) {\\n        width: 1.5px;\\n        min-height: 18px;\\n        height: auto;\\n      }\\n    }\\n  }\\n\\n  :where(.tcn-utility-bar) {\\n    min-height: 32px;\\n    border-bottom: 1px solid var(--foreground-color-primary);\\n    padding: 0 var(--v-inset);\\n\\n    :where(.tcn-button) {\\n      padding: 0;\\n      min-width: 18px;\\n      min-height: 18px;\\n    }\\n  }\\n\\n  :where(.tcn-body) {\\n    padding: 0 var(--v-inset);\\n    gap: var(--gap-medium);\\n  }\\n\\n  :where(.tcn-footer) {\\n    gap: var(--gap-medium);\\n    min-height: 40px;\\n    border-top: 1px solid var(--foreground-color-primary);\\n    padding: 0 var(--v-inset);\\n  }\\n}\\n\"","import css from './ergo_theme.css?raw';\n\nexport const ergoStyleSheet = new CSSStyleSheet();\nergoStyleSheet.replaceSync(css);\n","export default \"/* https://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 */\\nhtml,\\nbody,\\ndiv,\\nspan,\\napplet,\\nobject,\\niframe,\\nh1,\\nh2,\\nh3,\\nh4,\\nh5,\\nh6,\\np,\\nblockquote,\\npre,\\na,\\nabbr,\\nacronym,\\naddress,\\nbig,\\ncite,\\ncode,\\ndel,\\ndfn,\\nem,\\nimg,\\nins,\\nkbd,\\nq,\\ns,\\nsamp,\\nsmall,\\nstrike,\\nstrong,\\nsub,\\nsup,\\ntt,\\nvar,\\nb,\\nu,\\ni,\\ncenter,\\ndl,\\ndt,\\ndd,\\nol,\\nul,\\nli,\\nfieldset,\\nform,\\nlabel,\\nlegend,\\ntable,\\ncaption,\\ntbody,\\ntfoot,\\nthead,\\ntr,\\nth,\\ntd,\\narticle,\\naside,\\ncanvas,\\ndetails,\\nembed,\\nfigure,\\nfigcaption,\\nfooter,\\nheader,\\nhgroup,\\nmenu,\\nnav,\\noutput,\\nruby,\\nsection,\\nsummary,\\ntime,\\nmark,\\naudio,\\nvideo {\\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 */\\narticle,\\naside,\\ndetails,\\nfigcaption,\\nfigure,\\nfooter,\\nheader,\\nhgroup,\\nmenu,\\nnav,\\nsection {\\n  display: block;\\n}\\nbody {\\n  line-height: 1;\\n}\\nol,\\nul {\\n  list-style: none;\\n}\\nblockquote,\\nq {\\n  quotes: none;\\n}\\nblockquote:before,\\nblockquote:after,\\nq:before,\\nq:after {\\n  content: \\\"\\\";\\n  content: none;\\n}\\ntable {\\n  border-collapse: collapse;\\n  border-spacing: 0;\\n}\\n\\nlegend {\\n  all: unset;\\n  display: block;\\n  margin: 0;\\n  padding: 0;\\n  font: inherit;\\n  color: inherit;\\n}\\n\"","import css from './reset.css?raw';\n\nexport const reset = new CSSStyleSheet();\nreset.replaceSync(css);\n"],"names":["css$1","ergoStyleSheet","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;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,IAAiB,IAAI,cAAA;AAClCA,EAAe,YAAYC,CAAG;ACH9B,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,GCEFC,IAAQ,IAAI,cAAA;AACzBA,EAAM,YAAYD,CAAG;"}

package/dist/themes/themes/ergo/ergo_theme.css

@@ -1 +1 @@
-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,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{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}:root{--scalar: 1;--gap-small: 2px;--gap-medium: 4px;--gap-large: 8px;--padding-small: 2px;--padding-medium: 4px;--padding-large: 8px;--status-color-disabled: #7f7f7f;--status-color-info: #008cff;--status-color-warning: #ff0000;--status-color-error: #ff0000;--async-color-initial: #c0c0c0;--async-color-pending: #008cff;--async-color-success: #00ff00;--async-color-failed: #ff0000;--primary-color-faint: #c0c0c0;--primary-color: #008cff;--primary-color-strong: #008cff;--secondary-color-faint: #c0c0c0;--secondary-color: #008cff;--secondary-color-strong: #008cff;--tertiary-color-faint: #c0c0c0;--tertiary-color: #008cff;--tertiary-color-strong: #008cff;--quaternary-color-faint: #c0c0c0;--quaternary-color: #008cff;--quaternary-color-strong: #008cff;--font-color: #222222;--font-family: "Arial", "Helvetica Neue", Helvetica, "Liberation Sans", "Arimo", sans-serif;--font-size: 12px;--background-color-primary: #ffffff;--background-color-secondary: #ffffff;--background-color-tertiary: #ffffff;--background-color-quaternary: #ffffff;--foreground-color-primary: #222222;--foreground-color-secondary: #222222;--foreground-color-tertiary: #222222;--foreground-color-quaternary: #222222;--accent-color: #008cff}*{position:relative;box-sizing:border-box}
+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,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{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}:root{--scalar: 1;--gap-small: 4px;--gap-medium: 8px;--gap-large: 16px;--padding-small: 4px;--padding-medium: 8px;--padding-large: 16px;--status-color-disabled: #7f7f7f;--status-color-info: #008cff;--status-color-warning: #ff0000;--status-color-error: #ff0000;--async-color-initial: #c0c0c0;--async-color-pending: #008cff;--async-color-success: #00ff00;--async-color-failed: #ff0000;--primary-color-faint: #c0c0c0;--primary-color: #008cff;--primary-color-strong: #008cff;--secondary-color-faint: #c0c0c0;--secondary-color: #008cff;--secondary-color-strong: #008cff;--tertiary-color-faint: #c0c0c0;--tertiary-color: #008cff;--tertiary-color-strong: #008cff;--quaternary-color-faint: #c0c0c0;--quaternary-color: #008cff;--quaternary-color-strong: #008cff;--font-color: #395578;--font-family: "Lato", sans-serif;--font-size: 12px;--background-color-primary: #ffffff;--background-color-secondary: #ffffff;--background-color-tertiary: #ffffff;--background-color-quaternary: #ffffff;--foreground-color-primary: #aaa;--foreground-color-secondary: #222222;--foreground-color-tertiary: #222222;--foreground-color-quaternary: #222222;--accent-color: #008cff;--shape-radius-small: 2px;--shape-radius-medium: 4px;--shape-radius-large: 8px}*{position:relative;box-sizing:border-box}.tcn-panel{--v-inset: var(--padding-large);background-color:var(--background-color-primary);border-radius:var(--shape-radius-medium)}.tcn-panel :where(.tcn-header){min-height:40px;border-bottom:1px solid var(--foreground-color-primary);padding:0 var(--v-inset);gap:var(--gap-medium)}.tcn-panel :where(.tcn-header) :where(.tcn-title){font-weight:700}.tcn-panel :where(.tcn-header) :where(.tcn-button){padding:0;min-width:18px;min-height:18px}.tcn-panel :where(.tcn-header) :where(.tcn-divider){padding:4px 0}.tcn-panel :where(.tcn-header) :where(.tcn-divider) :where(.tcn-divider-line){width:1.5px;min-height:18px;height:auto}.tcn-panel :where(.tcn-utility-bar){min-height:32px;border-bottom:1px solid var(--foreground-color-primary);padding:0 var(--v-inset)}.tcn-panel :where(.tcn-utility-bar) :where(.tcn-button){padding:0;min-width:18px;min-height:18px}.tcn-panel :where(.tcn-body){padding:0 var(--v-inset);gap:var(--gap-medium)}.tcn-panel :where(.tcn-footer){gap:var(--gap-medium);min-height:40px;border-top:1px solid var(--foreground-color-primary);padding:0 var(--v-inset)}

package/dist/typography/title/title.d.ts

@@ -1,5 +1,5 @@
-import { Emphasis, Hierarchy, Size } from '../../utils/index.js';
 import { WithDetailedHTMLProps } from '../../stacks/types/as.js';
+import { Emphasis, Hierarchy, Size } from '../../utils/index.js';
 export interface TitleOwnProps {
     children?: string;
     size?: Size;

package/dist/typography/title/title.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"title.d.ts","sourceRoot":"","sources":["../../../src/typography/title/title.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AACjE,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAC;AAGtE,MAAM,WAAW,aAAa;IAC5B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,EAAE,CAAC,EAAE,MAAM,CAAC;CACb;AAED,MAAM,MAAM,UAAU,GAAG,qBAAqB,CAAC,aAAa,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC,CAAC;AAElF,wBAAgB,KAAK,CAAC,EACpB,IAAW,EACX,QAAmB,EACnB,SAAqB,EACrB,KAAK,EACL,QAAQ,EACR,SAAS,EACT,KAAU,EACV,QAAQ,EACR,MAAM,EACN,SAAS,EACT,MAAM,EACN,GAAG,EACH,UAAiB,EACjB,EAAE,GACH,EAAE,UAAU,2CAiDZ"}
+{"version":3,"file":"title.d.ts","sourceRoot":"","sources":["../../../src/typography/title/title.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAC;AACtE,OAAO,KAAK,EAAE,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAGtE,MAAM,WAAW,aAAa;IAC5B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,EAAE,CAAC,EAAE,MAAM,CAAC;CACb;AAED,MAAM,MAAM,UAAU,GAAG,qBAAqB,CAAC,aAAa,EAAE,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC,CAAC;AAElF,wBAAgB,KAAK,CAAC,EACpB,IAAW,EACX,QAAmB,EACnB,SAAqB,EACrB,KAAK,EACL,QAAQ,EACR,SAAS,EACT,KAAU,EACV,QAAQ,EACR,MAAM,EACN,SAAS,EACT,MAAM,EACN,GAAG,EACH,UAAiB,EACjB,EAAE,GACH,EAAE,UAAU,2CAiDZ"}

package/dist/typography/title/title.js

@@ -1,33 +1,33 @@
-import { jsx as c } from "react/jsx-runtime";
+import { jsx as p } from "react/jsx-runtime";
 import u from "classnames";
 import { s as x } from "../../title.module-B16de2jd.js";
 function j({
-  size: r = "md",
+  size: t = "md",
   emphasis: o = "normal",
   hierarchy: s = "primary",
   color: e,
-  children: g,
-  className: h,
+  children: c,
+  className: g,
   style: i = {},
   padStart: n,
-  padEnd: f,
-  padBottom: m,
-  padTop: t,
-  pad: d,
-  selectable: p = !0,
-  as: l
+  padEnd: r,
+  padBottom: f,
+  padTop: m,
+  pad: l,
+  selectable: h = !0,
+  as: d
 }) {
-  let a = l;
-  return l == null && (r === "lg" ? a = "h1" : r === "md" ? a = "h2" : a = "h3"), d && (i.padding = d), n && (i.paddingInlineStart = n), f && (i.paddingInlineEnd = f), t && (i.paddingTop = t), m && (i.paddingBottom = m), e && (i.color = e), /* @__PURE__ */ c(
+  let a = d;
+  return d == null && (t === "lg" ? a = "h1" : t === "md" ? a = "h2" : a = "h3"), l && (i.padding = l), n && (i.paddingInlineStart = n), r && (i.paddingInlineEnd = r), m && (i.paddingTop = m), f && (i.paddingBottom = f), e && (i.color = e), /* @__PURE__ */ p(
     a,
     {
       "data-hierarchy": s,
       "data-emphasis": o,
-      "data-selectable": p,
-      className: u(x.title, "title", h),
+      "data-selectable": h,
+      className: u(x.title, "title", "tcn-title", g),
       style: i,
-      "data-size": r,
-      children: g
+      "data-size": t,
+      children: c
     }
   );
 }

package/dist/typography/title/title.js.map

@@ -1 +1 @@
-{"version":3,"file":"title.js","sources":["../../../src/typography/title/title.tsx"],"sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\nimport { Emphasis, Hierarchy, Size } from '../../utils/index.js';\nimport type { WithDetailedHTMLProps } from '../../stacks/types/as.js';\nimport styles from './title.module.css';\n\nexport interface TitleOwnProps {\n  children?: string;\n  size?: Size;\n  emphasis?: Emphasis;\n  hierarchy?: Hierarchy;\n  color?: string;\n  pad?: string;\n  padStart?: string;\n  padEnd?: string;\n  padTop?: string;\n  padBottom?: string;\n  selectable?: boolean;\n  as?: string;\n}\n\nexport type TitleProps = WithDetailedHTMLProps<TitleOwnProps, 'h1' | 'h2' | 'h3'>;\n\nexport function Title({\n  size = 'md',\n  emphasis = 'normal',\n  hierarchy = 'primary',\n  color,\n  children,\n  className,\n  style = {},\n  padStart,\n  padEnd,\n  padBottom,\n  padTop,\n  pad,\n  selectable = true,\n  as,\n}: TitleProps) {\n  let As: React.ElementType = as as React.ElementType;\n\n  if (as == null) {\n    if (size === 'lg') {\n      As = 'h1';\n    } else if (size === 'md') {\n      As = 'h2';\n    } else {\n      As = 'h3';\n    }\n  }\n\n  if (pad) {\n    style.padding = pad;\n  }\n\n  if (padStart) {\n    style.paddingInlineStart = padStart;\n  }\n\n  if (padEnd) {\n    style.paddingInlineEnd = padEnd;\n  }\n\n  if (padTop) {\n    style.paddingTop = padTop;\n  }\n\n  if (padBottom) {\n    style.paddingBottom = padBottom;\n  }\n\n  if (color) {\n    style.color = color;\n  }\n\n  return (\n    <As\n      data-hierarchy={hierarchy}\n      data-emphasis={emphasis}\n      data-selectable={selectable}\n      className={classnames(styles['title'], 'title', className)}\n      style={style}\n      data-size={size}\n    >\n      {children}\n    </As>\n  );\n}\n"],"names":["Title","size","emphasis","hierarchy","color","children","className","style","padStart","padEnd","padBottom","padTop","pad","selectable","as","As","jsx","classnames","styles"],"mappings":";;;AAuBO,SAASA,EAAM;AAAA,EACpB,MAAAC,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,WAAAC,IAAY;AAAA,EACZ,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC,IAAQ,CAAA;AAAA,EACR,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,KAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,IAAAC;AACF,GAAe;AACb,MAAIC,IAAwBD;AAE5B,SAAIA,KAAM,SACJb,MAAS,OACXc,IAAK,OACId,MAAS,OAClBc,IAAK,OAELA,IAAK,OAILH,MACFL,EAAM,UAAUK,IAGdJ,MACFD,EAAM,qBAAqBC,IAGzBC,MACFF,EAAM,mBAAmBE,IAGvBE,MACFJ,EAAM,aAAaI,IAGjBD,MACFH,EAAM,gBAAgBG,IAGpBN,MACFG,EAAM,QAAQH,IAId,gBAAAY;AAAA,IAACD;AAAA,IAAA;AAAA,MACC,kBAAgBZ;AAAA,MAChB,iBAAeD;AAAA,MACf,mBAAiBW;AAAA,MACjB,WAAWI,EAAWC,EAAO,OAAU,SAASZ,CAAS;AAAA,MACzD,OAAAC;AAAA,MACA,aAAWN;AAAA,MAEV,UAAAI;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"title.js","sources":["../../../src/typography/title/title.tsx"],"sourcesContent":["import React from 'react';\nimport classnames from 'classnames';\nimport type { WithDetailedHTMLProps } from '../../stacks/types/as.js';\nimport type { Emphasis, Hierarchy, Size } from '../../utils/index.js';\nimport styles from './title.module.css';\n\nexport interface TitleOwnProps {\n  children?: string;\n  size?: Size;\n  emphasis?: Emphasis;\n  hierarchy?: Hierarchy;\n  color?: string;\n  pad?: string;\n  padStart?: string;\n  padEnd?: string;\n  padTop?: string;\n  padBottom?: string;\n  selectable?: boolean;\n  as?: string;\n}\n\nexport type TitleProps = WithDetailedHTMLProps<TitleOwnProps, 'h1' | 'h2' | 'h3'>;\n\nexport function Title({\n  size = 'md',\n  emphasis = 'normal',\n  hierarchy = 'primary',\n  color,\n  children,\n  className,\n  style = {},\n  padStart,\n  padEnd,\n  padBottom,\n  padTop,\n  pad,\n  selectable = true,\n  as,\n}: TitleProps) {\n  let As: React.ElementType = as as React.ElementType;\n\n  if (as == null) {\n    if (size === 'lg') {\n      As = 'h1';\n    } else if (size === 'md') {\n      As = 'h2';\n    } else {\n      As = 'h3';\n    }\n  }\n\n  if (pad) {\n    style.padding = pad;\n  }\n\n  if (padStart) {\n    style.paddingInlineStart = padStart;\n  }\n\n  if (padEnd) {\n    style.paddingInlineEnd = padEnd;\n  }\n\n  if (padTop) {\n    style.paddingTop = padTop;\n  }\n\n  if (padBottom) {\n    style.paddingBottom = padBottom;\n  }\n\n  if (color) {\n    style.color = color;\n  }\n\n  return (\n    <As\n      data-hierarchy={hierarchy}\n      data-emphasis={emphasis}\n      data-selectable={selectable}\n      className={classnames(styles['title'], 'title', 'tcn-title', className)}\n      style={style}\n      data-size={size}\n    >\n      {children}\n    </As>\n  );\n}\n"],"names":["Title","size","emphasis","hierarchy","color","children","className","style","padStart","padEnd","padBottom","padTop","pad","selectable","as","As","jsx","classnames","styles"],"mappings":";;;AAuBO,SAASA,EAAM;AAAA,EACpB,MAAAC,IAAO;AAAA,EACP,UAAAC,IAAW;AAAA,EACX,WAAAC,IAAY;AAAA,EACZ,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,OAAAC,IAAQ,CAAA;AAAA,EACR,UAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,KAAAC;AAAA,EACA,YAAAC,IAAa;AAAA,EACb,IAAAC;AACF,GAAe;AACb,MAAIC,IAAwBD;AAE5B,SAAIA,KAAM,SACJb,MAAS,OACXc,IAAK,OACId,MAAS,OAClBc,IAAK,OAELA,IAAK,OAILH,MACFL,EAAM,UAAUK,IAGdJ,MACFD,EAAM,qBAAqBC,IAGzBC,MACFF,EAAM,mBAAmBE,IAGvBE,MACFJ,EAAM,aAAaI,IAGjBD,MACFH,EAAM,gBAAgBG,IAGpBN,MACFG,EAAM,QAAQH,IAId,gBAAAY;AAAA,IAACD;AAAA,IAAA;AAAA,MACC,kBAAgBZ;AAAA,MAChB,iBAAeD;AAAA,MACf,mBAAiBW;AAAA,MACjB,WAAWI,EAAWC,EAAO,OAAU,SAAS,aAAaZ,CAAS;AAAA,MACtE,OAAAC;AAAA,MACA,aAAWN;AAAA,MAEV,UAAAI;AAAA,IAAA;AAAA,EAAA;AAGP;"}

package/dist/v_body.css

@@ -0,0 +1 @@
+._v-body_d8f1917{min-height:0;flex-grow:1;width:100%}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tcn/ui",
-  "version": "0.0.1",
+  "version": "0.0.3",
   "type": "module",
   "description": "",
   "author": "TCN",
@@ -109,8 +109,8 @@
   "dependencies": {
     "classnames": "^2.5.1",
     "react-color": "^2.19.3",
-    "@tcn/icons": "2.1.0",
-    "@tcn/state": "1.0.0"
+    "@tcn/state": "1.0.0",
+    "@tcn/icons": "2.1.0"
   },
   "scripts": {
     "build": "vite build",