@skbkontur/react-ui 4.17.4 → 4.18.0-fix-safari-textarea

package/components/Tabs/Indicator.d.ts

@@ -1,28 +1,28 @@
-import React from 'react';
-import { TabsContextType } from './TabsContext';
-export interface IndicatorProps {
-    className?: string;
-    tabUpdates: {
-        on: (x0: () => void) => () => void;
-    };
-    vertical: boolean;
-}
-export interface IndicatorState {
-    styles: React.CSSProperties;
-}
-export declare class Indicator extends React.Component<IndicatorProps, IndicatorState> {
-    static contextType: React.Context<TabsContextType<any>>;
-    context: TabsContextType;
-    state: IndicatorState;
-    private theme;
-    private eventListener;
-    private removeTabUpdatesListener;
-    private setRootNode;
-    componentDidMount(): void;
-    componentWillUnmount(): void;
-    componentDidUpdate(): void;
-    render(): JSX.Element;
-    private renderMain;
-    private reflow;
-    private getStyles;
-}
+import React from 'react';
+import { TabsContextType } from './TabsContext';
+export interface IndicatorProps {
+    className?: string;
+    tabUpdates: {
+        on: (x0: () => void) => () => void;
+    };
+    vertical: boolean;
+}
+export interface IndicatorState {
+    styles: React.CSSProperties;
+}
+export declare class Indicator extends React.Component<IndicatorProps, IndicatorState> {
+    static contextType: React.Context<TabsContextType<any>>;
+    context: TabsContextType;
+    state: IndicatorState;
+    private theme;
+    private eventListener;
+    private removeTabUpdatesListener;
+    private setRootNode;
+    componentDidMount(): void;
+    componentWillUnmount(): void;
+    componentDidUpdate(): void;
+    render(): JSX.Element;
+    private renderMain;
+    private reflow;
+    private getStyles;
+}

package/components/Tabs/Indicator.styles.d.ts

@@ -1,8 +1,8 @@
-import { Theme } from '../../lib/theming/Theme';
-export declare const styles: {
-    root(t: Theme): string;
-    primary(t: Theme): string;
-    success(t: Theme): string;
-    warning(t: Theme): string;
-    error(t: Theme): string;
-};
+import { Theme } from '../../lib/theming/Theme';
+export declare const styles: {
+    root(t: Theme): string;
+    primary(t: Theme): string;
+    success(t: Theme): string;
+    warning(t: Theme): string;
+    error(t: Theme): string;
+};

package/components/Tabs/Tab.d.ts

