npm - @skbkontur/react-ui - Versions diffs - 4.1.1 → 4.1.2-fix-zindex - Mend

@skbkontur/react-ui 4.1.1 → 4.1.2-fix-zindex

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 (473) hide show

package/cjs/components/Loader/Loader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["Loader.tsx"],"names":["Loader","rootNode","props","childrenRef","element","childrenContainerNode","spinnerRef","spinnerContainerNode","checkSpinnerPosition","containerTop","top","containerRight","right","containerBottom","bottom","containerLeft","left","containerHeight","height","containerWidth","width","windowHeight","window","innerHeight","windowWidth","innerWidth","setState","isStickySpinner","spinnerStyle","Math","abs","spinnerHeight","spinnerNode","disableChildrenFocus","childrenObserver","makeObservable","tabbableElements","forEach","el","hasAttribute","setAttribute","tabIndex","toString","enableChildrenFocus","makeUnobservable","Array","from","document","querySelectorAll","getAttribute","removeAttribute","target","config","childList","subtree","observer","MutationObserver","observe","disconnect","state","isSpinnerVisible","isLoaderActive","spinnerTask","TaskWithDelayAndMinimalDuration","delayBeforeTaskStart","delayBeforeSpinnerShow","durationOfTask","minimalDelayBeforeSpinnerHide","taskStartCallback","taskStopCallback","componentDidMount","active","start","layoutEvents","LayoutEvents","addListener","componentDidUpdate","prevProps","prevState","component","update","stop","componentWillUnmount","remove","clearTask","getDerivedStateFromProps","render","theme","renderMain","type","caption","setRootNode","styles","loader","children","renderSpinner","spinnerContainer","spinnerContainerSticky","spinnerComponentWrapper","undefined","React","Component","__KONTUR_REACT_UI__","defaultProps","Spinner","Types","normal","isTestEnv","propTypes","PropTypes","bool","node","className","string","oneOf","Object","keys","number"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport debounce from 'lodash.debounce';\n\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { Spinner, SpinnerProps } from '../Spinner';\nimport { Nullable } from '../../typings/utility-types';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { ZIndex } from '../../internal/ZIndex';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { TaskWithDelayAndMinimalDuration } from '../../lib/taskWithDelayAndMinimalDuration';\nimport { getTabbableElements } from '../../lib/dom/tabbableHelpers';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { getDOMRect } from '../../lib/dom/getDOMRect';\n\nimport { styles } from './Loader.styles';\n\nexport interface LoaderProps extends CommonProps {\n children?: React.ReactNode;\n /*\n Флаг переключения состояния лоадера\n * @default false\n /\n active: boolean;\n caption?: SpinnerProps['caption'];\n /\n Компонент заменяющий спиннер.\n /\n component?: React.ReactNode;\n className?: string;\n type?: 'mini' \| 'normal' \| 'big';\n /\n Время в миллисекундах для показа вуали без спиннера.\n * @default 300\n /\n delayBeforeSpinnerShow: number;\n /\n Минимальное время в миллисекундах для показа спиннера\n * @default 1000\n /\n minimalDelayBeforeSpinnerHide: number;\n}\n\nexport interface LoaderState {\n isStickySpinner: boolean;\n isSpinnerVisible: boolean;\n isLoaderActive: boolean;\n spinnerStyle?: object;\n}\n\n/\n DRAFT - лоадер-контейнер\n /\n@rootNode\nexport class Loader extends React.Component<LoaderProps, LoaderState> {\n public static __KONTUR_REACT_UI__ = 'Loader';\n\n public static defaultProps: Partial<LoaderProps> = {\n type: Spinner.Types.normal,\n active: false,\n delayBeforeSpinnerShow: isTestEnv ? 0 : 300,\n minimalDelayBeforeSpinnerHide: isTestEnv ? 0 : 1000,\n };\n\n public static propTypes = {\n /\n показываем лоадер или нет\n /\n active: PropTypes.bool,\n\n /\n Текст рядом с лоадером.\n \n @default \"Загрузка\"\n /\n caption: Spinner.propTypes.caption,\n\n component: PropTypes.node,\n\n /\n Класс для обертки\n /\n className: PropTypes.string,\n\n /\n Тип спиннера: mini, normal, big\n \n @default normal\n \n Spinner.types - все доступные типы\n /\n type: PropTypes.oneOf(Object.keys(Spinner.Types)),\n /\n Время в миллисекундах для показа вуали без спиннера.\n * @default 300\n /\n delayBeforeSpinnerShow: PropTypes.number,\n /\n Минимальное время в миллисекундах для показа спиннера\n * @default 1000\n */\n minimalDelayBeforeSpinnerHide: PropTypes.number,\n };\n\n private theme!: Theme;\n private setRootNode!: TSetRootNode;\n private spinnerContainerNode: Nullable<HTMLDivElement>;\n private childrenContainerNode: Nullable<HTMLDivElement>;\n private spinnerNode: Nullable<HTMLDivElement>;\n private layoutEvents: Nullable<{ remove: () => void }>;\n private spinnerTask: TaskWithDelayAndMinimalDuration;\n private childrenObserver: Nullable<MutationObserver>;\n\n constructor(props: LoaderProps) {\n super(props);\n\n this.spinnerContainerNode = null;\n this.childrenContainerNode = null;\n this.childrenObserver = null;\n this.spinnerNode = null;\n\n this.state = {\n isStickySpinner: false,\n isSpinnerVisible: false,\n isLoaderActive: false,\n };\n\n this.spinnerTask = new TaskWithDelayAndMinimalDuration({\n delayBeforeTaskStart: this.props.delayBeforeSpinnerShow,\n durationOfTask: this.props.minimalDelayBeforeSpinnerHide,\n taskStartCallback: () => this.setState({ isSpinnerVisible: true }),\n taskStopCallback: () => this.setState({ isSpinnerVisible: false }),\n });\n }\n\n public componentDidMount() {\n this.checkSpinnerPosition();\n this.props.active && this.spinnerTask.start();\n this.layoutEvents = LayoutEvents.addListener(debounce(this.checkSpinnerPosition, 10));\n\n if (this.props.active) {\n this.disableChildrenFocus();\n }\n }\n\n public componentDidUpdate(prevProps: Readonly<LoaderProps>, prevState: Readonly<LoaderState>) {\n const { component, active, delayBeforeSpinnerShow, minimalDelayBeforeSpinnerHide } = this.props;\n const { isLoaderActive } = this.state;\n\n if ((active && !prevProps.active) \|\| prevProps.component !== component) {\n this.checkSpinnerPosition();\n }\n\n if (\n delayBeforeSpinnerShow !== prevProps.delayBeforeSpinnerShow \|\|\n minimalDelayBeforeSpinnerHide !== prevProps.minimalDelayBeforeSpinnerHide\n ) {\n this.spinnerTask.update({\n delayBeforeTaskStart: delayBeforeSpinnerShow,\n durationOfTask: minimalDelayBeforeSpinnerHide,\n });\n }\n\n if (active !== prevProps.active) {\n active ? this.spinnerTask.start() : this.spinnerTask.stop();\n }\n\n if (isLoaderActive !== prevState.isLoaderActive) {\n if (isLoaderActive) {\n this.disableChildrenFocus();\n } else {\n this.enableChildrenFocus();\n }\n }\n }\n\n public componentWillUnmount() {\n this.makeUnobservable();\n if (this.layoutEvents) {\n this.layoutEvents.remove();\n }\n this.spinnerTask.clearTask();\n }\n\n public static getDerivedStateFromProps(props: LoaderProps, state: LoaderState): Partial<LoaderState> {\n if (props.active && !state.isLoaderActive) {\n return {\n isLoaderActive: true,\n };\n }\n if (state.isLoaderActive && !(props.active \|\| state.isSpinnerVisible)) {\n return {\n isLoaderActive: false,\n };\n }\n\n return state;\n }\n\n public render() {\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 { type, caption, component } = this.props;\n const { isLoaderActive } = this.state;\n\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div className={styles.loader()} data-tid={isLoaderActive ? 'Loader__Veil' : ''}>\n <ZIndex\n priority={'Loader'}\n applyZIndex={isLoaderActive}\n coverChildren={isLoaderActive}\n style={{ height: '100%' }}\n wrapperRef={this.childrenRef}\n >\n {this.props.children}\n </ZIndex>\n {isLoaderActive && (\n <ZIndex\n wrapperRef={this.spinnerRef}\n priority={'Loader'}\n className={cx({\n [styles.active(this.theme)]: isLoaderActive,\n })}\n >\n {this.state.isSpinnerVisible && this.renderSpinner(type, caption, component)}\n </ZIndex>\n )}\n </div>\n </CommonWrapper>\n );\n }\n\n private childrenRef = (element: HTMLDivElement \| null) => {\n this.childrenContainerNode = element;\n };\n\n private spinnerRef = (element: HTMLDivElement \| null) => {\n this.spinnerContainerNode = element;\n };\n\n private renderSpinner(type?: 'mini' \| 'normal' \| 'big', caption?: React.ReactNode, component?: React.ReactNode) {\n return (\n <span\n data-tid={'Loader__Spinner'}\n className={cx(styles.spinnerContainer(), { [styles.spinnerContainerSticky()]: this.state.isStickySpinner })}\n style={this.state.spinnerStyle}\n >\n <div\n className={styles.spinnerComponentWrapper()}\n ref={(element) => {\n this.spinnerNode = element;\n }}\n >\n {component !== undefined ? component : <Spinner type={type} caption={caption} />}\n </div>\n </span>\n );\n }\n\n private checkSpinnerPosition = () => {\n if (!this.spinnerContainerNode) {\n return;\n }\n\n const {\n top: containerTop,\n right: containerRight,\n bottom: containerBottom,\n left: containerLeft,\n height: containerHeight,\n width: containerWidth,\n } = getDOMRect(this.spinnerContainerNode);\n\n const windowHeight = window.innerHeight;\n const windowWidth = window.innerWidth;\n\n // Если контейнер не больше высоты и не шире окна,\n // то просто выравниваем по центру\n if (windowHeight >= containerHeight && windowWidth >= containerWidth) {\n this.setState({\n isStickySpinner: false,\n spinnerStyle: {},\n });\n return;\n }\n\n const spinnerStyle: {\n top?: number;\n right: number;\n bottom: number;\n left: number;\n } = {\n top: 30,\n right: 0,\n bottom: 30,\n left: 0,\n };\n\n // ПО ВЕРТИКАЛИ\n // Если верхний край контейнера ниже верхнего края окна,\n // то сдвигаем и лоадер\n if (containerTop > 0) {\n spinnerStyle.top = containerTop + 30;\n }\n\n // Если нижний край контейнера выше нижнего края окна,\n // то сдвигаем и лоадер\n if (containerBottom < windowHeight) {\n spinnerStyle.bottom = Math.abs(windowHeight - containerBottom) + 30;\n }\n\n // Если знаем высоту спиннера и нижний край контейнера поднимается\n // выше отступа на высоту спиннера, то убираем верхнюю позицию лоадера\n\n const spinnerHeight = getDOMRect(this.spinnerNode).height;\n\n if (spinnerHeight && spinnerStyle.bottom >= windowHeight - spinnerHeight) {\n delete spinnerStyle.top;\n }\n\n // ПО ГОРИЗОНТАЛИ\n // Если левый край контейнера правее левого края окна,\n // то сдвигаем и лоадер\n if (containerLeft > 0) {\n spinnerStyle.left = containerLeft;\n }\n\n // Если правый край контейнера левее правого края окна,\n // то сдвигаем и лоадер\n if (containerRight < windowWidth) {\n spinnerStyle.right = windowWidth - containerRight;\n }\n\n this.setState({\n isStickySpinner: true,\n spinnerStyle,\n });\n };\n\n private disableChildrenFocus = () => {\n if (!this.childrenObserver) {\n this.makeObservable();\n }\n const tabbableElements = getTabbableElements(this.childrenContainerNode);\n tabbableElements.forEach((el) => {\n if (!el.hasAttribute('origin-tabindex')) {\n el.setAttribute('origin-tabindex', el.tabIndex.toString());\n }\n el.tabIndex = -1;\n });\n };\n\n private enableChildrenFocus = () => {\n this.makeUnobservable();\n // NOTE: NodeList doesn't support 'forEach' method in IE11 and other older browsers\n Array.from(document.querySelectorAll('[origin-tabindex]')).forEach((el) => {\n el.setAttribute('tabindex', el.getAttribute('origin-tabindex') ?? '0');\n el.removeAttribute('origin-tabindex');\n });\n };\n\n private makeObservable = () => {\n const target = this.childrenContainerNode;\n if (!target) {\n return;\n }\n const config = {\n childList: true,\n subtree: true,\n };\n const observer = new MutationObserver(this.disableChildrenFocus);\n observer.observe(target, config);\n this.childrenObserver = observer;\n };\n\n private makeUnobservable = () => {\n this.childrenObserver?.disconnect();\n this.childrenObserver = null;\n };\n}\n"]}
1	+ {"version":3,"sources":["Loader.tsx"],"names":["LoaderDataTids","veil","spinner","Loader","rootNode","props","childrenRef","element","childrenContainerNode","spinnerRef","spinnerContainerNode","checkSpinnerPosition","containerTop","top","containerRight","right","containerBottom","bottom","containerLeft","left","containerHeight","height","containerWidth","width","windowHeight","window","innerHeight","windowWidth","innerWidth","setState","isStickySpinner","spinnerStyle","Math","abs","spinnerHeight","spinnerNode","disableChildrenFocus","childrenObserver","makeObservable","tabbableElements","forEach","el","hasAttribute","setAttribute","tabIndex","toString","enableChildrenFocus","makeUnobservable","Array","from","document","querySelectorAll","getAttribute","removeAttribute","target","config","childList","subtree","observer","MutationObserver","observe","disconnect","state","isSpinnerVisible","isLoaderActive","spinnerTask","TaskWithDelayAndMinimalDuration","delayBeforeTaskStart","delayBeforeSpinnerShow","durationOfTask","minimalDelayBeforeSpinnerHide","taskStartCallback","taskStopCallback","componentDidMount","active","start","layoutEvents","LayoutEvents","addListener","componentDidUpdate","prevProps","prevState","component","update","stop","componentWillUnmount","remove","clearTask","getDerivedStateFromProps","render","theme","renderMain","type","caption","setRootNode","styles","loader","children","renderSpinner","spinnerContainer","spinnerContainerSticky","spinnerComponentWrapper","undefined","React","Component","__KONTUR_REACT_UI__","defaultProps","Spinner","Types","normal","isTestEnv","propTypes","PropTypes","bool","node","className","string","oneOf","Object","keys","number"],"mappings":"6VAAA;AACA;AACA;;AAEA;AACA;;AAEA;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAEA,yC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAmCO,IAAMA,cAAc,GAAG;AAC5BC,EAAAA,IAAI,EAAE,cADsB;AAE5BC,EAAAA,OAAO,EAAE,iBAFmB,EAAvB;;;AAKP;AACA;AACA,G;;AAEaC,M,OADZC,kB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA4DC,kBAAYC,KAAZ,EAAgC;AAC9B,wCAAMA,KAAN,UAD8B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAiIxBC,IAAAA,WAjIwB,GAiIV,UAACC,OAAD,EAAoC;AACxD,YAAKC,qBAAL,GAA6BD,OAA7B;AACD,KAnI+B;;AAqIxBE,IAAAA,UArIwB,GAqIX,UAACF,OAAD,EAAoC;AACvD,YAAKG,oBAAL,GAA4BH,OAA5B;AACD,KAvI+B;;;;;;;;;;;;;;;;;;;;;AA4JxBI,IAAAA,oBA5JwB,GA4JD,YAAM;AACnC,UAAI,CAAC,MAAKD,oBAAV,EAAgC;AAC9B;AACD;;AAED;;;;;;;AAOI,mCAAW,MAAKA,oBAAhB,CAPJ,CACOE,YADP,eACEC,GADF,CAESC,cAFT,eAEEC,KAFF,CAGUC,eAHV,eAGEC,MAHF,CAIQC,aAJR,eAIEC,IAJF,CAKUC,eALV,eAKEC,MALF,CAMSC,cANT,eAMEC,KANF;;AASA,UAAMC,YAAY,GAAGC,MAAM,CAACC,WAA5B;AACA,UAAMC,WAAW,GAAGF,MAAM,CAACG,UAA3B;;AAEA;AACA;AACA,UAAIJ,YAAY,IAAIJ,eAAhB,IAAmCO,WAAW,IAAIL,cAAtD,EAAsE;AACpE,cAAKO,QAAL,CAAc;AACZC,UAAAA,eAAe,EAAE,KADL;AAEZC,UAAAA,YAAY,EAAE,EAFF,EAAd;;AAIA;AACD;;AAED,UAAMA,YAKL;;;;;AAAG;AACFlB,QAAAA,GAAG,EAAE,EADH;AAEFE,QAAAA,KAAK,EAAE,CAFL;AAGFE,QAAAA,MAAM,EAAE,EAHN;AAIFE,QAAAA,IAAI,EAAE,CAJJ,EALJ;;;AAYA;AACA;AACA;AACA,UAAIP,YAAY,GAAG,CAAnB,EAAsB;AACpBmB,QAAAA,YAAY,CAAClB,GAAb,GAAmBD,YAAY,GAAG,EAAlC;AACD;;AAED;AACA;AACA,UAAII,eAAe,GAAGQ,YAAtB,EAAoC;AAClCO,QAAAA,YAAY,CAACd,MAAb,GAAsBe,IAAI,CAACC,GAAL,CAAST,YAAY,GAAGR,eAAxB,IAA2C,EAAjE;AACD;;AAED;AACA;;AAEA,UAAMkB,aAAa,GAAG,6BAAW,MAAKC,WAAhB,EAA6Bd,MAAnD;;AAEA,UAAIa,aAAa,IAAIH,YAAY,CAACd,MAAb,IAAuBO,YAAY,GAAGU,aAA3D,EAA0E;AACxE,eAAOH,YAAY,CAAClB,GAApB;AACD;;AAED;AACA;AACA;AACA,UAAIK,aAAa,GAAG,CAApB,EAAuB;AACrBa,QAAAA,YAAY,CAACZ,IAAb,GAAoBD,aAApB;AACD;;AAED;AACA;AACA,UAAIJ,cAAc,GAAGa,WAArB,EAAkC;AAChCI,QAAAA,YAAY,CAAChB,KAAb,GAAqBY,WAAW,GAAGb,cAAnC;AACD;;AAED,YAAKe,QAAL,CAAc;AACZC,QAAAA,eAAe,EAAE,IADL;AAEZC,QAAAA,YAAY,EAAZA,YAFY,EAAd;;AAID,KA1O+B;;AA4OxBK,IAAAA,oBA5OwB,GA4OD,YAAM;AACnC,UAAI,CAAC,MAAKC,gBAAV,EAA4B;AAC1B,cAAKC,cAAL;AACD;AACD,UAAMC,gBAAgB,GAAG,0CAAoB,MAAK/B,qBAAzB,CAAzB;AACA+B,MAAAA,gBAAgB,CAACC,OAAjB,CAAyB,UAACC,EAAD,EAAQ;AAC/B,YAAI,CAACA,EAAE,CAACC,YAAH,CAAgB,iBAAhB,CAAL,EAAyC;AACvCD,UAAAA,EAAE,CAACE,YAAH,CAAgB,iBAAhB,EAAmCF,EAAE,CAACG,QAAH,CAAYC,QAAZ,EAAnC;AACD;AACDJ,QAAAA,EAAE,CAACG,QAAH,GAAc,CAAC,CAAf;AACD,OALD;AAMD,KAvP+B;;AAyPxBE,IAAAA,mBAzPwB,GAyPF,YAAM;AAClC,YAAKC,gBAAL;AACA;AACAC,MAAAA,KAAK,CAACC,IAAN,CAAWC,QAAQ,CAACC,gBAAT,CAA0B,mBAA1B,CAAX,EAA2DX,OAA3D,CAAmE,UAACC,EAAD,EAAQ;AACzEA,QAAAA,EAAE,CAACE,YAAH,CAAgB,UAAhB,sBAA4BF,EAAE,CAACW,YAAH,CAAgB,iBAAhB,CAA5B,+BAAkE,GAAlE;AACAX,QAAAA,EAAE,CAACY,eAAH,CAAmB,iBAAnB;AACD,OAHD;AAID,KAhQ+B;;AAkQxBf,IAAAA,cAlQwB,GAkQP,YAAM;AAC7B,UAAMgB,MAAM,GAAG,MAAK9C,qBAApB;AACA,UAAI,CAAC8C,MAAL,EAAa;AACX;AACD;AACD,UAAMC,MAAM,GAAG;AACbC,QAAAA,SAAS,EAAE,IADE;AAEbC,QAAAA,OAAO,EAAE,IAFI,EAAf;;AAIA,UAAMC,QAAQ,GAAG,IAAIC,gBAAJ,CAAqB,MAAKvB,oBAA1B,CAAjB;AACAsB,MAAAA,QAAQ,CAACE,OAAT,CAAiBN,MAAjB,EAAyBC,MAAzB;AACA,YAAKlB,gBAAL,GAAwBqB,QAAxB;AACD,KA9Q+B;;AAgRxBX,IAAAA,gBAhRwB,GAgRL,YAAM;AAC/B,qCAAKV,gBAAL,2CAAuBwB,UAAvB;AACA,YAAKxB,gBAAL,GAAwB,IAAxB;AACD,KAnR+B,CAG9B,MAAK3B,oBAAL,GAA4B,IAA5B,CACA,MAAKF,qBAAL,GAA6B,IAA7B,CACA,MAAK6B,gBAAL,GAAwB,IAAxB,CACA,MAAKF,WAAL,GAAmB,IAAnB,CAEA,MAAK2B,KAAL,GAAa,EACXhC,eAAe,EAAE,KADN,EAEXiC,gBAAgB,EAAE,KAFP,EAGXC,cAAc,EAAE,KAHL,EAAb,CAMA,MAAKC,WAAL,GAAmB,IAAIC,gEAAJ,CAAoC,EACrDC,oBAAoB,EAAE,MAAK9D,KAAL,CAAW+D,sBADoB,EAErDC,cAAc,EAAE,MAAKhE,KAAL,CAAWiE,6BAF0B,EAGrDC,iBAAiB,EAAE,qCAAM,MAAK1C,QAAL,CAAc,EAAEkC,gBAAgB,EAAE,IAApB,EAAd,CAAN,EAHkC,EAIrDS,gBAAgB,EAAE,oCAAM,MAAK3C,QAAL,CAAc,EAAEkC,gBAAgB,EAAE,KAApB,EAAd,CAAN,EAJmC,EAApC,CAAnB,CAd8B,aAoB/B,C,qCAEMU,iB,GAAP,6BAA2B,CACzB,KAAK9D,oBAAL,GACA,KAAKN,KAAL,CAAWqE,MAAX,IAAqB,KAAKT,WAAL,CAAiBU,KAAjB,EAArB,CACA,KAAKC,YAAL,GAAoBC,YAAY,CAACC,WAAb,CAAyB,qBAAS,KAAKnE,oBAAd,EAAoC,EAApC,CAAzB,CAApB,CAEA,IAAI,KAAKN,KAAL,CAAWqE,MAAf,EAAuB,CACrB,KAAKtC,oBAAL,GACD,CACF,C,QAEM2C,kB,GAAP,4BAA0BC,SAA1B,EAA4DC,SAA5D,EAA8F,CAC5F,kBAAqF,KAAK5E,KAA1F,CAAQ6E,SAAR,eAAQA,SAAR,CAAmBR,MAAnB,eAAmBA,MAAnB,CAA2BN,sBAA3B,eAA2BA,sBAA3B,CAAmDE,6BAAnD,eAAmDA,6BAAnD,CACA,IAAQN,cAAR,GAA2B,KAAKF,KAAhC,CAAQE,cAAR,CAEA,IAAKU,MAAM,IAAI,CAACM,SAAS,CAACN,MAAtB,IAAiCM,SAAS,CAACE,SAAV,KAAwBA,SAA7D,EAAwE,CACtE,KAAKvE,oBAAL,GACD,CAED,IACEyD,sBAAsB,KAAKY,SAAS,CAACZ,sBAArC,IACAE,6BAA6B,KAAKU,SAAS,CAACV,6BAF9C,EAGE,CACA,KAAKL,WAAL,CAAiBkB,MAAjB,CAAwB,EACtBhB,oBAAoB,EAAEC,sBADA,EAEtBC,cAAc,EAAEC,6BAFM,EAAxB,EAID,CAED,IAAII,MAAM,KAAKM,SAAS,CAACN,MAAzB,EAAiC,CAC/BA,MAAM,GAAG,KAAKT,WAAL,CAAiBU,KAAjB,EAAH,GAA8B,KAAKV,WAAL,CAAiBmB,IAAjB,EAApC,CACD,CAED,IAAIpB,cAAc,KAAKiB,SAAS,CAACjB,cAAjC,EAAiD,CAC/C,IAAIA,cAAJ,EAAoB,CAClB,KAAK5B,oBAAL,GACD,CAFD,MAEO,CACL,KAAKU,mBAAL,GACD,CACF,CACF,C,QAEMuC,oB,GAAP,gCAA8B,CAC5B,KAAKtC,gBAAL,GACA,IAAI,KAAK6B,YAAT,EAAuB,CACrB,KAAKA,YAAL,CAAkBU,MAAlB,GACD,CACD,KAAKrB,WAAL,CAAiBsB,SAAjB,GACD,C,QAEaC,wB,GAAd,kCAAuCnF,KAAvC,EAA2DyD,KAA3D,EAAqG,CACnG,IAAIzD,KAAK,CAACqE,MAAN,IAAgB,CAACZ,KAAK,CAACE,cAA3B,EAA2C,CACzC,OAAO,EACLA,cAAc,EAAE,IADX,EAAP,CAGD,CACD,IAAIF,KAAK,CAACE,cAAN,IAAwB,EAAE3D,KAAK,CAACqE,MAAN,IAAgBZ,KAAK,CAACC,gBAAxB,CAA5B,EAAuE,CACrE,OAAO,EACLC,cAAc,EAAE,KADX,EAAP,CAGD,CAED,OAAOF,KAAP,CACD,C,QAEM2B,M,GAAP,kBAAgB,mBACd,oBACE,6BAAC,0BAAD,CAAc,QAAd,QACG,UAACC,KAAD,EAAW,CACV,MAAI,CAACA,KAAL,GAAaA,KAAb,CACA,OAAO,MAAI,CAACC,UAAL,EAAP,CACD,CAJH,CADF,CAQD,C,QAEOA,U,GAAR,sBAAqB,SACnB,mBAAqC,KAAKtF,KAA1C,CAAQuF,IAAR,gBAAQA,IAAR,CAAcC,OAAd,gBAAcA,OAAd,CAAuBX,SAAvB,gBAAuBA,SAAvB,CACA,IAAQlB,cAAR,GAA2B,KAAKF,KAAhC,CAAQE,cAAR,CAEA,oBACE,6BAAC,4BAAD,2BAAe,WAAW,EAAE,KAAK8B,WAAjC,IAAkD,KAAKzF,KAAvD,gBACE,sCAAK,SAAS,EAAE0F,eAAOC,MAAP,EAAhB,EAAiC,YAAUhC,cAAc,GAAGhE,cAAc,CAACC,IAAlB,GAAyB,EAAlF,iBACE,6BAAC,cAAD,IACE,QAAQ,EAAE,QADZ,EAEE,WAAW,EAAE+D,cAFf,EAGE,aAAa,EAAEA,cAHjB,EAIE,KAAK,EAAE,EAAE3C,MAAM,EAAE,MAAV,EAJT,EAKE,UAAU,EAAE,KAAKf,WALnB,IAOG,KAAKD,KAAL,CAAW4F,QAPd,CADF,EAUGjC,cAAc,iBACb,6BAAC,cAAD,IACE,UAAU,EAAE,KAAKvD,UADnB,EAEE,QAAQ,EAAE,QAFZ,EAGE,SAAS,EAAE,gCACRsF,eAAOrB,MAAP,CAAc,KAAKgB,KAAnB,CADQ,IACoB1B,cADpB,OAHb,IAOG,KAAKF,KAAL,CAAWC,gBAAX,IAA+B,KAAKmC,aAAL,CAAmBN,IAAnB,EAAyBC,OAAzB,EAAkCX,SAAlC,CAPlC,CAXJ,CADF,CADF,CA0BD,C,QAUOgB,a,GAAR,uBAAsBN,IAAtB,EAAwDC,OAAxD,EAAmFX,SAAnF,EAAgH,wBAC9G,oBACE,uCACE,YAAUlF,cAAc,CAACE,OAD3B,EAEE,SAAS,EAAE,iBAAG6F,eAAOI,gBAAP,EAAH,mBAAiCJ,eAAOK,sBAAP,EAAjC,IAAmE,KAAKtC,KAAL,CAAWhC,eAA9E,QAFb,EAGE,KAAK,EAAE,KAAKgC,KAAL,CAAW/B,YAHpB,iBAKE,sCACE,SAAS,EAAEgE,eAAOM,uBAAP,EADb,EAEE,GAAG,EAAE,aAAC9F,OAAD,EAAa,CAChB,MAAI,CAAC4B,WAAL,GAAmB5B,OAAnB,CACD,CAJH,IAMG2E,SAAS,KAAKoB,SAAd,GAA0BpB,SAA1B,gBAAsC,6BAAC,gBAAD,IAAS,IAAI,EAAEU,IAAf,EAAqB,OAAO,EAAEC,OAA9B,GANzC,CALF,CADF,CAgBD,C,iBArNyBU,eAAMC,S,WAClBC,mB,GAAsB,Q,UAEtBC,Y,GAAqC,EACjDd,IAAI,EAAEe,iBAAQC,KAAR,CAAcC,MAD6B,EAEjDnC,MAAM,EAAE,KAFyC,EAGjDN,sBAAsB,EAAE0C,gCAAY,CAAZ,GAAgB,GAHS,EAIjDxC,6BAA6B,EAAEwC,gCAAY,CAAZ,GAAgB,IAJE,E,UAOrCC,S,GAAY,EACxB;AACJ;AACA,KACIrC,MAAM,EAAEsC,mBAAUC,IAJM,EAMxB;AACJ;AACA;AACA;AACA,KACIpB,OAAO,EAAEc,iBAAQI,SAAR,CAAkBlB,OAXH,EAaxBX,SAAS,EAAE8B,mBAAUE,IAbG,EAexB;AACJ;AACA,KACIC,SAAS,EAAEH,mBAAUI,MAlBG,EAoBxB;AACJ;AACA;AACA;AACA;AACA;AACA,KACIxB,IAAI,EAAEoB,mBAAUK,KAAV,CAAgBC,MAAM,CAACC,IAAP,CAAYZ,iBAAQC,KAApB,CAAhB,CA3BkB,EA4BxB;AACJ;AACA;AACA,KACIxC,sBAAsB,EAAE4C,mBAAUQ,MAhCV,EAiCxB;AACJ;AACA;AACA,KACIlD,6BAA6B,EAAE0C,mBAAUQ,MArCjB,E","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport debounce from 'lodash.debounce';\n\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { Spinner, SpinnerProps } from '../Spinner';\nimport { Nullable } from '../../typings/utility-types';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { ZIndex } from '../../internal/ZIndex';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { TaskWithDelayAndMinimalDuration } from '../../lib/taskWithDelayAndMinimalDuration';\nimport { getTabbableElements } from '../../lib/dom/tabbableHelpers';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { getDOMRect } from '../../lib/dom/getDOMRect';\n\nimport { styles } from './Loader.styles';\n\nexport interface LoaderProps extends CommonProps {\n children?: React.ReactNode;\n /*\n Флаг переключения состояния лоадера\n * @default false\n /\n active: boolean;\n caption?: SpinnerProps['caption'];\n /\n Компонент заменяющий спиннер.\n /\n component?: React.ReactNode;\n className?: string;\n type?: 'mini' \| 'normal' \| 'big';\n /\n Время в миллисекундах для показа вуали без спиннера.\n * @default 300\n /\n delayBeforeSpinnerShow: number;\n /\n Минимальное время в миллисекундах для показа спиннера\n * @default 1000\n /\n minimalDelayBeforeSpinnerHide: number;\n}\n\nexport interface LoaderState {\n isStickySpinner: boolean;\n isSpinnerVisible: boolean;\n isLoaderActive: boolean;\n spinnerStyle?: object;\n}\n\nexport const LoaderDataTids = {\n veil: 'Loader__Veil',\n spinner: 'Loader__Spinner',\n} as const;\n\n/\n DRAFT - лоадер-контейнер\n /\n@rootNode\nexport class Loader extends React.Component<LoaderProps, LoaderState> {\n public static __KONTUR_REACT_UI__ = 'Loader';\n\n public static defaultProps: Partial<LoaderProps> = {\n type: Spinner.Types.normal,\n active: false,\n delayBeforeSpinnerShow: isTestEnv ? 0 : 300,\n minimalDelayBeforeSpinnerHide: isTestEnv ? 0 : 1000,\n };\n\n public static propTypes = {\n /\n показываем лоадер или нет\n /\n active: PropTypes.bool,\n\n /\n Текст рядом с лоадером.\n \n @default \"Загрузка\"\n /\n caption: Spinner.propTypes.caption,\n\n component: PropTypes.node,\n\n /\n Класс для обертки\n /\n className: PropTypes.string,\n\n /\n Тип спиннера: mini, normal, big\n \n @default normal\n \n Spinner.types - все доступные типы\n /\n type: PropTypes.oneOf(Object.keys(Spinner.Types)),\n /\n Время в миллисекундах для показа вуали без спиннера.\n * @default 300\n /\n delayBeforeSpinnerShow: PropTypes.number,\n /\n Минимальное время в миллисекундах для показа спиннера\n * @default 1000\n */\n minimalDelayBeforeSpinnerHide: PropTypes.number,\n };\n\n private theme!: Theme;\n private setRootNode!: TSetRootNode;\n private spinnerContainerNode: Nullable<HTMLDivElement>;\n private childrenContainerNode: Nullable<HTMLDivElement>;\n private spinnerNode: Nullable<HTMLDivElement>;\n private layoutEvents: Nullable<{ remove: () => void }>;\n private spinnerTask: TaskWithDelayAndMinimalDuration;\n private childrenObserver: Nullable<MutationObserver>;\n\n constructor(props: LoaderProps) {\n super(props);\n\n this.spinnerContainerNode = null;\n this.childrenContainerNode = null;\n this.childrenObserver = null;\n this.spinnerNode = null;\n\n this.state = {\n isStickySpinner: false,\n isSpinnerVisible: false,\n isLoaderActive: false,\n };\n\n this.spinnerTask = new TaskWithDelayAndMinimalDuration({\n delayBeforeTaskStart: this.props.delayBeforeSpinnerShow,\n durationOfTask: this.props.minimalDelayBeforeSpinnerHide,\n taskStartCallback: () => this.setState({ isSpinnerVisible: true }),\n taskStopCallback: () => this.setState({ isSpinnerVisible: false }),\n });\n }\n\n public componentDidMount() {\n this.checkSpinnerPosition();\n this.props.active && this.spinnerTask.start();\n this.layoutEvents = LayoutEvents.addListener(debounce(this.checkSpinnerPosition, 10));\n\n if (this.props.active) {\n this.disableChildrenFocus();\n }\n }\n\n public componentDidUpdate(prevProps: Readonly<LoaderProps>, prevState: Readonly<LoaderState>) {\n const { component, active, delayBeforeSpinnerShow, minimalDelayBeforeSpinnerHide } = this.props;\n const { isLoaderActive } = this.state;\n\n if ((active && !prevProps.active) \|\| prevProps.component !== component) {\n this.checkSpinnerPosition();\n }\n\n if (\n delayBeforeSpinnerShow !== prevProps.delayBeforeSpinnerShow \|\|\n minimalDelayBeforeSpinnerHide !== prevProps.minimalDelayBeforeSpinnerHide\n ) {\n this.spinnerTask.update({\n delayBeforeTaskStart: delayBeforeSpinnerShow,\n durationOfTask: minimalDelayBeforeSpinnerHide,\n });\n }\n\n if (active !== prevProps.active) {\n active ? this.spinnerTask.start() : this.spinnerTask.stop();\n }\n\n if (isLoaderActive !== prevState.isLoaderActive) {\n if (isLoaderActive) {\n this.disableChildrenFocus();\n } else {\n this.enableChildrenFocus();\n }\n }\n }\n\n public componentWillUnmount() {\n this.makeUnobservable();\n if (this.layoutEvents) {\n this.layoutEvents.remove();\n }\n this.spinnerTask.clearTask();\n }\n\n public static getDerivedStateFromProps(props: LoaderProps, state: LoaderState): Partial<LoaderState> {\n if (props.active && !state.isLoaderActive) {\n return {\n isLoaderActive: true,\n };\n }\n if (state.isLoaderActive && !(props.active \|\| state.isSpinnerVisible)) {\n return {\n isLoaderActive: false,\n };\n }\n\n return state;\n }\n\n public render() {\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 { type, caption, component } = this.props;\n const { isLoaderActive } = this.state;\n\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n <div className={styles.loader()} data-tid={isLoaderActive ? LoaderDataTids.veil : ''}>\n <ZIndex\n priority={'Loader'}\n applyZIndex={isLoaderActive}\n coverChildren={isLoaderActive}\n style={{ height: '100%' }}\n wrapperRef={this.childrenRef}\n >\n {this.props.children}\n </ZIndex>\n {isLoaderActive && (\n <ZIndex\n wrapperRef={this.spinnerRef}\n priority={'Loader'}\n className={cx({\n [styles.active(this.theme)]: isLoaderActive,\n })}\n >\n {this.state.isSpinnerVisible && this.renderSpinner(type, caption, component)}\n </ZIndex>\n )}\n </div>\n </CommonWrapper>\n );\n }\n\n private childrenRef = (element: HTMLDivElement \| null) => {\n this.childrenContainerNode = element;\n };\n\n private spinnerRef = (element: HTMLDivElement \| null) => {\n this.spinnerContainerNode = element;\n };\n\n private renderSpinner(type?: 'mini' \| 'normal' \| 'big', caption?: React.ReactNode, component?: React.ReactNode) {\n return (\n <span\n data-tid={LoaderDataTids.spinner}\n className={cx(styles.spinnerContainer(), { [styles.spinnerContainerSticky()]: this.state.isStickySpinner })}\n style={this.state.spinnerStyle}\n >\n <div\n className={styles.spinnerComponentWrapper()}\n ref={(element) => {\n this.spinnerNode = element;\n }}\n >\n {component !== undefined ? component : <Spinner type={type} caption={caption} />}\n </div>\n </span>\n );\n }\n\n private checkSpinnerPosition = () => {\n if (!this.spinnerContainerNode) {\n return;\n }\n\n const {\n top: containerTop,\n right: containerRight,\n bottom: containerBottom,\n left: containerLeft,\n height: containerHeight,\n width: containerWidth,\n } = getDOMRect(this.spinnerContainerNode);\n\n const windowHeight = window.innerHeight;\n const windowWidth = window.innerWidth;\n\n // Если контейнер не больше высоты и не шире окна,\n // то просто выравниваем по центру\n if (windowHeight >= containerHeight && windowWidth >= containerWidth) {\n this.setState({\n isStickySpinner: false,\n spinnerStyle: {},\n });\n return;\n }\n\n const spinnerStyle: {\n top?: number;\n right: number;\n bottom: number;\n left: number;\n } = {\n top: 30,\n right: 0,\n bottom: 30,\n left: 0,\n };\n\n // ПО ВЕРТИКАЛИ\n // Если верхний край контейнера ниже верхнего края окна,\n // то сдвигаем и лоадер\n if (containerTop > 0) {\n spinnerStyle.top = containerTop + 30;\n }\n\n // Если нижний край контейнера выше нижнего края окна,\n // то сдвигаем и лоадер\n if (containerBottom < windowHeight) {\n spinnerStyle.bottom = Math.abs(windowHeight - containerBottom) + 30;\n }\n\n // Если знаем высоту спиннера и нижний край контейнера поднимается\n // выше отступа на высоту спиннера, то убираем верхнюю позицию лоадера\n\n const spinnerHeight = getDOMRect(this.spinnerNode).height;\n\n if (spinnerHeight && spinnerStyle.bottom >= windowHeight - spinnerHeight) {\n delete spinnerStyle.top;\n }\n\n // ПО ГОРИЗОНТАЛИ\n // Если левый край контейнера правее левого края окна,\n // то сдвигаем и лоадер\n if (containerLeft > 0) {\n spinnerStyle.left = containerLeft;\n }\n\n // Если правый край контейнера левее правого края окна,\n // то сдвигаем и лоадер\n if (containerRight < windowWidth) {\n spinnerStyle.right = windowWidth - containerRight;\n }\n\n this.setState({\n isStickySpinner: true,\n spinnerStyle,\n });\n };\n\n private disableChildrenFocus = () => {\n if (!this.childrenObserver) {\n this.makeObservable();\n }\n const tabbableElements = getTabbableElements(this.childrenContainerNode);\n tabbableElements.forEach((el) => {\n if (!el.hasAttribute('origin-tabindex')) {\n el.setAttribute('origin-tabindex', el.tabIndex.toString());\n }\n el.tabIndex = -1;\n });\n };\n\n private enableChildrenFocus = () => {\n this.makeUnobservable();\n // NOTE: NodeList doesn't support 'forEach' method in IE11 and other older browsers\n Array.from(document.querySelectorAll('[origin-tabindex]')).forEach((el) => {\n el.setAttribute('tabindex', el.getAttribute('origin-tabindex') ?? '0');\n el.removeAttribute('origin-tabindex');\n });\n };\n\n private makeObservable = () => {\n const target = this.childrenContainerNode;\n if (!target) {\n return;\n }\n const config = {\n childList: true,\n subtree: true,\n };\n const observer = new MutationObserver(this.disableChildrenFocus);\n observer.observe(target, config);\n this.childrenObserver = observer;\n };\n\n private makeUnobservable = () => {\n this.childrenObserver?.disconnect();\n this.childrenObserver = null;\n };\n}\n"]}

