@lazar-ui/kit 0.5.2 → 0.6.0

package/dist/Title.css

@@ -0,0 +1 @@
+._root_1ae0y_1{color:var(--dialog-title-color);font-family:var(--dialog-title-font-family);font-size:var(--dialog-title-font-size);font-style:normal;font-weight:var(--dialog-title-weight);line-height:var(--dialog-title-line-height);max-height:100%}

package/dist/Toolbar-BJQy4qFI.mjs

@@ -0,0 +1,11 @@
+import { jsx as s } from "react/jsx-runtime";
+import './Toolbar.css';const r = "Table.Toolbar", a = "_root_d4szt_6", c = {
+  root: a
+}, e = (o) => {
+  const { children: t } = o;
+  return /* @__PURE__ */ s("div", { className: c.root, children: t });
+};
+e.displayName = r;
+export {
+  e as T
+};

package/dist/Toolbar.css

@@ -0,0 +1 @@
+:root{--toolbar-gap: var(--lui-space-3);--toolbar-padding: var(--lui-space-3) 0}._root_d4szt_6{align-items:center;display:flex;gap:var(--toolbar-gap);padding:var(--toolbar-padding)}

package/dist/Trigger-C_4De6l1.mjs

@@ -0,0 +1,11 @@
+import { jsx as p } from "react/jsx-runtime";
+import { usePopoverContext as a } from "./popover.js";
+import { E as n } from "./enums-DUZMBQDd.mjs";
+const s = (e) => {
+  const { children: o } = e, { triggerRef: t, state: r } = a();
+  return /* @__PURE__ */ p("span", { "aria-expanded": r.isOpen, "aria-haspopup": "true", onClick: () => r.toggle(), ref: t, children: o });
+};
+s.displayName = n.TRIGGER;
+export {
+  s as T
+};

package/dist/accordion.js

@@ -1,6 +1,6 @@
 import { jsx as a, jsxs as h } from "react/jsx-runtime";
 import O, { createContext as T, useContext as E, useState as g, useCallback as v } from "react";
-import { i as y } from "./isValidReactNode-CmYwTWCE.mjs";
+import { i as y } from "./isValidReactNode-D1buElhX.mjs";
 import M from "clsx";
 import { I as P } from "./Icon-DUCBChX2.mjs";
 import './accordion.css';const f = T(null), S = () => E(f), N = "Accordion";

package/dist/actions.d.ts

@@ -0,0 +1,13 @@
+import { default as default_2 } from 'react';
+
+/**
+ * Wrapper for action buttons inside EmptyState.
+ * Accepts only `<Button>` components as children.
+ * Auto-assigns variant based on position:
+ * - first child → `primary`
+ * - subsequent children → `secondary`
+ * unless the Button already has an explicit `variant` prop.
+ */
+export declare const Actions: default_2.FC<default_2.PropsWithChildren>;
+
+export { }

package/dist/actions.js

@@ -0,0 +1,4 @@
+import { A as s } from "./Actions-CEIXfLKN.mjs";
+export {
+  s as Actions
+};

package/dist/active-filters.d.ts

@@ -0,0 +1,35 @@
+import { default as default_2 } from 'react';
+
+/**
+ * Table.ActiveFilters — displays active filter chips with individual remove buttons
+ * and an optional "Clear all" button.
+ *
+ * Returns `null` when there are no active filters.
+ *
+ * @example
+ * ```tsx
+ * <Table.ActiveFilters
+ *   filters={[
+ *     { key: 'status', label: 'Status', value: 'Active' },
+ *     { key: 'role', label: 'Role', value: 'Admin' },
+ *   ]}
+ *   onRemove={(key) => console.log('remove', key)}
+ *   onClearAll={() => console.log('clear all')}
+ * />
+ * ```
+ */
+export declare const ActiveFilters: default_2.FC<IActiveFiltersProps>;
+
+export declare interface IActiveFiltersProps {
+    filters: IFilterItem[];
+    onRemove: (key: string) => void;
+    onClearAll?: () => void;
+}
+
+export declare interface IFilterItem {
+    key: string;
+    label: string;
+    value: string;
+}
+
+export { }

package/dist/active-filters.js

