@tcn/ui 0.9.0 → 0.11.0

package/dist/stacks/box/box.js

@@ -1,23 +1,23 @@
 import { jsxs as h, jsx as a } from "react/jsx-runtime";
+import { clsx as O } from "clsx";
+import oo, { useRef as ro } from "react";
 import "../../utils/click_away_listener.js";
 import "../../utils/focus_redirect.js";
 import "../../utils/scroll_away_listener.js";
-import O, { useRef as oo } from "react";
-import { useForkRef as ro } from "../../utils/hooks/use_fork_ref.js";
+import { useForkRef as to } from "../../utils/hooks/use_fork_ref.js";
 import "../../utils/hooks/use_resize_observer.js";
 import "../../utils/dnd/context.js";
-import { clsx as to } from "clsx";
 import "../../draggable.module-BgelQsuJ.js";
-import { LeftResizeHandle as ao } from "./left_resize_handle.js";
-import { RightResizeHandle as eo } from "./right_resize_handle.js";
-import { BottomResizeHandle as fo } from "./bottom_resize_handle.js";
-import { EndResizeHandle as so } from "./end_resize_handle.js";
-import { StartResizeHandle as lo } from "./start_resize_handle.js";
-import { TopResizeHandle as mo } from "./top_resize_handle.js";
-import { isCustomSizeProp as y } from "../utils/isCustomSizeProp.js";
-import { removeUndefinedProperties as no } from "../utils/remove_undefined_properties.js";
-import { s as k } from "../../stack.module-CBV1f12Z.js";
-const Bo = O.forwardRef(function({
+import { s as y } from "../../stack.module-CBV1f12Z.js";
+import { isCustomSizeProp as k } from "../utils/isCustomSizeProp.js";
+import { removeUndefinedProperties as ao } from "../utils/remove_undefined_properties.js";
+import { BottomResizeHandle as eo } from "./bottom_resize_handle.js";
+import { EndResizeHandle as fo } from "./end_resize_handle.js";
+import { LeftResizeHandle as so } from "./left_resize_handle.js";
+import { RightResizeHandle as lo } from "./right_resize_handle.js";
+import { StartResizeHandle as mo } from "./start_resize_handle.js";
+import { TopResizeHandle as no } from "./top_resize_handle.js";
+const Bo = oo.forwardRef(function({
   style: v,
   className: P,
   as: _ = "div",
@@ -56,13 +56,13 @@ const Bo = O.forwardRef(function({
   verticalHandleProps: x,
   ...X
 }, Z) {
-  const $ = _, o = oo(null), L = ro(Z, o), R = l || n || c || p, T = m || s, z = R, E = T, g = z && r === "flex", S = E && t === "flex", F = !g && !S && (r === "flex" || t === "flex");
+  const $ = _, o = ro(null), L = to(Z, o), R = l || n || c || p, T = m || s, z = R, E = T, g = z && r === "flex", S = E && t === "flex", F = !g && !S && (r === "flex" || t === "flex");
   g && (r = "100%", console.warn("You cannot have a resizable box and flex simultaneously")), S && (t = "auto", console.warn("You cannot have a resizable box and flex simultaneously"));
   const W = {
-    width: y(r) ? void 0 : r,
+    width: k(r) ? void 0 : r,
     minWidth: V,
     maxWidth: b,
-    height: y(t) ? void 0 : t,
+    height: k(t) ? void 0 : t,
     minHeight: j,
     maxHeight: w,
     padding: A,
@@ -93,21 +93,21 @@ const Bo = O.forwardRef(function({
       "data-width": r,
       ref: L,
       style: {
-        ...no(W),
+        ...ao(W),
         ...v
       },
-      className: to(
-        k.box,
+      className: O(
+        y.box,
         P,
         F && "stack-flex",
-        F && k["stack-flex"],
+        F && y["stack-flex"],
         "tcn-box"
       ),
       ...X,
       children: [
         H,
         s && /* @__PURE__ */ a(
-          mo,
+          no,
           {
             onHeightResize: d,
             onHeightResizeEnd: u,
@@ -116,7 +116,7 @@ const Bo = O.forwardRef(function({
           }
         ),
         m && /* @__PURE__ */ a(
-          fo,
+          eo,
           {
             onHeightResize: d,
             onHeightResizeEnd: u,
@@ -125,7 +125,7 @@ const Bo = O.forwardRef(function({
           }
         ),
         n && /* @__PURE__ */ a(
-          lo,
+          mo,
           {
             onWidthResize: e,
             onWidthResizeEnd: f,
@@ -134,7 +134,7 @@ const Bo = O.forwardRef(function({
           }
         ),
         l && /* @__PURE__ */ a(
-          so,
+          fo,
           {
             onWidthResize: e,
             onWidthResizeEnd: f,
@@ -143,7 +143,7 @@ const Bo = O.forwardRef(function({
           }
         ),
         c && /* @__PURE__ */ a(
-          ao,
+          so,
           {
             onWidthResize: e,
             onWidthResizeEnd: f,
@@ -152,7 +152,7 @@ const Bo = O.forwardRef(function({
           }
         ),
         p && /* @__PURE__ */ a(
-          eo,
+          lo,
           {
             onWidthResize: e,
             onWidthResizeEnd: f,

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

@@ -1 +1 @@
-{"version":3,"file":"box.js","sources":["../../../src/stacks/box/box.tsx"],"sourcesContent":["import { useForkRef } from '../../utils/index.js';\nimport React, { CSSProperties, HTMLAttributes, useRef } from 'react';\nimport { LeftResizeHandle } from './left_resize_handle.js';\nimport { RightResizeHandle } from './right_resize_handle.js';\nimport { BottomResizeHandle } from './bottom_resize_handle.js';\nimport { EndResizeHandle } from './end_resize_handle.js';\nimport { StartResizeHandle } from './start_resize_handle.js';\nimport { TopResizeHandle } from './top_resize_handle.js';\nimport { clsx } from 'clsx';\nimport { isCustomSizeProp } from '../utils/isCustomSizeProp.js';\nimport { removeUndefinedProperties } from '../utils/remove_undefined_properties.js';\nimport styles from '../stack.module.css';\nimport { HandleProps } from './handle_props.js';\n\nexport interface BoxProps<T extends HTMLElement = HTMLElement> extends HTMLAttributes<T> {\n  as?: string;\n  style?: React.CSSProperties;\n  className?: string;\n  children?: React.ReactNode;\n  width?: 'default' | 'flex' | 'auto' | string | number;\n  minWidth?: CSSProperties['minWidth'];\n  maxWidth?: CSSProperties['maxWidth'];\n  height?: 'default' | 'flex' | 'auto' | string | number;\n  minHeight?: CSSProperties['minHeight'];\n  maxHeight?: CSSProperties['maxHeight'];\n  zIndex?: number;\n  padding?: CSSProperties['padding'];\n  paddingInline?: CSSProperties['paddingInline'];\n  paddingBlock?: CSSProperties['paddingBlock'];\n  margin?: CSSProperties['margin'];\n  marginBlock?: CSSProperties['marginBlock'];\n  marginInline?: CSSProperties['marginInline'];\n  marginInlineStart?: CSSProperties['marginInlineStart'];\n  marginInlineEnd?: CSSProperties['marginInlineEnd'];\n  marginTop?: CSSProperties['marginTop'];\n  marginBottom?: CSSProperties['marginBottom'];\n  overflow?: React.CSSProperties['overflow'];\n  overflowX?: React.CSSProperties['overflowX'];\n  overflowY?: React.CSSProperties['overflowY'];\n  enableResizeOnTop?: boolean;\n  enableResizeOnEnd?: boolean;\n  enableResizeOnBottom?: boolean;\n  enableResizeOnStart?: boolean;\n  enableResizeOnLeft?: boolean;\n  enableResizeOnRight?: boolean;\n  horizontalHandleProps?: HandleProps;\n  verticalHandleProps?: HandleProps;\n  onWidthResize?: (\n    width: number\n    // origin: 'left' | 'right'\n  ) => void;\n  onHeightResize?: (\n    height: number\n    // origin: 'top' | 'bottom'\n  ) => void;\n  onWidthResizeEnd?: (width: number) => void;\n  onHeightResizeEnd?: (width: number) => void;\n}\n\nexport const Box = React.forwardRef<HTMLElement, BoxProps>(function Box(\n  {\n    style,\n    className,\n    as = 'div',\n    children,\n    width = 'default',\n    minWidth,\n    maxWidth,\n    height = 'default',\n    minHeight,\n    maxHeight,\n    zIndex,\n    padding,\n    paddingInline,\n    paddingBlock,\n    margin,\n    marginBlock,\n    marginInline,\n    marginInlineStart,\n    marginInlineEnd,\n    marginTop,\n    marginBottom,\n    overflow,\n    overflowX,\n    overflowY,\n    enableResizeOnTop = false,\n    enableResizeOnEnd = false,\n    enableResizeOnBottom = false,\n    enableResizeOnStart = false,\n    enableResizeOnLeft = false,\n    enableResizeOnRight = false,\n    onWidthResize,\n    onHeightResize,\n    onWidthResizeEnd,\n    onHeightResizeEnd,\n    horizontalHandleProps,\n    verticalHandleProps,\n    ...otherProps\n  }: BoxProps,\n  ref\n) {\n  const As = as as React.ElementType;\n  const boxRef = useRef<HTMLElement | null>(null);\n  const forkedRef = useForkRef(ref, boxRef);\n  const hasHorizontalResize =\n    enableResizeOnEnd || enableResizeOnStart || enableResizeOnLeft || enableResizeOnRight;\n  const hasVerticalResize = enableResizeOnBottom || enableResizeOnTop;\n\n  const cannotHorizontalFlex = hasHorizontalResize;\n  const cannotVerticalFlex = hasVerticalResize;\n  const warnHorizontalFlex = cannotHorizontalFlex && width === 'flex';\n  const warnVerticalFlex = cannotVerticalFlex && height === 'flex';\n  const isFlexing =\n    !warnHorizontalFlex && !warnVerticalFlex && (width === 'flex' || height === 'flex');\n\n  if (warnHorizontalFlex) {\n    width = '100%';\n    // biome-ignore lint/suspicious/noConsole: Need to warn the developer\n    console.warn('You cannot have a resizable box and flex simultaneously');\n  }\n\n  if (warnVerticalFlex) {\n    height = 'auto';\n    // biome-ignore lint/suspicious/noConsole: Need to warn the developer\n    console.warn('You cannot have a resizable box and flex simultaneously');\n  }\n\n  const propStyles = {\n    width: !isCustomSizeProp(width) ? width : undefined,\n    minWidth,\n    maxWidth,\n    height: !isCustomSizeProp(height) ? height : undefined,\n    minHeight,\n    maxHeight,\n    padding,\n    paddingInline,\n    paddingBlock,\n    margin,\n    marginBlock,\n    marginInline,\n    marginInlineStart,\n    marginInlineEnd,\n    marginTop,\n    marginBottom,\n    overflow,\n    overflowX,\n    overflowY,\n    zIndex,\n  };\n\n  return (\n    <As\n      data-enabled-resize-on-start={String(enableResizeOnStart)}\n      data-enabled-resize-on-end={String(enableResizeOnEnd)}\n      data-enabled-resize-on-top={String(enableResizeOnTop)}\n      data-enabled-resize-on-bottom={String(enableResizeOnBottom)}\n      data_enabled-resize-on-left={String(enableResizeOnLeft)}\n      data_enabled-resize-on-right={String(enableResizeOnRight)}\n      data-height={height}\n      data-width={width}\n      ref={forkedRef}\n      style={{\n        ...removeUndefinedProperties(propStyles),\n        ...style,\n      }}\n      className={clsx(\n        styles['box'],\n        className,\n        isFlexing && 'stack-flex',\n        isFlexing && styles['stack-flex'],\n        'tcn-box'\n      )}\n      {...otherProps}\n    >\n      {children}\n      {enableResizeOnTop && (\n        <TopResizeHandle\n          onHeightResize={onHeightResize}\n          onHeightResizeEnd={onHeightResizeEnd}\n          targetRef={boxRef}\n          handleProps={horizontalHandleProps}\n        />\n      )}\n      {enableResizeOnBottom && (\n        <BottomResizeHandle\n          onHeightResize={onHeightResize}\n          onHeightResizeEnd={onHeightResizeEnd}\n          targetRef={boxRef}\n          handleProps={verticalHandleProps}\n        />\n      )}\n      {enableResizeOnStart && (\n        <StartResizeHandle\n          onWidthResize={onWidthResize}\n          onWidthResizeEnd={onWidthResizeEnd}\n          targetRef={boxRef}\n          handleProps={horizontalHandleProps}\n        />\n      )}\n      {enableResizeOnEnd && (\n        <EndResizeHandle\n          onWidthResize={onWidthResize}\n          onWidthResizeEnd={onWidthResizeEnd}\n          targetRef={boxRef}\n          handleProps={horizontalHandleProps}\n        />\n      )}\n      {enableResizeOnLeft && (\n        <LeftResizeHandle\n          onWidthResize={onWidthResize}\n          onWidthResizeEnd={onWidthResizeEnd}\n          targetRef={boxRef}\n          handleProps={verticalHandleProps}\n        />\n      )}\n      {enableResizeOnRight && (\n        <RightResizeHandle\n          onWidthResize={onWidthResize}\n          onWidthResizeEnd={onWidthResizeEnd}\n          targetRef={boxRef}\n          handleProps={verticalHandleProps}\n        />\n      )}\n    </As>\n  );\n});\n"],"names":["Box","React","style","className","as","children","width","minWidth","maxWidth","height","minHeight","maxHeight","zIndex","padding","paddingInline","paddingBlock","margin","marginBlock","marginInline","marginInlineStart","marginInlineEnd","marginTop","marginBottom","overflow","overflowX","overflowY","enableResizeOnTop","enableResizeOnEnd","enableResizeOnBottom","enableResizeOnStart","enableResizeOnLeft","enableResizeOnRight","onWidthResize","onHeightResize","onWidthResizeEnd","onHeightResizeEnd","horizontalHandleProps","verticalHandleProps","otherProps","ref","As","boxRef","useRef","forkedRef","useForkRef","hasHorizontalResize","hasVerticalResize","cannotHorizontalFlex","cannotVerticalFlex","warnHorizontalFlex","warnVerticalFlex","isFlexing","propStyles","isCustomSizeProp","jsxs","removeUndefinedProperties","clsx","styles","jsx","TopResizeHandle","BottomResizeHandle","StartResizeHandle","EndResizeHandle","LeftResizeHandle","RightResizeHandle"],"mappings":"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"}
+{"version":3,"file":"box.js","sources":["../../../src/stacks/box/box.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport React, { CSSProperties, HTMLAttributes, useRef } from 'react';\nimport { useForkRef } from '../../utils/index.js';\nimport styles from '../stack.module.css';\nimport { isCustomSizeProp } from '../utils/isCustomSizeProp.js';\nimport { removeUndefinedProperties } from '../utils/remove_undefined_properties.js';\nimport { BottomResizeHandle } from './bottom_resize_handle.js';\nimport { EndResizeHandle } from './end_resize_handle.js';\nimport { HandleProps } from './handle_props.js';\nimport { LeftResizeHandle } from './left_resize_handle.js';\nimport { RightResizeHandle } from './right_resize_handle.js';\nimport { StartResizeHandle } from './start_resize_handle.js';\nimport { TopResizeHandle } from './top_resize_handle.js';\n\nexport interface BoxProps<T extends HTMLElement = HTMLElement> extends HTMLAttributes<T> {\n  as?: string;\n  style?: React.CSSProperties;\n  className?: string;\n  children?: React.ReactNode;\n  width?: 'default' | 'flex' | 'auto' | string | number;\n  minWidth?: CSSProperties['minWidth'];\n  maxWidth?: CSSProperties['maxWidth'];\n  height?: 'default' | 'flex' | 'auto' | string | number;\n  minHeight?: CSSProperties['minHeight'];\n  maxHeight?: CSSProperties['maxHeight'];\n  zIndex?: number;\n  padding?: CSSProperties['padding'];\n  paddingInline?: CSSProperties['paddingInline'];\n  paddingBlock?: CSSProperties['paddingBlock'];\n  margin?: CSSProperties['margin'];\n  marginBlock?: CSSProperties['marginBlock'];\n  marginInline?: CSSProperties['marginInline'];\n  marginInlineStart?: CSSProperties['marginInlineStart'];\n  marginInlineEnd?: CSSProperties['marginInlineEnd'];\n  marginTop?: CSSProperties['marginTop'];\n  marginBottom?: CSSProperties['marginBottom'];\n  overflow?: React.CSSProperties['overflow'];\n  overflowX?: React.CSSProperties['overflowX'];\n  overflowY?: React.CSSProperties['overflowY'];\n  enableResizeOnTop?: boolean;\n  enableResizeOnEnd?: boolean;\n  enableResizeOnBottom?: boolean;\n  enableResizeOnStart?: boolean;\n  enableResizeOnLeft?: boolean;\n  enableResizeOnRight?: boolean;\n  horizontalHandleProps?: HandleProps;\n  verticalHandleProps?: HandleProps;\n  onWidthResize?: (\n    width: number,\n    origin: 'left' | 'right',\n    totalDelta: number,\n    currentDelta: number\n  ) => void;\n  onHeightResize?: (\n    height: number,\n    origin: 'top' | 'bottom',\n    totalDelta: number,\n    currentDelta: number\n  ) => void;\n  onWidthResizeEnd?: (width: number, origin: 'left' | 'right') => void;\n  onHeightResizeEnd?: (height: number, origin: 'top' | 'bottom') => void;\n}\n\nexport const Box = React.forwardRef<HTMLElement, BoxProps>(function Box(\n  {\n    style,\n    className,\n    as = 'div',\n    children,\n    width = 'default',\n    minWidth,\n    maxWidth,\n    height = 'default',\n    minHeight,\n    maxHeight,\n    zIndex,\n    padding,\n    paddingInline,\n    paddingBlock,\n    margin,\n    marginBlock,\n    marginInline,\n    marginInlineStart,\n    marginInlineEnd,\n    marginTop,\n    marginBottom,\n    overflow,\n    overflowX,\n    overflowY,\n    enableResizeOnTop = false,\n    enableResizeOnEnd = false,\n    enableResizeOnBottom = false,\n    enableResizeOnStart = false,\n    enableResizeOnLeft = false,\n    enableResizeOnRight = false,\n    onWidthResize,\n    onHeightResize,\n    onWidthResizeEnd,\n    onHeightResizeEnd,\n    horizontalHandleProps,\n    verticalHandleProps,\n    ...otherProps\n  }: BoxProps,\n  ref\n) {\n  const As = as as React.ElementType;\n  const boxRef = useRef<HTMLElement | null>(null);\n  const forkedRef = useForkRef(ref, boxRef);\n  const hasHorizontalResize =\n    enableResizeOnEnd || enableResizeOnStart || enableResizeOnLeft || enableResizeOnRight;\n  const hasVerticalResize = enableResizeOnBottom || enableResizeOnTop;\n\n  const cannotHorizontalFlex = hasHorizontalResize;\n  const cannotVerticalFlex = hasVerticalResize;\n  const warnHorizontalFlex = cannotHorizontalFlex && width === 'flex';\n  const warnVerticalFlex = cannotVerticalFlex && height === 'flex';\n  const isFlexing =\n    !warnHorizontalFlex && !warnVerticalFlex && (width === 'flex' || height === 'flex');\n\n  if (warnHorizontalFlex) {\n    width = '100%';\n    // biome-ignore lint/suspicious/noConsole: Need to warn the developer\n    console.warn('You cannot have a resizable box and flex simultaneously');\n  }\n\n  if (warnVerticalFlex) {\n    height = 'auto';\n    // biome-ignore lint/suspicious/noConsole: Need to warn the developer\n    console.warn('You cannot have a resizable box and flex simultaneously');\n  }\n\n  const propStyles = {\n    width: !isCustomSizeProp(width) ? width : undefined,\n    minWidth,\n    maxWidth,\n    height: !isCustomSizeProp(height) ? height : undefined,\n    minHeight,\n    maxHeight,\n    padding,\n    paddingInline,\n    paddingBlock,\n    margin,\n    marginBlock,\n    marginInline,\n    marginInlineStart,\n    marginInlineEnd,\n    marginTop,\n    marginBottom,\n    overflow,\n    overflowX,\n    overflowY,\n    zIndex,\n  };\n\n  return (\n    <As\n      data-enabled-resize-on-start={String(enableResizeOnStart)}\n      data-enabled-resize-on-end={String(enableResizeOnEnd)}\n      data-enabled-resize-on-top={String(enableResizeOnTop)}\n      data-enabled-resize-on-bottom={String(enableResizeOnBottom)}\n      data_enabled-resize-on-left={String(enableResizeOnLeft)}\n      data_enabled-resize-on-right={String(enableResizeOnRight)}\n      data-height={height}\n      data-width={width}\n      ref={forkedRef}\n      style={{\n        ...removeUndefinedProperties(propStyles),\n        ...style,\n      }}\n      className={clsx(\n        styles['box'],\n        className,\n        isFlexing && 'stack-flex',\n        isFlexing && styles['stack-flex'],\n        'tcn-box'\n      )}\n      {...otherProps}\n    >\n      {children}\n      {enableResizeOnTop && (\n        <TopResizeHandle\n          onHeightResize={onHeightResize}\n          onHeightResizeEnd={onHeightResizeEnd}\n          targetRef={boxRef}\n          handleProps={horizontalHandleProps}\n        />\n      )}\n      {enableResizeOnBottom && (\n        <BottomResizeHandle\n          onHeightResize={onHeightResize}\n          onHeightResizeEnd={onHeightResizeEnd}\n          targetRef={boxRef}\n          handleProps={verticalHandleProps}\n        />\n      )}\n      {enableResizeOnStart && (\n        <StartResizeHandle\n          onWidthResize={onWidthResize}\n          onWidthResizeEnd={onWidthResizeEnd}\n          targetRef={boxRef}\n          handleProps={horizontalHandleProps}\n        />\n      )}\n      {enableResizeOnEnd && (\n        <EndResizeHandle\n          onWidthResize={onWidthResize}\n          onWidthResizeEnd={onWidthResizeEnd}\n          targetRef={boxRef}\n          handleProps={horizontalHandleProps}\n        />\n      )}\n      {enableResizeOnLeft && (\n        <LeftResizeHandle\n          onWidthResize={onWidthResize}\n          onWidthResizeEnd={onWidthResizeEnd}\n          targetRef={boxRef}\n          handleProps={verticalHandleProps}\n        />\n      )}\n      {enableResizeOnRight && (\n        <RightResizeHandle\n          onWidthResize={onWidthResize}\n          onWidthResizeEnd={onWidthResizeEnd}\n          targetRef={boxRef}\n          handleProps={verticalHandleProps}\n        />\n      )}\n    </As>\n  );\n});\n"],"names":["Box","React","style","className","as","children","width","minWidth","maxWidth","height","minHeight","maxHeight","zIndex","padding","paddingInline","paddingBlock","margin","marginBlock","marginInline","marginInlineStart","marginInlineEnd","marginTop","marginBottom","overflow","overflowX","overflowY","enableResizeOnTop","enableResizeOnEnd","enableResizeOnBottom","enableResizeOnStart","enableResizeOnLeft","enableResizeOnRight","onWidthResize","onHeightResize","onWidthResizeEnd","onHeightResizeEnd","horizontalHandleProps","verticalHandleProps","otherProps","ref","As","boxRef","useRef","forkedRef","useForkRef","hasHorizontalResize","hasVerticalResize","cannotHorizontalFlex","cannotVerticalFlex","warnHorizontalFlex","warnVerticalFlex","isFlexing","propStyles","isCustomSizeProp","jsxs","removeUndefinedProperties","clsx","styles","jsx","TopResizeHandle","BottomResizeHandle","StartResizeHandle","EndResizeHandle","LeftResizeHandle","RightResizeHandle"],"mappings":"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"}

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

@@ -3,8 +3,8 @@ import { HandleProps } from './handle_props.js';
 export interface EndResizeHandleProps {
     targetRef: React.MutableRefObject<HTMLElement | null>;
     handleProps?: HandleProps;
-    onWidthResize?: (value: number) => void;
-    onWidthResizeEnd?: (value: number) => void;
+    onWidthResize?: (width: number, origin: 'left' | 'right', totalDelta: number, currentDelta: number) => void;
+    onWidthResizeEnd?: (width: number, origin: 'left' | 'right') => void;
 }
 export declare function EndResizeHandle({ targetRef, handleProps, onWidthResize, onWidthResizeEnd, }: EndResizeHandleProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=end_resize_handle.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"end_resize_handle.d.ts","sourceRoot":"","sources":["../../../src/stacks/box/end_resize_handle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAI1B,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAErD,MAAM,WAAW,oBAAoB;IACnC,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,KAAK,IAAI,CAAC;IACxC,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAC5C;AAED,wBAAgB,eAAe,CAAC,EAC9B,SAAS,EACT,WAAW,EACX,aAAa,EACb,gBAAgB,GACjB,EAAE,oBAAoB,2CAuBtB"}
+{"version":3,"file":"end_resize_handle.d.ts","sourceRoot":"","sources":["../../../src/stacks/box/end_resize_handle.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAGhD,MAAM,WAAW,oBAAoB;IACnC,SAAS,EAAE,KAAK,CAAC,gBAAgB,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IACtD,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,aAAa,CAAC,EAAE,CACd,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,MAAM,GAAG,OAAO,EACxB,UAAU,EAAE,MAAM,EAClB,YAAY,EAAE,MAAM,KACjB,IAAI,CAAC;IACV,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,OAAO,KAAK,IAAI,CAAC;CACtE;AACD,wBAAgB,eAAe,CAAC,EAC9B,SAAS,EACT,WAAW,EACX,aAAa,EACb,gBAAgB,GACjB,EAAE,oBAAoB,2CAwBtB"}

package/dist/stacks/box/end_resize_handle.js

@@ -1,6 +1,6 @@
 import { jsx as d } from "react/jsx-runtime";
-import { createHorizontalResizeHandler as l } from "./resize_handlers.js";
-import { clsx as c } from "clsx";
+import { clsx as l } from "clsx";
+import { createHorizontalResizeHandler as c } from "./resize_handlers.js";
 import '../../end_resize_handle.css';const f = "_end-resize-handle_1c5e6ba", z = { "end-resize-handle": f };
 function x({
   targetRef: n,
@@ -8,10 +8,11 @@ function x({
   onWidthResize: s,
   onWidthResizeEnd: t
 }) {
-  const i = l(
+  const i = c(
     n,
     s,
-    t
+    t,
+    "right"
   ), o = e?.offset ? e.offset : -8, r = {
     ...e?.style,
     "--resize-offset": `${o}px`,
@@ -20,7 +21,7 @@ function x({
   return /* @__PURE__ */ d(
     "div",
     {
-      className: c(z["end-resize-handle"], "tcn-end-resize-handle"),
+      className: l(z["end-resize-handle"], "tcn-end-resize-handle"),
       onMouseDown: i,
       style: r,
       children: e?.children

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

@@ -1 +1 @@
-{"version":3,"file":"end_resize_handle.js","sources":["../../../src/stacks/box/end_resize_handle.tsx"],"sourcesContent":["import React from 'react';\nimport styles from './end_resize_handle.module.css';\nimport { createHorizontalResizeHandler } from './resize_handlers.js';\nimport { clsx } from 'clsx';\nimport type { HandleProps } from './handle_props.js';\n\nexport interface EndResizeHandleProps {\n  targetRef: React.MutableRefObject<HTMLElement | null>;\n  handleProps?: HandleProps;\n  onWidthResize?: (value: number) => void;\n  onWidthResizeEnd?: (value: number) => void;\n}\n\nexport function EndResizeHandle({\n  targetRef,\n  handleProps,\n  onWidthResize,\n  onWidthResizeEnd,\n}: EndResizeHandleProps) {\n  const resizeHandler = createHorizontalResizeHandler(\n    targetRef,\n    onWidthResize,\n    onWidthResizeEnd\n  );\n  const offset = handleProps?.offset ? handleProps.offset : -8;\n\n  const endResizeHandleStyle: any = {\n    ...handleProps?.style,\n    '--resize-offset': `${offset}px`,\n    width: handleProps?.size || '16px',\n  };\n\n  return (\n    <div\n      className={clsx(styles['end-resize-handle'], 'tcn-end-resize-handle')}\n      onMouseDown={resizeHandler}\n      style={endResizeHandleStyle}\n    >\n      {handleProps?.children}\n    </div>\n  );\n}\n"],"names":["EndResizeHandle","targetRef","handleProps","onWidthResize","onWidthResizeEnd","resizeHandler","createHorizontalResizeHandler","offset","endResizeHandleStyle","jsx","clsx","styles"],"mappings":";;;;AAaO,SAASA,EAAgB;AAAA,EAC9B,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,eAAAC;AAAA,EACA,kBAAAC;AACF,GAAyB;AACvB,QAAMC,IAAgBC;AAAA,IACpBL;AAAA,IACAE;AAAA,IACAC;AAAA,EAAA,GAEIG,IAASL,GAAa,SAASA,EAAY,SAAS,IAEpDM,IAA4B;AAAA,IAChC,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,mBAAmB,GAAG,uBAAuB;AAAA,MACpE,aAAaN;AAAA,MACb,OAAOG;AAAA,MAEN,UAAAN,GAAa;AAAA,IAAA;AAAA,EAAA;AAGpB;"}
+{"version":3,"file":"end_resize_handle.js","sources":["../../../src/stacks/box/end_resize_handle.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport React from 'react';\nimport styles from './end_resize_handle.module.css';\nimport { HandleProps } from './handle_props.js';\nimport { createHorizontalResizeHandler } from './resize_handlers.js';\n\nexport interface EndResizeHandleProps {\n  targetRef: React.MutableRefObject<HTMLElement | null>;\n  handleProps?: HandleProps;\n  onWidthResize?: (\n    width: number,\n    origin: 'left' | 'right',\n    totalDelta: number,\n    currentDelta: number\n  ) => void;\n  onWidthResizeEnd?: (width: number, origin: 'left' | 'right') => void;\n}\nexport function EndResizeHandle({\n  targetRef,\n  handleProps,\n  onWidthResize,\n  onWidthResizeEnd,\n}: EndResizeHandleProps) {\n  const resizeHandler = createHorizontalResizeHandler(\n    targetRef,\n    onWidthResize,\n    onWidthResizeEnd,\n    'right'\n  );\n  const offset = handleProps?.offset ? handleProps.offset : -8;\n\n  const endResizeHandleStyle: any = {\n    ...handleProps?.style,\n    '--resize-offset': `${offset}px`,\n    width: handleProps?.size || '16px',\n  };\n\n  return (\n    <div\n      className={clsx(styles['end-resize-handle'], 'tcn-end-resize-handle')}\n      onMouseDown={resizeHandler}\n      style={endResizeHandleStyle}\n    >\n      {handleProps?.children}\n    </div>\n  );\n}\n"],"names":["EndResizeHandle","targetRef","handleProps","onWidthResize","onWidthResizeEnd","resizeHandler","createHorizontalResizeHandler","offset","endResizeHandleStyle","jsx","clsx","styles"],"mappings":";;;;AAiBO,SAASA,EAAgB;AAAA,EAC9B,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,eAAAC;AAAA,EACA,kBAAAC;AACF,GAAyB;AACvB,QAAMC,IAAgBC;AAAA,IACpBL;AAAA,IACAE;AAAA,IACAC;AAAA,IACA;AAAA,EAAA,GAEIG,IAASL,GAAa,SAASA,EAAY,SAAS,IAEpDM,IAA4B;AAAA,IAChC,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,mBAAmB,GAAG,uBAAuB;AAAA,MACpE,aAAaN;AAAA,MACb,OAAOG;AAAA,MAEN,UAAAN,GAAa;AAAA,IAAA;AAAA,EAAA;AAGpB;"}

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

@@ -3,8 +3,8 @@ import { HandleProps } from './handle_props.js';
 export interface LeftResizeHandleProps {
     targetRef: React.MutableRefObject<HTMLElement | null>;
     handleProps?: HandleProps;
-    onWidthResize?: (value: number) => void;
-    onWidthResizeEnd?: (value: number) => void;
+    onWidthResize?: (width: number, origin: 'left' | 'right', totalDelta: number, currentDelta: number) => void;
+    onWidthResizeEnd?: (width: number, origin: 'left' | 'right') => void;
 }
 export declare function LeftResizeHandle({ targetRef, handleProps, onWidthResize, onWidthResizeEnd, }: LeftResizeHandleProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=left_resize_handle.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"left_resize_handle.d.ts","sourceRoot":"","sources":["../../../src/stacks/box/left_resize_handle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAKhD,MAAM,WAAW,qBAAqB;IACpC,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,KAAK,IAAI,CAAC;IACxC,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAC5C;AACD,wBAAgB,gBAAgB,CAAC,EAC/B,SAAS,EACT,WAAW,EACX,aAAa,EACb,gBAAgB,GACjB,EAAE,qBAAqB,2CAyBvB"}
+{"version":3,"file":"left_resize_handle.d.ts","sourceRoot":"","sources":["../../../src/stacks/box/left_resize_handle.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,WAAW,EAAE,MAAM,mBAAmB,CAAC;AAIhD,MAAM,WAAW,qBAAqB;IACpC,SAAS,EAAE,KAAK,CAAC,gBAAgB,CAAC,WAAW,GAAG,IAAI,CAAC,CAAC;IACtD,WAAW,CAAC,EAAE,WAAW,CAAC;IAC1B,aAAa,CAAC,EAAE,CACd,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,MAAM,GAAG,OAAO,EACxB,UAAU,EAAE,MAAM,EAClB,YAAY,EAAE,MAAM,KACjB,IAAI,CAAC;IACV,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,OAAO,KAAK,IAAI,CAAC;CACtE;AACD,wBAAgB,gBAAgB,CAAC,EAC/B,SAAS,EACT,WAAW,EACX,aAAa,EACb,gBAAgB,GACjB,EAAE,qBAAqB,2CA0BvB"}

package/dist/stacks/box/left_resize_handle.js

@@ -1,29 +1,30 @@
 import { jsx as r } from "react/jsx-runtime";
-import { createHorizontalResizeHandler as o } from "./resize_handlers.js";
-import { clsx as c } from "clsx";
+import { clsx as o } from "clsx";
+import { createHorizontalResizeHandler as c } from "./resize_handlers.js";
 import '../../left_resize_handle.css';const z = "_left-resize-handle_215501a", a = { "left-resize-handle": z };
 function u({
   targetRef: t,
   handleProps: e,
   onWidthResize: s,
-  onWidthResizeEnd: i
+  onWidthResizeEnd: l
 }) {
-  const l = o(
+  const f = c(
     t,
     s,
-    i,
+    l,
+    "left",
     !0,
     !0
-  ), f = e?.offset ? e.offset : -8, n = {
+  ), i = e?.offset ? e.offset : -8, n = {
     ...e?.style,
-    "--resize-offset": `${f}px`,
+    "--resize-offset": `${i}px`,
     width: e?.size || "16px"
   };
   return /* @__PURE__ */ r(
     "div",
     {
-      className: c(a["left-resize-handle"], "tcn-left-resize-handle"),
-      onMouseDown: l,
+      className: o(a["left-resize-handle"], "tcn-left-resize-handle"),
+      onMouseDown: f,
       style: n,
       children: e?.children
     }

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

@@ -1 +1 @@
-{"version":3,"file":"left_resize_handle.js","sources":["../../../src/stacks/box/left_resize_handle.tsx"],"sourcesContent":["import React from 'react';\nimport { HandleProps } from './handle_props.js';\nimport styles from './left_resize_handle.module.css';\nimport { createHorizontalResizeHandler } from './resize_handlers.js';\nimport { clsx } from 'clsx';\n\nexport interface LeftResizeHandleProps {\n  targetRef: React.MutableRefObject<HTMLElement | null>;\n  handleProps?: HandleProps;\n  onWidthResize?: (value: number) => void;\n  onWidthResizeEnd?: (value: number) => void;\n}\nexport function LeftResizeHandle({\n  targetRef,\n  handleProps,\n  onWidthResize,\n  onWidthResizeEnd,\n}: LeftResizeHandleProps) {\n  const resizeHandler = createHorizontalResizeHandler(\n    targetRef,\n    onWidthResize,\n    onWidthResizeEnd,\n    true,\n    true\n  );\n  const offset = handleProps?.offset ? handleProps.offset : -8;\n\n  const leftResizeHandleStyle: any = {\n    ...handleProps?.style,\n    '--resize-offset': `${offset}px`,\n    width: handleProps?.size || '16px',\n  };\n\n  return (\n    <div\n      className={clsx(styles['left-resize-handle'], 'tcn-left-resize-handle')}\n      onMouseDown={resizeHandler}\n      style={leftResizeHandleStyle}\n    >\n      {handleProps?.children}\n    </div>\n  );\n}\n"],"names":["LeftResizeHandle","targetRef","handleProps","onWidthResize","onWidthResizeEnd","resizeHandler","createHorizontalResizeHandler","offset","leftResizeHandleStyle","jsx","clsx","styles"],"mappings":";;;;AAYO,SAASA,EAAiB;AAAA,EAC/B,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,eAAAC;AAAA,EACA,kBAAAC;AACF,GAA0B;AACxB,QAAMC,IAAgBC;AAAA,IACpBL;AAAA,IACAE;AAAA,IACAC;AAAA,IACA;AAAA,IACA;AAAA,EAAA,GAEIG,IAASL,GAAa,SAASA,EAAY,SAAS,IAEpDM,IAA6B;AAAA,IACjC,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,oBAAoB,GAAG,wBAAwB;AAAA,MACtE,aAAaN;AAAA,MACb,OAAOG;AAAA,MAEN,UAAAN,GAAa;AAAA,IAAA;AAAA,EAAA;AAGpB;"}
+{"version":3,"file":"left_resize_handle.js","sources":["../../../src/stacks/box/left_resize_handle.tsx"],"sourcesContent":["import { clsx } from 'clsx';\nimport React from 'react';\nimport { HandleProps } from './handle_props.js';\nimport styles from './left_resize_handle.module.css';\nimport { createHorizontalResizeHandler } from './resize_handlers.js';\n\nexport interface LeftResizeHandleProps {\n  targetRef: React.MutableRefObject<HTMLElement | null>;\n  handleProps?: HandleProps;\n  onWidthResize?: (\n    width: number,\n    origin: 'left' | 'right',\n    totalDelta: number,\n    currentDelta: number\n  ) => void;\n  onWidthResizeEnd?: (width: number, origin: 'left' | 'right') => void;\n}\nexport function LeftResizeHandle({\n  targetRef,\n  handleProps,\n  onWidthResize,\n  onWidthResizeEnd,\n}: LeftResizeHandleProps) {\n  const resizeHandler = createHorizontalResizeHandler(\n    targetRef,\n    onWidthResize,\n    onWidthResizeEnd,\n    'left',\n    true,\n    true\n  );\n  const offset = handleProps?.offset ? handleProps.offset : -8;\n\n  const leftResizeHandleStyle: any = {\n    ...handleProps?.style,\n    '--resize-offset': `${offset}px`,\n    width: handleProps?.size || '16px',\n  };\n\n  return (\n    <div\n      className={clsx(styles['left-resize-handle'], 'tcn-left-resize-handle')}\n      onMouseDown={resizeHandler}\n      style={leftResizeHandleStyle}\n    >\n      {handleProps?.children}\n    </div>\n  );\n}\n"],"names":["LeftResizeHandle","targetRef","handleProps","onWidthResize","onWidthResizeEnd","resizeHandler","createHorizontalResizeHandler","offset","leftResizeHandleStyle","jsx","clsx","styles"],"mappings":";;;;AAiBO,SAASA,EAAiB;AAAA,EAC/B,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,eAAAC;AAAA,EACA,kBAAAC;AACF,GAA0B;AACxB,QAAMC,IAAgBC;AAAA,IACpBL;AAAA,IACAE;AAAA,IACAC;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA,GAEIG,IAASL,GAAa,SAASA,EAAY,SAAS,IAEpDM,IAA6B;AAAA,IACjC,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,oBAAoB,GAAG,wBAAwB;AAAA,MACtE,aAAaN;AAAA,MACb,OAAOG;AAAA,MAEN,UAAAN,GAAa;AAAA,IAAA;AAAA,EAAA;AAGpB;"}

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

@@ -1,3 +1,3 @@
-export declare function createHorizontalResizeHandler(targetRef: React.MutableRefObject<HTMLElement | null>, onWidthResize?: (value: number) => void, onWidthResizeEnd?: (value: number) => void, invert?: boolean, disableDirection?: boolean): (event: React.MouseEvent) => void;
-export declare function createVerticalResizeHandler(targetRef: React.MutableRefObject<HTMLElement | null>, onHeightResize?: (value: number) => void, onHeightResizeEnd?: (value: number) => void, invert?: boolean): (event: React.MouseEvent) => void;
+export declare function createHorizontalResizeHandler(targetRef: React.MutableRefObject<HTMLElement | null>, onWidthResize?: (width: number, origin: 'left' | 'right', totalDelta: number, currentDelta: number) => void, onWidthResizeEnd?: (width: number, origin: 'left' | 'right') => void, origin?: 'left' | 'right', invert?: boolean, disableDirection?: boolean): (event: React.MouseEvent) => void;
+export declare function createVerticalResizeHandler(targetRef: React.MutableRefObject<HTMLElement | null>, onHeightResize?: (height: number, origin: 'top' | 'bottom', totalDelta: number, currentDelta: number) => void, onHeightResizeEnd?: (height: number, origin: 'top' | 'bottom') => void, invert?: boolean, origin?: 'top' | 'bottom'): (event: React.MouseEvent) => void;
 //# sourceMappingURL=resize_handlers.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"resize_handlers.d.ts","sourceRoot":"","sources":["../../../src/stacks/box/resize_handlers.ts"],"names":[],"mappings":"AASA,wBAAgB,6BAA6B,CAC3C,SAAS,EAAE,KAAK,CAAC,gBAAgB,CAAC,WAAW,GAAG,IAAI,CAAC,EACrD,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,EACvC,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,EAC1C,MAAM,UAAQ,EACd,gBAAgB,UAAQ,IAEc,OAAO,KAAK,CAAC,UAAU,UAuD9D;AAED,wBAAgB,2BAA2B,CACzC,SAAS,EAAE,KAAK,CAAC,gBAAgB,CAAC,WAAW,GAAG,IAAI,CAAC,EACrD,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,EACxC,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,EAC3C,MAAM,UAAQ,IAGsB,OAAO,KAAK,CAAC,UAAU,UAgD5D"}
+{"version":3,"file":"resize_handlers.d.ts","sourceRoot":"","sources":["../../../src/stacks/box/resize_handlers.ts"],"names":[],"mappings":"AASA,wBAAgB,6BAA6B,CAC3C,SAAS,EAAE,KAAK,CAAC,gBAAgB,CAAC,WAAW,GAAG,IAAI,CAAC,EACrD,aAAa,CAAC,EAAE,CACd,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,MAAM,GAAG,OAAO,EACxB,UAAU,EAAE,MAAM,EAClB,YAAY,EAAE,MAAM,KACjB,IAAI,EACT,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,OAAO,KAAK,IAAI,EACpE,MAAM,GAAE,MAAM,GAAG,OAAiB,EAClC,MAAM,UAAQ,EACd,gBAAgB,UAAQ,IAEc,OAAO,KAAK,CAAC,UAAU,UAwD9D;AAED,wBAAgB,2BAA2B,CACzC,SAAS,EAAE,KAAK,CAAC,gBAAgB,CAAC,WAAW,GAAG,IAAI,CAAC,EACrD,cAAc,CAAC,EAAE,CACf,MAAM,EAAE,MAAM,EACd,MAAM,EAAE,KAAK,GAAG,QAAQ,EACxB,UAAU,EAAE,MAAM,EAClB,YAAY,EAAE,MAAM,KACjB,IAAI,EACT,iBAAiB,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,KAAK,GAAG,QAAQ,KAAK,IAAI,EACtE,MAAM,UAAQ,EACd,MAAM,GAAE,KAAK,GAAG,QAAmB,IAGC,OAAO,KAAK,CAAC,UAAU,UAiD5D"}

package/dist/stacks/box/resize_handlers.js

@@ -1,50 +1,50 @@
-function h() {
+function D() {
   const n = window.document.createElement("div");
   return n.style.position = "absolute", n.style.inset = "-500px", n.style.backgroundColor = "transparent", n.style.pointerEvents = "auto", n;
 }
-function w(n, i, c, l = !1, g = !1) {
-  return function(t) {
-    const e = n.current;
-    if (e == null)
+function C(n, v, f, m = "right", c = !1, b = !1) {
+  return function(e) {
+    const t = n.current;
+    if (t == null)
       return;
-    const a = h();
-    e.appendChild(a);
-    const m = (window.getComputedStyle(e).direction === "rtl" && !g ? !l : l) ? -1 : 1, p = t.clientX, d = e.getBoundingClientRect();
-    let s = d.width;
-    const o = (u) => {
-      const L = m * (u.clientX - p), y = d.width + L;
-      s = y, e.style.width = `${y}px`, i && i(y), u.stopPropagation(), u.preventDefault();
-    }, v = (u) => {
-      u.buttons === 0 && r();
+    const a = D();
+    t.appendChild(a);
+    const d = (window.getComputedStyle(t).direction === "rtl" && !b ? !c : c) ? -1 : 1, p = e.clientX, u = t.getBoundingClientRect();
+    let s = u.width;
+    const o = (i) => {
+      const E = d * (i.clientX - p), g = u.width + E, w = g - s;
+      s = g, t.style.width = `${g}px`, v?.(g, m, E, w), i.stopPropagation(), i.preventDefault();
+    }, l = (i) => {
+      i.buttons === 0 && r();
     }, r = () => {
-      e.removeChild(a), document.body.removeEventListener("mousemove", o), document.body.removeEventListener("mouseup", r), document.body.removeEventListener("mouseenter", v), t.stopPropagation(), t.preventDefault(), c && c(s);
+      t.removeChild(a), document.body.removeEventListener("mousemove", o), document.body.removeEventListener("mouseup", r), document.body.removeEventListener("mouseenter", l), e.stopPropagation(), e.preventDefault(), f?.(s, m);
     };
-    document.body.addEventListener("mousemove", o), document.body.addEventListener("mouseup", r), document.body.addEventListener("mouseenter", v), t.stopPropagation(), t.preventDefault();
+    document.body.addEventListener("mousemove", o), document.body.addEventListener("mouseup", r), document.body.addEventListener("mouseenter", l), e.stopPropagation(), e.preventDefault();
   };
 }
-function D(n, i, c, l = !1) {
-  const g = l ? -1 : 1;
-  return function(t) {
-    const e = n.current;
-    if (e == null)
+function R(n, v, f, m = !1, c = "bottom") {
+  const b = m ? -1 : 1;
+  return function(e) {
+    const t = n.current;
+    if (t == null)
       return;
-    const a = h();
-    e.appendChild(a);
-    const b = t.clientY, f = e.getBoundingClientRect();
-    let m = f.height;
+    const a = D();
+    t.appendChild(a);
+    const y = e.clientY, h = t.getBoundingClientRect();
+    let d = h.height;
     const p = (o) => {
-      const v = g * (o.clientY - b), r = f.height + v;
-      m = r, e.style.height = `${r}px`, i && i(r), o.stopPropagation(), o.preventDefault();
-    }, d = (o) => {
+      const l = b * (o.clientY - y), r = h.height + l, i = r - d;
+      d = r, t.style.height = `${r}px`, v?.(r, c, l, i), o.stopPropagation(), o.preventDefault();
+    }, u = (o) => {
       o.buttons === 0 && s();
     }, s = () => {
-      e.removeChild(a), document.body.removeEventListener("mousemove", p), document.body.removeEventListener("mouseup", s), document.body.removeEventListener("mouseenter", d), t.stopPropagation(), t.preventDefault(), c && c(m);
+      t.removeChild(a), document.body.removeEventListener("mousemove", p), document.body.removeEventListener("mouseup", s), document.body.removeEventListener("mouseenter", u), e.stopPropagation(), e.preventDefault(), f?.(d, c);
     };
-    document.body.addEventListener("mousemove", p), document.body.addEventListener("mouseup", s), document.body.addEventListener("mouseenter", d), t.stopPropagation(), t.preventDefault();
+    document.body.addEventListener("mousemove", p), document.body.addEventListener("mouseup", s), document.body.addEventListener("mouseenter", u), e.stopPropagation(), e.preventDefault();
   };
 }
 export {
-  w as createHorizontalResizeHandler,
-  D as createVerticalResizeHandler
+  C as createHorizontalResizeHandler,
+  R as createVerticalResizeHandler
 };
 //# sourceMappingURL=resize_handlers.js.map

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?: (value: number) => void,\n  onWidthResizeEnd?: (value: number) => void,\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 && onWidthResize(newWidth);\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 && onWidthResizeEnd(width);\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?: (value: number) => void,\n  onHeightResizeEnd?: (value: number) => void,\n  invert = false\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 && onHeightResize(newHeight);\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 && onHeightResizeEnd(height);\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","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":["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?: (\n    width: number,\n    origin: 'left' | 'right',\n    totalDelta: number,\n    currentDelta: number\n  ) => 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 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      onWidthResize?.(newWidth, origin, totalDelta, currentDelta);\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?: (\n    height: number,\n    origin: 'top' | 'bottom',\n    totalDelta: number,\n    currentDelta: number\n  ) => 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 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      onHeightResize?.(newHeight, origin, totalDelta, currentDelta);\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","totalDelta","newWidth","currentDelta","mouseEnter","endDrag","createVerticalResizeHandler","onHeightResize","onHeightResizeEnd","startY","height","newHeight"],"mappings":"AAAA,SAASA,IAAa;AACpB,QAAMC,IAAO,OAAO,SAAS,cAAc,KAAK;AAChD,SAAAA,EAAK,MAAM,WAAW,YACtBA,EAAK,MAAM,QAAQ,UACnBA,EAAK,MAAM,kBAAkB,eAC7BA,EAAK,MAAM,gBAAgB,QACpBA;AACT;AAEO,SAASC,EACdC,GACAC,GAMAC,GACAC,IAA2B,SAC3BC,IAAS,IACTC,IAAmB,IACnB;AACA,SAAO,SAA+BC,GAAyB;AAC7D,UAAMC,IAAMP,EAAU;AAEtB,QAAIO,KAAO;AACT;AAGF,UAAMT,IAAOD,EAAA;AACb,IAAAU,EAAI,YAAYT,CAAI;AAKpB,UAAMU,KAHoB,OAAO,iBAAiBD,CAAG,EAAE,cAE/B,SAAS,CAACF,IAAmB,CAACD,IAASA,KAC/B,KAAK,GAE/BK,IAASH,EAAM,SACfI,IAAYH,EAAI,sBAAA;AACtB,QAAII,IAAQD,EAAU;AAEtB,UAAME,IAAO,CAACN,MAAsB;AAClC,YAAMO,IAAaL,KAAaF,EAAM,UAAUG,IAC1CK,IAAWJ,EAAU,QAAQG,GAC7BE,IAAeD,IAAWH;AAEhC,MAAAA,IAAQG,GAERP,EAAI,MAAM,QAAQ,GAAGO,CAAQ,MAC7Bb,IAAgBa,GAAUX,GAAQU,GAAYE,CAAY,GAC1DT,EAAM,gBAAA,GACNA,EAAM,eAAA;AAAA,IACR,GAEMU,IAAa,CAACV,MAAsB;AACxC,MAAIA,EAAM,YAAY,KACpBW,EAAA;AAAA,IAEJ,GAEMA,IAAU,MAAM;AACpB,MAAAV,EAAI,YAAYT,CAAI,GAEpB,SAAS,KAAK,oBAAoB,aAAac,CAAI,GACnD,SAAS,KAAK,oBAAoB,WAAWK,CAAO,GACpD,SAAS,KAAK,oBAAoB,cAAcD,CAAU,GAC1DV,EAAM,gBAAA,GACNA,EAAM,eAAA,GAENJ,IAAmBS,GAAOR,CAAM;AAAA,IAClC;AAEA,aAAS,KAAK,iBAAiB,aAAaS,CAAI,GAChD,SAAS,KAAK,iBAAiB,WAAWK,CAAO,GACjD,SAAS,KAAK,iBAAiB,cAAcD,CAAU,GACvDV,EAAM,gBAAA,GACNA,EAAM,eAAA;AAAA,EACR;AACF;AAEO,SAASY,EACdlB,GACAmB,GAMAC,GACAhB,IAAS,IACTD,IAA2B,UAC3B;AACA,QAAMK,IAAYJ,IAAS,KAAK;AAChC,SAAO,SAA6BE,GAAyB;AAC3D,UAAMC,IAAMP,EAAU;AAEtB,QAAIO,KAAO;AACT;AAGF,UAAMT,IAAOD,EAAA;AACb,IAAAU,EAAI,YAAYT,CAAI;AAEpB,UAAMuB,IAASf,EAAM,SACfI,IAAYH,EAAI,sBAAA;AACtB,QAAIe,IAASZ,EAAU;AAEvB,UAAME,IAAO,CAACN,MAAsB;AAClC,YAAMO,IAAaL,KAAaF,EAAM,UAAUe,IAC1CE,IAAYb,EAAU,SAASG,GAC/BE,IAAeQ,IAAYD;AACjC,MAAAA,IAASC,GACThB,EAAI,MAAM,SAAS,GAAGgB,CAAS,MAC/BJ,IAAiBI,GAAWpB,GAAQU,GAAYE,CAAY,GAC5DT,EAAM,gBAAA,GACNA,EAAM,eAAA;AAAA,IACR,GAEMU,IAAa,CAACV,MAAsB;AACxC,MAAIA,EAAM,YAAY,KACpBW,EAAA;AAAA,IAEJ,GAEMA,IAAU,MAAM;AACpB,MAAAV,EAAI,YAAYT,CAAI,GAEpB,SAAS,KAAK,oBAAoB,aAAac,CAAI,GACnD,SAAS,KAAK,oBAAoB,WAAWK,CAAO,GACpD,SAAS,KAAK,oBAAoB,cAAcD,CAAU,GAC1DV,EAAM,gBAAA,GACNA,EAAM,eAAA,GAENc,IAAoBE,GAAQnB,CAAM;AAAA,IACpC;AAEA,aAAS,KAAK,iBAAiB,aAAaS,CAAI,GAChD,SAAS,KAAK,iBAAiB,WAAWK,CAAO,GACjD,SAAS,KAAK,iBAAiB,cAAcD,CAAU,GACvDV,EAAM,gBAAA,GACNA,EAAM,eAAA;AAAA,EACR;AACF;"}

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

@@ -3,8 +3,8 @@ import { HandleProps } from './handle_props.js';
 export interface RightResizeHandleProps {
     targetRef: React.MutableRefObject<HTMLElement | null>;
     handleProps?: HandleProps;
-    onWidthResize?: (value: number) => void;
-    onWidthResizeEnd?: (value: number) => void;
+    onWidthResize?: (width: number, origin: 'left' | 'right', totalDelta: number, currentDelta: number) => void;
+    onWidthResizeEnd?: (width: number, origin: 'left' | 'right') => void;
 }
 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":"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,KAAK,IAAI,CAAC;IACxC,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAC5C;AACD,wBAAgB,iBAAiB,CAAC,EAChC,SAAS,EACT,WAAW,EACX,aAAa,EACb,gBAAgB,GACjB,EAAE,sBAAsB,2CAyBxB"}
+{"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,CACd,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,MAAM,GAAG,OAAO,EACxB,UAAU,EAAE,MAAM,EAClB,YAAY,EAAE,MAAM,KACjB,IAAI,CAAC;IACV,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"}

package/dist/stacks/box/right_resize_handle.js

@@ -1,17 +1,18 @@
 import { jsx as l } from "react/jsx-runtime";
-import { createHorizontalResizeHandler as f } from "./resize_handlers.js";
-import { clsx as c } from "clsx";
-import '../../right_resize_handle.css';const z = "_right-resize-handle_7f232b9", a = { "right-resize-handle": z };
+import { clsx as f } from "clsx";
+import { createHorizontalResizeHandler as c } from "./resize_handlers.js";
+import '../../right_resize_handle.css';const z = "_right-resize-handle_7f232b9", h = { "right-resize-handle": z };
 function m({
   targetRef: t,
   handleProps: e,
   onWidthResize: i,
   onWidthResizeEnd: s
 }) {
-  const r = f(
+  const r = c(
     t,
     i,
     s,
+    "right",
     !1,
     !0
   ), n = e?.offset ? e.offset : -8, o = {
@@ -22,7 +23,7 @@ function m({
   return /* @__PURE__ */ l(
     "div",
     {
-      className: c(a["right-resize-handle"], "tcn-right-resize-handle"),
+      className: f(h["right-resize-handle"], "tcn-right-resize-handle"),
       onMouseDown: r,
       style: o,
       children: e?.children

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 React from 'react';\nimport { HandleProps } from './handle_props.js';\nimport { createHorizontalResizeHandler } from './resize_handlers.js';\nimport styles from './right_resize_handle.module.css';\nimport { clsx } from 'clsx';\n\nexport interface RightResizeHandleProps {\n  targetRef: React.MutableRefObject<HTMLElement | null>;\n  handleProps?: HandleProps;\n  onWidthResize?: (value: number) => void;\n  onWidthResizeEnd?: (value: number) => 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    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,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 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?: (\n    width: number,\n    origin: 'left' | 'right',\n    totalDelta: number,\n    currentDelta: number\n  ) => 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":";;;;AAiBO,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

@@ -3,8 +3,8 @@ import { HandleProps } from './handle_props.js';
 export interface StartResizeHandleProps {
     targetRef: React.MutableRefObject<HTMLElement | null>;
     handleProps?: HandleProps;
-    onWidthResize?: (value: number) => void;
-    onWidthResizeEnd?: (value: number) => void;
+    onWidthResize?: (width: number, origin: 'left' | 'right', totalDelta: number, currentDelta: number) => void;
+    onWidthResizeEnd?: (width: number, origin: 'left' | 'right') => void;
 }
 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,KAAK,IAAI,CAAC;IACxC,gBAAgB,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;CAC5C;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":"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,CACd,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,MAAM,GAAG,OAAO,EACxB,UAAU,EAAE,MAAM,EAClB,YAAY,EAAE,MAAM,KACjB,IAAI,CAAC;IACV,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"}

package/dist/stacks/box/start_resize_handle.js

@@ -1,18 +1,18 @@
 import { jsx as o } from "react/jsx-runtime";
-import { createHorizontalResizeHandler as l } from "./resize_handlers.js";
-import { clsx as c } from "clsx";
-import '../../start_resize_handle.css';const f = "_start-resize-handle_22a3d5a", z = { "start-resize-handle": f };
+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,
   handleProps: e,
   onWidthResize: s,
   onWidthResizeEnd: r
 }) {
-  const i = l(
+  const i = f(
     t,
     s,
     r,
-    !0
+    "left"
   ), n = e?.offset ? e.offset : -8, a = {
     ...e?.style,
     "--resize-offset": `${n}px`,
@@ -21,7 +21,7 @@ function x({
   return /* @__PURE__ */ o(
     "div",
     {
-      className: c(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?: (value: number) => void;\n  onWidthResizeEnd?: (value: number) => 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    true\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 React from 'react';\nimport { HandleProps } from './handle_props.js';\nimport { createHorizontalResizeHandler } from './resize_handlers.js';\nimport styles from './start_resize_handle.module.css';\n\nexport interface StartResizeHandleProps {\n  targetRef: React.MutableRefObject<HTMLElement | null>;\n  handleProps?: HandleProps;\n  onWidthResize?: (\n    width: number,\n    origin: 'left' | 'right',\n    totalDelta: number,\n    currentDelta: number\n  ) => 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":";;;;AAiBO,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;"}