@@ -1,101 +1,101 @@
-import React, { AriaAttributes } from 'react';
-import { Nullable } from '../../typings/utility-types';
-import { CommonProps } from '../../internal/CommonWrapper';
-import { SizeProp } from '../../lib/types/props';
-import { TabsContextType } from './TabsContext';
-export interface TabIndicators {
-    error: boolean;
-    warning: boolean;
-    success: boolean;
-    primary: boolean;
-    disabled: boolean;
-}
-export declare const TabDataTids: {
-    readonly root: "Tab__root";
-};
-/**
- * @deprecated use SizeProp
- */
-export declare type TabSize = SizeProp;
-export interface TabProps<T extends string = string> extends Pick<AriaAttributes, 'aria-label' | 'aria-describedby'>, CommonProps {
-    /**
-     * Позволяет передавать свой компонент, строку или функцию, которая заменит собой элемент используемый в компоненте по умолчанию. Реализует паттерн [render prop](https://www.patterns.dev/posts/render-props-pattern).
-     */
-    component?: React.ComponentType<any> | string;
-    /**
-     * `HTML`-аттрибут `href`.
-     */
-    href?: string;
-    /**
-     * Уникальный идентификатор таба. По нему компонент `<Tabs />` определяет какой `<Tab />` сейчас выбран.
-     */
-    id?: T;
-    /**
-     * `HTML`-событие `onclick`.
-     */
-    onClick?: (event: React.MouseEvent<HTMLElement>) => void;
-    /**
-     * `HTML`-событие `onkeydown`.
-     */
-    onKeyDown?: (event: React.KeyboardEvent<HTMLElement>) => void;
-    /**
-     * Переводит компонент в отключенное состояние.
-     */
-    disabled?: boolean;
-    /**
-     * Визуальное состояние ошибки.
-     */
-    error?: boolean;
-    /**
-     * Визуальное состояние предупреждения.
-     */
-    warning?: boolean;
-    /**
-     * Визуальное состояние успеха.
-     */
-    success?: boolean;
-    /**
-     * Визуальное состояние главного элемента.
-     */
-    primary?: boolean;
-}
-export interface TabState {
-    focusedByKeyboard: boolean;
-}
-declare type DefaultProps = Required<Pick<TabProps, 'component' | 'href'>>;
-/**
- * Вложенный элемент компонента `<Tabs />`.
- */
-export declare class Tab<T extends string = string> extends React.Component<TabProps<T>, TabState> {
-    static __KONTUR_REACT_UI__: string;
-    static contextType: React.Context<TabsContextType<any>>;
-    context: TabsContextType;
-    static defaultProps: DefaultProps;
-    private getProps;
-    state: TabState;
-    private theme;
-    private tabComponent;
-    private setRootNode;
-    constructor(props: TabProps<T>);
-    componentDidMount(): void;
-    componentDidUpdate(): void;
-    componentWillUnmount(): void;
-    render(): JSX.Element;
-    getIndicators(): {
-        error: boolean;
-        warning: boolean;
-        success: boolean;
-        primary: boolean;
-        disabled: boolean;
-    };
-    getUnderlyingNode: () => Nullable<React.ReactElement<Tab<T>, string | React.JSXElementConstructor<any>>>;
-    private renderMain;
-    private getId;
-    private refTabComponent;
-    private getTabInstance;
-    private switchTab;
-    private handleKeyDown;
-    private handleFocus;
-    private handleBlur;
-}
-export {};
+import React, { AriaAttributes } from 'react';
+import { Nullable } from '../../typings/utility-types';
+import { CommonProps } from '../../internal/CommonWrapper';
+import { SizeProp } from '../../lib/types/props';
+import { TabsContextType } from './TabsContext';
+export interface TabIndicators {
+    error: boolean;
+    warning: boolean;
+    success: boolean;
+    primary: boolean;
+    disabled: boolean;
+}
+export declare const TabDataTids: {
+    readonly root: "Tab__root";
+};
+/**
+ * @deprecated use SizeProp
+ */
+export declare type TabSize = SizeProp;
+export interface TabProps<T extends string = string> extends Pick<AriaAttributes, 'aria-label' | 'aria-describedby'>, CommonProps {
+    /**
+     * Позволяет передавать свой компонент, строку или функцию, которая заменит собой элемент используемый в компоненте по умолчанию. Реализует паттерн [render prop](https://www.patterns.dev/posts/render-props-pattern).
+     */
+    component?: React.ComponentType<any> | string;
+    /**
+     * `HTML`-аттрибут `href`.
+     */
+    href?: string;
+    /**
+     * Уникальный идентификатор таба. По нему компонент `<Tabs />` определяет какой `<Tab />` сейчас выбран.
+     */
+    id?: T;
+    /**
+     * `HTML`-событие `onclick`.
+     */
+    onClick?: (event: React.MouseEvent<HTMLElement>) => void;
+    /**
+     * `HTML`-событие `onkeydown`.
+     */
+    onKeyDown?: (event: React.KeyboardEvent<HTMLElement>) => void;
+    /**
+     * Переводит компонент в отключенное состояние.
+     */
+    disabled?: boolean;
+    /**
+     * Визуальное состояние ошибки.
+     */
+    error?: boolean;
+    /**
+     * Визуальное состояние предупреждения.
+     */
+    warning?: boolean;
+    /**
+     * Визуальное состояние успеха.
+     */
+    success?: boolean;
+    /**
+     * Визуальное состояние главного элемента.
+     */
+    primary?: boolean;
+}
+export interface TabState {
+    focusedByKeyboard: boolean;
+}
+declare type DefaultProps = Required<Pick<TabProps, 'component' | 'href'>>;
+/**
+ * Вложенный элемент компонента `<Tabs />`.
+ */
+export declare class Tab<T extends string = string> extends React.Component<TabProps<T>, TabState> {
+    static __KONTUR_REACT_UI__: string;
+    static contextType: React.Context<TabsContextType<any>>;
+    context: TabsContextType;
+    static defaultProps: DefaultProps;
+    private getProps;
+    state: TabState;
+    private theme;
+    private tabComponent;
+    private setRootNode;
+    constructor(props: TabProps<T>);
+    componentDidMount(): void;
+    componentDidUpdate(): void;
+    componentWillUnmount(): void;
+    render(): JSX.Element;
+    getIndicators(): {
+        error: boolean;
+        warning: boolean;
+        success: boolean;
+        primary: boolean;
+        disabled: boolean;
+    };
+    getUnderlyingNode: () => Nullable<React.ReactElement<Tab<T>, string | React.JSXElementConstructor<any>>>;
+    private renderMain;
+    private getId;
+    private refTabComponent;
+    private getTabInstance;
+    private switchTab;
+    private handleKeyDown;
+    private handleFocus;
+    private handleBlur;
+}
+export {};

