@fluentui/react-provider 9.7.1 → 9.7.3
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/CHANGELOG.json +85 -1
- package/CHANGELOG.md +29 -2
- package/lib/FluentProvider.js +0 -1
- package/lib/FluentProvider.js.map +1 -1
- package/lib/components/FluentProvider/FluentProvider.js +5 -6
- package/lib/components/FluentProvider/FluentProvider.js.map +1 -1
- package/lib/components/FluentProvider/FluentProvider.types.js +1 -2
- package/lib/components/FluentProvider/FluentProvider.types.js.map +1 -1
- package/lib/components/FluentProvider/index.js +0 -1
- package/lib/components/FluentProvider/index.js.map +1 -1
- package/lib/components/FluentProvider/renderFluentProvider.js +29 -34
- package/lib/components/FluentProvider/renderFluentProvider.js.map +1 -1
- package/lib/components/FluentProvider/useFluentProvider.js +67 -80
- package/lib/components/FluentProvider/useFluentProvider.js.map +1 -1
- package/lib/components/FluentProvider/useFluentProviderContextValues.js +23 -30
- package/lib/components/FluentProvider/useFluentProviderContextValues.js.map +1 -1
- package/lib/components/FluentProvider/useFluentProviderStyles.styles.js.map +1 -1
- package/lib/components/FluentProvider/useFluentProviderThemeStyleTag.js +75 -74
- package/lib/components/FluentProvider/useFluentProviderThemeStyleTag.js.map +1 -1
- package/lib/index.js +0 -1
- package/lib/index.js.map +1 -1
- package/lib-commonjs/FluentProvider.js +0 -3
- package/lib-commonjs/FluentProvider.js.map +1 -1
- package/lib-commonjs/components/FluentProvider/FluentProvider.js +1 -3
- package/lib-commonjs/components/FluentProvider/FluentProvider.js.map +1 -1
- package/lib-commonjs/components/FluentProvider/FluentProvider.types.js +0 -3
- package/lib-commonjs/components/FluentProvider/FluentProvider.types.js.map +1 -1
- package/lib-commonjs/components/FluentProvider/index.js +0 -3
- package/lib-commonjs/components/FluentProvider/index.js.map +1 -1
- package/lib-commonjs/components/FluentProvider/renderFluentProvider.js +1 -3
- package/lib-commonjs/components/FluentProvider/renderFluentProvider.js.map +1 -1
- package/lib-commonjs/components/FluentProvider/useFluentProvider.js +5 -8
- package/lib-commonjs/components/FluentProvider/useFluentProvider.js.map +1 -1
- package/lib-commonjs/components/FluentProvider/useFluentProviderContextValues.js +2 -6
- package/lib-commonjs/components/FluentProvider/useFluentProviderContextValues.js.map +1 -1
- package/lib-commonjs/components/FluentProvider/useFluentProviderStyles.styles.js +0 -2
- package/lib-commonjs/components/FluentProvider/useFluentProviderStyles.styles.js.map +1 -1
- package/lib-commonjs/components/FluentProvider/useFluentProviderThemeStyleTag.js +1 -3
- package/lib-commonjs/components/FluentProvider/useFluentProviderThemeStyleTag.js.map +1 -1
- package/lib-commonjs/index.js +0 -3
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +9 -9
|
@@ -3,88 +3,89 @@ import * as React from 'react';
|
|
|
3
3
|
import { fluentProviderClassNames } from './useFluentProviderStyles.styles';
|
|
4
4
|
// String concatenation is used to prevent bundlers to complain with older versions of React
|
|
5
5
|
const useInsertionEffect = React['useInsertion' + 'Effect'] ? React['useInsertion' + 'Effect'] : useIsomorphicLayoutEffect;
|
|
6
|
-
const createStyleTag = (target, elementAttributes)
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
6
|
+
const createStyleTag = (target, elementAttributes)=>{
|
|
7
|
+
if (!target) {
|
|
8
|
+
return undefined;
|
|
9
|
+
}
|
|
10
|
+
const tag = target.createElement('style');
|
|
11
|
+
Object.keys(elementAttributes).forEach((attrName)=>{
|
|
12
|
+
tag.setAttribute(attrName, elementAttributes[attrName]);
|
|
13
|
+
});
|
|
14
|
+
target.head.appendChild(tag);
|
|
15
|
+
return tag;
|
|
16
16
|
};
|
|
17
|
-
const insertSheet = (tag, rule)
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
17
|
+
const insertSheet = (tag, rule)=>{
|
|
18
|
+
const sheet = tag.sheet;
|
|
19
|
+
if (sheet) {
|
|
20
|
+
if (sheet.cssRules.length > 0) {
|
|
21
|
+
sheet.deleteRule(0);
|
|
22
|
+
}
|
|
23
|
+
sheet.insertRule(rule, 0);
|
|
24
|
+
} else if (process.env.NODE_ENV !== 'production') {
|
|
25
|
+
// eslint-disable-next-line no-console
|
|
26
|
+
console.error('FluentProvider: No sheet available on styleTag, styles will not be inserted into DOM.');
|
|
22
27
|
}
|
|
23
|
-
sheet.insertRule(rule, 0);
|
|
24
|
-
} else if (process.env.NODE_ENV !== 'production') {
|
|
25
|
-
// eslint-disable-next-line no-console
|
|
26
|
-
console.error('FluentProvider: No sheet available on styleTag, styles will not be inserted into DOM.');
|
|
27
|
-
}
|
|
28
28
|
};
|
|
29
29
|
/**
|
|
30
30
|
* Writes a theme as css variables in a style tag on the provided targetDocument as a rule applied to a CSS class
|
|
31
31
|
* @internal
|
|
32
32
|
* @returns CSS class to apply the rule
|
|
33
|
-
*/
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
33
|
+
*/ export const useFluentProviderThemeStyleTag = (options)=>{
|
|
34
|
+
const { targetDocument , theme , rendererAttributes } = options;
|
|
35
|
+
const styleTag = React.useRef();
|
|
36
|
+
const styleTagId = useId(fluentProviderClassNames.root);
|
|
37
|
+
const styleElementAttributes = rendererAttributes;
|
|
38
|
+
const cssVarsAsString = React.useMemo(()=>{
|
|
39
|
+
return theme ? Object.keys(theme).reduce((cssVarRule, cssVar)=>{
|
|
40
|
+
cssVarRule += `--${cssVar}: ${theme[cssVar]}; `;
|
|
41
|
+
return cssVarRule;
|
|
42
|
+
}, '') : '';
|
|
43
|
+
}, [
|
|
44
|
+
theme
|
|
45
|
+
]);
|
|
46
|
+
const rule = `.${styleTagId} { ${cssVarsAsString} }`;
|
|
47
|
+
useHandleSSRStyleElements(targetDocument, styleTagId);
|
|
48
|
+
useInsertionEffect(()=>{
|
|
49
|
+
// The style element could already have been created during SSR - no need to recreate it
|
|
50
|
+
const ssrStyleElement = targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.getElementById(styleTagId);
|
|
51
|
+
if (ssrStyleElement) {
|
|
52
|
+
styleTag.current = ssrStyleElement;
|
|
53
|
+
} else {
|
|
54
|
+
styleTag.current = createStyleTag(targetDocument, {
|
|
55
|
+
...styleElementAttributes,
|
|
56
|
+
id: styleTagId
|
|
57
|
+
});
|
|
58
|
+
if (styleTag.current) {
|
|
59
|
+
insertSheet(styleTag.current, rule);
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
return ()=>{
|
|
63
|
+
var _styleTag_current;
|
|
64
|
+
(_styleTag_current = styleTag.current) === null || _styleTag_current === void 0 ? void 0 : _styleTag_current.remove();
|
|
65
|
+
};
|
|
66
|
+
}, [
|
|
67
|
+
styleTagId,
|
|
68
|
+
targetDocument,
|
|
69
|
+
rule,
|
|
70
|
+
styleElementAttributes
|
|
71
|
+
]);
|
|
72
|
+
return {
|
|
73
|
+
styleTagId,
|
|
74
|
+
rule
|
|
68
75
|
};
|
|
69
|
-
}, [styleTagId, targetDocument, rule, styleElementAttributes]);
|
|
70
|
-
return {
|
|
71
|
-
styleTagId,
|
|
72
|
-
rule
|
|
73
|
-
};
|
|
74
76
|
};
|
|
75
77
|
function useHandleSSRStyleElements(targetDocument, styleTagId) {
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
78
|
+
// Using a state factory so that this logic only runs once per render
|
|
79
|
+
// Each FluentProvider can create its own style element during SSR as a slot
|
|
80
|
+
// Moves all theme style elements to document head during render to avoid hydration errors.
|
|
81
|
+
// Should be strict mode safe since the logic is idempotent.
|
|
82
|
+
React.useState(()=>{
|
|
83
|
+
if (!targetDocument) {
|
|
84
|
+
return;
|
|
85
|
+
}
|
|
86
|
+
const themeStyleElement = targetDocument.getElementById(styleTagId);
|
|
87
|
+
if (themeStyleElement) {
|
|
88
|
+
targetDocument.head.append(themeStyleElement);
|
|
89
|
+
}
|
|
90
|
+
});
|
|
89
91
|
}
|
|
90
|
-
//# sourceMappingURL=useFluentProviderThemeStyleTag.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["useFluentProviderThemeStyleTag.ts"],"sourcesContent":["import { useId, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport * as React from 'react';\n\nimport type { FluentProviderState } from './FluentProvider.types';\nimport { fluentProviderClassNames } from './useFluentProviderStyles.styles';\n\n// String concatenation is used to prevent bundlers to complain with older versions of React\nconst useInsertionEffect = (React as never)['useInsertion' + 'Effect']\n ? (React as never)['useInsertion' + 'Effect']\n : useIsomorphicLayoutEffect;\n\nconst createStyleTag = (target: Document | undefined, elementAttributes: Record<string, string>) => {\n if (!target) {\n return undefined;\n }\n\n const tag = target.createElement('style');\n\n Object.keys(elementAttributes).forEach(attrName => {\n tag.setAttribute(attrName, elementAttributes[attrName]);\n });\n\n target.head.appendChild(tag);\n return tag;\n};\n\nconst insertSheet = (tag: HTMLStyleElement, rule: string) => {\n const sheet = tag.sheet;\n\n if (sheet) {\n if (sheet.cssRules.length > 0) {\n sheet.deleteRule(0);\n }\n sheet.insertRule(rule, 0);\n } else if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line no-console\n console.error('FluentProvider: No sheet available on styleTag, styles will not be inserted into DOM.');\n }\n};\n\n/**\n * Writes a theme as css variables in a style tag on the provided targetDocument as a rule applied to a CSS class\n * @internal\n * @returns CSS class to apply the rule\n */\nexport const useFluentProviderThemeStyleTag = (\n options: Pick<FluentProviderState, 'theme' | 'targetDocument'> & { rendererAttributes: Record<string, string> },\n) => {\n const { targetDocument, theme, rendererAttributes } = options;\n\n const styleTag = React.useRef<HTMLStyleElement | undefined | null>();\n\n const styleTagId = useId(fluentProviderClassNames.root);\n const styleElementAttributes = rendererAttributes;\n\n const cssVarsAsString = React.useMemo(() => {\n return theme\n ? (Object.keys(theme) as (keyof typeof theme)[]).reduce((cssVarRule, cssVar) => {\n cssVarRule += `--${cssVar}: ${theme[cssVar]}; `;\n return cssVarRule;\n }, '')\n : '';\n }, [theme]);\n\n const rule = `.${styleTagId} { ${cssVarsAsString} }`;\n\n useHandleSSRStyleElements(targetDocument, styleTagId);\n useInsertionEffect(() => {\n // The style element could already have been created during SSR - no need to recreate it\n const ssrStyleElement = targetDocument?.getElementById(styleTagId);\n if (ssrStyleElement) {\n styleTag.current = ssrStyleElement as HTMLStyleElement;\n } else {\n styleTag.current = createStyleTag(targetDocument, { ...styleElementAttributes, id: styleTagId });\n if (styleTag.current) {\n insertSheet(styleTag.current, rule);\n }\n }\n\n return () => {\n styleTag.current?.remove();\n };\n }, [styleTagId, targetDocument, rule, styleElementAttributes]);\n\n return { styleTagId, rule };\n};\n\nfunction useHandleSSRStyleElements(targetDocument: Document | undefined | null, styleTagId: string) {\n // Using a state factory so that this logic only runs once per render\n // Each FluentProvider can create its own style element during SSR as a slot\n // Moves all theme style elements to document head during render to avoid hydration errors.\n // Should be strict mode safe since the logic is idempotent.\n React.useState(() => {\n if (!targetDocument) {\n return;\n }\n\n const themeStyleElement = targetDocument.getElementById(styleTagId);\n if (themeStyleElement) {\n targetDocument.head.append(themeStyleElement);\n }\n });\n}\n"],"names":["useId","useIsomorphicLayoutEffect","React","fluentProviderClassNames","useInsertionEffect","createStyleTag","target","elementAttributes","undefined","tag","createElement","Object","keys","forEach","attrName","setAttribute","head","appendChild","insertSheet","rule","sheet","cssRules","length","deleteRule","insertRule","process","env","NODE_ENV","console","error","useFluentProviderThemeStyleTag","options","targetDocument","theme","rendererAttributes","styleTag","useRef","styleTagId","root","styleElementAttributes","cssVarsAsString","useMemo","reduce","cssVarRule","cssVar","useHandleSSRStyleElements","ssrStyleElement","getElementById","current","id","remove","useState","themeStyleElement","append"],"mappings":"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"}
|
package/lib/index.js
CHANGED
package/lib/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"sources":["index.ts"],"sourcesContent":["export {\n fluentProviderClassNames,\n FluentProvider,\n renderFluentProvider_unstable,\n useFluentProviderContextValues_unstable,\n useFluentProvider_unstable,\n useFluentProviderStyles_unstable,\n useFluentProviderThemeStyleTag,\n} from './FluentProvider';\nexport type {\n FluentProviderContextValues,\n FluentProviderCustomStyleHooks,\n FluentProviderProps,\n FluentProviderState,\n FluentProviderSlots,\n} from './FluentProvider';\n"],"names":["fluentProviderClassNames","FluentProvider","renderFluentProvider_unstable","useFluentProviderContextValues_unstable","useFluentProvider_unstable","useFluentProviderStyles_unstable","useFluentProviderThemeStyleTag"],"mappings":"AAAA,SACEA,wBAAwB,EACxBC,cAAc,EACdC,6BAA6B,EAC7BC,uCAAuC,EACvCC,0BAA0B,EAC1BC,gCAAgC,EAChCC,8BAA8B,QACzB,mBAAmB"}
|
|
@@ -4,6 +4,3 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
});
|
|
5
5
|
const _exportStar = require("@swc/helpers/lib/_export_star.js").default;
|
|
6
6
|
_exportStar(require("./components/FluentProvider/index"), exports);
|
|
7
|
-
//# sourceMappingURL=FluentProvider.js.map
|
|
8
|
-
|
|
9
|
-
//# sourceMappingURL=FluentProvider.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["FluentProvider.js"],"sourcesContent":["export * from './components/FluentProvider/index';\n"],"names":[],"mappings":";;;;;oBAAc"}
|
|
@@ -18,6 +18,4 @@ const FluentProvider = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
|
|
|
18
18
|
const contextValues = (0, _useFluentProviderContextValues.useFluentProviderContextValues_unstable)(state);
|
|
19
19
|
return (0, _renderFluentProvider.renderFluentProvider_unstable)(state, contextValues);
|
|
20
20
|
});
|
|
21
|
-
FluentProvider.displayName = 'FluentProvider';
|
|
22
|
-
|
|
23
|
-
//# sourceMappingURL=FluentProvider.js.map
|
|
21
|
+
FluentProvider.displayName = 'FluentProvider';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["FluentProvider.js"],"sourcesContent":["import * as React from 'react';\nimport { renderFluentProvider_unstable } from './renderFluentProvider';\nimport { useFluentProvider_unstable } from './useFluentProvider';\nimport { useFluentProviderStyles_unstable } from './useFluentProviderStyles.styles';\nimport { useFluentProviderContextValues_unstable } from './useFluentProviderContextValues';\nexport const FluentProvider = /*#__PURE__*/ React.forwardRef((props, ref)=>{\n const state = useFluentProvider_unstable(props, ref);\n useFluentProviderStyles_unstable(state);\n const contextValues = useFluentProviderContextValues_unstable(state);\n return renderFluentProvider_unstable(state, contextValues);\n});\nFluentProvider.displayName = 'FluentProvider';\n"],"names":["FluentProvider","React","forwardRef","props","ref","state","useFluentProvider_unstable","useFluentProviderStyles_unstable","contextValues","useFluentProviderContextValues_unstable","renderFluentProvider_unstable","displayName"],"mappings":";;;;+BAKaA;;aAAAA;;;6DALU;sCACuB;mCACH;+CACM;gDACO;AACjD,MAAMA,iBAAiB,WAAW,GAAGC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAM;IACvE,MAAMC,QAAQC,IAAAA,6CAA0B,EAACH,OAAOC;IAChDG,IAAAA,+DAAgC,EAACF;IACjC,MAAMG,gBAAgBC,IAAAA,uEAAuC,EAACJ;IAC9D,OAAOK,IAAAA,mDAA6B,EAACL,OAAOG;AAChD;AACAR,eAAeW,WAAW,GAAG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":[
|
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":""}
|
|
@@ -10,6 +10,3 @@ _exportStar(require("./useFluentProvider"), exports);
|
|
|
10
10
|
_exportStar(require("./useFluentProviderStyles.styles"), exports);
|
|
11
11
|
_exportStar(require("./useFluentProviderContextValues"), exports);
|
|
12
12
|
_exportStar(require("./useFluentProviderThemeStyleTag"), exports);
|
|
13
|
-
//# sourceMappingURL=index.js.map
|
|
14
|
-
|
|
15
|
-
//# sourceMappingURL=index.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["index.js"],"sourcesContent":["export * from './FluentProvider';\nexport * from './FluentProvider.types';\nexport * from './renderFluentProvider';\nexport * from './useFluentProvider';\nexport * from './useFluentProviderStyles.styles';\nexport * from './useFluentProviderContextValues';\nexport * from './useFluentProviderThemeStyleTag';\n"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA;oBACA;oBACA"}
|
|
@@ -38,6 +38,4 @@ const renderFluentProvider_unstable = (state, contextValues)=>{
|
|
|
38
38
|
},
|
|
39
39
|
...state.serverStyleProps.attributes
|
|
40
40
|
}), slotProps.root.children))))))));
|
|
41
|
-
};
|
|
42
|
-
|
|
43
|
-
//# sourceMappingURL=renderFluentProvider.js.map
|
|
41
|
+
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["renderFluentProvider.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';\nimport { canUseDOM, getSlotsNext } from '@fluentui/react-utilities';\nimport { TextDirectionProvider } from '@griffel/react';\nimport { OverridesProvider_unstable as OverridesProvider, Provider_unstable as Provider, TooltipVisibilityProvider_unstable as TooltipVisibilityProvider, ThemeProvider_unstable as ThemeProvider, ThemeClassNameProvider_unstable as ThemeClassNameProvider, CustomStyleHooksProvider_unstable as CustomStyleHooksProvider } from '@fluentui/react-shared-contexts';\n/**\n * Render the final JSX of FluentProvider\n */ export const renderFluentProvider_unstable = (state, contextValues)=>{\n const { slots , slotProps } = getSlotsNext(state);\n // Typescript (vscode) incorrectly references the FluentProviderProps.customStyleHooks_unstable\n // instead of FluentProviderContextValues.customStyleHooks_unstable and thinks it is\n // Partial<CustomStyleHooksContextValue>, so it needs to be cast to Required<CustomStyleHooksContextValue>\n return /*#__PURE__*/ createElement(Provider, {\n value: contextValues.provider\n }, /*#__PURE__*/ createElement(ThemeProvider, {\n value: contextValues.theme\n }, /*#__PURE__*/ createElement(ThemeClassNameProvider, {\n value: contextValues.themeClassName\n }, /*#__PURE__*/ createElement(CustomStyleHooksProvider, {\n value: contextValues.customStyleHooks_unstable\n }, /*#__PURE__*/ createElement(TooltipVisibilityProvider, {\n value: contextValues.tooltip\n }, /*#__PURE__*/ createElement(TextDirectionProvider, {\n dir: contextValues.textDirection\n }, /*#__PURE__*/ createElement(OverridesProvider, {\n value: contextValues.overrides_unstable\n }, /*#__PURE__*/ createElement(slots.root, slotProps.root, canUseDOM() ? null : /*#__PURE__*/ createElement(\"style\", {\n // Using dangerous HTML because react can escape characters\n // which can lead to invalid CSS.\n // eslint-disable-next-line react/no-danger\n dangerouslySetInnerHTML: {\n __html: state.serverStyleProps.cssRule\n },\n ...state.serverStyleProps.attributes\n }), slotProps.root.children))))))));\n};\n"],"names":["renderFluentProvider_unstable","state","contextValues","slots","slotProps","getSlotsNext","createElement","Provider","value","provider","ThemeProvider","theme","ThemeClassNameProvider","themeClassName","CustomStyleHooksProvider","customStyleHooks_unstable","TooltipVisibilityProvider","tooltip","TextDirectionProvider","dir","textDirection","OverridesProvider","overrides_unstable","root","canUseDOM","dangerouslySetInnerHTML","__html","serverStyleProps","cssRule","attributes","children"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAMjCA;;aAAAA;;iCANkE;gCAC3C;uBACF;qCAC6R;AAGxT,MAAMA,gCAAgC,CAACC,OAAOC,gBAAgB;IACrE,MAAM,EAAEC,MAAK,EAAGC,UAAS,EAAG,GAAGC,IAAAA,4BAAY,EAACJ;IAC5C,+FAA+F;IAC/F,oFAAoF;IACpF,0GAA0G;IAC1G,OAAO,WAAW,GAAGK,IAAAA,8BAAa,EAACC,sCAAQ,EAAE;QACzCC,OAAON,cAAcO,QAAQ;IACjC,GAAG,WAAW,GAAGH,IAAAA,8BAAa,EAACI,2CAAa,EAAE;QAC1CF,OAAON,cAAcS,KAAK;IAC9B,GAAG,WAAW,GAAGL,IAAAA,8BAAa,EAACM,oDAAsB,EAAE;QACnDJ,OAAON,cAAcW,cAAc;IACvC,GAAG,WAAW,GAAGP,IAAAA,8BAAa,EAACQ,sDAAwB,EAAE;QACrDN,OAAON,cAAca,yBAAyB;IAClD,GAAG,WAAW,GAAGT,IAAAA,8BAAa,EAACU,uDAAyB,EAAE;QACtDR,OAAON,cAAce,OAAO;IAChC,GAAG,WAAW,GAAGX,IAAAA,8BAAa,EAACY,4BAAqB,EAAE;QAClDC,KAAKjB,cAAckB,aAAa;IACpC,GAAG,WAAW,GAAGd,IAAAA,8BAAa,EAACe,+CAAiB,EAAE;QAC9Cb,OAAON,cAAcoB,kBAAkB;IAC3C,GAAG,WAAW,GAAGhB,IAAAA,8BAAa,EAACH,MAAMoB,IAAI,EAAEnB,UAAUmB,IAAI,EAAEC,IAAAA,yBAAS,MAAK,IAAI,GAAG,WAAW,GAAGlB,IAAAA,8BAAa,EAAC,SAAS;QACjH,2DAA2D;QAC3D,iCAAiC;QACjC,2CAA2C;QAC3CmB,yBAAyB;YACrBC,QAAQzB,MAAM0B,gBAAgB,CAACC,OAAO;QAC1C;QACA,GAAG3B,MAAM0B,gBAAgB,CAACE,UAAU;IACxC,EAAE,EAAEzB,UAAUmB,IAAI,CAACO,QAAQ;AAC/B"}
|
|
@@ -19,11 +19,10 @@ const useFluentProvider_unstable = (props, ref)=>{
|
|
|
19
19
|
const parentOverrides = (0, _reactSharedContexts.useOverrides_unstable)();
|
|
20
20
|
const parentCustomStyleHooks = _react.useContext(_reactSharedContexts.CustomStyleHooksContext_unstable) || {};
|
|
21
21
|
/**
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
customStyleHooks_unstable , dir =parentContext.dir , targetDocument =parentContext.targetDocument , theme , overrides_unstable: overrides = {} } = props;
|
|
22
|
+
* TODO: add merge functions to "dir" merge,
|
|
23
|
+
* nesting providers with the same "dir" should not add additional attributes to DOM
|
|
24
|
+
* see https://github.com/microsoft/fluentui/blob/0dc74a19f3aa5a058224c20505016fbdb84db172/packages/fluentui/react-northstar/src/utils/mergeProviderContexts.ts#L89-L93
|
|
25
|
+
*/ const { applyStylesToPortals =true , customStyleHooks_unstable , dir =parentContext.dir , targetDocument =parentContext.targetDocument , theme , overrides_unstable: overrides = {} } = props;
|
|
27
26
|
const mergedTheme = shallowMerge(parentTheme, theme);
|
|
28
27
|
const mergedOverrides = shallowMerge(parentOverrides, overrides);
|
|
29
28
|
const mergedCustomStyleHooks = shallowMerge(parentCustomStyleHooks, customStyleHooks_unstable);
|
|
@@ -89,6 +88,4 @@ function shallowMerge(a, b) {
|
|
|
89
88
|
}
|
|
90
89
|
function useTheme() {
|
|
91
90
|
return _react.useContext(_reactSharedContexts.ThemeContext_unstable);
|
|
92
|
-
}
|
|
93
|
-
|
|
94
|
-
//# sourceMappingURL=useFluentProvider.js.map
|
|
91
|
+
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["useFluentProvider.js"],"sourcesContent":["import { useFocusVisible } from '@fluentui/react-tabster';\nimport { ThemeContext_unstable as ThemeContext, useFluent_unstable as useFluent, useOverrides_unstable as useOverrides, CustomStyleHooksContext_unstable as CustomStyleHooksContext } from '@fluentui/react-shared-contexts';\nimport { getNativeElementProps, useMergedRefs } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { useFluentProviderThemeStyleTag } from './useFluentProviderThemeStyleTag';\nimport { useRenderer_unstable } from '@griffel/react';\n/**\n * Create the state required to render FluentProvider.\n *\n * The returned state can be modified with hooks such as useFluentProviderStyles_unstable,\n * before being passed to renderFluentProvider_unstable.\n *\n * @param props - props from this instance of FluentProvider\n * @param ref - reference to root HTMLElement of FluentProvider\n */ export const useFluentProvider_unstable = (props, ref)=>{\n const parentContext = useFluent();\n const parentTheme = useTheme();\n const parentOverrides = useOverrides();\n const parentCustomStyleHooks = React.useContext(CustomStyleHooksContext) || {};\n /**\n * TODO: add merge functions to \"dir\" merge,\n * nesting providers with the same \"dir\" should not add additional attributes to DOM\n * see https://github.com/microsoft/fluentui/blob/0dc74a19f3aa5a058224c20505016fbdb84db172/packages/fluentui/react-northstar/src/utils/mergeProviderContexts.ts#L89-L93\n */ const { applyStylesToPortals =true , // eslint-disable-next-line @typescript-eslint/naming-convention\n customStyleHooks_unstable , dir =parentContext.dir , targetDocument =parentContext.targetDocument , theme , overrides_unstable: overrides = {} } = props;\n const mergedTheme = shallowMerge(parentTheme, theme);\n const mergedOverrides = shallowMerge(parentOverrides, overrides);\n const mergedCustomStyleHooks = shallowMerge(parentCustomStyleHooks, customStyleHooks_unstable);\n React.useEffect(()=>{\n if (process.env.NODE_ENV !== 'production' && mergedTheme === undefined) {\n // eslint-disable-next-line no-console\n console.warn(`\n FluentProvider: your \"theme\" is not defined !\n =============================================\n Make sure your root FluentProvider has set a theme or you're setting the theme in your child FluentProvider.\n `);\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, []);\n const renderer = useRenderer_unstable();\n var _renderer_styleElementAttributes;\n const { styleTagId , rule } = useFluentProviderThemeStyleTag({\n theme: mergedTheme,\n targetDocument,\n rendererAttributes: (_renderer_styleElementAttributes = renderer.styleElementAttributes) !== null && _renderer_styleElementAttributes !== void 0 ? _renderer_styleElementAttributes : {}\n });\n return {\n applyStylesToPortals,\n // eslint-disable-next-line @typescript-eslint/naming-convention\n customStyleHooks_unstable: mergedCustomStyleHooks,\n dir,\n targetDocument,\n theme: mergedTheme,\n // eslint-disable-next-line @typescript-eslint/naming-convention\n overrides_unstable: mergedOverrides,\n themeClassName: styleTagId,\n components: {\n root: 'div'\n },\n root: getNativeElementProps('div', {\n ...props,\n dir,\n ref: useMergedRefs(ref, useFocusVisible({\n targetDocument\n }))\n }),\n serverStyleProps: {\n cssRule: rule,\n attributes: {\n ...renderer.styleElementAttributes,\n id: styleTagId\n }\n }\n };\n};\nfunction shallowMerge(a, b) {\n // Merge impacts perf: we should like to avoid it if it's possible\n if (a && b) {\n return {\n ...a,\n ...b\n };\n }\n if (a) {\n return a;\n }\n return b;\n}\nfunction useTheme() {\n return React.useContext(ThemeContext);\n}\n"],"names":["useFluentProvider_unstable","props","ref","parentContext","useFluent","parentTheme","useTheme","parentOverrides","useOverrides","parentCustomStyleHooks","React","useContext","CustomStyleHooksContext","applyStylesToPortals","customStyleHooks_unstable","dir","targetDocument","theme","overrides_unstable","overrides","mergedTheme","shallowMerge","mergedOverrides","mergedCustomStyleHooks","useEffect","process","env","NODE_ENV","undefined","console","warn","renderer","useRenderer_unstable","_renderer_styleElementAttributes","styleTagId","rule","useFluentProviderThemeStyleTag","rendererAttributes","styleElementAttributes","themeClassName","components","root","getNativeElementProps","useMergedRefs","useFocusVisible","serverStyleProps","cssRule","attributes","id","a","b","ThemeContext"],"mappings":";;;;+BAciBA;;aAAAA;;;8BAde;qCAC2J;gCACtI;6DAC9B;gDACwB;wBACV;AAS1B,MAAMA,6BAA6B,CAACC,OAAOC,MAAM;IACxD,MAAMC,gBAAgBC,IAAAA,uCAAS;IAC/B,MAAMC,cAAcC;IACpB,MAAMC,kBAAkBC,IAAAA,0CAAY;IACpC,MAAMC,yBAAyBC,OAAMC,UAAU,CAACC,qDAAuB,KAAK,CAAC;IAC7E;;;;GAID,GAAG,MAAM,EAAEC,sBAAsB,IAAI,CAAA,EACpCC,0BAAyB,EAAGC,KAAKZ,cAAcY,GAAG,CAAA,EAAGC,gBAAgBb,cAAca,cAAc,CAAA,EAAGC,MAAK,EAAGC,oBAAoBC,YAAY,CAAC,CAAC,CAAA,EAAG,GAAGlB;IACpJ,MAAMmB,cAAcC,aAAahB,aAAaY;IAC9C,MAAMK,kBAAkBD,aAAad,iBAAiBY;IACtD,MAAMI,yBAAyBF,aAAaZ,wBAAwBK;IACpEJ,OAAMc,SAAS,CAAC,IAAI;QAChB,IAAIC,QAAQC,GAAG,CAACC,QAAQ,KAAK,gBAAgBP,gBAAgBQ,WAAW;YACpE,sCAAsC;YACtCC,QAAQC,IAAI,CAAC,CAAC;;;;MAIpB,CAAC;QACC,CAAC;IACL,uDAAuD;IACvD,GAAG,EAAE;IACL,MAAMC,WAAWC,IAAAA,4BAAoB;IACrC,IAAIC;IACJ,MAAM,EAAEC,WAAU,EAAGC,KAAI,EAAG,GAAGC,IAAAA,8DAA8B,EAAC;QAC1DnB,OAAOG;QACPJ;QACAqB,oBAAoB,AAACJ,CAAAA,mCAAmCF,SAASO,sBAAsB,AAAD,MAAO,IAAI,IAAIL,qCAAqC,KAAK,IAAIA,mCAAmC,CAAC,CAAC;IAC5L;IACA,OAAO;QACHpB;QACA,gEAAgE;QAChEC,2BAA2BS;QAC3BR;QACAC;QACAC,OAAOG;QACP,gEAAgE;QAChEF,oBAAoBI;QACpBiB,gBAAgBL;QAChBM,YAAY;YACRC,MAAM;QACV;QACAA,MAAMC,IAAAA,qCAAqB,EAAC,OAAO;YAC/B,GAAGzC,KAAK;YACRc;YACAb,KAAKyC,IAAAA,6BAAa,EAACzC,KAAK0C,IAAAA,6BAAe,EAAC;gBACpC5B;YACJ;QACJ;QACA6B,kBAAkB;YACdC,SAASX;YACTY,YAAY;gBACR,GAAGhB,SAASO,sBAAsB;gBAClCU,IAAId;YACR;QACJ;IACJ;AACJ;AACA,SAASb,aAAa4B,CAAC,EAAEC,CAAC,EAAE;IACxB,kEAAkE;IAClE,IAAID,KAAKC,GAAG;QACR,OAAO;YACH,GAAGD,CAAC;YACJ,GAAGC,CAAC;QACR;IACJ,CAAC;IACD,IAAID,GAAG;QACH,OAAOA;IACX,CAAC;IACD,OAAOC;AACX;AACA,SAAS5C,WAAW;IAChB,OAAOI,OAAMC,UAAU,CAACwC,0CAAY;AACxC"}
|
|
@@ -10,9 +10,7 @@ const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildc
|
|
|
10
10
|
const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
|
|
11
11
|
function useFluentProviderContextValues_unstable(state) {
|
|
12
12
|
// eslint-disable-next-line @typescript-eslint/naming-convention
|
|
13
|
-
const { applyStylesToPortals ,
|
|
14
|
-
customStyleHooks_unstable , dir , root , targetDocument , theme , themeClassName , // eslint-disable-next-line @typescript-eslint/naming-convention
|
|
15
|
-
overrides_unstable } = state;
|
|
13
|
+
const { applyStylesToPortals , customStyleHooks_unstable , dir , root , targetDocument , theme , themeClassName , overrides_unstable } = state;
|
|
16
14
|
const provider = _react.useMemo(()=>({
|
|
17
15
|
dir,
|
|
18
16
|
targetDocument
|
|
@@ -33,6 +31,4 @@ function useFluentProviderContextValues_unstable(state) {
|
|
|
33
31
|
theme,
|
|
34
32
|
themeClassName: applyStylesToPortals ? root.className : themeClassName
|
|
35
33
|
};
|
|
36
|
-
}
|
|
37
|
-
|
|
38
|
-
//# sourceMappingURL=useFluentProviderContextValues.js.map
|
|
34
|
+
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["useFluentProviderContextValues.js"],"sourcesContent":["import * as React from 'react';\nexport function useFluentProviderContextValues_unstable(state) {\n // eslint-disable-next-line @typescript-eslint/naming-convention\n const { applyStylesToPortals , // eslint-disable-next-line @typescript-eslint/naming-convention\n customStyleHooks_unstable , dir , root , targetDocument , theme , themeClassName , // eslint-disable-next-line @typescript-eslint/naming-convention\n overrides_unstable } = state;\n const provider = React.useMemo(()=>({\n dir,\n targetDocument\n }), [\n dir,\n targetDocument\n ]);\n // \"Tooltip\" component mutates an object in this context, instance should be stable\n const [tooltip] = React.useState(()=>({}));\n return {\n // eslint-disable-next-line @typescript-eslint/naming-convention\n customStyleHooks_unstable,\n // eslint-disable-next-line @typescript-eslint/naming-convention\n overrides_unstable,\n provider,\n textDirection: dir,\n tooltip,\n theme,\n themeClassName: applyStylesToPortals ? root.className : themeClassName\n };\n}\n"],"names":["useFluentProviderContextValues_unstable","state","applyStylesToPortals","customStyleHooks_unstable","dir","root","targetDocument","theme","themeClassName","overrides_unstable","provider","React","useMemo","tooltip","useState","textDirection","className"],"mappings":";;;;+BACgBA;;aAAAA;;;6DADO;AAChB,SAASA,wCAAwCC,KAAK,EAAE;IAC3D,gEAAgE;IAChE,MAAM,EAAEC,qBAAoB,EAC5BC,0BAAyB,EAAGC,IAAG,EAAGC,KAAI,EAAGC,eAAc,EAAGC,MAAK,EAAGC,eAAc,EAChFC,mBAAkB,EAAG,GAAGR;IACxB,MAAMS,WAAWC,OAAMC,OAAO,CAAC,IAAK,CAAA;YAC5BR;YACAE;QACJ,CAAA,GAAI;QACJF;QACAE;KACH;IACD,mFAAmF;IACnF,MAAM,CAACO,QAAQ,GAAGF,OAAMG,QAAQ,CAAC,IAAK,CAAA,CAAC,CAAA;IACvC,OAAO;QACH,gEAAgE;QAChEX;QACA,gEAAgE;QAChEM;QACAC;QACAK,eAAeX;QACfS;QACAN;QACAC,gBAAgBN,uBAAuBG,KAAKW,SAAS,GAAGR,cAAc;IAC1E;AACJ"}
|
|
@@ -51,5 +51,3 @@ const useFluentProviderStyles_unstable = (state)=>{
|
|
|
51
51
|
state.root.className = (0, _core.mergeClasses)(fluentProviderClassNames.root, state.themeClassName, styles.root, state.root.className);
|
|
52
52
|
return state;
|
|
53
53
|
}; //# sourceMappingURL=useFluentProviderStyles.styles.js.map
|
|
54
|
-
|
|
55
|
-
//# sourceMappingURL=useFluentProviderStyles.styles.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["useFluentProviderStyles.styles.js"],"sourcesContent":["import { __styles, mergeClasses } from '@griffel/core';\nimport { useRenderer_unstable } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nexport const fluentProviderClassNames = {\n root: 'fui-FluentProvider'\n};\nconst useStyles = /*#__PURE__*/__styles({\n root: {\n sj55zd: \"f19n0e5\",\n De3pzq: \"fxugw4r\",\n fsow6f: [\"f1o700av\", \"fes3tcz\"],\n Bahqtrf: \"fk6fouc\",\n Be2twd7: \"fkhj508\",\n Bhrd7zp: \"figsok6\",\n Bg96gwp: \"f1i3iumi\"\n }\n}, {\n d: [\".f19n0e5{color:var(--colorNeutralForeground1);}\", \".fxugw4r{background-color:var(--colorNeutralBackground1);}\", \".f1o700av{text-align:left;}\", \".fes3tcz{text-align:right;}\", \".fk6fouc{font-family:var(--fontFamilyBase);}\", \".fkhj508{font-size:var(--fontSizeBase300);}\", \".figsok6{font-weight:var(--fontWeightRegular);}\", \".f1i3iumi{line-height:var(--lineHeightBase300);}\"]\n});\n/** Applies style classnames to slots */\nexport const useFluentProviderStyles_unstable = state => {\n const renderer = useRenderer_unstable();\n const styles = useStyles({\n dir: state.dir,\n renderer\n });\n state.root.className = mergeClasses(fluentProviderClassNames.root, state.themeClassName, styles.root, state.root.className);\n return state;\n};\n//# sourceMappingURL=useFluentProviderStyles.styles.js.map"],"names":["fluentProviderClassNames","useFluentProviderStyles_unstable","root","useStyles","__styles","sj55zd","De3pzq","fsow6f","Bahqtrf","Be2twd7","Bhrd7zp","Bg96gwp","d","state","renderer","useRenderer_unstable","styles","dir","className","mergeClasses","themeClassName"],"mappings":";;;;;;;;;;;IAGaA,wBAAwB,MAAxBA;IAiBAC,gCAAgC,MAAhCA;;sBApB0B;uBACF;AAE9B,MAAMD,2BAA2B;IACtCE,MAAM;AACR;AACA,MAAMC,YAAY,WAAW,GAAEC,IAAAA,iBAAQ,EAAC;IACtCF,MAAM;QACJG,QAAQ;QACRC,QAAQ;QACRC,QAAQ;YAAC;YAAY;SAAU;QAC/BC,SAAS;QACTC,SAAS;QACTC,SAAS;QACTC,SAAS;IACX;AACF,GAAG;IACDC,GAAG;QAAC;QAAmD;QAA8D;QAA+B;QAA+B;QAAgD;QAA+C;QAAmD;KAAmD;AAC1X;AAEO,MAAMX,mCAAmCY,CAAAA,QAAS;IACvD,MAAMC,WAAWC,IAAAA,2BAAoB;IACrC,MAAMC,SAASb,UAAU;QACvBc,KAAKJ,MAAMI,GAAG;QACdH;IACF;IACAD,MAAMX,IAAI,CAACgB,SAAS,GAAGC,IAAAA,kBAAY,EAACnB,yBAAyBE,IAAI,EAAEW,MAAMO,cAAc,EAAEJ,OAAOd,IAAI,EAAEW,MAAMX,IAAI,CAACgB,SAAS;IAC1H,OAAOL;AACT,GACA,0DAA0D"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["useFluentProviderThemeStyleTag.js"],"sourcesContent":["import { useId, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { fluentProviderClassNames } from './useFluentProviderStyles.styles';\n// String concatenation is used to prevent bundlers to complain with older versions of React\nconst useInsertionEffect = React['useInsertion' + 'Effect'] ? React['useInsertion' + 'Effect'] : useIsomorphicLayoutEffect;\nconst createStyleTag = (target, elementAttributes)=>{\n if (!target) {\n return undefined;\n }\n const tag = target.createElement('style');\n Object.keys(elementAttributes).forEach((attrName)=>{\n tag.setAttribute(attrName, elementAttributes[attrName]);\n });\n target.head.appendChild(tag);\n return tag;\n};\nconst insertSheet = (tag, rule)=>{\n const sheet = tag.sheet;\n if (sheet) {\n if (sheet.cssRules.length > 0) {\n sheet.deleteRule(0);\n }\n sheet.insertRule(rule, 0);\n } else if (process.env.NODE_ENV !== 'production') {\n // eslint-disable-next-line no-console\n console.error('FluentProvider: No sheet available on styleTag, styles will not be inserted into DOM.');\n }\n};\n/**\n * Writes a theme as css variables in a style tag on the provided targetDocument as a rule applied to a CSS class\n * @internal\n * @returns CSS class to apply the rule\n */ export const useFluentProviderThemeStyleTag = (options)=>{\n const { targetDocument , theme , rendererAttributes } = options;\n const styleTag = React.useRef();\n const styleTagId = useId(fluentProviderClassNames.root);\n const styleElementAttributes = rendererAttributes;\n const cssVarsAsString = React.useMemo(()=>{\n return theme ? Object.keys(theme).reduce((cssVarRule, cssVar)=>{\n cssVarRule += `--${cssVar}: ${theme[cssVar]}; `;\n return cssVarRule;\n }, '') : '';\n }, [\n theme\n ]);\n const rule = `.${styleTagId} { ${cssVarsAsString} }`;\n useHandleSSRStyleElements(targetDocument, styleTagId);\n useInsertionEffect(()=>{\n // The style element could already have been created during SSR - no need to recreate it\n const ssrStyleElement = targetDocument === null || targetDocument === void 0 ? void 0 : targetDocument.getElementById(styleTagId);\n if (ssrStyleElement) {\n styleTag.current = ssrStyleElement;\n } else {\n styleTag.current = createStyleTag(targetDocument, {\n ...styleElementAttributes,\n id: styleTagId\n });\n if (styleTag.current) {\n insertSheet(styleTag.current, rule);\n }\n }\n return ()=>{\n var _styleTag_current;\n (_styleTag_current = styleTag.current) === null || _styleTag_current === void 0 ? void 0 : _styleTag_current.remove();\n };\n }, [\n styleTagId,\n targetDocument,\n rule,\n styleElementAttributes\n ]);\n return {\n styleTagId,\n rule\n };\n};\nfunction useHandleSSRStyleElements(targetDocument, styleTagId) {\n // Using a state factory so that this logic only runs once per render\n // Each FluentProvider can create its own style element during SSR as a slot\n // Moves all theme style elements to document head during render to avoid hydration errors.\n // Should be strict mode safe since the logic is idempotent.\n React.useState(()=>{\n if (!targetDocument) {\n return;\n }\n const themeStyleElement = targetDocument.getElementById(styleTagId);\n if (themeStyleElement) {\n targetDocument.head.append(themeStyleElement);\n }\n });\n}\n"],"names":["useFluentProviderThemeStyleTag","useInsertionEffect","React","useIsomorphicLayoutEffect","createStyleTag","target","elementAttributes","undefined","tag","createElement","Object","keys","forEach","attrName","setAttribute","head","appendChild","insertSheet","rule","sheet","cssRules","length","deleteRule","insertRule","process","env","NODE_ENV","console","error","options","targetDocument","theme","rendererAttributes","styleTag","useRef","styleTagId","useId","fluentProviderClassNames","root","styleElementAttributes","cssVarsAsString","useMemo","reduce","cssVarRule","cssVar","useHandleSSRStyleElements","ssrStyleElement","getElementById","current","id","_styleTag_current","remove","useState","themeStyleElement","append"],"mappings":"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"}
|
package/lib-commonjs/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["
|
|
1
|
+
{"version":3,"sources":["index.js"],"sourcesContent":["export { fluentProviderClassNames, FluentProvider, renderFluentProvider_unstable, useFluentProviderContextValues_unstable, useFluentProvider_unstable, useFluentProviderStyles_unstable, useFluentProviderThemeStyleTag } from './FluentProvider';\n"],"names":["fluentProviderClassNames","FluentProvider","renderFluentProvider_unstable","useFluentProviderContextValues_unstable","useFluentProvider_unstable","useFluentProviderStyles_unstable","useFluentProviderThemeStyleTag"],"mappings":";;;;;;;;;;;IAASA,wBAAwB,MAAxBA,wCAAwB;IAAEC,cAAc,MAAdA,8BAAc;IAAEC,6BAA6B,MAA7BA,6CAA6B;IAAEC,uCAAuC,MAAvCA,uDAAuC;IAAEC,0BAA0B,MAA1BA,0CAA0B;IAAEC,gCAAgC,MAAhCA,gDAAgC;IAAEC,8BAA8B,MAA9BA,8CAA8B;;gCAAQ"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-provider",
|
|
3
|
-
"version": "9.7.
|
|
3
|
+
"version": "9.7.3",
|
|
4
4
|
"description": "Fluent UI React provider component",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -28,18 +28,18 @@
|
|
|
28
28
|
"devDependencies": {
|
|
29
29
|
"@fluentui/eslint-plugin": "*",
|
|
30
30
|
"@fluentui/react-conformance": "*",
|
|
31
|
-
"@fluentui/react-conformance-griffel": "9.0.0-beta.
|
|
31
|
+
"@fluentui/react-conformance-griffel": "9.0.0-beta.23",
|
|
32
32
|
"@fluentui/scripts-api-extractor": "*",
|
|
33
33
|
"@fluentui/scripts-tasks": "*"
|
|
34
34
|
},
|
|
35
35
|
"dependencies": {
|
|
36
|
-
"@
|
|
37
|
-
"@
|
|
38
|
-
"@fluentui/react-
|
|
39
|
-
"@fluentui/react-
|
|
40
|
-
"@fluentui/react-
|
|
41
|
-
"@
|
|
42
|
-
"@
|
|
36
|
+
"@fluentui/react-shared-contexts": "^9.5.1",
|
|
37
|
+
"@fluentui/react-tabster": "^9.8.0",
|
|
38
|
+
"@fluentui/react-theme": "^9.1.9",
|
|
39
|
+
"@fluentui/react-utilities": "^9.9.3",
|
|
40
|
+
"@fluentui/react-jsx-runtime": "9.0.0-alpha.7",
|
|
41
|
+
"@griffel/core": "^1.11.0",
|
|
42
|
+
"@griffel/react": "^1.5.7",
|
|
43
43
|
"@swc/helpers": "^0.4.14"
|
|
44
44
|
},
|
|
45
45
|
"peerDependencies": {
|