@cloud-ru/uikit-product-mobile-fields 0.11.24 → 0.11.25

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

@@ -0,0 +1,213 @@
+.triggerClassName{
+  --offset:var(--space-drop-list-drop-offset, 4px);
+  width:100%;
+}
+
+.contentWrapper{
+  position:relative;
+  overflow:hidden;
+  display:flex;
+  flex-wrap:wrap;
+  width:100%;
+}
+
+.tagContainer{
+  height:auto !important;
+}
+.tagContainer[data-size=s]{
+  border-radius:var(--radius-fields-s, 4px);
+  border-width:var(--border-width-fields-single, 1px);
+  padding-left:var(--space-fields-single-line-container-s-left, 7px);
+  gap:var(--space-fields-single-line-container-s-gap, 4px);
+  padding-right:var(--space-fields-single-line-container-s-right, 7px);
+  min-height:var(--size-fields-s, 32px);
+  padding-top:var(--space-fields-select-multiple-s-vertical-padding, 2px);
+  padding-bottom:var(--space-fields-select-multiple-s-vertical-padding, 2px);
+}
+.tagContainer[data-size=s] .contentWrapper{
+  gap:var(--space-fields-single-line-container-s-gap, 4px);
+}
+.tagContainer[data-size=m]{
+  border-radius:var(--radius-fields-m, 4px);
+  border-width:var(--border-width-fields-single, 1px);
+  padding-left:var(--space-fields-single-line-container-m-left, 9px);
+  gap:var(--space-fields-single-line-container-m-gap, 4px);
+  padding-right:var(--space-fields-single-line-container-m-right, 9px);
+  padding-top:var(--space-fields-select-multiple-m-vertical-padding, 6px);
+  padding-bottom:var(--space-fields-select-multiple-m-vertical-padding, 6px);
+  min-height:var(--size-fields-m, 40px);
+}
+.tagContainer[data-size=m] .contentWrapper{
+  gap:var(--space-fields-single-line-container-m-gap, 4px);
+}
+.tagContainer[data-size=l]{
+  border-radius:var(--radius-fields-l, 4px);
+  border-width:var(--border-width-fields-single, 1px);
+  padding-left:var(--space-fields-single-line-container-l-left, 11px);
+  gap:var(--space-fields-single-line-container-l-gap, 8px);
+  padding-right:var(--space-fields-single-line-container-l-right, 11px);
+  min-height:var(--size-fields-l, 48px);
+  padding-top:var(--space-fields-select-multiple-l-vertical-padding, 6px);
+  padding-bottom:var(--space-fields-select-multiple-l-vertical-padding, 6px);
+}
+.tagContainer[data-size=l] .contentWrapper{
+  gap:var(--space-fields-single-line-container-l-gap, 8px);
+}
+
+.container{
+  position:relative;
+}
+.container[data-size=s] .inputPlug{
+  font-family:var(--sans-body-s-font-family, SB Sans Interface);
+  font-weight:var(--sans-body-s-font-weight, Regular);
+  line-height:var(--sans-body-s-line-height, 16px);
+  font-size:var(--sans-body-s-font-size, 12px);
+  letter-spacing:var(--sans-body-s-letter-spacing, 0.1px);
+  paragraph-spacing:var(--sans-body-s-paragraph-spacing, 6.6px);
+}
+.container[data-size=s] .arrowIcon{
+  width:var(--size-icon-container-xs, 16px) !important;
+  height:var(--size-icon-container-xs, 16px) !important;
+  color:var(--sys-neutral-text-light, #8b8e9b);
+}
+.container[data-size=s][data-variant=single-line-container] .displayValue{
+  width:calc(100% - (var(--space-fields-single-line-container-s-right, 7px) + var(--space-fields-single-line-container-s-gap, 4px) + calc(var(var(--space-fields-postfix-gap, 4px)) + var(--size-icon-container-xs, 16px) * 2)));
+  margin-right:calc(var(--space-fields-single-line-container-s-right, 7px) + var(--space-fields-single-line-container-s-gap, 4px) + calc(var(var(--space-fields-postfix-gap, 4px)) + var(--size-icon-container-xs, 16px) * 2));
+  padding-left:var(--space-fields-single-line-container-s-left, 7px);
+  border-radius:var(--radius-fields-s, 4px);
+}
+.container[data-size=m] .inputPlug{
+  font-family:var(--sans-body-m-font-family, SB Sans Interface);
+  font-weight:var(--sans-body-m-font-weight, Regular);
+  line-height:var(--sans-body-m-line-height, 20px);
+  font-size:var(--sans-body-m-font-size, 14px);
+  letter-spacing:var(--sans-body-m-letter-spacing, 0.1px);
+  paragraph-spacing:var(--sans-body-m-paragraph-spacing, 7.7px);
+}
+.container[data-size=m] .arrowIcon{
+  width:var(--size-icon-container-s, 24px) !important;
+  height:var(--size-icon-container-s, 24px) !important;
+  color:var(--sys-neutral-text-light, #8b8e9b);
+}
+.container[data-size=m][data-variant=single-line-container] .displayValue{
+  width:calc(100% - (var(--space-fields-single-line-container-m-right, 9px) + var(--space-fields-single-line-container-m-gap, 4px) + calc(var(var(--space-fields-postfix-gap, 4px)) + var(--size-icon-container-s, 24px) * 2)));
+  margin-right:calc(var(--space-fields-single-line-container-m-right, 9px) + var(--space-fields-single-line-container-m-gap, 4px) + calc(var(var(--space-fields-postfix-gap, 4px)) + var(--size-icon-container-s, 24px) * 2));
+  padding-left:var(--space-fields-single-line-container-m-left, 9px);
+  border-radius:var(--radius-fields-m, 4px);
+}
+.container[data-size=l] .inputPlug{
+  font-family:var(--sans-body-l-font-family, SB Sans Interface);
+  font-weight:var(--sans-body-l-font-weight, Regular);
+  line-height:var(--sans-body-l-line-height, 24px);
+  font-size:var(--sans-body-l-font-size, 16px);
+  letter-spacing:var(--sans-body-l-letter-spacing, 0.1px);
+  paragraph-spacing:var(--sans-body-l-paragraph-spacing, 8.8px);
+}
+.container[data-size=l] .arrowIcon{
+  width:var(--size-icon-container-s, 24px) !important;
+  height:var(--size-icon-container-s, 24px) !important;
+  color:var(--sys-neutral-text-light, #8b8e9b);
+}
+.container[data-size=l][data-variant=single-line-container] .displayValue{
+  width:calc(100% - (var(--space-fields-single-line-container-l-right, 11px) + var(--space-fields-single-line-container-l-gap, 8px) + calc(var(var(--space-fields-postfix-gap, 4px)) + var(--size-icon-container-s, 24px) * 2)));
+  margin-right:calc(var(--space-fields-single-line-container-l-right, 11px) + var(--space-fields-single-line-container-l-gap, 8px) + calc(var(var(--space-fields-postfix-gap, 4px)) + var(--size-icon-container-s, 24px) * 2));
+  padding-left:var(--space-fields-single-line-container-l-left, 11px);
+  border-radius:var(--radius-fields-l, 4px);
+}
+.container:hover .arrowIcon, .container:focus-within .arrowIcon, .container[data-focused] .arrowIcon{
+  color:var(--sys-neutral-text-support, #6d707f);
+}
+.container[data-disabled] .arrowIcon, .container[data-readonly] .arrowIcon{
+  color:var(--sys-neutral-text-disabled, #aaaebd);
+}
+
+.inputPlug{
+  content:"";
+  position:absolute;
+  top:0;
+  left:0;
+  overflow:hidden;
+  width:-moz-fit-content;
+  width:fit-content;
+  max-width:100%;
+  height:0;
+}
+
+.inputWrapper{
+  position:relative;
+  display:inline-flex;
+  flex:1;
+  color:transparent;
+}
+.inputWrapper[data-searchable=false]{
+  width:0;
+  min-width:0;
+  max-width:0;
+}
+
+.postfix{
+  display:inline-flex;
+  flex-shrink:0;
+  gap:var(--space-fields-postfix-gap, 4px);
+}
+
+input.readonlyCursor{
+  cursor:pointer;
+  caret-color:transparent;
+}
+
+.searchDivider{
+  margin-bottom:4px;
+}
+
+.footer{
+  width:100%;
+}
+
+.footerTopLine{
+  display:flex;
+  align-items:center;
+  justify-content:space-between;
+  gap:4px;
+}
+
+.counter{
+  font-family:var(--sans-body-m-font-family, SB Sans Interface);
+  font-weight:var(--sans-body-m-font-weight, Regular);
+  line-height:var(--sans-body-m-line-height, 20px);
+  font-size:var(--sans-body-m-font-size, 14px);
+  letter-spacing:var(--sans-body-m-letter-spacing, 0.1px);
+  paragraph-spacing:var(--sans-body-m-paragraph-spacing, 7.7px);
+  color:var(--sys-neutral-text-light, #8b8e9b);
+}
+
+.listWrapper{
+  font-family:var(--sans-body-m-font-family, SB Sans Interface);
+  font-weight:var(--sans-body-m-font-weight, Regular);
+  line-height:var(--sans-body-m-line-height, 20px);
+  font-size:var(--sans-body-m-font-size, 14px);
+  letter-spacing:var(--sans-body-m-letter-spacing, 0.1px);
+  paragraph-spacing:var(--sans-body-m-paragraph-spacing, 7.7px);
+  flex:1 1 auto;
+  box-sizing:border-box;
+  min-height:var(--dimension-2m, 16px);
+  color:var(--sys-neutral-text-main, #41424e);
+  padding:16px 0;
+}
+
+.body{
+  font-family:var(--sans-body-m-font-family, SB Sans Interface);
+  font-weight:var(--sans-body-m-font-weight, Regular);
+  line-height:var(--sans-body-m-line-height, 20px);
+  font-size:var(--sans-body-m-font-size, 14px);
+  letter-spacing:var(--sans-body-m-letter-spacing, 0.1px);
+  paragraph-spacing:var(--sans-body-m-paragraph-spacing, 7.7px);
+  flex:1 1 auto;
+  box-sizing:border-box;
+  min-height:var(--dimension-2m, 16px);
+  color:var(--sys-neutral-text-main, #41424e);
+}
+
+.bodyNoPadding{
+  padding:0 !important;
+}

package/dist/esm/components/MobileFieldSelect/types.d.ts

@@ -0,0 +1,88 @@
+import { ReactElement, ReactNode } from 'react';
+import { FieldDecoratorProps } from '@snack-uikit/fields';
+import { InputPrivateProps } from '@snack-uikit/input-private';
+import { AccordionItemProps, BaseItemProps, DroplistProps, GroupItemProps, ItemContentProps, NextListItemProps, SelectionMultipleState, SelectionSingleState } from '@snack-uikit/list';
+import { TagProps } from '@snack-uikit/tag';
+import { WithSupportProps } from '@snack-uikit/utils';
+export type AnyType = any;
+export type OptionProps = BaseOptionProps | AccordionOptionProps | GroupOptionProps | NestListOptionProps;
+export type OptionWithoutGroup = BaseOptionProps | AccordionOptionProps | NestListOptionProps;
+export type BaseOptionProps = Pick<BaseItemProps, 'beforeContent' | 'afterContent' | 'disabled'> & Pick<ItemContentProps, 'option' | 'caption' | 'description'> & {
+    value: string | number;
+} & Pick<TagProps, 'appearance'>;
+export type AccordionOptionProps = Pick<AccordionItemProps, 'type'> & BaseOptionProps & {
+    options: OptionProps[];
+};
+export type GroupOptionProps = Omit<GroupItemProps, 'items' | 'id'> & {
+    options: OptionProps[];
+};
+export type NestListOptionProps = Pick<NextListItemProps, 'type' | 'onSublistOpenChanged' | 'id'> & BaseOptionProps & {
+    options: OptionProps[];
+};
+export type InputProps = Pick<InputPrivateProps, 'id' | 'name' | 'placeholder' | 'disabled' | 'readonly' | 'onFocus' | 'onBlur' | 'onKeyDown' | 'autoFocus'>;
+export type WrapperProps = Pick<FieldDecoratorProps, 'className' | 'label' | 'labelTooltip' | 'required' | 'caption' | 'hint' | 'showHintIcon' | 'size' | 'validationState' | 'labelTooltipPlacement' | 'error'>;
+export type ItemWithId = (BaseItemProps | AccordionItemProps | NextListItemProps) & {
+    placeholder?: boolean;
+    appearance?: TagProps['appearance'];
+};
+export type SelectedOptionFormatter = (item?: ItemWithId) => string;
+export type SearchState = {
+    value?: string;
+    defaultValue?: string;
+    onChange?(value: string): void;
+};
+export type FieldSelectPrivateProps = InputProps & WrapperProps & {
+    options: OptionProps[];
+    loading?: boolean;
+    /** Произвольный префикс для поля */
+    prefix?: ReactNode;
+    /** Произвольный постфикс для поля */
+    postfix?: ReactNode;
+};
+type FiledSelectCommonProps = WithSupportProps<{
+    options: OptionProps[];
+    pinTop?: OptionProps[];
+    pinBottom?: OptionProps[];
+    searchable?: boolean;
+    /** Отображение кнопки Копировать для поля (актуально только для `readonly = true`) */
+    showCopyButton?: boolean;
+    /**
+     * Отображение кнопки очистки поля
+     * @default true
+     */
+    showClearButton?: boolean;
+    /**
+     * Является ли поле доступным только для чтения
+     * @default false
+     */
+    readonly?: boolean;
+    /** Иконка-префикс для поля */
+    prefixIcon?: ReactElement;
+    footer?: DroplistProps['footer'];
+    /**
+     * Включить виртуализацию на компоненты списка. Рекомендуется если у вас от 1к элементов списка
+     */
+    virtualized?: boolean;
+    widthStrategy?: DroplistProps['widthStrategy'];
+    search?: SearchState;
+    /**
+     * Включить нечеткий поиск
+     * @default true
+     */
+    enableFuzzySearch?: boolean;
+    autocomplete?: boolean;
+    addOptionByEnter?: boolean;
+    open?: boolean;
+    onOpenChange?(open: boolean): void;
+    selectedOptionFormatter?: SelectedOptionFormatter;
+}> & Pick<DroplistProps, 'dataError' | 'noDataState' | 'noResultsState' | 'errorDataState' | 'dataFiltered'>;
+export type MobileFieldSelectSingleProps = FieldSelectPrivateProps & Omit<SelectionSingleState, 'mode'> & WrapperProps & FiledSelectCommonProps;
+export type MobileFieldSelectMultipleProps = FieldSelectPrivateProps & {
+    removeByBackspace?: boolean;
+} & Omit<SelectionMultipleState, 'mode'> & Omit<FiledSelectCommonProps, 'showCopyButton'>;
+export type MobileFieldSelectProps = (MobileFieldSelectSingleProps & {
+    selection?: 'single';
+}) | (MobileFieldSelectMultipleProps & {
+    selection: 'multiple';
+});
+export {};

package/dist/esm/components/MobileFieldSelect/types.js

@@ -0,0 +1 @@
+export {};

package/dist/esm/components/MobileFieldSelect/utils/extractFieldDecoratorProps.d.ts

@@ -0,0 +1,2 @@
+import { FieldDecoratorProps } from '@snack-uikit/fields';
+export declare function extractFieldDecoratorProps({ error, required, readonly, label, labelTooltip, labelTooltipPlacement, labelFor, caption, hint, disabled, showHintIcon, size, validationState, className, }: Partial<FieldDecoratorProps>): Partial<FieldDecoratorProps>;

package/dist/esm/components/MobileFieldSelect/utils/extractFieldDecoratorProps.js

@@ -0,0 +1,18 @@
+export function extractFieldDecoratorProps({ error, required, readonly, label, labelTooltip, labelTooltipPlacement, labelFor, caption, hint, disabled, showHintIcon, size, validationState, className, }) {
+    return {
+        error,
+        required,
+        readonly,
+        label,
+        labelTooltip,
+        labelTooltipPlacement,
+        labelFor,
+        caption,
+        hint,
+        disabled,
+        showHintIcon,
+        size,
+        validationState,
+        className,
+    };
+}

package/dist/esm/components/MobileFieldSelect/utils/extractListProps.d.ts

@@ -0,0 +1,3 @@
+import { DroplistProps } from '@snack-uikit/list';
+import { MobileFieldSelectProps } from '../types';
+export declare function extractListProps({ dataError, noDataState, noResultsState, errorDataState, dataFiltered, loading, footer, widthStrategy, }: Partial<MobileFieldSelectProps>): Partial<DroplistProps>;

package/dist/esm/components/MobileFieldSelect/utils/extractListProps.js

@@ -0,0 +1,17 @@
+export function extractListProps({ dataError, noDataState, noResultsState, errorDataState, dataFiltered, loading, footer, widthStrategy, }) {
+    return {
+        dataError,
+        noDataState,
+        noResultsState,
+        errorDataState,
+        dataFiltered,
+        loading,
+        footer,
+        widthStrategy,
+        trigger: 'clickAndFocusVisible',
+        placement: 'bottom',
+        'data-test-id': 'field-select__list',
+        scroll: true,
+        marker: true,
+    };
+}

package/dist/esm/components/MobileFieldSelect/utils/getArrowIcon.d.ts

@@ -0,0 +1,13 @@
+import { JSXElementConstructor } from 'react';
+import { ICON_SIZE, Size } from '@snack-uikit/input-private';
+import { ValueOf } from '@snack-uikit/utils';
+export declare function getArrowIcon({ size, open }: {
+    size: Size;
+    open: boolean;
+}): {
+    ArrowIcon: JSXElementConstructor<{
+        className?: string;
+        size: ValueOf<typeof ICON_SIZE>;
+    }>;
+    arrowIconSize: ValueOf<typeof ICON_SIZE>;
+};

package/dist/esm/components/MobileFieldSelect/utils/getArrowIcon.js

@@ -0,0 +1,8 @@
+import { ChevronDownSVG, ChevronUpSVG } from '@sbercloud/uikit-product-icons';
+import { ICON_SIZE, SIZE } from '@snack-uikit/input-private';
+export function getArrowIcon({ size, open }) {
+    return {
+        ArrowIcon: open ? ChevronUpSVG : ChevronDownSVG,
+        arrowIconSize: size === SIZE.S ? ICON_SIZE.Xs : ICON_SIZE.S,
+    };
+}

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

@@ -0,0 +1,6 @@
+export * from './typeGuards';
+export * from './extractFieldDecoratorProps';
+export * from './extractListProps';
+export * from './options';
+export * from './updateItems';
+export * from './getArrowIcon';

package/dist/esm/components/MobileFieldSelect/utils/index.js

@@ -0,0 +1,6 @@
+export * from './typeGuards';
+export * from './extractFieldDecoratorProps';
+export * from './extractListProps';
+export * from './options';
+export * from './updateItems';
+export * from './getArrowIcon';

package/dist/esm/components/MobileFieldSelect/utils/options.d.ts

@@ -0,0 +1,8 @@
+import { ItemProps, SelectionSingleValueType } from '@snack-uikit/list';
+import { TagProps } from '@snack-uikit/tag';
+import { ItemWithId, OptionProps } from '../types';
+export declare function transformOptionsToItems(options: OptionProps[]): (ItemProps & {
+    appearance?: TagProps['appearance'];
+})[];
+export declare function findSelectedOption(items: ItemProps[], value: SelectionSingleValueType): [ItemWithId | undefined, ItemWithId | undefined];
+export declare function findSelectedOptions(items: ItemProps[], value: SelectionSingleValueType[] | undefined): [ItemWithId[] | undefined, ItemWithId[] | undefined];

package/dist/esm/components/MobileFieldSelect/utils/options.js

@@ -0,0 +1,56 @@
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import { flattenItems } from '../legacy';
+import { isAccordionOptionProps, isGroupOptionProps, isNextListOptionProps } from './typeGuards';
+export function transformOptionsToItems(options) {
+    return options.map(option => {
+        if (isAccordionOptionProps(option) || isNextListOptionProps(option)) {
+            const { description, option: contentOption, caption, options, value } = option, rest = __rest(option, ["description", "option", "caption", "options", "value"]);
+            return Object.assign(Object.assign({ 'data-test-id': 'field-select__list-option-' + option.value }, rest), { id: value, content: { option: contentOption, caption, description }, items: transformOptionsToItems(options) });
+        }
+        if (isGroupOptionProps(option)) {
+            const { options } = option, rest = __rest(option, ["options"]);
+            return Object.assign(Object.assign({}, rest), { items: transformOptionsToItems(options) });
+        }
+        const _a = option, { description, option: contentOption, caption, value, appearance } = _a, rest = __rest(_a, ["description", "option", "caption", "value", "appearance"]);
+        return Object.assign(Object.assign({ 'data-test-id': 'field-select__list-option-' + option.value }, rest), { id: value, appearance: appearance, content: { description, option: contentOption, caption: caption } });
+    });
+}
+export function findSelectedOption(items, value) {
+    const flatten = flattenItems(items);
+    if (!value) {
+        return [undefined, undefined];
+    }
+    const foundItem = flatten.find(item => String(item.id) === String(value));
+    const placeholderItem = { id: value, content: { option: String(value) } };
+    return [foundItem, !foundItem ? placeholderItem : undefined];
+}
+export function findSelectedOptions(items, value) {
+    const flatten = flattenItems(items);
+    if (!value || !(value === null || value === void 0 ? void 0 : value.length)) {
+        return [undefined, undefined];
+    }
+    let foundItems;
+    let placeholderItems;
+    value.forEach(value => {
+        if (flatten) {
+            const [found, placeholder] = findSelectedOption(flatten, value);
+            if (found || foundItems) {
+                foundItems = (foundItems !== null && foundItems !== void 0 ? foundItems : []).concat(found !== null && found !== void 0 ? found : []);
+            }
+            if (placeholder || placeholderItems) {
+                placeholderItems = (placeholderItems !== null && placeholderItems !== void 0 ? placeholderItems : []).concat(placeholder !== null && placeholder !== void 0 ? placeholder : []);
+            }
+        }
+    });
+    return [foundItems, placeholderItems];
+}

package/dist/esm/components/MobileFieldSelect/utils/typeGuards.d.ts

@@ -0,0 +1,7 @@
+import { AccordionOptionProps, BaseOptionProps, GroupOptionProps, MobileFieldSelectMultipleProps, MobileFieldSelectSingleProps, NestListOptionProps } from '../types';
+export declare function isBaseOptionProps(option: any): option is BaseOptionProps;
+export declare function isAccordionOptionProps(option: any): option is AccordionOptionProps;
+export declare function isNextListOptionProps(option: any): option is NestListOptionProps;
+export declare function isGroupOptionProps(option: any): option is GroupOptionProps;
+export declare function isFieldSelectMultipleProps(props: any): props is MobileFieldSelectMultipleProps;
+export declare function isFieldSelectSingleProps(props: any): props is MobileFieldSelectSingleProps;

package/dist/esm/components/MobileFieldSelect/utils/typeGuards.js

@@ -0,0 +1,24 @@
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export function isBaseOptionProps(option) {
+    return !('options' in option);
+}
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export function isAccordionOptionProps(option) {
+    return 'options' in option && option['type'] === 'collapse';
+}
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export function isNextListOptionProps(option) {
+    return 'options' in option && option['type'] === 'next-list';
+}
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export function isGroupOptionProps(option) {
+    return 'options' in option && option['type'] === 'group';
+}
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export function isFieldSelectMultipleProps(props) {
+    return 'selection' in props && props['selection'] === 'multiple';
+}
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
+export function isFieldSelectSingleProps(props) {
+    return ('selection' in props && props['selection'] === 'single') || props['selection'] === undefined;
+}

package/dist/esm/components/MobileFieldSelect/utils/updateItems.d.ts

@@ -0,0 +1,27 @@
+import { ItemId, ItemProps, SelectionSingleValueType } from '@snack-uikit/list';
+import { ItemWithId, OptionProps } from '../types';
+export declare function createPlaceholderItem(value: SelectionSingleValueType): {
+    id: ItemId;
+    content: {
+        option: string;
+    };
+    placeholder: boolean;
+};
+export declare function updateItems({ options, value, selectedItem, }: {
+    options: OptionProps[];
+    value?: ItemId;
+    selectedItem?: ItemWithId;
+    currentItems?: ItemProps[];
+}): {
+    selectedItem?: ItemWithId;
+    items: ItemProps[];
+};
+export declare function updateMultipleItems({ options, value, selectedItems, }: {
+    options: OptionProps[];
+    value?: SelectionSingleValueType[];
+    selectedItems?: ItemWithId[];
+    currentItems?: ItemProps[];
+}): {
+    selectedItems?: ItemWithId[];
+    items: ItemProps[];
+};

package/dist/esm/components/MobileFieldSelect/utils/updateItems.js

@@ -0,0 +1,76 @@
+import { flattenItems } from '../legacy';
+import { transformOptionsToItems } from './options';
+export function createPlaceholderItem(value) {
+    return { id: value, content: { option: String(value) }, placeholder: true };
+}
+export function updateItems({ options, value, selectedItem, }) {
+    const originalItems = transformOptionsToItems(options);
+    if (value === undefined) {
+        return {
+            selectedItem: undefined,
+            items: originalItems,
+        };
+    }
+    let newItems = originalItems;
+    let newSelectedItem = selectedItem;
+    const foundItem = flattenItems(originalItems).find(item => item.id === value);
+    if (!foundItem) {
+        if (selectedItem && (selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.id) === value) {
+            newItems = [selectedItem, ...newItems];
+        }
+        else {
+            newSelectedItem = createPlaceholderItem(value);
+            newItems = [newSelectedItem, ...newItems];
+        }
+    }
+    else {
+        newSelectedItem = foundItem;
+    }
+    return {
+        selectedItem: newSelectedItem,
+        items: newItems,
+    };
+}
+export function updateMultipleItems({ options, value, selectedItems, }) {
+    const originalItems = transformOptionsToItems(options);
+    if (!value || !value.length) {
+        return {
+            selectedItems: undefined,
+            items: originalItems,
+        };
+    }
+    const foundedValue = [];
+    let newItems = originalItems;
+    let newSelectedItems = selectedItems;
+    const flattenOriginalItems = flattenItems(originalItems);
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    const foundItems = flattenOriginalItems.filter((item) => {
+        if (value.includes(item.id) && !foundedValue.includes(item.id)) {
+            foundedValue.push(item.id);
+            return true;
+        }
+    });
+    const nonFoundValues = value.filter(
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
+    value => !flattenOriginalItems.find((item) => item.id === value));
+    if (nonFoundValues.length) {
+        const nonFoundItems = nonFoundValues.map(value => (selectedItems === null || selectedItems === void 0 ? void 0 : selectedItems.find(selectedItem => selectedItem.id === value)) || createPlaceholderItem(value));
+        newSelectedItems = [...foundItems, ...nonFoundItems];
+        newItems = [...nonFoundItems, ...newItems];
+    }
+    else {
+        newSelectedItems = foundItems;
+    }
+    return {
+        selectedItems: newSelectedItems.sort((a, b) => {
+            if (b.disabled && !a.disabled) {
+                return 1;
+            }
+            if (a.disabled && !b.disabled) {
+                return -1;
+            }
+            return 0;
+        }),
+        items: newItems,
+    };
+}

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

@@ -0,0 +1,3 @@
+export * from './AdaptiveField';
+export * from './MobileFieldSelect';
+export * from './MobileFieldDate';

package/dist/esm/components/index.js

@@ -0,0 +1,3 @@
+export * from './AdaptiveField';
+export * from './MobileFieldSelect';
+export * from './MobileFieldDate';

package/dist/esm/constants/allFields.d.ts

@@ -0,0 +1,10 @@
+export declare const VALIDATION_STATE: {
+    readonly Default: "default";
+    readonly Error: "error";
+    readonly Warning: "warning";
+    readonly Success: "success";
+};
+export declare const CONTAINER_VARIANT: {
+    readonly SingleLine: "single-line-container";
+    readonly MultiLine: "multi-line-container";
+};

package/dist/esm/constants/allFields.js

@@ -0,0 +1,10 @@
+export const VALIDATION_STATE = {
+    Default: 'default',
+    Error: 'error',
+    Warning: 'warning',
+    Success: 'success',
+};
+export const CONTAINER_VARIANT = {
+    SingleLine: 'single-line-container',
+    MultiLine: 'multi-line-container',
+};

package/dist/esm/constants/dateFields.d.ts

@@ -0,0 +1,24 @@
+import { Mode, NoSecondsMode, Slot, TimeMode } from '../types';
+export declare enum SlotKey {
+    Day = "D",
+    Month = "M",
+    Year = "Y",
+    Hours = "h",
+    Minutes = "m",
+    Seconds = "s"
+}
+export declare const MODES: {
+    readonly Date: "date";
+    readonly DateTime: "date-time";
+};
+export declare const TIME_MODES: {
+    readonly FullTime: "full-time";
+    readonly NoSeconds: "no-seconds";
+};
+export declare const NO_SECONDS_MODE = "date-time-no-sec";
+export declare const MASK: Record<Mode | TimeMode | NoSecondsMode, Record<string, string>>;
+export declare const DEFAULT_LOCALE: Intl.Locale;
+export declare const SLOTS: Record<Mode | TimeMode | NoSecondsMode, Record<SlotKey | string, Slot>>;
+export type FocusSlot = SlotKey | 'auto';
+export declare const SLOT_ORDER: Record<Mode | TimeMode | NoSecondsMode, SlotKey[]>;
+export declare const SLOTS_PLACEHOLDER: Record<Mode | TimeMode | NoSecondsMode, Record<string, Partial<Record<SlotKey, string>>>>;