@fluentui/react-spinner 9.0.10 → 9.0.11

package/CHANGELOG.json

@@ -2,7 +2,36 @@
   "name": "@fluentui/react-spinner",
   "entries": [
     {
-      "date": "Fri, 11 Nov 2022 14:53:26 GMT",
+      "date": "Thu, 17 Nov 2022 23:02:44 GMT",
+      "tag": "@fluentui/react-spinner_v9.0.11",
+      "version": "9.0.11",
+      "comments": {
+        "none": [
+          {
+            "author": "martinhochel@microsoft.com",
+            "package": "@fluentui/react-spinner",
+            "commit": "ea768501802d65d63ddc63fff3816fb6b5008ae4",
+            "comment": "chore: update package scaffold"
+          }
+        ],
+        "patch": [
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-spinner",
+            "comment": "Bump @fluentui/react-label to v9.0.11",
+            "commit": "94e156be5d3b5790d82dccf08c32672733fb9335"
+          },
+          {
+            "author": "beachball",
+            "package": "@fluentui/react-spinner",
+            "comment": "Bump @fluentui/react-utilities to v9.2.2",
+            "commit": "94e156be5d3b5790d82dccf08c32672733fb9335"
+          }
+        ]
+      }
+    },
+    {
+      "date": "Fri, 11 Nov 2022 14:57:39 GMT",
       "tag": "@fluentui/react-spinner_v9.0.10",
       "version": "9.0.10",
       "comments": {

package/CHANGELOG.md

@@ -1,12 +1,22 @@
 # Change Log - @fluentui/react-spinner
 
-This log was last generated on Fri, 11 Nov 2022 14:53:26 GMT and should not be manually modified.
+This log was last generated on Thu, 17 Nov 2022 23:02:44 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [9.0.11](https://github.com/microsoft/fluentui/tree/@fluentui/react-spinner_v9.0.11)
+
+Thu, 17 Nov 2022 23:02:44 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-spinner_v9.0.10..@fluentui/react-spinner_v9.0.11)
+
+### Patches
+
+- Bump @fluentui/react-label to v9.0.11 ([PR #25683](https://github.com/microsoft/fluentui/pull/25683) by beachball)
+- Bump @fluentui/react-utilities to v9.2.2 ([PR #25683](https://github.com/microsoft/fluentui/pull/25683) by beachball)
+
 ## [9.0.10](https://github.com/microsoft/fluentui/tree/@fluentui/react-spinner_v9.0.10)
 
-Fri, 11 Nov 2022 14:53:26 GMT 
+Fri, 11 Nov 2022 14:57:39 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-spinner_v9.0.9..@fluentui/react-spinner_v9.0.10)
 
 ### Patches

package/lib/Spinner.js.map

@@ -1 +1 @@
-{"version":3,"file":"Spinner.js","sourceRoot":"../src/","sources":["Spinner.ts"],"names":[],"mappings":"AAAA,cAAc,4BAA4B,CAAC","sourcesContent":["export * from './components/Spinner/index';\n"]}
+{"version":3,"file":"Spinner.js","sourceRoot":"../src/","sources":["packages/react-components/react-spinner/src/Spinner.ts"],"names":[],"mappings":"AAAA,cAAc,4BAA4B,CAAC","sourcesContent":["export * from './components/Spinner/index';\n"]}

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

@@ -1 +1 @@
-{"version":3,"sources":["components/Spinner/DefaultSvg.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AAEA,OAAO,MAAM,UAAU,GAAG,mBACxB,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;EAAK,SAAS,EAAC;AAAf,CAAA,eACE,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA;EAAQ,SAAS,EAAC;AAAlB,CAAA,CADF,eAEE,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA;EAAQ,SAAS,EAAC;AAAlB,CAAA,CAFF,CADK","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"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinner/src/components/Spinner/DefaultSvg.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AAEA,OAAO,MAAM,UAAU,GAAG,mBACxB,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;EAAK,SAAS,EAAC;AAAf,CAAA,eACE,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA;EAAQ,SAAS,EAAC;AAAlB,CAAA,CADF,eAEE,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA;EAAQ,SAAS,EAAC;AAAlB,CAAA,CAFF,CADK","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"],"sourceRoot":"../src/"}

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

@@ -1 +1 @@
-{"version":3,"sources":["components/Spinner/Spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,mBAAT,QAAoC,cAApC;AACA,SAAS,sBAAT,QAAuC,iBAAvC;AACA,SAAS,yBAAT,QAA0C,oBAA1C;AAIA;;AAEG;;AACH,OAAO,MAAM,OAAO,gBAAsC,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EACxF,MAAM,KAAK,GAAG,mBAAmB,CAAC,KAAD,EAAQ,GAAR,CAAjC;EAEA,yBAAyB,CAAC,KAAD,CAAzB;EACA,OAAO,sBAAsB,CAAC,KAAD,CAA7B;AACD,CALyD,CAAnD;AAOP,OAAO,CAAC,WAAR,GAAsB,SAAtB","sourcesContent":["import * as React from 'react';\nimport { useSpinner_unstable } from './useSpinner';\nimport { renderSpinner_unstable } from './renderSpinner';\nimport { useSpinnerStyles_unstable } from './useSpinnerStyles';\nimport type { SpinnerProps } from './Spinner.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\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  return renderSpinner_unstable(state);\n});\n\nSpinner.displayName = 'Spinner';\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinner/src/components/Spinner/Spinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,mBAAT,QAAoC,cAApC;AACA,SAAS,sBAAT,QAAuC,iBAAvC;AACA,SAAS,yBAAT,QAA0C,oBAA1C;AAIA;;AAEG;;AACH,OAAO,MAAM,OAAO,gBAAsC,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EACxF,MAAM,KAAK,GAAG,mBAAmB,CAAC,KAAD,EAAQ,GAAR,CAAjC;EAEA,yBAAyB,CAAC,KAAD,CAAzB;EACA,OAAO,sBAAsB,CAAC,KAAD,CAA7B;AACD,CALyD,CAAnD;AAOP,OAAO,CAAC,WAAR,GAAsB,SAAtB","sourcesContent":["import * as React from 'react';\nimport { useSpinner_unstable } from './useSpinner';\nimport { renderSpinner_unstable } from './renderSpinner';\nimport { useSpinnerStyles_unstable } from './useSpinnerStyles';\nimport type { SpinnerProps } from './Spinner.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\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  return renderSpinner_unstable(state);\n});\n\nSpinner.displayName = 'Spinner';\n"],"sourceRoot":"../src/"}

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

@@ -1 +1 @@
-{"version":3,"file":"Spinner.types.js","sourceRoot":"../src/","sources":["components/Spinner/Spinner.types.ts"],"names":[],"mappings":"","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   * 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' | 'labelPosition' | 'size'>>;\n"]}
+{"version":3,"file":"Spinner.types.js","sourceRoot":"../src/","sources":["packages/react-components/react-spinner/src/components/Spinner/Spinner.types.ts"],"names":[],"mappings":"","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   * 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' | 'labelPosition' | 'size'>>;\n"]}

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["components/Spinner/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAC;AAC1B,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC","sourcesContent":["export * from './Spinner';\nexport * from './Spinner.types';\nexport * from './renderSpinner';\nexport * from './useSpinner';\nexport * from './useSpinnerStyles';\n"]}
+{"version":3,"file":"index.js","sourceRoot":"../src/","sources":["packages/react-components/react-spinner/src/components/Spinner/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAC;AAC1B,cAAc,iBAAiB,CAAC;AAChC,cAAc,iBAAiB,CAAC;AAChC,cAAc,cAAc,CAAC;AAC7B,cAAc,oBAAoB,CAAC","sourcesContent":["export * from './Spinner';\nexport * from './Spinner.types';\nexport * from './renderSpinner';\nexport * from './useSpinner';\nexport * from './useSpinnerStyles';\n"]}

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

@@ -1 +1 @@
-{"version":3,"sources":["components/Spinner/renderSpinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,sBAAsB,GAAI,KAAD,IAAwB;EAC5D,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,QAAQ,CAAe,KAAf,CAArC;EACA,MAAM;IAAE;EAAF,IAAoB,KAA1B;EACA,oBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,EACG,KAAK,CAAC,KAAN,KAAgB,aAAa,KAAK,OAAlB,IAA6B,aAAa,KAAK,QAA/D,kBAA4E,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;EAAf,CAAZ,CAD/E,EAEG,KAAK,CAAC,OAAN,iBAAiB,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,OAAP,EAAc,EAAA,GAAK,SAAS,CAAC;EAAf,CAAd,CAFpB,EAGG,KAAK,CAAC,KAAN,KAAgB,aAAa,KAAK,OAAlB,IAA6B,aAAa,KAAK,OAA/D,kBAA2E,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;EAAf,CAAZ,CAH9E,CADF;AAOD,CAVM","sourcesContent":["import * as React from 'react';\nimport { getSlots } 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 } = getSlots<SpinnerSlots>(state);\n  const { labelPosition } = state;\n  return (\n    <slots.root {...slotProps.root}>\n      {slots.label && (labelPosition === 'above' || labelPosition === 'before') && <slots.label {...slotProps.label} />}\n      {slots.spinner && <slots.spinner {...slotProps.spinner} />}\n      {slots.label && (labelPosition === 'below' || labelPosition === 'after') && <slots.label {...slotProps.label} />}\n    </slots.root>\n  );\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinner/src/components/Spinner/renderSpinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,QAAT,QAAyB,2BAAzB;AAGA;;AAEG;;AACH,OAAO,MAAM,sBAAsB,GAAI,KAAD,IAAwB;EAC5D,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,QAAQ,CAAe,KAAf,CAArC;EACA,MAAM;IAAE;EAAF,IAAoB,KAA1B;EACA,oBACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,EACG,KAAK,CAAC,KAAN,KAAgB,aAAa,KAAK,OAAlB,IAA6B,aAAa,KAAK,QAA/D,kBAA4E,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;EAAf,CAAZ,CAD/E,EAEG,KAAK,CAAC,OAAN,iBAAiB,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,OAAP,EAAc,EAAA,GAAK,SAAS,CAAC;EAAf,CAAd,CAFpB,EAGG,KAAK,CAAC,KAAN,KAAgB,aAAa,KAAK,OAAlB,IAA6B,aAAa,KAAK,OAA/D,kBAA2E,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;EAAf,CAAZ,CAH9E,CADF;AAOD,CAVM","sourcesContent":["import * as React from 'react';\nimport { getSlots } 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 } = getSlots<SpinnerSlots>(state);\n  const { labelPosition } = state;\n  return (\n    <slots.root {...slotProps.root}>\n      {slots.label && (labelPosition === 'above' || labelPosition === 'before') && <slots.label {...slotProps.label} />}\n      {slots.spinner && <slots.spinner {...slotProps.spinner} />}\n      {slots.label && (labelPosition === 'below' || labelPosition === 'after') && <slots.label {...slotProps.label} />}\n    </slots.root>\n  );\n};\n"],"sourceRoot":"../src/"}

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

@@ -1 +1 @@
-{"version":3,"sources":["components/Spinner/useSpinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,qBAAT,EAAgC,gBAAhC,EAAkD,KAAlD,QAA+D,2BAA/D;AAEA,SAAS,KAAT,QAAsB,uBAAtB;AACA,SAAS,UAAT,QAA2B,cAA3B;AAEA;;;;;;;;AAQG;;AACH,OAAO,MAAM,mBAAmB,GAAG,CAAC,KAAD,EAAsB,GAAtB,KAAmE;EACpG;EACA,MAAM;IAAE,UAAU,GAAG,SAAf;IAA0B,aAAa,GAAG,OAA1C;IAAmD,IAAI,GAAG;EAA1D,IAAuE,KAA7E;EACA,MAAM,MAAM,GAAG,KAAK,CAAC,SAAD,CAApB;EAEA,MAAM;IAAE,IAAI,GAAG,aAAT;IAAwB,QAAxB;IAAkC,GAAG;EAArC,IAA8C,KAApD;EACA,MAAM,UAAU,GAAG,qBAAqB,CAAC,KAAD,EAAQ;IAAE,GAAF;IAAO,IAAP;IAAa,GAAG;EAAhB,CAAR,EAAgC,CAAC,MAAD,CAAhC,CAAxC;EAEA,MAAM,cAAc,GAAG,gBAAgB,CAAC,KAAK,CAAC,KAAP,EAAc;IACnD,YAAY,EAAE;MACZ,EAAE,EAAE;IADQ,CADqC;IAInD,QAAQ,EAAE;EAJyC,CAAd,CAAvC;EAOA,MAAM,gBAAgB,GAAG,gBAAgB,CAAC,KAAK,CAAC,OAAP,EAAgB;IACvD,QAAQ,EAAE,IAD6C;IAEvD,YAAY,EAAE;MACZ,QAAQ,eAAE,KAAA,CAAA,aAAA,CAAC,UAAD,EAAW,IAAX,CADE;MAEZ;IAFY;EAFyC,CAAhB,CAAzC;;EAQA,IAAI,cAAc,IAAI,UAAlB,IAAgC,CAAC,UAAU,CAAC,iBAAD,CAA/C,EAAoE;IAClE,UAAU,CAAC,iBAAD,CAAV,GAAgC,cAAc,CAAC,EAA/C;EACD;;EAED,MAAM,KAAK,GAAiB;IAC1B,UAD0B;IAE1B,aAF0B;IAG1B,IAH0B;IAI1B,UAAU,EAAE;MACV,IAAI,EAAE,KADI;MAEV,OAAO,EAAE,MAFC;MAGV,KAAK,EAAE;IAHG,CAJc;IAS1B,IAAI,EAAE,UAToB;IAU1B,OAAO,EAAE,gBAViB;IAW1B,KAAK,EAAE;EAXmB,CAA5B;EAaA,OAAO,KAAP;AACD,CAzCM","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId } 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' } = 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 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    labelPosition,\n    size,\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"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinner/src/components/Spinner/useSpinner.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAZ,MAAuB,OAAvB;AACA,SAAS,qBAAT,EAAgC,gBAAhC,EAAkD,KAAlD,QAA+D,2BAA/D;AAEA,SAAS,KAAT,QAAsB,uBAAtB;AACA,SAAS,UAAT,QAA2B,cAA3B;AAEA;;;;;;;;AAQG;;AACH,OAAO,MAAM,mBAAmB,GAAG,CAAC,KAAD,EAAsB,GAAtB,KAAmE;EACpG;EACA,MAAM;IAAE,UAAU,GAAG,SAAf;IAA0B,aAAa,GAAG,OAA1C;IAAmD,IAAI,GAAG;EAA1D,IAAuE,KAA7E;EACA,MAAM,MAAM,GAAG,KAAK,CAAC,SAAD,CAApB;EAEA,MAAM;IAAE,IAAI,GAAG,aAAT;IAAwB,QAAxB;IAAkC,GAAG;EAArC,IAA8C,KAApD;EACA,MAAM,UAAU,GAAG,qBAAqB,CAAC,KAAD,EAAQ;IAAE,GAAF;IAAO,IAAP;IAAa,GAAG;EAAhB,CAAR,EAAgC,CAAC,MAAD,CAAhC,CAAxC;EAEA,MAAM,cAAc,GAAG,gBAAgB,CAAC,KAAK,CAAC,KAAP,EAAc;IACnD,YAAY,EAAE;MACZ,EAAE,EAAE;IADQ,CADqC;IAInD,QAAQ,EAAE;EAJyC,CAAd,CAAvC;EAOA,MAAM,gBAAgB,GAAG,gBAAgB,CAAC,KAAK,CAAC,OAAP,EAAgB;IACvD,QAAQ,EAAE,IAD6C;IAEvD,YAAY,EAAE;MACZ,QAAQ,eAAE,KAAA,CAAA,aAAA,CAAC,UAAD,EAAW,IAAX,CADE;MAEZ;IAFY;EAFyC,CAAhB,CAAzC;;EAQA,IAAI,cAAc,IAAI,UAAlB,IAAgC,CAAC,UAAU,CAAC,iBAAD,CAA/C,EAAoE;IAClE,UAAU,CAAC,iBAAD,CAAV,GAAgC,cAAc,CAAC,EAA/C;EACD;;EAED,MAAM,KAAK,GAAiB;IAC1B,UAD0B;IAE1B,aAF0B;IAG1B,IAH0B;IAI1B,UAAU,EAAE;MACV,IAAI,EAAE,KADI;MAEV,OAAO,EAAE,MAFC;MAGV,KAAK,EAAE;IAHG,CAJc;IAS1B,IAAI,EAAE,UAToB;IAU1B,OAAO,EAAE,gBAViB;IAW1B,KAAK,EAAE;EAXmB,CAA5B;EAaA,OAAO,KAAP;AACD,CAzCM","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId } 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' } = 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 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    labelPosition,\n    size,\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"],"sourceRoot":"../src/"}

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

@@ -1 +1 @@
-{"version":3,"sources":["components/Spinner/useSpinnerStyles.ts"],"names":[],"mappings":"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","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"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinner/src/components/Spinner/useSpinnerStyles.ts"],"names":[],"mappings":"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","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"],"sourceRoot":"../src/"}

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"names":[],"mappings":"AAAA,SACE,OADF,EAEE,iBAFF,EAGE,sBAHF,EAIE,mBAJF,EAKE,yBALF,QAMO,WANP","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"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinner/src/index.ts"],"names":[],"mappings":"AAAA,SACE,OADF,EAEE,iBAFF,EAGE,sBAHF,EAIE,mBAJF,EAKE,yBALF,QAMO,WANP","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"],"sourceRoot":"../src/"}

package/lib-amd/Spinner.js

@@ -0,0 +1,6 @@
+define(["require", "exports", "tslib", "./components/Spinner/index"], function (require, exports, tslib_1, index_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(index_1, exports);
+});
+//# sourceMappingURL=Spinner.js.map

package/lib-amd/Spinner.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Spinner.js","sourceRoot":"","sources":["../../../../../../../packages/react-components/react-spinner/src/Spinner.ts"],"names":[],"mappings":";;;IAAA,uCAA2C","sourcesContent":["export * from './components/Spinner/index';\n"]}

package/lib-amd/components/Spinner/DefaultSvg.js

@@ -0,0 +1,10 @@
+define(["require", "exports", "react"], function (require, exports, React) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.DefaultSvg = void 0;
+    var DefaultSvg = function () { return (React.createElement("svg", { className: "fui-Spinner__Progressbar" },
+        React.createElement("circle", { className: "fui-Spinner__Track" }),
+        React.createElement("circle", { className: "fui-Spinner__Tail" }))); };
+    exports.DefaultSvg = DefaultSvg;
+});
+//# sourceMappingURL=DefaultSvg.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"DefaultSvg.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-spinner/src/components/Spinner/DefaultSvg.tsx"],"names":[],"mappings":";;;;IAEO,IAAM,UAAU,GAAG,cAAM,OAAA,CAC9B,6BAAK,SAAS,EAAC,0BAA0B;QACvC,gCAAQ,SAAS,EAAC,oBAAoB,GAAG;QACzC,gCAAQ,SAAS,EAAC,mBAAmB,GAAG,CACpC,CACP,EAL+B,CAK/B,CAAC;IALW,QAAA,UAAU,cAKrB","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"]}

package/lib-amd/components/Spinner/Spinner.js

@@ -0,0 +1,15 @@
+define(["require", "exports", "react", "./useSpinner", "./renderSpinner", "./useSpinnerStyles"], function (require, exports, React, useSpinner_1, renderSpinner_1, useSpinnerStyles_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.Spinner = void 0;
+    /**
+     * Converged Spinner component for the fluentui repo
+     */
+    exports.Spinner = React.forwardRef(function (props, ref) {
+        var state = useSpinner_1.useSpinner_unstable(props, ref);
+        useSpinnerStyles_1.useSpinnerStyles_unstable(state);
+        return renderSpinner_1.renderSpinner_unstable(state);
+    });
+    exports.Spinner.displayName = 'Spinner';
+});
+//# sourceMappingURL=Spinner.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Spinner.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-spinner/src/components/Spinner/Spinner.tsx"],"names":[],"mappings":";;;;IAOA;;OAEG;IACU,QAAA,OAAO,GAAsC,KAAK,CAAC,UAAU,CAAC,UAAC,KAAK,EAAE,GAAG;QACpF,IAAM,KAAK,GAAG,gCAAmB,CAAC,KAAK,EAAE,GAAG,CAAC,CAAC;QAE9C,4CAAyB,CAAC,KAAK,CAAC,CAAC;QACjC,OAAO,sCAAsB,CAAC,KAAK,CAAC,CAAC;IACvC,CAAC,CAAC,CAAC;IAEH,eAAO,CAAC,WAAW,GAAG,SAAS,CAAC","sourcesContent":["import * as React from 'react';\nimport { useSpinner_unstable } from './useSpinner';\nimport { renderSpinner_unstable } from './renderSpinner';\nimport { useSpinnerStyles_unstable } from './useSpinnerStyles';\nimport type { SpinnerProps } from './Spinner.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\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  return renderSpinner_unstable(state);\n});\n\nSpinner.displayName = 'Spinner';\n"]}

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

@@ -0,0 +1,5 @@
+define(["require", "exports"], function (require, exports) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+});
+//# sourceMappingURL=Spinner.types.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Spinner.types.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-spinner/src/components/Spinner/Spinner.types.ts"],"names":[],"mappings":"","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   * 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' | 'labelPosition' | 'size'>>;\n"]}

package/lib-amd/components/Spinner/index.js

@@ -0,0 +1,10 @@
+define(["require", "exports", "tslib", "./Spinner", "./Spinner.types", "./renderSpinner", "./useSpinner", "./useSpinnerStyles"], function (require, exports, tslib_1, Spinner_1, Spinner_types_1, renderSpinner_1, useSpinner_1, useSpinnerStyles_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    tslib_1.__exportStar(Spinner_1, exports);
+    tslib_1.__exportStar(Spinner_types_1, exports);
+    tslib_1.__exportStar(renderSpinner_1, exports);
+    tslib_1.__exportStar(useSpinner_1, exports);
+    tslib_1.__exportStar(useSpinnerStyles_1, exports);
+});
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-spinner/src/components/Spinner/index.ts"],"names":[],"mappings":";;;IAAA,yCAA0B;IAC1B,+CAAgC;IAChC,+CAAgC;IAChC,4CAA6B;IAC7B,kDAAmC","sourcesContent":["export * from './Spinner';\nexport * from './Spinner.types';\nexport * from './renderSpinner';\nexport * from './useSpinner';\nexport * from './useSpinnerStyles';\n"]}

package/lib-amd/components/Spinner/renderSpinner.js

@@ -0,0 +1,18 @@
+define(["require", "exports", "tslib", "react", "@fluentui/react-utilities"], function (require, exports, tslib_1, React, react_utilities_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.renderSpinner_unstable = void 0;
+    /**
+     * Render the final JSX of Spinner
+     */
+    var renderSpinner_unstable = function (state) {
+        var _a = react_utilities_1.getSlots(state), slots = _a.slots, slotProps = _a.slotProps;
+        var labelPosition = state.labelPosition;
+        return (React.createElement(slots.root, tslib_1.__assign({}, slotProps.root),
+            slots.label && (labelPosition === 'above' || labelPosition === 'before') && React.createElement(slots.label, tslib_1.__assign({}, slotProps.label)),
+            slots.spinner && React.createElement(slots.spinner, tslib_1.__assign({}, slotProps.spinner)),
+            slots.label && (labelPosition === 'below' || labelPosition === 'after') && React.createElement(slots.label, tslib_1.__assign({}, slotProps.label))));
+    };
+    exports.renderSpinner_unstable = renderSpinner_unstable;
+});
+//# sourceMappingURL=renderSpinner.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"renderSpinner.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-spinner/src/components/Spinner/renderSpinner.tsx"],"names":[],"mappings":";;;;IAIA;;OAEG;IACI,IAAM,sBAAsB,GAAG,UAAC,KAAmB;QAClD,IAAA,KAAuB,0BAAQ,CAAe,KAAK,CAAC,EAAlD,KAAK,WAAA,EAAE,SAAS,eAAkC,CAAC;QACnD,IAAA,aAAa,GAAK,KAAK,cAAV,CAAW;QAChC,OAAO,CACL,oBAAC,KAAK,CAAC,IAAI,uBAAK,SAAS,CAAC,IAAI;YAC3B,KAAK,CAAC,KAAK,IAAI,CAAC,aAAa,KAAK,OAAO,IAAI,aAAa,KAAK,QAAQ,CAAC,IAAI,oBAAC,KAAK,CAAC,KAAK,uBAAK,SAAS,CAAC,KAAK,EAAI;YAChH,KAAK,CAAC,OAAO,IAAI,oBAAC,KAAK,CAAC,OAAO,uBAAK,SAAS,CAAC,OAAO,EAAI;YACzD,KAAK,CAAC,KAAK,IAAI,CAAC,aAAa,KAAK,OAAO,IAAI,aAAa,KAAK,OAAO,CAAC,IAAI,oBAAC,KAAK,CAAC,KAAK,uBAAK,SAAS,CAAC,KAAK,EAAI,CACrG,CACd,CAAC;IACJ,CAAC,CAAC;IAVW,QAAA,sBAAsB,0BAUjC","sourcesContent":["import * as React from 'react';\nimport { getSlots } 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 } = getSlots<SpinnerSlots>(state);\n  const { labelPosition } = state;\n  return (\n    <slots.root {...slotProps.root}>\n      {slots.label && (labelPosition === 'above' || labelPosition === 'before') && <slots.label {...slotProps.label} />}\n      {slots.spinner && <slots.spinner {...slotProps.spinner} />}\n      {slots.label && (labelPosition === 'below' || labelPosition === 'after') && <slots.label {...slotProps.label} />}\n    </slots.root>\n  );\n};\n"]}

package/lib-amd/components/Spinner/useSpinner.js

@@ -0,0 +1,53 @@
+define(["require", "exports", "tslib", "react", "@fluentui/react-utilities", "@fluentui/react-label", "./DefaultSvg"], function (require, exports, tslib_1, React, react_utilities_1, react_label_1, DefaultSvg_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.useSpinner_unstable = void 0;
+    /**
+     * Create the state required to render Spinner.
+     *
+     * The returned state can be modified with hooks such as useSpinnerStyles_unstable,
+     * before being passed to renderSpinner_unstable.
+     *
+     * @param props - props from this instance of Spinner
+     * @param ref - reference to root HTMLElement of Spinner
+     */
+    var useSpinner_unstable = function (props, ref) {
+        // Props
+        var _a = props.appearance, appearance = _a === void 0 ? 'primary' : _a, _b = props.labelPosition, labelPosition = _b === void 0 ? 'after' : _b, _c = props.size, size = _c === void 0 ? 'medium' : _c;
+        var baseId = react_utilities_1.useId('spinner');
+        var _d = props.role, role = _d === void 0 ? 'progressbar' : _d, tabIndex = props.tabIndex, rest = tslib_1.__rest(props, ["role", "tabIndex"]);
+        var nativeRoot = react_utilities_1.getNativeElementProps('div', tslib_1.__assign({ ref: ref, role: role }, rest), ['size']);
+        var labelShorthand = react_utilities_1.resolveShorthand(props.label, {
+            defaultProps: {
+                id: baseId,
+            },
+            required: false,
+        });
+        var spinnerShortHand = react_utilities_1.resolveShorthand(props.spinner, {
+            required: true,
+            defaultProps: {
+                children: React.createElement(DefaultSvg_1.DefaultSvg, null),
+                tabIndex: tabIndex,
+            },
+        });
+        if (labelShorthand && nativeRoot && !nativeRoot['aria-labelledby']) {
+            nativeRoot['aria-labelledby'] = labelShorthand.id;
+        }
+        var state = {
+            appearance: appearance,
+            labelPosition: labelPosition,
+            size: size,
+            components: {
+                root: 'div',
+                spinner: 'span',
+                label: react_label_1.Label,
+            },
+            root: nativeRoot,
+            spinner: spinnerShortHand,
+            label: labelShorthand,
+        };
+        return state;
+    };
+    exports.useSpinner_unstable = useSpinner_unstable;
+});
+//# sourceMappingURL=useSpinner.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"useSpinner.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-spinner/src/components/Spinner/useSpinner.tsx"],"names":[],"mappings":";;;;IAMA;;;;;;;;OAQG;IACI,IAAM,mBAAmB,GAAG,UAAC,KAAmB,EAAE,GAA2B;QAClF,QAAQ;QACA,IAAA,KAAqE,KAAK,WAApD,EAAtB,UAAU,mBAAG,SAAS,KAAA,EAAE,KAA6C,KAAK,cAA3B,EAAvB,aAAa,mBAAG,OAAO,KAAA,EAAE,KAAoB,KAAK,KAAV,EAAf,IAAI,mBAAG,QAAQ,KAAA,CAAW;QACnF,IAAM,MAAM,GAAG,uBAAK,CAAC,SAAS,CAAC,CAAC;QAExB,IAAA,KAA4C,KAAK,KAA7B,EAApB,IAAI,mBAAG,aAAa,KAAA,EAAE,QAAQ,GAAc,KAAK,SAAnB,EAAK,IAAI,kBAAK,KAAK,EAAnD,oBAA2C,CAAF,CAAW;QAC1D,IAAM,UAAU,GAAG,uCAAqB,CAAC,KAAK,qBAAI,GAAG,KAAA,EAAE,IAAI,MAAA,IAAK,IAAI,GAAI,CAAC,MAAM,CAAC,CAAC,CAAC;QAElF,IAAM,cAAc,GAAG,kCAAgB,CAAC,KAAK,CAAC,KAAK,EAAE;YACnD,YAAY,EAAE;gBACZ,EAAE,EAAE,MAAM;aACX;YACD,QAAQ,EAAE,KAAK;SAChB,CAAC,CAAC;QAEH,IAAM,gBAAgB,GAAG,kCAAgB,CAAC,KAAK,CAAC,OAAO,EAAE;YACvD,QAAQ,EAAE,IAAI;YACd,YAAY,EAAE;gBACZ,QAAQ,EAAE,oBAAC,uBAAU,OAAG;gBACxB,QAAQ,UAAA;aACT;SACF,CAAC,CAAC;QAEH,IAAI,cAAc,IAAI,UAAU,IAAI,CAAC,UAAU,CAAC,iBAAiB,CAAC,EAAE;YAClE,UAAU,CAAC,iBAAiB,CAAC,GAAG,cAAc,CAAC,EAAE,CAAC;SACnD;QAED,IAAM,KAAK,GAAiB;YAC1B,UAAU,YAAA;YACV,aAAa,eAAA;YACb,IAAI,MAAA;YACJ,UAAU,EAAE;gBACV,IAAI,EAAE,KAAK;gBACX,OAAO,EAAE,MAAM;gBACf,KAAK,EAAE,mBAAK;aACb;YACD,IAAI,EAAE,UAAU;YAChB,OAAO,EAAE,gBAAgB;YACzB,KAAK,EAAE,cAAc;SACtB,CAAC;QACF,OAAO,KAAK,CAAC;IACf,CAAC,CAAC;IAzCW,QAAA,mBAAmB,uBAyC9B","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId } 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' } = 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 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    labelPosition,\n    size,\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"]}

package/lib-amd/components/Spinner/useSpinnerStyles.js

@@ -0,0 +1,256 @@
+define(["require", "exports", "tslib", "@griffel/react", "@fluentui/react-theme"], function (require, exports, tslib_1, react_1, react_theme_1) {
+    "use strict";
+    var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.useSpinnerStyles_unstable = exports.spinnerClassNames = void 0;
+    exports.spinnerClassNames = {
+        root: 'fui-Spinner',
+        spinner: 'fui-Spinner__spinner',
+        label: 'fui-Spinner__label',
+    };
+    /*
+     * TODO: Update with proper tokens when added
+     * Radii for the Spinner circles
+     */
+    var rValues = {
+        tiny: '9px',
+        extraSmall: '11px',
+        small: '13px',
+        medium: '14.5px',
+        large: '16.5px',
+        extraLarge: '18.5px',
+        huge: '20px',
+    };
+    /*
+     * TODO: Update with proper tokens when added
+     * Sizes for the Spinner
+     */
+    var spinnnerSizes = {
+        tiny: '20px',
+        extraSmall: '24px',
+        small: '28px',
+        medium: '32px',
+        large: '36px',
+        extraLarge: '40px',
+        huge: '44px',
+    };
+    /*
+     * TODO: Update with proper tokens when added
+     * Animation for Spinner
+     */
+    var spinnerAnimation = {
+        container: {
+            animationDuration: '3s',
+            animationIterationCount: 'infinite',
+            animationTimingFunction: 'linear',
+            backgroundColor: 'transparent',
+        },
+    };
+    /**
+     * Styles for the root slot
+     */
+    var useRootStyles = react_1.makeStyles({
+        root: tslib_1.__assign({ display: 'flex', alignItems: 'center', justifyContent: 'center', lineHeight: '0' }, react_1.shorthands.gap('8px')),
+        horizontal: {
+            flexDirection: 'row',
+        },
+        vertical: {
+            flexDirection: 'column',
+        },
+    });
+    var useLoaderStyles = react_1.makeStyles({
+        // global SVG class
+        spinnerSVG: (_a = {
+                ':focus': tslib_1.__assign({}, react_1.shorthands.outline('3px', 'solid', 'transparent'))
+            },
+            _a['& > svg'] = tslib_1.__assign(tslib_1.__assign({ animationName: {
+                    '0%': { transform: 'rotate(0deg)' },
+                    '100%': { transform: 'rotate(360deg)' },
+                } }, spinnerAnimation.container), { '@media screen and (prefers-reduced-motion: reduce)': {
+                    animationDuration: '0.01ms',
+                    animationIterationCount: '1',
+                } }),
+            _a['& > svg > circle'] = {
+                cx: '50%',
+                cy: '50%',
+                fill: 'none',
+            },
+            _a),
+        tiny: (_b = {},
+            _b['& > svg'] = {
+                height: spinnnerSizes.tiny,
+                width: spinnnerSizes.tiny,
+            },
+            _b['& > svg > circle'] = {
+                strokeWidth: react_theme_1.tokens.strokeWidthThick,
+                r: rValues.tiny,
+            },
+            _b),
+        'extra-small': (_c = {},
+            _c['& > svg'] = {
+                height: spinnnerSizes.extraSmall,
+                width: spinnnerSizes.extraSmall,
+            },
+            _c['& > svg > circle'] = {
+                strokeWidth: react_theme_1.tokens.strokeWidthThick,
+                r: rValues.extraSmall,
+            },
+            _c),
+        small: (_d = {},
+            _d['& > svg'] = {
+                height: spinnnerSizes.small,
+                width: spinnnerSizes.small,
+            },
+            _d['& > svg > circle'] = {
+                strokeWidth: react_theme_1.tokens.strokeWidthThick,
+                r: rValues.small,
+            },
+            _d),
+        medium: (_e = {},
+            _e['& > svg'] = {
+                height: spinnnerSizes.medium,
+                width: spinnnerSizes.medium,
+            },
+            _e['& > svg > circle'] = {
+                strokeWidth: react_theme_1.tokens.strokeWidthThicker,
+                r: rValues.medium,
+            },
+            _e),
+        large: (_f = {},
+            _f['& > svg'] = {
+                height: spinnnerSizes.large,
+                width: spinnnerSizes.large,
+            },
+            _f['& > svg > circle'] = {
+                strokeWidth: react_theme_1.tokens.strokeWidthThicker,
+                r: rValues.large,
+            },
+            _f),
+        'extra-large': (_g = {},
+            _g['& > svg'] = {
+                height: spinnnerSizes.extraLarge,
+                width: spinnnerSizes.extraLarge,
+            },
+            _g['& > svg > circle'] = {
+                strokeWidth: react_theme_1.tokens.strokeWidthThicker,
+                r: rValues.extraLarge,
+            },
+            _g),
+        huge: (_h = {},
+            _h['& > svg'] = {
+                height: spinnnerSizes.huge,
+                width: spinnnerSizes.huge,
+            },
+            _h['& > svg > circle'] = {
+                strokeWidth: react_theme_1.tokens.strokeWidthThickest,
+                r: rValues.huge,
+            },
+            _h),
+    });
+    var useTrackStyles = react_1.makeStyles({
+        inverted: (_j = {},
+            _j['& > svg > circle.fui-Spinner__Tail'] = {
+                stroke: react_theme_1.tokens.colorNeutralStrokeOnBrand2,
+                animationName: {
+                    '0%': {
+                        strokeDasharray: '1,150',
+                        strokeDashoffset: '0',
+                    },
+                    '50%': {
+                        strokeDasharray: '90,150',
+                        strokeDashoffset: '-35',
+                    },
+                    '100%': {
+                        strokeDasharray: '90,150',
+                        strokeDashoffset: '-124',
+                    },
+                },
+                animationDuration: '1.5s',
+                animationIterationCount: 'infinite',
+                animationTimingFunction: react_theme_1.tokens.curveEasyEase,
+                strokeLinecap: 'round',
+                transform: 'rotate(-90deg)',
+                transformOrigin: '50% 50%',
+                '@media screen and (prefers-reduced-motion: reduce)': {
+                    animationDuration: '0.01ms',
+                    animationIterationCount: '1',
+                },
+            },
+            _j['& > svg > circle.fui-Spinner__Track'] = {
+                stroke: 'rgba(255, 255, 255, 0.2)', // this is whiteAlpha[20] but that token is not exported
+            },
+            _j),
+        primary: (_k = {},
+            _k['& > svg > circle.fui-Spinner__Tail'] = {
+                stroke: react_theme_1.tokens.colorBrandStroke1,
+                '@media screen and (forced-colors: active)': {
+                    stroke: react_theme_1.tokens.colorNeutralStrokeOnBrand2,
+                },
+                animationName: {
+                    '0%': {
+                        strokeDasharray: '1,150',
+                        strokeDashoffset: '0',
+                    },
+                    '50%': {
+                        strokeDasharray: '90,150',
+                        strokeDashoffset: '-35',
+                    },
+                    '100%': {
+                        strokeDasharray: '90,150',
+                        strokeDashoffset: '-124',
+                    },
+                },
+                animationDuration: '1.5s',
+                animationIterationCount: 'infinite',
+                animationTimingFunction: react_theme_1.tokens.curveEasyEase,
+                strokeLinecap: 'round',
+                transform: 'rotate(-90deg)',
+                transformOrigin: '50% 50%',
+                '@media screen and (prefers-reduced-motion: reduce)': {
+                    animationDuration: '0.01ms',
+                    animationIterationCount: '1',
+                },
+            },
+            _k['& > svg > circle.fui-Spinner__Track'] = {
+                stroke: react_theme_1.tokens.colorBrandStroke2,
+                '@media screen and (forced-colors: active)': {
+                    stroke: react_theme_1.tokens.colorNeutralBackgroundInverted,
+                },
+            },
+            _k),
+    });
+    var useLabelStyles = react_1.makeStyles({
+        // style for label
+        inverted: {
+            color: 'rgba(255, 255, 255, 1)', // This is white alpha but the token is not exported
+        },
+        primary: {},
+        tiny: tslib_1.__assign({}, react_theme_1.typographyStyles.body1),
+        'extra-small': tslib_1.__assign({}, react_theme_1.typographyStyles.body1),
+        small: tslib_1.__assign({}, react_theme_1.typographyStyles.body1),
+        medium: tslib_1.__assign({}, react_theme_1.typographyStyles.subtitle2),
+        large: tslib_1.__assign({}, react_theme_1.typographyStyles.subtitle2),
+        'extra-large': tslib_1.__assign({}, react_theme_1.typographyStyles.subtitle2),
+        huge: tslib_1.__assign({}, react_theme_1.typographyStyles.subtitle1),
+    });
+    /**
+     * Apply styling to the Spinner slots based on the state
+     */
+    var useSpinnerStyles_unstable = function (state) {
+        var labelPosition = state.labelPosition, size = state.size, _a = state.appearance, appearance = _a === void 0 ? 'primary' : _a;
+        var rootStyles = useRootStyles();
+        var spinnerStyles = useLoaderStyles();
+        var labelStyles = useLabelStyles();
+        var trackStyles = useTrackStyles();
+        state.root.className = react_1.mergeClasses(exports.spinnerClassNames.root, rootStyles.root, (labelPosition === 'above' || labelPosition === 'below') && rootStyles.vertical, (labelPosition === 'before' || labelPosition === 'after') && rootStyles.horizontal, state.root.className);
+        if (state.spinner) {
+            state.spinner.className = react_1.mergeClasses(exports.spinnerClassNames.spinner, spinnerStyles.spinnerSVG, spinnerStyles[size], trackStyles[appearance], state.spinner.className);
+        }
+        if (state.label) {
+            state.label.className = react_1.mergeClasses(exports.spinnerClassNames.label, labelStyles[size], labelStyles[appearance], state.label.className);
+        }
+        return state;
+    };
+    exports.useSpinnerStyles_unstable = useSpinnerStyles_unstable;
+});
+//# sourceMappingURL=useSpinnerStyles.js.map

package/lib-amd/components/Spinner/useSpinnerStyles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSpinnerStyles.js","sourceRoot":"","sources":["../../../../../../../../../packages/react-components/react-spinner/src/components/Spinner/useSpinnerStyles.ts"],"names":[],"mappings":"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","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"]}

package/lib-amd/index.js

@@ -0,0 +1,11 @@
+define(["require", "exports", "./Spinner"], function (require, exports, Spinner_1) {
+    "use strict";
+    Object.defineProperty(exports, "__esModule", { value: true });
+    exports.useSpinnerStyles_unstable = exports.useSpinner_unstable = exports.renderSpinner_unstable = exports.spinnerClassNames = exports.Spinner = void 0;
+    Object.defineProperty(exports, "Spinner", { enumerable: true, get: function () { return Spinner_1.Spinner; } });
+    Object.defineProperty(exports, "spinnerClassNames", { enumerable: true, get: function () { return Spinner_1.spinnerClassNames; } });
+    Object.defineProperty(exports, "renderSpinner_unstable", { enumerable: true, get: function () { return Spinner_1.renderSpinner_unstable; } });
+    Object.defineProperty(exports, "useSpinner_unstable", { enumerable: true, get: function () { return Spinner_1.useSpinner_unstable; } });
+    Object.defineProperty(exports, "useSpinnerStyles_unstable", { enumerable: true, get: function () { return Spinner_1.useSpinnerStyles_unstable; } });
+});
+//# sourceMappingURL=index.js.map

package/lib-amd/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../../packages/react-components/react-spinner/src/index.ts"],"names":[],"mappings":";;;;IACE,kGAAA,OAAO,OAAA;IACP,4GAAA,iBAAiB,OAAA;IACjB,iHAAA,sBAAsB,OAAA;IACtB,8GAAA,mBAAmB,OAAA;IACnB,oHAAA,yBAAyB,OAAA","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"]}

package/lib-commonjs/Spinner.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Spinner.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,4BAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './components/Spinner/index';\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinner/src/Spinner.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,4BAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './components/Spinner/index';\n"],"sourceRoot":"../src/"}

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

@@ -1 +1 @@
-{"version":3,"sources":["components/Spinner/DefaultSvg.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAEO,MAAM,UAAU,GAAG,MACxB,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;EAAK,SAAS,EAAC;AAAf,CAAA,EACE,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA;EAAQ,SAAS,EAAC;AAAlB,CAAA,CADF,EAEE,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA;EAAQ,SAAS,EAAC;AAAlB,CAAA,CAFF,CADK;;AAAM,OAAA,CAAA,UAAA,GAAU,UAAV","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"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinner/src/components/Spinner/DefaultSvg.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AAEO,MAAM,UAAU,GAAG,MACxB,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA;EAAK,SAAS,EAAC;AAAf,CAAA,EACE,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA;EAAQ,SAAS,EAAC;AAAlB,CAAA,CADF,EAEE,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA;EAAQ,SAAS,EAAC;AAAlB,CAAA,CAFF,CADK;;AAAM,OAAA,CAAA,UAAA,GAAU,UAAV","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"],"sourceRoot":"../src/"}

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

@@ -1 +1 @@
-{"version":3,"sources":["components/Spinner/Spinner.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;;AACA,MAAA,eAAA,gBAAA,OAAA,CAAA,iBAAA,CAAA;;AACA,MAAA,kBAAA,gBAAA,OAAA,CAAA,oBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,OAAA,gBAA6C,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EACxF,MAAM,KAAK,GAAG,YAAA,CAAA,mBAAA,CAAoB,KAApB,EAA2B,GAA3B,CAAd;EAEA,kBAAA,CAAA,yBAAA,CAA0B,KAA1B;EACA,OAAO,eAAA,CAAA,sBAAA,CAAuB,KAAvB,CAAP;AACD,CALyD,CAA7C;AAOb,OAAA,CAAA,OAAA,CAAQ,WAAR,GAAsB,SAAtB","sourcesContent":["import * as React from 'react';\nimport { useSpinner_unstable } from './useSpinner';\nimport { renderSpinner_unstable } from './renderSpinner';\nimport { useSpinnerStyles_unstable } from './useSpinnerStyles';\nimport type { SpinnerProps } from './Spinner.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\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  return renderSpinner_unstable(state);\n});\n\nSpinner.displayName = 'Spinner';\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinner/src/components/Spinner/Spinner.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;;AACA,MAAA,eAAA,gBAAA,OAAA,CAAA,iBAAA,CAAA;;AACA,MAAA,kBAAA,gBAAA,OAAA,CAAA,oBAAA,CAAA;AAIA;;AAEG;;;AACU,OAAA,CAAA,OAAA,gBAA6C,KAAK,CAAC,UAAN,CAAiB,CAAC,KAAD,EAAQ,GAAR,KAAe;EACxF,MAAM,KAAK,GAAG,YAAA,CAAA,mBAAA,CAAoB,KAApB,EAA2B,GAA3B,CAAd;EAEA,kBAAA,CAAA,yBAAA,CAA0B,KAA1B;EACA,OAAO,eAAA,CAAA,sBAAA,CAAuB,KAAvB,CAAP;AACD,CALyD,CAA7C;AAOb,OAAA,CAAA,OAAA,CAAQ,WAAR,GAAsB,SAAtB","sourcesContent":["import * as React from 'react';\nimport { useSpinner_unstable } from './useSpinner';\nimport { renderSpinner_unstable } from './renderSpinner';\nimport { useSpinnerStyles_unstable } from './useSpinnerStyles';\nimport type { SpinnerProps } from './Spinner.types';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\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  return renderSpinner_unstable(state);\n});\n\nSpinner.displayName = 'Spinner';\n"],"sourceRoot":"../src/"}

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

@@ -1 +1 @@
-{"version":3,"sources":["components/Spinner/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,WAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,cAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,oBAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './Spinner';\nexport * from './Spinner.types';\nexport * from './renderSpinner';\nexport * from './useSpinner';\nexport * from './useSpinnerStyles';\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinner/src/components/Spinner/index.ts"],"names":[],"mappings":";;;;;;;;AAAA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,WAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,iBAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,cAAA,CAAA,EAAA,OAAA;;AACA,OAAA,CAAA,YAAA,CAAA,OAAA,CAAA,oBAAA,CAAA,EAAA,OAAA","sourcesContent":["export * from './Spinner';\nexport * from './Spinner.types';\nexport * from './renderSpinner';\nexport * from './useSpinner';\nexport * from './useSpinnerStyles';\n"],"sourceRoot":"../src/"}

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

@@ -1 +1 @@
-{"version":3,"sources":["components/Spinner/renderSpinner.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,sBAAsB,GAAI,KAAD,IAAwB;EAC5D,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,iBAAA,CAAA,QAAA,CAAuB,KAAvB,CAA7B;EACA,MAAM;IAAE;EAAF,IAAoB,KAA1B;EACA,OACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,EACG,KAAK,CAAC,KAAN,KAAgB,aAAa,KAAK,OAAlB,IAA6B,aAAa,KAAK,QAA/D,KAA4E,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;EAAf,CAAZ,CAD/E,EAEG,KAAK,CAAC,OAAN,IAAiB,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,OAAP,EAAc,EAAA,GAAK,SAAS,CAAC;EAAf,CAAd,CAFpB,EAGG,KAAK,CAAC,KAAN,KAAgB,aAAa,KAAK,OAAlB,IAA6B,aAAa,KAAK,OAA/D,KAA2E,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;EAAf,CAAZ,CAH9E,CADF;AAOD,CAVM;;AAAM,OAAA,CAAA,sBAAA,GAAsB,sBAAtB","sourcesContent":["import * as React from 'react';\nimport { getSlots } 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 } = getSlots<SpinnerSlots>(state);\n  const { labelPosition } = state;\n  return (\n    <slots.root {...slotProps.root}>\n      {slots.label && (labelPosition === 'above' || labelPosition === 'before') && <slots.label {...slotProps.label} />}\n      {slots.spinner && <slots.spinner {...slotProps.spinner} />}\n      {slots.label && (labelPosition === 'below' || labelPosition === 'after') && <slots.label {...slotProps.label} />}\n    </slots.root>\n  );\n};\n"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinner/src/components/Spinner/renderSpinner.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;AAGA;;AAEG;;;AACI,MAAM,sBAAsB,GAAI,KAAD,IAAwB;EAC5D,MAAM;IAAE,KAAF;IAAS;EAAT,IAAuB,iBAAA,CAAA,QAAA,CAAuB,KAAvB,CAA7B;EACA,MAAM;IAAE;EAAF,IAAoB,KAA1B;EACA,OACE,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,IAAP,EAAW,EAAA,GAAK,SAAS,CAAC;EAAf,CAAX,EACG,KAAK,CAAC,KAAN,KAAgB,aAAa,KAAK,OAAlB,IAA6B,aAAa,KAAK,QAA/D,KAA4E,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;EAAf,CAAZ,CAD/E,EAEG,KAAK,CAAC,OAAN,IAAiB,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,OAAP,EAAc,EAAA,GAAK,SAAS,CAAC;EAAf,CAAd,CAFpB,EAGG,KAAK,CAAC,KAAN,KAAgB,aAAa,KAAK,OAAlB,IAA6B,aAAa,KAAK,OAA/D,KAA2E,KAAA,CAAA,aAAA,CAAC,KAAK,CAAC,KAAP,EAAY,EAAA,GAAK,SAAS,CAAC;EAAf,CAAZ,CAH9E,CADF;AAOD,CAVM;;AAAM,OAAA,CAAA,sBAAA,GAAsB,sBAAtB","sourcesContent":["import * as React from 'react';\nimport { getSlots } 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 } = getSlots<SpinnerSlots>(state);\n  const { labelPosition } = state;\n  return (\n    <slots.root {...slotProps.root}>\n      {slots.label && (labelPosition === 'above' || labelPosition === 'before') && <slots.label {...slotProps.label} />}\n      {slots.spinner && <slots.spinner {...slotProps.spinner} />}\n      {slots.label && (labelPosition === 'below' || labelPosition === 'after') && <slots.label {...slotProps.label} />}\n    </slots.root>\n  );\n};\n"],"sourceRoot":"../src/"}

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

@@ -1 +1 @@
-{"version":3,"sources":["components/Spinner/useSpinner.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AAEA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AACA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;AAEA;;;;;;;;AAQG;;;AACI,MAAM,mBAAmB,GAAG,CAAC,KAAD,EAAsB,GAAtB,KAAmE;EACpG;EACA,MAAM;IAAE,UAAU,GAAG,SAAf;IAA0B,aAAa,GAAG,OAA1C;IAAmD,IAAI,GAAG;EAA1D,IAAuE,KAA7E;EACA,MAAM,MAAM,GAAG,iBAAA,CAAA,KAAA,CAAM,SAAN,CAAf;EAEA,MAAM;IAAE,IAAI,GAAG,aAAT;IAAwB,QAAxB;IAAkC,GAAG;EAArC,IAA8C,KAApD;EACA,MAAM,UAAU,GAAG,iBAAA,CAAA,qBAAA,CAAsB,KAAtB,EAA6B;IAAE,GAAF;IAAO,IAAP;IAAa,GAAG;EAAhB,CAA7B,EAAqD,CAAC,MAAD,CAArD,CAAnB;EAEA,MAAM,cAAc,GAAG,iBAAA,CAAA,gBAAA,CAAiB,KAAK,CAAC,KAAvB,EAA8B;IACnD,YAAY,EAAE;MACZ,EAAE,EAAE;IADQ,CADqC;IAInD,QAAQ,EAAE;EAJyC,CAA9B,CAAvB;EAOA,MAAM,gBAAgB,GAAG,iBAAA,CAAA,gBAAA,CAAiB,KAAK,CAAC,OAAvB,EAAgC;IACvD,QAAQ,EAAE,IAD6C;IAEvD,YAAY,EAAE;MACZ,QAAQ,EAAE,KAAA,CAAA,aAAA,CAAC,YAAA,CAAA,UAAD,EAAW,IAAX,CADE;MAEZ;IAFY;EAFyC,CAAhC,CAAzB;;EAQA,IAAI,cAAc,IAAI,UAAlB,IAAgC,CAAC,UAAU,CAAC,iBAAD,CAA/C,EAAoE;IAClE,UAAU,CAAC,iBAAD,CAAV,GAAgC,cAAc,CAAC,EAA/C;EACD;;EAED,MAAM,KAAK,GAAiB;IAC1B,UAD0B;IAE1B,aAF0B;IAG1B,IAH0B;IAI1B,UAAU,EAAE;MACV,IAAI,EAAE,KADI;MAEV,OAAO,EAAE,MAFC;MAGV,KAAK,EAAE,aAAA,CAAA;IAHG,CAJc;IAS1B,IAAI,EAAE,UAToB;IAU1B,OAAO,EAAE,gBAViB;IAW1B,KAAK,EAAE;EAXmB,CAA5B;EAaA,OAAO,KAAP;AACD,CAzCM;;AAAM,OAAA,CAAA,mBAAA,GAAmB,mBAAnB","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId } 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' } = 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 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    labelPosition,\n    size,\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"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinner/src/components/Spinner/useSpinner.tsx"],"names":[],"mappings":";;;;;;;AAAA,MAAA,KAAA,gBAAA,OAAA,CAAA,OAAA,CAAA;;AACA,MAAA,iBAAA,gBAAA,OAAA,CAAA,2BAAA,CAAA;;AAEA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AACA,MAAA,YAAA,gBAAA,OAAA,CAAA,cAAA,CAAA;AAEA;;;;;;;;AAQG;;;AACI,MAAM,mBAAmB,GAAG,CAAC,KAAD,EAAsB,GAAtB,KAAmE;EACpG;EACA,MAAM;IAAE,UAAU,GAAG,SAAf;IAA0B,aAAa,GAAG,OAA1C;IAAmD,IAAI,GAAG;EAA1D,IAAuE,KAA7E;EACA,MAAM,MAAM,GAAG,iBAAA,CAAA,KAAA,CAAM,SAAN,CAAf;EAEA,MAAM;IAAE,IAAI,GAAG,aAAT;IAAwB,QAAxB;IAAkC,GAAG;EAArC,IAA8C,KAApD;EACA,MAAM,UAAU,GAAG,iBAAA,CAAA,qBAAA,CAAsB,KAAtB,EAA6B;IAAE,GAAF;IAAO,IAAP;IAAa,GAAG;EAAhB,CAA7B,EAAqD,CAAC,MAAD,CAArD,CAAnB;EAEA,MAAM,cAAc,GAAG,iBAAA,CAAA,gBAAA,CAAiB,KAAK,CAAC,KAAvB,EAA8B;IACnD,YAAY,EAAE;MACZ,EAAE,EAAE;IADQ,CADqC;IAInD,QAAQ,EAAE;EAJyC,CAA9B,CAAvB;EAOA,MAAM,gBAAgB,GAAG,iBAAA,CAAA,gBAAA,CAAiB,KAAK,CAAC,OAAvB,EAAgC;IACvD,QAAQ,EAAE,IAD6C;IAEvD,YAAY,EAAE;MACZ,QAAQ,EAAE,KAAA,CAAA,aAAA,CAAC,YAAA,CAAA,UAAD,EAAW,IAAX,CADE;MAEZ;IAFY;EAFyC,CAAhC,CAAzB;;EAQA,IAAI,cAAc,IAAI,UAAlB,IAAgC,CAAC,UAAU,CAAC,iBAAD,CAA/C,EAAoE;IAClE,UAAU,CAAC,iBAAD,CAAV,GAAgC,cAAc,CAAC,EAA/C;EACD;;EAED,MAAM,KAAK,GAAiB;IAC1B,UAD0B;IAE1B,aAF0B;IAG1B,IAH0B;IAI1B,UAAU,EAAE;MACV,IAAI,EAAE,KADI;MAEV,OAAO,EAAE,MAFC;MAGV,KAAK,EAAE,aAAA,CAAA;IAHG,CAJc;IAS1B,IAAI,EAAE,UAToB;IAU1B,OAAO,EAAE,gBAViB;IAW1B,KAAK,EAAE;EAXmB,CAA5B;EAaA,OAAO,KAAP;AACD,CAzCM;;AAAM,OAAA,CAAA,mBAAA,GAAmB,mBAAnB","sourcesContent":["import * as React from 'react';\nimport { getNativeElementProps, resolveShorthand, useId } 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' } = 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 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    labelPosition,\n    size,\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"],"sourceRoot":"../src/"}

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

@@ -1 +1 @@
-{"version":3,"sources":["components/Spinner/useSpinnerStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AAIa,OAAA,CAAA,iBAAA,GAAkD;EAC7D,IAAI,EAAE,aADuD;EAE7D,OAAO,EAAE,sBAFoD;EAG7D,KAAK,EAAE;AAHsD,CAAlD;AAMb;;;AAGG;;AACH,MAAM,OAAO,GAAG;EACd,IAAI,EAAE,KADQ;EAEd,UAAU,EAAE,MAFE;EAGd,KAAK,EAAE,MAHO;EAId,MAAM,EAAE,QAJM;EAKd,KAAK,EAAE,QALO;EAMd,UAAU,EAAE,QANE;EAOd,IAAI,EAAE;AAPQ,CAAhB;AAUA;;;AAGG;;AACH,MAAM,aAAa,GAAG;EACpB,IAAI,EAAE,MADc;EAEpB,UAAU,EAAE,MAFQ;EAGpB,KAAK,EAAE,MAHa;EAIpB,MAAM,EAAE,MAJY;EAKpB,KAAK,EAAE,MALa;EAMpB,UAAU,EAAE,MANQ;EAOpB,IAAI,EAAE;AAPc,CAAtB;AAUA;;;AAGG;;AACH,MAAM,gBAAgB,GAAG;EACvB,SAAS,EAAE;IACT,iBAAiB,EAAE,IADV;IAET,uBAAuB,EAAE,UAFhB;IAGT,uBAAuB,EAAE,QAHhB;IAIT,eAAe,EAAE;EAJR;AADY,CAAzB;AASA;;AAEG;;AACH,MAAM,aAAa,gBAAG,OAAA,SAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAAtB;;AAkBA,MAAM,eAAe,gBAAG,OAAA,SAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;EAAA;IAAA;EAAA;AAAA,EAAxB;;AAuGA,MAAM,cAAc,gBAAG,OAAA,SAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;AAAA;EAAA;EAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;AAAA,EAAvB;;AA+EA,MAAM,cAAc,gBAAG,OAAA,SAAA;EAAA;IAAA;EAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAAvB;AAqCA;;AAEG;;;AACI,MAAM,yBAAyB,GAAI,KAAD,IAAsC;EAC7E,MAAM;IAAE,aAAF;IAAiB,IAAjB;IAAuB,UAAU,GAAG;EAApC,IAAkD,KAAxD;EACA,MAAM,UAAU,GAAG,aAAa,EAAhC;EACA,MAAM,aAAa,GAAG,eAAe,EAArC;EACA,MAAM,WAAW,GAAG,cAAc,EAAlC;EACA,MAAM,WAAW,GAAG,cAAc,EAAlC;EAEA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CACrB,OAAA,CAAA,iBAAA,CAAkB,IADG,EAErB,UAAU,CAAC,IAFU,EAGrB,CAAC,aAAa,KAAK,OAAlB,IAA6B,aAAa,KAAK,OAAhD,KAA4D,UAAU,CAAC,QAHlD,EAIrB,CAAC,aAAa,KAAK,QAAlB,IAA8B,aAAa,KAAK,OAAjD,KAA6D,UAAU,CAAC,UAJnD,EAKrB,KAAK,CAAC,IAAN,CAAW,SALU,CAAvB;;EAOA,IAAI,KAAK,CAAC,OAAV,EAAmB;IACjB,KAAK,CAAC,OAAN,CAAc,SAAd,GAA0B,OAAA,CAAA,YAAA,CACxB,OAAA,CAAA,iBAAA,CAAkB,OADM,EAExB,aAAa,CAAC,UAFU,EAGxB,aAAa,CAAC,IAAD,CAHW,EAIxB,WAAW,CAAC,UAAD,CAJa,EAKxB,KAAK,CAAC,OAAN,CAAc,SALU,CAA1B;EAOD;;EACD,IAAI,KAAK,CAAC,KAAV,EAAiB;IACf,KAAK,CAAC,KAAN,CAAY,SAAZ,GAAwB,OAAA,CAAA,YAAA,CACtB,OAAA,CAAA,iBAAA,CAAkB,KADI,EAEtB,WAAW,CAAC,IAAD,CAFW,EAGtB,WAAW,CAAC,UAAD,CAHW,EAItB,KAAK,CAAC,KAAN,CAAY,SAJU,CAAxB;EAMD;;EAED,OAAO,KAAP;AACD,CAjCM;;AAAM,OAAA,CAAA,yBAAA,GAAyB,yBAAzB","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"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinner/src/components/Spinner/useSpinnerStyles.ts"],"names":[],"mappings":";;;;;;;AAAA,MAAA,OAAA,gBAAA,OAAA,CAAA,gBAAA,CAAA;;AACA,MAAA,aAAA,gBAAA,OAAA,CAAA,uBAAA,CAAA;;AAIa,OAAA,CAAA,iBAAA,GAAkD;EAC7D,IAAI,EAAE,aADuD;EAE7D,OAAO,EAAE,sBAFoD;EAG7D,KAAK,EAAE;AAHsD,CAAlD;AAMb;;;AAGG;;AACH,MAAM,OAAO,GAAG;EACd,IAAI,EAAE,KADQ;EAEd,UAAU,EAAE,MAFE;EAGd,KAAK,EAAE,MAHO;EAId,MAAM,EAAE,QAJM;EAKd,KAAK,EAAE,QALO;EAMd,UAAU,EAAE,QANE;EAOd,IAAI,EAAE;AAPQ,CAAhB;AAUA;;;AAGG;;AACH,MAAM,aAAa,GAAG;EACpB,IAAI,EAAE,MADc;EAEpB,UAAU,EAAE,MAFQ;EAGpB,KAAK,EAAE,MAHa;EAIpB,MAAM,EAAE,MAJY;EAKpB,KAAK,EAAE,MALa;EAMpB,UAAU,EAAE,MANQ;EAOpB,IAAI,EAAE;AAPc,CAAtB;AAUA;;;AAGG;;AACH,MAAM,gBAAgB,GAAG;EACvB,SAAS,EAAE;IACT,iBAAiB,EAAE,IADV;IAET,uBAAuB,EAAE,UAFhB;IAGT,uBAAuB,EAAE,QAHhB;IAIT,eAAe,EAAE;EAJR;AADY,CAAzB;AASA;;AAEG;;AACH,MAAM,aAAa,gBAAG,OAAA,SAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;EAAA;EAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAAtB;;AAkBA,MAAM,eAAe,gBAAG,OAAA,SAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;EAAA;IAAA;EAAA;AAAA,EAAxB;;AAuGA,MAAM,cAAc,gBAAG,OAAA,SAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;IAAA;EAAA;AAAA;EAAA;EAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;IAAA;EAAA;AAAA,EAAvB;;AA+EA,MAAM,cAAc,gBAAG,OAAA,SAAA;EAAA;IAAA;EAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;EAAA;IAAA;IAAA;IAAA;IAAA;EAAA;AAAA;EAAA;AAAA,EAAvB;AAqCA;;AAEG;;;AACI,MAAM,yBAAyB,GAAI,KAAD,IAAsC;EAC7E,MAAM;IAAE,aAAF;IAAiB,IAAjB;IAAuB,UAAU,GAAG;EAApC,IAAkD,KAAxD;EACA,MAAM,UAAU,GAAG,aAAa,EAAhC;EACA,MAAM,aAAa,GAAG,eAAe,EAArC;EACA,MAAM,WAAW,GAAG,cAAc,EAAlC;EACA,MAAM,WAAW,GAAG,cAAc,EAAlC;EAEA,KAAK,CAAC,IAAN,CAAW,SAAX,GAAuB,OAAA,CAAA,YAAA,CACrB,OAAA,CAAA,iBAAA,CAAkB,IADG,EAErB,UAAU,CAAC,IAFU,EAGrB,CAAC,aAAa,KAAK,OAAlB,IAA6B,aAAa,KAAK,OAAhD,KAA4D,UAAU,CAAC,QAHlD,EAIrB,CAAC,aAAa,KAAK,QAAlB,IAA8B,aAAa,KAAK,OAAjD,KAA6D,UAAU,CAAC,UAJnD,EAKrB,KAAK,CAAC,IAAN,CAAW,SALU,CAAvB;;EAOA,IAAI,KAAK,CAAC,OAAV,EAAmB;IACjB,KAAK,CAAC,OAAN,CAAc,SAAd,GAA0B,OAAA,CAAA,YAAA,CACxB,OAAA,CAAA,iBAAA,CAAkB,OADM,EAExB,aAAa,CAAC,UAFU,EAGxB,aAAa,CAAC,IAAD,CAHW,EAIxB,WAAW,CAAC,UAAD,CAJa,EAKxB,KAAK,CAAC,OAAN,CAAc,SALU,CAA1B;EAOD;;EACD,IAAI,KAAK,CAAC,KAAV,EAAiB;IACf,KAAK,CAAC,KAAN,CAAY,SAAZ,GAAwB,OAAA,CAAA,YAAA,CACtB,OAAA,CAAA,iBAAA,CAAkB,KADI,EAEtB,WAAW,CAAC,IAAD,CAFW,EAGtB,WAAW,CAAC,UAAD,CAHW,EAItB,KAAK,CAAC,KAAN,CAAY,SAJU,CAAxB;EAMD;;EAED,OAAO,KAAP;AACD,CAjCM;;AAAM,OAAA,CAAA,yBAAA,GAAyB,yBAAzB","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"],"sourceRoot":"../src/"}

package/lib-commonjs/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,SAAA,gBAAA,OAAA,CAAA,WAAA,CAAA;;AACE,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,SAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,SAAA,CAAA,OAAA;EAAO;AAAP,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,mBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,SAAA,CAAA,iBAAA;EAAiB;AAAjB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,wBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,SAAA,CAAA,sBAAA;EAAsB;AAAtB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,qBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,SAAA,CAAA,mBAAA;EAAmB;AAAnB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,2BAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,SAAA,CAAA,yBAAA;EAAyB;AAAzB,CAAA","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"],"sourceRoot":"../src/"}
+{"version":3,"sources":["packages/react-components/react-spinner/src/index.ts"],"names":[],"mappings":";;;;;;;AAAA,IAAA,SAAA,gBAAA,OAAA,CAAA,WAAA,CAAA;;AACE,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,SAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,SAAA,CAAA,OAAA;EAAO;AAAP,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,mBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,SAAA,CAAA,iBAAA;EAAiB;AAAjB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,wBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,SAAA,CAAA,sBAAA;EAAsB;AAAtB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,qBAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,SAAA,CAAA,mBAAA;EAAmB;AAAnB,CAAA;AACA,MAAA,CAAA,cAAA,CAAA,OAAA,EAAA,2BAAA,EAAA;EAAA,UAAA,EAAA,IAAA;EAAA,GAAA,EAAA,YAAA;IAAA,OAAA,SAAA,CAAA,yBAAA;EAAyB;AAAzB,CAAA","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"],"sourceRoot":"../src/"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-spinner",
-  "version": "9.0.10",
+  "version": "9.0.11",
   "description": "Spinner component for Fluent UI React",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -20,10 +20,9 @@
     "lint": "just-scripts lint",
     "start": "yarn storybook",
     "test": "jest --passWithNoTests",
-    "docs": "api-extractor run --config=config/api-extractor.local.json --local",
-    "build:local": "tsc -p ./tsconfig.lib.json --module esnext --emitDeclarationOnly && node ../../../scripts/typescript/normalize-import --output ./dist/types/packages/react-components/react-spinner/src && yarn docs",
     "storybook": "start-storybook",
-    "type-check": "tsc -b tsconfig.json"
+    "type-check": "tsc -b tsconfig.json",
+    "generate-api": "tsc -p ./tsconfig.lib.json --emitDeclarationOnly && just-scripts api-extractor"
   },
   "devDependencies": {
     "@fluentui/eslint-plugin": "*",
@@ -33,8 +32,8 @@
   },
   "dependencies": {
     "@fluentui/react-theme": "^9.1.2",
-    "@fluentui/react-label": "^9.0.10",
-    "@fluentui/react-utilities": "^9.2.1",
+    "@fluentui/react-label": "^9.0.11",
+    "@fluentui/react-utilities": "^9.2.2",
     "@griffel/react": "^1.4.2",
     "tslib": "^2.1.0"
   },