@fluentui/react-skeleton 9.7.4 → 9.7.5

package/CHANGELOG.md

@@ -1,12 +1,26 @@
 # Change Log - @fluentui/react-skeleton
 
-This log was last generated on Wed, 24 Jun 2026 11:03:44 GMT and should not be manually modified.
+<!-- This log was last generated on Tue, 11 Aug 2026 17:16:02 GMT and should not be manually modified. -->
 
 <!-- Start content -->
 
+## [9.7.5](https://github.com/microsoft/fluentui/tree/@fluentui/react-skeleton_v9.7.5)
+
+Tue, 11 Aug 2026 17:16:02 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-skeleton_v9.7.4..@fluentui/react-skeleton_v9.7.5)
+
+### Patches
+
+- Ship ESM-first (type:module): valid ESM under lib/, CommonJS under lib-commonjs/*.cjs, and drop the `node` export condition - bare-Node `import` resolves ESM, `require` resolves CJS; node-targeted bundlers tree-shake. ([PR #36327](https://github.com/microsoft/fluentui/pull/36327) by martinhochel@microsoft.com)
+- Bump @fluentui/react-field to v9.5.4 ([commit](https://github.com/microsoft/fluentui/commit/undefined) by beachball)
+- Bump @fluentui/react-jsx-runtime to v9.4.5 ([commit](https://github.com/microsoft/fluentui/commit/undefined) by beachball)
+- Bump @fluentui/react-shared-contexts to v9.26.3 ([commit](https://github.com/microsoft/fluentui/commit/undefined) by beachball)
+- Bump @fluentui/react-theme to v9.2.2 ([commit](https://github.com/microsoft/fluentui/commit/undefined) by beachball)
+- Bump @fluentui/react-utilities to v9.26.6 ([commit](https://github.com/microsoft/fluentui/commit/undefined) by beachball)
+
 ## [9.7.4](https://github.com/microsoft/fluentui/tree/@fluentui/react-skeleton_v9.7.4)
 
-Wed, 24 Jun 2026 11:03:44 GMT 
+Wed, 24 Jun 2026 11:09:56 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-skeleton_v9.7.3..@fluentui/react-skeleton_v9.7.4)
 
 ### Patches

package/dist/index.d.cts

@@ -0,0 +1,191 @@
+import type { ComponentProps } from '@fluentui/react-utilities';
+import type { ComponentState } from '@fluentui/react-utilities';
+import type { ForwardRefComponent } from '@fluentui/react-utilities';
+import type { JSXElement } from '@fluentui/react-utilities';
+import * as React_2 from 'react';
+import type { Slot } from '@fluentui/react-utilities';
+import type { SlotClassNames } from '@fluentui/react-utilities';
+
+/**
+ * Render the final JSX of Skeleton
+ */
+export declare const renderSkeleton_unstable: (state: SkeletonBaseState, contextValues: SkeletonContextValues) => JSXElement;
+
+/**
+ * Render the final JSX of SkeletonItem
+ */
+export declare const renderSkeletonItem_unstable: (state: SkeletonItemBaseState) => JSXElement;
+
+/**
+ * Skeleton component - TODO: add more docs
+ */
+export declare const Skeleton: ForwardRefComponent<SkeletonProps>;
+
+/**
+ * Skeleton base props, excluding design-related props like animation and appearance.
+ */
+export declare type SkeletonBaseProps = Omit<SkeletonProps, 'animation' | 'appearance'>;
+
+/**
+ * Skeleton base state, excluding design-related state like animation and appearance.
+ */
+export declare type SkeletonBaseState = Omit<SkeletonState, 'animation' | 'appearance' | 'size' | 'shape'>;
+
+export declare const skeletonClassNames: SlotClassNames<SkeletonSlots>;
+
+export declare const SkeletonContextProvider: React_2.Provider<SkeletonContextValue | undefined>;
+
+export declare interface SkeletonContextValue {
+    animation?: 'wave' | 'pulse';
+    appearance?: 'opaque' | 'translucent';
+    size?: SkeletonItemSize;
+    shape?: 'circle' | 'square' | 'rectangle';
+}
+
+export declare type SkeletonContextValues = {
+    skeletonGroup: SkeletonContextValue;
+};
+
+export declare const SkeletonItem: ForwardRefComponent<SkeletonItemProps>;
+
+/**
+ * SkeletonItem base props, excluding design-related props like animation, appearance, size, and shape.
+ */
+export declare type SkeletonItemBaseProps = Omit<SkeletonItemProps, 'animation' | 'appearance' | 'size' | 'shape'>;
+
+/**
+ * SkeletonItem base state, excluding design-related state like animation, appearance, size, and shape.
+ */
+export declare type SkeletonItemBaseState = Omit<SkeletonItemState, 'animation' | 'appearance' | 'size' | 'shape'>;
+
+export declare const skeletonItemClassNames: SlotClassNames<SkeletonItemSlots>;
+
+/**
+ * SkeletonItem Props
+ */
+export declare type SkeletonItemProps = ComponentProps<SkeletonItemSlots> & Pick<SkeletonProps, 'size' | 'shape'> & {
+    /**
+     * Sets the animation of the SkeletonItem
+     * @default wave
+     */
+    animation?: 'wave' | 'pulse';
+    /**
+     * Sets the appearance of the SkeletonItem
+     * @default opaque
+     */
+    appearance?: 'opaque' | 'translucent';
+};
+
+/**
+ * Sizes for the SkeletonItem
+ */
+declare type SkeletonItemSize = 8 | 12 | 14 | 16 | 20 | 22 | 24 | 28 | 32 | 36 | 40 | 48 | 52 | 56 | 64 | 72 | 92 | 96 | 120 | 128;
+
+export declare type SkeletonItemSlots = {
+    root: Slot<'div', 'span'>;
+};
+
+/**
+ * State used in rendering SkeletonItem
+ */
+export declare type SkeletonItemState = ComponentState<SkeletonItemSlots> & Required<Pick<SkeletonItemProps, 'animation' | 'appearance' | 'size' | 'shape'>>;
+
+/**
+ * Skeleton Props
+ */
+export declare type SkeletonProps = Omit<ComponentProps<Partial<SkeletonSlots>>, 'width'> & {
+    /**
+     * The animation type for the Skeleton
+     * @defaultValue wave
+     */
+    animation?: 'wave' | 'pulse';
+    /**
+     * Sets the appearance of the Skeleton.
+     * @defaultValue opaque
+     */
+    appearance?: 'opaque' | 'translucent';
+    /**
+     * Sets the width value of the skeleton wrapper.
+     * @defaultValue 100%
+     * @deprecated Use `className` prop to set width
+     */
+    width?: number | string;
+    /**
+     * Sets the size of the SkeletonItems inside the Skeleton in pixels.
+     * Size is restricted to a limited set of values recommended for most uses (see SkeletonItemSize).
+     * This value can be overridden by the individual SkeletonItem's `size` prop.
+     */
+    size?: SkeletonItemSize;
+    /**
+     * Sets the shape of the SkeletonItems inside the Skeleton.
+     * This value can be overridden by the individual SkeletonItem's `shape` prop.
+     */
+    shape?: 'circle' | 'square' | 'rectangle';
+};
+
+export declare type SkeletonSlots = {
+    /**
+     * The root slot of the `Skeleton` is the container that will contain the slots that make up a `Skeleton`
+     * and any data that the `Skeleton` will load. The default html element is a `div`.
+     */
+    root: NonNullable<Slot<'div', 'span'>>;
+};
+
+/**
+ * State used in rendering Skeleton
+ */
+export declare type SkeletonState = ComponentState<SkeletonSlots> & Required<Pick<SkeletonProps, 'animation' | 'appearance'>> & Pick<SkeletonProps, 'size' | 'shape'>;
+
+/**
+ * Create the state required to render Skeleton.
+ *
+ * The returned state can be modified with hooks such as useSkeletonStyles_unstable,
+ * before being passed to renderSkeleton_unstable.
+ *
+ * @param props - props from this instance of Skeleton
+ * @param ref - reference to root HTMLElement of Skeleton
+ */
+export declare const useSkeleton_unstable: (props: SkeletonProps, ref: React_2.Ref<HTMLElement>) => SkeletonState;
+
+/**
+ * Base hook for Skeleton component, which manages state related to slots structure and ARIA attributes.
+ *
+ * @param props - User provided props to the Skeleton component.
+ * @param ref - User provided ref to be passed to the Skeleton component.
+ */
+export declare const useSkeletonBase_unstable: (props: SkeletonBaseProps, ref: React_2.Ref<HTMLDivElement>) => SkeletonBaseState;
+
+export declare const useSkeletonContext: () => SkeletonContextValue;
+
+export declare const useSkeletonContextValues: (state: SkeletonState) => SkeletonContextValues;
+
+/**
+ * Create the state required to render SkeletonItem.
+ *
+ * The returned state can be modified with hooks such as useSkeletonItemStyles_unstable,
+ * before being passed to renderSkeletonItem_unstable.
+ *
+ * @param props - props from this instance of SkeletonItem
+ * @param ref - reference to root HTMLElement of SkeletonItem
+ */
+export declare const useSkeletonItem_unstable: (props: SkeletonItemProps, ref: React_2.Ref<HTMLElement>) => SkeletonItemState;
+
+/**
+ * Base hook for SkeletonItem component, which manages state related to slots structure.
+ *
+ * @param props - User provided props to the SkeletonItem component.
+ * @param ref - User provided ref to be passed to the SkeletonItem component.
+ */
+export declare const useSkeletonItemBase_unstable: (props: SkeletonItemBaseProps, ref: React_2.Ref<HTMLDivElement>) => SkeletonItemBaseState;
+
+/**
+ * Apply styling to the SkeletonItem slots based on the state
+ */
+export declare const useSkeletonItemStyles_unstable: (state: SkeletonItemState) => SkeletonItemState;
+
+/**
+ * Apply styling to the Skeleton slots based on the state
+ */
+export declare const useSkeletonStyles_unstable: (state: SkeletonState) => SkeletonState;
+
+export { }

package/lib/Skeleton.js

@@ -1 +1 @@
-export { Skeleton, renderSkeleton_unstable, skeletonClassNames, useSkeletonContextValues, useSkeletonStyles_unstable, useSkeleton_unstable, useSkeletonBase_unstable } from './components/Skeleton/index';
+export { Skeleton, renderSkeleton_unstable, skeletonClassNames, useSkeletonContextValues, useSkeletonStyles_unstable, useSkeleton_unstable, useSkeletonBase_unstable } from "./components/Skeleton/index.js";

package/lib/Skeleton.js.map

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

package/lib/SkeletonItem.js

@@ -1 +1 @@
-export { SkeletonItem, renderSkeletonItem_unstable, skeletonItemClassNames, useSkeletonItemStyles_unstable, useSkeletonItem_unstable, useSkeletonItemBase_unstable } from './components/SkeletonItem/index';
+export { SkeletonItem, renderSkeletonItem_unstable, skeletonItemClassNames, useSkeletonItemStyles_unstable, useSkeletonItem_unstable, useSkeletonItemBase_unstable } from "./components/SkeletonItem/index.js";

package/lib/SkeletonItem.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/SkeletonItem.ts"],"sourcesContent":["export type {\n  SkeletonItemBaseProps,\n  SkeletonItemBaseState,\n  SkeletonItemProps,\n  SkeletonItemSlots,\n  SkeletonItemState,\n} from './components/SkeletonItem/index';\nexport {\n  SkeletonItem,\n  renderSkeletonItem_unstable,\n  skeletonItemClassNames,\n  useSkeletonItemStyles_unstable,\n  useSkeletonItem_unstable,\n  useSkeletonItemBase_unstable,\n} from './components/SkeletonItem/index';\n"],"names":["SkeletonItem","renderSkeletonItem_unstable","skeletonItemClassNames","useSkeletonItemStyles_unstable","useSkeletonItem_unstable","useSkeletonItemBase_unstable"],"mappings":"AAOA,SACEA,YAAY,EACZC,2BAA2B,EAC3BC,sBAAsB,EACtBC,8BAA8B,EAC9BC,wBAAwB,EACxBC,4BAA4B,QACvB,kCAAkC"}
+{"version":3,"sources":["../src/SkeletonItem.ts"],"sourcesContent":["export type {\n  SkeletonItemBaseProps,\n  SkeletonItemBaseState,\n  SkeletonItemProps,\n  SkeletonItemSlots,\n  SkeletonItemState,\n} from './components/SkeletonItem/index';\nexport {\n  SkeletonItem,\n  renderSkeletonItem_unstable,\n  skeletonItemClassNames,\n  useSkeletonItemStyles_unstable,\n  useSkeletonItem_unstable,\n  useSkeletonItemBase_unstable,\n} from './components/SkeletonItem/index';\n"],"names":["SkeletonItem","renderSkeletonItem_unstable","skeletonItemClassNames","useSkeletonItemStyles_unstable","useSkeletonItem_unstable","useSkeletonItemBase_unstable"],"mappings":"AAOA,SACEA,YAAY,EACZC,2BAA2B,EAC3BC,sBAAsB,EACtBC,8BAA8B,EAC9BC,wBAAwB,EACxBC,4BAA4B,QACvB,qCAAkC"}

package/lib/components/Skeleton/Skeleton.js

@@ -1,10 +1,10 @@
 'use client';
