@fluentui/react-provider 0.0.0-nightly-20230222-0421.1 → 0.0.0-nightly-20230223-2115.1

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 (38) hide show
  1. package/.swcrc +33 -0
  2. package/CHANGELOG.json +13 -13
  3. package/CHANGELOG.md +9 -9
  4. package/lib/FluentProvider.js.map +1 -1
  5. package/lib/components/FluentProvider/FluentProvider.js.map +1 -1
  6. package/lib/components/FluentProvider/FluentProvider.types.js.map +1 -1
  7. package/lib/components/FluentProvider/index.js.map +1 -1
  8. package/lib/components/FluentProvider/renderFluentProvider.js +2 -3
  9. package/lib/components/FluentProvider/renderFluentProvider.js.map +1 -1
  10. package/lib/components/FluentProvider/useFluentProvider.js +4 -4
  11. package/lib/components/FluentProvider/useFluentProvider.js.map +1 -1
  12. package/lib/components/FluentProvider/useFluentProviderContextValues.js.map +1 -1
  13. package/lib/components/FluentProvider/useFluentProviderStyles.js +6 -11
  14. package/lib/components/FluentProvider/useFluentProviderStyles.js.map +1 -1
  15. package/lib/components/FluentProvider/useFluentProviderThemeStyleTag.js +2 -2
  16. package/lib/components/FluentProvider/useFluentProviderThemeStyleTag.js.map +1 -1
  17. package/lib/index.js.map +1 -1
  18. package/lib-commonjs/FluentProvider.js +5 -4
  19. package/lib-commonjs/FluentProvider.js.map +1 -1
  20. package/lib-commonjs/components/FluentProvider/FluentProvider.js +18 -14
  21. package/lib-commonjs/components/FluentProvider/FluentProvider.js.map +1 -1
  22. package/lib-commonjs/components/FluentProvider/FluentProvider.types.js +3 -2
  23. package/lib-commonjs/components/FluentProvider/FluentProvider.types.js.map +1 -1
  24. package/lib-commonjs/components/FluentProvider/index.js +11 -10
  25. package/lib-commonjs/components/FluentProvider/index.js.map +1 -1
  26. package/lib-commonjs/components/FluentProvider/renderFluentProvider.js +29 -32
  27. package/lib-commonjs/components/FluentProvider/renderFluentProvider.js.map +1 -1
  28. package/lib-commonjs/components/FluentProvider/useFluentProvider.js +62 -75
  29. package/lib-commonjs/components/FluentProvider/useFluentProvider.js.map +1 -1
  30. package/lib-commonjs/components/FluentProvider/useFluentProviderContextValues.js +28 -30
  31. package/lib-commonjs/components/FluentProvider/useFluentProviderContextValues.js.map +1 -1
  32. package/lib-commonjs/components/FluentProvider/useFluentProviderStyles.js +33 -31
  33. package/lib-commonjs/components/FluentProvider/useFluentProviderStyles.js.map +1 -1
  34. package/lib-commonjs/components/FluentProvider/useFluentProviderThemeStyleTag.js +66 -64
  35. package/lib-commonjs/components/FluentProvider/useFluentProviderThemeStyleTag.js.map +1 -1
  36. package/lib-commonjs/index.js +20 -47
  37. package/lib-commonjs/index.js.map +1 -1
  38. package/package.json +8 -8
@@ -1,88 +1,75 @@
1
1
  "use strict";
2
-
3
2
  Object.defineProperty(exports, "__esModule", {
4
- value: true
3
+ value: true
4
+ });
5
+ Object.defineProperty(exports, "useFluentProvider_unstable", {
6
+ enumerable: true,
7
+ get: ()=>useFluentProvider_unstable
5
8
  });
