@tcn/ui 0.3.0 → 0.3.2

package/dist/showcase.css

@@ -0,0 +1 @@
+._showcase_57a1682{border:1px solid var(--docs-border-color, #e5e7eb);background-color:var(--docs-card-bg, #fff);border-radius:8px;overflow:hidden;height:fit-content}._toolbar_944adb6{display:flex;align-items:center;justify-content:space-between;padding:8px 16px}._header_7789d59{min-height:48px;background-color:var(--docs-header-bg, #fafafa)}._title_034d539{font-size:14px;font-weight:600;color:var(--docs-text-color, #1f2937);margin:0!important}._subtitle_2478529{background-color:var(--docs-header-bg, #fafafa);flex-grow:1}._documentation_1ba3d31{color:var(--docs-text-muted, #6b7280);padding:0 16px}._description_4ed9c28{font-size:12px;color:var(--docs-text-muted, #6b7280)}._content_2c42bfd{min-height:200px;background-color:red;width:100%;border:none!important;box-shadow:none!important;margin:0!important;border-radius:0!important}._content_2c42bfd .docs-story{min-height:200px!important}

package/dist/sidebar_end.css

@@ -1 +1 @@
-._sidebarEndBox_25f69cc{width:250px;height:100%;z-index:2}._sidebarEnd_cb253a2{width:100%;height:100%}._sidebarEnd_cb253a2[data-hierarchy=primary]{background:#fff;border-left:1px solid #e0e0e0;padding:16px}._sidebarEnd_cb253a2[data-hierarchy=secondary]{background:#f8f9fa;border-left:1px solid #e9ecef;padding:12px}._sidebarEnd_cb253a2[data-hierarchy=tertiary]{background:#f1f3f4;border-left:1px solid #dee2e6;padding:8px}
+@layer tcn-system{:where(._sidebarEndBox_25f69cc){width:250px;height:100%;z-index:2}:where(._sidebarEnd_cb253a2){width:100%;height:100%}:where(._sidebarEnd_cb253a2[data-hierarchy=primary]){background:#fff;border-left:1px solid #e0e0e0;padding:16px}:where(._sidebarEnd_cb253a2[data-hierarchy=secondary]){background:#f8f9fa;border-left:1px solid #e9ecef;padding:12px}:where(._sidebarEnd_cb253a2[data-hierarchy=tertiary]){background:#f1f3f4;border-left:1px solid #dee2e6;padding:8px}}

package/dist/sidebar_start.css

@@ -1 +1 @@
-._sidebarStartBox_4353011{width:250px;height:100%;z-index:2}._sidebarStart_5b1e45b{width:100%;height:100%}._sidebarStart_5b1e45b[data-hierarchy=primary]{background:#fff;border-right:1px solid #e0e0e0;padding:16px}._sidebarStart_5b1e45b[data-hierarchy=secondary]{background:#f8f9fa;border-right:1px solid #e9ecef;padding:12px}._sidebarStart_5b1e45b[data-hierarchy=tertiary]{background:#f1f3f4;border-right:1px solid #dee2e6;padding:8px}
+@layer tcn-system{:where(._sidebarStartBox_4353011){width:250px;height:100%;z-index:2}:where(._sidebarStart_5b1e45b){width:100%;height:100%}:where(._sidebarStart_5b1e45b[data-hierarchy=primary]){background:#fff;border-right:1px solid #e0e0e0;padding:16px}:where(._sidebarStart_5b1e45b[data-hierarchy=secondary]){background:#f8f9fa;border-right:1px solid #e9ecef;padding:12px}:where(._sidebarStart_5b1e45b[data-hierarchy=tertiary]){background:#f1f3f4;border-right:1px solid #dee2e6;padding:8px}}

package/dist/slider.css

@@ -1 +1 @@
-:root{--disabled: #d3d3d3}._slider_eb84151{width:100%;-webkit-appearance:none;appearance:none;background:transparent;cursor:pointer;height:calc(26px * var(--scalar, 1))}._slider_eb84151:focus{outline:none}._slider_eb84151::-webkit-slider-runnable-track{border-radius:4px;height:calc(1px * var(--scalar, 1))}._slider_eb84151:dir(ltr)::-webkit-slider-runnable-track{background:linear-gradient(to right,var(--accent-color) 0%,var(--accent-color) var(--progress),var(--surface-line, #aaa) var(--progress),var(--surface-line, #aaa) 100%)}._slider_eb84151:dir(rtl)::-webkit-slider-runnable-track{background:linear-gradient(to left,var(--accent-color) 0%,var(--accent-color) var(--progress),var(--surface-line, #aaa) var(--progress),var(--surface-line, #aaa) 100%)}._slider_eb84151:dir(rtl)[data-is-disabled=true]::-webkit-slider-runnable-track,._slider_eb84151:dir(ltr)[data-is-disabled=true]::-webkit-slider-runnable-track{background:var(--disabled);cursor:not-allowed}._slider_eb84151::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;cursor:ew-resize;position:relative;top:calc(-6px * var(--scalar, 1));width:calc(14px * var(--scalar, 1));height:calc(14px * var(--scalar, 1));border-radius:2px;background-color:var(--surface, #fff);border:1px solid var(--accent-color);box-sizing:border-box}._slider_eb84151[data-is-disabled=true]::-webkit-slider-thumb{border-color:#e3e3e3;cursor:not-allowed}._slider_eb84151:focus-visible::-webkit-slider-thumb{box-shadow:0 0 4px var(--accent-color);outline:3px solid color-mix(in srgb,var(--accent-color) 40%,transparent);outline-offset:1px}._slider_eb84151[data-is-disabled=false]:active::-webkit-slider-thumb{background:color-mix(in srgb,var(--accent-color) 10%,white)}._slider_eb84151::-moz-range-track{border-radius:4px;height:calc(1px * var(--scalar, 1))}._slider_eb84151:dir(ltr)::-moz-range-track{background:linear-gradient(to right,var(--accent-color) 0%,var(--accent-color) var(--progress),var(--surface-line, #aaa) var(--progress),var(--surface-line, #aaa) 100%)}._slider_eb84151:dir(rtl)::-moz-range-track{background:linear-gradient(to left,var(--accent-color) 0%,var(--accent-color) var(--progress),var(--surface-line, #aaa) var(--progress),var(--surface-line, #aaa) 100%)}._slider_eb84151[data-is-disabled=true]::-moz-range-track{background:var(--disabled);cursor:not-allowed}._slider_eb84151::-moz-range-thumb{cursor:ew-resize;border:none;top:calc(-6px * var(--scalar, 1));width:calc(14px * var(--scalar, 1));height:calc(14px * var(--scalar, 1));border-radius:2px;background-color:var(--surface, #fff);border:1px solid var(--accent-color);box-sizing:border-box}._slider_eb84151[data-is-disabled=true]::-moz-range-thumb{border-color:#e3e3e3;cursor:not-allowed}._slider_eb84151:focus::-moz-range-thumb{box-shadow:0 0 4px var(--accent-color);outline:1px dashed var(--accent-color);outline-offset:1px}._slider_eb84151[data-is-disabled=false]:active::-moz-range-thumb{background:color-mix(in srgb,var(--accent-color) 10%,white)}
+@layer tcn-system{:root{--disabled: #d3d3d3}:where(._slider_eb84151){width:100%;-webkit-appearance:none;appearance:none;background:transparent;cursor:pointer;height:calc(26px * var(--scalar, 1))}:where(._slider_eb84151:focus){outline:none}._slider_eb84151::-webkit-slider-runnable-track{border-radius:4px;height:calc(1px * var(--scalar, 1))}._slider_eb84151:dir(ltr)::-webkit-slider-runnable-track{background:linear-gradient(to right,var(--accent-color) 0%,var(--accent-color) var(--progress),var(--surface-line, #aaa) var(--progress),var(--surface-line, #aaa) 100%)}._slider_eb84151:dir(rtl)::-webkit-slider-runnable-track{background:linear-gradient(to left,var(--accent-color) 0%,var(--accent-color) var(--progress),var(--surface-line, #aaa) var(--progress),var(--surface-line, #aaa) 100%)}._slider_eb84151:dir(rtl)[data-is-disabled=true]::-webkit-slider-runnable-track,._slider_eb84151:dir(ltr)[data-is-disabled=true]::-webkit-slider-runnable-track{background:var(--disabled);cursor:not-allowed}._slider_eb84151::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;cursor:ew-resize;position:relative;top:calc(-6px * var(--scalar, 1));width:calc(14px * var(--scalar, 1));height:calc(14px * var(--scalar, 1));border-radius:2px;background-color:var(--surface, #fff);border:1px solid var(--accent-color);box-sizing:border-box}._slider_eb84151[data-is-disabled=true]::-webkit-slider-thumb{border-color:#e3e3e3;cursor:not-allowed}._slider_eb84151:focus-visible::-webkit-slider-thumb{box-shadow:0 0 4px var(--accent-color);outline:3px solid color-mix(in srgb,var(--accent-color) 40%,transparent);outline-offset:1px}._slider_eb84151[data-is-disabled=false]:active::-webkit-slider-thumb{background:color-mix(in srgb,var(--accent-color) 10%,white)}._slider_eb84151::-moz-range-track{border-radius:4px;height:calc(1px * var(--scalar, 1))}._slider_eb84151:dir(ltr)::-moz-range-track{background:linear-gradient(to right,var(--accent-color) 0%,var(--accent-color) var(--progress),var(--surface-line, #aaa) var(--progress),var(--surface-line, #aaa) 100%)}._slider_eb84151:dir(rtl)::-moz-range-track{background:linear-gradient(to left,var(--accent-color) 0%,var(--accent-color) var(--progress),var(--surface-line, #aaa) var(--progress),var(--surface-line, #aaa) 100%)}._slider_eb84151[data-is-disabled=true]::-moz-range-track{background:var(--disabled);cursor:not-allowed}._slider_eb84151::-moz-range-thumb{cursor:ew-resize;border:none;top:calc(-6px * var(--scalar, 1));width:calc(14px * var(--scalar, 1));height:calc(14px * var(--scalar, 1));border-radius:2px;background-color:var(--surface, #fff);border:1px solid var(--accent-color);box-sizing:border-box}._slider_eb84151[data-is-disabled=true]::-moz-range-thumb{border-color:#e3e3e3;cursor:not-allowed}._slider_eb84151:focus::-moz-range-thumb{box-shadow:0 0 4px var(--accent-color);outline:1px dashed var(--accent-color);outline-offset:1px}._slider_eb84151[data-is-disabled=false]:active::-moz-range-thumb{background:color-mix(in srgb,var(--accent-color) 10%,white)}}

package/dist/slim_button.css

@@ -1 +1 @@
-._slim-button_188fdc3{min-height:auto}._slim-button_188fdc3[data-is-disabled=true]{pointer-events:none}
+@layer tcn-system{:where(._slim-button_188fdc3){min-height:auto}:where(._slim-button_188fdc3[data-is-disabled=true]){pointer-events:none}}

package/dist/stack.css

@@ -1 +1 @@
-._h-stack_f3d929e,._v-stack_c5b98b6{display:flex}._h-stack_f3d929e[data-inline=true],._v-stack_c5b98b6[data-inline=true]{display:inline-flex}._z-stack_0734316{display:grid}._z-stack_0734316[data-inline=true]{display:inline-grid}._box_16766f3[data-height=flex],._box_16766f3[data-height=fill]{height:auto}:where(._h-stack_f3d929e){display:flex;position:relative;padding:0;margin:0;min-width:0;min-height:0;width:100%;height:auto;overflow-x:visible;overflow-y:visible;flex-wrap:nowrap;flex-direction:row;flex-grow:0;flex-shrink:0;box-sizing:border-box}:where(._v-stack_c5b98b6){position:relative;display:flex;padding:0;margin:0;min-width:0;min-height:0;width:100%;height:auto;overflow-x:visible;overflow-y:visible;flex-wrap:nowrap;flex-direction:column;flex-grow:0;flex-shrink:0;box-sizing:border-box}:where(._z-stack_0734316){position:relative;min-width:0;min-height:0;width:100%;height:auto;overflow:visible;box-sizing:border-box}:where(._box_16766f3){width:100%;min-width:0;max-width:100%;min-height:0;height:auto;max-height:100%;z-index:0;position:relative;box-sizing:border-box;transform:none}:where(._h-stack_f3d929e[data-inline=true]){display:inline-flex}:where(._h-stack_f3d929e[data-allow-flow=true]){flex-wrap:wrap}:where(._h-stack_f3d929e[data-v-alignment=start]){align-items:flex-start}:where(._h-stack_f3d929e[data-v-alignment=center]){align-items:center}:where(._h-stack_f3d929e[data-v-alignment=end]){align-items:flex-end}:where(._h-stack_f3d929e[data-h-alignment=start]){justify-content:flex-start}:where(._h-stack_f3d929e[data-h-alignment=center]){justify-content:center}:where(._h-stack_f3d929e[data-h-alignment=end]){justify-content:flex-end}:where(._h-stack_f3d929e>*){position:relative}:where(._h-stack_f3d929e>._h-stack_f3d929e[data-width=flex]),:where(._h-stack_f3d929e>._z-stack_0734316[data-width=flex]),:where(._h-stack_f3d929e>._v-stack_c5b98b6[data-width=flex]),:where(._h-stack_f3d929e>._stack-flex_74799db[data-width=flex]),:where(._h-stack_f3d929e>._h-stack_f3d929e[data-width=fill]),:where(._h-stack_f3d929e>._z-stack_0734316[data-width=fill]),:where(._h-stack_f3d929e>._v-stack_c5b98b6[data-width=fill]),:where(._h-stack_f3d929e>._stack-flex_74799db[data-width=fill]),:where(._h-stack_f3d929e>._box_16766f3[data-width=fill]){flex-grow:1;flex-shrink:0;flex-basis:0%;width:auto}:where(._h-stack_f3d929e>._h-stack_f3d929e[data-height=flex]),:where(._h-stack_f3d929e>._z-stack_0734316[data-height=flex]),:where(._h-stack_f3d929e>._v-stack_c5b98b6[data-height=flex]),:where(._h-stack_f3d929e>._stack-flex_74799db[data-height=flex]),:where(._h-stack_f3d929e>._h-stack_f3d929e[data-height=fill]),:where(._h-stack_f3d929e>._z-stack_0734316[data-height=fill]),:where(._h-stack_f3d929e>._v-stack_c5b98b6[data-height=fill]),:where(._h-stack_f3d929e>._stack-flex_74799db[data-height=fill]),:where(._h-stack_f3d929e>._box_16766f3[data-height=fill]){height:100%}:where(._reveal-layout_d966b23 ._h-stack_f3d929e:after),:where(._reveal-h-stack_aab60c1 ._h-stack_f3d929e:after){content:"";position:absolute;inset:0;outline:1px dashed rgb(0,123,160);pointer-events:none;z-index:1}:where(._v-stack_c5b98b6[data-inline=true]){display:inline-flex}:where(._v-stack_c5b98b6[data-allow-flow=true]){flex-wrap:wrap}:where(._v-stack_c5b98b6[data-h-alignment=start]){align-items:flex-start}:where(._v-stack_c5b98b6[data-h-alignment=center]){align-items:center}:where(._v-stack_c5b98b6[data-h-alignment=end]){align-items:flex-end}:where(._v-stack_c5b98b6[data-v-alignment=start]){justify-content:flex-start}:where(._v-stack_c5b98b6[data-v-alignment=center]){justify-content:center}:where(._v-stack_c5b98b6[data-v-alignment=end]){justify-content:flex-end}:where(._v-stack_c5b98b6>*){position:relative}:where(._v-stack_c5b98b6[data-height=auto]){flex-grow:0;flex-shrink:0;flex-basis:auto}:where(._v-stack_c5b98b6>._h-stack_f3d929e[data-height=flex]),:where(._v-stack_c5b98b6>._z-stack_0734316[data-height=flex]),:where(._v-stack_c5b98b6>._v-stack_c5b98b6[data-height=flex]),:where(._v-stack_c5b98b6>._stack-flex_74799db[data-height=flex]),:where(._v-stack_c5b98b6>._h-stack_f3d929e[data-height=fill]),:where(._v-stack_c5b98b6>._z-stack_0734316[data-height=fill]),:where(._v-stack_c5b98b6>._v-stack_c5b98b6[data-height=fill]),:where(._v-stack_c5b98b6>._stack-flex_74799db[data-height=fill]),:where(._v-stack_c5b98b6>._box_16766f3[data-height=fill]){flex-grow:1;flex-shrink:0;flex-basis:0%;height:auto}:where(._v-stack_c5b98b6>._h-stack_f3d929e[data-width=flex]),:where(._v-stack_c5b98b6>._z-stack_0734316[data-width=flex]),:where(._v-stack_c5b98b6>._v-stack_c5b98b6[data-width=flex]),:where(._v-stack_c5b98b6>._stack-flex_74799db[data-width=flex]),:where(._v-stack_c5b98b6>._h-stack_f3d929e[data-width=fill]),:where(._v-stack_c5b98b6>._z-stack_0734316[data-width=fill]),:where(._v-stack_c5b98b6>._v-stack_c5b98b6[data-width=fill]),:where(._v-stack_c5b98b6>._stack-flex_74799db[data-width=fill]),:where(._v-stack_c5b98b6>._box_16766f3[data-width=fill]){width:100%}:where(._v-stack_c5b98b6[data-height=auto]>._h-stack_f3d929e[data-height=flex]),:where(._v-stack_c5b98b6[data-height=auto]>._z-stack_0734316[data-height=flex]),:where(._v-stack_c5b98b6[data-height=auto]>._v-stack_c5b98b6[data-height=flex]),:where(._v-stack_c5b98b6[data-height=auto]>._stack-flex_74799db[data-height=flex]),:where(._v-stack_c5b98b6[data-height=auto]>._h-stack_f3d929e[data-height=fill]),:where(._v-stack_c5b98b6[data-height=auto]>._z-stack_0734316[data-height=fill]),:where(._v-stack_c5b98b6[data-height=auto]>._v-stack_c5b98b6[data-height=fill]),:where(._v-stack_c5b98b6[data-height=auto]>._stack-flex_74799db[data-height=fill]){flex-basis:auto}:where(._v-stack_c5b98b6[data-height=auto] ._h-stack_f3d929e[data-height=default]),:where(._v-stack_c5b98b6[data-height=auto] ._z-stack_0734316[data-height=default]),:where(._v-stack_c5b98b6[data-height=auto] ._v-stack_c5b98b6[data-height=default]),:where(._v-stack_c5b98b6[data-height=auto] ._stack-flex_74799db[data-height=default]){height:auto;flex-basis:auto}:where(._reveal-layout_d966b23 ._v-stack_c5b98b6:after),:where(._reveal-v-stack_389c691 ._v-stack_c5b98b6:after){content:"";position:absolute;inset:0;outline:1px dashed rgb(0,165,152);pointer-events:none;z-index:1}:where(._z-stack_0734316>*){position:relative;min-width:0;min-height:0;grid-area:1 / 1 / 2 / 2;box-sizing:border-box}:where(._z-stack_0734316[data-h-alignment=start]>*){justify-self:start}:where(._z-stack_0734316[data-h-alignment=center]>*){justify-self:center}:where(._z-stack_0734316[data-h-alignment=end]>*){justify-self:end}:where(._z-stack_0734316[data-v-alignment=start]>*){align-self:start}:where(._z-stack_0734316[data-v-alignment=center]>*){align-self:center}:where(._z-stack_0734316[data-v-alignment=end]>*){align-self:end}:where(._z-stack_0734316>._h-stack_f3d929e[data-height=flex]),:where(._z-stack_0734316>._v-stack_c5b98b6[data-height=flex]),:where(._z-stack_0734316>._h-stack_f3d929e[data-height=fill]),:where(._z-stack_0734316>._v-stack_c5b98b6[data-height=fill]),:where(._z-stack_0734316>._stack-flex_74799db[data-height=fill]),:where(._z-stack_0734316>._stack-flex_74799db[data-height=default]){height:100%}:where(._z-stack_0734316>._h-stack_f3d929e[data-width=flex]),:where(._z-stack_0734316>._v-stack_c5b98b6[data-width=flex]),:where(._z-stack_0734316>._h-stack_f3d929e[data-width=fill]),:where(._z-stack_0734316>._v-stack_c5b98b6[data-width=fill]),:where(._z-stack_0734316>._stack-flex_74799db[data-width=fill]),:where(._z-stack_0734316>._stack-flex_74799db[data-width=default]){width:100%}:where(._reveal-layout_d966b23 ._z-stack_0734316:after),:where(._reveal-z-stack_366b960 ._z-stack_0734316:after){content:"";position:absolute;inset:0;outline:1px dashed rgb(119,0,255);pointer-events:none;z-index:1}:where(._h-stack_f3d929e>._h-stack_f3d929e[data-width=default]),:where(._h-stack_f3d929e>._z-stack_0734316[data-width=default]),:where(._h-stack_f3d929e>._v-stack_c5b98b6[data-width=default]),:where(._h-stack_f3d929e>._stack-flex_74799db[data-width=default]),:where(._h-stack_f3d929e>._box_16766f3[data-width=default]){flex-grow:1;flex-shrink:0;flex-basis:0%;width:auto}:where(._h-stack_f3d929e[data-height=auto] ._h-stack_f3d929e[data-height=default]),:where(._h-stack_f3d929e[data-height=auto] ._z-stack_0734316[data-height=default]),:where(._h-stack_f3d929e[data-height=auto] ._v-stack_c5b98b6[data-height=default]),:where(._h-stack_f3d929e[data-height=auto] ._stack-flex_74799db[data-height=default]){height:auto}:where(._h-stack_f3d929e[data-width=auto]){flex-grow:0;flex-shrink:0;width:auto;flex-basis:auto}:where(._h-stack_f3d929e[data-width=auto]>._h-stack_f3d929e[data-width=flex]),:where(._h-stack_f3d929e[data-width=auto]>._z-stack_0734316[data-width=flex]),:where(._h-stack_f3d929e[data-width=auto]>._v-stack_c5b98b6[data-width=flex]),:where(._h-stack_f3d929e[data-width=auto]>._stack-flex_74799db[data-width=flex]),:where(._h-stack_f3d929e[data-width=auto]>._h-stack_f3d929e[data-width=fill]),:where(._h-stack_f3d929e[data-width=auto]>._z-stack_0734316[data-width=fill]),:where(._h-stack_f3d929e[data-width=auto]>._v-stack_c5b98b6[data-width=fill]),:where(._h-stack_f3d929e[data-width=auto]>._stack-flex_74799db[data-width=fill]){flex-basis:auto}:where(._v-stack_c5b98b6>._h-stack_f3d929e[data-height=default]),:where(._v-stack_c5b98b6>._z-stack_0734316[data-height=default]),:where(._v-stack_c5b98b6>._v-stack_c5b98b6[data-height=default]),:where(._v-stack_c5b98b6>._stack-flex_74799db[data-height=default]){flex-basis:auto;height:auto}:where(._v-stack_c5b98b6[data-overflow-y=auto]:not([data-height=auto])),:where(._v-stack_c5b98b6[data-overflow-y=scroll]:not([data-height=auto])),:where(._h-stack_f3d929e[data-overflow-y=auto]:not([data-width=auto])),:where(._h-stack_f3d929e[data-overflow-y=scroll]:not([data-width=auto])){flex-shrink:1}:where(._box_16766f3[data-enabled-resize-on-start=true]),:where(._box_16766f3[data-enabled-resize-on-end=true]),:where(._box_16766f3[data-enabled-resize-on-top=true]),:where(._box_16766f3[data-enabled-resize-on-bottom=true]),:where(._box_16766f3[data-enabled-resize-on-left=true]),:where(._box_16766f3[data-enabled-resize-on-right=true]){transform:translateZ(0)}:where(._box_16766f3[data-width=flex]){width:auto}:where(.reveal-layout ._box_16766f3:after),:where(.reveal-box ._box_16766f3:after){content:"";position:absolute;inset:0;border:1px dashed rgb(138,138,138);pointer-events:none;z-index:1}
+@layer tcn-system{._h-stack_f3d929e,._v-stack_c5b98b6{display:flex}._h-stack_f3d929e[data-inline=true],._v-stack_c5b98b6[data-inline=true]{display:inline-flex}._z-stack_0734316{display:grid}._z-stack_0734316[data-inline=true]{display:inline-grid}._box_16766f3[data-height=flex],._box_16766f3[data-height=fill]{height:auto}:where(._h-stack_f3d929e){display:flex;position:relative;padding:0;margin:0;min-width:0;min-height:0;width:100%;height:auto;overflow-x:visible;overflow-y:visible;flex-wrap:nowrap;flex-direction:row;flex-grow:0;flex-shrink:0;box-sizing:border-box}:where(._v-stack_c5b98b6){position:relative;display:flex;padding:0;margin:0;min-width:0;min-height:0;width:100%;height:auto;overflow-x:visible;overflow-y:visible;flex-wrap:nowrap;flex-direction:column;flex-grow:0;flex-shrink:0;box-sizing:border-box}:where(._z-stack_0734316){position:relative;min-width:0;min-height:0;width:100%;height:auto;overflow:visible;box-sizing:border-box}:where(._box_16766f3){width:100%;min-width:0;max-width:100%;min-height:0;height:auto;max-height:100%;z-index:0;position:relative;box-sizing:border-box;transform:none}:where(._h-stack_f3d929e[data-inline=true]){display:inline-flex}:where(._h-stack_f3d929e[data-allow-flow=true]){flex-wrap:wrap}:where(._h-stack_f3d929e[data-v-alignment=start]){align-items:flex-start}:where(._h-stack_f3d929e[data-v-alignment=center]){align-items:center}:where(._h-stack_f3d929e[data-v-alignment=end]){align-items:flex-end}:where(._h-stack_f3d929e[data-h-alignment=start]){justify-content:flex-start}:where(._h-stack_f3d929e[data-h-alignment=center]){justify-content:center}:where(._h-stack_f3d929e[data-h-alignment=end]){justify-content:flex-end}:where(._h-stack_f3d929e>*){position:relative}:where(._h-stack_f3d929e>._h-stack_f3d929e[data-width=flex]),:where(._h-stack_f3d929e>._z-stack_0734316[data-width=flex]),:where(._h-stack_f3d929e>._v-stack_c5b98b6[data-width=flex]),:where(._h-stack_f3d929e>._stack-flex_74799db[data-width=flex]),:where(._h-stack_f3d929e>._h-stack_f3d929e[data-width=fill]),:where(._h-stack_f3d929e>._z-stack_0734316[data-width=fill]),:where(._h-stack_f3d929e>._v-stack_c5b98b6[data-width=fill]),:where(._h-stack_f3d929e>._stack-flex_74799db[data-width=fill]),:where(._h-stack_f3d929e>._box_16766f3[data-width=fill]){flex-grow:1;flex-shrink:0;flex-basis:0%;width:auto}:where(._h-stack_f3d929e>._h-stack_f3d929e[data-height=flex]),:where(._h-stack_f3d929e>._z-stack_0734316[data-height=flex]),:where(._h-stack_f3d929e>._v-stack_c5b98b6[data-height=flex]),:where(._h-stack_f3d929e>._stack-flex_74799db[data-height=flex]),:where(._h-stack_f3d929e>._box_16766f3[data-height=flex]),:where(._h-stack_f3d929e>._h-stack_f3d929e[data-height=fill]),:where(._h-stack_f3d929e>._z-stack_0734316[data-height=fill]),:where(._h-stack_f3d929e>._v-stack_c5b98b6[data-height=fill]),:where(._h-stack_f3d929e>._stack-flex_74799db[data-height=fill]),:where(._h-stack_f3d929e>._box_16766f3[data-height=fill]){height:100%}:where(._reveal-layout_d966b23 ._h-stack_f3d929e:after),:where(._reveal-h-stack_aab60c1 ._h-stack_f3d929e:after){content:"";position:absolute;inset:0;outline:1px dashed rgb(0,123,160);pointer-events:none;z-index:1}:where(._v-stack_c5b98b6[data-inline=true]){display:inline-flex}:where(._v-stack_c5b98b6[data-allow-flow=true]){flex-wrap:wrap}:where(._v-stack_c5b98b6[data-h-alignment=start]){align-items:flex-start}:where(._v-stack_c5b98b6[data-h-alignment=center]){align-items:center}:where(._v-stack_c5b98b6[data-h-alignment=end]){align-items:flex-end}:where(._v-stack_c5b98b6[data-v-alignment=start]){justify-content:flex-start}:where(._v-stack_c5b98b6[data-v-alignment=center]){justify-content:center}:where(._v-stack_c5b98b6[data-v-alignment=end]){justify-content:flex-end}:where(._v-stack_c5b98b6>*){position:relative}:where(._v-stack_c5b98b6[data-height=auto]){flex-grow:0;flex-shrink:0;flex-basis:auto}:where(._v-stack_c5b98b6>._h-stack_f3d929e[data-height=flex]),:where(._v-stack_c5b98b6>._z-stack_0734316[data-height=flex]),:where(._v-stack_c5b98b6>._v-stack_c5b98b6[data-height=flex]),:where(._v-stack_c5b98b6>._stack-flex_74799db[data-height=flex]),:where(._v-stack_c5b98b6>._box_16766f3[data-height=flex]),:where(._v-stack_c5b98b6>._h-stack_f3d929e[data-height=fill]),:where(._v-stack_c5b98b6>._z-stack_0734316[data-height=fill]),:where(._v-stack_c5b98b6>._v-stack_c5b98b6[data-height=fill]),:where(._v-stack_c5b98b6>._stack-flex_74799db[data-height=fill]),:where(._v-stack_c5b98b6>._box_16766f3[data-height=fill]){flex-grow:1;flex-shrink:0;flex-basis:0%;height:auto}:where(._v-stack_c5b98b6>._h-stack_f3d929e[data-width=flex]),:where(._v-stack_c5b98b6>._z-stack_0734316[data-width=flex]),:where(._v-stack_c5b98b6>._v-stack_c5b98b6[data-width=flex]),:where(._v-stack_c5b98b6>._stack-flex_74799db[data-width=flex]),:where(._v-stack_c5b98b6>._box_16766f3[data-width=flex]),:where(._v-stack_c5b98b6>._h-stack_f3d929e[data-width=fill]),:where(._v-stack_c5b98b6>._z-stack_0734316[data-width=fill]),:where(._v-stack_c5b98b6>._v-stack_c5b98b6[data-width=fill]),:where(._v-stack_c5b98b6>._stack-flex_74799db[data-width=fill]),:where(._v-stack_c5b98b6>._box_16766f3[data-width=fill]){width:100%}:where(._v-stack_c5b98b6[data-height=auto]>._h-stack_f3d929e[data-height=flex]),:where(._v-stack_c5b98b6[data-height=auto]>._z-stack_0734316[data-height=flex]),:where(._v-stack_c5b98b6[data-height=auto]>._v-stack_c5b98b6[data-height=flex]),:where(._v-stack_c5b98b6[data-height=auto]>._stack-flex_74799db[data-height=flex]),:where(._v-stack_c5b98b6[data-height=auto]>._box_16766f3[data-height=flex]),:where(._v-stack_c5b98b6[data-height=auto]>._h-stack_f3d929e[data-height=fill]),:where(._v-stack_c5b98b6[data-height=auto]>._z-stack_0734316[data-height=fill]),:where(._v-stack_c5b98b6[data-height=auto]>._v-stack_c5b98b6[data-height=fill]),:where(._v-stack_c5b98b6[data-height=auto]>._stack-flex_74799db[data-height=fill]){flex-basis:auto}:where(._v-stack_c5b98b6[data-height=auto] ._h-stack_f3d929e[data-height=default]),:where(._v-stack_c5b98b6[data-height=auto] ._z-stack_0734316[data-height=default]),:where(._v-stack_c5b98b6[data-height=auto] ._v-stack_c5b98b6[data-height=default]),:where(._v-stack_c5b98b6[data-height=auto] ._stack-flex_74799db[data-height=default]),:where(._v-stack_c5b98b6[data-height=auto] ._box_16766f3[data-height=default]){height:auto;flex-basis:auto}:where(._reveal-layout_d966b23 ._v-stack_c5b98b6:after),:where(._reveal-v-stack_389c691 ._v-stack_c5b98b6:after){content:"";position:absolute;inset:0;outline:1px dashed rgb(0,165,152);pointer-events:none;z-index:1}:where(._z-stack_0734316>*){position:relative;min-width:0;min-height:0;grid-area:1 / 1 / 2 / 2;box-sizing:border-box}:where(._z-stack_0734316[data-h-alignment=start]>*){justify-self:start}:where(._z-stack_0734316[data-h-alignment=center]>*){justify-self:center}:where(._z-stack_0734316[data-h-alignment=end]>*){justify-self:end}:where(._z-stack_0734316[data-v-alignment=start]>*){align-self:start}:where(._z-stack_0734316[data-v-alignment=center]>*){align-self:center}:where(._z-stack_0734316[data-v-alignment=end]>*){align-self:end}:where(._z-stack_0734316>._h-stack_f3d929e[data-height=flex]),:where(._z-stack_0734316>._v-stack_c5b98b6[data-height=flex]),:where(._z-stack_0734316>._h-stack_f3d929e[data-height=fill]),:where(._z-stack_0734316>._v-stack_c5b98b6[data-height=fill]),:where(._z-stack_0734316>._stack-flex_74799db[data-height=fill]),:where(._z-stack_0734316>._stack-flex_74799db[data-height=default]){height:100%}:where(._z-stack_0734316>._h-stack_f3d929e[data-width=flex]),:where(._z-stack_0734316>._v-stack_c5b98b6[data-width=flex]),:where(._z-stack_0734316>._h-stack_f3d929e[data-width=fill]),:where(._z-stack_0734316>._v-stack_c5b98b6[data-width=fill]),:where(._z-stack_0734316>._stack-flex_74799db[data-width=fill]),:where(._z-stack_0734316>._stack-flex_74799db[data-width=default]){width:100%}:where(._reveal-layout_d966b23 ._z-stack_0734316:after),:where(._reveal-z-stack_366b960 ._z-stack_0734316:after){content:"";position:absolute;inset:0;outline:1px dashed rgb(119,0,255);pointer-events:none;z-index:1}:where(._h-stack_f3d929e>._h-stack_f3d929e[data-width=default]),:where(._h-stack_f3d929e>._z-stack_0734316[data-width=default]),:where(._h-stack_f3d929e>._v-stack_c5b98b6[data-width=default]),:where(._h-stack_f3d929e>._stack-flex_74799db[data-width=default]),:where(._h-stack_f3d929e>._box_16766f3[data-width=default]){flex-grow:1;flex-shrink:0;flex-basis:0%;width:auto}:where(._h-stack_f3d929e[data-height=auto] ._h-stack_f3d929e[data-height=default]),:where(._h-stack_f3d929e[data-height=auto] ._z-stack_0734316[data-height=default]),:where(._h-stack_f3d929e[data-height=auto] ._v-stack_c5b98b6[data-height=default]),:where(._h-stack_f3d929e[data-height=auto] ._stack-flex_74799db[data-height=default]){height:auto}:where(._h-stack_f3d929e[data-width=auto]){flex-grow:0;flex-shrink:0;width:auto;flex-basis:auto}:where(._h-stack_f3d929e[data-width=auto]>._h-stack_f3d929e[data-width=flex]),:where(._h-stack_f3d929e[data-width=auto]>._z-stack_0734316[data-width=flex]),:where(._h-stack_f3d929e[data-width=auto]>._v-stack_c5b98b6[data-width=flex]),:where(._h-stack_f3d929e[data-width=auto]>._stack-flex_74799db[data-width=flex]),:where(._h-stack_f3d929e[data-width=auto]>._h-stack_f3d929e[data-width=fill]),:where(._h-stack_f3d929e[data-width=auto]>._z-stack_0734316[data-width=fill]),:where(._h-stack_f3d929e[data-width=auto]>._v-stack_c5b98b6[data-width=fill]),:where(._h-stack_f3d929e[data-width=auto]>._stack-flex_74799db[data-width=fill]){flex-basis:auto}:where(._v-stack_c5b98b6>._h-stack_f3d929e[data-height=default]),:where(._v-stack_c5b98b6>._z-stack_0734316[data-height=default]),:where(._v-stack_c5b98b6>._v-stack_c5b98b6[data-height=default]),:where(._v-stack_c5b98b6>._stack-flex_74799db[data-height=default]){flex-basis:auto;height:auto}:where(._v-stack_c5b98b6[data-overflow-y=auto]:not([data-height=auto])),:where(._v-stack_c5b98b6[data-overflow-y=scroll]:not([data-height=auto])),:where(._h-stack_f3d929e[data-overflow-y=auto]:not([data-width=auto])),:where(._h-stack_f3d929e[data-overflow-y=scroll]:not([data-width=auto])){flex-shrink:1}:where(._box_16766f3[data-enabled-resize-on-start=true]),:where(._box_16766f3[data-enabled-resize-on-end=true]),:where(._box_16766f3[data-enabled-resize-on-top=true]),:where(._box_16766f3[data-enabled-resize-on-bottom=true]),:where(._box_16766f3[data-enabled-resize-on-left=true]),:where(._box_16766f3[data-enabled-resize-on-right=true]){transform:translateZ(0)}:where(._box_16766f3[data-width=flex]){width:auto}:where(.tcn-reveal-layout ._box_16766f3:after),:where(.tcn-reveal-box ._box_16766f3:after){content:"";position:absolute;inset:0;border:1px dashed rgb(138,138,138);pointer-events:none;z-index:1}}

package/dist/stacks/box/bottom_resize_handle.js

@@ -20,7 +20,7 @@ function x({
   return /* @__PURE__ */ m(
     "div",
     {
-      className: c(z["bottom-resize-handle"], "bottom-resize-handle"),
+      className: c(z["bottom-resize-handle"], "tcn-bottom-resize-handle"),
       onMouseDown: i,
       style: r,
       children: e?.children

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

@@ -1 +1 @@
-{"version":3,"file":"bottom_resize_handle.js","sources":["../../../src/stacks/box/bottom_resize_handle.tsx"],"sourcesContent":["import React from 'react';\nimport styles from './bottom_resize_handle.module.css';\nimport { createVerticalResizeHandler } from './resize_handlers.js';\nimport { clsx } from 'clsx';\nimport type { HandleProps } from './handle_props.js';\n\nexport interface BottomResizeHandleProps {\n  targetRef: React.MutableRefObject<HTMLElement | null>;\n  handleProps?: HandleProps;\n  onHeightResize?: (value: number) => void;\n  onHeightResizeEnd?: (value: number) => void;\n}\n\nexport function BottomResizeHandle({\n  targetRef,\n  handleProps,\n  onHeightResize,\n  onHeightResizeEnd,\n}: BottomResizeHandleProps) {\n  const resizeHandler = createVerticalResizeHandler(\n    targetRef,\n    onHeightResize,\n    onHeightResizeEnd\n  );\n  const offset = handleProps?.offset ? handleProps.offset : -8;\n\n  const bottomResizeHandleStyle: React.CSSProperties = {\n    ...handleProps?.style,\n    bottom: `${offset}px`,\n    height: handleProps?.size || '16px',\n  };\n\n  return (\n    <div\n      className={clsx(styles['bottom-resize-handle'], 'bottom-resize-handle')}\n      onMouseDown={resizeHandler}\n      style={bottomResizeHandleStyle}\n    >\n      {handleProps?.children}\n    </div>\n  );\n}\n"],"names":["BottomResizeHandle","targetRef","handleProps","onHeightResize","onHeightResizeEnd","resizeHandler","createVerticalResizeHandler","offset","bottomResizeHandleStyle","jsx","clsx","styles"],"mappings":";;;;AAaO,SAASA,EAAmB;AAAA,EACjC,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,mBAAAC;AACF,GAA4B;AAC1B,QAAMC,IAAgBC;AAAA,IACpBL;AAAA,IACAE;AAAA,IACAC;AAAA,EAAA,GAEIG,IAASL,GAAa,SAASA,EAAY,SAAS,IAEpDM,IAA+C;AAAA,IACnD,GAAGN,GAAa;AAAA,IAChB,QAAQ,GAAGK,CAAM;AAAA,IACjB,QAAQL,GAAa,QAAQ;AAAA,EAAA;AAG/B,SACE,gBAAAO;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAKC,EAAO,sBAAsB,GAAG,sBAAsB;AAAA,MACtE,aAAaN;AAAA,MACb,OAAOG;AAAA,MAEN,UAAAN,GAAa;AAAA,IAAA;AAAA,EAAA;AAGpB;"}
+{"version":3,"file":"bottom_resize_handle.js","sources":["../../../src/stacks/box/bottom_resize_handle.tsx"],"sourcesContent":["import React from 'react';\nimport styles from './bottom_resize_handle.module.css';\nimport { createVerticalResizeHandler } from './resize_handlers.js';\nimport { clsx } from 'clsx';\nimport type { HandleProps } from './handle_props.js';\n\nexport interface BottomResizeHandleProps {\n  targetRef: React.MutableRefObject<HTMLElement | null>;\n  handleProps?: HandleProps;\n  onHeightResize?: (value: number) => void;\n  onHeightResizeEnd?: (value: number) => void;\n}\n\nexport function BottomResizeHandle({\n  targetRef,\n  handleProps,\n  onHeightResize,\n  onHeightResizeEnd,\n}: BottomResizeHandleProps) {\n  const resizeHandler = createVerticalResizeHandler(\n    targetRef,\n    onHeightResize,\n    onHeightResizeEnd\n  );\n  const offset = handleProps?.offset ? handleProps.offset : -8;\n\n  const bottomResizeHandleStyle: React.CSSProperties = {\n    ...handleProps?.style,\n    bottom: `${offset}px`,\n    height: handleProps?.size || '16px',\n  };\n\n  return (\n    <div\n      className={clsx(styles['bottom-resize-handle'], 'tcn-bottom-resize-handle')}\n      onMouseDown={resizeHandler}\n      style={bottomResizeHandleStyle}\n    >\n      {handleProps?.children}\n    </div>\n  );\n}\n"],"names":["BottomResizeHandle","targetRef","handleProps","onHeightResize","onHeightResizeEnd","resizeHandler","createVerticalResizeHandler","offset","bottomResizeHandleStyle","jsx","clsx","styles"],"mappings":";;;;AAaO,SAASA,EAAmB;AAAA,EACjC,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,mBAAAC;AACF,GAA4B;AAC1B,QAAMC,IAAgBC;AAAA,IACpBL;AAAA,IACAE;AAAA,IACAC;AAAA,EAAA,GAEIG,IAASL,GAAa,SAASA,EAAY,SAAS,IAEpDM,IAA+C;AAAA,IACnD,GAAGN,GAAa;AAAA,IAChB,QAAQ,GAAGK,CAAM;AAAA,IACjB,QAAQL,GAAa,QAAQ;AAAA,EAAA;AAG/B,SACE,gBAAAO;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,EAAKC,EAAO,sBAAsB,GAAG,0BAA0B;AAAA,MAC1E,aAAaN;AAAA,MACb,OAAOG;AAAA,MAEN,UAAAN,GAAa;AAAA,IAAA;AAAA,EAAA;AAGpB;"}

package/dist/stacks/box/box.js

@@ -15,18 +15,18 @@ import { clsx as mo } from "clsx";
 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 _o = O.forwardRef(function({
+const Yo = O.forwardRef(function({
   style: v,
   className: P,
-  as: H = "div",
-  children: V,
+  as: _ = "div",
+  children: H,
   width: r = "default",
-  minWidth: b,
-  maxWidth: j,
+  minWidth: V,
+  maxWidth: b,
   height: t = "default",
-  minHeight: w,
-  maxHeight: Y,
-  zIndex: _,
+  minHeight: j,
+  maxHeight: w,
+  zIndex: Y,
   padding: A,
   paddingInline: B,
   paddingBlock: C,
@@ -47,22 +47,22 @@ const _o = O.forwardRef(function({
   enableResizeOnLeft: c = !1,
   enableResizeOnRight: p = !1,
   onWidthResize: e,
-  onHeightResize: d,
+  onHeightResize: i,
   onWidthResizeEnd: f,
   onHeightResizeEnd: u,
   horizontalHandleProps: x,
-  verticalHandleProps: i,
+  verticalHandleProps: d,
   ...X
 }, Z) {
-  const $ = H, 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 = 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");
   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,
-    minWidth: b,
-    maxWidth: j,
+    minWidth: V,
+    maxWidth: b,
     height: y(t) ? void 0 : t,
-    minHeight: w,
-    maxHeight: Y,
+    minHeight: j,
+    maxHeight: w,
     padding: A,
     paddingInline: B,
     paddingBlock: C,
@@ -76,7 +76,7 @@ const _o = O.forwardRef(function({
     overflow: K,
     overflowX: M,
     overflowY: Q,
-    zIndex: _
+    zIndex: Y
   };
   return /* @__PURE__ */ h(
     $,
@@ -99,15 +99,15 @@ const _o = O.forwardRef(function({
         P,
         F && "stack-flex",
         F && k["stack-flex"],
-        "box"
+        "tcn-box"
       ),
       ...X,
       children: [
-        V,
+        H,
         s && /* @__PURE__ */ a(
           lo,
           {
-            onHeightResize: d,
+            onHeightResize: i,
             onHeightResizeEnd: u,
             targetRef: o,
             handleProps: x
@@ -116,10 +116,10 @@ const _o = O.forwardRef(function({
         m && /* @__PURE__ */ a(
           eo,
           {
-            onHeightResize: d,
+            onHeightResize: i,
             onHeightResizeEnd: u,
             targetRef: o,
-            handleProps: i
+            handleProps: d
           }
         ),
         n && /* @__PURE__ */ a(
@@ -146,7 +146,7 @@ const _o = O.forwardRef(function({
             onWidthResize: e,
             onWidthResizeEnd: f,
             targetRef: o,
-            handleProps: i
+            handleProps: d
           }
         ),
         p && /* @__PURE__ */ a(
@@ -155,7 +155,7 @@ const _o = O.forwardRef(function({
             onWidthResize: e,
             onWidthResizeEnd: f,
             targetRef: o,
-            handleProps: i
+            handleProps: d
           }
         )
       ]
@@ -163,6 +163,6 @@ const _o = O.forwardRef(function({
   );
 });
 export {
-  _o as Box
+  Yo as Box
 };
 //# sourceMappingURL=box.js.map

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 extends HTMLAttributes<HTMLElement> {\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        '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 { 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 extends HTMLAttributes<HTMLElement> {\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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"}

package/dist/stacks/box/end_resize_handle.js

@@ -20,7 +20,7 @@ function x({
   return /* @__PURE__ */ d(
     "div",
     {
-      className: c(z["end-resize-handle"], "end-resize-handle"),
+      className: c(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'], '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,mBAAmB;AAAA,MAChE,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 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;"}

package/dist/stacks/box/left_resize_handle.js

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

package/dist/stacks/box/right_resize_handle.js

@@ -1,7 +1,7 @@
 import { jsx as l } from "react/jsx-runtime";
 import { createHorizontalResizeHandler as f } from "./resize_handlers.js";
-import { clsx as z } from "clsx";
-import '../../right_resize_handle.css';const c = "_right-resize-handle_7f232b9", a = { "right-resize-handle": c };
+import { clsx as c } from "clsx";
+import '../../right_resize_handle.css';const z = "_right-resize-handle_7f232b9", a = { "right-resize-handle": z };
 function m({
   targetRef: t,
   handleProps: e,
@@ -22,7 +22,7 @@ function m({
   return /* @__PURE__ */ l(
     "div",
     {
-      className: z(a["right-resize-handle"], "right-resize-handle"),
+      className: c(a["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'], '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,qBAAqB;AAAA,MACpE,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 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;"}

package/dist/stacks/box/start_resize_handle.js

@@ -1,7 +1,7 @@
 import { jsx as o } from "react/jsx-runtime";
 import { createHorizontalResizeHandler as l } from "./resize_handlers.js";
-import { clsx as f } from "clsx";
-import '../../start_resize_handle.css';const z = "_start-resize-handle_22a3d5a", c = { "start-resize-handle": z };
+import { clsx as c } from "clsx";
+import '../../start_resize_handle.css';const f = "_start-resize-handle_22a3d5a", z = { "start-resize-handle": f };
 function x({
   targetRef: t,
   handleProps: e,
@@ -13,17 +13,17 @@ function x({
     s,
     r,
     !0
-  ), a = e?.offset ? e.offset : -8, n = {
+  ), n = e?.offset ? e.offset : -8, a = {
     ...e?.style,
-    "--resize-offset": `${a}px`,
+    "--resize-offset": `${n}px`,
     width: e?.size || "16px"
   };
   return /* @__PURE__ */ o(
     "div",
     {
-      className: f(c["start-resize-handle"], "start-resize-handle"),
+      className: c(z["start-resize-handle"], "tcn-start-resize-handle"),
       onMouseDown: i,
-      style: n,
+      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'], '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,qBAAqB;AAAA,MACpE,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 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;"}

package/dist/stacks/box/top_resize_handle.js

@@ -21,7 +21,7 @@ function x({
   return /* @__PURE__ */ l(
     "div",
     {
-      className: f(z["top-resize-handle"], "top-resize-handle"),
+      className: f(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?: (value: number) => void;\n  onHeightResizeEnd?: (value: number) => 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  );\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'], '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,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,mBAAmB;AAAA,MAChE,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 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?: (value: number) => void;\n  onHeightResizeEnd?: (value: number) => 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  );\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,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/h_collapsible_box.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"h_collapsible_box.d.ts","sourceRoot":"","sources":["../../src/stacks/h_collapsible_box.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0B,MAAM,OAAO,CAAC;AAG/C,OAAO,EAAO,QAAQ,EAAE,MAAM,cAAc,CAAC;AAI7C,MAAM,WAAW,oBAAqB,SAAQ,QAAQ;IACpD,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,eAAO,MAAM,eAAe,6FAmC1B,CAAC"}
+{"version":3,"file":"h_collapsible_box.d.ts","sourceRoot":"","sources":["../../src/stacks/h_collapsible_box.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA0B,MAAM,OAAO,CAAC;AAG/C,OAAO,EAAO,QAAQ,EAAE,MAAM,cAAc,CAAC;AAI7C,MAAM,WAAW,oBAAqB,SAAQ,QAAQ;IACpD,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,YAAY,CAAC,EAAE,MAAM,CAAC;CACvB;AAED,eAAO,MAAM,eAAe,6FAuC1B,CAAC"}

package/dist/stacks/h_collapsible_box.js

@@ -7,14 +7,14 @@ import { useForkRef as d } from "../utils/hooks/use_fork_ref.js";
 import "../utils/hooks/use_resize_observer.js";
 import { clsx as u } from "clsx";
 import { Box as R } from "./box/box.js";
-import { s as z } from "../collapsible_box.module-BiS98xXA.js";
-import { useIsCollapsed as x } from "./utils/use_is_collapsed.js";
-const F = t.forwardRef(function({ open: l = !1, defaultWidth: i = "400px", ...e }, a) {
+import { s as x } from "../collapsible_box.module-BiS98xXA.js";
+import { useIsCollapsed as z } from "./utils/use_is_collapsed.js";
+const j = t.forwardRef(function({ open: l = !1, defaultWidth: i = "400px", ...e }, a) {
   const s = t.useRef(null), n = d(a, s), [c, r] = t.useState(!1);
   p(() => {
     s.current?.style.setProperty("--collapsible-size", i);
   }, [i]);
-  const f = x(l, s) && !l ? null : e.children;
+  const f = z(l, s) && !l ? null : e.children;
   return /* @__PURE__ */ m(
     R,
     {
@@ -29,12 +29,16 @@ const F = t.forwardRef(function({ open: l = !1, defaultWidth: i = "400px", ...e
       onWidthResizeEnd: (o) => {
         r(!1), e.onWidthResizeEnd?.(o), s.current?.style.setProperty("--collapsible-size", `${o}px`);
       },
-      className: u(e.className, z["collapsible-box"]),
+      className: u(
+        e.className,
+        x["collapsible-box"],
+        "tcn-h-collapsible-box"
+      ),
       children: f
     }
   );
 });
 export {
-  F as HCollapsibleBox
+  j 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 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 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 => {\n        setIsResizing(true);\n        props.onWidthResize?.(width);\n      }}\n      onWidthResizeEnd={width => {\n        setIsResizing(false);\n        props.onWidthResizeEnd?.(width);\n        collapsibleRef.current?.style.setProperty('--collapsible-size', `${width}px`);\n      }}\n      className={clsx(props.className, styles['collapsible-box'])}\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","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,CAAAO,MAAS;AACtB,QAAAN,EAAc,EAAI,GAClBN,EAAM,gBAAgBY,CAAK;AAAA,MAC7B;AAAA,MACA,kBAAkB,CAAAA,MAAS;AACzB,QAAAN,EAAc,EAAK,GACnBN,EAAM,mBAAmBY,CAAK,GAC9BV,EAAe,SAAS,MAAM,YAAY,sBAAsB,GAAGU,CAAK,IAAI;AAAA,MAC9E;AAAA,MACA,WAAWC,EAAKb,EAAM,WAAWc,EAAO,iBAAiB,CAAC;AAAA,MAC1D,UAAAN;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;"}
+{"version":3,"file":"h_collapsible_box.js","sources":["../../src/stacks/h_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 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 => {\n        setIsResizing(true);\n        props.onWidthResize?.(width);\n      }}\n      onWidthResizeEnd={width => {\n        setIsResizing(false);\n        props.onWidthResizeEnd?.(width);\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","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,CAAAO,MAAS;AACtB,QAAAN,EAAc,EAAI,GAClBN,EAAM,gBAAgBY,CAAK;AAAA,MAC7B;AAAA,MACA,kBAAkB,CAAAA,MAAS;AACzB,QAAAN,EAAc,EAAK,GACnBN,EAAM,mBAAmBY,CAAK,GAC9BV,EAAe,SAAS,MAAM,YAAY,sBAAsB,GAAGU,CAAK,IAAI;AAAA,MAC9E;AAAA,MACA,WAAWC;AAAA,QACTb,EAAM;AAAA,QACNc,EAAO,iBAAiB;AAAA,QACxB;AAAA,MAAA;AAAA,MAEF,UAAAN;AAAA,IAAA;AAAA,EAAA;AAGN,CAAC;"}