@tcn/ui 0.10.0 → 0.12.0

package/dist/stacks/box/resize_handlers.js.map

@@ -1 +1 @@
-{"version":3,"file":"resize_handlers.js","sources":["../../../src/stacks/box/resize_handlers.ts"],"sourcesContent":["function createVeil() {\n  const veil = window.document.createElement('div');\n  veil.style.position = 'absolute';\n  veil.style.inset = '-500px';\n  veil.style.backgroundColor = 'transparent';\n  veil.style.pointerEvents = 'auto';\n  return veil;\n}\n\nexport function createHorizontalResizeHandler(\n  targetRef: React.MutableRefObject<HTMLElement | null>,\n  onWidthResize?: (width: number, origin: 'left' | 'right', delta: number) => void,\n  onWidthResizeEnd?: (width: number, origin: 'left' | 'right') => void,\n  origin: 'left' | 'right' = 'right',\n  invert = false,\n  disableDirection = false\n) {\n  return function startHorizontalResize(event: React.MouseEvent) {\n    const box = targetRef.current;\n\n    if (box == null) {\n      return;\n    }\n\n    const veil = createVeil();\n    box.appendChild(veil);\n\n    const languageDirection = window.getComputedStyle(box).direction;\n    const finalInvert =\n      languageDirection === 'rtl' && !disableDirection ? !invert : invert;\n    const direction = finalInvert ? -1 : 1;\n\n    const startX = event.clientX;\n    const startRect = box.getBoundingClientRect();\n    let width = startRect.width;\n\n    const drag = (event: MouseEvent) => {\n      const deltaX = direction * (event.clientX - startX);\n      const newWidth = startRect.width + deltaX;\n\n      width = newWidth;\n\n      box.style.width = `${newWidth}px`;\n      onWidthResize?.(newWidth, origin, deltaX);\n      event.stopPropagation();\n      event.preventDefault();\n    };\n\n    const mouseEnter = (event: MouseEvent) => {\n      if (event.buttons === 0) {\n        endDrag();\n      }\n    };\n\n    const endDrag = () => {\n      box.removeChild(veil);\n\n      document.body.removeEventListener('mousemove', drag);\n      document.body.removeEventListener('mouseup', endDrag);\n      document.body.removeEventListener('mouseenter', mouseEnter);\n      event.stopPropagation();\n      event.preventDefault();\n\n      onWidthResizeEnd?.(width, origin);\n    };\n\n    document.body.addEventListener('mousemove', drag);\n    document.body.addEventListener('mouseup', endDrag);\n    document.body.addEventListener('mouseenter', mouseEnter);\n    event.stopPropagation();\n    event.preventDefault();\n  };\n}\n\nexport function createVerticalResizeHandler(\n  targetRef: React.MutableRefObject<HTMLElement | null>,\n  onHeightResize?: (height: number, origin: 'top' | 'bottom', delta: number) => void,\n  onHeightResizeEnd?: (height: number, origin: 'top' | 'bottom') => void,\n  invert = false,\n  origin: 'top' | 'bottom' = 'bottom'\n) {\n  const direction = invert ? -1 : 1;\n  return function startVerticalResize(event: React.MouseEvent) {\n    const box = targetRef.current;\n\n    if (box == null) {\n      return;\n    }\n\n    const veil = createVeil();\n    box.appendChild(veil);\n\n    const startY = event.clientY;\n    const startRect = box.getBoundingClientRect();\n    let height = startRect.height;\n\n    const drag = (event: MouseEvent) => {\n      const deltaY = direction * (event.clientY - startY);\n      const newHeight = startRect.height + deltaY;\n      height = newHeight;\n      box.style.height = `${newHeight}px`;\n      onHeightResize?.(newHeight, origin, deltaY);\n      event.stopPropagation();\n      event.preventDefault();\n    };\n\n    const mouseEnter = (event: MouseEvent) => {\n      if (event.buttons === 0) {\n        endDrag();\n      }\n    };\n\n    const endDrag = () => {\n      box.removeChild(veil);\n\n      document.body.removeEventListener('mousemove', drag);\n      document.body.removeEventListener('mouseup', endDrag);\n      document.body.removeEventListener('mouseenter', mouseEnter);\n      event.stopPropagation();\n      event.preventDefault();\n\n      onHeightResizeEnd?.(height, origin);\n    };\n\n    document.body.addEventListener('mousemove', drag);\n    document.body.addEventListener('mouseup', endDrag);\n    document.body.addEventListener('mouseenter', mouseEnter);\n    event.stopPropagation();\n    event.preventDefault();\n  };\n}\n"],"names":["createVeil","veil","createHorizontalResizeHandler","targetRef","onWidthResize","onWidthResizeEnd","origin","invert","disableDirection","event","box","direction","startX","startRect","width","drag","deltaX","newWidth","mouseEnter","endDrag","createVerticalResizeHandler","onHeightResize","onHeightResizeEnd","startY","height","deltaY","newHeight"],"mappings":"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"}
+{"version":3,"file":"resize_handlers.js","sources":["../../../src/stacks/box/resize_handlers.ts"],"sourcesContent":["import {\n  OnWidthResize,\n  type HeightResizeOrigin,\n  type OnHeightResize,\n  type WidthResizeOrigin,\n} from './types';\n\nfunction createVeil() {\n  const veil = window.document.createElement('div');\n  veil.style.position = 'absolute';\n  veil.style.inset = '-500px';\n  veil.style.backgroundColor = 'transparent';\n  veil.style.pointerEvents = 'auto';\n  return veil;\n}\n\nexport function createHorizontalResizeHandler(\n  targetRef: React.MutableRefObject<HTMLElement | null>,\n  onWidthResize?: OnWidthResize,\n  onWidthResizeEnd?: (width: number, origin: WidthResizeOrigin) => void,\n  origin: WidthResizeOrigin = 'right',\n  invert = false,\n  disableDirection = false\n) {\n  return function startHorizontalResize(event: React.MouseEvent) {\n    const box = targetRef.current;\n\n    if (box == null) {\n      return;\n    }\n\n    const veil = createVeil();\n    box.appendChild(veil);\n\n    const languageDirection = window.getComputedStyle(box).direction;\n    const finalInvert =\n      languageDirection === 'rtl' && !disableDirection ? !invert : invert;\n    const direction = finalInvert ? -1 : 1;\n\n    const startX = event.clientX;\n    const startRect = box.getBoundingClientRect();\n    let width = startRect.width;\n\n    const drag = (event: MouseEvent) => {\n      const beforeWidth = box.getBoundingClientRect().width;\n      const totalDelta = direction * (event.clientX - startX);\n      const newWidth = startRect.width + totalDelta;\n      const currentDelta = newWidth - width;\n\n      width = newWidth;\n\n      box.style.width = `${newWidth}px`;\n\n      const afterWidth = box.getBoundingClientRect().width;\n      const atLimit = afterWidth === beforeWidth;\n      onWidthResize?.(newWidth, origin, totalDelta, currentDelta, atLimit);\n      event.stopPropagation();\n      event.preventDefault();\n    };\n\n    const mouseEnter = (event: MouseEvent) => {\n      if (event.buttons === 0) {\n        endDrag();\n      }\n    };\n\n    const endDrag = () => {\n      box.removeChild(veil);\n\n      document.body.removeEventListener('mousemove', drag);\n      document.body.removeEventListener('mouseup', endDrag);\n      document.body.removeEventListener('mouseenter', mouseEnter);\n      event.stopPropagation();\n      event.preventDefault();\n\n      onWidthResizeEnd?.(width, origin);\n    };\n\n    document.body.addEventListener('mousemove', drag);\n    document.body.addEventListener('mouseup', endDrag);\n    document.body.addEventListener('mouseenter', mouseEnter);\n    event.stopPropagation();\n    event.preventDefault();\n  };\n}\n\nexport function createVerticalResizeHandler(\n  targetRef: React.MutableRefObject<HTMLElement | null>,\n  onHeightResize?: OnHeightResize,\n  onHeightResizeEnd?: (height: number, origin: HeightResizeOrigin) => void,\n  invert = false,\n  origin: HeightResizeOrigin = 'bottom'\n) {\n  const direction = invert ? -1 : 1;\n  return function startVerticalResize(event: React.MouseEvent) {\n    const box = targetRef.current;\n\n    if (box == null) {\n      return;\n    }\n\n    const veil = createVeil();\n    box.appendChild(veil);\n\n    const startY = event.clientY;\n    const startRect = box.getBoundingClientRect();\n    let height = startRect.height;\n\n    const drag = (event: MouseEvent) => {\n      const beforeHeight = box.getBoundingClientRect().height;\n      const totalDelta = direction * (event.clientY - startY);\n      const newHeight = startRect.height + totalDelta;\n      const currentDelta = newHeight - height;\n      height = newHeight;\n      box.style.height = `${newHeight}px`;\n      const afterHeight = box.getBoundingClientRect().height;\n      const atLimit = afterHeight === beforeHeight;\n      onHeightResize?.(newHeight, origin, totalDelta, currentDelta, atLimit);\n      event.stopPropagation();\n      event.preventDefault();\n    };\n\n    const mouseEnter = (event: MouseEvent) => {\n      if (event.buttons === 0) {\n        endDrag();\n      }\n    };\n\n    const endDrag = () => {\n      box.removeChild(veil);\n\n      document.body.removeEventListener('mousemove', drag);\n      document.body.removeEventListener('mouseup', endDrag);\n      document.body.removeEventListener('mouseenter', mouseEnter);\n      event.stopPropagation();\n      event.preventDefault();\n\n      onHeightResizeEnd?.(height, origin);\n    };\n\n    document.body.addEventListener('mousemove', drag);\n    document.body.addEventListener('mouseup', endDrag);\n    document.body.addEventListener('mouseenter', mouseEnter);\n    event.stopPropagation();\n    event.preventDefault();\n  };\n}\n"],"names":["createVeil","veil","createHorizontalResizeHandler","targetRef","onWidthResize","onWidthResizeEnd","origin","invert","disableDirection","event","box","direction","startX","startRect","width","drag","beforeWidth","totalDelta","newWidth","currentDelta","atLimit","mouseEnter","endDrag","createVerticalResizeHandler","onHeightResize","onHeightResizeEnd","startY","height","beforeHeight","newHeight"],"mappings":"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"}