@@ -0,0 +1,4 @@
+import { A as t } from "./ActiveFilters-BJojmc-d.mjs";
+export {
+  t as ActiveFilters
+};

package/dist/breadcrumbs.js

@@ -1,7 +1,7 @@
 import { jsx as r, jsxs as h } from "react/jsx-runtime";
 import b from "clsx";
 import E from "react";
-import { i as k } from "./isValidReactNode-CmYwTWCE.mjs";
+import { i as k } from "./isValidReactNode-D1buElhX.mjs";
 import "lodash/camelCase";
 import './breadcrumbs.css';const _ = "Breadcrumbs", I = "/";
 var N = ((l) => (l.ITEM = `${_}.Item`, l))(N || {});

package/dist/button.js

@@ -1,4 +1,4 @@
-import { B as r } from "./Button-jq8mFP6t.mjs";
+import { B as r } from "./Button-BN85EtaZ.mjs";
 export {
   r as Button
 };

package/dist/cell.d.ts

@@ -0,0 +1,20 @@
+import { default as default_2 } from 'react';
+
+/**
+ * Table cell. Must be used as a child of `<Table.Row>`.
+ * Supports text alignment and header styling via `as="th"`.
+ */
+export declare const Cell: default_2.FC<IProps>;
+
+declare interface IProps extends default_2.PropsWithChildren {
+    /** Text alignment. */
+    align?: 'left' | 'center' | 'right';
+    /** HTML tag: `'td'` (default) or `'th'`. */
+    as?: 'td' | 'th';
+    /** Tooltip text (native `title` attribute). */
+    title?: string;
+    /** Cell width. */
+    width?: string;
+}
+
+export { }

package/dist/cell.js

@@ -0,0 +1,4 @@
+import { C as o } from "./Cell-BPBvEyeL.mjs";
+export {
+  o as Cell
+};

package/dist/checkbox.d.ts

@@ -1,41 +1,16 @@
 import { default as default_2 } from 'react';
 
-/**
- * Checkbox component. Renders a native checkbox with a custom visual indicator, label, and support for indeterminate state.
- *
- * @example
- * ```tsx
- * <Checkbox>Accept terms</Checkbox>
- * ```
- *
- * @example
- * ```tsx
- * <Checkbox indeterminate checked={false}>
- *   Select all
- * </Checkbox>
- * ```
- */
-export declare const Checkbox: default_2.FC<default_2.PropsWithChildren<IProps>>;
+export declare const Checkbox: default_2.FC<IProps>;
 
