@fluentui/react-progress 9.72.9-experimental.component-base-hooks.20260122-49fc330360.0 → 9.74.3-experimental.esm.20260709-49ee7a20cf.0

package/lib-commonjs/components/ProgressBar/{useProgressBarStyles.styles.js → useProgressBarStyles.styles.cjs}

@@ -29,25 +29,6 @@ const barThicknessValues = {
     medium: '2px',
     large: '4px'
 };
-const indeterminateProgressBar = {
-    '0%': {
-        left: '-33%'
-    },
-    '100%': {
-        left: '100%'
-    }
-};
-const indeterminateProgressBarReducedMotion = {
-    '0%': {
-        opacity: '.2'
-    },
-    '50%': {
-        opacity: '1'
-    },
-    '100%': {
-        opacity: '.2'
-    }
-};
 /**
  * Styles for the root slot
  */ const useRootStyles = /*#__PURE__*/ (0, _react.__styles)({
@@ -139,17 +120,7 @@ const indeterminateProgressBarReducedMotion = {
             "fpo0yib",
             "f1u5hf6c"
         ],
-        Bv12yb3: [
-            "fwd2bol",
-            "f14gig94"
-        ],
-        vin17d: "f1a27w2r",
-        Ezkn3b: "f452v7t",
-        w3vfg9: "f1cpbl36",
-        jpy9cc: "f3z2g5w",
-        Bqo2lbl: "fz5izi4",
-        B6plc1d: "fv40pdu",
-        I82g5a: "f1uj6jbf"
+        jpy9cc: "f3z2g5w"
     },
     brand: {
         De3pzq: "ftywsgz"
@@ -176,24 +147,6 @@ const indeterminateProgressBarReducedMotion = {
             {
                 m: "screen and (prefers-reduced-motion: reduce)"
             }
-        ],
-        [
-            "@media screen and (prefers-reduced-motion: reduce){.fz5izi4{animation-iteration-count:infinite;}}",
-            {
-                m: "screen and (prefers-reduced-motion: reduce)"
-            }
-        ],
-        [
-            "@media screen and (prefers-reduced-motion: reduce){.fv40pdu{animation-duration:3s;}}",
-            {
-                m: "screen and (prefers-reduced-motion: reduce)"
-            }
-        ],
-        [
-            "@media screen and (prefers-reduced-motion: reduce){.f1uj6jbf{animation-name:ftc26vs;}}",
-            {
-                m: "screen and (prefers-reduced-motion: reduce)"
-            }
         ]
     ],
     d: [
@@ -211,32 +164,24 @@ const indeterminateProgressBarReducedMotion = {
         ".f10pi13n{position:relative;}",
         ".fpo0yib{background-image:linear-gradient(\n      to right,\n      var(--colorNeutralBackground6) 0%,\n      var(--colorTransparentBackground) 50%,\n      var(--colorNeutralBackground6) 100%\n    );}",
         ".f1u5hf6c{background-image:linear-gradient(\n      to left,\n      var(--colorNeutralBackground6) 0%,\n      var(--colorTransparentBackground) 50%,\n      var(--colorNeutralBackground6) 100%\n    );}",
-        ".fwd2bol{animation-name:f1keuaan;}",
-        ".f14gig94{animation-name:f10x8f8u;}",
-        ".f1a27w2r{animation-duration:3s;}",
-        ".f452v7t{animation-timing-function:linear;}",
-        ".f1cpbl36{animation-iteration-count:infinite;}",
         ".ftywsgz{background-color:var(--colorCompoundBrandBackground);}",
         ".fdl5y0r{background-color:var(--colorPaletteRedBackground3);}",
         ".f1s438gw{background-color:var(--colorPaletteDarkOrangeBackground3);}",
         ".flxk52p{background-color:var(--colorPaletteGreenBackground3);}"
-    ],
-    k: [
-        "@keyframes f1keuaan{0%{left:-33%;}100%{left:100%;}}",
-        "@keyframes f10x8f8u{0%{right:-33%;}100%{right:100%;}}",
-        "@keyframes ftc26vs{0%{opacity:.2;}50%{opacity:1;}100%{opacity:.2;}}"
     ]
 });
 const useProgressBarStyles_unstable = (state)=>{
-    'use no memo';
     const { color, max, shape, thickness, value } = state;
     const rootStyles = useRootStyles();
     const barStyles = useBarStyles();
+    // eslint-disable-next-line react-hooks/immutability
     state.root.className = (0, _react.mergeClasses)(progressBarClassNames.root, rootStyles.root, rootStyles[shape], rootStyles[thickness], state.root.className);
     if (state.bar) {
+        // eslint-disable-next-line react-hooks/immutability
         state.bar.className = (0, _react.mergeClasses)(progressBarClassNames.bar, barStyles.base, barStyles.brand, value === undefined && barStyles.indeterminate, value !== undefined && value > ZERO_THRESHOLD && barStyles.nonZeroDeterminate, color && value !== undefined && barStyles[color], state.bar.className);
     }
     if (state.bar && value !== undefined) {
+        // eslint-disable-next-line react-hooks/immutability
         state.bar.style = {
             width: Math.min(100, Math.max(0, value / max * 100)) + '%',
             ...state.bar.style

package/lib-commonjs/components/ProgressBar/useProgressBarStyles.styles.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["useProgressBarStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from \"@griffel/react\";\nimport { tokens } from \"@fluentui/react-theme\";\nexport const progressBarClassNames = {\n    root: 'fui-ProgressBar',\n    bar: 'fui-ProgressBar__bar'\n};\n// If the percentComplete is near 0, don't animate it.\n// This prevents animations on reset to 0 scenarios.\nconst ZERO_THRESHOLD = 0.01;\nconst barThicknessValues = {\n    medium: '2px',\n    large: '4px'\n};\n/**\n * Styles for the root slot\n */ const useRootStyles = makeStyles({\n    root: {\n        display: 'block',\n        backgroundColor: tokens.colorNeutralBackground6,\n        width: '100%',\n        overflow: 'hidden',\n        '@media screen and (forced-colors: active)': {\n            backgroundColor: 'CanvasText'\n        }\n    },\n    rounded: {\n        borderRadius: tokens.borderRadiusMedium\n    },\n    square: {\n        borderRadius: tokens.borderRadiusNone\n    },\n    medium: {\n        height: barThicknessValues.medium\n    },\n    large: {\n        height: barThicknessValues.large\n    }\n});\n/**\n * Styles for the ProgressBar bar\n */ const useBarStyles = makeStyles({\n    base: {\n        '@media screen and (forced-colors: active)': {\n            backgroundColor: 'Highlight'\n        },\n        borderRadius: 'inherit',\n        height: '100%'\n    },\n    nonZeroDeterminate: {\n        transitionProperty: 'width',\n        transitionDuration: '0.3s',\n        transitionTimingFunction: 'ease'\n    },\n    indeterminate: {\n        maxWidth: '33%',\n        position: 'relative',\n        backgroundImage: `linear-gradient(\n      to right,\n      ${tokens.colorNeutralBackground6} 0%,\n      ${tokens.colorTransparentBackground} 50%,\n      ${tokens.colorNeutralBackground6} 100%\n    )`,\n        '@media screen and (prefers-reduced-motion: reduce)': {\n            // Reduced motion: bar is sized here, and the opacity is pulsed by ProgressBarIndeterminateMotion\n            maxWidth: '100%'\n        }\n    },\n    brand: {\n        backgroundColor: tokens.colorCompoundBrandBackground\n    },\n    error: {\n        backgroundColor: tokens.colorPaletteRedBackground3\n    },\n    warning: {\n        backgroundColor: tokens.colorPaletteDarkOrangeBackground3\n    },\n    success: {\n        backgroundColor: tokens.colorPaletteGreenBackground3\n    }\n});\n/**\n * Apply styling to the ProgressBar slots based on the state\n */ export const useProgressBarStyles_unstable = (state)=>{\n    const { color, max, shape, thickness, value } = state;\n    const rootStyles = useRootStyles();\n    const barStyles = useBarStyles();\n    // eslint-disable-next-line react-hooks/immutability\n    state.root.className = mergeClasses(progressBarClassNames.root, rootStyles.root, rootStyles[shape], rootStyles[thickness], state.root.className);\n    if (state.bar) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.bar.className = mergeClasses(progressBarClassNames.bar, barStyles.base, barStyles.brand, value === undefined && barStyles.indeterminate, value !== undefined && value > ZERO_THRESHOLD && barStyles.nonZeroDeterminate, color && value !== undefined && barStyles[color], state.bar.className);\n    }\n    if (state.bar && value !== undefined) {\n        // eslint-disable-next-line react-hooks/immutability\n        state.bar.style = {\n            width: Math.min(100, Math.max(0, value / max * 100)) + '%',\n            ...state.bar.style\n        };\n    }\n    return state;\n};\n"],"names":["__styles","mergeClasses","tokens","progressBarClassNames","root","bar","ZERO_THRESHOLD","barThicknessValues","medium","large","useRootStyles","mc9l5x","De3pzq","a9b677","B68tc82","Bmxbyg5","Bpg54ce","Bomf52o","rounded","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","square","Bqenvij","d","p","m","useBarStyles","base","nonZeroDeterminate","Bmy1vo4","B3o57yi","Bkqvd7p","indeterminate","B2u0y6b","qhf8xq","Bcmaq0h","jpy9cc","brand","error","warning","success","useProgressBarStyles_unstable","state","color","max","shape","thickness","value","rootStyles","barStyles","className","undefined","style","width","Math","min"],"mappings":"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"}

package/lib-commonjs/components/ProgressBar/{useProgressBarStyles.styles.raw.js → useProgressBarStyles.styles.raw.cjs}

@@ -30,25 +30,6 @@ const barThicknessValues = {
     medium: '2px',
     large: '4px'
 };
-const indeterminateProgressBar = {
-    '0%': {
-        left: '-33%'
-    },
-    '100%': {
-        left: '100%'
-    }
-};
-const indeterminateProgressBarReducedMotion = {
-    '0%': {
-        opacity: '.2'
-    },
-    '50%': {
-        opacity: '1'
-    },
-    '100%': {
-        opacity: '.2'
-    }
-};
 /**
  * Styles for the root slot
  */ const useRootStyles = (0, _react.makeStyles)({
@@ -98,15 +79,9 @@ const indeterminateProgressBarReducedMotion = {
       ${_reacttheme.tokens.colorTransparentBackground} 50%,
       ${_reacttheme.tokens.colorNeutralBackground6} 100%
     )`,
-        animationName: indeterminateProgressBar,
-        animationDuration: '3s',
-        animationTimingFunction: 'linear',
-        animationIterationCount: 'infinite',
         '@media screen and (prefers-reduced-motion: reduce)': {
-            maxWidth: '100%',
-            animationIterationCount: 'infinite',
-            animationDuration: '3s',
-            animationName: indeterminateProgressBarReducedMotion
+            // Reduced motion: bar is sized here, and the opacity is pulsed by ProgressBarIndeterminateMotion
+            maxWidth: '100%'
         }
     },
     brand: {
@@ -123,15 +98,17 @@ const indeterminateProgressBarReducedMotion = {
     }
 });
 const useProgressBarStyles_unstable = (state)=>{
-    'use no memo';
     const { color, max, shape, thickness, value } = state;
     const rootStyles = useRootStyles();
     const barStyles = useBarStyles();
+    // eslint-disable-next-line react-hooks/immutability
     state.root.className = (0, _react.mergeClasses)(progressBarClassNames.root, rootStyles.root, rootStyles[shape], rootStyles[thickness], state.root.className);
     if (state.bar) {
+        // eslint-disable-next-line react-hooks/immutability
         state.bar.className = (0, _react.mergeClasses)(progressBarClassNames.bar, barStyles.base, barStyles.brand, value === undefined && barStyles.indeterminate, value !== undefined && value > ZERO_THRESHOLD && barStyles.nonZeroDeterminate, color && value !== undefined && barStyles[color], state.bar.className);
     }
     if (state.bar && value !== undefined) {
+        // eslint-disable-next-line react-hooks/immutability
         state.bar.style = {
             width: Math.min(100, Math.max(0, value / max * 100)) + '%',
             ...state.bar.style

package/lib-commonjs/components/ProgressBar/useProgressBarStyles.styles.raw.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/ProgressBar/useProgressBarStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { ProgressBarState, ProgressBarSlots } from './ProgressBar.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const progressBarClassNames: SlotClassNames<Omit<ProgressBarSlots, 'indeterminateMotion'>> = {\n  root: 'fui-ProgressBar',\n  bar: 'fui-ProgressBar__bar',\n};\n\n// If the percentComplete is near 0, don't animate it.\n// This prevents animations on reset to 0 scenarios.\nconst ZERO_THRESHOLD = 0.01;\n\nconst barThicknessValues = {\n  medium: '2px',\n  large: '4px',\n};\n\n/**\n * Styles for the root slot\n */\nconst useRootStyles = makeStyles({\n  root: {\n    display: 'block',\n    backgroundColor: tokens.colorNeutralBackground6,\n    width: '100%',\n    overflow: 'hidden',\n\n    '@media screen and (forced-colors: active)': {\n      backgroundColor: 'CanvasText',\n    },\n  },\n  rounded: {\n    borderRadius: tokens.borderRadiusMedium,\n  },\n  square: {\n    borderRadius: tokens.borderRadiusNone,\n  },\n  medium: {\n    height: barThicknessValues.medium,\n  },\n  large: {\n    height: barThicknessValues.large,\n  },\n});\n\n/**\n * Styles for the ProgressBar bar\n */\nconst useBarStyles = makeStyles({\n  base: {\n    '@media screen and (forced-colors: active)': {\n      backgroundColor: 'Highlight',\n    },\n    borderRadius: 'inherit',\n    height: '100%',\n  },\n  nonZeroDeterminate: {\n    transitionProperty: 'width',\n    transitionDuration: '0.3s',\n    transitionTimingFunction: 'ease',\n  },\n  indeterminate: {\n    maxWidth: '33%',\n    position: 'relative',\n    backgroundImage: `linear-gradient(\n      to right,\n      ${tokens.colorNeutralBackground6} 0%,\n      ${tokens.colorTransparentBackground} 50%,\n      ${tokens.colorNeutralBackground6} 100%\n    )`,\n    '@media screen and (prefers-reduced-motion: reduce)': {\n      // Reduced motion: bar is sized here, and the opacity is pulsed by ProgressBarIndeterminateMotion\n      maxWidth: '100%',\n    },\n  },\n\n  brand: {\n    backgroundColor: tokens.colorCompoundBrandBackground,\n  },\n\n  error: {\n    backgroundColor: tokens.colorPaletteRedBackground3,\n  },\n  warning: {\n    backgroundColor: tokens.colorPaletteDarkOrangeBackground3,\n  },\n  success: {\n    backgroundColor: tokens.colorPaletteGreenBackground3,\n  },\n});\n\n/**\n * Apply styling to the ProgressBar slots based on the state\n */\nexport const useProgressBarStyles_unstable = (state: ProgressBarState): ProgressBarState => {\n  const { color, max, shape, thickness, value } = state;\n  const rootStyles = useRootStyles();\n  const barStyles = useBarStyles();\n\n  // eslint-disable-next-line react-hooks/immutability\n  state.root.className = mergeClasses(\n    progressBarClassNames.root,\n    rootStyles.root,\n    rootStyles[shape],\n    rootStyles[thickness],\n    state.root.className,\n  );\n\n  if (state.bar) {\n    // eslint-disable-next-line react-hooks/immutability\n    state.bar.className = mergeClasses(\n      progressBarClassNames.bar,\n      barStyles.base,\n      barStyles.brand,\n      value === undefined && barStyles.indeterminate,\n      value !== undefined && value > ZERO_THRESHOLD && barStyles.nonZeroDeterminate,\n      color && value !== undefined && barStyles[color],\n      state.bar.className,\n    );\n  }\n\n  if (state.bar && value !== undefined) {\n    // eslint-disable-next-line react-hooks/immutability\n    state.bar.style = {\n      width: Math.min(100, Math.max(0, (value / max) * 100)) + '%',\n      ...state.bar.style,\n    };\n  }\n\n  return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","progressBarClassNames","root","bar","ZERO_THRESHOLD","barThicknessValues","medium","large","useRootStyles","display","backgroundColor","colorNeutralBackground6","width","overflow","rounded","borderRadius","borderRadiusMedium","square","borderRadiusNone","height","useBarStyles","base","nonZeroDeterminate","transitionProperty","transitionDuration","transitionTimingFunction","indeterminate","maxWidth","position","backgroundImage","colorTransparentBackground","brand","colorCompoundBrandBackground","error","colorPaletteRedBackground3","warning","colorPaletteDarkOrangeBackground3","success","colorPaletteGreenBackground3","useProgressBarStyles_unstable","state","color","max","shape","thickness","value","rootStyles","barStyles","className","undefined","style","Math","min"],"mappings":"AAAA;;;;;;;;;;;;IAOaG,qBAAAA;;;iCA2FAsC;eAAAA;;;uBAhG4B,iBAAiB;4BACnC,wBAAwB;AAIxC,8BAA6F;IAClGrC,MAAM;IACNC,KAAK;AACP,EAAE;AAEF,sDAAsD;AACtD,oDAAoD;AACpD,MAAMC,iBAAiB;AAEvB,MAAMC,qBAAqB;IACzBC,QAAQ;IACRC,OAAO;AACT;AAEA;;CAEC,GACD,MAAMC,oBAAgBV,iBAAAA,EAAW;IAC/BI,MAAM;QACJO,SAAS;QACTC,iBAAiBV,kBAAAA,CAAOW,uBAAuB;QAC/CC,OAAO;QACPC,UAAU;QAEV,6CAA6C;YAC3CH,iBAAiB;QACnB;IACF;IACAI,SAAS;QACPC,cAAcf,kBAAAA,CAAOgB,kBAAkB;IACzC;IACAC,QAAQ;QACNF,cAAcf,kBAAAA,CAAOkB,gBAAgB;IACvC;IACAZ,QAAQ;QACNa,QAAQd,mBAAmBC,MAAM;IACnC;IACAC,OAAO;QACLY,QAAQd,mBAAmBE,KAAK;IAClC;AACF;AAEA;;CAEC,GACD,MAAMa,mBAAetB,iBAAAA,EAAW;IAC9BuB,MAAM;QACJ,6CAA6C;YAC3CX,iBAAiB;QACnB;QACAK,cAAc;QACdI,QAAQ;IACV;IACAG,oBAAoB;QAClBC,oBAAoB;QACpBC,oBAAoB;QACpBC,0BAA0B;IAC5B;IACAC,eAAe;QACbC,UAAU;QACVC,UAAU;QACVC,iBAAiB,CAAC;;MAEhB,EAAE7B,kBAAAA,CAAOW,uBAAuB,CAAC;MACjC,EAAEX,kBAAAA,CAAO8B,0BAA0B,CAAC;MACpC,EAAE9B,kBAAAA,CAAOW,uBAAuB,CAAC;KAClC,CAAC;QACF,sDAAsD;YACpD,iGAAiG;YACjGgB,UAAU;QACZ;IACF;IAEAI,OAAO;QACLrB,iBAAiBV,kBAAAA,CAAOgC,4BAA4B;IACtD;IAEAC,OAAO;QACLvB,iBAAiBV,kBAAAA,CAAOkC,0BAA0B;IACpD;IACAC,SAAS;QACPzB,iBAAiBV,kBAAAA,CAAOoC,iCAAiC;IAC3D;IACAC,SAAS;QACP3B,iBAAiBV,kBAAAA,CAAOsC,4BAA4B;IACtD;AACF;AAKO,sCAAsC,CAACE;IAC5C,MAAM,EAAEC,KAAK,EAAEC,GAAG,EAAEC,KAAK,EAAEC,SAAS,EAAEC,KAAK,EAAE,GAAGL;IAChD,MAAMM,aAAatC;IACnB,MAAMuC,YAAY3B;IAElB,oDAAoD;IACpDoB,MAAMtC,IAAI,CAAC8C,SAAS,OAAGjD,mBAAAA,EACrBE,sBAAsBC,IAAI,EAC1B4C,WAAW5C,IAAI,EACf4C,UAAU,CAACH,MAAM,EACjBG,UAAU,CAACF,UAAU,EACrBJ,MAAMtC,IAAI,CAAC8C,SAAS;IAGtB,IAAIR,MAAMrC,GAAG,EAAE;QACb,oDAAoD;QACpDqC,MAAMrC,GAAG,CAAC6C,SAAS,OAAGjD,mBAAAA,EACpBE,sBAAsBE,GAAG,EACzB4C,UAAU1B,IAAI,EACd0B,UAAUhB,KAAK,EACfc,UAAUI,aAAaF,UAAUrB,aAAa,EAC9CmB,UAAUI,aAAaJ,QAAQzC,kBAAkB2C,UAAUzB,kBAAkB,EAC7EmB,SAASI,UAAUI,aAAaF,SAAS,CAACN,MAAM,EAChDD,MAAMrC,GAAG,CAAC6C,SAAS;IAEvB;IAEA,IAAIR,MAAMrC,GAAG,IAAI0C,UAAUI,WAAW;QACpC,oDAAoD;QACpDT,MAAMrC,GAAG,CAAC+C,KAAK,GAAG;YAChBtC,OAAOuC,KAAKC,GAAG,CAAC,KAAKD,KAAKT,GAAG,CAAC,GAAIG,QAAQH,MAAO,QAAQ;YACzD,GAAGF,MAAMrC,GAAG,CAAC+C,KAAK;QACpB;IACF;IAEA,OAAOV;AACT,EAAE"}

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

@@ -18,6 +18,9 @@ _export(exports, {
     renderProgressBar_unstable: function() {
         return _ProgressBar.renderProgressBar_unstable;
     },
+    useProgressBarBase_unstable: function() {
+        return _ProgressBar.useProgressBarBase_unstable;
+    },
     useProgressBarStyles_unstable: function() {
         return _ProgressBar.useProgressBarStyles_unstable;
     },
@@ -25,4 +28,4 @@ _export(exports, {
         return _ProgressBar.useProgressBar_unstable;
     }
 });
-const _ProgressBar = require("./ProgressBar");
+const _ProgressBar = require("./ProgressBar.cjs");

package/lib-commonjs/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  ProgressBar,\n  progressBarClassNames,\n  renderProgressBar_unstable,\n  useProgressBar_unstable,\n  useProgressBarStyles_unstable,\n  useProgressBarBase_unstable,\n} from './ProgressBar';\nexport type {\n  ProgressBarProps,\n  ProgressBarSlots,\n  ProgressBarState,\n  ProgressBarBaseProps,\n  ProgressBarBaseState,\n} from './ProgressBar';\n"],"names":["ProgressBar","progressBarClassNames","renderProgressBar_unstable","useProgressBar_unstable","useProgressBarStyles_unstable","useProgressBarBase_unstable"],"mappings":";;;;;;;;;;;;eACEA,wBAAW;;;eACXC,kCAAqB;;;eACrBC,uCAA0B;;;eAG1BG,wCAA2B;;;eAD3BD,0CAA6B;;;eAD7BD,oCAAuB;;;6BAGlB,mBAAgB"}

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

@@ -16,5 +16,5 @@ _export(exports, {
         return _clampValue.clampValue;
     }
 });
-const _clampMax = require("./clampMax");
-const _clampValue = require("./clampValue");
+const _clampMax = require("./clampMax.cjs");
+const _clampValue = require("./clampValue.cjs");

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/utils/index.ts"],"sourcesContent":["export { clampMax } from './clampMax';\nexport { clampValue } from './clampValue';\n"],"names":["clampMax","clampValue"],"mappings":";;;;;;;;;;;;eAASA,kBAAQ;;;eACRC,sBAAU;;;0BADM,aAAa;4BACX,eAAe"}
+{"version":3,"sources":["../src/utils/index.ts"],"sourcesContent":["export { clampMax } from './clampMax';\nexport { clampValue } from './clampValue';\n"],"names":["clampMax","clampValue"],"mappings":";;;;;;;;;;;;eAASA,kBAAQ;;;eACRC,sBAAU;;;0BADM,gBAAa;4BACX,kBAAe"}

package/package.json

@@ -1,8 +1,8 @@
 {
   "name": "@fluentui/react-progress",
-  "version": "9.72.9-experimental.component-base-hooks.20260122-49fc330360.0",
+  "version": "9.74.3-experimental.esm.20260709-49ee7a20cf.0",
   "description": "Progress component for FluentUI v9",
-  "main": "lib-commonjs/index.js",
+  "main": "lib-commonjs/index.cjs",
   "module": "lib/index.js",
   "typings": "./dist/index.d.ts",
   "sideEffects": false,
@@ -12,11 +12,12 @@
   },
   "license": "MIT",
   "dependencies": {
-    "@fluentui/react-field": "9.72.9-experimental.component-base-hooks.20260122-49fc330360.0",
-    "@fluentui/react-jsx-runtime": "9.72.9-experimental.component-base-hooks.20260122-49fc330360.0",
-    "@fluentui/react-shared-contexts": "9.72.9-experimental.component-base-hooks.20260122-49fc330360.0",
-    "@fluentui/react-theme": "9.72.9-experimental.component-base-hooks.20260122-49fc330360.0",
-    "@fluentui/react-utilities": "9.72.9-experimental.component-base-hooks.20260122-49fc330360.0",
+    "@fluentui/react-motion": "9.74.3-experimental.esm.20260709-49ee7a20cf.0",
+    "@fluentui/react-field": "9.74.3-experimental.esm.20260709-49ee7a20cf.0",
+    "@fluentui/react-jsx-runtime": "9.74.3-experimental.esm.20260709-49ee7a20cf.0",
+    "@fluentui/react-shared-contexts": "9.74.3-experimental.esm.20260709-49ee7a20cf.0",
+    "@fluentui/react-theme": "9.74.3-experimental.esm.20260709-49ee7a20cf.0",
+    "@fluentui/react-utilities": "9.74.3-experimental.esm.20260709-49ee7a20cf.0",
     "@griffel/react": "^1.5.32",
     "@swc/helpers": "^0.5.1"
   },
@@ -29,17 +30,23 @@
   "beachball": {},
   "exports": {
     ".": {
-      "types": "./dist/index.d.ts",
-      "node": "./lib-commonjs/index.js",
-      "import": "./lib/index.js",
-      "require": "./lib-commonjs/index.js"
+      "import": {
+        "types": "./dist/index.d.ts",
+        "default": "./lib/index.js"
+      },
+      "require": {
+        "types": "./dist/index.d.cts",
+        "default": "./lib-commonjs/index.cjs"
+      }
     },
     "./package.json": "./package.json"
   },
   "files": [
     "*.md",
     "dist/*.d.ts",
+    "dist/*.d.cts",
     "lib",
     "lib-commonjs"
-  ]
+  ],
+  "type": "module"
 }

package/lib-commonjs/ProgressBar.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/ProgressBar.ts"],"sourcesContent":["export type { ProgressBarProps, ProgressBarSlots, ProgressBarState } from './components/ProgressBar/index';\nexport {\n  ProgressBar,\n  progressBarClassNames,\n  renderProgressBar_unstable,\n  useProgressBarStyles_unstable,\n  useProgressBar_unstable,\n} from './components/ProgressBar/index';\n"],"names":["ProgressBar","progressBarClassNames","renderProgressBar_unstable","useProgressBarStyles_unstable","useProgressBar_unstable"],"mappings":";;;;;;;;;;;;eAEEA,kBAAW;;;eACXC,4BAAqB;;;eACrBC,iCAA0B;;;eAC1BC,oCAA6B;;;eAC7BC,8BAAuB;;;uBAClB,iCAAiC"}

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

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/ProgressBar/ProgressBar.types.ts"],"sourcesContent":["import type { ComponentProps, ComponentState, Slot } from '@fluentui/react-utilities';\n\nexport type ProgressBarSlots = {\n  /**\n   * The track behind the ProgressBar bar\n   */\n  root: NonNullable<Slot<'div'>>;\n  /**\n   * The filled portion of the ProgressBar bar. Animated in the indeterminate state, when no value is provided.\n   */\n  bar?: NonNullable<Slot<'div'>>;\n};\n\n/**\n * ProgressBar Props\n */\nexport type ProgressBarProps = Omit<ComponentProps<ProgressBarSlots>, 'size'> & {\n  /**\n   * The shape of the bar and track.\n   * @default rounded\n   */\n  shape?: 'rounded' | 'square';\n  /**\n   * A decimal number between `0` and `1` (or between `0` and `max` if given),\n   * which specifies how much of the task has been completed.\n   *\n   * If `undefined` (default), the ProgressBar will display an **indeterminate** state.\n   */\n  value?: number;\n  /**\n   * The maximum value, which indicates the task is complete.\n   * The ProgressBar bar will be full when `value` equals `max`.\n   * @default 1\n   */\n  max?: number;\n  /**\n   * The thickness of the ProgressBar bar\n   * @default medium\n   */\n  thickness?: 'medium' | 'large';\n\n  /**\n   * The status of the ProgressBar bar. Changes the color of the bar.\n   * @default brand\n   */\n  color?: 'brand' | 'success' | 'warning' | 'error';\n};\n\n/**\n * State used in rendering ProgressBar\n */\nexport type ProgressBarState = ComponentState<Required<ProgressBarSlots>> &\n  Required<Pick<ProgressBarProps, 'max' | 'shape' | 'thickness'>> &\n  Pick<ProgressBarProps, 'value' | 'color'>;\n"],"names":[],"mappings":"AAgDA;;CAEC,GACD,WAE4C"}

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

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/ProgressBar/index.ts"],"sourcesContent":["export { ProgressBar } from './ProgressBar';\nexport type { ProgressBarProps, ProgressBarSlots, ProgressBarState } from './ProgressBar.types';\nexport { renderProgressBar_unstable } from './renderProgressBar';\nexport { useProgressBar_unstable } from './useProgressBar';\nexport { progressBarClassNames, useProgressBarStyles_unstable } from './useProgressBarStyles.styles';\n"],"names":["ProgressBar","renderProgressBar_unstable","useProgressBar_unstable","progressBarClassNames","useProgressBarStyles_unstable"],"mappings":";;;;;;;;;;;;eAASA,wBAAW;;;eAIXG,iDAAqB;;;eAFrBF,6CAA0B;;;eAEHG,yDAA6B;;;eADpDF,uCAAuB;;;6BAHJ,gBAAgB;mCAED,sBAAsB;gCACzB,mBAAmB;4CACU,gCAAgC"}

package/lib-commonjs/components/ProgressBar/renderProgressBar.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/ProgressBar/renderProgressBar.tsx"],"sourcesContent":["/** @jsxRuntime automatic */\n/** @jsxImportSource @fluentui/react-jsx-runtime */\n\nimport { assertSlots } from '@fluentui/react-utilities';\nimport type { JSXElement } from '@fluentui/react-utilities';\nimport type { ProgressBarState, ProgressBarSlots } from './ProgressBar.types';\n\n/**\n * Render the final JSX of ProgressBar\n */\nexport const renderProgressBar_unstable = (state: ProgressBarState): JSXElement => {\n  assertSlots<ProgressBarSlots>(state);\n  return <state.root>{state.bar && <state.bar />}</state.root>;\n};\n"],"names":["assertSlots","renderProgressBar_unstable","state","root","bar"],"mappings":";;;;+BAUaC;;;;;;4BATb,gDAAiD;gCAErB,4BAA4B;AAOjD,mCAAmC,CAACC;QACzCF,2BAAAA,EAA8BE;IAC9B,OAAA,WAAA,GAAO,mBAAA,EAACA,MAAMC,IAAI,EAAA;kBAAED,MAAME,GAAG,IAAA,WAAA,OAAI,eAAA,EAACF,MAAME,GAAG,EAAA,CAAA;;AAC7C,EAAE"}

package/lib-commonjs/components/ProgressBar/useProgressBar.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/ProgressBar/useProgressBar.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useFieldContext_unstable } from '@fluentui/react-field';\nimport { getIntrinsicElementProps, slot } from '@fluentui/react-utilities';\nimport { clampValue, clampMax } from '../../utils/index';\nimport type { ProgressBarProps, ProgressBarState } from './ProgressBar.types';\n\n/**\n * Create the state required to render ProgressBar.\n *\n * The returned state can be modified with hooks such as useProgressBarStyles_unstable,\n * before being passed to renderProgressBar_unstable.\n *\n * @param props - props from this instance of ProgressBar\n * @param ref - reference to root HTMLElement of ProgressBar\n */\nexport const useProgressBar_unstable = (props: ProgressBarProps, ref: React.Ref<HTMLElement>): ProgressBarState => {\n  const field = useFieldContext_unstable();\n  const fieldState = field?.validationState;\n\n  const {\n    color = fieldState === 'error' || fieldState === 'warning' || fieldState === 'success' ? fieldState : 'brand',\n    shape = 'rounded',\n    thickness = 'medium',\n  } = props;\n  const max = clampMax(props.max ?? 1);\n  const value = clampValue(props.value, max);\n\n  const root = slot.always(\n    getIntrinsicElementProps('div', {\n      // FIXME:\n      // `ref` is wrongly assigned to be `HTMLElement` instead of `HTMLDivElement`\n      // but since it would be a breaking change to fix it, we are casting ref to it's proper type\n      ref: ref as React.Ref<HTMLDivElement>,\n      role: 'progressbar',\n      'aria-valuemin': value !== undefined ? 0 : undefined,\n      'aria-valuemax': value !== undefined ? max : undefined,\n      'aria-valuenow': value,\n      'aria-labelledby': field?.labelId,\n      ...props,\n    }),\n    { elementType: 'div' },\n  );\n  if (field && (field.validationMessageId || field.hintId)) {\n    // Prepend the field's validation message and/or hint to the user's aria-describedby\n    root['aria-describedby'] = [field?.validationMessageId, field?.hintId, root['aria-describedby']]\n      .filter(Boolean)\n      .join(' ');\n  }\n  const bar = slot.always(props.bar, { elementType: 'div' });\n  const state: ProgressBarState = {\n    color,\n    max,\n    shape,\n    thickness,\n    value,\n    components: { root: 'div', bar: 'div' },\n    root,\n    bar,\n  };\n\n  return state;\n};\n"],"names":["React","useFieldContext_unstable","getIntrinsicElementProps","slot","clampValue","clampMax","useProgressBar_unstable","props","ref","field","fieldState","validationState","color","shape","thickness","max","value","root","always","role","undefined","labelId","elementType","validationMessageId","hintId","filter","Boolean","join","bar","state","components"],"mappings":"AAAA;;;;;+BAiBaM;;;;;;;iEAfU,QAAQ;4BACU,wBAAwB;gCAClB,4BAA4B;uBACtC,oBAAoB;AAYlD,gCAAgC,CAACC,OAAyBC;IAC/D,MAAMC,YAAQR,oCAAAA;IACd,MAAMS,aAAaD,UAAAA,QAAAA,UAAAA,KAAAA,IAAAA,KAAAA,IAAAA,MAAOE,eAAe;IAEzC,MAAM,EACJC,QAAQF,eAAe,WAAWA,eAAe,aAAaA,eAAe,YAAYA,aAAa,OAAO,EAC7GG,QAAQ,SAAS,EACjBC,YAAY,QAAQ,EACrB,GAAGP;QACiBA;IAArB,MAAMQ,UAAMV,eAAAA,EAASE,CAAAA,aAAAA,MAAMQ,GAAAA,AAAG,MAAA,QAATR,eAAAA,KAAAA,IAAAA,aAAa;IAClC,MAAMS,YAAQZ,iBAAAA,EAAWG,MAAMS,KAAK,EAAED;IAEtC,MAAME,OAAOd,oBAAAA,CAAKe,MAAM,KACtBhB,wCAAAA,EAAyB,OAAO;QAC9B,SAAS;QACT,4EAA4E;QAC5E,4FAA4F;QAC5FM,KAAKA;QACLW,MAAM;QACN,iBAAiBH,UAAUI,YAAY,IAAIA;QAC3C,iBAAiBJ,UAAUI,YAAYL,MAAMK;QAC7C,iBAAiBJ;QACjB,iBAAiB,EAAEP,UAAAA,QAAAA,UAAAA,KAAAA,IAAAA,KAAAA,IAAAA,MAAOY,OAAO;QACjC,GAAGd,KAAK;IACV,IACA;QAAEe,aAAa;IAAM;IAEvB,IAAIb,SAAUA,CAAAA,MAAMc,mBAAmB,IAAId,MAAMe,MAAAA,AAAK,GAAI;QACxD,oFAAoF;QACpFP,IAAI,CAAC,mBAAmB,GAAG;YAACR,UAAAA,QAAAA,UAAAA,KAAAA,IAAAA,KAAAA,IAAAA,MAAOc,mBAAmB;YAAEd,UAAAA,QAAAA,UAAAA,KAAAA,IAAAA,KAAAA,IAAAA,MAAOe,MAAM;YAAEP,IAAI,CAAC,mBAAmB;SAAC,CAC7FQ,MAAM,CAACC,SACPC,IAAI,CAAC;IACV;IACA,MAAMC,MAAMzB,oBAAAA,CAAKe,MAAM,CAACX,MAAMqB,GAAG,EAAE;QAAEN,aAAa;IAAM;IACxD,MAAMO,QAA0B;QAC9BjB;QACAG;QACAF;QACAC;QACAE;QACAc,YAAY;YAAEb,MAAM;YAAOW,KAAK;QAAM;QACtCX;QACAW;IACF;IAEA,OAAOC;AACT,EAAE"}

package/lib-commonjs/components/ProgressBar/useProgressBarStyles.styles.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["useProgressBarStyles.styles.js"],"sourcesContent":["'use client';\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nexport const progressBarClassNames = {\n    root: 'fui-ProgressBar',\n    bar: 'fui-ProgressBar__bar'\n};\n// If the percentComplete is near 0, don't animate it.\n// This prevents animations on reset to 0 scenarios.\nconst ZERO_THRESHOLD = 0.01;\nconst barThicknessValues = {\n    medium: '2px',\n    large: '4px'\n};\nconst indeterminateProgressBar = {\n    '0%': {\n        left: '-33%'\n    },\n    '100%': {\n        left: '100%'\n    }\n};\nconst indeterminateProgressBarReducedMotion = {\n    '0%': {\n        opacity: '.2'\n    },\n    '50%': {\n        opacity: '1'\n    },\n    '100%': {\n        opacity: '.2'\n    }\n};\n/**\n * Styles for the root slot\n */ const useRootStyles = makeStyles({\n    root: {\n        display: 'block',\n        backgroundColor: tokens.colorNeutralBackground6,\n        width: '100%',\n        overflow: 'hidden',\n        '@media screen and (forced-colors: active)': {\n            backgroundColor: 'CanvasText'\n        }\n    },\n    rounded: {\n        borderRadius: tokens.borderRadiusMedium\n    },\n    square: {\n        borderRadius: tokens.borderRadiusNone\n    },\n    medium: {\n        height: barThicknessValues.medium\n    },\n    large: {\n        height: barThicknessValues.large\n    }\n});\n/**\n * Styles for the ProgressBar bar\n */ const useBarStyles = makeStyles({\n    base: {\n        '@media screen and (forced-colors: active)': {\n            backgroundColor: 'Highlight'\n        },\n        borderRadius: 'inherit',\n        height: '100%'\n    },\n    nonZeroDeterminate: {\n        transitionProperty: 'width',\n        transitionDuration: '0.3s',\n        transitionTimingFunction: 'ease'\n    },\n    indeterminate: {\n        maxWidth: '33%',\n        position: 'relative',\n        backgroundImage: `linear-gradient(\n      to right,\n      ${tokens.colorNeutralBackground6} 0%,\n      ${tokens.colorTransparentBackground} 50%,\n      ${tokens.colorNeutralBackground6} 100%\n    )`,\n        animationName: indeterminateProgressBar,\n        animationDuration: '3s',\n        animationTimingFunction: 'linear',\n        animationIterationCount: 'infinite',\n        '@media screen and (prefers-reduced-motion: reduce)': {\n            maxWidth: '100%',\n            animationIterationCount: 'infinite',\n            animationDuration: '3s',\n            animationName: indeterminateProgressBarReducedMotion\n        }\n    },\n    brand: {\n        backgroundColor: tokens.colorCompoundBrandBackground\n    },\n    error: {\n        backgroundColor: tokens.colorPaletteRedBackground3\n    },\n    warning: {\n        backgroundColor: tokens.colorPaletteDarkOrangeBackground3\n    },\n    success: {\n        backgroundColor: tokens.colorPaletteGreenBackground3\n    }\n});\n/**\n * Apply styling to the ProgressBar slots based on the state\n */ export const useProgressBarStyles_unstable = (state)=>{\n    'use no memo';\n    const { color, max, shape, thickness, value } = state;\n    const rootStyles = useRootStyles();\n    const barStyles = useBarStyles();\n    state.root.className = mergeClasses(progressBarClassNames.root, rootStyles.root, rootStyles[shape], rootStyles[thickness], state.root.className);\n    if (state.bar) {\n        state.bar.className = mergeClasses(progressBarClassNames.bar, barStyles.base, barStyles.brand, value === undefined && barStyles.indeterminate, value !== undefined && value > ZERO_THRESHOLD && barStyles.nonZeroDeterminate, color && value !== undefined && barStyles[color], state.bar.className);\n    }\n    if (state.bar && value !== undefined) {\n        state.bar.style = {\n            width: Math.min(100, Math.max(0, value / max * 100)) + '%',\n            ...state.bar.style\n        };\n    }\n    return state;\n};\n"],"names":["__styles","mergeClasses","tokens","progressBarClassNames","root","bar","ZERO_THRESHOLD","barThicknessValues","medium","large","indeterminateProgressBar","left","indeterminateProgressBarReducedMotion","opacity","useRootStyles","mc9l5x","De3pzq","a9b677","B68tc82","Bmxbyg5","Bpg54ce","Bomf52o","rounded","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","square","Bqenvij","d","p","m","useBarStyles","base","nonZeroDeterminate","Bmy1vo4","B3o57yi","Bkqvd7p","indeterminate","B2u0y6b","qhf8xq","Bcmaq0h","Bv12yb3","vin17d","Ezkn3b","w3vfg9","jpy9cc","Bqo2lbl","B6plc1d","I82g5a","brand","error","warning","success","k","useProgressBarStyles_unstable","state","color","max","shape","thickness","value","rootStyles","barStyles","className","undefined","style","width","Math","min"],"mappings":"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"}

package/lib-commonjs/components/ProgressBar/useProgressBarStyles.styles.raw.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/components/ProgressBar/useProgressBarStyles.styles.ts"],"sourcesContent":["'use client';\n\nimport { makeStyles, mergeClasses } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport type { ProgressBarState, ProgressBarSlots } from './ProgressBar.types';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\n\nexport const progressBarClassNames: SlotClassNames<ProgressBarSlots> = {\n  root: 'fui-ProgressBar',\n  bar: 'fui-ProgressBar__bar',\n};\n\n// If the percentComplete is near 0, don't animate it.\n// This prevents animations on reset to 0 scenarios.\nconst ZERO_THRESHOLD = 0.01;\n\nconst barThicknessValues = {\n  medium: '2px',\n  large: '4px',\n};\n\nconst indeterminateProgressBar = {\n  '0%': {\n    left: '-33%', // matches indeterminate bar width\n  },\n  '100%': {\n    left: '100%',\n  },\n};\n\nconst indeterminateProgressBarReducedMotion = {\n  '0%': {\n    opacity: '.2',\n  },\n  '50%': {\n    opacity: '1',\n  },\n  '100%': {\n    opacity: '.2',\n  },\n};\n\n/**\n * Styles for the root slot\n */\nconst useRootStyles = makeStyles({\n  root: {\n    display: 'block',\n    backgroundColor: tokens.colorNeutralBackground6,\n    width: '100%',\n    overflow: 'hidden',\n\n    '@media screen and (forced-colors: active)': {\n      backgroundColor: 'CanvasText',\n    },\n  },\n  rounded: {\n    borderRadius: tokens.borderRadiusMedium,\n  },\n  square: {\n    borderRadius: tokens.borderRadiusNone,\n  },\n  medium: {\n    height: barThicknessValues.medium,\n  },\n  large: {\n    height: barThicknessValues.large,\n  },\n});\n\n/**\n * Styles for the ProgressBar bar\n */\nconst useBarStyles = makeStyles({\n  base: {\n    '@media screen and (forced-colors: active)': {\n      backgroundColor: 'Highlight',\n    },\n    borderRadius: 'inherit',\n    height: '100%',\n  },\n  nonZeroDeterminate: {\n    transitionProperty: 'width',\n    transitionDuration: '0.3s',\n    transitionTimingFunction: 'ease',\n  },\n  indeterminate: {\n    maxWidth: '33%',\n    position: 'relative',\n    backgroundImage: `linear-gradient(\n      to right,\n      ${tokens.colorNeutralBackground6} 0%,\n      ${tokens.colorTransparentBackground} 50%,\n      ${tokens.colorNeutralBackground6} 100%\n    )`,\n    animationName: indeterminateProgressBar,\n    animationDuration: '3s',\n    animationTimingFunction: 'linear',\n    animationIterationCount: 'infinite',\n    '@media screen and (prefers-reduced-motion: reduce)': {\n      maxWidth: '100%',\n      animationIterationCount: 'infinite',\n      animationDuration: '3s',\n      animationName: indeterminateProgressBarReducedMotion,\n    },\n  },\n\n  brand: {\n    backgroundColor: tokens.colorCompoundBrandBackground,\n  },\n\n  error: {\n    backgroundColor: tokens.colorPaletteRedBackground3,\n  },\n  warning: {\n    backgroundColor: tokens.colorPaletteDarkOrangeBackground3,\n  },\n  success: {\n    backgroundColor: tokens.colorPaletteGreenBackground3,\n  },\n});\n\n/**\n * Apply styling to the ProgressBar slots based on the state\n */\nexport const useProgressBarStyles_unstable = (state: ProgressBarState): ProgressBarState => {\n  'use no memo';\n\n  const { color, max, shape, thickness, value } = state;\n  const rootStyles = useRootStyles();\n  const barStyles = useBarStyles();\n\n  state.root.className = mergeClasses(\n    progressBarClassNames.root,\n    rootStyles.root,\n    rootStyles[shape],\n    rootStyles[thickness],\n    state.root.className,\n  );\n\n  if (state.bar) {\n    state.bar.className = mergeClasses(\n      progressBarClassNames.bar,\n      barStyles.base,\n      barStyles.brand,\n      value === undefined && barStyles.indeterminate,\n      value !== undefined && value > ZERO_THRESHOLD && barStyles.nonZeroDeterminate,\n      color && value !== undefined && barStyles[color],\n      state.bar.className,\n    );\n  }\n\n  if (state.bar && value !== undefined) {\n    state.bar.style = {\n      width: Math.min(100, Math.max(0, (value / max) * 100)) + '%',\n      ...state.bar.style,\n    };\n  }\n\n  return state;\n};\n"],"names":["makeStyles","mergeClasses","tokens","progressBarClassNames","root","bar","ZERO_THRESHOLD","barThicknessValues","medium","large","indeterminateProgressBar","left","indeterminateProgressBarReducedMotion","opacity","useRootStyles","display","backgroundColor","colorNeutralBackground6","width","overflow","rounded","borderRadius","borderRadiusMedium","square","borderRadiusNone","height","useBarStyles","base","nonZeroDeterminate","transitionProperty","transitionDuration","transitionTimingFunction","indeterminate","maxWidth","position","backgroundImage","colorTransparentBackground","animationName","animationDuration","animationTimingFunction","animationIterationCount","brand","colorCompoundBrandBackground","error","colorPaletteRedBackground3","warning","colorPaletteDarkOrangeBackground3","success","colorPaletteGreenBackground3","useProgressBarStyles_unstable","state","color","max","shape","thickness","value","rootStyles","barStyles","className","undefined","style","Math","min"],"mappings":"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"}

package/lib-commonjs/index.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/index.ts"],"sourcesContent":["export {\n  ProgressBar,\n  progressBarClassNames,\n  renderProgressBar_unstable,\n  useProgressBar_unstable,\n  useProgressBarStyles_unstable,\n} from './ProgressBar';\nexport type { ProgressBarProps, ProgressBarSlots, ProgressBarState } from './ProgressBar';\n"],"names":["ProgressBar","progressBarClassNames","renderProgressBar_unstable","useProgressBar_unstable","useProgressBarStyles_unstable"],"mappings":";;;;;;;;;;;;eACEA,wBAAW;;;eACXC,kCAAqB;;;eACrBC,uCAA0B;;;eAE1BE,0CAA6B;;;eAD7BD,oCAAuB;;;6BAElB,gBAAgB"}