@cloud-ru/uikit-product-fields-predefined 2.4.8-preview-5e39e65e.0 → 3.0.1-preview-d01a0cca.0

package/CHANGELOG.md

@@ -3,6 +3,17 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# 3.0.0 (2026-05-14)
+
+
+### BREAKING CHANGES
+
+
+* **LK-7388:** remove FieldAi ([95b0317](https://github.com/cloud-ru-tech/uikit-product/commit/95b03178739bd283313142b5cc352681cdf68ba7))
+
+
+
+
 ## 2.4.7 (2026-04-30)
 
 ### Only dependencies have been changed

package/README.md

@@ -72,43 +72,6 @@
 | afterClose | `VoidFunction` | - | Коллбек после закрытия модального окна/дровера |
 | entityIcon | `JSXElementConstructor<{ size?: number; className?: string; }>` | - | Иконка сервиса |
 | permission | "none" \| "canRead" \| "canCreate" | - | Управление состоянием компонента в зависимости от прав пользователя (по дефолту permission = 'canCreate') |
-## FieldAi
-### Props
-| name | type | default value | description |
-|------|------|---------------|-------------|
-| layoutType* | enum LayoutType: `"mobile"`, `"tablet"`, `"desktop"`, `"desktopSmall"` | - |  |
-| onSubmit* | `(value: string) => void` | - | Колбек действия при отправке |
-| value | `string` | - | HTML-аттрибут value |
-| onChange | `(value: string, e?: ChangeEvent<HTMLTextAreaElement>) => void` | - | Колбек смены значения |
-| inputMode | enum InputMode: `"search"`, `"none"`, `"text"`, `"tel"`, `"email"`, `"decimal"`, `"numeric"`, `"url"` | - | Режим работы экранной клавиатуры |
-| id | `string` | - | HTML-аттрибут id |
-| name | `string` | - | HTML-аттрибут name |
-| maxLength | `number` | - | Максимальное кол-во символов |
-| disabled | `boolean` | - | Является ли поле деактивированным |
-| readonly | `boolean` | - | Является ли поле доступным только на чтение |
-| onFocus | `FocusEventHandler<HTMLTextAreaElement>` | - | Колбек получения фокуса |
-| onBlur | `FocusEventHandler<HTMLTextAreaElement>` | - | Колбек потери фокуса |
-| autoFocus | `boolean` | - | Включен ли авто-фокус |
-| onKeyDown | `KeyboardEventHandler<HTMLTextAreaElement>` | - | Колбек нажатия клавиши клавиатуры |
-| className | `string` | - | CSS-класс |
-| caption | `string` | - | Подпись справа от лейбла |
-| hint | `string` | - | Подсказка внизу |
-| showHintIcon | `boolean` | - | Отображать иконку подсказки |
-| validationState | enum ValidationState: `"error"`, `"default"`, `"warning"`, `"success"` | - | Состояние валидации |
-| labelTooltipPlacement | enum Placement: `"left"`, `"left-start"`, `"left-end"`, `"right"`, `"right-start"`, `"right-end"`, `"top"`, `"top-start"`, `"top-end"`, `"bottom"`, `"bottom-start"`, `"bottom-end"` | top | Расположение подсказки лейбла |
-| error | `string` | - |  |
-| allowMoreThanMaxLength | `boolean` | - | Можно ли вводить больше разрешённого кол-ва символов |
-| showCopyButton | `boolean` | - | Отображение кнопки Копировать для поля (актуально только для `readonly = true`) |
-| onCopyButtonClick | `() => void` | - | Колбек клика по кнопке Копировать для поля |
-| showClearButton | `boolean` | true | Отображение кнопки очистки поля |
-| minRows | `number` | 3 | Минимальное кол-во строк, до которого размер поля может быть увеличен |
-| maxRows | `number` | 1000 | Максимальное кол-во строк, до которого размер поля может быть увеличен |
-| resizable | `boolean` | - | Может ли ли пользователь изменять размеры поля (если св-во не включено, поле автоматически меняет свой размер) |
-| secure | `boolean \| "password"` | - | Режим ввода sensitive данных (пароля, API ключей, токенов, etc) |
-| onResetContextClick | `() => void` | - | Действие при клике по кнопке сброса контекста |
-| onCancelSecure | `() => void` | - | Действие для отмены секьюрности поля |
-| ref | `LegacyRef<HTMLInputElement>` | - | Allows getting a ref to the component instance. Once the component unmounts, React will set `ref.current` to `null` (or call the ref with `null` if you passed a callback ref). @see {@link https://react.dev/learn/referencing-values-with-refs#refs-and-the-dom React Docs} |
-| key | `Key` | - |  |
 ## FieldChat
 ### Props
 | name | type | default value | description |
@@ -369,6 +332,7 @@
 | resendCode | `ResendCodeProps` | - | Компонент отправки нового кода |
 | focusEffects | `readonly FieldCodeFocusEffect[]` | - | Сценарии автофокуса; по умолчанию — первая ячейка при монтировании и после сброса (см. `FieldCodeFocusEffect`) |
 | invalidCode | `string` | - | Сообщение при неверном коде, если не передан свой `error` |
+| stretchCells | `boolean` | - | Растягивать ячейки на всю доступную ширину; иначе фиксированная ширина по `size` |
 | value | `string` | - | Значение кода |
 | onChange | `(code: string) => void` | - | Колбек изменения значения |
 | onComplete | `(code: string) => void` | - | Колбек достижения ввода всех символов кода |

package/dist/cjs/components/FieldCode/FieldCode.d.ts

@@ -26,6 +26,8 @@ export type FieldCodeOwnProps = {
     focusEffects?: readonly FieldCodeFocusEffect[];
     /** Сообщение при неверном коде, если не передан свой `error` */
     invalidCode?: string;
+    /** Растягивать ячейки на всю доступную ширину; иначе фиксированная ширина по `size` */
+    stretchCells?: boolean;
 };
 export type FieldCodeProps = FieldCodeOwnProps & Omit<UseCodeInputParams, 'moveFocus'> & Pick<FieldDecoratorProps, 'size' | 'disabled' | 'label' | 'error' | 'data-test-id'>;
 export declare const FieldCode: import("react").ForwardRefExoticComponent<FieldCodeOwnProps & Omit<UseCodeInputParams, "moveFocus"> & Pick<FieldDecoratorProps, "size" | "label" | "error" | "disabled" | "data-test-id"> & import("react").RefAttributes<FieldCodeRef>>;

package/dist/cjs/components/FieldCode/FieldCode.js

@@ -15,7 +15,7 @@ const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
 const utils_1 = require("./utils");
 exports.FieldCode = (0, react_1.forwardRef)(function FieldCode(props, ref) {
     var _a;
-    const { codeLength, className, cellClassName, value, onChange, spacing, onComplete, size, disabled, label, error, invalidCode, showEmptyChars, resendCode, focusEffects = constants_1.FIELD_CODE_DEFAULT_FOCUS_EFFECTS, 'data-test-id': dataTestId, } = props;
+    const { codeLength, className, cellClassName, value, onChange, spacing, onComplete, size, disabled, label, error, invalidCode, showEmptyChars, resendCode, focusEffects = constants_1.FIELD_CODE_DEFAULT_FOCUS_EFFECTS, stretchCells = false, 'data-test-id': dataTestId, } = props;
     const { inputsRef, moveFocus, blurFields } = (0, hooks_1.useFocusCell)(codeLength);
     const { code, cellHandlers, onChangeCode } = (0, hooks_1.useCodeInput)({ value, onChange, codeLength, moveFocus, onComplete });
     const { resetCode } = (0, hooks_1.useFieldHelpers)({
@@ -38,11 +38,11 @@ exports.FieldCode = (0, react_1.forwardRef)(function FieldCode(props, ref) {
         size,
         error: resolvedError,
     };
-    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: (0, classnames_1.default)(styles_module_scss_1.default.fieldCode, className) }, (dataTestId ? { 'data-test-id': dataTestId } : undefined), { children: [(0, jsx_runtime_1.jsx)(fields_1.FieldDecorator, Object.assign({}, resolvedDecoratorProps, { children: (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.codeContainer, "data-size": size, children: code.map((char, index) => ((0, jsx_runtime_1.jsx)(components_1.Cell, { ref: inputRef => {
+    return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ className: (0, classnames_1.default)(styles_module_scss_1.default.fieldCode, className), "data-stretch-cells": stretchCells || undefined }, (dataTestId ? { 'data-test-id': dataTestId } : undefined), { children: [(0, jsx_runtime_1.jsx)(fields_1.FieldDecorator, Object.assign({ className: styles_module_scss_1.default.fieldDecorator }, resolvedDecoratorProps, { children: (0, jsx_runtime_1.jsx)("div", { className: styles_module_scss_1.default.codeContainer, "data-size": size, "data-stretch-cells": stretchCells || undefined, children: code.map((char, index) => ((0, jsx_runtime_1.jsx)(components_1.Cell, { ref: inputRef => {
                             if (inputRef) {
                                 inputsRef.current[index] = inputRef;
                             }
-                        }, className: (0, classnames_1.default)((spacing === null || spacing === void 0 ? void 0 : spacing.includes(index)) && styles_module_scss_1.default.cellSpacing, cellClassName), size: size, value: char, disabled: disabled, autoComplete: index === 0 ? 'one-time-code' : undefined, onKeyDown: e => cellHandlers.onKeyDown(e, index), onPaste: cellHandlers.onPaste, onChange: e => cellHandlers.onChange(e, index), validationState: (0, utils_1.getCellValidationState)(char, showEmptyChars, Boolean(resolvedError)) }, index))) }) })), resendCode ? (0, jsx_runtime_1.jsx)(components_1.ResendCode, Object.assign({}, resendCode, { size: (_a = resendCode.size) !== null && _a !== void 0 ? _a : size })) : null] })));
+                        }, className: (0, classnames_1.default)((spacing === null || spacing === void 0 ? void 0 : spacing.includes(index)) && styles_module_scss_1.default.cellSpacing, cellClassName), stretchCells: stretchCells, size: size, value: char, disabled: disabled, autoComplete: index === 0 ? 'one-time-code' : undefined, onKeyDown: e => cellHandlers.onKeyDown(e, index), onPaste: cellHandlers.onPaste, onChange: e => cellHandlers.onChange(e, index), validationState: (0, utils_1.getCellValidationState)(char, showEmptyChars, Boolean(resolvedError)) }, index))) }) })), resendCode ? (0, jsx_runtime_1.jsx)(components_1.ResendCode, Object.assign({}, resendCode, { size: (_a = resendCode.size) !== null && _a !== void 0 ? _a : size })) : null] })));
 });
 var constants_2 = require("./constants");
 Object.defineProperty(exports, "FIELD_CODE_DEFAULT_FOCUS_EFFECTS", { enumerable: true, get: function () { return constants_2.FIELD_CODE_DEFAULT_FOCUS_EFFECTS; } });

