@snack-uikit/fields 0.41.7-preview-85131e65.0 → 0.41.7

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.
 
+## 0.41.7 (2025-03-25)
+
+
+### Bug Fixes
+
+* **PDS-1778:** field select empty option fix ([7d21fd4](https://github.com/cloud-ru-tech/snack-uikit/commit/7d21fd4534f135ff48f7ef596364b3b5b39f2fd3))
+
+
+
+
+
 ## 0.41.6 (2025-03-19)
 
 ### Only dependencies have been changed

package/README.md

@@ -195,13 +195,40 @@ FieldStepper в основном предназначен для работы с
 ### Props
 | name | type | default value | description |
 |------|------|---------------|-------------|
+| open | `boolean` | - | Открыт color-picker |
+| onOpenChange | `(value: boolean) => void` | - | Колбек открытия пикера |
+| showCopyButton | `boolean` | - | Отображение кнопки копирования |
+| onCopyButtonClick | `() => void` | - | Колбек клика по кнопке Копировать для поля |
+| showClearButton | `boolean` | true | Отображение кнопки Очистки поля |
+| value | `string` | - | Значение input |
+| onChange | `(value: string) => void` | - |  |
+| withAlpha | `boolean` | - | Значение с альфаканалом |
+| autoApply | `boolean` | - | Применять изменения автоматически, если значение false - то изменения происходят по кнопке |
+| className | `string` | - | Класснейм |
+| colorMode | `{ hex?: boolean; rgb?: boolean; hsv?: boolean; }` | - |  |
+| id | `string` | - | Значение html-атрибута id |
+| name | `string` | - | Значение html-атрибута name |
+| disabled | `boolean` | - | Является ли поле деактивированным |
+| readonly | `boolean` | - | Является ли поле доступным только для чтения |
+| onFocus | `FocusEventHandler<HTMLInputElement>` | - | Колбек обработки получения фокуса |
+| onBlur | `FocusEventHandler<HTMLInputElement>` | - | Колбек обработки потери фокуса |
+| placeholder | `string` | - | Значение плейсхолдера |
+| label | `string` | - | Лейбл |
+| labelTooltip | `ReactNode` | - | Всплывающая подсказка лейбла |
+| required | `boolean` | - | Является ли поле обязательным |
+| caption | `string` | - | Подпись справа от лейбла |
+| hint | `string` | - | Подсказка внизу |
+| showHintIcon | `boolean` | - | Отображать иконку подсказки |
+| size | enum Size: `"s"`, `"m"`, `"l"` | SIZE.S | Размер |
+| validationState | enum ValidationState: `"error"`, `"default"`, `"warning"`, `"success"` | default | Состояние валидации |
+| 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` | - |  |
 | 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` | - |  |
 ## FieldDate
 ### Props
 | name | type | default value | description |
 |------|------|---------------|-------------|
-| buildCellProps* | `CalendarProps` | - |  |
 | mode* | "date" \| "date-time" | - |  |
 | open | `boolean` | - | Открыт date-picker |
 | onOpenChange | `(value: boolean) => void` | - | Колбек открытия пикера |
@@ -210,6 +237,7 @@ FieldStepper в основном предназначен для работы с
 | showCopyButton | `boolean` | - | Отображение кнопки копирования |
 | onCopyButtonClick | `() => void` | - | Колбек клика по кнопке Копировать для поля |
 | showClearButton | `boolean` | true | Отображение кнопки Очистки поля |
+| buildCellProps | `(date: Date, viewMode: ViewMode) => { isDisabled?: boolean; isHoliday?: boolean } ;` | - | Колбек установки свойств ячеек календаря. Вызывается на построение каждой ячейки. Принимает два параметра: <br> `Date` - дата ячейки <br> `ViewMode`: <br>  - `month` отображение месяца, каждая ячейка - 1 день <br>  - `year` отображение года, каждая ячейка - 1 месяц <br>  - `decade` отображение декады, каждая ячейка - 1 год <br><br> Колбек должен возвращать объект с полями, отвечающими за отключение и подкраску ячейки. |
 | id | `string` | - | Значение html-атрибута id |
 | name | `string` | - | Значение html-атрибута name |
 | disabled | `boolean` | - | Является ли поле деактивированным |
@@ -289,8 +317,61 @@ FieldStepper в основном предназначен для работы с
 ### Props
 | name | type | default value | description |
 |------|------|---------------|-------------|
+| options* | `OptionProps[]` | - |  |
+| id | `string` | - | Значение html-атрибута id |
+| name | `string` | - | Значение html-атрибута name |
+| disabled | `boolean` | false | Является ли поле деактивированным |
+| readonly | `boolean` | false false | Является ли поле доступным только для чтения |
+| onFocus | `FocusEventHandler<HTMLInputElement>` | - | Колбек обработки получения фокуса |
+| onBlur | `FocusEventHandler<HTMLInputElement>` | - | Колбек обработки потери фокуса |
+| placeholder | `string` | - | Значение плейсхолдера |
+| onKeyDown | `KeyboardEventHandler<HTMLInputElement>` | - | Колбек обработки начала нажатия клавиши клавиатуры |
+| className | `string` | - | CSS-класс |
+| label | `string` | - | Лейбл |
+| labelTooltip | `ReactNode` | - | Всплывающая подсказка лейбла |
+| required | `boolean` | - | Является ли поле обязательным |
+| caption | `string` | - | Подпись справа от лейбла |
+| hint | `string` | - | Подсказка внизу |
+| showHintIcon | `boolean` | - | Отображать иконку подсказки |
+| size | enum Size: `"s"`, `"m"`, `"l"` | - | Размер |
+| 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` | - |  |
+| loading | `boolean` | - |  |
+| prefix | `ReactNode` | - | Произвольный префикс для поля |
+| postfix | `ReactNode` | - | Произвольный постфикс для поля |
+| onChange | `OnChangeHandler<any>` | - | Controlled обработчик измения состояния |
+| value | `ItemId \| ItemId[]` | - | Controlled состояние |
+| defaultValue | `ItemId \| ItemId[]` | - | Начальное состояние |
+| showCopyButton | `boolean` | - | Отображение кнопки Копировать для поля (актуально только для `readonly = true`) |
+| showClearButton | `boolean` | true | Отображение кнопки очистки поля |
+| open | `boolean` | - |  |
+| onOpenChange | `(open: boolean) => void` | - |  |
+| onCopyButtonClick | `() => void` | - | Колбек клика по кнопке Копировать для поля |
+| prefixIcon | `ReactElement<any, string \| JSXElementConstructor<any>>` | - | Иконка-префикс для поля |
+| widthStrategy | enum PopoverWidthStrategy: `"auto"`, `"gte"`, `"eq"` | - |  |
+| pinTop | `OptionProps[]` | - |  |
+| pinBottom | `OptionProps[]` | - |  |
+| footer | `ReactNode` | - |  |
+| search | `SearchState` | - |  |
+| scrollToSelectedItem | `boolean` | - | Флаг, отвещающий за прокручивание до выбранного элемента |
+| virtualized | `boolean` | - | Включить виртуализацию на компоненты списка. Рекомендуется если у вас от 1к элементов списка |
+| untouchableScrollbars | `boolean` | - | Отключает возможность взаимодействовать со скролбарами мышью. |
+| dataFiltered | `boolean` | - |  |
+| dataError | `boolean` | - |  |
+| noDataState | `EmptyStateProps` | - | Экран при отстутствии данных |
+| noResultsState | `EmptyStateProps` | - | Экран при отстутствии результатов поиска или фильтров |
+| errorDataState | `EmptyStateProps` | - | Экран при ошибке запроса |
+| searchable | `boolean` | - |  |
+| autocomplete | `boolean` | - |  |
+| addOptionByEnter | `boolean` | - |  |
+| enableFuzzySearch | `boolean` | - | Включить нечеткий поиск |
+| selectedOptionFormatter | `SelectedOptionFormatter` | - |  |
+| selection | "single" \| "multiple" | - |  |
 | 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` | - |  |
+| removeByBackspace | `boolean` | - |  |
+| resetSearchOnOptionSelection | `boolean` | - | Поведение строки поиска при выборе опции из списка |
 ## FieldSlider
 ### Props
 | name | type | default value | description |
@@ -436,8 +517,8 @@ FieldStepper в основном предназначен для работы с
 |------|------|---------------|-------------|
 | open | `boolean` | - | Открыт time-picker |
 | onOpenChange | `(value: boolean) => void` | - | Колбек открытия пикера |
-| value | `TimePickerProps` | - | Значение поля |
-| onChange | `TimePickerProps` | - | Колбек смены значения |
+| value | `TimeValue` | - | Значение поля |
+| onChange | `(value?: TimeValue) => void` | - | Колбек смены значения |
 | showCopyButton | `boolean` | - | Отображение кнопки копирования |
 | onCopyButtonClick | `() => void` | - | Колбек клика по кнопке Копировать для поля |
 | showSeconds | `boolean` | true | Показывать ли секунды |

package/dist/cjs/components/FieldSelect/FieldSelectMultiple.js

@@ -109,6 +109,11 @@ exports.FieldSelectMultiple = (0, react_1.forwardRef)((props, ref) => {
     postfix,
     disabled
   });
+  (0, react_1.useEffect)(() => {
+    if (options.length < 1 && Boolean(value)) {
+      setValue(undefined);
+    }
+  }, [options.length, setValue, value]);
   (0, utils_1.useLayoutEffect)(() => {
     setItems(_ref => {
       let {

package/dist/cjs/components/FieldSelect/FieldSelectSingle.js

@@ -105,6 +105,11 @@ exports.FieldSelectSingle = (0, react_1.forwardRef)((props, ref) => {
     postfix,
     disabled
   });
+  (0, react_1.useEffect)(() => {
+    if (options.length < 1 && Boolean(value)) {
+      setValue(undefined);
+    }
+  }, [options.length, setValue, value]);
   (0, utils_1.useLayoutEffect)(() => {
     setItems(_ref => {
       let {

package/dist/esm/components/FieldSelect/FieldSelectMultiple.js

@@ -12,7 +12,7 @@ var __rest = (this && this.__rest) || function (s, e) {
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import cn from 'classnames';
 import mergeRefs from 'merge-refs';
-import { forwardRef, useRef, useState } from 'react';
+import { forwardRef, useEffect, useRef, useState } from 'react';
 import { InputPrivate } from '@snack-uikit/input-private';
 import { Droplist } from '@snack-uikit/list';
 import { Tag } from '@snack-uikit/tag';
@@ -47,6 +47,11 @@ export const FieldSelectMultiple = forwardRef((props, ref) => {
         resetSearchOnOptionSelection }));
     const prefixSettings = usePrefix({ prefix, disabled });
     const postfixSettings = usePostfix({ postfix, disabled });
+    useEffect(() => {
+        if (options.length < 1 && Boolean(value)) {
+            setValue(undefined);
+        }
+    }, [options.length, setValue, value]);
     useLayoutEffect(() => {
         setItems(({ selectedItems }) => updateMultipleItems({ options, value, selectedItems }));
     }, [options, value]);

package/dist/esm/components/FieldSelect/FieldSelectSingle.js

@@ -42,6 +42,11 @@ export const FieldSelectSingle = forwardRef((props, ref) => {
     const prevSelectedItem = useRef(selectedItem);
     const prefixSettings = usePrefix({ prefix, disabled });
     const postfixSettings = usePostfix({ postfix, disabled });
+    useEffect(() => {
+        if (options.length < 1 && Boolean(value)) {
+            setValue(undefined);
+        }
+    }, [options.length, setValue, value]);
     useLayoutEffect(() => {
         setItems(({ selectedItem }) => updateItems({ options, value, selectedItem }));
     }, [options, value]);

package/package.json

@@ -4,7 +4,7 @@
     "access": "public"
   },
   "title": "Fields",
-  "version": "0.41.7-preview-85131e65.0",
+  "version": "0.41.7",
   "sideEffects": [
     "*.css",
     "*.woff",
@@ -65,5 +65,5 @@
   "peerDependencies": {
     "@snack-uikit/locale": "*"
   },
-  "gitHead": "facf83e69f1205e59ba9342fef66ce7fdd9aa98f"
+  "gitHead": "3f11b6caedc3e873fcd20d1715280d66442538fe"
 }

package/src/components/FieldSelect/FieldSelectMultiple.tsx

@@ -1,6 +1,6 @@
 import cn from 'classnames';
 import mergeRefs from 'merge-refs';
-import { FocusEvent, forwardRef, KeyboardEvent, KeyboardEventHandler, useRef, useState } from 'react';
+import { FocusEvent, forwardRef, KeyboardEvent, KeyboardEventHandler, useEffect, useRef, useState } from 'react';
 
 import { InputPrivate } from '@snack-uikit/input-private';
 import { BaseItemProps, Droplist, ItemProps, SelectionSingleValueType } from '@snack-uikit/list';
@@ -82,6 +82,12 @@ export const FieldSelectMultiple = forwardRef<HTMLInputElement, FieldSelectMulti
   const prefixSettings = usePrefix({ prefix, disabled });
   const postfixSettings = usePostfix({ postfix, disabled });
 
+  useEffect(() => {
+    if (options.length < 1 && Boolean(value)) {
+      setValue(undefined);
+    }
+  }, [options.length, setValue, value]);
+
   useLayoutEffect(() => {
     setItems(({ selectedItems }) => updateMultipleItems({ options, value, selectedItems }));
   }, [options, value]);

package/src/components/FieldSelect/FieldSelectSingle.tsx

@@ -86,6 +86,12 @@ export const FieldSelectSingle = forwardRef<HTMLInputElement, FieldSelectSingleP
   const prefixSettings = usePrefix({ prefix, disabled });
   const postfixSettings = usePostfix({ postfix, disabled });
 
+  useEffect(() => {
+    if (options.length < 1 && Boolean(value)) {
+      setValue(undefined);
+    }
+  }, [options.length, setValue, value]);
+
   useLayoutEffect(() => {
     setItems(({ selectedItem }) => updateItems({ options, value, selectedItem }));
   }, [options, value]);