-import * as React from 'react';
-import { useSkeleton_unstable } from './useSkeleton';
-import { renderSkeleton_unstable } from './renderSkeleton';
-import { useSkeletonStyles_unstable } from './useSkeletonStyles.styles';
-import { useSkeletonContextValues } from './useSkeletonContextValues';
-import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
+import * as React from "react";
+import { useSkeleton_unstable } from "./useSkeleton.js";
+import { renderSkeleton_unstable } from "./renderSkeleton.js";
+import { useSkeletonStyles_unstable } from "./useSkeletonStyles.styles.js";
+import { useSkeletonContextValues } from "./useSkeletonContextValues.js";
+import { useCustomStyleHook_unstable } from "@fluentui/react-shared-contexts";
 /**
  * Skeleton component - TODO: add more docs
  */ export const Skeleton = /*#__PURE__*/ React.forwardRef((props, ref)=>{

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Skeleton/Skeleton.tsx"],"sourcesContent":["'use client';\n\nimport * 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;AAEA,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"}
+{"version":3,"sources":["../src/components/Skeleton/Skeleton.tsx"],"sourcesContent":["'use client';\n\nimport * 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;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,oBAAoB,QAAQ,mBAAgB;AACrD,SAASC,uBAAuB,QAAQ,sBAAmB;AAC3D,SAASC,0BAA0B,QAAQ,gCAA6B;AACxE,SAASC,wBAAwB,QAAQ,gCAA6B;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/index.js

@@ -1,5 +1,5 @@
-export { Skeleton } from './Skeleton';
-export { renderSkeleton_unstable } from './renderSkeleton';
-export { useSkeleton_unstable, useSkeletonBase_unstable } from './useSkeleton';
-export { useSkeletonContextValues } from './useSkeletonContextValues';
-export { skeletonClassNames, useSkeletonStyles_unstable } from './useSkeletonStyles.styles';
+export { Skeleton } from "./Skeleton.js";
+export { renderSkeleton_unstable } from "./renderSkeleton.js";
+export { useSkeleton_unstable, useSkeletonBase_unstable } from "./useSkeleton.js";
+export { useSkeletonContextValues } from "./useSkeletonContextValues.js";
+export { skeletonClassNames, useSkeletonStyles_unstable } from "./useSkeletonStyles.styles.js";

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

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

package/lib/components/Skeleton/renderSkeleton.js

@@ -1,6 +1,6 @@
   import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
-import { assertSlots } from '@fluentui/react-utilities';
-import { SkeletonContextProvider } from '../../contexts/SkeletonContext';
+import { assertSlots } from "@fluentui/react-utilities";
+import { SkeletonContextProvider } from "../../contexts/SkeletonContext.js";
 /**
  * Render the final JSX of Skeleton
  */ export const renderSkeleton_unstable = (state, contextValues)=>{

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Skeleton/renderSkeleton.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { SkeletonContextProvider } from '../../contexts/SkeletonContext';\nimport type { SkeletonContextValues, SkeletonSlots, SkeletonBaseState } from './Skeleton.types';\n\n/**\n * Render the final JSX of Skeleton\n */\nexport const renderSkeleton_unstable = (state: SkeletonBaseState, contextValues: SkeletonContextValues): JSXElement => {\n  assertSlots<SkeletonSlots>(state);\n\n  return (\n    <SkeletonContextProvider value={contextValues.skeletonGroup}>\n      <state.root />\n    </SkeletonContextProvider>\n  );\n};\n"],"names":["assertSlots","SkeletonContextProvider","renderSkeleton_unstable","state","contextValues","value","skeletonGroup","root"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAExD,SAASC,uBAAuB,QAAQ,iCAAiC;AAGzE;;CAEC,GACD,OAAO,MAAMC,0BAA0B,CAACC,OAA0BC;IAChEJ,YAA2BG;IAE3B,qBACE,KAACF;QAAwBI,OAAOD,cAAcE,aAAa;kBACzD,cAAA,KAACH,MAAMI,IAAI;;AAGjB,EAAE"}
+{"version":3,"sources":["../src/components/Skeleton/renderSkeleton.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { SkeletonContextProvider } from '../../contexts/SkeletonContext';\nimport type { SkeletonContextValues, SkeletonSlots, SkeletonBaseState } from './Skeleton.types';\n\n/**\n * Render the final JSX of Skeleton\n */\nexport const renderSkeleton_unstable = (state: SkeletonBaseState, contextValues: SkeletonContextValues): JSXElement => {\n  assertSlots<SkeletonSlots>(state);\n\n  return (\n    <SkeletonContextProvider value={contextValues.skeletonGroup}>\n      <state.root />\n    </SkeletonContextProvider>\n  );\n};\n"],"names":["assertSlots","SkeletonContextProvider","renderSkeleton_unstable","state","contextValues","value","skeletonGroup","root"],"mappings":"AAAA,0BAA0B,GAC1B,iDAAiD;AAEjD,SAASA,WAAW,QAAQ,4BAA4B;AAExD,SAASC,uBAAuB,QAAQ,oCAAiC;AAGzE;;CAEC,GACD,OAAO,MAAMC,0BAA0B,CAACC,OAA0BC;IAChEJ,YAA2BG;IAE3B,qBACE,KAACF;QAAwBI,OAAOD,cAAcE,aAAa;kBACzD,cAAA,KAACH,MAAMI,IAAI;;AAGjB,EAAE"}

package/lib/components/Skeleton/useSkeleton.js

@@ -1,6 +1,6 @@
 'use client';
-import { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';
-import { useSkeletonContext } from '../../contexts/SkeletonContext';
+import { getIntrinsicElementProps, slot } from "@fluentui/react-utilities";
+import { useSkeletonContext } from "../../contexts/SkeletonContext.js";
 /**
  * Create the state required to render Skeleton.
  *

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Skeleton/useSkeleton.ts"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { SkeletonBaseProps, SkeletonBaseState, SkeletonProps, SkeletonState } from './Skeleton.types';\nimport { useSkeletonContext } from '../../contexts/SkeletonContext';\n\n/**\n * Create the state required to render Skeleton.\n *\n * The returned state can be modified with hooks such as useSkeletonStyles_unstable,\n * before being passed to renderSkeleton_unstable.\n *\n * @param props - props from this instance of Skeleton\n * @param ref - reference to root HTMLElement of Skeleton\n */\nexport const useSkeleton_unstable = (props: SkeletonProps, ref: React.Ref<HTMLElement>): SkeletonState => {\n  const { animation: contextAnimation, appearance: contextAppearance } = useSkeletonContext();\n  const {\n    animation = contextAnimation ?? 'wave',\n    appearance = contextAppearance ?? 'opaque',\n    size,\n    shape,\n    ...baseProps\n  } = props;\n\n  const baseState = useSkeletonBase_unstable(baseProps, ref as React.Ref<HTMLDivElement>);\n\n  return {\n    ...baseState,\n    animation,\n    appearance,\n    size,\n    shape,\n  };\n};\n\n/**\n * Base hook for Skeleton component, which manages state related to slots structure and ARIA attributes.\n *\n * @param props - User provided props to the Skeleton component.\n * @param ref - User provided ref to be passed to the Skeleton component.\n */\nexport const useSkeletonBase_unstable = (\n  props: SkeletonBaseProps,\n  ref: React.Ref<HTMLDivElement>,\n): SkeletonBaseState => {\n  const root = slot.always(\n    getIntrinsicElementProps('div', {\n      ref,\n      role: 'progressbar',\n      'aria-busy': true,\n      ...props,\n    }),\n    { elementType: 'div' },\n  );\n  return { components: { root: 'div' }, root };\n};\n"],"names":["getIntrinsicElementProps","slot","useSkeletonContext","useSkeleton_unstable","props","ref","animation","contextAnimation","appearance","contextAppearance","size","shape","baseProps","baseState","useSkeletonBase_unstable","root","always","role","elementType","components"],"mappings":"AAAA;AAGA,SAASA,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAE3E,SAASC,kBAAkB,QAAQ,iCAAiC;AAEpE;;;;;;;;CAQC,GACD,OAAO,MAAMC,uBAAuB,CAACC,OAAsBC;IACzD,MAAM,EAAEC,WAAWC,gBAAgB,EAAEC,YAAYC,iBAAiB,EAAE,GAAGP;IACvE,MAAM,EACJI,YAAYC,6BAAAA,8BAAAA,mBAAoB,MAAM,EACtCC,aAAaC,8BAAAA,+BAAAA,oBAAqB,QAAQ,EAC1CC,IAAI,EACJC,KAAK,EACL,GAAGC,WACJ,GAAGR;IAEJ,MAAMS,YAAYC,yBAAyBF,WAAWP;IAEtD,OAAO;QACL,GAAGQ,SAAS;QACZP;QACAE;QACAE;QACAC;IACF;AACF,EAAE;AAEF;;;;;CAKC,GACD,OAAO,MAAMG,2BAA2B,CACtCV,OACAC;IAEA,MAAMU,OAAOd,KAAKe,MAAM,CACtBhB,yBAAyB,OAAO;QAC9BK;QACAY,MAAM;QACN,aAAa;QACb,GAAGb,KAAK;IACV,IACA;QAAEc,aAAa;IAAM;IAEvB,OAAO;QAAEC,YAAY;YAAEJ,MAAM;QAAM;QAAGA;IAAK;AAC7C,EAAE"}
+{"version":3,"sources":["../src/components/Skeleton/useSkeleton.ts"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { SkeletonBaseProps, SkeletonBaseState, SkeletonProps, SkeletonState } from './Skeleton.types';\nimport { useSkeletonContext } from '../../contexts/SkeletonContext';\n\n/**\n * Create the state required to render Skeleton.\n *\n * The returned state can be modified with hooks such as useSkeletonStyles_unstable,\n * before being passed to renderSkeleton_unstable.\n *\n * @param props - props from this instance of Skeleton\n * @param ref - reference to root HTMLElement of Skeleton\n */\nexport const useSkeleton_unstable = (props: SkeletonProps, ref: React.Ref<HTMLElement>): SkeletonState => {\n  const { animation: contextAnimation, appearance: contextAppearance } = useSkeletonContext();\n  const {\n    animation = contextAnimation ?? 'wave',\n    appearance = contextAppearance ?? 'opaque',\n    size,\n    shape,\n    ...baseProps\n  } = props;\n\n  const baseState = useSkeletonBase_unstable(baseProps, ref as React.Ref<HTMLDivElement>);\n\n  return {\n    ...baseState,\n    animation,\n    appearance,\n    size,\n    shape,\n  };\n};\n\n/**\n * Base hook for Skeleton component, which manages state related to slots structure and ARIA attributes.\n *\n * @param props - User provided props to the Skeleton component.\n * @param ref - User provided ref to be passed to the Skeleton component.\n */\nexport const useSkeletonBase_unstable = (\n  props: SkeletonBaseProps,\n  ref: React.Ref<HTMLDivElement>,\n): SkeletonBaseState => {\n  const root = slot.always(\n    getIntrinsicElementProps('div', {\n      ref,\n      role: 'progressbar',\n      'aria-busy': true,\n      ...props,\n    }),\n    { elementType: 'div' },\n  );\n  return { components: { root: 'div' }, root };\n};\n"],"names":["getIntrinsicElementProps","slot","useSkeletonContext","useSkeleton_unstable","props","ref","animation","contextAnimation","appearance","contextAppearance","size","shape","baseProps","baseState","useSkeletonBase_unstable","root","always","role","elementType","components"],"mappings":"AAAA;AAGA,SAASA,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAE3E,SAASC,kBAAkB,QAAQ,oCAAiC;AAEpE;;;;;;;;CAQC,GACD,OAAO,MAAMC,uBAAuB,CAACC,OAAsBC;IACzD,MAAM,EAAEC,WAAWC,gBAAgB,EAAEC,YAAYC,iBAAiB,EAAE,GAAGP;IACvE,MAAM,EACJI,YAAYC,6BAAAA,8BAAAA,mBAAoB,MAAM,EACtCC,aAAaC,8BAAAA,+BAAAA,oBAAqB,QAAQ,EAC1CC,IAAI,EACJC,KAAK,EACL,GAAGC,WACJ,GAAGR;IAEJ,MAAMS,YAAYC,yBAAyBF,WAAWP;IAEtD,OAAO;QACL,GAAGQ,SAAS;QACZP;QACAE;QACAE;QACAC;IACF;AACF,EAAE;AAEF;;;;;CAKC,GACD,OAAO,MAAMG,2BAA2B,CACtCV,OACAC;IAEA,MAAMU,OAAOd,KAAKe,MAAM,CACtBhB,yBAAyB,OAAO;QAC9BK;QACAY,MAAM;QACN,aAAa;QACb,GAAGb,KAAK;IACV,IACA;QAAEc,aAAa;IAAM;IAEvB,OAAO;QAAEC,YAAY;YAAEJ,MAAM;QAAM;QAAGA;IAAK;AAC7C,EAAE"}

package/lib/components/Skeleton/useSkeletonContextValues.js

@@ -1,5 +1,5 @@
 'use client';
-import * as React from 'react';
+import * as React from "react";
 export const useSkeletonContextValues = (state)=>{
     const { animation, appearance, size, shape } = state;
     const skeletonGroup = React.useMemo(()=>({

package/lib/components/Skeleton/useSkeletonStyles.styles.js

@@ -1,6 +1,6 @@
 'use client';
 
-import { __styles, mergeClasses } from '@griffel/react';
+import { __styles, mergeClasses } from "@griffel/react";
 export const skeletonClassNames = {
   root: 'fui-Skeleton'
 };

package/lib/components/Skeleton/useSkeletonStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["__styles","mergeClasses","skeletonClassNames","root","useStyles","blockStyling","mc9l5x","d","useSkeletonStyles_unstable","state","styles","className","as"],"sources":["useSkeletonStyles.styles.js"],"sourcesContent":["'use client';\nimport { 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    const styles = useStyles();\n    // eslint-disable-next-line react-hooks/immutability\n    state.root.className = mergeClasses(skeletonClassNames.root, state.root.as === 'span' && styles.blockStyling, state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,OAAO,MAAMC,kBAAkB,GAAG;EAC9BC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,gBAAGJ,QAAA;EAAAK,YAAA;IAAAC,MAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAIjB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,0BAA0B,GAAIC,KAAK,IAAG;EACnD,MAAMC,MAAM,GAAGN,SAAS,CAAC,CAAC;EAC1B;EACAK,KAAK,CAACN,IAAI,CAACQ,SAAS,GAAGV,YAAY,CAACC,kBAAkB,CAACC,IAAI,EAAEM,KAAK,CAACN,IAAI,CAACS,EAAE,KAAK,MAAM,IAAIF,MAAM,CAACL,YAAY,EAAEI,KAAK,CAACN,IAAI,CAACQ,SAAS,CAAC;EACnI,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}
+{"version":3,"names":["__styles","mergeClasses","skeletonClassNames","root","useStyles","blockStyling","mc9l5x","d","useSkeletonStyles_unstable","state","styles","className","as"],"sources":["useSkeletonStyles.styles.js"],"sourcesContent":["'use client';\nimport { 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    const styles = useStyles();\n    // eslint-disable-next-line react-hooks/immutability\n    state.root.className = mergeClasses(skeletonClassNames.root, state.root.as === 'span' && styles.blockStyling, state.root.className);\n    return state;\n};\n"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,OAAO,MAAMC,kBAAkB,GAAG;EAC9BC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,SAAS,gBAAGJ,QAAA;EAAAK,YAAA;IAAAC,MAAA;EAAA;AAAA;EAAAC,CAAA;AAAA,CAIjB,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMC,0BAA0B,GAAIC,KAAK,IAAG;EACnD,MAAMC,MAAM,GAAGN,SAAS,CAAC,CAAC;EAC1B;EACAK,KAAK,CAACN,IAAI,CAACQ,SAAS,GAAGV,YAAY,CAACC,kBAAkB,CAACC,IAAI,EAAEM,KAAK,CAACN,IAAI,CAACS,EAAE,KAAK,MAAM,IAAIF,MAAM,CAACL,YAAY,EAAEI,KAAK,CAACN,IAAI,CAACQ,SAAS,CAAC;EACnI,OAAOF,KAAK;AAChB,CAAC","ignoreList":[]}

package/lib/components/Skeleton/useSkeletonStyles.styles.raw.js

@@ -1,5 +1,5 @@
 'use client';
-import { makeStyles, mergeClasses } from '@griffel/react';
+import { makeStyles, mergeClasses } from "@griffel/react";
 export const skeletonClassNames = {
     root: 'fui-Skeleton'
 };

package/lib/components/SkeletonItem/SkeletonItem.js

@@ -1,9 +1,9 @@
 'use client';
-import * as React from 'react';
-import { useSkeletonItem_unstable } from './useSkeletonItem';
-import { renderSkeletonItem_unstable } from './renderSkeletonItem';
-import { useSkeletonItemStyles_unstable } from './useSkeletonItemStyles.styles';
-import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
+import * as React from "react";
+import { useSkeletonItem_unstable } from "./useSkeletonItem.js";
+import { renderSkeletonItem_unstable } from "./renderSkeletonItem.js";
+import { useSkeletonItemStyles_unstable } from "./useSkeletonItemStyles.styles.js";
+import { useCustomStyleHook_unstable } from "@fluentui/react-shared-contexts";
 export const SkeletonItem = /*#__PURE__*/ React.forwardRef((props, ref)=>{
     const state = useSkeletonItem_unstable(props, ref);
     useSkeletonItemStyles_unstable(state);

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/SkeletonItem/SkeletonItem.tsx"],"sourcesContent":["'use client';\n\nimport * 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;AAEA,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"}
+{"version":3,"sources":["../src/components/SkeletonItem/SkeletonItem.tsx"],"sourcesContent":["'use client';\n\nimport * 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;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,wBAAwB,QAAQ,uBAAoB;AAC7D,SAASC,2BAA2B,QAAQ,0BAAuB;AACnE,SAASC,8BAA8B,QAAQ,oCAAiC;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/index.js

@@ -1,4 +1,4 @@
-export { SkeletonItem } from './SkeletonItem';
-export { renderSkeletonItem_unstable } from './renderSkeletonItem';
-export { useSkeletonItem_unstable, useSkeletonItemBase_unstable } from './useSkeletonItem';
-export { skeletonItemClassNames, useSkeletonItemStyles_unstable } from './useSkeletonItemStyles.styles';
+export { SkeletonItem } from "./SkeletonItem.js";
+export { renderSkeletonItem_unstable } from "./renderSkeletonItem.js";
+export { useSkeletonItem_unstable, useSkeletonItemBase_unstable } from "./useSkeletonItem.js";
+export { skeletonItemClassNames, useSkeletonItemStyles_unstable } from "./useSkeletonItemStyles.styles.js";

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/SkeletonItem/index.ts"],"sourcesContent":["export { SkeletonItem } from './SkeletonItem';\nexport type {\n  SkeletonItemBaseProps,\n  SkeletonItemBaseState,\n  SkeletonItemProps,\n  SkeletonItemSlots,\n  SkeletonItemState,\n} from './SkeletonItem.types';\nexport { renderSkeletonItem_unstable } from './renderSkeletonItem';\nexport { useSkeletonItem_unstable, useSkeletonItemBase_unstable } from './useSkeletonItem';\nexport { skeletonItemClassNames, useSkeletonItemStyles_unstable } from './useSkeletonItemStyles.styles';\n"],"names":["SkeletonItem","renderSkeletonItem_unstable","useSkeletonItem_unstable","useSkeletonItemBase_unstable","skeletonItemClassNames","useSkeletonItemStyles_unstable"],"mappings":"AAAA,SAASA,YAAY,QAAQ,iBAAiB;AAQ9C,SAASC,2BAA2B,QAAQ,uBAAuB;AACnE,SAASC,wBAAwB,EAAEC,4BAA4B,QAAQ,oBAAoB;AAC3F,SAASC,sBAAsB,EAAEC,8BAA8B,QAAQ,iCAAiC"}
+{"version":3,"sources":["../src/components/SkeletonItem/index.ts"],"sourcesContent":["export { SkeletonItem } from './SkeletonItem';\nexport type {\n  SkeletonItemBaseProps,\n  SkeletonItemBaseState,\n  SkeletonItemProps,\n  SkeletonItemSlots,\n  SkeletonItemState,\n} from './SkeletonItem.types';\nexport { renderSkeletonItem_unstable } from './renderSkeletonItem';\nexport { useSkeletonItem_unstable, useSkeletonItemBase_unstable } from './useSkeletonItem';\nexport { skeletonItemClassNames, useSkeletonItemStyles_unstable } from './useSkeletonItemStyles.styles';\n"],"names":["SkeletonItem","renderSkeletonItem_unstable","useSkeletonItem_unstable","useSkeletonItemBase_unstable","skeletonItemClassNames","useSkeletonItemStyles_unstable"],"mappings":"AAAA,SAASA,YAAY,QAAQ,oBAAiB;AAQ9C,SAASC,2BAA2B,QAAQ,0BAAuB;AACnE,SAASC,wBAAwB,EAAEC,4BAA4B,QAAQ,uBAAoB;AAC3F,SAASC,sBAAsB,EAAEC,8BAA8B,QAAQ,oCAAiC"}

package/lib/components/SkeletonItem/renderSkeletonItem.js

@@ -1,5 +1,5 @@
   import { jsx as _jsx } from "@fluentui/react-jsx-runtime/jsx-runtime";
-import { assertSlots } from '@fluentui/react-utilities';
+import { assertSlots } from "@fluentui/react-utilities";
 /**
  * Render the final JSX of SkeletonItem
  */ export const renderSkeletonItem_unstable = (state)=>{

package/lib/components/SkeletonItem/useSkeletonItem.js

@@ -1,6 +1,6 @@
 'use client';
-import { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';
-import { useSkeletonContext } from '../../contexts/SkeletonContext';
+import { getIntrinsicElementProps, slot } from "@fluentui/react-utilities";
+import { useSkeletonContext } from "../../contexts/SkeletonContext.js";
 /**
  * Create the state required to render SkeletonItem.
  *

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/SkeletonItem/useSkeletonItem.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { useSkeletonContext } from '../../contexts/SkeletonContext';\nimport type {\n  SkeletonItemBaseProps,\n  SkeletonItemBaseState,\n  SkeletonItemProps,\n  SkeletonItemState,\n} from './SkeletonItem.types';\n\n/**\n * Create the state required to render SkeletonItem.\n *\n * The returned state can be modified with hooks such as useSkeletonItemStyles_unstable,\n * before being passed to renderSkeletonItem_unstable.\n *\n * @param props - props from this instance of SkeletonItem\n * @param ref - reference to root HTMLElement of SkeletonItem\n */\nexport const useSkeletonItem_unstable = (props: SkeletonItemProps, ref: React.Ref<HTMLElement>): SkeletonItemState => {\n  const {\n    animation: contextAnimation,\n    appearance: contextAppearance,\n    size: contextSize,\n    shape: contextShape,\n  } = useSkeletonContext();\n  const {\n    animation = contextAnimation ?? 'wave',\n    appearance = contextAppearance ?? 'opaque',\n    size = contextSize ?? 16,\n    shape = contextShape ?? 'rectangle',\n    ...baseProps\n  } = props;\n\n  const baseState = useSkeletonItemBase_unstable(baseProps, ref as React.Ref<HTMLDivElement>);\n\n  return {\n    ...baseState,\n    animation,\n    appearance,\n    size,\n    shape,\n  };\n};\n\n/**\n * Base hook for SkeletonItem component, which manages state related to slots structure.\n *\n * @param props - User provided props to the SkeletonItem component.\n * @param ref - User provided ref to be passed to the SkeletonItem component.\n */\nexport const useSkeletonItemBase_unstable = (\n  props: SkeletonItemBaseProps,\n  ref: React.Ref<HTMLDivElement>,\n): SkeletonItemBaseState => {\n  const root = slot.always(\n    getIntrinsicElementProps('div', {\n      ref,\n      ...props,\n    }),\n    { elementType: 'div' },\n  );\n  return { components: { root: 'div' }, root };\n};\n"],"names":["getIntrinsicElementProps","slot","useSkeletonContext","useSkeletonItem_unstable","props","ref","animation","contextAnimation","appearance","contextAppearance","size","contextSize","shape","contextShape","baseProps","baseState","useSkeletonItemBase_unstable","root","always","elementType","components"],"mappings":"AAAA;AAGA,SAASA,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAC3E,SAASC,kBAAkB,QAAQ,iCAAiC;AAQpE;;;;;;;;CAQC,GACD,OAAO,MAAMC,2BAA2B,CAACC,OAA0BC;IACjE,MAAM,EACJC,WAAWC,gBAAgB,EAC3BC,YAAYC,iBAAiB,EAC7BC,MAAMC,WAAW,EACjBC,OAAOC,YAAY,EACpB,GAAGX;IACJ,MAAM,EACJI,YAAYC,6BAAAA,8BAAAA,mBAAoB,MAAM,EACtCC,aAAaC,8BAAAA,+BAAAA,oBAAqB,QAAQ,EAC1CC,OAAOC,wBAAAA,yBAAAA,cAAe,EAAE,EACxBC,QAAQC,yBAAAA,0BAAAA,eAAgB,WAAW,EACnC,GAAGC,WACJ,GAAGV;IAEJ,MAAMW,YAAYC,6BAA6BF,WAAWT;IAE1D,OAAO;QACL,GAAGU,SAAS;QACZT;QACAE;QACAE;QACAE;IACF;AACF,EAAE;AAEF;;;;;CAKC,GACD,OAAO,MAAMI,+BAA+B,CAC1CZ,OACAC;IAEA,MAAMY,OAAOhB,KAAKiB,MAAM,CACtBlB,yBAAyB,OAAO;QAC9BK;QACA,GAAGD,KAAK;IACV,IACA;QAAEe,aAAa;IAAM;IAEvB,OAAO;QAAEC,YAAY;YAAEH,MAAM;QAAM;QAAGA;IAAK;AAC7C,EAAE"}
+{"version":3,"sources":["../src/components/SkeletonItem/useSkeletonItem.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { useSkeletonContext } from '../../contexts/SkeletonContext';\nimport type {\n  SkeletonItemBaseProps,\n  SkeletonItemBaseState,\n  SkeletonItemProps,\n  SkeletonItemState,\n} from './SkeletonItem.types';\n\n/**\n * Create the state required to render SkeletonItem.\n *\n * The returned state can be modified with hooks such as useSkeletonItemStyles_unstable,\n * before being passed to renderSkeletonItem_unstable.\n *\n * @param props - props from this instance of SkeletonItem\n * @param ref - reference to root HTMLElement of SkeletonItem\n */\nexport const useSkeletonItem_unstable = (props: SkeletonItemProps, ref: React.Ref<HTMLElement>): SkeletonItemState => {\n  const {\n    animation: contextAnimation,\n    appearance: contextAppearance,\n    size: contextSize,\n    shape: contextShape,\n  } = useSkeletonContext();\n  const {\n    animation = contextAnimation ?? 'wave',\n    appearance = contextAppearance ?? 'opaque',\n    size = contextSize ?? 16,\n    shape = contextShape ?? 'rectangle',\n    ...baseProps\n  } = props;\n\n  const baseState = useSkeletonItemBase_unstable(baseProps, ref as React.Ref<HTMLDivElement>);\n\n  return {\n    ...baseState,\n    animation,\n    appearance,\n    size,\n    shape,\n  };\n};\n\n/**\n * Base hook for SkeletonItem component, which manages state related to slots structure.\n *\n * @param props - User provided props to the SkeletonItem component.\n * @param ref - User provided ref to be passed to the SkeletonItem component.\n */\nexport const useSkeletonItemBase_unstable = (\n  props: SkeletonItemBaseProps,\n  ref: React.Ref<HTMLDivElement>,\n): SkeletonItemBaseState => {\n  const root = slot.always(\n    getIntrinsicElementProps('div', {\n      ref,\n      ...props,\n    }),\n    { elementType: 'div' },\n  );\n  return { components: { root: 'div' }, root };\n};\n"],"names":["getIntrinsicElementProps","slot","useSkeletonContext","useSkeletonItem_unstable","props","ref","animation","contextAnimation","appearance","contextAppearance","size","contextSize","shape","contextShape","baseProps","baseState","useSkeletonItemBase_unstable","root","always","elementType","components"],"mappings":"AAAA;AAGA,SAASA,wBAAwB,EAAEC,IAAI,QAAQ,4BAA4B;AAC3E,SAASC,kBAAkB,QAAQ,oCAAiC;AAQpE;;;;;;;;CAQC,GACD,OAAO,MAAMC,2BAA2B,CAACC,OAA0BC;IACjE,MAAM,EACJC,WAAWC,gBAAgB,EAC3BC,YAAYC,iBAAiB,EAC7BC,MAAMC,WAAW,EACjBC,OAAOC,YAAY,EACpB,GAAGX;IACJ,MAAM,EACJI,YAAYC,6BAAAA,8BAAAA,mBAAoB,MAAM,EACtCC,aAAaC,8BAAAA,+BAAAA,oBAAqB,QAAQ,EAC1CC,OAAOC,wBAAAA,yBAAAA,cAAe,EAAE,EACxBC,QAAQC,yBAAAA,0BAAAA,eAAgB,WAAW,EACnC,GAAGC,WACJ,GAAGV;IAEJ,MAAMW,YAAYC,6BAA6BF,WAAWT;IAE1D,OAAO;QACL,GAAGU,SAAS;QACZT;QACAE;QACAE;QACAE;IACF;AACF,EAAE;AAEF;;;;;CAKC,GACD,OAAO,MAAMI,+BAA+B,CAC1CZ,OACAC;IAEA,MAAMY,OAAOhB,KAAKiB,MAAM,CACtBlB,yBAAyB,OAAO;QAC9BK;QACA,GAAGD,KAAK;IACV,IACA;QAAEe,aAAa;IAAM;IAEvB,OAAO;QAAEC,YAAY;YAAEH,MAAM;QAAM;QAAGA;IAAK;AAC7C,EAAE"}

package/lib/components/SkeletonItem/useSkeletonItemStyles.styles.js

@@ -1,7 +1,7 @@
 'use client';
 
-import { __styles, mergeClasses } from '@griffel/react';
-import { tokens } from '@fluentui/react-theme';
+import { __styles, mergeClasses } from "@griffel/react";
+import { tokens } from "@fluentui/react-theme";
 export const skeletonItemClassNames = {
   root: 'fui-SkeletonItem'
 };

package/lib/components/SkeletonItem/useSkeletonItemStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"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","Gt9ir8","Crt7la","wave","De3pzq","Br128sd","h62rwi","b1kco5","Iqrfzq","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"],"sources":["useSkeletonItemStyles.styles.js"],"sourcesContent":["'use client';\nimport { 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    14: {\n        height: '14px'\n    },\n    16: {\n        height: '16px'\n    },\n    20: {\n        height: '20px'\n    },\n    22: {\n        height: '22px'\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    52: {\n        height: '52px'\n    },\n    56: {\n        height: '56px'\n    },\n    64: {\n        height: '64px'\n    },\n    72: {\n        height: '72px'\n    },\n    92: {\n        height: '92px'\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    14: {\n        width: '14px',\n        height: '14px'\n    },\n    16: {\n        width: '16px',\n        height: '16px'\n    },\n    20: {\n        width: '20px',\n        height: '20px'\n    },\n    22: {\n        width: '22px',\n        height: '22px'\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    52: {\n        width: '52px',\n        height: '52px'\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    92: {\n        width: '92px',\n        height: '92px'\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    const { animation, appearance, size, shape } = state;\n    const rootStyles = useStyles();\n    const rectStyles = useRectangleStyles();\n    const sizeStyles = useSizeStyles();\n    const circleStyles = useCircleSizeStyles();\n    // eslint-disable-next-line react-hooks/immutability\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"],"mappings":"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","ignoreList":[]}
+{"version":3,"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","Gt9ir8","Crt7la","wave","De3pzq","Br128sd","h62rwi","b1kco5","Iqrfzq","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"],"sources":["useSkeletonItemStyles.styles.js"],"sourcesContent":["'use client';\nimport { 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    14: {\n        height: '14px'\n    },\n    16: {\n        height: '16px'\n    },\n    20: {\n        height: '20px'\n    },\n    22: {\n        height: '22px'\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    52: {\n        height: '52px'\n    },\n    56: {\n        height: '56px'\n    },\n    64: {\n        height: '64px'\n    },\n    72: {\n        height: '72px'\n    },\n    92: {\n        height: '92px'\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    14: {\n        width: '14px',\n        height: '14px'\n    },\n    16: {\n        width: '16px',\n        height: '16px'\n    },\n    20: {\n        width: '20px',\n        height: '20px'\n    },\n    22: {\n        width: '22px',\n        height: '22px'\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    52: {\n        width: '52px',\n        height: '52px'\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    92: {\n        width: '92px',\n        height: '92px'\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    const { animation, appearance, size, shape } = state;\n    const rootStyles = useStyles();\n    const rectStyles = useRectangleStyles();\n    const sizeStyles = useSizeStyles();\n    const circleStyles = useCircleSizeStyles();\n    // eslint-disable-next-line react-hooks/immutability\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"],"mappings":"AAAA,YAAY;;AACZ,SAAAA,QAAA,EAAqBC,YAAY,QAAQ,gBAAgB;AACzD,SAASC,MAAM,QAAQ,uBAAuB;AAC9C,OAAO,MAAMC,sBAAsB,GAAG;EAClCC,IAAI,EAAE;AACV,CAAC;AACD,MAAMC,qBAAqB,GAAG;EAC1BC,EAAE,EAAE;IACAC,SAAS,EAAE;EACf;AACJ,CAAC;AACD,MAAMC,sBAAsB,GAAG;EAC3B,IAAI,EAAE;IACFC,OAAO,EAAE;EACb,CAAC;EACD,KAAK,EAAE;IACHA,OAAO,EAAE;EACb,CAAC;EACD,MAAM,EAAE;IACJA,OAAO,EAAE;EACb;AACJ,CAAC;AACD;AACA;AACA;AAAI,MAAMC,SAAS,gBAAGV,QAAA;EAAAI,IAAA;IAAAO,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;EAAA;EAAAC,IAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;EAAA;EAAAC,KAAA;IAAAJ,OAAA;IAAAN,MAAA;IAAAW,OAAA;EAAA;EAAAC,WAAA;IAAAP,MAAA;IAAAE,MAAA;EAAA;EAAAM,gBAAA;IAAAR,MAAA;IAAAM,OAAA;EAAA;EAAAG,YAAA;IAAAC,MAAA;EAAA;AAAA;EAAAC,CAAA;IAAAC,CAAA;EAAA;IAAAA,CAAA;EAAA;EAAAC,CAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;EAAAC,CAAA;AAAA,CA2DrB,CAAC;AACF,MAAMC,kBAAkB,gBAAG5C,QAAA;EAAA;IAAA6C,OAAA;EAAA;EAAA;IAAAA,OAAA;EAAA;EAAA;IAAAA,OAAA;EAAA;EAAA;IAAAA,OAAA;EAAA;EAAA;IAAAA,OAAA;EAAA;EAAA;IAAAA,OAAA;EAAA;EAAA;IAAAA,OAAA;EAAA;EAAA;IAAAA,OAAA;EAAA;EAAA;IAAAA,OAAA;EAAA;EAAA;IAAAA,OAAA;EAAA;EAAA;IAAAA,OAAA;EAAA;EAAA;IAAAA,OAAA;EAAA;EAAA;IAAAA,OAAA;EAAA;EAAA;IAAAA,OAAA;EAAA;EAAA;IAAAA,OAAA;EAAA;EAAA;IAAAA,OAAA;EAAA;EAAA;IAAAA,OAAA;EAAA;EAAA;IAAAA,OAAA;EAAA;EAAA;IAAAA,OAAA;EAAA;EAAA;IAAAA,OAAA;EAAA;EAAAzC,IAAA;IAAA0C,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;AAAA;EAAAX,CAAA;IAAAC,CAAA;EAAA;AAAA,CAiE1B,CAAC;AACF,MAAMW,aAAa,gBAAGpD,QAAA;EAAA;IAAA8C,MAAA;IAAAD,OAAA;EAAA;EAAA;IAAAC,MAAA;IAAAD,OAAA;EAAA;EAAA;IAAAC,MAAA;IAAAD,OAAA;EAAA;EAAA;IAAAC,MAAA;IAAAD,OAAA;EAAA;EAAA;IAAAC,MAAA;IAAAD,OAAA;EAAA;EAAA;IAAAC,MAAA;IAAAD,OAAA;EAAA;EAAA;IAAAC,MAAA;IAAAD,OAAA;EAAA;EAAA;IAAAC,MAAA;IAAAD,OAAA;EAAA;EAAA;IAAAC,MAAA;IAAAD,OAAA;EAAA;EAAA;IAAAC,MAAA;IAAAD,OAAA;EAAA;EAAA;IAAAC,MAAA;IAAAD,OAAA;EAAA;EAAA;IAAAC,MAAA;IAAAD,OAAA;EAAA;EAAA;IAAAC,MAAA;IAAAD,OAAA;EAAA;EAAA;IAAAC,MAAA;IAAAD,OAAA;EAAA;EAAA;IAAAC,MAAA;IAAAD,OAAA;EAAA;EAAA;IAAAC,MAAA;IAAAD,OAAA;EAAA;EAAA;IAAAC,MAAA;IAAAD,OAAA;EAAA;EAAA;IAAAC,MAAA;IAAAD,OAAA;EAAA;EAAA;IAAAC,MAAA;IAAAD,OAAA;EAAA;EAAA;IAAAC,MAAA;IAAAD,OAAA;EAAA;AAAA;EAAAL,CAAA;AAAA,CAiFrB,CAAC;AACF,MAAMa,mBAAmB,gBAAGrD,QAAA;EAAAI,IAAA;IAAA2C,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;AAAA;EAAAX,CAAA;IAAAC,CAAA;EAAA;AAAA,CAI3B,CAAC;AACF;AACA;AACA;AAAI,OAAO,MAAMa,8BAA8B,GAAIC,KAAK,IAAG;EACvD,MAAM;IAAEC,SAAS;IAAEC,UAAU;IAAEC,IAAI;IAAEC;EAAM,CAAC,GAAGJ,KAAK;EACpD,MAAMK,UAAU,GAAGlD,SAAS,CAAC,CAAC;EAC9B,MAAMmD,UAAU,GAAGjB,kBAAkB,CAAC,CAAC;EACvC,MAAMkB,UAAU,GAAGV,aAAa,CAAC,CAAC;EAClC,MAAMW,YAAY,GAAGV,mBAAmB,CAAC,CAAC;EAC1C;EACAE,KAAK,CAACnD,IAAI,CAAC4D,SAAS,GAAG/D,YAAY,CAACE,sBAAsB,CAACC,IAAI,EAAEwD,UAAU,CAACxD,IAAI,EAAEmD,KAAK,CAACnD,IAAI,CAAC6D,EAAE,KAAK,MAAM,IAAIL,UAAU,CAACtB,YAAY,EAAEkB,SAAS,KAAK,MAAM,IAAII,UAAU,CAAChC,IAAI,EAAE4B,SAAS,KAAK,OAAO,IAAII,UAAU,CAAC1B,KAAK,EAAEuB,UAAU,KAAK,aAAa,IAAIG,UAAU,CAACxB,WAAW,EAAEoB,SAAS,KAAK,OAAO,IAAIC,UAAU,KAAK,aAAa,IAAIG,UAAU,CAACvB,gBAAgB,EAAEsB,KAAK,KAAK,WAAW,IAAIE,UAAU,CAACzD,IAAI,EAAEuD,KAAK,KAAK,WAAW,IAAIE,UAAU,CAACH,IAAI,CAAC,EAAEC,KAAK,KAAK,QAAQ,IAAIG,UAAU,CAACJ,IAAI,CAAC,EAAEC,KAAK,KAAK,QAAQ,IAAII,YAAY,CAAC3D,IAAI,EAAEuD,KAAK,KAAK,QAAQ,IAAIG,UAAU,CAACJ,IAAI,CAAC,EAAEH,KAAK,CAACnD,IAAI,CAAC4D,SAAS,CAAC;EAC5kB,OAAOT,KAAK;AAChB,CAAC","ignoreList":[]}

package/lib/components/SkeletonItem/useSkeletonItemStyles.styles.raw.js

@@ -1,6 +1,6 @@
 'use client';
-import { makeStyles, mergeClasses } from '@griffel/react';
-import { tokens } from '@fluentui/react-theme';
+import { makeStyles, mergeClasses } from "@griffel/react";
+import { tokens } from "@fluentui/react-theme";
 export const skeletonItemClassNames = {
     root: 'fui-SkeletonItem'
 };

package/lib/contexts/SkeletonContext.js

@@ -1,5 +1,5 @@
 'use client';
-import * as React from 'react';
+import * as React from "react";
 const SkeletonContext = React.createContext(undefined);
 const skeletonContextDefaultValue = {};
 export const SkeletonContextProvider = SkeletonContext.Provider;

package/lib/contexts/index.js

@@ -1 +1 @@
-export { SkeletonContextProvider, useSkeletonContext } from './SkeletonContext';
+export { SkeletonContextProvider, useSkeletonContext } from "./SkeletonContext.js";

package/lib/contexts/index.js.map

@@ -1 +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"}
+{"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,uBAAoB"}

package/lib/index.js

@@ -1,3 +1,3 @@
-export { Skeleton, renderSkeleton_unstable, skeletonClassNames, useSkeletonContextValues, useSkeletonStyles_unstable, useSkeleton_unstable, useSkeletonBase_unstable } from './Skeleton';
-export { SkeletonItem, renderSkeletonItem_unstable, skeletonItemClassNames, useSkeletonItemStyles_unstable, useSkeletonItem_unstable, useSkeletonItemBase_unstable } from './SkeletonItem';
-export { SkeletonContextProvider, useSkeletonContext } from './contexts/index';
+export { Skeleton, renderSkeleton_unstable, skeletonClassNames, useSkeletonContextValues, useSkeletonStyles_unstable, useSkeleton_unstable, useSkeletonBase_unstable } from "./Skeleton.js";
+export { SkeletonItem, renderSkeletonItem_unstable, skeletonItemClassNames, useSkeletonItemStyles_unstable, useSkeletonItem_unstable, useSkeletonItemBase_unstable } from "./SkeletonItem.js";
+export { SkeletonContextProvider, useSkeletonContext } from "./contexts/index.js";

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  Skeleton,\n  renderSkeleton_unstable,\n  skeletonClassNames,\n  useSkeletonContextValues,\n  useSkeletonStyles_unstable,\n  useSkeleton_unstable,\n  useSkeletonBase_unstable,\n} from './Skeleton';\nexport type {\n  SkeletonContextValues,\n  SkeletonBaseProps,\n  SkeletonProps,\n  SkeletonSlots,\n  SkeletonBaseState,\n  SkeletonState,\n} from './Skeleton';\nexport {\n  SkeletonItem,\n  renderSkeletonItem_unstable,\n  skeletonItemClassNames,\n  useSkeletonItemStyles_unstable,\n  useSkeletonItem_unstable,\n  useSkeletonItemBase_unstable,\n} from './SkeletonItem';\nexport type {\n  SkeletonItemBaseProps,\n  SkeletonItemProps,\n  SkeletonItemSlots,\n  SkeletonItemBaseState,\n  SkeletonItemState,\n} from './SkeletonItem';\nexport { SkeletonContextProvider, useSkeletonContext } from './contexts/index';\nexport type { SkeletonContextValue } from './contexts/index';\n"],"names":["Skeleton","renderSkeleton_unstable","skeletonClassNames","useSkeletonContextValues","useSkeletonStyles_unstable","useSkeleton_unstable","useSkeletonBase_unstable","SkeletonItem","renderSkeletonItem_unstable","skeletonItemClassNames","useSkeletonItemStyles_unstable","useSkeletonItem_unstable","useSkeletonItemBase_unstable","SkeletonContextProvider","useSkeletonContext"],"mappings":"AAAA,SACEA,QAAQ,EACRC,uBAAuB,EACvBC,kBAAkB,EAClBC,wBAAwB,EACxBC,0BAA0B,EAC1BC,oBAAoB,EACpBC,wBAAwB,QACnB,aAAa;AASpB,SACEC,YAAY,EACZC,2BAA2B,EAC3BC,sBAAsB,EACtBC,8BAA8B,EAC9BC,wBAAwB,EACxBC,4BAA4B,QACvB,iBAAiB;AAQxB,SAASC,uBAAuB,EAAEC,kBAAkB,QAAQ,mBAAmB"}
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  Skeleton,\n  renderSkeleton_unstable,\n  skeletonClassNames,\n  useSkeletonContextValues,\n  useSkeletonStyles_unstable,\n  useSkeleton_unstable,\n  useSkeletonBase_unstable,\n} from './Skeleton';\nexport type {\n  SkeletonContextValues,\n  SkeletonBaseProps,\n  SkeletonProps,\n  SkeletonSlots,\n  SkeletonBaseState,\n  SkeletonState,\n} from './Skeleton';\nexport {\n  SkeletonItem,\n  renderSkeletonItem_unstable,\n  skeletonItemClassNames,\n  useSkeletonItemStyles_unstable,\n  useSkeletonItem_unstable,\n  useSkeletonItemBase_unstable,\n} from './SkeletonItem';\nexport type {\n  SkeletonItemBaseProps,\n  SkeletonItemProps,\n  SkeletonItemSlots,\n  SkeletonItemBaseState,\n  SkeletonItemState,\n} from './SkeletonItem';\nexport { SkeletonContextProvider, useSkeletonContext } from './contexts/index';\nexport type { SkeletonContextValue } from './contexts/index';\n"],"names":["Skeleton","renderSkeleton_unstable","skeletonClassNames","useSkeletonContextValues","useSkeletonStyles_unstable","useSkeleton_unstable","useSkeletonBase_unstable","SkeletonItem","renderSkeletonItem_unstable","skeletonItemClassNames","useSkeletonItemStyles_unstable","useSkeletonItem_unstable","useSkeletonItemBase_unstable","SkeletonContextProvider","useSkeletonContext"],"mappings":"AAAA,SACEA,QAAQ,EACRC,uBAAuB,EACvBC,kBAAkB,EAClBC,wBAAwB,EACxBC,0BAA0B,EAC1BC,oBAAoB,EACpBC,wBAAwB,QACnB,gBAAa;AASpB,SACEC,YAAY,EACZC,2BAA2B,EAC3BC,sBAAsB,EACtBC,8BAA8B,EAC9BC,wBAAwB,EACxBC,4BAA4B,QACvB,oBAAiB;AAQxB,SAASC,uBAAuB,EAAEC,kBAAkB,QAAQ,sBAAmB"}

package/lib-commonjs/{Skeleton.js → Skeleton.cjs}

@@ -31,4 +31,4 @@ _export(exports, {
         return _index.useSkeleton_unstable;
     }
 });
-const _index = require("./components/Skeleton/index");
+const _index = require("./components/Skeleton/index.cjs");

package/lib-commonjs/{Skeleton.js.map → Skeleton.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/Skeleton.ts"],"sourcesContent":["export type {\n  SkeletonBaseProps,\n  SkeletonBaseState,\n  SkeletonContextValues,\n  SkeletonItemSize,\n  SkeletonProps,\n  SkeletonSlots,\n  SkeletonState,\n} from './components/Skeleton/index';\nexport {\n  Skeleton,\n  renderSkeleton_unstable,\n  skeletonClassNames,\n  useSkeletonContextValues,\n  useSkeletonStyles_unstable,\n  useSkeleton_unstable,\n  useSkeletonBase_unstable,\n} from './components/Skeleton/index';\n"],"names":["Skeleton","renderSkeleton_unstable","skeletonClassNames","useSkeletonContextValues","useSkeletonStyles_unstable","useSkeleton_unstable","useSkeletonBase_unstable"],"mappings":";;;;;;;;;;;;eAUEA,eAAQ;;;eACRC,8BAAuB;;;eACvBC,yBAAkB;;;eAIlBI,+BAAwB;;;eAHxBH,+BAAwB;;;eACxBC,iCAA0B;;;eAC1BC,2BAAoB;;;uBAEf,8BAA8B"}
+{"version":3,"sources":["../src/Skeleton.ts"],"sourcesContent":["export type {\n  SkeletonBaseProps,\n  SkeletonBaseState,\n  SkeletonContextValues,\n  SkeletonItemSize,\n  SkeletonProps,\n  SkeletonSlots,\n  SkeletonState,\n} from './components/Skeleton/index';\nexport {\n  Skeleton,\n  renderSkeleton_unstable,\n  skeletonClassNames,\n  useSkeletonContextValues,\n  useSkeletonStyles_unstable,\n  useSkeleton_unstable,\n  useSkeletonBase_unstable,\n} from './components/Skeleton/index';\n"],"names":["Skeleton","renderSkeleton_unstable","skeletonClassNames","useSkeletonContextValues","useSkeletonStyles_unstable","useSkeleton_unstable","useSkeletonBase_unstable"],"mappings":";;;;;;;;;;;;eAUEA,eAAQ;;;eACRC,8BAAuB;;;eACvBC,yBAAkB;;;eAIlBI,+BAAwB;;;eAHxBH,+BAAwB;;;eACxBC,iCAA0B;;;eAC1BC,2BAAoB;;;uBAEf,iCAA8B"}

package/lib-commonjs/{SkeletonItem.js → SkeletonItem.cjs}

@@ -28,4 +28,4 @@ _export(exports, {
         return _index.useSkeletonItem_unstable;
     }
 });
-const _index = require("./components/SkeletonItem/index");
+const _index = require("./components/SkeletonItem/index.cjs");

package/lib-commonjs/{SkeletonItem.js.map → SkeletonItem.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/SkeletonItem.ts"],"sourcesContent":["export type {\n  SkeletonItemBaseProps,\n  SkeletonItemBaseState,\n  SkeletonItemProps,\n  SkeletonItemSlots,\n  SkeletonItemState,\n} from './components/SkeletonItem/index';\nexport {\n  SkeletonItem,\n  renderSkeletonItem_unstable,\n  skeletonItemClassNames,\n  useSkeletonItemStyles_unstable,\n  useSkeletonItem_unstable,\n  useSkeletonItemBase_unstable,\n} from './components/SkeletonItem/index';\n"],"names":["SkeletonItem","renderSkeletonItem_unstable","skeletonItemClassNames","useSkeletonItemStyles_unstable","useSkeletonItem_unstable","useSkeletonItemBase_unstable"],"mappings":";;;;;;;;;;;;eAQEA,mBAAY;;;eACZC,kCAA2B;;;eAC3BC,6BAAsB;;;eAGtBG,mCAA4B;;;eAF5BF,qCAA8B;;;eAC9BC,+BAAwB;;;uBAEnB,kCAAkC"}
+{"version":3,"sources":["../src/SkeletonItem.ts"],"sourcesContent":["export type {\n  SkeletonItemBaseProps,\n  SkeletonItemBaseState,\n  SkeletonItemProps,\n  SkeletonItemSlots,\n  SkeletonItemState,\n} from './components/SkeletonItem/index';\nexport {\n  SkeletonItem,\n  renderSkeletonItem_unstable,\n  skeletonItemClassNames,\n  useSkeletonItemStyles_unstable,\n  useSkeletonItem_unstable,\n  useSkeletonItemBase_unstable,\n} from './components/SkeletonItem/index';\n"],"names":["SkeletonItem","renderSkeletonItem_unstable","skeletonItemClassNames","useSkeletonItemStyles_unstable","useSkeletonItem_unstable","useSkeletonItemBase_unstable"],"mappings":";;;;;;;;;;;;eAQEA,mBAAY;;;eACZC,kCAA2B;;;eAC3BC,6BAAsB;;;eAGtBG,mCAA4B;;;eAF5BF,qCAA8B;;;eAC9BC,+BAAwB;;;uBAEnB,qCAAkC"}

package/lib-commonjs/components/Skeleton/{Skeleton.js → Skeleton.cjs}

@@ -11,10 +11,10 @@ Object.defineProperty(exports, "Skeleton", {
 });
 const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
 const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
-const _useSkeleton = require("./useSkeleton");
-const _renderSkeleton = require("./renderSkeleton");
-const _useSkeletonStylesstyles = require("./useSkeletonStyles.styles");
-const _useSkeletonContextValues = require("./useSkeletonContextValues");
+const _useSkeleton = require("./useSkeleton.cjs");
+const _renderSkeleton = require("./renderSkeleton.cjs");
+const _useSkeletonStylesstyles = require("./useSkeletonStyles.styles.cjs");
+const _useSkeletonContextValues = require("./useSkeletonContextValues.cjs");
 const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
 const Skeleton = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
     const state = (0, _useSkeleton.useSkeleton_unstable)(props, ref);

package/lib-commonjs/components/Skeleton/{Skeleton.js.map → Skeleton.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Skeleton/Skeleton.tsx"],"sourcesContent":["'use client';\n\nimport * 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;;;;;;;;;;;;iEAEuB,QAAQ;6BACM,gBAAgB;gCACb,mBAAmB;yCAChB,6BAA6B;0CAC/B,6BAA6B;qCAG1B,kCAAkC;AAKvE,MAAMM,WAAAA,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"}
+{"version":3,"sources":["../src/components/Skeleton/Skeleton.tsx"],"sourcesContent":["'use client';\n\nimport * 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;;;;;;;;;;;;iEAEuB,QAAQ;6BACM,mBAAgB;gCACb,sBAAmB;yCAChB,gCAA6B;0CAC/B,gCAA6B;qCAG1B,kCAAkC;AAKvE,MAAMM,WAAAA,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/{index.js → index.cjs}

@@ -31,8 +31,8 @@ _export(exports, {
         return _useSkeleton.useSkeleton_unstable;
     }
 });
-const _Skeleton = require("./Skeleton");
-const _renderSkeleton = require("./renderSkeleton");
-const _useSkeleton = require("./useSkeleton");
-const _useSkeletonContextValues = require("./useSkeletonContextValues");
-const _useSkeletonStylesstyles = require("./useSkeletonStyles.styles");
+const _Skeleton = require("./Skeleton.cjs");
+const _renderSkeleton = require("./renderSkeleton.cjs");
+const _useSkeleton = require("./useSkeleton.cjs");
+const _useSkeletonContextValues = require("./useSkeletonContextValues.cjs");
+const _useSkeletonStylesstyles = require("./useSkeletonStyles.styles.cjs");

package/lib-commonjs/components/Skeleton/{index.js.map → index.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Skeleton/index.ts"],"sourcesContent":["export { Skeleton } from './Skeleton';\nexport type {\n  SkeletonBaseProps,\n  SkeletonBaseState,\n  SkeletonContextValues,\n  SkeletonItemSize,\n  SkeletonProps,\n  SkeletonSlots,\n  SkeletonState,\n} from './Skeleton.types';\nexport { renderSkeleton_unstable } from './renderSkeleton';\nexport { useSkeleton_unstable, useSkeletonBase_unstable } from './useSkeleton';\nexport { useSkeletonContextValues } from './useSkeletonContextValues';\nexport { skeletonClassNames, useSkeletonStyles_unstable } from './useSkeletonStyles.styles';\n"],"names":["Skeleton","renderSkeleton_unstable","useSkeleton_unstable","useSkeletonBase_unstable","useSkeletonContextValues","skeletonClassNames","useSkeletonStyles_unstable"],"mappings":";;;;;;;;;;;IAASA;iCAAQ;;IAURC;sDAAuB;;;eAGvBI,2CAAkB;;;eAFIF,qCAAwB;;;eAC9CC,kDAAwB;;;eACJE,mDAA0B;;;eAF9CJ,iCAAoB;;;0BAXJ,aAAa;gCAUE,mBAAmB;6BACI,gBAAgB;0CACtC,6BAA6B;yCACP,6BAA6B"}
+{"version":3,"sources":["../src/components/Skeleton/index.ts"],"sourcesContent":["export { Skeleton } from './Skeleton';\nexport type {\n  SkeletonBaseProps,\n  SkeletonBaseState,\n  SkeletonContextValues,\n  SkeletonItemSize,\n  SkeletonProps,\n  SkeletonSlots,\n  SkeletonState,\n} from './Skeleton.types';\nexport { renderSkeleton_unstable } from './renderSkeleton';\nexport { useSkeleton_unstable, useSkeletonBase_unstable } from './useSkeleton';\nexport { useSkeletonContextValues } from './useSkeletonContextValues';\nexport { skeletonClassNames, useSkeletonStyles_unstable } from './useSkeletonStyles.styles';\n"],"names":["Skeleton","renderSkeleton_unstable","useSkeleton_unstable","useSkeletonBase_unstable","useSkeletonContextValues","skeletonClassNames","useSkeletonStyles_unstable"],"mappings":";;;;;;;;;;;IAASA;iCAAQ;;IAURC;sDAAuB;;;eAGvBI,2CAAkB;;;eAFIF,qCAAwB;;;eAC9CC,kDAAwB;;;eACJE,mDAA0B;;;eAF9CJ,iCAAoB;;;0BAXJ,gBAAa;gCAUE,sBAAmB;6BACI,mBAAgB;0CACtC,gCAA6B;yCACP,gCAA6B"}

package/lib-commonjs/components/Skeleton/{renderSkeleton.js → renderSkeleton.cjs}

@@ -10,7 +10,7 @@ Object.defineProperty(exports, "renderSkeleton_unstable", {
 });
 const _jsxruntime = require("@fluentui/react-jsx-runtime/jsx-runtime");
 const _reactutilities = require("@fluentui/react-utilities");
-const _SkeletonContext = require("../../contexts/SkeletonContext");
+const _SkeletonContext = require("../../contexts/SkeletonContext.cjs");
 const renderSkeleton_unstable = (state, contextValues)=>{
     (0, _reactutilities.assertSlots)(state);
     return /*#__PURE__*/ (0, _jsxruntime.jsx)(_SkeletonContext.SkeletonContextProvider, {

package/lib-commonjs/components/Skeleton/{renderSkeleton.js.map → renderSkeleton.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Skeleton/renderSkeleton.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { SkeletonContextProvider } from '../../contexts/SkeletonContext';\nimport type { SkeletonContextValues, SkeletonSlots, SkeletonBaseState } from './Skeleton.types';\n\n/**\n * Render the final JSX of Skeleton\n */\nexport const renderSkeleton_unstable = (state: SkeletonBaseState, contextValues: SkeletonContextValues): JSXElement => {\n  assertSlots<SkeletonSlots>(state);\n\n  return (\n    <SkeletonContextProvider value={contextValues.skeletonGroup}>\n      <state.root />\n    </SkeletonContextProvider>\n  );\n};\n"],"names":["assertSlots","SkeletonContextProvider","renderSkeleton_unstable","state","contextValues","value","skeletonGroup","root"],"mappings":";;;;+BAWaE;;;;;;4BAVb,gDAAiD;gCAErB,4BAA4B;iCAEhB,iCAAiC;AAMlE,gCAAgC,CAACC,OAA0BC;QAChEJ,2BAAAA,EAA2BG;IAE3B,OAAA,WAAA,OACE,eAAA,EAACF,wCAAAA,EAAAA;QAAwBI,OAAOD,cAAcE,aAAa;kBACzD,WAAA,OAAA,eAAA,EAACH,MAAMI,IAAI,EAAA,CAAA;;AAGjB,EAAE"}
+{"version":3,"sources":["../src/components/Skeleton/renderSkeleton.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport { SkeletonContextProvider } from '../../contexts/SkeletonContext';\nimport type { SkeletonContextValues, SkeletonSlots, SkeletonBaseState } from './Skeleton.types';\n\n/**\n * Render the final JSX of Skeleton\n */\nexport const renderSkeleton_unstable = (state: SkeletonBaseState, contextValues: SkeletonContextValues): JSXElement => {\n  assertSlots<SkeletonSlots>(state);\n\n  return (\n    <SkeletonContextProvider value={contextValues.skeletonGroup}>\n      <state.root />\n    </SkeletonContextProvider>\n  );\n};\n"],"names":["assertSlots","SkeletonContextProvider","renderSkeleton_unstable","state","contextValues","value","skeletonGroup","root"],"mappings":";;;;+BAWaE;;;;;;4BAVb,gDAAiD;gCAErB,4BAA4B;iCAEhB,oCAAiC;AAMlE,gCAAgC,CAACC,OAA0BC;QAChEJ,2BAAAA,EAA2BG;IAE3B,OAAA,WAAA,OACE,eAAA,EAACF,wCAAAA,EAAAA;QAAwBI,OAAOD,cAAcE,aAAa;kBACzD,WAAA,OAAA,eAAA,EAACH,MAAMI,IAAI,EAAA,CAAA;;AAGjB,EAAE"}

package/lib-commonjs/components/Skeleton/{useSkeleton.js → useSkeleton.cjs}

@@ -18,7 +18,7 @@ _export(exports, {
     }
 });
 const _reactutilities = require("@fluentui/react-utilities");
-const _SkeletonContext = require("../../contexts/SkeletonContext");
+const _SkeletonContext = require("../../contexts/SkeletonContext.cjs");
 const useSkeleton_unstable = (props, ref)=>{
     const { animation: contextAnimation, appearance: contextAppearance } = (0, _SkeletonContext.useSkeletonContext)();
     const { animation = contextAnimation !== null && contextAnimation !== void 0 ? contextAnimation : 'wave', appearance = contextAppearance !== null && contextAppearance !== void 0 ? contextAppearance : 'opaque', size, shape, ...baseProps } = props;

package/lib-commonjs/components/Skeleton/{useSkeleton.js.map → useSkeleton.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/Skeleton/useSkeleton.ts"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { SkeletonBaseProps, SkeletonBaseState, SkeletonProps, SkeletonState } from './Skeleton.types';\nimport { useSkeletonContext } from '../../contexts/SkeletonContext';\n\n/**\n * Create the state required to render Skeleton.\n *\n * The returned state can be modified with hooks such as useSkeletonStyles_unstable,\n * before being passed to renderSkeleton_unstable.\n *\n * @param props - props from this instance of Skeleton\n * @param ref - reference to root HTMLElement of Skeleton\n */\nexport const useSkeleton_unstable = (props: SkeletonProps, ref: React.Ref<HTMLElement>): SkeletonState => {\n  const { animation: contextAnimation, appearance: contextAppearance } = useSkeletonContext();\n  const {\n    animation = contextAnimation ?? 'wave',\n    appearance = contextAppearance ?? 'opaque',\n    size,\n    shape,\n    ...baseProps\n  } = props;\n\n  const baseState = useSkeletonBase_unstable(baseProps, ref as React.Ref<HTMLDivElement>);\n\n  return {\n    ...baseState,\n    animation,\n    appearance,\n    size,\n    shape,\n  };\n};\n\n/**\n * Base hook for Skeleton component, which manages state related to slots structure and ARIA attributes.\n *\n * @param props - User provided props to the Skeleton component.\n * @param ref - User provided ref to be passed to the Skeleton component.\n */\nexport const useSkeletonBase_unstable = (\n  props: SkeletonBaseProps,\n  ref: React.Ref<HTMLDivElement>,\n): SkeletonBaseState => {\n  const root = slot.always(\n    getIntrinsicElementProps('div', {\n      ref,\n      role: 'progressbar',\n      'aria-busy': true,\n      ...props,\n    }),\n    { elementType: 'div' },\n  );\n  return { components: { root: 'div' }, root };\n};\n"],"names":["getIntrinsicElementProps","slot","useSkeletonContext","useSkeleton_unstable","props","ref","animation","contextAnimation","appearance","contextAppearance","size","shape","baseProps","baseState","useSkeletonBase_unstable","root","always","role","elementType","components"],"mappings":"AAAA;;;;;;;;;;;;IA2Cac,wBAAAA;;;wBA3BAX;;;;gCAbkC,4BAA4B;iCAExC,iCAAiC;AAW7D,MAAMA,uBAAuB,CAACC,OAAsBC;IACzD,MAAM,EAAEC,WAAWC,gBAAgB,EAAEC,YAAYC,iBAAiB,EAAE,OAAGP,mCAAAA;IACvE,MAAM,EACJI,YAAYC,qBAAAA,QAAAA,qBAAAA,KAAAA,IAAAA,mBAAoB,MAAM,EACtCC,aAAaC,sBAAAA,QAAAA,sBAAAA,KAAAA,IAAAA,oBAAqB,QAAQ,EAC1CC,IAAI,EACJC,KAAK,EACL,GAAGC,WACJ,GAAGR;IAEJ,MAAMS,YAAYC,yBAAyBF,WAAWP;IAEtD,OAAO;QACL,GAAGQ,SAAS;QACZP;QACAE;QACAE;QACAC;IACF;AACF,EAAE;AAQK,iCAAiC,CACtCP,OACAC;IAEA,MAAMU,OAAOd,oBAAAA,CAAKe,MAAM,KACtBhB,wCAAAA,EAAyB,OAAO;QAC9BK;QACAY,MAAM;QACN,aAAa;QACb,GAAGb,KAAK;IACV,IACA;QAAEc,aAAa;IAAM;IAEvB,OAAO;QAAEC,YAAY;YAAEJ,MAAM;QAAM;QAAGA;IAAK;AAC7C,EAAE"}
+{"version":3,"sources":["../src/components/Skeleton/useSkeleton.ts"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport type { SkeletonBaseProps, SkeletonBaseState, SkeletonProps, SkeletonState } from './Skeleton.types';\nimport { useSkeletonContext } from '../../contexts/SkeletonContext';\n\n/**\n * Create the state required to render Skeleton.\n *\n * The returned state can be modified with hooks such as useSkeletonStyles_unstable,\n * before being passed to renderSkeleton_unstable.\n *\n * @param props - props from this instance of Skeleton\n * @param ref - reference to root HTMLElement of Skeleton\n */\nexport const useSkeleton_unstable = (props: SkeletonProps, ref: React.Ref<HTMLElement>): SkeletonState => {\n  const { animation: contextAnimation, appearance: contextAppearance } = useSkeletonContext();\n  const {\n    animation = contextAnimation ?? 'wave',\n    appearance = contextAppearance ?? 'opaque',\n    size,\n    shape,\n    ...baseProps\n  } = props;\n\n  const baseState = useSkeletonBase_unstable(baseProps, ref as React.Ref<HTMLDivElement>);\n\n  return {\n    ...baseState,\n    animation,\n    appearance,\n    size,\n    shape,\n  };\n};\n\n/**\n * Base hook for Skeleton component, which manages state related to slots structure and ARIA attributes.\n *\n * @param props - User provided props to the Skeleton component.\n * @param ref - User provided ref to be passed to the Skeleton component.\n */\nexport const useSkeletonBase_unstable = (\n  props: SkeletonBaseProps,\n  ref: React.Ref<HTMLDivElement>,\n): SkeletonBaseState => {\n  const root = slot.always(\n    getIntrinsicElementProps('div', {\n      ref,\n      role: 'progressbar',\n      'aria-busy': true,\n      ...props,\n    }),\n    { elementType: 'div' },\n  );\n  return { components: { root: 'div' }, root };\n};\n"],"names":["getIntrinsicElementProps","slot","useSkeletonContext","useSkeleton_unstable","props","ref","animation","contextAnimation","appearance","contextAppearance","size","shape","baseProps","baseState","useSkeletonBase_unstable","root","always","role","elementType","components"],"mappings":"AAAA;;;;;;;;;;;;IA2Cac,wBAAAA;;;wBA3BAX;;;;gCAbkC,4BAA4B;iCAExC,oCAAiC;AAW7D,MAAMA,uBAAuB,CAACC,OAAsBC;IACzD,MAAM,EAAEC,WAAWC,gBAAgB,EAAEC,YAAYC,iBAAiB,EAAE,OAAGP,mCAAAA;IACvE,MAAM,EACJI,YAAYC,qBAAAA,QAAAA,qBAAAA,KAAAA,IAAAA,mBAAoB,MAAM,EACtCC,aAAaC,sBAAAA,QAAAA,sBAAAA,KAAAA,IAAAA,oBAAqB,QAAQ,EAC1CC,IAAI,EACJC,KAAK,EACL,GAAGC,WACJ,GAAGR;IAEJ,MAAMS,YAAYC,yBAAyBF,WAAWP;IAEtD,OAAO;QACL,GAAGQ,SAAS;QACZP;QACAE;QACAE;QACAC;IACF;AACF,EAAE;AAQK,iCAAiC,CACtCP,OACAC;IAEA,MAAMU,OAAOd,oBAAAA,CAAKe,MAAM,KACtBhB,wCAAAA,EAAyB,OAAO;QAC9BK;QACAY,MAAM;QACN,aAAa;QACb,GAAGb,KAAK;IACV,IACA;QAAEc,aAAa;IAAM;IAEvB,OAAO;QAAEC,YAAY;YAAEJ,MAAM;QAAM;QAAGA;IAAK;AAC7C,EAAE"}

package/lib-commonjs/components/Skeleton/useSkeletonStyles.styles.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useSkeletonStyles.styles.js"],"sourcesContent":["'use client';\nimport { 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    const styles = useStyles();\n    // eslint-disable-next-line react-hooks/immutability\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":"AAAA,YAAY;;;;;;;;;;;;IAECE,kBAAkB;;;8BAUY;eAA1BM;;;uBAXwB,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,oCAAoCE,KAAK,IAAG;IACnD,MAAMC,MAAM,GAAGN,SAAS,CAAC,CAAC;IAC1B,oDAAA;IACAK,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/SkeletonItem/{SkeletonItem.js → SkeletonItem.cjs}

@@ -11,9 +11,9 @@ Object.defineProperty(exports, "SkeletonItem", {
 });
 const _interop_require_wildcard = require("@swc/helpers/_/_interop_require_wildcard");
 const _react = /*#__PURE__*/ _interop_require_wildcard._(require("react"));
-const _useSkeletonItem = require("./useSkeletonItem");
-const _renderSkeletonItem = require("./renderSkeletonItem");
-const _useSkeletonItemStylesstyles = require("./useSkeletonItemStyles.styles");
+const _useSkeletonItem = require("./useSkeletonItem.cjs");
+const _renderSkeletonItem = require("./renderSkeletonItem.cjs");
+const _useSkeletonItemStylesstyles = require("./useSkeletonItemStyles.styles.cjs");
 const _reactsharedcontexts = require("@fluentui/react-shared-contexts");
 const SkeletonItem = /*#__PURE__*/ _react.forwardRef((props, ref)=>{
     const state = (0, _useSkeletonItem.useSkeletonItem_unstable)(props, ref);

package/lib-commonjs/components/SkeletonItem/{SkeletonItem.js.map → SkeletonItem.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/SkeletonItem/SkeletonItem.tsx"],"sourcesContent":["'use client';\n\nimport * 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;;;;;;;;;;;;iEAEuB,QAAQ;iCACU,oBAAoB;oCACjB,uBAAuB;6CACpB,iCAAiC;qCAGpC,kCAAkC;AAEvE,MAAMK,eAAAA,WAAAA,GAAuDL,OAAMM,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,YAAQR,yCAAAA,EAAyBM,OAAOC;QAE9CL,2DAAAA,EAA+BM;QAC/BL,gDAAAA,EAA4B,kCAAkCK;IAE9D,WAAOP,+CAAAA,EAA4BO;AACrC,GAAG;AAEHJ,aAAaK,WAAW,GAAG"}
+{"version":3,"sources":["../src/components/SkeletonItem/SkeletonItem.tsx"],"sourcesContent":["'use client';\n\nimport * 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;;;;;;;;;;;;iEAEuB,QAAQ;iCACU,uBAAoB;oCACjB,0BAAuB;6CACpB,oCAAiC;qCAGpC,kCAAkC;AAEvE,MAAMK,eAAAA,WAAAA,GAAuDL,OAAMM,UAAU,CAAC,CAACC,OAAOC;IAC3F,MAAMC,YAAQR,yCAAAA,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/{index.js → index.cjs}

@@ -28,7 +28,7 @@ _export(exports, {
         return _useSkeletonItem.useSkeletonItem_unstable;
     }
 });
-const _SkeletonItem = require("./SkeletonItem");
-const _renderSkeletonItem = require("./renderSkeletonItem");
-const _useSkeletonItem = require("./useSkeletonItem");
-const _useSkeletonItemStylesstyles = require("./useSkeletonItemStyles.styles");
+const _SkeletonItem = require("./SkeletonItem.cjs");
+const _renderSkeletonItem = require("./renderSkeletonItem.cjs");
+const _useSkeletonItem = require("./useSkeletonItem.cjs");
+const _useSkeletonItemStylesstyles = require("./useSkeletonItemStyles.styles.cjs");

package/lib-commonjs/components/SkeletonItem/{index.js.map → index.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/SkeletonItem/index.ts"],"sourcesContent":["export { SkeletonItem } from './SkeletonItem';\nexport type {\n  SkeletonItemBaseProps,\n  SkeletonItemBaseState,\n  SkeletonItemProps,\n  SkeletonItemSlots,\n  SkeletonItemState,\n} from './SkeletonItem.types';\nexport { renderSkeletonItem_unstable } from './renderSkeletonItem';\nexport { useSkeletonItem_unstable, useSkeletonItemBase_unstable } from './useSkeletonItem';\nexport { skeletonItemClassNames, useSkeletonItemStyles_unstable } from './useSkeletonItemStyles.styles';\n"],"names":["SkeletonItem","renderSkeletonItem_unstable","useSkeletonItem_unstable","useSkeletonItemBase_unstable","skeletonItemClassNames","useSkeletonItemStyles_unstable"],"mappings":";;;;;;;;;;;;eAASA,0BAAY;;;eAQZC,+CAA2B;;;eAE3BG,mDAAsB;;;eADID,6CAA4B;;;eAC9BE,2DAA8B;;;eADtDH,yCAAwB;;;8BATJ,iBAAiB;oCAQF,uBAAuB;iCACI,oBAAoB;6CACpB,iCAAiC"}
+{"version":3,"sources":["../src/components/SkeletonItem/index.ts"],"sourcesContent":["export { SkeletonItem } from './SkeletonItem';\nexport type {\n  SkeletonItemBaseProps,\n  SkeletonItemBaseState,\n  SkeletonItemProps,\n  SkeletonItemSlots,\n  SkeletonItemState,\n} from './SkeletonItem.types';\nexport { renderSkeletonItem_unstable } from './renderSkeletonItem';\nexport { useSkeletonItem_unstable, useSkeletonItemBase_unstable } from './useSkeletonItem';\nexport { skeletonItemClassNames, useSkeletonItemStyles_unstable } from './useSkeletonItemStyles.styles';\n"],"names":["SkeletonItem","renderSkeletonItem_unstable","useSkeletonItem_unstable","useSkeletonItemBase_unstable","skeletonItemClassNames","useSkeletonItemStyles_unstable"],"mappings":";;;;;;;;;;;;eAASA,0BAAY;;;eAQZC,+CAA2B;;;eAE3BG,mDAAsB;;;eADID,6CAA4B;;;eAC9BE,2DAA8B;;;eADtDH,yCAAwB;;;8BATJ,oBAAiB;oCAQF,0BAAuB;iCACI,uBAAoB;6CACpB,oCAAiC"}

package/lib-commonjs/components/SkeletonItem/{useSkeletonItem.js → useSkeletonItem.cjs}

@@ -18,7 +18,7 @@ _export(exports, {
     }
 });
 const _reactutilities = require("@fluentui/react-utilities");
-const _SkeletonContext = require("../../contexts/SkeletonContext");
+const _SkeletonContext = require("../../contexts/SkeletonContext.cjs");
 const useSkeletonItem_unstable = (props, ref)=>{
     const { animation: contextAnimation, appearance: contextAppearance, size: contextSize, shape: contextShape } = (0, _SkeletonContext.useSkeletonContext)();
     const { animation = contextAnimation !== null && contextAnimation !== void 0 ? contextAnimation : 'wave', appearance = contextAppearance !== null && contextAppearance !== void 0 ? contextAppearance : 'opaque', size = contextSize !== null && contextSize !== void 0 ? contextSize : 16, shape = contextShape !== null && contextShape !== void 0 ? contextShape : 'rectangle', ...baseProps } = props;

package/lib-commonjs/components/SkeletonItem/{useSkeletonItem.js.map → useSkeletonItem.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/SkeletonItem/useSkeletonItem.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { useSkeletonContext } from '../../contexts/SkeletonContext';\nimport type {\n  SkeletonItemBaseProps,\n  SkeletonItemBaseState,\n  SkeletonItemProps,\n  SkeletonItemState,\n} from './SkeletonItem.types';\n\n/**\n * Create the state required to render SkeletonItem.\n *\n * The returned state can be modified with hooks such as useSkeletonItemStyles_unstable,\n * before being passed to renderSkeletonItem_unstable.\n *\n * @param props - props from this instance of SkeletonItem\n * @param ref - reference to root HTMLElement of SkeletonItem\n */\nexport const useSkeletonItem_unstable = (props: SkeletonItemProps, ref: React.Ref<HTMLElement>): SkeletonItemState => {\n  const {\n    animation: contextAnimation,\n    appearance: contextAppearance,\n    size: contextSize,\n    shape: contextShape,\n  } = useSkeletonContext();\n  const {\n    animation = contextAnimation ?? 'wave',\n    appearance = contextAppearance ?? 'opaque',\n    size = contextSize ?? 16,\n    shape = contextShape ?? 'rectangle',\n    ...baseProps\n  } = props;\n\n  const baseState = useSkeletonItemBase_unstable(baseProps, ref as React.Ref<HTMLDivElement>);\n\n  return {\n    ...baseState,\n    animation,\n    appearance,\n    size,\n    shape,\n  };\n};\n\n/**\n * Base hook for SkeletonItem component, which manages state related to slots structure.\n *\n * @param props - User provided props to the SkeletonItem component.\n * @param ref - User provided ref to be passed to the SkeletonItem component.\n */\nexport const useSkeletonItemBase_unstable = (\n  props: SkeletonItemBaseProps,\n  ref: React.Ref<HTMLDivElement>,\n): SkeletonItemBaseState => {\n  const root = slot.always(\n    getIntrinsicElementProps('div', {\n      ref,\n      ...props,\n    }),\n    { elementType: 'div' },\n  );\n  return { components: { root: 'div' }, root };\n};\n"],"names":["getIntrinsicElementProps","slot","useSkeletonContext","useSkeletonItem_unstable","props","ref","animation","contextAnimation","appearance","contextAppearance","size","contextSize","shape","contextShape","baseProps","baseState","useSkeletonItemBase_unstable","root","always","elementType","components"],"mappings":"AAAA;;;;;;;;;;;;gCAqDagB;eAAAA;;4BAhCAb;;;;gCAlBkC,4BAA4B;iCACxC,iCAAiC;AAiB7D,MAAMA,2BAA2B,CAACC,OAA0BC;IACjE,MAAM,EACJC,WAAWC,gBAAgB,EAC3BC,YAAYC,iBAAiB,EAC7BC,MAAMC,WAAW,EACjBC,OAAOC,YAAY,EACpB,OAAGX,mCAAAA;IACJ,MAAM,EACJI,YAAYC,qBAAAA,QAAAA,qBAAAA,KAAAA,IAAAA,mBAAoB,MAAM,EACtCC,aAAaC,sBAAAA,QAAAA,sBAAAA,KAAAA,IAAAA,oBAAqB,QAAQ,EAC1CC,OAAOC,gBAAAA,QAAAA,gBAAAA,KAAAA,IAAAA,cAAe,EAAE,EACxBC,QAAQC,iBAAAA,QAAAA,iBAAAA,KAAAA,IAAAA,eAAgB,WAAW,EACnC,GAAGC,WACJ,GAAGV;IAEJ,MAAMW,YAAYC,6BAA6BF,WAAWT;IAE1D,OAAO;QACL,GAAGU,SAAS;QACZT;QACAE;QACAE;QACAE;IACF;AACF,EAAE;AAQK,qCAAqC,CAC1CR,OACAC;IAEA,MAAMY,OAAOhB,oBAAAA,CAAKiB,MAAM,KACtBlB,wCAAAA,EAAyB,OAAO;QAC9BK;QACA,GAAGD,KAAK;IACV,IACA;QAAEe,aAAa;IAAM;IAEvB,OAAO;QAAEC,YAAY;YAAEH,MAAM;QAAM;QAAGA;IAAK;AAC7C,EAAE"}
+{"version":3,"sources":["../src/components/SkeletonItem/useSkeletonItem.tsx"],"sourcesContent":["'use client';\n\nimport type * as React from 'react';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { useSkeletonContext } from '../../contexts/SkeletonContext';\nimport type {\n  SkeletonItemBaseProps,\n  SkeletonItemBaseState,\n  SkeletonItemProps,\n  SkeletonItemState,\n} from './SkeletonItem.types';\n\n/**\n * Create the state required to render SkeletonItem.\n *\n * The returned state can be modified with hooks such as useSkeletonItemStyles_unstable,\n * before being passed to renderSkeletonItem_unstable.\n *\n * @param props - props from this instance of SkeletonItem\n * @param ref - reference to root HTMLElement of SkeletonItem\n */\nexport const useSkeletonItem_unstable = (props: SkeletonItemProps, ref: React.Ref<HTMLElement>): SkeletonItemState => {\n  const {\n    animation: contextAnimation,\n    appearance: contextAppearance,\n    size: contextSize,\n    shape: contextShape,\n  } = useSkeletonContext();\n  const {\n    animation = contextAnimation ?? 'wave',\n    appearance = contextAppearance ?? 'opaque',\n    size = contextSize ?? 16,\n    shape = contextShape ?? 'rectangle',\n    ...baseProps\n  } = props;\n\n  const baseState = useSkeletonItemBase_unstable(baseProps, ref as React.Ref<HTMLDivElement>);\n\n  return {\n    ...baseState,\n    animation,\n    appearance,\n    size,\n    shape,\n  };\n};\n\n/**\n * Base hook for SkeletonItem component, which manages state related to slots structure.\n *\n * @param props - User provided props to the SkeletonItem component.\n * @param ref - User provided ref to be passed to the SkeletonItem component.\n */\nexport const useSkeletonItemBase_unstable = (\n  props: SkeletonItemBaseProps,\n  ref: React.Ref<HTMLDivElement>,\n): SkeletonItemBaseState => {\n  const root = slot.always(\n    getIntrinsicElementProps('div', {\n      ref,\n      ...props,\n    }),\n    { elementType: 'div' },\n  );\n  return { components: { root: 'div' }, root };\n};\n"],"names":["getIntrinsicElementProps","slot","useSkeletonContext","useSkeletonItem_unstable","props","ref","animation","contextAnimation","appearance","contextAppearance","size","contextSize","shape","contextShape","baseProps","baseState","useSkeletonItemBase_unstable","root","always","elementType","components"],"mappings":"AAAA;;;;;;;;;;;;gCAqDagB;eAAAA;;4BAhCAb;;;;gCAlBkC,4BAA4B;iCACxC,oCAAiC;AAiB7D,MAAMA,2BAA2B,CAACC,OAA0BC;IACjE,MAAM,EACJC,WAAWC,gBAAgB,EAC3BC,YAAYC,iBAAiB,EAC7BC,MAAMC,WAAW,EACjBC,OAAOC,YAAY,EACpB,OAAGX,mCAAAA;IACJ,MAAM,EACJI,YAAYC,qBAAAA,QAAAA,qBAAAA,KAAAA,IAAAA,mBAAoB,MAAM,EACtCC,aAAaC,sBAAAA,QAAAA,sBAAAA,KAAAA,IAAAA,oBAAqB,QAAQ,EAC1CC,OAAOC,gBAAAA,QAAAA,gBAAAA,KAAAA,IAAAA,cAAe,EAAE,EACxBC,QAAQC,iBAAAA,QAAAA,iBAAAA,KAAAA,IAAAA,eAAgB,WAAW,EACnC,GAAGC,WACJ,GAAGV;IAEJ,MAAMW,YAAYC,6BAA6BF,WAAWT;IAE1D,OAAO;QACL,GAAGU,SAAS;QACZT;QACAE;QACAE;QACAE;IACF;AACF,EAAE;AAQK,qCAAqC,CAC1CR,OACAC;IAEA,MAAMY,OAAOhB,oBAAAA,CAAKiB,MAAM,KACtBlB,wCAAAA,EAAyB,OAAO;QAC9BK;QACA,GAAGD,KAAK;IACV,IACA;QAAEe,aAAa;IAAM;IAEvB,OAAO;QAAEC,YAAY;YAAEH,MAAM;QAAM;QAAGA;IAAK;AAC7C,EAAE"}

package/lib-commonjs/components/SkeletonItem/useSkeletonItemStyles.styles.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useSkeletonItemStyles.styles.js"],"sourcesContent":["'use client';\nimport { 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    14: {\n        height: '14px'\n    },\n    16: {\n        height: '16px'\n    },\n    20: {\n        height: '20px'\n    },\n    22: {\n        height: '22px'\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    52: {\n        height: '52px'\n    },\n    56: {\n        height: '56px'\n    },\n    64: {\n        height: '64px'\n    },\n    72: {\n        height: '72px'\n    },\n    92: {\n        height: '92px'\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    14: {\n        width: '14px',\n        height: '14px'\n    },\n    16: {\n        width: '16px',\n        height: '16px'\n    },\n    20: {\n        width: '20px',\n        height: '20px'\n    },\n    22: {\n        width: '22px',\n        height: '22px'\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    52: {\n        width: '52px',\n        height: '52px'\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    92: {\n        width: '92px',\n        height: '92px'\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    const { animation, appearance, size, shape } = state;\n    const rootStyles = useStyles();\n    const rectStyles = useRectangleStyles();\n    const sizeStyles = useSizeStyles();\n    const circleStyles = useCircleSizeStyles();\n    // eslint-disable-next-line react-hooks/immutability\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","Gt9ir8","Crt7la","wave","De3pzq","Br128sd","h62rwi","b1kco5","Iqrfzq","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/contexts/{index.js → index.cjs}

@@ -16,4 +16,4 @@ _export(exports, {
         return _SkeletonContext.useSkeletonContext;
     }
 });
-const _SkeletonContext = require("./SkeletonContext");
+const _SkeletonContext = require("./SkeletonContext.cjs");

package/lib-commonjs/contexts/{index.js.map → index.cjs.map}

@@ -1 +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"}
+{"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,uBAAoB"}

package/lib-commonjs/{index.js → index.cjs}

@@ -55,6 +55,6 @@ _export(exports, {
         return _Skeleton.useSkeleton_unstable;
     }
 });
-const _Skeleton = require("./Skeleton");
-const _SkeletonItem = require("./SkeletonItem");
-const _index = require("./contexts/index");
+const _Skeleton = require("./Skeleton.cjs");
+const _SkeletonItem = require("./SkeletonItem.cjs");
+const _index = require("./contexts/index.cjs");

package/lib-commonjs/{index.js.map → index.cjs.map}

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  Skeleton,\n  renderSkeleton_unstable,\n  skeletonClassNames,\n  useSkeletonContextValues,\n  useSkeletonStyles_unstable,\n  useSkeleton_unstable,\n  useSkeletonBase_unstable,\n} from './Skeleton';\nexport type {\n  SkeletonContextValues,\n  SkeletonBaseProps,\n  SkeletonProps,\n  SkeletonSlots,\n  SkeletonBaseState,\n  SkeletonState,\n} from './Skeleton';\nexport {\n  SkeletonItem,\n  renderSkeletonItem_unstable,\n  skeletonItemClassNames,\n  useSkeletonItemStyles_unstable,\n  useSkeletonItem_unstable,\n  useSkeletonItemBase_unstable,\n} from './SkeletonItem';\nexport type {\n  SkeletonItemBaseProps,\n  SkeletonItemProps,\n  SkeletonItemSlots,\n  SkeletonItemBaseState,\n  SkeletonItemState,\n} from './SkeletonItem';\nexport { SkeletonContextProvider, useSkeletonContext } from './contexts/index';\nexport type { SkeletonContextValue } from './contexts/index';\n"],"names":["Skeleton","renderSkeleton_unstable","skeletonClassNames","useSkeletonContextValues","useSkeletonStyles_unstable","useSkeleton_unstable","useSkeletonBase_unstable","SkeletonItem","renderSkeletonItem_unstable","skeletonItemClassNames","useSkeletonItemStyles_unstable","useSkeletonItem_unstable","useSkeletonItemBase_unstable","SkeletonContextProvider","useSkeletonContext"],"mappings":";;;;;;;;;;;IACEA;iCAAQ;;IA+BDa;6CAAuB;;;eAd9BN,0BAAY;;;eACZC,yCAA2B;;;eAjB3BP,iCAAuB;;;eACvBC,4BAAkB;;IAiBlBO,sBAAsB;;;;eAbtBH,kCAAwB;;sBAyB0B;eAAlBQ;;;eA5BhCX,kCAAwB;;;eAmBxBS,0CAA4B;;;eAF5BF,4CAA8B;;;eAC9BC,sCAAwB;;;eAjBxBP,oCAA0B;;;eAC1BC,8BAAoB;;;0BAEf,aAAa;8BAgBb,iBAAiB;uBAQoC,mBAAmB"}
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  Skeleton,\n  renderSkeleton_unstable,\n  skeletonClassNames,\n  useSkeletonContextValues,\n  useSkeletonStyles_unstable,\n  useSkeleton_unstable,\n  useSkeletonBase_unstable,\n} from './Skeleton';\nexport type {\n  SkeletonContextValues,\n  SkeletonBaseProps,\n  SkeletonProps,\n  SkeletonSlots,\n  SkeletonBaseState,\n  SkeletonState,\n} from './Skeleton';\nexport {\n  SkeletonItem,\n  renderSkeletonItem_unstable,\n  skeletonItemClassNames,\n  useSkeletonItemStyles_unstable,\n  useSkeletonItem_unstable,\n  useSkeletonItemBase_unstable,\n} from './SkeletonItem';\nexport type {\n  SkeletonItemBaseProps,\n  SkeletonItemProps,\n  SkeletonItemSlots,\n  SkeletonItemBaseState,\n  SkeletonItemState,\n} from './SkeletonItem';\nexport { SkeletonContextProvider, useSkeletonContext } from './contexts/index';\nexport type { SkeletonContextValue } from './contexts/index';\n"],"names":["Skeleton","renderSkeleton_unstable","skeletonClassNames","useSkeletonContextValues","useSkeletonStyles_unstable","useSkeleton_unstable","useSkeletonBase_unstable","SkeletonItem","renderSkeletonItem_unstable","skeletonItemClassNames","useSkeletonItemStyles_unstable","useSkeletonItem_unstable","useSkeletonItemBase_unstable","SkeletonContextProvider","useSkeletonContext"],"mappings":";;;;;;;;;;;IACEA;iCAAQ;;IA+BDa;6CAAuB;;;eAd9BN,0BAAY;;;eACZC,yCAA2B;;;eAjB3BP,iCAAuB;;;eACvBC,4BAAkB;;IAiBlBO,sBAAsB;;;;eAbtBH,kCAAwB;;sBAyB0B;eAAlBQ;;;eA5BhCX,kCAAwB;;;eAmBxBS,0CAA4B;;;eAF5BF,4CAA8B;;;eAC9BC,sCAAwB;;;eAjBxBP,oCAA0B;;;eAC1BC,8BAAoB;;;0BAEf,gBAAa;8BAgBb,oBAAiB;uBAQoC,sBAAmB"}

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@fluentui/react-skeleton",
-  "version": "9.7.4",
+  "version": "9.7.5",
   "description": "Converged v9 Skeleton Component",
-  "main": "lib-commonjs/index.js",
+  "main": "lib-commonjs/index.cjs",
   "module": "lib/index.js",
   "typings": "./dist/index.d.ts",
   "sideEffects": false,
@@ -12,11 +12,11 @@
   },
   "license": "MIT",
   "dependencies": {
-    "@fluentui/react-field": "^9.5.3",
-    "@fluentui/react-jsx-runtime": "^9.4.4",
-    "@fluentui/react-shared-contexts": "^9.26.2",
-    "@fluentui/react-theme": "^9.2.1",
-    "@fluentui/react-utilities": "^9.26.5",
+    "@fluentui/react-field": "^9.5.4",
+    "@fluentui/react-jsx-runtime": "^9.4.5",
+    "@fluentui/react-shared-contexts": "^9.26.3",
+    "@fluentui/react-theme": "^9.2.2",
+    "@fluentui/react-utilities": "^9.26.6",
     "@griffel/react": "^1.5.32",
     "@swc/helpers": "^0.5.1"
   },
@@ -34,17 +34,23 @@
   },
   "exports": {
     ".": {
-      "types": "./dist/index.d.ts",
-      "node": "./lib-commonjs/index.js",
-      "import": "./lib/index.js",
-      "require": "./lib-commonjs/index.js"
+      "import": {
+        "types": "./dist/index.d.ts",
+        "default": "./lib/index.js"
+      },
+      "require": {
+        "types": "./dist/index.d.cts",
+        "default": "./lib-commonjs/index.cjs"
+      }
     },
     "./package.json": "./package.json"
   },
   "files": [
     "*.md",
     "dist/*.d.ts",
+    "dist/*.d.cts",
     "lib",
     "lib-commonjs"
-  ]
+  ],
+  "type": "module"
 }

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

@@ -1 +0,0 @@
-{"version":3,"sources":["useSkeletonStyles.styles.js"],"sourcesContent":["'use client';\nimport { 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    const styles = useStyles();\n    // eslint-disable-next-line react-hooks/immutability\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":"AAAA,YAAY;;;;;;;;;;;;IAECE,kBAAkB;;;8BAUY;eAA1BM;;;uBAXwB,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,oCAAoCE,KAAK,IAAG;IACnD,MAAMC,MAAM,GAAGN,SAAS,CAAC,CAAC;IAC1B,oDAAA;IACAK,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/SkeletonItem/useSkeletonItemStyles.styles.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["useSkeletonItemStyles.styles.js"],"sourcesContent":["'use client';\nimport { 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    14: {\n        height: '14px'\n    },\n    16: {\n        height: '16px'\n    },\n    20: {\n        height: '20px'\n    },\n    22: {\n        height: '22px'\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    52: {\n        height: '52px'\n    },\n    56: {\n        height: '56px'\n    },\n    64: {\n        height: '64px'\n    },\n    72: {\n        height: '72px'\n    },\n    92: {\n        height: '92px'\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    14: {\n        width: '14px',\n        height: '14px'\n    },\n    16: {\n        width: '16px',\n        height: '16px'\n    },\n    20: {\n        width: '20px',\n        height: '20px'\n    },\n    22: {\n        width: '22px',\n        height: '22px'\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    52: {\n        width: '52px',\n        height: '52px'\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    92: {\n        width: '92px',\n        height: '92px'\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    const { animation, appearance, size, shape } = state;\n    const rootStyles = useStyles();\n    const rectStyles = useRectangleStyles();\n    const sizeStyles = useSizeStyles();\n    const circleStyles = useCircleSizeStyles();\n    // eslint-disable-next-line react-hooks/immutability\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","Gt9ir8","Crt7la","wave","De3pzq","Br128sd","h62rwi","b1kco5","Iqrfzq","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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"}