package/cjs/components/MenuHeader/MenuHeader.d.ts CHANGED Viewed

@@ -4,6 +4,9 @@ export interface MenuHeaderProps extends CommonProps {
     _enableIconPadding?: boolean;
     children: ReactNode;
 }
+export declare const MenuHeaderDataTids: {
+    readonly root: "MenuHeader__root";
+};
 /**
  * `Заголовок меню` используется для того, чтобы разделить `элементы меню` на категории в рамках одного меню.
  *

package/cjs/components/MenuHeader/MenuHeader.js CHANGED Viewed

@@ -1,4 +1,4 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.MenuHeader = MenuHeader;exports.isMenuHeader = void 0;var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _react = _interopRequireWildcard(require("react"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.MenuHeader = MenuHeader;exports.isMenuHeader = exports.MenuHeaderDataTids = void 0;var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _react = _interopRequireWildcard(require("react"));
 var _ThemeContext = require("../../lib/theming/ThemeContext");
 var _CommonWrapper = require("../../internal/CommonWrapper");
@@ -11,19 +11,24 @@ var _MenuHeader = require("./MenuHeader.styles");var _excluded = ["_enableIconPa
+var MenuHeaderDataTids = {
+  root: 'MenuHeader__root' };
 /**
  * `Заголовок меню` используется для того, чтобы разделить `элементы меню` на категории в рамках одного меню.
  *
  * _Примечание_: `заголовок меню`, в отличие от `элемента меню` нельзя затаргетить с клавиатуры.
  *
  * Сущности в которых может быть использован `MenuHeader`: [`DropdownMenu`](#/Components/DropdownMenu), [`Kebab`](#/Components/Kebab), [`TooltipMenu`](#/Components/TooltipMenu) и [`Select`](#/Components/Select).
- */
+ */exports.MenuHeaderDataTids = MenuHeaderDataTids;
 function MenuHeader(_ref) {var _cx;var _ref$_enableIconPaddi = _ref._enableIconPadding,_enableIconPadding = _ref$_enableIconPaddi === void 0 ? false : _ref$_enableIconPaddi,children = _ref.children,rest = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded);
   var theme = (0, _react.useContext)(_ThemeContext.ThemeContext);
   return /*#__PURE__*/(
     _react.default.createElement(_CommonWrapper.CommonWrapper, rest, /*#__PURE__*/
     _react.default.createElement("div", {
+      "data-tid": MenuHeaderDataTids.root,
       className: (0, _Emotion.cx)((_cx = {}, _cx[
       _MenuHeader.styles.root(theme)] = true, _cx[
       _MenuHeader.styles.withLeftPadding(theme)] = _enableIconPadding, _cx)) },

package/cjs/components/MenuHeader/MenuHeader.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["MenuHeader.tsx"],"names":["MenuHeader","_enableIconPadding","children","rest","theme","ThemeContext","styles","~~root","~~withLeftPadding","__KONTUR_REACT_UI__","__MENU_HEADER__","isMenuHeader","child","isValidElement","Object","prototype","hasOwnProperty","call","type"],"mappings":"~~sTAAA~~;;AAEA;AACA;AACA;;AAEA,iD;;;;;;;~~AAOA~~;AACA;AACA;AACA;AACA;AACA;AACA;AACA,~~SAASA~~,UAAT,OAAwF,0CAAlEC,kBAAkE,CAAlEA,kBAAkE,sCAA7C,KAA6C,yBAAtCC,QAAsC,QAAtCA,QAAsC,CAAzBC,IAAyB;AACtF,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;;AAEA;AACE,iCAAC,4BAAD,EAAmBF,IAAnB;AACE;AACE,MAAA,SAAS,EAAE;~~AACRG~~,~~yBAAOC~~,IAAP,~~CAAYH~~,KAAZ,CADQ,IACa,IADb;AAERE,~~yBAAOE~~,eAAP,~~CAAuBJ~~,KAAvB,CAFQ,IAEwBH,kBAFxB,~~OADb~~;;;~~AAMGC~~,IAAAA,~~QANH~~,CADF,CADF;;;;~~AAYD~~;;AAEDF,UAAU,~~CAACS~~,mBAAX,GAAiC,YAAjC;~~AACAT~~,UAAU,~~CAACU~~,eAAX,GAA6B,IAA7B;;;;AAIO,IAAMC,YAAY,GAAG,SAAfA,YAAe,CAACC,KAAD,EAA0E;AACpG,SAAO,4BAAMC,cAAN,CAAsCD,KAAtC;AACHE,EAAAA,MAAM,CAACC,SAAP,CAAiBC,cAAjB,CAAgCC,IAAhC,CAAqCL,KAAK,CAACM,IAA3C,EAAiD,iBAAjD,CADG;AAEH,OAFJ;AAGD,CAJM,C","sourcesContent":["import React, { ReactNode, useContext } from 'react';\n\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\n\nimport { styles } from './MenuHeader.styles';\n\nexport interface MenuHeaderProps extends CommonProps {\n _enableIconPadding?: boolean;\n children: ReactNode;\n}\n\n/*\n `Заголовок меню` используется для того, чтобы разделить `элементы меню` на категории в рамках одного меню.\n \n _Примечание_: `заголовок меню`, в отличие от `элемента меню` нельзя затаргетить с клавиатуры.\n \n Сущности в которых может быть использован `MenuHeader`: [`DropdownMenu`](#/Components/DropdownMenu), [`Kebab`](#/Components/Kebab), [`TooltipMenu`](#/Components/TooltipMenu) и [`Select`](#/Components/Select).\n */\nfunction MenuHeader({ _enableIconPadding = false, children, ...rest }: MenuHeaderProps) {\n const theme = useContext(ThemeContext);\n\n return (\n <CommonWrapper {...rest}>\n <div\n className={cx({\n [styles.root(theme)]: true,\n [styles.withLeftPadding(theme)]: _enableIconPadding,\n })}\n >\n {children}\n </div>\n </CommonWrapper>\n );\n}\n\nMenuHeader.__KONTUR_REACT_UI__ = 'MenuHeader';\nMenuHeader.__MENU_HEADER__ = true;\n\nexport { MenuHeader };\n\nexport const isMenuHeader = (child: React.ReactNode): child is React.ReactElement<MenuHeaderProps> => {\n return React.isValidElement<MenuHeaderProps>(child)\n ? Object.prototype.hasOwnProperty.call(child.type, '__MENU_HEADER__')\n : false;\n};\n"]}
1	+ {"version":3,"sources":["MenuHeader.tsx"],"names":["MenuHeaderDataTids","root","MenuHeader","_enableIconPadding","children","rest","theme","ThemeContext","styles","withLeftPadding","__KONTUR_REACT_UI__","__MENU_HEADER__","isMenuHeader","child","isValidElement","Object","prototype","hasOwnProperty","call","type"],"mappings":"mVAAA;;AAEA;AACA;AACA;;AAEA,iD;;;;;;;AAOO,IAAMA,kBAAkB,GAAG;AAChCC,EAAAA,IAAI,EAAE,kBAD0B,EAA3B;;;AAIP;AACA;AACA;AACA;AACA;AACA;AACA,G;AACA,SAASC,UAAT,OAAwF,0CAAlEC,kBAAkE,CAAlEA,kBAAkE,sCAA7C,KAA6C,yBAAtCC,QAAsC,QAAtCA,QAAsC,CAAzBC,IAAyB;AACtF,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;;AAEA;AACE,iCAAC,4BAAD,EAAmBF,IAAnB;AACE;AACE,kBAAUL,kBAAkB,CAACC,IAD/B;AAEE,MAAA,SAAS,EAAE;AACRO,yBAAOP,IAAP,CAAYK,KAAZ,CADQ,IACa,IADb;AAERE,yBAAOC,eAAP,CAAuBH,KAAvB,CAFQ,IAEwBH,kBAFxB,OAFb;;;AAOGC,IAAAA,QAPH,CADF,CADF;;;;AAaD;;AAEDF,UAAU,CAACQ,mBAAX,GAAiC,YAAjC;AACAR,UAAU,CAACS,eAAX,GAA6B,IAA7B;;;;AAIO,IAAMC,YAAY,GAAG,SAAfA,YAAe,CAACC,KAAD,EAA0E;AACpG,SAAO,4BAAMC,cAAN,CAAsCD,KAAtC;AACHE,EAAAA,MAAM,CAACC,SAAP,CAAiBC,cAAjB,CAAgCC,IAAhC,CAAqCL,KAAK,CAACM,IAA3C,EAAiD,iBAAjD,CADG;AAEH,OAFJ;AAGD,CAJM,C","sourcesContent":["import React, { ReactNode, useContext } from 'react';\n\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\n\nimport { styles } from './MenuHeader.styles';\n\nexport interface MenuHeaderProps extends CommonProps {\n _enableIconPadding?: boolean;\n children: ReactNode;\n}\n\nexport const MenuHeaderDataTids = {\n root: 'MenuHeader__root',\n} as const;\n\n/*\n `Заголовок меню` используется для того, чтобы разделить `элементы меню` на категории в рамках одного меню.\n \n _Примечание_: `заголовок меню`, в отличие от `элемента меню` нельзя затаргетить с клавиатуры.\n \n Сущности в которых может быть использован `MenuHeader`: [`DropdownMenu`](#/Components/DropdownMenu), [`Kebab`](#/Components/Kebab), [`TooltipMenu`](#/Components/TooltipMenu) и [`Select`](#/Components/Select).\n */\nfunction MenuHeader({ _enableIconPadding = false, children, ...rest }: MenuHeaderProps) {\n const theme = useContext(ThemeContext);\n\n return (\n <CommonWrapper {...rest}>\n <div\n data-tid={MenuHeaderDataTids.root}\n className={cx({\n [styles.root(theme)]: true,\n [styles.withLeftPadding(theme)]: _enableIconPadding,\n })}\n >\n {children}\n </div>\n </CommonWrapper>\n );\n}\n\nMenuHeader.__KONTUR_REACT_UI__ = 'MenuHeader';\nMenuHeader.__MENU_HEADER__ = true;\n\nexport { MenuHeader };\n\nexport const isMenuHeader = (child: React.ReactNode): child is React.ReactElement<MenuHeaderProps> => {\n return React.isValidElement<MenuHeaderProps>(child)\n ? Object.prototype.hasOwnProperty.call(child.type, '__MENU_HEADER__')\n : false;\n};\n"]}

package/cjs/components/MenuItem/MenuItem.d.ts CHANGED Viewed

@@ -64,6 +64,10 @@ export interface MenuItemProps extends CommonProps {
     component?: React.ComponentType<any>;
     isMobile?: boolean;
 }
+export declare const MenuItemDataTids: {
+    readonly root: "MenuItem__root";
+    readonly comment: "MenuItem__comment";
+};
 /**
  *
  * `MenuItem` - это вложенный компонент, задающий базовые стили для элемента меню и позволяющий навигироваться по элементам меню с помощью клавиатуры.

package/cjs/components/MenuItem/MenuItem.js CHANGED Viewed

@@ -1,4 +1,4 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.isMenuItem = exports.MenuItem = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.isMenuItem = exports.MenuItemDataTids = exports.MenuItem = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 var _propTypes = _interopRequireDefault(require("prop-types"));
 var _utils = require("../../lib/utils");
@@ -74,6 +74,11 @@ var _MenuItem = require("./MenuItem.styles");var _excluded = ["link", "comment",
+var MenuItemDataTids = {
+  root: 'MenuItem__root',
+  comment: 'MenuItem__comment' };
 /**
@@ -81,7 +86,7 @@ var _MenuItem = require("./MenuItem.styles");var _excluded = ["link", "comment",
  * `MenuItem` - это вложенный компонент, задающий базовые стили для элемента меню и позволяющий навигироваться по элементам меню с помощью клавиатуры.
  *
  * Сущности в которых может быть использован `MenuItem`: [`DropdownMenu`](#/Components/DropdownMenu), [`Kebab`](#/Components/Kebab), [`TooltipMenu`](#/Components/TooltipMenu) и [`Select`](#/Components/Select).
- */var
+ */exports.MenuItemDataTids = MenuItemDataTids;var
 MenuItem = (0, _rootNodeDecorator.rootNode)(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(MenuItem, _React$Component);function MenuItem() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
@@ -167,7 +172,8 @@ MenuItem = (0, _rootNodeDecorator.rootNode)(_class = (_temp = _class2 = /*#__PUR
       var Component = _this.getComponent();
       return /*#__PURE__*/(
-        _react.default.createElement(Component, (0, _extends2.default)({},
+        _react.default.createElement(Component, (0, _extends2.default)({
+          "data-tid": MenuItemDataTids.root },
         rest, {
           state: state,
           onMouseOver: _this.handleMouseEnterFix,
@@ -179,7 +185,7 @@ MenuItem = (0, _rootNodeDecorator.rootNode)(_class = (_temp = _class2 = /*#__PUR
         content,
         _this.props.comment && /*#__PURE__*/
         _react.default.createElement("div", {
-          "data-tid": "MenuItem__comment",
+          "data-tid": MenuItemDataTids.comment,
           className: (0, _Emotion.cx)((_cx2 = {}, _cx2[
           _MenuItem.styles.comment(_this.theme)] = true, _cx2[
           _MenuItem.styles.commentHover(_this.theme)] = hover, _cx2)) },

package/cjs/components/MenuItem/MenuItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["MenuItem.tsx"],"names":["MenuItem","rootNode","mouseEntered","renderMain","props","link","comment","icon","loose","state","_enableIconPadding","component","onMouseEnter","onMouseLeave","isMobile","rest","hover","disabled","iconElement","styles","theme","className","root","rootMobile","selected","withIcon","Boolean","children","content","Component","getComponent","handleMouseEnterFix","handleMouseLeave","commentHover","e","href","render","setRootNode","React","__KONTUR_REACT_UI__","__MENU_ITEM__","propTypes","PropTypes","node","bool","string","oneOfType","target","onClick","func","isMenuItem"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { isFunction, isReactUIComponent } from '../../lib/utils';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode/rootNodeDecorator';\n\nimport { styles } from './MenuItem.styles';\n\nexport type MenuItemState = null \| 'hover' \| 'selected' \| void;\n\nexport interface MenuItemProps extends CommonProps {\n /*\n @ignore\n /\n _enableIconPadding?: boolean;\n /\n Добавляет описание для элемента меню.\n /\n comment?: React.ReactNode;\n /\n Отключенное состояние.\n /\n disabled?: boolean;\n /\n Добавляет элементу меню иконку.\n /\n icon?: React.ReactElement<any>;\n /\n Меняет цвет текста на синий.\n /\n link?: boolean;\n /\n @ignore\n /\n loose?: boolean;\n /\n @ignore\n /\n state?: MenuItemState;\n /\n HTML-событие `onclick`.\n /\n onClick?: (event: React.SyntheticEvent<HTMLElement>) => void;\n /\n HTML-событие `mouseenter`.\n /\n onMouseEnter?: React.MouseEventHandler;\n /\n HTML-событие `mouseleave`.\n /\n onMouseLeave?: React.MouseEventHandler;\n children?: React.ReactNode \| ((state: MenuItemState) => React.ReactNode);\n /\n HTML-атрибут `target`.\n /\n target?: React.AnchorHTMLAttributes<HTMLAnchorElement>['target'];\n /\n HTML-атрибут `title`.\n /\n title?: React.AnchorHTMLAttributes<HTMLAnchorElement>['title'];\n /\n HTML-атрибут `href`.\n /\n href?: React.AnchorHTMLAttributes<HTMLAnchorElement>['href'];\n /\n Заменяет корневой элемент, на компонент переданный в проп.\n \n По умолчанию корневой элемент рендерится как `button`. <br />Если передан `href`, то вместо `button` рендерится `a`.\n /\n component?: React.ComponentType<any>;\n\n isMobile?: boolean;\n}\n\n/\n \n * `MenuItem` - это вложенный компонент, задающий базовые стили для элемента меню и позволяющий навигироваться по элементам меню с помощью клавиатуры.\n \n Сущности в которых может быть использован `MenuItem`: [`DropdownMenu`](#/Components/DropdownMenu), [`Kebab`](#/Components/Kebab), [`TooltipMenu`](#/Components/TooltipMenu) и [`Select`](#/Components/Select).\n */\n@rootNode\nexport class MenuItem extends React.Component<MenuItemProps> {\n public static __KONTUR_REACT_UI__ = 'MenuItem';\n public static __MENU_ITEM__ = true;\n\n public static propTypes = {\n comment: PropTypes.node,\n\n disabled: PropTypes.bool,\n\n href: PropTypes.string,\n\n icon: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n\n loose: PropTypes.bool,\n\n state: PropTypes.string,\n\n target: PropTypes.string,\n\n onClick: PropTypes.func,\n };\n\n private theme!: Theme;\n private mouseEntered = false;\n private setRootNode!: TSetRootNode;\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n {this.renderMain}\n </CommonWrapper>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain = (props: CommonWrapperRestProps<MenuItemProps>) => {\n const {\n link,\n comment,\n icon,\n loose,\n state,\n _enableIconPadding,\n component,\n onMouseEnter,\n onMouseLeave,\n isMobile,\n ...rest\n } = props;\n\n const hover = state === 'hover' && !this.props.disabled;\n\n let iconElement = null;\n if (icon) {\n iconElement = <div className={styles.icon(this.theme)}>{icon}</div>;\n }\n\n const className = cx({\n [styles.root(this.theme)]: true,\n [styles.rootMobile(this.theme)]: isMobile,\n [styles.loose()]: !!loose,\n [styles.hover(this.theme)]: hover,\n [styles.selected(this.theme)]: state === 'selected',\n [styles.link(this.theme)]: !!link,\n [styles.withIcon(this.theme)]: Boolean(iconElement) \|\| !!_enableIconPadding,\n [styles.disabled(this.theme)]: !!this.props.disabled,\n });\n\n const { children } = this.props;\n\n let content = children;\n if (isFunction(children)) {\n content = children(this.props.state);\n }\n\n const Component = this.getComponent();\n\n return (\n <Component\n {...rest}\n state={state}\n onMouseOver={this.handleMouseEnterFix}\n onMouseLeave={this.handleMouseLeave}\n className={className}\n tabIndex={-1}\n >\n {iconElement}\n {content}\n {this.props.comment && (\n <div\n data-tid=\"MenuItem__comment\"\n className={cx({\n [styles.comment(this.theme)]: true,\n [styles.commentHover(this.theme)]: hover,\n })}\n >\n {comment}\n </div>\n )}\n </Component>\n );\n };\n\n // https://github.com/facebook/react/issues/10109\n // Mouseenter event not triggered when cursor moves from disabled button\n private handleMouseEnterFix = (e: React.MouseEvent<HTMLElement>) => {\n if (!this.mouseEntered && this.props.onMouseEnter) {\n this.mouseEntered = true;\n this.props.onMouseEnter(e);\n }\n };\n\n private handleMouseLeave = (e: React.MouseEvent<HTMLElement>) => {\n this.mouseEntered = false;\n if (this.props.onMouseLeave) {\n this.props.onMouseLeave(e);\n }\n };\n\n private getComponent = () => {\n const { disabled, component, href } = this.props;\n\n if (disabled) {\n return 'button';\n }\n\n if (component) {\n return component;\n }\n\n if (href) {\n return 'a';\n }\n\n return 'button';\n };\n}\n\nexport const isMenuItem = isReactUIComponent('MenuItem');\n"]}
1	+ {"version":3,"sources":["MenuItem.tsx"],"names":["MenuItemDataTids","root","comment","MenuItem","rootNode","mouseEntered","renderMain","props","link","icon","loose","state","_enableIconPadding","component","onMouseEnter","onMouseLeave","isMobile","rest","hover","disabled","iconElement","styles","theme","className","rootMobile","selected","withIcon","Boolean","children","content","Component","getComponent","handleMouseEnterFix","handleMouseLeave","commentHover","e","href","render","setRootNode","React","__KONTUR_REACT_UI__","__MENU_ITEM__","propTypes","PropTypes","node","bool","string","oneOfType","target","onClick","func","isMenuItem"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { isFunction, isReactUIComponent } from '../../lib/utils';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { CommonProps, CommonWrapper, CommonWrapperRestProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode/rootNodeDecorator';\n\nimport { styles } from './MenuItem.styles';\n\nexport type MenuItemState = null \| 'hover' \| 'selected' \| void;\n\nexport interface MenuItemProps extends CommonProps {\n /*\n @ignore\n /\n _enableIconPadding?: boolean;\n /\n Добавляет описание для элемента меню.\n /\n comment?: React.ReactNode;\n /\n Отключенное состояние.\n /\n disabled?: boolean;\n /\n Добавляет элементу меню иконку.\n /\n icon?: React.ReactElement<any>;\n /\n Меняет цвет текста на синий.\n /\n link?: boolean;\n /\n @ignore\n /\n loose?: boolean;\n /\n @ignore\n /\n state?: MenuItemState;\n /\n HTML-событие `onclick`.\n /\n onClick?: (event: React.SyntheticEvent<HTMLElement>) => void;\n /\n HTML-событие `mouseenter`.\n /\n onMouseEnter?: React.MouseEventHandler;\n /\n HTML-событие `mouseleave`.\n /\n onMouseLeave?: React.MouseEventHandler;\n children?: React.ReactNode \| ((state: MenuItemState) => React.ReactNode);\n /\n HTML-атрибут `target`.\n /\n target?: React.AnchorHTMLAttributes<HTMLAnchorElement>['target'];\n /\n HTML-атрибут `title`.\n /\n title?: React.AnchorHTMLAttributes<HTMLAnchorElement>['title'];\n /\n HTML-атрибут `href`.\n /\n href?: React.AnchorHTMLAttributes<HTMLAnchorElement>['href'];\n /\n Заменяет корневой элемент, на компонент переданный в проп.\n \n По умолчанию корневой элемент рендерится как `button`. <br />Если передан `href`, то вместо `button` рендерится `a`.\n /\n component?: React.ComponentType<any>;\n\n isMobile?: boolean;\n}\n\nexport const MenuItemDataTids = {\n root: 'MenuItem__root',\n comment: 'MenuItem__comment',\n} as const;\n\n/\n \n * `MenuItem` - это вложенный компонент, задающий базовые стили для элемента меню и позволяющий навигироваться по элементам меню с помощью клавиатуры.\n \n Сущности в которых может быть использован `MenuItem`: [`DropdownMenu`](#/Components/DropdownMenu), [`Kebab`](#/Components/Kebab), [`TooltipMenu`](#/Components/TooltipMenu) и [`Select`](#/Components/Select).\n */\n@rootNode\nexport class MenuItem extends React.Component<MenuItemProps> {\n public static __KONTUR_REACT_UI__ = 'MenuItem';\n public static __MENU_ITEM__ = true;\n\n public static propTypes = {\n comment: PropTypes.node,\n\n disabled: PropTypes.bool,\n\n href: PropTypes.string,\n\n icon: PropTypes.oneOfType([PropTypes.string, PropTypes.node]),\n\n loose: PropTypes.bool,\n\n state: PropTypes.string,\n\n target: PropTypes.string,\n\n onClick: PropTypes.func,\n };\n\n private theme!: Theme;\n private mouseEntered = false;\n private setRootNode!: TSetRootNode;\n\n public render() {\n return (\n <ThemeContext.Consumer>\n {(theme) => {\n this.theme = theme;\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n {this.renderMain}\n </CommonWrapper>\n );\n }}\n </ThemeContext.Consumer>\n );\n }\n\n private renderMain = (props: CommonWrapperRestProps<MenuItemProps>) => {\n const {\n link,\n comment,\n icon,\n loose,\n state,\n _enableIconPadding,\n component,\n onMouseEnter,\n onMouseLeave,\n isMobile,\n ...rest\n } = props;\n\n const hover = state === 'hover' && !this.props.disabled;\n\n let iconElement = null;\n if (icon) {\n iconElement = <div className={styles.icon(this.theme)}>{icon}</div>;\n }\n\n const className = cx({\n [styles.root(this.theme)]: true,\n [styles.rootMobile(this.theme)]: isMobile,\n [styles.loose()]: !!loose,\n [styles.hover(this.theme)]: hover,\n [styles.selected(this.theme)]: state === 'selected',\n [styles.link(this.theme)]: !!link,\n [styles.withIcon(this.theme)]: Boolean(iconElement) \|\| !!_enableIconPadding,\n [styles.disabled(this.theme)]: !!this.props.disabled,\n });\n\n const { children } = this.props;\n\n let content = children;\n if (isFunction(children)) {\n content = children(this.props.state);\n }\n\n const Component = this.getComponent();\n\n return (\n <Component\n data-tid={MenuItemDataTids.root}\n {...rest}\n state={state}\n onMouseOver={this.handleMouseEnterFix}\n onMouseLeave={this.handleMouseLeave}\n className={className}\n tabIndex={-1}\n >\n {iconElement}\n {content}\n {this.props.comment && (\n <div\n data-tid={MenuItemDataTids.comment}\n className={cx({\n [styles.comment(this.theme)]: true,\n [styles.commentHover(this.theme)]: hover,\n })}\n >\n {comment}\n </div>\n )}\n </Component>\n );\n };\n\n // https://github.com/facebook/react/issues/10109\n // Mouseenter event not triggered when cursor moves from disabled button\n private handleMouseEnterFix = (e: React.MouseEvent<HTMLElement>) => {\n if (!this.mouseEntered && this.props.onMouseEnter) {\n this.mouseEntered = true;\n this.props.onMouseEnter(e);\n }\n };\n\n private handleMouseLeave = (e: React.MouseEvent<HTMLElement>) => {\n this.mouseEntered = false;\n if (this.props.onMouseLeave) {\n this.props.onMouseLeave(e);\n }\n };\n\n private getComponent = () => {\n const { disabled, component, href } = this.props;\n\n if (disabled) {\n return 'button';\n }\n\n if (component) {\n return component;\n }\n\n if (href) {\n return 'a';\n }\n\n return 'button';\n };\n}\n\nexport const isMenuItem = isReactUIComponent('MenuItem');\n"]}

package/cjs/components/MenuSeparator/MenuSeparator.d.ts CHANGED Viewed

@@ -1,5 +1,8 @@
 import { CommonProps } from '../../internal/CommonWrapper';
 export declare type MenuSeparatorProps = CommonProps;
+export declare const MenuSeparatorDataTids: {
+    readonly root: "MenuSeparator__root";
+};
 /**
  * Добавляет разделительную линию между элементами меню.
  *

package/cjs/components/MenuSeparator/MenuSeparator.js CHANGED Viewed

@@ -1,4 +1,4 @@
-"use strict";exports.__esModule = true;exports.MenuSeparator = MenuSeparator;var _react = _interopRequireWildcard(require("react"));
+"use strict";exports.__esModule = true;exports.MenuSeparator = MenuSeparator;exports.MenuSeparatorDataTids = void 0;var _react = _interopRequireWildcard(require("react"));
 var _ThemeContext = require("../../lib/theming/ThemeContext");
 var _CommonWrapper = require("../../internal/CommonWrapper");
@@ -6,17 +6,21 @@ var _CommonWrapper = require("../../internal/CommonWrapper");
 var _MenuSeparator = require("./MenuSeparator.styles");function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || typeof obj !== "object" && typeof obj !== "function") {return { default: obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj.default = obj;if (cache) {cache.set(obj, newObj);}return newObj;}
+var MenuSeparatorDataTids = {
+  root: 'MenuSeparator__root' };
 /**
  * Добавляет разделительную линию между элементами меню.
  *
  * Сущности в которых может быть использован `MenuSeparator`: [`DropdownMenu`](#/Components/DropdownMenu), [`Kebab`](#/Components/Kebab), [`TooltipMenu`](#/Components/TooltipMenu) и [`Select`](#/Components/Select).
- */
+ */exports.MenuSeparatorDataTids = MenuSeparatorDataTids;
 function MenuSeparator(props) {
   var theme = (0, _react.useContext)(_ThemeContext.ThemeContext);
   return /*#__PURE__*/(
     _react.default.createElement(_CommonWrapper.CommonWrapper, props, /*#__PURE__*/
-    _react.default.createElement("div", { className: _MenuSeparator.styles.root(theme) })));
+    _react.default.createElement("div", { "data-tid": MenuSeparatorDataTids.root, className: _MenuSeparator.styles.root(theme) })));
 }

package/cjs/components/MenuSeparator/MenuSeparator.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["MenuSeparator.tsx"],"names":["MenuSeparator","props","theme","ThemeContext","styles","~~root","~~__KONTUR_REACT_UI__"],"mappings":"~~6EAAA~~;;AAEA;AACA;;AAEA,uD~~;;;AAGA~~;AACA;AACA;AACA;AACA;AACA,~~SAASA~~,aAAT,CAAuBC,KAAvB,EAAkD;AAChD,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;;AAEA;AACE,iCAAC,4BAAD,EAAmBF,KAAnB;AACE,0CAAK,SAAS,~~EAAEG~~,~~sBAAOC~~,IAAP,~~CAAYH~~,KAAZ,~~CAAhB~~,GADF,CADF;;;AAKD;;AAEDF,aAAa,~~CAACM~~,mBAAd,GAAoC,eAApC","sourcesContent":["import React, { useContext } from 'react';\n\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\n\nimport { styles } from './MenuSeparator.styles';\n\nexport type MenuSeparatorProps = CommonProps;\n/*\n Добавляет разделительную линию между элементами меню.\n \n Сущности в которых может быть использован `MenuSeparator`: [`DropdownMenu`](#/Components/DropdownMenu), [`Kebab`](#/Components/Kebab), [`TooltipMenu`](#/Components/TooltipMenu) и [`Select`](#/Components/Select).\n */\nfunction MenuSeparator(props: MenuSeparatorProps) {\n const theme = useContext(ThemeContext);\n\n return (\n <CommonWrapper {...props}>\n <div className={styles.root(theme)} />\n </CommonWrapper>\n );\n}\n\nMenuSeparator.__KONTUR_REACT_UI__ = 'MenuSeparator';\n\nexport { MenuSeparator };\n"]}
1	+ {"version":3,"sources":["MenuSeparator.tsx"],"names":["MenuSeparatorDataTids","root","MenuSeparator","props","theme","ThemeContext","styles","__KONTUR_REACT_UI__"],"mappings":"oHAAA;;AAEA;AACA;;AAEA,uD;;;;AAIO,IAAMA,qBAAqB,GAAG;AACnCC,EAAAA,IAAI,EAAE,qBAD6B,EAA9B;;AAGP;AACA;AACA;AACA;AACA,G;AACA,SAASC,aAAT,CAAuBC,KAAvB,EAAkD;AAChD,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;;AAEA;AACE,iCAAC,4BAAD,EAAmBF,KAAnB;AACE,0CAAK,YAAUH,qBAAqB,CAACC,IAArC,EAA2C,SAAS,EAAEK,sBAAOL,IAAP,CAAYG,KAAZ,CAAtD,GADF,CADF;;;AAKD;;AAEDF,aAAa,CAACK,mBAAd,GAAoC,eAApC","sourcesContent":["import React, { useContext } from 'react';\n\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { CommonProps, CommonWrapper } from '../../internal/CommonWrapper';\n\nimport { styles } from './MenuSeparator.styles';\n\nexport type MenuSeparatorProps = CommonProps;\n\nexport const MenuSeparatorDataTids = {\n root: 'MenuSeparator__root',\n} as const;\n/*\n Добавляет разделительную линию между элементами меню.\n \n Сущности в которых может быть использован `MenuSeparator`: [`DropdownMenu`](#/Components/DropdownMenu), [`Kebab`](#/Components/Kebab), [`TooltipMenu`](#/Components/TooltipMenu) и [`Select`](#/Components/Select).\n */\nfunction MenuSeparator(props: MenuSeparatorProps) {\n const theme = useContext(ThemeContext);\n\n return (\n <CommonWrapper {...props}>\n <div data-tid={MenuSeparatorDataTids.root} className={styles.root(theme)} />\n </CommonWrapper>\n );\n}\n\nMenuSeparator.__KONTUR_REACT_UI__ = 'MenuSeparator';\n\nexport { MenuSeparator };\n"]}

package/cjs/components/Modal/Modal.d.ts CHANGED Viewed

@@ -40,6 +40,11 @@ export interface ModalState {
     hasFooter: boolean;
     hasPanel: boolean;
 }
+export declare const ModalDataTids: {
+    readonly container: "modal-container";
+    readonly content: "modal-content";
+    readonly close: "modal-close";
+};
 /**
  * Модальное окно
  *

package/cjs/components/Modal/Modal.js CHANGED Viewed

@@ -1,4 +1,4 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.Modal = void 0;var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");exports.__esModule = true;exports.ModalDataTids = exports.Modal = void 0;var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
 var _reactFocusLock = _interopRequireDefault(require("react-focus-lock"));
 var _lodash = _interopRequireDefault(require("lodash.throttle"));
@@ -69,6 +69,12 @@ var mountedModalsCount = 0;
+var ModalDataTids = {
+  container: 'modal-container',
+  content: 'modal-content',
+  close: 'modal-close' };
 /**
@@ -84,7 +90,7 @@ var mountedModalsCount = 0;
  * в соответствующий компонент нужно передать
  * проп **sticky** со значением **false**
  * (по-умолчанию прилипание включено)
- */var
+ */exports.ModalDataTids = ModalDataTids;var
 Modal = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(Modal, _React$Component);function Modal() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
@@ -333,5 +339,5 @@ Modal = /*#__PURE__*/function (_React$Component) {(0, _inheritsLoose2.default)(M
     setHasPanel = function (hasPanel) {if (hasPanel === void 0) {hasPanel = false;}
       _this.state.hasPanel !== hasPanel && _this.setState({ hasPanel: hasPanel });
-    };return _this;}var _proto = Modal.prototype;_proto.componentDidMount = function componentDidMount() {this.stackSubscription = _ModalStack.ModalStack.add(this, this.handleStackChange);if (mountedModalsCount === 0) {window.addEventListener('resize', this.throttledCheckHorizontalScroll);}mountedModalsCount++;window.addEventListener('keydown', this.handleKeyDown);this.checkHorizontalScrollAppearance();if (this.containerNode) {this.containerNode.addEventListener('scroll', LayoutEvents.emit);}};_proto.componentWillUnmount = function componentWillUnmount() {if (--mountedModalsCount === 0) {window.removeEventListener('resize', this.throttledCheckHorizontalScroll);LayoutEvents.emit();}window.removeEventListener('keydown', this.handleKeyDown);if ((0, _utils.isNonNullable)(this.stackSubscription)) {this.stackSubscription.remove();}_ModalStack.ModalStack.remove(this);if (this.containerNode) {this.containerNode.removeEventListener('scroll', LayoutEvents.emit);}};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {var _this3 = this;var _this$state = this.state,hasHeader = _this$state.hasHeader,hasFooter = _this$state.hasFooter,hasPanel = _this$state.hasPanel;var modalContextProps = { hasHeader: hasHeader, horizontalScroll: this.state.horizontalScroll, setHasHeader: this.setHasHeader, setHasFooter: this.setHasFooter, setHasPanel: this.setHasPanel };if (!this.props.noClose) {modalContextProps.close = { disableClose: this.props.disableClose, requestClose: this.requestClose };}if (!hasFooter) {modalContextProps.additionalPadding = true;}if (hasFooter && hasPanel) {modalContextProps.additionalPadding = true;}var style = {};var containerStyle = {};if (this.props.width) {style.width = this.props.width;} else {containerStyle.width = 'auto';}return /*#__PURE__*/_react.default.createElement(_RenderContainer.RenderContainer, null, /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, this.props, /*#__PURE__*/_react.default.createElement(_ZIndex.ZIndex, { priority: 'Modal', className: _Modal.styles.root() }, /*#__PURE__*/_react.default.createElement(_HideBodyVerticalScroll.HideBodyVerticalScroll, null), this.state.hasBackground && /*#__PURE__*/_react.default.createElement("div", { className: _Modal.styles.bg(this.theme) }), /*#__PURE__*/_react.default.createElement("div", { ref: this.refContainer, className: _Modal.styles.container(), onMouseDown: this.handleContainerMouseDown, onMouseUp: this.handleContainerMouseUp, onClick: this.handleContainerClick, "data-tid": "modal-container" }, /*#__PURE__*/_react.default.createElement(_ResponsiveLayout.ResponsiveLayout, null, function (_ref) {var _cx, _cx2, _cx3, _cx4, _cx5;var isMobile = _ref.isMobile;return /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)((_cx = {}, _cx[_Modal.styles.centerContainer(_this3.theme)] = true, _cx[_Modal.styles.mobileCenterContainer()] = isMobile, _cx[_Modal.styles.alignTop()] = Boolean(_this3.props.alignTop), _cx)), style: isMobile ? undefined : containerStyle, "data-tid": "modal-content" }, /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)((_cx2 = {}, _cx2[_Modal.styles.window(_this3.theme)] = true, _cx2[_Modal.styles.mobileWindow()] = isMobile, _cx2)), style: isMobile ? undefined : style }, /*#__PURE__*/_react.default.createElement(_ResizeDetector.ResizeDetector, { onResize: _this3.handleResize, fullHeight: isMobile }, /*#__PURE__*/_react.default.createElement(_reactFocusLock.default, { disabled: _this3.props.disableFocusLock, autoFocus: false, className: (0, _Emotion.cx)((_cx3 = {}, _cx3[_Modal.styles.columnFlexContainer()] = isMobile, _cx3), 'focus-lock-container') }, !hasHeader && !_this3.props.noClose && /*#__PURE__*/_react.default.createElement(_ZIndex.ZIndex, { priority: 'ModalCross', className: (0, _Emotion.cx)((_cx4 = {}, _cx4[_Modal.styles.closeWrapper(_this3.theme)] = true, _cx4[_Modal.styles.mobileCloseWrapper(_this3.theme)] = isMobile, _cx4)) }, /*#__PURE__*/_react.default.createElement(_ModalClose.ModalClose, { className: (0, _Emotion.cx)((_cx5 = {}, _cx5[_Modal.styles.mobileCloseWithoutHeader()] = isMobile && !_this3.state.hasHeader, _cx5)), requestClose: _this3.requestClose, disableClose: _this3.props.disableClose })), /*#__PURE__*/_react.default.createElement(_ModalContext.ModalContext.Provider, { value: modalContextProps }, _this3.props.children)))));})))));};return Modal;}(_react.default.Component);exports.Modal = Modal;Modal.__KONTUR_REACT_UI__ = 'Modal';Modal.Header = _ModalHeader.ModalHeader;Modal.Body = _ModalBody.ModalBody;Modal.Footer = _ModalFooter.ModalFooter;Modal.defaultProps = { // NOTE: в ie нормально не работает
+    };return _this;}var _proto = Modal.prototype;_proto.componentDidMount = function componentDidMount() {this.stackSubscription = _ModalStack.ModalStack.add(this, this.handleStackChange);if (mountedModalsCount === 0) {window.addEventListener('resize', this.throttledCheckHorizontalScroll);}mountedModalsCount++;window.addEventListener('keydown', this.handleKeyDown);this.checkHorizontalScrollAppearance();if (this.containerNode) {this.containerNode.addEventListener('scroll', LayoutEvents.emit);}};_proto.componentWillUnmount = function componentWillUnmount() {if (--mountedModalsCount === 0) {window.removeEventListener('resize', this.throttledCheckHorizontalScroll);LayoutEvents.emit();}window.removeEventListener('keydown', this.handleKeyDown);if ((0, _utils.isNonNullable)(this.stackSubscription)) {this.stackSubscription.remove();}_ModalStack.ModalStack.remove(this);if (this.containerNode) {this.containerNode.removeEventListener('scroll', LayoutEvents.emit);}};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});};_proto.renderMain = function renderMain() {var _this3 = this;var _this$state = this.state,hasHeader = _this$state.hasHeader,hasFooter = _this$state.hasFooter,hasPanel = _this$state.hasPanel;var modalContextProps = { hasHeader: hasHeader, horizontalScroll: this.state.horizontalScroll, setHasHeader: this.setHasHeader, setHasFooter: this.setHasFooter, setHasPanel: this.setHasPanel };if (!this.props.noClose) {modalContextProps.close = { disableClose: this.props.disableClose, requestClose: this.requestClose };}if (!hasFooter) {modalContextProps.additionalPadding = true;}if (hasFooter && hasPanel) {modalContextProps.additionalPadding = true;}var style = {};var containerStyle = {};if (this.props.width) {style.width = this.props.width;} else {containerStyle.width = 'auto';}return /*#__PURE__*/_react.default.createElement(_RenderContainer.RenderContainer, null, /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, this.props, /*#__PURE__*/_react.default.createElement(_ZIndex.ZIndex, { priority: 'Modal', className: _Modal.styles.root() }, /*#__PURE__*/_react.default.createElement(_HideBodyVerticalScroll.HideBodyVerticalScroll, null), this.state.hasBackground && /*#__PURE__*/_react.default.createElement("div", { className: _Modal.styles.bg(this.theme) }), /*#__PURE__*/_react.default.createElement("div", { ref: this.refContainer, className: _Modal.styles.container(), onMouseDown: this.handleContainerMouseDown, onMouseUp: this.handleContainerMouseUp, onClick: this.handleContainerClick, "data-tid": ModalDataTids.container }, /*#__PURE__*/_react.default.createElement(_ResponsiveLayout.ResponsiveLayout, null, function (_ref) {var _cx, _cx2, _cx3, _cx4, _cx5;var isMobile = _ref.isMobile;return /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)((_cx = {}, _cx[_Modal.styles.centerContainer(_this3.theme)] = true, _cx[_Modal.styles.mobileCenterContainer()] = isMobile, _cx[_Modal.styles.alignTop()] = Boolean(_this3.props.alignTop), _cx)), style: isMobile ? undefined : containerStyle, "data-tid": ModalDataTids.content }, /*#__PURE__*/_react.default.createElement("div", { className: (0, _Emotion.cx)((_cx2 = {}, _cx2[_Modal.styles.window(_this3.theme)] = true, _cx2[_Modal.styles.mobileWindow()] = isMobile, _cx2)), style: isMobile ? undefined : style }, /*#__PURE__*/_react.default.createElement(_ResizeDetector.ResizeDetector, { onResize: _this3.handleResize, fullHeight: isMobile }, /*#__PURE__*/_react.default.createElement(_reactFocusLock.default, { disabled: _this3.props.disableFocusLock, autoFocus: false, className: (0, _Emotion.cx)((_cx3 = {}, _cx3[_Modal.styles.columnFlexContainer()] = isMobile, _cx3), 'focus-lock-container') }, !hasHeader && !_this3.props.noClose && /*#__PURE__*/_react.default.createElement(_ZIndex.ZIndex, { priority: 'ModalCross', className: (0, _Emotion.cx)((_cx4 = {}, _cx4[_Modal.styles.closeWrapper(_this3.theme)] = true, _cx4[_Modal.styles.mobileCloseWrapper(_this3.theme)] = isMobile, _cx4)) }, /*#__PURE__*/_react.default.createElement(_ModalClose.ModalClose, { className: (0, _Emotion.cx)((_cx5 = {}, _cx5[_Modal.styles.mobileCloseWithoutHeader()] = isMobile && !_this3.state.hasHeader, _cx5)), requestClose: _this3.requestClose, disableClose: _this3.props.disableClose })), /*#__PURE__*/_react.default.createElement(_ModalContext.ModalContext.Provider, { value: modalContextProps }, _this3.props.children)))));})))));};return Modal;}(_react.default.Component);exports.Modal = Modal;Modal.__KONTUR_REACT_UI__ = 'Modal';Modal.Header = _ModalHeader.ModalHeader;Modal.Body = _ModalBody.ModalBody;Modal.Footer = _ModalFooter.ModalFooter;Modal.defaultProps = { // NOTE: в ie нормально не работает
   disableFocusLock: _client.isIE11 };

