ics-ui-kit 0.1.0-alpha.8 → 0.1.0

package/dist/components/tag/Tag.stories.d.ts

@@ -5,4 +5,5 @@ export default meta;
 type Story = StoryObj<typeof Tag>;
 export declare const Default: Story;
 export declare const WithIcon: Story;
+export declare const WithTruncation: Story;
 export declare const Showcase: Story;

package/dist/components/tag/index.d.ts

@@ -1 +1 @@
-export { Tag } from './Tag';
+export { TagBase, TagButton, TagClose, TagDivider, TagWrapper, Tag } from './Tag';

package/dist/components/tag-input/TagInput.d.ts

@@ -0,0 +1,42 @@
+import { default as React } from 'react';
+/**
+ * Пропсы для рендера тега
+ */
+export type RenderTagProps = {
+    /** Значение тега (строка) */
+    tag: string;
+    /** Индекс тега в массиве */
+    index: number;
+    /** Функция для удаления тега */
+    onClose?: () => void;
+    /** Функция для начала редактирования тега */
+    onEdit?: () => void;
+    /** Фокус на теге (для навигации с клавиатуры) */
+    isFocused: boolean;
+    /** Отключен ли компонент */
+    readonly: boolean;
+};
+export interface TagInputProps {
+    /** Текущие выбранные опции (controlled режим) */
+    value?: string[];
+    /** Опции по умолчанию (uncontrolled режим) */
+    defaultValue?: string[];
+    /** Callback при изменении выбранных опций */
+    onChange?: (options: string[]) => void;
+    /** Placeholder для input */
+    placeholder?: string;
+    /** Отключить компонент */
+    readonly?: boolean;
+    /** CSS класс для контейнера */
+    className?: string;
+    /** Функция валидации тега. Если null - валидация отключена, если не передана - используется валидация по умолчанию */
+    validateTag?: ((tag: string, allTags: string[], editingIndex?: number) => boolean | string) | null;
+    /** Состояние ошибки */
+    invalid?: boolean;
+    /** Кастомная функция рендера тега */
+    renderOption?: (props: RenderTagProps) => React.ReactNode;
+}
+/**
+ * Компонент для ввода и отображения тегов
+ */
+export declare const TagInput: React.ForwardRefExoticComponent<TagInputProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/tag-input/TagInput.stories.d.ts

@@ -0,0 +1,9 @@
+import { Meta, StoryObj } from '@storybook/react';
+import { TagInput } from './TagInput';
+declare const meta: Meta<typeof TagInput>;
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;
+export declare const Readonly: Story;
+export declare const Invalid: Story;
+export declare const WithRenderOption: Story;

package/dist/components/tag-input/index.d.ts

@@ -0,0 +1,2 @@
+export { TagInput } from './TagInput';
+export type { TagInputProps, RenderTagProps } from './TagInput';

package/dist/components/tag-input.d.ts

@@ -0,0 +1,2 @@
+export * from './tag-input/index'
+export {}

package/dist/components/tag-input.js

@@ -0,0 +1,162 @@
+import { jsx as C, jsxs as q } from "react/jsx-runtime";
+import { u as z, S as H } from "../SearchSelectTag-DFCX9zT1.js";
+import { u as J } from "../useItemsKeyboardNavigation-CmeOR30y.js";
+import M, { useState as k, useRef as V, useCallback as r } from "react";
+import { T as S } from "../index-BVqs-uqP.js";
+import { I as P, a as Q, b as U } from "../InputGroup-BvD9Igmt.js";
+import { s as W } from "../Select-DRwv6-eZ.js";
+const X = S({
+  extend: W,
+  base: "group/search-select-trigger flex h-auto min-h-10 flex-wrap items-center gap-1 !py-[0.3125rem] px-1.5 lg:h-auto lg:min-h-9 lg:px-1.5"
+}), Y = S({
+  base: "min-w-28 rounded-none p-0 px-1.5 leading-6 read-only:w-0 read-only:min-w-0 lg:p-0 lg:px-1.5"
+}), Z = S({
+  base: "p-0 px-1.5 outline-none lg:p-0 lg:px-1.5"
+}), O = (f, m, d) => {
+  if (!f.trim()) return "Тег не может быть пустым";
+  if (d === void 0) {
+    if (m.includes(f)) return "Такой тег уже существует";
+  } else if (m.filter((s, v) => v !== d).includes(f)) return "Такой тег уже существует";
+  return !0;
+}, tt = M.forwardRef(
+  ({
+    value: f,
+    defaultValue: m = [],
+    onChange: d,
+    placeholder: N = "Добавить тег...",
+    readonly: s = !1,
+    className: v,
+    validateTag: I,
+    invalid: R,
+    renderOption: y
+  }, B) => {
+    const [u, D] = k(""), E = V(null), [n = [], l] = z({ value: f, defaultValue: m, onChange: d }), F = X({ className: v, invalid: R }), p = r(
+      (t) => {
+        s || l(n.filter((e, a) => a !== t));
+      },
+      [n, l, s]
+    ), [i, c] = k(null), o = V(null), h = r(
+      (t, e) => I === null ? !0 : (I || O)(t, n, e) === !0,
+      [I, n]
+    ), g = r(
+      (t) => {
+        s || (c(t), setTimeout(() => {
+          if (o.current) {
+            o.current.textContent = n[t], o.current.focus();
+            const e = document.createRange();
+            e.selectNodeContents(o.current);
+            const a = window.getSelection();
+            a?.removeAllRanges(), a?.addRange(e);
+          }
+        }, 0));
+      },
+      [n, c, s]
+    ), T = r(() => {
+      c(null), setTimeout(() => E.current?.focus(), 0);
+    }, [c]), G = r((t, e) => g(e), [g]), j = r((t, e) => p(e), [p]), { handleKeyDown: K, isFocused: b } = J({
+      items: n,
+      onEnter: G,
+      onDelete: j,
+      cycleNavigation: !0
+    }), x = r(() => {
+      if (i !== null && o.current) {
+        const t = o.current.textContent?.trim() || "";
+        if (t && h(t, i)) {
+          const e = [...n];
+          e[i] = t, l(e), c(null), setTimeout(() => E.current?.focus(), 0);
+        }
+      }
+    }, [i, o, n, c, l, h]), w = r(
+      (t) => {
+        const e = t.trim();
+        e && h(e) && (l([...n, e]), D(""));
+      },
+      [n, l, D, h]
+    ), A = r(
+      (t) => {
+        if (t.key === "Enter" && u.trim()) {
+          t.preventDefault(), w(u);
+          return;
+        }
+        u.trim() || K(t);
+      },
+      [u, K, w]
+    ), L = r(() => {
+      u.trim() && w(u);
+    }, [u, w]), _ = r(
+      (t) => {
+        t.key === "Enter" ? (t.preventDefault(), x()) : t.key === "Escape" && (t.preventDefault(), T());
+      },
+      [x, T]
+    ), $ = r(() => n.map((t, e) => {
+      if (i === e)
+        return /* @__PURE__ */ C(
+          P,
+          {
+            ref: o,
+            className: Z(),
+            onKeyDown: _,
+            onBlur: T
+          },
+          `editing-${e}`
+        );
+      if (y) {
+        const a = y({
+          tag: t,
+          index: e,
+          onClose: () => p(e),
+          onEdit: () => g(e),
+          isFocused: !s && b(e),
+          readonly: s
+        });
+        if (a !== void 0)
+          return a;
+      }
+      return /* @__PURE__ */ C(
+        H,
+        {
+          onLabelClick: () => g(e),
+          onClose: () => p(e),
+          readonly: s,
+          isFocused: !s && b(e),
+          children: t
+        },
+        e
+      );
+    }), [
+      i,
+      o,
+      _,
+      T,
+      n,
+      s,
+      b,
+      p,
+      g,
+      y
+    ]);
+    return /* @__PURE__ */ q(Q, { ref: B, className: F.base(), children: [
+      $(),
+      /* @__PURE__ */ C(
+        U,
+        {
+          ref: E,
+          type: "text",
+          value: u,
+          onChange: (t) => D(t.target.value),
+          onKeyDown: A,
+          onBlur: L,
+          placeholder: s ? "" : N,
+          className: Y(),
+          readOnly: s,
+          "aria-invalid": R
+        }
+      )
+    ] });
+  }
+);
+tt.displayName = "TagInput";
+export {
+  tt as TagInput
+};
+//# sourceMappingURL=tag-input.js.map

