@skbkontur/react-ui 6.0.0 → 6.0.1-cd7d7.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/Tooltip/Tooltip.js +5 -6
- package/components/Tooltip/Tooltip.js.map +1 -1
- package/internal/FocusTrap/FocusTrap.d.ts +1 -0
- package/internal/FocusTrap/FocusTrap.js +6 -6
- package/internal/FocusTrap/FocusTrap.js.map +1 -1
- package/internal/Popup/Popup.d.ts +2 -0
- package/internal/Popup/Popup.js +41 -13
- package/internal/Popup/Popup.js.map +1 -1
- package/internal/Popup/PopupHelper.d.ts +4 -2
- package/internal/Popup/PopupHelper.js +10 -5
- package/internal/Popup/PopupHelper.js.map +1 -1
- package/internal/RenderContainer/RenderContainer.d.ts +4 -0
- package/internal/RenderContainer/RenderContainer.js +52 -5
- package/internal/RenderContainer/RenderContainer.js.map +1 -1
- package/internal/RenderLayer/RenderLayer.d.ts +1 -0
- package/internal/RenderLayer/RenderLayer.js +5 -7
- package/internal/RenderLayer/RenderLayer.js.map +1 -1
- package/lib/listenFocusOutside.d.ts +2 -0
- package/lib/listenFocusOutside.js +19 -2
- package/lib/listenFocusOutside.js.map +1 -1
- package/lib/renderEnvironment/RenderEnvironmentContext.d.ts +5 -0
- package/lib/renderEnvironment/RenderEnvironmentContext.js +17 -11
- package/lib/renderEnvironment/RenderEnvironmentContext.js.map +1 -1
- package/lib/shadowDom/isShadowRoot.d.ts +1 -0
- package/lib/shadowDom/isShadowRoot.js +2 -0
- package/lib/shadowDom/isShadowRoot.js.map +1 -0
- package/lib/theming/Emotion.d.ts +27 -1
- package/lib/theming/Emotion.js +20 -5
- package/lib/theming/Emotion.js.map +1 -1
- package/package.json +1 -1
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RenderContainer.js","sourceRoot":"","sources":["../../../internal/RenderContainer/RenderContainer.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\n\nimport type { TGetRootNode } from '../../lib/rootNode/rootNodeDecorator.js';\nimport { RenderEnvironmentContext } from '../../lib/renderEnvironment/index.js';\nimport type { RenderEnvironmentContextType } from '../../lib/renderEnvironment/index.js';\nimport type { Nullable } from '../../typings/utility-types.js';\nimport { getRandomID } from '../../lib/utils.js';\nimport { Upgrade } from '../../lib/Upgrades.js';\nimport { callChildRef } from '../../lib/callChildRef/callChildRef.js';\n\nimport { RenderInnerContainer } from './RenderInnerContainer.js';\nimport type { RenderContainerProps } from './RenderContainerTypes.js';\n\ninterface GlobalWithReactTesting {\n ReactTesting?: any;\n}\n\nexport const PORTAL_INLET_ATTR = 'data-render-container-id';\nexport const PORTAL_OUTLET_ATTR = 'data-rendered-container-id';\n\nexport class RenderContainer extends React.Component<RenderContainerProps> {\n public static __KONTUR_REACT_UI__ = 'RenderContainer';\n public static displayName = 'RenderContainer';\n\n public static contextType = RenderEnvironmentContext;\n public context!: RenderEnvironmentContextType;\n\n private static getRootId = () => getRandomID();\n // see #2873 and #2895\n public static readonly defaultRootNode = null;\n private domContainer: Nullable<HTMLElement> = RenderContainer.defaultRootNode;\n\n private readonly rootId: string = RenderContainer.getRootId();\n\n public getRootNode: TGetRootNode = (): Nullable<Element> => this.domContainer;\n\n public shouldComponentUpdate(nextProps: RenderContainerProps) {\n if (!this.props.children && nextProps.children) {\n this.mountContainer();\n }\n if (this.props.children && !nextProps.children) {\n this.unmountContainer();\n }\n return true;\n }\n\n public componentWillUnmount() {\n this.destroyContainer();\n }\n\n public render() {\n if (this.props.children) {\n this.mountContainer();\n }\n\n return <RenderInnerContainer {...this.props} domContainer={this.domContainer} rootId={this.rootId} />;\n }\n\n private createContainer() {\n const domContainer = this.context.globalObject.document?.createElement('div');\n if (domContainer) {\n domContainer.setAttribute('class', Upgrade.getSpecificityClassName());\n domContainer.setAttribute(PORTAL_OUTLET_ATTR, `${this.rootId}`);\n this.domContainer = domContainer;\n }\n }\n\n private mountContainer() {\n const globalWithReactTesting = this.context.globalObject as GlobalWithReactTesting;\n\n if (!this.domContainer) {\n this.createContainer();\n }\n if (this.domContainer && this.domContainer.parentNode !== this.context.globalObject.document?.body) {\n this.context.globalObject.document?.body.appendChild(this.domContainer);\n\n if (this.props.containerRef) {\n callChildRef(this.props.containerRef, this.domContainer);\n }\n if (globalWithReactTesting.ReactTesting) {\n globalWithReactTesting.ReactTesting.addRenderContainer(this.rootId, this);\n }\n }\n }\n\n private destroyContainer() {\n if (this.domContainer) {\n this.unmountContainer();\n this.domContainer = null;\n }\n }\n\n private unmountContainer() {\n if (this.domContainer && this.domContainer.parentNode) {\n this.domContainer.parentNode.removeChild(this.domContainer);\n\n if (this.props.containerRef) {\n callChildRef(this.props.containerRef, null);\n }\n\n const globalWithReactTesting = this.context.globalObject as GlobalWithReactTesting;\n if (globalWithReactTesting.ReactTesting) {\n globalWithReactTesting.ReactTesting.removeRenderContainer(this.rootId);\n }\n }\n }\n}\n"]}
|
|
1
|
+
{"version":3,"file":"RenderContainer.js","sourceRoot":"","sources":["../../../internal/RenderContainer/RenderContainer.tsx"],"names":[],"mappings":"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","sourcesContent":["import React from 'react';\nimport debounce from 'lodash.debounce';\n\nimport type { TGetRootNode } from '../../lib/rootNode/rootNodeDecorator.js';\nimport { RenderEnvironmentContext } from '../../lib/renderEnvironment/index.js';\nimport type { PopupStrategy, RenderEnvironmentContextType } from '../../lib/renderEnvironment/index.js';\nimport type { Nullable } from '../../typings/utility-types.js';\nimport { getRandomID } from '../../lib/utils.js';\nimport { Upgrade } from '../../lib/Upgrades.js';\nimport { callChildRef } from '../../lib/callChildRef/callChildRef.js';\nimport { PopupConsumer } from '../../lib/theming/Emotion.js';\nimport { isShadowRoot } from '../../lib/shadowDom/isShadowRoot.js';\n\nimport { RenderInnerContainer } from './RenderInnerContainer.js';\nimport type { RenderContainerProps } from './RenderContainerTypes.js';\n\ninterface GlobalWithReactTesting {\n ReactTesting?: any;\n}\n\nexport const PORTAL_INLET_ATTR = 'data-render-container-id';\nexport const PORTAL_OUTLET_ATTR = 'data-rendered-container-id';\n\nexport class RenderContainer extends React.Component<RenderContainerProps> {\n public static __KONTUR_REACT_UI__ = 'RenderContainer';\n public static displayName = 'RenderContainer';\n\n public static contextType = RenderEnvironmentContext;\n public context!: RenderEnvironmentContextType;\n\n private static getRootId = () => getRandomID();\n // see #2873 and #2895\n public static readonly defaultRootNode = null;\n private domContainer: Nullable<HTMLElement> = RenderContainer.defaultRootNode;\n private popupStrategy!: PopupStrategy;\n\n private readonly rootId: string = RenderContainer.getRootId();\n\n public getRootNode: TGetRootNode = (): Nullable<Element> => this.domContainer;\n\n public shouldComponentUpdate(nextProps: RenderContainerProps) {\n if (!this.props.children && nextProps.children) {\n this.mountContainer();\n }\n if (this.props.children && !nextProps.children) {\n this.unmountContainer();\n }\n return true;\n }\n\n public componentWillUnmount() {\n this.destroyContainer();\n if (this.context.globalObject) {\n this.context.globalObject.removeEventListener?.('scroll', this.reflowContainer);\n this.context.globalObject.removeEventListener?.('resize', this.reflowContainer);\n }\n }\n\n private reflowContainer = () => {\n const root = this.context.emotion.sheet.container.getRootNode() as ShadowRoot | Document;\n const globalObject = this.context.globalObject;\n if (isShadowRoot(root) && this.domContainer && globalObject) {\n this.domContainer.setAttribute(\n 'style',\n `position: fixed;z-index: 2;\n margin-top: -${root.host.getBoundingClientRect().height + (globalObject.scrollY ?? 0)}px;\n margin-left: -${this.context.globalObject.scrollX}px;\n `,\n );\n }\n };\n\n public render() {\n return (\n <PopupConsumer>\n {({ popupStrategy }) => {\n this.popupStrategy = popupStrategy ?? 'auto';\n return this.renderMain();\n }}\n </PopupConsumer>\n );\n }\n\n private debouncedReflowContainer = debounce(this.reflowContainer, 32);\n\n public renderMain() {\n if (this.props.children) {\n this.mountContainer();\n }\n\n return <RenderInnerContainer {...this.props} domContainer={this.domContainer} rootId={this.rootId} />;\n }\n\n private createContainer() {\n const globalObject = this.context.globalObject;\n const domContainer = globalObject?.document?.createElement('div');\n if (domContainer) {\n domContainer.setAttribute('class', Upgrade.getSpecificityClassName());\n\n const root = this.context.emotion.sheet.container.getRootNode() as ShadowRoot | Document;\n if (isShadowRoot(root) && globalObject) {\n const rootHeight = root.host.getBoundingClientRect().height;\n switch (this.popupStrategy) {\n case 'relative':\n domContainer.setAttribute('style', `position: relative; top: -${rootHeight}px`);\n break;\n case 'auto':\n case 'absolute':\n domContainer.setAttribute('style', `position: absolute; z-index: 2; margin-top: -${rootHeight}px;`);\n break;\n case 'fixed': {\n globalObject.addEventListener?.('scroll', this.debouncedReflowContainer);\n globalObject.addEventListener?.('resize', this.debouncedReflowContainer);\n domContainer.setAttribute(\n 'style',\n `position: fixed;z-index: 2;\n margin-top: -${rootHeight + (globalObject.scrollY ?? 0)}px;\n margin-left: -${globalObject.scrollX}px;\n `,\n );\n break;\n }\n }\n }\n\n domContainer.setAttribute(PORTAL_OUTLET_ATTR, `${this.rootId}`);\n this.domContainer = domContainer;\n }\n }\n\n private mountContainer() {\n const globalWithReactTesting = this.context.globalObject as GlobalWithReactTesting;\n\n if (!this.domContainer) {\n this.createContainer();\n }\n\n const stylesRoot = this.context.emotion.sheet?.container?.getRootNode();\n const rootElement = isShadowRoot(stylesRoot) && stylesRoot ? stylesRoot : this.context.globalObject.document?.body;\n\n if (this.domContainer && this.domContainer.parentNode !== rootElement) {\n rootElement?.appendChild(this.domContainer);\n\n if (this.props.containerRef) {\n callChildRef(this.props.containerRef, this.domContainer);\n }\n if (globalWithReactTesting.ReactTesting) {\n globalWithReactTesting.ReactTesting.addRenderContainer(this.rootId, this);\n }\n }\n }\n\n private destroyContainer() {\n if (this.domContainer) {\n this.unmountContainer();\n this.domContainer = null;\n }\n }\n\n private unmountContainer() {\n if (this.domContainer && this.domContainer.parentNode) {\n this.domContainer.parentNode.removeChild(this.domContainer);\n\n if (this.props.containerRef) {\n callChildRef(this.props.containerRef, null);\n }\n\n const globalWithReactTesting = this.context.globalObject as GlobalWithReactTesting;\n if (globalWithReactTesting.ReactTesting) {\n globalWithReactTesting.ReactTesting.removeRenderContainer(this.rootId);\n }\n }\n }\n}\n"]}
|
|
@@ -15,6 +15,7 @@ export declare class RenderLayer extends React.Component<RenderLayerProps> {
|
|
|
15
15
|
static displayName: string;
|
|
16
16
|
static defaultProps: DefaultProps;
|
|
17
17
|
private globalObject;
|
|
18
|
+
private emotion;
|
|
18
19
|
private getProps;
|
|
19
20
|
private focusOutsideListenerToken;
|
|
20
21
|
getRootNode: TGetRootNode;
|
|
@@ -31,11 +31,11 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key,
|
|
|
31
31
|
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
32
32
|
};
|
|
33
33
|
import React from 'react';
|
|
34
|
-
import {
|
|
34
|
+
import { isShadowRoot } from '../../lib/shadowDom/isShadowRoot.js';
|
|
35
|
+
import { listen as listenFocusOutside, clickOutsideContent } from '../../lib/listenFocusOutside.js';
|
|
35
36
|
import { CommonWrapper } from '../CommonWrapper/index.js';
|
|
36
37
|
import { getRootNode, rootNode } from '../../lib/rootNode/index.js';
|
|
37
38
|
import { createPropsGetter } from '../../lib/createPropsGetter.js';
|
|
38
|
-
import { isInstanceOf } from '../../lib/isInstanceOf.js';
|
|
39
39
|
import { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';
|
|
40
40
|
var RenderLayer = /** @class */ (function (_super) {
|
|
41
41
|
__extends(RenderLayer, _super);
|
|
@@ -49,12 +49,10 @@ var RenderLayer = /** @class */ (function (_super) {
|
|
|
49
49
|
}
|
|
50
50
|
};
|
|
51
51
|
_this.handleNativeDocClick = function (event) {
|
|
52
|
-
var target = event.target || event.srcElement;
|
|
53
52
|
var node = _this.getAnchorNode();
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
if (_this.props.onClickOutside) {
|
|
53
|
+
var isShadowRootElement = isShadowRoot(_this.emotion.sheet.container.getRootNode());
|
|
54
|
+
var clickOutsideOfContent = clickOutsideContent(event, node, isShadowRootElement, _this.globalObject);
|
|
55
|
+
if (clickOutsideOfContent && _this.props.onClickOutside) {
|
|
58
56
|
_this.props.onClickOutside(event);
|
|
59
57
|
}
|
|
60
58
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RenderLayer.js","sourceRoot":"","sources":["../../../internal/RenderLayer/RenderLayer.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAGxC,OAAO,EAAE,MAAM,IAAI,kBAAkB,EAAE
|
|
1
|
+
{"version":3,"file":"RenderLayer.js","sourceRoot":"","sources":["../../../internal/RenderLayer/RenderLayer.tsx"],"names":[],"mappings":"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","sourcesContent":["import React, { type JSX } from 'react';\nimport type { Emotion } from '@emotion/css/create-instance';\n\nimport { isShadowRoot } from '../../lib/shadowDom/isShadowRoot.js';\nimport type { GlobalObject } from '../../lib/globalObject.js';\nimport { listen as listenFocusOutside, clickOutsideContent } from '../../lib/listenFocusOutside.js';\nimport type { CommonProps } from '../CommonWrapper/index.js';\nimport { CommonWrapper } from '../CommonWrapper/index.js';\nimport type { TGetRootNode, TSetRootNode } from '../../lib/rootNode/index.js';\nimport { getRootNode, rootNode } from '../../lib/rootNode/index.js';\nimport type { Nullable } from '../../typings/utility-types.js';\nimport { createPropsGetter } from '../../lib/createPropsGetter.js';\nimport { withRenderEnvironment } from '../../lib/renderEnvironment/index.js';\n\nexport interface RenderLayerProps extends CommonProps {\n children: JSX.Element;\n onClickOutside?: (e: Event) => void;\n onFocusOutside?: (e: Event) => void;\n active?: boolean;\n getAnchorElement?: () => Nullable<Element>;\n}\n\ntype DefaultProps = Required<Pick<RenderLayerProps, 'active'>>;\n\n@withRenderEnvironment\n@rootNode\nexport class RenderLayer extends React.Component<RenderLayerProps> {\n public static __KONTUR_REACT_UI__ = 'RenderLayer';\n public static displayName = 'RenderLayer';\n\n public static defaultProps: DefaultProps = {\n active: true,\n };\n\n private globalObject!: GlobalObject;\n private emotion!: Emotion;\n private getProps = createPropsGetter(RenderLayer.defaultProps);\n\n private focusOutsideListenerToken: {\n remove: () => void;\n } | null = null;\n public getRootNode!: TGetRootNode;\n private setRootNode!: TSetRootNode;\n\n public componentDidMount() {\n if (this.getProps().active) {\n this.attachListeners();\n }\n }\n\n public componentDidUpdate(prevProps: RenderLayerProps) {\n const { active } = this.getProps();\n\n if (!prevProps.active && active) {\n this.attachListeners();\n }\n if (prevProps.active && !active) {\n this.detachListeners();\n }\n }\n\n public componentWillUnmount() {\n if (this.getProps().active) {\n this.detachListeners();\n }\n }\n\n public render() {\n return (\n <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n {React.Children.only(this.props.children)}\n </CommonWrapper>\n );\n }\n\n private getAnchorNode(): Nullable<Element> {\n const { getAnchorElement } = this.props;\n return getAnchorElement ? getAnchorElement() : getRootNode(this);\n }\n\n private attachListeners() {\n const node = this.getAnchorNode();\n if (!node) {\n return;\n }\n\n this.focusOutsideListenerToken = listenFocusOutside(() => [node], this.handleFocusOutside, this.globalObject);\n this.globalObject.addEventListener?.('blur', this.handleFocusOutside);\n this.globalObject.document?.addEventListener(\n 'ontouchstart' in this.globalObject.document.documentElement &&\n 'onpointerup' in this.globalObject.document.documentElement\n ? 'pointerup'\n : 'mousedown',\n this.handleNativeDocClick,\n );\n }\n\n private detachListeners() {\n if (this.focusOutsideListenerToken) {\n this.focusOutsideListenerToken.remove();\n this.focusOutsideListenerToken = null;\n }\n\n this.globalObject.removeEventListener?.('blur', this.handleFocusOutside);\n this.globalObject.document?.removeEventListener(\n 'ontouchstart' in this.globalObject.document.documentElement &&\n 'onpointerup' in this.globalObject.document.documentElement\n ? 'pointerup'\n : 'mousedown',\n this.handleNativeDocClick,\n );\n }\n\n private handleFocusOutside = (event: Event) => {\n if (this.props.onFocusOutside) {\n this.props.onFocusOutside(event);\n }\n };\n\n private handleNativeDocClick = (event: Event) => {\n const node = this.getAnchorNode();\n const isShadowRootElement = isShadowRoot(this.emotion.sheet.container.getRootNode());\n const clickOutsideOfContent = clickOutsideContent(event, node, isShadowRootElement, this.globalObject);\n if (clickOutsideOfContent && this.props.onClickOutside) {\n this.props.onClickOutside(event);\n }\n };\n}\n"]}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import type { GlobalObject } from '../lib/globalObject.js';
|
|
2
|
+
import type { Nullable } from '../typings/utility-types.js';
|
|
2
3
|
export declare function containsTargetOrRenderContainer(target: Element): (element: Element) => boolean;
|
|
3
4
|
/**
|
|
4
5
|
* Searches RenderContainer placed in "rootNode" for "node"
|
|
@@ -7,3 +8,4 @@ export declare function findRenderContainer(node: Element, rootNode: Element, co
|
|
|
7
8
|
export declare function listen(elements: Element[] | (() => Element[]), callback: (event: Event) => void, globalObject: GlobalObject): {
|
|
8
9
|
remove(): void;
|
|
9
10
|
};
|
|
11
|
+
export declare function clickOutsideContent(event: Event, node: Nullable<Element>, isShadowRootElement: boolean, globalObject: GlobalObject): boolean;
|
|
@@ -62,7 +62,7 @@ export function containsTargetOrRenderContainer(target) {
|
|
|
62
62
|
* Searches RenderContainer placed in "rootNode" for "node"
|
|
63
63
|
*/
|
|
64
64
|
export function findRenderContainer(node, rootNode, container) {
|
|
65
|
-
var _a, _b, _c;
|
|
65
|
+
var _a, _b, _c, _d;
|
|
66
66
|
var currentNode = node.parentNode;
|
|
67
67
|
var globalObject = getOwnerGlobalObject(node);
|
|
68
68
|
if (!currentNode ||
|
|
@@ -75,7 +75,9 @@ export function findRenderContainer(node, rootNode, container) {
|
|
|
75
75
|
}
|
|
76
76
|
var newContainerId = currentNode.getAttribute(PORTAL_OUTLET_ATTR);
|
|
77
77
|
if (newContainerId) {
|
|
78
|
-
var
|
|
78
|
+
var selector = "[".concat(PORTAL_INLET_ATTR, "~=\"").concat(newContainerId, "\"]");
|
|
79
|
+
var nextNode = ((_c = globalObject.document) === null || _c === void 0 ? void 0 : _c.querySelector(selector)) ||
|
|
80
|
+
((_d = rootNode.getRootNode()) === null || _d === void 0 ? void 0 : _d.querySelector(selector));
|
|
79
81
|
if (!nextNode) {
|
|
80
82
|
warning(false, "Origin node for render container was not found");
|
|
81
83
|
return null;
|
|
@@ -100,4 +102,19 @@ export function listen(elements, callback, globalObject) {
|
|
|
100
102
|
},
|
|
101
103
|
};
|
|
102
104
|
}
|
|
105
|
+
export function clickOutsideContent(event, node, isShadowRootElement, globalObject) {
|
|
106
|
+
if (!node) {
|
|
107
|
+
return false;
|
|
108
|
+
}
|
|
109
|
+
if (isShadowRootElement &&
|
|
110
|
+
((event.composed && event.composedPath().indexOf(node) > -1) ||
|
|
111
|
+
(isInstanceOf(event.target, globalObject.Element) &&
|
|
112
|
+
containsTargetOrRenderContainer(event.composedPath()[0])(node)))) {
|
|
113
|
+
return false;
|
|
114
|
+
}
|
|
115
|
+
else if (isInstanceOf(event.target, globalObject.Element) && containsTargetOrRenderContainer(event.target)(node)) {
|
|
116
|
+
return false;
|
|
117
|
+
}
|
|
118
|
+
return true;
|
|
119
|
+
}
|
|
103
120
|
//# sourceMappingURL=listenFocusOutside.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"listenFocusOutside.js","sourceRoot":"","sources":["../../lib/listenFocusOutside.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,MAAM,WAAW,CAAC;AACjC,OAAO,QAAQ,MAAM,iBAAiB,CAAC;AACvC,OAAO,OAAO,MAAM,SAAS,CAAC;AAE9B,OAAO,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,MAAM,sCAAsC,CAAC;AAC7F,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;
|
|
1
|
+
{"version":3,"file":"listenFocusOutside.js","sourceRoot":"","sources":["../../lib/listenFocusOutside.ts"],"names":[],"mappings":"AAAA,OAAO,QAAQ,MAAM,WAAW,CAAC;AACjC,OAAO,QAAQ,MAAM,iBAAiB,CAAC;AACvC,OAAO,OAAO,MAAM,SAAS,CAAC;AAE9B,OAAO,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,MAAM,sCAAsC,CAAC;AAC7F,OAAO,EAAE,oBAAoB,EAAE,MAAM,wBAAwB,CAAC;AAI9D,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAC;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,aAAa,CAAC;AAOxC,IAAM,QAAQ,GAA+B,EAAE,CAAC;AAChD,IAAM,iBAAiB,GAAG,IAAI,OAAO,EAAgB,CAAC;AAEtD,SAAS,cAAc,CAAC,YAA0B;;IAChD;;;;;;;OAOG;IACH,MAAA,YAAY,CAAC,QAAQ,0CAAE,IAAI,CAAC,gBAAgB,CAC1C,SAAS,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAE,SAAqB,EAC5C,SAAS,CAAC,CAAC,CAAC,QAAQ,CAAC,iBAAiB,EAAE,CAAC,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC,iBAAiB,EAClG,EAAE,OAAO,EAAE,IAAI,EAAE,CAClB,CAAC;AACJ,CAAC;AACD,SAAS,gBAAgB,CAAC,YAA0B;;IAClD,IAAI,iBAAiB,CAAC,GAAG,CAAC,YAAY,CAAC,EAAE,CAAC;QACxC,OAAO;IACT,CAAC;IAED,IAAI,CAAA,MAAA,YAAY,CAAC,QAAQ,0CAAE,UAAU,MAAK,UAAU,EAAE,CAAC;QACrD,cAAc,CAAC,YAAY,CAAC,CAAC;IAC/B,CAAC;SAAM,CAAC;QACN,MAAA,YAAY,CAAC,gBAAgB,6DAAG,MAAM,EAAE,cAAM,OAAA,cAAc,CAAC,YAAY,CAAC,EAA5B,CAA4B,CAAC,CAAC;IAC9E,CAAC;IAED,iBAAiB,CAAC,GAAG,CAAC,YAAY,CAAC,CAAC;AACtC,CAAC;AAED,SAAS,iBAAiB,CAAC,KAAc;IACvC,0BAA0B;IAC1B,IAAM,MAAM,GAAY,CAAC,KAAK,CAAC,MAAM,IAAI,KAAK,CAAC,UAAU,CAAY,CAAC;IAEtE,QAAQ,CAAC,OAAO,CAAC,UAAC,OAAO;QACvB,IAAI,QAAQ,GAAG,OAAO,CAAC,QAAQ,CAAC;QAChC,IAAI,OAAO,QAAQ,KAAK,UAAU,EAAE,CAAC;YACnC,QAAQ,GAAG,QAAQ,EAAE,CAAC;QACxB,CAAC;QAED,IAAI,QAAQ,CAAC,IAAI,CAAC,+BAA+B,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC;YAC3D,OAAO;QACT,CAAC;QACD,QAAQ,CAAC,uBAAuB,CAAC,cAAM,OAAA,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,EAAvB,CAAuB,CAAC,CAAC;IAClE,CAAC,CAAC,CAAC;AACL,CAAC;AAED,MAAM,UAAU,+BAA+B,CAAC,MAAe;IAC7D,OAAO,UAAC,OAAgB;QACtB,IAAI,CAAC,OAAO,EAAE,CAAC;YACb,OAAO,KAAK,CAAC;QACf,CAAC;QACD,IAAI,OAAO,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE,CAAC;YAC7B,OAAO,IAAI,CAAC;QACd,CAAC;QACD,IAAM,SAAS,GAAG,mBAAmB,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;QACvD,OAAO,CAAC,CAAC,SAAS,IAAI,OAAO,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC;IACpD,CAAC,CAAC;AACJ,CAAC;AAED;;GAEG;AACH,MAAM,UAAU,mBAAmB,CAAC,IAAa,EAAE,QAAiB,EAAE,SAAmB;;IACvF,IAAM,WAAW,GAAG,IAAI,CAAC,UAAU,CAAC;IACpC,IAAM,YAAY,GAAG,oBAAoB,CAAC,IAAI,CAAC,CAAC;IAChD,IACE,CAAC,WAAW;QACZ,IAAI,KAAK,QAAQ;QACjB,WAAW,KAAK,QAAQ;QACxB,WAAW,MAAK,MAAA,YAAY,CAAC,QAAQ,0CAAE,IAAI,CAAA;QAC3C,WAAW,MAAK,MAAA,YAAY,CAAC,QAAQ,0CAAE,eAAe,CAAA;QACtD,CAAC,YAAY,CAAC,WAAW,EAAE,YAAY,CAAC,OAAO,CAAC,EAChD,CAAC;QACD,OAAO,SAAS,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC;IACtC,CAAC;IAED,IAAM,cAAc,GAAG,WAAW,CAAC,YAAY,CAAC,kBAAkB,CAAC,CAAC;IACpE,IAAI,cAAc,EAAE,CAAC;QACnB,IAAM,QAAQ,GAAG,WAAI,iBAAiB,iBAAM,cAAc,QAAI,CAAC;QAC/D,IAAM,QAAQ,GACZ,CAAA,MAAA,YAAY,CAAC,QAAQ,0CAAE,aAAa,CAAC,QAAQ,CAAC;aAC9C,MAAC,QAAQ,CAAC,WAAW,EAA4B,0CAAE,aAAa,CAAC,QAAQ,CAAC,CAAA,CAAC;QAE7E,IAAI,CAAC,QAAQ,EAAE,CAAC;YACd,OAAO,CAAC,KAAK,EAAE,gDAAgD,CAAC,CAAC;YACjE,OAAO,IAAI,CAAC;QACd,CAAC;QAED,OAAO,mBAAmB,CAAC,QAAQ,EAAE,QAAQ,EAAE,QAAQ,CAAC,CAAC;IAC3D,CAAC;IAED,OAAO,mBAAmB,CAAC,WAAW,EAAE,QAAQ,EAAE,SAAS,CAAC,CAAC;AAC/D,CAAC;AAED,MAAM,UAAU,MAAM,CACpB,QAAuC,EACvC,QAAgC,EAChC,YAA0B;IAE1B,gBAAgB,CAAC,YAAY,CAAC,CAAC;IAE/B,IAAM,OAAO,GAAG;QACd,QAAQ,UAAA;QACR,QAAQ,UAAA;KACT,CAAC;IACF,QAAQ,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;IAEvB,OAAO;QACL,MAAM;YACJ,IAAM,KAAK,GAAG,QAAQ,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC;YACxC,IAAI,KAAK,GAAG,CAAC,CAAC,EAAE,CAAC;gBACf,QAAQ,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC;YAC5B,CAAC;QACH,CAAC;KACF,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,mBAAmB,CACjC,KAAY,EACZ,IAAuB,EACvB,mBAA4B,EAC5B,YAA0B;IAE1B,IAAI,CAAC,IAAI,EAAE,CAAC;QACV,OAAO,KAAK,CAAC;IACf,CAAC;IAED,IACE,mBAAmB;QACnB,CAAC,CAAC,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,YAAY,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC;YAC1D,CAAC,YAAY,CAAC,KAAK,CAAC,MAAM,EAAE,YAAY,CAAC,OAAO,CAAC;gBAC/C,+BAA+B,CAAC,KAAK,CAAC,YAAY,EAAE,CAAC,CAAC,CAAuB,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,EAC1F,CAAC;QACD,OAAO,KAAK,CAAC;IACf,CAAC;SAAM,IAAI,YAAY,CAAC,KAAK,CAAC,MAAM,EAAE,YAAY,CAAC,OAAO,CAAC,IAAI,+BAA+B,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,IAAI,CAAC,EAAE,CAAC;QACnH,OAAO,KAAK,CAAC;IACf,CAAC;IAED,OAAO,IAAI,CAAC;AACd,CAAC","sourcesContent":["import ReactDOM from 'react-dom';\nimport debounce from 'lodash.debounce';\nimport warning from 'warning';\n\nimport { PORTAL_INLET_ATTR, PORTAL_OUTLET_ATTR } from '../internal/RenderContainer/index.js';\nimport { getOwnerGlobalObject } from '../lib/globalObject.js';\nimport type { GlobalObject } from '../lib/globalObject.js';\nimport type { Nullable } from '../typings/utility-types.js';\n\nimport { isInstanceOf } from './isInstanceOf.js';\nimport { isFirefox } from './client.js';\n\ninterface FocusOutsideEventHandler {\n elements: Element[] | (() => Element[]);\n callback: (event: Event) => void;\n}\n\nconst handlers: FocusOutsideEventHandler[] = [];\nconst listenersAttached = new WeakSet<GlobalObject>();\n\nfunction addHandleEvent(globalObject: GlobalObject) {\n /**\n * Firefox do not supports 'focusin' event.\n * Focus events bubbles multiple time\n * without possibilty to cancell bubbling.\n * Using debounce to capture only first focus event\n * Mozilla Firefix\n * ¯\\_(ツ)_/¯\n */\n globalObject.document?.body.addEventListener(\n isFirefox ? 'focus' : ('focusin' as 'focus'),\n isFirefox ? debounce(handleNativeFocus, 0, { leading: true, trailing: false }) : handleNativeFocus,\n { capture: true },\n );\n}\nfunction addFocusListener(globalObject: GlobalObject) {\n if (listenersAttached.has(globalObject)) {\n return;\n }\n\n if (globalObject.document?.readyState === 'complete') {\n addHandleEvent(globalObject);\n } else {\n globalObject.addEventListener?.('load', () => addHandleEvent(globalObject));\n }\n\n listenersAttached.add(globalObject);\n}\n\nfunction handleNativeFocus(event: UIEvent) {\n // FIXME: not safe casting\n const target: Element = (event.target || event.srcElement) as Element;\n\n handlers.forEach((handler) => {\n let elements = handler.elements;\n if (typeof elements === 'function') {\n elements = elements();\n }\n\n if (elements.some(containsTargetOrRenderContainer(target))) {\n return;\n }\n ReactDOM.unstable_batchedUpdates(() => handler.callback(event));\n });\n}\n\nexport function containsTargetOrRenderContainer(target: Element) {\n return (element: Element): boolean => {\n if (!element) {\n return false;\n }\n if (element.contains(target)) {\n return true;\n }\n const container = findRenderContainer(target, element);\n return !!container && element.contains(container);\n };\n}\n\n/**\n * Searches RenderContainer placed in \"rootNode\" for \"node\"\n */\nexport function findRenderContainer(node: Element, rootNode: Element, container?: Element): Element | null {\n const currentNode = node.parentNode;\n const globalObject = getOwnerGlobalObject(node);\n if (\n !currentNode ||\n node === rootNode ||\n currentNode === rootNode ||\n currentNode === globalObject.document?.body ||\n currentNode === globalObject.document?.documentElement ||\n !isInstanceOf(currentNode, globalObject.Element)\n ) {\n return container ? container : null;\n }\n\n const newContainerId = currentNode.getAttribute(PORTAL_OUTLET_ATTR);\n if (newContainerId) {\n const selector = `[${PORTAL_INLET_ATTR}~=\"${newContainerId}\"]`;\n const nextNode =\n globalObject.document?.querySelector(selector) ||\n (rootNode.getRootNode() as ShadowRoot | Document)?.querySelector(selector);\n\n if (!nextNode) {\n warning(false, `Origin node for render container was not found`);\n return null;\n }\n\n return findRenderContainer(nextNode, rootNode, nextNode);\n }\n\n return findRenderContainer(currentNode, rootNode, container);\n}\n\nexport function listen(\n elements: Element[] | (() => Element[]),\n callback: (event: Event) => void,\n globalObject: GlobalObject,\n): { remove(): void } {\n addFocusListener(globalObject);\n\n const handler = {\n elements,\n callback,\n };\n handlers.push(handler);\n\n return {\n remove() {\n const index = handlers.indexOf(handler);\n if (index > -1) {\n handlers.splice(index, 1);\n }\n },\n };\n}\n\nexport function clickOutsideContent(\n event: Event,\n node: Nullable<Element>,\n isShadowRootElement: boolean,\n globalObject: GlobalObject,\n): boolean {\n if (!node) {\n return false;\n }\n\n if (\n isShadowRootElement &&\n ((event.composed && event.composedPath().indexOf(node) > -1) ||\n (isInstanceOf(event.target, globalObject.Element) &&\n containsTargetOrRenderContainer(event.composedPath()[0] as unknown as Element)(node)))\n ) {\n return false;\n } else if (isInstanceOf(event.target, globalObject.Element) && containsTargetOrRenderContainer(event.target)(node)) {\n return false;\n }\n\n return true;\n}\n"]}
|
|
@@ -6,9 +6,14 @@ export interface RenderEnvironmentContextType {
|
|
|
6
6
|
emotion: Emotion;
|
|
7
7
|
}
|
|
8
8
|
export declare const RenderEnvironmentContext: React.Context<RenderEnvironmentContextType>;
|
|
9
|
+
export type GetOffsetParent = (element?: Node) => HTMLElement | null;
|
|
10
|
+
export type PopupStrategy = 'auto' | 'relative' | 'absolute' | 'fixed';
|
|
9
11
|
interface RenderEnvironmentProviderProps {
|
|
10
12
|
children: React.ReactNode;
|
|
11
13
|
rootNode: HTMLElement;
|
|
14
|
+
getOffsetParent?: GetOffsetParent;
|
|
15
|
+
popupStrategy?: PopupStrategy;
|
|
16
|
+
emotionKey?: string;
|
|
12
17
|
}
|
|
13
18
|
export declare const RenderEnvironmentProvider: React.FC<RenderEnvironmentProviderProps>;
|
|
14
19
|
export declare const useGlobal: () => GlobalObject;
|
|
@@ -1,22 +1,28 @@
|
|
|
1
1
|
var _a;
|
|
2
|
-
import React, { createContext, useContext, useMemo } from 'react';
|
|
2
|
+
import React, { createContext, useContext, useMemo, useState } from 'react';
|
|
3
3
|
import { getOwnerGlobalObject, getSafeWindow } from '../globalObject.js';
|
|
4
|
-
import { getEmotion } from '../theming/Emotion.js';
|
|
4
|
+
import { getEmotion, PopupProvider } from '../theming/Emotion.js';
|
|
5
5
|
var globalObject = getSafeWindow();
|
|
6
6
|
export var RenderEnvironmentContext = createContext({
|
|
7
7
|
globalObject: globalObject,
|
|
8
8
|
emotion: getEmotion({ container: (_a = globalObject.document) === null || _a === void 0 ? void 0 : _a.head }),
|
|
9
9
|
});
|
|
10
10
|
export var RenderEnvironmentProvider = function (_a) {
|
|
11
|
-
var children = _a.children, rootNode = _a.rootNode;
|
|
12
|
-
var
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
}
|
|
19
|
-
|
|
11
|
+
var getOffsetParent = _a.getOffsetParent, popupStrategy = _a.popupStrategy, children = _a.children, rootNode = _a.rootNode, _b = _a.emotionKey, emotionKey = _b === void 0 ? 'react-ui-render-environment' : _b;
|
|
12
|
+
var _c = useState(), emotion = _c[0], setEmotion = _c[1];
|
|
13
|
+
function setRef(container) {
|
|
14
|
+
if (!emotion && container) {
|
|
15
|
+
// NOTE: container может быть globalObject.document?.head; или rootNode;
|
|
16
|
+
setEmotion(getEmotion({ container: container, key: emotionKey }));
|
|
17
|
+
}
|
|
18
|
+
}
|
|
19
|
+
var popupContext = useMemo(function () { return ({ getOffsetParent: getOffsetParent, popupStrategy: popupStrategy }); }, [getOffsetParent, popupStrategy]);
|
|
20
|
+
return (React.createElement(PopupProvider, { value: popupContext },
|
|
21
|
+
React.createElement("div", { ref: setRef }),
|
|
22
|
+
emotion && (React.createElement(RenderEnvironmentContext.Provider, { value: {
|
|
23
|
+
globalObject: getOwnerGlobalObject(rootNode),
|
|
24
|
+
emotion: emotion,
|
|
25
|
+
} }, children))));
|
|
20
26
|
};
|
|
21
27
|
export var useGlobal = function () { return useContext(RenderEnvironmentContext).globalObject; };
|
|
22
28
|
export var useEmotion = function () { return useContext(RenderEnvironmentContext).emotion; };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"RenderEnvironmentContext.js","sourceRoot":"","sources":["../../../lib/renderEnvironment/RenderEnvironmentContext.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"RenderEnvironmentContext.js","sourceRoot":"","sources":["../../../lib/renderEnvironment/RenderEnvironmentContext.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,EAAE,aAAa,EAAE,UAAU,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAG5E,OAAO,EAAE,oBAAoB,EAAE,aAAa,EAAE,MAAM,oBAAoB,CAAC;AAEzE,OAAO,EAAE,UAAU,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAOlE,IAAM,YAAY,GAAG,aAAa,EAAE,CAAC;AACrC,MAAM,CAAC,IAAM,wBAAwB,GAAG,aAAa,CAA+B;IAClF,YAAY,cAAA;IACZ,OAAO,EAAE,UAAU,CAAC,EAAE,SAAS,EAAE,MAAA,YAAY,CAAC,QAAQ,0CAAE,IAAmB,EAAE,CAAC;CAC/E,CAAC,CAAC;AAaH,MAAM,CAAC,IAAM,yBAAyB,GAA6C,UAAC,EAMnF;QALC,eAAe,qBAAA,EACf,aAAa,mBAAA,EACb,QAAQ,cAAA,EACR,QAAQ,cAAA,EACR,kBAA0C,EAA1C,UAAU,mBAAG,6BAA6B,KAAA;IAEpC,IAAA,KAAwB,QAAQ,EAAW,EAA1C,OAAO,QAAA,EAAE,UAAU,QAAuB,CAAC;IAElD,SAAS,MAAM,CAAC,SAAyB;QACvC,IAAI,CAAC,OAAO,IAAI,SAAS,EAAE,CAAC;YAC1B,wEAAwE;YACxE,UAAU,CAAC,UAAU,CAAC,EAAE,SAAS,WAAA,EAAE,GAAG,EAAE,UAAU,EAAE,CAAC,CAAC,CAAC;QACzD,CAAC;IACH,CAAC;IAED,IAAM,YAAY,GAAG,OAAO,CAAC,cAAM,OAAA,CAAC,EAAE,eAAe,iBAAA,EAAE,aAAa,eAAA,EAAE,CAAC,EAApC,CAAoC,EAAE,CAAC,eAAe,EAAE,aAAa,CAAC,CAAC,CAAC;IAC3G,OAAO,CACL,oBAAC,aAAa,IAAC,KAAK,EAAE,YAAY;QAChC,6BAAK,GAAG,EAAE,MAAM,GAAI;QACnB,OAAO,IAAI,CACV,oBAAC,wBAAwB,CAAC,QAAQ,IAChC,KAAK,EAAE;gBACL,YAAY,EAAE,oBAAoB,CAAC,QAAQ,CAAC;gBAC5C,OAAO,SAAA;aACR,IAEA,QAAQ,CACyB,CACrC,CACa,CACjB,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,CAAC,IAAM,SAAS,GAAG,cAAoB,OAAA,UAAU,CAAC,wBAAwB,CAAC,CAAC,YAAY,EAAjD,CAAiD,CAAC;AAC/F,MAAM,CAAC,IAAM,UAAU,GAAG,cAAe,OAAA,UAAU,CAAC,wBAAwB,CAAC,CAAC,OAAO,EAA5C,CAA4C,CAAC;AACtF,MAAM,CAAC,IAAM,SAAS,GAAG,UAAK,SAAkC;IAC9D,IAAM,OAAO,GAAG,UAAU,EAAE,CAAC;IAC7B,OAAO,SAAS,CAAC,OAAO,CAAC,CAAC;AAC5B,CAAC,CAAC","sourcesContent":["import React, { createContext, useContext, useMemo, useState } from 'react';\nimport type { Emotion } from '@emotion/css/create-instance';\n\nimport { getOwnerGlobalObject, getSafeWindow } from '../globalObject.js';\nimport type { GlobalObject } from '../globalObject.js';\nimport { getEmotion, PopupProvider } from '../theming/Emotion.js';\n\nexport interface RenderEnvironmentContextType {\n globalObject: GlobalObject;\n emotion: Emotion;\n}\n\nconst globalObject = getSafeWindow();\nexport const RenderEnvironmentContext = createContext<RenderEnvironmentContextType>({\n globalObject,\n emotion: getEmotion({ container: globalObject.document?.head as HTMLElement }),\n});\n\nexport type GetOffsetParent = (element?: Node) => HTMLElement | null;\nexport type PopupStrategy = 'auto' | 'relative' | 'absolute' | 'fixed';\n\ninterface RenderEnvironmentProviderProps {\n children: React.ReactNode;\n rootNode: HTMLElement;\n getOffsetParent?: GetOffsetParent;\n popupStrategy?: PopupStrategy;\n emotionKey?: string;\n}\n\nexport const RenderEnvironmentProvider: React.FC<RenderEnvironmentProviderProps> = ({\n getOffsetParent,\n popupStrategy,\n children,\n rootNode,\n emotionKey = 'react-ui-render-environment',\n}) => {\n const [emotion, setEmotion] = useState<Emotion>();\n\n function setRef(container: HTMLDivElement) {\n if (!emotion && container) {\n // NOTE: container может быть globalObject.document?.head; или rootNode;\n setEmotion(getEmotion({ container, key: emotionKey }));\n }\n }\n\n const popupContext = useMemo(() => ({ getOffsetParent, popupStrategy }), [getOffsetParent, popupStrategy]);\n return (\n <PopupProvider value={popupContext}>\n <div ref={setRef} />\n {emotion && (\n <RenderEnvironmentContext.Provider\n value={{\n globalObject: getOwnerGlobalObject(rootNode),\n emotion,\n }}\n >\n {children}\n </RenderEnvironmentContext.Provider>\n )}\n </PopupProvider>\n );\n};\n\nexport const useGlobal = (): GlobalObject => useContext(RenderEnvironmentContext).globalObject;\nexport const useEmotion = (): Emotion => useContext(RenderEnvironmentContext).emotion;\nexport const useStyles = <T,>(getStyles: (emotion: Emotion) => T): T => {\n const emotion = useEmotion();\n return getStyles(emotion);\n};\n"]}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare const isShadowRoot: (root: unknown) => root is ShadowRoot;
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"isShadowRoot.js","sourceRoot":"","sources":["../../../lib/shadowDom/isShadowRoot.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,IAAM,YAAY,GAAG,UAAC,IAAa,YAAyB,OAAA,OAAO,CAAC,MAAC,IAAmB,aAAnB,IAAI,uBAAJ,IAAI,CAAiB,IAAI,0CAAE,UAAU,CAAC,CAAA,EAAA,CAAC","sourcesContent":["export const isShadowRoot = (root: unknown): root is ShadowRoot => Boolean((root as ShadowRoot)?.host?.shadowRoot);\n"]}
|
package/lib/theming/Emotion.d.ts
CHANGED
|
@@ -1,11 +1,22 @@
|
|
|
1
1
|
import type { Emotion } from '@emotion/css/create-instance';
|
|
2
|
+
import type { GetOffsetParent, PopupStrategy } from '../renderEnvironment/RenderEnvironmentContext.js';
|
|
2
3
|
import type { Theme } from './Theme.js';
|
|
3
4
|
export declare const REACT_UI_PREFIX: string;
|
|
4
5
|
export declare const getEmotion: ({ key, container, nonce, }: {
|
|
5
|
-
container
|
|
6
|
+
container?: HTMLElement | null;
|
|
6
7
|
key?: string;
|
|
7
8
|
nonce?: string;
|
|
8
9
|
}) => Emotion;
|
|
10
|
+
export declare const injectGlobal: {
|
|
11
|
+
(template: TemplateStringsArray, ...args: Array<import("@emotion/css/create-instance").CSSInterpolation>): void;
|
|
12
|
+
(...args: Array<import("@emotion/css/create-instance").CSSInterpolation>): void;
|
|
13
|
+
}, cache: import("@emotion/css/create-instance").EmotionCache, css: {
|
|
14
|
+
(template: TemplateStringsArray, ...args: Array<import("@emotion/css/create-instance").CSSInterpolation>): string;
|
|
15
|
+
(...args: Array<import("@emotion/css/create-instance").CSSInterpolation>): string;
|
|
16
|
+
}, cx: (...classNames: Array<import("@emotion/css/create-instance").ClassNamesArg>) => string, keyframes: {
|
|
17
|
+
(template: TemplateStringsArray, ...args: Array<import("@emotion/css/create-instance").CSSInterpolation>): string;
|
|
18
|
+
(...args: Array<import("@emotion/css/create-instance").CSSInterpolation>): string;
|
|
19
|
+
}, getRegisteredStyles: (registeredStyles: Array<string>, className: string) => string, hydrate: (ids: Array<string>) => void, sheet: import("@emotion/css/create-instance").CSSStyleSheet, merge: (className: string) => string, flush: () => void;
|
|
9
20
|
export interface StylesObject {
|
|
10
21
|
[className: string]: (() => string) | ((t: Theme) => string);
|
|
11
22
|
}
|
|
@@ -13,3 +24,18 @@ export type StylesGetter<S> = (emotion: Emotion) => S;
|
|
|
13
24
|
export declare const memoizeStyle: <S extends StylesObject>(styles: S) => S;
|
|
14
25
|
export declare const memoizeGetStyles: <S extends StylesObject>(getStyles: StylesGetter<S>) => StylesGetter<S>;
|
|
15
26
|
export declare const prefix: (component: string, app?: string) => <T extends Record<string, string>>(classes: T) => T;
|
|
27
|
+
export declare const EmotionContext: import("react").Context<Emotion>;
|
|
28
|
+
export declare const EmotionConsumer: import("react").Consumer<Emotion>;
|
|
29
|
+
export declare const EmotionProvider: import("react").Provider<Emotion>;
|
|
30
|
+
export declare const PopupContext: import("react").Context<{
|
|
31
|
+
getOffsetParent?: GetOffsetParent;
|
|
32
|
+
popupStrategy?: PopupStrategy;
|
|
33
|
+
}>;
|
|
34
|
+
export declare const PopupConsumer: import("react").Consumer<{
|
|
35
|
+
getOffsetParent?: GetOffsetParent;
|
|
36
|
+
popupStrategy?: PopupStrategy;
|
|
37
|
+
}>;
|
|
38
|
+
export declare const PopupProvider: import("react").Provider<{
|
|
39
|
+
getOffsetParent?: GetOffsetParent;
|
|
40
|
+
popupStrategy?: PopupStrategy;
|
|
41
|
+
}>;
|
package/lib/theming/Emotion.js
CHANGED
|
@@ -9,8 +9,10 @@ var __assign = (this && this.__assign) || function () {
|
|
|
9
9
|
};
|
|
10
10
|
return __assign.apply(this, arguments);
|
|
11
11
|
};
|
|
12
|
+
var _a;
|
|
12
13
|
import createEmotion from '@emotion/css/create-instance';
|
|
13
14
|
import extraScopePlugin from 'stylis-plugin-extra-scope';
|
|
15
|
+
import { createContext } from 'react';
|
|
14
16
|
import { Upgrade } from '../Upgrades.js';
|
|
15
17
|
export var REACT_UI_PREFIX = Upgrade.getSpecificityClassName();
|
|
16
18
|
var scope = new Array(Upgrade.getSpecificityLevel()).fill(".".concat(REACT_UI_PREFIX)).join('');
|
|
@@ -20,21 +22,24 @@ export var getEmotion = function (_a) {
|
|
|
20
22
|
key: key,
|
|
21
23
|
prepend: true,
|
|
22
24
|
stylisPlugins: scope ? [extraScopePlugin(scope)] : undefined,
|
|
23
|
-
container: container,
|
|
25
|
+
container: container !== null && container !== void 0 ? container : undefined,
|
|
24
26
|
nonce: nonce,
|
|
25
27
|
});
|
|
26
28
|
};
|
|
29
|
+
// breaking changes
|
|
30
|
+
// todo убрать все экспорты, чтобы все компоненты управлялись через EmotionContext, пока оставили для обратной совместимости с icons/side-menu/Fias
|
|
31
|
+
export var injectGlobal = (_a = getEmotion({}), _a.injectGlobal), cache = _a.cache, css = _a.css, cx = _a.cx, keyframes = _a.keyframes, getRegisteredStyles = _a.getRegisteredStyles, hydrate = _a.hydrate, sheet = _a.sheet, merge = _a.merge, flush = _a.flush;
|
|
27
32
|
function isZeroArgs(fn) {
|
|
28
33
|
return fn.length === 0;
|
|
29
34
|
}
|
|
30
|
-
var memoize = function (fn) {
|
|
35
|
+
var memoize = function (fn, context) {
|
|
31
36
|
if (isZeroArgs(fn)) {
|
|
32
37
|
var isCalled_1 = false;
|
|
33
38
|
var result_1;
|
|
34
39
|
return function () {
|
|
35
40
|
if (!isCalled_1) {
|
|
36
41
|
isCalled_1 = true;
|
|
37
|
-
result_1 = fn();
|
|
42
|
+
result_1 = fn.call(context);
|
|
38
43
|
}
|
|
39
44
|
return result_1;
|
|
40
45
|
};
|
|
@@ -42,13 +47,13 @@ var memoize = function (fn) {
|
|
|
42
47
|
var cache = new WeakMap();
|
|
43
48
|
return function (arg) {
|
|
44
49
|
if (!cache.has(arg)) {
|
|
45
|
-
cache.set(arg, fn(arg));
|
|
50
|
+
cache.set(arg, fn.call(context, arg));
|
|
46
51
|
}
|
|
47
52
|
return cache.get(arg);
|
|
48
53
|
};
|
|
49
54
|
};
|
|
50
55
|
export var memoizeStyle = function (styles) {
|
|
51
|
-
Object.keys(styles).forEach(function (className) { return (styles[className] = memoize(styles[className])); });
|
|
56
|
+
Object.keys(styles).forEach(function (className) { return (styles[className] = memoize(styles[className], styles)); });
|
|
52
57
|
return styles;
|
|
53
58
|
};
|
|
54
59
|
export var memoizeGetStyles = function (getStyles) {
|
|
@@ -69,4 +74,14 @@ export var prefix = function (component, app) {
|
|
|
69
74
|
}, {});
|
|
70
75
|
};
|
|
71
76
|
};
|
|
77
|
+
export var EmotionContext = createContext(getEmotion({}));
|
|
78
|
+
export var EmotionConsumer = EmotionContext.Consumer;
|
|
79
|
+
export var EmotionProvider = EmotionContext.Provider;
|
|
80
|
+
export var PopupContext = createContext({
|
|
81
|
+
getOffsetParent: function () { return null; },
|
|
82
|
+
});
|
|
83
|
+
export var PopupConsumer = PopupContext.Consumer;
|
|
84
|
+
export var PopupProvider = PopupContext.Provider;
|
|
85
|
+
EmotionContext.displayName = 'EmotionContext';
|
|
86
|
+
EmotionContext.__KONTUR_REACT_UI__ = 'EmotionContext';
|
|
72
87
|
//# sourceMappingURL=Emotion.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Emotion.js","sourceRoot":"","sources":["../../../lib/theming/Emotion.ts"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"Emotion.js","sourceRoot":"","sources":["../../../lib/theming/Emotion.ts"],"names":[],"mappings":"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","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\nimport createEmotion from '@emotion/css/create-instance';\nimport extraScopePlugin from 'stylis-plugin-extra-scope';\nimport { createContext } from 'react';\n\nimport { Upgrade } from '../Upgrades.js';\nimport type { AnyObject, FunctionWithParams } from '../utils.js';\nimport type { GetOffsetParent, PopupStrategy } from '../renderEnvironment/RenderEnvironmentContext.js';\n\nimport type { Theme } from './Theme.js';\n\nexport const REACT_UI_PREFIX = Upgrade.getSpecificityClassName();\n\nconst scope = new Array(Upgrade.getSpecificityLevel()).fill(`.${REACT_UI_PREFIX}`).join('');\n\nexport const getEmotion = ({\n key = REACT_UI_PREFIX,\n container,\n nonce,\n}: {\n container?: HTMLElement | null;\n key?: string;\n nonce?: string;\n}): Emotion =>\n createEmotion({\n key,\n prepend: true,\n stylisPlugins: scope ? [extraScopePlugin(scope)] : undefined,\n container: container ?? undefined,\n nonce,\n });\n\n// breaking changes\n// todo убрать все экспорты, чтобы все компоненты управлялись через EmotionContext, пока оставили для обратной совместимости с icons/side-menu/Fias\nexport const { injectGlobal, cache, css, cx, keyframes, getRegisteredStyles, hydrate, sheet, merge, flush } =\n getEmotion({});\n\nfunction isZeroArgs<R, T extends FunctionWithParams<R>>(fn: T | FunctionWithParams<R>): fn is () => R {\n return fn.length === 0;\n}\n\nconst memoize = <A extends AnyObject, R>(\n fn: (() => R) | ((arg: A) => R),\n context: Record<string, unknown>,\n): (() => R) | ((arg: A) => R) => {\n if (isZeroArgs(fn)) {\n let isCalled = false;\n let result: R;\n return () => {\n if (!isCalled) {\n isCalled = true;\n result = fn.call(context);\n }\n return result;\n };\n }\n\n const cache = new WeakMap();\n return (arg: A) => {\n if (!cache.has(arg)) {\n cache.set(arg, fn.call(context, arg));\n }\n\n return cache.get(arg);\n };\n};\n\nexport interface StylesObject {\n [className: string]: (() => string) | ((t: Theme) => string);\n}\n\nexport type StylesGetter<S> = (emotion: Emotion) => S;\n\nexport const memoizeStyle = <S extends StylesObject>(styles: S): S => {\n Object.keys(styles).forEach(\n (className) => (styles[className as keyof S] = memoize(styles[className], styles) as S[keyof S]),\n );\n return styles;\n};\n\nexport const memoizeGetStyles = <S extends StylesObject>(getStyles: StylesGetter<S>): StylesGetter<S> => {\n const stylesCache = new WeakMap<Emotion, S>();\n return (emotion: Emotion): S => {\n if (!stylesCache.has(emotion)) {\n stylesCache.set(emotion, memoizeStyle(getStyles(emotion)));\n }\n\n return stylesCache.get(emotion) as S;\n };\n};\n\nexport const prefix =\n (component: string, app = REACT_UI_PREFIX) =>\n <T extends Record<string, string>>(classes: T): T =>\n Object.keys(classes).reduce((acc, key) => {\n return { ...acc, [key]: `${app}-${component}-${classes[key]}` };\n }, {} as T);\n\nexport const EmotionContext = createContext<Emotion>(getEmotion({}));\nexport const EmotionConsumer = EmotionContext.Consumer;\nexport const EmotionProvider = EmotionContext.Provider;\n\nexport const PopupContext = createContext<{\n getOffsetParent?: GetOffsetParent;\n popupStrategy?: PopupStrategy;\n}>({\n getOffsetParent: () => null,\n});\nexport const PopupConsumer = PopupContext.Consumer;\nexport const PopupProvider = PopupContext.Provider;\n\nEmotionContext.displayName = 'EmotionContext';\nEmotionContext.__KONTUR_REACT_UI__ = 'EmotionContext';\n"]}
|