npm - @skbkontur/react-ui - Versions diffs - 0.0.0-bcbd5e6112 → 0.0.0-c13bb5f4ca - Mend

@skbkontur/react-ui 0.0.0-bcbd5e6112 → 0.0.0-c13bb5f4ca

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

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

	@@ -1 +1 @@
1	- {"version":3,"names":["_react","_interopRequireDefault","require","_invariant","_RenderEnvironmentContext","_utils","_Radio","_createPropsGetter","_FocusTrap","_CommonWrapper","_rootNode","_getVisualStateDataAttributes","_featureFlagsContext","_RadioGroup2","_Prevent","_RadioGroupContext","_class","_RadioGroup","RadioGroupDataTids","exports","root","RadioGroup","rootNode","_React$Component","props","_this","call","name","getRandomID","getProps","createPropsGetter","defaultProps","getRadioGroupContextValue","activeItem","getValue","onSelect","handleSelect","getName","disabled","error","warning","isControlled","value","state","isNonNullable","setState","onValueChange","renderRadio","itemValue","data","index","_this$cx","itemProps","key","getKeyByItem","className","cx","styles","item","itemFirst","itemInline","inline","default","createElement","_extends2","role","Radio","renderItem","toKey","undefined","ref","element","node","defaultValue","_inheritsLoose2","_proto","prototype","render","_this2","_this$props","width","onMouseLeave","onMouseOver","onMouseEnter","onBlur","ariaDescribedby","style","handlers","ReactUIFeatureFlagsContext","Consumer","flags","featureFlags","getFullReactUIFlagsContext","RenderEnvironmentContext","_ref","_this2$cx","emotion","getStyles","CommonWrapper","rootNodeRef","setRootNode","getVisualStateDataAttributes","FocusTrap","removeBaselineSpacer","radioGroupRemoveBaselineSpacer","RadioGroupContext","Provider","renderChildren","focus","radio","querySelector","_this$props2","items","children","invariant","mapItems","React","Component","__KONTUR_REACT_UI__","displayName","Prevent","_value","fn","result","_iterator","_createForOfIteratorHelperLoose2","_step","done","entry","_normalizeEntry","normalizeEntry","push","Array","isArray"],"sources":["RadioGroup.tsx"],"sourcesContent":["import type { AriaAttributes } from 'react';\nimport React from 'react';\nimport invariant from 'invariant';\nimport type { Emotion } from '@emotion/css/types/create-instance';\n\nimport { RenderEnvironmentContext } from '../../lib/theming/RenderEnvironmentContext';\nimport { getRandomID, isNonNullable } from '../../lib/utils';\nimport { Radio } from '../Radio';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport type { Nullable } from '../../typings/utility-types';\nimport { FocusTrap } from '../../internal/FocusTrap';\nimport type { CommonProps } from '../../internal/CommonWrapper';\nimport { CommonWrapper } from '../../internal/CommonWrapper';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode';\nimport { rootNode } from '../../lib/rootNode';\nimport { getVisualStateDataAttributes } from '../../internal/CommonWrapper/utils/getVisualStateDataAttributes';\nimport type { ReactUIFeatureFlags } from '../../lib/featureFlagsContext';\nimport { getFullReactUIFlagsContext, ReactUIFeatureFlagsContext } from '../../lib/featureFlagsContext';\n\nimport { getStyles } from './RadioGroup.styles';\nimport { Prevent } from './Prevent';\nimport type { RadioGroupContextType } from './RadioGroupContext';\nimport { RadioGroupContext } from './RadioGroupContext';\n\nexport interface RadioGroupProps<T = string \| number> extends CommonProps {\n /** Задает значение по умолчанию. Должно быть одним из значений дочерних радиокнопок или значений из параметра `items`. /\n defaultValue?: T;\n\n /* Задает значение радиогруппы. Должно быть одним из значений радиокнопок.\n * Если не указано, то компонент будет работать, как неконтролируемый. /\n value?: T;\n\n /* Задает массив параметров радиокнопок. Может быть типа `Array<Value>` или `Array<[Value, Data]>`,\n * где тип `Value` — значение радиокнопки, а `Data` — значение которое будет использовано вторым параметром в `renderItem`.\n * Тип `Array<Value>` будет приведен к типу `Array<[Value, Value]>`.\n * Может быть использовано, если не передан параметр `children`. /\n items?: T[] \| Array<[T, React.ReactNode]>;\n\n /* Устанавливает аттрибут name для вложенных радиокнопок. Если не указан, то сгенерируется случайное имя. /\n name?: string;\n\n /* Получает уникальный ключ по элементу\n * @param item - элемент, по которуму нужно получить ключ. /\n toKey?: (item: T) => string \| number;\n\n /* Делает все радиокнопки недоступными. /\n disabled?: boolean;\n\n /* Переводит все радиокнопки в состояние валидации \"предупреждение\". /\n warning?: boolean;\n\n /* Переводит все радиокнопки в состояние валидации \"ошибка\". /\n error?: boolean;\n\n /* Выравнивает элементы items в строку. Не работает с children. /\n inline?: boolean;\n\n /* Задает ширину радиогруппы. Не работает с `children`. /\n width?: React.CSSProperties['width'];\n\n /* Задает функцию, которая отображает контент радиокнопки. Не работает с `children`.\n * @param {Value} itemValue - значение радиокнопки.\n * @param {Data} data - значение для отрисовки радиокнопки. /\n renderItem?: (itemValue: T, data: React.ReactNode) => React.ReactNode;\n\n /* @ignore /\n 'aria-describedby'?: AriaAttributes['aria-describedby'];\n\n /* Задает функцию, которая вызывается при изменении значения радиогруппы (value). /\n onValueChange?: (value: T) => void;\n\n /* Задает функцию, которая вызывается при потере радиогруппой фокуса. /\n onBlur?: (event: FocusEvent) => void;\n\n /* Задает функцию, которая вызывается при уходе мышки с объекта (событие `onmouseleave`). /\n onMouseLeave?: () => any;\n\n /* Задает функцию, которая вызывается при наведении мышкой (событие `onmouseover`). /\n onMouseOver?: () => any;\n\n /* Задает функцию, которая вызывается при наведении мышкой (событие `onmouseenter`). См разницу с onMouseOver в [документации](https://learn.javascript.ru/mousemove-mouseover-mouseout-mouseenter-mouseleave) /\n onMouseEnter?: () => any;\n}\n\nexport interface RadioGroupState<T> {\n activeItem?: T;\n}\n\nexport const RadioGroupDataTids = {\n root: 'RadioGroup__root',\n} as const;\n\ntype DefaultProps = Required<Pick<RadioGroupProps<unknown>, 'renderItem'>>;\n\n/\n Группа радиокнопок `RadioGroup` используется для выбора одного значения из нескольких, когда вариантов выбора немного — 2–5.\n \n `children` может содержать любую разметку с компонентами Radio, если не передан параметр `items`.\n * Каждому компоненту Radio нужно указать параметр `value`, такого же типа, как и параметр `value` самой радиогруппы.\n \n Значения активного элемента сравниваются по строгому равенству `===`.\n /\n@rootNode\nexport class RadioGroup<T> extends React.Component<RadioGroupProps<T>, RadioGroupState<T>> {\n public static __KONTUR_REACT_UI__ = 'RadioGroup';\n public static displayName = 'RadioGroup';\n\n public static defaultProps: DefaultProps = {\n renderItem,\n };\n\n public static Prevent = Prevent;\n\n private cx!: Emotion['cx'];\n private styles!: ReturnType<typeof getStyles>;\n private node: Nullable<HTMLSpanElement>;\n private name = getRandomID();\n private getProps = createPropsGetter(RadioGroup.defaultProps);\n public getRootNode!: TGetRootNode;\n private setRootNode!: TSetRootNode;\n private featureFlags!: ReactUIFeatureFlags;\n\n constructor(props: RadioGroupProps<T>) {\n super(props);\n\n this.state = {\n activeItem: this.props.defaultValue,\n };\n }\n\n private getRadioGroupContextValue = (): RadioGroupContextType<T> => {\n return {\n activeItem: this.getValue(),\n onSelect: this.handleSelect,\n name: this.getName(),\n disabled: this.props.disabled,\n error: this.props.error,\n warning: this.props.warning,\n };\n };\n\n public render() {\n const {\n width,\n onMouseLeave,\n onMouseOver,\n onMouseEnter,\n onBlur,\n 'aria-describedby': ariaDescribedby,\n disabled,\n } = this.props;\n const style = {\n width: width ?? 'auto',\n };\n const handlers = {\n onMouseOver,\n onMouseEnter,\n onMouseLeave,\n };\n\n return (\n <ReactUIFeatureFlagsContext.Consumer>\n {(flags) => {\n this.featureFlags = getFullReactUIFlagsContext(flags);\n return (\n <RenderEnvironmentContext.Consumer>\n {({ emotion }) => {\n this.cx = emotion.cx;\n this.styles = getStyles(emotion);\n\n return (\n <CommonWrapper\n rootNodeRef={this.setRootNode}\n {...this.props}\n {...getVisualStateDataAttributes({ disabled })}\n >\n <FocusTrap onBlur={onBlur}>\n <span\n data-tid={RadioGroupDataTids.root}\n ref={this.ref}\n style={style}\n className={this.cx({\n [this.styles.root()]: true,\n [this.styles.removeBaselineSpacer()]: this.featureFlags.radioGroupRemoveBaselineSpacer,\n })}\n role=\"radiogroup\"\n {...handlers}\n aria-describedby={ariaDescribedby}\n >\n <RadioGroupContext.Provider value={this.getRadioGroupContextValue()}>\n {this.renderChildren()}\n </RadioGroupContext.Provider>\n </span>\n </FocusTrap>\n </CommonWrapper>\n );\n }}\n </RenderEnvironmentContext.Consumer>\n );\n }}\n </ReactUIFeatureFlagsContext.Consumer>\n );\n }\n\n /\n @public\n */\n public focus() {\n const node = this.node;\n if (!node) {\n return;\n }\n\n let radio = node.querySelector('input[type=\"radio\"]:checked') as Nullable<HTMLInputElement>;\n\n // If no checked radios, try get first radio\n if (!radio \|\| radio.disabled) {\n radio = node.querySelector('input[type=\"radio\"]:not([disabled])') as Nullable<HTMLInputElement>;\n }\n\n if (radio) {\n radio.focus();\n }\n }\n\n private getValue = () => (this.isControlled() ? this.props.value : this.state.activeItem);\n\n private getName = () => this.props.name \|\| this.name;\n\n private isControlled = () => isNonNullable(this.props.value);\n\n private handleSelect = (value: T) => {\n if (!this.isControlled()) {\n this.setState({ activeItem: value });\n }\n if (this.props.onValueChange) {\n this.props.onValueChange(value);\n }\n };\n\n private renderChildren() {\n const { items, children } = this.props;\n invariant((!items && children) \|\| (items && !children), 'Either items or children must be passed, not both');\n return items ? mapItems<T>(this.renderRadio, items) : children;\n }\n\n private renderRadio = (itemValue: T, data: React.ReactNode, index: number): JSX.Element => {\n const itemProps = {\n key: this.getKeyByItem(itemValue),\n className: this.cx({\n [this.styles.item()]: true,\n [this.styles.itemFirst()]: index === 0,\n [this.styles.itemInline()]: !!this.props.inline,\n }),\n };\n\n return (\n <span {...itemProps} role=\"presentation\">\n <Radio value={itemValue}>{this.getProps().renderItem(itemValue, data)}</Radio>\n </span>\n );\n };\n\n private getKeyByItem = (itemValue: T) => {\n if (this.props.toKey) {\n return this.props.toKey(itemValue);\n }\n return typeof itemValue === 'string' \|\| typeof itemValue === 'number' ? itemValue : undefined;\n };\n\n private ref = (element: HTMLSpanElement) => {\n this.node = element;\n };\n}\n\nfunction renderItem<T>(_value: T, data: React.ReactNode) {\n return data;\n}\n\nfunction mapItems<T>(\n fn: (value: T, data: React.ReactNode, index: number) => React.ReactNode,\n items: T[] \| Array<[T, React.ReactNode]>,\n) {\n const result: React.ReactNode[] = [];\n let index = 0;\n for (const entry of items) {\n const [value, data] = normalizeEntry<T>(entry);\n result.push(fn(value, data, index));\n ++index;\n }\n return result;\n}\n\nfunction normalizeEntry<T>(entry: T \| [T, React.ReactNode]): [T, React.ReactNode] {\n if (!Array.isArray(entry)) {\n return [entry, entry as unknown as React.ReactNode];\n }\n return entry;\n}\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"names":["_react","_interopRequireDefault","require","_invariant","_utils","_Radio","_createPropsGetter","_FocusTrap","_CommonWrapper","_Emotion","_rootNode","_getVisualStateDataAttributes","_featureFlagsContext","_RadioGroup2","_Prevent","_RadioGroupContext","_class","_RadioGroup","RadioGroupDataTids","exports","root","RadioGroup","rootNode","_React$Component","props","_this","call","name","getRandomID","getProps","createPropsGetter","defaultProps","getRadioGroupContextValue","activeItem","getValue","onSelect","handleSelect","getName","disabled","error","warning","isControlled","value","state","isNonNullable","setState","onValueChange","renderRadio","itemValue","data","index","_cx","itemProps","key","getKeyByItem","className","cx","styles","item","itemFirst","itemInline","inline","default","createElement","_extends2","role","Radio","renderItem","toKey","undefined","ref","element","node","defaultValue","_inheritsLoose2","_proto","prototype","render","_this2","_this$props","width","onMouseLeave","onMouseOver","onMouseEnter","onBlur","ariaDescribedby","style","handlers","ReactUIFeatureFlagsContext","Consumer","flags","_cx2","featureFlags","getFullReactUIFlagsContext","CommonWrapper","rootNodeRef","setRootNode","getVisualStateDataAttributes","FocusTrap","removeBaselineSpacer","radioGroupRemoveBaselineSpacer","RadioGroupContext","Provider","renderChildren","focus","radio","querySelector","_this$props2","items","children","invariant","mapItems","React","Component","__KONTUR_REACT_UI__","displayName","Prevent","_value","fn","result","_iterator","_createForOfIteratorHelperLoose2","_step","done","entry","_normalizeEntry","normalizeEntry","push","Array","isArray"],"sources":["RadioGroup.tsx"],"sourcesContent":["import type { AriaAttributes } from 'react';\nimport React from 'react';\nimport invariant from 'invariant';\n\nimport { getRandomID, isNonNullable } from '../../lib/utils';\nimport { Radio } from '../Radio';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\nimport type { Nullable } from '../../typings/utility-types';\nimport { FocusTrap } from '../../internal/FocusTrap';\nimport type { CommonProps } from '../../internal/CommonWrapper';\nimport { CommonWrapper } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode';\nimport { rootNode } from '../../lib/rootNode';\nimport { getVisualStateDataAttributes } from '../../internal/CommonWrapper/utils/getVisualStateDataAttributes';\nimport type { ReactUIFeatureFlags } from '../../lib/featureFlagsContext';\nimport { getFullReactUIFlagsContext, ReactUIFeatureFlagsContext } from '../../lib/featureFlagsContext';\n\nimport { styles } from './RadioGroup.styles';\nimport { Prevent } from './Prevent';\nimport type { RadioGroupContextType } from './RadioGroupContext';\nimport { RadioGroupContext } from './RadioGroupContext';\n\nexport interface RadioGroupProps<T = string \| number> extends CommonProps {\n /** Задает значение по умолчанию. Должно быть одним из значений дочерних радиокнопок или значений из параметра `items`. /\n defaultValue?: T;\n\n /* Задает значение радиогруппы. Должно быть одним из значений радиокнопок.\n * Если не указано, то компонент будет работать, как неконтролируемый. /\n value?: T;\n\n /* Задает массив параметров радиокнопок. Может быть типа `Array<Value>` или `Array<[Value, Data]>`,\n * где тип `Value` — значение радиокнопки, а `Data` — значение которое будет использовано вторым параметром в `renderItem`.\n * Тип `Array<Value>` будет приведен к типу `Array<[Value, Value]>`.\n * Может быть использовано, если не передан параметр `children`. /\n items?: T[] \| Array<[T, React.ReactNode]>;\n\n /* Устанавливает аттрибут name для вложенных радиокнопок. Если не указан, то сгенерируется случайное имя. /\n name?: string;\n\n /* Получает уникальный ключ по элементу\n * @param item - элемент, по которуму нужно получить ключ. /\n toKey?: (item: T) => string \| number;\n\n /* Делает все радиокнопки недоступными. /\n disabled?: boolean;\n\n /* Переводит все радиокнопки в состояние валидации \"предупреждение\". /\n warning?: boolean;\n\n /* Переводит все радиокнопки в состояние валидации \"ошибка\". /\n error?: boolean;\n\n /* Выравнивает элементы items в строку. Не работает с children. /\n inline?: boolean;\n\n /* Задает ширину радиогруппы. Не работает с `children`. /\n width?: React.CSSProperties['width'];\n\n /* Задает функцию, которая отображает контент радиокнопки. Не работает с `children`.\n * @param {Value} itemValue - значение радиокнопки.\n * @param {Data} data - значение для отрисовки радиокнопки. /\n renderItem?: (itemValue: T, data: React.ReactNode) => React.ReactNode;\n\n /* @ignore /\n 'aria-describedby'?: AriaAttributes['aria-describedby'];\n\n /* Задает функцию, которая вызывается при изменении значения радиогруппы (value). /\n onValueChange?: (value: T) => void;\n\n /* Задает функцию, которая вызывается при потере радиогруппой фокуса. /\n onBlur?: (event: FocusEvent) => void;\n\n /* Задает функцию, которая вызывается при уходе мышки с объекта (событие `onmouseleave`). /\n onMouseLeave?: () => any;\n\n /* Задает функцию, которая вызывается при наведении мышкой (событие `onmouseover`). /\n onMouseOver?: () => any;\n\n /* Задает функцию, которая вызывается при наведении мышкой (событие `onmouseenter`). См разницу с onMouseOver в [документации](https://learn.javascript.ru/mousemove-mouseover-mouseout-mouseenter-mouseleave) /\n onMouseEnter?: () => any;\n}\n\nexport interface RadioGroupState<T> {\n activeItem?: T;\n}\n\nexport const RadioGroupDataTids = {\n root: 'RadioGroup__root',\n} as const;\n\ntype DefaultProps = Required<Pick<RadioGroupProps<unknown>, 'renderItem'>>;\n\n/\n Группа радиокнопок `RadioGroup` используется для выбора одного значения из нескольких, когда вариантов выбора немного — 2–5.\n \n `children` может содержать любую разметку с компонентами Radio, если не передан параметр `items`.\n * Каждому компоненту Radio нужно указать параметр `value`, такого же типа, как и параметр `value` самой радиогруппы.\n \n Значения активного элемента сравниваются по строгому равенству `===`.\n /\n@rootNode\nexport class RadioGroup<T> extends React.Component<RadioGroupProps<T>, RadioGroupState<T>> {\n public static __KONTUR_REACT_UI__ = 'RadioGroup';\n public static displayName = 'RadioGroup';\n\n public static defaultProps: DefaultProps = {\n renderItem,\n };\n\n public static Prevent = Prevent;\n\n private node: Nullable<HTMLSpanElement>;\n private name = getRandomID();\n private getProps = createPropsGetter(RadioGroup.defaultProps);\n public getRootNode!: TGetRootNode;\n private setRootNode!: TSetRootNode;\n private featureFlags!: ReactUIFeatureFlags;\n\n constructor(props: RadioGroupProps<T>) {\n super(props);\n\n this.state = {\n activeItem: this.props.defaultValue,\n };\n }\n\n private getRadioGroupContextValue = (): RadioGroupContextType<T> => {\n return {\n activeItem: this.getValue(),\n onSelect: this.handleSelect,\n name: this.getName(),\n disabled: this.props.disabled,\n error: this.props.error,\n warning: this.props.warning,\n };\n };\n\n public render() {\n const {\n width,\n onMouseLeave,\n onMouseOver,\n onMouseEnter,\n onBlur,\n 'aria-describedby': ariaDescribedby,\n disabled,\n } = this.props;\n const style = {\n width: width ?? 'auto',\n };\n const handlers = {\n onMouseOver,\n onMouseEnter,\n onMouseLeave,\n };\n\n return (\n <ReactUIFeatureFlagsContext.Consumer>\n {(flags) => {\n this.featureFlags = getFullReactUIFlagsContext(flags);\n return (\n <CommonWrapper\n rootNodeRef={this.setRootNode}\n {...this.props}\n {...getVisualStateDataAttributes({ disabled })}\n >\n <FocusTrap onBlur={onBlur}>\n <span\n data-tid={RadioGroupDataTids.root}\n ref={this.ref}\n style={style}\n className={cx({\n [styles.root()]: true,\n [styles.removeBaselineSpacer()]: this.featureFlags.radioGroupRemoveBaselineSpacer,\n })}\n role=\"radiogroup\"\n {...handlers}\n aria-describedby={ariaDescribedby}\n >\n <RadioGroupContext.Provider value={this.getRadioGroupContextValue()}>\n {this.renderChildren()}\n </RadioGroupContext.Provider>\n </span>\n </FocusTrap>\n </CommonWrapper>\n );\n }}\n </ReactUIFeatureFlagsContext.Consumer>\n );\n }\n\n /\n @public\n */\n public focus() {\n const node = this.node;\n if (!node) {\n return;\n }\n\n let radio = node.querySelector('input[type=\"radio\"]:checked') as Nullable<HTMLInputElement>;\n\n // If no checked radios, try get first radio\n if (!radio \|\| radio.disabled) {\n radio = node.querySelector('input[type=\"radio\"]:not([disabled])') as Nullable<HTMLInputElement>;\n }\n\n if (radio) {\n radio.focus();\n }\n }\n\n private getValue = () => (this.isControlled() ? this.props.value : this.state.activeItem);\n\n private getName = () => this.props.name \|\| this.name;\n\n private isControlled = () => isNonNullable(this.props.value);\n\n private handleSelect = (value: T) => {\n if (!this.isControlled()) {\n this.setState({ activeItem: value });\n }\n if (this.props.onValueChange) {\n this.props.onValueChange(value);\n }\n };\n\n private renderChildren() {\n const { items, children } = this.props;\n invariant((!items && children) \|\| (items && !children), 'Either items or children must be passed, not both');\n return items ? mapItems<T>(this.renderRadio, items) : children;\n }\n\n private renderRadio = (itemValue: T, data: React.ReactNode, index: number): JSX.Element => {\n const itemProps = {\n key: this.getKeyByItem(itemValue),\n className: cx({\n [styles.item()]: true,\n [styles.itemFirst()]: index === 0,\n [styles.itemInline()]: !!this.props.inline,\n }),\n };\n\n return (\n <span {...itemProps} role=\"presentation\">\n <Radio value={itemValue}>{this.getProps().renderItem(itemValue, data)}</Radio>\n </span>\n );\n };\n\n private getKeyByItem = (itemValue: T) => {\n if (this.props.toKey) {\n return this.props.toKey(itemValue);\n }\n return typeof itemValue === 'string' \|\| typeof itemValue === 'number' ? itemValue : undefined;\n };\n\n private ref = (element: HTMLSpanElement) => {\n this.node = element;\n };\n}\n\nfunction renderItem<T>(_value: T, data: React.ReactNode) {\n return data;\n}\n\nfunction mapItems<T>(\n fn: (value: T, data: React.ReactNode, index: number) => React.ReactNode,\n items: T[] \| Array<[T, React.ReactNode]>,\n) {\n const result: React.ReactNode[] = [];\n let index = 0;\n for (const entry of items) {\n const [value, data] = normalizeEntry<T>(entry);\n result.push(fn(value, data, index));\n ++index;\n }\n return result;\n}\n\nfunction normalizeEntry<T>(entry: T \| [T, React.ReactNode]): [T, React.ReactNode] {\n if (!Array.isArray(entry)) {\n return [entry, entry as unknown as React.ReactNode];\n }\n return entry;\n}\n"],"mappings":"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","ignoreList":[]}

package/cjs/components/RadioGroup/RadioGroup.md ADDED Viewed

@@ -0,0 +1,44 @@
+### Базовый пример
+```jsx harmony
+import { Gapped, Radio } from '@skbkontur/react-ui';
+let items = ['One', 'Two', 'Three', 'Four'];
+let simpleRadioGroup = (
+  <div>
+    <h2>Numbers</h2>
+    <RadioGroup name="number-simple" items={items} defaultValue="One" />
+  </div>
+);
+let complexRadioGroup = (
+  <div>
+    <h2>Numbers</h2>
+    <RadioGroup name="number-complex" defaultValue="3">
+      <Gapped gap={40}>
+        <Gapped vertical gap={0}>
+          <b>Odd</b>
+          <Radio value="1">One</Radio>
+          <Radio value="3">Three</Radio>
+          <Radio value="5" disabled>
+            Five
+          </Radio>
+          <Radio value="7">Seven</Radio>
+        </Gapped>
+        <Gapped vertical gap={0}>
+          <b>Even</b>
+          <Radio value="2">Two</Radio>
+          <Radio value="4">Four</Radio>
+          <Radio value="6">Six</Radio>
+          <Radio value="8">Eight</Radio>
+        </Gapped>
+      </Gapped>
+    </RadioGroup>
+  </div>
+);
+<div>
+  {simpleRadioGroup}
+  {complexRadioGroup}
+</div>;
+```

package/cjs/components/RadioGroup/RadioGroup.styles.d.ts CHANGED Viewed

@@ -1,5 +1,4 @@
-import type { Emotion } from '@emotion/css/types/create-instance';
-export declare const getStyles: (emotion: Emotion) => {
+export declare const styles: {
     root(): string;
     removeBaselineSpacer(): string;
     item(): string;

package/cjs/components/RadioGroup/RadioGroup.styles.js CHANGED Viewed

@@ -1,44 +1,41 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.getStyles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.styles = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));var _Emotion = require("../../lib/theming/Emotion");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
-var _Emotion = require("../../lib/theming/Emotion");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
+var styles = exports.styles = (0, _Emotion.memoizeStyle)({
+  root: function root() {
+    return (0, _Emotion.css)(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-block;\n      user-select: none;\n      cursor: default;\n      line-height: normal;\n    "])));
-var getStyles = exports.getStyles = function getStyles(emotion) {return (
-    (0, _Emotion.memoizeStyle)({
-      root: function root() {
-        return emotion.css(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n        display: inline-block;\n        user-select: none;\n        cursor: default;\n        line-height: normal;\n      "])));
+  },
-      },
+  removeBaselineSpacer: function removeBaselineSpacer() {
+    return (0, _Emotion.css)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n      vertical-align: bottom;\n    "])));
-      removeBaselineSpacer: function removeBaselineSpacer() {
-        return emotion.css(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n        vertical-align: bottom;\n      "])));
+  },
-      },
+  item: function item() {
+    return (0, _Emotion.css)(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: table;\n      margin-top: 0;\n      width: 100%;\n    "])));
-      item: function item() {
-        return emotion.css(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n        display: table;\n        margin-top: 0;\n        width: 100%;\n      "])));
+  },
-      },
+  itemFirst: function itemFirst() {
+    return (0, _Emotion.css)(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n      margin-top: 0;\n    "])));
-      itemFirst: function itemFirst() {
-        return emotion.css(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n        margin-top: 0;\n      "])));
+  },
-      },
+  itemInline: function itemInline() {
+    return (0, _Emotion.css)(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n      display: inline-table;\n      margin-right: 15px;\n      margin-top: 0;\n      width: auto;\n    "])));
-      itemInline: function itemInline() {
-        return emotion.css(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n        display: inline-table;\n        margin-right: 15px;\n        margin-top: 0;\n        width: auto;\n      "])));
-      }
-    }));};
+  }
+});

package/cjs/components/RadioGroup/RadioGroup.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_Emotion","require","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","~~getStyles~~","exports","~~emotion","~~memoizeStyle","root","css","_taggedTemplateLiteralLoose2","default","removeBaselineSpacer","item","itemFirst","itemInline"],"sources":["RadioGroup.styles.ts"],"sourcesContent":["import ~~type~~ { ~~Emotion } from '@emotion/~~css~~/types/create-instance';\n\nimport~~ { memoizeStyle } from '../../lib/theming/Emotion';\n\nexport const ~~getStyles~~ = ~~(emotion: Emotion) =>\n~~ memoizeStyle({\n root() {\n return ~~emotion.~~css`\n display: inline-block;\n user-select: none;\n cursor: default;\n line-height: normal;\n `;\n },\n\n removeBaselineSpacer() {\n return ~~emotion.~~css`\n vertical-align: bottom;\n `;\n },\n\n item() {\n return ~~emotion.~~css`\n display: table;\n margin-top: 0;\n width: 100%;\n `;\n },\n\n itemFirst() {\n return ~~emotion.~~css`\n margin-top: 0;\n `;\n },\n\n itemInline() {\n return ~~emotion.~~css`\n display: inline-table;\n margin-right: 15px;\n margin-top: 0;\n width: auto;\n `;\n },\n });\n"],"mappings":"~~;;AAEA~~,IAAAA,QAAA,GAAAC,OAAA,~~8BAAyD~~,IAAAC,eAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA;;~~AAElD~~,IAAMC,~~SAAS~~,GAAAC,OAAA,CAAAD,~~SAAA~~,GAAG,~~SAAZA~~,~~SAASA,CAAIE,OAAgB;IACxC,IAAAC,~~qBAAY,EAAC;~~MACXC~~,IAAI,WAAAA,KAAA,EAAG;~~QACL~~,~~OAAOF~~,~~OAAO~~,~~CAACG~~,~~GAAG,CAAAV,~~eAAA,KAAAA,eAAA,~~OAAAW~~,4BAAA,CAAAC,OAAA;;;;;;~~MAMpB~~,CAAC;;~~MAEDC~~,oBAAoB,WAAAA,qBAAA,EAAG;~~QACrB~~,~~OAAON~~,~~OAAO~~,~~CAACG~~,~~GAAG,CAAAT,~~gBAAA,KAAAA,gBAAA,~~OAAAU~~,4BAAA,CAAAC,OAAA;;;~~MAGpB~~,CAAC;;~~MAEDE~~,IAAI,WAAAA,KAAA,EAAG;~~QACL~~,~~OAAOP~~,~~OAAO~~,~~CAACG~~,~~GAAG,CAAAR,~~gBAAA,KAAAA,gBAAA,~~OAAAS~~,4BAAA,CAAAC,OAAA;;;;;~~MAKpB~~,CAAC;;~~MAEDG~~,SAAS,WAAAA,UAAA,EAAG;~~QACV~~,~~OAAOR~~,~~OAAO~~,~~CAACG~~,~~GAAG,CAAAP,~~gBAAA,KAAAA,gBAAA,~~OAAAQ~~,4BAAA,CAAAC,OAAA;;;~~MAGpB~~,CAAC;;~~MAEDI~~,UAAU,WAAAA,WAAA,EAAG;~~QACX~~,~~OAAOT~~,~~OAAO~~,~~CAACG~~,~~GAAG,CAAAN,~~gBAAA,KAAAA,gBAAA,~~OAAAO~~,4BAAA,CAAAC,OAAA;;;;;;~~MAMpB~~;~~IACF~~,CAAC,CAAC","ignoreList":[]}
1	+ {"version":3,"names":["_Emotion","require","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","styles","exports","memoizeStyle","root","css","_taggedTemplateLiteralLoose2","default","removeBaselineSpacer","item","itemFirst","itemInline"],"sources":["RadioGroup.styles.ts"],"sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\n\nexport const styles = memoizeStyle({\n root() {\n return css`\n display: inline-block;\n user-select: none;\n cursor: default;\n line-height: normal;\n `;\n },\n\n removeBaselineSpacer() {\n return css`\n vertical-align: bottom;\n `;\n },\n\n item() {\n return css`\n display: table;\n margin-top: 0;\n width: 100%;\n `;\n },\n\n itemFirst() {\n return css`\n margin-top: 0;\n `;\n },\n\n itemInline() {\n return css`\n display: inline-table;\n margin-right: 15px;\n margin-top: 0;\n width: auto;\n `;\n },\n});\n"],"mappings":"oRAAA,IAAAA,QAAA,GAAAC,OAAA,8BAA8D,IAAAC,eAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA,EAAAC,gBAAA;;AAEvD,IAAMC,MAAM,GAAAC,OAAA,CAAAD,MAAA,GAAG,IAAAE,qBAAY,EAAC;EACjCC,IAAI,WAAAA,KAAA,EAAG;IACL,WAAOC,YAAG,EAAAT,eAAA,KAAAA,eAAA,OAAAU,4BAAA,CAAAC,OAAA;;;;;;EAMZ,CAAC;;EAEDC,oBAAoB,WAAAA,qBAAA,EAAG;IACrB,WAAOH,YAAG,EAAAR,gBAAA,KAAAA,gBAAA,OAAAS,4BAAA,CAAAC,OAAA;;;EAGZ,CAAC;;EAEDE,IAAI,WAAAA,KAAA,EAAG;IACL,WAAOJ,YAAG,EAAAP,gBAAA,KAAAA,gBAAA,OAAAQ,4BAAA,CAAAC,OAAA;;;;;EAKZ,CAAC;;EAEDG,SAAS,WAAAA,UAAA,EAAG;IACV,WAAOL,YAAG,EAAAN,gBAAA,KAAAA,gBAAA,OAAAO,4BAAA,CAAAC,OAAA;;;EAGZ,CAAC;;EAEDI,UAAU,WAAAA,WAAA,EAAG;IACX,WAAON,YAAG,EAAAL,gBAAA,KAAAA,gBAAA,OAAAM,4BAAA,CAAAC,OAAA;;;;;;EAMZ;AACF,CAAC,CAAC","ignoreList":[]}

package/cjs/components/ResponsiveLayout/ResponsiveLayout.md ADDED Viewed

@@ -0,0 +1,75 @@
+### Вспомогательный интерфейс
+```ts static
+interface ResponsiveLayoutFlags {
+  isMobile: boolean;
+}
+```
+### Компонент ожидает в себя функцию, в которую аргументом передается объект с флагом лэйаута.
+```jsx static
+import { ResponsiveLayout } from '@skbkontur/react-ui';
+class SomeComponent {
+  public render() {
+    return (
+      <ResponsiveLayout>
+        {
+          ({ isMobile }) => {
+            /* ... */
+          }
+        }
+      </ResponsiveLayout>
+    )
+  }
+}
+```
+### Также существует проп `onLayoutChange`, который вызывает переданный в него коллбэк при изменении лэйаута. Аргументом передается объект с флагом.
+```jsx static
+import { ResponsiveLayout } from '@skbkontur/react-ui';
+class SomeComponent {
+  public render() {
+    return (
+      <div>
+        <ResponsiveLayout onLayoutChange={({ isMobile }) => console.log(isMobile)} />
+      </div>
+    )
+  }
+}
+```
+### В компонент можно передать проп `customMediaQueries: MediaQueriesType`, который позволяет кастомизировать возвращаемые флаги:
+```ts static
+type MediaQueriesType = Record<string, string>;
+```
+1. Без кастомизации есть только флаг isMobile
+2. Поля из `customMediaQueries` дополняют список возвращаемых флагов в `ResponsiveLayoutFlags`
+3. При добавлении кастомного флага isMobile, значение дефолтного флага перезаписывается в пользу кастомного
+```jsx static
+import { ResponsiveLayout } from '@skbkontur/react-ui';
+const customMediaQueries = {
+  isTablet: '(min-width: 577px)',
+  isDesktop: '(min-width: 1280px)',
+};
+class SomeComponent {
+  public render() {
+    return (
+      <ResponsiveLayout customMediaQueries={customMediaQueries}>
+        {
+          ({ isMobile, isTablet, isDesktop }) => {
+            /* ... */
+          }
+        }
+      </ResponsiveLayout>
+    )
+  }
+}
+```
+Как альтернативу можно использовать хук [useResponsiveLayout](#/Mobiles).

package/cjs/components/ResponsiveLayout/ResponsiveLayoutEvents.d.ts CHANGED Viewed

@@ -1,4 +1,3 @@
-import type { GlobalObject } from '../../lib/globalObject';
 interface mediaQueryData {
     mql: MediaQueryList;
     listeners: Array<(e: MediaQueryListEvent) => void>;
@@ -7,6 +6,6 @@ export interface listenerToken {
     remove: () => void;
 }
 export declare const eventListenersMap: Map<string, mediaQueryData>;
-export declare function addResponsiveLayoutListener(globalObject: GlobalObject, mediaQuery: string, callback: (e: MediaQueryListEvent) => void): listenerToken;
-export declare function checkMatches(globalObject: GlobalObject, mediaQuery: string): boolean;
+export declare function addResponsiveLayoutListener(mediaQuery: string, callback: (e: MediaQueryListEvent) => void): listenerToken;
+export declare function checkMatches(mediaQuery: string): boolean;
 export {};

package/cjs/components/ResponsiveLayout/ResponsiveLayoutEvents.js CHANGED Viewed

@@ -1,4 +1,4 @@
-"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.addResponsiveLayoutListener = addResponsiveLayoutListener;exports.checkMatches = checkMatches;exports.eventListenersMap = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.addResponsiveLayoutListener = addResponsiveLayoutListener;exports.checkMatches = checkMatches;exports.eventListenersMap = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _globalObject = require("@skbkontur/global-object");
@@ -12,14 +12,13 @@
 var eventListenersMap = exports.eventListenersMap = new Map();
 function addResponsiveLayoutListener(
-globalObject,
 mediaQuery,
 callback)
 {
   if (eventListenersMap.has(mediaQuery)) {
     addCallbackToMQListener(mediaQuery, callback);
   } else {
-    createMQListener(globalObject, mediaQuery, callback);
+    createMQListener(mediaQuery, callback);
   }
   return {
@@ -40,8 +39,8 @@ function addCallbackToMQListener(mediaQuery, callback) {
   }
 }
-function createMQListener(globalObject, mediaQuery, callback) {
-  var mql = globalObject.matchMedia == null ? void 0 : globalObject.matchMedia(mediaQuery);
+function createMQListener(mediaQuery, callback) {
+  var mql = _globalObject.globalObject.matchMedia == null ? void 0 : _globalObject.globalObject.matchMedia(mediaQuery);
   if (mql) {
     var newMediaQueryInfo = { mql: mql, listeners: [callback] };
@@ -79,13 +78,13 @@ function removeCallbackFromMQListener(mediaQuery, callback) {
   }
 }
-function checkMatches(globalObject, mediaQuery) {var _eventListener$mql$ma;
-  if (!globalObject.matchMedia) {
+function checkMatches(mediaQuery) {var _eventListener$mql$ma;
+  if (!_globalObject.globalObject.matchMedia) {
     return false;
   }
   if (!eventListenersMap.has(mediaQuery)) {var _globalObject$matchMe;
-    return !!((_globalObject$matchMe = globalObject.matchMedia(mediaQuery)) != null && _globalObject$matchMe.matches);
+    return !!((_globalObject$matchMe = _globalObject.globalObject.matchMedia(mediaQuery)) != null && _globalObject$matchMe.matches);
   }
   var eventListener = eventListenersMap.get(mediaQuery);

package/cjs/components/ResponsiveLayout/ResponsiveLayoutEvents.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["eventListenersMap","exports","Map","addResponsiveLayoutListener","~~globalObject","~~mediaQuery","callback","has","addCallbackToMQListener","createMQListener","remove","removeCallbackFromMQListener","eventListener","get","set","_extends2","default","listeners","concat","mql","matchMedia","newMediaQueryInfo","addEventListener","changeCallback","addListener","newListeners","filter","listener","length","removeEventListener","removeListener","delete","checkMatches","_eventListener$mql$ma","_globalObject$matchMe","matches","e","media","forEach"],"sources":["ResponsiveLayoutEvents.ts"],"sourcesContent":["import ~~type~~ { ~~GlobalObject~~ } from '~~../../lib~~/~~globalObject~~';\n\ninterface mediaQueryData {\n mql: MediaQueryList;\n listeners: Array<(e: MediaQueryListEvent) => void>;\n}\n\nexport interface listenerToken {\n remove: () => void;\n}\n\nexport const eventListenersMap = new Map<string, mediaQueryData>();\n\nexport function addResponsiveLayoutListener(\n ~~globalObject: GlobalObject,\n~~ mediaQuery: string,\n callback: (e: MediaQueryListEvent) => void,\n): listenerToken {\n if (eventListenersMap.has(mediaQuery)) {\n addCallbackToMQListener(mediaQuery, callback);\n } else {\n createMQListener(~~globalObject,~~ mediaQuery, callback);\n }\n\n return {\n remove() {\n removeCallbackFromMQListener(mediaQuery, callback);\n },\n };\n}\n\nfunction addCallbackToMQListener(mediaQuery: string, callback: (e: MediaQueryListEvent) => void) {\n const eventListener = eventListenersMap.get(mediaQuery);\n\n if (eventListener) {\n eventListenersMap.set(mediaQuery, {\n ...eventListener,\n listeners: [...eventListener.listeners, callback],\n });\n }\n}\n\nfunction createMQListener(~~globalObject: GlobalObject,~~ mediaQuery: string, callback: (e: MediaQueryListEvent) => void) {\n const mql = globalObject.matchMedia?.(mediaQuery);\n if (mql) {\n const newMediaQueryInfo: mediaQueryData = { mql, listeners: [callback] };\n\n eventListenersMap.set(mediaQuery, newMediaQueryInfo);\n if (mql.addEventListener) {\n mql.addEventListener('change', changeCallback);\n } else {\n mql.addListener(changeCallback);\n }\n }\n}\n\nfunction removeCallbackFromMQListener(mediaQuery: string, callback: (e: MediaQueryListEvent) => void) {\n if (eventListenersMap.has(mediaQuery)) {\n const eventListener = eventListenersMap.get(mediaQuery);\n\n if (eventListener) {\n const newListeners = eventListener.listeners.filter((listener) => listener !== callback);\n\n if (newListeners.length === 0) {\n if (eventListener.mql.removeEventListener) {\n eventListener.mql.removeEventListener('change', changeCallback);\n } else {\n eventListener.mql.removeListener(changeCallback);\n }\n eventListenersMap.delete(mediaQuery);\n return;\n }\n\n eventListenersMap.set(mediaQuery, {\n ...eventListener,\n listeners: [...newListeners],\n });\n }\n }\n}\n\nexport function checkMatches(~~globalObject: GlobalObject,~~ mediaQuery: string) {\n if (!globalObject.matchMedia) {\n return false;\n }\n\n if (!eventListenersMap.has(mediaQuery)) {\n return !!globalObject.matchMedia(mediaQuery)?.matches;\n }\n\n const eventListener = eventListenersMap.get(mediaQuery);\n return eventListener?.mql.matches ?? false;\n}\n\nfunction changeCallback(e: MediaQueryListEvent) {\n const eventListener = eventListenersMap.get(e.media);\n\n if (eventListener) {\n eventListener.listeners.forEach((listener) => {\n listener(e);\n });\n }\n}\n"],"mappings":";;;;;;;;;;;AAWO,~~IAAMA~~,iBAAiB,GAAAC,OAAA,CAAAD,iBAAA,GAAG,IAAIE,GAAG,CAAyB,CAAC;;AAE3D,SAASC,2BAA2BA;AACzCC,~~YAA0B;AAC1BC,~~UAAkB;AAClBC,QAA0C;AAC3B;EACf,~~IAAIN~~,iBAAiB,~~CAACO~~,GAAG,CAACF,UAAU,CAAC,EAAE;IACrCG,uBAAuB,CAACH,UAAU,EAAEC,QAAQ,CAAC;EAC/C,CAAC,MAAM;IACLG,gBAAgB,~~CAACL~~,~~YAAY,EAAEC,~~UAAU,EAAEC,QAAQ,CAAC;~~EACtD~~;;EAEA,OAAO;IACLI,MAAM,WAAAA,OAAA,EAAG;MACPC,4BAA4B,CAACN,UAAU,EAAEC,QAAQ,CAAC;IACpD;EACF,CAAC;AACH;;AAEA,SAASE,uBAAuBA,CAACH,UAAkB,EAAEC,QAA0C,EAAE;EAC/F,IAAMM,aAAa,~~GAAGZ~~,iBAAiB,~~CAACa~~,GAAG,CAACR,UAAU,CAAC;;EAEvD,IAAIO,aAAa,EAAE;~~IACjBZ~~,iBAAiB,~~CAACc~~,GAAG,CAACT,UAAU,MAAAU,SAAA,CAAAC,OAAA;IAC3BJ,aAAa;MAChBK,SAAS,KAAAC,MAAA,CAAMN,aAAa,CAACK,SAAS,GAAEX,QAAQ,EAAC;IAClD,CAAC;EACJ;AACF;;AAEA,SAASG,gBAAgBA,~~CAACL~~,~~YAA0B,EAAEC,~~UAAkB,EAAEC,QAA0C,EAAE;~~EACpH~~,IAAMa,GAAG,~~GAAGf~~,~~YAAY~~,~~CAACgB~~,UAAU,~~oBAAvBhB~~,~~YAAY~~,~~CAACgB~~,UAAU,~~CAAGf~~,UAAU,CAAC;EACjD,IAAIc,GAAG,EAAE;IACP,~~IAAME~~,iBAAiC,GAAG,~~EAAEF~~,GAAG,EAAHA,GAAG,EAAEF,SAAS,EAAE,CAACX,QAAQ,CAAC,CAAC,CAAC;;~~IAExEN~~,iBAAiB,~~CAACc~~,GAAG,CAACT,UAAU,~~EAAEgB~~,iBAAiB,CAAC;IACpD,~~IAAIF~~,GAAG,~~CAACG~~,gBAAgB,EAAE;~~MACxBH~~,GAAG,~~CAACG~~,gBAAgB,CAAC,QAAQ,EAAEC,cAAc,CAAC;IAChD,CAAC,MAAM;~~MACLJ~~,GAAG,~~CAACK~~,WAAW,CAACD,cAAc,CAAC;IACjC;EACF;AACF;;AAEA,~~SAASZ~~,4BAA4BA,CAACN,UAAkB,EAAEC,QAA0C,EAAE;EACpG,~~IAAIN~~,iBAAiB,~~CAACO~~,GAAG,CAACF,UAAU,CAAC,EAAE;IACrC,IAAMO,aAAa,~~GAAGZ~~,iBAAiB,~~CAACa~~,GAAG,CAACR,UAAU,CAAC;;IAEvD,IAAIO,aAAa,EAAE;MACjB,~~IAAMa~~,YAAY,~~GAAGb~~,aAAa,CAACK,SAAS,~~CAACS~~,MAAM,CAAC,UAACC,QAAQ,UAAKA,QAAQ,~~KAAKrB~~,QAAQ,GAAC;;MAExF,~~IAAImB~~,YAAY,CAACG,MAAM,KAAK,CAAC,EAAE;QAC7B,~~IAAIhB~~,aAAa,CAACO,GAAG,~~CAACU~~,mBAAmB,EAAE;~~UACzCjB~~,aAAa,CAACO,GAAG,~~CAACU~~,mBAAmB,CAAC,QAAQ,EAAEN,cAAc,CAAC;QACjE,CAAC,MAAM;~~UACLX~~,aAAa,CAACO,GAAG,~~CAACW~~,cAAc,CAACP,cAAc,CAAC;QAClD;QACAvB,iBAAiB,CAAC+B,MAAM,~~CAAC1B~~,UAAU,CAAC;QACpC;MACF;;~~MAEAL~~,iBAAiB,~~CAACc~~,GAAG,CAACT,UAAU,MAAAU,SAAA,CAAAC,OAAA;MAC3BJ,aAAa;QAChBK,SAAS,KAAAC,MAAA,~~CAAMO~~,YAAY,CAAC;MAC7B,CAAC;IACJ;EACF;AACF;;AAEO,SAASO,YAAYA,CAAC5B,~~YAA0B,EAAEC,~~UAAkB,EAAE,~~KAAA4B~~,qBAAA;~~EAC3E~~,IAAI,~~CAAC7B~~,~~YAAY~~,~~CAACgB~~,UAAU,EAAE;IAC5B,OAAO,KAAK;EACd;;EAEA,IAAI,CAACpB,iBAAiB,~~CAACO~~,GAAG,CAACF,UAAU,CAAC,EAAE,~~KAAA6B~~,qBAAA;IACtC,OAAO,CAAC,GAAAA,qBAAA,~~GAAC9B~~,~~YAAY~~,~~CAACgB~~,UAAU,~~CAACf~~,UAAU,CAAC,~~aAAnC6B~~,qBAAA,CAAqCC,OAAO;EACvD;;EAEA,~~IAAMvB~~,aAAa,~~GAAGZ~~,iBAAiB,~~CAACa~~,GAAG,CAACR,UAAU,CAAC;EACvD,~~QAAA4B~~,qBAAA,~~GAAOrB~~,aAAa,oBAAbA,aAAa,CAAEO,GAAG,~~CAACgB~~,OAAO,YAAAF,qBAAA,GAAI,KAAK;AAC5C;;AAEA,SAASV,cAAcA,CAACa,CAAsB,EAAE;EAC9C,~~IAAMxB~~,aAAa,~~GAAGZ~~,iBAAiB,~~CAACa~~,GAAG,~~CAACuB~~,CAAC,CAACC,KAAK,CAAC;;EAEpD,~~IAAIzB~~,aAAa,EAAE;IACjBA,aAAa,CAACK,SAAS,~~CAACqB~~,OAAO,CAAC,UAACX,QAAQ,EAAK;MAC5CA,QAAQ,CAACS,CAAC,CAAC;IACb,CAAC,CAAC;EACJ;AACF","ignoreList":[]}
1	+ {"version":3,"names":["_globalObject","require","eventListenersMap","exports","Map","addResponsiveLayoutListener","mediaQuery","callback","has","addCallbackToMQListener","createMQListener","remove","removeCallbackFromMQListener","eventListener","get","set","_extends2","default","listeners","concat","mql","globalObject","matchMedia","newMediaQueryInfo","addEventListener","changeCallback","addListener","newListeners","filter","listener","length","removeEventListener","removeListener","delete","checkMatches","_eventListener$mql$ma","_globalObject$matchMe","matches","e","media","forEach"],"sources":["ResponsiveLayoutEvents.ts"],"sourcesContent":["import { globalObject } from '@skbkontur/global-object';\n\ninterface mediaQueryData {\n mql: MediaQueryList;\n listeners: Array<(e: MediaQueryListEvent) => void>;\n}\n\nexport interface listenerToken {\n remove: () => void;\n}\n\nexport const eventListenersMap = new Map<string, mediaQueryData>();\n\nexport function addResponsiveLayoutListener(\n mediaQuery: string,\n callback: (e: MediaQueryListEvent) => void,\n): listenerToken {\n if (eventListenersMap.has(mediaQuery)) {\n addCallbackToMQListener(mediaQuery, callback);\n } else {\n createMQListener(mediaQuery, callback);\n }\n\n return {\n remove() {\n removeCallbackFromMQListener(mediaQuery, callback);\n },\n };\n}\n\nfunction addCallbackToMQListener(mediaQuery: string, callback: (e: MediaQueryListEvent) => void) {\n const eventListener = eventListenersMap.get(mediaQuery);\n\n if (eventListener) {\n eventListenersMap.set(mediaQuery, {\n ...eventListener,\n listeners: [...eventListener.listeners, callback],\n });\n }\n}\n\nfunction createMQListener(mediaQuery: string, callback: (e: MediaQueryListEvent) => void) {\n const mql = globalObject.matchMedia?.(mediaQuery);\n if (mql) {\n const newMediaQueryInfo: mediaQueryData = { mql, listeners: [callback] };\n\n eventListenersMap.set(mediaQuery, newMediaQueryInfo);\n if (mql.addEventListener) {\n mql.addEventListener('change', changeCallback);\n } else {\n mql.addListener(changeCallback);\n }\n }\n}\n\nfunction removeCallbackFromMQListener(mediaQuery: string, callback: (e: MediaQueryListEvent) => void) {\n if (eventListenersMap.has(mediaQuery)) {\n const eventListener = eventListenersMap.get(mediaQuery);\n\n if (eventListener) {\n const newListeners = eventListener.listeners.filter((listener) => listener !== callback);\n\n if (newListeners.length === 0) {\n if (eventListener.mql.removeEventListener) {\n eventListener.mql.removeEventListener('change', changeCallback);\n } else {\n eventListener.mql.removeListener(changeCallback);\n }\n eventListenersMap.delete(mediaQuery);\n return;\n }\n\n eventListenersMap.set(mediaQuery, {\n ...eventListener,\n listeners: [...newListeners],\n });\n }\n }\n}\n\nexport function checkMatches(mediaQuery: string) {\n if (!globalObject.matchMedia) {\n return false;\n }\n\n if (!eventListenersMap.has(mediaQuery)) {\n return !!globalObject.matchMedia(mediaQuery)?.matches;\n }\n\n const eventListener = eventListenersMap.get(mediaQuery);\n return eventListener?.mql.matches ?? false;\n}\n\nfunction changeCallback(e: MediaQueryListEvent) {\n const eventListener = eventListenersMap.get(e.media);\n\n if (eventListener) {\n eventListener.listeners.forEach((listener) => {\n listener(e);\n });\n }\n}\n"],"mappings":"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","ignoreList":[]}

package/cjs/components/ResponsiveLayout/useResponsiveLayout.js CHANGED Viewed

@@ -1,7 +1,6 @@
 "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.useResponsiveLayout = useResponsiveLayout;var _extends3 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
 var _react = require("react");
-var _RenderEnvironmentContext = require("../../lib/theming/RenderEnvironmentContext");
 var _ThemeContext = require("../../lib/theming/ThemeContext");
@@ -11,7 +10,6 @@ function useResponsiveLayout(_temp)
 {var _ref = _temp === void 0 ? {} : _temp,customMediaQueries = _ref.customMediaQueries;
   var theme = (0, _react.useContext)(_ThemeContext.ThemeContext);
-  var globalObject = (0, _RenderEnvironmentContext.useGlobal)();
   var allMediaQueries = Object.entries((0, _extends3.default)({
     isMobile: theme.mobileMediaQuery },
@@ -24,8 +22,7 @@ function useResponsiveLayout(_temp)
   var getLayoutFromGlobal = function getLayoutFromGlobal() {
     return allMediaQueries.reduce(
-      function (result, mediaQuery) {var _Object$assign;return (
-          Object.assign(result, (_Object$assign = {}, _Object$assign[mediaQuery.flag] = (0, _ResponsiveLayoutEvents.checkMatches)(globalObject, mediaQuery.query), _Object$assign)));},
+      function (result, mediaQuery) {var _Object$assign;return Object.assign(result, (_Object$assign = {}, _Object$assign[mediaQuery.flag] = (0, _ResponsiveLayoutEvents.checkMatches)(mediaQuery.query), _Object$assign));},
       {}
     );
   };
@@ -39,11 +36,7 @@ function useResponsiveLayout(_temp)
     allMediaQueries.forEach(
       function (mediaQuery) {return (
-          mediaQuery.ref.current = (0, _ResponsiveLayoutEvents.addResponsiveLayoutListener)(
-            globalObject,
-            mediaQuery.query,
-            checkLayoutsMediaQueries
-          ));}
+          mediaQuery.ref.current = (0, _ResponsiveLayoutEvents.addResponsiveLayoutListener)(mediaQuery.query, checkLayoutsMediaQueries));}
     );
     // Checking for SSR use case

package/cjs/components/ResponsiveLayout/useResponsiveLayout.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["_react","require","~~_RenderEnvironmentContext","~~_ThemeContext","_ResponsiveLayoutEvents","useResponsiveLayout","_temp","_ref","customMediaQueries","theme","useContext","ThemeContext","~~globalObject","useGlobal","~~allMediaQueries","Object","entries","_extends3","default","isMobile","mobileMediaQuery","map","_ref2","key","value","flag","query","ref","createRef","getLayoutFromGlobal","reduce","result","mediaQuery","_Object$assign","assign","checkMatches","_useState","useState","state","setState","prepareMediaQueries","useCallback","forEach","current","addResponsiveLayoutListener","checkLayoutsMediaQueries","globalLayout","hasChangedQuery","find","_ref3","e","media","prevState","_extends2","matches","useEffect","_mediaQuery$ref$curre","remove"],"sources":["useResponsiveLayout.ts"],"sourcesContent":["import type React from 'react';\nimport { createRef, useCallback, useContext, useEffect, useState } from 'react';\n\nimport { ~~useGlobal } from '../../lib/theming/RenderEnvironmentContext';\nimport {~~ ThemeContext } from '../../lib/theming/ThemeContext';\n\nimport type { EmptyObject, MediaQueriesType, ResponsiveLayoutFlags, ResponsiveLayoutOptions } from './types';\nimport { addResponsiveLayoutListener, checkMatches } from './ResponsiveLayoutEvents';\n\nexport function useResponsiveLayout<T extends MediaQueriesType = EmptyObject>({\n customMediaQueries,\n}: ResponsiveLayoutOptions<T> = {}) {\n const theme = useContext(ThemeContext);\n ~~const globalObject = useGlobal();\n~~\n const allMediaQueries = Object.entries({\n isMobile: theme.mobileMediaQuery,\n ...customMediaQueries,\n }).map(([key, value]) => ({\n flag: key,\n query: value,\n ref: createRef() as React.MutableRefObject<{ remove: () => void } \| null>,\n }));\n\n const getLayoutFromGlobal = (): ResponsiveLayoutFlags<T> => {\n return allMediaQueries.reduce(\n (result, mediaQuery) ~~=>\n~~ Object.assign(result, { [mediaQuery.flag]: checkMatches(~~globalObject,~~ mediaQuery.query) }),\n {},\n ) as ResponsiveLayoutFlags<T>;\n };\n\n const [state, setState] = useState(getLayoutFromGlobal());\n\n const prepareMediaQueries = useCallback(() => {\n if (!theme) {\n return;\n }\n\n allMediaQueries.forEach(\n (mediaQuery) =>\n (mediaQuery.ref.current = addResponsiveLayoutListener(~~\n globalObject,\n~~ mediaQuery.query~~,\n~~ checkLayoutsMediaQueries~~,\n~~ )),\n );\n\n // Checking for SSR use case\n const globalLayout = getLayoutFromGlobal();\n const hasChangedQuery = Object.entries(globalLayout).find(([key, value]) => state[key] !== value);\n\n if (hasChangedQuery) {\n setState(globalLayout);\n }\n }, [theme]);\n\n const checkLayoutsMediaQueries = useCallback(\n (e: MediaQueryListEvent) => {\n if (!theme) {\n return;\n }\n\n allMediaQueries.forEach((mediaQuery) => {\n if (e.media === mediaQuery.query) {\n setState((prevState: ResponsiveLayoutFlags<T>) => ({\n ...prevState,\n [mediaQuery.flag]: e.matches,\n }));\n }\n });\n },\n [theme],\n );\n\n useEffect(() => {\n prepareMediaQueries();\n\n return () => {\n allMediaQueries.forEach((mediaQuery) => mediaQuery.ref.current?.remove());\n };\n }, []);\n\n return state;\n}\n"],"mappings":";AACA,IAAAA,MAAA,GAAAC,OAAA;;AAEA,IAAAC,~~yBAAA~~,GAAAD,OAAA~~;AACA,IAAAE,aAAA,GAAAF,OAAA~~;;;AAGA,~~IAAAG~~,uBAAA,~~GAAAH~~,OAAA;;AAEO,~~SAASI~~,mBAAmBA,CAAAC,KAAA;;AAEC,KAAAC,IAAA,GAAAD,KAAA,cAAJ,CAAC,CAAC,GAAAA,KAAA,CADhCE,kBAAkB,GAAAD,IAAA,CAAlBC,kBAAkB;EAElB,IAAMC,KAAK,GAAG,IAAAC,iBAAU,EAACC,0BAAY,CAAC~~;EACtC,IAAMC,YAAY,GAAG,IAAAC,mCAAS,EAAC,CAAC~~;;~~EAEhC~~,IAAMC,eAAe,GAAGC,MAAM,CAACC,OAAO,KAAAC,SAAA,CAAAC,OAAA;IACpCC,QAAQ,~~EAAEV~~,KAAK,~~CAACW~~,gBAAgB;~~EAC7BZ~~,kBAAkB;EACtB,CAAC,~~CAACa~~,GAAG,CAAC,UAAAC,KAAA,OAAEC,GAAG,GAAAD,KAAA,IAAEE,KAAK,GAAAF,KAAA,WAAO;MACxBG,IAAI,EAAEF,GAAG;MACTG,KAAK,EAAEF,KAAK;MACZG,GAAG,eAAE,IAAAC,gBAAS,EAAC;IACjB,CAAC,EAAC,CAAC;;EAEH,IAAMC,mBAAmB,GAAG,SAAtBA,mBAAmBA,CAAA,EAAmC;IAC1D,OAAOf,eAAe,CAACgB,MAAM;MAC3B,UAACC,MAAM,EAAEC,UAAU,OAAAC,cAAA~~;UACjBlB~~,MAAM,CAACmB,MAAM,CAACH,MAAM,GAAAE,cAAA,OAAAA,cAAA,CAAKD,UAAU,CAACP,IAAI,IAAG,IAAAU,oCAAY,~~EAACvB~~,~~YAAY,EAAEoB,~~UAAU,CAACN,KAAK,CAAC,EAAAO,cAAA,CAAE,CAAC;~~MAC5F~~,CAAC;IACH,CAAC;EACH,CAAC;;EAED,IAAAG,SAAA,GAA0B,IAAAC,eAAQ,EAACR,mBAAmB,CAAC,CAAC,CAAC,CAAlDS,KAAK,GAAAF,SAAA,IAAEG,QAAQ,GAAAH,SAAA;;EAEtB,IAAMI,mBAAmB,GAAG,IAAAC,kBAAW,EAAC,YAAM;IAC5C,IAAI,~~CAAChC~~,KAAK,EAAE;MACV;IACF;;~~IAEAK~~,eAAe,CAAC4B,OAAO;MACrB,UAACV,UAAU;UACRA,UAAU,CAACL,GAAG,CAACgB,OAAO,GAAG,IAAAC,mDAA2B~~;YACnDhC~~,~~YAAY;YACZoB~~,UAAU,CAACN,KAAK~~;YAChBmB;UACF~~,CAAC;~~IACL~~,CAAC;;IAED;IACA,IAAMC,YAAY,GAAGjB,mBAAmB,CAAC,CAAC;IAC1C,IAAMkB,eAAe,GAAGhC,MAAM,CAACC,OAAO,CAAC8B,YAAY,CAAC,CAACE,IAAI,CAAC,UAAAC,KAAA,OAAE1B,GAAG,GAAA0B,KAAA,IAAEzB,KAAK,GAAAyB,KAAA,WAAMX,KAAK,CAACf,GAAG,CAAC,KAAKC,KAAK,GAAC;;IAEjG,IAAIuB,eAAe,EAAE;MACnBR,QAAQ,CAACO,YAAY,CAAC;IACxB;EACF,CAAC,EAAE,~~CAACrC~~,KAAK,CAAC,CAAC;;EAEX,~~IAAMoC~~,wBAAwB,GAAG,IAAAJ,kBAAW;IAC1C,UAACS,CAAsB,EAAK;MAC1B,IAAI,~~CAACzC~~,KAAK,EAAE;QACV;MACF;;~~MAEAK~~,eAAe,CAAC4B,OAAO,CAAC,UAACV,UAAU,EAAK;QACtC,IAAIkB,CAAC,CAACC,KAAK,KAAKnB,UAAU,CAACN,KAAK,EAAE;UAChCa,QAAQ,CAAC,UAACa,SAAmC,OAAAC,SAAA,YAAApC,SAAA,CAAAC,OAAA;YACxCkC,SAAS,GAAAC,SAAA,OAAAA,SAAA;YACXrB,UAAU,CAACP,IAAI,IAAGyB,CAAC,CAACI,OAAO,EAAAD,SAAA;UAC5B,CAAC;QACL;MACF,CAAC,CAAC;IACJ,CAAC;IACD,~~CAAC5C~~,KAAK;EACR,CAAC;;EAED,~~IAAA8C~~,gBAAS,EAAC,YAAM;IACdf,mBAAmB,CAAC,CAAC;;IAErB,OAAO,YAAM;MACX1B,eAAe,CAAC4B,OAAO,CAAC,UAACV,UAAU,OAAAwB,qBAAA,SAAAA,qBAAA,GAAKxB,UAAU,CAACL,GAAG,CAACgB,OAAO,qBAAtBa,qBAAA,CAAwBC,MAAM,CAAC,CAAC,GAAC;IAC3E,CAAC;EACH,CAAC,EAAE,EAAE,CAAC;;EAEN,OAAOnB,KAAK;AACd","ignoreList":[]}
1	+ {"version":3,"names":["_react","require","_ThemeContext","_ResponsiveLayoutEvents","useResponsiveLayout","_temp","_ref","customMediaQueries","theme","useContext","ThemeContext","allMediaQueries","Object","entries","_extends3","default","isMobile","mobileMediaQuery","map","_ref2","key","value","flag","query","ref","createRef","getLayoutFromGlobal","reduce","result","mediaQuery","_Object$assign","assign","checkMatches","_useState","useState","state","setState","prepareMediaQueries","useCallback","forEach","current","addResponsiveLayoutListener","checkLayoutsMediaQueries","globalLayout","hasChangedQuery","find","_ref3","e","media","prevState","_extends2","matches","useEffect","_mediaQuery$ref$curre","remove"],"sources":["useResponsiveLayout.ts"],"sourcesContent":["import type React from 'react';\nimport { createRef, useCallback, useContext, useEffect, useState } from 'react';\n\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\n\nimport type { EmptyObject, MediaQueriesType, ResponsiveLayoutFlags, ResponsiveLayoutOptions } from './types';\nimport { addResponsiveLayoutListener, checkMatches } from './ResponsiveLayoutEvents';\n\nexport function useResponsiveLayout<T extends MediaQueriesType = EmptyObject>({\n customMediaQueries,\n}: ResponsiveLayoutOptions<T> = {}) {\n const theme = useContext(ThemeContext);\n\n const allMediaQueries = Object.entries({\n isMobile: theme.mobileMediaQuery,\n ...customMediaQueries,\n }).map(([key, value]) => ({\n flag: key,\n query: value,\n ref: createRef() as React.MutableRefObject<{ remove: () => void } \| null>,\n }));\n\n const getLayoutFromGlobal = (): ResponsiveLayoutFlags<T> => {\n return allMediaQueries.reduce(\n (result, mediaQuery) => Object.assign(result, { [mediaQuery.flag]: checkMatches(mediaQuery.query) }),\n {},\n ) as ResponsiveLayoutFlags<T>;\n };\n\n const [state, setState] = useState(getLayoutFromGlobal());\n\n const prepareMediaQueries = useCallback(() => {\n if (!theme) {\n return;\n }\n\n allMediaQueries.forEach(\n (mediaQuery) =>\n (mediaQuery.ref.current = addResponsiveLayoutListener(mediaQuery.query, checkLayoutsMediaQueries)),\n );\n\n // Checking for SSR use case\n const globalLayout = getLayoutFromGlobal();\n const hasChangedQuery = Object.entries(globalLayout).find(([key, value]) => state[key] !== value);\n\n if (hasChangedQuery) {\n setState(globalLayout);\n }\n }, [theme]);\n\n const checkLayoutsMediaQueries = useCallback(\n (e: MediaQueryListEvent) => {\n if (!theme) {\n return;\n }\n\n allMediaQueries.forEach((mediaQuery) => {\n if (e.media === mediaQuery.query) {\n setState((prevState: ResponsiveLayoutFlags<T>) => ({\n ...prevState,\n [mediaQuery.flag]: e.matches,\n }));\n }\n });\n },\n [theme],\n );\n\n useEffect(() => {\n prepareMediaQueries();\n\n return () => {\n allMediaQueries.forEach((mediaQuery) => mediaQuery.ref.current?.remove());\n };\n }, []);\n\n return state;\n}\n"],"mappings":"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","ignoreList":[]}

package/cjs/components/ScrollContainer/ScrollBar.d.ts CHANGED Viewed

@@ -30,9 +30,6 @@ export interface ScrollBarProps {
 export declare class ScrollBar extends React.Component<ScrollBarProps, ScrollBarState> {
     private inner;
     private containerRef;
-    private globalObject;
-    private cx;
-    private styles;
     private theme;
     node: Nullable<HTMLElement>;
     state: ScrollBarState;

package/cjs/components/ScrollContainer/ScrollBar.js CHANGED Viewed

@@ -1,11 +1,10 @@
 "use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.ScrollBar = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _react = _interopRequireDefault(require("react"));
-var _RenderEnvironmentContext = require("../../lib/theming/RenderEnvironmentContext");
+var _globalObject = require("@skbkontur/global-object");
 var _ThemeContext = require("../../lib/theming/ThemeContext");
+var _Emotion = require("../../lib/theming/Emotion");
 var _isInstanceOf = require("../../lib/isInstanceOf");
 var _ScrollContainer = require("./ScrollContainer.constants");
@@ -54,9 +53,6 @@ ScrollBar = exports.ScrollBar = /*#__PURE__*/function (_React$Component) {functi
     state = (0, _extends2.default)({},
     _ScrollContainer.defaultScrollbarState);_this.
@@ -80,17 +76,7 @@ ScrollBar = exports.ScrollBar = /*#__PURE__*/function (_React$Component) {functi
-    renderMain = function () {var _this$cx, _inlineStyles;
+    renderMain = function () {var _cx, _inlineStyles;
       var state = _this.state;
       var props = _this.props;
@@ -100,9 +86,9 @@ ScrollBar = exports.ScrollBar = /*#__PURE__*/function (_React$Component) {functi
       var _scrollSizeParameters = _ScrollContainer.scrollSizeParametersNames[_this.props.axis],customScrollPos = _scrollSizeParameters.customScrollPos,customScrollSize = _scrollSizeParameters.customScrollSize;
-      var classNames = _this.cx(props.className, _this.styles.scrollBar(_this.theme), _this.scrollBarStyles, (_this$cx = {}, _this$cx[
-      _this.styles.scrollBarInvert(_this.theme)] = props.invert, _this$cx[
-      _this.styles.visibleScrollBar()] = props.isVisible, _this$cx)
+      var classNames = (0, _Emotion.cx)(props.className, _ScrollContainer2.styles.scrollBar(_this.theme), _this.scrollBarStyles, (_cx = {}, _cx[
+      _ScrollContainer2.styles.scrollBarInvert(_this.theme)] = props.invert, _cx[
+      _ScrollContainer2.styles.visibleScrollBar()] = props.isVisible, _cx)
       );
       var inlineStyles = (_inlineStyles = {}, _inlineStyles[
@@ -217,7 +203,7 @@ ScrollBar = exports.ScrollBar = /*#__PURE__*/function (_React$Component) {functi
       var _scrollSizeParameters2 = _ScrollContainer.scrollSizeParametersNames[_this.props.axis],offset = _scrollSizeParameters2.offset,size = _scrollSizeParameters2.size,pos = _scrollSizeParameters2.pos,coord = _scrollSizeParameters2.coord;
       var initialCoord = event[coord];
-      var target = _this.globalObject.document;
+      var target = _globalObject.globalObject.document;
       var initialScrollPos = _this.inner[pos];
       var state = _this.state;
@@ -261,7 +247,7 @@ ScrollBar = exports.ScrollBar = /*#__PURE__*/function (_React$Component) {functi
     };_this.
     handleScrollWheel = function (event, axis) {
-      if (!_this.inner || !(0, _isInstanceOf.isInstanceOf)(event, _this.globalObject.WheelEvent) || axis === 'x' && !event.shiftKey) {
+      if (!_this.inner || !(0, _isInstanceOf.isInstanceOf)(event, _globalObject.globalObject.WheelEvent) || axis === 'x' && !event.shiftKey) {
         return;
       }
@@ -297,4 +283,4 @@ ScrollBar = exports.ScrollBar = /*#__PURE__*/function (_React$Component) {functi
       }
       return 'middle';
-    };return _this;}(0, _inheritsLoose2.default)(ScrollBar, _React$Component);var _proto = ScrollBar.prototype;_proto.componentDidMount = function componentDidMount() {this.reflow();};_proto.componentDidUpdate = function componentDidUpdate() {this.reflow();};_proto.render = function render() {var _this2 = this;return /*#__PURE__*/_react.default.createElement(_RenderEnvironmentContext.RenderEnvironmentContext.Consumer, null, function (_ref) {var globalObject = _ref.globalObject,emotion = _ref.emotion;_this2.globalObject = globalObject;_this2.cx = emotion.cx;_this2.styles = (0, _ScrollContainer2.getStyles)(emotion);return /*#__PURE__*/_react.default.createElement(_ThemeContext.ThemeContext.Consumer, null, function (theme) {_this2.theme = theme;return _this2.renderMain();});});};_proto.setHover = function setHover(hover) {if (this.state.active && this.state.hover !== hover) {this.setState((0, _extends2.default)({}, this.state, { hover: hover }));}};_proto.getHover = function getHover() {return this.state.hover;};return (0, _createClass2.default)(ScrollBar, [{ key: "scrollBarState", get: function get() {return this.state.scrollState;} }, { key: "scrollBarStyles", get: function get() {var _this$cx3;var state = this.state;if (this.props.axis === 'x') {var _this$cx2;return this.cx(this.styles.scrollBarX(this.theme), _ScrollContainer2.globalClasses.scrollbarX, (_this$cx2 = {}, _this$cx2[this.styles.scrollBarXHover(this.theme)] = state.hover || state.scrollingByMouseDrag, _this$cx2));}return this.cx(this.styles.scrollBarY(this.theme), _ScrollContainer2.globalClasses.scrollbarY, (_this$cx3 = {}, _this$cx3[this.styles.scrollBarYHover(this.theme)] = state.hover || state.scrollingByMouseDrag, _this$cx3));} }, { key: "scrollBarContainerClassNames", get: function get() {var axis = this.props.axis;if (axis === 'x') {return this.cx(_ScrollContainer2.globalClasses.scrollbarContainerX, this.styles.scrollBarContainerX(this.theme));}return this.cx(_ScrollContainer2.globalClasses.scrollbarContainerY, this.styles.scrollBarContainerY());} }]);}(_react.default.Component);
+    };return _this;}(0, _inheritsLoose2.default)(ScrollBar, _React$Component);var _proto = ScrollBar.prototype;_proto.componentDidMount = function componentDidMount() {this.reflow();};_proto.componentDidUpdate = function componentDidUpdate() {this.reflow();};_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.setHover = function setHover(hover) {if (this.state.active && this.state.hover !== hover) {this.setState((0, _extends2.default)({}, this.state, { hover: hover }));}};_proto.getHover = function getHover() {return this.state.hover;};return (0, _createClass2.default)(ScrollBar, [{ key: "scrollBarState", get: function get() {return this.state.scrollState;} }, { key: "scrollBarStyles", get: function get() {var _cx3;var state = this.state;if (this.props.axis === 'x') {var _cx2;return (0, _Emotion.cx)(_ScrollContainer2.styles.scrollBarX(this.theme), _ScrollContainer2.globalClasses.scrollbarX, (_cx2 = {}, _cx2[_ScrollContainer2.styles.scrollBarXHover(this.theme)] = state.hover || state.scrollingByMouseDrag, _cx2));}return (0, _Emotion.cx)(_ScrollContainer2.styles.scrollBarY(this.theme), _ScrollContainer2.globalClasses.scrollbarY, (_cx3 = {}, _cx3[_ScrollContainer2.styles.scrollBarYHover(this.theme)] = state.hover || state.scrollingByMouseDrag, _cx3));} }, { key: "scrollBarContainerClassNames", get: function get() {var axis = this.props.axis;if (axis === 'x') {return (0, _Emotion.cx)(_ScrollContainer2.globalClasses.scrollbarContainerX, _ScrollContainer2.styles.scrollBarContainerX(this.theme));}return (0, _Emotion.cx)(_ScrollContainer2.globalClasses.scrollbarContainerY, _ScrollContainer2.styles.scrollBarContainerY());} }]);}(_react.default.Component);