package/components/Tabs/Tab.styles.d.ts

@@ -1,33 +1,33 @@
-import { Theme } from '../../lib/theming/Theme';
-export declare const globalClasses: {
-    focus: string;
-};
-export declare const styles: {
-    rootSmall(t: Theme): string;
-    rootMedium(t: Theme): string;
-    rootLarge(t: Theme): string;
-    verticalSmall(t: Theme): string;
-    verticalMedium(t: Theme): string;
-    verticalLarge(t: Theme): string;
-    focusSmall(t: Theme): string;
-    focusMedium(t: Theme): string;
-    focusLarge(t: Theme): string;
-    disabled(t: Theme): string;
-    active(): string;
-};
-export declare const horizontalStyles: {
-    active(t: Theme): string;
-    disabled(): string;
-    primary(t: Theme): string;
-    success(t: Theme): string;
-    warning(t: Theme): string;
-    error(t: Theme): string;
-};
-export declare const verticalStyles: {
-    active(t: Theme): string;
-    disabled(): string;
-    primary(t: Theme): string;
-    success(t: Theme): string;
-    warning(t: Theme): string;
-    error(t: Theme): string;
-};
+import { Theme } from '../../lib/theming/Theme';
+export declare const globalClasses: {
+    focus: string;
+};
+export declare const styles: {
+    rootSmall(t: Theme): string;
+    rootMedium(t: Theme): string;
+    rootLarge(t: Theme): string;
+    verticalSmall(t: Theme): string;
+    verticalMedium(t: Theme): string;
+    verticalLarge(t: Theme): string;
+    focusSmall(t: Theme): string;
+    focusMedium(t: Theme): string;
+    focusLarge(t: Theme): string;
+    disabled(t: Theme): string;
+    active(): string;
+};
+export declare const horizontalStyles: {
+    active(t: Theme): string;
+    disabled(): string;
+    primary(t: Theme): string;
+    success(t: Theme): string;
+    warning(t: Theme): string;
+    error(t: Theme): string;
+};
+export declare const verticalStyles: {
+    active(t: Theme): string;
+    disabled(): string;
+    primary(t: Theme): string;
+    success(t: Theme): string;
+    warning(t: Theme): string;
+    error(t: Theme): string;
+};

package/components/Tabs/Tabs.d.ts