package/dist/cjs/components/FieldCode/components/Cell/Cell.d.ts

@@ -2,4 +2,6 @@ import { FieldTextProps } from '@snack-uikit/fields';
 export declare const Cell: import("react").ForwardRefExoticComponent<{
     /** CSS-класс ячейки кода */
     className?: string;
+    /** Растягивать ячейку на всю доступную ширину */
+    stretchCells?: boolean;
 } & Pick<FieldTextProps, "size" | "onPaste" | "onChange" | "onKeyDown" | "value" | "disabled" | "autoComplete" | "validationState"> & import("react").RefAttributes<HTMLInputElement>>;

package/dist/cjs/components/FieldCode/components/Cell/Cell.js

@@ -22,6 +22,6 @@ const fields_1 = require("@snack-uikit/fields");
 const constants_1 = require("../../constants");
 const styles_module_scss_1 = __importDefault(require('./styles.module.css'));
 exports.Cell = (0, react_1.forwardRef)((props, ref) => {
-    const { className, size, value } = props, fieldCellProps = __rest(props, ["className", "size", "value"]);
-    return ((0, jsx_runtime_1.jsx)(fields_1.FieldText, Object.assign({ inputMode: 'numeric', ref: ref, className: (0, classnames_1.default)(styles_module_scss_1.default.cell, className), "data-size": size, showClearButton: false, value: value === constants_1.ZERO_WIDTH_SPACE ? '' : value, size: size }, fieldCellProps)));
+    const { className, size, stretchCells, value } = props, fieldCellProps = __rest(props, ["className", "size", "stretchCells", "value"]);
+    return ((0, jsx_runtime_1.jsx)(fields_1.FieldText, Object.assign({ inputMode: 'numeric', ref: ref, className: (0, classnames_1.default)(styles_module_scss_1.default.cell, className), "data-size": size, "data-stretch-cells": stretchCells || undefined, showClearButton: false, value: value === constants_1.ZERO_WIDTH_SPACE ? '' : value, size: size }, fieldCellProps)));
 });