package/cjs/components/Modal/Modal.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["Modal.tsx"],"names":["mountedModalsCount","Modal","state","stackPosition","hasBackground","horizontalScroll","hasHeader","hasFooter","hasPanel","stackSubscription","containerNode","mouseDownTarget","mouseUpTarget","requestClose","props","disableClose","onClose","refContainer","center","handleStackChange","stack","setState","indexOf","ModalStack","isBlocking","handleContainerMouseDown","event","target","handleContainerMouseUp","handleContainerClick","ignoreBackgroundClick","currentTarget","handleKeyDown","e","checkHorizontalScrollAppearance","hasScroll","containerClientWidth","clientWidth","containerScrollWidth","scrollWidth","throttledCheckHorizontalScroll","handleResize","LayoutEvents","emit","setHasHeader","setHasFooter","setHasPanel","componentDidMount","add","window","addEventListener","componentWillUnmount","removeEventListener","remove","render","theme","renderMain","modalContextProps","noClose","close","additionalPadding","style","containerStyle","width","styles","root","bg","container","isMobile","centerContainer","mobileCenterContainer","alignTop","Boolean","undefined","mobileWindow","disableFocusLock","columnFlexContainer","closeWrapper","mobileCloseWrapper","mobileCloseWithoutHeader","children","React","Component","__KONTUR_REACT_UI__","Header","ModalHeader","Body","ModalBody","Footer","ModalFooter","defaultProps","isIE11"],"mappings":"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","sourcesContent":["import React from 'react';\nimport FocusLock from 'react-focus-lock';\nimport throttle from 'lodash.throttle';\n\nimport { isNonNullable } from '../../lib/utils';\nimport { isKeyEscape } from '../../lib/events/keyboard/identifiers';\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { RenderContainer } from '../../internal/RenderContainer';\nimport { ZIndex } from '../../internal/ZIndex';\nimport { stopPropagation } from '../../lib/events/stopPropagation';\nimport { HideBodyVerticalScroll } from '../../internal/HideBodyVerticalScroll';\nimport { ModalStack, ModalStackSubscription } from '../../lib/ModalStack';\nimport { ResizeDetector } from '../../internal/ResizeDetector';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { isIE11 } from '../../lib/client';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { ResponsiveLayout } from '../ResponsiveLayout';\n\nimport { ModalContext, ModalContextProps } from './ModalContext';\nimport { ModalFooter } from './ModalFooter';\nimport { ModalHeader } from './ModalHeader';\nimport { ModalBody } from './ModalBody';\nimport { ModalClose } from './ModalClose';\nimport { styles } from './Modal.styles';\n\nlet mountedModalsCount = 0;\n\nexport interface ModalProps extends CommonProps {\n /*\n Отключает событие onClose, также дизейблит кнопку закрытия модалки\n /\n disableClose?: boolean;\n\n /\n Выравнивание окна по верху страницы.\n /\n alignTop?: boolean;\n\n /\n Не закрывать окно при клике на фон.\n /\n ignoreBackgroundClick?: boolean;\n\n /\n Не показывать крестик для закрытия окна.\n /\n noClose?: boolean;\n width?: number \| string;\n\n /\n Вызывается, когда пользователь запросил закрытие окна (нажал на фон, на\n * Escape или на крестик).\n /\n onClose?: () => void;\n\n /\n Не использовать фокус-лок внутри модалки.\n * По умолчанию true для IE11.\n /\n disableFocusLock?: boolean;\n}\n\nexport interface ModalState {\n stackPosition: number;\n hasBackground: boolean;\n horizontalScroll: boolean;\n hasHeader: boolean;\n hasFooter: boolean;\n hasPanel: boolean;\n}\n\n/\n Модальное окно\n \n Содержит в себе три компоненты: Modal.Header,\n * Modal.Body и Modal.Footer\n \n Для отображения серой плашки в футере в компонент\n * Footer необходимо передать пропс panel\n \n Для отключения прилипания шапки и футера\n * в соответствующий компонент нужно передать\n * проп sticky со значением false\n * (по-умолчанию прилипание включено)\n */\nexport class Modal extends React.Component<ModalProps, ModalState> {\n public static __KONTUR_REACT_UI__ = 'Modal';\n\n public static Header = ModalHeader;\n public static Body = ModalBody;\n public static Footer = ModalFooter;\n\n public static defaultProps = {\n // NOTE: в ie нормально не работает\n disableFocusLock: isIE11,\n };\n\n public state: ModalState = {\n stackPosition: 0,\n hasBackground: true,\n horizontalScroll: false,\n hasHeader: false,\n hasFooter: false,\n hasPanel: false,\n };\n\n private theme!: Theme;\n private stackSubscription: ModalStackSubscription \| null = null;\n private containerNode: HTMLDivElement \| null = null;\n private mouseDownTarget: EventTarget \| null = null;\n private mouseUpTarget: EventTarget \| null = null;\n\n public componentDidMount() {\n this.stackSubscription = ModalStack.add(this, this.handleStackChange);\n\n if (mountedModalsCount === 0) {\n window.addEventListener('resize', this.throttledCheckHorizontalScroll);\n }\n\n mountedModalsCount++;\n window.addEventListener('keydown', this.handleKeyDown);\n this.checkHorizontalScrollAppearance();\n\n if (this.containerNode) {\n this.containerNode.addEventListener('scroll', LayoutEvents.emit);\n }\n }\n\n public componentWillUnmount() {\n if (--mountedModalsCount === 0) {\n window.removeEventListener('resize', this.throttledCheckHorizontalScroll);\n LayoutEvents.emit();\n }\n\n window.removeEventListener('keydown', this.handleKeyDown);\n if (isNonNullable(this.stackSubscription)) {\n this.stackSubscription.remove();\n }\n ModalStack.remove(this);\n\n if (this.containerNode) {\n this.containerNode.removeEventListener('scroll', LayoutEvents.emit);\n }\n }\n\n public render(): JSX.Element {\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 { hasHeader, hasFooter, hasPanel } = this.state;\n\n const modalContextProps: ModalContextProps = {\n hasHeader,\n horizontalScroll: this.state.horizontalScroll,\n setHasHeader: this.setHasHeader,\n setHasFooter: this.setHasFooter,\n setHasPanel: this.setHasPanel,\n };\n if (!this.props.noClose) {\n modalContextProps.close = {\n disableClose: this.props.disableClose,\n requestClose: this.requestClose,\n };\n }\n if (!hasFooter) {\n modalContextProps.additionalPadding = true;\n }\n if (hasFooter && hasPanel) {\n modalContextProps.additionalPadding = true;\n }\n\n const style: { width?: number \| string } = {};\n const containerStyle: { width?: number \| string } = {};\n\n if (this.props.width) {\n style.width = this.props.width;\n } else {\n containerStyle.width = 'auto';\n }\n\n return (\n <RenderContainer>\n <CommonWrapper {...this.props}>\n <ZIndex priority={'Modal'} className={styles.root()}>\n <HideBodyVerticalScroll />\n {this.state.hasBackground && <div className={styles.bg(this.theme)} />}\n <div\n ref={this.refContainer}\n className={styles.container()}\n onMouseDown={this.handleContainerMouseDown}\n onMouseUp={this.handleContainerMouseUp}\n onClick={this.handleContainerClick}\n data-tid=\"modal-container\"\n >\n <ResponsiveLayout>\n {({ isMobile }) => {\n return (\n <div\n className={cx({\n [styles.centerContainer(this.theme)]: true,\n [styles.mobileCenterContainer()]: isMobile,\n [styles.alignTop()]: Boolean(this.props.alignTop),\n })}\n style={isMobile ? undefined : containerStyle}\n data-tid=\"modal-content\"\n >\n <div\n className={cx({ [styles.window(this.theme)]: true, [styles.mobileWindow()]: isMobile })}\n style={isMobile ? undefined : style}\n >\n <ResizeDetector onResize={this.handleResize} fullHeight={isMobile}>\n <FocusLock\n disabled={this.props.disableFocusLock}\n autoFocus={false}\n className={cx({ [styles.columnFlexContainer()]: isMobile }, 'focus-lock-container')}\n >\n {!hasHeader && !this.props.noClose && (\n <ZIndex\n priority={'ModalCross'}\n className={cx({\n [styles.closeWrapper(this.theme)]: true,\n [styles.mobileCloseWrapper(this.theme)]: isMobile,\n })}\n >\n <ModalClose\n className={cx({\n [styles.mobileCloseWithoutHeader()]: isMobile && !this.state.hasHeader,\n })}\n requestClose={this.requestClose}\n disableClose={this.props.disableClose}\n />\n </ZIndex>\n )}\n <ModalContext.Provider value={modalContextProps}>\n {this.props.children}\n </ModalContext.Provider>\n </FocusLock>\n </ResizeDetector>\n </div>\n </div>\n );\n }}\n </ResponsiveLayout>\n </div>\n </ZIndex>\n </CommonWrapper>\n </RenderContainer>\n );\n }\n\n private requestClose = () => {\n if (this.props.disableClose) {\n return;\n }\n if (this.props.onClose) {\n this.props.onClose();\n }\n };\n\n private refContainer = (center: HTMLDivElement \| null) => {\n this.containerNode = center;\n };\n\n private handleStackChange = (stack: readonly React.Component[]) => {\n this.setState({ stackPosition: stack.indexOf(this), hasBackground: ModalStack.isBlocking(this) });\n };\n\n private handleContainerMouseDown = (event: React.MouseEvent) => {\n this.mouseDownTarget = event.target;\n };\n\n private handleContainerMouseUp = (event: React.MouseEvent) => {\n this.mouseUpTarget = event.target;\n };\n\n private handleContainerClick = (event: React.MouseEvent<HTMLDivElement>) => {\n if (!this.props.ignoreBackgroundClick) {\n const { target, currentTarget } = event;\n if (target === currentTarget && this.mouseDownTarget === currentTarget && this.mouseUpTarget === currentTarget) {\n this.requestClose();\n }\n }\n };\n\n private handleKeyDown = (e: KeyboardEvent) => {\n if (this.state.stackPosition !== 0) {\n return;\n }\n if (isKeyEscape(e)) {\n stopPropagation(e);\n this.requestClose();\n }\n };\n\n private checkHorizontalScrollAppearance = () => {\n let hasScroll = false;\n\n if (this.containerNode) {\n const containerClientWidth = this.containerNode.clientWidth;\n const containerScrollWidth = this.containerNode.scrollWidth;\n hasScroll = containerClientWidth < containerScrollWidth;\n }\n if (hasScroll && !this.state.horizontalScroll) {\n this.setState({ horizontalScroll: true });\n } else if (this.state.horizontalScroll) {\n this.setState({ horizontalScroll: false });\n }\n };\n\n private throttledCheckHorizontalScroll = throttle(this.checkHorizontalScrollAppearance, 100);\n\n private handleResize = (event: UIEvent) => {\n LayoutEvents.emit();\n };\n\n private setHasHeader = (hasHeader = true) => {\n this.state.hasHeader !== hasHeader && this.setState({ hasHeader });\n };\n\n private setHasFooter = (hasFooter = true) => {\n this.state.hasFooter !== hasFooter && this.setState({ hasFooter });\n };\n\n private setHasPanel = (hasPanel = false) => {\n this.state.hasPanel !== hasPanel && this.setState({ hasPanel });\n };\n}\n"]}
1	+ {"version":3,"sources":["Modal.tsx"],"names":["mountedModalsCount","ModalDataTids","container","content","close","Modal","state","stackPosition","hasBackground","horizontalScroll","hasHeader","hasFooter","hasPanel","stackSubscription","containerNode","mouseDownTarget","mouseUpTarget","requestClose","props","disableClose","onClose","refContainer","center","handleStackChange","stack","setState","indexOf","ModalStack","isBlocking","handleContainerMouseDown","event","target","handleContainerMouseUp","handleContainerClick","ignoreBackgroundClick","currentTarget","handleKeyDown","e","checkHorizontalScrollAppearance","hasScroll","containerClientWidth","clientWidth","containerScrollWidth","scrollWidth","throttledCheckHorizontalScroll","handleResize","LayoutEvents","emit","setHasHeader","setHasFooter","setHasPanel","componentDidMount","add","window","addEventListener","componentWillUnmount","removeEventListener","remove","render","theme","renderMain","modalContextProps","noClose","additionalPadding","style","containerStyle","width","styles","root","bg","isMobile","centerContainer","mobileCenterContainer","alignTop","Boolean","undefined","mobileWindow","disableFocusLock","columnFlexContainer","closeWrapper","mobileCloseWrapper","mobileCloseWithoutHeader","children","React","Component","__KONTUR_REACT_UI__","Header","ModalHeader","Body","ModalBody","Footer","ModalFooter","defaultProps","isIE11"],"mappings":"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","sourcesContent":["import React from 'react';\nimport FocusLock from 'react-focus-lock';\nimport throttle from 'lodash.throttle';\n\nimport { isNonNullable } from '../../lib/utils';\nimport { isKeyEscape } from '../../lib/events/keyboard/identifiers';\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { RenderContainer } from '../../internal/RenderContainer';\nimport { ZIndex } from '../../internal/ZIndex';\nimport { stopPropagation } from '../../lib/events/stopPropagation';\nimport { HideBodyVerticalScroll } from '../../internal/HideBodyVerticalScroll';\nimport { ModalStack, ModalStackSubscription } from '../../lib/ModalStack';\nimport { ResizeDetector } from '../../internal/ResizeDetector';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { Theme } from '../../lib/theming/Theme';\nimport { isIE11 } from '../../lib/client';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { ResponsiveLayout } from '../ResponsiveLayout';\n\nimport { ModalContext, ModalContextProps } from './ModalContext';\nimport { ModalFooter } from './ModalFooter';\nimport { ModalHeader } from './ModalHeader';\nimport { ModalBody } from './ModalBody';\nimport { ModalClose } from './ModalClose';\nimport { styles } from './Modal.styles';\n\nlet mountedModalsCount = 0;\n\nexport interface ModalProps extends CommonProps {\n /*\n Отключает событие onClose, также дизейблит кнопку закрытия модалки\n /\n disableClose?: boolean;\n\n /\n Выравнивание окна по верху страницы.\n /\n alignTop?: boolean;\n\n /\n Не закрывать окно при клике на фон.\n /\n ignoreBackgroundClick?: boolean;\n\n /\n Не показывать крестик для закрытия окна.\n /\n noClose?: boolean;\n width?: number \| string;\n\n /\n Вызывается, когда пользователь запросил закрытие окна (нажал на фон, на\n * Escape или на крестик).\n /\n onClose?: () => void;\n\n /\n Не использовать фокус-лок внутри модалки.\n * По умолчанию true для IE11.\n /\n disableFocusLock?: boolean;\n}\n\nexport interface ModalState {\n stackPosition: number;\n hasBackground: boolean;\n horizontalScroll: boolean;\n hasHeader: boolean;\n hasFooter: boolean;\n hasPanel: boolean;\n}\n\nexport const ModalDataTids = {\n container: 'modal-container',\n content: 'modal-content',\n close: 'modal-close',\n} as const;\n\n/\n Модальное окно\n \n Содержит в себе три компоненты: Modal.Header,\n * Modal.Body и Modal.Footer\n \n Для отображения серой плашки в футере в компонент\n * Footer необходимо передать пропс panel\n \n Для отключения прилипания шапки и футера\n * в соответствующий компонент нужно передать\n * проп sticky со значением false\n * (по-умолчанию прилипание включено)\n */\nexport class Modal extends React.Component<ModalProps, ModalState> {\n public static __KONTUR_REACT_UI__ = 'Modal';\n\n public static Header = ModalHeader;\n public static Body = ModalBody;\n public static Footer = ModalFooter;\n\n public static defaultProps = {\n // NOTE: в ie нормально не работает\n disableFocusLock: isIE11,\n };\n\n public state: ModalState = {\n stackPosition: 0,\n hasBackground: true,\n horizontalScroll: false,\n hasHeader: false,\n hasFooter: false,\n hasPanel: false,\n };\n\n private theme!: Theme;\n private stackSubscription: ModalStackSubscription \| null = null;\n private containerNode: HTMLDivElement \| null = null;\n private mouseDownTarget: EventTarget \| null = null;\n private mouseUpTarget: EventTarget \| null = null;\n\n public componentDidMount() {\n this.stackSubscription = ModalStack.add(this, this.handleStackChange);\n\n if (mountedModalsCount === 0) {\n window.addEventListener('resize', this.throttledCheckHorizontalScroll);\n }\n\n mountedModalsCount++;\n window.addEventListener('keydown', this.handleKeyDown);\n this.checkHorizontalScrollAppearance();\n\n if (this.containerNode) {\n this.containerNode.addEventListener('scroll', LayoutEvents.emit);\n }\n }\n\n public componentWillUnmount() {\n if (--mountedModalsCount === 0) {\n window.removeEventListener('resize', this.throttledCheckHorizontalScroll);\n LayoutEvents.emit();\n }\n\n window.removeEventListener('keydown', this.handleKeyDown);\n if (isNonNullable(this.stackSubscription)) {\n this.stackSubscription.remove();\n }\n ModalStack.remove(this);\n\n if (this.containerNode) {\n this.containerNode.removeEventListener('scroll', LayoutEvents.emit);\n }\n }\n\n public render(): JSX.Element {\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 { hasHeader, hasFooter, hasPanel } = this.state;\n\n const modalContextProps: ModalContextProps = {\n hasHeader,\n horizontalScroll: this.state.horizontalScroll,\n setHasHeader: this.setHasHeader,\n setHasFooter: this.setHasFooter,\n setHasPanel: this.setHasPanel,\n };\n if (!this.props.noClose) {\n modalContextProps.close = {\n disableClose: this.props.disableClose,\n requestClose: this.requestClose,\n };\n }\n if (!hasFooter) {\n modalContextProps.additionalPadding = true;\n }\n if (hasFooter && hasPanel) {\n modalContextProps.additionalPadding = true;\n }\n\n const style: { width?: number \| string } = {};\n const containerStyle: { width?: number \| string } = {};\n\n if (this.props.width) {\n style.width = this.props.width;\n } else {\n containerStyle.width = 'auto';\n }\n\n return (\n <RenderContainer>\n <CommonWrapper {...this.props}>\n <ZIndex priority={'Modal'} className={styles.root()}>\n <HideBodyVerticalScroll />\n {this.state.hasBackground && <div className={styles.bg(this.theme)} />}\n <div\n ref={this.refContainer}\n className={styles.container()}\n onMouseDown={this.handleContainerMouseDown}\n onMouseUp={this.handleContainerMouseUp}\n onClick={this.handleContainerClick}\n data-tid={ModalDataTids.container}\n >\n <ResponsiveLayout>\n {({ isMobile }) => {\n return (\n <div\n className={cx({\n [styles.centerContainer(this.theme)]: true,\n [styles.mobileCenterContainer()]: isMobile,\n [styles.alignTop()]: Boolean(this.props.alignTop),\n })}\n style={isMobile ? undefined : containerStyle}\n data-tid={ModalDataTids.content}\n >\n <div\n className={cx({ [styles.window(this.theme)]: true, [styles.mobileWindow()]: isMobile })}\n style={isMobile ? undefined : style}\n >\n <ResizeDetector onResize={this.handleResize} fullHeight={isMobile}>\n <FocusLock\n disabled={this.props.disableFocusLock}\n autoFocus={false}\n className={cx({ [styles.columnFlexContainer()]: isMobile }, 'focus-lock-container')}\n >\n {!hasHeader && !this.props.noClose && (\n <ZIndex\n priority={'ModalCross'}\n className={cx({\n [styles.closeWrapper(this.theme)]: true,\n [styles.mobileCloseWrapper(this.theme)]: isMobile,\n })}\n >\n <ModalClose\n className={cx({\n [styles.mobileCloseWithoutHeader()]: isMobile && !this.state.hasHeader,\n })}\n requestClose={this.requestClose}\n disableClose={this.props.disableClose}\n />\n </ZIndex>\n )}\n <ModalContext.Provider value={modalContextProps}>\n {this.props.children}\n </ModalContext.Provider>\n </FocusLock>\n </ResizeDetector>\n </div>\n </div>\n );\n }}\n </ResponsiveLayout>\n </div>\n </ZIndex>\n </CommonWrapper>\n </RenderContainer>\n );\n }\n\n private requestClose = () => {\n if (this.props.disableClose) {\n return;\n }\n if (this.props.onClose) {\n this.props.onClose();\n }\n };\n\n private refContainer = (center: HTMLDivElement \| null) => {\n this.containerNode = center;\n };\n\n private handleStackChange = (stack: readonly React.Component[]) => {\n this.setState({ stackPosition: stack.indexOf(this), hasBackground: ModalStack.isBlocking(this) });\n };\n\n private handleContainerMouseDown = (event: React.MouseEvent) => {\n this.mouseDownTarget = event.target;\n };\n\n private handleContainerMouseUp = (event: React.MouseEvent) => {\n this.mouseUpTarget = event.target;\n };\n\n private handleContainerClick = (event: React.MouseEvent<HTMLDivElement>) => {\n if (!this.props.ignoreBackgroundClick) {\n const { target, currentTarget } = event;\n if (target === currentTarget && this.mouseDownTarget === currentTarget && this.mouseUpTarget === currentTarget) {\n this.requestClose();\n }\n }\n };\n\n private handleKeyDown = (e: KeyboardEvent) => {\n if (this.state.stackPosition !== 0) {\n return;\n }\n if (isKeyEscape(e)) {\n stopPropagation(e);\n this.requestClose();\n }\n };\n\n private checkHorizontalScrollAppearance = () => {\n let hasScroll = false;\n\n if (this.containerNode) {\n const containerClientWidth = this.containerNode.clientWidth;\n const containerScrollWidth = this.containerNode.scrollWidth;\n hasScroll = containerClientWidth < containerScrollWidth;\n }\n if (hasScroll && !this.state.horizontalScroll) {\n this.setState({ horizontalScroll: true });\n } else if (this.state.horizontalScroll) {\n this.setState({ horizontalScroll: false });\n }\n };\n\n private throttledCheckHorizontalScroll = throttle(this.checkHorizontalScrollAppearance, 100);\n\n private handleResize = (event: UIEvent) => {\n LayoutEvents.emit();\n };\n\n private setHasHeader = (hasHeader = true) => {\n this.state.hasHeader !== hasHeader && this.setState({ hasHeader });\n };\n\n private setHasFooter = (hasFooter = true) => {\n this.state.hasFooter !== hasFooter && this.setState({ hasFooter });\n };\n\n private setHasPanel = (hasPanel = false) => {\n this.state.hasPanel !== hasPanel && this.setState({ hasPanel });\n };\n}\n"]}