package/dist/components/tag-input.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tag-input.js","sources":["../../src/components/tag-input/TagInput.tsx"],"sourcesContent":["import { SearchSelectTag } from \"@/components/search-select/components/SearchSelectTag\";\r\nimport { useControllableState } from \"@/hooks/useControllableState\";\r\nimport { useItemsKeyboardNavigation } from \"@/hooks/useItemsKeyboardNavigation\";\r\nimport React, { KeyboardEvent, useCallback, useRef, useState } from \"react\";\r\nimport { tv } from \"tailwind-variants\";\r\nimport { InputGroup, InputGroupInput, InputGroupContentEditable } from \"../input\";\r\nimport { selectTriggerStyles } from \"../select/Select\";\r\n\r\nconst tagInputStyles = tv({\r\n\textend: selectTriggerStyles,\r\n\tbase: \"group/search-select-trigger flex h-auto min-h-10 flex-wrap items-center gap-1 !py-[0.3125rem] px-1.5 lg:h-auto lg:min-h-9 lg:px-1.5\"\r\n});\r\n\r\nconst inputStyles = tv({\r\n\tbase: \"min-w-28 rounded-none p-0 px-1.5 leading-6 read-only:w-0 read-only:min-w-0 lg:p-0 lg:px-1.5\"\r\n});\r\n\r\nconst editingDivStyles = tv({\r\n\tbase: \"p-0 px-1.5 outline-none lg:p-0 lg:px-1.5\"\r\n});\r\n\r\n/**\r\n * Пропсы для рендера тега\r\n */\r\nexport type RenderTagProps = {\r\n\t/** Значение тега (строка) */\r\n\ttag: string;\r\n\t/** Индекс тега в массиве */\r\n\tindex: number;\r\n\t/** Функция для удаления тега */\r\n\tonClose?: () => void;\r\n\t/** Функция для начала редактирования тега */\r\n\tonEdit?: () => void;\r\n\t/** Фокус на теге (для навигации с клавиатуры) */\r\n\tisFocused: boolean;\r\n\t/** Отключен ли компонент */\r\n\treadonly: boolean;\r\n};\r\n\r\n/**\r\n * Функция валидации тега по умолчанию\r\n */\r\nconst defaultValidateTag = (tag: string, allTags: string[], editingIndex?: number): boolean | string => {\r\n\tif (!tag.trim()) return \"Тег не может быть пустым\";\r\n\r\n\tif (editingIndex === undefined) {\r\n\t\t// Добавление нового тега\r\n\t\tif (allTags.includes(tag)) return \"Такой тег уже существует\";\r\n\t} else {\r\n\t\t// Редактирование существующего\r\n\t\tconst otherTags = allTags.filter((_, i) => i !== editingIndex);\r\n\t\tif (otherTags.includes(tag)) return \"Такой тег уже существует\";\r\n\t}\r\n\r\n\treturn true;\r\n};\r\n\r\nexport interface TagInputProps {\r\n\t/** Текущие выбранные опции (controlled режим) */\r\n\tvalue?: string[];\r\n\t/** Опции по умолчанию (uncontrolled режим) */\r\n\tdefaultValue?: string[];\r\n\t/** Callback при изменении выбранных опций */\r\n\tonChange?: (options: string[]) => void;\r\n\t/** Placeholder для input */\r\n\tplaceholder?: string;\r\n\t/** Отключить компонент */\r\n\treadonly?: boolean;\r\n\t/** CSS класс для контейнера */\r\n\tclassName?: string;\r\n\t/** Функция валидации тега. Если null - валидация отключена, если не передана - используется валидация по умолчанию */\r\n\tvalidateTag?: ((tag: string, allTags: string[], editingIndex?: number) => boolean | string) | null;\r\n\t/** Состояние ошибки */\r\n\tinvalid?: boolean;\r\n\t/** Кастомная функция рендера тега */\r\n\trenderOption?: (props: RenderTagProps) => React.ReactNode;\r\n}\r\n\r\n/**\r\n * Компонент для ввода и отображения тегов\r\n */\r\nexport const TagInput = React.forwardRef<HTMLDivElement, TagInputProps>(\r\n\t(\r\n\t\t{\r\n\t\t\tvalue,\r\n\t\t\tdefaultValue = [],\r\n\t\t\tonChange,\r\n\t\t\tplaceholder = \"Добавить тег...\",\r\n\t\t\treadonly = false,\r\n\t\t\tclassName,\r\n\t\t\tvalidateTag,\r\n\t\t\tinvalid,\r\n\t\t\trenderOption\r\n\t\t},\r\n\t\tref\r\n\t) => {\r\n\t\t// Состояние для ввода нового тега\r\n\t\tconst [inputValue, setInputValue] = useState(\"\");\r\n\t\tconst inputRef = useRef<HTMLInputElement>(null);\r\n\r\n\t\t// Управление тегами\r\n\t\tconst [tags = [], setTags] = useControllableState<string[]>({ value, defaultValue, onChange });\r\n\r\n\t\tconst styles = tagInputStyles({ className, invalid });\r\n\t\tconst removeTag = useCallback(\r\n\t\t\t(index: number) => {\r\n\t\t\t\tif (readonly) return;\r\n\t\t\t\tsetTags(tags.filter((_, i) => i !== index));\r\n\t\t\t},\r\n\t\t\t[tags, setTags, readonly]\r\n\t\t);\r\n\r\n\t\t// Состояние для режима редактирования существующих тегов\r\n\t\tconst [editingIndex, setEditingIndex] = useState<number | null>(null);\r\n\t\tconst editingRef = useRef<HTMLDivElement>(null);\r\n\r\n\t\t/**\r\n\t\t * Функция валидации тега\r\n\t\t */\r\n\t\tconst validateTagValue = useCallback(\r\n\t\t\t(tag: string, editingIndex?: number): boolean => {\r\n\t\t\t\tif (validateTag === null) return true;\r\n\r\n\t\t\t\tconst validator = validateTag || defaultValidateTag;\r\n\t\t\t\tconst result = validator(tag, tags, editingIndex);\r\n\r\n\t\t\t\treturn result === true;\r\n\t\t\t},\r\n\t\t\t[validateTag, tags]\r\n\t\t);\r\n\r\n\t\t/**\r\n\t\t * Переключение в режим редактирования существующего тега\r\n\t\t */\r\n\t\tconst startEditing = useCallback(\r\n\t\t\t(index: number) => {\r\n\t\t\t\tif (readonly) return;\r\n\t\t\t\tsetEditingIndex(index);\r\n\t\t\t\t// Фокусируем элемент после обновления состояния\r\n\t\t\t\tsetTimeout(() => {\r\n\t\t\t\t\tif (editingRef.current) {\r\n\t\t\t\t\t\t// Устанавливаем содержимое напрямую, без использования React state\r\n\t\t\t\t\t\teditingRef.current.textContent = tags[index];\r\n\t\t\t\t\t\teditingRef.current.focus();\r\n\t\t\t\t\t\t// Выделяем весь текст\r\n\t\t\t\t\t\tconst range = document.createRange();\r\n\t\t\t\t\t\trange.selectNodeContents(editingRef.current);\r\n\t\t\t\t\t\tconst selection = window.getSelection();\r\n\t\t\t\t\t\tselection?.removeAllRanges();\r\n\t\t\t\t\t\tselection?.addRange(range);\r\n\t\t\t\t\t}\r\n\t\t\t\t}, 0);\r\n\t\t\t},\r\n\t\t\t[tags, setEditingIndex, readonly]\r\n\t\t);\r\n\r\n\t\t/**\r\n\t\t * Отмена редактирования тега\r\n\t\t */\r\n\t\tconst cancelEditing = useCallback(() => {\r\n\t\t\tsetEditingIndex(null);\r\n\t\t\tsetTimeout(() => inputRef.current?.focus(), 0);\r\n\t\t}, [setEditingIndex]);\r\n\r\n\t\t/**\r\n\t\t * Обработчик нажатия Enter на теге: переключает текущий тег в режим редактирования\r\n\t\t */\r\n\t\tconst onEnter = useCallback((_: string, index: number) => startEditing(index), [startEditing]);\r\n\r\n\t\tconst handleDeleteTag = useCallback((_: string, index: number) => removeTag(index), [removeTag]);\r\n\r\n\t\t/**\r\n\t\t * Хук для навигации по тегам с помощью клавиатуры (вперед/назад)\r\n\t\t */\r\n\t\tconst { handleKeyDown: handleTagsKeyDown, isFocused } = useItemsKeyboardNavigation({\r\n\t\t\titems: tags,\r\n\t\t\tonEnter,\r\n\t\t\tonDelete: handleDeleteTag,\r\n\t\t\tcycleNavigation: true\r\n\t\t});\r\n\r\n\t\t/**\r\n\t\t * Сохранение изменений в текущем теге\r\n\t\t */\r\n\t\tconst saveEditing = useCallback(() => {\r\n\t\t\tif (editingIndex !== null && editingRef.current) {\r\n\t\t\t\tconst newValue = editingRef.current.textContent?.trim() || \"\";\r\n\r\n\t\t\t\tif (newValue && validateTagValue(newValue, editingIndex)) {\r\n\t\t\t\t\tconst newTags = [...tags];\r\n\t\t\t\t\tnewTags[editingIndex] = newValue;\r\n\t\t\t\t\tsetTags(newTags);\r\n\t\t\t\t\tsetEditingIndex(null);\r\n\t\t\t\t\t// Возвращаем фокус в input и устанавливаем фокус на отредактированный элемент\r\n\t\t\t\t\tsetTimeout(() => inputRef.current?.focus(), 0);\r\n\t\t\t\t}\r\n\t\t\t}\r\n\t\t}, [editingIndex, editingRef, tags, setEditingIndex, setTags, validateTagValue]);\r\n\r\n\t\t/**\r\n\t\t * Добавление нового тега\r\n\t\t */\r\n\t\tconst addNewTag = useCallback(\r\n\t\t\t(tagValue: string) => {\r\n\t\t\t\tconst trimmedTag = tagValue.trim();\r\n\t\t\t\tif (trimmedTag && validateTagValue(trimmedTag)) {\r\n\t\t\t\t\tsetTags([...tags, trimmedTag]);\r\n\t\t\t\t\tsetInputValue(\"\");\r\n\t\t\t\t}\r\n\t\t\t},\r\n\t\t\t[tags, setTags, setInputValue, validateTagValue]\r\n\t\t);\r\n\r\n\t\t/**\r\n\t\t * Обработчик нажатия клавиш на input:\r\n\t\t * - Если нажат Enter и input не пустой, добавляет новый тег\r\n\t\t * - Если input пустой, обрабатывает навигацию по тегам\r\n\t\t */\r\n\t\tconst handleInputKeyDown = useCallback(\r\n\t\t\t(e: KeyboardEvent<HTMLInputElement>) => {\r\n\t\t\t\tif (e.key === \"Enter\" && inputValue.trim()) {\r\n\t\t\t\t\te.preventDefault();\r\n\t\t\t\t\taddNewTag(inputValue);\r\n\t\t\t\t\treturn;\r\n\t\t\t\t}\r\n\t\t\t\tif (!inputValue.trim()) {\r\n\t\t\t\t\thandleTagsKeyDown(e);\r\n\t\t\t\t}\r\n\t\t\t},\r\n\t\t\t[inputValue, handleTagsKeyDown, addNewTag]\r\n\t\t);\r\n\r\n\t\t/**\r\n\t\t * Обработчик потери фокуса input - добавляет тег если он не пустой\r\n\t\t */\r\n\t\tconst handleInputBlur = useCallback(() => {\r\n\t\t\tif (inputValue.trim()) {\r\n\t\t\t\taddNewTag(inputValue);\r\n\t\t\t}\r\n\t\t}, [inputValue, addNewTag]);\r\n\r\n\t\tconst handleEditingKeyDown = useCallback(\r\n\t\t\t(e: KeyboardEvent<HTMLDivElement>) => {\r\n\t\t\t\tif (e.key === \"Enter\") {\r\n\t\t\t\t\te.preventDefault();\r\n\t\t\t\t\tsaveEditing();\r\n\t\t\t\t} else if (e.key === \"Escape\") {\r\n\t\t\t\t\te.preventDefault();\r\n\t\t\t\t\tcancelEditing();\r\n\t\t\t\t}\r\n\t\t\t},\r\n\t\t\t[saveEditing, cancelEditing]\r\n\t\t);\r\n\r\n\t\tconst renderTags = useCallback(() => {\r\n\t\t\treturn tags.map((tag, index) => {\r\n\t\t\t\tif (editingIndex === index) {\r\n\t\t\t\t\treturn (\r\n\t\t\t\t\t\t<InputGroupContentEditable\r\n\t\t\t\t\t\t\tkey={`editing-${index}`}\r\n\t\t\t\t\t\t\tref={editingRef}\r\n\t\t\t\t\t\t\tclassName={editingDivStyles()}\r\n\t\t\t\t\t\t\tonKeyDown={handleEditingKeyDown}\r\n\t\t\t\t\t\t\tonBlur={cancelEditing}\r\n\t\t\t\t\t\t/>\r\n\t\t\t\t\t);\r\n\t\t\t\t}\r\n\r\n\t\t\t\tif (renderOption) {\r\n\t\t\t\t\tconst item = renderOption({\r\n\t\t\t\t\t\ttag,\r\n\t\t\t\t\t\tindex,\r\n\t\t\t\t\t\tonClose: () => removeTag(index),\r\n\t\t\t\t\t\tonEdit: () => startEditing(index),\r\n\t\t\t\t\t\tisFocused: !readonly && isFocused(index),\r\n\t\t\t\t\t\treadonly\r\n\t\t\t\t\t});\r\n\t\t\t\t\tif (item !== undefined) {\r\n\t\t\t\t\t\treturn item;\r\n\t\t\t\t\t}\r\n\t\t\t\t}\r\n\r\n\t\t\t\treturn (\r\n\t\t\t\t\t<SearchSelectTag\r\n\t\t\t\t\t\tkey={index}\r\n\t\t\t\t\t\tonLabelClick={() => startEditing(index)}\r\n\t\t\t\t\t\tonClose={() => removeTag(index)}\r\n\t\t\t\t\t\treadonly={readonly}\r\n\t\t\t\t\t\tisFocused={!readonly && isFocused(index)}\r\n\t\t\t\t\t>\r\n\t\t\t\t\t\t{tag}\r\n\t\t\t\t\t</SearchSelectTag>\r\n\t\t\t\t);\r\n\t\t\t});\r\n\t\t}, [\r\n\t\t\teditingIndex,\r\n\t\t\teditingRef,\r\n\t\t\thandleEditingKeyDown,\r\n\t\t\tcancelEditing,\r\n\t\t\ttags,\r\n\t\t\treadonly,\r\n\t\t\tisFocused,\r\n\t\t\tremoveTag,\r\n\t\t\tstartEditing,\r\n\t\t\trenderOption\r\n\t\t]);\r\n\r\n\t\treturn (\r\n\t\t\t<InputGroup ref={ref} className={styles.base()}>\r\n\t\t\t\t{renderTags()}\r\n\t\t\t\t<InputGroupInput\r\n\t\t\t\t\tref={inputRef}\r\n\t\t\t\t\ttype=\"text\"\r\n\t\t\t\t\tvalue={inputValue}\r\n\t\t\t\t\tonChange={(e) => setInputValue(e.target.value)}\r\n\t\t\t\t\tonKeyDown={handleInputKeyDown}\r\n\t\t\t\t\tonBlur={handleInputBlur}\r\n\t\t\t\t\tplaceholder={readonly ? \"\" : placeholder}\r\n\t\t\t\t\tclassName={inputStyles()}\r\n\t\t\t\t\treadOnly={readonly}\r\n\t\t\t\t\taria-invalid={invalid}\r\n\t\t\t\t/>\r\n\t\t\t</InputGroup>\r\n\t\t);\r\n\t}\r\n);\r\n\r\nTagInput.displayName = \"TagInput\";\r\n"],"names":["tagInputStyles","tv","selectTriggerStyles","inputStyles","editingDivStyles","defaultValidateTag","tag","allTags","editingIndex","_","i","TagInput","React","value","defaultValue","onChange","placeholder","readonly","className","validateTag","invalid","renderOption","ref","inputValue","setInputValue","useState","inputRef","useRef","tags","setTags","useControllableState","styles","removeTag","useCallback","index","setEditingIndex","editingRef","validateTagValue","startEditing","range","selection","cancelEditing","onEnter","handleDeleteTag","handleTagsKeyDown","isFocused","useItemsKeyboardNavigation","saveEditing","newValue","newTags","addNewTag","tagValue","trimmedTag","handleInputKeyDown","e","handleInputBlur","handleEditingKeyDown","renderTags","jsx","InputGroupContentEditable","item","SearchSelectTag","InputGroup","InputGroupInput"],"mappings":"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"}

