@gravity-ui/date-components 1.0.0

package/dist/cjs/components/RelativeDatePicker/hooks/useRelativeDatePickerProps.js

@@ -0,0 +1,175 @@
+"use strict";
+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;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useRelativeDatePickerProps = void 0;
+const react_1 = __importDefault(require("react"));
+const uikit_1 = require("@gravity-ui/uikit");
+const DateField_1 = require("../../DateField");
+const getButtonSizeForInput_1 = require("../../utils/getButtonSizeForInput");
+const mergeProps_1 = require("../../utils/mergeProps");
+const i18n_1 = require("../i18n");
+function useRelativeDatePickerProps(state, _a) {
+    var { onFocus, onBlur } = _a, props = __rest(_a, ["onFocus", "onBlur"]);
+    const { mode, setMode, datePickerState, dateFieldState, relativeDateState } = state;
+    const [focusedDate, setFocusedDate] = react_1.default.useState(relativeDateState.lastCorrectDate);
+    const [prevCorrectDate, setPrevCorrectDate] = react_1.default.useState(relativeDateState.lastCorrectDate);
+    if (prevCorrectDate !== relativeDateState.lastCorrectDate) {
+        setPrevCorrectDate(relativeDateState.lastCorrectDate);
+        setFocusedDate(relativeDateState.lastCorrectDate);
+    }
+    const [prevDateValue, setPrevDateValue] = react_1.default.useState(datePickerState.dateValue);
+    if (datePickerState.dateValue !== prevDateValue) {
+        setPrevDateValue(datePickerState.dateValue);
+        if (datePickerState.dateValue) {
+            setFocusedDate(datePickerState.dateValue);
+        }
+    }
+    const { focusWithinProps } = (0, uikit_1.useFocusWithin)({
+        onFocusWithin: onFocus,
+        onBlurWithin: onBlur,
+        onFocusWithinChange(isFocusWithin) {
+            if (!isFocusWithin) {
+                state.setActive(isFocusWithin);
+            }
+        },
+    });
+    const [isOpen, setOpen] = react_1.default.useState(false);
+    if (!state.isActive && isOpen) {
+        setOpen(false);
+    }
+    const [prevActive, setPrevActive] = react_1.default.useState(state.isActive);
+    if (prevActive !== state.isActive) {
+        setPrevActive(state.isActive);
+        if (state.isActive && !isOpen) {
+            setOpen(true);
+        }
+    }
+    const commonInputProps = {
+        onFocus: () => {
+            state.setActive(true);
+        },
+    };
+    const { inputProps } = (0, DateField_1.useDateFieldProps)(dateFieldState, Object.assign(Object.assign({}, props), { value: undefined, defaultValue: undefined, onUpdate: undefined }));
+    const relativeDateProps = {
+        disabled: relativeDateState.disabled,
+        value: relativeDateState.text,
+        onUpdate: relativeDateState.setText,
+        hasClear: props.hasClear && !relativeDateState.readOnly,
+        size: props.size,
+    };
+    let error;
+    let validationState = props.validationState;
+    if (validationState) {
+        error = validationState === 'invalid' ? props.errorMessage || true : undefined;
+    }
+    else {
+        validationState =
+            mode === 'relative'
+                ? relativeDateState.validationState
+                : dateFieldState.validationState;
+        error = validationState === 'invalid';
+    }
+    const wasActiveBeforeClickRef = react_1.default.useRef(state.isActive);
+    const inputRef = react_1.default.useRef(null);
+    const handleRef = (0, uikit_1.useForkRef)(inputRef, mode === 'relative' ? relativeDateProps.controlRef : inputProps.controlRef);
+    const calendarRef = react_1.default.useRef(null);
+    return {
+        groupProps: Object.assign({ role: 'group' }, focusWithinProps),
+        fieldProps: (0, mergeProps_1.mergeProps)(commonInputProps, mode === 'relative' ? relativeDateProps : inputProps, { controlRef: handleRef, error }),
+        modeSwitcherProps: {
+            size: (0, getButtonSizeForInput_1.getButtonSizeForInput)(props.size),
+            disabled: state.readOnly || state.disabled,
+            view: 'flat-secondary',
+            style: { zIndex: 2 },
+            selected: mode === 'relative',
+            extraProps: {
+                'aria-label': (0, i18n_1.i18n)('Formula input mode'),
+            },
+            onClick: () => {
+                setMode(mode === 'relative' ? 'absolute' : 'relative');
+                if (mode === 'relative') {
+                    const valueDate = datePickerState.value;
+                    if (valueDate) {
+                        setFocusedDate(valueDate);
+                    }
+                }
+                else if (relativeDateState.parsedDate) {
+                    setFocusedDate(relativeDateState.parsedDate);
+                }
+                setTimeout(() => { var _a; return (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus(); });
+            },
+        },
+        calendarButtonProps: {
+            size: (0, getButtonSizeForInput_1.getButtonSizeForInput)(props.size),
+            disabled: state.disabled,
+            extraProps: {
+                'aria-label': (0, i18n_1.i18n)('Calendar'),
+                'aria-haspopup': 'dialog',
+                'aria-expanded': isOpen,
+            },
+            view: 'flat-secondary',
+            onFocus: () => {
+                wasActiveBeforeClickRef.current = state.isActive;
+            },
+            onClick: () => {
+                state.setActive(true);
+                if (wasActiveBeforeClickRef.current) {
+                    setOpen(!isOpen);
+                    if (!isOpen) {
+                        setTimeout(() => {
+                            var _a;
+                            (_a = calendarRef.current) === null || _a === void 0 ? void 0 : _a.focus();
+                        });
+                    }
+                }
+                wasActiveBeforeClickRef.current = state.isActive;
+            },
+        },
+        popupProps: {
+            open: isOpen,
+            onEscapeKeyDown: () => {
+                setOpen(false);
+            },
+            restoreFocus: true,
+        },
+        calendarProps: {
+            ref: calendarRef,
+            size: props.size === 's' ? 'm' : props.size,
+            readOnly: props.readOnly,
+            value: state.selectedDate,
+            onUpdate: (v) => {
+                datePickerState.setDateValue(v);
+                if (!state.datePickerState.hasTime) {
+                    setOpen(false);
+                    setTimeout(() => { var _a; return (_a = inputRef.current) === null || _a === void 0 ? void 0 : _a.focus(); });
+                }
+            },
+            focusedValue: focusedDate,
+            onFocusUpdate: setFocusedDate,
+        },
+        timeInputProps: {
+            value: datePickerState.timeValue,
+            onUpdate: datePickerState.setTimeValue,
+            format: datePickerState.timeFormat,
+            readOnly: state.readOnly,
+            disabled: state.disabled,
+            timeZone: props.timeZone,
+            hasClear: props.hasClear,
+            size: props.size,
+        },
+    };
+}
+exports.useRelativeDatePickerProps = useRelativeDatePickerProps;

package/dist/cjs/components/RelativeDatePicker/hooks/useRelativeDatePickerState.d.ts

@@ -0,0 +1,36 @@
+import type { DateTime } from '@gravity-ui/date-utils';
+import type { DateFieldState } from '../../DateField';
+import type { DatePickerState } from '../../DatePicker';
+import type { RelativeDateFieldState } from '../../RelativeDateField';
+import type { DateFieldBase } from '../../types';
+export type Value = {
+    type: 'absolute';
+    value: DateTime;
+} | {
+    type: 'relative';
+    value: string;
+};
+export type RelativeDatePickerMode = Value['type'];
+export interface RelativeDatePickerStateOptions extends DateFieldBase<Value> {
+}
+export interface RelativeDatePickerState {
+    value: Value | null;
+    setValue: (value: Value | null) => void;
+    mode: RelativeDatePickerMode;
+    setMode: (mode: RelativeDatePickerMode) => void;
+    datePickerState: DatePickerState;
+    dateFieldState: DateFieldState;
+    relativeDateState: RelativeDateFieldState;
+    selectedDate: DateTime | null;
+    /**
+     * Whether the field is disabled.
+     */
+    disabled?: boolean;
+    /**
+     * Whether the value is immutable.
+     */
+    readOnly?: boolean;
+    isActive: boolean;
+    setActive: (isActive: boolean) => void;
+}
+export declare function useRelativeDatePickerState(props: RelativeDatePickerStateOptions): RelativeDatePickerState;

package/dist/cjs/components/RelativeDatePicker/hooks/useRelativeDatePickerState.js

@@ -0,0 +1,109 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useRelativeDatePickerState = void 0;
+const react_1 = __importDefault(require("react"));
+const DateField_1 = require("../../DateField");
+const DatePicker_1 = require("../../DatePicker");
+const RelativeDateField_1 = require("../../RelativeDateField");
+const useControlledState_1 = require("../../hooks/useControlledState");
+function useRelativeDatePickerState(props) {
+    const [value, setValue] = (0, useControlledState_1.useControlledState)(props.value, props.defaultValue, props.onUpdate);
+    const [mode, setMode] = react_1.default.useState((value === null || value === void 0 ? void 0 : value.type) === 'relative' ? 'relative' : 'absolute');
+    const [prevValue, setPrevValue] = react_1.default.useState(value);
+    if (value !== prevValue) {
+        setPrevValue(value);
+        if (value) {
+            setMode(value.type);
+        }
+    }
+    const [valueDate, setValueDate] = react_1.default.useState((value === null || value === void 0 ? void 0 : value.type) === 'absolute' ? value.value : null);
+    if ((value === null || value === void 0 ? void 0 : value.type) === 'absolute' && value.value !== valueDate) {
+        setValueDate(value.value);
+    }
+    const datePickerState = (0, DatePicker_1.useDatePickerState)({
+        value: valueDate,
+        onUpdate: (date) => {
+            setValueDate(date);
+            if ((value === null || value === void 0 ? void 0 : value.type) === 'absolute' && (date === null || date === void 0 ? void 0 : date.isSame(value.value))) {
+                return;
+            }
+            setValue(date ? { type: 'absolute', value: date } : null);
+        },
+        format: props.format,
+        placeholderValue: props.placeholderValue,
+        timeZone: props.timeZone,
+        disabled: props.disabled,
+        readOnly: props.readOnly,
+    });
+    const dateFieldState = (0, DateField_1.useDateFieldState)({
+        value: valueDate,
+        onUpdate: datePickerState.setValue,
+        format: props.format,
+        placeholderValue: props.placeholderValue,
+        timeZone: props.timeZone,
+        disabled: props.disabled,
+        readOnly: props.readOnly,
+    });
+    const [valueRelative, setValueRelative] = react_1.default.useState((value === null || value === void 0 ? void 0 : value.type) === 'relative' ? value.value : null);
+    if ((value === null || value === void 0 ? void 0 : value.type) === 'relative' && value.value !== valueRelative) {
+        setValueRelative(value.value);
+    }
+    const relativeDateState = (0, RelativeDateField_1.useRelativeDateFieldState)({
+        value: valueRelative,
+        onUpdate: (v) => {
+            setValueRelative(v);
+            if ((value === null || value === void 0 ? void 0 : value.type) === 'relative' && v === value.value) {
+                return;
+            }
+            setValue(v ? { type: 'relative', value: v } : null);
+        },
+        disabled: props.disabled,
+        readOnly: props.readOnly,
+    });
+    if (!value) {
+        if (mode === 'absolute' && valueDate) {
+            setValueDate(null);
+        }
+        else if (mode === 'relative' && valueRelative) {
+            setValueRelative(null);
+        }
+    }
+    const selectedDate = mode === 'relative' ? relativeDateState.parsedDate : datePickerState.dateValue;
+    const [isActive, setActive] = react_1.default.useState(false);
+    return {
+        value: value !== null && value !== void 0 ? value : null,
+        setValue(v) {
+            if (props.readOnly || props.disabled) {
+                return;
+            }
+            setValue(v);
+        },
+        disabled: props.disabled,
+        readOnly: props.readOnly,
+        mode,
+        setMode(newMode) {
+            if (props.readOnly || props.disabled || newMode === mode) {
+                return;
+            }
+            setMode(newMode);
+            if (newMode === 'relative') {
+                if ((!value && valueRelative) || value) {
+                    setValue(valueRelative ? { type: 'relative', value: valueRelative } : null);
+                }
+            }
+            else if ((!value && valueDate) || value) {
+                setValue(valueDate ? { type: 'absolute', value: valueDate } : null);
+            }
+        },
+        datePickerState,
+        dateFieldState,
+        relativeDateState,
+        selectedDate,
+        isActive,
+        setActive,
+    };
+}
+exports.useRelativeDatePickerState = useRelativeDatePickerState;

package/dist/cjs/components/RelativeDatePicker/i18n/en.json

@@ -0,0 +1,4 @@
+{
+  "Calendar": "Calendar",
+  "Formula input mode": "Formula input mode"
+}

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

@@ -0,0 +1 @@
+export declare const i18n: (key: "Calendar" | "Formula input mode", params?: import("@gravity-ui/i18n").Params | undefined) => string;

package/dist/cjs/components/RelativeDatePicker/i18n/index.js

@@ -0,0 +1,11 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.i18n = void 0;
+const i18n_1 = require("@gravity-ui/uikit/i18n");
+const cn_1 = require("../../../utils/cn");
+const en_json_1 = __importDefault(require("./en.json"));
+const ru_json_1 = __importDefault(require("./ru.json"));
+exports.i18n = (0, i18n_1.addComponentKeysets)({ en: en_json_1.default, ru: ru_json_1.default }, `${cn_1.NAMESPACE}relative-date-picker`);

package/dist/cjs/components/RelativeDatePicker/i18n/ru.json

@@ -0,0 +1,4 @@
+{
+  "Calendar": "Календарь",
+  "Formula input mode": "Режим ввода формулы"
+}

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

@@ -0,0 +1,3 @@
+export * from './RelativeDatePicker';
+export * from './hooks/useRelativeDatePickerState';
+export * from './hooks/useRelativeDatePickerProps';

package/dist/cjs/components/RelativeDatePicker/index.js

@@ -0,0 +1,19 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./RelativeDatePicker"), exports);
+__exportStar(require("./hooks/useRelativeDatePickerState"), exports);
+__exportStar(require("./hooks/useRelativeDatePickerProps"), exports);

package/dist/cjs/components/hooks/useControlledState.d.ts

@@ -0,0 +1 @@
+export declare function useControlledState<T, C extends T = T>(value: T, defaultValue: T, onUpdate?: (value: C, ...args: any[]) => void): readonly [T, (newValue: C, ...args: any[]) => void];

package/dist/cjs/components/hooks/useControlledState.js

@@ -0,0 +1,30 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useControlledState = void 0;
+const react_1 = __importDefault(require("react"));
+function useControlledState(value, defaultValue, onUpdate) {
+    const [innerValue, setInnerValue] = react_1.default.useState(defaultValue);
+    const [wasControlled] = react_1.default.useState(value !== undefined);
+    const isControlled = value !== undefined;
+    if (wasControlled !== isControlled) {
+        console.warn(`WARN: A component changed from ${wasControlled ? 'controlled' : 'uncontrolled'} to ${isControlled ? 'controlled' : 'uncontrolled'}.`);
+    }
+    const currentValueRef = react_1.default.useRef(isControlled ? value : defaultValue);
+    react_1.default.useEffect(() => {
+        currentValueRef.current = value;
+    }, [value]);
+    const setState = react_1.default.useCallback((newValue, ...args) => {
+        if (!Object.is(currentValueRef.current, newValue)) {
+            onUpdate === null || onUpdate === void 0 ? void 0 : onUpdate(newValue, ...args);
+        }
+        if (!isControlled) {
+            currentValueRef.current = newValue;
+            setInnerValue(newValue);
+        }
+    }, [isControlled, onUpdate]);
+    return [isControlled ? value : innerValue, setState];
+}
+exports.useControlledState = useControlledState;

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

@@ -0,0 +1,5 @@
+export * from './Calendar';
+export * from './DateField';
+export * from './DatePicker';
+export * from './RelativeDateField';
+export * from './RelativeDatePicker';

package/dist/cjs/components/index.js

@@ -0,0 +1,21 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __exportStar = (this && this.__exportStar) || function(m, exports) {
+    for (var p in m) if (p !== "default" && !Object.prototype.hasOwnProperty.call(exports, p)) __createBinding(exports, m, p);
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+__exportStar(require("./Calendar"), exports);
+__exportStar(require("./DateField"), exports);
+__exportStar(require("./DatePicker"), exports);
+__exportStar(require("./RelativeDateField"), exports);
+__exportStar(require("./RelativeDatePicker"), exports);

package/dist/cjs/components/types/datePicker.d.ts

@@ -0,0 +1,16 @@
+import type { DateTime } from '@gravity-ui/date-utils';
+import type { InputBase, Validation, ValueBase } from './inputs';
+export interface DateFieldBase<T = DateTime> extends ValueBase<T, T | null>, InputBase, Validation {
+    /** The minimum allowed date that a user may select. */
+    minValue?: DateTime;
+    /** The maximum allowed date that a user may select. */
+    maxValue?: DateTime;
+    /** Callback that is called for each date of the calendar. If it returns true, then the date is unavailable. */
+    isDateUnavailable?: (date: DateTime) => boolean;
+    /** Format of the date when rendered in the input. [Available formats](https://day.js.org/docs/en/display/format) */
+    format?: string;
+    /** A placeholder date that controls the default values of each segment when the user first interacts with them. Defaults to today's date at midnight. */
+    placeholderValue?: DateTime;
+    /** */
+    timeZone?: string;
+}

package/dist/cjs/components/types/datePicker.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/components/types/events.d.ts

@@ -0,0 +1,17 @@
+/// <reference types="react" />
+export interface KeyboardEvents {
+    /** Handler that is called when a key is pressed. */
+    onKeyDown?: (e: React.KeyboardEvent) => void;
+    /** Handler that is called when a key is released. */
+    onKeyUp?: (e: React.KeyboardEvent) => void;
+}
+export interface FocusEvents<Target = Element> {
+    /** Handler that is called when the element receives focus. */
+    onFocus?: (e: React.FocusEvent<Target>) => void;
+    /** Handler that is called when the element loses focus. */
+    onBlur?: (e: React.FocusEvent<Target>) => void;
+}
+export interface FocusableProps<Target = Element> extends FocusEvents<Target> {
+    /** Whether the element should receive focus on render. */
+    autoFocus?: boolean;
+}

package/dist/cjs/components/types/events.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

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

@@ -0,0 +1,4 @@
+export type * from './datePicker';
+export type * from './inputs';
+export type * from './style';
+export type * from './events';

package/dist/cjs/components/types/index.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/components/types/inputs.d.ts

@@ -0,0 +1,79 @@
+/// <reference types="react" />
+import type { TextInputProps as TextInputBaseProps, TextInputPin, TextInputSize, TextInputView } from '@gravity-ui/uikit';
+export type ValidationState = 'invalid';
+export interface AccessibilityProps {
+    /** Defines a string value that labels the current element. */
+    'aria-label'?: string;
+    /** Identifies the element (or elements) that labels the current element. */
+    'aria-labelledby'?: string;
+    /** Identifies the element (or elements) that describes the object. */
+    'aria-describedby'?: string;
+    /** Identifies the element (or elements) that provide a detailed, extended description for the object. */
+    'aria-details'?: string;
+}
+export interface ValueBase<T, C = T> {
+    /** The current value (controlled). */
+    value?: T | null;
+    /** The default value (uncontrolled). */
+    defaultValue?: T;
+    /** Handler that is called when the value changes. */
+    onUpdate?: (value: C) => void;
+}
+export interface Validation {
+    /** Whether the input should display its "invalid" visual styling */
+    validationState?: ValidationState;
+    /** An error message for the field */
+    errorMessage?: React.ReactNode;
+}
+export interface DomProps {
+    /** The element's unique identifier. */
+    id?: string;
+}
+export interface InputBase {
+    /**
+     * Whether the field is disabled.
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * Whether the calendar value is immutable.
+     * @default false
+     */
+    readOnly?: boolean;
+}
+export interface TextInputProps {
+    /** The size of the element */
+    size?: TextInputSize;
+    /**
+     * Corner rounding
+     * @default 'round-round'
+     */
+    pin?: TextInputPin;
+    /** Control view */
+    view?: TextInputView;
+    /** Inner field label */
+    label?: TextInputBaseProps['label'];
+    /** Text that appears in the field when it has no value set */
+    placeholder?: string;
+    /**
+     * Show clear button
+     * @default false
+     */
+    hasClear?: boolean;
+}
+export interface TextInputExtendProps {
+    /**
+     * User`s node rendered before label and input
+     */
+    leftContent?: TextInputBaseProps['leftContent'];
+    /**
+     * User`s node rendered after input and clear button
+     */
+    rightContent?: TextInputBaseProps['rightContent'];
+}
+export interface RangeValue<T> {
+    /** The start value of the range. */
+    start: T;
+    /** The end value of the range. */
+    end: T;
+}

package/dist/cjs/components/types/inputs.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/components/types/style.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+export interface StyleProps {
+    /** Sets inline style for the element. */
+    style?: React.CSSProperties;
+    /** Sets the CSS className for the element. */
+    className?: string;
+}

package/dist/cjs/components/types/style.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package/dist/cjs/components/utils/getButtonSizeForInput.d.ts

@@ -0,0 +1,2 @@
+import type { TextInputSize } from '@gravity-ui/uikit';
+export declare function getButtonSizeForInput(size: TextInputSize | undefined): "s" | "m" | "l" | "xs";

package/dist/cjs/components/utils/getButtonSizeForInput.js

@@ -0,0 +1,20 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getButtonSizeForInput = void 0;
+function getButtonSizeForInput(size) {
+    switch (size) {
+        case 'xl': {
+            return 'l';
+        }
+        case 'l': {
+            return 'm';
+        }
+        case 's': {
+            return 'xs';
+        }
+        default: {
+            return 's';
+        }
+    }
+}
+exports.getButtonSizeForInput = getButtonSizeForInput;

package/dist/cjs/components/utils/mergeProps.d.ts

@@ -0,0 +1,13 @@
+interface Props {
+    [key: string]: any;
+}
+type PropsArgs = Props | undefined | null;
+type TupleTypes<T> = {
+    [P in keyof T]: T[P];
+} extends {
+    [key: number]: infer V;
+} ? NullToObject<V> : never;
+type NullToObject<T> = T extends null | undefined ? {} : T;
+type UnionToIntersection<U> = (U extends any ? (k: U) => void : never) extends (k: infer I) => void ? I : never;
+export declare function mergeProps<T extends PropsArgs[]>(...args: T): UnionToIntersection<TupleTypes<T>>;
+export {};