package/cjs/components/Modal/ModalClose.js CHANGED Viewed

@@ -8,7 +8,8 @@ var _ResponsiveLayout = require("../ResponsiveLayout");
 var _CommonWrapper = require("../../internal/CommonWrapper");
-var _Modal = require("./Modal.styles");var _excluded = ["disableClose", "requestClose"];function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || typeof obj !== "object" && typeof obj !== "function") {return { default: obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj.default = obj;if (cache) {cache.set(obj, newObj);}return newObj;}
+var _Modal = require("./Modal.styles");
+var _Modal2 = require("./Modal");var _excluded = ["disableClose", "requestClose"];function _getRequireWildcardCache(nodeInterop) {if (typeof WeakMap !== "function") return null;var cacheBabelInterop = new WeakMap();var cacheNodeInterop = new WeakMap();return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) {return nodeInterop ? cacheNodeInterop : cacheBabelInterop;})(nodeInterop);}function _interopRequireWildcard(obj, nodeInterop) {if (!nodeInterop && obj && obj.__esModule) {return obj;}if (obj === null || typeof obj !== "object" && typeof obj !== "function") {return { default: obj };}var cache = _getRequireWildcardCache(nodeInterop);if (cache && cache.has(obj)) {return cache.get(obj);}var newObj = {};var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor;for (var key in obj) {if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) {var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null;if (desc && (desc.get || desc.set)) {Object.defineProperty(newObj, key, desc);} else {newObj[key] = obj[key];}}}newObj.default = obj;if (cache) {cache.set(obj, newObj);}return newObj;}
 function ModalClose(_ref) {var disableClose = _ref.disableClose,requestClose = _ref.requestClose,otherProps = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded);
   var theme = (0, _react.useContext)(_ThemeContext.ThemeContext);
