@fluentui/react-provider 9.0.0-rc.1 → 9.0.0-rc.12
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 +403 -1
- package/CHANGELOG.md +232 -105
- package/dist/{react-provider.d.ts → index.d.ts} +26 -17
- package/{lib → dist}/tsdoc-metadata.json +0 -0
- package/lib/FluentProvider.js.map +1 -1
- package/lib/components/FluentProvider/FluentProvider.js.map +1 -1
- package/lib/components/FluentProvider/FluentProvider.types.js.map +1 -1
- package/lib/components/FluentProvider/index.js +1 -0
- package/lib/components/FluentProvider/index.js.map +1 -1
- package/lib/components/FluentProvider/renderFluentProvider.js.map +1 -1
- package/lib/components/FluentProvider/useFluentProvider.js +2 -2
- package/lib/components/FluentProvider/useFluentProvider.js.map +1 -1
- package/lib/components/FluentProvider/useFluentProviderContextValues.js.map +1 -1
- package/lib/components/FluentProvider/useFluentProviderStyles.js +4 -2
- package/lib/components/FluentProvider/useFluentProviderStyles.js.map +1 -1
- package/lib/components/FluentProvider/{useThemeStyleTag.js → useFluentProviderThemeStyleTag.js} +13 -8
- package/lib/components/FluentProvider/useFluentProviderThemeStyleTag.js.map +1 -0
- package/lib/index.js +1 -1
- package/lib/index.js.map +1 -1
- package/lib-commonjs/FluentProvider.js.map +1 -1
- package/lib-commonjs/components/FluentProvider/FluentProvider.js.map +1 -1
- package/lib-commonjs/components/FluentProvider/FluentProvider.types.js.map +1 -1
- package/lib-commonjs/components/FluentProvider/index.js +2 -0
- package/lib-commonjs/components/FluentProvider/index.js.map +1 -1
- package/lib-commonjs/components/FluentProvider/renderFluentProvider.js.map +1 -1
- package/lib-commonjs/components/FluentProvider/useFluentProvider.js +2 -2
- package/lib-commonjs/components/FluentProvider/useFluentProvider.js.map +1 -1
- package/lib-commonjs/components/FluentProvider/useFluentProviderContextValues.js.map +1 -1
- package/lib-commonjs/components/FluentProvider/useFluentProviderStyles.js +5 -3
- package/lib-commonjs/components/FluentProvider/useFluentProviderStyles.js.map +1 -1
- package/lib-commonjs/components/FluentProvider/{useThemeStyleTag.js → useFluentProviderThemeStyleTag.js} +14 -9
- package/lib-commonjs/components/FluentProvider/useFluentProviderThemeStyleTag.js.map +1 -0
- package/lib-commonjs/index.js +44 -3
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +18 -21
- package/lib/FluentProvider.d.ts +0 -1
- package/lib/components/FluentProvider/FluentProvider.d.ts +0 -3
- package/lib/components/FluentProvider/FluentProvider.types.d.ts +0 -26
- package/lib/components/FluentProvider/index.d.ts +0 -6
- package/lib/components/FluentProvider/renderFluentProvider.d.ts +0 -5
- package/lib/components/FluentProvider/useFluentProvider.d.ts +0 -12
- package/lib/components/FluentProvider/useFluentProviderContextValues.d.ts +0 -2
- package/lib/components/FluentProvider/useFluentProviderStyles.d.ts +0 -4
- package/lib/components/FluentProvider/useThemeStyleTag.d.ts +0 -7
- package/lib/components/FluentProvider/useThemeStyleTag.js.map +0 -1
- package/lib/index.d.ts +0 -2
- package/lib-commonjs/FluentProvider.d.ts +0 -1
- package/lib-commonjs/components/FluentProvider/FluentProvider.d.ts +0 -3
- package/lib-commonjs/components/FluentProvider/FluentProvider.types.d.ts +0 -26
- package/lib-commonjs/components/FluentProvider/index.d.ts +0 -6
- package/lib-commonjs/components/FluentProvider/renderFluentProvider.d.ts +0 -5
- package/lib-commonjs/components/FluentProvider/useFluentProvider.d.ts +0 -12
- package/lib-commonjs/components/FluentProvider/useFluentProviderContextValues.d.ts +0 -2
- package/lib-commonjs/components/FluentProvider/useFluentProviderStyles.d.ts +0 -4
- package/lib-commonjs/components/FluentProvider/useThemeStyleTag.d.ts +0 -7
- package/lib-commonjs/components/FluentProvider/useThemeStyleTag.js.map +0 -1
- package/lib-commonjs/index.d.ts +0 -2
@@ -1,45 +1,47 @@
|
|
1
|
-
import
|
1
|
+
import { ComponentProps } from '@fluentui/react-utilities';
|
2
2
|
import type { ComponentState } from '@fluentui/react-utilities';
|
3
3
|
import type { PartialTheme } from '@fluentui/react-theme';
|
4
4
|
import type { ProviderContextValue } from '@fluentui/react-shared-contexts';
|
5
5
|
import * as React_2 from 'react';
|
6
6
|
import type { Slot } from '@fluentui/react-utilities';
|
7
|
-
import
|
7
|
+
import { SlotClassNames } from '@fluentui/react-utilities';
|
8
|
+
import { Theme } from '@fluentui/react-theme';
|
8
9
|
import type { ThemeClassNameContextValue } from '@fluentui/react-shared-contexts';
|
9
10
|
import type { TooltipContextType } from '@fluentui/react-shared-contexts';
|
10
11
|
import { useFluent } from '@fluentui/react-shared-contexts';
|
11
12
|
import { useTheme } from '@fluentui/react-shared-contexts';
|
12
13
|
|
13
|
-
export declare const FluentProvider: React_2.ForwardRefExoticComponent<
|
14
|
+
export declare const FluentProvider: React_2.ForwardRefExoticComponent<Omit<ComponentProps<FluentProviderSlots, "root">, "dir"> & {
|
15
|
+
dir?: "ltr" | "rtl" | undefined;
|
16
|
+
targetDocument?: Document | undefined;
|
17
|
+
theme?: Partial<Theme> | undefined;
|
18
|
+
} & React_2.RefAttributes<HTMLElement>>;
|
14
19
|
|
15
|
-
export declare const
|
20
|
+
export declare const fluentProviderClassNames: SlotClassNames<FluentProviderSlots>;
|
16
21
|
|
17
|
-
declare
|
18
|
-
/** Sets the direction of text & generated styles. */
|
19
|
-
dir: 'ltr' | 'rtl';
|
20
|
-
/** Provides the document, can be undefined during SSR render. */
|
21
|
-
targetDocument: Document | undefined;
|
22
|
-
}
|
23
|
-
|
24
|
-
export declare interface FluentProviderContextValues extends Pick<FluentProviderState, 'theme'> {
|
22
|
+
export declare type FluentProviderContextValues = Pick<FluentProviderState, 'theme'> & {
|
25
23
|
provider: ProviderContextValue;
|
26
24
|
themeClassName: ThemeClassNameContextValue;
|
27
25
|
textDirection: 'ltr' | 'rtl';
|
28
26
|
tooltip: TooltipContextType;
|
29
|
-
}
|
27
|
+
};
|
30
28
|
|
31
|
-
export declare
|
29
|
+
export declare type FluentProviderProps = Omit<ComponentProps<FluentProviderSlots>, 'dir'> & {
|
30
|
+
/** Sets the direction of text & generated styles. */
|
31
|
+
dir?: 'ltr' | 'rtl';
|
32
|
+
/** Provides the document, can be undefined during SSR render. */
|
33
|
+
targetDocument?: Document;
|
32
34
|
theme?: PartialTheme;
|
33
|
-
}
|
35
|
+
};
|
34
36
|
|
35
37
|
export declare type FluentProviderSlots = {
|
36
38
|
root: Slot<'div'>;
|
37
39
|
};
|
38
40
|
|
39
|
-
export declare
|
41
|
+
export declare type FluentProviderState = ComponentState<FluentProviderSlots> & Pick<FluentProviderProps, 'targetDocument'> & Required<Pick<FluentProviderProps, 'dir'>> & {
|
40
42
|
theme: Theme | Partial<Theme> | undefined;
|
41
43
|
themeClassName: string;
|
42
|
-
}
|
44
|
+
};
|
43
45
|
|
44
46
|
/**
|
45
47
|
* Render the final JSX of FluentProvider
|
@@ -64,6 +66,13 @@ export declare function useFluentProviderContextValues_unstable(state: FluentPro
|
|
64
66
|
/** Applies style classnames to slots */
|
65
67
|
export declare const useFluentProviderStyles_unstable: (state: FluentProviderState) => FluentProviderState;
|
66
68
|
|
69
|
+
/**
|
70
|
+
* Writes a theme as css variables in a style tag on the provided targetDocument as a rule applied to a CSS class
|
71
|
+
*
|
72
|
+
* @returns CSS class to apply the rule
|
73
|
+
*/
|
74
|
+
export declare const useFluentProviderThemeStyleTag: (options: Pick<FluentProviderState, 'theme' | 'targetDocument'>) => string;
|
75
|
+
|
67
76
|
export { useTheme }
|
68
77
|
|
69
78
|
export { }
|
File without changes
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"FluentProvider.js","sourceRoot":"","sources":["
|
1
|
+
{"version":3,"file":"FluentProvider.js","sourceRoot":"../src/","sources":["FluentProvider.ts"],"names":[],"mappings":"AAAA,cAAc,mCAAmC,CAAC","sourcesContent":["export * from './components/FluentProvider/index';\n"]}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["components/FluentProvider/FluentProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,6BAAT,QAA8C,wBAA9C;AACA,SAAS,0BAAT,QAA2C,qBAA3C;AACA,SAAS,gCAAT,QAAiD,2BAAjD;AACA,SAAS,uCAAT,QAAwD,kCAAxD;AAGA,OAAO,MAAM,cAAc,gBAAG,KAAK,CAAC,UAAN,CAAmD,CAAC,KAAD,EAAQ,GAAR,KAAe;AAC9F,QAAM,KAAK,GAAG,0BAA0B,CAAC,KAAD,EAAQ,GAAR,CAAxC;AACA,EAAA,gCAAgC,CAAC,KAAD,CAAhC;AAEA,QAAM,aAAa,GAAG,uCAAuC,CAAC,KAAD,CAA7D;AAEA,SAAO,6BAA6B,CAAC,KAAD,EAAQ,aAAR,CAApC;AACD,CAP6B,CAAvB;AASP,cAAc,CAAC,WAAf,GAA6B,gBAA7B","sourcesContent":["import * as React from 'react';\nimport { renderFluentProvider_unstable } from './renderFluentProvider';\nimport { useFluentProvider_unstable } from './useFluentProvider';\nimport { useFluentProviderStyles_unstable } from './useFluentProviderStyles';\nimport { useFluentProviderContextValues_unstable } from './useFluentProviderContextValues';\nimport type { FluentProviderProps } from './FluentProvider.types';\n\nexport const FluentProvider = React.forwardRef<HTMLElement, FluentProviderProps>((props, ref) => {\n const state = useFluentProvider_unstable(props, ref);\n useFluentProviderStyles_unstable(state);\n\n const contextValues = useFluentProviderContextValues_unstable(state);\n\n return renderFluentProvider_unstable(state, contextValues);\n});\n\nFluentProvider.displayName = 'FluentProvider';\n"],"sourceRoot":"../src/"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"FluentProvider.types.js","sourceRoot":"","sources":["
|
1
|
+
{"version":3,"file":"FluentProvider.types.js","sourceRoot":"../src/","sources":["components/FluentProvider/FluentProvider.types.ts"],"names":[],"mappings":"","sourcesContent":["import type {\n ProviderContextValue,\n TooltipContextType,\n ThemeClassNameContextValue,\n} from '@fluentui/react-shared-contexts';\nimport type { PartialTheme, Theme } from '@fluentui/react-theme';\nimport type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type FluentProviderSlots = {\n root: Slot<'div'>;\n};\n\nexport type FluentProviderProps = Omit<ComponentProps<FluentProviderSlots>, 'dir'> & {\n /** Sets the direction of text & generated styles. */\n dir?: 'ltr' | 'rtl';\n\n /** Provides the document, can be undefined during SSR render. */\n targetDocument?: Document;\n\n theme?: PartialTheme;\n};\n\nexport type FluentProviderState = ComponentState<FluentProviderSlots> &\n Pick<FluentProviderProps, 'targetDocument'> &\n Required<Pick<FluentProviderProps, 'dir'>> & {\n theme: Theme | Partial<Theme> | undefined;\n themeClassName: string;\n };\n\nexport type FluentProviderContextValues = Pick<FluentProviderState, 'theme'> & {\n provider: ProviderContextValue;\n themeClassName: ThemeClassNameContextValue;\n textDirection: 'ltr' | 'rtl';\n tooltip: TooltipContextType;\n};\n"]}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["components/FluentProvider/index.ts"],"names":[],"mappings":"AAAA,cAAc,kBAAkB,CAAC;AACjC,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC;AACvC,cAAc,qBAAqB,CAAC;AACpC,cAAc,2BAA2B,CAAC;AAC1C,cAAc,kCAAkC,CAAC;AACjD,cAAc,kCAAkC,CAAC","sourcesContent":["export * from './FluentProvider';\nexport * from './FluentProvider.types';\nexport * from './renderFluentProvider';\nexport * from './useFluentProvider';\nexport * from './useFluentProviderStyles';\nexport * from './useFluentProviderContextValues';\nexport * from './useFluentProviderThemeStyleTag';\n"]}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["components/FluentProvider/renderFluentProvider.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,qBAAT,QAAsC,gBAAtC;AACA,SAAS,eAAT,EAA0B,cAA1B,EAA0C,YAA1C,EAAwD,qBAAxD,QAAqF,iCAArF;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,6BAA6B,GAAG,CAC3C,KAD2C,EAE3C,aAF2C,KAGzC;AACF,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,QAAQ,CAAsB,KAAtB,CAArC;AAEA,sBACE,KAAA,CAAA,aAAA,CAAC,eAAe,CAAC,QAAjB,EAAyB;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAAzB,eACE,KAAA,CAAA,aAAA,CAAC,YAAY,CAAC,QAAd,EAAsB;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAAtB,eACE,KAAA,CAAA,aAAA,CAAC,qBAAqB,CAAC,QAAvB,EAA+B;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAA/B,eACE,KAAA,CAAA,aAAA,CAAC,cAAc,CAAC,QAAhB,EAAwB;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAAxB,eACE,KAAA,CAAA,aAAA,CAAC,qBAAD,EAAsB;AAAC,IAAA,GAAG,EAAE,aAAa,CAAC;AAApB,GAAtB,eACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,EAAiC,KAAK,CAAC,IAAN,CAAW,QAA5C,CADF,CADF,CADF,CADF,CADF,CADF;AAaD,CAnBM","sourcesContent":["import * as React from 'react';\nimport { TextDirectionProvider } from '@griffel/react';\nimport { ProviderContext, TooltipContext, ThemeContext, ThemeClassNameContext } from '@fluentui/react-shared-contexts';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { FluentProviderSlots, FluentProviderContextValues, FluentProviderState } from './FluentProvider.types';\n\n/**\n * Render the final JSX of FluentProvider\n */\nexport const renderFluentProvider_unstable = (\n state: FluentProviderState,\n contextValues: FluentProviderContextValues,\n) => {\n const { slots, slotProps } = getSlots<FluentProviderSlots>(state);\n\n return (\n <ProviderContext.Provider value={contextValues.provider}>\n <ThemeContext.Provider value={contextValues.theme}>\n <ThemeClassNameContext.Provider value={contextValues.themeClassName}>\n <TooltipContext.Provider value={contextValues.tooltip}>\n <TextDirectionProvider dir={contextValues.textDirection}>\n <slots.root {...slotProps.root}>{state.root.children}</slots.root>\n </TextDirectionProvider>\n </TooltipContext.Provider>\n </ThemeClassNameContext.Provider>\n </ThemeContext.Provider>\n </ProviderContext.Provider>\n );\n};\n"],"sourceRoot":"../src/"}
|
@@ -2,7 +2,7 @@ import { useKeyboardNavAttribute } from '@fluentui/react-tabster';
|
|
2
2
|
import { useFluent, useTheme } from '@fluentui/react-shared-contexts';
|
3
3
|
import { getNativeElementProps, useMergedRefs } from '@fluentui/react-utilities';
|
4
4
|
import * as React from 'react';
|
5
|
-
import {
|
5
|
+
import { useFluentProviderThemeStyleTag } from './useFluentProviderThemeStyleTag';
|
6
6
|
/**
|
7
7
|
* Create the state required to render FluentProvider.
|
8
8
|
*
|
@@ -43,7 +43,7 @@ export const useFluentProvider_unstable = (props, ref) => {
|
|
43
43
|
dir,
|
44
44
|
targetDocument,
|
45
45
|
theme: mergedTheme,
|
46
|
-
themeClassName:
|
46
|
+
themeClassName: useFluentProviderThemeStyleTag({
|
47
47
|
theme: mergedTheme,
|
48
48
|
targetDocument
|
49
49
|
}),
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["components/FluentProvider/useFluentProvider.ts"],"names":[],"mappings":"AAAA,SAAS,uBAAT,QAAwC,yBAAxC;AAEA,SAAS,SAAT,EAAoB,QAApB,QAAoC,iCAApC;AACA,SAAS,qBAAT,EAAgC,aAAhC,QAAqD,2BAArD;AACA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,8BAAT,QAA+C,kCAA/C;AAGA;;;;;;;;AAQG;;AACH,OAAO,MAAM,0BAA0B,GAAG,CACxC,KADwC,EAExC,GAFwC,KAGjB;AACvB,QAAM,aAAa,GAAG,SAAS,EAA/B;AACA,QAAM,WAAW,GAAG,QAAQ,EAA5B;AAEA;;;;AAIG;;AACH,QAAM;AAAE,IAAA,GAAG,GAAG,aAAa,CAAC,GAAtB;AAA2B,IAAA,cAAc,GAAG,aAAa,CAAC,cAA1D;AAA0E,IAAA;AAA1E,MAAoF,KAA1F;AACA,QAAM,WAAW,GAAG,WAAW,CAAC,WAAD,EAAc,KAAd,CAA/B;AAEA,EAAA,KAAK,CAAC,SAAN,CAAgB,MAAK;AACnB,QAAI,OAAO,CAAC,GAAR,CAAY,QAAZ,KAAyB,YAAzB,IAAyC,WAAW,KAAK,SAA7D,EAAwE;AACtE;AACA,MAAA,OAAO,CAAC,IAAR,CAAa;;;;AAIZ,OAJD;AAKD,KARkB,CASnB;;AACD,GAVD,EAUG,EAVH;AAYA,SAAO;AACL,IAAA,GADK;AAEL,IAAA,cAFK;AAGL,IAAA,KAAK,EAAE,WAHF;AAIL,IAAA,cAAc,EAAE,8BAA8B,CAAC;AAAE,MAAA,KAAK,EAAE,WAAT;AAAsB,MAAA;AAAtB,KAAD,CAJzC;AAML,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE;AADI,KANP;AAUL,IAAA,IAAI,EAAE,qBAAqB,CAAC,KAAD,EAAQ,EACjC,GAAG,KAD8B;AAEjC,MAAA,GAFiC;AAGjC,MAAA,GAAG,EAAE,aAAa,CAAC,GAAD,EAAM,uBAAuB,EAA7B;AAHe,KAAR;AAVtB,GAAP;AAgBD,CA3CM;;AA6CP,SAAS,WAAT,CAAqB,CAArB,EAA4D,CAA5D,EAAuE;AACrE;AACA,MAAI,CAAC,IAAI,CAAT,EAAY;AACV,WAAO,EAAE,GAAG,CAAL;AAAQ,SAAG;AAAX,KAAP;AACD;;AAED,MAAI,CAAJ,EAAO;AACL,WAAO,CAAP;AACD;;AAED,SAAO,CAAP;AACD","sourcesContent":["import { useKeyboardNavAttribute } from '@fluentui/react-tabster';\nimport type { Theme } from '@fluentui/react-theme';\nimport { useFluent, useTheme } 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\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 { dir = parentContext.dir, targetDocument = parentContext.targetDocument, theme } = props;\n const mergedTheme = mergeThemes(parentTheme, theme);\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 dir,\n targetDocument,\n theme: mergedTheme,\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, useKeyboardNavAttribute()),\n }),\n };\n};\n\nfunction mergeThemes(a: Theme | Partial<Theme> | undefined, b: typeof a): Theme | Partial<Theme> | undefined {\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"],"sourceRoot":"../src/"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["components/FluentProvider/useFluentProviderContextValues.ts"],"names":[],"mappings":"AAAA,SAAS,QAAT,QAAyB,2BAAzB;AACA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AAGA,OAAM,SAAU,uCAAV,CAAkD,KAAlD,EAA4E;AAChF,QAAM;AAAE,IAAA,IAAF;AAAQ,IAAA,GAAR;AAAa,IAAA,cAAb;AAA6B,IAAA;AAA7B,MAAuC,KAA7C;AAEA,QAAM,QAAQ,GAAG,KAAK,CAAC,OAAN,CAAc,OAAO;AAAE,IAAA,GAAF;AAAO,IAAA;AAAP,GAAP,CAAd,EAA+C,CAAC,GAAD,EAAM,cAAN,CAA/C,CAAjB,CAHgF,CAIhF;;AACA,QAAM,OAAO,GAAG,QAAQ,CAAC,EAAD,CAAxB;AAEA,SAAO;AACL,IAAA,QADK;AAEL,IAAA,aAAa,EAAE,GAFV;AAGL,IAAA,OAHK;AAIL,IAAA,KAJK;AAKL,IAAA,cAAc,EAAE,IAAI,CAAC;AALhB,GAAP;AAOD","sourcesContent":["import { useConst } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport type { FluentProviderContextValues, FluentProviderState } from './FluentProvider.types';\n\nexport function useFluentProviderContextValues_unstable(state: FluentProviderState): FluentProviderContextValues {\n const { root, dir, targetDocument, theme } = 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 = useConst({});\n\n return {\n provider,\n textDirection: dir,\n tooltip,\n theme,\n themeClassName: root.className!,\n };\n}\n"],"sourceRoot":"../src/"}
|
@@ -1,6 +1,8 @@
|
|
1
1
|
import { __styles, mergeClasses } from '@griffel/react';
|
2
2
|
import { tokens } from '@fluentui/react-theme';
|
3
|
-
export const
|
3
|
+
export const fluentProviderClassNames = {
|
4
|
+
root: 'fui-FluentProvider'
|
5
|
+
};
|
4
6
|
|
5
7
|
const useStyles = /*#__PURE__*/__styles({
|
6
8
|
"root": {
|
@@ -18,7 +20,7 @@ const useStyles = /*#__PURE__*/__styles({
|
|
18
20
|
|
19
21
|
export const useFluentProviderStyles_unstable = state => {
|
20
22
|
const styles = useStyles();
|
21
|
-
state.root.className = mergeClasses(
|
23
|
+
state.root.className = mergeClasses(fluentProviderClassNames.root, state.themeClassName, styles.root, state.root.className);
|
22
24
|
return state;
|
23
25
|
};
|
24
26
|
//# sourceMappingURL=useFluentProviderStyles.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["components/FluentProvider/useFluentProviderStyles.ts"],"names":[],"mappings":"AAAA,mBAAqB,YAArB,QAAyC,gBAAzC;AACA,SAAS,MAAT,QAAuB,uBAAvB;AAIA,OAAO,MAAM,wBAAwB,GAAwC;AAC3E,EAAA,IAAI,EAAE;AADqE,CAAtE;;AAIP,MAAM,SAAS,gBAAG;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAUA;;;AACA,OAAO,MAAM,gCAAgC,GAAI,KAAD,IAA+B;AAC7E,QAAM,MAAM,GAAG,SAAS,EAAxB;AAEA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,YAAY,CACjC,wBAAwB,CAAC,IADQ,EAEjC,KAAK,CAAC,cAF2B,EAGjC,MAAM,CAAC,IAH0B,EAIjC,KAAK,CAAC,IAAN,CAAW,SAJsB,CAAnC;AAOA,SAAO,KAAP;AACD,CAXM","sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } 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 fontFamily: tokens.fontFamilyBase,\n fontSize: tokens.fontSizeBase300,\n fontWeight: tokens.fontWeightRegular,\n },\n});\n\n/** Applies style classnames to slots */\nexport const useFluentProviderStyles_unstable = (state: FluentProviderState) => {\n const styles = useStyles();\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"],"sourceRoot":"../src/"}
|
package/lib/components/FluentProvider/{useThemeStyleTag.js → useFluentProviderThemeStyleTag.js}
RENAMED
@@ -1,18 +1,18 @@
|
|
1
1
|
import { useId, usePrevious } from '@fluentui/react-utilities';
|
2
2
|
import * as React from 'react';
|
3
|
-
import {
|
3
|
+
import { fluentProviderClassNames } from './useFluentProviderStyles';
|
4
4
|
/**
|
5
5
|
* Writes a theme as css variables in a style tag on the provided targetDocument as a rule applied to a CSS class
|
6
6
|
*
|
7
7
|
* @returns CSS class to apply the rule
|
8
8
|
*/
|
9
9
|
|
10
|
-
export const
|
10
|
+
export const useFluentProviderThemeStyleTag = options => {
|
11
11
|
const {
|
12
12
|
targetDocument,
|
13
13
|
theme
|
14
14
|
} = options;
|
15
|
-
const styleTagId = useId(
|
15
|
+
const styleTagId = useId(fluentProviderClassNames.root);
|
16
16
|
const styleTag = React.useMemo(() => {
|
17
17
|
if (!targetDocument) {
|
18
18
|
return null;
|
@@ -36,11 +36,16 @@ export const useThemeStyleTag = options => {
|
|
36
36
|
if (styleTag && previousCssRule !== cssRule) {
|
37
37
|
const sheet = styleTag.sheet;
|
38
38
|
|
39
|
-
if (sheet
|
40
|
-
sheet.
|
41
|
-
|
39
|
+
if (sheet) {
|
40
|
+
if (sheet.cssRules.length > 0) {
|
41
|
+
sheet.deleteRule(0);
|
42
|
+
}
|
42
43
|
|
43
|
-
|
44
|
+
sheet.insertRule(cssRule, 0);
|
45
|
+
} else if (process.env.NODE_ENV !== 'production') {
|
46
|
+
// eslint-disable-next-line no-console
|
47
|
+
console.error('FluentProvider: No sheet available on styleTag, styles will not be inserted into DOM.');
|
48
|
+
}
|
44
49
|
} // Removes the style tag from the targetDocument on unmount or change
|
45
50
|
|
46
51
|
|
@@ -53,4 +58,4 @@ export const useThemeStyleTag = options => {
|
|
53
58
|
}, [styleTag]);
|
54
59
|
return styleTagId;
|
55
60
|
};
|
56
|
-
//# sourceMappingURL=
|
61
|
+
//# sourceMappingURL=useFluentProviderThemeStyleTag.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["components/FluentProvider/useFluentProviderThemeStyleTag.ts"],"names":[],"mappings":"AAAA,SAAS,KAAT,EAAgB,WAAhB,QAAmC,2BAAnC;AACA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AAEA,SAAS,wBAAT,QAAyC,2BAAzC;AAEA;;;;AAIG;;AACH,OAAO,MAAM,8BAA8B,GAAI,OAAD,IAAmE;AAC/G,QAAM;AAAE,IAAA,cAAF;AAAkB,IAAA;AAAlB,MAA4B,OAAlC;AAEA,QAAM,UAAU,GAAG,KAAK,CAAC,wBAAwB,CAAC,IAA1B,CAAxB;AACA,QAAM,QAAQ,GAAG,KAAK,CAAC,OAAN,CAAc,MAAK;AAClC,QAAI,CAAC,cAAL,EAAqB;AACnB,aAAO,IAAP;AACD;;AAED,UAAM,GAAG,GAAG,cAAc,CAAC,aAAf,CAA6B,OAA7B,CAAZ;AACA,IAAA,GAAG,CAAC,YAAJ,CAAiB,IAAjB,EAAuB,UAAvB;AACA,IAAA,cAAc,CAAC,IAAf,CAAoB,WAApB,CAAgC,GAAhC;AACA,WAAO,GAAP;AACD,GATgB,EASd,CAAC,UAAD,EAAa,cAAb,CATc,CAAjB;AAWA,QAAM,OAAO,GAAG,KAAK,CAAC,OAAN,CAAc,MAAK;AACjC,UAAM,eAAe,GAAG,KAAK,GACxB,MAAM,CAAC,IAAP,CAAY,KAAZ,EAA8C,MAA9C,CAAqD,CAAC,UAAD,EAAa,MAAb,KAAuB;AAC3E,MAAA,UAAU,IAAI,KAAK,MAAM,KAAK,KAAK,CAAC,MAAD,CAAQ,IAA3C;AACA,aAAO,UAAP;AACD,KAHA,EAGE,EAHF,CADwB,GAKzB,EALJ,CADiC,CAQjC;;AACA,WAAO,IAAI,UAAU,MAAM,eAAe,IAA1C;AACD,GAVe,EAUb,CAAC,KAAD,EAAQ,UAAR,CAVa,CAAhB;AAWA,QAAM,eAAe,GAAG,WAAW,CAAC,OAAD,CAAnC;;AAEA,MAAI,QAAQ,IAAI,eAAe,KAAK,OAApC,EAA6C;AAC3C,UAAM,KAAK,GAAG,QAAQ,CAAC,KAAvB;;AAEA,QAAI,KAAJ,EAAW;AACT,UAAI,KAAK,CAAC,QAAN,CAAe,MAAf,GAAwB,CAA5B,EAA+B;AAC7B,QAAA,KAAK,CAAC,UAAN,CAAiB,CAAjB;AACD;;AACD,MAAA,KAAK,CAAC,UAAN,CAAiB,OAAjB,EAA0B,CAA1B;AACD,KALD,MAKO,IAAI,OAAO,CAAC,GAAR,CAAY,QAAZ,KAAyB,YAA7B,EAA2C;AAChD;AACA,MAAA,OAAO,CAAC,KAAR,CAAc,uFAAd;AACD;AACF,GAxC8G,CA0C/G;;;AACA,EAAA,KAAK,CAAC,SAAN,CAAgB,MAAK;AACnB,WAAO,MAAK;AACV,UAAI,QAAJ,EAAc;AACZ,QAAA,QAAQ,CAAC,MAAT;AACD;AACF,KAJD;AAKD,GAND,EAMG,CAAC,QAAD,CANH;AAQA,SAAO,UAAP;AACD,CApDM","sourcesContent":["import { useId, usePrevious } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport type { FluentProviderState } from './FluentProvider.types';\nimport { fluentProviderClassNames } from './useFluentProviderStyles';\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 styleTagId = useId(fluentProviderClassNames.root);\n const styleTag = React.useMemo(() => {\n if (!targetDocument) {\n return null;\n }\n\n const tag = targetDocument.createElement('style');\n tag.setAttribute('id', styleTagId);\n targetDocument.head.appendChild(tag);\n return tag;\n }, [styleTagId, targetDocument]);\n\n const cssRule = React.useMemo(() => {\n const cssVarsAsString = theme\n ? (Object.keys(theme) as (keyof typeof theme)[]).reduce((cssVarRule, cssVar) => {\n cssVarRule += `--${cssVar}: ${theme[cssVar]}; `;\n return cssVarRule;\n }, '')\n : '';\n\n // result: .fluent-provider1 { --css-var: '#fff' }\n return `.${styleTagId} { ${cssVarsAsString} }`;\n }, [theme, styleTagId]);\n const previousCssRule = usePrevious(cssRule);\n\n if (styleTag && previousCssRule !== cssRule) {\n const sheet = styleTag.sheet;\n\n if (sheet) {\n if (sheet.cssRules.length > 0) {\n sheet.deleteRule(0);\n }\n sheet.insertRule(cssRule, 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 // Removes the style tag from the targetDocument on unmount or change\n React.useEffect(() => {\n return () => {\n if (styleTag) {\n styleTag.remove();\n }\n };\n }, [styleTag]);\n\n return styleTagId;\n};\n"],"sourceRoot":"../src/"}
|
package/lib/index.js
CHANGED
@@ -1,3 +1,3 @@
|
|
1
|
-
export
|
1
|
+
export { fluentProviderClassNames, FluentProvider, renderFluentProvider_unstable, useFluentProviderContextValues_unstable, useFluentProvider_unstable, useFluentProviderStyles_unstable, useFluentProviderThemeStyleTag } from './FluentProvider';
|
2
2
|
export { useFluent, useTheme } from '@fluentui/react-shared-contexts';
|
3
3
|
//# sourceMappingURL=index.js.map
|
package/lib/index.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"
|
1
|
+
{"version":3,"sources":["index.ts"],"names":[],"mappings":"AAAA,SACE,wBADF,EAEE,cAFF,EAGE,6BAHF,EAIE,uCAJF,EAKE,0BALF,EAME,gCANF,EAOE,8BAPF,QAQO,kBARP;AAgBA,SAAS,SAAT,EAAoB,QAApB,QAAoC,iCAApC","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\nexport { useFluent, useTheme } from '@fluentui/react-shared-contexts';\n"],"sourceRoot":"../src/"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["FluentProvider.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,mCAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './components/FluentProvider/index';\n"],"sourceRoot":"../src/"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["components/FluentProvider/FluentProvider.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,sBAAA,gBAAA,OAAA,CAAA,wBAAA,CAAA;;AACA,MAAA,mBAAA,gBAAA,OAAA,CAAA,qBAAA,CAAA;;AACA,MAAA,yBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,gCAAA,gBAAA,OAAA,CAAA,kCAAA,CAAA;;AAGa,OAAA,CAAA,cAAA,gBAAiB,KAAK,CAAC,UAAN,CAAmD,CAAC,KAAD,EAAQ,GAAR,KAAe;AAC9F,QAAM,KAAK,GAAG,mBAAA,CAAA,0BAAA,CAA2B,KAA3B,EAAkC,GAAlC,CAAd;AACA,EAAA,yBAAA,CAAA,gCAAA,CAAiC,KAAjC;AAEA,QAAM,aAAa,GAAG,gCAAA,CAAA,uCAAA,CAAwC,KAAxC,CAAtB;AAEA,SAAO,sBAAA,CAAA,6BAAA,CAA8B,KAA9B,EAAqC,aAArC,CAAP;AACD,CAP6B,CAAjB;AASb,OAAA,CAAA,cAAA,CAAe,WAAf,GAA6B,gBAA7B","sourcesContent":["import * as React from 'react';\nimport { renderFluentProvider_unstable } from './renderFluentProvider';\nimport { useFluentProvider_unstable } from './useFluentProvider';\nimport { useFluentProviderStyles_unstable } from './useFluentProviderStyles';\nimport { useFluentProviderContextValues_unstable } from './useFluentProviderContextValues';\nimport type { FluentProviderProps } from './FluentProvider.types';\n\nexport const FluentProvider = React.forwardRef<HTMLElement, FluentProviderProps>((props, ref) => {\n const state = useFluentProvider_unstable(props, ref);\n useFluentProviderStyles_unstable(state);\n\n const contextValues = useFluentProviderContextValues_unstable(state);\n\n return renderFluentProvider_unstable(state, contextValues);\n});\n\nFluentProvider.displayName = 'FluentProvider';\n"],"sourceRoot":"../src/"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":""}
|
1
|
+
{"version":3,"sources":[],"names":[],"mappings":"","sourceRoot":"../src/"}
|
@@ -17,4 +17,6 @@ tslib_1.__exportStar(require("./useFluentProvider"), exports);
|
|
17
17
|
tslib_1.__exportStar(require("./useFluentProviderStyles"), exports);
|
18
18
|
|
19
19
|
tslib_1.__exportStar(require("./useFluentProviderContextValues"), exports);
|
20
|
+
|
21
|
+
tslib_1.__exportStar(require("./useFluentProviderThemeStyleTag"), exports);
|
20
22
|
//# sourceMappingURL=index.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["components/FluentProvider/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,kBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,wBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,wBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,qBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,2BAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,kCAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,kCAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './FluentProvider';\nexport * from './FluentProvider.types';\nexport * from './renderFluentProvider';\nexport * from './useFluentProvider';\nexport * from './useFluentProviderStyles';\nexport * from './useFluentProviderContextValues';\nexport * from './useFluentProviderThemeStyleTag';\n"],"sourceRoot":"../src/"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["components/FluentProvider/renderFluentProvider.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,uBAAA,gBAAA,OAAA,CAAA,iCAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,6BAA6B,GAAG,CAC3C,KAD2C,EAE3C,aAF2C,KAGzC;AACF,QAAM;AAAE,IAAA,KAAF;AAAS,IAAA;AAAT,MAAuB,iBAAA,CAAA,QAAA,CAA8B,KAA9B,CAA7B;AAEA,SACE,KAAA,CAAA,aAAA,CAAC,uBAAA,CAAA,eAAA,CAAgB,QAAjB,EAAyB;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAAzB,EACE,KAAA,CAAA,aAAA,CAAC,uBAAA,CAAA,YAAA,CAAa,QAAd,EAAsB;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAAtB,EACE,KAAA,CAAA,aAAA,CAAC,uBAAA,CAAA,qBAAA,CAAsB,QAAvB,EAA+B;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAA/B,EACE,KAAA,CAAA,aAAA,CAAC,uBAAA,CAAA,cAAA,CAAe,QAAhB,EAAwB;AAAC,IAAA,KAAK,EAAE,aAAa,CAAC;AAAtB,GAAxB,EACE,KAAA,CAAA,aAAA,CAAC,OAAA,CAAA,qBAAD,EAAsB;AAAC,IAAA,GAAG,EAAE,aAAa,CAAC;AAApB,GAAtB,EACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;AAAf,GAAX,EAAiC,KAAK,CAAC,IAAN,CAAW,QAA5C,CADF,CADF,CADF,CADF,CADF,CADF;AAaD,CAnBM;;AAAM,OAAA,CAAA,6BAAA,GAA6B,6BAA7B","sourcesContent":["import * as React from 'react';\nimport { TextDirectionProvider } from '@griffel/react';\nimport { ProviderContext, TooltipContext, ThemeContext, ThemeClassNameContext } from '@fluentui/react-shared-contexts';\nimport { getSlots } from '@fluentui/react-utilities';\nimport type { FluentProviderSlots, FluentProviderContextValues, FluentProviderState } from './FluentProvider.types';\n\n/**\n * Render the final JSX of FluentProvider\n */\nexport const renderFluentProvider_unstable = (\n state: FluentProviderState,\n contextValues: FluentProviderContextValues,\n) => {\n const { slots, slotProps } = getSlots<FluentProviderSlots>(state);\n\n return (\n <ProviderContext.Provider value={contextValues.provider}>\n <ThemeContext.Provider value={contextValues.theme}>\n <ThemeClassNameContext.Provider value={contextValues.themeClassName}>\n <TooltipContext.Provider value={contextValues.tooltip}>\n <TextDirectionProvider dir={contextValues.textDirection}>\n <slots.root {...slotProps.root}>{state.root.children}</slots.root>\n </TextDirectionProvider>\n </TooltipContext.Provider>\n </ThemeClassNameContext.Provider>\n </ThemeContext.Provider>\n </ProviderContext.Provider>\n );\n};\n"],"sourceRoot":"../src/"}
|
@@ -13,7 +13,7 @@ const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
|
|
13
13
|
|
14
14
|
const React = /*#__PURE__*/require("react");
|
15
15
|
|
16
|
-
const
|
16
|
+
const useFluentProviderThemeStyleTag_1 = /*#__PURE__*/require("./useFluentProviderThemeStyleTag");
|
17
17
|
/**
|
18
18
|
* Create the state required to render FluentProvider.
|
19
19
|
*
|
@@ -55,7 +55,7 @@ const useFluentProvider_unstable = (props, ref) => {
|
|
55
55
|
dir,
|
56
56
|
targetDocument,
|
57
57
|
theme: mergedTheme,
|
58
|
-
themeClassName:
|
58
|
+
themeClassName: useFluentProviderThemeStyleTag_1.useFluentProviderThemeStyleTag({
|
59
59
|
theme: mergedTheme,
|
60
60
|
targetDocument
|
61
61
|
}),
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["components/FluentProvider/useFluentProvider.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,eAAA,gBAAA,OAAA,CAAA,yBAAA,CAAA;;AAEA,MAAA,uBAAA,gBAAA,OAAA,CAAA,iCAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,gCAAA,gBAAA,OAAA,CAAA,kCAAA,CAAA;AAGA;;;;;;;;AAQG;;;AACI,MAAM,0BAA0B,GAAG,CACxC,KADwC,EAExC,GAFwC,KAGjB;AACvB,QAAM,aAAa,GAAG,uBAAA,CAAA,SAAA,EAAtB;AACA,QAAM,WAAW,GAAG,uBAAA,CAAA,QAAA,EAApB;AAEA;;;;AAIG;;AACH,QAAM;AAAE,IAAA,GAAG,GAAG,aAAa,CAAC,GAAtB;AAA2B,IAAA,cAAc,GAAG,aAAa,CAAC,cAA1D;AAA0E,IAAA;AAA1E,MAAoF,KAA1F;AACA,QAAM,WAAW,GAAG,WAAW,CAAC,WAAD,EAAc,KAAd,CAA/B;AAEA,EAAA,KAAK,CAAC,SAAN,CAAgB,MAAK;AACnB,QAAI,OAAO,CAAC,GAAR,CAAY,QAAZ,KAAyB,YAAzB,IAAyC,WAAW,KAAK,SAA7D,EAAwE;AACtE;AACA,MAAA,OAAO,CAAC,IAAR,CAAa;;;;AAIZ,OAJD;AAKD,KARkB,CASnB;;AACD,GAVD,EAUG,EAVH;AAYA,SAAO;AACL,IAAA,GADK;AAEL,IAAA,cAFK;AAGL,IAAA,KAAK,EAAE,WAHF;AAIL,IAAA,cAAc,EAAE,gCAAA,CAAA,8BAAA,CAA+B;AAAE,MAAA,KAAK,EAAE,WAAT;AAAsB,MAAA;AAAtB,KAA/B,CAJX;AAML,IAAA,UAAU,EAAE;AACV,MAAA,IAAI,EAAE;AADI,KANP;AAUL,IAAA,IAAI,EAAE,iBAAA,CAAA,qBAAA,CAAsB,KAAtB,EAA6B,EACjC,GAAG,KAD8B;AAEjC,MAAA,GAFiC;AAGjC,MAAA,GAAG,EAAE,iBAAA,CAAA,aAAA,CAAc,GAAd,EAAmB,eAAA,CAAA,uBAAA,EAAnB;AAH4B,KAA7B;AAVD,GAAP;AAgBD,CA3CM;;AAAM,OAAA,CAAA,0BAAA,GAA0B,0BAA1B;;AA6Cb,SAAS,WAAT,CAAqB,CAArB,EAA4D,CAA5D,EAAuE;AACrE;AACA,MAAI,CAAC,IAAI,CAAT,EAAY;AACV,WAAO,EAAE,GAAG,CAAL;AAAQ,SAAG;AAAX,KAAP;AACD;;AAED,MAAI,CAAJ,EAAO;AACL,WAAO,CAAP;AACD;;AAED,SAAO,CAAP;AACD","sourcesContent":["import { useKeyboardNavAttribute } from '@fluentui/react-tabster';\nimport type { Theme } from '@fluentui/react-theme';\nimport { useFluent, useTheme } 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\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 { dir = parentContext.dir, targetDocument = parentContext.targetDocument, theme } = props;\n const mergedTheme = mergeThemes(parentTheme, theme);\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 dir,\n targetDocument,\n theme: mergedTheme,\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, useKeyboardNavAttribute()),\n }),\n };\n};\n\nfunction mergeThemes(a: Theme | Partial<Theme> | undefined, b: typeof a): Theme | Partial<Theme> | undefined {\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"],"sourceRoot":"../src/"}
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["components/FluentProvider/useFluentProviderContextValues.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAGA,SAAgB,uCAAhB,CAAwD,KAAxD,EAAkF;AAChF,QAAM;AAAE,IAAA,IAAF;AAAQ,IAAA,GAAR;AAAa,IAAA,cAAb;AAA6B,IAAA;AAA7B,MAAuC,KAA7C;AAEA,QAAM,QAAQ,GAAG,KAAK,CAAC,OAAN,CAAc,OAAO;AAAE,IAAA,GAAF;AAAO,IAAA;AAAP,GAAP,CAAd,EAA+C,CAAC,GAAD,EAAM,cAAN,CAA/C,CAAjB,CAHgF,CAIhF;;AACA,QAAM,OAAO,GAAG,iBAAA,CAAA,QAAA,CAAS,EAAT,CAAhB;AAEA,SAAO;AACL,IAAA,QADK;AAEL,IAAA,aAAa,EAAE,GAFV;AAGL,IAAA,OAHK;AAIL,IAAA,KAJK;AAKL,IAAA,cAAc,EAAE,IAAI,CAAC;AALhB,GAAP;AAOD;;AAdD,OAAA,CAAA,uCAAA,GAAA,uCAAA","sourcesContent":["import { useConst } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport type { FluentProviderContextValues, FluentProviderState } from './FluentProvider.types';\n\nexport function useFluentProviderContextValues_unstable(state: FluentProviderState): FluentProviderContextValues {\n const { root, dir, targetDocument, theme } = 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 = useConst({});\n\n return {\n provider,\n textDirection: dir,\n tooltip,\n theme,\n themeClassName: root.className!,\n };\n}\n"],"sourceRoot":"../src/"}
|
@@ -3,13 +3,15 @@
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
4
4
|
value: true
|
5
5
|
});
|
6
|
-
exports.useFluentProviderStyles_unstable = exports.
|
6
|
+
exports.useFluentProviderStyles_unstable = exports.fluentProviderClassNames = void 0;
|
7
7
|
|
8
8
|
const react_1 = /*#__PURE__*/require("@griffel/react");
|
9
9
|
|
10
10
|
const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
|
11
11
|
|
12
|
-
exports.
|
12
|
+
exports.fluentProviderClassNames = {
|
13
|
+
root: 'fui-FluentProvider'
|
14
|
+
};
|
13
15
|
|
14
16
|
const useStyles = /*#__PURE__*/react_1.__styles({
|
15
17
|
"root": {
|
@@ -27,7 +29,7 @@ const useStyles = /*#__PURE__*/react_1.__styles({
|
|
27
29
|
|
28
30
|
const useFluentProviderStyles_unstable = state => {
|
29
31
|
const styles = useStyles();
|
30
|
-
state.root.className = react_1.mergeClasses(exports.
|
32
|
+
state.root.className = react_1.mergeClasses(exports.fluentProviderClassNames.root, state.themeClassName, styles.root, state.root.className);
|
31
33
|
return state;
|
32
34
|
};
|
33
35
|
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["components/FluentProvider/useFluentProviderStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AAIa,OAAA,CAAA,wBAAA,GAAgE;AAC3E,EAAA,IAAI,EAAE;AADqE,CAAhE;;AAIb,MAAM,SAAS,gBAAG,OAAA,SAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAlB;AAUA;;;AACO,MAAM,gCAAgC,GAAI,KAAD,IAA+B;AAC7E,QAAM,MAAM,GAAG,SAAS,EAAxB;AAEA,EAAA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CACrB,OAAA,CAAA,wBAAA,CAAyB,IADJ,EAErB,KAAK,CAAC,cAFe,EAGrB,MAAM,CAAC,IAHc,EAIrB,KAAK,CAAC,IAAN,CAAW,SAJU,CAAvB;AAOA,SAAO,KAAP;AACD,CAXM;;AAAM,OAAA,CAAA,gCAAA,GAAgC,gCAAhC","sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } 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 fontFamily: tokens.fontFamilyBase,\n fontSize: tokens.fontSizeBase300,\n fontWeight: tokens.fontWeightRegular,\n },\n});\n\n/** Applies style classnames to slots */\nexport const useFluentProviderStyles_unstable = (state: FluentProviderState) => {\n const styles = useStyles();\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"],"sourceRoot":"../src/"}
|
@@ -3,7 +3,7 @@
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
4
4
|
value: true
|
5
5
|
});
|
6
|
-
exports.
|
6
|
+
exports.useFluentProviderThemeStyleTag = void 0;
|
7
7
|
|
8
8
|
const react_utilities_1 = /*#__PURE__*/require("@fluentui/react-utilities");
|
9
9
|
|
@@ -17,12 +17,12 @@ const useFluentProviderStyles_1 = /*#__PURE__*/require("./useFluentProviderStyle
|
|
17
17
|
*/
|
18
18
|
|
19
19
|
|
20
|
-
const
|
20
|
+
const useFluentProviderThemeStyleTag = options => {
|
21
21
|
const {
|
22
22
|
targetDocument,
|
23
23
|
theme
|
24
24
|
} = options;
|
25
|
-
const styleTagId = react_utilities_1.useId(useFluentProviderStyles_1.
|
25
|
+
const styleTagId = react_utilities_1.useId(useFluentProviderStyles_1.fluentProviderClassNames.root);
|
26
26
|
const styleTag = React.useMemo(() => {
|
27
27
|
if (!targetDocument) {
|
28
28
|
return null;
|
@@ -46,11 +46,16 @@ const useThemeStyleTag = options => {
|
|
46
46
|
if (styleTag && previousCssRule !== cssRule) {
|
47
47
|
const sheet = styleTag.sheet;
|
48
48
|
|
49
|
-
if (sheet
|
50
|
-
sheet.
|
51
|
-
|
49
|
+
if (sheet) {
|
50
|
+
if (sheet.cssRules.length > 0) {
|
51
|
+
sheet.deleteRule(0);
|
52
|
+
}
|
52
53
|
|
53
|
-
|
54
|
+
sheet.insertRule(cssRule, 0);
|
55
|
+
} else if (process.env.NODE_ENV !== 'production') {
|
56
|
+
// eslint-disable-next-line no-console
|
57
|
+
console.error('FluentProvider: No sheet available on styleTag, styles will not be inserted into DOM.');
|
58
|
+
}
|
54
59
|
} // Removes the style tag from the targetDocument on unmount or change
|
55
60
|
|
56
61
|
|
@@ -64,5 +69,5 @@ const useThemeStyleTag = options => {
|
|
64
69
|
return styleTagId;
|
65
70
|
};
|
66
71
|
|
67
|
-
exports.
|
68
|
-
//# sourceMappingURL=
|
72
|
+
exports.useFluentProviderThemeStyleTag = useFluentProviderThemeStyleTag;
|
73
|
+
//# sourceMappingURL=useFluentProviderThemeStyleTag.js.map
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["components/FluentProvider/useFluentProviderThemeStyleTag.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AACA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAEA,MAAA,yBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAEA;;;;AAIG;;;AACI,MAAM,8BAA8B,GAAI,OAAD,IAAmE;AAC/G,QAAM;AAAE,IAAA,cAAF;AAAkB,IAAA;AAAlB,MAA4B,OAAlC;AAEA,QAAM,UAAU,GAAG,iBAAA,CAAA,KAAA,CAAM,yBAAA,CAAA,wBAAA,CAAyB,IAA/B,CAAnB;AACA,QAAM,QAAQ,GAAG,KAAK,CAAC,OAAN,CAAc,MAAK;AAClC,QAAI,CAAC,cAAL,EAAqB;AACnB,aAAO,IAAP;AACD;;AAED,UAAM,GAAG,GAAG,cAAc,CAAC,aAAf,CAA6B,OAA7B,CAAZ;AACA,IAAA,GAAG,CAAC,YAAJ,CAAiB,IAAjB,EAAuB,UAAvB;AACA,IAAA,cAAc,CAAC,IAAf,CAAoB,WAApB,CAAgC,GAAhC;AACA,WAAO,GAAP;AACD,GATgB,EASd,CAAC,UAAD,EAAa,cAAb,CATc,CAAjB;AAWA,QAAM,OAAO,GAAG,KAAK,CAAC,OAAN,CAAc,MAAK;AACjC,UAAM,eAAe,GAAG,KAAK,GACxB,MAAM,CAAC,IAAP,CAAY,KAAZ,EAA8C,MAA9C,CAAqD,CAAC,UAAD,EAAa,MAAb,KAAuB;AAC3E,MAAA,UAAU,IAAI,KAAK,MAAM,KAAK,KAAK,CAAC,MAAD,CAAQ,IAA3C;AACA,aAAO,UAAP;AACD,KAHA,EAGE,EAHF,CADwB,GAKzB,EALJ,CADiC,CAQjC;;AACA,WAAO,IAAI,UAAU,MAAM,eAAe,IAA1C;AACD,GAVe,EAUb,CAAC,KAAD,EAAQ,UAAR,CAVa,CAAhB;AAWA,QAAM,eAAe,GAAG,iBAAA,CAAA,WAAA,CAAY,OAAZ,CAAxB;;AAEA,MAAI,QAAQ,IAAI,eAAe,KAAK,OAApC,EAA6C;AAC3C,UAAM,KAAK,GAAG,QAAQ,CAAC,KAAvB;;AAEA,QAAI,KAAJ,EAAW;AACT,UAAI,KAAK,CAAC,QAAN,CAAe,MAAf,GAAwB,CAA5B,EAA+B;AAC7B,QAAA,KAAK,CAAC,UAAN,CAAiB,CAAjB;AACD;;AACD,MAAA,KAAK,CAAC,UAAN,CAAiB,OAAjB,EAA0B,CAA1B;AACD,KALD,MAKO,IAAI,OAAO,CAAC,GAAR,CAAY,QAAZ,KAAyB,YAA7B,EAA2C;AAChD;AACA,MAAA,OAAO,CAAC,KAAR,CAAc,uFAAd;AACD;AACF,GAxC8G,CA0C/G;;;AACA,EAAA,KAAK,CAAC,SAAN,CAAgB,MAAK;AACnB,WAAO,MAAK;AACV,UAAI,QAAJ,EAAc;AACZ,QAAA,QAAQ,CAAC,MAAT;AACD;AACF,KAJD;AAKD,GAND,EAMG,CAAC,QAAD,CANH;AAQA,SAAO,UAAP;AACD,CApDM;;AAAM,OAAA,CAAA,8BAAA,GAA8B,8BAA9B","sourcesContent":["import { useId, usePrevious } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport type { FluentProviderState } from './FluentProvider.types';\nimport { fluentProviderClassNames } from './useFluentProviderStyles';\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 styleTagId = useId(fluentProviderClassNames.root);\n const styleTag = React.useMemo(() => {\n if (!targetDocument) {\n return null;\n }\n\n const tag = targetDocument.createElement('style');\n tag.setAttribute('id', styleTagId);\n targetDocument.head.appendChild(tag);\n return tag;\n }, [styleTagId, targetDocument]);\n\n const cssRule = React.useMemo(() => {\n const cssVarsAsString = theme\n ? (Object.keys(theme) as (keyof typeof theme)[]).reduce((cssVarRule, cssVar) => {\n cssVarRule += `--${cssVar}: ${theme[cssVar]}; `;\n return cssVarRule;\n }, '')\n : '';\n\n // result: .fluent-provider1 { --css-var: '#fff' }\n return `.${styleTagId} { ${cssVarsAsString} }`;\n }, [theme, styleTagId]);\n const previousCssRule = usePrevious(cssRule);\n\n if (styleTag && previousCssRule !== cssRule) {\n const sheet = styleTag.sheet;\n\n if (sheet) {\n if (sheet.cssRules.length > 0) {\n sheet.deleteRule(0);\n }\n sheet.insertRule(cssRule, 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 // Removes the style tag from the targetDocument on unmount or change\n React.useEffect(() => {\n return () => {\n if (styleTag) {\n styleTag.remove();\n }\n };\n }, [styleTag]);\n\n return styleTagId;\n};\n"],"sourceRoot":"../src/"}
|
package/lib-commonjs/index.js
CHANGED
@@ -3,11 +3,52 @@
|
|
3
3
|
Object.defineProperty(exports, "__esModule", {
|
4
4
|
value: true
|
5
5
|
});
|
6
|
-
exports.useTheme = exports.useFluent = void 0;
|
6
|
+
exports.useTheme = exports.useFluent = exports.useFluentProviderThemeStyleTag = exports.useFluentProviderStyles_unstable = exports.useFluentProvider_unstable = exports.useFluentProviderContextValues_unstable = exports.renderFluentProvider_unstable = exports.FluentProvider = exports.fluentProviderClassNames = void 0;
|
7
7
|
|
8
|
-
|
8
|
+
var FluentProvider_1 = /*#__PURE__*/require("./FluentProvider");
|
9
9
|
|
10
|
-
|
10
|
+
Object.defineProperty(exports, "fluentProviderClassNames", {
|
11
|
+
enumerable: true,
|
12
|
+
get: function () {
|
13
|
+
return FluentProvider_1.fluentProviderClassNames;
|
14
|
+
}
|
15
|
+
});
|
16
|
+
Object.defineProperty(exports, "FluentProvider", {
|
17
|
+
enumerable: true,
|
18
|
+
get: function () {
|
19
|
+
return FluentProvider_1.FluentProvider;
|
20
|
+
}
|
21
|
+
});
|
22
|
+
Object.defineProperty(exports, "renderFluentProvider_unstable", {
|
23
|
+
enumerable: true,
|
24
|
+
get: function () {
|
25
|
+
return FluentProvider_1.renderFluentProvider_unstable;
|
26
|
+
}
|
27
|
+
});
|
28
|
+
Object.defineProperty(exports, "useFluentProviderContextValues_unstable", {
|
29
|
+
enumerable: true,
|
30
|
+
get: function () {
|
31
|
+
return FluentProvider_1.useFluentProviderContextValues_unstable;
|
32
|
+
}
|
33
|
+
});
|
34
|
+
Object.defineProperty(exports, "useFluentProvider_unstable", {
|
35
|
+
enumerable: true,
|
36
|
+
get: function () {
|
37
|
+
return FluentProvider_1.useFluentProvider_unstable;
|
38
|
+
}
|
39
|
+
});
|
40
|
+
Object.defineProperty(exports, "useFluentProviderStyles_unstable", {
|
41
|
+
enumerable: true,
|
42
|
+
get: function () {
|
43
|
+
return FluentProvider_1.useFluentProviderStyles_unstable;
|
44
|
+
}
|
45
|
+
});
|
46
|
+
Object.defineProperty(exports, "useFluentProviderThemeStyleTag", {
|
47
|
+
enumerable: true,
|
48
|
+
get: function () {
|
49
|
+
return FluentProvider_1.useFluentProviderThemeStyleTag;
|
50
|
+
}
|
51
|
+
});
|
11
52
|
|
12
53
|
var react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
|
13
54
|
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"sources":["
|
1
|
+
{"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,gBAAA,gBAAA,OAAA,CAAA,kBAAA,CAAA;;AACE,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,0BAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,gBAAA,CAAA,wBAAA;AAAwB;AAAxB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,gBAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,gBAAA,CAAA,cAAA;AAAc;AAAd,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,+BAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,gBAAA,CAAA,6BAAA;AAA6B;AAA7B,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,yCAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,gBAAA,CAAA,uCAAA;AAAuC;AAAvC,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,4BAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,gBAAA,CAAA,0BAAA;AAA0B;AAA1B,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,kCAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,gBAAA,CAAA,gCAAA;AAAgC;AAAhC,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,gCAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,gBAAA,CAAA,8BAAA;AAA8B;AAA9B,CAAA;;AASF,IAAA,uBAAA,gBAAA,OAAA,CAAA,iCAAA,CAAA;;AAAS,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,WAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,uBAAA,CAAA,SAAA;AAAS;AAAT,CAAA;AAAW,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,UAAA,EAAA;AAAA,EAAA,UAAA,EAAA,IAAA;AAAA,EAAA,GAAA,EAAA,YAAA;AAAA,WAAA,uBAAA,CAAA,QAAA;AAAQ;AAAR,CAAA","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\nexport { useFluent, useTheme } from '@fluentui/react-shared-contexts';\n"],"sourceRoot":"../src/"}
|
package/package.json
CHANGED
@@ -1,10 +1,10 @@
|
|
1
1
|
{
|
2
2
|
"name": "@fluentui/react-provider",
|
3
|
-
"version": "9.0.0-rc.
|
3
|
+
"version": "9.0.0-rc.12",
|
4
4
|
"description": "Fluent UI React provider component",
|
5
5
|
"main": "lib-commonjs/index.js",
|
6
6
|
"module": "lib/index.js",
|
7
|
-
"typings": "
|
7
|
+
"typings": "dist/index.d.ts",
|
8
8
|
"sideEffects": false,
|
9
9
|
"repository": {
|
10
10
|
"type": "git",
|
@@ -20,33 +20,23 @@
|
|
20
20
|
"just": "just-scripts",
|
21
21
|
"lint": "just-scripts lint",
|
22
22
|
"docs": "api-extractor run --config=config/api-extractor.local.json --local",
|
23
|
-
"build:local": "tsc -p ./tsconfig.lib.json --module esnext --emitDeclarationOnly && node
|
24
|
-
"storybook": "node
|
23
|
+
"build:local": "tsc -p ./tsconfig.lib.json --module esnext --emitDeclarationOnly && node ../../../scripts/typescript/normalize-import --output ./dist/packages/react-components/react-provider/src && yarn docs",
|
24
|
+
"storybook": "node ../../../scripts/storybook/runner",
|
25
25
|
"start": "yarn storybook",
|
26
26
|
"type-check": "tsc -b tsconfig.json"
|
27
27
|
},
|
28
28
|
"devDependencies": {
|
29
29
|
"@fluentui/eslint-plugin": "*",
|
30
30
|
"@fluentui/react-conformance": "*",
|
31
|
-
"@fluentui/react-conformance-griffel": "9.0.0-beta.
|
32
|
-
"@fluentui/scripts": "^1.0.0"
|
33
|
-
"@types/enzyme": "3.10.3",
|
34
|
-
"@types/enzyme-adapter-react-16": "1.0.3",
|
35
|
-
"@types/react": "16.9.42",
|
36
|
-
"@types/react-dom": "16.9.10",
|
37
|
-
"@types/react-test-renderer": "^16.0.0",
|
38
|
-
"enzyme": "~3.10.0",
|
39
|
-
"enzyme-adapter-react-16": "^1.15.0",
|
40
|
-
"react": "16.8.6",
|
41
|
-
"react-dom": "16.8.6",
|
42
|
-
"react-test-renderer": "^16.3.0"
|
31
|
+
"@fluentui/react-conformance-griffel": "9.0.0-beta.7",
|
32
|
+
"@fluentui/scripts": "^1.0.0"
|
43
33
|
},
|
44
34
|
"dependencies": {
|
45
|
-
"@griffel/react": "1.0.
|
46
|
-
"@fluentui/react-shared-contexts": "9.0.0-rc.
|
47
|
-
"@fluentui/react-tabster": "9.0.0-rc.
|
48
|
-
"@fluentui/react-theme": "9.0.0-rc.
|
49
|
-
"@fluentui/react-utilities": "9.0.0-rc.
|
35
|
+
"@griffel/react": "1.0.5",
|
36
|
+
"@fluentui/react-shared-contexts": "9.0.0-rc.9",
|
37
|
+
"@fluentui/react-tabster": "9.0.0-rc.12",
|
38
|
+
"@fluentui/react-theme": "9.0.0-rc.9",
|
39
|
+
"@fluentui/react-utilities": "9.0.0-rc.9",
|
50
40
|
"tslib": "^2.1.0"
|
51
41
|
},
|
52
42
|
"peerDependencies": {
|
@@ -61,5 +51,12 @@
|
|
61
51
|
"minor",
|
62
52
|
"patch"
|
63
53
|
]
|
54
|
+
},
|
55
|
+
"exports": {
|
56
|
+
".": {
|
57
|
+
"types": "./lib/index.d.ts",
|
58
|
+
"import": "./lib/index.js",
|
59
|
+
"require": "./lib-commonjs/index.js"
|
60
|
+
}
|
64
61
|
}
|
65
62
|
}
|
package/lib/FluentProvider.d.ts
DELETED
@@ -1 +0,0 @@
|
|
1
|
-
export * from './components/FluentProvider/index';
|