@fluentui/react-provider 9.0.0-rc.5 → 9.0.0-rc.8

package/lib-commonjs/components/FluentProvider/FluentProvider.types.d.ts

@@ -1,26 +0,0 @@
-import type { ProviderContextValue, TooltipContextType, ThemeClassNameContextValue } from '@fluentui/react-shared-contexts';
-import type { PartialTheme, Theme } from '@fluentui/react-theme';
-import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';
-export declare type FluentProviderSlots = {
-    root: Slot<'div'>;
-};
-interface FluentProviderCommons {
-    /** Sets the direction of text & generated styles. */
-    dir: 'ltr' | 'rtl';
-    /** Provides the document, can be undefined during SSR render. */
-    targetDocument: Document | undefined;
-}
-export interface FluentProviderProps extends Omit<ComponentProps<FluentProviderSlots>, 'dir'>, Partial<FluentProviderCommons> {
-    theme?: PartialTheme;
-}
-export interface FluentProviderState extends ComponentState<FluentProviderSlots>, FluentProviderCommons {
-    theme: Theme | Partial<Theme> | undefined;
-    themeClassName: string;
-}
-export interface FluentProviderContextValues extends Pick<FluentProviderState, 'theme'> {
-    provider: ProviderContextValue;
-    themeClassName: ThemeClassNameContextValue;
-    textDirection: 'ltr' | 'rtl';
-    tooltip: TooltipContextType;
-}
-export {};

package/lib-commonjs/components/FluentProvider/index.d.ts

@@ -1,6 +0,0 @@
-export * from './FluentProvider';
-export * from './FluentProvider.types';
-export * from './renderFluentProvider';
-export * from './useFluentProvider';
-export * from './useFluentProviderStyles';
-export * from './useFluentProviderContextValues';

package/lib-commonjs/components/FluentProvider/renderFluentProvider.d.ts

@@ -1,5 +0,0 @@
-import type { FluentProviderContextValues, FluentProviderState } from './FluentProvider.types';
-/**
- * Render the final JSX of FluentProvider
- */
-export declare const renderFluentProvider_unstable: (state: FluentProviderState, contextValues: FluentProviderContextValues) => JSX.Element;

package/lib-commonjs/components/FluentProvider/useFluentProvider.d.ts

@@ -1,12 +0,0 @@
-import * as React from 'react';
-import type { FluentProviderProps, FluentProviderState } from './FluentProvider.types';
-/**
- * Create the state required to render FluentProvider.
- *
- * The returned state can be modified with hooks such as useFluentProviderStyles_unstable,
- * before being passed to renderFluentProvider_unstable.
- *
- * @param props - props from this instance of FluentProvider
- * @param ref - reference to root HTMLElement of FluentProvider
- */
-export declare const useFluentProvider_unstable: (props: FluentProviderProps, ref: React.Ref<HTMLElement>) => FluentProviderState;

package/lib-commonjs/components/FluentProvider/useFluentProviderContextValues.d.ts

@@ -1,2 +0,0 @@
-import type { FluentProviderContextValues, FluentProviderState } from './FluentProvider.types';
-export declare function useFluentProviderContextValues_unstable(state: FluentProviderState): FluentProviderContextValues;

package/lib-commonjs/components/FluentProvider/useFluentProviderStyles.d.ts

@@ -1,4 +0,0 @@
-import type { FluentProviderState } from './FluentProvider.types';
-export declare const fluentProviderClassName = "fui-FluentProvider";
-/** Applies style classnames to slots */
-export declare const useFluentProviderStyles_unstable: (state: FluentProviderState) => FluentProviderState;

package/lib-commonjs/components/FluentProvider/useThemeStyleTag.d.ts

@@ -1,7 +0,0 @@
-import type { FluentProviderState } from './FluentProvider.types';
-/**
- * Writes a theme as css variables in a style tag on the provided targetDocument as a rule applied to a CSS class
- *
- * @returns CSS class to apply the rule
- */
-export declare const useThemeStyleTag: (options: Pick<FluentProviderState, 'theme' | 'targetDocument'>) => string;

package/lib-commonjs/components/FluentProvider/useThemeStyleTag.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["components/FluentProvider/useThemeStyleTag.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,gBAAgB,GAAI,OAAD,IAAmE;AACjG,QAAM;AAAE,IAAA,cAAF;AAAkB,IAAA;AAAlB,MAA4B,OAAlC;AAEA,QAAM,UAAU,GAAG,iBAAA,CAAA,KAAA,CAAM,yBAAA,CAAA,uBAAN,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,KAAK,CAAC,QAAN,CAAe,MAAf,GAAwB,CAA5B,EAA+B;AAC7B,MAAA,KAAK,CAAC,UAAN,CAAiB,CAAjB;AACD;;AAED,IAAA,KAAK,CAAC,UAAN,CAAiB,OAAjB,EAA0B,CAA1B;AACD,GApCgG,CAsCjG;;;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,CAhDM;;AAAM,OAAA,CAAA,gBAAA,GAAgB,gBAAhB","sourcesContent":["import { useId, usePrevious } from '@fluentui/react-utilities';\nimport * as React from 'react';\nimport type { FluentProviderState } from './FluentProvider.types';\nimport { fluentProviderClassName } 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 useThemeStyleTag = (options: Pick<FluentProviderState, 'theme' | 'targetDocument'>) => {\n  const { targetDocument, theme } = options;\n\n  const styleTagId = useId(fluentProviderClassName);\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 as CSSStyleSheet;\n\n    if (sheet.cssRules.length > 0) {\n      sheet.deleteRule(0);\n    }\n\n    sheet.insertRule(cssRule, 0);\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.d.ts

@@ -1,2 +0,0 @@
-export * from './FluentProvider';
-export { useFluent, useTheme } from '@fluentui/react-shared-contexts';