@@ -42,7 +43,7 @@ function ModalClose(_ref) {var disableClose = _ref.disableClose,requestClose = _
           onClick: requestClose,
           onFocus: handleFocus,
           onBlur: handleBlur,
-          "data-tid": "modal-close",
+          "data-tid": _Modal2.ModalDataTids.close,
           tabIndex: disableClose ? -1 : 0 }, /*#__PURE__*/
         _react.default.createElement(_CrossIcon.CrossIcon, null)));})));

package/cjs/components/Modal/ModalClose.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["ModalClose.tsx"],"names":["ModalClose","disableClose","requestClose","otherProps","theme","ThemeContext","React","useState","focusedByTab","setFocusedByTab","handleFocus","requestAnimationFrame","keyListener","isTabPressed","handleBlur","isMobile","styles","close","mobileClose","disabled","focus"],"mappings":"wRAAA;;AAEA;AACA;AACA;AACA;AACA;AACA;;;AAGA,uC;;AAEO,SAASA,UAAT,OAA+E,KAAzDC,YAAyD,QAAzDA,YAAyD,CAA3CC,YAA2C,QAA3CA,YAA2C,CAA1BC,UAA0B;AACpF,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,wBAAwCC,eAAMC,QAAN,CAAe,KAAf,CAAxC,CAAOC,YAAP,sBAAqBC,eAArB;;AAEA,MAAMC,WAAW,GAAG,SAAdA,WAAc,GAAM;AACxB;AACA;AACAC,IAAAA,qBAAqB,CAAC,YAAM;AAC1B,UAAIC,yBAAYC,YAAhB,EAA8B;AAC5BJ,QAAAA,eAAe,CAAC,IAAD,CAAf;AACD;AACF,KAJoB,CAArB;AAKD,GARD;;AAUA,MAAMK,UAAU,GAAG,SAAbA,UAAa,GAAM;AACvBL,IAAAA,eAAe,CAAC,KAAD,CAAf;AACD,GAFD;;AAIA;AACE,iCAAC,4BAAD,EAAmBN,UAAnB;AACE,iCAAC,kCAAD;AACG,kCAAGY,QAAH,SAAGA,QAAH;AACC;AACE,UAAA,SAAS,EAAE;AACRC,wBAAOC,KAAP,CAAab,KAAb,CADQ,IACc,IADd;AAERY,wBAAOE,WAAP,CAAmBd,KAAnB,CAFQ,IAEoBW,QAFpB;AAGRC,wBAAOG,QAAP,CAAgBf,KAAhB,CAHQ,IAGiBH,YAHjB;AAIRe,wBAAOI,KAAP,CAAahB,KAAb,CAJQ,IAIcI,YAJd,OADb;;AAOE,UAAA,OAAO,EAAEN,YAPX;AAQE,UAAA,OAAO,EAAEQ,WARX;AASE,UAAA,MAAM,EAAEI,UATV;AAUE,~~sBAAS~~,~~aAVX~~;AAWE,UAAA,QAAQ,~~EAAEb~~,YAAY,GAAG,CAAC,CAAJ,GAAQ,CAXhC;;AAaE,qCAAC,oBAAD,OAbF,CADD,GADH,CADF,CADF;;;;;;AAuBD","sourcesContent":["import React, { useContext } from 'react';\n\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { CrossIcon } from '../../internal/icons/CrossIcon';\nimport { cx } from '../../lib/theming/Emotion';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { ResponsiveLayout } from '../ResponsiveLayout';\nimport { CommonWrapper } from '../../internal/CommonWrapper';\n\nimport { CloseProps } from './ModalContext';\nimport { styles } from './Modal.styles';\n\nexport function ModalClose({ disableClose, requestClose, ...otherProps }: CloseProps) {\n const theme = useContext(ThemeContext);\n const [focusedByTab, setFocusedByTab] = React.useState(false);\n\n const handleFocus = () => {\n // focus event fires before keyDown eventlistener\n // so we should check tabPressed in async way\n requestAnimationFrame(() => {\n if (keyListener.isTabPressed) {\n setFocusedByTab(true);\n }\n });\n };\n\n const handleBlur = () => {\n setFocusedByTab(false);\n };\n\n return (\n <CommonWrapper {...otherProps}>\n <ResponsiveLayout>\n {({ isMobile }) => (\n <button\n className={cx({\n [styles.close(theme)]: true,\n [styles.mobileClose(theme)]: isMobile,\n [styles.disabled(theme)]: disableClose,\n [styles.focus(theme)]: focusedByTab,\n })}\n onClick={requestClose}\n onFocus={handleFocus}\n onBlur={handleBlur}\n data-tid~~=\"modal-~~close\"\n tabIndex={disableClose ? -1 : 0}\n >\n <CrossIcon />\n </button>\n )}\n </ResponsiveLayout>\n </CommonWrapper>\n );\n}\n"]}
1	+ {"version":3,"sources":["ModalClose.tsx"],"names":["ModalClose","disableClose","requestClose","otherProps","theme","ThemeContext","React","useState","focusedByTab","setFocusedByTab","handleFocus","requestAnimationFrame","keyListener","isTabPressed","handleBlur","isMobile","styles","close","mobileClose","disabled","focus","ModalDataTids"],"mappings":"wRAAA;;AAEA;AACA;AACA;AACA;AACA;AACA;;;AAGA;AACA,iC;;AAEO,SAASA,UAAT,OAA+E,KAAzDC,YAAyD,QAAzDA,YAAyD,CAA3CC,YAA2C,QAA3CA,YAA2C,CAA1BC,UAA0B;AACpF,MAAMC,KAAK,GAAG,uBAAWC,0BAAX,CAAd;AACA,wBAAwCC,eAAMC,QAAN,CAAe,KAAf,CAAxC,CAAOC,YAAP,sBAAqBC,eAArB;;AAEA,MAAMC,WAAW,GAAG,SAAdA,WAAc,GAAM;AACxB;AACA;AACAC,IAAAA,qBAAqB,CAAC,YAAM;AAC1B,UAAIC,yBAAYC,YAAhB,EAA8B;AAC5BJ,QAAAA,eAAe,CAAC,IAAD,CAAf;AACD;AACF,KAJoB,CAArB;AAKD,GARD;;AAUA,MAAMK,UAAU,GAAG,SAAbA,UAAa,GAAM;AACvBL,IAAAA,eAAe,CAAC,KAAD,CAAf;AACD,GAFD;;AAIA;AACE,iCAAC,4BAAD,EAAmBN,UAAnB;AACE,iCAAC,kCAAD;AACG,kCAAGY,QAAH,SAAGA,QAAH;AACC;AACE,UAAA,SAAS,EAAE;AACRC,wBAAOC,KAAP,CAAab,KAAb,CADQ,IACc,IADd;AAERY,wBAAOE,WAAP,CAAmBd,KAAnB,CAFQ,IAEoBW,QAFpB;AAGRC,wBAAOG,QAAP,CAAgBf,KAAhB,CAHQ,IAGiBH,YAHjB;AAIRe,wBAAOI,KAAP,CAAahB,KAAb,CAJQ,IAIcI,YAJd,OADb;;AAOE,UAAA,OAAO,EAAEN,YAPX;AAQE,UAAA,OAAO,EAAEQ,WARX;AASE,UAAA,MAAM,EAAEI,UATV;AAUE,sBAAUO,sBAAcJ,KAV1B;AAWE,UAAA,QAAQ,EAAEhB,YAAY,GAAG,CAAC,CAAJ,GAAQ,CAXhC;;AAaE,qCAAC,oBAAD,OAbF,CADD,GADH,CADF,CADF;;;;;;AAuBD","sourcesContent":["import React, { useContext } from 'react';\n\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { CrossIcon } from '../../internal/icons/CrossIcon';\nimport { cx } from '../../lib/theming/Emotion';\nimport { keyListener } from '../../lib/events/keyListener';\nimport { ResponsiveLayout } from '../ResponsiveLayout';\nimport { CommonWrapper } from '../../internal/CommonWrapper';\n\nimport { CloseProps } from './ModalContext';\nimport { styles } from './Modal.styles';\nimport { ModalDataTids } from './Modal';\n\nexport function ModalClose({ disableClose, requestClose, ...otherProps }: CloseProps) {\n const theme = useContext(ThemeContext);\n const [focusedByTab, setFocusedByTab] = React.useState(false);\n\n const handleFocus = () => {\n // focus event fires before keyDown eventlistener\n // so we should check tabPressed in async way\n requestAnimationFrame(() => {\n if (keyListener.isTabPressed) {\n setFocusedByTab(true);\n }\n });\n };\n\n const handleBlur = () => {\n setFocusedByTab(false);\n };\n\n return (\n <CommonWrapper {...otherProps}>\n <ResponsiveLayout>\n {({ isMobile }) => (\n <button\n className={cx({\n [styles.close(theme)]: true,\n [styles.mobileClose(theme)]: isMobile,\n [styles.disabled(theme)]: disableClose,\n [styles.focus(theme)]: focusedByTab,\n })}\n onClick={requestClose}\n onFocus={handleFocus}\n onBlur={handleBlur}\n data-tid={ModalDataTids.close}\n tabIndex={disableClose ? -1 : 0}\n >\n <CrossIcon />\n </button>\n )}\n </ResponsiveLayout>\n </CommonWrapper>\n );\n}\n"]}

package/cjs/components/Modal/ModalFooter.d.ts CHANGED Viewed

@@ -8,6 +8,9 @@ export interface ModalFooterProps extends CommonProps {
     sticky?: boolean;
     children?: ReactNode;
 }
+export declare const ModalFooterDataTids: {
+    readonly root: "ModalFooter__root";
+};
 /**
  * Футер модального окна.
  *