6
- exports.useFluentProvider_unstable = void 0;
7
- const react_tabster_1 = /*#__PURE__*/require("@fluentui/react-tabster");
8
- const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
9
- const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
10
- const React = /*#__PURE__*/require("react");
11
- const useFluentProviderThemeStyleTag_1 = /*#__PURE__*/require("./useFluentProviderThemeStyleTag");
12
- /**
13
- * Create the state required to render FluentProvider.
14
- *
15
- * The returned state can be modified with hooks such as useFluentProviderStyles_unstable,
16
- * before being passed to renderFluentProvider_unstable.
17
- *
18
- * @param props - props from this instance of FluentProvider
19
- * @param ref - reference to root HTMLElement of FluentProvider
20
- */
21
- const useFluentProvider_unstable = (props, ref) => {
22
- const parentContext = react_shared_contexts_1.useFluent_unstable();
23
- const parentTheme = useTheme();
24
- const parentOverrides = react_shared_contexts_1.useOverrides_unstable();
25
- /**
26
- * TODO: add merge functions to "dir" merge,
27
- * nesting providers with the same "dir" should not add additional attributes to DOM
28
- * see https://github.com/microsoft/fluentui/blob/0dc74a19f3aa5a058224c20505016fbdb84db172/packages/fluentui/react-northstar/src/utils/mergeProviderContexts.ts#L89-L93
29
- */
30
- const {
31
- applyStylesToPortals = true,
32
- dir = parentContext.dir,
33
- targetDocument = parentContext.targetDocument,
34
- theme,
35
- overrides_unstable: overrides = {}
36
- } = props;
37
- const mergedTheme = shallowMerge(parentTheme, theme);
38
- const mergedOverrides = shallowMerge(parentOverrides, overrides);
39
- React.useEffect(() => {
40
- if (process.env.NODE_ENV !== 'production' && mergedTheme === undefined) {
41
- // eslint-disable-next-line no-console
42
- console.warn(`
9
+ const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
10
+ const _reactTabster = require("@fluentui/react-tabster");
11
+ const _reactSharedContexts = require("@fluentui/react-shared-contexts");
12
+ const _reactUtilities = require("@fluentui/react-utilities");
13
+ const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
14
+ const _useFluentProviderThemeStyleTag = require("./useFluentProviderThemeStyleTag");
15
+ const useFluentProvider_unstable = (props, ref)=>{
16
+ const parentContext = (0, _reactSharedContexts.useFluent_unstable)();
17
+ const parentTheme = useTheme();
18
+ const parentOverrides = (0, _reactSharedContexts.useOverrides_unstable)();
19
+ /**
20
+ * TODO: add merge functions to "dir" merge,
21
+ * nesting providers with the same "dir" should not add additional attributes to DOM
22
+ * see https://github.com/microsoft/fluentui/blob/0dc74a19f3aa5a058224c20505016fbdb84db172/packages/fluentui/react-northstar/src/utils/mergeProviderContexts.ts#L89-L93
23
+ */ const { applyStylesToPortals =true , dir =parentContext.dir , targetDocument =parentContext.targetDocument , theme , overrides_unstable: overrides = {} } = props;
24
+ const mergedTheme = shallowMerge(parentTheme, theme);
25
+ const mergedOverrides = shallowMerge(parentOverrides, overrides);
26
+ _react.useEffect(()=>{
27
+ if (process.env.NODE_ENV !== 'production' && mergedTheme === undefined) {
28
+ // eslint-disable-next-line no-console
29
+ console.warn(`
43
30
  FluentProvider: your "theme" is not defined !
44
31
  =============================================
45
32
  Make sure your root FluentProvider has set a theme or you're setting the theme in your child FluentProvider.
46
33
  `);
47
- }
34
+ }
48
35
  // eslint-disable-next-line react-hooks/exhaustive-deps
49
- }, []);
50
- return {
51
- applyStylesToPortals,
52
- dir,
53
- targetDocument,
54
- theme: mergedTheme,
55
- // eslint-disable-next-line @typescript-eslint/naming-convention
56
- overrides_unstable: mergedOverrides,
57
- themeClassName: useFluentProviderThemeStyleTag_1.useFluentProviderThemeStyleTag({
58
- theme: mergedTheme,
59
- targetDocument
60
- }),
61
- components: {
62
- root: 'div'
63
- },
64
- root: react_utilities_1.getNativeElementProps('div', {
65
- ...props,
66
- dir,
67
- ref: react_utilities_1.useMergedRefs(ref, react_tabster_1.useFocusVisible())
68
- })
69
- };
70
- };
71
- exports.useFluentProvider_unstable = useFluentProvider_unstable;
72
- function shallowMerge(a, b) {
73
- // Merge impacts perf: we should like to avoid it if it's possible
74
- if (a && b) {
36
+ }, []);
75
37
  return {
76
- ...a,
77
- ...b
38
+ applyStylesToPortals,
39
+ dir,
40
+ targetDocument,
41
+ theme: mergedTheme,
42
+ // eslint-disable-next-line @typescript-eslint/naming-convention
43
+ overrides_unstable: mergedOverrides,
44
+ themeClassName: (0, _useFluentProviderThemeStyleTag.useFluentProviderThemeStyleTag)({
45
+ theme: mergedTheme,
46
+ targetDocument
47
+ }),
48
+ components: {
49
+ root: 'div'
50
+ },
51
+ root: (0, _reactUtilities.getNativeElementProps)('div', {
52
+ ...props,
53
+ dir,
54
+ ref: (0, _reactUtilities.useMergedRefs)(ref, (0, _reactTabster.useFocusVisible)())
55
+ })
78
56
  };
79
- }
80
- if (a) {
81
- return a;
82
- }
83
- return b;
57
+ };
58
+ function shallowMerge(a, b) {
59
+ // Merge impacts perf: we should like to avoid it if it's possible
60
+ if (a && b) {
61
+ return {
62
+ ...a,
63
+ ...b
64
+ };
65
+ }
66
+ if (a) {
67
+ return a;
68
+ }
69
+ return b;
84
70
  }
85
71
  function useTheme() {
86
- return React.useContext(react_shared_contexts_1.ThemeContext_unstable);
87
- }
72
+ return _react.useContext(_reactSharedContexts.ThemeContext_unstable);
73
+ } //# sourceMappingURL=useFluentProvider.js.map
74
+
88
75
  //# sourceMappingURL=useFluentProvider.js.map
@@ -1 +1 @@
1
- {"version":3,"mappings":";;;;;;AAAA;AACA;AAMA;AACA;AACA;AAGA;;;;;;;;;AASO,MAAMA,0BAA0B,GAAG,CACxCC,KAA0B,EAC1BC,GAA2B,KACJ;EACvB,MAAMC,aAAa,GAAGC,0CAAS,EAAE;EACjC,MAAMC,WAAW,GAAGC,QAAQ,EAAE;EAC9B,MAAMC,eAAe,GAAGH,6CAAY,EAAE;EAEtC;;;;;EAKA,MAAM;IACJI,oBAAoB,GAAG,IAAI;IAC3BC,GAAG,GAAGN,aAAa,CAACM,GAAG;IACvBC,cAAc,GAAGP,aAAa,CAACO,cAAc;IAC7CC,KAAK;IACLC,kBAAkB,EAAEC,SAAS,GAAG;EAAE,CACnC,GAAGZ,KAAK;EACT,MAAMa,WAAW,GAAGC,YAAY,CAACV,WAAW,EAAEM,KAAK,CAAC;EAEpD,MAAMK,eAAe,GAAGD,YAAY,CAACR,eAAe,EAAEM,SAAS,CAAC;EAEhEI,KAAK,CAACC,SAAS,CAAC,MAAK;IACnB,IAAIC,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,YAAY,IAAIP,WAAW,KAAKQ,SAAS,EAAE;MACtE;MACAC,OAAO,CAACC,IAAI,CAAC;;;;OAIZ,CAAC;;IAEJ;EACF,CAAC,EAAE,EAAE,CAAC;EAEN,OAAO;IACLhB,oBAAoB;IACpBC,GAAG;IACHC,cAAc;IACdC,KAAK,EAAEG,WAAW;IAClB;IACAF,kBAAkB,EAAEI,eAAe;IACnCS,cAAc,EAAEC,+DAA8B,CAAC;MAAEf,KAAK,EAAEG,WAAW;MAAEJ;IAAc,CAAE,CAAC;IAEtFiB,UAAU,EAAE;MACVC,IAAI,EAAE;KACP;IAEDA,IAAI,EAAEC,uCAAqB,CAAC,KAAK,EAAE;MACjC,GAAG5B,KAAK;MACRQ,GAAG;MACHP,GAAG,EAAE2B,+BAAa,CAAC3B,GAAG,EAAE4B,+BAAe,EAAkB;KAC1D;GACF;AACH,CAAC;AAvDYC,kCAA0B;AAyDvC,SAAShB,YAAY,CAAIiB,CAAI,EAAEC,CAAI;EACjC;EACA,IAAID,CAAC,IAAIC,CAAC,EAAE;IACV,OAAO;MAAE,GAAGD,CAAC;MAAE,GAAGC;IAAC,CAAE;;EAGvB,IAAID,CAAC,EAAE;IACL,OAAOA,CAAC;;EAGV,OAAOC,CAAC;AACV;AAEA,SAAS3B,QAAQ;EACf,OAAOW,KAAK,CAACiB,UAAU,CAAC9B,6CAAY,CAAC;AACvC","names":["useFluentProvider_unstable","props","ref","parentContext","react_shared_contexts_1","parentTheme","useTheme","parentOverrides","applyStylesToPortals","dir","targetDocument","theme","overrides_unstable","overrides","mergedTheme","shallowMerge","mergedOverrides","React","useEffect","process","env","NODE_ENV","undefined","console","warn","themeClassName","useFluentProviderThemeStyleTag_1","components","root","react_utilities_1","react_tabster_1","exports","a","b","useContext"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-provider/src/components/FluentProvider/useFluentProvider.ts"],"sourcesContent":["import { useFocusVisible } from '@fluentui/react-tabster';\nimport {\n ThemeContext_unstable as ThemeContext,\n useFluent_unstable as useFluent,\n useOverrides_unstable as useOverrides,\n} from '@fluentui/react-shared-contexts';\nimport type { ThemeContextValue_unstable as ThemeContextValue } from '@fluentui/react-shared-contexts';\nimport { getNativeElementProps, useMergedRefs } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { useFluentProviderThemeStyleTag } from './useFluentProviderThemeStyleTag';\nimport type { FluentProviderProps, FluentProviderState } from './FluentProvider.types';\n\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 */\nexport const useFluentProvider_unstable = (\n props: FluentProviderProps,\n ref: React.Ref<HTMLElement>,\n): FluentProviderState => {\n const parentContext = useFluent();\n const parentTheme = useTheme();\n const parentOverrides = useOverrides();\n\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 */\n const {\n applyStylesToPortals = true,\n dir = parentContext.dir,\n targetDocument = parentContext.targetDocument,\n theme,\n overrides_unstable: overrides = {},\n } = props;\n const mergedTheme = shallowMerge(parentTheme, theme);\n\n const mergedOverrides = shallowMerge(parentOverrides, overrides);\n\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\n return {\n applyStylesToPortals,\n dir,\n targetDocument,\n theme: mergedTheme,\n // eslint-disable-next-line @typescript-eslint/naming-convention\n overrides_unstable: mergedOverrides,\n themeClassName: useFluentProviderThemeStyleTag({ theme: mergedTheme, targetDocument }),\n\n components: {\n root: 'div',\n },\n\n root: getNativeElementProps('div', {\n ...props,\n dir,\n ref: useMergedRefs(ref, useFocusVisible<HTMLDivElement>()),\n }),\n };\n};\n\nfunction shallowMerge<T>(a: T, b: T): T {\n // Merge impacts perf: we should like to avoid it if it's possible\n if (a && b) {\n return { ...a, ...b };\n }\n\n if (a) {\n return a;\n }\n\n return b;\n}\n\nfunction useTheme(): ThemeContextValue {\n return React.useContext(ThemeContext);\n}\n"]}
1
+ {"version":3,"sources":["../../../lib/components/FluentProvider/useFluentProvider.js"],"sourcesContent":["import { useFocusVisible } from '@fluentui/react-tabster';\nimport { ThemeContext_unstable as ThemeContext, useFluent_unstable as useFluent, useOverrides_unstable as useOverrides } from '@fluentui/react-shared-contexts';\nimport { getNativeElementProps, useMergedRefs } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport { useFluentProviderThemeStyleTag } from './useFluentProviderThemeStyleTag';\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 */\nexport const useFluentProvider_unstable = (props, ref) => {\n const parentContext = useFluent();\n const parentTheme = useTheme();\n const parentOverrides = useOverrides();\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 */\n const {\n applyStylesToPortals = true,\n dir = parentContext.dir,\n targetDocument = parentContext.targetDocument,\n theme,\n overrides_unstable: overrides = {}\n } = props;\n const mergedTheme = shallowMerge(parentTheme, theme);\n const mergedOverrides = shallowMerge(parentOverrides, overrides);\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 return {\n applyStylesToPortals,\n dir,\n targetDocument,\n theme: mergedTheme,\n // eslint-disable-next-line @typescript-eslint/naming-convention\n overrides_unstable: mergedOverrides,\n themeClassName: useFluentProviderThemeStyleTag({\n theme: mergedTheme,\n targetDocument\n }),\n components: {\n root: 'div'\n },\n root: getNativeElementProps('div', {\n ...props,\n dir,\n ref: useMergedRefs(ref, useFocusVisible())\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//# sourceMappingURL=useFluentProvider.js.map"],"names":["useFluentProvider_unstable","props","ref","parentContext","useFluent","parentTheme","useTheme","parentOverrides","useOverrides","applyStylesToPortals","dir","targetDocument","theme","overrides_unstable","overrides","mergedTheme","shallowMerge","mergedOverrides","React","useEffect","process","env","NODE_ENV","undefined","console","warn","themeClassName","useFluentProviderThemeStyleTag","components","root","getNativeElementProps","useMergedRefs","useFocusVisible","a","b","useContext","ThemeContext"],"mappings":";;;;+BAcaA;;aAAAA;;;8BAdmB;qCAC8F;gCACzE;6DAC9B;gDACwB;AAUxC,MAAMA,6BAA6B,CAACC,OAAOC,MAAQ;IACxD,MAAMC,gBAAgBC,IAAAA,uCAAS;IAC/B,MAAMC,cAAcC;IACpB,MAAMC,kBAAkBC,IAAAA,0CAAY;IACpC;;;;EAIA,GACA,MAAM,EACJC,sBAAuB,IAAI,CAAA,EAC3BC,KAAMP,cAAcO,GAAG,CAAA,EACvBC,gBAAiBR,cAAcQ,cAAc,CAAA,EAC7CC,MAAK,EACLC,oBAAoBC,YAAY,CAAC,CAAC,CAAA,EACnC,GAAGb;IACJ,MAAMc,cAAcC,aAAaX,aAAaO;IAC9C,MAAMK,kBAAkBD,aAAaT,iBAAiBO;IACtDI,OAAMC,SAAS,CAAC,IAAM;QACpB,IAAIC,QAAQC,GAAG,CAACC,QAAQ,KAAK,gBAAgBP,gBAAgBQ,WAAW;YACtE,sCAAsC;YACtCC,QAAQC,IAAI,CAAC,CAAC;;;;MAId,CAAC;QACH,CAAC;IACD,uDAAuD;IACzD,GAAG,EAAE;IACL,OAAO;QACLhB;QACAC;QACAC;QACAC,OAAOG;QACP,gEAAgE;QAChEF,oBAAoBI;QACpBS,gBAAgBC,IAAAA,8DAA8B,EAAC;YAC7Cf,OAAOG;YACPJ;QACF;QACAiB,YAAY;YACVC,MAAM;QACR;QACAA,MAAMC,IAAAA,qCAAqB,EAAC,OAAO;YACjC,GAAG7B,KAAK;YACRS;YACAR,KAAK6B,IAAAA,6BAAa,EAAC7B,KAAK8B,IAAAA,6BAAe;QACzC;IACF;AACF;AACA,SAAShB,aAAaiB,CAAC,EAAEC,CAAC,EAAE;IAC1B,kEAAkE;IAClE,IAAID,KAAKC,GAAG;QACV,OAAO;YACL,GAAGD,CAAC;YACJ,GAAGC,CAAC;QACN;IACF,CAAC;IACD,IAAID,GAAG;QACL,OAAOA;IACT,CAAC;IACD,OAAOC;AACT;AACA,SAAS5B,WAAW;IAClB,OAAOY,OAAMiB,UAAU,CAACC,0CAAY;AACtC,EACA,6CAA6C"}
@@ -1,36 +1,34 @@
1
1
  "use strict";
2
-
3
2
  Object.defineProperty(exports, "__esModule", {
4
- value: true
3
+ value: true
4
+ });
5
+ Object.defineProperty(exports, "useFluentProviderContextValues_unstable", {
6
+ enumerable: true,
7
+ get: ()=>useFluentProviderContextValues_unstable
5
8
  });
6
- exports.useFluentProviderContextValues_unstable = void 0;
7
- const React = /*#__PURE__*/require("react");
9
+ const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
10
+ const _react = /*#__PURE__*/ _interopRequireWildcard(require("react"));
8
11
  function useFluentProviderContextValues_unstable(state) {
9
- // eslint-disable-next-line @typescript-eslint/naming-convention
10
- const {
11
- applyStylesToPortals,
12
- dir,
13
- root,
14
- targetDocument,
15
- theme,
16
- themeClassName,
17
- overrides_unstable
18
- } = state;
19
- const provider = React.useMemo(() => ({
20
- dir,
21
- targetDocument
22
- }), [dir, targetDocument]);
23
- // "Tooltip" component mutates an object in this context, instance should be stable
24
- const [tooltip] = React.useState(() => ({}));
25
- return {
26
12
  // eslint-disable-next-line @typescript-eslint/naming-convention
27
- overrides_unstable,
28
- provider,
29
- textDirection: dir,
30
- tooltip,
31
- theme,
32
- themeClassName: applyStylesToPortals ? root.className : themeClassName
33
- };
34
- }
35
- exports.useFluentProviderContextValues_unstable = useFluentProviderContextValues_unstable;
13
+ const { applyStylesToPortals , dir , root , targetDocument , theme , themeClassName , overrides_unstable } = state;
14
+ const provider = _react.useMemo(()=>({
15
+ dir,
16
+ targetDocument
17
+ }), [
18
+ dir,
19
+ targetDocument
20
+ ]);
21
+ // "Tooltip" component mutates an object in this context, instance should be stable
22
+ const [tooltip] = _react.useState(()=>({}));
23
+ return {
24
+ // eslint-disable-next-line @typescript-eslint/naming-convention
25
+ overrides_unstable,
26
+ provider,
27
+ textDirection: dir,
28
+ tooltip,
29
+ theme,
30
+ themeClassName: applyStylesToPortals ? root.className : themeClassName
31
+ };
32
+ } //# sourceMappingURL=useFluentProviderContextValues.js.map
33
+
36
34
  //# sourceMappingURL=useFluentProviderContextValues.js.map
@@ -1 +1 @@
1
- {"version":3,"mappings":";;;;;;AAAA;AAGA,SAAgBA,uCAAuC,CAACC,KAA0B;EAChF;EACA,MAAM;IAAEC,oBAAoB;IAAEC,GAAG;IAAEC,IAAI;IAAEC,cAAc;IAAEC,KAAK;IAAEC,cAAc;IAAEC;EAAkB,CAAE,GAAGP,KAAK;EAE5G,MAAMQ,QAAQ,GAAGC,KAAK,CAACC,OAAO,CAAC,OAAO;IAAER,GAAG;IAAEE;EAAc,CAAE,CAAC,EAAE,CAACF,GAAG,EAAEE,cAAc,CAAC,CAAC;EACtF;EACA,MAAM,CAACO,OAAO,CAAC,GAAGF,KAAK,CAACG,QAAQ,CAAC,OAAO,EAAE,CAAC,CAAC;EAE5C,OAAO;IACL;IACAL,kBAAkB;IAClBC,QAAQ;IACRK,aAAa,EAAEX,GAAG;IAClBS,OAAO;IACPN,KAAK;IACLC,cAAc,EAAEL,oBAAoB,GAAGE,IAAI,CAACW,SAAU,GAAGR;GAC1D;AACH;AAjBAS","names":["useFluentProviderContextValues_unstable","state","applyStylesToPortals","dir","root","targetDocument","theme","themeClassName","overrides_unstable","provider","React","useMemo","tooltip","useState","textDirection","className","exports"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-provider/src/components/FluentProvider/useFluentProviderContextValues.ts"],"sourcesContent":["import * as React from 'react';\nimport type { FluentProviderContextValues, FluentProviderState } from './FluentProvider.types';\n\nexport function useFluentProviderContextValues_unstable(state: FluentProviderState): FluentProviderContextValues {\n // eslint-disable-next-line @typescript-eslint/naming-convention\n const { applyStylesToPortals, dir, root, targetDocument, theme, themeClassName, overrides_unstable } = state;\n\n const provider = React.useMemo(() => ({ dir, targetDocument }), [dir, targetDocument]);\n // \"Tooltip\" component mutates an object in this context, instance should be stable\n const [tooltip] = React.useState(() => ({}));\n\n return {\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"]}
1
+ {"version":3,"sources":["../../../lib/components/FluentProvider/useFluentProviderContextValues.js"],"sourcesContent":["import * as React from 'react';\nexport function useFluentProviderContextValues_unstable(state) {\n // eslint-disable-next-line @typescript-eslint/naming-convention\n const {\n applyStylesToPortals,\n dir,\n root,\n targetDocument,\n theme,\n themeClassName,\n overrides_unstable\n } = state;\n const provider = React.useMemo(() => ({\n dir,\n targetDocument\n }), [dir, targetDocument]);\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 overrides_unstable,\n provider,\n textDirection: dir,\n tooltip,\n theme,\n themeClassName: applyStylesToPortals ? root.className : themeClassName\n };\n}\n//# sourceMappingURL=useFluentProviderContextValues.js.map"],"names":["useFluentProviderContextValues_unstable","state","applyStylesToPortals","dir","root","targetDocument","theme","themeClassName","overrides_unstable","provider","React","useMemo","tooltip","useState","textDirection","className"],"mappings":";;;;+BACgBA;;aAAAA;;;6DADO;AAChB,SAASA,wCAAwCC,KAAK,EAAE;IAC7D,gEAAgE;IAChE,MAAM,EACJC,qBAAoB,EACpBC,IAAG,EACHC,KAAI,EACJC,eAAc,EACdC,MAAK,EACLC,eAAc,EACdC,mBAAkB,EACnB,GAAGP;IACJ,MAAMQ,WAAWC,OAAMC,OAAO,CAAC,IAAO,CAAA;YACpCR;YACAE;QACF,CAAA,GAAI;QAACF;QAAKE;KAAe;IACzB,mFAAmF;IACnF,MAAM,CAACO,QAAQ,GAAGF,OAAMG,QAAQ,CAAC,IAAO,CAAA,CAAC,CAAA;IACzC,OAAO;QACL,gEAAgE;QAChEL;QACAC;QACAK,eAAeX;QACfS;QACAN;QACAC,gBAAgBL,uBAAuBE,KAAKW,SAAS,GAAGR,cAAc;IACxE;AACF,EACA,0DAA0D"}
@@ -1,37 +1,39 @@
1
1
  "use strict";
2
-
3
2
  Object.defineProperty(exports, "__esModule", {
4
- value: true
3
+ value: true
5
4
  });
6
- exports.useFluentProviderStyles_unstable = exports.fluentProviderClassNames = void 0;
7
- const core_1 = /*#__PURE__*/require("@griffel/core");
8
- const react_1 = /*#__PURE__*/require("@griffel/react");
9
- const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
10
- exports.fluentProviderClassNames = {
11
- root: 'fui-FluentProvider'
12
- };
13
- const useStyles = /*#__PURE__*/core_1.__styles({
14
- root: {
15
- sj55zd: "f19n0e5",
16
- De3pzq: "fxugw4r",
17
- fsow6f: ["f1o700av", "fes3tcz"],
18
- Bahqtrf: "fk6fouc",
19
- Be2twd7: "fkhj508",
20
- Bhrd7zp: "figsok6",
21
- Bg96gwp: "f1i3iumi"
22
- }
23
- }, {
24
- 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);}"]
5
+ function _export(target, all) {
6
+ for(var name in all)Object.defineProperty(target, name, {
7
+ enumerable: true,
8
+ get: all[name]
9
+ });
10
+ }
11
+ _export(exports, {
12
+ fluentProviderClassNames: ()=>fluentProviderClassNames,
13
+ useFluentProviderStyles_unstable: ()=>useFluentProviderStyles_unstable
25
14
  });
26
- /** Applies style classnames to slots */
27
- const useFluentProviderStyles_unstable = state => {
28
- const renderer = react_1.useRenderer_unstable();
29
- const styles = useStyles({
30
- dir: state.dir,
31
- renderer
32
- });
33
- state.root.className = core_1.mergeClasses(exports.fluentProviderClassNames.root, state.themeClassName, styles.root, state.root.className);
34
- return state;
15
+ const _core = require("@griffel/core");
16
+ const _react = require("@griffel/react");
17
+ const _reactTheme = require("@fluentui/react-theme");
18
+ const fluentProviderClassNames = {
19
+ root: 'fui-FluentProvider'
35
20
  };
36
- exports.useFluentProviderStyles_unstable = useFluentProviderStyles_unstable;
21
+ const useStyles = /*#__PURE__*/ (0, _core.makeStyles)({
22
+ root: {
23
+ color: _reactTheme.tokens.colorNeutralForeground1,
24
+ backgroundColor: _reactTheme.tokens.colorNeutralBackground1,
25
+ textAlign: 'left',
26
+ ..._reactTheme.typographyStyles.body1
27
+ }
28
+ });
29
+ const useFluentProviderStyles_unstable = (state)=>{
30
+ const renderer = (0, _react.useRenderer_unstable)();
31
+ const styles = useStyles({
32
+ dir: state.dir,
33
+ renderer
34
+ });
35
+ state.root.className = (0, _core.mergeClasses)(fluentProviderClassNames.root, state.themeClassName, styles.root, state.root.className);
36
+ return state;
37
+ }; //# sourceMappingURL=useFluentProviderStyles.js.map
38
+
37
39
  //# sourceMappingURL=useFluentProviderStyles.js.map
@@ -1 +1 @@
1
- {"version":3,"mappings":";;;;;;AAAA;AACA;AACA;AAIaA,gCAAwB,GAAwC;EAC3EC,IAAI,EAAE;CACP;AAED,MAAMC,SAAS,gBAAGC,eAAU;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAO1B;AAEF;AACO,MAAMC,gCAAgC,GAAIC,KAA0B,IAAI;EAC7E,MAAMC,QAAQ,GAAGC,4BAAoB,EAAE;EACvC,MAAMC,MAAM,GAAGN,SAAS,CAAC;IAAEO,GAAG,EAAEJ,KAAK,CAACI,GAAG;IAAEH;EAAQ,CAAE,CAAC;EAEtDD,KAAK,CAACJ,IAAI,CAACS,SAAS,GAAGP,mBAAY,CACjCH,gCAAwB,CAACC,IAAI,EAC7BI,KAAK,CAACM,cAAc,EACpBH,MAAM,CAACP,IAAI,EACXI,KAAK,CAACJ,IAAI,CAACS,SAAS,CACrB;EAED,OAAOL,KAAK;AACd,CAAC;AAZYL,wCAAgC","names":["exports","root","useStyles","core_1","useFluentProviderStyles_unstable","state","renderer","react_1","styles","dir","className","themeClassName"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-provider/src/components/FluentProvider/useFluentProviderStyles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/core';\nimport { useRenderer_unstable } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { FluentProviderSlots, FluentProviderState } from './FluentProvider.types';\nimport { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const fluentProviderClassNames: SlotClassNames<FluentProviderSlots> = {\n root: 'fui-FluentProvider',\n};\n\nconst useStyles = makeStyles({\n root: {\n color: tokens.colorNeutralForeground1,\n backgroundColor: tokens.colorNeutralBackground1,\n textAlign: 'left',\n ...typographyStyles.body1,\n },\n});\n\n/** Applies style classnames to slots */\nexport const useFluentProviderStyles_unstable = (state: FluentProviderState) => {\n const renderer = useRenderer_unstable();\n const styles = useStyles({ dir: state.dir, renderer });\n\n state.root.className = mergeClasses(\n fluentProviderClassNames.root,\n state.themeClassName,\n styles.root,\n state.root.className,\n );\n\n return state;\n};\n"]}
1
+ {"version":3,"sources":["../../../lib/components/FluentProvider/useFluentProviderStyles.js"],"sourcesContent":["import { makeStyles, 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__*/makeStyles({\n root: {\n color: tokens.colorNeutralForeground1,\n backgroundColor: tokens.colorNeutralBackground1,\n textAlign: 'left',\n ...typographyStyles.body1\n }\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.js.map"],"names":["fluentProviderClassNames","useFluentProviderStyles_unstable","root","useStyles","makeStyles","color","tokens","colorNeutralForeground1","backgroundColor","colorNeutralBackground1","textAlign","typographyStyles","body1","state","renderer","useRenderer_unstable","styles","dir","className","mergeClasses","themeClassName"],"mappings":";;;;;;;;;;;IAGaA,wBAAwB,MAAxBA;IAYAC,gCAAgC,MAAhCA;;sBAf4B;uBACJ;4BACI;AAClC,MAAMD,2BAA2B;IACtCE,MAAM;AACR;AACA,MAAMC,YAAY,WAAW,GAAEC,IAAAA,gBAAU,EAAC;IACxCF,MAAM;QACJG,OAAOC,kBAAM,CAACC,uBAAuB;QACrCC,iBAAiBF,kBAAM,CAACG,uBAAuB;QAC/CC,WAAW;QACX,GAAGC,4BAAgB,CAACC,KAAK;IAC3B;AACF;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,mDAAmD"}
@@ -1,73 +1,75 @@
1
1
  "use strict";
2
-
3
2
  Object.defineProperty(exports, "__esModule", {
4
- value: true
3
+ value: true
4
+ });
5
+ Object.defineProperty(exports, "useFluentProviderThemeStyleTag", {
6
+ enumerable: true,
7
+ get: ()=>useFluentProviderThemeStyleTag
5
8
  });
6
- exports.useFluentProviderThemeStyleTag = void 0;
7
- const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
8
- const react_1 = /*#__PURE__*/require("@griffel/react");
9
- const React = /*#__PURE__*/require("react");
10
- const useFluentProviderStyles_1 = /*#__PURE__*/require("./useFluentProviderStyles");
9
+ const _interopRequireWildcard = require("@swc/helpers/lib/_interop_require_wildcard.js").default;
10
+ const _reactUtilities = require("@fluentui/react-utilities");
11
+ const _react = require("@griffel/react");
12
+ const _react1 = /*#__PURE__*/ _interopRequireWildcard(require("react"));
13
+ const _useFluentProviderStyles = require("./useFluentProviderStyles");
11
14
  // String concatenation is used to prevent bundlers to complain with older versions of React
12
- const useInsertionEffect = React['useInsertion' + 'Effect'] ? React['useInsertion' + 'Effect'] : react_utilities_1.useIsomorphicLayoutEffect;
13
- const createStyleTag = (target, elementAttributes) => {
14
- if (!target) {
15
- return undefined;
16
- }
17
- const tag = target.createElement('style');
18
- Object.keys(elementAttributes).forEach(attrName => {
19
- tag.setAttribute(attrName, elementAttributes[attrName]);
20
- });
21
- target.head.appendChild(tag);
22
- return tag;
23
- };
24
- const insertSheet = (tag, rule) => {
25
- const sheet = tag.sheet;
26
- if (sheet) {
27
- if (sheet.cssRules.length > 0) {
28
- sheet.deleteRule(0);
15
+ const useInsertionEffect = _react1['useInsertion' + 'Effect'] ? _react1['useInsertion' + 'Effect'] : _reactUtilities.useIsomorphicLayoutEffect;
16
+ const createStyleTag = (target, elementAttributes)=>{
17
+ if (!target) {
18
+ return undefined;
29
19
  }
30
- sheet.insertRule(rule, 0);
31
- } else if (process.env.NODE_ENV !== 'production') {
32
- // eslint-disable-next-line no-console
33
- console.error('FluentProvider: No sheet available on styleTag, styles will not be inserted into DOM.');
34
- }
35
- };
36
- /**
37
- * Writes a theme as css variables in a style tag on the provided targetDocument as a rule applied to a CSS class
38
- *
39
- * @returns CSS class to apply the rule
40
- */
41
- const useFluentProviderThemeStyleTag = options => {
42
- const {
43
- targetDocument,
44
- theme
45
- } = options;
46
- const renderer = react_1.useRenderer_unstable();
47
- const styleTag = React.useRef();
48
- const styleTagId = react_utilities_1.useId(useFluentProviderStyles_1.fluentProviderClassNames.root);
49
- const styleElementAttributes = renderer.styleElementAttributes;
50
- const cssVarsAsString = React.useMemo(() => {
51
- return theme ? Object.keys(theme).reduce((cssVarRule, cssVar) => {
52
- cssVarRule += `--${cssVar}: ${theme[cssVar]}; `;
53
- return cssVarRule;
54
- }, '') : '';
55
- }, [theme]);
56
- const rule = `.${styleTagId} { ${cssVarsAsString} }`;
57
- useInsertionEffect(() => {
58
- styleTag.current = createStyleTag(targetDocument, {
59
- ...styleElementAttributes,
60
- id: styleTagId
20
+ const tag = target.createElement('style');
21
+ Object.keys(elementAttributes).forEach((attrName)=>{
22
+ tag.setAttribute(attrName, elementAttributes[attrName]);
61
23
  });
62
- if (styleTag.current) {
63
- insertSheet(styleTag.current, rule);
64
- return () => {
65
- var _a;
66
- (_a = styleTag.current) === null || _a === void 0 ? void 0 : _a.remove();
67
- };
24
+ target.head.appendChild(tag);
25
+ return tag;
26
+ };
27
+ const insertSheet = (tag, rule)=>{
28
+ const sheet = tag.sheet;
29
+ if (sheet) {
30
+ if (sheet.cssRules.length > 0) {
31
+ sheet.deleteRule(0);
32
+ }
33
+ sheet.insertRule(rule, 0);
34
+ } else if (process.env.NODE_ENV !== 'production') {
35
+ // eslint-disable-next-line no-console
36
+ console.error('FluentProvider: No sheet available on styleTag, styles will not be inserted into DOM.');
68
37
  }
69
- }, [styleTagId, targetDocument, rule, styleElementAttributes]);
70
- return styleTagId;
71
38
  };
72
- exports.useFluentProviderThemeStyleTag = useFluentProviderThemeStyleTag;
39
+ const useFluentProviderThemeStyleTag = (options)=>{
40
+ const { targetDocument , theme } = options;
41
+ const renderer = (0, _react.useRenderer_unstable)();
42
+ const styleTag = _react1.useRef();
43
+ const styleTagId = (0, _reactUtilities.useId)(_useFluentProviderStyles.fluentProviderClassNames.root);
44
+ const styleElementAttributes = renderer.styleElementAttributes;
45
+ const cssVarsAsString = _react1.useMemo(()=>{
46
+ return theme ? Object.keys(theme).reduce((cssVarRule, cssVar)=>{
47
+ cssVarRule += `--${cssVar}: ${theme[cssVar]}; `;
48
+ return cssVarRule;
49
+ }, '') : '';
50
+ }, [
51
+ theme
52
+ ]);
53
+ const rule = `.${styleTagId} { ${cssVarsAsString} }`;
54
+ useInsertionEffect(()=>{
55
+ styleTag.current = createStyleTag(targetDocument, {
56
+ ...styleElementAttributes,
57
+ id: styleTagId
58
+ });
59
+ if (styleTag.current) {
60
+ insertSheet(styleTag.current, rule);
61
+ return ()=>{
62
+ var _styleTag_current;
63
+ (_styleTag_current = styleTag.current) === null || _styleTag_current === void 0 ? void 0 : _styleTag_current.remove();
64
+ };
65
+ }
66
+ }, [
67
+ styleTagId,
68
+ targetDocument,
69
+ rule,
70
+ styleElementAttributes
71
+ ]);
72
+ return styleTagId;
73
+ }; //# sourceMappingURL=useFluentProviderThemeStyleTag.js.map
74
+
73
75
  //# sourceMappingURL=useFluentProviderThemeStyleTag.js.map
@@ -1 +1 @@
1
- {"version":3,"mappings":";;;;;;AAAA;AACA;AACA;AAGA;AAEA;AACA,MAAMA,kBAAkB,GAAIC,KAAe,CAAC,cAAc,GAAG,QAAQ,CAAC,GACjEA,KAAe,CAAC,cAAc,GAAG,QAAQ,CAAC,GAC3CC,2CAAyB;AAE7B,MAAMC,cAAc,GAAG,CAACC,MAA4B,EAAEC,iBAAyC,KAAI;EACjG,IAAI,CAACD,MAAM,EAAE;IACX,OAAOE,SAAS;;EAGlB,MAAMC,GAAG,GAAGH,MAAM,CAACI,aAAa,CAAC,OAAO,CAAC;EAEzCC,MAAM,CAACC,IAAI,CAACL,iBAAiB,CAAC,CAACM,OAAO,CAACC,QAAQ,IAAG;IAChDL,GAAG,CAACM,YAAY,CAACD,QAAQ,EAAEP,iBAAiB,CAACO,QAAQ,CAAC,CAAC;EACzD,CAAC,CAAC;EAEFR,MAAM,CAACU,IAAI,CAACC,WAAW,CAACR,GAAG,CAAC;EAC5B,OAAOA,GAAG;AACZ,CAAC;AAED,MAAMS,WAAW,GAAG,CAACT,GAAqB,EAAEU,IAAY,KAAI;EAC1D,MAAMC,KAAK,GAAGX,GAAG,CAACW,KAAK;EAEvB,IAAIA,KAAK,EAAE;IACT,IAAIA,KAAK,CAACC,QAAQ,CAACC,MAAM,GAAG,CAAC,EAAE;MAC7BF,KAAK,CAACG,UAAU,CAAC,CAAC,CAAC;;IAErBH,KAAK,CAACI,UAAU,CAACL,IAAI,EAAE,CAAC,CAAC;GAC1B,MAAM,IAAIM,OAAO,CAACC,GAAG,CAACC,QAAQ,KAAK,YAAY,EAAE;IAChD;IACAC,OAAO,CAACC,KAAK,CAAC,uFAAuF,CAAC;;AAE1G,CAAC;AAED;;;;;AAKO,MAAMC,8BAA8B,GAAIC,OAA8D,IAAI;EAC/G,MAAM;IAAEC,cAAc;IAAEC;EAAK,CAAE,GAAGF,OAAO;EAEzC,MAAMG,QAAQ,GAAGC,4BAAoB,EAAE;EACvC,MAAMC,QAAQ,GAAGjC,KAAK,CAACkC,MAAM,EAAoB;EAEjD,MAAMC,UAAU,GAAGlC,uBAAK,CAACmC,kDAAwB,CAACC,IAAI,CAAC;EACvD,MAAMC,sBAAsB,GAAGP,QAAQ,CAACO,sBAAsB;EAE9D,MAAMC,eAAe,GAAGvC,KAAK,CAACwC,OAAO,CAAC,MAAK;IACzC,OAAOV,KAAK,GACPtB,MAAM,CAACC,IAAI,CAACqB,KAAK,CAA4B,CAACW,MAAM,CAAC,CAACC,UAAU,EAAEC,MAAM,KAAI;MAC3ED,UAAU,IAAI,KAAKC,MAAM,KAAKb,KAAK,CAACa,MAAM,CAAC,IAAI;MAC/C,OAAOD,UAAU;IACnB,CAAC,EAAE,EAAE,CAAC,GACN,EAAE;EACR,CAAC,EAAE,CAACZ,KAAK,CAAC,CAAC;EAEX,MAAMd,IAAI,GAAG,IAAImB,UAAU,MAAMI,eAAe,IAAI;EAEpDxC,kBAAkB,CAAC,MAAK;IACtBkC,QAAQ,CAACW,OAAO,GAAG1C,cAAc,CAAC2B,cAAc,EAAE;MAAE,GAAGS,sBAAsB;MAAEO,EAAE,EAAEV;IAAU,CAAE,CAAC;IAEhG,IAAIF,QAAQ,CAACW,OAAO,EAAE;MACpB7B,WAAW,CAACkB,QAAQ,CAACW,OAAO,EAAE5B,IAAI,CAAC;MAEnC,OAAO,MAAK;;QACV,cAAQ,CAAC4B,OAAO,0CAAEE,MAAM,EAAE;MAC5B,CAAC;;EAEL,CAAC,EAAE,CAACX,UAAU,EAAEN,cAAc,EAAEb,IAAI,EAAEsB,sBAAsB,CAAC,CAAC;EAE9D,OAAOH,UAAU;AACnB,CAAC;AAjCYY,sCAA8B","names":["useInsertionEffect","React","react_utilities_1","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","renderer","react_1","styleTag","useRef","styleTagId","useFluentProviderStyles_1","root","styleElementAttributes","cssVarsAsString","useMemo","reduce","cssVarRule","cssVar","current","id","remove","exports"],"sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-provider/src/components/FluentProvider/useFluentProviderThemeStyleTag.ts"],"sourcesContent":["import { useId, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport { useRenderer_unstable } from '@griffel/react';\nimport * as React from 'react';\n\nimport type { FluentProviderState } from './FluentProvider.types';\nimport { fluentProviderClassNames } from './useFluentProviderStyles';\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 *\n * @returns CSS class to apply the rule\n */\nexport const useFluentProviderThemeStyleTag = (options: Pick<FluentProviderState, 'theme' | 'targetDocument'>) => {\n const { targetDocument, theme } = options;\n\n const renderer = useRenderer_unstable();\n const styleTag = React.useRef<HTMLStyleElement>();\n\n const styleTagId = useId(fluentProviderClassNames.root);\n const styleElementAttributes = renderer.styleElementAttributes;\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 useInsertionEffect(() => {\n styleTag.current = createStyleTag(targetDocument, { ...styleElementAttributes, id: styleTagId });\n\n if (styleTag.current) {\n insertSheet(styleTag.current, rule);\n\n return () => {\n styleTag.current?.remove();\n };\n }\n }, [styleTagId, targetDocument, rule, styleElementAttributes]);\n\n return styleTagId;\n};\n"]}
1
+ {"version":3,"sources":["../../../lib/components/FluentProvider/useFluentProviderThemeStyleTag.js"],"sourcesContent":["import { useId, useIsomorphicLayoutEffect } from '@fluentui/react-utilities';\nimport { useRenderer_unstable } from '@griffel/react';\nimport * as React from 'react';\nimport { fluentProviderClassNames } from './useFluentProviderStyles';\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 *\n * @returns CSS class to apply the rule\n */\nexport const useFluentProviderThemeStyleTag = options => {\n const {\n targetDocument,\n theme\n } = options;\n const renderer = useRenderer_unstable();\n const styleTag = React.useRef();\n const styleTagId = useId(fluentProviderClassNames.root);\n const styleElementAttributes = renderer.styleElementAttributes;\n const cssVarsAsString = React.useMemo(() => {\n return theme ? Object.keys(theme).reduce((cssVarRule, cssVar) => {\n cssVarRule += `--${cssVar}: ${theme[cssVar]}; `;\n return cssVarRule;\n }, '') : '';\n }, [theme]);\n const rule = `.${styleTagId} { ${cssVarsAsString} }`;\n useInsertionEffect(() => {\n styleTag.current = createStyleTag(targetDocument, {\n ...styleElementAttributes,\n id: styleTagId\n });\n if (styleTag.current) {\n insertSheet(styleTag.current, rule);\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, targetDocument, rule, styleElementAttributes]);\n return styleTagId;\n};\n//# sourceMappingURL=useFluentProviderThemeStyleTag.js.map"],"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","renderer","useRenderer_unstable","styleTag","useRef","styleTagId","useId","fluentProviderClassNames","root","styleElementAttributes","cssVarsAsString","useMemo","reduce","cssVarRule","cssVar","current","id","_styleTag_current","remove"],"mappings":";;;;+BAkCaA;;aAAAA;;;gCAlCoC;uBACZ;8DACd;yCACkB;AACzC,4FAA4F;AAC5F,MAAMC,qBAAqBC,OAAK,CAAC,iBAAiB,SAAS,GAAGA,OAAK,CAAC,iBAAiB,SAAS,GAAGC,yCAAyB;AAC1H,MAAMC,iBAAiB,CAACC,QAAQC,oBAAsB;IACpD,IAAI,CAACD,QAAQ;QACX,OAAOE;IACT,CAAC;IACD,MAAMC,MAAMH,OAAOI,aAAa,CAAC;IACjCC,OAAOC,IAAI,CAACL,mBAAmBM,OAAO,CAACC,CAAAA,WAAY;QACjDL,IAAIM,YAAY,CAACD,UAAUP,iBAAiB,CAACO,SAAS;IACxD;IACAR,OAAOU,IAAI,CAACC,WAAW,CAACR;IACxB,OAAOA;AACT;AACA,MAAMS,cAAc,CAACT,KAAKU,OAAS;IACjC,MAAMC,QAAQX,IAAIW,KAAK;IACvB,IAAIA,OAAO;QACT,IAAIA,MAAMC,QAAQ,CAACC,MAAM,GAAG,GAAG;YAC7BF,MAAMG,UAAU,CAAC;QACnB,CAAC;QACDH,MAAMI,UAAU,CAACL,MAAM;IACzB,OAAO,IAAIM,QAAQC,GAAG,CAACC,QAAQ,KAAK,cAAc;QAChD,sCAAsC;QACtCC,QAAQC,KAAK,CAAC;IAChB,CAAC;AACH;AAMO,MAAM5B,iCAAiC6B,CAAAA,UAAW;IACvD,MAAM,EACJC,eAAc,EACdC,MAAK,EACN,GAAGF;IACJ,MAAMG,WAAWC,IAAAA,2BAAoB;IACrC,MAAMC,WAAWhC,QAAMiC,MAAM;IAC7B,MAAMC,aAAaC,IAAAA,qBAAK,EAACC,iDAAwB,CAACC,IAAI;IACtD,MAAMC,yBAAyBR,SAASQ,sBAAsB;IAC9D,MAAMC,kBAAkBvC,QAAMwC,OAAO,CAAC,IAAM;QAC1C,OAAOX,QAAQrB,OAAOC,IAAI,CAACoB,OAAOY,MAAM,CAAC,CAACC,YAAYC,SAAW;YAC/DD,cAAc,CAAC,EAAE,EAAEC,OAAO,EAAE,EAAEd,KAAK,CAACc,OAAO,CAAC,EAAE,CAAC;YAC/C,OAAOD;QACT,GAAG,MAAM,EAAE;IACb,GAAG;QAACb;KAAM;IACV,MAAMb,OAAO,CAAC,CAAC,EAAEkB,WAAW,GAAG,EAAEK,gBAAgB,EAAE,CAAC;IACpDxC,mBAAmB,IAAM;QACvBiC,SAASY,OAAO,GAAG1C,eAAe0B,gBAAgB;YAChD,GAAGU,sBAAsB;YACzBO,IAAIX;QACN;QACA,IAAIF,SAASY,OAAO,EAAE;YACpB7B,YAAYiB,SAASY,OAAO,EAAE5B;YAC9B,OAAO,IAAM;gBACX,IAAI8B;gBACHA,CAAAA,oBAAoBd,SAASY,OAAO,AAAD,MAAO,IAAI,IAAIE,sBAAsB,KAAK,IAAI,KAAK,IAAIA,kBAAkBC,MAAM,EAAE;YACvH;QACF,CAAC;IACH,GAAG;QAACb;QAAYN;QAAgBZ;QAAMsB;KAAuB;IAC7D,OAAOJ;AACT,GACA,0DAA0D"}
@@ -1,50 +1,23 @@
1
1
  "use strict";
2
-
3
2
  Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.useFluentProviderThemeStyleTag = exports.useFluentProviderStyles_unstable = exports.useFluentProvider_unstable = exports.useFluentProviderContextValues_unstable = exports.renderFluentProvider_unstable = exports.FluentProvider = exports.fluentProviderClassNames = void 0;
7
- var FluentProvider_1 = /*#__PURE__*/require("./FluentProvider");
8
- Object.defineProperty(exports, "fluentProviderClassNames", {
9
- enumerable: true,
10
- get: function () {
11
- return FluentProvider_1.fluentProviderClassNames;
12
- }
13
- });
14
- Object.defineProperty(exports, "FluentProvider", {
15
- enumerable: true,
16
- get: function () {
17
- return FluentProvider_1.FluentProvider;
18
- }
19
- });
20
- Object.defineProperty(exports, "renderFluentProvider_unstable", {
21
- enumerable: true,
22
- get: function () {
23
- return FluentProvider_1.renderFluentProvider_unstable;
24
- }
25
- });
26
- Object.defineProperty(exports, "useFluentProviderContextValues_unstable", {
27
- enumerable: true,
28
- get: function () {
29
- return FluentProvider_1.useFluentProviderContextValues_unstable;
30
- }
31
- });
32
- Object.defineProperty(exports, "useFluentProvider_unstable", {
33
- enumerable: true,
34
- get: function () {
35
- return FluentProvider_1.useFluentProvider_unstable;
36
- }
37
- });
38
- Object.defineProperty(exports, "useFluentProviderStyles_unstable", {
39
- enumerable: true,
40
- get: function () {
41
- return FluentProvider_1.useFluentProviderStyles_unstable;
42
- }
43
- });
44
- Object.defineProperty(exports, "useFluentProviderThemeStyleTag", {
45
- enumerable: true,
46
- get: function () {
47
- return FluentProvider_1.useFluentProviderThemeStyleTag;
48
- }
49
- });
3
+ value: true
4
+ });
5
+ function _export(target, all) {
6
+ for(var name in all)Object.defineProperty(target, name, {
7
+ enumerable: true,
8
+ get: all[name]
9
+ });
10
+ }
11
+ _export(exports, {
12
+ fluentProviderClassNames: ()=>_fluentProvider.fluentProviderClassNames,
13
+ FluentProvider: ()=>_fluentProvider.FluentProvider,
14
+ renderFluentProvider_unstable: ()=>_fluentProvider.renderFluentProvider_unstable,
15
+ useFluentProviderContextValues_unstable: ()=>_fluentProvider.useFluentProviderContextValues_unstable,
16
+ useFluentProvider_unstable: ()=>_fluentProvider.useFluentProvider_unstable,
17
+ useFluentProviderStyles_unstable: ()=>_fluentProvider.useFluentProviderStyles_unstable,
18
+ useFluentProviderThemeStyleTag: ()=>_fluentProvider.useFluentProviderThemeStyleTag
19
+ });
20
+ const _fluentProvider = require("./FluentProvider");
21
+ //# sourceMappingURL=index.js.map
22
+
50
23
  //# sourceMappingURL=index.js.map
@@ -1 +1 @@
1
- {"version":3,"mappings":";;;;;;AAAA;AACEA;EAAAC;EAAAC;IAAA,gDAAwB;EAAA;AAAA;AACxBF;EAAAC;EAAAC;IAAA,sCAAc;EAAA;AAAA;AACdF;EAAAC;EAAAC;IAAA,qDAA6B;EAAA;AAAA;AAC7BF;EAAAC;EAAAC;IAAA,+DAAuC;EAAA;AAAA;AACvCF;EAAAC;EAAAC;IAAA,kDAA0B;EAAA;AAAA;AAC1BF;EAAAC;EAAAC;IAAA,wDAAgC;EAAA;AAAA;AAChCF;EAAAC;EAAAC;IAAA,sDAA8B;EAAA;AAAA","names":["Object","enumerable","get"],"sourceRoot":"","sources":["../../../../../../../packages/react-components/react-provider/src/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 FluentProviderProps,\n FluentProviderState,\n FluentProviderSlots,\n} from './FluentProvider';\n"]}
1
+ {"version":3,"sources":["../lib/index.js"],"sourcesContent":["export { fluentProviderClassNames, FluentProvider, renderFluentProvider_unstable, useFluentProviderContextValues_unstable, useFluentProvider_unstable, useFluentProviderStyles_unstable, useFluentProviderThemeStyleTag } from './FluentProvider';\n//# sourceMappingURL=index.js.map"],"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;CAC/N,iCAAiC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@fluentui/react-provider",
3
- "version": "0.0.0-nightly-20230222-0421.1",
3
+ "version": "0.0.0-nightly-20230223-2115.1",
4
4
  "description": "Fluent UI React provider component",
5
5
  "main": "lib-commonjs/index.js",
6
6
  "module": "lib/index.js",
@@ -22,23 +22,23 @@
22
22
  "storybook": "start-storybook",
23
23
  "start": "yarn storybook",
24
24
  "type-check": "tsc -b tsconfig.json",
25
- "generate-api": "tsc -p ./tsconfig.lib.json --emitDeclarationOnly && just-scripts api-extractor"
25
+ "generate-api": "just-scripts generate-api"
26
26
  },
27
27
  "devDependencies": {
28
28
  "@fluentui/eslint-plugin": "*",
29
29
  "@fluentui/react-conformance": "*",
30
- "@fluentui/react-conformance-griffel": "0.0.0-nightly-20230222-0421.1",
30
+ "@fluentui/react-conformance-griffel": "0.0.0-nightly-20230223-2115.1",
31
31
  "@fluentui/scripts-api-extractor": "*",
32
32
  "@fluentui/scripts-tasks": "*"
33
33
  },
34
34
  "dependencies": {
35
35
  "@griffel/core": "^1.9.0",
36
36
  "@griffel/react": "^1.5.2",
37
- "@fluentui/react-shared-contexts": "0.0.0-nightly-20230222-0421.1",
38
- "@fluentui/react-tabster": "0.0.0-nightly-20230222-0421.1",
39
- "@fluentui/react-theme": "0.0.0-nightly-20230222-0421.1",
40
- "@fluentui/react-utilities": "0.0.0-nightly-20230222-0421.1",
41
- "tslib": "^2.1.0"
37
+ "@fluentui/react-shared-contexts": "0.0.0-nightly-20230223-2115.1",
38
+ "@fluentui/react-tabster": "0.0.0-nightly-20230223-2115.1",
39
+ "@fluentui/react-theme": "0.0.0-nightly-20230223-2115.1",
40
+ "@fluentui/react-utilities": "0.0.0-nightly-20230223-2115.1",
41
+ "@swc/helpers": "^0.4.14"
42
42
  },
43
43
  "peerDependencies": {
44
44
  "@types/react": ">=16.8.0 <19.0.0",