-declare enum ECheckboxSize {
-    SM = "sm",
-    MD = "md",
-    LG = "lg"
+export declare interface IProps {
+    /** Children (item label). */
+    children: default_2.ReactNode;
+    /** Whether the item is checked. */
+    checked: boolean;
+    /** Callback when checked state changes. */
+    onCheckedChange?: (checked: boolean) => void;
+    /** Whether the item is disabled. */
+    disabled?: boolean;
 }
 
-export declare interface IProps extends Omit<default_2.InputHTMLAttributes<HTMLInputElement>, 'size' | 'type' | 'onChange'> {
-    /** Ref to the native input element. */
-    ref?: default_2.Ref<HTMLInputElement>;
-    /** When true, the checkbox shows a dash instead of a checkmark. Useful for "select all" states. */
-    indeterminate?: boolean;
-    /** When true, the checkbox border turns red to indicate a validation error. */
-    invalid?: boolean;
-    /** Checkbox size: sm, md, lg. */
-    size?: TCheckboxSize;
-    /** Change handler, receives the new checked state. */
-    onChange?: (checked: boolean) => void;
-}
-
-declare type TCheckboxSize = `${ECheckboxSize.SM | ECheckboxSize.MD | ECheckboxSize.LG}`;
-
 export { }

package/dist/checkbox.js

@@ -1,42 +1,4 @@
-import { jsxs as u, jsx as a } from "react/jsx-runtime";
-import { useRef as p, useCallback as h, useEffect as j } from "react";
-import x from "clsx";
-import { g as z } from "./getVariantClassName-DoCNtwBw.mjs";
-import './checkbox.css';const w = "Checkbox", g = "_root_tw8jr_16", k = "_disabled_tw8jr_24", C = "_checkbox_tw8jr_27", N = "_input_tw8jr_31", v = "_indeterminate_tw8jr_31", y = "_invalid_tw8jr_34", L = "_sizeSm_tw8jr_37", M = "_label_tw8jr_49", S = "_sizeMd_tw8jr_54", R = "_sizeLg_tw8jr_71", e = {
-  root: g,
-  disabled: k,
-  checkbox: C,
-  input: N,
-  indeterminate: v,
-  invalid: y,
-  sizeSm: L,
-  label: M,
-  sizeMd: S,
-  sizeLg: R
-}, A = (o) => {
-  const { ref: t, children: r, indeterminate: n, invalid: l = !1, size: _ = "md", onChange: d, ...c } = o, i = p(null), m = h(
-    (s) => {
-      i.current = s, typeof t == "function" ? t(s) : t && (t.current = s);
-    },
-    [t]
-  );
-  j(() => {
-    i.current && (i.current.indeterminate = !!n);
-  }, [n]);
-  const b = x(e.root, z("size", _, e), {
-    [e.disabled]: c.disabled === !0,
-    [e.indeterminate]: n,
-    [e.invalid]: l
-  }), f = (s) => {
-    d?.(s.target.checked);
-  };
-  return /* @__PURE__ */ u("label", { className: b, children: [
-    /* @__PURE__ */ a("input", { ref: m, className: e.input, onChange: f, type: "checkbox", ...c }),
-    /* @__PURE__ */ a("span", { className: e.checkbox }),
-    r && /* @__PURE__ */ a("span", { className: e.label, children: r })
-  ] });
-};
-A.displayName = w;
+import { C as r } from "./Checkbox-Chfzm1Z9.mjs";
 export {
-  A as Checkbox
+  r as Checkbox
 };

package/dist/content.d.ts

@@ -0,0 +1,8 @@
+import { default as default_2 } from 'react';
+
+export declare const Content: default_2.FC<IProps>;
+
+export declare interface IProps extends default_2.PropsWithChildren {
+}
+
+export { }

package/dist/content.js

@@ -0,0 +1,4 @@
+import { C as e } from "./Content-ru2X8iBx.mjs";
+export {
+  e as Content
+};

package/dist/context.d.ts

@@ -0,0 +1,44 @@
+import { Context as Context_2 } from 'react';
+import { default as default_2 } from 'react';
+
+export declare const Context: Context_2<IContext | null>;
+
+/**
+ * Enumerates the variants of a Tabs component.
+ */
+declare enum ETabsVariant {
+    /** Tabs are displayed as toggle buttons. */
+    BUTTONS = "buttons",
+    /** Default display of Tabs. */
+    DEFAULT = "default"
+}
+
+/**
+ * Tabs Context.
+ */
+declare interface IContext {
+    /** Index of current active tab. */
+    activeIndex: number;
+    /** Base ID for generating IDs for ARIA. */
+    baseId: string;
+    /** Active tab change handler. */
+    setActiveTab: (index: number) => void;
+    /** Get panel ID. */
+    getPanelId: (index: number) => string;
+    /** Get tab ID. */
+    getTabId: (index: number) => string;
+    /** Variant. */
+    variant: ETabsVariant;
+}
+
+declare interface IProps extends default_2.PropsWithChildren {
+    defaultActiveIndex?: number;
+    onTabChange?: (index: number) => void;
+    variant: ETabsVariant;
+}
+
+export declare const Provider: default_2.FC<IProps>;
+
+export declare const useTabsContext: () => IContext;
+
+export { }

package/dist/context.js

@@ -0,0 +1,7 @@
+import { C as r, u as t } from "./useTabsContext-DdF09jQq.mjs";
+import { P as a } from "./Provider-CBfZpO45.mjs";
+export {
+  r as Context,
+  a as Provider,
+  t as useTabsContext
+};

package/dist/dialog.css

@@ -1 +1 @@
-._root_1fxwu_1{display:flex;gap:var(--dialog-actions-gap)}._root_jagsa_1{max-height:100%;overflow-y:auto}:root{--dialog-underlay: var(--lui-color-background-overlay);--dialog-bg: var(--lui-color-background-primary);--dialog-radius: var(--lui-radius-3);--dialog-shadow: 0 20px 24px -4px rgb(16 24 40 / .08), 0 8px 8px -4px rgb(16 24 40 / .03);--dialog-padding: var(--lui-space-8);--dialog-gap: var(--lui-space-6);--dialog-header-gap: var(--lui-space-6);--dialog-header-min-height: calc(24px + var(--lui-space-6));--dialog-close-color: var(--lui-palette-gray-400);--dialog-close-padding: var(--lui-space-3);--dialog-actions-padding-top: var(--lui-space-10);--dialog-width-xs: 384px;--dialog-width-sm: 480px;--dialog-width-md: 560px;--dialog-width-lg: 640px;--dialog-title-font-size: var(--lui-font-size-md);--dialog-title-weight: var(--lui-font-weight-semibold);--dialog-title-color: var(--lui-color-text-primary);--dialog-title-font-family: var(--lui-font-family-body);--dialog-title-line-height: var(--line-height-md);--dialog-actions-gap: var(--lui-space-4)}._underlay_100vj_25{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:var(--dialog-underlay);inset:0;padding:var(--lui-space-4);position:fixed;z-index:1000}._modal_100vj_34{align-items:center;display:flex;height:100%;justify-content:center}._dialog_100vj_41{background:var(--dialog-bg);border-radius:var(--dialog-radius);box-shadow:var(--dialog-shadow);display:flex;flex-direction:column;gap:var(--dialog-gap);padding:var(--dialog-padding);position:relative}._dialog_100vj_41._sizeXs_100vj_51{width:var(--dialog-width-xs)}._dialog_100vj_41._sizeSm_100vj_54{width:var(--dialog-width-sm)}._dialog_100vj_41._sizeMd_100vj_57{width:var(--dialog-width-md)}._dialog_100vj_41._sizeLg_100vj_60{width:var(--dialog-width-lg)}._header_100vj_64{align-items:center;display:flex;gap:var(--dialog-header-gap);min-height:var(--dialog-header-min-height)}._close_100vj_71{color:var(--dialog-close-color);padding:var(--dialog-close-padding);position:absolute;right:var(--lui-space-4);top:var(--lui-space-4)}._actions_100vj_79{padding-top:var(--dialog-actions-padding-top)}._root_1ae0y_1{color:var(--dialog-title-color);font-family:var(--dialog-title-font-family);font-size:var(--dialog-title-font-size);font-style:normal;font-weight:var(--dialog-title-weight);line-height:var(--dialog-title-line-height);max-height:100%}
+._root_1fxwu_1{display:flex;gap:var(--dialog-actions-gap)}._root_jagsa_1{max-height:100%;overflow-y:auto}:root{--dialog-underlay: var(--lui-color-background-overlay);--dialog-bg: var(--lui-color-background-primary);--dialog-radius: var(--lui-radius-3);--dialog-shadow: 0 20px 24px -4px rgb(16 24 40 / .08), 0 8px 8px -4px rgb(16 24 40 / .03);--dialog-padding: var(--lui-space-8);--dialog-gap: var(--lui-space-6);--dialog-header-gap: var(--lui-space-6);--dialog-header-min-height: calc(24px + var(--lui-space-6));--dialog-close-color: var(--lui-palette-gray-400);--dialog-close-padding: var(--lui-space-3);--dialog-actions-padding-top: var(--lui-space-10);--dialog-width-xs: 384px;--dialog-width-sm: 480px;--dialog-width-md: 560px;--dialog-width-lg: 640px;--dialog-title-font-size: var(--lui-font-size-md);--dialog-title-weight: var(--lui-font-weight-semibold);--dialog-title-color: var(--lui-color-text-primary);--dialog-title-font-family: var(--lui-font-family-body);--dialog-title-line-height: var(--line-height-md);--dialog-actions-gap: var(--lui-space-4)}._underlay_100vj_25{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:var(--dialog-underlay);inset:0;padding:var(--lui-space-4);position:fixed;z-index:1000}._modal_100vj_34{align-items:center;display:flex;height:100%;justify-content:center}._dialog_100vj_41{background:var(--dialog-bg);border-radius:var(--dialog-radius);box-shadow:var(--dialog-shadow);display:flex;flex-direction:column;gap:var(--dialog-gap);padding:var(--dialog-padding);position:relative}._dialog_100vj_41._sizeXs_100vj_51{width:var(--dialog-width-xs)}._dialog_100vj_41._sizeSm_100vj_54{width:var(--dialog-width-sm)}._dialog_100vj_41._sizeMd_100vj_57{width:var(--dialog-width-md)}._dialog_100vj_41._sizeLg_100vj_60{width:var(--dialog-width-lg)}._header_100vj_64{align-items:center;display:flex;gap:var(--dialog-header-gap);min-height:var(--dialog-header-min-height)}._close_100vj_71{color:var(--dialog-close-color);padding:var(--dialog-close-padding);position:absolute;right:var(--lui-space-4);top:var(--lui-space-4)}._actions_100vj_79{padding-top:var(--dialog-actions-padding-top)}

package/dist/dialog.js

@@ -1,28 +1,28 @@
-import { jsx as s, jsxs as _ } from "react/jsx-runtime";
-import { useRef as N, useMemo as A } from "react";
-import E from "clsx";
-import { useDialog as x, useModalOverlay as M, Overlay as P, UNSAFE_PortalProvider as $ } from "react-aria";
-import { useOverlayTriggerState as b } from "react-stately";
-import { I as R } from "./Icon-DUCBChX2.mjs";
-import { u as X } from "./useLocale-CJh-krrY.mjs";
-import { g as k } from "./getComponentSlots-DwAYUFNk.mjs";
+import { jsx as o, jsxs as _ } from "react/jsx-runtime";
+import { E as s, T as I } from "./Title-aOeFD24v.mjs";
+import { useRef as u, useMemo as L } from "react";
+import A from "clsx";
+import { useDialog as b, useModalOverlay as x, Overlay as M, UNSAFE_PortalProvider as P } from "react-aria";
+import { useOverlayTriggerState as R } from "react-stately";
+import { I as X } from "./Icon-DUCBChX2.mjs";
+import { u as $ } from "./useLocale-CJh-krrY.mjs";
+import { g as k } from "./getComponentSlots-DD4iju8N.mjs";
 import { g as w } from "./getVariantClassName-DoCNtwBw.mjs";
-import './dialog.css';var e = /* @__PURE__ */ ((o) => (o.ACTIONS = "Dialog.Actions", o.CONTENT = "Dialog.Content", o.TITLE = "Dialog.Title", o))(e || {});
-const F = "_root_1fxwu_1", K = {
+import './dialog.css';const F = "_root_1fxwu_1", K = {
   root: F
-}, g = (o) => {
-  const { children: t } = o;
-  return /* @__PURE__ */ s("div", { className: K.root, children: t });
+}, g = (t) => {
+  const { children: a } = t;
+  return /* @__PURE__ */ o("div", { className: K.root, children: a });
 };
-g.displayName = e.ACTIONS;
+g.displayName = s.ACTIONS;
 const U = "_root_jagsa_1", V = {
   root: U
-}, u = (o) => {
-  const { children: t } = o;
-  return /* @__PURE__ */ s("div", { className: V.root, children: t });
+}, p = (t) => {
+  const { children: a } = t;
+  return /* @__PURE__ */ o("div", { className: V.root, children: a });
 };
-u.displayName = e.CONTENT;
-const Y = "Dialog", q = [e.ACTIONS, e.CONTENT, e.TITLE], B = "_underlay_100vj_25", G = "_modal_100vj_34", H = "_dialog_100vj_41", J = "_sizeXs_100vj_51", Q = "_sizeSm_100vj_54", W = "_sizeMd_100vj_57", Z = "_sizeLg_100vj_60", oo = "_header_100vj_64", so = "_close_100vj_71", eo = "_actions_100vj_79", a = {
+p.displayName = s.CONTENT;
+const Y = "Dialog", q = [s.ACTIONS, s.CONTENT, s.TITLE], B = "_underlay_100vj_25", G = "_modal_100vj_34", H = "_dialog_100vj_41", J = "_sizeXs_100vj_51", Q = "_sizeSm_100vj_54", W = "_sizeMd_100vj_57", Z = "_sizeLg_100vj_60", oo = "_header_100vj_64", so = "_close_100vj_71", eo = "_actions_100vj_79", e = {
   underlay: B,
   modal: G,
   dialog: H,
@@ -33,42 +33,35 @@ const Y = "Dialog", q = [e.ACTIONS, e.CONTENT, e.TITLE], B = "_underlay_100vj_25
   header: oo,
   close: so,
   actions: eo
-}, T = (o) => {
-  const { children: t, container: p, open: i, modal: C = !0, onOpenChange: f, size: h = "md" } = o, y = X(), r = N(null), n = N(null), { dialogProps: z } = x(o, r), c = b({ isOpen: i, onOpenChange: f }), { modalProps: D, underlayProps: O } = M(
-    { isDismissable: !C, isKeyboardDismissDisabled: !1 },
+}, N = (t) => {
+  const { children: a, container: v, open: i, modal: f = !0, onOpenChange: C, size: T = "md" } = t, h = $(), r = u(null), n = u(null), { dialogProps: y } = b(t, r), c = R({ isOpen: i, onOpenChange: C }), { modalProps: z, underlayProps: S } = x(
+    { isDismissable: !f, isKeyboardDismissDisabled: !1 },
     c,
     n
   ), {
-    [e.ACTIONS]: d,
-    [e.CONTENT]: m,
-    [e.TITLE]: j
-  } = A(() => k(t, q), [t]), I = (L) => {
-    L.preventDefault(), c.close();
+    [s.ACTIONS]: d,
+    [s.CONTENT]: m,
+    [s.TITLE]: j
+  } = L(() => k(a, q), [a]), O = (E) => {
+    E.preventDefault(), c.close();
   };
   if (!i)
     return null;
-  const S = E(a.dialog, w("size", h, a));
-  return /* @__PURE__ */ s(P, { portalContainer: p, children: /* @__PURE__ */ s("div", { className: a.underlay, ...O, children: /* @__PURE__ */ s("div", { className: a.modal, ...D, ref: n, children: /* @__PURE__ */ s($, { getContainer: () => n.current, children: /* @__PURE__ */ _("div", { className: S, ...z, ref: r, children: [
-    /* @__PURE__ */ _("div", { className: a.header, children: [
+  const D = A(e.dialog, w("size", T, e));
+  return /* @__PURE__ */ o(M, { portalContainer: v, children: /* @__PURE__ */ o("div", { className: e.underlay, ...S, children: /* @__PURE__ */ o("div", { className: e.modal, ...z, ref: n, children: /* @__PURE__ */ o(P, { getContainer: () => n.current, children: /* @__PURE__ */ _("div", { className: D, ...y, ref: r, children: [
+    /* @__PURE__ */ _("div", { className: e.header, children: [
       j,
-      /* @__PURE__ */ s("button", { "aria-label": y.Dialog.close, className: a.close, onClick: I, children: /* @__PURE__ */ s(R, { name: "x", size: 16 }) })
+      /* @__PURE__ */ o("button", { "aria-label": h.Dialog.close, className: e.close, onClick: O, children: /* @__PURE__ */ o(X, { name: "x", size: 16 }) })
     ] }),
-    m && /* @__PURE__ */ s("div", { children: m }),
-    d && /* @__PURE__ */ s("div", { className: a.actions, children: d })
+    m && /* @__PURE__ */ o("div", { children: m }),
+    d && /* @__PURE__ */ o("div", { className: e.actions, children: d })
   ] }) }) }) }) });
 };
-T.displayName = Y;
-const to = "_root_1ae0y_1", ao = {
-  root: to
-}, v = (o) => {
-  const { children: t } = o;
-  return /* @__PURE__ */ s("div", { className: ao.root, children: t });
-};
-v.displayName = e.TITLE;
-const l = T;
+N.displayName = Y;
+const l = N;
 l.Actions = g;
-l.Content = u;
-l.Title = v;
+l.Content = p;
+l.Title = I;
 export {
   l as Dialog,
   l as default

package/dist/drawer.css

@@ -1 +1 @@
-._root_1m4yu_1{display:flex;gap:var(--lui-space-2)}._root_jagsa_1{max-height:100%;overflow-y:auto}:root{--drawer-underlay: var(--lui-color-background-overlay);--drawer-bg: var(--lui-color-background-primary);--drawer-shadow: 0 20px 24px -4px rgb(16 24 40 / .08), 0 8px 8px -4px rgb(16 24 40 / .03);--drawer-padding: var(--lui-space-8);--drawer-gap: var(--lui-space-6);--drawer-header-gap: var(--lui-space-6);--drawer-header-min-height: calc(24px + var(--lui-space-6));--drawer-close-color: var(--lui-palette-gray-400);--drawer-close-padding: var(--lui-space-3);--drawer-width-sm: 384px;--drawer-width-md: 480px;--drawer-width-lg: 640px;--drawer-height-sm: 320px;--drawer-height-md: 480px;--drawer-height-lg: 640px;--drawer-title-font-size: var(--lui-font-size-md);--drawer-title-weight: var(--lui-font-weight-semibold);--drawer-title-color: var(--lui-color-text-primary);--drawer-title-font-family: var(--lui-font-family-body);--drawer-title-line-height: var(--line-height-md)}._underlay_qcy0k_24{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:var(--drawer-underlay);inset:0;position:fixed;z-index:1000}._modal_qcy0k_32{display:flex;height:100%}._drawer_qcy0k_37{background:var(--drawer-bg);box-shadow:var(--drawer-shadow);display:flex;flex-direction:column;gap:var(--drawer-gap);padding:var(--drawer-padding);position:fixed;transition:transform .3s ease}._drawer_qcy0k_37._placementLeft_qcy0k_47{bottom:0;left:0;top:0;transform:translate(-100%)}._drawer_qcy0k_37._placementLeft_qcy0k_47._entered_qcy0k_53{transform:translate(0)}._drawer_qcy0k_37._placementRight_qcy0k_56{bottom:0;right:0;top:0;transform:translate(100%)}._drawer_qcy0k_37._placementRight_qcy0k_56._entered_qcy0k_53{transform:translate(0)}._drawer_qcy0k_37._placementTop_qcy0k_65{left:0;right:0;top:0;transform:translateY(-100%)}._drawer_qcy0k_37._placementTop_qcy0k_65._entered_qcy0k_53{transform:translateY(0)}._drawer_qcy0k_37._placementBottom_qcy0k_74{bottom:0;left:0;right:0;transform:translateY(100%)}._drawer_qcy0k_37._placementBottom_qcy0k_74._entered_qcy0k_53{transform:translateY(0)}._drawer_qcy0k_37._sizeSm_qcy0k_83{width:var(--drawer-width-sm)}._drawer_qcy0k_37._sizeSm_qcy0k_83._placementTop_qcy0k_65,._drawer_qcy0k_37._sizeSm_qcy0k_83._placementBottom_qcy0k_74{height:var(--drawer-height-sm);width:100%}._drawer_qcy0k_37._sizeMd_qcy0k_90{width:var(--drawer-width-md)}._drawer_qcy0k_37._sizeMd_qcy0k_90._placementTop_qcy0k_65,._drawer_qcy0k_37._sizeMd_qcy0k_90._placementBottom_qcy0k_74{height:var(--drawer-height-md);width:100%}._drawer_qcy0k_37._sizeLg_qcy0k_97{width:var(--drawer-width-lg)}._drawer_qcy0k_37._sizeLg_qcy0k_97._placementTop_qcy0k_65,._drawer_qcy0k_37._sizeLg_qcy0k_97._placementBottom_qcy0k_74{height:var(--drawer-height-lg);width:100%}._content_qcy0k_105{flex:1;overflow-y:auto}:root{--drawer-header-gap: var(--lui-space-6);--drawer-header-min-height: calc(24px + var(--lui-space-6));--drawer-close-color: var(--lui-palette-gray-400);--drawer-close-padding: var(--lui-space-3);--drawer-title-font-size: var(--lui-font-size-md);--drawer-title-weight: var(--lui-font-weight-semibold);--drawer-title-color: var(--lui-color-text-primary);--drawer-title-font-family: var(--lui-font-family-body);--drawer-title-line-height: var(--line-height-md)}._root_1mypq_13{align-items:center;display:flex;gap:var(--drawer-header-gap);min-height:var(--drawer-header-min-height);position:relative}._title_1mypq_21{color:var(--drawer-title-color);flex:1;font-family:var(--drawer-title-font-family);font-size:var(--drawer-title-font-size);font-style:normal;font-weight:var(--drawer-title-weight);line-height:var(--drawer-title-line-height)}._close_1mypq_31{color:var(--drawer-close-color);padding:var(--drawer-close-padding);position:absolute;right:0;top:50%;transform:translateY(-50%)}
+._root_1m4yu_1{display:flex;gap:var(--lui-space-2)}._root_jagsa_1{max-height:100%;overflow-y:auto}:root{--drawer-underlay: var(--lui-color-background-overlay);--drawer-bg: var(--lui-color-background-primary);--drawer-shadow: 0 20px 24px -4px rgb(16 24 40 / .08), 0 8px 8px -4px rgb(16 24 40 / .03);--drawer-padding: var(--lui-space-8);--drawer-gap: var(--lui-space-6);--drawer-header-gap: var(--lui-space-6);--drawer-header-min-height: calc(24px + var(--lui-space-6));--drawer-close-color: var(--lui-palette-gray-400);--drawer-close-padding: var(--lui-space-3);--drawer-width-sm: 384px;--drawer-width-md: 480px;--drawer-width-lg: 640px;--drawer-height-sm: 320px;--drawer-height-md: 480px;--drawer-height-lg: 640px;--drawer-title-font-size: var(--lui-font-size-md);--drawer-title-weight: var(--lui-font-weight-semibold);--drawer-title-color: var(--lui-color-text-primary);--drawer-title-font-family: var(--lui-font-family-body);--drawer-title-line-height: var(--line-height-md)}._underlay_qcy0k_24{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:var(--drawer-underlay);inset:0;position:fixed;z-index:1000}._modal_qcy0k_32{display:flex;height:100%}._drawer_qcy0k_37{background:var(--drawer-bg);box-shadow:var(--drawer-shadow);display:flex;flex-direction:column;gap:var(--drawer-gap);padding:var(--drawer-padding);position:fixed;transition:transform .3s ease}._drawer_qcy0k_37._placementLeft_qcy0k_47{bottom:0;left:0;top:0;transform:translate(-100%)}._drawer_qcy0k_37._placementLeft_qcy0k_47._entered_qcy0k_53{transform:translate(0)}._drawer_qcy0k_37._placementRight_qcy0k_56{bottom:0;right:0;top:0;transform:translate(100%)}._drawer_qcy0k_37._placementRight_qcy0k_56._entered_qcy0k_53{transform:translate(0)}._drawer_qcy0k_37._placementTop_qcy0k_65{left:0;right:0;top:0;transform:translateY(-100%)}._drawer_qcy0k_37._placementTop_qcy0k_65._entered_qcy0k_53{transform:translateY(0)}._drawer_qcy0k_37._placementBottom_qcy0k_74{bottom:0;left:0;right:0;transform:translateY(100%)}._drawer_qcy0k_37._placementBottom_qcy0k_74._entered_qcy0k_53{transform:translateY(0)}._drawer_qcy0k_37._sizeSm_qcy0k_83{width:var(--drawer-width-sm)}._drawer_qcy0k_37._sizeSm_qcy0k_83._placementTop_qcy0k_65,._drawer_qcy0k_37._sizeSm_qcy0k_83._placementBottom_qcy0k_74{height:var(--drawer-height-sm);width:100%}._drawer_qcy0k_37._sizeMd_qcy0k_90{width:var(--drawer-width-md)}._drawer_qcy0k_37._sizeMd_qcy0k_90._placementTop_qcy0k_65,._drawer_qcy0k_37._sizeMd_qcy0k_90._placementBottom_qcy0k_74{height:var(--drawer-height-md);width:100%}._drawer_qcy0k_37._sizeLg_qcy0k_97{width:var(--drawer-width-lg)}._drawer_qcy0k_37._sizeLg_qcy0k_97._placementTop_qcy0k_65,._drawer_qcy0k_37._sizeLg_qcy0k_97._placementBottom_qcy0k_74{height:var(--drawer-height-lg);width:100%}._content_qcy0k_105{flex:1;overflow-y:auto}