package/dist/cjs/components/FieldCode/components/Cell/styles.module.css

@@ -1,3 +1,19 @@
+.cell{
+  flex-shrink:0;
+}
 .cell input{
   text-align:center;
+}
+.cell[data-size=s]:not([data-stretch-cells]){
+  width:32px;
+}
+.cell[data-size=m]:not([data-stretch-cells]){
+  width:40px;
+}
+.cell[data-size=l]:not([data-stretch-cells]){
+  width:48px;
+}
+.cell[data-stretch-cells]{
+  flex:1 1 0;
+  min-width:0;
 }

package/dist/cjs/components/FieldCode/styles.module.css

@@ -4,6 +4,13 @@
   align-items:center;
   gap:8px;
 }
+.fieldCode[data-stretch-cells]{
+  width:100%;
+}
+
+.fieldDecorator{
+  width:unset;
+}
 
 .codeContainer{
   display:flex;

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

@@ -1,6 +1,5 @@
 export * from './FieldPhone';
 export * from './SelectCreate';
-export * from './FieldAi';
 export * from './FieldChat';
 export * from './AIDisclaimer';
 export * from './FieldName';

package/dist/cjs/components/index.js

@@ -16,7 +16,6 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
 Object.defineProperty(exports, "__esModule", { value: true });
 __exportStar(require("./FieldPhone"), exports);
 __exportStar(require("./SelectCreate"), exports);
-__exportStar(require("./FieldAi"), exports);
 __exportStar(require("./FieldChat"), exports);
 __exportStar(require("./AIDisclaimer"), exports);
 __exportStar(require("./FieldName"), exports);

package/dist/esm/components/FieldCode/FieldCode.d.ts

@@ -26,6 +26,8 @@ export type FieldCodeOwnProps = {
     focusEffects?: readonly FieldCodeFocusEffect[];
     /** Сообщение при неверном коде, если не передан свой `error` */
     invalidCode?: string;
+    /** Растягивать ячейки на всю доступную ширину; иначе фиксированная ширина по `size` */
+    stretchCells?: boolean;
 };
 export type FieldCodeProps = FieldCodeOwnProps & Omit<UseCodeInputParams, 'moveFocus'> & Pick<FieldDecoratorProps, 'size' | 'disabled' | 'label' | 'error' | 'data-test-id'>;
 export declare const FieldCode: import("react").ForwardRefExoticComponent<FieldCodeOwnProps & Omit<UseCodeInputParams, "moveFocus"> & Pick<FieldDecoratorProps, "size" | "label" | "error" | "disabled" | "data-test-id"> & import("react").RefAttributes<FieldCodeRef>>;

package/dist/esm/components/FieldCode/FieldCode.js

@@ -9,7 +9,7 @@ import styles from './styles.module.css';
 import { getCellValidationState } from './utils';
 export const FieldCode = forwardRef(function FieldCode(props, ref) {
     var _a;
-    const { codeLength, className, cellClassName, value, onChange, spacing, onComplete, size, disabled, label, error, invalidCode, showEmptyChars, resendCode, focusEffects = FIELD_CODE_DEFAULT_FOCUS_EFFECTS, 'data-test-id': dataTestId, } = props;
+    const { codeLength, className, cellClassName, value, onChange, spacing, onComplete, size, disabled, label, error, invalidCode, showEmptyChars, resendCode, focusEffects = FIELD_CODE_DEFAULT_FOCUS_EFFECTS, stretchCells = false, 'data-test-id': dataTestId, } = props;
     const { inputsRef, moveFocus, blurFields } = useFocusCell(codeLength);
     const { code, cellHandlers, onChangeCode } = useCodeInput({ value, onChange, codeLength, moveFocus, onComplete });
     const { resetCode } = useFieldHelpers({
@@ -32,10 +32,10 @@ export const FieldCode = forwardRef(function FieldCode(props, ref) {
         size,
         error: resolvedError,
     };
-    return (_jsxs("div", Object.assign({ className: cn(styles.fieldCode, className) }, (dataTestId ? { 'data-test-id': dataTestId } : undefined), { children: [_jsx(FieldDecorator, Object.assign({}, resolvedDecoratorProps, { children: _jsx("div", { className: styles.codeContainer, "data-size": size, children: code.map((char, index) => (_jsx(Cell, { ref: inputRef => {
+    return (_jsxs("div", Object.assign({ className: cn(styles.fieldCode, className), "data-stretch-cells": stretchCells || undefined }, (dataTestId ? { 'data-test-id': dataTestId } : undefined), { children: [_jsx(FieldDecorator, Object.assign({ className: styles.fieldDecorator }, resolvedDecoratorProps, { children: _jsx("div", { className: styles.codeContainer, "data-size": size, "data-stretch-cells": stretchCells || undefined, children: code.map((char, index) => (_jsx(Cell, { ref: inputRef => {
                             if (inputRef) {
                                 inputsRef.current[index] = inputRef;
                             }
-                        }, className: cn((spacing === null || spacing === void 0 ? void 0 : spacing.includes(index)) && styles.cellSpacing, cellClassName), size: size, value: char, disabled: disabled, autoComplete: index === 0 ? 'one-time-code' : undefined, onKeyDown: e => cellHandlers.onKeyDown(e, index), onPaste: cellHandlers.onPaste, onChange: e => cellHandlers.onChange(e, index), validationState: getCellValidationState(char, showEmptyChars, Boolean(resolvedError)) }, index))) }) })), resendCode ? _jsx(ResendCode, Object.assign({}, resendCode, { size: (_a = resendCode.size) !== null && _a !== void 0 ? _a : size })) : null] })));
+                        }, className: cn((spacing === null || spacing === void 0 ? void 0 : spacing.includes(index)) && styles.cellSpacing, cellClassName), stretchCells: stretchCells, size: size, value: char, disabled: disabled, autoComplete: index === 0 ? 'one-time-code' : undefined, onKeyDown: e => cellHandlers.onKeyDown(e, index), onPaste: cellHandlers.onPaste, onChange: e => cellHandlers.onChange(e, index), validationState: getCellValidationState(char, showEmptyChars, Boolean(resolvedError)) }, index))) }) })), resendCode ? _jsx(ResendCode, Object.assign({}, resendCode, { size: (_a = resendCode.size) !== null && _a !== void 0 ? _a : size })) : null] })));
 });
 export { FIELD_CODE_DEFAULT_FOCUS_EFFECTS } from './constants';

package/dist/esm/components/FieldCode/components/Cell/Cell.d.ts

@@ -2,4 +2,6 @@ import { FieldTextProps } from '@snack-uikit/fields';
 export declare const Cell: import("react").ForwardRefExoticComponent<{
     /** CSS-класс ячейки кода */
     className?: string;
+    /** Растягивать ячейку на всю доступную ширину */
+    stretchCells?: boolean;
 } & Pick<FieldTextProps, "size" | "onPaste" | "onChange" | "onKeyDown" | "value" | "disabled" | "autoComplete" | "validationState"> & import("react").RefAttributes<HTMLInputElement>>;

package/dist/esm/components/FieldCode/components/Cell/Cell.js

@@ -16,6 +16,6 @@ import { FieldText } from '@snack-uikit/fields';
 import { ZERO_WIDTH_SPACE } from '../../constants';
 import styles from './styles.module.css';
 export const Cell = forwardRef((props, ref) => {
-    const { className, size, value } = props, fieldCellProps = __rest(props, ["className", "size", "value"]);
-    return (_jsx(FieldText, Object.assign({ inputMode: 'numeric', ref: ref, className: cn(styles.cell, className), "data-size": size, showClearButton: false, value: value === ZERO_WIDTH_SPACE ? '' : value, size: size }, fieldCellProps)));
+    const { className, size, stretchCells, value } = props, fieldCellProps = __rest(props, ["className", "size", "stretchCells", "value"]);
+    return (_jsx(FieldText, Object.assign({ inputMode: 'numeric', ref: ref, className: cn(styles.cell, className), "data-size": size, "data-stretch-cells": stretchCells || undefined, showClearButton: false, value: value === ZERO_WIDTH_SPACE ? '' : value, size: size }, fieldCellProps)));
 });

package/dist/esm/components/FieldCode/components/Cell/styles.module.css

@@ -1,3 +1,19 @@
+.cell{
+  flex-shrink:0;
+}
 .cell input{
   text-align:center;
+}
+.cell[data-size=s]:not([data-stretch-cells]){
+  width:32px;
+}
+.cell[data-size=m]:not([data-stretch-cells]){
+  width:40px;
+}
+.cell[data-size=l]:not([data-stretch-cells]){
+  width:48px;
+}
+.cell[data-stretch-cells]{
+  flex:1 1 0;
+  min-width:0;
 }

package/dist/esm/components/FieldCode/styles.module.css

@@ -4,6 +4,13 @@
   align-items:center;
   gap:8px;
 }
+.fieldCode[data-stretch-cells]{
+  width:100%;
+}
+
+.fieldDecorator{
+  width:unset;
+}
 
 .codeContainer{
   display:flex;

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

@@ -1,6 +1,5 @@
 export * from './FieldPhone';
 export * from './SelectCreate';
-export * from './FieldAi';
 export * from './FieldChat';
 export * from './AIDisclaimer';
 export * from './FieldName';

package/dist/esm/components/index.js

@@ -1,6 +1,5 @@
 export * from './FieldPhone';
 export * from './SelectCreate';
-export * from './FieldAi';
 export * from './FieldChat';
 export * from './AIDisclaimer';
 export * from './FieldName';