npm - @skbkontur/react-ui - Versions diffs - 6.0.7 → 6.1.0 - Mend

@skbkontur/react-ui 6.0.7 → 6.1.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (178) hide show

package/components/Toast/Toast.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Toast.js","sourceRoot":"","sources":["../../../components/Toast/Toast.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,aAAa,EAAE,eAAe,EAAE,MAAM,wBAAwB,CAAC;AAGxE,OAAO,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AACtE,OAAO,EAAE,eAAe,EAAE,MAAM,yCAAyC,CAAC;AAC1E,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAE5D,OAAO,EAAE,qBAAqB,EAAE,MAAM,sCAAsC,CAAC;AAE7E,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAEvD,OAAO,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;AACjE,OAAO,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;AAEjE,OAAO,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AAC9C,OAAO,EAAE,SAAS,EAAE,MAAM,gBAAgB,CAAC;AAyD3C,MAAM,CAAC,IAAM,aAAa,GAAG;IAC3B,WAAW,EAAE,aAAa;IAC1B,SAAS,EAAE,iBAAiB;IAC5B,MAAM,EAAE,mBAAmB;IAC3B,KAAK,EAAE,kBAAkB;CACjB,CAAC;AAEX;;;;GAIG;AAGH;IAA2B,yBAAuC;IAchE,eAAY,KAAiB;QAC3B,YAAA,MAAK,YAAC,KAAK,CAAC,SAAC;QAHP,aAAO,GAAG,KAAK,CAAC,SAAS,EAAe,CAAC;QAqCjD;;;;;;;;;WASG;QACI,UAAI,GAAiB,UAAC,YAA6B,EAAE,MAAwB;YAClF,IAAI,KAAI,CAAC,KAAK,CAAC,YAAY,EAAE,CAAC;gBAC5B,KAAI,CAAC,KAAK,EAAE,CAAC;YACf,CAAC;YAED,UAAU,CAAC,KAAI,CAAC,KAAK,CAAC,MAAM,EAAE,YAAY,EAAE,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,MAAM,CAAC,CAAC;YAE5D,KAAI,CAAC,QAAQ,CACX,UAAC,EAAM;;oBAAJ,EAAE,QAAA;gBAAO,OAAA,CAAC;oBACX,YAAY,cAAA;oBACZ,MAAM,EAAE,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,MAAM;oBACtB,EAAE,EAAE,EAAE,GAAG,CAAC;oBACV,QAAQ,EAAE,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,QAAQ;oBAC1B,aAAa,EAAE,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,aAAa;oBACpC,UAAU,EAAE,MAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,GAAG,mCAAI,SAAS;iBACrC,CAAC,CAAA;aAAA,EACF,KAAI,CAAC,SAAS,CACf,CAAC;QACJ,CAAC,CAAC;QAEF;;WAEG;QACI,WAAK,GAAG;YACb,UAAU,CAAC,KAAI,CAAC,KAAK,CAAC,OAAO,EAAE,KAAI,CAAC,KAAK,CAAC,YAAY,EAAE,KAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;YAC3E,KAAI,CAAC,QAAQ,CAAC,EAAE,YAAY,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,CAAC,CAAC;QACtD,CAAC,CAAC;QA4CM,gBAAU,GAAG,UAAC,OAA0B;YAC9C,KAAI,CAAC,WAAW,CAAC,OAAO,CAAC,CAAC;YAC1B,0FAA0F;YAC1F,KAAI,CAAC,OAAO,CAAC,OAAO,GAAG,OAAO,CAAC;QACjC,CAAC,CAAC;QAEM,iBAAW,GAAG;YACpB,IAAI,KAAI,CAAC,QAAQ,EAAE,CAAC;gBAClB,YAAY,CAAC,KAAI,CAAC,QAAQ,CAAC,CAAC;gBAC5B,KAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;YACvB,CAAC;QACH,CAAC,CAAC;QAEM,eAAS,GAAG;;YAClB,KAAI,CAAC,WAAW,EAAE,CAAC;YAEnB,IAAI,QAAQ,GAAG,KAAI,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC;YAC/C,QAAQ,GAAG,MAAA,KAAI,CAAC,KAAK,CAAC,QAAQ,mCAAI,QAAQ,CAAC;YAC3C,KAAI,CAAC,QAAQ,GAAG,UAAU,CAAC,KAAI,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC;QACnD,CAAC,CAAC;QAEM,eAAS,GAAG,UAAC,OAAkB;YACrC,KAAI,CAAC,MAAM,GAAG,OAAO,CAAC;QACxB,CAAC,CAAC;QAxIA,KAAI,CAAC,KAAK,GAAG;YACX,YAAY,EAAE,IAAI;YAClB,MAAM,EAAE,IAAI;YACZ,EAAE,EAAE,CAAC;YACL,QAAQ,EAAE,IAAI;YACd,aAAa,EAAE,KAAK;YACpB,UAAU,EAAE,SAAS;SACtB,CAAC;;IACJ,CAAC;IAEM,oCAAoB,GAA3B;QACE,IAAI,CAAC,WAAW,EAAE,CAAC;IACrB,CAAC;IAEM,sBAAM,GAAb;QAAA,iBAiBC;QAhBC,IAAI,CAAC,MAAM,GAAG,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAEtC,OAAO,CACL,oBAAC,YAAY,CAAC,QAAQ,QACnB,UAAC,KAAK;YACL,KAAI,CAAC,KAAK,GAAG,KAAI,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,YAAY,CAAC,MAAM,CAAC,KAAI,CAAC,KAAK,CAAC,KAAc,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC;YAC9F,OAAO,CACL,oBAAC,YAAY,CAAC,QAAQ,IAAC,KAAK,EAAE,KAAI,CAAC,KAAK;gBACtC,oBAAC,eAAe;oBACd,oBAAC,eAAe,QAAE,KAAI,CAAC,YAAY,EAAE,CAAmB,CACxC,CACI,CACzB,CAAC;QACJ,CAAC,CACqB,CACzB,CAAC;IACJ,CAAC;IAwCO,4BAAY,GAApB;QACQ,IAAA,KAA0D,IAAI,CAAC,KAAK,EAAlE,YAAY,kBAAA,EAAE,MAAM,YAAA,EAAE,EAAE,QAAA,EAAE,aAAa,mBAAA,EAAE,UAAU,gBAAe,CAAC;QAE3E,IAAI,CAAC,YAAY,EAAE,CAAC;YAClB,OAAO,IAAI,CAAC;QACd,CAAC;QAED,IAAM,UAAU,GAAmB;YACjC,YAAY,EAAE,IAAI,CAAC,WAAW;YAC9B,YAAY,EAAE,IAAI,CAAC,SAAS;YAC5B,OAAO,EAAE,IAAI,CAAC,KAAK;YACnB,QAAQ,EAAE,YAAY;YACtB,YAAY,EAAE,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC;YACtC,MAAM,QAAA;YACN,aAAa,eAAA;YACb,GAAG,EAAE,UAAU;SAChB,CAAC;QAEF,OAAO,CACL,oBAAC,aAAa,IACZ,GAAG,EAAE,EAAE,EACP,UAAU,EAAE;gBACV,KAAK,EAAE,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE;gBAC1B,WAAW,EAAE,IAAI,CAAC,MAAM,CAAC,WAAW,EAAE;gBACtC,IAAI,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE;gBACxB,UAAU,EAAE,IAAI,CAAC,MAAM,CAAC,UAAU,EAAE;aACrC,EACD,OAAO,EAAE;gBACP,KAAK,EAAE,GAAG;gBACV,IAAI,EAAE,GAAG;aACV,EACD,KAAK,EAAE,CAAC,SAAS,EACjB,IAAI,EAAE,CAAC,SAAS,EAChB,OAAO,EAAE,IAAI,CAAC,OAAO;YAErB,oBAAC,aAAa,aAAC,WAAW,EAAE,IAAI,CAAC,UAAU,IAAM,IAAI,CAAC,KAAK;gBACzD,oBAAC,SAAS,aAAC,GAAG,EAAE,IAAI,CAAC,SAAS,IAAM,UAAU,EAAI,CACpC,CACF,CACjB,CAAC;IACJ,CAAC;IA9Ha,yBAAmB,GAAG,OAAO,AAAV,CAAW;IAC9B,iBAAW,GAAG,OAAO,AAAV,CAAW;IAFzB,KAAK;QAFjB,qBAAqB;QACrB,QAAQ;OACI,KAAK,CAyJjB;IAAD,YAAC;CAAA,AAzJD,CAA2B,KAAK,CAAC,SAAS,GAyJzC;SAzJY,KAAK;AA2JlB,SAAS,UAAU,CAAC,EAA8B;IAAE,cAAc;SAAd,UAAc,EAAd,qBAAc,EAAd,IAAc;QAAd,6BAAc;;IAChE,IAAI,EAAE,EAAE,CAAC;QACP,EAAE,eAAI,IAAI,EAAE;IACd,CAAC;AACH,CAAC","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\nimport type { AriaAttributes } from 'react';\nimport React from 'react';\nimport { CSSTransition, TransitionGroup } from 'react-transition-group';\n\nimport type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { RenderContainer } from '../../internal/RenderContainer/index.js';\nimport { isTestEnv } from '../../lib/currentEnvironment.js';\nimport type { SafeTimer } from '../../lib/globalObject.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport type { Theme, ThemeIn } from '../../lib/theming/Theme.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory.js';\nimport type { Nullable } from '../../typings/utility-types.js';\nimport { getStyles } from './Toast.styles.js';\nimport { ToastView } from './ToastView.js';\nimport type { ToastViewProps } from './ToastView.js';\n\nexport interface Action {\n label: string;\n handler: () => void;\n 'aria-label'?: string;\n}\n\n/*\n Состояния тоста:\n \n - default стиль для отображения по умолчанию\n * - error стиль для отображения ошибок\n /\nexport type ToastUse = 'default' \| 'error';\n\nexport interface ToastState {\n notification: Nullable<React.ReactNode>;\n action: Nullable<Action>;\n id: number;\n showTime: Nullable<number>;\n showCloseIcon?: boolean;\n currentUse: ToastUse;\n}\n\nexport interface ToastProps extends Pick<AriaAttributes, 'aria-label'>, CommonProps {\n / Задает функцию, которая вызывается при возникновении тоста. /\n onPush?: (notification: string, action?: Action) => void;\n\n /* Задает функцию, которая вызывается при закрытии тоста. /\n onClose?: (notification: string, action?: Action) => void;\n\n /* Задает объект с переменными темы. Он будет объединён с темой из контекста. /\n theme?: ThemeIn;\n}\n\n/* Объект с конфигурацией отображения Toast-а /\nexport interface ToastPushConfig {\n action?: Nullable<Action>;\n showTime?: number;\n showCloseIcon?: boolean;\n /\n Определяет стили для тоста.\n \n - default стиль для отображения по умолчанию\n * - error стиль для отображения ошибок\n \n По умолчанию будет использован стиль default.\n /\n use?: ToastUse;\n}\n\nexport type ToastPushApi = (notification: React.ReactNode, config?: ToastPushConfig) => void;\n\nexport type ToastClose = () => void;\n\nexport const ToastDataTids = {\n toastStatic: 'StaticToast',\n toastView: 'ToastView__root',\n action: 'ToastView__action',\n close: 'ToastView__close',\n} as const;\n\n/\n * `Toast` — это короткое немодальное уведомление, которое сообщает пользователю о результате выполнения его команды.\n * Результат может быть положительным, отрицательным или нейтральным.\n \n /\n@withRenderEnvironment\n@rootNode\nexport class Toast extends React.Component<ToastProps, ToastState> {\n public static __KONTUR_REACT_UI__ = 'Toast';\n public static displayName = 'Toast';\n\n public getRootNode!: TGetRootNode;\n private setRootNode!: TSetRootNode;\n private styles!: ReturnType<typeof getStyles>;\n private emotion!: Emotion;\n private theme!: Theme;\n\n public _toast: Nullable<ToastView>;\n private _timeout: SafeTimer;\n private rootRef = React.createRef<HTMLElement>();\n\n constructor(props: ToastProps) {\n super(props);\n this.state = {\n notification: null,\n action: null,\n id: 0,\n showTime: null,\n showCloseIcon: false,\n currentUse: 'default',\n };\n }\n\n public componentWillUnmount() {\n this._clearTimer();\n }\n\n public render(): React.JSX.Element {\n this.styles = getStyles(this.emotion);\n\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = this.props.theme ? ThemeFactory.create(this.props.theme as Theme, theme) : theme;\n return (\n <ThemeContext.Provider value={this.theme}>\n <RenderContainer>\n <TransitionGroup>{this._renderToast()}</TransitionGroup>\n </RenderContainer>\n </ThemeContext.Provider>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n\n /*\n Показывает тост с `notification` в качестве сообщения.\n * Тост автоматически скрывается через 3 или 7 секунд,\n * в зависимости от наличия у него кнопки `action` внутри config-а.\n * Время показа можно задать вручную, передав `showTime` внутри config-а.\n \n @public\n * @param {React.ReactNode} notification\n * @param {ToastPushConfig} config объект с конфигурацией отображения компонента Toast\n /\n public push: ToastPushApi = (notification: React.ReactNode, config?: ToastPushConfig) => {\n if (this.state.notification) {\n this.close();\n }\n\n safelyCall(this.props.onPush, notification, config?.action);\n\n this.setState(\n ({ id }) => ({\n notification,\n action: config?.action,\n id: id + 1,\n showTime: config?.showTime,\n showCloseIcon: config?.showCloseIcon,\n currentUse: config?.use ?? 'default',\n }),\n this._setTimer,\n );\n };\n\n /\n @public\n */\n public close = (): void => {\n safelyCall(this.props.onClose, this.state.notification, this.state.action);\n this.setState({ notification: null, action: null });\n };\n\n private _renderToast() {\n const { notification, action, id, showCloseIcon, currentUse } = this.state;\n\n if (!notification) {\n return null;\n }\n\n const toastProps: ToastViewProps = {\n onMouseEnter: this._clearTimer,\n onMouseLeave: this._setTimer,\n onClose: this.close,\n children: notification,\n 'aria-label': this.props['aria-label'],\n action,\n showCloseIcon,\n use: currentUse,\n };\n\n return (\n <CSSTransition\n key={id}\n classNames={{\n enter: this.styles.enter(),\n enterActive: this.styles.enterActive(),\n exit: this.styles.exit(),\n exitActive: this.styles.exitActive(),\n }}\n timeout={{\n enter: 200,\n exit: 150,\n }}\n enter={!isTestEnv}\n exit={!isTestEnv}\n nodeRef={this.rootRef}\n >\n <CommonWrapper rootNodeRef={this.setRootRef} {...this.props}>\n <ToastView ref={this._refToast} {...toastProps} />\n </CommonWrapper>\n </CSSTransition>\n );\n }\n\n private setRootRef = (element: Nullable<Element>) => {\n this.setRootNode(element);\n // @ts-expect-error: See: https://github.com/DefinitelyTyped/DefinitelyTyped/issues/31065.\n this.rootRef.current = element;\n };\n\n private _clearTimer = () => {\n if (this._timeout) {\n clearTimeout(this._timeout);\n this._timeout = null;\n }\n };\n\n private _setTimer = () => {\n this._clearTimer();\n\n let showTime = this.state.action ? 7000 : 3000;\n showTime = this.state.showTime ?? showTime;\n this._timeout = setTimeout(this.close, showTime);\n };\n\n private _refToast = (element: ToastView) => {\n this._toast = element;\n };\n}\n\nfunction safelyCall(fn: Nullable<(a?: any) => any>, ...args: any[]) {\n if (fn) {\n fn(...args);\n }\n}\n"]}
1	+ {"version":3,"file":"Toast.js","sourceRoot":"","sources":["../../../components/Toast/Toast.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\nimport type { AriaAttributes } from 'react';\nimport React from 'react';\nimport { CSSTransition, TransitionGroup } from 'react-transition-group';\n\nimport type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { RenderContainer } from '../../internal/RenderContainer/index.js';\nimport { isTestEnv } from '../../lib/currentEnvironment.js';\nimport type { SafeTimer } from '../../lib/globalObject.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport type { Theme, ThemeIn } from '../../lib/theming/Theme.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport { ThemeFactory } from '../../lib/theming/ThemeFactory.js';\nimport type { Nullable } from '../../typings/utility-types.js';\nimport { getStyles } from './Toast.styles.js';\nimport { ToastView } from './ToastView.js';\nimport type { ToastViewProps } from './ToastView.js';\n\nexport interface Action {\n /** Текст на кнопке действия. /\n label: string;\n /* Выполняется при нажатии на кнопку действия. /\n handler: () => void;\n /* Уточняет доступное имя кнопки для вспомогательных технологий. /\n 'aria-label'?: string;\n}\n\n/\n Состояния тоста:\n \n - default стиль для отображения по умолчанию\n * - error стиль для отображения ошибок\n /\nexport type ToastUse = 'default' \| 'error';\n\nexport interface ToastState {\n notification: Nullable<React.ReactNode>;\n action: Nullable<Action>;\n id: number;\n showTime: Nullable<number>;\n showCloseIcon?: boolean;\n currentUse: ToastUse;\n}\n\nexport interface ToastProps extends Pick<AriaAttributes, 'aria-label'>, CommonProps {\n / Событие появления уведомления. /\n onPush?: (notification: string, action?: Action) => void;\n\n /* Событие закрытия уведомления. /\n onClose?: (notification: string, action?: Action) => void;\n\n /* Переменные темы поверх значений из контекста. /\n theme?: ThemeIn;\n}\n\n/* Объект с конфигурацией отображения Toast-а /\nexport interface ToastPushConfig {\n /* Добавляет кнопку действия в тост. /\n action?: Nullable<Action>;\n /* Длительность показа в миллисекундах. /\n showTime?: number;\n /* Показывает кнопку закрытия рядом с текстом. /\n showCloseIcon?: boolean;\n /* Определяет стиль оформления: обычный или ошибка (`error`). /\n use?: ToastUse;\n}\n\nexport type ToastPushApi = (notification: React.ReactNode, config?: ToastPushConfig) => void;\n\nexport type ToastClose = () => void;\n\nexport const ToastDataTids = {\n toastStatic: 'StaticToast',\n toastView: 'ToastView__root',\n action: 'ToastView__action',\n close: 'ToastView__close',\n} as const;\n\n/\n Тост — это короткое немодальное уведомление о результате действия пользователя: успех, ошибка или нейтральный статус.\n /\n@withRenderEnvironment\n@rootNode\nexport class Toast extends React.Component<ToastProps, ToastState> {\n public static __KONTUR_REACT_UI__ = 'Toast';\n public static displayName = 'Toast';\n\n public getRootNode!: TGetRootNode;\n private setRootNode!: TSetRootNode;\n private styles!: ReturnType<typeof getStyles>;\n private emotion!: Emotion;\n private theme!: Theme;\n\n public _toast: Nullable<ToastView>;\n private _timeout: SafeTimer;\n private rootRef = React.createRef<HTMLElement>();\n\n constructor(props: ToastProps) {\n super(props);\n this.state = {\n notification: null,\n action: null,\n id: 0,\n showTime: null,\n showCloseIcon: false,\n currentUse: 'default',\n };\n }\n\n public componentWillUnmount() {\n this._clearTimer();\n }\n\n public render(): React.JSX.Element {\n this.styles = getStyles(this.emotion);\n\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = this.props.theme ? ThemeFactory.create(this.props.theme as Theme, theme) : theme;\n return (\n <ThemeContext.Provider value={this.theme}>\n <RenderContainer>\n <TransitionGroup>{this._renderToast()}</TransitionGroup>\n </RenderContainer>\n </ThemeContext.Provider>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n\n /\n Показывает тост с `notification` в качестве сообщения.\n * Тост автоматически скрывается через 3 или 7 секунд,\n * в зависимости от наличия у него кнопки `action` внутри config-а.\n * Время показа можно задать вручную, передав `showTime` внутри config-а.\n \n @public\n * @param {React.ReactNode} notification\n * @param {ToastPushConfig} config объект с конфигурацией отображения компонента Toast\n /\n public push: ToastPushApi = (notification: React.ReactNode, config?: ToastPushConfig) => {\n if (this.state.notification) {\n this.close();\n }\n\n safelyCall(this.props.onPush, notification, config?.action);\n\n this.setState(\n ({ id }) => ({\n notification,\n action: config?.action,\n id: id + 1,\n showTime: config?.showTime,\n showCloseIcon: config?.showCloseIcon,\n currentUse: config?.use ?? 'default',\n }),\n this._setTimer,\n );\n };\n\n /\n Закрывает текущее уведомление без ожидания таймера.\n \n @public\n */\n public close = (): void => {\n safelyCall(this.props.onClose, this.state.notification, this.state.action);\n this.setState({ notification: null, action: null });\n };\n\n private _renderToast() {\n const { notification, action, id, showCloseIcon, currentUse } = this.state;\n\n if (!notification) {\n return null;\n }\n\n const toastProps: ToastViewProps = {\n onMouseEnter: this._clearTimer,\n onMouseLeave: this._setTimer,\n onClose: this.close,\n children: notification,\n 'aria-label': this.props['aria-label'],\n action,\n showCloseIcon,\n use: currentUse,\n };\n\n return (\n <CSSTransition\n key={id}\n classNames={{\n enter: this.styles.enter(),\n enterActive: this.styles.enterActive(),\n exit: this.styles.exit(),\n exitActive: this.styles.exitActive(),\n }}\n timeout={{\n enter: 200,\n exit: 150,\n }}\n enter={!isTestEnv}\n exit={!isTestEnv}\n nodeRef={this.rootRef}\n >\n <CommonWrapper rootNodeRef={this.setRootRef} {...this.props}>\n <ToastView ref={this._refToast} {...toastProps} />\n </CommonWrapper>\n </CSSTransition>\n );\n }\n\n private setRootRef = (element: Nullable<Element>) => {\n this.setRootNode(element);\n // @ts-expect-error: See: https://github.com/DefinitelyTyped/DefinitelyTyped/issues/31065.\n this.rootRef.current = element;\n };\n\n private _clearTimer = () => {\n if (this._timeout) {\n clearTimeout(this._timeout);\n this._timeout = null;\n }\n };\n\n private _setTimer = () => {\n this._clearTimer();\n\n let showTime = this.state.action ? 7000 : 3000;\n showTime = this.state.showTime ?? showTime;\n this._timeout = setTimeout(this.close, showTime);\n };\n\n private _refToast = (element: ToastView) => {\n this._toast = element;\n };\n}\n\nfunction safelyCall(fn: Nullable<(a?: any) => any>, ...args: any[]) {\n if (fn) {\n fn(...args);\n }\n}\n"]}

