@lazar-ui/kit 0.6.2 → 0.7.0

package/CHANGELOG.md

@@ -1,5 +1,22 @@
 # Changelog
 
+## [0.7.0] - 2026-07-06
+
+### Features
+
+- **Slider**: новый standalone компонент для выбора числового значения из диапазона. Поддерживает controlled/uncontrolled режимы, min/max/step, размеры (sm/md/lg), `showValue` и `disabled`. Использует нативный `<input type="range">` для accessibility.
+- **Select**: добавлен JSX composition mode — теперь можно использовать `<Select.Option>` как дочерние элементы вместо пропа `options`. Поддерживаются те же возможности: value/label, disabled, controlled/uncontrolled.
+- **Table.Row**: добавлен проп `onClick` — обработчик клика по строке таблицы.
+- **Table.Row**: добавлен проп `style` для инлайн-стилей строки.
+
+### Bug Fixes
+
+- **Tabs**: исправлен type error в тесте — использование `ETabsVariant.BUTTONS` вместо строкового литерала.
+
+### Documentation
+
+- **rules**: обновлён `.opencode/rules/ui-kit.md` (секция Build, память, тесты).
+
 ## [0.6.2] - 2026-06-10
 
 ### Bug Fixes

package/dist/select.d.ts

@@ -15,9 +15,23 @@ export declare interface ISelectOption {
     disabled?: boolean;
 }
 