package/dist/stacks/box/right_resize_handle.d.ts

@@ -1,10 +1,4 @@
-import { default as React } from 'react';
-import { HandleProps } from './handle_props.js';
-export interface RightResizeHandleProps {
-    targetRef: React.MutableRefObject<HTMLElement | null>;
-    handleProps?: HandleProps;
-    onWidthResize?: (width: number, origin: 'left' | 'right', delta: number) => void;
-    onWidthResizeEnd?: (width: number, origin: 'left' | 'right') => void;
-}
+import { HorizontalResizeHandleProps } from './types.js';
+export type RightResizeHandleProps = HorizontalResizeHandleProps;
 export declare function RightResizeHandle({ targetRef, handleProps, onWidthResize, onWidthResizeEnd, }: RightResizeHandleProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=right_resize_handle.d.ts.map

package/dist/stacks/box/right_resize_handle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"right_resize_handle.d.ts","sourceRoot":"","sources":["../../../src/stacks/box/right_resize_handle.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAIhD,MAAM,WAAW,sBAAsB;IACrC,SAAS,EAAE,KAAK,CAAC,gBAAgB,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IACtD,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,OAAO,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjF,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,OAAO,KAAK,IAAI,CAAC;CACtE;AACD,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,WAAW,EACX,aAAa,EACb,gBAAgB,GACjB,EAAE,sBAAsB,2CA0BxB"}
+{"version":3,"file":"right_resize_handle.d.ts","sourceRoot":"","sources":["../../../src/stacks/box/right_resize_handle.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,YAAY,CAAC;AAE9D,MAAM,MAAM,sBAAsB,GAAG,2BAA2B,CAAC;AACjE,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,WAAW,EACX,aAAa,EACb,gBAAgB,GACjB,EAAE,sBAAsB,2CA0BxB"}

package/dist/stacks/box/right_resize_handle.js.map

@@ -1 +1 @@
-{"version":3,"file":"right_resize_handle.js","sources":["../../../src/stacks/box/right_resize_handle.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport React from 'react';\nimport { HandleProps } from './handle_props.js';\nimport { createHorizontalResizeHandler } from './resize_handlers.js';\nimport styles from './right_resize_handle.module.css';\n\nexport interface RightResizeHandleProps {\n  targetRef: React.MutableRefObject<HTMLElement | null>;\n  handleProps?: HandleProps;\n  onWidthResize?: (width: number, origin: 'left' | 'right', delta: number) => void;\n  onWidthResizeEnd?: (width: number, origin: 'left' | 'right') => void;\n}\nexport function RightResizeHandle({\n  targetRef,\n  handleProps,\n  onWidthResize,\n  onWidthResizeEnd,\n}: RightResizeHandleProps) {\n  const resizeHandler = createHorizontalResizeHandler(\n    targetRef,\n    onWidthResize,\n    onWidthResizeEnd,\n    'right',\n    false,\n    true\n  );\n  const offset = handleProps?.offset ? handleProps.offset : -8;\n\n  const rightResizeHandleStyle: any = {\n    ...handleProps?.style,\n    '--resize-offset': `${offset}px`,\n    width: handleProps?.size || '16px',\n  };\n\n  return (\n    <div\n      className={clsx(styles['right-resize-handle'], 'tcn-right-resize-handle')}\n      onMouseDown={resizeHandler}\n      style={rightResizeHandleStyle}\n    >\n      {handleProps?.children}\n    </div>\n  );\n}\n"],"names":["RightResizeHandle","targetRef","handleProps","onWidthResize","onWidthResizeEnd","resizeHandler","createHorizontalResizeHandler","offset","rightResizeHandleStyle","jsx","clsx","styles"],"mappings":";;;;AAYO,SAASA,EAAkB;AAAA,EAChC,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,eAAAC;AAAA,EACA,kBAAAC;AACF,GAA2B;AACzB,QAAMC,IAAgBC;AAAA,IACpBL;AAAA,IACAE;AAAA,IACAC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,GAEIG,IAASL,GAAa,SAASA,EAAY,SAAS,IAEpDM,IAA8B;AAAA,IAClC,GAAGN,GAAa;AAAA,IAChB,mBAAmB,GAAGK,CAAM;AAAA,IAC5B,OAAOL,GAAa,QAAQ;AAAA,EAAA;AAG9B,SACE,gBAAAO;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAKC,EAAO,qBAAqB,GAAG,yBAAyB;AAAA,MACxE,aAAaN;AAAA,MACb,OAAOG;AAAA,MAEN,UAAAN,GAAa;AAAA,IAAA;AAAA,EAAA;AAGpB;"}
+{"version":3,"file":"right_resize_handle.js","sources":["../../../src/stacks/box/right_resize_handle.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { createHorizontalResizeHandler } from './resize_handlers.js';\nimport styles from './right_resize_handle.module.css';\nimport type { HorizontalResizeHandleProps } from './types.js';\n\nexport type RightResizeHandleProps = HorizontalResizeHandleProps;\nexport function RightResizeHandle({\n  targetRef,\n  handleProps,\n  onWidthResize,\n  onWidthResizeEnd,\n}: RightResizeHandleProps) {\n  const resizeHandler = createHorizontalResizeHandler(\n    targetRef,\n    onWidthResize,\n    onWidthResizeEnd,\n    'right',\n    false,\n    true\n  );\n  const offset = handleProps?.offset ? handleProps.offset : -8;\n\n  const rightResizeHandleStyle: any = {\n    ...handleProps?.style,\n    '--resize-offset': `${offset}px`,\n    width: handleProps?.size || '16px',\n  };\n\n  return (\n    <div\n      className={clsx(styles['right-resize-handle'], 'tcn-right-resize-handle')}\n      onMouseDown={resizeHandler}\n      style={rightResizeHandleStyle}\n    >\n      {handleProps?.children}\n    </div>\n  );\n}\n"],"names":["RightResizeHandle","targetRef","handleProps","onWidthResize","onWidthResizeEnd","resizeHandler","createHorizontalResizeHandler","offset","rightResizeHandleStyle","jsx","clsx","styles"],"mappings":";;;;AAMO,SAASA,EAAkB;AAAA,EAChC,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,eAAAC;AAAA,EACA,kBAAAC;AACF,GAA2B;AACzB,QAAMC,IAAgBC;AAAA,IACpBL;AAAA,IACAE;AAAA,IACAC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,GAEIG,IAASL,GAAa,SAASA,EAAY,SAAS,IAEpDM,IAA8B;AAAA,IAClC,GAAGN,GAAa;AAAA,IAChB,mBAAmB,GAAGK,CAAM;AAAA,IAC5B,OAAOL,GAAa,QAAQ;AAAA,EAAA;AAG9B,SACE,gBAAAO;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAKC,EAAO,qBAAqB,GAAG,yBAAyB;AAAA,MACxE,aAAaN;AAAA,MACb,OAAOG;AAAA,MAEN,UAAAN,GAAa;AAAA,IAAA;AAAA,EAAA;AAGpB;"}

package/dist/stacks/box/start_resize_handle.d.ts

@@ -1,10 +1,4 @@
-import { default as React } from 'react';
-import { HandleProps } from './handle_props.js';
-export interface StartResizeHandleProps {
-    targetRef: React.MutableRefObject<HTMLElement | null>;
-    handleProps?: HandleProps;
-    onWidthResize?: (width: number, origin: 'left' | 'right', delta: number) => void;
-    onWidthResizeEnd?: (width: number, origin: 'left' | 'right') => void;
-}
+import { HorizontalResizeHandleProps } from './types.js';
+export type StartResizeHandleProps = HorizontalResizeHandleProps;
 export declare function StartResizeHandle({ targetRef, handleProps, onWidthResize, onWidthResizeEnd, }: StartResizeHandleProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=start_resize_handle.d.ts.map

package/dist/stacks/box/start_resize_handle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"start_resize_handle.d.ts","sourceRoot":"","sources":["../../../src/stacks/box/start_resize_handle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAKhD,MAAM,WAAW,sBAAsB;IACrC,SAAS,EAAE,KAAK,CAAC,gBAAgB,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IACtD,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,OAAO,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjF,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,OAAO,KAAK,IAAI,CAAC;CACtE;AACD,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,WAAW,EACX,aAAa,EACb,gBAAgB,GACjB,EAAE,sBAAsB,2CAwBxB"}
+{"version":3,"file":"start_resize_handle.d.ts","sourceRoot":"","sources":["../../../src/stacks/box/start_resize_handle.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,YAAY,CAAC;AAE9D,MAAM,MAAM,sBAAsB,GAAG,2BAA2B,CAAC;AAEjE,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,WAAW,EACX,aAAa,EACb,gBAAgB,GACjB,EAAE,sBAAsB,2CAwBxB"}

package/dist/stacks/box/start_resize_handle.js

@@ -1,6 +1,6 @@
 import { jsx as o } from "react/jsx-runtime";
-import { createHorizontalResizeHandler as l } from "./resize_handlers.js";
-import { clsx as f } from "clsx";
+import { clsx as l } from "clsx";
+import { createHorizontalResizeHandler as f } from "./resize_handlers.js";
 import '../../start_resize_handle.css';const c = "_start-resize-handle_22a3d5a", z = { "start-resize-handle": c };
 function x({
   targetRef: t,
@@ -8,7 +8,7 @@ function x({
   onWidthResize: s,
   onWidthResizeEnd: r
 }) {
-  const i = l(
+  const i = f(
     t,
     s,
     r,
@@ -21,7 +21,7 @@ function x({
   return /* @__PURE__ */ o(
     "div",
     {
-      className: f(z["start-resize-handle"], "tcn-start-resize-handle"),
+      className: l(z["start-resize-handle"], "tcn-start-resize-handle"),
       onMouseDown: i,
       style: a,
       children: e?.children

package/dist/stacks/box/start_resize_handle.js.map

@@ -1 +1 @@
-{"version":3,"file":"start_resize_handle.js","sources":["../../../src/stacks/box/start_resize_handle.tsx"],"sourcesContent":["import React from 'react';\nimport { HandleProps } from './handle_props.js';\nimport { createHorizontalResizeHandler } from './resize_handlers.js';\nimport styles from './start_resize_handle.module.css';\nimport { clsx } from 'clsx';\n\nexport interface StartResizeHandleProps {\n  targetRef: React.MutableRefObject<HTMLElement | null>;\n  handleProps?: HandleProps;\n  onWidthResize?: (width: number, origin: 'left' | 'right', delta: number) => void;\n  onWidthResizeEnd?: (width: number, origin: 'left' | 'right') => void;\n}\nexport function StartResizeHandle({\n  targetRef,\n  handleProps,\n  onWidthResize,\n  onWidthResizeEnd,\n}: StartResizeHandleProps) {\n  const resizeHandler = createHorizontalResizeHandler(\n    targetRef,\n    onWidthResize,\n    onWidthResizeEnd,\n    'left'\n  );\n  const offset = handleProps?.offset ? handleProps.offset : -8;\n\n  const startResizeHandleStyle: any = {\n    ...handleProps?.style,\n    '--resize-offset': `${offset}px`,\n    width: handleProps?.size || '16px',\n  };\n\n  return (\n    <div\n      className={clsx(styles['start-resize-handle'], 'tcn-start-resize-handle')}\n      onMouseDown={resizeHandler}\n      style={startResizeHandleStyle}\n    >\n      {handleProps?.children}\n    </div>\n  );\n}\n"],"names":["StartResizeHandle","targetRef","handleProps","onWidthResize","onWidthResizeEnd","resizeHandler","createHorizontalResizeHandler","offset","startResizeHandleStyle","jsx","clsx","styles"],"mappings":";;;;AAYO,SAASA,EAAkB;AAAA,EAChC,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,eAAAC;AAAA,EACA,kBAAAC;AACF,GAA2B;AACzB,QAAMC,IAAgBC;AAAA,IACpBL;AAAA,IACAE;AAAA,IACAC;AAAA,IACA;AAAA,EAAA,GAEIG,IAASL,GAAa,SAASA,EAAY,SAAS,IAEpDM,IAA8B;AAAA,IAClC,GAAGN,GAAa;AAAA,IAChB,mBAAmB,GAAGK,CAAM;AAAA,IAC5B,OAAOL,GAAa,QAAQ;AAAA,EAAA;AAG9B,SACE,gBAAAO;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAKC,EAAO,qBAAqB,GAAG,yBAAyB;AAAA,MACxE,aAAaN;AAAA,MACb,OAAOG;AAAA,MAEN,UAAAN,GAAa;AAAA,IAAA;AAAA,EAAA;AAGpB;"}
+{"version":3,"file":"start_resize_handle.js","sources":["../../../src/stacks/box/start_resize_handle.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport { createHorizontalResizeHandler } from './resize_handlers.js';\nimport styles from './start_resize_handle.module.css';\nimport type { HorizontalResizeHandleProps } from './types.js';\n\nexport type StartResizeHandleProps = HorizontalResizeHandleProps;\n\nexport function StartResizeHandle({\n  targetRef,\n  handleProps,\n  onWidthResize,\n  onWidthResizeEnd,\n}: StartResizeHandleProps) {\n  const resizeHandler = createHorizontalResizeHandler(\n    targetRef,\n    onWidthResize,\n    onWidthResizeEnd,\n    'left'\n  );\n  const offset = handleProps?.offset ? handleProps.offset : -8;\n\n  const startResizeHandleStyle: any = {\n    ...handleProps?.style,\n    '--resize-offset': `${offset}px`,\n    width: handleProps?.size || '16px',\n  };\n\n  return (\n    <div\n      className={clsx(styles['start-resize-handle'], 'tcn-start-resize-handle')}\n      onMouseDown={resizeHandler}\n      style={startResizeHandleStyle}\n    >\n      {handleProps?.children}\n    </div>\n  );\n}\n"],"names":["StartResizeHandle","targetRef","handleProps","onWidthResize","onWidthResizeEnd","resizeHandler","createHorizontalResizeHandler","offset","startResizeHandleStyle","jsx","clsx","styles"],"mappings":";;;;AAOO,SAASA,EAAkB;AAAA,EAChC,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,eAAAC;AAAA,EACA,kBAAAC;AACF,GAA2B;AACzB,QAAMC,IAAgBC;AAAA,IACpBL;AAAA,IACAE;AAAA,IACAC;AAAA,IACA;AAAA,EAAA,GAEIG,IAASL,GAAa,SAASA,EAAY,SAAS,IAEpDM,IAA8B;AAAA,IAClC,GAAGN,GAAa;AAAA,IAChB,mBAAmB,GAAGK,CAAM;AAAA,IAC5B,OAAOL,GAAa,QAAQ;AAAA,EAAA;AAG9B,SACE,gBAAAO;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAKC,EAAO,qBAAqB,GAAG,yBAAyB;AAAA,MACxE,aAAaN;AAAA,MACb,OAAOG;AAAA,MAEN,UAAAN,GAAa;AAAA,IAAA;AAAA,EAAA;AAGpB;"}

package/dist/stacks/box/top_resize_handle.d.ts

@@ -1,10 +1,4 @@
-import { default as React } from 'react';
-import { HandleProps } from './handle_props.js';
-export interface TopResizeHandleProps {
-    targetRef: React.MutableRefObject<HTMLElement | null>;
-    handleProps?: HandleProps;
-    onHeightResize?: (height: number, origin: 'top' | 'bottom', delta: number) => void;
-    onHeightResizeEnd?: (height: number, origin: 'top' | 'bottom') => void;
-}
+import { VerticalResizeHandleProps } from './types.js';
+export type TopResizeHandleProps = VerticalResizeHandleProps;
 export declare function TopResizeHandle({ targetRef, handleProps, onHeightResize, onHeightResizeEnd, }: TopResizeHandleProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=top_resize_handle.d.ts.map

package/dist/stacks/box/top_resize_handle.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"top_resize_handle.d.ts","sourceRoot":"","sources":["../../../src/stacks/box/top_resize_handle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAKhD,MAAM,WAAW,oBAAoB;IACnC,SAAS,EAAE,KAAK,CAAC,gBAAgB,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IACtD,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,GAAG,QAAQ,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACnF,iBAAiB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,GAAG,QAAQ,KAAK,IAAI,CAAC;CACxE;AACD,wBAAgB,eAAe,CAAC,EAC9B,SAAS,EACT,WAAW,EACX,cAAc,EACd,iBAAiB,GAClB,EAAE,oBAAoB,2CAwBtB"}
+{"version":3,"file":"top_resize_handle.d.ts","sourceRoot":"","sources":["../../../src/stacks/box/top_resize_handle.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,YAAY,CAAC;AAE5D,MAAM,MAAM,oBAAoB,GAAG,yBAAyB,CAAC;AAE7D,wBAAgB,eAAe,CAAC,EAC9B,SAAS,EACT,WAAW,EACX,cAAc,EACd,iBAAiB,GAClB,EAAE,oBAAoB,2CAwBtB"}

package/dist/stacks/box/top_resize_handle.js

@@ -1,6 +1,6 @@
 import { jsx as l } from "react/jsx-runtime";
-import { createVerticalResizeHandler as c } from "./resize_handlers.js";
-import { clsx as f } from "clsx";
+import { clsx as c } from "clsx";
+import { createVerticalResizeHandler as f } from "./resize_handlers.js";
 import '../../top_resize_handle.css';const p = "_top-resize-handle_fe19234", z = { "top-resize-handle": p };
 function x({
   targetRef: t,
@@ -8,7 +8,7 @@ function x({
   onHeightResize: o,
   onHeightResizeEnd: s
 }) {
-  const i = c(
+  const i = f(
     t,
     o,
     s,
@@ -22,7 +22,7 @@ function x({
   return /* @__PURE__ */ l(
     "div",
     {
-      className: f(z["top-resize-handle"], "tcn-top-resize-handle"),
+      className: c(z["top-resize-handle"], "tcn-top-resize-handle"),
       onMouseDown: i,
       style: r,
       children: e?.children

package/dist/stacks/box/top_resize_handle.js.map

@@ -1 +1 @@
-{"version":3,"file":"top_resize_handle.js","sources":["../../../src/stacks/box/top_resize_handle.tsx"],"sourcesContent":["import React from 'react';\nimport { HandleProps } from './handle_props.js';\nimport { createVerticalResizeHandler } from './resize_handlers.js';\nimport styles from './top_resize_handle.module.css';\nimport { clsx } from 'clsx';\n\nexport interface TopResizeHandleProps {\n  targetRef: React.MutableRefObject<HTMLElement | null>;\n  handleProps?: HandleProps;\n  onHeightResize?: (height: number, origin: 'top' | 'bottom', delta: number) => void;\n  onHeightResizeEnd?: (height: number, origin: 'top' | 'bottom') => void;\n}\nexport function TopResizeHandle({\n  targetRef,\n  handleProps,\n  onHeightResize,\n  onHeightResizeEnd,\n}: TopResizeHandleProps) {\n  const resizeHandler = createVerticalResizeHandler(\n    targetRef,\n    onHeightResize,\n    onHeightResizeEnd,\n    true,\n    'top'\n  );\n  const offset = handleProps?.offset ? handleProps.offset : -8;\n\n  const topResizeHandleStyle: React.CSSProperties = {\n    ...handleProps?.style,\n    top: `${offset}px`,\n    height: handleProps?.size || '16px',\n  };\n  return (\n    <div\n      className={clsx(styles['top-resize-handle'], 'tcn-top-resize-handle')}\n      onMouseDown={resizeHandler}\n      style={topResizeHandleStyle}\n    >\n      {handleProps?.children}\n    </div>\n  );\n}\n"],"names":["TopResizeHandle","targetRef","handleProps","onHeightResize","onHeightResizeEnd","resizeHandler","createVerticalResizeHandler","offset","topResizeHandleStyle","jsx","clsx","styles"],"mappings":";;;;AAYO,SAASA,EAAgB;AAAA,EAC9B,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,mBAAAC;AACF,GAAyB;AACvB,QAAMC,IAAgBC;AAAA,IACpBL;AAAA,IACAE;AAAA,IACAC;AAAA,IACA;AAAA,IACA;AAAA,EAAA,GAEIG,IAASL,GAAa,SAASA,EAAY,SAAS,IAEpDM,IAA4C;AAAA,IAChD,GAAGN,GAAa;AAAA,IAChB,KAAK,GAAGK,CAAM;AAAA,IACd,QAAQL,GAAa,QAAQ;AAAA,EAAA;AAE/B,SACE,gBAAAO;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAKC,EAAO,mBAAmB,GAAG,uBAAuB;AAAA,MACpE,aAAaN;AAAA,MACb,OAAOG;AAAA,MAEN,UAAAN,GAAa;AAAA,IAAA;AAAA,EAAA;AAGpB;"}
+{"version":3,"file":"top_resize_handle.js","sources":["../../../src/stacks/box/top_resize_handle.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport React from 'react';\nimport { createVerticalResizeHandler } from './resize_handlers.js';\nimport styles from './top_resize_handle.module.css';\nimport type { VerticalResizeHandleProps } from './types.js';\n\nexport type TopResizeHandleProps = VerticalResizeHandleProps;\n\nexport function TopResizeHandle({\n  targetRef,\n  handleProps,\n  onHeightResize,\n  onHeightResizeEnd,\n}: TopResizeHandleProps) {\n  const resizeHandler = createVerticalResizeHandler(\n    targetRef,\n    onHeightResize,\n    onHeightResizeEnd,\n    true,\n    'top'\n  );\n  const offset = handleProps?.offset ? handleProps.offset : -8;\n\n  const topResizeHandleStyle: React.CSSProperties = {\n    ...handleProps?.style,\n    top: `${offset}px`,\n    height: handleProps?.size || '16px',\n  };\n  return (\n    <div\n      className={clsx(styles['top-resize-handle'], 'tcn-top-resize-handle')}\n      onMouseDown={resizeHandler}\n      style={topResizeHandleStyle}\n    >\n      {handleProps?.children}\n    </div>\n  );\n}\n"],"names":["TopResizeHandle","targetRef","handleProps","onHeightResize","onHeightResizeEnd","resizeHandler","createVerticalResizeHandler","offset","topResizeHandleStyle","jsx","clsx","styles"],"mappings":";;;;AAQO,SAASA,EAAgB;AAAA,EAC9B,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,mBAAAC;AACF,GAAyB;AACvB,QAAMC,IAAgBC;AAAA,IACpBL;AAAA,IACAE;AAAA,IACAC;AAAA,IACA;AAAA,IACA;AAAA,EAAA,GAEIG,IAASL,GAAa,SAASA,EAAY,SAAS,IAEpDM,IAA4C;AAAA,IAChD,GAAGN,GAAa;AAAA,IAChB,KAAK,GAAGK,CAAM;AAAA,IACd,QAAQL,GAAa,QAAQ;AAAA,EAAA;AAE/B,SACE,gBAAAO;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAKC,EAAO,mBAAmB,GAAG,uBAAuB;AAAA,MACpE,aAAaN;AAAA,MACb,OAAOG;AAAA,MAEN,UAAAN,GAAa;AAAA,IAAA;AAAA,EAAA;AAGpB;"}

package/dist/stacks/box/types.d.ts

@@ -0,0 +1,18 @@
+import { HandleProps } from './handle_props.js';
+export type WidthResizeOrigin = 'left' | 'right';
+export type HeightResizeOrigin = 'top' | 'bottom';
+export type OnWidthResize = (width: number, origin: WidthResizeOrigin, totalDelta: number, currentDelta: number, atLimit: boolean) => void;
+export type OnHeightResize = (height: number, origin: HeightResizeOrigin, totalDelta: number, currentDelta: number, atLimit: boolean) => void;
+export interface HorizontalResizeHandleProps {
+    targetRef: React.MutableRefObject<HTMLElement | null>;
+    handleProps?: HandleProps;
+    onWidthResize?: OnWidthResize;
+    onWidthResizeEnd?: (width: number, origin: WidthResizeOrigin) => void;
+}
+export interface VerticalResizeHandleProps {
+    targetRef: React.MutableRefObject<HTMLElement | null>;
+    handleProps?: HandleProps;
+    onHeightResize?: OnHeightResize;
+    onHeightResizeEnd?: (height: number, origin: HeightResizeOrigin) => void;
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/stacks/box/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/stacks/box/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAErD,MAAM,MAAM,iBAAiB,GAAG,MAAM,GAAG,OAAO,CAAC;AACjD,MAAM,MAAM,kBAAkB,GAAG,KAAK,GAAG,QAAQ,CAAC;AAElD,MAAM,MAAM,aAAa,GAAG,CAE1B,KAAK,EAAE,MAAM,EAEb,MAAM,EAAE,iBAAiB,EAEzB,UAAU,EAAE,MAAM,EAElB,YAAY,EAAE,MAAM,EAEpB,OAAO,EAAE,OAAO,KACb,IAAI,CAAC;AAEV,MAAM,MAAM,cAAc,GAAG,CAE3B,MAAM,EAAE,MAAM,EAEd,MAAM,EAAE,kBAAkB,EAE1B,UAAU,EAAE,MAAM,EAElB,YAAY,EAAE,MAAM,EAEpB,OAAO,EAAE,OAAO,KACb,IAAI,CAAC;AAEV,MAAM,WAAW,2BAA2B;IAC1C,SAAS,EAAE,KAAK,CAAC,gBAAgB,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IACtD,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,iBAAiB,KAAK,IAAI,CAAC;CACvE;AAED,MAAM,WAAW,yBAAyB;IACxC,SAAS,EAAE,KAAK,CAAC,gBAAgB,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IACtD,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,cAAc,CAAC,EAAE,cAAc,CAAC;IAChC,iBAAiB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,kBAAkB,KAAK,IAAI,CAAC;CAC1E"}

package/dist/stacks/h_collapsible_box.js

@@ -1,46 +1,46 @@
-import { jsx as d } from "react/jsx-runtime";
-import { clsx as u } from "clsx";
-import i, { useLayoutEffect as R } from "react";
+import { jsx as p } from "react/jsx-runtime";
+import { clsx as d } from "clsx";
+import t, { useLayoutEffect as u } from "react";
 import "../utils/click_away_listener.js";
 import "../utils/focus_redirect.js";
 import "../utils/scroll_away_listener.js";
-import { useForkRef as x } from "../utils/hooks/use_fork_ref.js";
+import { useForkRef as R } from "../utils/hooks/use_fork_ref.js";
 import "../utils/hooks/use_resize_observer.js";
 import "../utils/dnd/context.js";
 import "../draggable.module-BgelQsuJ.js";
-import { Box as z } from "./box/box.js";
-import { s as b } from "../collapsible_box.module-BiS98xXA.js";
-import { useIsCollapsed as h } from "./utils/use_is_collapsed.js";
-const S = i.forwardRef(function({ open: l = !1, defaultWidth: r = "400px", ...e }, n) {
-  const o = i.useRef(null), c = x(n, o), [m, a] = i.useState(!1);
-  R(() => {
-    o.current?.style.setProperty("--collapsible-size", r);
-  }, [r]);
-  const f = h(l, o) && !l ? null : e.children;
-  return /* @__PURE__ */ d(
-    z,
+import { Box as x } from "./box/box.js";
+import { s as z } from "../collapsible_box.module-BiS98xXA.js";
+import { useIsCollapsed as b } from "./utils/use_is_collapsed.js";
+const L = t.forwardRef(function({ open: l = !1, defaultWidth: i = "400px", ...e }, a) {
+  const o = t.useRef(null), n = R(a, o), [c, r] = t.useState(!1);
+  u(() => {
+    o.current?.style.setProperty("--collapsible-size", i);
+  }, [i]);
+  const m = b(l, o) && !l ? null : e.children;
+  return /* @__PURE__ */ p(
+    x,
     {
-      ref: c,
+      ref: n,
       ...e,
       "data-is-collapsed": !l,
       "data-collapse-orientation": "horizontal",
-      "data-is-resizing": m,
-      onWidthResize: (s, t, p) => {
-        a(!0), e.onWidthResize?.(s, t, p);
+      "data-is-resizing": c,
+      onWidthResize: (...s) => {
+        r(!0), e.onWidthResize?.(...s);
       },
-      onWidthResizeEnd: (s, t) => {
-        a(!1), e.onWidthResizeEnd?.(s, t), o.current?.style.setProperty("--collapsible-size", `${s}px`);
+      onWidthResizeEnd: (s, f) => {
+        r(!1), e.onWidthResizeEnd?.(s, f), o.current?.style.setProperty("--collapsible-size", `${s}px`);
       },
-      className: u(
+      className: d(
         e.className,
-        b["collapsible-box"],
+        z["collapsible-box"],
         "tcn-h-collapsible-box"
       ),
-      children: f
+      children: m
     }
   );
 });
 export {
-  S as HCollapsibleBox
+  L as HCollapsibleBox
 };
 //# sourceMappingURL=h_collapsible_box.js.map

package/dist/stacks/h_collapsible_box.js.map

@@ -1 +1 @@
-{"version":3,"file":"h_collapsible_box.js","sources":["../../src/stacks/h_collapsible_box.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport React, { useLayoutEffect } from 'react';\nimport { useForkRef } from '../utils/index.js';\nimport { Box, BoxProps } from './box/box.js';\nimport styles from './collapsible_box.module.css';\nimport { useIsCollapsed } from './utils/use_is_collapsed.js';\n\nexport interface HCollapsibleBoxProps extends BoxProps {\n  open?: boolean;\n  defaultWidth?: string;\n}\n\nexport const HCollapsibleBox = React.forwardRef(function CollapsibleBox(\n  { open = false, defaultWidth = '400px', ...props }: HCollapsibleBoxProps,\n  ref: React.Ref<HTMLDivElement>\n) {\n  const collapsibleRef = React.useRef<HTMLDivElement | null>(null);\n  const forkRef = useForkRef(ref, collapsibleRef);\n  const [resizing, setIsResizing] = React.useState(false);\n\n  useLayoutEffect(() => {\n    collapsibleRef.current?.style.setProperty('--collapsible-size', defaultWidth);\n  }, [defaultWidth]);\n\n  const isCollapsed = useIsCollapsed(open, collapsibleRef);\n  const children = isCollapsed && !open ? null : props.children;\n\n  return (\n    <Box\n      ref={forkRef}\n      {...props}\n      data-is-collapsed={!open}\n      data-collapse-orientation=\"horizontal\"\n      data-is-resizing={resizing}\n      onWidthResize={(width, origin, delta) => {\n        setIsResizing(true);\n        props.onWidthResize?.(width, origin, delta);\n      }}\n      onWidthResizeEnd={(width, origin) => {\n        setIsResizing(false);\n        props.onWidthResizeEnd?.(width, origin);\n        collapsibleRef.current?.style.setProperty('--collapsible-size', `${width}px`);\n      }}\n      className={clsx(\n        props.className,\n        styles['collapsible-box'],\n        'tcn-h-collapsible-box'\n      )}\n      children={children}\n    />\n  );\n});\n"],"names":["HCollapsibleBox","React","open","defaultWidth","props","ref","collapsibleRef","forkRef","useForkRef","resizing","setIsResizing","useLayoutEffect","children","useIsCollapsed","jsx","Box","width","origin","delta","clsx","styles"],"mappings":";;;;;;;;;;;;;AAYO,MAAMA,IAAkBC,EAAM,WAAW,SAC9C,EAAE,MAAAC,IAAO,IAAO,cAAAC,IAAe,SAAS,GAAGC,EAAA,GAC3CC,GACA;AACA,QAAMC,IAAiBL,EAAM,OAA8B,IAAI,GACzDM,IAAUC,EAAWH,GAAKC,CAAc,GACxC,CAACG,GAAUC,CAAa,IAAIT,EAAM,SAAS,EAAK;AAEtD,EAAAU,EAAgB,MAAM;AACpB,IAAAL,EAAe,SAAS,MAAM,YAAY,sBAAsBH,CAAY;AAAA,EAC9E,GAAG,CAACA,CAAY,CAAC;AAGjB,QAAMS,IADcC,EAAeX,GAAMI,CAAc,KACvB,CAACJ,IAAO,OAAOE,EAAM;AAErD,SACE,gBAAAU;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAKR;AAAA,MACJ,GAAGH;AAAA,MACJ,qBAAmB,CAACF;AAAA,MACpB,6BAA0B;AAAA,MAC1B,oBAAkBO;AAAA,MAClB,eAAe,CAACO,GAAOC,GAAQC,MAAU;AACvC,QAAAR,EAAc,EAAI,GAClBN,EAAM,gBAAgBY,GAAOC,GAAQC,CAAK;AAAA,MAC5C;AAAA,MACA,kBAAkB,CAACF,GAAOC,MAAW;AACnC,QAAAP,EAAc,EAAK,GACnBN,EAAM,mBAAmBY,GAAOC,CAAM,GACtCX,EAAe,SAAS,MAAM,YAAY,sBAAsB,GAAGU,CAAK,IAAI;AAAA,MAC9E;AAAA,MACA,WAAWG;AAAA,QACTf,EAAM;AAAA,QACNgB,EAAO,iBAAiB;AAAA,QACxB;AAAA,MAAA;AAAA,MAEF,UAAAR;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;"}
+{"version":3,"file":"h_collapsible_box.js","sources":["../../src/stacks/h_collapsible_box.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport React, { useLayoutEffect } from 'react';\nimport { useForkRef } from '../utils/index.js';\nimport { Box, BoxProps } from './box/box.js';\nimport styles from './collapsible_box.module.css';\nimport { useIsCollapsed } from './utils/use_is_collapsed.js';\n\nexport interface HCollapsibleBoxProps extends BoxProps {\n  open?: boolean;\n  defaultWidth?: string;\n}\n\nexport const HCollapsibleBox = React.forwardRef(function CollapsibleBox(\n  { open = false, defaultWidth = '400px', ...props }: HCollapsibleBoxProps,\n  ref: React.Ref<HTMLDivElement>\n) {\n  const collapsibleRef = React.useRef<HTMLDivElement | null>(null);\n  const forkRef = useForkRef(ref, collapsibleRef);\n  const [resizing, setIsResizing] = React.useState(false);\n\n  useLayoutEffect(() => {\n    collapsibleRef.current?.style.setProperty('--collapsible-size', defaultWidth);\n  }, [defaultWidth]);\n\n  const isCollapsed = useIsCollapsed(open, collapsibleRef);\n  const children = isCollapsed && !open ? null : props.children;\n\n  return (\n    <Box\n      ref={forkRef}\n      {...props}\n      data-is-collapsed={!open}\n      data-collapse-orientation=\"horizontal\"\n      data-is-resizing={resizing}\n      onWidthResize={(...args) => {\n        setIsResizing(true);\n        props.onWidthResize?.(...args);\n      }}\n      onWidthResizeEnd={(width, origin) => {\n        setIsResizing(false);\n        props.onWidthResizeEnd?.(width, origin);\n        collapsibleRef.current?.style.setProperty('--collapsible-size', `${width}px`);\n      }}\n      className={clsx(\n        props.className,\n        styles['collapsible-box'],\n        'tcn-h-collapsible-box'\n      )}\n      children={children}\n    />\n  );\n});\n"],"names":["HCollapsibleBox","React","open","defaultWidth","props","ref","collapsibleRef","forkRef","useForkRef","resizing","setIsResizing","useLayoutEffect","children","useIsCollapsed","jsx","Box","args","width","origin","clsx","styles"],"mappings":";;;;;;;;;;;;;AAYO,MAAMA,IAAkBC,EAAM,WAAW,SAC9C,EAAE,MAAAC,IAAO,IAAO,cAAAC,IAAe,SAAS,GAAGC,EAAA,GAC3CC,GACA;AACA,QAAMC,IAAiBL,EAAM,OAA8B,IAAI,GACzDM,IAAUC,EAAWH,GAAKC,CAAc,GACxC,CAACG,GAAUC,CAAa,IAAIT,EAAM,SAAS,EAAK;AAEtD,EAAAU,EAAgB,MAAM;AACpB,IAAAL,EAAe,SAAS,MAAM,YAAY,sBAAsBH,CAAY;AAAA,EAC9E,GAAG,CAACA,CAAY,CAAC;AAGjB,QAAMS,IADcC,EAAeX,GAAMI,CAAc,KACvB,CAACJ,IAAO,OAAOE,EAAM;AAErD,SACE,gBAAAU;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAKR;AAAA,MACJ,GAAGH;AAAA,MACJ,qBAAmB,CAACF;AAAA,MACpB,6BAA0B;AAAA,MAC1B,oBAAkBO;AAAA,MAClB,eAAe,IAAIO,MAAS;AAC1B,QAAAN,EAAc,EAAI,GAClBN,EAAM,gBAAgB,GAAGY,CAAI;AAAA,MAC/B;AAAA,MACA,kBAAkB,CAACC,GAAOC,MAAW;AACnC,QAAAR,EAAc,EAAK,GACnBN,EAAM,mBAAmBa,GAAOC,CAAM,GACtCZ,EAAe,SAAS,MAAM,YAAY,sBAAsB,GAAGW,CAAK,IAAI;AAAA,MAC9E;AAAA,MACA,WAAWE;AAAA,QACTf,EAAM;AAAA,QACNgB,EAAO,iBAAiB;AAAA,QACxB;AAAA,MAAA;AAAA,MAEF,UAAAR;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;"}

package/dist/stacks/index.d.ts

@@ -1,4 +1,5 @@
 export * from './box/box.js';
+export * from './box/types.js';
 export * from './types/alignment.js';
 export * from './types/as.js';
 export * from './types/common.js';

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/stacks/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,sBAAsB,CAAC;AACrC,cAAc,eAAe,CAAC;AAC9B,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC;AAClC,cAAc,wBAAwB,CAAC;AACvC,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,wBAAwB,CAAC;AACvC,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/stacks/index.ts"],"names":[],"mappings":"AAAA,cAAc,cAAc,CAAC;AAC7B,cAAc,gBAAgB,CAAC;AAC/B,cAAc,sBAAsB,CAAC;AACrC,cAAc,eAAe,CAAC;AAC9B,cAAc,mBAAmB,CAAC;AAClC,cAAc,mBAAmB,CAAC;AAClC,cAAc,wBAAwB,CAAC;AACvC,cAAc,cAAc,CAAC;AAC7B,cAAc,aAAa,CAAC;AAC5B,cAAc,wBAAwB,CAAC;AACvC,cAAc,cAAc,CAAC;AAC7B,cAAc,cAAc,CAAC"}

package/dist/stacks/v_collapsible_box.js

@@ -1,46 +1,46 @@
-import { jsx as u } from "react/jsx-runtime";
-import i, { useLayoutEffect as d } from "react";
+import { jsx as p } from "react/jsx-runtime";
+import t, { useLayoutEffect as u } from "react";
 import "../utils/click_away_listener.js";
 import "../utils/focus_redirect.js";
 import "../utils/scroll_away_listener.js";
-import { useForkRef as R } from "../utils/hooks/use_fork_ref.js";
+import { useForkRef as d } from "../utils/hooks/use_fork_ref.js";
 import "../utils/hooks/use_resize_observer.js";
 import "../utils/dnd/context.js";
-import { clsx as x } from "clsx";
+import { clsx as R } from "clsx";
 import "../draggable.module-BgelQsuJ.js";
-import { Box as b } from "./box/box.js";
-import { s as z } from "../collapsible_box.module-BiS98xXA.js";
-import { useIsCollapsed as y } from "./utils/use_is_collapsed.js";
-const L = i.forwardRef(function({ open: l = !1, defaultHeight: r = "400px", ...e }, c) {
-  const s = i.useRef(null), n = R(c, s), [m, a] = i.useState(!1);
-  d(() => {
-    s.current?.style.setProperty("--collapsible-size", r);
-  }, [r]);
-  const f = y(l, s) && !l ? null : e.children;
-  return /* @__PURE__ */ u(
-    b,
+import { Box as x } from "./box/box.js";
+import { s as b } from "../collapsible_box.module-BiS98xXA.js";
+import { useIsCollapsed as z } from "./utils/use_is_collapsed.js";
+const F = t.forwardRef(function({ open: l = !1, defaultHeight: i = "400px", ...e }, a) {
+  const s = t.useRef(null), c = d(a, s), [n, r] = t.useState(!1);
+  u(() => {
+    s.current?.style.setProperty("--collapsible-size", i);
+  }, [i]);
+  const m = z(l, s) && !l ? null : e.children;
+  return /* @__PURE__ */ p(
+    x,
     {
-      ref: n,
+      ref: c,
       ...e,
       "data-is-collapsed": !l,
       "data-collapse-orientation": "vertical",
-      "data-is-resizing": m,
-      onHeightResize: (o, t, p) => {
-        a(!0), e.onHeightResize?.(o, t, p);
+      "data-is-resizing": n,
+      onHeightResize: (...o) => {
+        r(!0), e.onHeightResize?.(...o);
       },
-      onHeightResizeEnd: (o, t) => {
-        a(!1), s.current?.style.setProperty("--collapsible-size", `${o}px`), e.onHeightResizeEnd?.(o, t);
+      onHeightResizeEnd: (o, f) => {
+        r(!1), s.current?.style.setProperty("--collapsible-size", `${o}px`), e.onHeightResizeEnd?.(o, f);
       },
-      className: x(
+      className: R(
         e.className,
-        z["collapsible-box"],
+        b["collapsible-box"],
         "tcn-v-collapsible-box"
       ),
-      children: f
+      children: m
     }
   );
 });
 export {
-  L as VCollapsibleBox
+  F as VCollapsibleBox
 };
 //# sourceMappingURL=v_collapsible_box.js.map

package/dist/stacks/v_collapsible_box.js.map

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

package/dist/suggestion_list.css

@@ -1 +1 @@
-@layer tcn-system{:where(._suggestion-list_711fb17){border-radius:8px;box-shadow:var(--drop-shadow-depth-3, 0 2px 10px 0 rgba(0, 0, 0, .25));border:1px solid var(--border-tertiary-color);overflow-y:auto;overflow-x:hidden;background-color:#fff}:where(._input_a0df060){position:sticky;top:0;left:0;border:none;margin:0;outline:none;padding-inline-start:8px;height:calc(32px * var(--scalar, 1));min-height:calc(32px * var(--scalar, 1));z-index:2;border-bottom:1px solid var(--border-tertiary-color, #e2e2e2);border-radius:8px 8px 0 0/8px 8px 0px 0px;background-color:#fff;color:var(--font-color);font-size:calc(14px * var(--scalar, 1));width:100%}}
+@layer tcn-system{:where(._suggestion-list_711fb17){border-radius:8px;box-shadow:var(--drop-shadow-depth-3, 0 2px 10px 0 rgba(0, 0, 0, .25));border:1px solid var(--border-tertiary-color);overflow-y:auto;overflow-x:hidden;background-color:#fff;overscroll-behavior:none}:where(._input_a0df060){position:sticky;top:0;left:0;border:none;margin:0;outline:none;padding-inline-start:8px;height:calc(32px * var(--scalar, 1));min-height:calc(32px * var(--scalar, 1));z-index:2;border-bottom:1px solid var(--border-tertiary-color, #e2e2e2);border-radius:8px 8px 0 0/8px 8px 0px 0px;background-color:#fff;color:var(--font-color);font-size:calc(14px * var(--scalar, 1));width:100%}}

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../../../src/surfaces/modal/modal.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAS,KAAK,aAAa,EAAE,MAAM,8BAA8B,CAAC;AACzE,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,oCAAoC,CAAC;AAKlF,MAAM,MAAM,UAAU,GAAG,aAAa,GAAG,aAAa,CAAC;AAEvD,eAAO,MAAM,KAAK,mGAgBhB,CAAC"}
+{"version":3,"file":"modal.d.ts","sourceRoot":"","sources":["../../../src/surfaces/modal/modal.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAMtE,MAAM,MAAM,UAAU,GAAG,UAAU,CAAC;AAEpC,eAAO,MAAM,KAAK,+QAkBhB,CAAC"}

package/dist/surfaces/modal/modal.js

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

package/dist/surfaces/modal/modal.js.map

@@ -1 +1 @@
-{"version":3,"file":"modal.js","sources":["../../../src/surfaces/modal/modal.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport React from 'react';\nimport { Frame, type FrameOwnProps } from '../../overlay/frame/frame.js';\nimport { Scaffold, type ScaffoldProps } from '../../layouts/scaffold/scaffold.js';\n\n// Styles\nimport styles from './modal.module.css';\n\nexport type ModalProps = FrameOwnProps & ScaffoldProps;\n\nexport const Modal = React.forwardRef<HTMLElement, ModalProps>(function Modal(\n  { children, className, isOpen, draggable = false, veil = true, ...props }: ModalProps,\n  ref\n) {\n  return (\n    <Frame\n      isOpen={isOpen}\n      draggable={draggable}\n      veil={veil}\n      className={clsx(styles['modal'], 'tcn-surface', 'tcn-modal', className)}\n    >\n      <Scaffold ref={ref} {...props}>\n        {children}\n      </Scaffold>\n    </Frame>\n  );\n});\n"],"names":["Modal","React","children","className","isOpen","draggable","veil","props","ref","jsx","Frame","clsx","styles","Scaffold"],"mappings":";;;;;8CAUaA,IAAQC,EAAM,WAAoC,SAC7D,EAAE,UAAAC,GAAU,WAAAC,GAAW,QAAAC,GAAQ,WAAAC,IAAY,IAAO,MAAAC,IAAO,IAAM,GAAGC,EAAA,GAClEC,GACA;AACA,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,QAAAN;AAAA,MACA,WAAAC;AAAA,MACA,MAAAC;AAAA,MACA,WAAWK,EAAKC,EAAO,OAAU,eAAe,aAAaT,CAAS;AAAA,MAEtE,UAAA,gBAAAM,EAACI,GAAA,EAAS,KAAAL,GAAW,GAAGD,GACrB,UAAAL,EAAA,CACH;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;"}
+{"version":3,"file":"modal.js","sources":["../../../src/surfaces/modal/modal.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport React from 'react';\nimport { Frame, type FrameProps } from '../../overlay/frame/frame.js';\nimport { Scaffold } from '../../layouts/scaffold/scaffold.js';\n\n// Styles\nimport styles from './modal.module.css';\n\nexport type ModalProps = FrameProps;\n\nexport const Modal = React.forwardRef<HTMLElement, ModalProps>(function Modal(\n  { children, className, isOpen, draggable = false, veil = true, ...props }: ModalProps,\n  ref\n) {\n  return (\n    <Frame\n      ref={ref}\n      isOpen={isOpen}\n      draggable={draggable}\n      veil={veil}\n      className={clsx(styles['modal'], 'tcn-surface', 'tcn-modal', className)}\n      {...props}\n    >\n      <Scaffold className={'tcn-modal-scaffold'} width=\"100%\" height=\"100%\">\n        {children}\n      </Scaffold>\n    </Frame>\n  );\n});\n"],"names":["Modal","React","children","className","isOpen","draggable","veil","props","ref","jsx","Frame","clsx","styles","Scaffold"],"mappings":";;;;;8CAUaA,IAAQC,EAAM,WAAoC,SAC7D,EAAE,UAAAC,GAAU,WAAAC,GAAW,QAAAC,GAAQ,WAAAC,IAAY,IAAO,MAAAC,IAAO,IAAM,GAAGC,EAAA,GAClEC,GACA;AACA,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,KAAAF;AAAA,MACA,QAAAJ;AAAA,MACA,WAAAC;AAAA,MACA,MAAAC;AAAA,MACA,WAAWK,EAAKC,EAAO,OAAU,eAAe,aAAaT,CAAS;AAAA,MACrE,GAAGI;AAAA,MAEJ,UAAA,gBAAAE,EAACI,KAAS,WAAW,sBAAsB,OAAM,QAAO,QAAO,QAC5D,UAAAX,EAAA,CACH;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;"}

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

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

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

@@ -1 +1 @@
-{"version":3,"file":"window.d.ts","sourceRoot":"","sources":["../../../src/surfaces/window/window.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAS,KAAK,aAAa,EAAE,MAAM,8BAA8B,CAAC;AACzE,OAAO,EAAY,KAAK,aAAa,EAAE,MAAM,oCAAoC,CAAC;AAKlF,MAAM,MAAM,WAAW,GAAG,aAAa,GAAG,aAAa,CAAC;AAExD,eAAO,MAAM,MAAM,mGAkBjB,CAAC"}
+{"version":3,"file":"window.d.ts","sourceRoot":"","sources":["../../../src/surfaces/window/window.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAS,KAAK,UAAU,EAAE,MAAM,8BAA8B,CAAC;AAMtE,MAAM,MAAM,WAAW,GAAG,UAAU,CAAC;AAErC,eAAO,MAAM,MAAM,+QA8BjB,CAAC"}

package/dist/surfaces/window/window.js

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

package/dist/surfaces/window/window.js.map

@@ -1 +1 @@
-{"version":3,"file":"window.js","sources":["../../../src/surfaces/window/window.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport React from 'react';\nimport { Frame, type FrameOwnProps } from '../../overlay/frame/frame.js';\nimport { Scaffold, type ScaffoldProps } from '../../layouts/scaffold/scaffold.js';\n\n// Styles\nimport styles from './window.module.css';\n\nexport type WindowProps = FrameOwnProps & ScaffoldProps;\n\nexport const Window = React.forwardRef<HTMLElement, WindowProps>(function Window(\n  { children, className, isOpen, draggable = true, veil = false, ...props }: WindowProps,\n  ref\n) {\n  return (\n    <Frame\n      isOpen={isOpen}\n      draggable={draggable}\n      veil={veil}\n      className={clsx(styles['window'], 'tcn-surface', 'tcn-window', className)}\n      width=\"auto\"\n      height=\"auto\"\n    >\n      <Scaffold ref={ref} {...props}>\n        {children}\n      </Scaffold>\n    </Frame>\n  );\n});\n"],"names":["Window","React","children","className","isOpen","draggable","veil","props","ref","jsx","Frame","clsx","styles","Scaffold"],"mappings":";;;;;gDAUaA,IAASC,EAAM,WAAqC,SAC/D,EAAE,UAAAC,GAAU,WAAAC,GAAW,QAAAC,GAAQ,WAAAC,IAAY,IAAM,MAAAC,IAAO,IAAO,GAAGC,EAAA,GAClEC,GACA;AACA,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,QAAAN;AAAA,MACA,WAAAC;AAAA,MACA,MAAAC;AAAA,MACA,WAAWK,EAAKC,EAAO,QAAW,eAAe,cAAcT,CAAS;AAAA,MACxE,OAAM;AAAA,MACN,QAAO;AAAA,MAEP,UAAA,gBAAAM,EAACI,GAAA,EAAS,KAAAL,GAAW,GAAGD,GACrB,UAAAL,EAAA,CACH;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;"}
+{"version":3,"file":"window.js","sources":["../../../src/surfaces/window/window.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport React from 'react';\nimport { Frame, type FrameProps } from '../../overlay/frame/frame.js';\nimport { Scaffold } from '../../layouts/scaffold/scaffold.js';\n\n// Styles\nimport styles from './window.module.css';\n\nexport type WindowProps = FrameProps;\n\nexport const Window = React.forwardRef<HTMLElement, WindowProps>(function Window(\n  {\n    children,\n    className,\n    isOpen,\n    draggable = true,\n    resizable = true,\n    veil = false,\n    width,\n    height,\n    ...props\n  }: WindowProps,\n  ref\n) {\n  return (\n    <Frame\n      isOpen={isOpen}\n      draggable={draggable}\n      veil={veil}\n      className={clsx(styles['window'], 'tcn-surface', 'tcn-window', className)}\n      width={width}\n      height={height}\n      ref={ref}\n      {...props}\n    >\n      <Scaffold width=\"100%\" height=\"100%\" className={'tcn-window-scaffold'}>\n        {children}\n      </Scaffold>\n    </Frame>\n  );\n});\n"],"names":["Window","React","children","className","isOpen","draggable","resizable","veil","width","height","props","ref","jsx","Frame","clsx","styles","Scaffold"],"mappings":";;;;;gDAUaA,IAASC,EAAM,WAAqC,SAC/D;AAAA,EACE,UAAAC;AAAA,EACA,WAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC,IAAY;AAAA,EACZ,WAAAC,IAAY;AAAA,EACZ,MAAAC,IAAO;AAAA,EACP,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,GAAGC;AACL,GACAC,GACA;AACA,SACE,gBAAAC;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,QAAAT;AAAA,MACA,WAAAC;AAAA,MACA,MAAAE;AAAA,MACA,WAAWO,EAAKC,EAAO,QAAW,eAAe,cAAcZ,CAAS;AAAA,MACxE,OAAAK;AAAA,MACA,QAAAC;AAAA,MACA,KAAAE;AAAA,MACC,GAAGD;AAAA,MAEJ,UAAA,gBAAAE,EAACI,KAAS,OAAM,QAAO,QAAO,QAAO,WAAW,uBAC7C,UAAAd,EAAA,CACH;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;"}

package/dist/themes/stylesheets/reset.css

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