package/components/Toast/ToastView.d.ts CHANGED Viewed

@@ -5,17 +5,19 @@ import type { TGetRootNode } from '../../lib/rootNode/index.js';
 import type { Nullable } from '../../typings/utility-types.js';
 import type { Action, ToastUse } from './Toast.js';
 export interface ToastViewProps extends Pick<AriaAttributes, 'aria-label'>, CommonProps {
-    /** Задает контент тоста. */
+    /** Отображает контент уведомления. */
     children?: React.ReactNode;
-    /** Добавляет возможность действия и кнопку закрытия у тоста. */
+    /** Добавляет кнопку действия в тост. */
     action?: Nullable<Action>;
+    /** Показывает кнопку закрытия рядом с текстом. */
     showCloseIcon?: boolean;
+    /** Вызывается при закрытии тоста из разметки. */
     onClose?: () => void;
+    /** Вызывается при наведении курсора на тост. */
     onMouseEnter?: () => void;
+    /** Вызывается при уходе курсора с тоста. */
     onMouseLeave?: () => void;
-    /**
-     * Задаёт стили для отображения тоста в зависимости от назначения.
-     **/
+    /** Выбирает стиль оформления: обычный или ошибка (`error`). */
     use?: ToastUse;
 }
 export declare class ToastView extends React.Component<ToastViewProps> {
@@ -26,6 +28,7 @@ export declare class ToastView extends React.Component<ToastViewProps> {
     getRootNode: TGetRootNode;
     private setRootNode;
     private readonly locale;
+    private isMobileLayout;
     render(): React.JSX.Element;
     private renderMain;
 }

package/components/Toast/ToastView.js CHANGED Viewed

@@ -38,6 +38,8 @@ import { locale } from '../../lib/locale/decorators.js';
 import { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';
 import { rootNode } from '../../lib/rootNode/index.js';
 import { ThemeContext } from '../../lib/theming/ThemeContext.js';
+import { isThemeGTE } from '../../lib/theming/ThemeHelpers.js';
+import { responsiveLayout } from '../ResponsiveLayout/decorator.js';
 import { ToastLocaleHelper } from './locale/index.js';
 import { ToastDataTids } from './Toast.js';
 import { getStyles } from './ToastView.styles.js';
@@ -47,19 +49,36 @@ var ToastView = /** @class */ (function (_super) {
         var _this = _super !== null && _super.apply(this, arguments) || this;
         _this.renderMain = function () {
             var _a = _this.props, action = _a.action, showCloseIcon = _a.showCloseIcon, onClose = _a.onClose, onMouseEnter = _a.onMouseEnter, onMouseLeave = _a.onMouseLeave, use = _a.use;
+            var isTheme6_1 = isThemeGTE(_this.theme, '6.1');
             var toastCloseColors = use === 'error'
-                ? { hover: _this.theme.toastCloseHoverColorError, default: _this.theme.toastCloseColorError }
-                : { hover: _this.theme.toastCloseHoverColor, default: _this.theme.toastCloseColor };
+                ? {
+                    hover: _this.theme.toastCloseHoverColorError,
+                    default: _this.theme.toastCloseColorError,
+                }
+                : {
+                    hover: _this.theme.toastCloseHoverColor,
+                    default: _this.theme.toastCloseColor,
+                };
             var toastActionColorsClassName = use === 'error' ? _this.styles.toastActionErrorColor(_this.theme) : _this.styles.toastActionDefaultColor(_this.theme);
-            var toastActionClassNames = _this.cx(_this.styles.link(_this.theme), toastActionColorsClassName);
+            var toastActionClassNames = _this.cx(_this.styles.link(_this.theme), isTheme6_1 && _this.styles.link6_1(_this.theme), toastActionColorsClassName);
             var link = action ? (React.createElement("button", { "aria-label": action['aria-label'], "data-tid": ToastDataTids.action, className: toastActionClassNames, onClick: action.handler }, action.label)) : null;
-            var close = action || showCloseIcon ? (React.createElement("span", { className: _this.styles.closeWrapper(_this.theme) },
-                React.createElement(CloseButtonIcon, { "aria-label": _this.locale.closeButtonAriaLabel, "data-tid": ToastDataTids.close, onClick: onClose, size: parseInt(_this.theme.toastCloseSize), side: 40, color: toastCloseColors.default, colorHover: toastCloseColors.hover, tabbable: false }))) : null;
-            var rootClassName = _this.cx(_this.styles.root(_this.theme), _this.styles[use !== null && use !== void 0 ? use : 'default'](_this.theme));
+            var themeDependantProps = isTheme6_1
+                ? {
+                    style: {
+                        height: '100%',
+                    },
+                    side: parseInt(_this.theme.toastCloseBtnSide),
+                }
+                : { side: 40, size: parseInt(_this.theme.toastCloseSize) };
+            var close = action || showCloseIcon ? (React.createElement("span", { className: _this.cx(_this.styles.closeWrapper(_this.theme), isTheme6_1 && _this.styles.closeWrapper6_1()) },
+                React.createElement(CloseButtonIcon, __assign({ "aria-label": _this.locale.closeButtonAriaLabel, "data-tid": ToastDataTids.close, onClick: onClose }, themeDependantProps, { color: toastCloseColors.default, colorHover: toastCloseColors.hover, tabbable: false })))) : null;
+            var rootClassName = _this.cx(_this.styles.root(_this.theme), isTheme6_1 && _this.styles.root6_1(), isTheme6_1 && _this.isMobileLayout && _this.styles.rootMobile(_this.theme), _this.styles[use !== null && use !== void 0 ? use : 'default'](_this.theme));
+            var wrapperClassName = _this.cx(_this.styles.wrapper(_this.theme), isTheme6_1 && _this.styles.wrapper6_1(_this.theme));
             return (React.createElement(CommonWrapper, __assign({}, _this.props),
-                React.createElement(ZIndex, { priority: "Toast", className: _this.styles.wrapper(_this.theme) },
+                React.createElement(ZIndex, { priority: "Toast", className: wrapperClassName },
                     React.createElement("div", { "data-tid": ToastDataTids.toastView, className: rootClassName, ref: _this.setRootNode, onMouseEnter: onMouseEnter, onMouseLeave: onMouseLeave },
-                        React.createElement("span", null, _this.props.children),
+                        isTheme6_1 ? (React.createElement("span", { className: _this.styles.content(_this.theme) },
+                            React.createElement("span", { className: _this.cx(_this.isMobileLayout && _this.styles.ellipsisContent()) }, _this.props.children))) : (React.createElement("span", null, _this.props.children)),
                         link,
                         close))));
         };
@@ -74,6 +93,7 @@ var ToastView = /** @class */ (function (_super) {
         }));
     };
     ToastView = __decorate([
+        responsiveLayout,
         withRenderEnvironment,
         rootNode,
         locale('Toast', ToastLocaleHelper)

package/components/Toast/ToastView.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ToastView.js","sourceRoot":"","sources":["../../../components/Toast/ToastView.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,eAAe,EAAE,MAAM,mDAAmD,CAAC;AAEpF,OAAO,EAAE,aAAa,EAAE,MAAM,uCAAuC,CAAC;AACtE,OAAO,EAAE,MAAM,EAAE,MAAM,gCAAgC,CAAC;AACxD,OAAO,EAAE,MAAM,EAAE,MAAM,gCAAgC,CAAC;AACxD,OAAO,EAAE,qBAAqB,EAAE,MAAM,sCAAsC,CAAC;AAE7E,OAAO,EAAE,QAAQ,EAAE,MAAM,6BAA6B,CAAC;AAEvD,OAAO,EAAE,YAAY,EAAE,MAAM,mCAAmC,CAAC;~~AAGjE~~,OAAO,EAAE,iBAAiB,EAAE,MAAM,mBAAmB,CAAC;AAEtD,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAC3C,OAAO,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;~~AAoBlD~~;IAA+B,6BAA+B;IAA9D;;~~QAsBU~~,gBAAU,GAAG;YACb,IAAA,KAAsE,KAAI,CAAC,KAAK,EAA9E,MAAM,YAAA,EAAE,aAAa,mBAAA,EAAE,OAAO,aAAA,EAAE,YAAY,kBAAA,EAAE,YAAY,kBAAA,EAAE,GAAG,SAAe,CAAC;YAEvF,IAAM,gBAAgB,GACpB,GAAG,KAAK,OAAO;gBACb,CAAC,CAAC,~~EAAE,~~KAAK,EAAE,KAAI,CAAC,KAAK,CAAC,yBAAyB,~~EAAE,~~OAAO,EAAE,KAAI,CAAC,KAAK,CAAC,oBAAoB~~,EAAE~~;~~gBAC3F~~,CAAC,CAAC,~~EAAE,~~KAAK,EAAE,KAAI,CAAC,KAAK,CAAC,oBAAoB,~~EAAE,~~OAAO,EAAE,KAAI,CAAC,KAAK,CAAC,eAAe,~~EAAE,~~CAAC;~~YAEtF~~,IAAM,0BAA0B,GAC9B,GAAG,KAAK,OAAO,CAAC,CAAC,CAAC,KAAI,CAAC,MAAM,CAAC,qBAAqB,CAAC,KAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,KAAI,CAAC,MAAM,CAAC,uBAAuB,CAAC,KAAI,CAAC,KAAK,CAAC,CAAC;YACpH,IAAM,qBAAqB,GAAG,KAAI,CAAC,EAAE,~~CAAC~~,KAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAI,CAAC,KAAK,CAAC,~~EAAE~~,~~0BAA0B~~,CAAC,CAAC;~~YAEhG~~,IAAM,IAAI,GAAG,MAAM,CAAC,CAAC,CAAC,CACpB,8CACc,MAAM,CAAC,YAAY,CAAC,cACtB,aAAa,CAAC,MAAM,EAC9B,SAAS,EAAE,qBAAqB,EAChC,OAAO,EAAE,MAAM,CAAC,OAAO,IAEtB,MAAM,CAAC,KAAK,CACN,CACV,CAAC,CAAC,CAAC,IAAI,CAAC;YAET,IAAM,KAAK,GACT,MAAM,IAAI,aAAa,CAAC,CAAC,CAAC,CACxB,8BAAM,SAAS,EAAE,KAAI,CAAC,MAAM,CAAC,YAAY,CAAC,KAAI,CAAC,KAAK,CAAC~~;gBACnD~~,~~oBAAC~~,~~eAAe~~,~~kBACF~~,KAAI,CAAC,MAAM,CAAC,~~oBAAoB~~,~~cAClC~~,~~aAAa,~~CAAC,~~KAAK~~,~~EAC7B~~,~~OAAO~~,~~EAAE~~,~~OAAO~~,~~EAChB~~,~~IAAI~~,~~EAAE~~,~~QAAQ~~,~~CAAC~~,~~KAAI,~~CAAC,KAAK,~~CAAC~~,~~cAAc~~,~~CAAC~~,~~EACzC~~,~~IAAI~~,~~EAAE~~,~~EAAE~~,~~EACR,~~KAAK,EAAE,gBAAgB,CAAC,OAAO,EAC/B,UAAU,EAAE,gBAAgB,CAAC,KAAK,EAClC,QAAQ,EAAE,KAAK,~~GACf~~,CACG,CACR,CAAC,CAAC,CAAC,IAAI,CAAC;YAEX,IAAM,aAAa,GAAG,KAAI,CAAC,EAAE,~~CAAC~~,KAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAI,CAAC,KAAK,CAAC,EAAE,KAAI,CAAC,MAAM,CAAC,GAAG,aAAH,GAAG,cAAH,GAAG,GAAI,SAAS,CAAC,CAAC,KAAI,CAAC,KAAK,CAAC,~~CAAC~~,CAAC;~~YAEvG~~,~~OAAO~~,~~CACL~~,~~oBAAC~~,~~aAAa~~,~~eAAK~~,~~KAAI~~,CAAC,~~KAAK;gBAC3B~~,~~oBAAC~~,MAAM,~~IAAC~~,~~QAAQ~~,~~EAAC~~,~~OAAO~~,~~EAAC~~,~~SAAS~~,EAAE,KAAI,CAAC,MAAM,CAAC,~~OAAO~~,CAAC,KAAI,CAAC,KAAK,CAAC;~~oBACjE~~,yCACY,aAAa,CAAC,SAAS,EACjC,SAAS,EAAE,aAAa,EACxB,GAAG,EAAE,KAAI,CAAC,WAAW,EACrB,YAAY,EAAE,YAAY,EAC1B,YAAY,EAAE,YAAY;~~wBAE1B~~,kCAAO,KAAI,CAAC,KAAK,CAAC,QAAQ,CAAQ;~~wBACjC~~,IAAI;wBACJ,KAAK,CACF,CACC,CACK,CACjB,CAAC;QACJ,CAAC,CAAC;;IACJ,CAAC;~~IAxEQ~~,0BAAM,GAAb;QAAA,iBAWC;QAVC,IAAI,CAAC,MAAM,GAAG,SAAS,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAEtC,OAAO,CACL,oBAAC,YAAY,CAAC,QAAQ,QACnB,UAAC,KAAK;YACL,KAAI,CAAC,KAAK,GAAG,KAAK,CAAC;YACnB,OAAO,KAAI,CAAC,UAAU,EAAE,CAAC;QAC3B,CAAC,CACqB,CACzB,CAAC;IACJ,CAAC;~~IApBU~~,SAAS;~~QAHrB~~,qBAAqB;QACrB,QAAQ;QACR,MAAM,CAAC,OAAO,EAAE,iBAAiB,CAAC;OACtB,SAAS,~~CAiFrB~~;IAAD,gBAAC;CAAA,~~AAjFD~~,CAA+B,KAAK,CAAC,SAAS,~~GAiF7C~~;~~SAjFY~~,SAAS","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\nimport type { AriaAttributes } from 'react';\nimport React from 'react';\n\nimport { CloseButtonIcon } from '../../internal/CloseButtonIcon/CloseButtonIcon.js';\nimport type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { ZIndex } from '../../internal/ZIndex/index.js';\nimport { locale } from '../../lib/locale/decorators.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport type { Nullable } from '../../typings/utility-types.js';\nimport type { ToastLocale } from './locale/index.js';\nimport { ToastLocaleHelper } from './locale/index.js';\nimport type { Action, ToastUse } from './Toast.js';\nimport { ToastDataTids } from './Toast.js';\nimport { getStyles } from './ToastView.styles.js';\n\nexport interface ToastViewProps extends Pick<AriaAttributes, 'aria-label'>, CommonProps {\n /** ~~Задает~~ контент ~~тоста.~~ /\n children?: React.ReactNode;\n /* Добавляет ~~возможность~~ действия и ~~кнопку~~ ~~закрытия у тоста.~~ /\n action?: Nullable<Action>;\n showCloseIcon?: boolean;\n onClose?: () => void;\n onMouseEnter?: () => void;\n onMouseLeave?: () => void;\n /\n ~~Задаёт~~ ~~стили~~ ~~для~~ ~~отображения~~ ~~тоста~~ в ~~зависимости~~ ~~от назначения.\~~n **/\n use?: ToastUse;\n}\n\n@withRenderEnvironment\n@rootNode\n@locale('Toast', ToastLocaleHelper)\nexport class ToastView extends React.Component<ToastViewProps> {\n private styles!: ReturnType<typeof getStyles>;\n private emotion!: Emotion;\n private cx!: Emotion['cx'];\n private theme!: Theme;\n public getRootNode!: TGetRootNode;\n private setRootNode!: TSetRootNode;\n private readonly locale!: ToastLocale;\n\n public render(): React.JSX.Element {\n this.styles = getStyles(this.emotion);\n\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain = () => {\n const { action, showCloseIcon, onClose, onMouseEnter, onMouseLeave, use } = this.props;\n\n const toastCloseColors =\n use === 'error'\n ? { hover: this.theme.toastCloseHoverColorError, default: this.theme.toastCloseColorError }\n : { hover: this.theme.toastCloseHoverColor, default: this.theme.toastCloseColor };\n\n const toastActionColorsClassName =\n use === 'error' ? this.styles.toastActionErrorColor(this.theme) : this.styles.toastActionDefaultColor(this.theme);\n const toastActionClassNames = this.cx(this.styles.link(this.theme), toastActionColorsClassName);\n\n const link = action ? (\n <button\n aria-label={action['aria-label']}\n data-tid={ToastDataTids.action}\n className={toastActionClassNames}\n onClick={action.handler}\n >\n {action.label}\n </button>\n ) : null;\n\n const close =\n action \|\| showCloseIcon ? (\n <span className={this.styles.closeWrapper(this.theme)}>\n <CloseButtonIcon\n aria-label={this.locale.closeButtonAriaLabel}\n data-tid={ToastDataTids.close}\n onClick={onClose}\n ~~size=~~{~~parseInt(this.theme.toastCloseSize)~~}\n ~~side={40}\n~~ color={toastCloseColors.default}\n colorHover={toastCloseColors.hover}\n tabbable={false}\n />\n </span>\n ) : null;\n\n const rootClassName = this.cx(this.styles.root(this.theme), this.styles[use ?? 'default'](this.theme));\n\n return (\n <CommonWrapper {...this.props}>\n <ZIndex priority=\"Toast\" className={~~this.styles.wrapper(this.theme)~~}>\n <div\n data-tid={ToastDataTids.toastView}\n className={rootClassName}\n ref={this.setRootNode}\n onMouseEnter={onMouseEnter}\n onMouseLeave={onMouseLeave}\n >\n <span>{this.props.children}</span>\n {link}\n {close}\n </div>\n </ZIndex>\n </CommonWrapper>\n );\n };\n}\n"]}
1	+ {"version":3,"file":"ToastView.js","sourceRoot":"","sources":["../../../components/Toast/ToastView.tsx"],"names":[],"mappings":"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","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\nimport type { AriaAttributes } from 'react';\nimport React from 'react';\n\nimport { CloseButtonIcon } from '../../internal/CloseButtonIcon/CloseButtonIcon.js';\nimport type { CommonProps } from '../../internal/CommonWrapper/index.js';\nimport { CommonWrapper } from '../../internal/CommonWrapper/index.js';\nimport { ZIndex } from '../../internal/ZIndex/index.js';\nimport { locale } from '../../lib/locale/decorators.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { rootNode } from '../../lib/rootNode/index.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\nimport { ThemeContext } from '../../lib/theming/ThemeContext.js';\nimport { isThemeGTE } from '../../lib/theming/ThemeHelpers.js';\nimport type { Nullable } from '../../typings/utility-types.js';\nimport { responsiveLayout } from '../ResponsiveLayout/decorator.js';\nimport type { ToastLocale } from './locale/index.js';\nimport { ToastLocaleHelper } from './locale/index.js';\nimport type { Action, ToastUse } from './Toast.js';\nimport { ToastDataTids } from './Toast.js';\nimport { getStyles } from './ToastView.styles.js';\n\nexport interface ToastViewProps extends Pick<AriaAttributes, 'aria-label'>, CommonProps {\n /** Отображает контент уведомления. /\n children?: React.ReactNode;\n /* Добавляет кнопку действия в тост. /\n action?: Nullable<Action>;\n /* Показывает кнопку закрытия рядом с текстом. /\n showCloseIcon?: boolean;\n /* Вызывается при закрытии тоста из разметки. /\n onClose?: () => void;\n /* Вызывается при наведении курсора на тост. /\n onMouseEnter?: () => void;\n /* Вызывается при уходе курсора с тоста. /\n onMouseLeave?: () => void;\n /* Выбирает стиль оформления: обычный или ошибка (`error`). */\n use?: ToastUse;\n}\n\n@responsiveLayout\n@withRenderEnvironment\n@rootNode\n@locale('Toast', ToastLocaleHelper)\nexport class ToastView extends React.Component<ToastViewProps> {\n private styles!: ReturnType<typeof getStyles>;\n private emotion!: Emotion;\n private cx!: Emotion['cx'];\n private theme!: Theme;\n public getRootNode!: TGetRootNode;\n private setRootNode!: TSetRootNode;\n private readonly locale!: ToastLocale;\n private isMobileLayout!: boolean;\n\n public render(): React.JSX.Element {\n this.styles = getStyles(this.emotion);\n\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return this.renderMain();\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain = () => {\n const { action, showCloseIcon, onClose, onMouseEnter, onMouseLeave, use } = this.props;\n\n const isTheme6_1 = isThemeGTE(this.theme, '6.1');\n\n const toastCloseColors =\n use === 'error'\n ? {\n hover: this.theme.toastCloseHoverColorError,\n default: this.theme.toastCloseColorError,\n }\n : {\n hover: this.theme.toastCloseHoverColor,\n default: this.theme.toastCloseColor,\n };\n\n const toastActionColorsClassName =\n use === 'error' ? this.styles.toastActionErrorColor(this.theme) : this.styles.toastActionDefaultColor(this.theme);\n const toastActionClassNames = this.cx(\n this.styles.link(this.theme),\n isTheme6_1 && this.styles.link6_1(this.theme),\n\n toastActionColorsClassName,\n );\n\n const link = action ? (\n <button\n aria-label={action['aria-label']}\n data-tid={ToastDataTids.action}\n className={toastActionClassNames}\n onClick={action.handler}\n >\n {action.label}\n </button>\n ) : null;\n\n const themeDependantProps = isTheme6_1\n ? {\n style: {\n height: '100%',\n },\n side: parseInt(this.theme.toastCloseBtnSide),\n }\n : { side: 40, size: parseInt(this.theme.toastCloseSize) };\n\n const close =\n action \|\| showCloseIcon ? (\n <span className={this.cx(this.styles.closeWrapper(this.theme), isTheme6_1 && this.styles.closeWrapper6_1())}>\n <CloseButtonIcon\n aria-label={this.locale.closeButtonAriaLabel}\n data-tid={ToastDataTids.close}\n onClick={onClose}\n {...themeDependantProps}\n color={toastCloseColors.default}\n colorHover={toastCloseColors.hover}\n tabbable={false}\n />\n </span>\n ) : null;\n\n const rootClassName = this.cx(\n this.styles.root(this.theme),\n isTheme6_1 && this.styles.root6_1(),\n isTheme6_1 && this.isMobileLayout && this.styles.rootMobile(this.theme),\n this.styles[use ?? 'default'](this.theme),\n );\n\n const wrapperClassName = this.cx(this.styles.wrapper(this.theme), isTheme6_1 && this.styles.wrapper6_1(this.theme));\n\n return (\n <CommonWrapper {...this.props}>\n <ZIndex priority=\"Toast\" className={wrapperClassName}>\n <div\n data-tid={ToastDataTids.toastView}\n className={rootClassName}\n ref={this.setRootNode}\n onMouseEnter={onMouseEnter}\n onMouseLeave={onMouseLeave}\n >\n {isTheme6_1 ? (\n <span className={this.styles.content(this.theme)}>\n <span className={this.cx(this.isMobileLayout && this.styles.ellipsisContent())}>\n {this.props.children}\n </span>\n </span>\n ) : (\n <span>{this.props.children}</span>\n )}\n {link}\n {close}\n </div>\n </ZIndex>\n </CommonWrapper>\n );\n };\n}\n"]}

package/components/Toast/ToastView.styles.d.ts CHANGED Viewed

@@ -1,11 +1,18 @@
 import type { Theme } from '../../lib/theming/Theme.js';
 export declare const getStyles: import("../../lib/theming/Emotion.js").StylesGetter<{
     root(t: Theme): string;
+    root6_1(): string;
+    rootMobile(t: Theme): string;
     default(t: Theme): string;
     error(t: Theme): string;
     wrapper(t: Theme): string;
+    wrapper6_1(t: Theme): string;
+    content(t: Theme): string;
+    ellipsisContent(): string;
     closeWrapper(t: Theme): string;
+    closeWrapper6_1(): string;
     link(t: Theme): string;
+    link6_1(t: Theme): string;
     toastActionErrorColor(t: Theme): string;
     toastActionDefaultColor(t: Theme): string;
 }>;

package/components/Toast/ToastView.styles.js CHANGED Viewed

@@ -15,31 +15,53 @@ export var getStyles = memoizeGetStyles(function (_a) {
             var _a = getVerticalPaddings(t), paddingTop = _a[0], paddingBottom = _a[1];
             return css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n      border-radius: ", ";\n      border: ", ";\n      display: inline-flex;\n      font-size: ", ";\n      line-height: ", ";\n      opacity: 1;\n      padding: ", " ", " ", ";\n      position: relative;\n      top: ", ";\n    "], ["\n      border-radius: ", ";\n      border: ", ";\n      display: inline-flex;\n      font-size: ", ";\n      line-height: ", ";\n      opacity: 1;\n      padding: ", " ", " ", ";\n      position: relative;\n      top: ", ";\n    "])), t.toastBorderRadius, t.toastBorder, t.toastFontSize, t.toastLineHeight, paddingTop, t.toastPaddingX, paddingBottom, t.toastTop);
         },
+        root6_1: function () {
+            return css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n      padding: 0;\n    "], ["\n      padding: 0;\n    "])));
+        },
+        rootMobile: function (t) {
+            return css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n      top: ", ";\n      font-size: ", ";\n    "], ["\n      top: ", ";\n      font-size: ", ";\n    "])), t.mobileToastTop, t.mobileToastFontSize);
+        },
         default: function (t) {
-            return css(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n      background: ", ";\n      color: ", ";\n    "], ["\n      background: ", ";\n      color: ", ";\n    "])), t.toastBg, t.toastColor);
+            return css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n      background: ", ";\n      color: ", ";\n    "], ["\n      background: ", ";\n      color: ", ";\n    "])), t.toastBg, t.toastColor);
         },
         error: function (t) {
-            return css(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n      background: ", ";\n      color: ", ";\n    "], ["\n      background: ", ";\n      color: ", ";\n    "])), t.toastErrorBg, t.toastColorError);
+            return css(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n      background: ", ";\n      color: ", ";\n    "], ["\n      background: ", ";\n      color: ", ";\n    "])), t.toastErrorBg, t.toastColorError);
         },
         wrapper: function (t) {
-            return css(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n      position: fixed;\n      top: 0;\n      left: 0;\n      right: 0;\n      height: 0;\n      text-align: center;\n      border-radius: ", ";\n    "], ["\n      position: fixed;\n      top: 0;\n      left: 0;\n      right: 0;\n      height: 0;\n      text-align: center;\n      border-radius: ", ";\n    "])), t.toastBorderRadius);
+            return css(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n      position: fixed;\n      top: 0;\n      left: 0;\n      right: 0;\n      height: 0;\n      text-align: center;\n      border-radius: ", ";\n    "], ["\n      position: fixed;\n      top: 0;\n      left: 0;\n      right: 0;\n      height: 0;\n      text-align: center;\n      border-radius: ", ";\n    "])), t.toastBorderRadius);
+        },
+        wrapper6_1: function (t) {
+            return css(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n      padding: 0 ", ";\n    "], ["\n      padding: 0 ", ";\n    "])), t.toastPaddingX);
+        },
+        content: function (t) {
+            var _a = getVerticalPaddings(t), paddingTop = _a[0], paddingBottom = _a[1];
+            return css(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n      padding: ", " ", " ", ";\n    "], ["\n      padding: ", " ", " ", ";\n    "])), paddingTop, t.toastPaddingX, paddingBottom);
+        },
+        ellipsisContent: function () {
+            return css(templateObject_9 || (templateObject_9 = __makeTemplateObject(["\n      display: -webkit-box;\n      -webkit-line-clamp: 2;\n      -webkit-box-orient: vertical;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      text-align: start;\n    "], ["\n      display: -webkit-box;\n      -webkit-line-clamp: 2;\n      -webkit-box-orient: vertical;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      text-align: start;\n    "])));
         },
         closeWrapper: function (t) {
             var _a = getVerticalPaddings(t), paddingTop = _a[0], paddingBottom = _a[1];
-            return css(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n      display: flex;\n      margin: -", " -", " -", " 0;\n    "], ["\n      display: flex;\n      margin: -", " -", " -", " 0;\n    "])), paddingTop, t.toastPaddingX, paddingBottom);
+            return css(templateObject_10 || (templateObject_10 = __makeTemplateObject(["\n      display: flex;\n      margin: -", " -", " -", " 0;\n    "], ["\n      display: flex;\n      margin: -", " -", " -", " 0;\n    "])), paddingTop, t.toastPaddingX, paddingBottom);
+        },
+        closeWrapper6_1: function () {
+            return css(templateObject_11 || (templateObject_11 = __makeTemplateObject(["\n      margin: 0;\n    "], ["\n      margin: 0;\n    "])));
         },
         link: function (t) {
             var _a = getVerticalPaddings(t), paddingTop = _a[0], paddingBottom = _a[1];
             var padding = "".concat(paddingTop, " ").concat(t.toastLinkPadding);
-            return css(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n      border: none;\n      font: inherit;\n      color: ", ";\n      cursor: pointer;\n      display: inline-block;\n      font-weight: 600;\n      background-color: transparent;\n\n      margin: -", " 0 -", " ", ";\n\n      padding: ", ";\n      transition: background ", " ", ";\n      &:hover {\n        background: ", ";\n        text-decoration: ", ";\n      }\n      padding: ", ";\n      transition: background ", " ", ";\n    "], ["\n      border: none;\n      font: inherit;\n      color: ", ";\n      cursor: pointer;\n      display: inline-block;\n      font-weight: 600;\n      background-color: transparent;\n\n      margin: -", " 0 -", " ", ";\n\n      padding: ", ";\n      transition: background ", " ", ";\n      &:hover {\n        background: ", ";\n        text-decoration: ", ";\n      }\n      padding: ", ";\n      transition: background ", " ", ";\n    "])), t.toastLinkColor, paddingTop, paddingBottom, t.toastPaddingX, padding, t.transitionDuration, t.transitionTimingFunction, t.toastLinkBgHover, t.toastLinkTextDecorationHover, padding, t.transitionDuration, t.transitionTimingFunction);
+            return css(templateObject_12 || (templateObject_12 = __makeTemplateObject(["\n      border: none;\n      font: inherit;\n      color: ", ";\n      cursor: pointer;\n      display: inline-block;\n      font-weight: 600;\n      background-color: transparent;\n\n      margin: -", " 0 -", " ", ";\n\n      padding: ", ";\n      transition: background ", " ", ";\n      &:hover {\n        background: ", ";\n        text-decoration: ", ";\n      }\n      padding: ", ";\n      transition: background ", " ", ";\n    "], ["\n      border: none;\n      font: inherit;\n      color: ", ";\n      cursor: pointer;\n      display: inline-block;\n      font-weight: 600;\n      background-color: transparent;\n\n      margin: -", " 0 -", " ", ";\n\n      padding: ", ";\n      transition: background ", " ", ";\n      &:hover {\n        background: ", ";\n        text-decoration: ", ";\n      }\n      padding: ", ";\n      transition: background ", " ", ";\n    "])), t.toastLinkColor, paddingTop, paddingBottom, t.toastPaddingX, padding, t.transitionDuration, t.transitionTimingFunction, t.toastLinkBgHover, t.toastLinkTextDecorationHover, padding, t.transitionDuration, t.transitionTimingFunction);
+        },
+        link6_1: function (t) {
+            return css(templateObject_13 || (templateObject_13 = __makeTemplateObject(["\n      margin: 0;\n      padding: 0 ", ";\n    "], ["\n      margin: 0;\n      padding: 0 ", ";\n    "])), t.toastLinkPadding);
         },
         toastActionErrorColor: function (t) {
-            return css(templateObject_7 || (templateObject_7 = __makeTemplateObject(["\n      color: ", ";\n\n      &:hover {\n        background: ", ";\n        text-decoration: ", ";\n      }\n\n      &:active {\n        background: ", ";\n        color: ", ";\n      }\n    "], ["\n      color: ", ";\n\n      &:hover {\n        background: ", ";\n        text-decoration: ", ";\n      }\n\n      &:active {\n        background: ", ";\n        color: ", ";\n      }\n    "])), t.toastLinkColorError, t.toastLinkBgHoverError, t.toastLinkTextDecorationHover, t.toastLinkBgActiveError, t.toastLinkColorActiveError);
+            return css(templateObject_14 || (templateObject_14 = __makeTemplateObject(["\n      color: ", ";\n\n      &:hover {\n        background: ", ";\n        text-decoration: ", ";\n      }\n\n      &:active {\n        background: ", ";\n        color: ", ";\n      }\n    "], ["\n      color: ", ";\n\n      &:hover {\n        background: ", ";\n        text-decoration: ", ";\n      }\n\n      &:active {\n        background: ", ";\n        color: ", ";\n      }\n    "])), t.toastLinkColorError, t.toastLinkBgHoverError, t.toastLinkTextDecorationHover, t.toastLinkBgActiveError, t.toastLinkColorActiveError);
         },
         toastActionDefaultColor: function (t) {
-            return css(templateObject_8 || (templateObject_8 = __makeTemplateObject(["\n      color: ", ";\n\n      &:hover {\n        background: ", ";\n        text-decoration: ", ";\n      }\n\n      &:active {\n        background: ", ";\n      }\n    "], ["\n      color: ", ";\n\n      &:hover {\n        background: ", ";\n        text-decoration: ", ";\n      }\n\n      &:active {\n        background: ", ";\n      }\n    "])), t.toastLinkColor, t.toastLinkBgHover, t.toastLinkTextDecorationHover, t.toastLinkBgActive);
+            return css(templateObject_15 || (templateObject_15 = __makeTemplateObject(["\n      color: ", ";\n\n      &:hover {\n        background: ", ";\n        text-decoration: ", ";\n      }\n\n      &:active {\n        background: ", ";\n      }\n    "], ["\n      color: ", ";\n\n      &:hover {\n        background: ", ";\n        text-decoration: ", ";\n      }\n\n      &:active {\n        background: ", ";\n      }\n    "])), t.toastLinkColor, t.toastLinkBgHover, t.toastLinkTextDecorationHover, t.toastLinkBgActive);
         },
     });
 });
-var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8;
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6, templateObject_7, templateObject_8, templateObject_9, templateObject_10, templateObject_11, templateObject_12, templateObject_13, templateObject_14, templateObject_15;
 //# sourceMappingURL=ToastView.styles.js.map

package/components/Toast/ToastView.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ToastView.styles.js","sourceRoot":"","sources":["../../../components/Toast/ToastView.styles.ts"],"names":[],"mappings":";;;;AAEA,OAAO,EAAE,gBAAgB,EAAE,MAAM,8BAA8B,CAAC;AAGhE,IAAM,mBAAmB,GAAG,UAAC,KAAY;IAC/B,IAAA,aAAa,GAAK,KAAK,cAAV,CAAW;IAChC,IAAM,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,CAAC;IAEzC,OAAO,CAAC,UAAG,QAAQ,OAAI,EAAE,UAAG,QAAQ,OAAI,CAAC,CAAC;AAC5C,CAAC,CAAC;AAEF,MAAM,CAAC,IAAM,SAAS,GAAG,gBAAgB,CAAC,UAAC,EAAgB;QAAd,GAAG,SAAA;IAAgB,OAAA,CAAC;QAC/D,IAAI,YAAC,CAAQ;YACL,IAAA,KAA8B,mBAAmB,CAAC,CAAC,CAAC,EAAnD,UAAU,QAAA,EAAE,aAAa,QAA0B,CAAC;YAC3D,OAAO,GAAG,2SAAA,yBACS,EAAmB,mBAC1B,EAAa,mDAEV,EAAe,wBACb,EAAiB,uCAErB,EAAU,GAAI,EAAe,GAAI,EAAa,2CAElD,EAAU,SAClB,KATkB,CAAC,CAAC,iBAAiB,EAC1B,CAAC,CAAC,WAAW,EAEV,CAAC,CAAC,aAAa,EACb,CAAC,CAAC,eAAe,EAErB,UAAU,EAAI,CAAC,CAAC,aAAa,EAAI,aAAa,EAElD,CAAC,CAAC,QAAQ,EACjB;QACJ,CAAC;QAED,OAAO,YAAC,CAAQ;YACd,OAAO,GAAG,wHAAA,sBACM,EAAS,kBACd,EAAY,SACtB,KAFe,CAAC,CAAC,OAAO,EACd,CAAC,CAAC,UAAU,EACrB;QACJ,CAAC;QAED,KAAK,YAAC,CAAQ;YACZ,OAAO,GAAG,wHAAA,sBACM,EAAc,kBACnB,EAAiB,SAC3B,KAFe,CAAC,CAAC,YAAY,EACnB,CAAC,CAAC,eAAe,EAC1B;QACJ,CAAC;QAED,OAAO,YAAC,CAAQ;YACd,OAAO,GAAG,4NAAA,8IAOS,EAAmB,SACrC,KADkB,CAAC,CAAC,iBAAiB,EACpC;QACJ,CAAC;QAED,YAAY,YAAC,CAAQ;YACb,IAAA,KAA8B,mBAAmB,CAAC,CAAC,CAAC,EAAnD,UAAU,QAAA,EAAE,aAAa,QAA0B,CAAC;YAC3D,OAAO,GAAG,~~qIAAA~~,yCAEG,EAAU,IAAK,EAAe,IAAK,EAAa,WAC5D,KADY,UAAU,EAAK,CAAC,CAAC,aAAa,EAAK,aAAa,EAC3D;QACJ,CAAC;QAED,IAAI,YAAC,CAAQ;YACL,IAAA,KAA8B,mBAAmB,CAAC,CAAC,CAAC,EAAnD,UAAU,QAAA,EAAE,aAAa,QAA0B,CAAC;YAC3D,IAAM,OAAO,GAAG,UAAG,UAAU,cAAI,CAAC,CAAC,gBAAgB,CAAE,CAAC;YAEtD,OAAO,GAAG,~~yfAAA~~,4DAGC,EAAgB,2IAMd,EAAU,MAAO,EAAa,GAAI,EAAe,sBAEjD,EAAO,kCACO,EAAoB,GAAI,EAA0B,0CAE3D,EAAkB,8BACb,EAA8B,6BAExC,EAAO,kCACO,EAAoB,GAAI,EAA0B,SAC5E,KAhBU,CAAC,CAAC,cAAc,EAMd,UAAU,EAAO,aAAa,EAAI,CAAC,CAAC,aAAa,EAEjD,OAAO,EACO,CAAC,CAAC,kBAAkB,EAAI,CAAC,CAAC,wBAAwB,EAE3D,CAAC,CAAC,gBAAgB,EACb,CAAC,CAAC,4BAA4B,EAExC,OAAO,EACO,CAAC,CAAC,kBAAkB,EAAI,CAAC,CAAC,wBAAwB,EAC3E;QACJ,CAAC;QAED,qBAAqB,YAAC,CAAQ;YAC5B,OAAO,GAAG,~~oQAAA~~,iBACC,EAAqB,4CAGd,EAAuB,8BAClB,EAA8B,sDAInC,EAAwB,oBAC7B,EAA2B,kBAEvC,KAXU,CAAC,CAAC,mBAAmB,EAGd,CAAC,CAAC,qBAAqB,EAClB,CAAC,CAAC,4BAA4B,EAInC,CAAC,CAAC,sBAAsB,EAC7B,CAAC,CAAC,yBAAyB,EAEtC;QACJ,CAAC;QAED,uBAAuB,YAAC,CAAQ;YAC9B,OAAO,GAAG,~~8OAAA~~,iBACC,EAAgB,4CAGT,EAAkB,8BACb,EAA8B,sDAInC,EAAmB,kBAEpC,KAVU,CAAC,CAAC,cAAc,EAGT,CAAC,CAAC,gBAAgB,EACb,CAAC,CAAC,4BAA4B,EAInC,CAAC,CAAC,iBAAiB,EAEnC;QACJ,CAAC;KACF,CAAC;~~AA1G8D~~,~~CA0G9D~~,CAAC,CAAC","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeGetStyles } from '../../lib/theming/Emotion.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\n\nconst getVerticalPaddings = (theme: Theme) => {\n const { toastPaddingY } = theme;\n const paddingY = parseInt(toastPaddingY);\n\n return [`${paddingY}px`, `${paddingY}px`];\n};\n\nexport const getStyles = memoizeGetStyles(({ css }: Emotion) => ({\n root(t: Theme) {\n const [paddingTop, paddingBottom] = getVerticalPaddings(t);\n return css`\n border-radius: ${t.toastBorderRadius};\n border: ${t.toastBorder};\n display: inline-flex;\n font-size: ${t.toastFontSize};\n line-height: ${t.toastLineHeight};\n opacity: 1;\n padding: ${paddingTop} ${t.toastPaddingX} ${paddingBottom};\n position: relative;\n top: ${t.toastTop};\n `;\n },\n\n default(t: Theme) {\n return css`\n background: ${t.toastBg};\n color: ${t.toastColor};\n `;\n },\n\n error(t: Theme) {\n return css`\n background: ${t.toastErrorBg};\n color: ${t.toastColorError};\n `;\n },\n\n wrapper(t: Theme) {\n return css`\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n height: 0;\n text-align: center;\n border-radius: ${t.toastBorderRadius};\n `;\n },\n\n closeWrapper(t: Theme) {\n const [paddingTop, paddingBottom] = getVerticalPaddings(t);\n return css`\n display: flex;\n margin: -${paddingTop} -${t.toastPaddingX} -${paddingBottom} 0;\n `;\n },\n\n link(t: Theme) {\n const [paddingTop, paddingBottom] = getVerticalPaddings(t);\n const padding = `${paddingTop} ${t.toastLinkPadding}`;\n\n return css`\n border: none;\n font: inherit;\n color: ${t.toastLinkColor};\n cursor: pointer;\n display: inline-block;\n font-weight: 600;\n background-color: transparent;\n\n margin: -${paddingTop} 0 -${paddingBottom} ${t.toastPaddingX};\n\n padding: ${padding};\n transition: background ${t.transitionDuration} ${t.transitionTimingFunction};\n &:hover {\n background: ${t.toastLinkBgHover};\n text-decoration: ${t.toastLinkTextDecorationHover};\n }\n padding: ${padding};\n transition: background ${t.transitionDuration} ${t.transitionTimingFunction};\n `;\n },\n\n toastActionErrorColor(t: Theme) {\n return css`\n color: ${t.toastLinkColorError};\n\n &:hover {\n background: ${t.toastLinkBgHoverError};\n text-decoration: ${t.toastLinkTextDecorationHover};\n }\n\n &:active {\n background: ${t.toastLinkBgActiveError};\n color: ${t.toastLinkColorActiveError};\n }\n `;\n },\n\n toastActionDefaultColor(t: Theme) {\n return css`\n color: ${t.toastLinkColor};\n\n &:hover {\n background: ${t.toastLinkBgHover};\n text-decoration: ${t.toastLinkTextDecorationHover};\n }\n\n &:active {\n background: ${t.toastLinkBgActive};\n }\n `;\n },\n}));\n"]}
1	+ {"version":3,"file":"ToastView.styles.js","sourceRoot":"","sources":["../../../components/Toast/ToastView.styles.ts"],"names":[],"mappings":"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","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeGetStyles } from '../../lib/theming/Emotion.js';\nimport type { Theme } from '../../lib/theming/Theme.js';\n\nconst getVerticalPaddings = (theme: Theme) => {\n const { toastPaddingY } = theme;\n const paddingY = parseInt(toastPaddingY);\n\n return [`${paddingY}px`, `${paddingY}px`];\n};\n\nexport const getStyles = memoizeGetStyles(({ css }: Emotion) => ({\n root(t: Theme) {\n const [paddingTop, paddingBottom] = getVerticalPaddings(t);\n return css`\n border-radius: ${t.toastBorderRadius};\n border: ${t.toastBorder};\n display: inline-flex;\n font-size: ${t.toastFontSize};\n line-height: ${t.toastLineHeight};\n opacity: 1;\n padding: ${paddingTop} ${t.toastPaddingX} ${paddingBottom};\n position: relative;\n top: ${t.toastTop};\n `;\n },\n\n root6_1() {\n return css`\n padding: 0;\n `;\n },\n\n rootMobile(t: Theme) {\n return css`\n top: ${t.mobileToastTop};\n font-size: ${t.mobileToastFontSize};\n `;\n },\n\n default(t: Theme) {\n return css`\n background: ${t.toastBg};\n color: ${t.toastColor};\n `;\n },\n\n error(t: Theme) {\n return css`\n background: ${t.toastErrorBg};\n color: ${t.toastColorError};\n `;\n },\n\n wrapper(t: Theme) {\n return css`\n position: fixed;\n top: 0;\n left: 0;\n right: 0;\n height: 0;\n text-align: center;\n border-radius: ${t.toastBorderRadius};\n `;\n },\n\n wrapper6_1(t: Theme) {\n return css`\n padding: 0 ${t.toastPaddingX};\n `;\n },\n\n content(t: Theme) {\n const [paddingTop, paddingBottom] = getVerticalPaddings(t);\n return css`\n padding: ${paddingTop} ${t.toastPaddingX} ${paddingBottom};\n `;\n },\n\n ellipsisContent() {\n return css`\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n text-align: start;\n `;\n },\n\n closeWrapper(t: Theme) {\n const [paddingTop, paddingBottom] = getVerticalPaddings(t);\n return css`\n display: flex;\n margin: -${paddingTop} -${t.toastPaddingX} -${paddingBottom} 0;\n `;\n },\n\n closeWrapper6_1() {\n return css`\n margin: 0;\n `;\n },\n\n link(t: Theme) {\n const [paddingTop, paddingBottom] = getVerticalPaddings(t);\n const padding = `${paddingTop} ${t.toastLinkPadding}`;\n\n return css`\n border: none;\n font: inherit;\n color: ${t.toastLinkColor};\n cursor: pointer;\n display: inline-block;\n font-weight: 600;\n background-color: transparent;\n\n margin: -${paddingTop} 0 -${paddingBottom} ${t.toastPaddingX};\n\n padding: ${padding};\n transition: background ${t.transitionDuration} ${t.transitionTimingFunction};\n &:hover {\n background: ${t.toastLinkBgHover};\n text-decoration: ${t.toastLinkTextDecorationHover};\n }\n padding: ${padding};\n transition: background ${t.transitionDuration} ${t.transitionTimingFunction};\n `;\n },\n\n link6_1(t: Theme) {\n return css`\n margin: 0;\n padding: 0 ${t.toastLinkPadding};\n `;\n },\n\n toastActionErrorColor(t: Theme) {\n return css`\n color: ${t.toastLinkColorError};\n\n &:hover {\n background: ${t.toastLinkBgHoverError};\n text-decoration: ${t.toastLinkTextDecorationHover};\n }\n\n &:active {\n background: ${t.toastLinkBgActiveError};\n color: ${t.toastLinkColorActiveError};\n }\n `;\n },\n\n toastActionDefaultColor(t: Theme) {\n return css`\n color: ${t.toastLinkColor};\n\n &:hover {\n background: ${t.toastLinkBgHover};\n text-decoration: ${t.toastLinkTextDecorationHover};\n }\n\n &:active {\n background: ${t.toastLinkBgActive};\n }\n `;\n },\n}));\n"]}

package/components/TokenInput/TokenInput.d.ts CHANGED Viewed

@@ -112,6 +112,7 @@ export interface TokenInputState<T> {
     inputValueHeight: number;
     preventBlur?: boolean;
     loading?: boolean;
+    showMobilePopup?: boolean;
 }
 export type TokenInputExtendedItem<T> = T | (() => React.ReactElement<T>) | React.ReactElement<T>;
 export declare const DefaultState: {
@@ -125,6 +126,7 @@ export declare const DefaultState: {
     preventBlur: boolean;
     inputValueWidth: number;
     inputValueHeight: number;
+    showMobilePopup: boolean;
 };
 export declare const TokenInputDataTids: {
     readonly root: "TokenInput__root";
@@ -151,6 +153,7 @@ export declare class TokenInput<T = string> extends React.PureComponent<TokenInp
     private styles;
     private theme;
     private size;
+    private isMobileLayout;
     private input;
     private tokensInputMenu;
     private textHelper;
@@ -161,6 +164,8 @@ export declare class TokenInput<T = string> extends React.PureComponent<TokenInp
     private memoizedTokens;
     componentDidMount(): void;
     componentDidUpdate(prevProps: TokenInputProps<T> & DefaultProps<T>, prevState: TokenInputState<T>): void;
+    private get usesMobilePopup();
+    private isInlineInteractive;
     componentWillUnmount(): void;
     /** Программно устанавливает фокус на поле.
      * Появляется фокусная рамка, элемент получает клавиатурные события и воспринимается как текущий элемент для чтения скринридерами.
@@ -179,6 +184,10 @@ export declare class TokenInput<T = string> extends React.PureComponent<TokenInp
     private getLabelSizeClassName;
     private getInputSizeClassName;
     private renderMain;
+    private renderInlineField;
+    private renderMobilePopupFooter;
+    private renderTokenInputField;
+    private renderMobileMenu;
     /**
      * Сбрасывает введённое пользователем значение.
      * @public
@@ -192,10 +201,12 @@ export declare class TokenInput<T = string> extends React.PureComponent<TokenInp
     private get isCursorVisible();
     private get isEditingMode();
     private isCursorVisibleForState;
-    private inputRef;
+    private inlineInputRef;
+    private mobileInputRef;
     private tokensInputMenuRef;
     private textHelperRef;
-    private wrapperRef;
+    private inlineWrapperRef;
+    private mobileWrapperRef;
     private dispatch;
     private updateInputTextWidth;
     private handleInputFocus;
@@ -208,6 +219,11 @@ export declare class TokenInput<T = string> extends React.PureComponent<TokenInp
     private handleWrapperMouseDown;
     private handleWrapperMouseUp;
     private handleCopy;
+    private get isDelimiterInputEnabled();
+    private inputValueEndsWithDelimiter;
+    private splitValueByDelimiters;
+    private isDelimiterKeyEvent;
+    private tryApplyDelimiterFromInputValue;
     private handleInputPaste;
     private tryGetItems;
     private handleKeyDown;