asheeui 0.6.3 → 0.6.6

package/dist/components/multi-select/MultiSelect.js

@@ -1,26 +1,27 @@
 "use client";
 import { jsx as l, jsxs as S } from "react/jsx-runtime";
-import { useFloating as Oe, autoUpdate as Fe, offset as Ue, flip as Pe, shift as Re, size as je, useClick as Ve, useDismiss as Be, useRole as Ge, useInteractions as He } from "@floating-ui/react";
-import { forwardRef as $e, useId as Qe, useState as U, useMemo as P, useCallback as L } from "react";
-import { ChevronDownIcon as he } from "../../icons/ChevronDownIcon.js";
-import { CloseIcon as qe } from "../../icons/CloseIcon.js";
-import { useAsheeConfig as Je } from "../../libs/context.js";
-import { resolveCascade as d, resolveRadiusKey as R, resolveClassKey as g } from "../../utils/resolve-token.js";
-import { Button as We } from "../button/Button.js";
-import { Chip as Xe } from "../chip/Chip.js";
-import { FieldShell as Ye } from "../field/FieldShell.js";
-import { SelectMenu as Ze } from "../select-menu/SelectMenu.js";
-import { FALLBACK_MULTI_SELECT_CONFIG as t } from "./multi-select-config.js";
-import { MULTI_SELECT_HEIGHT_CLASS as Ce, MULTI_SELECT_PADDING_CLASS as es, MULTI_SELECT_FONT_CLASS as ss, STATUS_BORDER_CLASS as rs } from "./multi-select-styles.js";
-import { RADIUS_CLASS as ts } from "../../shared/radius.js";
-import { cn as w } from "../../utils/cn.js";
-const ls = $e(
+import { useClick as Ue, useDismiss as Ve, useRole as je, useInteractions as Be } from "@floating-ui/react";
+import { forwardRef as Ge, useId as He, useState as P, useMemo as R, useCallback as L } from "react";
+import { ChevronDownIcon as Qe } from "../../icons/ChevronDownIcon.js";
+import { CloseIcon as $e } from "../../icons/CloseIcon.js";
+import { useAsheeConfig as qe } from "../../libs/context.js";
+import { resolveCascade as c, resolveRadiusKey as U, resolveClassKey as g } from "../../utils/resolve-token.js";
+import { Button as Je } from "../button/Button.js";
+import { Chip as We } from "../chip/Chip.js";
+import { FieldShell as Xe } from "../field/FieldShell.js";
+import { SelectMenu as Ye } from "../select-menu/SelectMenu.js";
+import { FALLBACK_MULTI_SELECT_CONFIG as s } from "./multi-select-config.js";
+import { MULTI_SELECT_HEIGHT_CLASS as Ze, MULTI_SELECT_PADDING_CLASS as he, MULTI_SELECT_FONT_CLASS as Ce, STATUS_BORDER_CLASS as er } from "./multi-select-styles.js";
+import { RADIUS_CLASS as rr } from "../../shared/radius.js";
+import { useSelectFloating as sr } from "../select-menu/use-select-floating.js";
+import { cn as T } from "../../utils/cn.js";
+const tr = Ge(
   ({
     options: I = [],
-    value: a,
-    onChange: u,
-    InputLabel: j = "Select Options...",
-    isSearch: V = !0,
+    value: o,
+    onChange: m,
+    InputLabel: V = "Select Options...",
+    isSearch: j = !0,
     searchPlaceholder: B = "Search...",
     searchInputName: G = "multiselect-search",
     belowList: H,
@@ -28,180 +29,179 @@ const ls = $e(
     handleRemoveChip: n,
     handleAddChip: f,
     chipLabel: _,
-    disableChipDisplay: $ = !1,
-    variant: Q,
-    color: h,
-    size: q,
-    radius: J,
-    status: W,
-    label: X,
-    labelAlign: Y,
-    description: Z,
+    disableChipDisplay: Q = !1,
+    variant: $,
+    color: q,
+    size: J,
+    radius: W,
+    status: X,
+    label: Y,
+    labelAlign: Z,
+    description: h,
     message: C,
     required: ee,
-    isLoading: se,
-    disabled: c,
-    containerClassName: re,
+    isLoading: re,
+    disabled: u,
+    containerClassName: se,
     dropdownClassName: te,
     id: le,
-    className: oe,
-    menu: ae,
-    chip: o,
-    style: ne,
-    ...ie
+    className: ae,
+    menu: oe,
+    chip: a,
+    portal: ne,
+    portalTarget: ie,
+    style: ce,
+    ...ue
   }, p) => {
-    var D, K, M, O;
-    const x = Je(), s = (D = x.components) == null ? void 0 : D.multiSelect, ce = Qe(), ue = le ?? ce, [v, me] = U(!1), [de, fe] = U(""), { refs: z, floatingStyles: Se, context: y } = Oe({
-      open: v,
-      onOpenChange: (e) => !c && me(e),
-      placement: "bottom-start",
-      whileElementsMounted: Fe,
-      middleware: [
-        Ue(4),
-        Pe(),
-        Re({ padding: 8 }),
-        je({
-          apply({ availableHeight: e, elements: r }) {
-            Object.assign(r.floating.style, {
-              maxHeight: `${e}px`
-            });
-          }
-        })
-      ]
-    }), pe = Ve(y, { enabled: !c }), xe = Be(y), ve = Ge(y, { role: "listbox" }), { getReferenceProps: ye, getFloatingProps: be } = He([
-      pe,
-      xe,
-      ve
-    ]), b = d(
+    var D, K, F, M;
+    const v = qe(), e = (D = v.components) == null ? void 0 : D.multiSelect, me = He(), de = le ?? me, [x, fe] = P(!1), [Se, pe] = P(""), y = c(
+      J,
+      e == null ? void 0 : e.size,
+      void 0,
+      s.size
+    ), ve = c(
+      $,
+      e == null ? void 0 : e.variant,
+      v.defaultVariant,
+      s.variant
+    ), w = c(
       q,
-      s == null ? void 0 : s.size,
+      e == null ? void 0 : e.color,
+      v.defaultColor,
+      s.color
+    ), A = U(
+      W,
+      e == null ? void 0 : e.radius,
+      v.defaultRadius,
+      s.radius
+    ), xe = c(
+      a == null ? void 0 : a.color,
+      (K = e == null ? void 0 : e.chip) == null ? void 0 : K.color,
+      w,
+      s.chip.color
+    ), ye = c(
+      a == null ? void 0 : a.size,
+      (F = e == null ? void 0 : e.chip) == null ? void 0 : F.size,
       void 0,
-      t.size
-    ), ge = d(
-      Q,
-      s == null ? void 0 : s.variant,
-      x.defaultVariant,
-      t.variant
-    ), A = d(
-      h,
-      s == null ? void 0 : s.color,
-      x.defaultColor,
-      t.color
-    ), E = R(
-      J,
-      s == null ? void 0 : s.radius,
-      x.defaultRadius,
-      t.radius
-    ), we = d(
-      o == null ? void 0 : o.color,
-      (K = s == null ? void 0 : s.chip) == null ? void 0 : K.color,
+      s.chip.size
+    ), be = U(
+      a == null ? void 0 : a.radius,
+      (M = e == null ? void 0 : e.chip) == null ? void 0 : M.radius,
       A,
-      t.chip.color
-    ), Ie = d(
-      o == null ? void 0 : o.size,
-      (M = s == null ? void 0 : s.chip) == null ? void 0 : M.size,
+      s.chip.radius
+    ), d = X ?? "default", ge = d === "error" ? "danger" : d === "success" ? "success" : d === "warning" ? "warning" : w, Te = c(
+      Z,
+      e == null ? void 0 : e.labelAlign,
       void 0,
-      t.chip.size
-    ), Ne = R(
-      o == null ? void 0 : o.radius,
-      (O = s == null ? void 0 : s.chip) == null ? void 0 : O.radius,
-      E,
-      t.chip.radius
-    ), m = W ?? "default", Le = m === "error" ? "danger" : m === "success" ? "success" : m === "warning" ? "warning" : A, _e = d(
-      Y,
-      s == null ? void 0 : s.labelAlign,
+      s.labelAlign
+    ), Ie = c(
+      ne,
+      e == null ? void 0 : e.portal,
       void 0,
-      t.labelAlign
-    ), ze = g(
-      b,
+      s.portal
+    ), Ne = c(
+      ie,
+      e == null ? void 0 : e.portalTarget,
+      void 0,
+      s.portalTarget
+    ), Le = g(
+      y,
+      Ze,
+      s.size
+    ), _e = g(
+      y,
+      he,
+      s.size
+    ), we = g(
+      y,
       Ce,
-      t.size
+      s.size
     ), Ae = g(
-      b,
-      es,
-      t.size
-    ), Ee = g(
-      b,
-      ss,
-      t.size
-    ), Te = g(
-      Ne,
-      ts,
-      t.chip.radius
-    ), i = P(() => N !== void 0 ? N : Array.isArray(a) ? I.filter((e) => a.includes(e.value)) : [], [N, a, I]), T = L(
-      (e) => i.some((r) => r.value === e),
+      be,
+      rr,
+      s.chip.radius
+    ), { refs: z, floatingStyles: ze, context: b } = sr({
+      isOpen: x,
+      onOpenChange: fe,
+      disabled: u
+    }), Ee = Ue(b, { enabled: !u }), ke = Ve(b), De = je(b, { role: "listbox" }), { getReferenceProps: Ke, getFloatingProps: Fe } = Be([
+      Ee,
+      ke,
+      De
+    ]), i = R(() => N !== void 0 ? N : Array.isArray(o) ? I.filter((r) => o.includes(r.value)) : [], [N, o, I]), E = L(
+      (r) => i.some((t) => t.value === r),
       [i]
-    ), ke = L(
-      (e) => {
-        const r = T(e.value);
+    ), Me = L(
+      (r) => {
+        const t = E(r.value);
         if (f || n)
-          r ? n == null || n(e.value) : f == null || f(e);
-        else if (u) {
-          const F = a ?? [], Ke = r ? F.filter((Me) => Me !== e.value) : [...F, e.value];
-          u(Ke);
+          t ? n == null || n(r.value) : f == null || f(r);
+        else if (m) {
+          const O = o ?? [], Pe = t ? O.filter((Re) => Re !== r.value) : [...O, r.value];
+          m(Pe);
         }
       },
-      [T, f, n, u, a]
+      [E, f, n, m, o]
     ), k = L(
-      (e) => {
-        n ? n(e) : u && Array.isArray(a) && u(a.filter((r) => r !== e));
+      (r) => {
+        n ? n(r) : m && Array.isArray(o) && m(o.filter((t) => t !== r));
       },
-      [n, u, a]
-    ), De = P(
-      () => i.map((e) => e.value),
+      [n, m, o]
+    ), Oe = R(
+      () => i.map((r) => r.value),
       [i]
     );
     return /* @__PURE__ */ l(
-      Ye,
+      Xe,
       {
-        id: ue,
-        label: X,
-        labelAlign: _e,
-        description: Z,
+        id: de,
+        label: Y,
+        labelAlign: Te,
+        description: h,
         message: C,
-        status: m,
+        status: d,
         required: ee,
-        isLoading: se,
+        isLoading: re,
         children: /* @__PURE__ */ S(
           "div",
           {
-            className: w("w-full flex flex-col gap-3", re),
-            style: ne,
-            ...ie,
+            className: T("w-full flex flex-col gap-3", se),
+            style: ce,
+            ...ue,
             children: [
               /* @__PURE__ */ S("div", { className: "relative w-full", children: [
                 /* @__PURE__ */ S(
-                  We,
+                  Je,
                   {
-                    ref: (e) => {
-                      z.setReference(e), typeof p == "function" ? p(e) : p && (p.current = e);
+                    ref: (r) => {
+                      z.setReference(r), typeof p == "function" ? p(r) : p && (p.current = r);
                     },
-                    variant: ge,
-                    color: Le,
-                    radius: E,
+                    variant: ve,
+                    color: ge,
+                    radius: A,
                     animate: !1,
-                    size: b,
-                    isDisabled: c,
-                    "aria-expanded": v,
+                    size: y,
+                    isDisabled: u,
+                    "aria-expanded": x,
                     "aria-haspopup": "listbox",
-                    "aria-invalid": m === "error",
-                    className: w(
+                    "aria-invalid": d === "error",
+                    className: T(
                       "w-full flex items-center justify-between font-normal text-left transition-all duration-200 outline-none select-none",
-                      rs[m],
-                      ze,
-                      Ae,
-                      Ee,
-                      oe
+                      er[d],
+                      Le,
+                      _e,
+                      we,
+                      ae
                     ),
-                    ...ye(),
+                    ...Ke(),
                     children: [
-                      /* @__PURE__ */ l("span", { children: i.length > 0 ? `${i.length} selected` : j }),
+                      /* @__PURE__ */ l("span", { children: i.length > 0 ? `${i.length} selected` : V }),
                       /* @__PURE__ */ l(
-                        he,
+                        Qe,
                         {
-                          className: w(
+                          className: T(
                             "ml-2 shrink-0 transition-transform duration-200",
-                            v && "rotate-180"
+                            x && "rotate-180"
                           )
                         }
                       )
@@ -209,62 +209,64 @@ const ls = $e(
                   }
                 ),
                 /* @__PURE__ */ l(
-                  Ze,
+                  Ye,
                   {
-                    isOpen: v,
-                    context: y,
-                    floatingStyles: Se,
-                    getFloatingProps: be,
+                    isOpen: x,
+                    context: b,
+                    floatingStyles: ze,
+                    getFloatingProps: Fe,
                     setFloatingRef: z.setFloating,
                     options: I,
-                    selectedValues: De,
-                    onSelectOption: ke,
-                    isSearch: V,
+                    selectedValues: Oe,
+                    onSelectOption: Me,
+                    isSearch: j,
                     searchPlaceholder: B,
                     searchInputName: G,
-                    searchQuery: de,
-                    onSearchChange: fe,
+                    searchQuery: Se,
+                    onSearchChange: pe,
                     belowList: H,
                     dropdownClassName: te,
-                    menuProps: ae,
-                    menuConfig: s == null ? void 0 : s.menu
+                    menuProps: oe,
+                    menuConfig: e == null ? void 0 : e.menu,
+                    portal: Ie,
+                    portalTarget: Ne
                   }
                 )
               ] }),
-              !$ && /* @__PURE__ */ S("div", { className: "flex flex-col gap-1.5", children: [
+              !Q && /* @__PURE__ */ S("div", { className: "flex flex-col gap-1.5", children: [
                 _ && /* @__PURE__ */ l("span", { className: "text-xs font-medium text-foreground/70", children: _ }),
-                /* @__PURE__ */ l("div", { className: "flex flex-wrap gap-1.5 p-2 min-h-12 bg-secondary/20 border border-dashed border-border rounded-lg items-center", children: i.length === 0 ? /* @__PURE__ */ l("span", { className: "text-xs text-foreground/70 px-2 py-1", children: "No selections made" }) : i.map((e) => /* @__PURE__ */ S(
-                  Xe,
+                /* @__PURE__ */ l("div", { className: "flex flex-wrap gap-1.5 p-2 min-h-12 bg-secondary/20 border border-dashed border-border rounded-lg items-center", children: i.length === 0 ? /* @__PURE__ */ l("span", { className: "text-xs text-foreground/70 px-2 py-1", children: "No selections made" }) : i.map((r) => /* @__PURE__ */ S(
+                  We,
                   {
                     variant: "bordered",
-                    color: we,
-                    size: Ie,
-                    isDisabled: c,
-                    className: w(
+                    color: xe,
+                    size: ye,
+                    isDisabled: u,
+                    className: T(
                       "inline-flex items-center gap-1.5 font-medium shadow-xs",
-                      Te
+                      Ae
                     ),
                     children: [
-                      /* @__PURE__ */ l("span", { children: e.label }),
+                      /* @__PURE__ */ l("span", { children: r.label }),
                       /* @__PURE__ */ l(
                         "button",
                         {
                           type: "button",
-                          tabIndex: c ? -1 : 0,
-                          onClick: (r) => {
-                            r.stopPropagation(), c || k(e.value);
+                          tabIndex: u ? -1 : 0,
+                          onClick: (t) => {
+                            t.stopPropagation(), u || k(r.value);
                           },
-                          onKeyDown: (r) => {
-                            (r.key === "Enter" || r.key === " ") && !c && (r.stopPropagation(), k(e.value));
+                          onKeyDown: (t) => {
+                            (t.key === "Enter" || t.key === " ") && !u && (t.stopPropagation(), k(r.value));
                           },
-                          "aria-label": `Remove ${e.label}`,
+                          "aria-label": `Remove ${r.label}`,
                           className: "inline-flex items-center justify-center h-3.5 w-3.5 rounded-full hover:bg-black/20 dark:hover:bg-white/20 transition-colors cursor-pointer shrink-0",
-                          children: /* @__PURE__ */ l(qe, { className: "w-3 h-3" })
+                          children: /* @__PURE__ */ l($e, { className: "w-3 h-3" })
                         }
                       )
                     ]
                   },
-                  String(e.value)
+                  String(r.value)
                 )) })
               ] })
             ]
@@ -274,7 +276,7 @@ const ls = $e(
     );
   }
 );
-ls.displayName = "MultiSelect";
+tr.displayName = "MultiSelect";
 export {
-  ls as MultiSelect
+  tr as MultiSelect
 };

package/dist/components/multi-select/multi-select-config.d.ts

@@ -35,6 +35,22 @@ export interface MultiSelectConfig extends FieldConfig {
          */
         size?: Size;
     };
+    /**
+     * Whether to render the dropdown menu in a React portal.
+     * When true, the menu is rendered at the document body level,
+     * escaping any parent DOM hierarchy. This prevents CSS containment
+     * and stacking context issues. Defaults to true because dropdowns
+     * should always appear above other content.
+     *
+     * @default true
+     */
+    portal?: boolean;
+    /**
+     * Custom portal target element for the dropdown menu.
+     * When portal is enabled, the menu is rendered into this element.
+     * Defaults to document.body.
+     */
+    portalTarget?: HTMLElement | null;
 }
 /**
  * Default config values registered for the MultiSelect component.
@@ -53,6 +69,8 @@ export declare const FALLBACK_MULTI_SELECT_CONFIG: {
         readonly radius: "sm";
         readonly variant: "solid";
     };
+    readonly portal: true;
+    readonly portalTarget: null;
     readonly size: import('../field').FieldSizeKey;
     readonly radius: Radius;
     readonly variant: Variant;

package/dist/components/multi-select/multi-select-config.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"multi-select-config.d.ts","sourceRoot":"","sources":["../../../src/components/multi-select/multi-select-config.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAGH,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACjE,OAAO,EAGL,KAAK,WAAW,EACjB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAEvD;;;;;GAKG;AACH,MAAM,WAAW,iBAAkB,SAAQ,WAAW;IACpD;;;OAGG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IAExB;;;OAGG;IACH,IAAI,CAAC,EAAE;QACL;;WAEG;QACH,OAAO,CAAC,EAAE,OAAO,CAAC;QAElB;;WAEG;QACH,KAAK,CAAC,EAAE,KAAK,CAAC;QAEd;;WAEG;QACH,MAAM,CAAC,EAAE,MAAM,CAAC;QAEhB;;WAEG;QACH,IAAI,CAAC,EAAE,IAAI,CAAC;KACb,CAAC;CACH;AAED;;;GAGG;AACH,eAAO,MAAM,wBAAwB,EAAE,iBAKtC,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,4BAA4B;;;;;;;;;;;;;;CAQ/B,CAAC;AAEX,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,2BAA2B;QACnC,WAAW,EAAE,iBAAiB,CAAC;KAChC;CACF"}
+{"version":3,"file":"multi-select-config.d.ts","sourceRoot":"","sources":["../../../src/components/multi-select/multi-select-config.ts"],"names":[],"mappings":"AAAA;;;;;;GAMG;AAGH,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,IAAI,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACjE,OAAO,EAGL,KAAK,WAAW,EACjB,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,gBAAgB,CAAC;AAEvD;;;;;GAKG;AACH,MAAM,WAAW,iBAAkB,SAAQ,WAAW;IACpD;;;OAGG;IACH,IAAI,CAAC,EAAE,gBAAgB,CAAC;IAExB;;;OAGG;IACH,IAAI,CAAC,EAAE;QACL;;WAEG;QACH,OAAO,CAAC,EAAE,OAAO,CAAC;QAElB;;WAEG;QACH,KAAK,CAAC,EAAE,KAAK,CAAC;QAEd;;WAEG;QACH,MAAM,CAAC,EAAE,MAAM,CAAC;QAEhB;;WAEG;QACH,IAAI,CAAC,EAAE,IAAI,CAAC;KACb,CAAC;IAEF;;;;;;;;OAQG;IACH,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB;;;;OAIG;IACH,YAAY,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;CACnC;AAED;;;GAGG;AACH,eAAO,MAAM,wBAAwB,EAAE,iBAOtC,CAAC;AAEF;;;;GAIG;AACH,eAAO,MAAM,4BAA4B;;;;;;;;;;;;;;;;CAU/B,CAAC;AAEX,OAAO,QAAQ,qBAAqB,CAAC;IACnC,UAAU,2BAA2B;QACnC,WAAW,EAAE,iBAAiB,CAAC;KAChC;CACF"}

package/dist/components/multi-select/multi-select-config.js

@@ -1,22 +1,26 @@
 "use client";
-import { registerComponentDefaults as i } from "../../libs/registry.js";
-import { FALLBACK_FIELD_CONFIG as e, defaultFieldConfig as t } from "../field/field-config.js";
-const o = {
-  ...t,
+import { registerComponentDefaults as t } from "../../libs/registry.js";
+import { FALLBACK_FIELD_CONFIG as e, defaultFieldConfig as r } from "../field/field-config.js";
+const l = {
+  ...r,
   chip: {
     size: "sm"
-  }
-}, l = {
+  },
+  portal: !0,
+  portalTarget: null
+}, a = {
   ...e,
   chip: {
     size: "sm",
     color: "primary",
     radius: "sm",
     variant: "solid"
-  }
+  },
+  portal: !0,
+  portalTarget: null
 };
-i("multiSelect", o);
+t("multiSelect", l);
 export {
-  l as FALLBACK_MULTI_SELECT_CONFIG,
-  o as defaultMultiSelectConfig
+  a as FALLBACK_MULTI_SELECT_CONFIG,
+  l as defaultMultiSelectConfig
 };

package/dist/components/resizable-screen/ResizableScreen.d.ts

@@ -29,6 +29,18 @@ export interface ResizableScreenProps extends BaseResizableScreenProps {
      * Additional custom styling for the resize handle bar container.
      */
     handleClassName?: string;
+    /**
+     * Minimum height of the resizable container in pixels.
+     * Used when the container has no explicit height from its parent.
+     * @default 200
+     */
+    minContainerHeight?: number;
+    /**
+     * Minimum width of the resizable container in pixels.
+     * Used when the container has no explicit width from its parent.
+     * @default 200
+     */
+    minContainerWidth?: number;
 }
 /**
  * A split panel layout with a draggable handle for resizing the primary panel.
@@ -55,6 +67,8 @@ export interface ResizableScreenProps extends BaseResizableScreenProps {
  * @param props.orientation - Layout orientation. Defaults to "horizontal".
  * @param props.hideHandle - Whether to hide the resize handle. Defaults to false.
  * @param props.handleClassName - Extra classes for the handle bar.
+ * @param props.minContainerHeight - Minimum container height in pixels. Defaults to 200.
+ * @param props.minContainerWidth - Minimum container width in pixels. Defaults to 200.
  * @param props.className - Extra classes for the container.
  *
  * @example
@@ -63,17 +77,15 @@ export interface ResizableScreenProps extends BaseResizableScreenProps {
  *
  * export function Example() {
  *   return (
- *     <div className="h-96">
- *       <ResizableScreen
- *         defaultSize={60}
- *         minSize={30}
- *         maxSize={70}
- *         orientation="horizontal"
- *       >
- *         <div className="bg-blue-100 p-4">Left Panel</div>
- *         <div className="bg-green-100 p-4">Right Panel</div>
- *       </ResizableScreen>
- *     </div>
+ *     <ResizableScreen
+ *       defaultSize={60}
+ *       minSize={30}
+ *       maxSize={70}
+ *       orientation="horizontal"
+ *     >
+ *       <div className="bg-blue-100 p-4">Left Panel</div>
+ *       <div className="bg-green-100 p-4">Right Panel</div>
+ *     </ResizableScreen>
  *   );
  * }
  * ```

package/dist/components/resizable-screen/ResizableScreen.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ResizableScreen.d.ts","sourceRoot":"","sources":["../../../src/components/resizable-screen/ResizableScreen.tsx"],"names":[],"mappings":"AAUA,OAAO,EAEL,KAAK,cAAc,EAEnB,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AAIf,OAAO,EAGL,KAAK,qBAAqB,EAC3B,MAAM,2BAA2B,CAAC;AAEnC,KAAK,wBAAwB,GAAG,qBAAqB,GACnD,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,CAAC;AAEnD;;GAEG;AACH,MAAM,WAAW,oBAAqB,SAAQ,wBAAwB;IACpE;;;OAGG;IACH,QAAQ,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;IAEjC;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAEtC;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;CAC1B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmEG;AACH,eAAO,MAAM,eAAe,iHAoP3B,CAAC"}
+{"version":3,"file":"ResizableScreen.d.ts","sourceRoot":"","sources":["../../../src/components/resizable-screen/ResizableScreen.tsx"],"names":[],"mappings":"AAUA,OAAO,EAEL,KAAK,cAAc,EAEnB,KAAK,SAAS,EAKf,MAAM,OAAO,CAAC;AAIf,OAAO,EAGL,KAAK,qBAAqB,EAC3B,MAAM,2BAA2B,CAAC;AAEnC,KAAK,wBAAwB,GAAG,qBAAqB,GACnD,IAAI,CAAC,cAAc,CAAC,cAAc,CAAC,EAAE,UAAU,CAAC,CAAC;AAEnD;;GAEG;AACH,MAAM,WAAW,oBAAqB,SAAQ,wBAAwB;IACpE;;;OAGG;IACH,QAAQ,EAAE,CAAC,SAAS,EAAE,SAAS,CAAC,CAAC;IAEjC;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IAEd;;;OAGG;IACH,YAAY,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAEtC;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;;;OAIG;IACH,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAE5B;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;CAC5B;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAmEG;AACH,eAAO,MAAM,eAAe,iHAiQ3B,CAAC"}