package/dist/components/tag.js

@@ -1,191 +1,10 @@
-var j = Object.defineProperty, C = Object.defineProperties;
-var V = Object.getOwnPropertyDescriptors;
-var o = Object.getOwnPropertySymbols;
-var i = Object.prototype.hasOwnProperty, c = Object.prototype.propertyIsEnumerable;
-var b = (t, s, r) => s in t ? j(t, s, { enumerable: !0, configurable: !0, writable: !0, value: r }) : t[s] = r, g = (t, s) => {
-  for (var r in s || (s = {}))
-    i.call(s, r) && b(t, r, s[r]);
-  if (o)
-    for (var r of o(s))
-      c.call(s, r) && b(t, r, s[r]);
-  return t;
-}, d = (t, s) => C(t, V(s));
-var h = (t, s) => {
-  var r = {};
-  for (var e in t)
-    i.call(t, e) && s.indexOf(e) < 0 && (r[e] = t[e]);
-  if (t != null && o)
-    for (var e of o(t))
-      s.indexOf(e) < 0 && c.call(t, e) && (r[e] = t[e]);
-  return r;
-};
-import { jsxs as k, jsx as a } from "react/jsx-runtime";
-import D from "react";
-import { c as I } from "../index-CR-odn5-.js";
-import { D as R, X as T } from "../Divider-6mgvOWE1.js";
-import { I as _ } from "../IconButton-CTxOql_1.js";
-import { B as q } from "../Button-Cfe4WIYW.js";
-const X = I({
-  slots: {
-    container: "",
-    base: "inline-flex items-center rounded-sm",
-    button: "inline-flex items-center justify-center overflow-hidden rounded-sm rounded-r-none border border-r-0 font-medium leading-none",
-    divider: "",
-    closeButton: "inline-flex items-center justify-center overflow-hidden rounded-sm rounded-l-none border border-l-0",
-    icon: "aspect-square flex-shrink-0"
-  },
-  variants: {
-    status: {
-      default: {
-        button: "border-primary-border bg-primary-bg text-primary-fg hover:bg-primary-bg-hover",
-        divider: "bg-primary-border",
-        closeButton: "border-primary-border bg-primary-bg text-primary-fg hover:bg-primary-bg-hover"
-      },
-      info: {
-        button: "border-status-info-border bg-status-info-bg text-status-info hover:bg-status-info-bg-hover",
-        divider: "bg-status-info-border",
-        closeButton: "border-status-info-border bg-status-info-bg text-status-info hover:bg-status-info-bg-hover"
-      },
-      success: {
-        button: "border-status-success-border bg-status-success-bg text-status-success hover:bg-status-success-bg-hover",
-        divider: "bg-status-success-border",
-        closeButton: "border-status-success-border bg-status-success-bg text-status-success hover:bg-status-success-bg-hover"
-      },
-      warning: {
-        button: "border-status-warning-border bg-status-warning-bg text-status-warning hover:bg-status-warning-bg-hover",
-        divider: "bg-status-warning-border",
-        closeButton: "border-status-warning-border bg-status-warning-bg text-status-warning hover:bg-status-warning-bg-hover"
-      },
-      error: {
-        button: "border-status-error-secondary-border bg-status-error-bg text-status-error hover:bg-status-error-bg-hover",
-        divider: "bg-status-error-border",
-        closeButton: "border-status-error-secondary-border bg-status-error-bg text-status-error hover:bg-status-error-bg-hover"
-      }
-    },
-    focus: {
-      low: {
-        base: "shadow-sm",
-        closeButton: "text-primary-fg shadow-none",
-        button: "shadow-none"
-      },
-      high: {
-        base: "shadow-base",
-        button: "border-transparent bg-primary-accent text-primary-bg shadow-none",
-        closeButton: "border-transparent bg-primary-accent text-primary-bg shadow-none"
-      }
-    },
-    size: {
-      sm: {
-        base: "h-5",
-        button: "h-5 px-1.5 py-1 text-xs",
-        closeButton: "h-5 p-1 text-xs",
-        container: "gap-1",
-        icon: "h-3 w-3"
-      },
-      md: {
-        base: "h-6",
-        button: "h-6 px-1.5 py-1 text-sm",
-        closeButton: "h-6 p-1 text-sm",
-        container: "gap-1",
-        icon: "h-3.5 w-3.5"
-      },
-      lg: {
-        base: "h-7",
-        button: "h-7 px-2 py-1 text-base",
-        closeButton: "h-7 p-1.5 text-base",
-        container: "gap-1.5",
-        icon: "h-4 w-4"
-      }
-    }
-  },
-  defaultVariants: {
-    status: "default",
-    focus: "low",
-    size: "md"
-  },
-  compoundVariants: [
-    {
-      status: ["info", "success", "warning", "error"],
-      focus: "high",
-      class: {
-        button: "text-white",
-        closeButton: "text-white"
-      }
-    },
-    {
-      status: "default",
-      focus: "high",
-      class: {
-        button: "hover:bg-primary-hover",
-        closeButton: "hover:bg-primary-hover"
-      }
-    },
-    {
-      status: "info",
-      focus: "high",
-      class: {
-        button: "bg-status-info hover:bg-status-info-hover",
-        closeButton: "bg-status-info hover:bg-status-info-hover"
-      }
-    },
-    {
-      status: "success",
-      focus: "high",
-      class: {
-        button: "bg-status-success hover:bg-status-success-hover",
-        closeButton: "bg-status-success hover:bg-status-success-hover"
-      }
-    },
-    {
-      status: "warning",
-      focus: "high",
-      class: {
-        button: "bg-status-warning hover:bg-status-warning-hover",
-        closeButton: "bg-status-warning hover:bg-status-warning-hover"
-      }
-    },
-    {
-      status: "error",
-      focus: "high",
-      class: {
-        button: "bg-status-error hover:bg-status-error-hover",
-        closeButton: "bg-status-error hover:bg-status-error-hover"
-      }
-    }
-  ]
-}), z = D.forwardRef(
-  (A, p) => {
-    var n = A, { className: t, children: s, status: r, size: e, focus: l, onClick: v, onClose: m } = n, f = h(n, ["className", "children", "status", "size", "focus", "onClick", "onClose"]);
-    const { base: x, button: w, divider: y, closeButton: B, container: N, icon: u } = X({ status: r, size: e, focus: l });
-    return /* @__PURE__ */ k("div", { ref: p, className: x(), children: [
-      /* @__PURE__ */ a(
-        q,
-        d(g({
-          className: w({ className: t }),
-          size: e,
-          onClick: v,
-          containerClassName: N(),
-          iconClassName: u()
-        }, f), {
-          children: s
-        })
-      ),
-      /* @__PURE__ */ a(R, { orientation: "vertical", className: y() }),
-      /* @__PURE__ */ a(
-        _,
-        {
-          icon: T,
-          className: B({ className: t }),
-          onClick: m,
-          size: e,
-          iconClassName: u()
-        }
-      )
-    ] });
-  }
-);
-z.displayName = "Tag";
+import { e as T, T as e, a as g, b as r, c as o, d as p } from "../Tag-DdHXTyKF.js";
 export {
-  z as Tag
+  T as Tag,
+  e as TagBase,
+  g as TagButton,
+  r as TagClose,
+  o as TagDivider,
+  p as TagWrapper
 };
 //# sourceMappingURL=tag.js.map