@@ -1,65 +1,65 @@
-import React, { AriaAttributes } from 'react';
-import { CommonProps } from '../../internal/CommonWrapper';
-import { SizeProp } from '../../lib/types/props';
-import { Tab } from './Tab';
-declare type ValueBaseType = string;
-export interface TabsProps<T extends ValueBaseType = string> extends CommonProps {
-    /**
-     * Позволяет задать кастомный класс подчёркиванию таба.
-     */
-    indicatorClassName?: string;
-    /**
-     * Задаёт размер контрола.
-     *
-     * **Допустимые значения**: `"small"`, `"medium"`, `"large"`.
-     */
-    size?: SizeProp;
-    /**
-     * Задаёт текущий активный `<Tab />`. Принимает `id` таба.
-     */
-    value: T;
-    /**
-     * Функция, позволяющая изменить текущий активный `<Tab />`.
-     */
-    onValueChange?: (value: T) => void;
-    /**
-     * Переводит компонент в режим вертикального отображения.
-     * @default false
-     */
-    vertical?: boolean;
-    /**
-     * `CSS`-свойство `width`.
-     */
-    width?: number | string;
-    /**
-     * Атрибут для указания id элемента(-ов), описывающих его.
-     */
-    'aria-describedby'?: AriaAttributes['aria-describedby'];
-}
-export declare const TabsDataTids: {
-    readonly root: "Tabs__root";
-    readonly indicatorRoot: "Indicator__root";
-};
-declare type DefaultProps = Required<Pick<TabsProps, 'vertical' | 'size'>>;
-/**
- * Родитель компонента `<Tab />`. Связывает `Tab`'ы в группу и позволяет управлять их состоянием.
- */
-export declare class Tabs<T extends string = string> extends React.Component<TabsProps<T>> {
-    static __KONTUR_REACT_UI__: string;
-    static defaultProps: DefaultProps;
-    private getProps;
-    static Tab: typeof Tab;
-    private theme;
-    private tabs;
-    private tabUpdates;
-    private listeners;
-    private setRootNode;
-    render(): JSX.Element;
-    private shiftFocus;
-    private notifyUpdate;
-    private switchTab;
-    private getTab;
-    private addTab;
-    private removeTab;
-}
-export {};
+import React, { AriaAttributes } from 'react';
+import { CommonProps } from '../../internal/CommonWrapper';
+import { SizeProp } from '../../lib/types/props';
+import { Tab } from './Tab';
+declare type ValueBaseType = string;
+export interface TabsProps<T extends ValueBaseType = string> extends CommonProps {
+    /**
+     * Позволяет задать кастомный класс подчёркиванию таба.
+     */
+    indicatorClassName?: string;
+    /**
+     * Задаёт размер контрола.
+     *
+     * **Допустимые значения**: `"small"`, `"medium"`, `"large"`.
+     */
+    size?: SizeProp;
+    /**
+     * Задаёт текущий активный `<Tab />`. Принимает `id` таба.
+     */
+    value: T;
+    /**
+     * Функция, позволяющая изменить текущий активный `<Tab />`.
+     */
+    onValueChange?: (value: T) => void;
+    /**
+     * Переводит компонент в режим вертикального отображения.
+     * @default false
+     */
+    vertical?: boolean;
+    /**
+     * `CSS`-свойство `width`.
+     */
+    width?: number | string;
+    /**
+     * Атрибут для указания id элемента(-ов), описывающих его.
+     */
+    'aria-describedby'?: AriaAttributes['aria-describedby'];
+}
+export declare const TabsDataTids: {
+    readonly root: "Tabs__root";
+    readonly indicatorRoot: "Indicator__root";
+};
+declare type DefaultProps = Required<Pick<TabsProps, 'vertical' | 'size'>>;
+/**
+ * Родитель компонента `<Tab />`. Связывает `Tab`'ы в группу и позволяет управлять их состоянием.
+ */
+export declare class Tabs<T extends string = string> extends React.Component<TabsProps<T>> {
+    static __KONTUR_REACT_UI__: string;
+    static defaultProps: DefaultProps;
+    private getProps;
+    static Tab: typeof Tab;
+    private theme;
+    private tabs;
+    private tabUpdates;
+    private listeners;
+    private setRootNode;
+    render(): JSX.Element;
+    private shiftFocus;
+    private notifyUpdate;
+    private switchTab;
+    private getTab;
+    private addTab;
+    private removeTab;
+}
+export {};

package/components/Tabs/Tabs.styles.d.ts

@@ -1,7 +1,7 @@
-import { Theme } from '../../lib/theming/Theme';
-export declare const styles: {
-    rootSmall(t: Theme): string;
-    rootMedium(t: Theme): string;
-    rootLarge(t: Theme): string;
-    vertical(): string;
-};
+import { Theme } from '../../lib/theming/Theme';
+export declare const styles: {
+    rootSmall(t: Theme): string;
+    rootMedium(t: Theme): string;
+    rootLarge(t: Theme): string;
+    vertical(): string;
+};

package/components/Tabs/TabsContext.d.ts

