npm - @fluentui/react-skeleton - Versions diffs - 9.4.0 → 9.4.2 - Mend

@fluentui/react-skeleton 9.4.0 → 9.4.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.

Files changed (40) hide show

package/CHANGELOG.md CHANGED Viewed

@@ -1,12 +1,36 @@
 # Change Log - @fluentui/react-skeleton
-This log was last generated on Thu, 17 Jul 2025 13:45:46 GMT and should not be manually modified.
+This log was last generated on Wed, 30 Jul 2025 08:41:07 GMT and should not be manually modified.
 <!-- Start content -->
+## [9.4.2](https://github.com/microsoft/fluentui/tree/@fluentui/react-skeleton_v9.4.2)
+Wed, 30 Jul 2025 08:41:07 GMT
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-skeleton_v9.4.1..@fluentui/react-skeleton_v9.4.2)
+### Patches
+- Bump @fluentui/react-field to v9.4.2 ([PR #34881](https://github.com/microsoft/fluentui/pull/34881) by beachball)
+- Bump @fluentui/react-jsx-runtime to v9.1.4 ([PR #34881](https://github.com/microsoft/fluentui/pull/34881) by beachball)
+- Bump @fluentui/react-shared-contexts to v9.24.1 ([PR #34881](https://github.com/microsoft/fluentui/pull/34881) by beachball)
+- Bump @fluentui/react-theme to v9.2.0 ([PR #34881](https://github.com/microsoft/fluentui/pull/34881) by beachball)
+- Bump @fluentui/react-utilities to v9.23.1 ([PR #34881](https://github.com/microsoft/fluentui/pull/34881) by beachball)
+## [9.4.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-skeleton_v9.4.1)
+Mon, 28 Jul 2025 18:48:21 GMT
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-skeleton_v9.4.0..@fluentui/react-skeleton_v9.4.1)
+### Patches
+- Bump @fluentui/react-field to v9.4.1 ([PR #34918](https://github.com/microsoft/fluentui/pull/34918) by beachball)
+- Bump @fluentui/react-jsx-runtime to v9.1.3 ([PR #34918](https://github.com/microsoft/fluentui/pull/34918) by beachball)
+- Bump @fluentui/react-utilities to v9.23.0 ([PR #34918](https://github.com/microsoft/fluentui/pull/34918) by beachball)
 ## [9.4.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-skeleton_v9.4.0)
-Thu, 17 Jul 2025 13:45:46 GMT
+Thu, 17 Jul 2025 13:49:46 GMT
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-skeleton_v9.3.7..@fluentui/react-skeleton_v9.4.0)
 ### Minor changes

package/lib/Skeleton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/Skeleton.ts"],"sourcesContent":["export type { SkeletonContextValues, SkeletonProps, SkeletonSlots, SkeletonState } from './components/Skeleton/index';\nexport {\n Skeleton,\n renderSkeleton_unstable,\n skeletonClassNames,\n useSkeletonContextValues,\n useSkeletonStyles_unstable,\n useSkeleton_unstable,\n} from './components/Skeleton/index';\n"],"names":["Skeleton","renderSkeleton_unstable","skeletonClassNames","useSkeletonContextValues","useSkeletonStyles_unstable","useSkeleton_unstable"],"~~rangeMappings":"","~~mappings":"AACA,SACEA,QAAQ,EACRC,uBAAuB,EACvBC,kBAAkB,EAClBC,wBAAwB,EACxBC,0BAA0B,EAC1BC,oBAAoB,QACf,8BAA8B"}
1	+ {"version":3,"sources":["../src/Skeleton.ts"],"sourcesContent":["export type { SkeletonContextValues, SkeletonProps, SkeletonSlots, SkeletonState } from './components/Skeleton/index';\nexport {\n Skeleton,\n renderSkeleton_unstable,\n skeletonClassNames,\n useSkeletonContextValues,\n useSkeletonStyles_unstable,\n useSkeleton_unstable,\n} from './components/Skeleton/index';\n"],"names":["Skeleton","renderSkeleton_unstable","skeletonClassNames","useSkeletonContextValues","useSkeletonStyles_unstable","useSkeleton_unstable"],"mappings":"AACA,SACEA,QAAQ,EACRC,uBAAuB,EACvBC,kBAAkB,EAClBC,wBAAwB,EACxBC,0BAA0B,EAC1BC,oBAAoB,QACf,8BAA8B"}

package/lib/SkeletonItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/SkeletonItem.ts"],"sourcesContent":["export type {\n SkeletonItemProps,\n SkeletonItemSize,\n SkeletonItemSlots,\n SkeletonItemState,\n} from './components/SkeletonItem/index';\nexport {\n SkeletonItem,\n renderSkeletonItem_unstable,\n skeletonItemClassNames,\n useSkeletonItemStyles_unstable,\n useSkeletonItem_unstable,\n} from './components/SkeletonItem/index';\n"],"names":["SkeletonItem","renderSkeletonItem_unstable","skeletonItemClassNames","useSkeletonItemStyles_unstable","useSkeletonItem_unstable"],"~~rangeMappings":"","~~mappings":"AAMA,SACEA,YAAY,EACZC,2BAA2B,EAC3BC,sBAAsB,EACtBC,8BAA8B,EAC9BC,wBAAwB,QACnB,kCAAkC"}
1	+ {"version":3,"sources":["../src/SkeletonItem.ts"],"sourcesContent":["export type {\n SkeletonItemProps,\n SkeletonItemSize,\n SkeletonItemSlots,\n SkeletonItemState,\n} from './components/SkeletonItem/index';\nexport {\n SkeletonItem,\n renderSkeletonItem_unstable,\n skeletonItemClassNames,\n useSkeletonItemStyles_unstable,\n useSkeletonItem_unstable,\n} from './components/SkeletonItem/index';\n"],"names":["SkeletonItem","renderSkeletonItem_unstable","skeletonItemClassNames","useSkeletonItemStyles_unstable","useSkeletonItem_unstable"],"mappings":"AAMA,SACEA,YAAY,EACZC,2BAA2B,EAC3BC,sBAAsB,EACtBC,8BAA8B,EAC9BC,wBAAwB,QACnB,kCAAkC"}

package/lib/components/Skeleton/Skeleton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/Skeleton/Skeleton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useSkeleton_unstable } from './useSkeleton';\nimport { renderSkeleton_unstable } from './renderSkeleton';\nimport { useSkeletonStyles_unstable } from './useSkeletonStyles.styles';\nimport { useSkeletonContextValues } from './useSkeletonContextValues';\nimport type { SkeletonProps } from './Skeleton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/*\n Skeleton component - TODO: add more docs\n */\nexport const Skeleton: ForwardRefComponent<SkeletonProps> = React.forwardRef((props, ref) => {\n const state = useSkeleton_unstable(props, ref);\n const contextValues = useSkeletonContextValues(state);\n\n useSkeletonStyles_unstable(state);\n useCustomStyleHook_unstable('useSkeletonStyles_unstable')(state);\n\n return renderSkeleton_unstable(state, contextValues);\n});\n\nSkeleton.displayName = 'Skeleton';\n"],"names":["React","useSkeleton_unstable","renderSkeleton_unstable","useSkeletonStyles_unstable","useSkeletonContextValues","useCustomStyleHook_unstable","Skeleton","forwardRef","props","ref","state","contextValues","displayName"],"~~rangeMappings":";;;;;;;;;;;;;;;","~~mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,oBAAoB,QAAQ,gBAAgB;AACrD,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,0BAA0B,QAAQ,6BAA6B;AACxE,SAASC,wBAAwB,QAAQ,6BAA6B;AAGtE,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,yBAA+CN,MAAMO,UAAU,CAAC,CAACC,OAAOC;IACnF,MAAMC,QAAQT,qBAAqBO,OAAOC;IAC1C,MAAME,gBAAgBP,yBAAyBM;IAE/CP,2BAA2BO;IAC3BL,4BAA4B,8BAA8BK;IAE1D,OAAOR,wBAAwBQ,OAAOC;AACxC,GAAG;AAEHL,SAASM,WAAW,GAAG"}
1	+ {"version":3,"sources":["../src/components/Skeleton/Skeleton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useSkeleton_unstable } from './useSkeleton';\nimport { renderSkeleton_unstable } from './renderSkeleton';\nimport { useSkeletonStyles_unstable } from './useSkeletonStyles.styles';\nimport { useSkeletonContextValues } from './useSkeletonContextValues';\nimport type { SkeletonProps } from './Skeleton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/*\n Skeleton component - TODO: add more docs\n */\nexport const Skeleton: ForwardRefComponent<SkeletonProps> = React.forwardRef((props, ref) => {\n const state = useSkeleton_unstable(props, ref);\n const contextValues = useSkeletonContextValues(state);\n\n useSkeletonStyles_unstable(state);\n useCustomStyleHook_unstable('useSkeletonStyles_unstable')(state);\n\n return renderSkeleton_unstable(state, contextValues);\n});\n\nSkeleton.displayName = 'Skeleton';\n"],"names":["React","useSkeleton_unstable","renderSkeleton_unstable","useSkeletonStyles_unstable","useSkeletonContextValues","useCustomStyleHook_unstable","Skeleton","forwardRef","props","ref","state","contextValues","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,oBAAoB,QAAQ,gBAAgB;AACrD,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,0BAA0B,QAAQ,6BAA6B;AACxE,SAASC,wBAAwB,QAAQ,6BAA6B;AAGtE,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,yBAA+CN,MAAMO,UAAU,CAAC,CAACC,OAAOC;IACnF,MAAMC,QAAQT,qBAAqBO,OAAOC;IAC1C,MAAME,gBAAgBP,yBAAyBM;IAE/CP,2BAA2BO;IAC3BL,4BAA4B,8BAA8BK;IAE1D,OAAOR,wBAAwBQ,OAAOC;AACxC,GAAG;AAEHL,SAASM,WAAW,GAAG"}

package/lib/components/Skeleton/Skeleton.types.js.map CHANGED Viewed

	@@ -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 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\nexport type SkeletonContextValues = {\n skeletonGroup: SkeletonContextValue;\n};\n\n/\n State used in rendering Skeleton\n */\nexport type SkeletonState = ComponentState<SkeletonSlots> & Required<Pick<SkeletonProps, 'animation' \| 'appearance'>>;\n"],"names":[],"~~rangeMappings":";;","~~mappings":"AAuCA;;CAEC,GACD,WAAsH"}
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 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\nexport type SkeletonContextValues = {\n skeletonGroup: SkeletonContextValue;\n};\n\n/\n State used in rendering Skeleton\n */\nexport type SkeletonState = ComponentState<SkeletonSlots> & Required<Pick<SkeletonProps, 'animation' \| 'appearance'>>;\n"],"names":[],"mappings":"AAuCA;;CAEC,GACD,WAAsH"}

package/lib/components/Skeleton/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/Skeleton/index.ts"],"sourcesContent":["export { Skeleton } from './Skeleton';\nexport type { SkeletonContextValues, SkeletonProps, SkeletonSlots, SkeletonState } from './Skeleton.types';\nexport { renderSkeleton_unstable } from './renderSkeleton';\nexport { useSkeleton_unstable } from './useSkeleton';\nexport { useSkeletonContextValues } from './useSkeletonContextValues';\nexport { skeletonClassNames, useSkeletonStyles_unstable } from './useSkeletonStyles.styles';\n"],"names":["Skeleton","renderSkeleton_unstable","useSkeleton_unstable","useSkeletonContextValues","skeletonClassNames","useSkeletonStyles_unstable"],"~~rangeMappings":";;;;","~~mappings":"AAAA,SAASA,QAAQ,QAAQ,aAAa;AAEtC,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,oBAAoB,QAAQ,gBAAgB;AACrD,SAASC,wBAAwB,QAAQ,6BAA6B;AACtE,SAASC,kBAAkB,EAAEC,0BAA0B,QAAQ,6BAA6B"}
1	+ {"version":3,"sources":["../src/components/Skeleton/index.ts"],"sourcesContent":["export { Skeleton } from './Skeleton';\nexport type { SkeletonContextValues, SkeletonProps, SkeletonSlots, SkeletonState } from './Skeleton.types';\nexport { renderSkeleton_unstable } from './renderSkeleton';\nexport { useSkeleton_unstable } from './useSkeleton';\nexport { useSkeletonContextValues } from './useSkeletonContextValues';\nexport { skeletonClassNames, useSkeletonStyles_unstable } from './useSkeletonStyles.styles';\n"],"names":["Skeleton","renderSkeleton_unstable","useSkeleton_unstable","useSkeletonContextValues","skeletonClassNames","useSkeletonStyles_unstable"],"mappings":"AAAA,SAASA,QAAQ,QAAQ,aAAa;AAEtC,SAASC,uBAAuB,QAAQ,mBAAmB;AAC3D,SAASC,oBAAoB,QAAQ,gBAAgB;AACrD,SAASC,wBAAwB,QAAQ,6BAA6B;AACtE,SAASC,kBAAkB,EAAEC,0BAA0B,QAAQ,6BAA6B"}

package/lib/components/Skeleton/renderSkeleton.js.map CHANGED Viewed

	@@ -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 { SkeletonContextProvider } from '../../contexts/SkeletonContext';\nimport type { SkeletonContextValues, SkeletonSlots, SkeletonState } from './Skeleton.types';\n\n/\n Render the final JSX of Skeleton\n */\nexport const renderSkeleton_unstable = (state: SkeletonState, contextValues: SkeletonContextValues) => {\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"],"~~rangeMappings":";;;;;;;;;;;","~~mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AACxD,SAASC,uBAAuB,QAAQ,iCAAiC;AAGzE;;CAEC,GACD,OAAO,MAAMC,0BAA0B,CAACC,OAAsBC;IAC5DJ,YAA2BG;IAE3B,qBACE,KAACF;QAAwBI,OAAOD,cAAcE,aAAa;kBACzD,cAAA,KAACH,MAAMI,IAAI;;AAGjB,EAAE"}
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 { SkeletonContextProvider } from '../../contexts/SkeletonContext';\nimport type { SkeletonContextValues, SkeletonSlots, SkeletonState } from './Skeleton.types';\n\n/\n Render the final JSX of Skeleton\n */\nexport const renderSkeleton_unstable = (state: SkeletonState, contextValues: SkeletonContextValues) => {\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;AACxD,SAASC,uBAAuB,QAAQ,iCAAiC;AAGzE;;CAEC,GACD,OAAO,MAAMC,0BAA0B,CAACC,OAAsBC;IAC5DJ,YAA2BG;IAE3B,qBACE,KAACF;QAAwBI,OAAOD,cAAcE,aAAa;kBACzD,cAAA,KAACH,MAAMI,IAAI;;AAGjB,EAAE"}

package/lib/components/Skeleton/useSkeleton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/Skeleton/useSkeleton.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { 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 { animation = contextAnimation ?? 'wave', appearance = contextAppearance ?? 'opaque' } = props;\n\n const root = slot.always(\n getIntrinsicElementProps('div', {\n // FIXME:\n // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n ref: ref as React.Ref<HTMLDivElement>,\n role: 'progressbar',\n 'aria-busy': true,\n ...props,\n }),\n { elementType: 'div' },\n );\n return { animation, appearance, components: { root: 'div' }, root };\n};\n"],"names":["React","getIntrinsicElementProps","slot","useSkeletonContext","useSkeleton_unstable","props","ref","animation","contextAnimation","appearance","contextAppearance","root","always","role","elementType","components"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,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,EAAEI,YAAYC,6BAAAA,8BAAAA,mBAAoB,MAAM,EAAEC,aAAaC,8BAAAA,+BAAAA,oBAAqB,QAAQ,EAAE,GAAGL;IAE/F,MAAMM,OAAOT,KAAKU,MAAM,CACtBX,yBAAyB,OAAO;QAC9B,SAAS;QACT,4EAA4E;QAC5E,4FAA4F;QAC5FK,KAAKA;QACLO,MAAM;QACN,aAAa;QACb,GAAGR,KAAK;IACV,IACA;QAAES,aAAa;IAAM;IAEvB,OAAO;QAAEP;QAAWE;QAAYM,YAAY;YAAEJ,MAAM;QAAM;QAAGA;IAAK;AACpE,EAAE"}
1	+ {"version":3,"sources":["../src/components/Skeleton/useSkeleton.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { 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 { animation = contextAnimation ?? 'wave', appearance = contextAppearance ?? 'opaque' } = props;\n\n const root = slot.always(\n getIntrinsicElementProps('div', {\n // FIXME:\n // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n ref: ref as React.Ref<HTMLDivElement>,\n role: 'progressbar',\n 'aria-busy': true,\n ...props,\n }),\n { elementType: 'div' },\n );\n return { animation, appearance, components: { root: 'div' }, root };\n};\n"],"names":["React","getIntrinsicElementProps","slot","useSkeletonContext","useSkeleton_unstable","props","ref","animation","contextAnimation","appearance","contextAppearance","root","always","role","elementType","components"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,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,EAAEI,YAAYC,6BAAAA,8BAAAA,mBAAoB,MAAM,EAAEC,aAAaC,8BAAAA,+BAAAA,oBAAqB,QAAQ,EAAE,GAAGL;IAE/F,MAAMM,OAAOT,KAAKU,MAAM,CACtBX,yBAAyB,OAAO;QAC9B,SAAS;QACT,4EAA4E;QAC5E,4FAA4F;QAC5FK,KAAKA;QACLO,MAAM;QACN,aAAa;QACb,GAAGR,KAAK;IACV,IACA;QAAES,aAAa;IAAM;IAEvB,OAAO;QAAEP;QAAWE;QAAYM,YAAY;YAAEJ,MAAM;QAAM;QAAGA;IAAK;AACpE,EAAE"}

package/lib/components/Skeleton/useSkeletonContextValues.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/Skeleton/useSkeletonContextValues.ts"],"sourcesContent":["import * as React from 'react';\nimport type { SkeletonContextValues, SkeletonState } from '../Skeleton';\n\nexport const useSkeletonContextValues = (state: SkeletonState): SkeletonContextValues => {\n const { animation, appearance } = state;\n\n const skeletonGroup = React.useMemo(\n () => ({\n animation,\n appearance,\n }),\n [animation, appearance],\n );\n\n return { skeletonGroup };\n};\n"],"names":["React","useSkeletonContextValues","state","animation","appearance","skeletonGroup","useMemo"],"~~rangeMappings":";;;;;;;;;;;;;","~~mappings":"AAAA,YAAYA,WAAW,QAAQ;AAG/B,OAAO,MAAMC,2BAA2B,CAACC;IACvC,MAAM,EAAEC,SAAS,EAAEC,UAAU,EAAE,GAAGF;IAElC,MAAMG,gBAAgBL,MAAMM,OAAO,CACjC,IAAO,CAAA;YACLH;YACAC;QACF,CAAA,GACA;QAACD;QAAWC;KAAW;IAGzB,OAAO;QAAEC;IAAc;AACzB,EAAE"}
1	+ {"version":3,"sources":["../src/components/Skeleton/useSkeletonContextValues.ts"],"sourcesContent":["import * as React from 'react';\nimport type { SkeletonContextValues, SkeletonState } from '../Skeleton';\n\nexport const useSkeletonContextValues = (state: SkeletonState): SkeletonContextValues => {\n const { animation, appearance } = state;\n\n const skeletonGroup = React.useMemo(\n () => ({\n animation,\n appearance,\n }),\n [animation, appearance],\n );\n\n return { skeletonGroup };\n};\n"],"names":["React","useSkeletonContextValues","state","animation","appearance","skeletonGroup","useMemo"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAG/B,OAAO,MAAMC,2BAA2B,CAACC;IACvC,MAAM,EAAEC,SAAS,EAAEC,UAAU,EAAE,GAAGF;IAElC,MAAMG,gBAAgBL,MAAMM,OAAO,CACjC,IAAO,CAAA;YACLH;YACAC;QACF,CAAA,GACA;QAACD;QAAWC;KAAW;IAGzB,OAAO;QAAEC;IAAc;AACzB,EAAE"}

package/lib/components/Skeleton/useSkeletonStyles.styles.raw.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/Skeleton/useSkeletonStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SkeletonSlots, SkeletonState } from './Skeleton.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nexport const skeletonClassNames: SlotClassNames<SkeletonSlots> = {\n root: 'fui-Skeleton',\n};\n\nconst useStyles = makeStyles({\n blockStyling: {\n display: 'block',\n },\n});\n\n/*\n Apply styling to the Skeleton slots based on the state\n */\nexport const useSkeletonStyles_unstable = (state: SkeletonState): SkeletonState => {\n 'use no memo';\n\n const styles = useStyles();\n\n state.root.className = mergeClasses(\n skeletonClassNames.root,\n state.root.as === 'span' && styles.blockStyling,\n state.root.className,\n );\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","skeletonClassNames","root","useStyles","blockStyling","display","useSkeletonStyles_unstable","state","styles","className","as"],"~~rangeMappings":";;;;;;;;;;;;;;;;","~~mappings":"AAAA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAG1D,OAAO,MAAMC,qBAAoD;IAC/DC,MAAM;AACR,EAAE;AAEF,MAAMC,YAAYJ,WAAW;IAC3BK,cAAc;QACZC,SAAS;IACX;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,6BAA6B,CAACC;IACzC;IAEA,MAAMC,SAASL;IAEfI,MAAML,IAAI,CAACO,SAAS,GAAGT,aACrBC,mBAAmBC,IAAI,EACvBK,MAAML,IAAI,CAACQ,EAAE,KAAK,UAAUF,OAAOJ,YAAY,EAC/CG,MAAML,IAAI,CAACO,SAAS;IAGtB,OAAOF;AACT,EAAE"}
1	+ {"version":3,"sources":["../src/components/Skeleton/useSkeletonStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SkeletonSlots, SkeletonState } from './Skeleton.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nexport const skeletonClassNames: SlotClassNames<SkeletonSlots> = {\n root: 'fui-Skeleton',\n};\n\nconst useStyles = makeStyles({\n blockStyling: {\n display: 'block',\n },\n});\n\n/*\n Apply styling to the Skeleton slots based on the state\n */\nexport const useSkeletonStyles_unstable = (state: SkeletonState): SkeletonState => {\n 'use no memo';\n\n const styles = useStyles();\n\n state.root.className = mergeClasses(\n skeletonClassNames.root,\n state.root.as === 'span' && styles.blockStyling,\n state.root.className,\n );\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","skeletonClassNames","root","useStyles","blockStyling","display","useSkeletonStyles_unstable","state","styles","className","as"],"mappings":"AAAA,SAASA,UAAU,EAAEC,YAAY,QAAQ,iBAAiB;AAG1D,OAAO,MAAMC,qBAAoD;IAC/DC,MAAM;AACR,EAAE;AAEF,MAAMC,YAAYJ,WAAW;IAC3BK,cAAc;QACZC,SAAS;IACX;AACF;AAEA;;CAEC,GACD,OAAO,MAAMC,6BAA6B,CAACC;IACzC;IAEA,MAAMC,SAASL;IAEfI,MAAML,IAAI,CAACO,SAAS,GAAGT,aACrBC,mBAAmBC,IAAI,EACvBK,MAAML,IAAI,CAACQ,EAAE,KAAK,UAAUF,OAAOJ,YAAY,EAC/CG,MAAML,IAAI,CAACO,SAAS;IAGtB,OAAOF;AACT,EAAE"}

package/lib/components/SkeletonItem/SkeletonItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/SkeletonItem/SkeletonItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useSkeletonItem_unstable } from './useSkeletonItem';\nimport { renderSkeletonItem_unstable } from './renderSkeletonItem';\nimport { useSkeletonItemStyles_unstable } from './useSkeletonItemStyles.styles';\nimport type { SkeletonItemProps } from './SkeletonItem.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\nexport const SkeletonItem: ForwardRefComponent<SkeletonItemProps> = React.forwardRef((props, ref) => {\n const state = useSkeletonItem_unstable(props, ref);\n\n useSkeletonItemStyles_unstable(state);\n useCustomStyleHook_unstable('useSkeletonItemStyles_unstable')(state);\n\n return renderSkeletonItem_unstable(state);\n});\n\nSkeletonItem.displayName = 'SkeletonItem';\n"],"names":["React","useSkeletonItem_unstable","renderSkeletonItem_unstable","useSkeletonItemStyles_unstable","useCustomStyleHook_unstable","SkeletonItem","forwardRef","props","ref","state","displayName"],"~~rangeMappings":";;;;;;;;;;;","~~mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,2BAA2B,QAAQ,uBAAuB;AACnE,SAASC,8BAA8B,QAAQ,iCAAiC;AAGhF,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E,OAAO,MAAMC,6BAAuDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,QAAQR,yBAAyBM,OAAOC;IAE9CL,+BAA+BM;IAC/BL,4BAA4B,kCAAkCK;IAE9D,OAAOP,4BAA4BO;AACrC,GAAG;AAEHJ,aAAaK,WAAW,GAAG"}
1	+ {"version":3,"sources":["../src/components/SkeletonItem/SkeletonItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useSkeletonItem_unstable } from './useSkeletonItem';\nimport { renderSkeletonItem_unstable } from './renderSkeletonItem';\nimport { useSkeletonItemStyles_unstable } from './useSkeletonItemStyles.styles';\nimport type { SkeletonItemProps } from './SkeletonItem.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\nexport const SkeletonItem: ForwardRefComponent<SkeletonItemProps> = React.forwardRef((props, ref) => {\n const state = useSkeletonItem_unstable(props, ref);\n\n useSkeletonItemStyles_unstable(state);\n useCustomStyleHook_unstable('useSkeletonItemStyles_unstable')(state);\n\n return renderSkeletonItem_unstable(state);\n});\n\nSkeletonItem.displayName = 'SkeletonItem';\n"],"names":["React","useSkeletonItem_unstable","renderSkeletonItem_unstable","useSkeletonItemStyles_unstable","useCustomStyleHook_unstable","SkeletonItem","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,2BAA2B,QAAQ,uBAAuB;AACnE,SAASC,8BAA8B,QAAQ,iCAAiC;AAGhF,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E,OAAO,MAAMC,6BAAuDL,MAAMM,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,QAAQR,yBAAyBM,OAAOC;IAE9CL,+BAA+BM;IAC/BL,4BAA4B,kCAAkCK;IAE9D,OAAOP,4BAA4BO;AACrC,GAAG;AAEHJ,aAAaK,WAAW,GAAG"}

package/lib/components/SkeletonItem/SkeletonItem.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/SkeletonItem/SkeletonItem.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type SkeletonItemSlots = {\n root: Slot<'div', 'span'>;\n};\n\n/*\n Sizes for the SkeletonItem\n /\nexport type SkeletonItemSize = 8 \| 12 \| 16 \| 20 \| 24 \| 28 \| 32 \| 36 \| 40 \| 48 \| 56 \| 64 \| 72 \| 96 \| 120 \| 128;\n\n/\n SkeletonItem Props\n /\nexport type SkeletonItemProps = ComponentProps<SkeletonItemSlots> & {\n /\n Sets the animation of the SkeletonItem\n * @default wave\n /\n animation?: 'wave' \| 'pulse';\n\n /\n Sets the appearance of the SkeletonItem\n * @default opaque\n /\n appearance?: 'opaque' \| 'translucent';\n\n /\n Sets the size of the SkeletonItem in pixels.\n * Size is restricted to a limited set of values recommended for most uses(see SkeletonItemSize).\n * To set a non-supported size, set `width` and `height` to override the rendered size.\n * @default 16\n /\n size?: SkeletonItemSize;\n\n /\n Sets the shape of the SkeletonItem.\n * @default rectangle\n /\n shape?: 'circle' \| 'square' \| 'rectangle';\n};\n\n/\n State used in rendering SkeletonItem\n */\nexport type SkeletonItemState = ComponentState<SkeletonItemSlots> &\n Required<Pick<SkeletonItemProps, 'animation' \| 'appearance' \| 'size' \| 'shape'>>;\n"],"names":[],"~~rangeMappings":";;","~~mappings":"AA0CA;;CAEC,GACD,WACmF"}
1	+ {"version":3,"sources":["../src/components/SkeletonItem/SkeletonItem.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type SkeletonItemSlots = {\n root: Slot<'div', 'span'>;\n};\n\n/*\n Sizes for the SkeletonItem\n /\nexport type SkeletonItemSize = 8 \| 12 \| 16 \| 20 \| 24 \| 28 \| 32 \| 36 \| 40 \| 48 \| 56 \| 64 \| 72 \| 96 \| 120 \| 128;\n\n/\n SkeletonItem Props\n /\nexport type SkeletonItemProps = ComponentProps<SkeletonItemSlots> & {\n /\n Sets the animation of the SkeletonItem\n * @default wave\n /\n animation?: 'wave' \| 'pulse';\n\n /\n Sets the appearance of the SkeletonItem\n * @default opaque\n /\n appearance?: 'opaque' \| 'translucent';\n\n /\n Sets the size of the SkeletonItem in pixels.\n * Size is restricted to a limited set of values recommended for most uses(see SkeletonItemSize).\n * To set a non-supported size, set `width` and `height` to override the rendered size.\n * @default 16\n /\n size?: SkeletonItemSize;\n\n /\n Sets the shape of the SkeletonItem.\n * @default rectangle\n /\n shape?: 'circle' \| 'square' \| 'rectangle';\n};\n\n/\n State used in rendering SkeletonItem\n */\nexport type SkeletonItemState = ComponentState<SkeletonItemSlots> &\n Required<Pick<SkeletonItemProps, 'animation' \| 'appearance' \| 'size' \| 'shape'>>;\n"],"names":[],"mappings":"AA0CA;;CAEC,GACD,WACmF"}

package/lib/components/SkeletonItem/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/SkeletonItem/index.ts"],"sourcesContent":["export { SkeletonItem } from './SkeletonItem';\nexport type { SkeletonItemProps, SkeletonItemSize, SkeletonItemSlots, SkeletonItemState } from './SkeletonItem.types';\nexport { renderSkeletonItem_unstable } from './renderSkeletonItem';\nexport { useSkeletonItem_unstable } from './useSkeletonItem';\nexport { skeletonItemClassNames, useSkeletonItemStyles_unstable } from './useSkeletonItemStyles.styles';\n"],"names":["SkeletonItem","renderSkeletonItem_unstable","useSkeletonItem_unstable","skeletonItemClassNames","useSkeletonItemStyles_unstable"],"~~rangeMappings":";;;","~~mappings":"AAAA,SAASA,YAAY,QAAQ,iBAAiB;AAE9C,SAASC,2BAA2B,QAAQ,uBAAuB;AACnE,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,sBAAsB,EAAEC,8BAA8B,QAAQ,iCAAiC"}
1	+ {"version":3,"sources":["../src/components/SkeletonItem/index.ts"],"sourcesContent":["export { SkeletonItem } from './SkeletonItem';\nexport type { SkeletonItemProps, SkeletonItemSize, SkeletonItemSlots, SkeletonItemState } from './SkeletonItem.types';\nexport { renderSkeletonItem_unstable } from './renderSkeletonItem';\nexport { useSkeletonItem_unstable } from './useSkeletonItem';\nexport { skeletonItemClassNames, useSkeletonItemStyles_unstable } from './useSkeletonItemStyles.styles';\n"],"names":["SkeletonItem","renderSkeletonItem_unstable","useSkeletonItem_unstable","skeletonItemClassNames","useSkeletonItemStyles_unstable"],"mappings":"AAAA,SAASA,YAAY,QAAQ,iBAAiB;AAE9C,SAASC,2BAA2B,QAAQ,uBAAuB;AACnE,SAASC,wBAAwB,QAAQ,oBAAoB;AAC7D,SAASC,sBAAsB,EAAEC,8BAA8B,QAAQ,iCAAiC"}

package/lib/components/SkeletonItem/renderSkeletonItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/SkeletonItem/renderSkeletonItem.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { SkeletonItemState, SkeletonItemSlots } from './SkeletonItem.types';\n\n/\n Render the final JSX of SkeletonItem\n */\nexport const renderSkeletonItem_unstable = (state: SkeletonItemState) => {\n assertSlots<SkeletonItemSlots>(state);\n\n return <state.root />;\n};\n"],"names":["assertSlots","renderSkeletonItem_unstable","state","root"],"~~rangeMappings":";;;;;;;","~~mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAGxD;;CAEC,GACD,OAAO,MAAMC,8BAA8B,CAACC;IAC1CF,YAA+BE;IAE/B,qBAAO,KAACA,MAAMC,IAAI;AACpB,EAAE"}
1	+ {"version":3,"sources":["../src/components/SkeletonItem/renderSkeletonItem.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { SkeletonItemState, SkeletonItemSlots } from './SkeletonItem.types';\n\n/\n Render the final JSX of SkeletonItem\n */\nexport const renderSkeletonItem_unstable = (state: SkeletonItemState) => {\n assertSlots<SkeletonItemSlots>(state);\n\n return <state.root />;\n};\n"],"names":["assertSlots","renderSkeletonItem_unstable","state","root"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAGxD;;CAEC,GACD,OAAO,MAAMC,8BAA8B,CAACC;IAC1CF,YAA+BE;IAE/B,qBAAO,KAACA,MAAMC,IAAI;AACpB,EAAE"}

package/lib/components/SkeletonItem/useSkeletonItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/SkeletonItem/useSkeletonItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { useSkeletonContext } from '../../contexts/SkeletonContext';\nimport type { SkeletonItemProps, SkeletonItemState } 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 { animation: contextAnimation, appearance: contextAppearance } = useSkeletonContext();\n const {\n animation = contextAnimation ?? 'wave',\n appearance = contextAppearance ?? 'opaque',\n size = 16,\n shape = 'rectangle',\n } = props;\n\n const root = slot.always(\n getIntrinsicElementProps('div', {\n // FIXME:\n // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n ref: ref as React.Ref<HTMLDivElement>,\n ...props,\n }),\n { elementType: 'div' },\n );\n return { appearance, animation, size, shape, components: { root: 'div' }, root };\n};\n"],"names":["React","getIntrinsicElementProps","slot","useSkeletonContext","useSkeletonItem_unstable","props","ref","animation","contextAnimation","appearance","contextAppearance","size","shape","root","always","elementType","components"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAC3E,SAASC,kBAAkB,QAAQ,iCAAiC;AAGpE;;;;;;;;CAQC,GACD,OAAO,MAAMC,2BAA2B,CAACC,OAA0BC;IACjE,MAAM,EAAEC,WAAWC,gBAAgB,EAAEC,YAAYC,iBAAiB,EAAE,GAAGP;IACvE,MAAM,EACJI,YAAYC,6BAAAA,8BAAAA,mBAAoB,MAAM,EACtCC,aAAaC,8BAAAA,+BAAAA,oBAAqB,QAAQ,EAC1CC,OAAO,EAAE,EACTC,QAAQ,WAAW,EACpB,GAAGP;IAEJ,MAAMQ,OAAOX,KAAKY,MAAM,CACtBb,yBAAyB,OAAO;QAC9B,SAAS;QACT,4EAA4E;QAC5E,4FAA4F;QAC5FK,KAAKA;QACL,GAAGD,KAAK;IACV,IACA;QAAEU,aAAa;IAAM;IAEvB,OAAO;QAAEN;QAAYF;QAAWI;QAAMC;QAAOI,YAAY;YAAEH,MAAM;QAAM;QAAGA;IAAK;AACjF,EAAE"}
1	+ {"version":3,"sources":["../src/components/SkeletonItem/useSkeletonItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { useSkeletonContext } from '../../contexts/SkeletonContext';\nimport type { SkeletonItemProps, SkeletonItemState } 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 { animation: contextAnimation, appearance: contextAppearance } = useSkeletonContext();\n const {\n animation = contextAnimation ?? 'wave',\n appearance = contextAppearance ?? 'opaque',\n size = 16,\n shape = 'rectangle',\n } = props;\n\n const root = slot.always(\n getIntrinsicElementProps('div', {\n // FIXME:\n // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n ref: ref as React.Ref<HTMLDivElement>,\n ...props,\n }),\n { elementType: 'div' },\n );\n return { appearance, animation, size, shape, components: { root: 'div' }, root };\n};\n"],"names":["React","getIntrinsicElementProps","slot","useSkeletonContext","useSkeletonItem_unstable","props","ref","animation","contextAnimation","appearance","contextAppearance","size","shape","root","always","elementType","components"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAC3E,SAASC,kBAAkB,QAAQ,iCAAiC;AAGpE;;;;;;;;CAQC,GACD,OAAO,MAAMC,2BAA2B,CAACC,OAA0BC;IACjE,MAAM,EAAEC,WAAWC,gBAAgB,EAAEC,YAAYC,iBAAiB,EAAE,GAAGP;IACvE,MAAM,EACJI,YAAYC,6BAAAA,8BAAAA,mBAAoB,MAAM,EACtCC,aAAaC,8BAAAA,+BAAAA,oBAAqB,QAAQ,EAC1CC,OAAO,EAAE,EACTC,QAAQ,WAAW,EACpB,GAAGP;IAEJ,MAAMQ,OAAOX,KAAKY,MAAM,CACtBb,yBAAyB,OAAO;QAC9B,SAAS;QACT,4EAA4E;QAC5E,4FAA4F;QAC5FK,KAAKA;QACL,GAAGD,KAAK;IACV,IACA;QAAEU,aAAa;IAAM;IAEvB,OAAO;QAAEN;QAAYF;QAAWI;QAAMC;QAAOI,YAAY;YAAEH,MAAM;QAAM;QAAGA;IAAK;AACjF,EAAE"}

package/lib/components/SkeletonItem/useSkeletonItemStyles.styles.raw.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/SkeletonItem/useSkeletonItemStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SkeletonItemSlots, SkeletonItemState } from './SkeletonItem.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\n\nexport const skeletonItemClassNames: SlotClassNames<SkeletonItemSlots> = {\n root: 'fui-SkeletonItem',\n};\n\nconst skeletonWaveAnimation = {\n to: {\n transform: 'translate(100%)',\n },\n};\n\nconst skeletonPulseAnimation = {\n '0%': {\n opacity: '1',\n },\n '50%': {\n opacity: '0.4',\n },\n '100%': {\n opacity: '1',\n },\n};\n\n/*\n Styles for the root slot\n /\nconst useStyles = makeStyles({\n root: {\n position: 'relative',\n overflow: 'hidden',\n\n '::after': {\n content: '\"\"',\n display: 'block',\n position: 'absolute',\n inset: '0',\n animationIterationCount: 'infinite',\n animationDuration: '3s',\n animationTimingFunction: 'ease-in-out',\n '@media screen and (prefers-reduced-motion: reduce)': {\n animationDuration: '0.01ms',\n animationIterationCount: '1',\n },\n },\n },\n wave: {\n backgroundColor: tokens.colorNeutralStencil1,\n\n '::after': {\n animationName: skeletonWaveAnimation,\n backgroundImage: `linear-gradient(\n to right,\n ${tokens.colorNeutralStencil1} 0%,\n ${tokens.colorNeutralStencil2} 50%,\n ${tokens.colorNeutralStencil1} 100%)`,\n transform: 'translate(-100%)',\n\n '@media screen and (forced-colors: active)': {\n backgroundColor: 'WindowText',\n },\n },\n },\n pulse: {\n '::after': {\n animationName: skeletonPulseAnimation,\n animationDuration: '1s',\n backgroundColor: tokens.colorNeutralStencil1,\n },\n },\n translucent: {\n backgroundColor: tokens.colorNeutralStencil1Alpha,\n\n '::after': {\n backgroundImage: `linear-gradient(\n to right,\n transparent 0%,\n ${tokens.colorNeutralStencil1Alpha} 50%,\n transparent 100%)`,\n },\n },\n translucentPulse: {\n backgroundColor: 'none',\n\n '::after': {\n backgroundColor: tokens.colorNeutralStencil1Alpha,\n },\n },\n blockStyling: {\n display: 'block',\n },\n});\n\nconst useRectangleStyles = makeStyles({\n root: {\n width: '100%',\n borderRadius: '4px',\n },\n 8: { height: '8px' },\n 12: { height: '12px' },\n 16: { height: '16px' },\n 20: { height: '20px' },\n 24: { height: '24px' },\n 28: { height: '28px' },\n 32: { height: '32px' },\n 36: { height: '36px' },\n 40: { height: '40px' },\n 48: { height: '48px' },\n 56: { height: '56px' },\n 64: { height: '64px' },\n 72: { height: '72px' },\n 96: { height: '96px' },\n 120: { height: '120px' },\n 128: { height: '128px' },\n});\n\nconst useSizeStyles = makeStyles({\n 8: { width: '8px', height: '8px' },\n 12: { width: '12px', height: '12px' },\n 16: { width: '16px', height: '16px' },\n 20: { width: '20px', height: '20px' },\n 24: { width: '24px', height: '24px' },\n 28: { width: '28px', height: '28px' },\n 32: { width: '32px', height: '32px' },\n 36: { width: '36px', height: '36px' },\n 40: { width: '40px', height: '40px' },\n 48: { width: '48px', height: '48px' },\n 56: { width: '56px', height: '56px' },\n 64: { width: '64px', height: '64px' },\n 72: { width: '72px', height: '72px' },\n 96: { width: '96px', height: '96px' },\n 120: { width: '120px', height: '120px' },\n 128: { width: '128px', height: '128px' },\n});\n\nconst useCircleSizeStyles = makeStyles({\n root: {\n borderRadius: '50%',\n },\n});\n\n/\n Apply styling to the SkeletonItem slots based on the state\n */\nexport const useSkeletonItemStyles_unstable = (state: SkeletonItemState): SkeletonItemState => {\n 'use no memo';\n\n const { animation, appearance, size, shape } = state;\n\n const rootStyles = useStyles();\n const rectStyles = useRectangleStyles();\n const sizeStyles = useSizeStyles();\n const circleStyles = useCircleSizeStyles();\n\n state.root.className = mergeClasses(\n skeletonItemClassNames.root,\n rootStyles.root,\n state.root.as === 'span' && rootStyles.blockStyling,\n animation === 'wave' && rootStyles.wave,\n animation === 'pulse' && rootStyles.pulse,\n appearance === 'translucent' && rootStyles.translucent,\n animation === 'pulse' && appearance === 'translucent' && rootStyles.translucentPulse,\n shape === 'rectangle' && rectStyles.root,\n shape === 'rectangle' && rectStyles[size],\n shape === 'square' && sizeStyles[size],\n shape === 'circle' && circleStyles.root,\n shape === 'circle' && sizeStyles[size],\n state.root.className,\n );\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","skeletonItemClassNames","root","skeletonWaveAnimation","to","transform","skeletonPulseAnimation","opacity","useStyles","position","overflow","content","display","inset","animationIterationCount","animationDuration","animationTimingFunction","wave","backgroundColor","colorNeutralStencil1","animationName","backgroundImage","colorNeutralStencil2","pulse","translucent","colorNeutralStencil1Alpha","translucentPulse","blockStyling","useRectangleStyles","width","borderRadius","height","useSizeStyles","useCircleSizeStyles","useSkeletonItemStyles_unstable","state","animation","appearance","size","shape","rootStyles","rectStyles","sizeStyles","circleStyles","className","as"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
1	+ {"version":3,"sources":["../src/components/SkeletonItem/useSkeletonItemStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SkeletonItemSlots, SkeletonItemState } from './SkeletonItem.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\n\nexport const skeletonItemClassNames: SlotClassNames<SkeletonItemSlots> = {\n root: 'fui-SkeletonItem',\n};\n\nconst skeletonWaveAnimation = {\n to: {\n transform: 'translate(100%)',\n },\n};\n\nconst skeletonPulseAnimation = {\n '0%': {\n opacity: '1',\n },\n '50%': {\n opacity: '0.4',\n },\n '100%': {\n opacity: '1',\n },\n};\n\n/*\n Styles for the root slot\n /\nconst useStyles = makeStyles({\n root: {\n position: 'relative',\n overflow: 'hidden',\n\n '::after': {\n content: '\"\"',\n display: 'block',\n position: 'absolute',\n inset: '0',\n animationIterationCount: 'infinite',\n animationDuration: '3s',\n animationTimingFunction: 'ease-in-out',\n '@media screen and (prefers-reduced-motion: reduce)': {\n animationDuration: '0.01ms',\n animationIterationCount: '1',\n },\n },\n },\n wave: {\n backgroundColor: tokens.colorNeutralStencil1,\n\n '::after': {\n animationName: skeletonWaveAnimation,\n backgroundImage: `linear-gradient(\n to right,\n ${tokens.colorNeutralStencil1} 0%,\n ${tokens.colorNeutralStencil2} 50%,\n ${tokens.colorNeutralStencil1} 100%)`,\n transform: 'translate(-100%)',\n\n '@media screen and (forced-colors: active)': {\n backgroundColor: 'WindowText',\n },\n },\n },\n pulse: {\n '::after': {\n animationName: skeletonPulseAnimation,\n animationDuration: '1s',\n backgroundColor: tokens.colorNeutralStencil1,\n },\n },\n translucent: {\n backgroundColor: tokens.colorNeutralStencil1Alpha,\n\n '::after': {\n backgroundImage: `linear-gradient(\n to right,\n transparent 0%,\n ${tokens.colorNeutralStencil1Alpha} 50%,\n transparent 100%)`,\n },\n },\n translucentPulse: {\n backgroundColor: 'none',\n\n '::after': {\n backgroundColor: tokens.colorNeutralStencil1Alpha,\n },\n },\n blockStyling: {\n display: 'block',\n },\n});\n\nconst useRectangleStyles = makeStyles({\n root: {\n width: '100%',\n borderRadius: '4px',\n },\n 8: { height: '8px' },\n 12: { height: '12px' },\n 16: { height: '16px' },\n 20: { height: '20px' },\n 24: { height: '24px' },\n 28: { height: '28px' },\n 32: { height: '32px' },\n 36: { height: '36px' },\n 40: { height: '40px' },\n 48: { height: '48px' },\n 56: { height: '56px' },\n 64: { height: '64px' },\n 72: { height: '72px' },\n 96: { height: '96px' },\n 120: { height: '120px' },\n 128: { height: '128px' },\n});\n\nconst useSizeStyles = makeStyles({\n 8: { width: '8px', height: '8px' },\n 12: { width: '12px', height: '12px' },\n 16: { width: '16px', height: '16px' },\n 20: { width: '20px', height: '20px' },\n 24: { width: '24px', height: '24px' },\n 28: { width: '28px', height: '28px' },\n 32: { width: '32px', height: '32px' },\n 36: { width: '36px', height: '36px' },\n 40: { width: '40px', height: '40px' },\n 48: { width: '48px', height: '48px' },\n 56: { width: '56px', height: '56px' },\n 64: { width: '64px', height: '64px' },\n 72: { width: '72px', height: '72px' },\n 96: { width: '96px', height: '96px' },\n 120: { width: '120px', height: '120px' },\n 128: { width: '128px', height: '128px' },\n});\n\nconst useCircleSizeStyles = makeStyles({\n root: {\n borderRadius: '50%',\n },\n});\n\n/\n Apply styling to the SkeletonItem slots based on the state\n */\nexport const useSkeletonItemStyles_unstable = (state: SkeletonItemState): SkeletonItemState => {\n 'use no memo';\n\n const { animation, appearance, size, shape } = state;\n\n const rootStyles = useStyles();\n const rectStyles = useRectangleStyles();\n const sizeStyles = useSizeStyles();\n const circleStyles = useCircleSizeStyles();\n\n state.root.className = mergeClasses(\n skeletonItemClassNames.root,\n rootStyles.root,\n state.root.as === 'span' && rootStyles.blockStyling,\n animation === 'wave' && rootStyles.wave,\n animation === 'pulse' && rootStyles.pulse,\n appearance === 'translucent' && rootStyles.translucent,\n animation === 'pulse' && appearance === 'translucent' && rootStyles.translucentPulse,\n shape === 'rectangle' && rectStyles.root,\n shape === 'rectangle' && rectStyles[size],\n shape === 'square' && sizeStyles[size],\n shape === 'circle' && circleStyles.root,\n shape === 'circle' && sizeStyles[size],\n state.root.className,\n );\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","skeletonItemClassNames","root","skeletonWaveAnimation","to","transform","skeletonPulseAnimation","opacity","useStyles","position","overflow","content","display","inset","animationIterationCount","animationDuration","animationTimingFunction","wave","backgroundColor","colorNeutralStencil1","animationName","backgroundImage","colorNeutralStencil2","pulse","translucent","colorNeutralStencil1Alpha","translucentPulse","blockStyling","useRectangleStyles","width","borderRadius","height","useSizeStyles","useCircleSizeStyles","useSkeletonItemStyles_unstable","state","animation","appearance","size","shape","rootStyles","rectStyles","sizeStyles","circleStyles","className","as"],"mappings":"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"}

package/lib/contexts/SkeletonContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/contexts/SkeletonContext.ts"],"sourcesContent":["import * as React from 'react';\n\nconst SkeletonContext = React.createContext<SkeletonContextValue \| undefined>(undefined);\n\nexport interface SkeletonContextValue {\n animation?: 'wave' \| 'pulse';\n appearance?: 'opaque' \| 'translucent';\n}\n\nconst skeletonContextDefaultValue: SkeletonContextValue = {};\n\nexport const SkeletonContextProvider = SkeletonContext.Provider;\n\nexport const useSkeletonContext = () => React.useContext(SkeletonContext) ?? skeletonContextDefaultValue;\n"],"names":["React","SkeletonContext","createContext","undefined","skeletonContextDefaultValue","SkeletonContextProvider","Provider","useSkeletonContext","useContext"],"~~rangeMappings":";;;;;;;","~~mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,MAAMC,kBAAkBD,MAAME,aAAa,CAAmCC;AAO9E,MAAMC,8BAAoD,CAAC;AAE3D,OAAO,MAAMC,0BAA0BJ,gBAAgBK,QAAQ,CAAC;AAEhE,OAAO,MAAMC,qBAAqB;QAAMP;WAAAA,CAAAA,oBAAAA,MAAMQ,UAAU,CAACP,8BAAjBD,+BAAAA,oBAAqCI;~~AAA0B,EAAE~~"}
1	+ {"version":3,"sources":["../src/contexts/SkeletonContext.ts"],"sourcesContent":["import * as React from 'react';\n\nconst SkeletonContext = React.createContext<SkeletonContextValue \| undefined>(undefined);\n\nexport interface SkeletonContextValue {\n animation?: 'wave' \| 'pulse';\n appearance?: 'opaque' \| 'translucent';\n}\n\nconst skeletonContextDefaultValue: SkeletonContextValue = {};\n\nexport const SkeletonContextProvider = SkeletonContext.Provider;\n\nexport const useSkeletonContext = () => React.useContext(SkeletonContext) ?? skeletonContextDefaultValue;\n"],"names":["React","SkeletonContext","createContext","undefined","skeletonContextDefaultValue","SkeletonContextProvider","Provider","useSkeletonContext","useContext"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,MAAMC,kBAAkBD,MAAME,aAAa,CAAmCC;AAO9E,MAAMC,8BAAoD,CAAC;AAE3D,OAAO,MAAMC,0BAA0BJ,gBAAgBK,QAAQ,CAAC;AAEhE,OAAO,MAAMC,qBAAqB;QAAMP;WAAAA,CAAAA,oBAAAA,MAAMQ,UAAU,CAACP,8BAAjBD,+BAAAA,oBAAqCI;EAA4B"}

package/lib/contexts/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/contexts/index.ts"],"sourcesContent":["export type { SkeletonContextValue } from './SkeletonContext';\nexport { SkeletonContextProvider, useSkeletonContext } from './SkeletonContext';\n"],"names":["SkeletonContextProvider","useSkeletonContext"],"~~rangeMappings":"","~~mappings":"AACA,SAASA,uBAAuB,EAAEC,kBAAkB,QAAQ,oBAAoB"}
1	+ {"version":3,"sources":["../src/contexts/index.ts"],"sourcesContent":["export type { SkeletonContextValue } from './SkeletonContext';\nexport { SkeletonContextProvider, useSkeletonContext } from './SkeletonContext';\n"],"names":["SkeletonContextProvider","useSkeletonContext"],"mappings":"AACA,SAASA,uBAAuB,EAAEC,kBAAkB,QAAQ,oBAAoB"}

package/lib/index.js.map CHANGED Viewed

	@@ -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} from './Skeleton';\nexport type { SkeletonProps, SkeletonSlots, SkeletonState } from './Skeleton';\nexport {\n SkeletonItem,\n renderSkeletonItem_unstable,\n skeletonItemClassNames,\n useSkeletonItemStyles_unstable,\n useSkeletonItem_unstable,\n} from './SkeletonItem';\nexport type { SkeletonItemProps, SkeletonItemSlots, SkeletonItemState } from './SkeletonItem';\nexport { SkeletonContextProvider, useSkeletonContext } from './contexts/index';\nexport type { SkeletonContextValue } from './contexts/index';\n"],"names":["Skeleton","renderSkeleton_unstable","skeletonClassNames","useSkeletonStyles_unstable","useSkeleton_unstable","SkeletonItem","renderSkeletonItem_unstable","skeletonItemClassNames","useSkeletonItemStyles_unstable","useSkeletonItem_unstable","SkeletonContextProvider","useSkeletonContext"],"~~rangeMappings":";;","~~mappings":"AAAA,SACEA,QAAQ,EACRC,uBAAuB,EACvBC,kBAAkB,EAClBC,0BAA0B,EAC1BC,oBAAoB,QACf,aAAa;AAEpB,SACEC,YAAY,EACZC,2BAA2B,EAC3BC,sBAAsB,EACtBC,8BAA8B,EAC9BC,wBAAwB,QACnB,iBAAiB;AAExB,SAASC,uBAAuB,EAAEC,kBAAkB,QAAQ,mBAAmB"}
1	+ {"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n Skeleton,\n renderSkeleton_unstable,\n skeletonClassNames,\n useSkeletonStyles_unstable,\n useSkeleton_unstable,\n} from './Skeleton';\nexport type { SkeletonProps, SkeletonSlots, SkeletonState } from './Skeleton';\nexport {\n SkeletonItem,\n renderSkeletonItem_unstable,\n skeletonItemClassNames,\n useSkeletonItemStyles_unstable,\n useSkeletonItem_unstable,\n} from './SkeletonItem';\nexport type { SkeletonItemProps, SkeletonItemSlots, SkeletonItemState } from './SkeletonItem';\nexport { SkeletonContextProvider, useSkeletonContext } from './contexts/index';\nexport type { SkeletonContextValue } from './contexts/index';\n"],"names":["Skeleton","renderSkeleton_unstable","skeletonClassNames","useSkeletonStyles_unstable","useSkeleton_unstable","SkeletonItem","renderSkeletonItem_unstable","skeletonItemClassNames","useSkeletonItemStyles_unstable","useSkeletonItem_unstable","SkeletonContextProvider","useSkeletonContext"],"mappings":"AAAA,SACEA,QAAQ,EACRC,uBAAuB,EACvBC,kBAAkB,EAClBC,0BAA0B,EAC1BC,oBAAoB,QACf,aAAa;AAEpB,SACEC,YAAY,EACZC,2BAA2B,EAC3BC,sBAAsB,EACtBC,8BAA8B,EAC9BC,wBAAwB,QACnB,iBAAiB;AAExB,SAASC,uBAAuB,EAAEC,kBAAkB,QAAQ,mBAAmB"}

package/lib-commonjs/Skeleton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/Skeleton.ts"],"sourcesContent":["export type { SkeletonContextValues, SkeletonProps, SkeletonSlots, SkeletonState } from './components/Skeleton/index';\nexport {\n Skeleton,\n renderSkeleton_unstable,\n skeletonClassNames,\n useSkeletonContextValues,\n useSkeletonStyles_unstable,\n useSkeleton_unstable,\n} from './components/Skeleton/index';\n"],"names":["Skeleton","renderSkeleton_unstable","skeletonClassNames","useSkeletonContextValues","useSkeletonStyles_unstable","useSkeleton_unstable"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":"~~;;;;;;;;;;;IAEEA~~,~~QAAQ;eAARA,~~eAAQ~~;;IACRC~~,~~uBAAuB;eAAvBA,~~8BAAuB~~;;IACvBC~~,~~kBAAkB;eAAlBA,~~yBAAkB~~;;IAClBC,wBAAwB;eAAxBA~~,+BAAwB~~;;IACxBC~~,~~0BAA0B;eAA1BA,~~iCAA0B~~;;IAC1BC~~,~~oBAAoB;eAApBA,~~2BAAoB;;;uBACf"}
1	+ {"version":3,"sources":["../src/Skeleton.ts"],"sourcesContent":["export type { SkeletonContextValues, SkeletonProps, SkeletonSlots, SkeletonState } from './components/Skeleton/index';\nexport {\n Skeleton,\n renderSkeleton_unstable,\n skeletonClassNames,\n useSkeletonContextValues,\n useSkeletonStyles_unstable,\n useSkeleton_unstable,\n} from './components/Skeleton/index';\n"],"names":["Skeleton","renderSkeleton_unstable","skeletonClassNames","useSkeletonContextValues","useSkeletonStyles_unstable","useSkeleton_unstable"],"mappings":";;;;;;;;;;;;eAEEA,eAAQ;;;eACRC,8BAAuB;;;eACvBC,yBAAkB;;;eAClBC,+BAAwB;;;eACxBC,iCAA0B;;;eAC1BC,2BAAoB;;;uBACf,8BAA8B"}

package/lib-commonjs/SkeletonItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/SkeletonItem.ts"],"sourcesContent":["export type {\n SkeletonItemProps,\n SkeletonItemSize,\n SkeletonItemSlots,\n SkeletonItemState,\n} from './components/SkeletonItem/index';\nexport {\n SkeletonItem,\n renderSkeletonItem_unstable,\n skeletonItemClassNames,\n useSkeletonItemStyles_unstable,\n useSkeletonItem_unstable,\n} from './components/SkeletonItem/index';\n"],"names":["SkeletonItem","renderSkeletonItem_unstable","skeletonItemClassNames","useSkeletonItemStyles_unstable","useSkeletonItem_unstable"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":"~~;;;;;;;;;;;IAOEA~~,~~YAAY;eAAZA,~~mBAAY~~;;IACZC~~,~~2BAA2B;eAA3BA,~~kCAA2B~~;;IAC3BC~~,~~sBAAsB;eAAtBA,~~6BAAsB~~;;IACtBC~~,~~8BAA8B;eAA9BA,~~qCAA8B~~;;IAC9BC,wBAAwB;eAAxBA~~,+BAAwB;;;uBACnB"}
1	+ {"version":3,"sources":["../src/SkeletonItem.ts"],"sourcesContent":["export type {\n SkeletonItemProps,\n SkeletonItemSize,\n SkeletonItemSlots,\n SkeletonItemState,\n} from './components/SkeletonItem/index';\nexport {\n SkeletonItem,\n renderSkeletonItem_unstable,\n skeletonItemClassNames,\n useSkeletonItemStyles_unstable,\n useSkeletonItem_unstable,\n} from './components/SkeletonItem/index';\n"],"names":["SkeletonItem","renderSkeletonItem_unstable","skeletonItemClassNames","useSkeletonItemStyles_unstable","useSkeletonItem_unstable"],"mappings":";;;;;;;;;;;;eAOEA,mBAAY;;;eACZC,kCAA2B;;;eAC3BC,6BAAsB;;;eACtBC,qCAA8B;;;eAC9BC,+BAAwB;;;uBACnB,kCAAkC"}

package/lib-commonjs/components/Skeleton/Skeleton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/Skeleton/Skeleton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useSkeleton_unstable } from './useSkeleton';\nimport { renderSkeleton_unstable } from './renderSkeleton';\nimport { useSkeletonStyles_unstable } from './useSkeletonStyles.styles';\nimport { useSkeletonContextValues } from './useSkeletonContextValues';\nimport type { SkeletonProps } from './Skeleton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/*\n Skeleton component - TODO: add more docs\n */\nexport const Skeleton: ForwardRefComponent<SkeletonProps> = React.forwardRef((props, ref) => {\n const state = useSkeleton_unstable(props, ref);\n const contextValues = useSkeletonContextValues(state);\n\n useSkeletonStyles_unstable(state);\n useCustomStyleHook_unstable('useSkeletonStyles_unstable')(state);\n\n return renderSkeleton_unstable(state, contextValues);\n});\n\nSkeleton.displayName = 'Skeleton';\n"],"names":["~~Skeleton~~","~~React~~","~~forwardRef~~","~~props~~","~~ref~~","~~state~~","~~useSkeleton_unstable~~","~~contextValues~~","~~useSkeletonContextValues~~","~~useSkeletonStyles_unstable~~","~~useCustomStyleHook_unstable~~","~~renderSkeleton_unstable~~","displayName"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;+~~BAYaA;;;eAAAA;;;;~~iEAZU;~~6BACc~~;~~gCACG~~;~~yCACG~~;~~0CACF~~;~~qCAGG~~;~~AAKrC~~,~~MAAMA~~,WAAAA,~~WAAAA,~~GAA+CC,~~OAAMC~~,UAAU,CAAC,CAACC,OAAOC;IACnF,MAAMC,~~QAAQC~~,~~IAAAA,~~iCAAAA,~~EAAqBH~~,OAAOC;IAC1C,~~MAAMG~~,~~gBAAgBC~~,~~IAAAA,~~kDAAAA,~~EAAyBH~~;~~IAE~~/CI,~~IAAAA,~~mDAAAA,~~EAA2BJ~~;~~IAC3BK~~,~~IAAAA,~~gDAAAA,EAA4B,~~8BAA8BL~~;IAE1D,~~OAAOM~~,~~IAAAA,~~uCAAAA,~~EAAwBN~~,~~OAAOE~~;AACxC;~~AAEAP~~,~~SAASY~~,WAAW,GAAG"}
1	+ {"version":3,"sources":["../src/components/Skeleton/Skeleton.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useSkeleton_unstable } from './useSkeleton';\nimport { renderSkeleton_unstable } from './renderSkeleton';\nimport { useSkeletonStyles_unstable } from './useSkeletonStyles.styles';\nimport { useSkeletonContextValues } from './useSkeletonContextValues';\nimport type { SkeletonProps } from './Skeleton.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/*\n Skeleton component - TODO: add more docs\n */\nexport const Skeleton: ForwardRefComponent<SkeletonProps> = React.forwardRef((props, ref) => {\n const state = useSkeleton_unstable(props, ref);\n const contextValues = useSkeletonContextValues(state);\n\n useSkeletonStyles_unstable(state);\n useCustomStyleHook_unstable('useSkeletonStyles_unstable')(state);\n\n return renderSkeleton_unstable(state, contextValues);\n});\n\nSkeleton.displayName = 'Skeleton';\n"],"names":["React","useSkeleton_unstable","renderSkeleton_unstable","useSkeletonStyles_unstable","useSkeletonContextValues","useCustomStyleHook_unstable","Skeleton","forwardRef","props","ref","state","contextValues","displayName"],"mappings":";;;;+BAYaM;;;;;;;iEAZU,QAAQ;6BACM,gBAAgB;gCACb,mBAAmB;yCAChB,6BAA6B;0CAC/B,6BAA6B;qCAG1B,kCAAkC;AAKvE,iBAAMA,WAAAA,GAA+CN,OAAMO,UAAU,CAAC,CAACC,OAAOC;IACnF,MAAMC,YAAQT,iCAAAA,EAAqBO,OAAOC;IAC1C,MAAME,oBAAgBP,kDAAAA,EAAyBM;QAE/CP,mDAAAA,EAA2BO;QAC3BL,gDAAAA,EAA4B,8BAA8BK;IAE1D,WAAOR,uCAAAA,EAAwBQ,OAAOC;AACxC,GAAG;AAEHL,SAASM,WAAW,GAAG"}

package/lib-commonjs/components/Skeleton/Skeleton.types.js.map CHANGED Viewed

	@@ -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 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\nexport type SkeletonContextValues = {\n skeletonGroup: SkeletonContextValue;\n};\n\n/\n State used in rendering Skeleton\n */\nexport type SkeletonState = ComponentState<SkeletonSlots> & Required<Pick<SkeletonProps, 'animation' \| 'appearance'>>;\n"],"names":[],"~~rangeMappings":";;","~~mappings":"AAuCA;;CAEC"}
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 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\nexport type SkeletonContextValues = {\n skeletonGroup: SkeletonContextValue;\n};\n\n/\n State used in rendering Skeleton\n */\nexport type SkeletonState = ComponentState<SkeletonSlots> & Required<Pick<SkeletonProps, 'animation' \| 'appearance'>>;\n"],"names":[],"mappings":"AAuCA;;CAEC,GACD,WAAsH"}

package/lib-commonjs/components/Skeleton/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/Skeleton/index.ts"],"sourcesContent":["export { Skeleton } from './Skeleton';\nexport type { SkeletonContextValues, SkeletonProps, SkeletonSlots, SkeletonState } from './Skeleton.types';\nexport { renderSkeleton_unstable } from './renderSkeleton';\nexport { useSkeleton_unstable } from './useSkeleton';\nexport { useSkeletonContextValues } from './useSkeletonContextValues';\nexport { skeletonClassNames, useSkeletonStyles_unstable } from './useSkeletonStyles.styles';\n"],"names":["Skeleton","renderSkeleton_unstable","~~skeletonClassNames~~","useSkeletonContextValues","~~useSkeletonStyles_unstable~~","~~useSkeleton_unstable~~"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":"~~;;;;;;;;;;;IAASA~~,~~QAAQ;eAARA,~~kBAAQ~~;;IAERC~~,~~uBAAuB;eAAvBA,~~uCAAuB~~;;IAGvBC~~,~~kBAAkB;eAAlBA,~~2CAAkB~~;;IADlBC~~,~~wBAAwB;eAAxBA,~~kDAAwB~~;;IACJC~~,~~0BAA0B;eAA1BA,~~mDAA0B~~;;IAF9CC~~,~~oBAAoB;eAApBA,~~iCAAoB;;;0BAHJ;~~gCAEe~~;~~6BACH~~;~~0CACI~~;~~yCACsB~~"}
1	+ {"version":3,"sources":["../src/components/Skeleton/index.ts"],"sourcesContent":["export { Skeleton } from './Skeleton';\nexport type { SkeletonContextValues, SkeletonProps, SkeletonSlots, SkeletonState } from './Skeleton.types';\nexport { renderSkeleton_unstable } from './renderSkeleton';\nexport { useSkeleton_unstable } from './useSkeleton';\nexport { useSkeletonContextValues } from './useSkeletonContextValues';\nexport { skeletonClassNames, useSkeletonStyles_unstable } from './useSkeletonStyles.styles';\n"],"names":["Skeleton","renderSkeleton_unstable","useSkeleton_unstable","useSkeletonContextValues","skeletonClassNames","useSkeletonStyles_unstable"],"mappings":";;;;;;;;;;;;eAASA,kBAAQ;;;eAERC,uCAAuB;;;eAGvBG,2CAAkB;;;eADlBD,kDAAwB;;;eACJE,mDAA0B;;;eAF9CH,iCAAoB;;;0BAHJ,aAAa;gCAEE,mBAAmB;6BACtB,gBAAgB;0CACZ,6BAA6B;yCACP,6BAA6B"}

package/lib-commonjs/components/Skeleton/renderSkeleton.js.map CHANGED Viewed

	@@ -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 { SkeletonContextProvider } from '../../contexts/SkeletonContext';\nimport type { SkeletonContextValues, SkeletonSlots, SkeletonState } from './Skeleton.types';\n\n/\n Render the final JSX of Skeleton\n */\nexport const renderSkeleton_unstable = (state: SkeletonState, contextValues: SkeletonContextValues) => {\n assertSlots<SkeletonSlots>(state);\n\n return (\n <SkeletonContextProvider value={contextValues.skeletonGroup}>\n <state.root />\n </SkeletonContextProvider>\n );\n};\n"],"names":["~~renderSkeleton_unstable~~","~~state~~","~~contextValues~~","~~assertSlots~~","~~_jsx~~","~~SkeletonContextProvider","~~value","skeletonGroup","root"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;","~~mappings":";;;;+~~BAUaA;;;eAAAA;;;~~4BATb;~~gCAE4B~~;~~iCACY~~;~~AAMjC~~,~~MAAMA~~,~~0BAA0B,~~CAACC,OAAsBC;~~IAC5DC~~,~~IAAAA,~~2BAAAA,~~EAA2BF~~;IAE3B,OAAA,WAAA,~~GACEG~~,~~IAAAA,~~eAAA,~~EAACC~~,wCAAAA,EAAAA;~~QAAwBC~~,~~OAAOJ~~,~~cAAcK~~,aAAa;kBACzD,WAAA,~~GAAAH~~,~~IAAAA,~~eAAA,EAACH,~~MAAMO~~,IAAI,EAAA,CAAA;;AAGjB"}
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 { SkeletonContextProvider } from '../../contexts/SkeletonContext';\nimport type { SkeletonContextValues, SkeletonSlots, SkeletonState } from './Skeleton.types';\n\n/\n Render the final JSX of Skeleton\n */\nexport const renderSkeleton_unstable = (state: SkeletonState, contextValues: SkeletonContextValues) => {\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":";;;;+BAUaE;;;;;;4BATb,gDAAiD;gCAErB,4BAA4B;iCAChB,iCAAiC;AAMlE,gCAAgC,CAACC,OAAsBC;QAC5DJ,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"}

package/lib-commonjs/components/Skeleton/useSkeleton.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/Skeleton/useSkeleton.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { 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 { animation = contextAnimation ?? 'wave', appearance = contextAppearance ?? 'opaque' } = props;\n\n const root = slot.always(\n getIntrinsicElementProps('div', {\n // FIXME:\n // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n ref: ref as React.Ref<HTMLDivElement>,\n role: 'progressbar',\n 'aria-busy': true,\n ...props,\n }),\n { elementType: 'div' },\n );\n return { animation, appearance, components: { root: 'div' }, root };\n};\n"],"names":["useSkeleton_unstable","props","ref","animation","contextAnimation","appearance","contextAppearance","~~useSkeletonContext","~~root","~~slot","~~always","~~getIntrinsicElementProps","~~role","elementType","components"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;+~~BAcaA;;;eAAAA;;;;~~iEAdU;~~gCACwB~~;~~iCAEZ~~;~~AAW5B~~,~~MAAMA~~,~~uBAAuB,~~CAACC,OAAsBC;IACzD,MAAM,EAAEC,WAAWC,gBAAgB,EAAEC,YAAYC,iBAAiB,EAAE,~~GAAGC~~,~~IAAAA,~~mCAAAA;IACvE,MAAM,~~EAAEJ~~,YAAYC,qBAAAA,QAAAA,qBAAAA,KAAAA,IAAAA,mBAAoB,MAAM,EAAEC,aAAaC,sBAAAA,QAAAA,sBAAAA,KAAAA,IAAAA,oBAAqB,QAAQ,EAAE,GAAGL;IAE/F,~~MAAMO~~,~~OAAOC~~,oBAAAA,~~CAAKC~~,MAAM,~~CACtBC~~,~~IAAAA,~~wCAAAA,EAAyB,OAAO;QAC9B,SAAS;QACT,4EAA4E;QAC5E,4FAA4F;~~QAC5FT~~,KAAKA;~~QACLU~~,MAAM;QACN,aAAa;QACb,~~GAAGX~~,KAAK;IACV,IACA;~~QAAEY~~,aAAa;IAAM;IAEvB,OAAO;~~QAAEV~~;QAAWE;~~QAAYS~~,YAAY;~~YAAEN~~,MAAM;QAAM;QAAGA;IAAK;AACpE"}
1	+ {"version":3,"sources":["../src/components/Skeleton/useSkeleton.ts"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { 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 { animation = contextAnimation ?? 'wave', appearance = contextAppearance ?? 'opaque' } = props;\n\n const root = slot.always(\n getIntrinsicElementProps('div', {\n // FIXME:\n // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n ref: ref as React.Ref<HTMLDivElement>,\n role: 'progressbar',\n 'aria-busy': true,\n ...props,\n }),\n { elementType: 'div' },\n );\n return { animation, appearance, components: { root: 'div' }, root };\n};\n"],"names":["React","getIntrinsicElementProps","slot","useSkeletonContext","useSkeleton_unstable","props","ref","animation","contextAnimation","appearance","contextAppearance","root","always","role","elementType","components"],"mappings":";;;;+BAcaI;;;;;;;iEAdU,QAAQ;gCACgB,4BAA4B;iCAExC,iCAAiC;AAW7D,6BAA6B,CAACC,OAAsBC;IACzD,MAAM,EAAEC,WAAWC,gBAAgB,EAAEC,YAAYC,iBAAiB,EAAE,OAAGP,mCAAAA;IACvE,MAAM,EAAEI,YAAYC,qBAAAA,QAAAA,qBAAAA,KAAAA,IAAAA,mBAAoB,MAAM,EAAEC,aAAaC,sBAAAA,QAAAA,sBAAAA,KAAAA,IAAAA,oBAAqB,QAAQ,EAAE,GAAGL;IAE/F,MAAMM,OAAOT,oBAAAA,CAAKU,MAAM,KACtBX,wCAAAA,EAAyB,OAAO;QAC9B,SAAS;QACT,4EAA4E;QAC5E,4FAA4F;QAC5FK,KAAKA;QACLO,MAAM;QACN,aAAa;QACb,GAAGR,KAAK;IACV,IACA;QAAES,aAAa;IAAM;IAEvB,OAAO;QAAEP;QAAWE;QAAYM,YAAY;YAAEJ,MAAM;QAAM;QAAGA;IAAK;AACpE,EAAE"}

package/lib-commonjs/components/Skeleton/useSkeletonContextValues.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/Skeleton/useSkeletonContextValues.ts"],"sourcesContent":["import * as React from 'react';\nimport type { SkeletonContextValues, SkeletonState } from '../Skeleton';\n\nexport const useSkeletonContextValues = (state: SkeletonState): SkeletonContextValues => {\n const { animation, appearance } = state;\n\n const skeletonGroup = React.useMemo(\n () => ({\n animation,\n appearance,\n }),\n [animation, appearance],\n );\n\n return { skeletonGroup };\n};\n"],"names":["useSkeletonContextValues","state","animation","appearance","skeletonGroup","~~React","~~useMemo"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;+~~BAGaA;;;eAAAA;;;;~~iEAHU;~~AAGhB~~,~~MAAMA~~,~~2BAA2B,~~CAACC;IACvC,MAAM,EAAEC,SAAS,EAAEC,UAAU,EAAE,GAAGF;IAElC,MAAMG,~~gBAAgBC~~,~~OAAMC~~,OAAO,CACjC,IAAO,CAAA;~~YACLJ~~;YACAC;~~QACF~~,CAAA,~~GACA~~;QAACD;QAAWC;KAAW;IAGzB,OAAO;QAAEC;IAAc;AACzB"}
1	+ {"version":3,"sources":["../src/components/Skeleton/useSkeletonContextValues.ts"],"sourcesContent":["import * as React from 'react';\nimport type { SkeletonContextValues, SkeletonState } from '../Skeleton';\n\nexport const useSkeletonContextValues = (state: SkeletonState): SkeletonContextValues => {\n const { animation, appearance } = state;\n\n const skeletonGroup = React.useMemo(\n () => ({\n animation,\n appearance,\n }),\n [animation, appearance],\n );\n\n return { skeletonGroup };\n};\n"],"names":["React","useSkeletonContextValues","state","animation","appearance","skeletonGroup","useMemo"],"mappings":";;;;+BAGaC;;;;;;;iEAHU,QAAQ;AAGxB,iCAAiC,CAACC;IACvC,MAAM,EAAEC,SAAS,EAAEC,UAAU,EAAE,GAAGF;IAElC,MAAMG,gBAAgBL,OAAMM,OAAO,CACjC,IAAO,CAAA;YACLH;YACAC;SACF,CAAA,EACA;QAACD;QAAWC;KAAW;IAGzB,OAAO;QAAEC;IAAc;AACzB,EAAE"}

package/lib-commonjs/components/Skeleton/useSkeletonStyles.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["useSkeletonStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nexport const skeletonClassNames = {\n root: 'fui-Skeleton'\n};\nconst useStyles = makeStyles({\n blockStyling: {\n display: 'block'\n }\n});\n/*\n Apply styling to the Skeleton slots based on the state\n */ export const useSkeletonStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n state.root.className = mergeClasses(skeletonClassNames.root, state.root.as === 'span' && styles.blockStyling, state.root.className);\n return state;\n};\n"],"names":["~~skeletonClassNames~~","~~useSkeletonStyles_unstable~~","~~root~~","~~useStyles~~","~~__styles~~","blockStyling","mc9l5x","d","state","styles","className","~~mergeClasses","~~as"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;;;;;;;;~~IACaA~~,kBAAkB~~;eAAlBA;;IAUIC~~,0BAA0B;~~eAA1BA;;;uBAXwB~~;~~AAClC~~,~~MAAMD~~,~~qBAAqB~~;~~IAC9BE~~,~~MAAM~~;~~AACV;AACA~~,MAAMC,~~YAAS~~,WAAA,~~GAAGC~~,~~IAAAA,~~eAAA,EAAA;~~IAAAC~~,~~cAAA~~;QAAAC,~~QAAA~~;IAAA;AAAA,GAAA;IAAAC,~~GAAA~~;QAAA;KAAA;AAAA;~~AAOP~~,~~MAAMN~~,~~6BAA8BO~~,~~CAAAA~~;~~IAC3C~~;~~IACA~~,MAAMC,~~SAASN~~;~~IACfK~~,~~MAAMN~~,IAAI,CAACQ,SAAS,~~GAAGC~~,~~IAAAA,~~mBAAY,~~EAACX~~,~~mBAAmBE~~,IAAI,EAAEM,~~MAAMN~~,IAAI,~~CAACU~~,EAAE,KAAK,~~UAAUH~~,~~OAAOJ~~,YAAY,~~EAAEG~~,~~MAAMN~~,IAAI,CAACQ,SAAS;~~IAClI~~,OAAOF;~~AACX~~"}
1	+ {"version":3,"sources":["useSkeletonStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nexport const skeletonClassNames = {\n root: 'fui-Skeleton'\n};\nconst useStyles = makeStyles({\n blockStyling: {\n display: 'block'\n }\n});\n/*\n Apply styling to the Skeleton slots based on the state\n */ export const useSkeletonStyles_unstable = (state)=>{\n 'use no memo';\n const styles = useStyles();\n state.root.className = mergeClasses(skeletonClassNames.root, state.root.as === 'span' && styles.blockStyling, state.root.className);\n return state;\n};\n"],"names":["__styles","mergeClasses","skeletonClassNames","root","useStyles","blockStyling","mc9l5x","d","useSkeletonStyles_unstable","state","styles","className","as"],"mappings":";;;;;;;;;;;IACaE,kBAAkB;;;IAUdM,0BAA0B;;;;uBAXF,gBAAgB;AAClD,2BAA2B;IAC9BL,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,GAAA,WAAA,OAAGJ,eAAA,EAAA;IAAAK,YAAA,EAAA;QAAAC,MAAA,EAAA;IAAA;AAAA,GAAA;IAAAC,CAAA,EAAA;QAAA;KAAA;AAAA,CAIjB,CAAC;AAGS,mCAAoCE,KAAK,IAAG;IACnD,aAAa;IACb,MAAMC,MAAM,GAAGN,SAAS,CAAC,CAAC;IAC1BK,KAAK,CAACN,IAAI,CAACQ,SAAS,OAAGV,mBAAY,EAACC,kBAAkB,CAACC,IAAI,EAAEM,KAAK,CAACN,IAAI,CAACS,EAAE,KAAK,MAAM,IAAIF,MAAM,CAACL,YAAY,EAAEI,KAAK,CAACN,IAAI,CAACQ,SAAS,CAAC;IACnI,OAAOF,KAAK;AAChB,CAAC"}

package/lib-commonjs/components/Skeleton/useSkeletonStyles.styles.raw.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/Skeleton/useSkeletonStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SkeletonSlots, SkeletonState } from './Skeleton.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nexport const skeletonClassNames: SlotClassNames<SkeletonSlots> = {\n root: 'fui-Skeleton',\n};\n\nconst useStyles = makeStyles({\n blockStyling: {\n display: 'block',\n },\n});\n\n/*\n Apply styling to the Skeleton slots based on the state\n */\nexport const useSkeletonStyles_unstable = (state: SkeletonState): SkeletonState => {\n 'use no memo';\n\n const styles = useStyles();\n\n state.root.className = mergeClasses(\n skeletonClassNames.root,\n state.root.as === 'span' && styles.blockStyling,\n state.root.className,\n );\n\n return state;\n};\n"],"names":["~~skeletonClassNames~~","~~useSkeletonStyles_unstable~~","~~root~~","~~useStyles~~","~~makeStyles~~","blockStyling","display","state","styles","className","~~mergeClasses","~~as"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;;;;;;;;~~IAGaA~~,kBAAAA~~;eAAAA;;IAaAC,0BAAAA;eAAAA~~;;;uBAhB4B;~~AAGlC~~,~~MAAMD,qBAAoD~~;IAC/DE,MAAM;AACR;~~AAEA~~,MAAMC,~~YAAYC~~,~~IAAAA,~~iBAAAA,EAAW;~~IAC3BC~~,cAAc;QACZC,SAAS;IACX;AACF;AAKO,~~MAAML~~,6BAA6B,~~CAACM~~;IACzC;IAEA,MAAMC,SAASL;IAEfI,MAAML,IAAI,CAACO,SAAS,~~GAAGC~~,~~IAAAA,~~mBAAAA,~~EACrBV~~,~~mBAAmBE~~,IAAI,EACvBK,MAAML,IAAI,~~CAACS~~,EAAE,KAAK,~~UAAUH~~,~~OAAOH~~,YAAY,EAC/CE,MAAML,IAAI,CAACO,SAAS;IAGtB,OAAOF;AACT"}
1	+ {"version":3,"sources":["../src/components/Skeleton/useSkeletonStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SkeletonSlots, SkeletonState } from './Skeleton.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nexport const skeletonClassNames: SlotClassNames<SkeletonSlots> = {\n root: 'fui-Skeleton',\n};\n\nconst useStyles = makeStyles({\n blockStyling: {\n display: 'block',\n },\n});\n\n/*\n Apply styling to the Skeleton slots based on the state\n */\nexport const useSkeletonStyles_unstable = (state: SkeletonState): SkeletonState => {\n 'use no memo';\n\n const styles = useStyles();\n\n state.root.className = mergeClasses(\n skeletonClassNames.root,\n state.root.as === 'span' && styles.blockStyling,\n state.root.className,\n );\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","skeletonClassNames","root","useStyles","blockStyling","display","useSkeletonStyles_unstable","state","styles","className","as"],"mappings":";;;;;;;;;;;IAGaE,kBAAAA;;;8BAaAK;;;;uBAhB4B,iBAAiB;AAGnD,2BAA0D;IAC/DJ,MAAM;AACR,EAAE;AAEF,MAAMC,gBAAYJ,iBAAAA,EAAW;IAC3BK,cAAc;QACZC,SAAS;IACX;AACF;AAKO,MAAMC,6BAA6B,CAACC;IACzC;IAEA,MAAMC,SAASL;IAEfI,MAAML,IAAI,CAACO,SAAS,OAAGT,mBAAAA,EACrBC,mBAAmBC,IAAI,EACvBK,MAAML,IAAI,CAACQ,EAAE,KAAK,UAAUF,OAAOJ,YAAY,EAC/CG,MAAML,IAAI,CAACO,SAAS;IAGtB,OAAOF;AACT,EAAE"}

package/lib-commonjs/components/SkeletonItem/SkeletonItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/SkeletonItem/SkeletonItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useSkeletonItem_unstable } from './useSkeletonItem';\nimport { renderSkeletonItem_unstable } from './renderSkeletonItem';\nimport { useSkeletonItemStyles_unstable } from './useSkeletonItemStyles.styles';\nimport type { SkeletonItemProps } from './SkeletonItem.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\nexport const SkeletonItem: ForwardRefComponent<SkeletonItemProps> = React.forwardRef((props, ref) => {\n const state = useSkeletonItem_unstable(props, ref);\n\n useSkeletonItemStyles_unstable(state);\n useCustomStyleHook_unstable('useSkeletonItemStyles_unstable')(state);\n\n return renderSkeletonItem_unstable(state);\n});\n\nSkeletonItem.displayName = 'SkeletonItem';\n"],"names":["~~SkeletonItem~~","~~React~~","~~forwardRef~~","~~props~~","~~ref~~","~~state~~","~~useSkeletonItem_unstable~~","~~useSkeletonItemStyles_unstable~~","~~useCustomStyleHook_unstable~~","~~renderSkeletonItem_unstable~~","displayName"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;+~~BAQaA;;;eAAAA;;;;~~iEARU;~~iCACkB~~;~~oCACG~~;~~6CACG~~;~~qCAGH~~;~~AAErC~~,~~MAAMA~~,~~eAAAA,~~WAAAA,~~GAAuDC~~,~~OAAMC~~,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,~~QAAQC~~,~~IAAAA~~,~~yCAAAA~~,~~EAAyBH,~~OAAOC;~~IAE9CG~~,~~IAAAA,~~2DAAAA,EAA+BF;~~IAC~~/BG,~~IAAAA,~~gDAAAA,EAA4B,~~kCAAkCH~~;IAE9D,~~OAAOI,IAAAA~~,+CAAAA,~~EAA4BJ~~;AACrC;~~AAEAL~~,~~aAAaU~~,WAAW,GAAG"}
1	+ {"version":3,"sources":["../src/components/SkeletonItem/SkeletonItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useSkeletonItem_unstable } from './useSkeletonItem';\nimport { renderSkeletonItem_unstable } from './renderSkeletonItem';\nimport { useSkeletonItemStyles_unstable } from './useSkeletonItemStyles.styles';\nimport type { SkeletonItemProps } from './SkeletonItem.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\nexport const SkeletonItem: ForwardRefComponent<SkeletonItemProps> = React.forwardRef((props, ref) => {\n const state = useSkeletonItem_unstable(props, ref);\n\n useSkeletonItemStyles_unstable(state);\n useCustomStyleHook_unstable('useSkeletonItemStyles_unstable')(state);\n\n return renderSkeletonItem_unstable(state);\n});\n\nSkeletonItem.displayName = 'SkeletonItem';\n"],"names":["React","useSkeletonItem_unstable","renderSkeletonItem_unstable","useSkeletonItemStyles_unstable","useCustomStyleHook_unstable","SkeletonItem","forwardRef","props","ref","state","displayName"],"mappings":";;;;+BAQaK;;;;;;;iEARU,QAAQ;iCACU,oBAAoB;oCACjB,uBAAuB;6CACpB,iCAAiC;qCAGpC,kCAAkC;AAEvE,qBAAMA,WAAAA,GAAuDL,OAAMM,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,QAAQR,6CAAAA,EAAyBM,OAAOC;QAE9CL,2DAAAA,EAA+BM;QAC/BL,gDAAAA,EAA4B,kCAAkCK;IAE9D,WAAOP,+CAAAA,EAA4BO;AACrC,GAAG;AAEHJ,aAAaK,WAAW,GAAG"}

package/lib-commonjs/components/SkeletonItem/SkeletonItem.types.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/SkeletonItem/SkeletonItem.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type SkeletonItemSlots = {\n root: Slot<'div', 'span'>;\n};\n\n/*\n Sizes for the SkeletonItem\n /\nexport type SkeletonItemSize = 8 \| 12 \| 16 \| 20 \| 24 \| 28 \| 32 \| 36 \| 40 \| 48 \| 56 \| 64 \| 72 \| 96 \| 120 \| 128;\n\n/\n SkeletonItem Props\n /\nexport type SkeletonItemProps = ComponentProps<SkeletonItemSlots> & {\n /\n Sets the animation of the SkeletonItem\n * @default wave\n /\n animation?: 'wave' \| 'pulse';\n\n /\n Sets the appearance of the SkeletonItem\n * @default opaque\n /\n appearance?: 'opaque' \| 'translucent';\n\n /\n Sets the size of the SkeletonItem in pixels.\n * Size is restricted to a limited set of values recommended for most uses(see SkeletonItemSize).\n * To set a non-supported size, set `width` and `height` to override the rendered size.\n * @default 16\n /\n size?: SkeletonItemSize;\n\n /\n Sets the shape of the SkeletonItem.\n * @default rectangle\n /\n shape?: 'circle' \| 'square' \| 'rectangle';\n};\n\n/\n State used in rendering SkeletonItem\n */\nexport type SkeletonItemState = ComponentState<SkeletonItemSlots> &\n Required<Pick<SkeletonItemProps, 'animation' \| 'appearance' \| 'size' \| 'shape'>>;\n"],"names":[],"~~rangeMappings":";;","~~mappings":"AA0CA;;CAEC"}
1	+ {"version":3,"sources":["../src/components/SkeletonItem/SkeletonItem.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type SkeletonItemSlots = {\n root: Slot<'div', 'span'>;\n};\n\n/*\n Sizes for the SkeletonItem\n /\nexport type SkeletonItemSize = 8 \| 12 \| 16 \| 20 \| 24 \| 28 \| 32 \| 36 \| 40 \| 48 \| 56 \| 64 \| 72 \| 96 \| 120 \| 128;\n\n/\n SkeletonItem Props\n /\nexport type SkeletonItemProps = ComponentProps<SkeletonItemSlots> & {\n /\n Sets the animation of the SkeletonItem\n * @default wave\n /\n animation?: 'wave' \| 'pulse';\n\n /\n Sets the appearance of the SkeletonItem\n * @default opaque\n /\n appearance?: 'opaque' \| 'translucent';\n\n /\n Sets the size of the SkeletonItem in pixels.\n * Size is restricted to a limited set of values recommended for most uses(see SkeletonItemSize).\n * To set a non-supported size, set `width` and `height` to override the rendered size.\n * @default 16\n /\n size?: SkeletonItemSize;\n\n /\n Sets the shape of the SkeletonItem.\n * @default rectangle\n /\n shape?: 'circle' \| 'square' \| 'rectangle';\n};\n\n/\n State used in rendering SkeletonItem\n */\nexport type SkeletonItemState = ComponentState<SkeletonItemSlots> &\n Required<Pick<SkeletonItemProps, 'animation' \| 'appearance' \| 'size' \| 'shape'>>;\n"],"names":[],"mappings":"AA0CA;;CAEC,GACD,WACmF"}

package/lib-commonjs/components/SkeletonItem/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/SkeletonItem/index.ts"],"sourcesContent":["export { SkeletonItem } from './SkeletonItem';\nexport type { SkeletonItemProps, SkeletonItemSize, SkeletonItemSlots, SkeletonItemState } from './SkeletonItem.types';\nexport { renderSkeletonItem_unstable } from './renderSkeletonItem';\nexport { useSkeletonItem_unstable } from './useSkeletonItem';\nexport { skeletonItemClassNames, useSkeletonItemStyles_unstable } from './useSkeletonItemStyles.styles';\n"],"names":["SkeletonItem","renderSkeletonItem_unstable","~~skeletonItemClassNames~~","~~useSkeletonItemStyles_unstable~~","~~useSkeletonItem_unstable~~"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":"~~;;;;;;;;;;;IAASA~~,~~YAAY;eAAZA,~~0BAAY~~;;IAEZC,2BAA2B;eAA3BA~~,+CAA2B~~;;IAE3BC~~,~~sBAAsB;eAAtBA,~~mDAAsB~~;;IAAEC~~,~~8BAA8B;eAA9BA,~~2DAA8B~~;;IADtDC~~,~~wBAAwB;eAAxBA,~~yCAAwB;;;8BAHJ;~~oCAEe~~;~~iCACH~~;~~6CAC8B~~"}
1	+ {"version":3,"sources":["../src/components/SkeletonItem/index.ts"],"sourcesContent":["export { SkeletonItem } from './SkeletonItem';\nexport type { SkeletonItemProps, SkeletonItemSize, SkeletonItemSlots, SkeletonItemState } from './SkeletonItem.types';\nexport { renderSkeletonItem_unstable } from './renderSkeletonItem';\nexport { useSkeletonItem_unstable } from './useSkeletonItem';\nexport { skeletonItemClassNames, useSkeletonItemStyles_unstable } from './useSkeletonItemStyles.styles';\n"],"names":["SkeletonItem","renderSkeletonItem_unstable","useSkeletonItem_unstable","skeletonItemClassNames","useSkeletonItemStyles_unstable"],"mappings":";;;;;;;;;;;;eAASA,0BAAY;;;eAEZC,+CAA2B;;;eAE3BE,mDAAsB;;;eAAEC,2DAA8B;;;eADtDF,yCAAwB;;;8BAHJ,iBAAiB;oCAEF,uBAAuB;iCAC1B,oBAAoB;6CACU,iCAAiC"}

package/lib-commonjs/components/SkeletonItem/renderSkeletonItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/SkeletonItem/renderSkeletonItem.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { SkeletonItemState, SkeletonItemSlots } from './SkeletonItem.types';\n\n/\n Render the final JSX of SkeletonItem\n */\nexport const renderSkeletonItem_unstable = (state: SkeletonItemState) => {\n assertSlots<SkeletonItemSlots>(state);\n\n return <state.root />;\n};\n"],"names":["~~renderSkeletonItem_unstable~~","~~state~~","~~assertSlots~~","~~_jsx","~~root"],"~~rangeMappings~~":"~~;;;;;;;;;;;;;;;"~~,~~"mappings":";;;;+BASaA;;;eAAAA;;;4BARb~~;~~gCAE4B~~;~~AAMrB~~,~~MAAMA~~,8BAA8B,CAACC;~~IAC1CC~~,~~IAAAA,~~2BAAAA,EAA+BD;IAE/B,OAAA,WAAA,~~GAAOE~~,~~IAAAA,~~eAAA,~~EAACF~~,~~MAAMG~~,IAAI,EAAA,CAAA;AACpB"}
1	+ {"version":3,"sources":["../src/components/SkeletonItem/renderSkeletonItem.tsx"],"sourcesContent":["/** @jsxRuntime automatic /\n/* @jsxImportSource @fluentui/react-jsx-runtime /\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { SkeletonItemState, SkeletonItemSlots } from './SkeletonItem.types';\n\n/\n Render the final JSX of SkeletonItem\n */\nexport const renderSkeletonItem_unstable = (state: SkeletonItemState) => {\n assertSlots<SkeletonItemSlots>(state);\n\n return <state.root />;\n};\n"],"names":["assertSlots","renderSkeletonItem_unstable","state","root"],"mappings":";;;;;;;;;;4BACA,gDAAiD;gCAErB,4BAA4B;AAMjD,MAAMC,8BAA8B,CAACC;QAC1CF,2BAAAA,EAA+BE;IAE/B,OAAA,WAAA,OAAO,eAAA,EAACA,MAAMC,IAAI,EAAA,CAAA;AACpB,EAAE"}

package/lib-commonjs/components/SkeletonItem/useSkeletonItem.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/SkeletonItem/useSkeletonItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { useSkeletonContext } from '../../contexts/SkeletonContext';\nimport type { SkeletonItemProps, SkeletonItemState } 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 { animation: contextAnimation, appearance: contextAppearance } = useSkeletonContext();\n const {\n animation = contextAnimation ?? 'wave',\n appearance = contextAppearance ?? 'opaque',\n size = 16,\n shape = 'rectangle',\n } = props;\n\n const root = slot.always(\n getIntrinsicElementProps('div', {\n // FIXME:\n // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n ref: ref as React.Ref<HTMLDivElement>,\n ...props,\n }),\n { elementType: 'div' },\n );\n return { appearance, animation, size, shape, components: { root: 'div' }, root };\n};\n"],"names":["useSkeletonItem_unstable","props","ref","animation","contextAnimation","appearance","contextAppearance","~~useSkeletonContext","~~size","shape","root","~~slot","~~always","~~getIntrinsicElementProps","~~elementType","components"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;+~~BAcaA;;;eAAAA;;;;~~iEAdU;~~gCACwB~~;~~iCACZ~~;~~AAY5B~~,~~MAAMA~~,~~2BAA2B,~~CAACC,OAA0BC;IACjE,MAAM,EAAEC,WAAWC,gBAAgB,EAAEC,YAAYC,iBAAiB,EAAE,~~GAAGC~~,~~IAAAA,~~mCAAAA;IACvE,MAAM,~~EACJJ~~,YAAYC,qBAAAA,QAAAA,qBAAAA,KAAAA,IAAAA,mBAAoB,MAAM,EACtCC,aAAaC,sBAAAA,QAAAA,sBAAAA,KAAAA,IAAAA,oBAAqB,QAAQ,~~EAC1CE~~,OAAO,EAAE,EACTC,QAAQ,WAAW,EACpB,~~GAAGR~~;IAEJ,~~MAAMS~~,~~OAAOC~~,oBAAAA,~~CAAKC~~,MAAM,~~CACtBC~~,~~IAAAA,~~wCAAAA,EAAyB,OAAO;QAC9B,SAAS;QACT,4EAA4E;QAC5E,4FAA4F;~~QAC5FX~~,KAAKA;QACL,GAAGD,KAAK;IACV,IACA;~~QAAEa~~,aAAa;IAAM;IAEvB,OAAO;~~QAAET~~;QAAYF;~~QAAWK~~;QAAMC;~~QAAOM~~,YAAY;~~YAAEL~~,MAAM;QAAM;QAAGA;IAAK;AACjF"}
1	+ {"version":3,"sources":["../src/components/SkeletonItem/useSkeletonItem.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { useSkeletonContext } from '../../contexts/SkeletonContext';\nimport type { SkeletonItemProps, SkeletonItemState } 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 { animation: contextAnimation, appearance: contextAppearance } = useSkeletonContext();\n const {\n animation = contextAnimation ?? 'wave',\n appearance = contextAppearance ?? 'opaque',\n size = 16,\n shape = 'rectangle',\n } = props;\n\n const root = slot.always(\n getIntrinsicElementProps('div', {\n // FIXME:\n // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n ref: ref as React.Ref<HTMLDivElement>,\n ...props,\n }),\n { elementType: 'div' },\n );\n return { appearance, animation, size, shape, components: { root: 'div' }, root };\n};\n"],"names":["React","getIntrinsicElementProps","slot","useSkeletonContext","useSkeletonItem_unstable","props","ref","animation","contextAnimation","appearance","contextAppearance","size","shape","root","always","elementType","components"],"mappings":";;;;+BAcaI;;;;;;;iEAdU,QAAQ;gCACgB,4BAA4B;iCACxC,iCAAiC;AAY7D,iCAAiC,CAACC,OAA0BC;IACjE,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,OAAO,EAAE,EACTC,QAAQ,WAAW,EACpB,GAAGP;IAEJ,MAAMQ,OAAOX,oBAAAA,CAAKY,MAAM,KACtBb,wCAAAA,EAAyB,OAAO;QAC9B,SAAS;QACT,4EAA4E;QAC5E,4FAA4F;QAC5FK,KAAKA;QACL,GAAGD,KAAK;IACV,IACA;QAAEU,aAAa;IAAM;IAEvB,OAAO;QAAEN;QAAYF;QAAWI;QAAMC;QAAOI,YAAY;YAAEH,MAAM;QAAM;QAAGA;IAAK;AACjF,EAAE"}

package/lib-commonjs/components/SkeletonItem/useSkeletonItemStyles.styles.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["useSkeletonItemStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const skeletonItemClassNames = {\n root: 'fui-SkeletonItem'\n};\nconst skeletonWaveAnimation = {\n to: {\n transform: 'translate(100%)'\n }\n};\nconst skeletonPulseAnimation = {\n '0%': {\n opacity: '1'\n },\n '50%': {\n opacity: '0.4'\n },\n '100%': {\n opacity: '1'\n }\n};\n/*\n Styles for the root slot\n / const useStyles = makeStyles({\n root: {\n position: 'relative',\n overflow: 'hidden',\n '::after': {\n content: '\"\"',\n display: 'block',\n position: 'absolute',\n inset: '0',\n animationIterationCount: 'infinite',\n animationDuration: '3s',\n animationTimingFunction: 'ease-in-out',\n '@media screen and (prefers-reduced-motion: reduce)': {\n animationDuration: '0.01ms',\n animationIterationCount: '1'\n }\n }\n },\n wave: {\n backgroundColor: tokens.colorNeutralStencil1,\n '::after': {\n animationName: skeletonWaveAnimation,\n backgroundImage: `linear-gradient(\n to right,\n ${tokens.colorNeutralStencil1} 0%,\n ${tokens.colorNeutralStencil2} 50%,\n ${tokens.colorNeutralStencil1} 100%)`,\n transform: 'translate(-100%)',\n '@media screen and (forced-colors: active)': {\n backgroundColor: 'WindowText'\n }\n }\n },\n pulse: {\n '::after': {\n animationName: skeletonPulseAnimation,\n animationDuration: '1s',\n backgroundColor: tokens.colorNeutralStencil1\n }\n },\n translucent: {\n backgroundColor: tokens.colorNeutralStencil1Alpha,\n '::after': {\n backgroundImage: `linear-gradient(\n to right,\n transparent 0%,\n ${tokens.colorNeutralStencil1Alpha} 50%,\n transparent 100%)`\n }\n },\n translucentPulse: {\n backgroundColor: 'none',\n '::after': {\n backgroundColor: tokens.colorNeutralStencil1Alpha\n }\n },\n blockStyling: {\n display: 'block'\n }\n});\nconst useRectangleStyles = makeStyles({\n root: {\n width: '100%',\n borderRadius: '4px'\n },\n 8: {\n height: '8px'\n },\n 12: {\n height: '12px'\n },\n 16: {\n height: '16px'\n },\n 20: {\n height: '20px'\n },\n 24: {\n height: '24px'\n },\n 28: {\n height: '28px'\n },\n 32: {\n height: '32px'\n },\n 36: {\n height: '36px'\n },\n 40: {\n height: '40px'\n },\n 48: {\n height: '48px'\n },\n 56: {\n height: '56px'\n },\n 64: {\n height: '64px'\n },\n 72: {\n height: '72px'\n },\n 96: {\n height: '96px'\n },\n 120: {\n height: '120px'\n },\n 128: {\n height: '128px'\n }\n});\nconst useSizeStyles = makeStyles({\n 8: {\n width: '8px',\n height: '8px'\n },\n 12: {\n width: '12px',\n height: '12px'\n },\n 16: {\n width: '16px',\n height: '16px'\n },\n 20: {\n width: '20px',\n height: '20px'\n },\n 24: {\n width: '24px',\n height: '24px'\n },\n 28: {\n width: '28px',\n height: '28px'\n },\n 32: {\n width: '32px',\n height: '32px'\n },\n 36: {\n width: '36px',\n height: '36px'\n },\n 40: {\n width: '40px',\n height: '40px'\n },\n 48: {\n width: '48px',\n height: '48px'\n },\n 56: {\n width: '56px',\n height: '56px'\n },\n 64: {\n width: '64px',\n height: '64px'\n },\n 72: {\n width: '72px',\n height: '72px'\n },\n 96: {\n width: '96px',\n height: '96px'\n },\n 120: {\n width: '120px',\n height: '120px'\n },\n 128: {\n width: '128px',\n height: '128px'\n }\n});\nconst useCircleSizeStyles = makeStyles({\n root: {\n borderRadius: '50%'\n }\n});\n/\n Apply styling to the SkeletonItem slots based on the state\n */ export const useSkeletonItemStyles_unstable = (state)=>{\n 'use no memo';\n const { animation, appearance, size, shape } = state;\n const rootStyles = useStyles();\n const rectStyles = useRectangleStyles();\n const sizeStyles = useSizeStyles();\n const circleStyles = useCircleSizeStyles();\n state.root.className = mergeClasses(skeletonItemClassNames.root, rootStyles.root, state.root.as === 'span' && rootStyles.blockStyling, animation === 'wave' && rootStyles.wave, animation === 'pulse' && rootStyles.pulse, appearance === 'translucent' && rootStyles.translucent, animation === 'pulse' && appearance === 'translucent' && rootStyles.translucentPulse, shape === 'rectangle' && rectStyles.root, shape === 'rectangle' && rectStyles[size], shape === 'square' && sizeStyles[size], shape === 'circle' && circleStyles.root, shape === 'circle' && sizeStyles[size], state.root.className);\n return state;\n};\n"],"names":["skeletonItemClassNames","useSkeletonItemStyles_unstable","root","skeletonWaveAnimation","to","transform","skeletonPulseAnimation","opacity","useStyles","__styles","qhf8xq","B68tc82","Bmxbyg5","Bpg54ce","Bsft5z2","ap17g6","E3zdtr","By385i5","Eqx8gd","B1piin3","bn5sak","B58onuk","s9ouvv","xr36ep","Bitv4sc","Jx5sug","Hzyzrh","wave","De3pzq","Br128sd","h62rwi","b1kco5","oi31me","pulse","Bjyk6c5","translucent","translucentPulse","blockStyling","mc9l5x","d","p","m","k","useRectangleStyles","Bqenvij","a9b677","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","useSizeStyles","useCircleSizeStyles","state","animation","appearance","size","shape","rootStyles","rectStyles","sizeStyles","circleStyles","className","mergeClasses","as"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
1	+ {"version":3,"sources":["useSkeletonItemStyles.styles.js"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const skeletonItemClassNames = {\n root: 'fui-SkeletonItem'\n};\nconst skeletonWaveAnimation = {\n to: {\n transform: 'translate(100%)'\n }\n};\nconst skeletonPulseAnimation = {\n '0%': {\n opacity: '1'\n },\n '50%': {\n opacity: '0.4'\n },\n '100%': {\n opacity: '1'\n }\n};\n/*\n Styles for the root slot\n / const useStyles = makeStyles({\n root: {\n position: 'relative',\n overflow: 'hidden',\n '::after': {\n content: '\"\"',\n display: 'block',\n position: 'absolute',\n inset: '0',\n animationIterationCount: 'infinite',\n animationDuration: '3s',\n animationTimingFunction: 'ease-in-out',\n '@media screen and (prefers-reduced-motion: reduce)': {\n animationDuration: '0.01ms',\n animationIterationCount: '1'\n }\n }\n },\n wave: {\n backgroundColor: tokens.colorNeutralStencil1,\n '::after': {\n animationName: skeletonWaveAnimation,\n backgroundImage: `linear-gradient(\n to right,\n ${tokens.colorNeutralStencil1} 0%,\n ${tokens.colorNeutralStencil2} 50%,\n ${tokens.colorNeutralStencil1} 100%)`,\n transform: 'translate(-100%)',\n '@media screen and (forced-colors: active)': {\n backgroundColor: 'WindowText'\n }\n }\n },\n pulse: {\n '::after': {\n animationName: skeletonPulseAnimation,\n animationDuration: '1s',\n backgroundColor: tokens.colorNeutralStencil1\n }\n },\n translucent: {\n backgroundColor: tokens.colorNeutralStencil1Alpha,\n '::after': {\n backgroundImage: `linear-gradient(\n to right,\n transparent 0%,\n ${tokens.colorNeutralStencil1Alpha} 50%,\n transparent 100%)`\n }\n },\n translucentPulse: {\n backgroundColor: 'none',\n '::after': {\n backgroundColor: tokens.colorNeutralStencil1Alpha\n }\n },\n blockStyling: {\n display: 'block'\n }\n});\nconst useRectangleStyles = makeStyles({\n root: {\n width: '100%',\n borderRadius: '4px'\n },\n 8: {\n height: '8px'\n },\n 12: {\n height: '12px'\n },\n 16: {\n height: '16px'\n },\n 20: {\n height: '20px'\n },\n 24: {\n height: '24px'\n },\n 28: {\n height: '28px'\n },\n 32: {\n height: '32px'\n },\n 36: {\n height: '36px'\n },\n 40: {\n height: '40px'\n },\n 48: {\n height: '48px'\n },\n 56: {\n height: '56px'\n },\n 64: {\n height: '64px'\n },\n 72: {\n height: '72px'\n },\n 96: {\n height: '96px'\n },\n 120: {\n height: '120px'\n },\n 128: {\n height: '128px'\n }\n});\nconst useSizeStyles = makeStyles({\n 8: {\n width: '8px',\n height: '8px'\n },\n 12: {\n width: '12px',\n height: '12px'\n },\n 16: {\n width: '16px',\n height: '16px'\n },\n 20: {\n width: '20px',\n height: '20px'\n },\n 24: {\n width: '24px',\n height: '24px'\n },\n 28: {\n width: '28px',\n height: '28px'\n },\n 32: {\n width: '32px',\n height: '32px'\n },\n 36: {\n width: '36px',\n height: '36px'\n },\n 40: {\n width: '40px',\n height: '40px'\n },\n 48: {\n width: '48px',\n height: '48px'\n },\n 56: {\n width: '56px',\n height: '56px'\n },\n 64: {\n width: '64px',\n height: '64px'\n },\n 72: {\n width: '72px',\n height: '72px'\n },\n 96: {\n width: '96px',\n height: '96px'\n },\n 120: {\n width: '120px',\n height: '120px'\n },\n 128: {\n width: '128px',\n height: '128px'\n }\n});\nconst useCircleSizeStyles = makeStyles({\n root: {\n borderRadius: '50%'\n }\n});\n/\n Apply styling to the SkeletonItem slots based on the state\n */ export const useSkeletonItemStyles_unstable = (state)=>{\n 'use no memo';\n const { animation, appearance, size, shape } = state;\n const rootStyles = useStyles();\n const rectStyles = useRectangleStyles();\n const sizeStyles = useSizeStyles();\n const circleStyles = useCircleSizeStyles();\n state.root.className = mergeClasses(skeletonItemClassNames.root, rootStyles.root, state.root.as === 'span' && rootStyles.blockStyling, animation === 'wave' && rootStyles.wave, animation === 'pulse' && rootStyles.pulse, appearance === 'translucent' && rootStyles.translucent, animation === 'pulse' && appearance === 'translucent' && rootStyles.translucentPulse, shape === 'rectangle' && rectStyles.root, shape === 'rectangle' && rectStyles[size], shape === 'square' && sizeStyles[size], shape === 'circle' && circleStyles.root, shape === 'circle' && sizeStyles[size], state.root.className);\n return state;\n};\n"],"names":["__styles","mergeClasses","tokens","skeletonItemClassNames","root","skeletonWaveAnimation","to","transform","skeletonPulseAnimation","opacity","useStyles","qhf8xq","B68tc82","Bmxbyg5","Bpg54ce","Bsft5z2","ap17g6","E3zdtr","By385i5","Eqx8gd","B1piin3","bn5sak","B58onuk","s9ouvv","xr36ep","Bitv4sc","Jx5sug","Hzyzrh","wave","De3pzq","Br128sd","h62rwi","b1kco5","oi31me","pulse","Bjyk6c5","translucent","translucentPulse","blockStyling","mc9l5x","d","p","m","k","useRectangleStyles","Bqenvij","a9b677","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","useSizeStyles","useCircleSizeStyles","useSkeletonItemStyles_unstable","state","animation","appearance","size","shape","rootStyles","rectStyles","sizeStyles","circleStyles","className","as"],"mappings":"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"}

package/lib-commonjs/components/SkeletonItem/useSkeletonItemStyles.styles.raw.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/components/SkeletonItem/useSkeletonItemStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SkeletonItemSlots, SkeletonItemState } from './SkeletonItem.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\n\nexport const skeletonItemClassNames: SlotClassNames<SkeletonItemSlots> = {\n root: 'fui-SkeletonItem',\n};\n\nconst skeletonWaveAnimation = {\n to: {\n transform: 'translate(100%)',\n },\n};\n\nconst skeletonPulseAnimation = {\n '0%': {\n opacity: '1',\n },\n '50%': {\n opacity: '0.4',\n },\n '100%': {\n opacity: '1',\n },\n};\n\n/*\n Styles for the root slot\n /\nconst useStyles = makeStyles({\n root: {\n position: 'relative',\n overflow: 'hidden',\n\n '::after': {\n content: '\"\"',\n display: 'block',\n position: 'absolute',\n inset: '0',\n animationIterationCount: 'infinite',\n animationDuration: '3s',\n animationTimingFunction: 'ease-in-out',\n '@media screen and (prefers-reduced-motion: reduce)': {\n animationDuration: '0.01ms',\n animationIterationCount: '1',\n },\n },\n },\n wave: {\n backgroundColor: tokens.colorNeutralStencil1,\n\n '::after': {\n animationName: skeletonWaveAnimation,\n backgroundImage: `linear-gradient(\n to right,\n ${tokens.colorNeutralStencil1} 0%,\n ${tokens.colorNeutralStencil2} 50%,\n ${tokens.colorNeutralStencil1} 100%)`,\n transform: 'translate(-100%)',\n\n '@media screen and (forced-colors: active)': {\n backgroundColor: 'WindowText',\n },\n },\n },\n pulse: {\n '::after': {\n animationName: skeletonPulseAnimation,\n animationDuration: '1s',\n backgroundColor: tokens.colorNeutralStencil1,\n },\n },\n translucent: {\n backgroundColor: tokens.colorNeutralStencil1Alpha,\n\n '::after': {\n backgroundImage: `linear-gradient(\n to right,\n transparent 0%,\n ${tokens.colorNeutralStencil1Alpha} 50%,\n transparent 100%)`,\n },\n },\n translucentPulse: {\n backgroundColor: 'none',\n\n '::after': {\n backgroundColor: tokens.colorNeutralStencil1Alpha,\n },\n },\n blockStyling: {\n display: 'block',\n },\n});\n\nconst useRectangleStyles = makeStyles({\n root: {\n width: '100%',\n borderRadius: '4px',\n },\n 8: { height: '8px' },\n 12: { height: '12px' },\n 16: { height: '16px' },\n 20: { height: '20px' },\n 24: { height: '24px' },\n 28: { height: '28px' },\n 32: { height: '32px' },\n 36: { height: '36px' },\n 40: { height: '40px' },\n 48: { height: '48px' },\n 56: { height: '56px' },\n 64: { height: '64px' },\n 72: { height: '72px' },\n 96: { height: '96px' },\n 120: { height: '120px' },\n 128: { height: '128px' },\n});\n\nconst useSizeStyles = makeStyles({\n 8: { width: '8px', height: '8px' },\n 12: { width: '12px', height: '12px' },\n 16: { width: '16px', height: '16px' },\n 20: { width: '20px', height: '20px' },\n 24: { width: '24px', height: '24px' },\n 28: { width: '28px', height: '28px' },\n 32: { width: '32px', height: '32px' },\n 36: { width: '36px', height: '36px' },\n 40: { width: '40px', height: '40px' },\n 48: { width: '48px', height: '48px' },\n 56: { width: '56px', height: '56px' },\n 64: { width: '64px', height: '64px' },\n 72: { width: '72px', height: '72px' },\n 96: { width: '96px', height: '96px' },\n 120: { width: '120px', height: '120px' },\n 128: { width: '128px', height: '128px' },\n});\n\nconst useCircleSizeStyles = makeStyles({\n root: {\n borderRadius: '50%',\n },\n});\n\n/\n Apply styling to the SkeletonItem slots based on the state\n */\nexport const useSkeletonItemStyles_unstable = (state: SkeletonItemState): SkeletonItemState => {\n 'use no memo';\n\n const { animation, appearance, size, shape } = state;\n\n const rootStyles = useStyles();\n const rectStyles = useRectangleStyles();\n const sizeStyles = useSizeStyles();\n const circleStyles = useCircleSizeStyles();\n\n state.root.className = mergeClasses(\n skeletonItemClassNames.root,\n rootStyles.root,\n state.root.as === 'span' && rootStyles.blockStyling,\n animation === 'wave' && rootStyles.wave,\n animation === 'pulse' && rootStyles.pulse,\n appearance === 'translucent' && rootStyles.translucent,\n animation === 'pulse' && appearance === 'translucent' && rootStyles.translucentPulse,\n shape === 'rectangle' && rectStyles.root,\n shape === 'rectangle' && rectStyles[size],\n shape === 'square' && sizeStyles[size],\n shape === 'circle' && circleStyles.root,\n shape === 'circle' && sizeStyles[size],\n state.root.className,\n );\n\n return state;\n};\n"],"names":["~~skeletonItemClassNames~~","~~useSkeletonItemStyles_unstable~~","root","skeletonWaveAnimation","to","transform","skeletonPulseAnimation","opacity","useStyles","~~makeStyles","~~position","overflow","content","display","inset","animationIterationCount","animationDuration","animationTimingFunction","wave","backgroundColor","~~tokens","~~colorNeutralStencil1","animationName","backgroundImage","colorNeutralStencil2","pulse","translucent","colorNeutralStencil1Alpha","translucentPulse","blockStyling","useRectangleStyles","width","borderRadius","height","useSizeStyles","useCircleSizeStyles","state","animation","appearance","size","shape","rootStyles","rectStyles","sizeStyles","circleStyles","className","~~mergeClasses","~~as"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":";;;;;;;;;;;~~IAKaA~~,sBAAAA;eAAAA~~;;IA8IAC,8BAAAA;eAAAA~~;;;uBAnJ4B;~~4BAGlB;AAEhB~~,~~MAAMD,yBAA4D~~;~~IACvEE~~,MAAM;AACR;~~AAEA~~,MAAMC,wBAAwB;IAC5BC,IAAI;QACFC,WAAW;IACb;AACF;AAEA,MAAMC,yBAAyB;IAC7B,MAAM;QACJC,SAAS;IACX;IACA,OAAO;QACLA,SAAS;IACX;IACA,QAAQ;QACNA,SAAS;IACX;AACF;AAEA;;CAEC,GACD,MAAMC,~~YAAYC~~,~~IAAAA,~~iBAAAA,EAAW;~~IAC3BP~~,MAAM;~~QACJQ~~,UAAU;QACVC,UAAU;QAEV,WAAW;YACTC,SAAS;YACTC,SAAS;YACTH,UAAU;YACVI,OAAO;YACPC,yBAAyB;YACzBC,mBAAmB;YACnBC,yBAAyB;YACzB,sDAAsD;gBACpDD,mBAAmB;gBACnBD,yBAAyB;YAC3B;QACF;IACF;IACAG,MAAM;QACJC,~~iBAAiBC~~,kBAAAA,~~CAAOC~~,oBAAoB;QAE5C,WAAW;YACTC,~~eAAenB~~;~~YACfoB~~,iBAAiB,CAAC;;QAEhB,~~EAAEH~~,kBAAAA,~~CAAOC~~,oBAAoB,CAAC;QAC9B,~~EAAED~~,kBAAAA,~~CAAOI~~,oBAAoB,CAAC;QAC9B,~~EAAEJ~~,kBAAAA,~~CAAOC~~,oBAAoB,CAAC,MAAM,CAAC;~~YACvChB~~,WAAW;YAEX,6CAA6C;~~gBAC3Cc~~,iBAAiB;YACnB;QACF;IACF;~~IACAM~~,OAAO;QACL,WAAW;YACTH,~~eAAehB~~;~~YACfU~~,mBAAmB;YACnBG,~~iBAAiBC~~,kBAAAA,~~CAAOC~~,oBAAoB;QAC9C;IACF;IACAK,aAAa;~~QACXP~~,~~iBAAiBC~~,kBAAAA,~~CAAOO~~,yBAAyB;QAEjD,WAAW;YACTJ,iBAAiB,CAAC;;;MAGlB,~~EAAEH~~,kBAAAA,~~CAAOO~~,yBAAyB,CAAC;uBAClB,CAAC;QACpB;IACF;IACAC,kBAAkB;~~QAChBT~~,iBAAiB;QAEjB,WAAW;YACTA,~~iBAAiBC~~,kBAAAA,~~CAAOO~~,yBAAyB;QACnD;IACF;IACAE,cAAc;~~QACZhB~~,SAAS;IACX;AACF;AAEA,~~MAAMiB~~,~~qBAAqBrB~~,~~IAAAA,~~iBAAAA,EAAW;~~IACpCP~~,MAAM;~~QACJ6B~~,OAAO;QACPC,cAAc;IAChB;IACA,GAAG;QAAEC,QAAQ;IAAM;IACnB,IAAI;QAAEA,QAAQ;IAAO;IACrB,IAAI;QAAEA,QAAQ;IAAO;IACrB,IAAI;QAAEA,QAAQ;IAAO;IACrB,IAAI;QAAEA,QAAQ;IAAO;IACrB,IAAI;QAAEA,QAAQ;IAAO;IACrB,IAAI;QAAEA,QAAQ;IAAO;IACrB,IAAI;QAAEA,QAAQ;IAAO;IACrB,IAAI;QAAEA,QAAQ;IAAO;IACrB,IAAI;QAAEA,QAAQ;IAAO;IACrB,IAAI;QAAEA,QAAQ;IAAO;IACrB,IAAI;QAAEA,QAAQ;IAAO;IACrB,IAAI;QAAEA,QAAQ;IAAO;IACrB,IAAI;QAAEA,QAAQ;IAAO;IACrB,KAAK;QAAEA,QAAQ;IAAQ;IACvB,KAAK;QAAEA,QAAQ;IAAQ;AACzB;AAEA,MAAMC,~~gBAAgBzB~~,~~IAAAA,~~iBAAAA,EAAW;IAC/B,GAAG;~~QAAEsB~~,OAAO;QAAOE,QAAQ;IAAM;IACjC,IAAI;QAAEF,OAAO;QAAQE,QAAQ;IAAO;IACpC,IAAI;QAAEF,OAAO;QAAQE,QAAQ;IAAO;IACpC,IAAI;QAAEF,OAAO;QAAQE,QAAQ;IAAO;IACpC,IAAI;QAAEF,OAAO;QAAQE,QAAQ;IAAO;IACpC,IAAI;QAAEF,OAAO;QAAQE,QAAQ;IAAO;IACpC,IAAI;QAAEF,OAAO;QAAQE,QAAQ;IAAO;IACpC,IAAI;QAAEF,OAAO;QAAQE,QAAQ;IAAO;IACpC,IAAI;QAAEF,OAAO;QAAQE,QAAQ;IAAO;IACpC,IAAI;QAAEF,OAAO;QAAQE,QAAQ;IAAO;IACpC,IAAI;QAAEF,OAAO;QAAQE,QAAQ;IAAO;IACpC,IAAI;QAAEF,OAAO;QAAQE,QAAQ;IAAO;IACpC,IAAI;QAAEF,OAAO;QAAQE,QAAQ;IAAO;IACpC,IAAI;QAAEF,OAAO;QAAQE,QAAQ;IAAO;IACpC,KAAK;QAAEF,OAAO;QAASE,QAAQ;IAAQ;IACvC,KAAK;QAAEF,OAAO;QAASE,QAAQ;IAAQ;AACzC;AAEA,MAAME,~~sBAAsB1B~~,~~IAAAA,~~iBAAAA,EAAW;~~IACrCP~~,MAAM;~~QACJ8B~~,cAAc;IAChB;AACF;AAKO,~~MAAM/B~~,~~iCAAiC,CAACmC~~;IAC7C;IAEA,MAAM,EAAEC,SAAS,EAAEC,UAAU,EAAEC,IAAI,EAAEC,KAAK,EAAE,GAAGJ;IAE/C,MAAMK,~~aAAajC~~;IACnB,~~MAAMkC~~,~~aAAaZ~~;IACnB,~~MAAMa~~,~~aAAaT~~;IACnB,~~MAAMU~~,~~eAAeT~~;~~IAErBC~~,~~MAAMlC~~,IAAI,~~CAAC2C~~,SAAS,~~GAAGC~~,~~IAAAA~~,~~mBAAAA~~,~~EACrB9C~~,~~uBAAuBE,~~IAAI,~~EAC3BuC~~,~~WAAWvC~~,IAAI,~~EACfkC~~,~~MAAMlC~~,IAAI,~~CAAC6C~~,EAAE,KAAK,~~UAAUN~~,~~WAAWZ~~,YAAY,~~EACnDQ~~,cAAc,UAAUI,WAAWvB,IAAI,EACvCmB,cAAc,WAAWI,~~WAAWhB~~,KAAK,~~EACzCa~~,eAAe,iBAAiBG,~~WAAWf~~,WAAW,~~EACtDW~~,cAAc,WAAWC,eAAe,iBAAiBG,~~WAAWb~~,gBAAgB,~~EACpFY~~,UAAU,eAAeE,~~WAAWxC~~,IAAI,~~EACxCsC~~,UAAU,eAAeE,UAAU,CAACH,KAAK,EACzCC,UAAU,YAAYG,UAAU,CAACJ,KAAK,EACtCC,UAAU,YAAYI,~~aAAa1C~~,IAAI,~~EACvCsC~~,UAAU,YAAYG,UAAU,CAACJ,KAAK,EACtCH,~~MAAMlC~~,IAAI,~~CAAC2C~~,SAAS;IAGtB,OAAOT;AACT"}
1	+ {"version":3,"sources":["../src/components/SkeletonItem/useSkeletonItemStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses } from '@griffel/react';\nimport type { SkeletonItemSlots, SkeletonItemState } from './SkeletonItem.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport { tokens } from '@fluentui/react-theme';\n\nexport const skeletonItemClassNames: SlotClassNames<SkeletonItemSlots> = {\n root: 'fui-SkeletonItem',\n};\n\nconst skeletonWaveAnimation = {\n to: {\n transform: 'translate(100%)',\n },\n};\n\nconst skeletonPulseAnimation = {\n '0%': {\n opacity: '1',\n },\n '50%': {\n opacity: '0.4',\n },\n '100%': {\n opacity: '1',\n },\n};\n\n/*\n Styles for the root slot\n /\nconst useStyles = makeStyles({\n root: {\n position: 'relative',\n overflow: 'hidden',\n\n '::after': {\n content: '\"\"',\n display: 'block',\n position: 'absolute',\n inset: '0',\n animationIterationCount: 'infinite',\n animationDuration: '3s',\n animationTimingFunction: 'ease-in-out',\n '@media screen and (prefers-reduced-motion: reduce)': {\n animationDuration: '0.01ms',\n animationIterationCount: '1',\n },\n },\n },\n wave: {\n backgroundColor: tokens.colorNeutralStencil1,\n\n '::after': {\n animationName: skeletonWaveAnimation,\n backgroundImage: `linear-gradient(\n to right,\n ${tokens.colorNeutralStencil1} 0%,\n ${tokens.colorNeutralStencil2} 50%,\n ${tokens.colorNeutralStencil1} 100%)`,\n transform: 'translate(-100%)',\n\n '@media screen and (forced-colors: active)': {\n backgroundColor: 'WindowText',\n },\n },\n },\n pulse: {\n '::after': {\n animationName: skeletonPulseAnimation,\n animationDuration: '1s',\n backgroundColor: tokens.colorNeutralStencil1,\n },\n },\n translucent: {\n backgroundColor: tokens.colorNeutralStencil1Alpha,\n\n '::after': {\n backgroundImage: `linear-gradient(\n to right,\n transparent 0%,\n ${tokens.colorNeutralStencil1Alpha} 50%,\n transparent 100%)`,\n },\n },\n translucentPulse: {\n backgroundColor: 'none',\n\n '::after': {\n backgroundColor: tokens.colorNeutralStencil1Alpha,\n },\n },\n blockStyling: {\n display: 'block',\n },\n});\n\nconst useRectangleStyles = makeStyles({\n root: {\n width: '100%',\n borderRadius: '4px',\n },\n 8: { height: '8px' },\n 12: { height: '12px' },\n 16: { height: '16px' },\n 20: { height: '20px' },\n 24: { height: '24px' },\n 28: { height: '28px' },\n 32: { height: '32px' },\n 36: { height: '36px' },\n 40: { height: '40px' },\n 48: { height: '48px' },\n 56: { height: '56px' },\n 64: { height: '64px' },\n 72: { height: '72px' },\n 96: { height: '96px' },\n 120: { height: '120px' },\n 128: { height: '128px' },\n});\n\nconst useSizeStyles = makeStyles({\n 8: { width: '8px', height: '8px' },\n 12: { width: '12px', height: '12px' },\n 16: { width: '16px', height: '16px' },\n 20: { width: '20px', height: '20px' },\n 24: { width: '24px', height: '24px' },\n 28: { width: '28px', height: '28px' },\n 32: { width: '32px', height: '32px' },\n 36: { width: '36px', height: '36px' },\n 40: { width: '40px', height: '40px' },\n 48: { width: '48px', height: '48px' },\n 56: { width: '56px', height: '56px' },\n 64: { width: '64px', height: '64px' },\n 72: { width: '72px', height: '72px' },\n 96: { width: '96px', height: '96px' },\n 120: { width: '120px', height: '120px' },\n 128: { width: '128px', height: '128px' },\n});\n\nconst useCircleSizeStyles = makeStyles({\n root: {\n borderRadius: '50%',\n },\n});\n\n/\n Apply styling to the SkeletonItem slots based on the state\n */\nexport const useSkeletonItemStyles_unstable = (state: SkeletonItemState): SkeletonItemState => {\n 'use no memo';\n\n const { animation, appearance, size, shape } = state;\n\n const rootStyles = useStyles();\n const rectStyles = useRectangleStyles();\n const sizeStyles = useSizeStyles();\n const circleStyles = useCircleSizeStyles();\n\n state.root.className = mergeClasses(\n skeletonItemClassNames.root,\n rootStyles.root,\n state.root.as === 'span' && rootStyles.blockStyling,\n animation === 'wave' && rootStyles.wave,\n animation === 'pulse' && rootStyles.pulse,\n appearance === 'translucent' && rootStyles.translucent,\n animation === 'pulse' && appearance === 'translucent' && rootStyles.translucentPulse,\n shape === 'rectangle' && rectStyles.root,\n shape === 'rectangle' && rectStyles[size],\n shape === 'square' && sizeStyles[size],\n shape === 'circle' && circleStyles.root,\n shape === 'circle' && sizeStyles[size],\n state.root.className,\n );\n\n return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","skeletonItemClassNames","root","skeletonWaveAnimation","to","transform","skeletonPulseAnimation","opacity","useStyles","position","overflow","content","display","inset","animationIterationCount","animationDuration","animationTimingFunction","wave","backgroundColor","colorNeutralStencil1","animationName","backgroundImage","colorNeutralStencil2","pulse","translucent","colorNeutralStencil1Alpha","translucentPulse","blockStyling","useRectangleStyles","width","borderRadius","height","useSizeStyles","useCircleSizeStyles","useSkeletonItemStyles_unstable","state","animation","appearance","size","shape","rootStyles","rectStyles","sizeStyles","circleStyles","className","as"],"mappings":"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"}

package/lib-commonjs/contexts/SkeletonContext.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/contexts/SkeletonContext.ts"],"sourcesContent":["import * as React from 'react';\n\nconst SkeletonContext = React.createContext<SkeletonContextValue \| undefined>(undefined);\n\nexport interface SkeletonContextValue {\n animation?: 'wave' \| 'pulse';\n appearance?: 'opaque' \| 'translucent';\n}\n\nconst skeletonContextDefaultValue: SkeletonContextValue = {};\n\nexport const SkeletonContextProvider = SkeletonContext.Provider;\n\nexport const useSkeletonContext = () => React.useContext(SkeletonContext) ?? skeletonContextDefaultValue;\n"],"names":["~~SkeletonContextProvider~~","~~useSkeletonContext","~~SkeletonContext","~~React","~~createContext","undefined","skeletonContextDefaultValue","~~Provider~~","~~useContext~~"],"~~rangeMappings~~":"~~;;;;;;;;;;;;;;;;;;;;;;;;;;~~","mappings":";;;;;;;;;;;~~IAWaA~~,uBAAAA~~;eAAAA;;IAEAC~~,~~kBAAAA~~;~~eAAAA;;;;iEAbU;AAEvB~~,~~MAAMC~~,~~gCAAkBC~~,~~OAAMC~~,aAAa,CAAmCC;AAO9E,MAAMC,8BAAoD,CAAC;AAEpD,~~MAAMN~~,~~0BAA0BE,~~gBAAgBK,QAAQ;~~AAExD~~,~~MAAMN~~,qBAAqB;~~QAAME~~;WAAAA,CAAAA,oBAAAA,~~OAAMK~~,UAAU,~~CAACN~~,gBAAAA,MAAAA,~~QAAjBC~~,sBAAAA,KAAAA,IAAAA,~~oBAAqCG~~;~~AAA0B~~"}
1	+ {"version":3,"sources":["../src/contexts/SkeletonContext.ts"],"sourcesContent":["import * as React from 'react';\n\nconst SkeletonContext = React.createContext<SkeletonContextValue \| undefined>(undefined);\n\nexport interface SkeletonContextValue {\n animation?: 'wave' \| 'pulse';\n appearance?: 'opaque' \| 'translucent';\n}\n\nconst skeletonContextDefaultValue: SkeletonContextValue = {};\n\nexport const SkeletonContextProvider = SkeletonContext.Provider;\n\nexport const useSkeletonContext = () => React.useContext(SkeletonContext) ?? skeletonContextDefaultValue;\n"],"names":["React","SkeletonContext","createContext","undefined","skeletonContextDefaultValue","SkeletonContextProvider","Provider","useSkeletonContext","useContext"],"mappings":";;;;;;;;;;;IAWaK,uBAAAA;;;sBAEAE;;;;;iEAbU,QAAQ;AAE/B,MAAMN,gCAAkBD,OAAME,aAAa,CAAmCC;AAO9E,MAAMC,8BAAoD,CAAC;AAEpD,gCAAgCH,gBAAgBK,QAAQ,CAAC;AAEzD,MAAMC,qBAAqB;QAAMP;WAAAA,CAAAA,oBAAAA,OAAMQ,UAAU,CAACP,gBAAAA,MAAAA,QAAjBD,sBAAAA,KAAAA,IAAAA,oBAAqCI;EAA4B"}

package/lib-commonjs/contexts/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../src/contexts/index.ts"],"sourcesContent":["export type { SkeletonContextValue } from './SkeletonContext';\nexport { SkeletonContextProvider, useSkeletonContext } from './SkeletonContext';\n"],"names":["SkeletonContextProvider","useSkeletonContext"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;","~~mappings":"~~;;;;;;;;;;;IACSA~~,~~uBAAuB;eAAvBA,~~wCAAuB~~;;IAAEC~~,~~kBAAkB;eAAlBA,~~mCAAkB;;;iCAAQ"}
1	+ {"version":3,"sources":["../src/contexts/index.ts"],"sourcesContent":["export type { SkeletonContextValue } from './SkeletonContext';\nexport { SkeletonContextProvider, useSkeletonContext } from './SkeletonContext';\n"],"names":["SkeletonContextProvider","useSkeletonContext"],"mappings":";;;;;;;;;;;;eACSA,wCAAuB;;;eAAEC,mCAAkB;;;iCAAQ,oBAAoB"}

package/lib-commonjs/index.js.map CHANGED Viewed

	@@ -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} from './Skeleton';\nexport type { SkeletonProps, SkeletonSlots, SkeletonState } from './Skeleton';\nexport {\n SkeletonItem,\n renderSkeletonItem_unstable,\n skeletonItemClassNames,\n useSkeletonItemStyles_unstable,\n useSkeletonItem_unstable,\n} from './SkeletonItem';\nexport type { SkeletonItemProps, SkeletonItemSlots, SkeletonItemState } from './SkeletonItem';\nexport { SkeletonContextProvider, useSkeletonContext } from './contexts/index';\nexport type { SkeletonContextValue } from './contexts/index';\n"],"names":["Skeleton","~~SkeletonContextProvider~~","~~SkeletonItem~~","~~renderSkeletonItem_unstable~~","~~renderSkeleton_unstable~~","~~skeletonClassNames~~","~~skeletonItemClassNames~~","~~useSkeletonContext~~","useSkeletonItemStyles_unstable","useSkeletonItem_unstable","~~useSkeletonStyles_unstable~~","~~useSkeleton_unstable~~"],"~~rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","~~mappings":";;;;;;;;;;;IACEA~~,QAAQ~~;~~eAARA,kBAAQ~~;;~~IAeDC,uBAAuB~~;~~eAAvBA~~,~~8BAAuB;;IAP9BC,YAAY;eAAZA,~~0BAAY;;IACZC~~,2BAA2B~~;~~eAA3BA~~,~~yCAA2B;;IAR3BC,uBAAuB;eAAvBA,~~iCAAuB~~;;IACvBC~~,~~kBAAkB;eAAlBA,~~4BAAkB~~;;IAQlBC~~,~~sBAAsB;eAAtBA,~~oCAAsB~~;;IAKUC~~,~~kBAAkB;eAAlBA,~~yBAAkB~~;;IAJlDC~~,~~8BAA8B;eAA9BA,~~4CAA8B~~;;IAC9BC~~,~~wBAAwB;eAAxBA,~~sCAAwB;;~~IATxBC,0BAA0B~~;~~eAA1BA~~,~~oCAA0B;;IAC1BC,oBAAoB;eAApBA,~~8BAAoB;;;0BACf;~~8BAQA~~;~~uBAEqD~~"}
1	+ {"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n Skeleton,\n renderSkeleton_unstable,\n skeletonClassNames,\n useSkeletonStyles_unstable,\n useSkeleton_unstable,\n} from './Skeleton';\nexport type { SkeletonProps, SkeletonSlots, SkeletonState } from './Skeleton';\nexport {\n SkeletonItem,\n renderSkeletonItem_unstable,\n skeletonItemClassNames,\n useSkeletonItemStyles_unstable,\n useSkeletonItem_unstable,\n} from './SkeletonItem';\nexport type { SkeletonItemProps, SkeletonItemSlots, SkeletonItemState } from './SkeletonItem';\nexport { SkeletonContextProvider, useSkeletonContext } from './contexts/index';\nexport type { SkeletonContextValue } from './contexts/index';\n"],"names":["Skeleton","renderSkeleton_unstable","skeletonClassNames","useSkeletonStyles_unstable","useSkeleton_unstable","SkeletonItem","renderSkeletonItem_unstable","skeletonItemClassNames","useSkeletonItemStyles_unstable","useSkeletonItem_unstable","SkeletonContextProvider","useSkeletonContext"],"mappings":";;;;;;;;;;;IACEA;iCAAQ;;2BAesB;eAAvBU;;;eAPPL,0BAAY;;IACZC;wDAA2B;;;eAR3BL,iCAAuB;;;eACvBC,4BAAkB;;;eAQlBK,oCAAsB;;;eAKUI,yBAAkB;;;eAJlDH,4CAA8B;;;eAC9BC,sCAAwB;;IATxBN;mDAA0B;;;eAC1BC,8BAAoB;;;0BACf,aAAa;8BAQb,iBAAiB;uBAEoC,mBAAmB"}

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-skeleton",
-  "version": "9.4.0",
+  "version": "9.4.2",
   "description": "Converged v9 Skeleton Component",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -18,11 +18,11 @@
     "@fluentui/scripts-api-extractor": "*"
   },
   "dependencies": {
-    "@fluentui/react-field": "^9.4.0",
-    "@fluentui/react-jsx-runtime": "^9.1.2",
-    "@fluentui/react-shared-contexts": "^9.24.0",
-    "@fluentui/react-theme": "^9.1.24",
-    "@fluentui/react-utilities": "^9.22.0",
+    "@fluentui/react-field": "^9.4.2",
+    "@fluentui/react-jsx-runtime": "^9.1.4",
+    "@fluentui/react-shared-contexts": "^9.24.1",
+    "@fluentui/react-theme": "^9.2.0",
+    "@fluentui/react-utilities": "^9.23.1",
     "@griffel/react": "^1.5.22",
     "@swc/helpers": "^0.5.1"
   },