package/dist/components/tag.js.map

@@ -1 +1 @@
-{"version":3,"file":"tag.js","sources":["../../src/components/tag/Tag.tsx"],"sourcesContent":["import { PropsWithChildren } from \"react\";\r\nimport React from \"react\";\r\nimport { tv, VariantProps } from \"tailwind-variants\";\r\nimport { Divider } from \"../divider/Divider\";\r\nimport { IconButton } from \"../button/icon-button/IconButton\";\r\nimport { X } from \"lucide-react\";\r\nimport { Button, ButtonProps } from \"../button/button/Button\";\r\n\r\nconst tagVariants = tv({\r\n\tslots: {\r\n\t\tcontainer: \"\",\r\n\t\tbase: \"inline-flex items-center rounded-sm\",\r\n\t\tbutton: \"inline-flex items-center justify-center overflow-hidden rounded-sm rounded-r-none border border-r-0 font-medium leading-none\",\r\n\t\tdivider: \"\",\r\n\t\tcloseButton:\r\n\t\t\t\"inline-flex items-center justify-center overflow-hidden rounded-sm rounded-l-none border border-l-0\",\r\n\t\ticon: \"aspect-square flex-shrink-0\"\r\n\t},\r\n\tvariants: {\r\n\t\tstatus: {\r\n\t\t\tdefault: {\r\n\t\t\t\tbutton: \"border-primary-border bg-primary-bg text-primary-fg hover:bg-primary-bg-hover\",\r\n\t\t\t\tdivider: \"bg-primary-border\",\r\n\t\t\t\tcloseButton: \"border-primary-border bg-primary-bg text-primary-fg hover:bg-primary-bg-hover\"\r\n\t\t\t},\r\n\t\t\tinfo: {\r\n\t\t\t\tbutton: \"border-status-info-border bg-status-info-bg text-status-info hover:bg-status-info-bg-hover\",\r\n\t\t\t\tdivider: \"bg-status-info-border\",\r\n\t\t\t\tcloseButton:\r\n\t\t\t\t\t\"border-status-info-border bg-status-info-bg text-status-info hover:bg-status-info-bg-hover\"\r\n\t\t\t},\r\n\t\t\tsuccess: {\r\n\t\t\t\tbutton: \"border-status-success-border bg-status-success-bg text-status-success hover:bg-status-success-bg-hover\",\r\n\t\t\t\tdivider: \"bg-status-success-border\",\r\n\t\t\t\tcloseButton:\r\n\t\t\t\t\t\"border-status-success-border bg-status-success-bg text-status-success hover:bg-status-success-bg-hover\"\r\n\t\t\t},\r\n\t\t\twarning: {\r\n\t\t\t\tbutton: \"border-status-warning-border bg-status-warning-bg text-status-warning hover:bg-status-warning-bg-hover\",\r\n\t\t\t\tdivider: \"bg-status-warning-border\",\r\n\t\t\t\tcloseButton:\r\n\t\t\t\t\t\"border-status-warning-border bg-status-warning-bg text-status-warning hover:bg-status-warning-bg-hover\"\r\n\t\t\t},\r\n\t\t\terror: {\r\n\t\t\t\tbutton: \"border-status-error-secondary-border bg-status-error-bg text-status-error hover:bg-status-error-bg-hover\",\r\n\t\t\t\tdivider: \"bg-status-error-border\",\r\n\t\t\t\tcloseButton:\r\n\t\t\t\t\t\"border-status-error-secondary-border bg-status-error-bg text-status-error hover:bg-status-error-bg-hover\"\r\n\t\t\t}\r\n\t\t},\r\n\t\tfocus: {\r\n\t\t\tlow: {\r\n\t\t\t\tbase: \"shadow-sm\",\r\n\t\t\t\tcloseButton: \"text-primary-fg shadow-none\",\r\n\t\t\t\tbutton: \"shadow-none\"\r\n\t\t\t},\r\n\t\t\thigh: {\r\n\t\t\t\tbase: \"shadow-base\",\r\n\t\t\t\tbutton: \"border-transparent bg-primary-accent text-primary-bg shadow-none\",\r\n\t\t\t\tcloseButton: \"border-transparent bg-primary-accent text-primary-bg shadow-none\"\r\n\t\t\t}\r\n\t\t},\r\n\t\tsize: {\r\n\t\t\tsm: {\r\n\t\t\t\tbase: \"h-5\",\r\n\t\t\t\tbutton: \"h-5 px-1.5 py-1 text-xs\",\r\n\t\t\t\tcloseButton: \"h-5 p-1 text-xs\",\r\n\t\t\t\tcontainer: \"gap-1\",\r\n\t\t\t\ticon: \"h-3 w-3\"\r\n\t\t\t},\r\n\t\t\tmd: {\r\n\t\t\t\tbase: \"h-6\",\r\n\t\t\t\tbutton: \"h-6 px-1.5 py-1 text-sm\",\r\n\t\t\t\tcloseButton: \"h-6 p-1 text-sm\",\r\n\t\t\t\tcontainer: \"gap-1\",\r\n\t\t\t\ticon: \"h-3.5 w-3.5\"\r\n\t\t\t},\r\n\t\t\tlg: {\r\n\t\t\t\tbase: \"h-7\",\r\n\t\t\t\tbutton: \"h-7 px-2 py-1 text-base\",\r\n\t\t\t\tcloseButton: \"h-7 p-1.5 text-base\",\r\n\t\t\t\tcontainer: \"gap-1.5\",\r\n\t\t\t\ticon: \"h-4 w-4\"\r\n\t\t\t}\r\n\t\t}\r\n\t},\r\n\tdefaultVariants: {\r\n\t\tstatus: \"default\",\r\n\t\tfocus: \"low\",\r\n\t\tsize: \"md\"\r\n\t},\r\n\tcompoundVariants: [\r\n\t\t{\r\n\t\t\tstatus: [\"info\", \"success\", \"warning\", \"error\"],\r\n\t\t\tfocus: \"high\",\r\n\t\t\tclass: {\r\n\t\t\t\tbutton: \"text-white\",\r\n\t\t\t\tcloseButton: \"text-white\"\r\n\t\t\t}\r\n\t\t},\r\n\t\t{\r\n\t\t\tstatus: \"default\",\r\n\t\t\tfocus: \"high\",\r\n\t\t\tclass: {\r\n\t\t\t\tbutton: \"hover:bg-primary-hover\",\r\n\t\t\t\tcloseButton: \"hover:bg-primary-hover\"\r\n\t\t\t}\r\n\t\t},\r\n\t\t{\r\n\t\t\tstatus: \"info\",\r\n\t\t\tfocus: \"high\",\r\n\t\t\tclass: {\r\n\t\t\t\tbutton: \"bg-status-info hover:bg-status-info-hover\",\r\n\t\t\t\tcloseButton: \"bg-status-info hover:bg-status-info-hover\"\r\n\t\t\t}\r\n\t\t},\r\n\t\t{\r\n\t\t\tstatus: \"success\",\r\n\t\t\tfocus: \"high\",\r\n\t\t\tclass: {\r\n\t\t\t\tbutton: \"bg-status-success hover:bg-status-success-hover\",\r\n\t\t\t\tcloseButton: \"bg-status-success hover:bg-status-success-hover\"\r\n\t\t\t}\r\n\t\t},\r\n\t\t{\r\n\t\t\tstatus: \"warning\",\r\n\t\t\tfocus: \"high\",\r\n\t\t\tclass: {\r\n\t\t\t\tbutton: \"bg-status-warning hover:bg-status-warning-hover\",\r\n\t\t\t\tcloseButton: \"bg-status-warning hover:bg-status-warning-hover\"\r\n\t\t\t}\r\n\t\t},\r\n\t\t{\r\n\t\t\tstatus: \"error\",\r\n\t\t\tfocus: \"high\",\r\n\t\t\tclass: {\r\n\t\t\t\tbutton: \"bg-status-error hover:bg-status-error-hover\",\r\n\t\t\t\tcloseButton: \"bg-status-error hover:bg-status-error-hover\"\r\n\t\t\t}\r\n\t\t}\r\n\t]\r\n});\r\n\r\nexport type TagProps = ButtonProps &\r\n\tVariantProps<typeof tagVariants> & {\r\n\t\tonClose?: () => void;\r\n\t};\r\n\r\nexport const Tag = React.forwardRef<HTMLDivElement, PropsWithChildren<TagProps>>(\r\n\t({ className, children, status, size, focus, onClick, onClose, ...props }, ref) => {\r\n\t\tconst { base, button, divider, closeButton, container, icon } = tagVariants({ status, size, focus });\r\n\r\n\t\treturn (\r\n\t\t\t<div ref={ref} className={base()}>\r\n\t\t\t\t<Button\r\n\t\t\t\t\tclassName={button({ className })}\r\n\t\t\t\t\tsize={size}\r\n\t\t\t\t\tonClick={onClick}\r\n\t\t\t\t\tcontainerClassName={container()}\r\n\t\t\t\t\ticonClassName={icon()}\r\n\t\t\t\t\t{...props}\r\n\t\t\t\t>\r\n\t\t\t\t\t{children}\r\n\t\t\t\t</Button>\r\n\r\n\t\t\t\t<Divider orientation=\"vertical\" className={divider()} />\r\n\r\n\t\t\t\t<IconButton\r\n\t\t\t\t\ticon={X}\r\n\t\t\t\t\tclassName={closeButton({ className })}\r\n\t\t\t\t\tonClick={onClose}\r\n\t\t\t\t\tsize={size}\r\n\t\t\t\t\ticonClassName={icon()}\r\n\t\t\t\t/>\r\n\t\t\t</div>\r\n\t\t);\r\n\t}\r\n);\r\n\r\nTag.displayName = \"Tag\";\r\n"],"names":["tagVariants","tv","Tag","React","_a","ref","_b","className","children","status","size","focus","onClick","onClose","props","__objRest","base","button","divider","closeButton","container","icon","jsxs","jsx","Button","__spreadProps","__spreadValues","Divider","IconButton","X"],"mappings":"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"}
+{"version":3,"file":"tag.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/text/Text.d.ts

@@ -0,0 +1,9 @@
+import { default as React } from 'react';
+type TextVariants = {
+    size?: "xs" | "sm";
+};
+export type TextProps = React.HTMLAttributes<HTMLDivElement> & React.PropsWithChildren & TextVariants;
+export declare const Text: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & {
+    children?: React.ReactNode | undefined;
+} & TextVariants & React.RefAttributes<HTMLDivElement>>;
+export {};

package/dist/components/text/Text.stories.d.ts

@@ -0,0 +1,24 @@
+import { StoryObj } from '@storybook/react';
+import { ForwardRefExoticComponent, HTMLAttributes, ReactNode, RefAttributes } from 'react';
+declare const meta: {
+    component: ForwardRefExoticComponent< HTMLAttributes<HTMLDivElement> & {
+        children?: ReactNode | undefined;
+    } & {
+        size?: "xs" | "sm";
+    } & RefAttributes<HTMLDivElement>>;
+    parameters: {
+        layout: string;
+    };
+    tags: string[];
+    argTypes: {
+        size: {
+            options: string[];
+            control: {
+                type: "radio";
+            };
+        };
+    };
+};
+export default meta;
+type Story = StoryObj<typeof meta>;
+export declare const Default: Story;

package/dist/components/text/index.d.ts

@@ -0,0 +1 @@
+export { Text, type TextProps } from './Text';

package/dist/components/text.d.ts

@@ -0,0 +1,2 @@
+export * from './text/index'
+export {}

package/dist/components/text.js

@@ -0,0 +1,5 @@
+import { T as r } from "../Text-DeBE8AKl.js";
+export {
+  r as Text
+};
+//# sourceMappingURL=text.js.map

package/dist/components/text.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"text.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/textarea/autogrow-textarea/AutogrowTextarea.d.ts

@@ -0,0 +1,12 @@
+import { default as React } from 'react';
+import { default as TextareaAutosize } from 'react-textarea-autosize';
+export type AutogrowTextareaProps = React.ComponentProps<typeof TextareaAutosize> & {
+    /** Текст сообщения об ошибке. При наличии делает поле невалидным */
+    error?: string;
+};
+/**
+ * Стилизованный компонент textarea с автоматическим увеличением высоты.
+ * Использует библиотеку react-textarea-autosize для надежной работы с min-height и max-height.
+ */
+export declare const AutogrowTextarea: React.ForwardRefExoticComponent<Omit<AutogrowTextareaProps, "ref"> & React.RefAttributes<HTMLTextAreaElement>>;
+export default AutogrowTextarea;

package/dist/components/textarea/autogrow-textarea/AutogrowTextarea.stories.d.ts

@@ -0,0 +1,10 @@
+import { Meta, StoryObj } from '@storybook/react';
+import { default as AutogrowTextarea } from './AutogrowTextarea';
+declare const meta: Meta<typeof AutogrowTextarea>;
+export default meta;
+type Story = StoryObj<typeof AutogrowTextarea>;
+export declare const Default: Story;
+export declare const Playground: Story;
+export declare const WithMaxRows: Story;
+export declare const WithMinRows: Story;
+export declare const WithRelativeUnits: Story;

package/dist/components/textarea/index.d.ts

@@ -0,0 +1,2 @@
+export { Textarea } from './textarea/Textarea';
+export { AutogrowTextarea } from './autogrow-textarea/AutogrowTextarea';

package/dist/components/textarea/textarea/Textarea.d.ts

@@ -0,0 +1,14 @@
+import { default as React } from 'react';
+export interface TextareaVariants {
+    resize?: "none" | "vertical" | "horizontal" | "both";
+}
+export type TextareaProps = React.ComponentProps<"textarea"> & TextareaVariants & {
+    /** Текст сообщения об ошибке. При наличии делает поле невалидным */
+    error?: string;
+};
+/**
+ * Стилизованный компонент textarea для многострочного ввода текста.
+ * Поддерживает все стандартные свойства textarea элемента.
+ */
+export declare const Textarea: React.ForwardRefExoticComponent<Omit<TextareaProps, "ref"> & React.RefAttributes<HTMLTextAreaElement>>;
+export default Textarea;

package/dist/components/textarea/textarea/Textarea.stories.d.ts

@@ -0,0 +1,7 @@
+import { Meta, StoryObj } from '@storybook/react';
+import { default as Textarea } from './Textarea';
+declare const meta: Meta<typeof Textarea>;
+export default meta;
+type Story = StoryObj<typeof Textarea>;
+export declare const Default: Story;
+export declare const Playground: Story;

package/dist/components/textarea.d.ts

@@ -0,0 +1,2 @@
+export * from './textarea/index'
+export {}