@@ -1,16 +1,16 @@
-import React from 'react';
-import { SizeProp } from '../../lib/types/props';
-import { Tab } from './Tab';
-export interface TabsContextType<T extends string = any> {
-    vertical: boolean;
-    activeTab: T;
-    size: SizeProp;
-    getTab: (id: T) => Tab<T> | null | void;
-    addTab: (id: T, getNode: () => Tab<T>) => void;
-    notifyUpdate: () => void;
-    removeTab: (id: T) => void;
-    shiftFocus: (fromTab: T, delta: number) => void;
-    switchTab: (id: T) => void;
-}
-export declare const TabsContextDefaultValue: TabsContextType;
-export declare const TabsContext: React.Context<TabsContextType<any>>;
+import React from 'react';
+import { SizeProp } from '../../lib/types/props';
+import { Tab } from './Tab';
+export interface TabsContextType<T extends string = any> {
+    vertical: boolean;
+    activeTab: T;
+    size: SizeProp;
+    getTab: (id: T) => Tab<T> | null | void;
+    addTab: (id: T, getNode: () => Tab<T>) => void;
+    notifyUpdate: () => void;
+    removeTab: (id: T) => void;
+    shiftFocus: (fromTab: T, delta: number) => void;
+    switchTab: (id: T) => void;
+}
+export declare const TabsContextDefaultValue: TabsContextType;
+export declare const TabsContext: React.Context<TabsContextType<any>>;

package/components/Tabs/helpers.d.ts

@@ -1,6 +1,6 @@
-import { Theme } from '../../lib/theming/Theme';
-import { SizeProp } from '../../lib/types/props';
-export declare function fontSize(t: Theme, size: SizeProp): string;
-export declare function lineHeight(t: Theme, size: SizeProp): string;
-export declare function paddingX(t: Theme, size: SizeProp): string;
-export declare function paddingY(t: Theme, size: SizeProp): string;
+import { Theme } from '../../lib/theming/Theme';
+import { SizeProp } from '../../lib/types/props';
+export declare function fontSize(t: Theme, size: SizeProp): string;
+export declare function lineHeight(t: Theme, size: SizeProp): string;
+export declare function paddingX(t: Theme, size: SizeProp): string;
+export declare function paddingY(t: Theme, size: SizeProp): string;

package/components/Tabs/index.d.ts

@@ -1,2 +1,2 @@
-export * from './Tabs';
-export * from './Tab';
+export * from './Tabs';
+export * from './Tab';

package/components/Textarea/Textarea/Textarea.js

@@ -18,7 +18,7 @@ import * as LayoutEvents from "../../../lib/LayoutEvents";
 import { ThemeContext } from "../../../lib/theming/ThemeContext";
 import { RenderLayer } from "../../../internal/RenderLayer";
 import { ResizeDetector } from "../../../internal/ResizeDetector";
-import { isIE11 } from "../../../lib/client";
+import { isIE11, isSafari } from "../../../lib/client";
 import { CommonWrapper } from "../../../internal/CommonWrapper";
 import { isTestEnv } from "../../../lib/currentEnvironment";
 import { cx } from "../../../lib/theming/Emotion";
@@ -33,6 +33,7 @@ import { TextareaCounter } from "../TextareaCounter";
 
 var DEFAULT_WIDTH = 250;
 var AUTORESIZE_THROTTLE_DEFAULT_WAIT = 100;
+var ZERO_WIDTH_SPACE = String.fromCharCode(0x200b);
 export var TextareaDataTids = {
   root: 'Textarea__root',
   counter: 'TextareaCounter__root',
@@ -171,6 +172,11 @@ var Textarea = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_Reac
         onCloseHelp: _this.handleCloseCounterHelp,
         ref: _this.refCounter
       });
+
+      if (isSafari && textareaProps.value) {
+        textareaProps.value = textareaProps.value.toString().replace(/(\r|\n)/g, "$1" + ZERO_WIDTH_SPACE);
+      }
+
       return /*#__PURE__*/React.createElement(RenderLayer, {
         onFocusOutside: _this.handleCloseCounterHelp,
         onClickOutside: _this.handleCloseCounterHelp,
@@ -229,7 +235,10 @@ var Textarea = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_Reac
       }
 
       if (_this.props.onValueChange) {
-        _this.props.onValueChange(e.target.value);
+        // @ts-expect-error: method replaceAll exists
+        var _value = isSafari ? e.target.value.replaceAll(ZERO_WIDTH_SPACE, '') : e.target.value;
+
+        _this.props.onValueChange(_value);
       }
 
       if (_this.props.autoResize) {