@tcn/ui 0.8.1 → 0.10.0

package/dist/layouts/header/header.d.ts

@@ -1,7 +1,7 @@
 import { default as React } from 'react';
-import { HStackProps } from '../../stacks/h_stack.js';
 import { Hierarchy, Size } from '../../utils/index.js';
-export interface HeaderProps extends Omit<HStackProps, 'as'> {
+import { BarProps } from '../bar/bar.js';
+export interface HeaderProps extends Omit<BarProps, 'as'> {
     hierarchy?: Hierarchy;
     size?: Size;
 }

package/dist/layouts/header/header.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"header.d.ts","sourceRoot":"","sources":["../../../src/layouts/header/header.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,yBAAyB,CAAC;AACnE,OAAO,KAAK,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAG5D,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC;IAC1D,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,IAAI,CAAC,EAAE,IAAI,CAAC;CACb;AAED,eAAO,MAAM,MAAM,iFAwBjB,CAAC"}
+{"version":3,"file":"header.d.ts","sourceRoot":"","sources":["../../../src/layouts/header/header.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,sBAAsB,CAAC;AAC5D,OAAO,EAAO,KAAK,QAAQ,EAAE,MAAM,eAAe,CAAC;AAEnD,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC;IACvD,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,IAAI,CAAC,EAAE,IAAI,CAAC;CACb;AAED,eAAO,MAAM,MAAM,iFAgBjB,CAAC"}

package/dist/layouts/header/header.js

@@ -1,30 +1,22 @@
-import { jsx as c } from "react/jsx-runtime";
-import m from "react";
+import { jsx as m } from "react/jsx-runtime";
+import c from "react";
 import { clsx as f } from "clsx";
-import { HStack as n } from "../../stacks/h_stack.js";
-import '../../header.css';const h = "_header_3155fa4", i = { header: h }, y = m.forwardRef(function({
-  hierarchy: e = "secondary",
-  height: r = "auto",
-  children: a,
-  className: t,
-  size: o = "md",
-  ...d
-}, s) {
-  return /* @__PURE__ */ c(
-    n,
+import { Bar as s } from "../bar/bar.js";
+const u = c.forwardRef(function({ hierarchy: r = "secondary", size: a = "md", children: e, className: o, ...t }, d) {
+  return /* @__PURE__ */ m(
+    s,
     {
-      ref: s,
+      ref: d,
       as: "header",
-      className: f(i.header, t, "tcn-header"),
-      "data-hierarchy": e,
-      "data-size": o,
-      height: r,
-      ...d,
-      children: a
+      className: f(o, "tcn-header"),
+      "data-hierarchy": r,
+      "data-size": a,
+      ...t,
+      children: e
     }
   );
 });
 export {
-  y as Header
+  u as Header
 };
 //# sourceMappingURL=header.js.map

package/dist/layouts/header/header.js.map

@@ -1 +1 @@
-{"version":3,"file":"header.js","sources":["../../../src/layouts/header/header.tsx"],"sourcesContent":["import React from 'react';\nimport { clsx } from 'clsx';\nimport { HStack, type HStackProps } from '../../stacks/h_stack.js';\nimport type { Hierarchy, Size } from '../../utils/index.js';\nimport styles from './header.module.css';\n\nexport interface HeaderProps extends Omit<HStackProps, 'as'> {\n  hierarchy?: Hierarchy;\n  size?: Size;\n}\n\nexport const Header = React.forwardRef<HTMLElement, HeaderProps>(function Header(\n  {\n    hierarchy = 'secondary',\n    height = 'auto',\n    children,\n    className,\n    size = 'md',\n    ...props\n  }: HeaderProps,\n  ref\n) {\n  return (\n    <HStack\n      ref={ref}\n      as=\"header\"\n      className={clsx(styles.header, className, 'tcn-header')}\n      data-hierarchy={hierarchy}\n      data-size={size}\n      height={height}\n      {...props}\n    >\n      {children}\n    </HStack>\n  );\n});\n"],"names":["Header","React","hierarchy","height","children","className","size","props","ref","jsx","HStack","clsx","styles"],"mappings":";;;;gDAWaA,IAASC,EAAM,WAAqC,SAC/D;AAAA,EACE,WAAAC,IAAY;AAAA,EACZ,QAAAC,IAAS;AAAA,EACT,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,MAAAC,IAAO;AAAA,EACP,GAAGC;AACL,GACAC,GACA;AACA,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAF;AAAA,MACA,IAAG;AAAA,MACH,WAAWG,EAAKC,EAAO,QAAQP,GAAW,YAAY;AAAA,MACtD,kBAAgBH;AAAA,MAChB,aAAWI;AAAA,MACX,QAAAH;AAAA,MACC,GAAGI;AAAA,MAEH,UAAAH;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;"}
+{"version":3,"file":"header.js","sources":["../../../src/layouts/header/header.tsx"],"sourcesContent":["import React from 'react';\nimport { clsx } from 'clsx';\nimport type { Hierarchy, Size } from '../../utils/index.js';\nimport { Bar, type BarProps } from '../bar/bar.js';\n\nexport interface HeaderProps extends Omit<BarProps, 'as'> {\n  hierarchy?: Hierarchy;\n  size?: Size;\n}\n\nexport const Header = React.forwardRef<HTMLElement, HeaderProps>(function Header(\n  { hierarchy = 'secondary', size = 'md', children, className, ...props }: HeaderProps,\n  ref\n) {\n  return (\n    <Bar\n      ref={ref}\n      as=\"header\"\n      className={clsx(className, 'tcn-header')}\n      data-hierarchy={hierarchy}\n      data-size={size}\n      {...props}\n    >\n      {children}\n    </Bar>\n  );\n});\n"],"names":["Header","React","hierarchy","size","children","className","props","ref","jsx","Bar","clsx"],"mappings":";;;;AAUO,MAAMA,IAASC,EAAM,WAAqC,SAC/D,EAAE,WAAAC,IAAY,aAAa,MAAAC,IAAO,MAAM,UAAAC,GAAU,WAAAC,GAAW,GAAGC,EAAA,GAChEC,GACA;AACA,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAF;AAAA,MACA,IAAG;AAAA,MACH,WAAWG,EAAKL,GAAW,YAAY;AAAA,MACvC,kBAAgBH;AAAA,MAChB,aAAWC;AAAA,MACV,GAAGG;AAAA,MAEH,UAAAF;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;"}

package/dist/layouts/index.d.ts

@@ -14,9 +14,10 @@ export { UtilityBar, type UtilityBarProps } from './utility_bar/utility_bar.js';
 export { Row } from './row/row.js';
 export { Section } from './section/section.js';
 export { Heading, type HeadingOwnProps } from './section/heading.js';
+export { Responsive, type ResponsiveProps } from './responsive/responsive.js';
+export { Breakpoint, type BreakpointProps } from './responsive/breakpoint.js';
 export { TTable, THead, TBody, TFoot, TR, TH, TD } from './table/table.js';
 export { Rail, type RailProps } from './rail/rail.js';
-export { Main, type MainProps } from './rail/main/main.js';
 export { Side, type SideProps } from './rail/side/side.js';
 export { UtilityStrip, type UtilityStripProps, } from './rail/utility_strip/utility_strip.js';
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/layouts/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,sBAAsB,CAAC;AACrC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,8BAA8B,CAAC;AAC7C,cAAc,kCAAkC,CAAC;AAEjD,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAC9D,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAC9D,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAChF,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AACnC,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC/C,OAAO,EAAE,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,sBAAsB,CAAC;AAErE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AAE3E,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,gBAAgB,CAAC;AACtD,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAC3D,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAC3D,OAAO,EACL,YAAY,EACZ,KAAK,iBAAiB,GACvB,MAAM,uCAAuC,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/layouts/index.ts"],"names":[],"mappings":"AAAA,cAAc,oBAAoB,CAAC;AACnC,cAAc,sBAAsB,CAAC;AACrC,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,8BAA8B,CAAC;AAC7C,cAAc,kCAAkC,CAAC;AAEjD,OAAO,EAAE,QAAQ,EAAE,KAAK,aAAa,EAAE,MAAM,wBAAwB,CAAC;AACtE,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EAAE,KAAK,EAAE,KAAK,UAAU,EAAE,MAAM,kBAAkB,CAAC;AAC1D,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAC9D,OAAO,EAAE,MAAM,EAAE,KAAK,WAAW,EAAE,MAAM,oBAAoB,CAAC;AAC9D,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,8BAA8B,CAAC;AAChF,OAAO,EAAE,GAAG,EAAE,MAAM,cAAc,CAAC;AACnC,OAAO,EAAE,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAC/C,OAAO,EAAE,OAAO,EAAE,KAAK,eAAe,EAAE,MAAM,sBAAsB,CAAC;AACrE,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAC9E,OAAO,EAAE,UAAU,EAAE,KAAK,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAE9E,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,EAAE,MAAM,kBAAkB,CAAC;AAE3E,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,gBAAgB,CAAC;AACtD,OAAO,EAAE,IAAI,EAAE,KAAK,SAAS,EAAE,MAAM,qBAAqB,CAAC;AAC3D,OAAO,EACL,YAAY,EACZ,KAAK,iBAAiB,GACvB,MAAM,uCAAuC,CAAC"}

package/dist/layouts/index.js

@@ -1,51 +1,53 @@
 import { Column as e } from "./column/column.js";
-import { Divider as f } from "./divider/divider.js";
-import { Grid as p } from "./grid/grid.js";
+import { Divider as p } from "./divider/divider.js";
+import { Grid as m } from "./grid/grid.js";
 import { Item as i } from "./list/item.js";
 import { List as a } from "./list/list.js";
 import { SidebarEnd as S } from "./sidebar_end/sidebar_end.js";
 import { SidebarStart as n } from "./sidebar_start/sidebar_start.js";
-import { Scaffold as H } from "./scaffold/scaffold.js";
-import { HBody as b } from "./body/h_body.js";
-import { VBody as c } from "./body/v_body.js";
-import { Footer as F } from "./footer/footer.js";
-import { Header as g } from "./header/header.js";
-import { UtilityBar as u } from "./utility_bar/utility_bar.js";
-import { Row as w } from "./row/row.js";
-import { Section as E } from "./section/section.js";
-import { Heading as I } from "./section/heading.js";
-import { TBody as M, TD as V, TFoot as h, TH as j, THead as k, TR as q, TTable as z } from "./table/table.js";
-import { Rail as J } from "./rail/rail.js";
-import { Main as N } from "./rail/main/main.js";
-import { Side as P } from "./rail/side/side.js";
-import { UtilityStrip as W } from "./rail/utility_strip/utility_strip.js";
+import { Scaffold as B } from "./scaffold/scaffold.js";
+import { HBody as R } from "./body/h_body.js";
+import { VBody as s } from "./body/v_body.js";
+import { Footer as v } from "./footer/footer.js";
+import { Header as F } from "./header/header.js";
+import { UtilityBar as g } from "./utility_bar/utility_bar.js";
+import { Row as u } from "./row/row.js";
+import { Section as C } from "./section/section.js";
+import { Heading as G } from "./section/heading.js";
+import { Responsive as L } from "./responsive/responsive.js";
+import { Breakpoint as h } from "./responsive/breakpoint.js";
+import { TBody as q, TD as z, TFoot as A, TH as J, THead as K, TR as M, TTable as N } from "./table/table.js";
+import { Rail as P } from "./rail/rail.js";
+import { Side as W } from "./rail/side/side.js";
+import { UtilityStrip as Y } from "./rail/utility_strip/utility_strip.js";
 export {
+  h as Breakpoint,
   e as Column,
-  f as Divider,
-  F as Footer,
-  p as Grid,
-  b as HBody,
-  g as Header,
-  I as Heading,
+  p as Divider,
+  v as Footer,
+  m as Grid,
+  R as HBody,
+  F as Header,
+  G as Heading,
   i as Item,
   a as List,
-  N as Main,
-  J as Rail,
-  w as Row,
-  H as Scaffold,
-  E as Section,
-  P as Side,
+  P as Rail,
+  L as Responsive,
+  u as Row,
+  B as Scaffold,
+  C as Section,
+  W as Side,
   S as SidebarEnd,
   n as SidebarStart,
-  M as TBody,
-  V as TD,
-  h as TFoot,
-  j as TH,
-  k as THead,
-  q as TR,
-  z as TTable,
-  u as UtilityBar,
-  W as UtilityStrip,
-  c as VBody
+  q as TBody,
+  z as TD,
+  A as TFoot,
+  J as TH,
+  K as THead,
+  M as TR,
+  N as TTable,
+  g as UtilityBar,
+  Y as UtilityStrip,
+  s as VBody
 };
 //# sourceMappingURL=index.js.map

package/dist/layouts/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/layouts/rail/rail.js

@@ -1,55 +1,55 @@
-import { jsx as l } from "react/jsx-runtime";
-import p from "react";
-import { clsx as e } from "clsx";
-import { Box as _ } from "../../stacks/box/box.js";
-import { HStack as y } from "../../stacks/h_stack.js";
-import '../../rail.css';const R = "_rail-stack_76bc40f", b = "_tcn-body_a4d9cc2", u = { "rail-stack": R, "tcn-body": b }, z = p.forwardRef(function({
-  children: i,
+import { jsx as i } from "react/jsx-runtime";
+import d from "react";
+import { clsx as n } from "clsx";
+import { Box as R } from "../../stacks/box/box.js";
+import { HStack as u } from "../../stacks/h_stack.js";
+import '../../rail.css';const x = "_rail_adfa91f", N = "_rail-stack_76bc40f", f = { rail: x, "rail-stack": N }, B = d.forwardRef(function({
+  children: e,
   width: m,
-  height: f = "100%",
-  minWidth: t,
-  maxWidth: a,
-  minHeight: c,
-  maxHeight: r,
-  hAlign: o = "start",
-  vAlign: s = "start",
-  className: d,
-  ...k
-}, n) {
-  return /* @__PURE__ */ l(
-    _,
+  height: k = "100%",
+  minWidth: a,
+  maxWidth: t,
+  minHeight: r,
+  maxHeight: c,
+  hAlign: s = "start",
+  vAlign: o = "start",
+  className: p,
+  ..._
+}, l) {
+  return /* @__PURE__ */ i(
+    R,
     {
-      ref: n,
+      ref: l,
       width: m,
-      height: f,
-      minWidth: t,
-      maxWidth: a,
-      minHeight: c,
-      maxHeight: r,
-      "data-h-alignment": o,
-      "data-v-alignment": s,
-      className: e(d, "tcn-rail"),
-      ...k,
-      children: /* @__PURE__ */ l(
-        y,
+      height: k,
+      minWidth: a,
+      maxWidth: t,
+      minHeight: r,
+      maxHeight: c,
+      "data-h-alignment": s,
+      "data-v-alignment": o,
+      className: n(p, f.rail, "tcn-rail"),
+      ..._,
+      children: /* @__PURE__ */ i(
+        u,
         {
           as: "section",
-          minWidth: t,
-          maxWidth: a,
-          minHeight: c,
-          maxHeight: r,
-          hAlign: o,
-          vAlign: s,
-          ref: n,
-          className: e(u["rail-stack"], "tcn-rail-stack"),
+          minWidth: a,
+          maxWidth: t,
+          minHeight: r,
+          maxHeight: c,
+          hAlign: s,
+          vAlign: o,
+          ref: l,
+          className: n(f["rail-stack"], "tcn-rail-stack"),
           zIndex: 0,
-          children: i
+          children: e
         }
       )
     }
   );
 });
 export {
-  z as Rail
+  B as Rail
 };
 //# sourceMappingURL=rail.js.map

package/dist/layouts/rail/rail.js.map

@@ -1 +1 @@
-{"version":3,"file":"rail.js","sources":["../../../src/layouts/rail/rail.tsx"],"sourcesContent":["import React from 'react';\nimport { clsx } from 'clsx';\nimport { Box, type BoxProps } from '../../stacks/box/box.js';\nimport type { Alignment } from '../../stacks/types/alignment.js';\nimport { HStack } from '../../stacks/h_stack.js';\n\n// Styles\nimport styles from './rail.module.css';\n\nexport interface RailProps extends Omit<BoxProps, 'as'> {\n  vAlign?: Alignment;\n  hAlign?: Alignment;\n}\n\n// WIP: This component is not fully implemented.\nexport const Rail = React.forwardRef<HTMLElement, RailProps>(function Rail(\n  {\n    children,\n    width,\n    height = '100%',\n    minWidth,\n    maxWidth,\n    minHeight,\n    maxHeight,\n    hAlign = 'start',\n    vAlign = 'start',\n    className,\n    ...props\n  }: RailProps,\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={clsx(className, 'tcn-rail')}\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={clsx(styles['rail-stack'], 'tcn-rail-stack')}\n        zIndex={0}\n      >\n        {children}\n      </HStack>\n    </Box>\n  );\n});\n"],"names":["Rail","React","children","width","height","minWidth","maxWidth","minHeight","maxHeight","hAlign","vAlign","className","props","ref","jsx","Box","clsx","HStack","styles"],"mappings":";;;;;kGAeaA,IAAOC,EAAM,WAAmC,SAC3D;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,IAAS;AAAA,EACT,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,EAAKL,GAAW,UAAU;AAAA,MACpC,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,EAAKE,EAAO,YAAY,GAAG,gBAAgB;AAAA,UACtD,QAAQ;AAAA,UAEP,UAAAhB;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EAAA;AAGN,CAAC;"}
+{"version":3,"file":"rail.js","sources":["../../../src/layouts/rail/rail.tsx"],"sourcesContent":["import React from 'react';\nimport { clsx } from 'clsx';\nimport { Box, type BoxProps } from '../../stacks/box/box.js';\nimport type { Alignment } from '../../stacks/types/alignment.js';\nimport { HStack } from '../../stacks/h_stack.js';\n\n// Styles\nimport styles from './rail.module.css';\n\nexport interface RailProps extends Omit<BoxProps, 'as'> {\n  vAlign?: Alignment;\n  hAlign?: Alignment;\n}\n\n// WIP: This component is not fully implemented.\nexport const Rail = React.forwardRef<HTMLElement, RailProps>(function Rail(\n  {\n    children,\n    width,\n    height = '100%',\n    minWidth,\n    maxWidth,\n    minHeight,\n    maxHeight,\n    hAlign = 'start',\n    vAlign = 'start',\n    className,\n    ...props\n  }: RailProps,\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={clsx(className, styles['rail'], 'tcn-rail')}\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={clsx(styles['rail-stack'], 'tcn-rail-stack')}\n        zIndex={0}\n      >\n        {children}\n      </HStack>\n    </Box>\n  );\n});\n"],"names":["Rail","React","children","width","height","minWidth","maxWidth","minHeight","maxHeight","hAlign","vAlign","className","props","ref","jsx","Box","clsx","styles","HStack"],"mappings":";;;;;wFAeaA,IAAOC,EAAM,WAAmC,SAC3D;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,IAAS;AAAA,EACT,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,EAAKL,GAAWM,EAAO,MAAS,UAAU;AAAA,MACpD,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,EAAKC,EAAO,YAAY,GAAG,gBAAgB;AAAA,UACtD,QAAQ;AAAA,UAEP,UAAAf;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EAAA;AAGN,CAAC;"}

package/dist/layouts/rail/side/side.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"side.d.ts","sourceRoot":"","sources":["../../../../src/layouts/rail/side/side.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAKtE,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC;CAAG;AAE7D,eAAO,MAAM,IAAI,+EAef,CAAC"}
+{"version":3,"file":"side.d.ts","sourceRoot":"","sources":["../../../../src/layouts/rail/side/side.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAItE,MAAM,WAAW,SAAU,SAAQ,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC;CAAG;AAE7D,eAAO,MAAM,IAAI,+EAef,CAAC"}

package/dist/layouts/rail/side/side.js

@@ -7,9 +7,9 @@ import '../../../side.css';const a = "_side_499f5c3", n = { side: a }, x = c.for
     m,
     {
       ref: r,
+      width: s,
       className: f(n.side, "tcn-side", o),
       as: "section",
-      width: s,
       ...i,
       children: t
     }

package/dist/layouts/rail/side/side.js.map

@@ -1 +1 @@
-{"version":3,"file":"side.js","sources":["../../../../src/layouts/rail/side/side.tsx"],"sourcesContent":["import React from 'react';\nimport { clsx } from 'clsx';\nimport { VStack, type VStackProps } from '../../../stacks/v_stack.js';\n\nimport styles from './side.module.css';\n\n// UtilityBar\nexport interface SideProps extends Omit<VStackProps, 'as'> {}\n\nexport const Side = React.forwardRef<HTMLElement, SideProps>(function UtilityStrip(\n  { children, className, width = 'auto', ...props }: SideProps,\n  ref\n) {\n  return (\n    <VStack\n      ref={ref}\n      className={clsx(styles['side'], 'tcn-side', className)}\n      as=\"section\"\n      width={width}\n      {...props}\n    >\n      {children}\n    </VStack>\n  );\n});\n"],"names":["Side","React","children","className","width","props","ref","jsx","VStack","clsx","styles"],"mappings":";;;;4CASaA,IAAOC,EAAM,WAAmC,SAC3D,EAAE,UAAAC,GAAU,WAAAC,GAAW,OAAAC,IAAQ,QAAQ,GAAGC,EAAA,GAC1CC,GACA;AACA,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAF;AAAA,MACA,WAAWG,EAAKC,EAAO,MAAS,YAAYP,CAAS;AAAA,MACrD,IAAG;AAAA,MACH,OAAAC;AAAA,MACC,GAAGC;AAAA,MAEH,UAAAH;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;"}
+{"version":3,"file":"side.js","sources":["../../../../src/layouts/rail/side/side.tsx"],"sourcesContent":["import React from 'react';\nimport { clsx } from 'clsx';\nimport { VStack, type VStackProps } from '../../../stacks/v_stack.js';\n\nimport styles from './side.module.css';\n\nexport interface SideProps extends Omit<VStackProps, 'as'> {}\n\nexport const Side = React.forwardRef<HTMLElement, SideProps>(function UtilityStrip(\n  { children, className, width = 'auto', ...props }: SideProps,\n  ref\n) {\n  return (\n    <VStack\n      ref={ref}\n      width={width}\n      className={clsx(styles['side'], 'tcn-side', className)}\n      as=\"section\"\n      {...props}\n    >\n      {children}\n    </VStack>\n  );\n});\n"],"names":["Side","React","children","className","width","props","ref","jsx","VStack","clsx","styles"],"mappings":";;;;4CAQaA,IAAOC,EAAM,WAAmC,SAC3D,EAAE,UAAAC,GAAU,WAAAC,GAAW,OAAAC,IAAQ,QAAQ,GAAGC,EAAA,GAC1CC,GACA;AACA,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAF;AAAA,MACA,OAAAF;AAAA,MACA,WAAWK,EAAKC,EAAO,MAAS,YAAYP,CAAS;AAAA,MACrD,IAAG;AAAA,MACF,GAAGE;AAAA,MAEH,UAAAH;AAAA,IAAA;AAAA,EAAA;AAGP,CAAC;"}

package/dist/layouts/rail/utility_strip/utility_strip.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"utility_strip.d.ts","sourceRoot":"","sources":["../../../../src/layouts/rail/utility_strip/utility_strip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAC/D,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAKtE,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC;IAChE,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,IAAI,CAAC,EAAE,IAAI,CAAC;CACb;AAED,eAAO,MAAM,YAAY,uFA0BxB,CAAC"}
+{"version":3,"file":"utility_strip.d.ts","sourceRoot":"","sources":["../../../../src/layouts/rail/utility_strip/utility_strip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,KAAK,EAAE,SAAS,EAAE,IAAI,EAAE,MAAM,yBAAyB,CAAC;AAC/D,OAAO,EAAU,KAAK,WAAW,EAAE,MAAM,4BAA4B,CAAC;AAItE,MAAM,WAAW,iBAAkB,SAAQ,IAAI,CAAC,WAAW,EAAE,IAAI,CAAC;IAChE,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,IAAI,CAAC,EAAE,IAAI,CAAC;CACb;AAED,eAAO,MAAM,YAAY,uFA8BxB,CAAC"}

package/dist/layouts/rail/utility_strip/utility_strip.js

@@ -1,32 +1,36 @@
-import { jsx as p } from "react/jsx-runtime";
-import c from "react";
-import { clsx as l } from "clsx";
-import { VStack as m } from "../../../stacks/v_stack.js";
-import '../../../utility_strip.css';const y = "_utility-strip_23b31df", f = { "utility-strip": y }, h = c.forwardRef(
+import { jsx as l } from "react/jsx-runtime";
+import m from "react";
+import { clsx as y } from "clsx";
+import { VStack as f } from "../../../stacks/v_stack.js";
+import '../../../utility_strip.css';const n = "_utility-strip_23b31df", u = { "utility-strip": n }, R = m.forwardRef(
   function({
     children: t,
     className: i,
     width: r = "auto",
-    hierarchy: o = "secondary",
-    size: s = "md",
-    ...a
-  }, e) {
-    return /* @__PURE__ */ p(
-      m,
+    hierarchy: s = "secondary",
+    vAlign: a = "start",
+    hAlign: o = "center",
+    size: e = "md",
+    ...c
+  }, p) {
+    return /* @__PURE__ */ l(
+      f,
       {
-        ref: e,
+        ref: p,
         as: "header",
-        className: l(f["utility-strip"], "tcn-utility-strip", i),
-        "data-hierarchy": o,
-        "data-size": s,
+        vAlign: a,
+        hAlign: o,
+        className: y(u["utility-strip"], "tcn-utility-strip", i),
+        "data-hierarchy": s,
+        "data-size": e,
         width: r,
-        ...a,
+        ...c,
         children: t
       }
     );
   }
 );
 export {
-  h as UtilityStrip
+  R as UtilityStrip
 };
 //# sourceMappingURL=utility_strip.js.map

package/dist/layouts/rail/utility_strip/utility_strip.js.map

@@ -1 +1 @@
-{"version":3,"file":"utility_strip.js","sources":["../../../../src/layouts/rail/utility_strip/utility_strip.tsx"],"sourcesContent":["import React from 'react';\nimport { clsx } from 'clsx';\nimport type { Hierarchy, Size } from '../../../utils/index.js';\nimport { VStack, type VStackProps } from '../../../stacks/v_stack.js';\n\nimport styles from './utility_strip.module.css';\n\n// UtilityBar\nexport interface UtilityStripProps extends Omit<VStackProps, 'as'> {\n  hierarchy?: Hierarchy;\n  size?: Size;\n}\n\nexport const UtilityStrip = React.forwardRef<HTMLElement, UtilityStripProps>(\n  function UtilityStrip(\n    {\n      children,\n      className,\n      width = 'auto',\n      hierarchy = 'secondary',\n      size = 'md',\n      ...props\n    }: UtilityStripProps,\n    ref\n  ) {\n    return (\n      <VStack\n        ref={ref}\n        as=\"header\"\n        className={clsx(styles['utility-strip'], 'tcn-utility-strip', className)}\n        data-hierarchy={hierarchy}\n        data-size={size}\n        width={width}\n        {...props}\n      >\n        {children}\n      </VStack>\n    );\n  }\n);\n"],"names":["UtilityStrip","React","children","className","width","hierarchy","size","props","ref","jsx","VStack","clsx","styles"],"mappings":";;;;gEAaaA,IAAeC,EAAM;AAAA,EAChC,SACE;AAAA,IACE,UAAAC;AAAA,IACA,WAAAC;AAAA,IACA,OAAAC,IAAQ;AAAA,IACR,WAAAC,IAAY;AAAA,IACZ,MAAAC,IAAO;AAAA,IACP,GAAGC;AAAA,EAAA,GAELC,GACA;AACA,WACE,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,KAAAF;AAAA,QACA,IAAG;AAAA,QACH,WAAWG,EAAKC,EAAO,eAAe,GAAG,qBAAqBT,CAAS;AAAA,QACvE,kBAAgBE;AAAA,QAChB,aAAWC;AAAA,QACX,OAAAF;AAAA,QACC,GAAGG;AAAA,QAEH,UAAAL;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AACF;"}
+{"version":3,"file":"utility_strip.js","sources":["../../../../src/layouts/rail/utility_strip/utility_strip.tsx"],"sourcesContent":["import React from 'react';\nimport { clsx } from 'clsx';\nimport type { Hierarchy, Size } from '../../../utils/index.js';\nimport { VStack, type VStackProps } from '../../../stacks/v_stack.js';\n\nimport styles from './utility_strip.module.css';\n\nexport interface UtilityStripProps extends Omit<VStackProps, 'as'> {\n  hierarchy?: Hierarchy;\n  size?: Size;\n}\n\nexport const UtilityStrip = React.forwardRef<HTMLElement, UtilityStripProps>(\n  function UtilityStrip(\n    {\n      children,\n      className,\n      width = 'auto',\n      hierarchy = 'secondary',\n      vAlign = 'start',\n      hAlign = 'center',\n      size = 'md',\n      ...props\n    }: UtilityStripProps,\n    ref\n  ) {\n    return (\n      <VStack\n        ref={ref}\n        as=\"header\"\n        vAlign={vAlign}\n        hAlign={hAlign}\n        className={clsx(styles['utility-strip'], 'tcn-utility-strip', className)}\n        data-hierarchy={hierarchy}\n        data-size={size}\n        width={width}\n        {...props}\n      >\n        {children}\n      </VStack>\n    );\n  }\n);\n"],"names":["UtilityStrip","React","children","className","width","hierarchy","vAlign","hAlign","size","props","ref","jsx","VStack","clsx","styles"],"mappings":";;;;gEAYaA,IAAeC,EAAM;AAAA,EAChC,SACE;AAAA,IACE,UAAAC;AAAA,IACA,WAAAC;AAAA,IACA,OAAAC,IAAQ;AAAA,IACR,WAAAC,IAAY;AAAA,IACZ,QAAAC,IAAS;AAAA,IACT,QAAAC,IAAS;AAAA,IACT,MAAAC,IAAO;AAAA,IACP,GAAGC;AAAA,EAAA,GAELC,GACA;AACA,WACE,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,KAAAF;AAAA,QACA,IAAG;AAAA,QACH,QAAAJ;AAAA,QACA,QAAAC;AAAA,QACA,WAAWM,EAAKC,EAAO,eAAe,GAAG,qBAAqBX,CAAS;AAAA,QACvE,kBAAgBE;AAAA,QAChB,aAAWG;AAAA,QACX,OAAAJ;AAAA,QACC,GAAGK;AAAA,QAEH,UAAAP;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AACF;"}

package/dist/layouts/responsive/breakpoint.d.ts

@@ -0,0 +1,11 @@
+export interface BreakpointProps {
+    from?: number | string;
+    to?: number | string;
+    children: React.ReactNode;
+}
+export interface InternalBreakpointProps extends BreakpointProps {
+    width: number;
+}
+export declare function Breakpoint(_: BreakpointProps): null;
+export declare function InternalBreakpoint(props: InternalBreakpointProps): import('react').ReactNode;
+//# sourceMappingURL=breakpoint.d.ts.map

package/dist/layouts/responsive/breakpoint.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"breakpoint.d.ts","sourceRoot":"","sources":["../../../src/layouts/responsive/breakpoint.tsx"],"names":[],"mappings":"AAAA,MAAM,WAAW,eAAe;IAC9B,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,EAAE,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;IACrB,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CAC3B;AAED,MAAM,WAAW,uBAAwB,SAAQ,eAAe;IAC9D,KAAK,EAAE,MAAM,CAAC;CACf;AAUD,wBAAgB,UAAU,CAAC,CAAC,EAAE,eAAe,QAE5C;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,6BAMhE"}

package/dist/layouts/responsive/breakpoint.js

@@ -0,0 +1,15 @@
+function t(n) {
+  return typeof n == "number" ? n : parseFloat(n);
+}
+function o(n) {
+  return null;
+}
+function u(n) {
+  const i = t(n.from ?? 0), r = t(n.to ?? 1 / 0);
+  return n.width >= i && n.width < r ? n.children : null;
+}
+export {
+  o as Breakpoint,
+  u as InternalBreakpoint
+};
+//# sourceMappingURL=breakpoint.js.map

package/dist/layouts/responsive/breakpoint.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"breakpoint.js","sources":["../../../src/layouts/responsive/breakpoint.tsx"],"sourcesContent":["export interface BreakpointProps {\n  from?: number | string;\n  to?: number | string;\n  children: React.ReactNode;\n}\n\nexport interface InternalBreakpointProps extends BreakpointProps {\n  width: number;\n}\n\nfunction toNumber(value: number | string) {\n  if (typeof value === 'number') {\n    return value;\n  }\n\n  return parseFloat(value);\n}\n\nexport function Breakpoint(_: BreakpointProps) {\n  return null;\n}\n\nexport function InternalBreakpoint(props: InternalBreakpointProps) {\n  const from = toNumber(props.from ?? 0);\n  const to = toNumber(props.to ?? Infinity);\n  const isWithinRange = props.width >= from && props.width < to;\n\n  return isWithinRange ? props.children : null;\n}\n"],"names":["toNumber","value","Breakpoint","_","InternalBreakpoint","props","from","to"],"mappings":"AAUA,SAASA,EAASC,GAAwB;AACxC,SAAI,OAAOA,KAAU,WACZA,IAGF,WAAWA,CAAK;AACzB;AAEO,SAASC,EAAWC,GAAoB;AAC7C,SAAO;AACT;AAEO,SAASC,EAAmBC,GAAgC;AACjE,QAAMC,IAAON,EAASK,EAAM,QAAQ,CAAC,GAC/BE,IAAKP,EAASK,EAAM,MAAM,KAAQ;AAGxC,SAFsBA,EAAM,SAASC,KAAQD,EAAM,QAAQE,IAEpCF,EAAM,WAAW;AAC1C;"}

package/dist/layouts/responsive/responsive.d.ts

@@ -0,0 +1,7 @@
+import { BreakpointProps } from './breakpoint.js';
+export interface ResponsiveProps {
+    on?: 'viewport' | 'container';
+    children?: React.ReactElement<BreakpointProps>[] | React.ReactElement<BreakpointProps>;
+}
+export declare function Responsive(props: ResponsiveProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=responsive.d.ts.map

package/dist/layouts/responsive/responsive.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"responsive.d.ts","sourceRoot":"","sources":["../../../src/layouts/responsive/responsive.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAIvD,MAAM,WAAW,eAAe;IAC9B,EAAE,CAAC,EAAE,UAAU,GAAG,WAAW,CAAC;IAC9B,QAAQ,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,eAAe,CAAC,EAAE,GAAG,KAAK,CAAC,YAAY,CAAC,eAAe,CAAC,CAAC;CACxF;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,eAAe,2CAQhD"}

package/dist/layouts/responsive/responsive.js

@@ -0,0 +1,11 @@
+import { jsx as r } from "react/jsx-runtime";
+import { ResponsiveContainer as i } from "./responsive_container.js";
+import { ResponsiveViewport as t } from "./responsive_viewport.js";
+function f(e) {
+  const { on: n = "container", children: o } = e;
+  return n === "viewport" ? /* @__PURE__ */ r(t, { children: o }) : /* @__PURE__ */ r(i, { children: o });
+}
+export {
+  f as Responsive
+};
+//# sourceMappingURL=responsive.js.map

package/dist/layouts/responsive/responsive.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"responsive.js","sources":["../../../src/layouts/responsive/responsive.tsx"],"sourcesContent":["import type { BreakpointProps } from './breakpoint.js';\nimport { ResponsiveContainer } from './responsive_container.js';\nimport { ResponsiveViewport } from './responsive_viewport.js';\n\nexport interface ResponsiveProps {\n  on?: 'viewport' | 'container';\n  children?: React.ReactElement<BreakpointProps>[] | React.ReactElement<BreakpointProps>;\n}\n\nexport function Responsive(props: ResponsiveProps) {\n  const { on = 'container', children } = props;\n\n  if (on === 'viewport') {\n    return <ResponsiveViewport>{children}</ResponsiveViewport>;\n  }\n\n  return <ResponsiveContainer>{children}</ResponsiveContainer>;\n}\n"],"names":["Responsive","props","on","children","jsx","ResponsiveViewport","ResponsiveContainer"],"mappings":";;;AASO,SAASA,EAAWC,GAAwB;AACjD,QAAM,EAAE,IAAAC,IAAK,aAAa,UAAAC,EAAA,IAAaF;AAEvC,SAAIC,MAAO,aACF,gBAAAE,EAACC,KAAoB,UAAAF,GAAS,IAGhC,gBAAAC,EAACE,KAAqB,UAAAH,GAAS;AACxC;"}

package/dist/layouts/responsive/responsive_container.d.ts

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+import { BreakpointProps } from './breakpoint.js';
+export interface ResponsiveContainerProps {
+    children?: React.ReactElement<BreakpointProps>[] | React.ReactElement<BreakpointProps>;
+}
+export declare function ResponsiveContainer(props: ResponsiveContainerProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=responsive_container.d.ts.map

package/dist/layouts/responsive/responsive_container.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"responsive_container.d.ts","sourceRoot":"","sources":["../../../src/layouts/responsive/responsive_container.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAoC,MAAM,OAAO,CAAC;AAGzD,OAAO,EAAsB,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAEtE,MAAM,WAAW,wBAAwB;IACvC,QAAQ,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,eAAe,CAAC,EAAE,GAAG,KAAK,CAAC,YAAY,CAAC,eAAe,CAAC,CAAC;CACxF;AAED,wBAAgB,mBAAmB,CAAC,KAAK,EAAE,wBAAwB,2CAyClE"}

package/dist/layouts/responsive/responsive_container.js

@@ -0,0 +1,30 @@
+import { jsx as t, jsxs as m, Fragment as d } from "react/jsx-runtime";
+import c, { useState as n, useLayoutEffect as h } from "react";
+import { useForkRef as R } from "../../utils/hooks/use_fork_ref.js";
+import { useResizeObserver as k } from "../../utils/hooks/use_resize_observer.js";
+import { InternalBreakpoint as y } from "./breakpoint.js";
+function z(o) {
+  const [s, r] = n(null), [i, l] = n(0), a = k((e) => {
+    l(e);
+  }), p = R((e) => {
+    e == null || e.parentElement == null || (a(e.parentElement), r(e.parentElement));
+  }), u = /* @__PURE__ */ t(
+    "div",
+    {
+      ref: p,
+      style: {
+        display: "none"
+      }
+    }
+  ), f = c.Children.toArray(o.children).map((e) => /* @__PURE__ */ t(y, { ...e.props, width: i }, e.key));
+  return h(() => () => {
+    r(null);
+  }, []), /* @__PURE__ */ m(d, { children: [
+    s == null ? u : null,
+    f
+  ] });
+}
+export {
+  z as ResponsiveContainer
+};
+//# sourceMappingURL=responsive_container.js.map

package/dist/layouts/responsive/responsive_container.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"responsive_container.js","sources":["../../../src/layouts/responsive/responsive_container.tsx"],"sourcesContent":["import React, { useLayoutEffect, useState } from 'react';\nimport { useForkRef } from '../../utils/hooks/use_fork_ref.js';\nimport { useResizeObserver } from '../../utils/hooks/use_resize_observer.js';\nimport { InternalBreakpoint, BreakpointProps } from './breakpoint.js';\n\nexport interface ResponsiveContainerProps {\n  children?: React.ReactElement<BreakpointProps>[] | React.ReactElement<BreakpointProps>;\n}\n\nexport function ResponsiveContainer(props: ResponsiveContainerProps) {\n  const [parent, setParent] = useState<Element | null>(null);\n  const [width, setWidth] = useState(0);\n\n  const resizeRef = useResizeObserver(width => {\n    setWidth(width);\n  });\n\n  const forkedRef = useForkRef((element: any) => {\n    if (element == null || element.parentElement == null) {\n      return;\n    }\n    resizeRef(element.parentElement);\n    setParent(element.parentElement);\n  });\n\n  const hiddenChild = (\n    <div\n      ref={forkedRef}\n      style={{\n        display: 'none',\n      }}\n    ></div>\n  );\n\n  const internalBreakpoints = React.Children.toArray(props.children).map((child: any) => {\n    return <InternalBreakpoint key={child.key} {...child.props} width={width} />;\n  });\n\n  useLayoutEffect(() => {\n    return () => {\n      setParent(null);\n    };\n  }, []);\n\n  return (\n    <>\n      {parent == null ? hiddenChild : null}\n      {internalBreakpoints}\n    </>\n  );\n}\n"],"names":["ResponsiveContainer","props","parent","setParent","useState","width","setWidth","resizeRef","useResizeObserver","forkedRef","useForkRef","element","hiddenChild","jsx","internalBreakpoints","React","child","InternalBreakpoint","useLayoutEffect","jsxs","Fragment"],"mappings":";;;;;AASO,SAASA,EAAoBC,GAAiC;AACnE,QAAM,CAACC,GAAQC,CAAS,IAAIC,EAAyB,IAAI,GACnD,CAACC,GAAOC,CAAQ,IAAIF,EAAS,CAAC,GAE9BG,IAAYC,EAAkB,CAAAH,MAAS;AAC3C,IAAAC,EAASD,CAAK;AAAA,EAChB,CAAC,GAEKI,IAAYC,EAAW,CAACC,MAAiB;AAC7C,IAAIA,KAAW,QAAQA,EAAQ,iBAAiB,SAGhDJ,EAAUI,EAAQ,aAAa,GAC/BR,EAAUQ,EAAQ,aAAa;AAAA,EACjC,CAAC,GAEKC,IACJ,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAKJ;AAAA,MACL,OAAO;AAAA,QACL,SAAS;AAAA,MAAA;AAAA,IACX;AAAA,EAAA,GAIEK,IAAsBC,EAAM,SAAS,QAAQd,EAAM,QAAQ,EAAE,IAAI,CAACe,wBAC9DC,GAAA,EAAoC,GAAGD,EAAM,OAAO,OAAAX,EAAA,GAA5BW,EAAM,GAAoC,CAC3E;AAED,SAAAE,EAAgB,MACP,MAAM;AACX,IAAAf,EAAU,IAAI;AAAA,EAChB,GACC,CAAA,CAAE,GAGH,gBAAAgB,EAAAC,GAAA,EACG,UAAA;AAAA,IAAAlB,KAAU,OAAOU,IAAc;AAAA,IAC/BE;AAAA,EAAA,GACH;AAEJ;"}

package/dist/layouts/responsive/responsive_viewport.d.ts

@@ -0,0 +1,7 @@
+import { default as React } from 'react';
+import { BreakpointProps } from './breakpoint.js';
+export interface ResponsiveViewportProps {
+    children?: React.ReactElement<BreakpointProps>[] | React.ReactElement<BreakpointProps>;
+}
+export declare function ResponsiveViewport(props: ResponsiveViewportProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=responsive_viewport.d.ts.map

package/dist/layouts/responsive/responsive_viewport.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"responsive_viewport.d.ts","sourceRoot":"","sources":["../../../src/layouts/responsive/responsive_viewport.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAsB,eAAe,EAAE,MAAM,iBAAiB,CAAC;AAGtE,MAAM,WAAW,uBAAuB;IACtC,QAAQ,CAAC,EAAE,KAAK,CAAC,YAAY,CAAC,eAAe,CAAC,EAAE,GAAG,KAAK,CAAC,YAAY,CAAC,eAAe,CAAC,CAAC;CACxF;AAED,wBAAgB,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,2CAQhE"}

package/dist/layouts/responsive/responsive_viewport.js

@@ -0,0 +1,12 @@
+import { jsx as e, Fragment as i } from "react/jsx-runtime";
+import p from "react";
+import { InternalBreakpoint as a } from "./breakpoint.js";
+import { useMediaQuery as m } from "../../utils/hooks/use_media_query.js";
+function d(t) {
+  const { width: o } = m(), n = p.Children.toArray(t.children).map((r) => /* @__PURE__ */ e(a, { ...r.props, width: o }, r.key));
+  return /* @__PURE__ */ e(i, { children: n });
+}
+export {
+  d as ResponsiveViewport
+};
+//# sourceMappingURL=responsive_viewport.js.map

package/dist/layouts/responsive/responsive_viewport.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"responsive_viewport.js","sources":["../../../src/layouts/responsive/responsive_viewport.tsx"],"sourcesContent":["import React from 'react';\nimport { InternalBreakpoint, BreakpointProps } from './breakpoint.js';\nimport { useMediaQuery } from '../../utils/hooks/use_media_query.js';\n\nexport interface ResponsiveViewportProps {\n  children?: React.ReactElement<BreakpointProps>[] | React.ReactElement<BreakpointProps>;\n}\n\nexport function ResponsiveViewport(props: ResponsiveViewportProps) {\n  const { width } = useMediaQuery();\n\n  const internalBreakpoints = React.Children.toArray(props.children).map((child: any) => {\n    return <InternalBreakpoint key={child.key} {...child.props} width={width} />;\n  });\n\n  return <>{internalBreakpoints}</>;\n}\n"],"names":["ResponsiveViewport","props","width","useMediaQuery","internalBreakpoints","React","child","InternalBreakpoint"],"mappings":";;;;AAQO,SAASA,EAAmBC,GAAgC;AACjE,QAAM,EAAE,OAAAC,EAAA,IAAUC,EAAA,GAEZC,IAAsBC,EAAM,SAAS,QAAQJ,EAAM,QAAQ,EAAE,IAAI,CAACK,wBAC9DC,GAAA,EAAoC,GAAGD,EAAM,OAAO,OAAAJ,EAAA,GAA5BI,EAAM,GAAoC,CAC3E;AAED,gCAAU,UAAAF,EAAA,CAAoB;AAChC;"}