@fluentui/react-spinner 0.0.0-nightly-20230529-0417.1 → 0.0.0-nightly-20230530-0415.1

package/CHANGELOG.json

@@ -2,9 +2,9 @@
   "name": "@fluentui/react-spinner",
   "entries": [
     {
-      "date": "Mon, 29 May 2023 04:22:29 GMT",
-      "tag": "@fluentui/react-spinner_v0.0.0-nightly-20230529-0417.1",
-      "version": "0.0.0-nightly-20230529-0417.1",
+      "date": "Tue, 30 May 2023 04:21:03 GMT",
+      "tag": "@fluentui/react-spinner_v0.0.0-nightly-20230530-0415.1",
+      "version": "0.0.0-nightly-20230530-0415.1",
       "comments": {
         "prerelease": [
           {
@@ -16,38 +16,38 @@
           {
             "author": "beachball",
             "package": "@fluentui/react-spinner",
-            "comment": "Bump @fluentui/react-jsx-runtime to v0.0.0-nightly-20230529-0417.1",
-            "commit": "7df11de7bd463f5d170ca4e80e14d2352a752b3b"
+            "comment": "Bump @fluentui/react-jsx-runtime to v0.0.0-nightly-20230530-0415.1",
+            "commit": "808fbe4052231d4cccf478348a770df18232f4f9"
           },
           {
             "author": "beachball",
             "package": "@fluentui/react-spinner",
-            "comment": "Bump @fluentui/react-label to v0.0.0-nightly-20230529-0417.1",
-            "commit": "7df11de7bd463f5d170ca4e80e14d2352a752b3b"
+            "comment": "Bump @fluentui/react-label to v0.0.0-nightly-20230530-0415.1",
+            "commit": "808fbe4052231d4cccf478348a770df18232f4f9"
           },
           {
             "author": "beachball",
             "package": "@fluentui/react-spinner",
-            "comment": "Bump @fluentui/react-shared-contexts to v0.0.0-nightly-20230529-0417.1",
-            "commit": "7df11de7bd463f5d170ca4e80e14d2352a752b3b"
+            "comment": "Bump @fluentui/react-shared-contexts to v0.0.0-nightly-20230530-0415.1",
+            "commit": "808fbe4052231d4cccf478348a770df18232f4f9"
           },
           {
             "author": "beachball",
             "package": "@fluentui/react-spinner",
-            "comment": "Bump @fluentui/react-theme to v0.0.0-nightly-20230529-0417.1",
-            "commit": "7df11de7bd463f5d170ca4e80e14d2352a752b3b"
+            "comment": "Bump @fluentui/react-theme to v0.0.0-nightly-20230530-0415.1",
+            "commit": "808fbe4052231d4cccf478348a770df18232f4f9"
           },
           {
             "author": "beachball",
             "package": "@fluentui/react-spinner",
-            "comment": "Bump @fluentui/react-utilities to v0.0.0-nightly-20230529-0417.1",
-            "commit": "7df11de7bd463f5d170ca4e80e14d2352a752b3b"
+            "comment": "Bump @fluentui/react-utilities to v0.0.0-nightly-20230530-0415.1",
+            "commit": "808fbe4052231d4cccf478348a770df18232f4f9"
           },
           {
             "author": "beachball",
             "package": "@fluentui/react-spinner",
-            "comment": "Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20230529-0417.1",
-            "commit": "7df11de7bd463f5d170ca4e80e14d2352a752b3b"
+            "comment": "Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20230530-0415.1",
+            "commit": "808fbe4052231d4cccf478348a770df18232f4f9"
           }
         ]
       }

package/CHANGELOG.md

@@ -1,23 +1,23 @@
 # Change Log - @fluentui/react-spinner
 
-This log was last generated on Mon, 29 May 2023 04:22:29 GMT and should not be manually modified.
+This log was last generated on Tue, 30 May 2023 04:21:03 GMT and should not be manually modified.
 
 <!-- Start content -->
 
-## [0.0.0-nightly-20230529-0417.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-spinner_v0.0.0-nightly-20230529-0417.1)
+## [0.0.0-nightly-20230530-0415.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-spinner_v0.0.0-nightly-20230530-0415.1)
 
-Mon, 29 May 2023 04:22:29 GMT 
-[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-spinner_v9.2.1..@fluentui/react-spinner_v0.0.0-nightly-20230529-0417.1)
+Tue, 30 May 2023 04:21:03 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-spinner_v9.2.1..@fluentui/react-spinner_v0.0.0-nightly-20230530-0415.1)
 
 ### Changes
 
 - Release nightly v9 ([commit](https://github.com/microsoft/fluentui/commit/not available) by fluentui-internal@service.microsoft.com)
-- Bump @fluentui/react-jsx-runtime to v0.0.0-nightly-20230529-0417.1 ([commit](https://github.com/microsoft/fluentui/commit/7df11de7bd463f5d170ca4e80e14d2352a752b3b) by beachball)
-- Bump @fluentui/react-label to v0.0.0-nightly-20230529-0417.1 ([commit](https://github.com/microsoft/fluentui/commit/7df11de7bd463f5d170ca4e80e14d2352a752b3b) by beachball)
-- Bump @fluentui/react-shared-contexts to v0.0.0-nightly-20230529-0417.1 ([commit](https://github.com/microsoft/fluentui/commit/7df11de7bd463f5d170ca4e80e14d2352a752b3b) by beachball)
-- Bump @fluentui/react-theme to v0.0.0-nightly-20230529-0417.1 ([commit](https://github.com/microsoft/fluentui/commit/7df11de7bd463f5d170ca4e80e14d2352a752b3b) by beachball)
-- Bump @fluentui/react-utilities to v0.0.0-nightly-20230529-0417.1 ([commit](https://github.com/microsoft/fluentui/commit/7df11de7bd463f5d170ca4e80e14d2352a752b3b) by beachball)
-- Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20230529-0417.1 ([commit](https://github.com/microsoft/fluentui/commit/7df11de7bd463f5d170ca4e80e14d2352a752b3b) by beachball)
+- Bump @fluentui/react-jsx-runtime to v0.0.0-nightly-20230530-0415.1 ([commit](https://github.com/microsoft/fluentui/commit/808fbe4052231d4cccf478348a770df18232f4f9) by beachball)
+- Bump @fluentui/react-label to v0.0.0-nightly-20230530-0415.1 ([commit](https://github.com/microsoft/fluentui/commit/808fbe4052231d4cccf478348a770df18232f4f9) by beachball)
+- Bump @fluentui/react-shared-contexts to v0.0.0-nightly-20230530-0415.1 ([commit](https://github.com/microsoft/fluentui/commit/808fbe4052231d4cccf478348a770df18232f4f9) by beachball)
+- Bump @fluentui/react-theme to v0.0.0-nightly-20230530-0415.1 ([commit](https://github.com/microsoft/fluentui/commit/808fbe4052231d4cccf478348a770df18232f4f9) by beachball)
+- Bump @fluentui/react-utilities to v0.0.0-nightly-20230530-0415.1 ([commit](https://github.com/microsoft/fluentui/commit/808fbe4052231d4cccf478348a770df18232f4f9) by beachball)
+- Bump @fluentui/react-conformance-griffel to v0.0.0-nightly-20230530-0415.1 ([commit](https://github.com/microsoft/fluentui/commit/808fbe4052231d4cccf478348a770df18232f4f9) by beachball)
 
 ## [9.2.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-spinner_v9.2.1)
 

package/lib/Spinner.js

@@ -1,2 +1,3 @@
 export * from './components/Spinner/index';
+
 //# sourceMappingURL=Spinner.js.map

package/lib/Spinner.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["../src/Spinner.ts"],"sourcesContent":["export * from './components/Spinner/index';\n"],"mappings":"AAAA,cAAc"}
+{"version":3,"sources":["../src/Spinner.ts"],"sourcesContent":["export * from './components/Spinner/index';\n"],"names":[],"mappings":"AAAA,cAAc,6BAA6B"}

package/lib/components/Spinner/DefaultSvg.js

@@ -1,9 +1,10 @@
 import * as React from 'react';
-export const DefaultSvg = () => /*#__PURE__*/React.createElement("svg", {
-  className: "fui-Spinner__Progressbar"
-}, /*#__PURE__*/React.createElement("circle", {
-  className: "fui-Spinner__Track"
-}), /*#__PURE__*/React.createElement("circle", {
-  className: "fui-Spinner__Tail"
-}));
+export const DefaultSvg = ()=>/*#__PURE__*/ React.createElement("svg", {
+        className: "fui-Spinner__Progressbar"
+    }, /*#__PURE__*/ React.createElement("circle", {
+        className: "fui-Spinner__Track"
+    }), /*#__PURE__*/ React.createElement("circle", {
+        className: "fui-Spinner__Tail"
+    }));
+
 //# sourceMappingURL=DefaultSvg.js.map

package/lib/components/Spinner/DefaultSvg.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","DefaultSvg","createElement","className"],"sources":["../../../src/components/Spinner/DefaultSvg.tsx"],"sourcesContent":["import * as React from 'react';\n\nexport const DefaultSvg = () => (\n  <svg className=\"fui-Spinner__Progressbar\">\n    <circle className=\"fui-Spinner__Track\" />\n    <circle className=\"fui-Spinner__Tail\" />\n  </svg>\n);\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AAEvB,OAAO,MAAMC,UAAA,GAAaA,CAAA,kBACxBD,KAAA,CAAAE,aAAA,CAAC;EAAIC,SAAA,EAAU;gBACbH,KAAA,CAAAE,aAAA,CAAC;EAAOC,SAAA,EAAU;iBAClBH,KAAA,CAAAE,aAAA,CAAC;EAAOC,SAAA,EAAU"}
+{"version":3,"sources":["../../../src/components/Spinner/DefaultSvg.tsx"],"sourcesContent":["import * as React from 'react';\n\nexport const DefaultSvg = () => (\n  <svg className=\"fui-Spinner__Progressbar\">\n    <circle className=\"fui-Spinner__Track\" />\n    <circle className=\"fui-Spinner__Tail\" />\n  </svg>\n);\n"],"names":["React","DefaultSvg","svg","className","circle"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAE/B,OAAO,MAAMC,aAAa,kBACxB,oBAACC;QAAIC,WAAU;qBACb,oBAACC;QAAOD,WAAU;sBAClB,oBAACC;QAAOD,WAAU;QAEpB"}

package/lib/components/Spinner/Spinner.js

@@ -5,12 +5,12 @@ import { useSpinnerStyles_unstable } from './useSpinnerStyles.styles';
 import { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';
 /**
  * Converged Spinner component for the fluentui repo
- */
-export const Spinner = /*#__PURE__*/React.forwardRef((props, ref) => {
-  const state = useSpinner_unstable(props, ref);
-  useSpinnerStyles_unstable(state);
-  useCustomStyleHook_unstable('useSpinnerStyles_unstable')(state);
-  return renderSpinner_unstable(state);
+ */ export const Spinner = /*#__PURE__*/ React.forwardRef((props, ref)=>{
+    const state = useSpinner_unstable(props, ref);
+    useSpinnerStyles_unstable(state);
+    useCustomStyleHook_unstable('useSpinnerStyles_unstable')(state);
+    return renderSpinner_unstable(state);
 });
 Spinner.displayName = 'Spinner';
+
 //# sourceMappingURL=Spinner.js.map

package/lib/components/Spinner/Spinner.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useSpinner_unstable","renderSpinner_unstable","useSpinnerStyles_unstable","useCustomStyleHook_unstable","Spinner","forwardRef","props","ref","state","displayName"],"sources":["../../../src/components/Spinner/Spinner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useSpinner_unstable } from './useSpinner';\nimport { renderSpinner_unstable } from './renderSpinner';\nimport { useSpinnerStyles_unstable } from './useSpinnerStyles.styles';\nimport type { SpinnerProps } from './Spinner.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Converged Spinner component for the fluentui repo\n */\nexport const Spinner: ForwardRefComponent<SpinnerProps> = React.forwardRef((props, ref) => {\n  const state = useSpinner_unstable(props, ref);\n\n  useSpinnerStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useSpinnerStyles_unstable')(state);\n\n  return renderSpinner_unstable(state);\n});\n\nSpinner.displayName = 'Spinner';\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,mBAAmB,QAAQ;AACpC,SAASC,sBAAsB,QAAQ;AACvC,SAASC,yBAAyB,QAAQ;AAG1C,SAASC,2BAA2B,QAAQ;AAE5C;;;AAGA,OAAO,MAAMC,OAAA,gBAA6CL,KAAA,CAAMM,UAAU,CAAC,CAACC,KAAA,EAAOC,GAAA,KAAQ;EACzF,MAAMC,KAAA,GAAQR,mBAAA,CAAoBM,KAAA,EAAOC,GAAA;EAEzCL,yBAAA,CAA0BM,KAAA;EAE1BL,2BAAA,CAA4B,6BAA6BK,KAAA;EAEzD,OAAOP,sBAAA,CAAuBO,KAAA;AAChC;AAEAJ,OAAA,CAAQK,WAAW,GAAG"}
+{"version":3,"sources":["../../../src/components/Spinner/Spinner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { useSpinner_unstable } from './useSpinner';\nimport { renderSpinner_unstable } from './renderSpinner';\nimport { useSpinnerStyles_unstable } from './useSpinnerStyles.styles';\nimport type { SpinnerProps } from './Spinner.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n\n/**\n * Converged Spinner component for the fluentui repo\n */\nexport const Spinner: ForwardRefComponent<SpinnerProps> = React.forwardRef((props, ref) => {\n  const state = useSpinner_unstable(props, ref);\n\n  useSpinnerStyles_unstable(state);\n\n  useCustomStyleHook_unstable('useSpinnerStyles_unstable')(state);\n\n  return renderSpinner_unstable(state);\n});\n\nSpinner.displayName = 'Spinner';\n"],"names":["React","useSpinner_unstable","renderSpinner_unstable","useSpinnerStyles_unstable","useCustomStyleHook_unstable","Spinner","forwardRef","props","ref","state","displayName"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,mBAAmB,QAAQ,eAAe;AACnD,SAASC,sBAAsB,QAAQ,kBAAkB;AACzD,SAASC,yBAAyB,QAAQ,4BAA4B;AAGtE,SAASC,2BAA2B,QAAQ,kCAAkC;AAE9E;;CAEC,GACD,OAAO,MAAMC,wBAA6CL,MAAMM,UAAU,CAAC,CAACC,OAAOC,MAAQ;IACzF,MAAMC,QAAQR,oBAAoBM,OAAOC;IAEzCL,0BAA0BM;IAE1BL,4BAA4B,6BAA6BK;IAEzD,OAAOP,uBAAuBO;AAChC,GAAG;AAEHJ,QAAQK,WAAW,GAAG"}

package/lib/components/Spinner/Spinner.types.js

@@ -1,2 +1,3 @@
-export {};
+export { };
+
 //# sourceMappingURL=Spinner.types.js.map

package/lib/components/Spinner/Spinner.types.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["../../../src/components/Spinner/Spinner.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { Label } from '@fluentui/react-label';\n\nexport type SpinnerSlots = {\n  /**\n   * The root of the Spinner.\n   * The root slot receives the `className` and `style` specified directly on the `<Spinner>`.\n   */\n  root: NonNullable<Slot<'div'>>;\n  /**\n   * The slot for the animated svg.\n   * The spinner slot receives the `className` and `style` that handles the spinning animation.\n   * An svg is also rendered as a child of this slot\n   */\n  spinner?: Slot<'span'>;\n  /**\n   * The label of the Slider.\n   * The label slot receives the styling related to the text associated with the Spinner.\n   */\n  label?: Slot<typeof Label>;\n};\n\n/**\n * Spinner Props\n */\nexport type SpinnerProps = Omit<ComponentProps<SpinnerSlots>, 'size'> & {\n  /**\n   * The appearance of the Spinner.\n   * @default 'primary'\n   */\n  appearance?: 'primary' | 'inverted';\n\n  /**\n   * Time in milliseconds after component mount before spinner is visible.\n   * @default 0\n   */\n  delay?: number;\n\n  /**\n   * Where the label is positioned relative to the Spinner\n   * @default 'after'\n   */\n  labelPosition?: 'above' | 'below' | 'before' | 'after';\n\n  /**\n   * The size of the spinner.\n   * @default 'medium'\n   */\n  size?: 'tiny' | 'extra-small' | 'small' | 'medium' | 'large' | 'extra-large' | 'huge';\n};\n\n/**\n * State used in rendering Spinner\n */\nexport type SpinnerState = ComponentState<SpinnerSlots> &\n  Required<Pick<SpinnerProps, 'appearance' | 'delay' | 'labelPosition' | 'size'>> & {\n    /**\n     * Should the spinner be rendered in the DOM\n     */\n    shouldRenderSpinner: boolean;\n  };\n"],"mappings":"AAAA"}
+{"version":3,"sources":["../../../src/components/Spinner/Spinner.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\nimport { Label } from '@fluentui/react-label';\n\nexport type SpinnerSlots = {\n  /**\n   * The root of the Spinner.\n   * The root slot receives the `className` and `style` specified directly on the `<Spinner>`.\n   */\n  root: NonNullable<Slot<'div'>>;\n  /**\n   * The slot for the animated svg.\n   * The spinner slot receives the `className` and `style` that handles the spinning animation.\n   * An svg is also rendered as a child of this slot\n   */\n  spinner?: Slot<'span'>;\n  /**\n   * The label of the Slider.\n   * The label slot receives the styling related to the text associated with the Spinner.\n   */\n  label?: Slot<typeof Label>;\n};\n\n/**\n * Spinner Props\n */\nexport type SpinnerProps = Omit<ComponentProps<SpinnerSlots>, 'size'> & {\n  /**\n   * The appearance of the Spinner.\n   * @default 'primary'\n   */\n  appearance?: 'primary' | 'inverted';\n\n  /**\n   * Time in milliseconds after component mount before spinner is visible.\n   * @default 0\n   */\n  delay?: number;\n\n  /**\n   * Where the label is positioned relative to the Spinner\n   * @default 'after'\n   */\n  labelPosition?: 'above' | 'below' | 'before' | 'after';\n\n  /**\n   * The size of the spinner.\n   * @default 'medium'\n   */\n  size?: 'tiny' | 'extra-small' | 'small' | 'medium' | 'large' | 'extra-large' | 'huge';\n};\n\n/**\n * State used in rendering Spinner\n */\nexport type SpinnerState = ComponentState<SpinnerSlots> &\n  Required<Pick<SpinnerProps, 'appearance' | 'delay' | 'labelPosition' | 'size'>> & {\n    /**\n     * Should the spinner be rendered in the DOM\n     */\n    shouldRenderSpinner: boolean;\n  };\n"],"names":[],"mappings":"AAAA,WA4DI"}

package/lib/components/Spinner/index.js

@@ -3,4 +3,5 @@ export * from './Spinner.types';
 export * from './renderSpinner';
 export * from './useSpinner';
 export * from './useSpinnerStyles.styles';
+
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"names":[],"sources":["../../../src/components/Spinner/index.ts"],"sourcesContent":["export * from './Spinner';\nexport * from './Spinner.types';\nexport * from './renderSpinner';\nexport * from './useSpinner';\nexport * from './useSpinnerStyles.styles';\n"],"mappings":"AAAA,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc;AACd,cAAc"}
+{"version":3,"sources":["../../../src/components/Spinner/index.ts"],"sourcesContent":["export * from './Spinner';\nexport * from './Spinner.types';\nexport * from './renderSpinner';\nexport * from './useSpinner';\nexport * from './useSpinnerStyles.styles';\n"],"names":[],"mappings":"AAAA,cAAc,YAAY;AAC1B,cAAc,kBAAkB;AAChC,cAAc,kBAAkB;AAChC,cAAc,eAAe;AAC7B,cAAc,4BAA4B"}

package/lib/components/Spinner/renderSpinner.js

@@ -1,17 +1,11 @@
-/** @jsxRuntime classic */ /** @jsx createElement */import { createElement } from '@fluentui/react-jsx-runtime';
+/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';
 import { getSlotsNext } from '@fluentui/react-utilities';
 /**
  * Render the final JSX of Spinner
- */
-export const renderSpinner_unstable = state => {
-  const {
-    slots,
-    slotProps
-  } = getSlotsNext(state);
-  const {
-    labelPosition,
-    shouldRenderSpinner
-  } = state;
-  return /*#__PURE__*/createElement(slots.root, slotProps.root, slots.label && shouldRenderSpinner && (labelPosition === 'above' || labelPosition === 'before') && /*#__PURE__*/createElement(slots.label, slotProps.label), slots.spinner && shouldRenderSpinner && /*#__PURE__*/createElement(slots.spinner, slotProps.spinner), slots.label && shouldRenderSpinner && (labelPosition === 'below' || labelPosition === 'after') && /*#__PURE__*/createElement(slots.label, slotProps.label));
+ */ export const renderSpinner_unstable = (state)=>{
+    const { slots , slotProps  } = getSlotsNext(state);
+    const { labelPosition , shouldRenderSpinner  } = state;
+    return /*#__PURE__*/ createElement(slots.root, slotProps.root, slots.label && shouldRenderSpinner && (labelPosition === 'above' || labelPosition === 'before') && /*#__PURE__*/ createElement(slots.label, slotProps.label), slots.spinner && shouldRenderSpinner && /*#__PURE__*/ createElement(slots.spinner, slotProps.spinner), slots.label && shouldRenderSpinner && (labelPosition === 'below' || labelPosition === 'after') && /*#__PURE__*/ createElement(slots.label, slotProps.label));
 };
+
 //# sourceMappingURL=renderSpinner.js.map

package/lib/components/Spinner/renderSpinner.js.map

@@ -1 +1 @@
-{"version":3,"names":["createElement","getSlotsNext","renderSpinner_unstable","state","slots","slotProps","labelPosition","shouldRenderSpinner","root","label","spinner"],"sources":["../../../src/components/Spinner/renderSpinner.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\n\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport type { SpinnerState, SpinnerSlots } from './Spinner.types';\n\n/**\n * Render the final JSX of Spinner\n */\nexport const renderSpinner_unstable = (state: SpinnerState) => {\n  const { slots, slotProps } = getSlotsNext<SpinnerSlots>(state);\n  const { labelPosition, shouldRenderSpinner } = state;\n  return (\n    <slots.root {...slotProps.root}>\n      {slots.label && shouldRenderSpinner && (labelPosition === 'above' || labelPosition === 'before') && (\n        <slots.label {...slotProps.label} />\n      )}\n      {slots.spinner && shouldRenderSpinner && <slots.spinner {...slotProps.spinner} />}\n      {slots.label && shouldRenderSpinner && (labelPosition === 'below' || labelPosition === 'after') && (\n        <slots.label {...slotProps.label} />\n      )}\n    </slots.root>\n  );\n};\n"],"mappings":"AAAA,2BACA,yBAEA,SAASA,aAAa,QAAQ;AAE9B,SAASC,YAAY,QAAQ;AAG7B;;;AAGA,OAAO,MAAMC,sBAAA,GAA0BC,KAAA,IAAwB;EAC7D,MAAM;IAAEC,KAAA;IAAOC;EAAS,CAAE,GAAGJ,YAAA,CAA2BE,KAAA;EACxD,MAAM;IAAEG,aAAA;IAAeC;EAAmB,CAAE,GAAGJ,KAAA;EAC/C,oBACEH,aAdJ,CAcKI,KAAA,CAAMI,IAAI,EAAKH,SAAA,CAAUG,IAAI,EAC3BJ,KAAA,CAAMK,KAAK,IAAIF,mBAAA,KAAwBD,aAAA,KAAkB,WAAWA,aAAA,KAAkB,QAAO,kBAC5FN,aAhBR,CAgBSI,KAAA,CAAMK,KAAK,EAAKJ,SAAA,CAAUI,KAAK,GAEjCL,KAAA,CAAMM,OAAO,IAAIH,mBAAA,iBAAuBP,aAlB/C,CAkBgDI,KAAA,CAAMM,OAAO,EAAKL,SAAA,CAAUK,OAAO,GAC5EN,KAAA,CAAMK,KAAK,IAAIF,mBAAA,KAAwBD,aAAA,KAAkB,WAAWA,aAAA,KAAkB,OAAM,kBAC3FN,aApBR,CAoBSI,KAAA,CAAMK,KAAK,EAAKJ,SAAA,CAAUI,KAAK;AAIxC"}
+{"version":3,"sources":["../../../src/components/Spinner/renderSpinner.tsx"],"sourcesContent":["/** @jsxRuntime classic */\n/** @jsx createElement */\n\nimport { createElement } from '@fluentui/react-jsx-runtime';\n\nimport { getSlotsNext } from '@fluentui/react-utilities';\nimport type { SpinnerState, SpinnerSlots } from './Spinner.types';\n\n/**\n * Render the final JSX of Spinner\n */\nexport const renderSpinner_unstable = (state: SpinnerState) => {\n  const { slots, slotProps } = getSlotsNext<SpinnerSlots>(state);\n  const { labelPosition, shouldRenderSpinner } = state;\n  return (\n    <slots.root {...slotProps.root}>\n      {slots.label && shouldRenderSpinner && (labelPosition === 'above' || labelPosition === 'before') && (\n        <slots.label {...slotProps.label} />\n      )}\n      {slots.spinner && shouldRenderSpinner && <slots.spinner {...slotProps.spinner} />}\n      {slots.label && shouldRenderSpinner && (labelPosition === 'below' || labelPosition === 'after') && (\n        <slots.label {...slotProps.label} />\n      )}\n    </slots.root>\n  );\n};\n"],"names":["createElement","getSlotsNext","renderSpinner_unstable","state","slots","slotProps","labelPosition","shouldRenderSpinner","root","label","spinner"],"mappings":"AAAA,wBAAwB,GACxB,uBAAuB,GAEvB,SAASA,aAAa,QAAQ,8BAA8B;AAE5D,SAASC,YAAY,QAAQ,4BAA4B;AAGzD;;CAEC,GACD,OAAO,MAAMC,yBAAyB,CAACC,QAAwB;IAC7D,MAAM,EAAEC,MAAK,EAAEC,UAAS,EAAE,GAAGJ,aAA2BE;IACxD,MAAM,EAAEG,cAAa,EAAEC,oBAAmB,EAAE,GAAGJ;IAC/C,qBACE,AAdJ,cAcKC,MAAMI,IAAI,EAAKH,UAAUG,IAAI,EAC3BJ,MAAMK,KAAK,IAAIF,uBAAwBD,CAAAA,kBAAkB,WAAWA,kBAAkB,QAAO,mBAC5F,AAhBR,cAgBSF,MAAMK,KAAK,EAAKJ,UAAUI,KAAK,GAEjCL,MAAMM,OAAO,IAAIH,qCAAuB,AAlB/C,cAkBgDH,MAAMM,OAAO,EAAKL,UAAUK,OAAO,GAC5EN,MAAMK,KAAK,IAAIF,uBAAwBD,CAAAA,kBAAkB,WAAWA,kBAAkB,OAAM,mBAC3F,AApBR,cAoBSF,MAAMK,KAAK,EAAKJ,UAAUI,KAAK;AAIxC,EAAE"}

package/lib/components/Spinner/useSpinner.js

@@ -10,71 +10,68 @@ import { DefaultSvg } from './DefaultSvg';
  *
  * @param props - props from this instance of Spinner
  * @param ref - reference to root HTMLElement of Spinner
- */
-export const useSpinner_unstable = (props, ref) => {
-  // Props
-  const {
-    appearance = 'primary',
-    labelPosition = 'after',
-    size = 'medium',
-    delay = 0
-  } = props;
-  const baseId = useId('spinner');
-  const {
-    role = 'progressbar',
-    tabIndex,
-    ...rest
-  } = props;
-  const nativeRoot = getNativeElementProps('div', {
-    ref,
-    role,
-    ...rest
-  }, ['size']);
-  const [isVisible, setIsVisible] = React.useState(true);
-  const [setDelayTimeout, clearDelayTimeout] = useTimeout();
-  React.useEffect(() => {
-    if (delay <= 0) {
-      return;
+ */ export const useSpinner_unstable = (props, ref)=>{
+    // Props
+    const { appearance ='primary' , labelPosition ='after' , size ='medium' , delay =0  } = props;
+    const baseId = useId('spinner');
+    const { role ='progressbar' , tabIndex , ...rest } = props;
+    const nativeRoot = getNativeElementProps('div', {
+        ref,
+        role,
+        ...rest
+    }, [
+        'size'
+    ]);
+    const [isVisible, setIsVisible] = React.useState(true);
+    const [setDelayTimeout, clearDelayTimeout] = useTimeout();
+    React.useEffect(()=>{
+        if (delay <= 0) {
+            return;
+        }
+        setIsVisible(false);
+        setDelayTimeout(()=>{
+            setIsVisible(true);
+        }, delay);
+        return ()=>{
+            clearDelayTimeout();
+        };
+    }, [
+        setDelayTimeout,
+        clearDelayTimeout,
+        delay
+    ]);
+    const labelShorthand = resolveShorthand(props.label, {
+        defaultProps: {
+            id: baseId
+        },
+        required: false
+    });
+    const spinnerShortHand = resolveShorthand(props.spinner, {
+        required: true,
+        defaultProps: {
+            children: /*#__PURE__*/ React.createElement(DefaultSvg, null),
+            tabIndex
+        }
+    });
+    if (labelShorthand && nativeRoot && !nativeRoot['aria-labelledby']) {
+        nativeRoot['aria-labelledby'] = labelShorthand.id;
     }
-    setIsVisible(false);
-    setDelayTimeout(() => {
-      setIsVisible(true);
-    }, delay);
-    return () => {
-      clearDelayTimeout();
+    const state = {
+        appearance,
+        delay,
+        labelPosition,
+        size,
+        shouldRenderSpinner: isVisible,
+        components: {
+            root: 'div',
+            spinner: 'span',
+            label: Label
+        },
+        root: nativeRoot,
+        spinner: spinnerShortHand,
+        label: labelShorthand
     };
-  }, [setDelayTimeout, clearDelayTimeout, delay]);
-  const labelShorthand = resolveShorthand(props.label, {
-    defaultProps: {
-      id: baseId
-    },
-    required: false
-  });
-  const spinnerShortHand = resolveShorthand(props.spinner, {
-    required: true,
-    defaultProps: {
-      children: /*#__PURE__*/React.createElement(DefaultSvg, null),
-      tabIndex
-    }
-  });
-  if (labelShorthand && nativeRoot && !nativeRoot['aria-labelledby']) {
-    nativeRoot['aria-labelledby'] = labelShorthand.id;
-  }
-  const state = {
-    appearance,
-    delay,
-    labelPosition,
-    size,
-    shouldRenderSpinner: isVisible,
-    components: {
-      root: 'div',
-      spinner: 'span',
-      label: Label
-    },
-    root: nativeRoot,
-    spinner: spinnerShortHand,
-    label: labelShorthand
-  };
-  return state;
+    return state;
 };
+
 //# sourceMappingURL=useSpinner.js.map

package/lib/components/Spinner/useSpinner.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","getNativeElementProps","resolveShorthand","useId","useTimeout","Label","DefaultSvg","useSpinner_unstable","props","ref","appearance","labelPosition","size","delay","baseId","role","tabIndex","rest","nativeRoot","isVisible","setIsVisible","useState","setDelayTimeout","clearDelayTimeout","useEffect","labelShorthand","label","defaultProps","id","required","spinnerShortHand","spinner","children","createElement","state","shouldRenderSpinner","components","root"],"sources":["../../../src/components/Spinner/useSpinner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId, useTimeout } from '@fluentui/react-utilities';\nimport type { SpinnerProps, SpinnerState } from './Spinner.types';\nimport { Label } from '@fluentui/react-label';\nimport { DefaultSvg } from './DefaultSvg';\n\n/**\n * Create the state required to render Spinner.\n *\n * The returned state can be modified with hooks such as useSpinnerStyles_unstable,\n * before being passed to renderSpinner_unstable.\n *\n * @param props - props from this instance of Spinner\n * @param ref - reference to root HTMLElement of Spinner\n */\nexport const useSpinner_unstable = (props: SpinnerProps, ref: React.Ref<HTMLElement>): SpinnerState => {\n  // Props\n  const { appearance = 'primary', labelPosition = 'after', size = 'medium', delay = 0 } = props;\n  const baseId = useId('spinner');\n\n  const { role = 'progressbar', tabIndex, ...rest } = props;\n  const nativeRoot = getNativeElementProps('div', { ref, role, ...rest }, ['size']);\n\n  const [isVisible, setIsVisible] = React.useState(true);\n\n  const [setDelayTimeout, clearDelayTimeout] = useTimeout();\n\n  React.useEffect(() => {\n    if (delay <= 0) {\n      return;\n    }\n    setIsVisible(false);\n    setDelayTimeout(() => {\n      setIsVisible(true);\n    }, delay);\n\n    return () => {\n      clearDelayTimeout();\n    };\n  }, [setDelayTimeout, clearDelayTimeout, delay]);\n\n  const labelShorthand = resolveShorthand(props.label, {\n    defaultProps: {\n      id: baseId,\n    },\n    required: false,\n  });\n\n  const spinnerShortHand = resolveShorthand(props.spinner, {\n    required: true,\n    defaultProps: {\n      children: <DefaultSvg />,\n      tabIndex,\n    },\n  });\n\n  if (labelShorthand && nativeRoot && !nativeRoot['aria-labelledby']) {\n    nativeRoot['aria-labelledby'] = labelShorthand.id;\n  }\n\n  const state: SpinnerState = {\n    appearance,\n    delay,\n    labelPosition,\n    size,\n    shouldRenderSpinner: isVisible,\n    components: {\n      root: 'div',\n      spinner: 'span',\n      label: Label,\n    },\n    root: nativeRoot,\n    spinner: spinnerShortHand,\n    label: labelShorthand,\n  };\n  return state;\n};\n"],"mappings":"AAAA,YAAYA,KAAA,MAAW;AACvB,SAASC,qBAAqB,EAAEC,gBAAgB,EAAEC,KAAK,EAAEC,UAAU,QAAQ;AAE3E,SAASC,KAAK,QAAQ;AACtB,SAASC,UAAU,QAAQ;AAE3B;;;;;;;;;AASA,OAAO,MAAMC,mBAAA,GAAsBA,CAACC,KAAA,EAAqBC,GAAA,KAA8C;EACrG;EACA,MAAM;IAAEC,UAAA,GAAa;IAAWC,aAAA,GAAgB;IAASC,IAAA,GAAO;IAAUC,KAAA,GAAQ;EAAC,CAAE,GAAGL,KAAA;EACxF,MAAMM,MAAA,GAASX,KAAA,CAAM;EAErB,MAAM;IAAEY,IAAA,GAAO;IAAeC,QAAA;IAAU,GAAGC;EAAA,CAAM,GAAGT,KAAA;EACpD,MAAMU,UAAA,GAAajB,qBAAA,CAAsB,OAAO;IAAEQ,GAAA;IAAKM,IAAA;IAAM,GAAGE;EAAK,GAAG,CAAC,OAAO;EAEhF,MAAM,CAACE,SAAA,EAAWC,YAAA,CAAa,GAAGpB,KAAA,CAAMqB,QAAQ,CAAC,IAAI;EAErD,MAAM,CAACC,eAAA,EAAiBC,iBAAA,CAAkB,GAAGnB,UAAA;EAE7CJ,KAAA,CAAMwB,SAAS,CAAC,MAAM;IACpB,IAAIX,KAAA,IAAS,GAAG;MACd;IACF;IACAO,YAAA,CAAa,KAAK;IAClBE,eAAA,CAAgB,MAAM;MACpBF,YAAA,CAAa,IAAI;IACnB,GAAGP,KAAA;IAEH,OAAO,MAAM;MACXU,iBAAA;IACF;EACF,GAAG,CAACD,eAAA,EAAiBC,iBAAA,EAAmBV,KAAA,CAAM;EAE9C,MAAMY,cAAA,GAAiBvB,gBAAA,CAAiBM,KAAA,CAAMkB,KAAK,EAAE;IACnDC,YAAA,EAAc;MACZC,EAAA,EAAId;IACN;IACAe,QAAA,EAAU;EACZ;EAEA,MAAMC,gBAAA,GAAmB5B,gBAAA,CAAiBM,KAAA,CAAMuB,OAAO,EAAE;IACvDF,QAAA,EAAU,IAAI;IACdF,YAAA,EAAc;MACZK,QAAA,eAAUhC,KAAA,CAAAiC,aAAA,CAAC3B,UAAA;MACXU;IACF;EACF;EAEA,IAAIS,cAAA,IAAkBP,UAAA,IAAc,CAACA,UAAU,CAAC,kBAAkB,EAAE;IAClEA,UAAU,CAAC,kBAAkB,GAAGO,cAAA,CAAeG,EAAE;EACnD;EAEA,MAAMM,KAAA,GAAsB;IAC1BxB,UAAA;IACAG,KAAA;IACAF,aAAA;IACAC,IAAA;IACAuB,mBAAA,EAAqBhB,SAAA;IACrBiB,UAAA,EAAY;MACVC,IAAA,EAAM;MACNN,OAAA,EAAS;MACTL,KAAA,EAAOrB;IACT;IACAgC,IAAA,EAAMnB,UAAA;IACNa,OAAA,EAASD,gBAAA;IACTJ,KAAA,EAAOD;EACT;EACA,OAAOS,KAAA;AACT"}
+{"version":3,"sources":["../../../src/components/Spinner/useSpinner.tsx"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId, useTimeout } from '@fluentui/react-utilities';\nimport type { SpinnerProps, SpinnerState } from './Spinner.types';\nimport { Label } from '@fluentui/react-label';\nimport { DefaultSvg } from './DefaultSvg';\n\n/**\n * Create the state required to render Spinner.\n *\n * The returned state can be modified with hooks such as useSpinnerStyles_unstable,\n * before being passed to renderSpinner_unstable.\n *\n * @param props - props from this instance of Spinner\n * @param ref - reference to root HTMLElement of Spinner\n */\nexport const useSpinner_unstable = (props: SpinnerProps, ref: React.Ref<HTMLElement>): SpinnerState => {\n  // Props\n  const { appearance = 'primary', labelPosition = 'after', size = 'medium', delay = 0 } = props;\n  const baseId = useId('spinner');\n\n  const { role = 'progressbar', tabIndex, ...rest } = props;\n  const nativeRoot = getNativeElementProps('div', { ref, role, ...rest }, ['size']);\n\n  const [isVisible, setIsVisible] = React.useState(true);\n\n  const [setDelayTimeout, clearDelayTimeout] = useTimeout();\n\n  React.useEffect(() => {\n    if (delay <= 0) {\n      return;\n    }\n    setIsVisible(false);\n    setDelayTimeout(() => {\n      setIsVisible(true);\n    }, delay);\n\n    return () => {\n      clearDelayTimeout();\n    };\n  }, [setDelayTimeout, clearDelayTimeout, delay]);\n\n  const labelShorthand = resolveShorthand(props.label, {\n    defaultProps: {\n      id: baseId,\n    },\n    required: false,\n  });\n\n  const spinnerShortHand = resolveShorthand(props.spinner, {\n    required: true,\n    defaultProps: {\n      children: <DefaultSvg />,\n      tabIndex,\n    },\n  });\n\n  if (labelShorthand && nativeRoot && !nativeRoot['aria-labelledby']) {\n    nativeRoot['aria-labelledby'] = labelShorthand.id;\n  }\n\n  const state: SpinnerState = {\n    appearance,\n    delay,\n    labelPosition,\n    size,\n    shouldRenderSpinner: isVisible,\n    components: {\n      root: 'div',\n      spinner: 'span',\n      label: Label,\n    },\n    root: nativeRoot,\n    spinner: spinnerShortHand,\n    label: labelShorthand,\n  };\n  return state;\n};\n"],"names":["React","getNativeElementProps","resolveShorthand","useId","useTimeout","Label","DefaultSvg","useSpinner_unstable","props","ref","appearance","labelPosition","size","delay","baseId","role","tabIndex","rest","nativeRoot","isVisible","setIsVisible","useState","setDelayTimeout","clearDelayTimeout","useEffect","labelShorthand","label","defaultProps","id","required","spinnerShortHand","spinner","children","state","shouldRenderSpinner","components","root"],"mappings":"AAAA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,qBAAqB,EAAEC,gBAAgB,EAAEC,KAAK,EAAEC,UAAU,QAAQ,4BAA4B;AAEvG,SAASC,KAAK,QAAQ,wBAAwB;AAC9C,SAASC,UAAU,QAAQ,eAAe;AAE1C;;;;;;;;CAQC,GACD,OAAO,MAAMC,sBAAsB,CAACC,OAAqBC,MAA8C;IACrG,QAAQ;IACR,MAAM,EAAEC,YAAa,UAAS,EAAEC,eAAgB,QAAO,EAAEC,MAAO,SAAQ,EAAEC,OAAQ,EAAC,EAAE,GAAGL;IACxF,MAAMM,SAASX,MAAM;IAErB,MAAM,EAAEY,MAAO,cAAa,EAAEC,SAAQ,EAAE,GAAGC,MAAM,GAAGT;IACpD,MAAMU,aAAajB,sBAAsB,OAAO;QAAEQ;QAAKM;QAAM,GAAGE,IAAI;IAAC,GAAG;QAAC;KAAO;IAEhF,MAAM,CAACE,WAAWC,aAAa,GAAGpB,MAAMqB,QAAQ,CAAC,IAAI;IAErD,MAAM,CAACC,iBAAiBC,kBAAkB,GAAGnB;IAE7CJ,MAAMwB,SAAS,CAAC,IAAM;QACpB,IAAIX,SAAS,GAAG;YACd;QACF,CAAC;QACDO,aAAa,KAAK;QAClBE,gBAAgB,IAAM;YACpBF,aAAa,IAAI;QACnB,GAAGP;QAEH,OAAO,IAAM;YACXU;QACF;IACF,GAAG;QAACD;QAAiBC;QAAmBV;KAAM;IAE9C,MAAMY,iBAAiBvB,iBAAiBM,MAAMkB,KAAK,EAAE;QACnDC,cAAc;YACZC,IAAId;QACN;QACAe,UAAU,KAAK;IACjB;IAEA,MAAMC,mBAAmB5B,iBAAiBM,MAAMuB,OAAO,EAAE;QACvDF,UAAU,IAAI;QACdF,cAAc;YACZK,wBAAU,oBAAC1B;YACXU;QACF;IACF;IAEA,IAAIS,kBAAkBP,cAAc,CAACA,UAAU,CAAC,kBAAkB,EAAE;QAClEA,UAAU,CAAC,kBAAkB,GAAGO,eAAeG,EAAE;IACnD,CAAC;IAED,MAAMK,QAAsB;QAC1BvB;QACAG;QACAF;QACAC;QACAsB,qBAAqBf;QACrBgB,YAAY;YACVC,MAAM;YACNL,SAAS;YACTL,OAAOrB;QACT;QACA+B,MAAMlB;QACNa,SAASD;QACTJ,OAAOD;IACT;IACA,OAAOQ;AACT,EAAE"}

package/lib/components/Spinner/useSpinnerStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["__styles","mergeClasses","shorthands","tokens","typographyStyles","spinnerClassNames","root","spinner","label","rValues","tiny","extraSmall","small","medium","large","extraLarge","huge","spinnnerSizes","spinnerAnimation","container","animationDuration","animationIterationCount","animationTimingFunction","backgroundColor","useRootStyles","mc9l5x","Bt984gj","Brf1p80","Bg96gwp","i8kkvl","Belr9w4","horizontal","Beiy3e4","vertical","d","useLoaderStyles","spinnerSVG","B3aqqti","Brovlpu","Bxa1mx5","Bwaue66","fyp1ls","ag6ruv","osj692","aq5vjd","tlu9e1","J3u96z","d32isg","Bsvqbuc","b3s3i5","Bah9ito","ut6tcf","B7p06xz","B807ibg","f","k","m","useTrackStyles","inverted","gwg7kz","Bvrehnu","Bidp6o","cq3kgi","Btwiser","B8001xd","Bdordwa","Bo2mdfu","E10nrc","Bwl7w15","Bksq7rz","primary","B8k2rxp","y14cdu","useLabelStyles","sj55zd","Bahqtrf","Be2twd7","Bhrd7zp","useSpinnerStyles_unstable","state","labelPosition","size","appearance","rootStyles","spinnerStyles","labelStyles","trackStyles","className"],"sources":["../../../src/components/Spinner/useSpinnerStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { SpinnerState, SpinnerSlots } from './Spinner.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const spinnerClassNames: SlotClassNames<SpinnerSlots> = {\n  root: 'fui-Spinner',\n  spinner: 'fui-Spinner__spinner',\n  label: 'fui-Spinner__label',\n};\n\n/*\n * TODO: Update with proper tokens when added\n * Radii for the Spinner circles\n */\nconst rValues = {\n  tiny: '9px',\n  extraSmall: '11px',\n  small: '13px',\n  medium: '14.5px',\n  large: '16.5px',\n  extraLarge: '18.5px',\n  huge: '20px',\n};\n\n/*\n * TODO: Update with proper tokens when added\n * Sizes for the Spinner\n */\nconst spinnnerSizes = {\n  tiny: '20px',\n  extraSmall: '24px',\n  small: '28px',\n  medium: '32px',\n  large: '36px',\n  extraLarge: '40px',\n  huge: '44px',\n};\n\n/*\n * TODO: Update with proper tokens when added\n * Animation for Spinner\n */\nconst spinnerAnimation = {\n  container: {\n    animationDuration: '3s',\n    animationIterationCount: 'infinite',\n    animationTimingFunction: 'linear',\n    backgroundColor: 'transparent',\n  },\n};\n\n/**\n * Styles for the root slot\n */\nconst useRootStyles = makeStyles({\n  root: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    lineHeight: '0',\n    ...shorthands.gap('8px'),\n  },\n\n  horizontal: {\n    flexDirection: 'row',\n  },\n\n  vertical: {\n    flexDirection: 'column',\n  },\n});\n\nconst useLoaderStyles = makeStyles({\n  // global SVG class\n  spinnerSVG: {\n    ':focus': {\n      ...shorthands.outline('3px', 'solid', 'transparent'),\n    },\n    ['& > svg']: {\n      animationName: {\n        '0%': { transform: 'rotate(0deg)' },\n        '100%': { transform: 'rotate(360deg)' },\n      },\n      ...spinnerAnimation.container,\n\n      '@media screen and (prefers-reduced-motion: reduce)': {\n        animationDuration: '0.01ms',\n        animationIterationCount: '1',\n      },\n    },\n    ['& > svg > circle']: {\n      cx: '50%',\n      cy: '50%',\n      fill: 'none',\n    },\n  },\n\n  tiny: {\n    ['& > svg']: {\n      height: spinnnerSizes.tiny,\n      width: spinnnerSizes.tiny,\n    },\n    ['& > svg > circle']: {\n      strokeWidth: tokens.strokeWidthThick,\n      r: rValues.tiny,\n    },\n  },\n\n  'extra-small': {\n    ['& > svg']: {\n      height: spinnnerSizes.extraSmall,\n      width: spinnnerSizes.extraSmall,\n    },\n    ['& > svg > circle']: {\n      strokeWidth: tokens.strokeWidthThick,\n      r: rValues.extraSmall,\n    },\n  },\n\n  small: {\n    ['& > svg']: {\n      height: spinnnerSizes.small,\n      width: spinnnerSizes.small,\n    },\n    ['& > svg > circle']: {\n      strokeWidth: tokens.strokeWidthThick,\n      r: rValues.small,\n    },\n  },\n\n  medium: {\n    ['& > svg']: {\n      height: spinnnerSizes.medium,\n      width: spinnnerSizes.medium,\n    },\n    ['& > svg > circle']: {\n      strokeWidth: tokens.strokeWidthThicker,\n      r: rValues.medium,\n    },\n  },\n\n  large: {\n    ['& > svg']: {\n      height: spinnnerSizes.large,\n      width: spinnnerSizes.large,\n    },\n    ['& > svg > circle']: {\n      strokeWidth: tokens.strokeWidthThicker,\n      r: rValues.large,\n    },\n  },\n\n  'extra-large': {\n    ['& > svg']: {\n      height: spinnnerSizes.extraLarge,\n      width: spinnnerSizes.extraLarge,\n    },\n    ['& > svg > circle']: {\n      strokeWidth: tokens.strokeWidthThicker,\n      r: rValues.extraLarge,\n    },\n  },\n\n  huge: {\n    ['& > svg']: {\n      height: spinnnerSizes.huge,\n      width: spinnnerSizes.huge,\n    },\n    ['& > svg > circle']: {\n      strokeWidth: tokens.strokeWidthThickest,\n      r: rValues.huge,\n    },\n  },\n});\n\nconst useTrackStyles = makeStyles({\n  inverted: {\n    ['& > svg > circle.fui-Spinner__Tail']: {\n      stroke: tokens.colorNeutralStrokeOnBrand2,\n      animationName: {\n        '0%': {\n          strokeDasharray: '1,150',\n          strokeDashoffset: '0',\n        },\n\n        '50%': {\n          strokeDasharray: '90,150',\n          strokeDashoffset: '-35',\n        },\n\n        '100%': {\n          strokeDasharray: '90,150',\n          strokeDashoffset: '-124',\n        },\n      },\n      animationDuration: '1.5s',\n      animationIterationCount: 'infinite',\n      animationTimingFunction: tokens.curveEasyEase,\n      strokeLinecap: 'round',\n      transform: 'rotate(-90deg)',\n      transformOrigin: '50% 50%',\n\n      '@media screen and (prefers-reduced-motion: reduce)': {\n        animationDuration: '0.01ms',\n        animationIterationCount: '1',\n      },\n    },\n\n    ['& > svg > circle.fui-Spinner__Track']: {\n      stroke: 'rgba(255, 255, 255, 0.2)', // this is whiteAlpha[20] but that token is not exported\n    },\n  },\n  primary: {\n    ['& > svg > circle.fui-Spinner__Tail']: {\n      stroke: tokens.colorBrandStroke1,\n      '@media screen and (forced-colors: active)': {\n        stroke: tokens.colorNeutralStrokeOnBrand2,\n      },\n      animationName: {\n        '0%': {\n          strokeDasharray: '1,150',\n          strokeDashoffset: '0',\n        },\n\n        '50%': {\n          strokeDasharray: '90,150',\n          strokeDashoffset: '-35',\n        },\n\n        '100%': {\n          strokeDasharray: '90,150',\n          strokeDashoffset: '-124',\n        },\n      },\n      animationDuration: '1.5s',\n      animationIterationCount: 'infinite',\n      animationTimingFunction: tokens.curveEasyEase,\n      strokeLinecap: 'round',\n      transform: 'rotate(-90deg)',\n      transformOrigin: '50% 50%',\n      '@media screen and (prefers-reduced-motion: reduce)': {\n        animationDuration: '0.01ms',\n        animationIterationCount: '1',\n      },\n    },\n    ['& > svg > circle.fui-Spinner__Track']: {\n      stroke: tokens.colorBrandStroke2,\n      '@media screen and (forced-colors: active)': {\n        stroke: tokens.colorNeutralBackgroundInverted,\n      },\n    },\n  },\n});\n\nconst useLabelStyles = makeStyles({\n  // style for label\n  inverted: {\n    color: 'rgba(255, 255, 255, 1)', // This is white alpha but the token is not exported\n  },\n\n  primary: {}, // no change\n\n  tiny: {\n    ...typographyStyles.body1,\n  },\n\n  'extra-small': {\n    ...typographyStyles.body1,\n  },\n\n  small: {\n    ...typographyStyles.body1,\n  },\n\n  medium: {\n    ...typographyStyles.subtitle2,\n  },\n\n  large: {\n    ...typographyStyles.subtitle2,\n  },\n\n  'extra-large': {\n    ...typographyStyles.subtitle2,\n  },\n\n  huge: {\n    ...typographyStyles.subtitle1,\n  },\n});\n\n/**\n * Apply styling to the Spinner slots based on the state\n */\nexport const useSpinnerStyles_unstable = (state: SpinnerState): SpinnerState => {\n  const { labelPosition, size, appearance = 'primary' } = state;\n  const rootStyles = useRootStyles();\n  const spinnerStyles = useLoaderStyles();\n  const labelStyles = useLabelStyles();\n  const trackStyles = useTrackStyles();\n\n  state.root.className = mergeClasses(\n    spinnerClassNames.root,\n    rootStyles.root,\n    (labelPosition === 'above' || labelPosition === 'below') && rootStyles.vertical,\n    (labelPosition === 'before' || labelPosition === 'after') && rootStyles.horizontal,\n    state.root.className,\n  );\n  if (state.spinner) {\n    state.spinner.className = mergeClasses(\n      spinnerClassNames.spinner,\n      spinnerStyles.spinnerSVG,\n      spinnerStyles[size],\n      trackStyles[appearance],\n      state.spinner.className,\n    );\n  }\n  if (state.label) {\n    state.label.className = mergeClasses(\n      spinnerClassNames.label,\n      labelStyles[size],\n      labelStyles[appearance],\n      state.label.className,\n    );\n  }\n\n  return state;\n};\n"],"mappings":"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"}
+{"version":3,"names":["__styles","mergeClasses","shorthands","tokens","typographyStyles","spinnerClassNames","root","spinner","label","rValues","tiny","extraSmall","small","medium","large","extraLarge","huge","spinnnerSizes","spinnerAnimation","container","animationDuration","animationIterationCount","animationTimingFunction","backgroundColor","useRootStyles","mc9l5x","Bt984gj","Brf1p80","Bg96gwp","i8kkvl","Belr9w4","horizontal","Beiy3e4","vertical","d","useLoaderStyles","spinnerSVG","B3aqqti","Brovlpu","Bxa1mx5","Bwaue66","fyp1ls","ag6ruv","osj692","aq5vjd","tlu9e1","J3u96z","d32isg","Bsvqbuc","b3s3i5","Bah9ito","ut6tcf","B7p06xz","B807ibg","f","k","m","useTrackStyles","inverted","gwg7kz","Bvrehnu","Bidp6o","cq3kgi","Btwiser","B8001xd","Bdordwa","Bo2mdfu","E10nrc","Bwl7w15","Bksq7rz","primary","B8k2rxp","y14cdu","useLabelStyles","sj55zd","Bahqtrf","Be2twd7","Bhrd7zp","useSpinnerStyles_unstable","state","labelPosition","size","appearance","rootStyles","spinnerStyles","labelStyles","trackStyles","className"],"sources":["../../../src/components/Spinner/useSpinnerStyles.styles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens, typographyStyles } from '@fluentui/react-theme';\nimport type { SpinnerState, SpinnerSlots } from './Spinner.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const spinnerClassNames: SlotClassNames<SpinnerSlots> = {\n  root: 'fui-Spinner',\n  spinner: 'fui-Spinner__spinner',\n  label: 'fui-Spinner__label',\n};\n\n/*\n * TODO: Update with proper tokens when added\n * Radii for the Spinner circles\n */\nconst rValues = {\n  tiny: '9px',\n  extraSmall: '11px',\n  small: '13px',\n  medium: '14.5px',\n  large: '16.5px',\n  extraLarge: '18.5px',\n  huge: '20px',\n};\n\n/*\n * TODO: Update with proper tokens when added\n * Sizes for the Spinner\n */\nconst spinnnerSizes = {\n  tiny: '20px',\n  extraSmall: '24px',\n  small: '28px',\n  medium: '32px',\n  large: '36px',\n  extraLarge: '40px',\n  huge: '44px',\n};\n\n/*\n * TODO: Update with proper tokens when added\n * Animation for Spinner\n */\nconst spinnerAnimation = {\n  container: {\n    animationDuration: '3s',\n    animationIterationCount: 'infinite',\n    animationTimingFunction: 'linear',\n    backgroundColor: 'transparent',\n  },\n};\n\n/**\n * Styles for the root slot\n */\nconst useRootStyles = makeStyles({\n  root: {\n    display: 'flex',\n    alignItems: 'center',\n    justifyContent: 'center',\n    lineHeight: '0',\n    ...shorthands.gap('8px'),\n  },\n\n  horizontal: {\n    flexDirection: 'row',\n  },\n\n  vertical: {\n    flexDirection: 'column',\n  },\n});\n\nconst useLoaderStyles = makeStyles({\n  // global SVG class\n  spinnerSVG: {\n    ':focus': {\n      ...shorthands.outline('3px', 'solid', 'transparent'),\n    },\n    ['& > svg']: {\n      animationName: {\n        '0%': { transform: 'rotate(0deg)' },\n        '100%': { transform: 'rotate(360deg)' },\n      },\n      ...spinnerAnimation.container,\n\n      '@media screen and (prefers-reduced-motion: reduce)': {\n        animationDuration: '0.01ms',\n        animationIterationCount: '1',\n      },\n    },\n    ['& > svg > circle']: {\n      cx: '50%',\n      cy: '50%',\n      fill: 'none',\n    },\n  },\n\n  tiny: {\n    ['& > svg']: {\n      height: spinnnerSizes.tiny,\n      width: spinnnerSizes.tiny,\n    },\n    ['& > svg > circle']: {\n      strokeWidth: tokens.strokeWidthThick,\n      r: rValues.tiny,\n    },\n  },\n\n  'extra-small': {\n    ['& > svg']: {\n      height: spinnnerSizes.extraSmall,\n      width: spinnnerSizes.extraSmall,\n    },\n    ['& > svg > circle']: {\n      strokeWidth: tokens.strokeWidthThick,\n      r: rValues.extraSmall,\n    },\n  },\n\n  small: {\n    ['& > svg']: {\n      height: spinnnerSizes.small,\n      width: spinnnerSizes.small,\n    },\n    ['& > svg > circle']: {\n      strokeWidth: tokens.strokeWidthThick,\n      r: rValues.small,\n    },\n  },\n\n  medium: {\n    ['& > svg']: {\n      height: spinnnerSizes.medium,\n      width: spinnnerSizes.medium,\n    },\n    ['& > svg > circle']: {\n      strokeWidth: tokens.strokeWidthThicker,\n      r: rValues.medium,\n    },\n  },\n\n  large: {\n    ['& > svg']: {\n      height: spinnnerSizes.large,\n      width: spinnnerSizes.large,\n    },\n    ['& > svg > circle']: {\n      strokeWidth: tokens.strokeWidthThicker,\n      r: rValues.large,\n    },\n  },\n\n  'extra-large': {\n    ['& > svg']: {\n      height: spinnnerSizes.extraLarge,\n      width: spinnnerSizes.extraLarge,\n    },\n    ['& > svg > circle']: {\n      strokeWidth: tokens.strokeWidthThicker,\n      r: rValues.extraLarge,\n    },\n  },\n\n  huge: {\n    ['& > svg']: {\n      height: spinnnerSizes.huge,\n      width: spinnnerSizes.huge,\n    },\n    ['& > svg > circle']: {\n      strokeWidth: tokens.strokeWidthThickest,\n      r: rValues.huge,\n    },\n  },\n});\n\nconst useTrackStyles = makeStyles({\n  inverted: {\n    ['& > svg > circle.fui-Spinner__Tail']: {\n      stroke: tokens.colorNeutralStrokeOnBrand2,\n      animationName: {\n        '0%': {\n          strokeDasharray: '1,150',\n          strokeDashoffset: '0',\n        },\n\n        '50%': {\n          strokeDasharray: '90,150',\n          strokeDashoffset: '-35',\n        },\n\n        '100%': {\n          strokeDasharray: '90,150',\n          strokeDashoffset: '-124',\n        },\n      },\n      animationDuration: '1.5s',\n      animationIterationCount: 'infinite',\n      animationTimingFunction: tokens.curveEasyEase,\n      strokeLinecap: 'round',\n      transform: 'rotate(-90deg)',\n      transformOrigin: '50% 50%',\n\n      '@media screen and (prefers-reduced-motion: reduce)': {\n        animationDuration: '0.01ms',\n        animationIterationCount: '1',\n      },\n    },\n\n    ['& > svg > circle.fui-Spinner__Track']: {\n      stroke: 'rgba(255, 255, 255, 0.2)', // this is whiteAlpha[20] but that token is not exported\n    },\n  },\n  primary: {\n    ['& > svg > circle.fui-Spinner__Tail']: {\n      stroke: tokens.colorBrandStroke1,\n      '@media screen and (forced-colors: active)': {\n        stroke: tokens.colorNeutralStrokeOnBrand2,\n      },\n      animationName: {\n        '0%': {\n          strokeDasharray: '1,150',\n          strokeDashoffset: '0',\n        },\n\n        '50%': {\n          strokeDasharray: '90,150',\n          strokeDashoffset: '-35',\n        },\n\n        '100%': {\n          strokeDasharray: '90,150',\n          strokeDashoffset: '-124',\n        },\n      },\n      animationDuration: '1.5s',\n      animationIterationCount: 'infinite',\n      animationTimingFunction: tokens.curveEasyEase,\n      strokeLinecap: 'round',\n      transform: 'rotate(-90deg)',\n      transformOrigin: '50% 50%',\n      '@media screen and (prefers-reduced-motion: reduce)': {\n        animationDuration: '0.01ms',\n        animationIterationCount: '1',\n      },\n    },\n    ['& > svg > circle.fui-Spinner__Track']: {\n      stroke: tokens.colorBrandStroke2,\n      '@media screen and (forced-colors: active)': {\n        stroke: tokens.colorNeutralBackgroundInverted,\n      },\n    },\n  },\n});\n\nconst useLabelStyles = makeStyles({\n  // style for label\n  inverted: {\n    color: 'rgba(255, 255, 255, 1)', // This is white alpha but the token is not exported\n  },\n\n  primary: {}, // no change\n\n  tiny: {\n    ...typographyStyles.body1,\n  },\n\n  'extra-small': {\n    ...typographyStyles.body1,\n  },\n\n  small: {\n    ...typographyStyles.body1,\n  },\n\n  medium: {\n    ...typographyStyles.subtitle2,\n  },\n\n  large: {\n    ...typographyStyles.subtitle2,\n  },\n\n  'extra-large': {\n    ...typographyStyles.subtitle2,\n  },\n\n  huge: {\n    ...typographyStyles.subtitle1,\n  },\n});\n\n/**\n * Apply styling to the Spinner slots based on the state\n */\nexport const useSpinnerStyles_unstable = (state: SpinnerState): SpinnerState => {\n  const { labelPosition, size, appearance = 'primary' } = state;\n  const rootStyles = useRootStyles();\n  const spinnerStyles = useLoaderStyles();\n  const labelStyles = useLabelStyles();\n  const trackStyles = useTrackStyles();\n\n  state.root.className = mergeClasses(\n    spinnerClassNames.root,\n    rootStyles.root,\n    (labelPosition === 'above' || labelPosition === 'below') && rootStyles.vertical,\n    (labelPosition === 'before' || labelPosition === 'after') && rootStyles.horizontal,\n    state.root.className,\n  );\n  if (state.spinner) {\n    state.spinner.className = mergeClasses(\n      spinnerClassNames.spinner,\n      spinnerStyles.spinnerSVG,\n      spinnerStyles[size],\n      trackStyles[appearance],\n      state.spinner.className,\n    );\n  }\n  if (state.label) {\n    state.label.className = mergeClasses(\n      spinnerClassNames.label,\n      labelStyles[size],\n      labelStyles[appearance],\n      state.label.className,\n    );\n  }\n\n  return state;\n};\n"],"mappings":"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"}

package/lib/index.js

@@ -1,2 +1,3 @@
 export { Spinner, spinnerClassNames, renderSpinner_unstable, useSpinner_unstable, useSpinnerStyles_unstable } from './Spinner';
+
 //# sourceMappingURL=index.js.map

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["Spinner","spinnerClassNames","renderSpinner_unstable","useSpinner_unstable","useSpinnerStyles_unstable"],"sources":["../src/index.ts"],"sourcesContent":["export {\n  Spinner,\n  spinnerClassNames,\n  renderSpinner_unstable,\n  useSpinner_unstable,\n  useSpinnerStyles_unstable,\n} from './Spinner';\nexport type { SpinnerProps, SpinnerSlots, SpinnerState } from './Spinner';\n"],"mappings":"AAAA,SACEA,OAAO,EACPC,iBAAiB,EACjBC,sBAAsB,EACtBC,mBAAmB,EACnBC,yBAAyB,QACpB"}
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  Spinner,\n  spinnerClassNames,\n  renderSpinner_unstable,\n  useSpinner_unstable,\n  useSpinnerStyles_unstable,\n} from './Spinner';\nexport type { SpinnerProps, SpinnerSlots, SpinnerState } from './Spinner';\n"],"names":["Spinner","spinnerClassNames","renderSpinner_unstable","useSpinner_unstable","useSpinnerStyles_unstable"],"mappings":"AAAA,SACEA,OAAO,EACPC,iBAAiB,EACjBC,sBAAsB,EACtBC,mBAAmB,EACnBC,yBAAyB,QACpB,YAAY"}

package/lib-commonjs/Spinner.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../lib/Spinner.js"],"sourcesContent":["export * from './components/Spinner/index';\n//# sourceMappingURL=Spinner.js.map"],"names":[],"mappings":";;;;;oBAAc;CACd,mCAAmC"}
+{"version":3,"sources":["../lib/Spinner.js"],"sourcesContent":["export * from './components/Spinner/index';\n\n//# sourceMappingURL=Spinner.js.map"],"names":[],"mappings":";;;;;oBAAc;CAEd,mCAAmC"}

package/lib-commonjs/components/Spinner/DefaultSvg.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../lib/components/Spinner/DefaultSvg.js"],"sourcesContent":["import * as React from 'react';\nexport const DefaultSvg = () => /*#__PURE__*/React.createElement(\"svg\", {\n  className: \"fui-Spinner__Progressbar\"\n}, /*#__PURE__*/React.createElement(\"circle\", {\n  className: \"fui-Spinner__Track\"\n}), /*#__PURE__*/React.createElement(\"circle\", {\n  className: \"fui-Spinner__Tail\"\n}));\n//# sourceMappingURL=DefaultSvg.js.map"],"names":["DefaultSvg","React","createElement","className"],"mappings":";;;;+BACaA;;aAAAA;;;6DADU;AAChB,MAAMA,aAAa,IAAM,WAAW,GAAEC,OAAMC,aAAa,CAAC,OAAO;QACtEC,WAAW;IACb,GAAG,WAAW,GAAEF,OAAMC,aAAa,CAAC,UAAU;QAC5CC,WAAW;IACb,IAAI,WAAW,GAAEF,OAAMC,aAAa,CAAC,UAAU;QAC7CC,WAAW;IACb,KACA,sCAAsC"}
+{"version":3,"sources":["../../../lib/components/Spinner/DefaultSvg.js"],"sourcesContent":["import * as React from 'react';\nexport const DefaultSvg = ()=>/*#__PURE__*/ React.createElement(\"svg\", {\n        className: \"fui-Spinner__Progressbar\"\n    }, /*#__PURE__*/ React.createElement(\"circle\", {\n        className: \"fui-Spinner__Track\"\n    }), /*#__PURE__*/ React.createElement(\"circle\", {\n        className: \"fui-Spinner__Tail\"\n    }));\n\n//# sourceMappingURL=DefaultSvg.js.map"],"names":["DefaultSvg","React","createElement","className"],"mappings":";;;;+BACaA;;aAAAA;;;6DADU;AAChB,MAAMA,aAAa,IAAI,WAAW,GAAGC,OAAMC,aAAa,CAAC,OAAO;QAC/DC,WAAW;IACf,GAAG,WAAW,GAAGF,OAAMC,aAAa,CAAC,UAAU;QAC3CC,WAAW;IACf,IAAI,WAAW,GAAGF,OAAMC,aAAa,CAAC,UAAU;QAC5CC,WAAW;IACf,KAEJ,sCAAsC"}

package/lib-commonjs/components/Spinner/Spinner.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../lib/components/Spinner/Spinner.js"],"sourcesContent":["import * as React from 'react';\nimport { useSpinner_unstable } from './useSpinner';\nimport { renderSpinner_unstable } from './renderSpinner';\nimport { useSpinnerStyles_unstable } from './useSpinnerStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n/**\n * Converged Spinner component for the fluentui repo\n */\nexport const Spinner = /*#__PURE__*/React.forwardRef((props, ref) => {\n  const state = useSpinner_unstable(props, ref);\n  useSpinnerStyles_unstable(state);\n  useCustomStyleHook_unstable('useSpinnerStyles_unstable')(state);\n  return renderSpinner_unstable(state);\n});\nSpinner.displayName = 'Spinner';\n//# sourceMappingURL=Spinner.js.map"],"names":["Spinner","React","forwardRef","props","ref","state","useSpinner_unstable","useSpinnerStyles_unstable","useCustomStyleHook_unstable","renderSpinner_unstable","displayName"],"mappings":";;;;+BAQaA;;aAAAA;;;6DARU;4BACa;+BACG;wCACG;qCACE;AAIrC,MAAMA,UAAU,WAAW,GAAEC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAQ;IACnE,MAAMC,QAAQC,IAAAA,+BAAmB,EAACH,OAAOC;IACzCG,IAAAA,iDAAyB,EAACF;IAC1BG,IAAAA,gDAA2B,EAAC,6BAA6BH;IACzD,OAAOI,IAAAA,qCAAsB,EAACJ;AAChC;AACAL,QAAQU,WAAW,GAAG,WACtB,mCAAmC"}
+{"version":3,"sources":["../../../lib/components/Spinner/Spinner.js"],"sourcesContent":["import * as React from 'react';\nimport { useSpinner_unstable } from './useSpinner';\nimport { renderSpinner_unstable } from './renderSpinner';\nimport { useSpinnerStyles_unstable } from './useSpinnerStyles.styles';\nimport { useCustomStyleHook_unstable } from '@fluentui/react-shared-contexts';\n/**\n * Converged Spinner component for the fluentui repo\n */ export const Spinner = /*#__PURE__*/ React.forwardRef((props, ref)=>{\n    const state = useSpinner_unstable(props, ref);\n    useSpinnerStyles_unstable(state);\n    useCustomStyleHook_unstable('useSpinnerStyles_unstable')(state);\n    return renderSpinner_unstable(state);\n});\nSpinner.displayName = 'Spinner';\n\n//# sourceMappingURL=Spinner.js.map"],"names":["Spinner","React","forwardRef","props","ref","state","useSpinner_unstable","useSpinnerStyles_unstable","useCustomStyleHook_unstable","renderSpinner_unstable","displayName"],"mappings":";;;;+BAOiBA;;aAAAA;;;6DAPM;4BACa;+BACG;wCACG;qCACE;AAGjC,MAAMA,UAAU,WAAW,GAAGC,OAAMC,UAAU,CAAC,CAACC,OAAOC,MAAM;IACpE,MAAMC,QAAQC,IAAAA,+BAAmB,EAACH,OAAOC;IACzCG,IAAAA,iDAAyB,EAACF;IAC1BG,IAAAA,gDAA2B,EAAC,6BAA6BH;IACzD,OAAOI,IAAAA,qCAAsB,EAACJ;AAClC;AACAL,QAAQU,WAAW,GAAG,WAEtB,mCAAmC"}

package/lib-commonjs/components/Spinner/Spinner.types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../lib/components/Spinner/Spinner.types.js"],"sourcesContent":["export {};\n//# sourceMappingURL=Spinner.types.js.map"],"names":[],"mappings":";;;;CACA,yCAAyC"}
+{"version":3,"sources":["../../../lib/components/Spinner/Spinner.types.js"],"sourcesContent":["export { };\n\n//# sourceMappingURL=Spinner.types.js.map"],"names":[],"mappings":";;;;CAEA,yCAAyC"}

package/lib-commonjs/components/Spinner/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../lib/components/Spinner/index.js"],"sourcesContent":["export * from './Spinner';\nexport * from './Spinner.types';\nexport * from './renderSpinner';\nexport * from './useSpinner';\nexport * from './useSpinnerStyles.styles';\n//# sourceMappingURL=index.js.map"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA;CACd,iCAAiC"}
+{"version":3,"sources":["../../../lib/components/Spinner/index.js"],"sourcesContent":["export * from './Spinner';\nexport * from './Spinner.types';\nexport * from './renderSpinner';\nexport * from './useSpinner';\nexport * from './useSpinnerStyles.styles';\n\n//# sourceMappingURL=index.js.map"],"names":[],"mappings":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA;CAEd,iCAAiC"}

package/lib-commonjs/components/Spinner/renderSpinner.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../lib/components/Spinner/renderSpinner.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */import { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of Spinner\n */\nexport const renderSpinner_unstable = state => {\n  const {\n    slots,\n    slotProps\n  } = getSlotsNext(state);\n  const {\n    labelPosition,\n    shouldRenderSpinner\n  } = state;\n  return /*#__PURE__*/createElement(slots.root, slotProps.root, slots.label && shouldRenderSpinner && (labelPosition === 'above' || labelPosition === 'before') && /*#__PURE__*/createElement(slots.label, slotProps.label), slots.spinner && shouldRenderSpinner && /*#__PURE__*/createElement(slots.spinner, slotProps.spinner), slots.label && shouldRenderSpinner && (labelPosition === 'below' || labelPosition === 'after') && /*#__PURE__*/createElement(slots.label, slotProps.label));\n};\n//# sourceMappingURL=renderSpinner.js.map"],"names":["renderSpinner_unstable","state","slots","slotProps","getSlotsNext","labelPosition","shouldRenderSpinner","createElement","root","label","spinner"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAKrCA;;aAAAA;;iCALqE;gCACrD;AAItB,MAAMA,yBAAyBC,CAAAA,QAAS;IAC7C,MAAM,EACJC,MAAK,EACLC,UAAS,EACV,GAAGC,IAAAA,4BAAY,EAACH;IACjB,MAAM,EACJI,cAAa,EACbC,oBAAmB,EACpB,GAAGL;IACJ,OAAO,WAAW,GAAEM,IAAAA,8BAAa,EAACL,MAAMM,IAAI,EAAEL,UAAUK,IAAI,EAAEN,MAAMO,KAAK,IAAIH,uBAAwBD,CAAAA,kBAAkB,WAAWA,kBAAkB,QAAO,KAAM,WAAW,GAAEE,IAAAA,8BAAa,EAACL,MAAMO,KAAK,EAAEN,UAAUM,KAAK,GAAGP,MAAMQ,OAAO,IAAIJ,uBAAuB,WAAW,GAAEC,IAAAA,8BAAa,EAACL,MAAMQ,OAAO,EAAEP,UAAUO,OAAO,GAAGR,MAAMO,KAAK,IAAIH,uBAAwBD,CAAAA,kBAAkB,WAAWA,kBAAkB,OAAM,KAAM,WAAW,GAAEE,IAAAA,8BAAa,EAACL,MAAMO,KAAK,EAAEN,UAAUM,KAAK;AAC5d,GACA,yCAAyC"}
+{"version":3,"sources":["../../../lib/components/Spinner/renderSpinner.js"],"sourcesContent":["/** @jsxRuntime classic */ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime';\nimport { getSlotsNext } from '@fluentui/react-utilities';\n/**\n * Render the final JSX of Spinner\n */ export const renderSpinner_unstable = (state)=>{\n    const { slots , slotProps  } = getSlotsNext(state);\n    const { labelPosition , shouldRenderSpinner  } = state;\n    return /*#__PURE__*/ createElement(slots.root, slotProps.root, slots.label && shouldRenderSpinner && (labelPosition === 'above' || labelPosition === 'before') && /*#__PURE__*/ createElement(slots.label, slotProps.label), slots.spinner && shouldRenderSpinner && /*#__PURE__*/ createElement(slots.spinner, slotProps.spinner), slots.label && shouldRenderSpinner && (labelPosition === 'below' || labelPosition === 'after') && /*#__PURE__*/ createElement(slots.label, slotProps.label));\n};\n\n//# sourceMappingURL=renderSpinner.js.map"],"names":["renderSpinner_unstable","state","slots","slotProps","getSlotsNext","labelPosition","shouldRenderSpinner","createElement","root","label","spinner"],"mappings":"AAAA,wBAAwB,GAAG,uBAAuB;;;;+BAIjCA;;aAAAA;;iCAJkE;gCACtD;AAGlB,MAAMA,yBAAyB,CAACC,QAAQ;IAC/C,MAAM,EAAEC,MAAK,EAAGC,UAAS,EAAG,GAAGC,IAAAA,4BAAY,EAACH;IAC5C,MAAM,EAAEI,cAAa,EAAGC,oBAAmB,EAAG,GAAGL;IACjD,OAAO,WAAW,GAAGM,IAAAA,8BAAa,EAACL,MAAMM,IAAI,EAAEL,UAAUK,IAAI,EAAEN,MAAMO,KAAK,IAAIH,uBAAwBD,CAAAA,kBAAkB,WAAWA,kBAAkB,QAAO,KAAM,WAAW,GAAGE,IAAAA,8BAAa,EAACL,MAAMO,KAAK,EAAEN,UAAUM,KAAK,GAAGP,MAAMQ,OAAO,IAAIJ,uBAAuB,WAAW,GAAGC,IAAAA,8BAAa,EAACL,MAAMQ,OAAO,EAAEP,UAAUO,OAAO,GAAGR,MAAMO,KAAK,IAAIH,uBAAwBD,CAAAA,kBAAkB,WAAWA,kBAAkB,OAAM,KAAM,WAAW,GAAGE,IAAAA,8BAAa,EAACL,MAAMO,KAAK,EAAEN,UAAUM,KAAK;AACle,GAEA,yCAAyC"}

package/lib-commonjs/components/Spinner/useSpinner.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../lib/components/Spinner/useSpinner.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId, useTimeout } from '@fluentui/react-utilities';\nimport { Label } from '@fluentui/react-label';\nimport { DefaultSvg } from './DefaultSvg';\n/**\n * Create the state required to render Spinner.\n *\n * The returned state can be modified with hooks such as useSpinnerStyles_unstable,\n * before being passed to renderSpinner_unstable.\n *\n * @param props - props from this instance of Spinner\n * @param ref - reference to root HTMLElement of Spinner\n */\nexport const useSpinner_unstable = (props, ref) => {\n  // Props\n  const {\n    appearance = 'primary',\n    labelPosition = 'after',\n    size = 'medium',\n    delay = 0\n  } = props;\n  const baseId = useId('spinner');\n  const {\n    role = 'progressbar',\n    tabIndex,\n    ...rest\n  } = props;\n  const nativeRoot = getNativeElementProps('div', {\n    ref,\n    role,\n    ...rest\n  }, ['size']);\n  const [isVisible, setIsVisible] = React.useState(true);\n  const [setDelayTimeout, clearDelayTimeout] = useTimeout();\n  React.useEffect(() => {\n    if (delay <= 0) {\n      return;\n    }\n    setIsVisible(false);\n    setDelayTimeout(() => {\n      setIsVisible(true);\n    }, delay);\n    return () => {\n      clearDelayTimeout();\n    };\n  }, [setDelayTimeout, clearDelayTimeout, delay]);\n  const labelShorthand = resolveShorthand(props.label, {\n    defaultProps: {\n      id: baseId\n    },\n    required: false\n  });\n  const spinnerShortHand = resolveShorthand(props.spinner, {\n    required: true,\n    defaultProps: {\n      children: /*#__PURE__*/React.createElement(DefaultSvg, null),\n      tabIndex\n    }\n  });\n  if (labelShorthand && nativeRoot && !nativeRoot['aria-labelledby']) {\n    nativeRoot['aria-labelledby'] = labelShorthand.id;\n  }\n  const state = {\n    appearance,\n    delay,\n    labelPosition,\n    size,\n    shouldRenderSpinner: isVisible,\n    components: {\n      root: 'div',\n      spinner: 'span',\n      label: Label\n    },\n    root: nativeRoot,\n    spinner: spinnerShortHand,\n    label: labelShorthand\n  };\n  return state;\n};\n//# sourceMappingURL=useSpinner.js.map"],"names":["useSpinner_unstable","props","ref","appearance","labelPosition","size","delay","baseId","useId","role","tabIndex","rest","nativeRoot","getNativeElementProps","isVisible","setIsVisible","React","useState","setDelayTimeout","clearDelayTimeout","useTimeout","useEffect","labelShorthand","resolveShorthand","label","defaultProps","id","required","spinnerShortHand","spinner","children","createElement","DefaultSvg","state","shouldRenderSpinner","components","root","Label"],"mappings":";;;;+BAaaA;;aAAAA;;;6DAbU;gCACoD;4BACrD;4BACK;AAUpB,MAAMA,sBAAsB,CAACC,OAAOC,MAAQ;IACjD,QAAQ;IACR,MAAM,EACJC,YAAa,UAAS,EACtBC,eAAgB,QAAO,EACvBC,MAAO,SAAQ,EACfC,OAAQ,EAAC,EACV,GAAGL;IACJ,MAAMM,SAASC,IAAAA,qBAAK,EAAC;IACrB,MAAM,EACJC,MAAO,cAAa,EACpBC,SAAQ,EACR,GAAGC,MACJ,GAAGV;IACJ,MAAMW,aAAaC,IAAAA,qCAAqB,EAAC,OAAO;QAC9CX;QACAO;QACA,GAAGE,IAAI;IACT,GAAG;QAAC;KAAO;IACX,MAAM,CAACG,WAAWC,aAAa,GAAGC,OAAMC,QAAQ,CAAC,IAAI;IACrD,MAAM,CAACC,iBAAiBC,kBAAkB,GAAGC,IAAAA,0BAAU;IACvDJ,OAAMK,SAAS,CAAC,IAAM;QACpB,IAAIf,SAAS,GAAG;YACd;QACF,CAAC;QACDS,aAAa,KAAK;QAClBG,gBAAgB,IAAM;YACpBH,aAAa,IAAI;QACnB,GAAGT;QACH,OAAO,IAAM;YACXa;QACF;IACF,GAAG;QAACD;QAAiBC;QAAmBb;KAAM;IAC9C,MAAMgB,iBAAiBC,IAAAA,gCAAgB,EAACtB,MAAMuB,KAAK,EAAE;QACnDC,cAAc;YACZC,IAAInB;QACN;QACAoB,UAAU,KAAK;IACjB;IACA,MAAMC,mBAAmBL,IAAAA,gCAAgB,EAACtB,MAAM4B,OAAO,EAAE;QACvDF,UAAU,IAAI;QACdF,cAAc;YACZK,UAAU,WAAW,GAAEd,OAAMe,aAAa,CAACC,sBAAU,EAAE,IAAI;YAC3DtB;QACF;IACF;IACA,IAAIY,kBAAkBV,cAAc,CAACA,UAAU,CAAC,kBAAkB,EAAE;QAClEA,UAAU,CAAC,kBAAkB,GAAGU,eAAeI,EAAE;IACnD,CAAC;IACD,MAAMO,QAAQ;QACZ9B;QACAG;QACAF;QACAC;QACA6B,qBAAqBpB;QACrBqB,YAAY;YACVC,MAAM;YACNP,SAAS;YACTL,OAAOa,iBAAK;QACd;QACAD,MAAMxB;QACNiB,SAASD;QACTJ,OAAOF;IACT;IACA,OAAOW;AACT,GACA,sCAAsC"}
+{"version":3,"sources":["../../../lib/components/Spinner/useSpinner.js"],"sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId, useTimeout } from '@fluentui/react-utilities';\nimport { Label } from '@fluentui/react-label';\nimport { DefaultSvg } from './DefaultSvg';\n/**\n * Create the state required to render Spinner.\n *\n * The returned state can be modified with hooks such as useSpinnerStyles_unstable,\n * before being passed to renderSpinner_unstable.\n *\n * @param props - props from this instance of Spinner\n * @param ref - reference to root HTMLElement of Spinner\n */ export const useSpinner_unstable = (props, ref)=>{\n    // Props\n    const { appearance ='primary' , labelPosition ='after' , size ='medium' , delay =0  } = props;\n    const baseId = useId('spinner');\n    const { role ='progressbar' , tabIndex , ...rest } = props;\n    const nativeRoot = getNativeElementProps('div', {\n        ref,\n        role,\n        ...rest\n    }, [\n        'size'\n    ]);\n    const [isVisible, setIsVisible] = React.useState(true);\n    const [setDelayTimeout, clearDelayTimeout] = useTimeout();\n    React.useEffect(()=>{\n        if (delay <= 0) {\n            return;\n        }\n        setIsVisible(false);\n        setDelayTimeout(()=>{\n            setIsVisible(true);\n        }, delay);\n        return ()=>{\n            clearDelayTimeout();\n        };\n    }, [\n        setDelayTimeout,\n        clearDelayTimeout,\n        delay\n    ]);\n    const labelShorthand = resolveShorthand(props.label, {\n        defaultProps: {\n            id: baseId\n        },\n        required: false\n    });\n    const spinnerShortHand = resolveShorthand(props.spinner, {\n        required: true,\n        defaultProps: {\n            children: /*#__PURE__*/ React.createElement(DefaultSvg, null),\n            tabIndex\n        }\n    });\n    if (labelShorthand && nativeRoot && !nativeRoot['aria-labelledby']) {\n        nativeRoot['aria-labelledby'] = labelShorthand.id;\n    }\n    const state = {\n        appearance,\n        delay,\n        labelPosition,\n        size,\n        shouldRenderSpinner: isVisible,\n        components: {\n            root: 'div',\n            spinner: 'span',\n            label: Label\n        },\n        root: nativeRoot,\n        spinner: spinnerShortHand,\n        label: labelShorthand\n    };\n    return state;\n};\n\n//# sourceMappingURL=useSpinner.js.map"],"names":["useSpinner_unstable","props","ref","appearance","labelPosition","size","delay","baseId","useId","role","tabIndex","rest","nativeRoot","getNativeElementProps","isVisible","setIsVisible","React","useState","setDelayTimeout","clearDelayTimeout","useTimeout","useEffect","labelShorthand","resolveShorthand","label","defaultProps","id","required","spinnerShortHand","spinner","children","createElement","DefaultSvg","state","shouldRenderSpinner","components","root","Label"],"mappings":";;;;+BAYiBA;;aAAAA;;;6DAZM;gCACoD;4BACrD;4BACK;AAShB,MAAMA,sBAAsB,CAACC,OAAOC,MAAM;IACjD,QAAQ;IACR,MAAM,EAAEC,YAAY,UAAS,EAAGC,eAAe,QAAO,EAAGC,MAAM,SAAQ,EAAGC,OAAO,EAAC,EAAG,GAAGL;IACxF,MAAMM,SAASC,IAAAA,qBAAK,EAAC;IACrB,MAAM,EAAEC,MAAM,cAAa,EAAGC,SAAQ,EAAG,GAAGC,MAAM,GAAGV;IACrD,MAAMW,aAAaC,IAAAA,qCAAqB,EAAC,OAAO;QAC5CX;QACAO;QACA,GAAGE,IAAI;IACX,GAAG;QACC;KACH;IACD,MAAM,CAACG,WAAWC,aAAa,GAAGC,OAAMC,QAAQ,CAAC,IAAI;IACrD,MAAM,CAACC,iBAAiBC,kBAAkB,GAAGC,IAAAA,0BAAU;IACvDJ,OAAMK,SAAS,CAAC,IAAI;QAChB,IAAIf,SAAS,GAAG;YACZ;QACJ,CAAC;QACDS,aAAa,KAAK;QAClBG,gBAAgB,IAAI;YAChBH,aAAa,IAAI;QACrB,GAAGT;QACH,OAAO,IAAI;YACPa;QACJ;IACJ,GAAG;QACCD;QACAC;QACAb;KACH;IACD,MAAMgB,iBAAiBC,IAAAA,gCAAgB,EAACtB,MAAMuB,KAAK,EAAE;QACjDC,cAAc;YACVC,IAAInB;QACR;QACAoB,UAAU,KAAK;IACnB;IACA,MAAMC,mBAAmBL,IAAAA,gCAAgB,EAACtB,MAAM4B,OAAO,EAAE;QACrDF,UAAU,IAAI;QACdF,cAAc;YACVK,UAAU,WAAW,GAAGd,OAAMe,aAAa,CAACC,sBAAU,EAAE,IAAI;YAC5DtB;QACJ;IACJ;IACA,IAAIY,kBAAkBV,cAAc,CAACA,UAAU,CAAC,kBAAkB,EAAE;QAChEA,UAAU,CAAC,kBAAkB,GAAGU,eAAeI,EAAE;IACrD,CAAC;IACD,MAAMO,QAAQ;QACV9B;QACAG;QACAF;QACAC;QACA6B,qBAAqBpB;QACrBqB,YAAY;YACRC,MAAM;YACNP,SAAS;YACTL,OAAOa,iBAAK;QAChB;QACAD,MAAMxB;QACNiB,SAASD;QACTJ,OAAOF;IACX;IACA,OAAOW;AACX,GAEA,sCAAsC"}

package/lib-commonjs/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../lib/index.js"],"sourcesContent":["export { Spinner, spinnerClassNames, renderSpinner_unstable, useSpinner_unstable, useSpinnerStyles_unstable } from './Spinner';\n//# sourceMappingURL=index.js.map"],"names":["Spinner","spinnerClassNames","renderSpinner_unstable","useSpinner_unstable","useSpinnerStyles_unstable"],"mappings":";;;;;;;;;;;IAASA,OAAO,MAAPA,gBAAO;IAAEC,iBAAiB,MAAjBA,0BAAiB;IAAEC,sBAAsB,MAAtBA,+BAAsB;IAAEC,mBAAmB,MAAnBA,4BAAmB;IAAEC,yBAAyB,MAAzBA,kCAAyB;;yBAAQ;CACnH,iCAAiC"}
+{"version":3,"sources":["../lib/index.js"],"sourcesContent":["export { Spinner, spinnerClassNames, renderSpinner_unstable, useSpinner_unstable, useSpinnerStyles_unstable } from './Spinner';\n\n//# sourceMappingURL=index.js.map"],"names":["Spinner","spinnerClassNames","renderSpinner_unstable","useSpinner_unstable","useSpinnerStyles_unstable"],"mappings":";;;;;;;;;;;IAASA,OAAO,MAAPA,gBAAO;IAAEC,iBAAiB,MAAjBA,0BAAiB;IAAEC,sBAAsB,MAAtBA,+BAAsB;IAAEC,mBAAmB,MAAnBA,4BAAmB;IAAEC,yBAAyB,MAAzBA,kCAAyB;;yBAAQ;CAEnH,iCAAiC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-spinner",
-  "version": "0.0.0-nightly-20230529-0417.1",
+  "version": "0.0.0-nightly-20230530-0415.1",
   "description": "Spinner component for Fluent UI React",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -28,16 +28,16 @@
   "devDependencies": {
     "@fluentui/eslint-plugin": "*",
     "@fluentui/react-conformance": "*",
-    "@fluentui/react-conformance-griffel": "0.0.0-nightly-20230529-0417.1",
+    "@fluentui/react-conformance-griffel": "0.0.0-nightly-20230530-0415.1",
     "@fluentui/scripts-api-extractor": "*",
     "@fluentui/scripts-tasks": "*"
   },
   "dependencies": {
-    "@fluentui/react-jsx-runtime": "0.0.0-nightly-20230529-0417.1",
-    "@fluentui/react-label": "0.0.0-nightly-20230529-0417.1",
-    "@fluentui/react-shared-contexts": "0.0.0-nightly-20230529-0417.1",
-    "@fluentui/react-theme": "0.0.0-nightly-20230529-0417.1",
-    "@fluentui/react-utilities": "0.0.0-nightly-20230529-0417.1",
+    "@fluentui/react-jsx-runtime": "0.0.0-nightly-20230530-0415.1",
+    "@fluentui/react-label": "0.0.0-nightly-20230530-0415.1",
+    "@fluentui/react-shared-contexts": "0.0.0-nightly-20230530-0415.1",
+    "@fluentui/react-theme": "0.0.0-nightly-20230530-0415.1",
+    "@fluentui/react-utilities": "0.0.0-nightly-20230530-0415.1",
     "@griffel/react": "^1.5.2",
     "@swc/helpers": "^0.4.14"
   },