@fluentui/react-skeleton 9.7.0 → 9.7.2
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.md +23 -2
- package/dist/index.d.ts +4 -2
- package/lib/components/Skeleton/Skeleton.types.js.map +1 -1
- package/lib/components/Skeleton/renderSkeleton.js.map +1 -1
- package/lib/components/Skeleton/useSkeleton.js +0 -1
- package/lib/components/Skeleton/useSkeleton.js.map +1 -1
- package/lib/components/SkeletonItem/useSkeletonItem.js +0 -1
- package/lib/components/SkeletonItem/useSkeletonItem.js.map +1 -1
- package/lib/index.js +1 -1
- package/lib/index.js.map +1 -1
- package/lib-commonjs/components/Skeleton/Skeleton.types.js.map +1 -1
- package/lib-commonjs/components/Skeleton/renderSkeleton.js.map +1 -1
- package/lib-commonjs/components/Skeleton/useSkeleton.js +0 -2
- package/lib-commonjs/components/Skeleton/useSkeleton.js.map +1 -1
- package/lib-commonjs/components/SkeletonItem/useSkeletonItem.js +0 -2
- package/lib-commonjs/components/SkeletonItem/useSkeletonItem.js.map +1 -1
- package/lib-commonjs/index.js +3 -0
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +4 -4
package/CHANGELOG.md
CHANGED
|
@@ -1,12 +1,33 @@
|
|
|
1
1
|
# Change Log - @fluentui/react-skeleton
|
|
2
2
|
|
|
3
|
-
This log was last generated on Thu,
|
|
3
|
+
This log was last generated on Thu, 23 Apr 2026 11:59:31 GMT and should not be manually modified.
|
|
4
4
|
|
|
5
5
|
<!-- Start content -->
|
|
6
6
|
|
|
7
|
+
## [9.7.2](https://github.com/microsoft/fluentui/tree/@fluentui/react-skeleton_v9.7.2)
|
|
8
|
+
|
|
9
|
+
Thu, 23 Apr 2026 11:59:31 GMT
|
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-skeleton_v9.7.1..@fluentui/react-skeleton_v9.7.2)
|
|
11
|
+
|
|
12
|
+
### Patches
|
|
13
|
+
|
|
14
|
+
- fix: update types for render function ([PR #35972](https://github.com/microsoft/fluentui/pull/35972) by dmytrokirpa@microsoft.com)
|
|
15
|
+
- Bump @fluentui/react-field to v9.5.1 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
|
|
16
|
+
- Bump @fluentui/react-jsx-runtime to v9.4.2 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
|
|
17
|
+
- Bump @fluentui/react-utilities to v9.26.3 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
|
|
18
|
+
|
|
19
|
+
## [9.7.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-skeleton_v9.7.1)
|
|
20
|
+
|
|
21
|
+
Wed, 01 Apr 2026 15:52:43 GMT
|
|
22
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-skeleton_v9.7.0..@fluentui/react-skeleton_v9.7.1)
|
|
23
|
+
|
|
24
|
+
### Patches
|
|
25
|
+
|
|
26
|
+
- Bump @fluentui/react-field to v9.5.0 ([PR #35912](https://github.com/microsoft/fluentui/pull/35912) by beachball)
|
|
27
|
+
|
|
7
28
|
## [9.7.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-skeleton_v9.7.0)
|
|
8
29
|
|
|
9
|
-
Thu, 26 Mar 2026 08:
|
|
30
|
+
Thu, 26 Mar 2026 08:12:52 GMT
|
|
10
31
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-skeleton_v9.6.0..@fluentui/react-skeleton_v9.7.0)
|
|
11
32
|
|
|
12
33
|
### Minor changes
|
package/dist/index.d.ts
CHANGED
|
@@ -9,7 +9,7 @@ import type { SlotClassNames } from '@fluentui/react-utilities';
|
|
|
9
9
|
/**
|
|
10
10
|
* Render the final JSX of Skeleton
|
|
11
11
|
*/
|
|
12
|
-
export declare const renderSkeleton_unstable: (state:
|
|
12
|
+
export declare const renderSkeleton_unstable: (state: SkeletonBaseState, contextValues: SkeletonContextValues) => JSXElement;
|
|
13
13
|
|
|
14
14
|
/**
|
|
15
15
|
* Render the final JSX of SkeletonItem
|
|
@@ -42,7 +42,7 @@ export declare interface SkeletonContextValue {
|
|
|
42
42
|
shape?: 'circle' | 'square' | 'rectangle';
|
|
43
43
|
}
|
|
44
44
|
|
|
45
|
-
declare type SkeletonContextValues = {
|
|
45
|
+
export declare type SkeletonContextValues = {
|
|
46
46
|
skeletonGroup: SkeletonContextValue;
|
|
47
47
|
};
|
|
48
48
|
|
|
@@ -157,6 +157,8 @@ export declare const useSkeletonBase_unstable: (props: SkeletonBaseProps, ref: R
|
|
|
157
157
|
|
|
158
158
|
export declare const useSkeletonContext: () => SkeletonContextValue;
|
|
159
159
|
|
|
160
|
+
export declare const useSkeletonContextValues: (state: SkeletonState) => SkeletonContextValues;
|
|
161
|
+
|
|
160
162
|
/**
|
|
161
163
|
* Create the state required to render SkeletonItem.
|
|
162
164
|
*
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Skeleton/Skeleton.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { SkeletonContextValue } from '../../contexts/index';\n\nexport type SkeletonSlots = {\n /**\n * The root slot of the `Skeleton` is the container that will contain the slots that make up a `Skeleton`\n * and any data that the `Skeleton` will load. The default html element is a `div`.\n */\n root: NonNullable<Slot<'div', 'span'>>;\n};\n\n/**\n * Sizes for the SkeletonItem\n */\nexport type SkeletonItemSize =\n | 8\n | 12\n | 14\n | 16\n | 20\n | 22\n | 24\n | 28\n | 32\n | 36\n | 40\n | 48\n | 52\n | 56\n | 64\n | 72\n | 92\n | 96\n | 120\n | 128;\n\n/**\n * Skeleton Props\n */\nexport type SkeletonProps = Omit<ComponentProps<Partial<SkeletonSlots>>, 'width'> & {\n /**\n * The animation type for the Skeleton\n * @defaultValue wave\n */\n animation?: 'wave' | 'pulse';\n\n /**\n * Sets the appearance of the Skeleton.\n * @defaultValue opaque\n */\n appearance?: 'opaque' | 'translucent';\n\n /**\n * Sets the width value of the skeleton wrapper.\n * @defaultValue 100%\n * @deprecated Use `className` prop to set width\n */\n width?: number | string;\n\n /**\n * Sets the size of the SkeletonItems inside the Skeleton in pixels.\n * Size is restricted to a limited set of values recommended for most uses (see SkeletonItemSize).\n * This value can be overridden by the individual SkeletonItem's `size` prop.\n */\n size?: SkeletonItemSize;\n\n /**\n * Sets the shape of the SkeletonItems inside the Skeleton.\n * This value can be overridden by the individual SkeletonItem's `shape` prop.\n */\n shape?: 'circle' | 'square' | 'rectangle';\n};\n\n/**\n * Skeleton base props, excluding design-related props like animation and appearance.\n */\nexport type SkeletonBaseProps = Omit<SkeletonProps, 'animation' | 'appearance'>;\n\nexport type SkeletonContextValues = {\n skeletonGroup: SkeletonContextValue;\n};\n\n/**\n * State used in rendering Skeleton\n */\nexport type SkeletonState = ComponentState<SkeletonSlots> &\n Required<Pick<SkeletonProps, 'animation' | 'appearance'>> &\n Pick<SkeletonProps, 'size' | 'shape'>;\n\n/**\n * Skeleton base state, excluding design-related state like animation and appearance.\n */\nexport type SkeletonBaseState = Omit<SkeletonState, 'animation' | 'appearance' | 'size' | 'shape'>;\n"],"names":[],"mappings":"AAyFA;;CAEC,GACD,WAAmG"}
|
|
1
|
+
{"version":3,"sources":["../src/components/Skeleton/Skeleton.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { SkeletonContextValue } from '../../contexts/index';\n\nexport type SkeletonSlots = {\n /**\n * The root slot of the `Skeleton` is the container that will contain the slots that make up a `Skeleton`\n * and any data that the `Skeleton` will load. The default html element is a `div`.\n */\n root: NonNullable<Slot<'div', 'span'>>;\n};\n\n/**\n * Sizes for the SkeletonItem\n */\nexport type SkeletonItemSize =\n | 8\n | 12\n | 14\n | 16\n | 20\n | 22\n | 24\n | 28\n | 32\n | 36\n | 40\n | 48\n | 52\n | 56\n | 64\n | 72\n | 92\n | 96\n | 120\n | 128;\n\n/**\n * Skeleton Props\n */\nexport type SkeletonProps = Omit<ComponentProps<Partial<SkeletonSlots>>, 'width'> & {\n /**\n * The animation type for the Skeleton\n * @defaultValue wave\n */\n animation?: 'wave' | 'pulse';\n\n /**\n * Sets the appearance of the Skeleton.\n * @defaultValue opaque\n */\n appearance?: 'opaque' | 'translucent';\n\n /**\n * Sets the width value of the skeleton wrapper.\n * @defaultValue 100%\n * @deprecated Use `className` prop to set width\n */\n width?: number | string;\n\n /**\n * Sets the size of the SkeletonItems inside the Skeleton in pixels.\n * Size is restricted to a limited set of values recommended for most uses (see SkeletonItemSize).\n * This value can be overridden by the individual SkeletonItem's `size` prop.\n */\n size?: SkeletonItemSize;\n\n /**\n * Sets the shape of the SkeletonItems inside the Skeleton.\n * This value can be overridden by the individual SkeletonItem's `shape` prop.\n */\n shape?: 'circle' | 'square' | 'rectangle';\n};\n\n/**\n * Skeleton base props, excluding design-related props like animation and appearance.\n */\nexport type SkeletonBaseProps = Omit<SkeletonProps, 'animation' | 'appearance'>;\n\nexport type SkeletonContextValues = {\n skeletonGroup: SkeletonContextValue;\n};\n\n/**\n * State used in rendering Skeleton\n */\nexport type SkeletonState = ComponentState<SkeletonSlots> &\n Required<Pick<SkeletonProps, 'animation' | 'appearance'>> &\n Pick<SkeletonProps, 'size' | 'shape'>;\n\n/**\n * Skeleton base state, excluding design-related state like animation and appearance.\n */\nexport type SkeletonBaseState = Omit<SkeletonState, 'animation' | 'appearance' | 'size' | 'shape'>;\n"],"names":[],"mappings":"AAyFA;;CAEC,GACD,WAAmG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Skeleton/renderSkeleton.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { SkeletonContextProvider } from '../../contexts/SkeletonContext';\nimport type { SkeletonContextValues, SkeletonSlots,
|
|
1
|
+
{"version":3,"sources":["../src/components/Skeleton/renderSkeleton.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { SkeletonContextProvider } from '../../contexts/SkeletonContext';\nimport type { SkeletonContextValues, SkeletonSlots, SkeletonBaseState } from './Skeleton.types';\n\n/**\n * Render the final JSX of Skeleton\n */\nexport const renderSkeleton_unstable = (state: SkeletonBaseState, contextValues: SkeletonContextValues): JSXElement => {\n assertSlots<SkeletonSlots>(state);\n\n return (\n <SkeletonContextProvider value={contextValues.skeletonGroup}>\n <state.root />\n </SkeletonContextProvider>\n );\n};\n"],"names":["assertSlots","SkeletonContextProvider","renderSkeleton_unstable","state","contextValues","value","skeletonGroup","root"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAExD,SAASC,uBAAuB,QAAQ,iCAAiC;AAGzE;;CAEC,GACD,OAAO,MAAMC,0BAA0B,CAACC,OAA0BC;IAChEJ,YAA2BG;IAE3B,qBACE,KAACF;QAAwBI,OAAOD,cAAcE,aAAa;kBACzD,cAAA,KAACH,MAAMI,IAAI;;AAGjB,EAAE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Skeleton/useSkeleton.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { SkeletonBaseProps, SkeletonBaseState, SkeletonProps, SkeletonState } from './Skeleton.types';\nimport { useSkeletonContext } from '../../contexts/SkeletonContext';\n\n/**\n * Create the state required to render Skeleton.\n *\n * The returned state can be modified with hooks such as useSkeletonStyles_unstable,\n * before being passed to renderSkeleton_unstable.\n *\n * @param props - props from this instance of Skeleton\n * @param ref - reference to root HTMLElement of Skeleton\n */\nexport const useSkeleton_unstable = (props: SkeletonProps, ref: React.Ref<HTMLElement>): SkeletonState => {\n const { animation: contextAnimation, appearance: contextAppearance } = useSkeletonContext();\n const {\n animation = contextAnimation ?? 'wave',\n appearance = contextAppearance ?? 'opaque',\n size,\n shape,\n ...baseProps\n } = props;\n\n const baseState = useSkeletonBase_unstable(baseProps, ref as React.Ref<HTMLDivElement>);\n\n return {\n ...baseState,\n animation,\n appearance,\n size,\n shape,\n };\n};\n\n/**\n * Base hook for Skeleton component, which manages state related to slots structure and ARIA attributes.\n *\n * @param props - User provided props to the Skeleton component.\n * @param ref - User provided ref to be passed to the Skeleton component.\n */\nexport const useSkeletonBase_unstable = (\n props: SkeletonBaseProps,\n ref: React.Ref<HTMLDivElement>,\n): SkeletonBaseState => {\n const root = slot.always(\n getIntrinsicElementProps('div', {\n ref,\n role: 'progressbar',\n 'aria-busy': true,\n ...props,\n }),\n { elementType: 'div' },\n );\n return { components: { root: 'div' }, root };\n};\n"],"names":["
|
|
1
|
+
{"version":3,"sources":["../src/components/Skeleton/useSkeleton.ts"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { SkeletonBaseProps, SkeletonBaseState, SkeletonProps, SkeletonState } from './Skeleton.types';\nimport { useSkeletonContext } from '../../contexts/SkeletonContext';\n\n/**\n * Create the state required to render Skeleton.\n *\n * The returned state can be modified with hooks such as useSkeletonStyles_unstable,\n * before being passed to renderSkeleton_unstable.\n *\n * @param props - props from this instance of Skeleton\n * @param ref - reference to root HTMLElement of Skeleton\n */\nexport const useSkeleton_unstable = (props: SkeletonProps, ref: React.Ref<HTMLElement>): SkeletonState => {\n const { animation: contextAnimation, appearance: contextAppearance } = useSkeletonContext();\n const {\n animation = contextAnimation ?? 'wave',\n appearance = contextAppearance ?? 'opaque',\n size,\n shape,\n ...baseProps\n } = props;\n\n const baseState = useSkeletonBase_unstable(baseProps, ref as React.Ref<HTMLDivElement>);\n\n return {\n ...baseState,\n animation,\n appearance,\n size,\n shape,\n };\n};\n\n/**\n * Base hook for Skeleton component, which manages state related to slots structure and ARIA attributes.\n *\n * @param props - User provided props to the Skeleton component.\n * @param ref - User provided ref to be passed to the Skeleton component.\n */\nexport const useSkeletonBase_unstable = (\n props: SkeletonBaseProps,\n ref: React.Ref<HTMLDivElement>,\n): SkeletonBaseState => {\n const root = slot.always(\n getIntrinsicElementProps('div', {\n ref,\n role: 'progressbar',\n 'aria-busy': true,\n ...props,\n }),\n { elementType: 'div' },\n );\n return { components: { root: 'div' }, root };\n};\n"],"names":["getIntrinsicElementProps","slot","useSkeletonContext","useSkeleton_unstable","props","ref","animation","contextAnimation","appearance","contextAppearance","size","shape","baseProps","baseState","useSkeletonBase_unstable","root","always","role","elementType","components"],"mappings":"AAAA;AAGA,SAASA,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAE3E,SAASC,kBAAkB,QAAQ,iCAAiC;AAEpE;;;;;;;;CAQC,GACD,OAAO,MAAMC,uBAAuB,CAACC,OAAsBC;IACzD,MAAM,EAAEC,WAAWC,gBAAgB,EAAEC,YAAYC,iBAAiB,EAAE,GAAGP;IACvE,MAAM,EACJI,YAAYC,6BAAAA,8BAAAA,mBAAoB,MAAM,EACtCC,aAAaC,8BAAAA,+BAAAA,oBAAqB,QAAQ,EAC1CC,IAAI,EACJC,KAAK,EACL,GAAGC,WACJ,GAAGR;IAEJ,MAAMS,YAAYC,yBAAyBF,WAAWP;IAEtD,OAAO;QACL,GAAGQ,SAAS;QACZP;QACAE;QACAE;QACAC;IACF;AACF,EAAE;AAEF;;;;;CAKC,GACD,OAAO,MAAMG,2BAA2B,CACtCV,OACAC;IAEA,MAAMU,OAAOd,KAAKe,MAAM,CACtBhB,yBAAyB,OAAO;QAC9BK;QACAY,MAAM;QACN,aAAa;QACb,GAAGb,KAAK;IACV,IACA;QAAEc,aAAa;IAAM;IAEvB,OAAO;QAAEC,YAAY;YAAEJ,MAAM;QAAM;QAAGA;IAAK;AAC7C,EAAE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/SkeletonItem/useSkeletonItem.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { useSkeletonContext } from '../../contexts/SkeletonContext';\nimport type {\n SkeletonItemBaseProps,\n SkeletonItemBaseState,\n SkeletonItemProps,\n SkeletonItemState,\n} from './SkeletonItem.types';\n\n/**\n * Create the state required to render SkeletonItem.\n *\n * The returned state can be modified with hooks such as useSkeletonItemStyles_unstable,\n * before being passed to renderSkeletonItem_unstable.\n *\n * @param props - props from this instance of SkeletonItem\n * @param ref - reference to root HTMLElement of SkeletonItem\n */\nexport const useSkeletonItem_unstable = (props: SkeletonItemProps, ref: React.Ref<HTMLElement>): SkeletonItemState => {\n const {\n animation: contextAnimation,\n appearance: contextAppearance,\n size: contextSize,\n shape: contextShape,\n } = useSkeletonContext();\n const {\n animation = contextAnimation ?? 'wave',\n appearance = contextAppearance ?? 'opaque',\n size = contextSize ?? 16,\n shape = contextShape ?? 'rectangle',\n ...baseProps\n } = props;\n\n const baseState = useSkeletonItemBase_unstable(baseProps, ref as React.Ref<HTMLDivElement>);\n\n return {\n ...baseState,\n animation,\n appearance,\n size,\n shape,\n };\n};\n\n/**\n * Base hook for SkeletonItem component, which manages state related to slots structure.\n *\n * @param props - User provided props to the SkeletonItem component.\n * @param ref - User provided ref to be passed to the SkeletonItem component.\n */\nexport const useSkeletonItemBase_unstable = (\n props: SkeletonItemBaseProps,\n ref: React.Ref<HTMLDivElement>,\n): SkeletonItemBaseState => {\n const root = slot.always(\n getIntrinsicElementProps('div', {\n ref,\n ...props,\n }),\n { elementType: 'div' },\n );\n return { components: { root: 'div' }, root };\n};\n"],"names":["
|
|
1
|
+
{"version":3,"sources":["../src/components/SkeletonItem/useSkeletonItem.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { useSkeletonContext } from '../../contexts/SkeletonContext';\nimport type {\n SkeletonItemBaseProps,\n SkeletonItemBaseState,\n SkeletonItemProps,\n SkeletonItemState,\n} from './SkeletonItem.types';\n\n/**\n * Create the state required to render SkeletonItem.\n *\n * The returned state can be modified with hooks such as useSkeletonItemStyles_unstable,\n * before being passed to renderSkeletonItem_unstable.\n *\n * @param props - props from this instance of SkeletonItem\n * @param ref - reference to root HTMLElement of SkeletonItem\n */\nexport const useSkeletonItem_unstable = (props: SkeletonItemProps, ref: React.Ref<HTMLElement>): SkeletonItemState => {\n const {\n animation: contextAnimation,\n appearance: contextAppearance,\n size: contextSize,\n shape: contextShape,\n } = useSkeletonContext();\n const {\n animation = contextAnimation ?? 'wave',\n appearance = contextAppearance ?? 'opaque',\n size = contextSize ?? 16,\n shape = contextShape ?? 'rectangle',\n ...baseProps\n } = props;\n\n const baseState = useSkeletonItemBase_unstable(baseProps, ref as React.Ref<HTMLDivElement>);\n\n return {\n ...baseState,\n animation,\n appearance,\n size,\n shape,\n };\n};\n\n/**\n * Base hook for SkeletonItem component, which manages state related to slots structure.\n *\n * @param props - User provided props to the SkeletonItem component.\n * @param ref - User provided ref to be passed to the SkeletonItem component.\n */\nexport const useSkeletonItemBase_unstable = (\n props: SkeletonItemBaseProps,\n ref: React.Ref<HTMLDivElement>,\n): SkeletonItemBaseState => {\n const root = slot.always(\n getIntrinsicElementProps('div', {\n ref,\n ...props,\n }),\n { elementType: 'div' },\n );\n return { components: { root: 'div' }, root };\n};\n"],"names":["getIntrinsicElementProps","slot","useSkeletonContext","useSkeletonItem_unstable","props","ref","animation","contextAnimation","appearance","contextAppearance","size","contextSize","shape","contextShape","baseProps","baseState","useSkeletonItemBase_unstable","root","always","elementType","components"],"mappings":"AAAA;AAGA,SAASA,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAC3E,SAASC,kBAAkB,QAAQ,iCAAiC;AAQpE;;;;;;;;CAQC,GACD,OAAO,MAAMC,2BAA2B,CAACC,OAA0BC;IACjE,MAAM,EACJC,WAAWC,gBAAgB,EAC3BC,YAAYC,iBAAiB,EAC7BC,MAAMC,WAAW,EACjBC,OAAOC,YAAY,EACpB,GAAGX;IACJ,MAAM,EACJI,YAAYC,6BAAAA,8BAAAA,mBAAoB,MAAM,EACtCC,aAAaC,8BAAAA,+BAAAA,oBAAqB,QAAQ,EAC1CC,OAAOC,wBAAAA,yBAAAA,cAAe,EAAE,EACxBC,QAAQC,yBAAAA,0BAAAA,eAAgB,WAAW,EACnC,GAAGC,WACJ,GAAGV;IAEJ,MAAMW,YAAYC,6BAA6BF,WAAWT;IAE1D,OAAO;QACL,GAAGU,SAAS;QACZT;QACAE;QACAE;QACAE;IACF;AACF,EAAE;AAEF;;;;;CAKC,GACD,OAAO,MAAMI,+BAA+B,CAC1CZ,OACAC;IAEA,MAAMY,OAAOhB,KAAKiB,MAAM,CACtBlB,yBAAyB,OAAO;QAC9BK;QACA,GAAGD,KAAK;IACV,IACA;QAAEe,aAAa;IAAM;IAEvB,OAAO;QAAEC,YAAY;YAAEH,MAAM;QAAM;QAAGA;IAAK;AAC7C,EAAE"}
|
package/lib/index.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export { Skeleton, renderSkeleton_unstable, skeletonClassNames, useSkeletonStyles_unstable, useSkeleton_unstable, useSkeletonBase_unstable } from './Skeleton';
|
|
1
|
+
export { Skeleton, renderSkeleton_unstable, skeletonClassNames, useSkeletonContextValues, useSkeletonStyles_unstable, useSkeleton_unstable, useSkeletonBase_unstable } from './Skeleton';
|
|
2
2
|
export { SkeletonItem, renderSkeletonItem_unstable, skeletonItemClassNames, useSkeletonItemStyles_unstable, useSkeletonItem_unstable, useSkeletonItemBase_unstable } from './SkeletonItem';
|
|
3
3
|
export { SkeletonContextProvider, useSkeletonContext } from './contexts/index';
|
package/lib/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n Skeleton,\n renderSkeleton_unstable,\n skeletonClassNames,\n useSkeletonStyles_unstable,\n useSkeleton_unstable,\n useSkeletonBase_unstable,\n} from './Skeleton';\nexport type {
|
|
1
|
+
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n Skeleton,\n renderSkeleton_unstable,\n skeletonClassNames,\n useSkeletonContextValues,\n useSkeletonStyles_unstable,\n useSkeleton_unstable,\n useSkeletonBase_unstable,\n} from './Skeleton';\nexport type {\n SkeletonContextValues,\n SkeletonBaseProps,\n SkeletonProps,\n SkeletonSlots,\n SkeletonBaseState,\n SkeletonState,\n} from './Skeleton';\nexport {\n SkeletonItem,\n renderSkeletonItem_unstable,\n skeletonItemClassNames,\n useSkeletonItemStyles_unstable,\n useSkeletonItem_unstable,\n useSkeletonItemBase_unstable,\n} from './SkeletonItem';\nexport type {\n SkeletonItemBaseProps,\n SkeletonItemProps,\n SkeletonItemSlots,\n SkeletonItemBaseState,\n SkeletonItemState,\n} from './SkeletonItem';\nexport { SkeletonContextProvider, useSkeletonContext } from './contexts/index';\nexport type { SkeletonContextValue } from './contexts/index';\n"],"names":["Skeleton","renderSkeleton_unstable","skeletonClassNames","useSkeletonContextValues","useSkeletonStyles_unstable","useSkeleton_unstable","useSkeletonBase_unstable","SkeletonItem","renderSkeletonItem_unstable","skeletonItemClassNames","useSkeletonItemStyles_unstable","useSkeletonItem_unstable","useSkeletonItemBase_unstable","SkeletonContextProvider","useSkeletonContext"],"mappings":"AAAA,SACEA,QAAQ,EACRC,uBAAuB,EACvBC,kBAAkB,EAClBC,wBAAwB,EACxBC,0BAA0B,EAC1BC,oBAAoB,EACpBC,wBAAwB,QACnB,aAAa;AASpB,SACEC,YAAY,EACZC,2BAA2B,EAC3BC,sBAAsB,EACtBC,8BAA8B,EAC9BC,wBAAwB,EACxBC,4BAA4B,QACvB,iBAAiB;AAQxB,SAASC,uBAAuB,EAAEC,kBAAkB,QAAQ,mBAAmB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Skeleton/Skeleton.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { SkeletonContextValue } from '../../contexts/index';\n\nexport type SkeletonSlots = {\n /**\n * The root slot of the `Skeleton` is the container that will contain the slots that make up a `Skeleton`\n * and any data that the `Skeleton` will load. The default html element is a `div`.\n */\n root: NonNullable<Slot<'div', 'span'>>;\n};\n\n/**\n * Sizes for the SkeletonItem\n */\nexport type SkeletonItemSize =\n | 8\n | 12\n | 14\n | 16\n | 20\n | 22\n | 24\n | 28\n | 32\n | 36\n | 40\n | 48\n | 52\n | 56\n | 64\n | 72\n | 92\n | 96\n | 120\n | 128;\n\n/**\n * Skeleton Props\n */\nexport type SkeletonProps = Omit<ComponentProps<Partial<SkeletonSlots>>, 'width'> & {\n /**\n * The animation type for the Skeleton\n * @defaultValue wave\n */\n animation?: 'wave' | 'pulse';\n\n /**\n * Sets the appearance of the Skeleton.\n * @defaultValue opaque\n */\n appearance?: 'opaque' | 'translucent';\n\n /**\n * Sets the width value of the skeleton wrapper.\n * @defaultValue 100%\n * @deprecated Use `className` prop to set width\n */\n width?: number | string;\n\n /**\n * Sets the size of the SkeletonItems inside the Skeleton in pixels.\n * Size is restricted to a limited set of values recommended for most uses (see SkeletonItemSize).\n * This value can be overridden by the individual SkeletonItem's `size` prop.\n */\n size?: SkeletonItemSize;\n\n /**\n * Sets the shape of the SkeletonItems inside the Skeleton.\n * This value can be overridden by the individual SkeletonItem's `shape` prop.\n */\n shape?: 'circle' | 'square' | 'rectangle';\n};\n\n/**\n * Skeleton base props, excluding design-related props like animation and appearance.\n */\nexport type SkeletonBaseProps = Omit<SkeletonProps, 'animation' | 'appearance'>;\n\nexport type SkeletonContextValues = {\n skeletonGroup: SkeletonContextValue;\n};\n\n/**\n * State used in rendering Skeleton\n */\nexport type SkeletonState = ComponentState<SkeletonSlots> &\n Required<Pick<SkeletonProps, 'animation' | 'appearance'>> &\n Pick<SkeletonProps, 'size' | 'shape'>;\n\n/**\n * Skeleton base state, excluding design-related state like animation and appearance.\n */\nexport type SkeletonBaseState = Omit<SkeletonState, 'animation' | 'appearance' | 'size' | 'shape'>;\n"],"names":[],"mappings":"AAyFA;;CAEC,GACD,WAAmG"}
|
|
1
|
+
{"version":3,"sources":["../src/components/Skeleton/Skeleton.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport type { SkeletonContextValue } from '../../contexts/index';\n\nexport type SkeletonSlots = {\n /**\n * The root slot of the `Skeleton` is the container that will contain the slots that make up a `Skeleton`\n * and any data that the `Skeleton` will load. The default html element is a `div`.\n */\n root: NonNullable<Slot<'div', 'span'>>;\n};\n\n/**\n * Sizes for the SkeletonItem\n */\nexport type SkeletonItemSize =\n | 8\n | 12\n | 14\n | 16\n | 20\n | 22\n | 24\n | 28\n | 32\n | 36\n | 40\n | 48\n | 52\n | 56\n | 64\n | 72\n | 92\n | 96\n | 120\n | 128;\n\n/**\n * Skeleton Props\n */\nexport type SkeletonProps = Omit<ComponentProps<Partial<SkeletonSlots>>, 'width'> & {\n /**\n * The animation type for the Skeleton\n * @defaultValue wave\n */\n animation?: 'wave' | 'pulse';\n\n /**\n * Sets the appearance of the Skeleton.\n * @defaultValue opaque\n */\n appearance?: 'opaque' | 'translucent';\n\n /**\n * Sets the width value of the skeleton wrapper.\n * @defaultValue 100%\n * @deprecated Use `className` prop to set width\n */\n width?: number | string;\n\n /**\n * Sets the size of the SkeletonItems inside the Skeleton in pixels.\n * Size is restricted to a limited set of values recommended for most uses (see SkeletonItemSize).\n * This value can be overridden by the individual SkeletonItem's `size` prop.\n */\n size?: SkeletonItemSize;\n\n /**\n * Sets the shape of the SkeletonItems inside the Skeleton.\n * This value can be overridden by the individual SkeletonItem's `shape` prop.\n */\n shape?: 'circle' | 'square' | 'rectangle';\n};\n\n/**\n * Skeleton base props, excluding design-related props like animation and appearance.\n */\nexport type SkeletonBaseProps = Omit<SkeletonProps, 'animation' | 'appearance'>;\n\nexport type SkeletonContextValues = {\n skeletonGroup: SkeletonContextValue;\n};\n\n/**\n * State used in rendering Skeleton\n */\nexport type SkeletonState = ComponentState<SkeletonSlots> &\n Required<Pick<SkeletonProps, 'animation' | 'appearance'>> &\n Pick<SkeletonProps, 'size' | 'shape'>;\n\n/**\n * Skeleton base state, excluding design-related state like animation and appearance.\n */\nexport type SkeletonBaseState = Omit<SkeletonState, 'animation' | 'appearance' | 'size' | 'shape'>;\n"],"names":[],"mappings":"AAyFA;;CAEC,GACD,WAAmG"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Skeleton/renderSkeleton.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { SkeletonContextProvider } from '../../contexts/SkeletonContext';\nimport type { SkeletonContextValues, SkeletonSlots,
|
|
1
|
+
{"version":3,"sources":["../src/components/Skeleton/renderSkeleton.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { SkeletonContextProvider } from '../../contexts/SkeletonContext';\nimport type { SkeletonContextValues, SkeletonSlots, SkeletonBaseState } from './Skeleton.types';\n\n/**\n * Render the final JSX of Skeleton\n */\nexport const renderSkeleton_unstable = (state: SkeletonBaseState, contextValues: SkeletonContextValues): JSXElement => {\n assertSlots<SkeletonSlots>(state);\n\n return (\n <SkeletonContextProvider value={contextValues.skeletonGroup}>\n <state.root />\n </SkeletonContextProvider>\n );\n};\n"],"names":["assertSlots","SkeletonContextProvider","renderSkeleton_unstable","state","contextValues","value","skeletonGroup","root"],"mappings":";;;;+BAWaE;;;;;;4BAVb,gDAAiD;gCAErB,4BAA4B;iCAEhB,iCAAiC;AAMlE,gCAAgC,CAACC,OAA0BC;QAChEJ,2BAAAA,EAA2BG;IAE3B,OAAA,WAAA,OACE,eAAA,EAACF,wCAAAA,EAAAA;QAAwBI,OAAOD,cAAcE,aAAa;kBACzD,WAAA,OAAA,eAAA,EAACH,MAAMI,IAAI,EAAA,CAAA;;AAGjB,EAAE"}
|
|
@@ -17,8 +17,6 @@ _export(exports, {
|
|
|
17
17
|
return useSkeleton_unstable;
|
|
18
18
|
}
|
|
19
19
|
});
|
|
20
|
-
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
|
|
21
|
-
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
|
22
20
|
const _reactutilities = require("@fluentui/react-utilities");
|
|
23
21
|
const _SkeletonContext = require("../../contexts/SkeletonContext");
|
|
24
22
|
const useSkeleton_unstable = (props, ref)=>{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/Skeleton/useSkeleton.ts"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { SkeletonBaseProps, SkeletonBaseState, SkeletonProps, SkeletonState } from './Skeleton.types';\nimport { useSkeletonContext } from '../../contexts/SkeletonContext';\n\n/**\n * Create the state required to render Skeleton.\n *\n * The returned state can be modified with hooks such as useSkeletonStyles_unstable,\n * before being passed to renderSkeleton_unstable.\n *\n * @param props - props from this instance of Skeleton\n * @param ref - reference to root HTMLElement of Skeleton\n */\nexport const useSkeleton_unstable = (props: SkeletonProps, ref: React.Ref<HTMLElement>): SkeletonState => {\n const { animation: contextAnimation, appearance: contextAppearance } = useSkeletonContext();\n const {\n animation = contextAnimation ?? 'wave',\n appearance = contextAppearance ?? 'opaque',\n size,\n shape,\n ...baseProps\n } = props;\n\n const baseState = useSkeletonBase_unstable(baseProps, ref as React.Ref<HTMLDivElement>);\n\n return {\n ...baseState,\n animation,\n appearance,\n size,\n shape,\n };\n};\n\n/**\n * Base hook for Skeleton component, which manages state related to slots structure and ARIA attributes.\n *\n * @param props - User provided props to the Skeleton component.\n * @param ref - User provided ref to be passed to the Skeleton component.\n */\nexport const useSkeletonBase_unstable = (\n props: SkeletonBaseProps,\n ref: React.Ref<HTMLDivElement>,\n): SkeletonBaseState => {\n const root = slot.always(\n getIntrinsicElementProps('div', {\n ref,\n role: 'progressbar',\n 'aria-busy': true,\n ...props,\n }),\n { elementType: 'div' },\n );\n return { components: { root: 'div' }, root };\n};\n"],"names":["
|
|
1
|
+
{"version":3,"sources":["../src/components/Skeleton/useSkeleton.ts"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { SkeletonBaseProps, SkeletonBaseState, SkeletonProps, SkeletonState } from './Skeleton.types';\nimport { useSkeletonContext } from '../../contexts/SkeletonContext';\n\n/**\n * Create the state required to render Skeleton.\n *\n * The returned state can be modified with hooks such as useSkeletonStyles_unstable,\n * before being passed to renderSkeleton_unstable.\n *\n * @param props - props from this instance of Skeleton\n * @param ref - reference to root HTMLElement of Skeleton\n */\nexport const useSkeleton_unstable = (props: SkeletonProps, ref: React.Ref<HTMLElement>): SkeletonState => {\n const { animation: contextAnimation, appearance: contextAppearance } = useSkeletonContext();\n const {\n animation = contextAnimation ?? 'wave',\n appearance = contextAppearance ?? 'opaque',\n size,\n shape,\n ...baseProps\n } = props;\n\n const baseState = useSkeletonBase_unstable(baseProps, ref as React.Ref<HTMLDivElement>);\n\n return {\n ...baseState,\n animation,\n appearance,\n size,\n shape,\n };\n};\n\n/**\n * Base hook for Skeleton component, which manages state related to slots structure and ARIA attributes.\n *\n * @param props - User provided props to the Skeleton component.\n * @param ref - User provided ref to be passed to the Skeleton component.\n */\nexport const useSkeletonBase_unstable = (\n props: SkeletonBaseProps,\n ref: React.Ref<HTMLDivElement>,\n): SkeletonBaseState => {\n const root = slot.always(\n getIntrinsicElementProps('div', {\n ref,\n role: 'progressbar',\n 'aria-busy': true,\n ...props,\n }),\n { elementType: 'div' },\n );\n return { components: { root: 'div' }, root };\n};\n"],"names":["getIntrinsicElementProps","slot","useSkeletonContext","useSkeleton_unstable","props","ref","animation","contextAnimation","appearance","contextAppearance","size","shape","baseProps","baseState","useSkeletonBase_unstable","root","always","role","elementType","components"],"mappings":"AAAA;;;;;;;;;;;;IA2Cac,wBAAAA;;;wBA3BAX;;;;gCAbkC,4BAA4B;iCAExC,iCAAiC;AAW7D,MAAMA,uBAAuB,CAACC,OAAsBC;IACzD,MAAM,EAAEC,WAAWC,gBAAgB,EAAEC,YAAYC,iBAAiB,EAAE,OAAGP,mCAAAA;IACvE,MAAM,EACJI,YAAYC,qBAAAA,QAAAA,qBAAAA,KAAAA,IAAAA,mBAAoB,MAAM,EACtCC,aAAaC,sBAAAA,QAAAA,sBAAAA,KAAAA,IAAAA,oBAAqB,QAAQ,EAC1CC,IAAI,EACJC,KAAK,EACL,GAAGC,WACJ,GAAGR;IAEJ,MAAMS,YAAYC,yBAAyBF,WAAWP;IAEtD,OAAO;QACL,GAAGQ,SAAS;QACZP;QACAE;QACAE;QACAC;IACF;AACF,EAAE;AAQK,iCAAiC,CACtCP,OACAC;IAEA,MAAMU,OAAOd,oBAAAA,CAAKe,MAAM,KACtBhB,wCAAAA,EAAyB,OAAO;QAC9BK;QACAY,MAAM;QACN,aAAa;QACb,GAAGb,KAAK;IACV,IACA;QAAEc,aAAa;IAAM;IAEvB,OAAO;QAAEC,YAAY;YAAEJ,MAAM;QAAM;QAAGA;IAAK;AAC7C,EAAE"}
|
|
@@ -17,8 +17,6 @@ _export(exports, {
|
|
|
17
17
|
return useSkeletonItem_unstable;
|
|
18
18
|
}
|
|
19
19
|
});
|
|
20
|
-
const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
|
|
21
|
-
const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
|
|
22
20
|
const _reactutilities = require("@fluentui/react-utilities");
|
|
23
21
|
const _SkeletonContext = require("../../contexts/SkeletonContext");
|
|
24
22
|
const useSkeletonItem_unstable = (props, ref)=>{
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/SkeletonItem/useSkeletonItem.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { useSkeletonContext } from '../../contexts/SkeletonContext';\nimport type {\n SkeletonItemBaseProps,\n SkeletonItemBaseState,\n SkeletonItemProps,\n SkeletonItemState,\n} from './SkeletonItem.types';\n\n/**\n * Create the state required to render SkeletonItem.\n *\n * The returned state can be modified with hooks such as useSkeletonItemStyles_unstable,\n * before being passed to renderSkeletonItem_unstable.\n *\n * @param props - props from this instance of SkeletonItem\n * @param ref - reference to root HTMLElement of SkeletonItem\n */\nexport const useSkeletonItem_unstable = (props: SkeletonItemProps, ref: React.Ref<HTMLElement>): SkeletonItemState => {\n const {\n animation: contextAnimation,\n appearance: contextAppearance,\n size: contextSize,\n shape: contextShape,\n } = useSkeletonContext();\n const {\n animation = contextAnimation ?? 'wave',\n appearance = contextAppearance ?? 'opaque',\n size = contextSize ?? 16,\n shape = contextShape ?? 'rectangle',\n ...baseProps\n } = props;\n\n const baseState = useSkeletonItemBase_unstable(baseProps, ref as React.Ref<HTMLDivElement>);\n\n return {\n ...baseState,\n animation,\n appearance,\n size,\n shape,\n };\n};\n\n/**\n * Base hook for SkeletonItem component, which manages state related to slots structure.\n *\n * @param props - User provided props to the SkeletonItem component.\n * @param ref - User provided ref to be passed to the SkeletonItem component.\n */\nexport const useSkeletonItemBase_unstable = (\n props: SkeletonItemBaseProps,\n ref: React.Ref<HTMLDivElement>,\n): SkeletonItemBaseState => {\n const root = slot.always(\n getIntrinsicElementProps('div', {\n ref,\n ...props,\n }),\n { elementType: 'div' },\n );\n return { components: { root: 'div' }, root };\n};\n"],"names":["
|
|
1
|
+
{"version":3,"sources":["../src/components/SkeletonItem/useSkeletonItem.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { useSkeletonContext } from '../../contexts/SkeletonContext';\nimport type {\n SkeletonItemBaseProps,\n SkeletonItemBaseState,\n SkeletonItemProps,\n SkeletonItemState,\n} from './SkeletonItem.types';\n\n/**\n * Create the state required to render SkeletonItem.\n *\n * The returned state can be modified with hooks such as useSkeletonItemStyles_unstable,\n * before being passed to renderSkeletonItem_unstable.\n *\n * @param props - props from this instance of SkeletonItem\n * @param ref - reference to root HTMLElement of SkeletonItem\n */\nexport const useSkeletonItem_unstable = (props: SkeletonItemProps, ref: React.Ref<HTMLElement>): SkeletonItemState => {\n const {\n animation: contextAnimation,\n appearance: contextAppearance,\n size: contextSize,\n shape: contextShape,\n } = useSkeletonContext();\n const {\n animation = contextAnimation ?? 'wave',\n appearance = contextAppearance ?? 'opaque',\n size = contextSize ?? 16,\n shape = contextShape ?? 'rectangle',\n ...baseProps\n } = props;\n\n const baseState = useSkeletonItemBase_unstable(baseProps, ref as React.Ref<HTMLDivElement>);\n\n return {\n ...baseState,\n animation,\n appearance,\n size,\n shape,\n };\n};\n\n/**\n * Base hook for SkeletonItem component, which manages state related to slots structure.\n *\n * @param props - User provided props to the SkeletonItem component.\n * @param ref - User provided ref to be passed to the SkeletonItem component.\n */\nexport const useSkeletonItemBase_unstable = (\n props: SkeletonItemBaseProps,\n ref: React.Ref<HTMLDivElement>,\n): SkeletonItemBaseState => {\n const root = slot.always(\n getIntrinsicElementProps('div', {\n ref,\n ...props,\n }),\n { elementType: 'div' },\n );\n return { components: { root: 'div' }, root };\n};\n"],"names":["getIntrinsicElementProps","slot","useSkeletonContext","useSkeletonItem_unstable","props","ref","animation","contextAnimation","appearance","contextAppearance","size","contextSize","shape","contextShape","baseProps","baseState","useSkeletonItemBase_unstable","root","always","elementType","components"],"mappings":"AAAA;;;;;;;;;;;;gCAqDagB;eAAAA;;4BAhCAb;;;;gCAlBkC,4BAA4B;iCACxC,iCAAiC;AAiB7D,MAAMA,2BAA2B,CAACC,OAA0BC;IACjE,MAAM,EACJC,WAAWC,gBAAgB,EAC3BC,YAAYC,iBAAiB,EAC7BC,MAAMC,WAAW,EACjBC,OAAOC,YAAY,EACpB,OAAGX,mCAAAA;IACJ,MAAM,EACJI,YAAYC,qBAAAA,QAAAA,qBAAAA,KAAAA,IAAAA,mBAAoB,MAAM,EACtCC,aAAaC,sBAAAA,QAAAA,sBAAAA,KAAAA,IAAAA,oBAAqB,QAAQ,EAC1CC,OAAOC,gBAAAA,QAAAA,gBAAAA,KAAAA,IAAAA,cAAe,EAAE,EACxBC,QAAQC,iBAAAA,QAAAA,iBAAAA,KAAAA,IAAAA,eAAgB,WAAW,EACnC,GAAGC,WACJ,GAAGV;IAEJ,MAAMW,YAAYC,6BAA6BF,WAAWT;IAE1D,OAAO;QACL,GAAGU,SAAS;QACZT;QACAE;QACAE;QACAE;IACF;AACF,EAAE;AAQK,qCAAqC,CAC1CR,OACAC;IAEA,MAAMY,OAAOhB,oBAAAA,CAAKiB,MAAM,KACtBlB,wCAAAA,EAAyB,OAAO;QAC9BK;QACA,GAAGD,KAAK;IACV,IACA;QAAEe,aAAa;IAAM;IAEvB,OAAO;QAAEC,YAAY;YAAEH,MAAM;QAAM;QAAGA;IAAK;AAC7C,EAAE"}
|
package/lib-commonjs/index.js
CHANGED
|
@@ -36,6 +36,9 @@ _export(exports, {
|
|
|
36
36
|
useSkeletonContext: function() {
|
|
37
37
|
return _index.useSkeletonContext;
|
|
38
38
|
},
|
|
39
|
+
useSkeletonContextValues: function() {
|
|
40
|
+
return _Skeleton.useSkeletonContextValues;
|
|
41
|
+
},
|
|
39
42
|
useSkeletonItemBase_unstable: function() {
|
|
40
43
|
return _SkeletonItem.useSkeletonItemBase_unstable;
|
|
41
44
|
},
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n Skeleton,\n renderSkeleton_unstable,\n skeletonClassNames,\n useSkeletonStyles_unstable,\n useSkeleton_unstable,\n useSkeletonBase_unstable,\n} from './Skeleton';\nexport type {
|
|
1
|
+
{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n Skeleton,\n renderSkeleton_unstable,\n skeletonClassNames,\n useSkeletonContextValues,\n useSkeletonStyles_unstable,\n useSkeleton_unstable,\n useSkeletonBase_unstable,\n} from './Skeleton';\nexport type {\n SkeletonContextValues,\n SkeletonBaseProps,\n SkeletonProps,\n SkeletonSlots,\n SkeletonBaseState,\n SkeletonState,\n} from './Skeleton';\nexport {\n SkeletonItem,\n renderSkeletonItem_unstable,\n skeletonItemClassNames,\n useSkeletonItemStyles_unstable,\n useSkeletonItem_unstable,\n useSkeletonItemBase_unstable,\n} from './SkeletonItem';\nexport type {\n SkeletonItemBaseProps,\n SkeletonItemProps,\n SkeletonItemSlots,\n SkeletonItemBaseState,\n SkeletonItemState,\n} from './SkeletonItem';\nexport { SkeletonContextProvider, useSkeletonContext } from './contexts/index';\nexport type { SkeletonContextValue } from './contexts/index';\n"],"names":["Skeleton","renderSkeleton_unstable","skeletonClassNames","useSkeletonContextValues","useSkeletonStyles_unstable","useSkeleton_unstable","useSkeletonBase_unstable","SkeletonItem","renderSkeletonItem_unstable","skeletonItemClassNames","useSkeletonItemStyles_unstable","useSkeletonItem_unstable","useSkeletonItemBase_unstable","SkeletonContextProvider","useSkeletonContext"],"mappings":";;;;;;;;;;;IACEA;iCAAQ;;IA+BDa;6CAAuB;;;eAd9BN,0BAAY;;;eACZC,yCAA2B;;;eAjB3BP,iCAAuB;;;eACvBC,4BAAkB;;IAiBlBO,sBAAsB;;;;eAbtBH,kCAAwB;;sBAyB0B;eAAlBQ;;;eA5BhCX,kCAAwB;;;eAmBxBS,0CAA4B;;;eAF5BF,4CAA8B;;;eAC9BC,sCAAwB;;;eAjBxBP,oCAA0B;;;eAC1BC,8BAAoB;;;0BAEf,aAAa;8BAgBb,iBAAiB;uBAQoC,mBAAmB"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-skeleton",
|
|
3
|
-
"version": "9.7.
|
|
3
|
+
"version": "9.7.2",
|
|
4
4
|
"description": "Converged v9 Skeleton Component",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -12,11 +12,11 @@
|
|
|
12
12
|
},
|
|
13
13
|
"license": "MIT",
|
|
14
14
|
"dependencies": {
|
|
15
|
-
"@fluentui/react-field": "^9.
|
|
16
|
-
"@fluentui/react-jsx-runtime": "^9.4.
|
|
15
|
+
"@fluentui/react-field": "^9.5.1",
|
|
16
|
+
"@fluentui/react-jsx-runtime": "^9.4.2",
|
|
17
17
|
"@fluentui/react-shared-contexts": "^9.26.2",
|
|
18
18
|
"@fluentui/react-theme": "^9.2.1",
|
|
19
|
-
"@fluentui/react-utilities": "^9.26.
|
|
19
|
+
"@fluentui/react-utilities": "^9.26.3",
|
|
20
20
|
"@griffel/react": "^1.5.32",
|
|
21
21
|
"@swc/helpers": "^0.5.1"
|
|
22
22
|
},
|