+export declare interface ISelectOptionProps {
+    /** Option value. */
+    value: string;
+    /** Whether the option is disabled. */
+    disabled?: boolean;
+    /** Option label (display text). */
+    children: default_2.ReactNode;
+}
+
 export declare interface ISelectProps {
-    /** Array of options to display in the dropdown. */
-    options: ISelectOption[];
+    /**
+     * Array of options to display in the dropdown.
+     *
+     * Use this for props-driven mode.
+     * For JSX composition mode, pass `<Select.Option>` children instead.
+     */
+    options?: ISelectOption[];
     /** Currently selected value(s). For single select — string, for multiple — string[]. */
     value?: string | string[];
     /** Callback when selection changes. */
@@ -34,8 +48,16 @@ export declare interface ISelectProps {
     clearable?: boolean;
     /** Whether the select is in an invalid state. */
     invalid?: boolean;
+    /**
+     * JSX composition children.
+     * When provided with `<SelectOption>` elements, they are used
+     * as the option data source instead of the `options` prop.
+     */
+    children?: default_2.ReactNode;
 }
 
+export declare const Select: TSelectCompoundComponent;
+
 /**
  * Select component. A dropdown selector built on top of Popover.
  *
@@ -57,7 +79,27 @@ export declare interface ISelectProps {
  * />
  * ```
  */
-export declare const Select: default_2.FC<ISelectProps>;
+declare const Select_2: default_2.FC<ISelectProps>;
+
+/**
+ * Select Option sub-component for JSX composition mode.
+ *
+ * Used as `<Select.Option>` child of `<Select>`.
+ * Acts as a data carrier — does not render any DOM itself.
+ *
+ * @example
+ * ```tsx
+ * <Select value={val} onChange={setVal}>
+ *   <Select.Option value="1">Option 1</Select.Option>
+ *   <Select.Option value="2" disabled>Option 2</Select.Option>
+ * </Select>
+ * ```
+ */
+declare const SelectOption: default_2.FC<ISelectOptionProps>;
+
+declare type TSelectCompoundComponent = typeof Select_2 & {
+    Option: typeof SelectOption;
+};
 
 export declare type TSelectSize = `${ESelectSize.SM | ESelectSize.MD | ESelectSize.LG}`;
 

package/dist/select.js

@@ -1,121 +1,139 @@
-import { jsxs as c, jsx as a } from "react/jsx-runtime";
-import { useState as P, useCallback as h } from "react";
-import p from "clsx";
-import { I as m } from "./Icon-DUCBChX2.mjs";
-import { Popover as b } from "./popover.js";
-import { u as O } from "./useLocale-CJh-krrY.mjs";
-import { g as D } from "./getVariantClassName-DoCNtwBw.mjs";
-import './select.css';const I = "Select", M = "bottom start", A = "_root_t7wta_7", B = "_disabled_t7wta_28", E = "_invalid_t7wta_35", j = "_sizeSm_t7wta_39", F = "_sizeMd_t7wta_45", U = "_sizeLg_t7wta_51", V = "_displayText_t7wta_57", W = "_displayTextPlaceholder_t7wta_64", Y = "_indicators_t7wta_68", q = "_clearButton_t7wta_74", G = "_chevron_t7wta_92", H = "_optionsList_t7wta_103", J = "_noOptions_t7wta_112", K = "_option_t7wta_103", Q = "_optionSelected_t7wta_132", R = "_optionDisabled_t7wta_138", X = "_optionLabel_t7wta_146", Z = "_checkbox_t7wta_153", $ = "_checkboxChecked_t7wta_165", t = {
-  root: A,
-  disabled: B,
-  invalid: E,
-  sizeSm: j,
-  sizeMd: F,
-  sizeLg: U,
-  displayText: V,
-  displayTextPlaceholder: W,
-  indicators: Y,
-  clearButton: q,
-  chevron: G,
-  optionsList: H,
-  noOptions: J,
-  option: K,
-  optionSelected: Q,
-  optionDisabled: R,
-  optionLabel: X,
-  checkbox: Z,
-  checkboxChecked: $
-}, ee = (v) => {
+import { jsxs as p, jsx as o, Fragment as j } from "react/jsx-runtime";
+import F, { useState as R, useMemo as U, useCallback as v } from "react";
+import m from "clsx";
+import { I as S } from "./Icon-DUCBChX2.mjs";
+import { Popover as C } from "./popover.js";
+import { u as V } from "./useLocale-CJh-krrY.mjs";
+import { g as W } from "./getVariantClassName-DoCNtwBw.mjs";
+import { i as Y } from "./isValidReactNode-CmYwTWCE.mjs";
+import './select.css';const O = "Select", $ = "bottom start";
+var k = /* @__PURE__ */ ((c) => (c.OPTION = "Select.Option", c))(k || {});
+const q = "_root_t7wta_7", G = "_disabled_t7wta_28", H = "_invalid_t7wta_35", J = "_sizeSm_t7wta_39", K = "_sizeMd_t7wta_45", Q = "_sizeLg_t7wta_51", X = "_displayText_t7wta_57", Z = "_displayTextPlaceholder_t7wta_64", ee = "_indicators_t7wta_68", te = "_clearButton_t7wta_74", oe = "_chevron_t7wta_92", se = "_optionsList_t7wta_103", ae = "_noOptions_t7wta_112", le = "_option_t7wta_103", ne = "_optionSelected_t7wta_132", ie = "_optionDisabled_t7wta_138", ce = "_optionLabel_t7wta_146", re = "_checkbox_t7wta_153", de = "_checkboxChecked_t7wta_165", t = {
+  root: q,
+  disabled: G,
+  invalid: H,
+  sizeSm: J,
+  sizeMd: K,
+  sizeLg: Q,
+  displayText: X,
+  displayTextPlaceholder: Z,
+  indicators: ee,
+  clearButton: te,
+  chevron: oe,
+  optionsList: se,
+  noOptions: ae,
+  option: le,
+  optionSelected: ne,
+  optionDisabled: ie,
+  optionLabel: ce,
+  checkbox: re,
+  checkboxChecked: de
+}, L = (c) => {
   const {
-    clearable: w = !1,
-    disabled: i = !1,
-    invalid: u = !1,
-    multiple: s = !1,
-    onChange: o,
-    options: d,
-    placeholder: k,
-    size: S = "md",
+    children: b,
+    clearable: y = !1,
+    disabled: r = !1,
+    invalid: w = !1,
+    multiple: a = !1,
+    onChange: l,
+    options: u,
+    placeholder: z,
+    size: P = "md",
     value: n
-  } = v, [C, x] = P(!1), _ = O(), r = s ? d.filter((e) => n?.includes(e.value)) : d.filter((e) => e.value === n), f = r.length > 0 ? r.map((e) => e.label).join(", ") : k ?? _.Select.placeholder, g = h(
+  } = c, [E, N] = R(!1), f = V(), _ = U(() => {
+    if (!b)
+      return u ?? [];
+    const e = [], s = [k.OPTION];
+    return F.Children.forEach(b, (x) => {
+      if (Y(s, x, !1)) {
+        const d = x, i = d.props.children, D = typeof i == "string" ? i : typeof i == "number" || typeof i == "boolean" ? String(i) : "";
+        e.push({
+          disabled: d.props.disabled,
+          label: D,
+          value: d.props.value
+        });
+      }
+    }), e.length > 0 ? e : u ?? [];
+  }, [b, u]), h = a ? _.filter((e) => n?.includes(e.value)) : _.filter((e) => e.value === n), g = h.length > 0 ? h.map((e) => e.label).join(", ") : z ?? f.Select.placeholder, I = v(
     (e) => {
-      if (!e.disabled && o)
-        if (s) {
-          const l = n ?? [], y = l.includes(e.value) ? l.filter((T) => T !== e.value) : [...l, e.value];
-          o(y);
+      if (!e.disabled && l)
+        if (a) {
+          const s = n ?? [], d = s.includes(e.value) ? s.filter((i) => i !== e.value) : [...s, e.value];
+          l(d);
         } else
-          o(e.value), x(!1);
+          l(e.value), N(!1);
     },
-    [s, o, n]
-  ), L = h(
+    [a, l, n]
+  ), M = v(
     (e) => {
-      e.stopPropagation(), o && o(s ? [] : "");
+      e.stopPropagation(), l && l(a ? [] : "");
     },
-    [s, o]
-  ), N = h(
-    (e) => s ? n?.includes(e) ?? !1 : n === e,
-    [s, n]
-  ), z = p(
+    [a, l]
+  ), A = v(
+    (e) => a ? n?.includes(e) ?? !1 : n === e,
+    [a, n]
+  ), B = m(
     t.root,
-    D("size", S, t),
-    i && t.disabled,
-    u && t.invalid
+    W("size", P, t),
+    r && t.disabled,
+    w && t.invalid
   );
-  return /* @__PURE__ */ c(b, { onOpenChange: x, open: C, placement: M, children: [
-    /* @__PURE__ */ a(b.Trigger, { children: /* @__PURE__ */ c(
+  return /* @__PURE__ */ p(C, { onOpenChange: N, open: E, placement: $, children: [
+    /* @__PURE__ */ o(C.Trigger, { children: /* @__PURE__ */ p(
       "div",
       {
-        "aria-disabled": i,
-        "aria-invalid": u,
-        className: z,
+        "aria-disabled": r,
+        "aria-invalid": w,
+        className: B,
         role: "combobox",
-        tabIndex: i ? -1 : 0,
-        onClick: i ? (e) => e.stopPropagation() : void 0,
+        tabIndex: r ? -1 : 0,
+        onClick: r ? (e) => e.stopPropagation() : void 0,
         children: [
-          /* @__PURE__ */ a("span", { className: p(t.displayText, !r.length && t.displayTextPlaceholder), children: f }),
-          /* @__PURE__ */ c("span", { className: t.indicators, children: [
-            w && r.length > 0 && !i && /* @__PURE__ */ a(
+          /* @__PURE__ */ o("span", { className: m(t.displayText, !h.length && t.displayTextPlaceholder), children: g }),
+          /* @__PURE__ */ p("span", { className: t.indicators, children: [
+            y && h.length > 0 && !r && /* @__PURE__ */ o(
               "button",
               {
-                "aria-label": _.Select.clear,
+                "aria-label": f.Select.clear,
                 className: t.clearButton,
-                onClick: L,
+                onClick: M,
                 tabIndex: -1,
                 type: "button",
-                children: /* @__PURE__ */ a(m, { name: "x", size: 14 })
+                children: /* @__PURE__ */ o(S, { name: "x", size: 14 })
               }
             ),
-            /* @__PURE__ */ a("span", { className: t.chevron, children: /* @__PURE__ */ a(m, { name: "chevron-down", size: 16 }) })
+            /* @__PURE__ */ o("span", { className: t.chevron, children: /* @__PURE__ */ o(S, { name: "chevron-down", size: 16 }) })
           ] })
         ]
       }
     ) }),
-    /* @__PURE__ */ a(b.Content, { padding: !1, children: /* @__PURE__ */ c(
+    /* @__PURE__ */ o(C.Content, { padding: !1, children: /* @__PURE__ */ p(
       "ul",
       {
-        "aria-label": f,
+        "aria-label": g,
         className: t.optionsList,
         role: "listbox",
         children: [
-          d.length === 0 && /* @__PURE__ */ a("li", { className: t.noOptions, children: _.Select.noOptions }),
-          d.map((e) => {
-            const l = N(e.value);
-            return /* @__PURE__ */ c(
+          _.length === 0 && /* @__PURE__ */ o("li", { className: t.noOptions, children: f.Select.noOptions }),
+          _.map((e) => {
+            const s = A(e.value);
+            return /* @__PURE__ */ p(
               "li",
               {
                 "aria-disabled": e.disabled,
-                "aria-selected": l,
-                className: p(
+                "aria-selected": s,
+                className: m(
                   t.option,
-                  l && t.optionSelected,
+                  s && t.optionSelected,
                   e.disabled && t.optionDisabled
                 ),
                 onClick: () => {
-                  g(e);
+                  I(e);
                 },
                 role: "option",
                 children: [
-                  s && /* @__PURE__ */ a("span", { className: p(t.checkbox, l && t.checkboxChecked), children: l && /* @__PURE__ */ a(m, { name: "check", size: 12, strokeWidth: 3 }) }),
-                  /* @__PURE__ */ a("span", { className: t.optionLabel, children: e.label })
+                  a && /* @__PURE__ */ o("span", { className: m(t.checkbox, s && t.checkboxChecked), children: s && /* @__PURE__ */ o(S, { name: "check", size: 12, strokeWidth: 3 }) }),
+                  /* @__PURE__ */ o("span", { className: t.optionLabel, children: e.label })
                 ]
               },
               e.value
@@ -126,7 +144,11 @@ import './select.css';const I = "Select", M = "bottom start", A = "_root_t7wta_7
     ) })
   ] });
 };
-ee.displayName = I;
+L.displayName = O;
+const T = ({ children: c }) => /* @__PURE__ */ o(j, { children: c });
+T.displayName = `${O}.Option`;
+const pe = L;
+pe.Option = T;
 export {
-  ee as Select
+  pe as Select
 };

package/dist/slider.css

@@ -0,0 +1 @@
+:root{--slider-track-height: 6px;--slider-track-radius: var(--lui-radius-full);--slider-track-background: var(--lui-palette-gray-200);--slider-range-background: var(--lui-palette-brand);--slider-thumb-size: 18px;--slider-thumb-background: var(--lui-palette-white);--slider-thumb-border-color: var(--lui-palette-brand);--slider-thumb-border-width: 2px;--slider-thumb-shadow: var(--lui-shadow-xs);--slider-value-font-size: var(--lui-font-size-md);--slider-value-line-height: var(--line-height-md);--slider-value-color: var(--lui-color-text-primary);--slider-gap: var(--lui-space-2);--slider-transition-duration: .15s;--slider-transition-timing: cubic-bezier(.4, 0, .2, 1)}._root_16h6h_24{align-items:center;display:inline-flex;gap:var(--slider-gap);width:100%}._root_16h6h_24._disabled_16h6h_31{cursor:not-allowed;opacity:.5;pointer-events:none}._container_16h6h_37{flex:1;height:var(--slider-thumb-size);min-width:120px;position:relative}._input_16h6h_45{cursor:pointer;height:100%;left:0;margin:0;opacity:0;padding:0;position:absolute;top:0;width:100%;z-index:1}._track_16h6h_58{background:var(--slider-track-background);border-radius:var(--slider-track-radius);height:var(--slider-track-height);left:0;position:absolute;right:0;top:50%;transform:translateY(-50%)}._range_16h6h_69{background:var(--slider-range-background);border-radius:var(--slider-track-radius);height:100%;left:0;position:absolute;top:0;transition:background var(--slider-transition-duration) var(--slider-transition-timing)}._thumb_16h6h_79{background:var(--slider-thumb-background);border:var(--slider-thumb-border-width) solid var(--slider-thumb-border-color);border-radius:50%;box-shadow:var(--slider-thumb-shadow);height:var(--slider-thumb-size);position:absolute;top:50%;transform:translate(-50%,-50%);transition:border-color var(--slider-transition-duration) var(--slider-transition-timing),box-shadow var(--slider-transition-duration) var(--slider-transition-timing),transform var(--slider-transition-duration) var(--slider-transition-timing);width:var(--slider-thumb-size)}._input_16h6h_45:focus-visible~._track_16h6h_58 ._thumb_16h6h_79{box-shadow:0 0 0 2px var(--lui-color-background-primary),0 0 0 4px var(--lui-color-border-focus)}._input_16h6h_45:not(:disabled):hover~._track_16h6h_58 ._thumb_16h6h_79{transform:translate(-50%,-50%) scale(1.1)}._input_16h6h_45:not(:disabled):active~._track_16h6h_58 ._thumb_16h6h_79{transform:translate(-50%,-50%) scale(.95)}._input_16h6h_45:disabled~._track_16h6h_58{background:var(--lui-palette-gray-100)}._input_16h6h_45:disabled~._track_16h6h_58 ._range_16h6h_69{background:var(--lui-palette-gray-300)}._input_16h6h_45:disabled~._track_16h6h_58 ._thumb_16h6h_79{border-color:var(--lui-palette-gray-300)}._value_16h6h_120{color:var(--slider-value-color);flex-shrink:0;font-size:var(--slider-value-font-size);line-height:var(--slider-value-line-height);min-width:3ch;text-align:right;-webkit-user-select:none;user-select:none}._sizeSm_16h6h_131{--slider-track-height: 4px;--slider-thumb-size: 14px;--slider-thumb-border-width: 2px;--slider-value-font-size: var(--lui-font-size-sm);--slider-value-line-height: var(--line-height-sm)}._sizeMd_16h6h_140{--slider-track-height: 6px;--slider-thumb-size: 18px;--slider-thumb-border-width: 2px;--slider-value-font-size: var(--lui-font-size-md);--slider-value-line-height: var(--line-height-md)}._sizeLg_16h6h_149{--slider-track-height: 8px;--slider-thumb-size: 22px;--slider-thumb-border-width: 3px;--slider-value-font-size: var(--lui-font-size-lg);--slider-value-line-height: var(--line-height-lg)}

package/dist/slider.d.ts

@@ -0,0 +1,50 @@
+import { default as default_2 } from 'react';
+
+declare enum ESliderSize {
+    SM = "sm",
+    MD = "md",
+    LG = "lg"
+}
+
+export declare interface ISliderProps {
+    /** Current value. Default: 0. */
+    value?: number;
+    /** Default value for uncontrolled mode. */
+    defaultValue?: number;
+    /** Callback when value changes. */
+    onChange?: (value: number) => void;
+    /** Minimum value. Default: 0. */
+    min?: number;
+    /** Maximum value. Default: 100. */
+    max?: number;
+    /** Step increment. Default: 1. */
+    step?: number;
+    /** Size. Default: 'md'. */
+    size?: TSliderSize;
+    /** Disables the slider. */
+    disabled?: boolean;
+    /** Whether to show the value label next to the slider. Default: false. */
+    showValue?: boolean;
+}
+
+/**
+ * Slider component. Renders a range slider for selecting a numeric value.
+ *
+ * Supports controlled (`value` + `onChange`) and uncontrolled (`defaultValue`) modes.
+ * Uses a hidden native `<input type="range">` for accessibility and keyboard interaction.
+ *
+ * @example
+ * ```tsx
+ * <Slider />
+ * <Slider defaultValue={50} />
+ * <Slider value={75} onChange={(v) => setValue(v)} />
+ * <Slider min={0} max={10} step={2} />
+ * <Slider size="lg" showValue />
+ * <Slider disabled />
+ * ```
+ */
+export declare const Slider: default_2.FC<ISliderProps>;
+
+export declare type TSliderSize = `${ESliderSize.SM | ESliderSize.MD | ESliderSize.LG}`;
+
+export { }

package/dist/slider.js

@@ -0,0 +1,72 @@
+import { jsxs as i, jsx as n } from "react/jsx-runtime";
+import { useState as V, useMemo as C, useCallback as S } from "react";
+import x from "clsx";
+import { g as k } from "./getVariantClassName-DoCNtwBw.mjs";
+import './slider.css';const y = "Slider", M = "_root_16h6h_24", w = "_disabled_16h6h_31", L = "_container_16h6h_37", j = "_input_16h6h_45", A = "_track_16h6h_58", I = "_range_16h6h_69", $ = "_thumb_16h6h_79", D = "_value_16h6h_120", E = "_sizeSm_16h6h_131", P = "_sizeMd_16h6h_140", Y = "_sizeLg_16h6h_149", e = {
+  root: M,
+  disabled: w,
+  container: L,
+  input: j,
+  track: A,
+  range: I,
+  thumb: $,
+  value: D,
+  sizeSm: E,
+  sizeMd: P,
+  sizeLg: Y
+}, q = (d) => {
+  const {
+    value: r,
+    defaultValue: _ = 0,
+    disabled: o = !1,
+    max: t = 100,
+    min: s = 0,
+    onChange: c,
+    showValue: m = !1,
+    size: v = "md",
+    step: g = 1
+  } = d, l = r !== void 0, [p, N] = V(_);
+  let a;
+  l ? a = r : a = p;
+  const h = C(() => t === s ? 0 : (a - s) / (t - s) * 100, [a, s, t]), b = S(
+    (z) => {
+      const u = Number(z.target.value);
+      l || N(u), c?.(u);
+    },
+    [l, c]
+  ), f = x(
+    e.root,
+    k("size", v, e),
+    o && e.disabled
+  );
+  return /* @__PURE__ */ i("div", { className: f, children: [
+    /* @__PURE__ */ i("div", { className: e.container, children: [
+      /* @__PURE__ */ n(
+        "input",
+        {
+          "aria-valuemax": t,
+          "aria-valuemin": s,
+          "aria-valuenow": a,
+          className: e.input,
+          disabled: o,
+          max: t,
+          min: s,
+          onChange: b,
+          role: "slider",
+          step: g,
+          type: "range",
+          value: a
+        }
+      ),
+      /* @__PURE__ */ i("div", { className: e.track, "aria-hidden": "true", children: [
+        /* @__PURE__ */ n("div", { className: e.range, style: { width: `${h}%` } }),
+        /* @__PURE__ */ n("div", { className: e.thumb, style: { left: `${h}%` } })
+      ] })
+    ] }),
+    m && /* @__PURE__ */ n("span", { className: e.value, children: a })
+  ] });
+};
+q.displayName = y;
+export {
+  q as Slider
+};

package/dist/table.d.ts

@@ -50,6 +50,10 @@ declare interface IProps_2 extends default_2.PropsWithChildren {
 }
 
 declare interface IProps_3 extends default_2.PropsWithChildren {
+    /** Click handler for the row. */
+    onClick?: default_2.MouseEventHandler<HTMLTableRowElement>;
+    /** Inline styles. */
+    style?: default_2.CSSProperties;
 }
 
 declare interface IProps_4 extends default_2.PropsWithChildren {

package/dist/table.js

@@ -1,34 +1,34 @@
-import { jsxs as h, jsx as n } from "react/jsx-runtime";
+import { jsxs as h, jsx as c } from "react/jsx-runtime";
 import b, { useCallback as p } from "react";
 import { B as u } from "./Button-BN85EtaZ.mjs";
-import { C as L } from "./Chip-CmsNZTlz.mjs";
-import { u as R } from "./useLocale-CJh-krrY.mjs";
-import y from "clsx";
+import { C as y } from "./Chip-CmsNZTlz.mjs";
+import { u as L } from "./useLocale-CJh-krrY.mjs";
+import R from "clsx";
 import { g as w } from "./getVariantClassName-DoCNtwBw.mjs";
 import { i } from "./isValidReactNode-CmYwTWCE.mjs";
 import "lodash/camelCase";
 import './table.css';const v = "Table.ActiveFilters", x = "_root_4qb7d_5", $ = {
   root: x
 }, g = (t) => {
-  const { filters: e, onClearAll: o, onRemove: r } = t, c = R(), l = p(
-    (a) => () => {
-      r(a);
+  const { filters: l, onClearAll: e, onRemove: r } = t, s = L(), o = p(
+    (n) => () => {
+      r(n);
     },
     [r]
   ), m = p(() => {
-    o?.();
-  }, [o]);
-  return e.length === 0 ? null : /* @__PURE__ */ h("div", { className: $.root, children: [
-    e.map((a) => /* @__PURE__ */ h(L, { onDelete: l(a.key), children: [
-      a.label,
+    e?.();
+  }, [e]);
+  return l.length === 0 ? null : /* @__PURE__ */ h("div", { className: $.root, children: [
+    l.map((n) => /* @__PURE__ */ h(y, { onDelete: o(n.key), children: [
+      n.label,
       ": ",
-      a.value
-    ] }, a.key)),
-    o && /* @__PURE__ */ n(u, { mode: "text", size: "sm", onClick: m, children: c.Table.ActiveFilters.clearAll })
+      n.value
+    ] }, n.key)),
+    e && /* @__PURE__ */ c(u, { mode: "text", size: "sm", onClick: m, children: s.Table.ActiveFilters.clearAll })
   ] });
 };
 g.displayName = v;
-var s = /* @__PURE__ */ ((t) => (t.CELL = "Table.Cell", t.ROW = "Table.Row", t.TOOLBAR = "Table.Toolbar", t))(s || {});
+var a = /* @__PURE__ */ ((t) => (t.CELL = "Table.Cell", t.ROW = "Table.Row", t.TOOLBAR = "Table.Toolbar", t))(a || {});
 const O = "_root_lmxwt_8", k = "_header_lmxwt_17", B = "_alignLeft_lmxwt_21", F = "_alignRight_lmxwt_24", D = "_alignCenter_lmxwt_27", _ = {
   root: O,
   header: k,
@@ -36,36 +36,36 @@ const O = "_root_lmxwt_8", k = "_header_lmxwt_17", B = "_alignLeft_lmxwt_21", F
   alignRight: F,
   alignCenter: D
 }, A = (t) => {
-  const { align: e = "left", as: o = "td", children: r, title: c, width: l } = t, m = y(_.root, w("align", e, _), {
-    [_.header]: o === "th"
+  const { align: l = "left", as: e = "td", children: r, title: s, width: o } = t, m = R(_.root, w("align", l, _), {
+    [_.header]: e === "th"
   });
-  return /* @__PURE__ */ n(o, { className: m, title: c, width: l, children: r });
+  return /* @__PURE__ */ c(e, { className: m, title: s, width: o, children: r });
 };
-A.displayName = s.CELL;
+A.displayName = a.CELL;
 const E = "_root_t4731_5", I = {
   root: E
 }, T = (t) => {
-  const { children: e } = t, o = (r) => i(s.CELL, r) ? r : null;
-  return /* @__PURE__ */ n("tr", { className: I.root, children: b.Children.map(e, o) });
+  const { children: l, onClick: e, style: r } = t, s = (o) => i(a.CELL, o) ? o : null;
+  return /* @__PURE__ */ c("tr", { className: I.root, onClick: e, style: r, children: b.Children.map(l, s) });
 };
-T.displayName = s.ROW;
+T.displayName = a.ROW;
 const M = "Table.Toolbar", P = "_root_d4szt_6", W = {
   root: P
 }, f = (t) => {
-  const { children: e } = t;
-  return /* @__PURE__ */ n("div", { className: W.root, children: e });
+  const { children: l } = t;
+  return /* @__PURE__ */ c("div", { className: W.root, children: l });
 };
 f.displayName = M;
 const Y = "Table", j = "_wrapper_17sd8_5", z = "_root_17sd8_11", C = {
   wrapper: j,
   root: z
 }, N = (t) => {
-  const { children: e } = t, o = b.Children.toArray(e), r = o.find(
-    (l) => i(s.TOOLBAR, l, !1)
-  ), c = o.filter((l) => !i(s.TOOLBAR, l, !1)).filter((l) => i(s.ROW, l, !0));
+  const { children: l } = t, e = b.Children.toArray(l), r = e.find(
+    (o) => i(a.TOOLBAR, o, !1)
+  ), s = e.filter((o) => !i(a.TOOLBAR, o, !1)).filter((o) => i(a.ROW, o, !0));
   return /* @__PURE__ */ h("div", { className: C.wrapper, children: [
     r,
-    /* @__PURE__ */ n("table", { className: C.root, children: /* @__PURE__ */ n("tbody", { children: c }) })
+    /* @__PURE__ */ c("table", { className: C.root, children: /* @__PURE__ */ c("tbody", { children: s }) })
   ] });
 };
 N.displayName = Y;

package/dist/text.d.ts

@@ -23,41 +23,41 @@ export declare enum ETextWeight {
 }
 
 export declare interface ITextProps extends default_2.PropsWithChildren {
-    /** HTML-тег для рендера корневого элемента. По умолчанию `p`. */
+    /** HTML tag for rendering the root element. Defaults to `p`. */
     as?: TTextTag;
-    /** Размер текста. По умолчанию `sm`. */
+    /** Text size. Defaults to `sm`. */
     size?: TTextSize;
-    /** Насыщенность шрифта. По умолчанию `normal`. */
+    /** Font weight. Defaults to `normal`. */
     weight?: TTextWeight;
-    /** Цвет текста из дизайн-системы. Если не передан — используется наследованный цвет. */
+    /** Text color from the design system. If not provided — uses inherited color. */
     color?: TTextColor;
-    /** Обрезать текст с многоточием (одна строка, `text-overflow: ellipsis`). */
+    /** Truncate text with ellipsis (single line, `text-overflow: ellipsis`). */
     truncate?: boolean;
-    /** Подчёркивание: `true` для обычного underline, `'dotted'` для пунктирного подчёркивания. */
+    /** Underline: `true` for regular underline, `'dotted'` for dotted underline. */
     underline?: boolean | 'dotted';
-    /** Зачёркивание текста (`text-decoration: line-through`). */
+    /** Strikethrough text (`text-decoration: line-through`). */
     strikethrough?: boolean;
-    /** Ref на корневой элемент. */
+    /** Ref on the root element. */
     ref?: default_2.Ref<HTMLElement>;
 }
 
 /**
- * Text — компонент для отображения основного текста.
+ * Text — component for displaying body text.
  *
- * Поддерживает размеры от 12px (xs) до 16px (lg), различные насыщенности шрифта
- * и цвета из дизайн-системы. Подходит для параграфов, лейблов, аннотаций.
+ * Supports sizes from 12px (xs) to 16px (lg), various font weights,
+ * and colors from the design system. Suitable for paragraphs, labels, annotations.
  *
- * В отличие от Heading, Text не имеет встроенного жирного начертания —
- * вес управляется отдельным пропом `weight`.
+ * Unlike Heading, Text does not have built-in bold styling —
+ * weight is controlled by the `weight` prop.
  *
  * @example
  * ```tsx
- * <Text size="lg" weight="medium">Основной текст</Text>
+ * <Text size="lg" weight="medium">Body text</Text>
  * ```
  *
  * @example
  * ```tsx
- * <Text size="xs" color="secondary" as="span">Аннотация</Text>
+ * <Text size="xs" color="secondary" as="span">Annotation</Text>
  * ```
  */
 declare const Text_2: default_2.ForwardRefExoticComponent<Omit<ITextProps, "ref"> & default_2.RefAttributes<HTMLElement>>;

package/dist/utils.d.ts

@@ -1,10 +1,10 @@
 import { default as default_2 } from 'react';
 
 /**
- * Фильтрует массив дочерних React-элементов, оставляя только допустимые компоненты
- * @param children - Дочерние элементы React компонента
- * @param acceptableComponents - Массив или объект с допустимыми подкомпонентами
- * @returns Массив отфильтрованных дочерних элементов
+ * Filters an array of React children, keeping only valid components
+ * @param children - React component children
+ * @param acceptableComponents - Array or object of acceptable sub-components
+ * @returns Array of filtered children
  */
 export declare const filterValidChildren: (children: default_2.ReactNode, acceptableComponents: string | string[]) => default_2.ReactNode[];
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lazar-ui/kit",
-  "version": "0.6.2",
+  "version": "0.7.0",
   "license": "MIT",
   "description": "A component library for building admin panels, dashboards, and internal tools.",
   "homepage": "https://lazar-ui.github.io/docs",