@fluentui/react-progress 9.0.0-alpha.8 → 9.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.json +301 -1
- package/CHANGELOG.md +125 -2
- package/README.md +9 -17
- package/dist/index.d.ts +20 -11
- package/lib/components/ProgressBar/ProgressBar.js +0 -1
- package/lib/components/ProgressBar/ProgressBar.js.map +1 -1
- package/lib/components/ProgressBar/ProgressBar.types.js.map +1 -1
- package/lib/components/ProgressBar/renderProgressBar.js +4 -3
- package/lib/components/ProgressBar/renderProgressBar.js.map +1 -1
- package/lib/components/ProgressBar/useProgressBar.js +2 -3
- package/lib/components/ProgressBar/useProgressBar.js.map +1 -1
- package/lib/components/ProgressBar/useProgressBarStyles.js +75 -81
- package/lib/components/ProgressBar/useProgressBarStyles.js.map +1 -1
- package/lib/components/ProgressField/ProgressField.js +15 -15
- package/lib/components/ProgressField/ProgressField.js.map +1 -1
- package/lib/index.js +1 -0
- package/lib/index.js.map +1 -1
- package/lib-amd/ProgressBar.js +6 -0
- package/lib-amd/ProgressBar.js.map +1 -0
- package/lib-amd/ProgressField.js +6 -0
- package/lib-amd/ProgressField.js.map +1 -0
- package/lib-amd/components/ProgressBar/ProgressBar.js +15 -0
- package/lib-amd/components/ProgressBar/ProgressBar.js.map +1 -0
- package/lib-amd/components/ProgressBar/ProgressBar.types.js +5 -0
- package/lib-amd/components/ProgressBar/ProgressBar.types.js.map +1 -0
- package/lib-amd/components/ProgressBar/index.js +10 -0
- package/lib-amd/components/ProgressBar/index.js.map +1 -0
- package/lib-amd/components/ProgressBar/renderProgressBar.js +14 -0
- package/lib-amd/components/ProgressBar/renderProgressBar.js.map +1 -0
- package/lib-amd/components/ProgressBar/useProgressBar.js +38 -0
- package/lib-amd/components/ProgressBar/useProgressBar.js.map +1 -0
- package/lib-amd/components/ProgressBar/useProgressBarStyles.js +112 -0
- package/lib-amd/components/ProgressBar/useProgressBarStyles.js.map +1 -0
- package/lib-amd/components/ProgressField/ProgressField.js +13 -0
- package/lib-amd/components/ProgressField/ProgressField.js.map +1 -0
- package/lib-amd/components/ProgressField/index.js +6 -0
- package/lib-amd/components/ProgressField/index.js.map +1 -0
- package/lib-amd/index.js +13 -0
- package/lib-amd/index.js.map +1 -0
- package/lib-commonjs/ProgressBar.js +0 -2
- package/lib-commonjs/ProgressBar.js.map +1 -1
- package/lib-commonjs/ProgressField.js +0 -2
- package/lib-commonjs/ProgressField.js.map +1 -1
- package/lib-commonjs/components/ProgressBar/ProgressBar.js +0 -6
- package/lib-commonjs/components/ProgressBar/ProgressBar.js.map +1 -1
- package/lib-commonjs/components/ProgressBar/ProgressBar.types.js.map +1 -1
- package/lib-commonjs/components/ProgressBar/index.js +0 -6
- package/lib-commonjs/components/ProgressBar/index.js.map +1 -1
- package/lib-commonjs/components/ProgressBar/renderProgressBar.js +4 -7
- package/lib-commonjs/components/ProgressBar/renderProgressBar.js.map +1 -1
- package/lib-commonjs/components/ProgressBar/useProgressBar.js +2 -6
- package/lib-commonjs/components/ProgressBar/useProgressBar.js.map +1 -1
- package/lib-commonjs/components/ProgressBar/useProgressBarStyles.js +75 -86
- package/lib-commonjs/components/ProgressBar/useProgressBarStyles.js.map +1 -1
- package/lib-commonjs/components/ProgressField/ProgressField.js +13 -17
- package/lib-commonjs/components/ProgressField/ProgressField.js.map +1 -1
- package/lib-commonjs/components/ProgressField/index.js +0 -2
- package/lib-commonjs/components/ProgressField/index.js.map +1 -1
- package/lib-commonjs/index.js +1 -4
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +10 -10
| @@ -4,19 +4,15 @@ Object.defineProperty(exports, "__esModule", { | |
| 4 4 | 
             
              value: true
         | 
| 5 5 | 
             
            });
         | 
| 6 6 | 
             
            exports.useProgressBarStyles_unstable = exports.progressBarClassNames = void 0;
         | 
| 7 | 
            -
             | 
| 8 7 | 
             
            const react_1 = /*#__PURE__*/require("@griffel/react");
         | 
| 9 | 
            -
             | 
| 10 8 | 
             
            const react_theme_1 = /*#__PURE__*/require("@fluentui/react-theme");
         | 
| 11 | 
            -
             | 
| 12 9 | 
             
            const react_shared_contexts_1 = /*#__PURE__*/require("@fluentui/react-shared-contexts");
         | 
| 13 | 
            -
             | 
| 14 10 | 
             
            exports.progressBarClassNames = {
         | 
| 15 11 | 
             
              root: 'fui-ProgressBar',
         | 
| 16 12 | 
             
              bar: 'fui-ProgressBar__bar'
         | 
| 17 | 
            -
            }; | 
| 13 | 
            +
            };
         | 
| 14 | 
            +
            // If the percentComplete is near 0, don't animate it.
         | 
| 18 15 | 
             
            // This prevents animations on reset to 0 scenarios.
         | 
| 19 | 
            -
             | 
| 20 16 | 
             
            const ZERO_THRESHOLD = 0.01;
         | 
| 21 17 | 
             
            const barThicknessValues = {
         | 
| 22 18 | 
             
              medium: '2px',
         | 
| @@ -24,7 +20,7 @@ const barThicknessValues = { | |
| 24 20 | 
             
            };
         | 
| 25 21 | 
             
            const indeterminateProgressBar = {
         | 
| 26 22 | 
             
              '0%': {
         | 
| 27 | 
            -
                left: ' | 
| 23 | 
            +
                left: '-100% /* @noflip */'
         | 
| 28 24 | 
             
              },
         | 
| 29 25 | 
             
              '100%': {
         | 
| 30 26 | 
             
                left: '100% /* @noflip */'
         | 
| @@ -41,115 +37,112 @@ const indeterminateProgressBarRTL = { | |
| 41 37 | 
             
            /**
         | 
| 42 38 | 
             
             * Styles for the root slot
         | 
| 43 39 | 
             
             */
         | 
| 44 | 
            -
             | 
| 45 40 | 
             
            const useRootStyles = /*#__PURE__*/react_1.__styles({
         | 
| 46 | 
            -
               | 
| 47 | 
            -
                 | 
| 48 | 
            -
                 | 
| 49 | 
            -
                 | 
| 50 | 
            -
                 | 
| 51 | 
            -
                 | 
| 52 | 
            -
                 | 
| 53 | 
            -
                 | 
| 54 | 
            -
                 | 
| 41 | 
            +
              root: {
         | 
| 42 | 
            +
                mc9l5x: "ftgm304",
         | 
| 43 | 
            +
                De3pzq: "f18f03hv",
         | 
| 44 | 
            +
                Bdqf98w: "fhb5wj7",
         | 
| 45 | 
            +
                B68tc82: "f1p9o1ba",
         | 
| 46 | 
            +
                Bmxbyg5: "f1sil6mw",
         | 
| 47 | 
            +
                I5kgcl: "fs8b23g",
         | 
| 48 | 
            +
                tu2nte: "f1mcb20s",
         | 
| 49 | 
            +
                y0r1ed: "fek7wd8"
         | 
| 55 50 | 
             
              },
         | 
| 56 | 
            -
               | 
| 57 | 
            -
                 | 
| 58 | 
            -
                 | 
| 59 | 
            -
                 | 
| 60 | 
            -
                 | 
| 51 | 
            +
              rounded: {
         | 
| 52 | 
            +
                Bbmb7ep: ["f1aa9q02", "f16jpd5f"],
         | 
| 53 | 
            +
                Beyfa6y: ["f16jpd5f", "f1aa9q02"],
         | 
| 54 | 
            +
                B7oj6ja: ["f1jar5jt", "fyu767a"],
         | 
| 55 | 
            +
                Btl43ni: ["fyu767a", "f1jar5jt"]
         | 
| 61 56 | 
             
              },
         | 
| 62 | 
            -
               | 
| 63 | 
            -
                 | 
| 64 | 
            -
                 | 
| 65 | 
            -
                 | 
| 66 | 
            -
                 | 
| 57 | 
            +
              square: {
         | 
| 58 | 
            +
                Bbmb7ep: ["fzi6hpg", "fyowgf4"],
         | 
| 59 | 
            +
                Beyfa6y: ["fyowgf4", "fzi6hpg"],
         | 
| 60 | 
            +
                B7oj6ja: ["f3fg2lr", "f13av6d4"],
         | 
| 61 | 
            +
                Btl43ni: ["f13av6d4", "f3fg2lr"]
         | 
| 67 62 | 
             
              },
         | 
| 68 | 
            -
               | 
| 69 | 
            -
                 | 
| 63 | 
            +
              medium: {
         | 
| 64 | 
            +
                Bqenvij: "f4t8t6x"
         | 
| 70 65 | 
             
              },
         | 
| 71 | 
            -
               | 
| 72 | 
            -
                 | 
| 66 | 
            +
              large: {
         | 
| 67 | 
            +
                Bqenvij: "f6ywr7j"
         | 
| 73 68 | 
             
              }
         | 
| 74 69 | 
             
            }, {
         | 
| 75 | 
            -
               | 
| 76 | 
            -
               | 
| 77 | 
            -
                 | 
| 70 | 
            +
              d: [".ftgm304{display:block;}", ".f18f03hv{background-color:var(--colorNeutralBackground6);}", ".fhb5wj7{justify-self:stretch;}", ".f1p9o1ba{overflow-x:hidden;}", ".f1sil6mw{overflow-y:hidden;}", ".f1aa9q02{border-bottom-right-radius:var(--borderRadiusMedium);}", ".f16jpd5f{border-bottom-left-radius:var(--borderRadiusMedium);}", ".f1jar5jt{border-top-right-radius:var(--borderRadiusMedium);}", ".fyu767a{border-top-left-radius:var(--borderRadiusMedium);}", ".fzi6hpg{border-bottom-right-radius:var(--borderRadiusNone);}", ".fyowgf4{border-bottom-left-radius:var(--borderRadiusNone);}", ".f3fg2lr{border-top-right-radius:var(--borderRadiusNone);}", ".f13av6d4{border-top-left-radius:var(--borderRadiusNone);}", ".f4t8t6x{height:2px;}", ".f6ywr7j{height:4px;}"],
         | 
| 71 | 
            +
              m: [["@media screen and (forced-colors: active){.fs8b23g{border-bottom-width:1px;}}", {
         | 
| 72 | 
            +
                m: "screen and (forced-colors: active)"
         | 
| 78 73 | 
             
              }], ["@media screen and (forced-colors: active){.f1mcb20s{border-bottom-style:solid;}}", {
         | 
| 79 | 
            -
                 | 
| 74 | 
            +
                m: "screen and (forced-colors: active)"
         | 
| 80 75 | 
             
              }], ["@media screen and (forced-colors: active){.fek7wd8{border-bottom-color:CanvasText;}}", {
         | 
| 81 | 
            -
                 | 
| 76 | 
            +
                m: "screen and (forced-colors: active)"
         | 
| 82 77 | 
             
              }]]
         | 
| 83 78 | 
             
            });
         | 
| 84 79 | 
             
            /**
         | 
| 85 80 | 
             
             * Styles for the ProgressBar bar
         | 
| 86 81 | 
             
             */
         | 
| 87 | 
            -
             | 
| 88 | 
            -
             | 
| 89 82 | 
             
            const useBarStyles = /*#__PURE__*/react_1.__styles({
         | 
| 90 | 
            -
               | 
| 91 | 
            -
                " | 
| 92 | 
            -
                " | 
| 93 | 
            -
                 | 
| 94 | 
            -
                 | 
| 95 | 
            -
                "B7oj6ja": ["fuoumxm", "f1vtqnvc"],
         | 
| 96 | 
            -
                "Btl43ni": ["f1vtqnvc", "fuoumxm"]
         | 
| 83 | 
            +
              base: {
         | 
| 84 | 
            +
                Bbmb7ep: ["f1d9uwra", "fzibvwi"],
         | 
| 85 | 
            +
                Beyfa6y: ["fzibvwi", "f1d9uwra"],
         | 
| 86 | 
            +
                B7oj6ja: ["fuoumxm", "f1vtqnvc"],
         | 
| 87 | 
            +
                Btl43ni: ["f1vtqnvc", "fuoumxm"]
         | 
| 97 88 | 
             
              },
         | 
| 98 | 
            -
               | 
| 99 | 
            -
                 | 
| 89 | 
            +
              medium: {
         | 
| 90 | 
            +
                Bqenvij: "f4t8t6x"
         | 
| 100 91 | 
             
              },
         | 
| 101 | 
            -
               | 
| 102 | 
            -
                 | 
| 92 | 
            +
              large: {
         | 
| 93 | 
            +
                Bqenvij: "f6ywr7j"
         | 
| 103 94 | 
             
              },
         | 
| 104 | 
            -
               | 
| 105 | 
            -
                 | 
| 106 | 
            -
                 | 
| 107 | 
            -
                 | 
| 95 | 
            +
              nonZeroDeterminate: {
         | 
| 96 | 
            +
                Bmy1vo4: "fjt6zfz",
         | 
| 97 | 
            +
                B3o57yi: "f1wofebd",
         | 
| 98 | 
            +
                Bkqvd7p: "fv71qf3"
         | 
| 108 99 | 
             
              },
         | 
| 109 | 
            -
               | 
| 110 | 
            -
                 | 
| 111 | 
            -
                 | 
| 112 | 
            -
                 | 
| 113 | 
            -
                 | 
| 114 | 
            -
                 | 
| 115 | 
            -
                 | 
| 116 | 
            -
                 | 
| 117 | 
            -
                 | 
| 100 | 
            +
              indeterminate: {
         | 
| 101 | 
            +
                B2u0y6b: "fa0wk36",
         | 
| 102 | 
            +
                qhf8xq: "f10pi13n",
         | 
| 103 | 
            +
                Bcmaq0h: ["fpo0yib", "f1u5hf6c"],
         | 
| 104 | 
            +
                Bv12yb3: "f1jk3tlg",
         | 
| 105 | 
            +
                vin17d: "f1a27w2r",
         | 
| 106 | 
            +
                w3vfg9: "f1cpbl36",
         | 
| 107 | 
            +
                Gqtpxc: "f4akx1t",
         | 
| 108 | 
            +
                B3vm3ge: "f18p5put"
         | 
| 118 109 | 
             
              },
         | 
| 119 | 
            -
               | 
| 120 | 
            -
                 | 
| 110 | 
            +
              rtl: {
         | 
| 111 | 
            +
                Bv12yb3: "fjhwsai"
         | 
| 121 112 | 
             
              },
         | 
| 122 | 
            -
               | 
| 123 | 
            -
                 | 
| 113 | 
            +
              brand: {
         | 
| 114 | 
            +
                De3pzq: "ftywsgz",
         | 
| 115 | 
            +
                Bpep1pd: "f1neahkh"
         | 
| 124 116 | 
             
              },
         | 
| 125 | 
            -
               | 
| 126 | 
            -
                 | 
| 117 | 
            +
              error: {
         | 
| 118 | 
            +
                De3pzq: "fdl5y0r"
         | 
| 127 119 | 
             
              },
         | 
| 128 | 
            -
               | 
| 129 | 
            -
                 | 
| 120 | 
            +
              warning: {
         | 
| 121 | 
            +
                De3pzq: "f1s438gw"
         | 
| 122 | 
            +
              },
         | 
| 123 | 
            +
              success: {
         | 
| 124 | 
            +
                De3pzq: "flxk52p"
         | 
| 130 125 | 
             
              }
         | 
| 131 126 | 
             
            }, {
         | 
| 132 | 
            -
               | 
| 133 | 
            -
               | 
| 134 | 
            -
             | 
| 135 | 
            -
             | 
| 136 | 
            -
                "m": "screen and (prefers-reduced-motion: reduce)"
         | 
| 127 | 
            +
              d: [".f1d9uwra{border-bottom-right-radius:inherit;}", ".fzibvwi{border-bottom-left-radius:inherit;}", ".fuoumxm{border-top-right-radius:inherit;}", ".f1vtqnvc{border-top-left-radius:inherit;}", ".f4t8t6x{height:2px;}", ".f6ywr7j{height:4px;}", ".fjt6zfz{transition-property:width;}", ".f1wofebd{transition-duration:0.3s;}", ".fv71qf3{transition-timing-function:ease;}", ".fa0wk36{max-width:33%;}", ".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    );}", ".f1jk3tlg{-webkit-animation-name:fzkbrka;animation-name:fzkbrka;}", ".f1a27w2r{-webkit-animation-duration:3s;animation-duration:3s;}", ".f1cpbl36{-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;}", ".fjhwsai{-webkit-animation-name:f1kx06uz;animation-name:f1kx06uz;}", ".ftywsgz{background-color:var(--colorCompoundBrandBackground);}", ".fdl5y0r{background-color:var(--colorPaletteRedBackground3);}", ".f1s438gw{background-color:var(--colorPaletteDarkOrangeBackground3);}", ".flxk52p{background-color:var(--colorPaletteGreenBackground3);}"],
         | 
| 128 | 
            +
              k: ["@-webkit-keyframes fzkbrka{0%{left:-100%;}100%{left:100%;}}", "@keyframes fzkbrka{0%{left:-100%;}100%{left:100%;}}", "@-webkit-keyframes f1kx06uz{100%{right:-100%;}0%{right:100%;}}", "@keyframes f1kx06uz{100%{right:-100%;}0%{right:100%;}}"],
         | 
| 129 | 
            +
              m: [["@media screen and (prefers-reduced-motion: reduce){.f4akx1t{-webkit-animation-duration:0.01ms;animation-duration:0.01ms;}}", {
         | 
| 130 | 
            +
                m: "screen and (prefers-reduced-motion: reduce)"
         | 
| 137 131 | 
             
              }], ["@media screen and (prefers-reduced-motion: reduce){.f18p5put{-webkit-animation-iteration-count:1;animation-iteration-count:1;}}", {
         | 
| 138 | 
            -
                 | 
| 139 | 
            -
              }] | 
| 140 | 
            -
             | 
| 132 | 
            +
                m: "screen and (prefers-reduced-motion: reduce)"
         | 
| 133 | 
            +
              }], ["@media screen and (forced-colors: active){.f1neahkh{background-color:Highlight;}}", {
         | 
| 134 | 
            +
                m: "screen and (forced-colors: active)"
         | 
| 135 | 
            +
              }]]
         | 
| 141 136 | 
             
            });
         | 
| 142 137 | 
             
            /**
         | 
| 143 138 | 
             
             * Apply styling to the ProgressBar slots based on the state
         | 
| 144 139 | 
             
             */
         | 
| 145 | 
            -
             | 
| 146 | 
            -
             | 
| 147 140 | 
             
            const useProgressBarStyles_unstable = state => {
         | 
| 148 141 | 
             
              const {
         | 
| 142 | 
            +
                color,
         | 
| 149 143 | 
             
                max,
         | 
| 150 144 | 
             
                shape,
         | 
| 151 145 | 
             
                thickness,
         | 
| 152 | 
            -
                validationState,
         | 
| 153 146 | 
             
                value
         | 
| 154 147 | 
             
              } = state;
         | 
| 155 148 | 
             
              const rootStyles = useRootStyles();
         | 
| @@ -158,20 +151,16 @@ const useProgressBarStyles_unstable = state => { | |
| 158 151 | 
             
                dir
         | 
| 159 152 | 
             
              } = react_shared_contexts_1.useFluent_unstable();
         | 
| 160 153 | 
             
              state.root.className = react_1.mergeClasses(exports.progressBarClassNames.root, rootStyles.root, rootStyles[shape], rootStyles[thickness], state.root.className);
         | 
| 161 | 
            -
             | 
| 162 154 | 
             
              if (state.bar) {
         | 
| 163 | 
            -
                state.bar.className = react_1.mergeClasses(exports.progressBarClassNames.bar, barStyles.base, value === undefined && barStyles.indeterminate, value === undefined && dir === 'rtl' && barStyles.rtl, barStyles[thickness], value !== undefined && value > ZERO_THRESHOLD && barStyles.nonZeroDeterminate,  | 
| 155 | 
            +
                state.bar.className = react_1.mergeClasses(exports.progressBarClassNames.bar, barStyles.base, barStyles.brand, value === undefined && barStyles.indeterminate, value === undefined && dir === 'rtl' && barStyles.rtl, barStyles[thickness], value !== undefined && value > ZERO_THRESHOLD && barStyles.nonZeroDeterminate, color && value !== undefined && barStyles[color], state.bar.className);
         | 
| 164 156 | 
             
              }
         | 
| 165 | 
            -
             | 
| 166 157 | 
             
              if (state.bar && value !== undefined) {
         | 
| 167 158 | 
             
                state.bar.style = {
         | 
| 168 159 | 
             
                  width: Math.min(100, Math.max(0, value / max * 100)) + '%',
         | 
| 169 160 | 
             
                  ...state.bar.style
         | 
| 170 161 | 
             
                };
         | 
| 171 162 | 
             
              }
         | 
| 172 | 
            -
             | 
| 173 163 | 
             
              return state;
         | 
| 174 164 | 
             
            };
         | 
| 175 | 
            -
             | 
| 176 165 | 
             
            exports.useProgressBarStyles_unstable = useProgressBarStyles_unstable;
         | 
| 177 166 | 
             
            //# sourceMappingURL=useProgressBarStyles.js.map
         | 
| @@ -1 +1 @@ | |
| 1 | 
            -
            {"version":3," | 
| 1 | 
            +
            {"version":3,"mappings":"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","names":["exports","root","bar","ZERO_THRESHOLD","barThicknessValues","medium","large","indeterminateProgressBar","left","indeterminateProgressBarRTL","right","useRootStyles","react_1","useBarStyles","useProgressBarStyles_unstable","state","color","max","shape","thickness","value","rootStyles","barStyles","dir","react_shared_contexts_1","className","base","brand","undefined","indeterminate","rtl","nonZeroDeterminate","style","width","Math","min"],"sourceRoot":"../src/","sources":["packages/react-components/react-progress/src/components/ProgressBar/useProgressBarStyles.ts"],"sourcesContent":["import { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { tokens } from '@fluentui/react-theme';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\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: '-100% /* @noflip */',\n  },\n  '100%': {\n    left: '100% /* @noflip */',\n  },\n};\nconst indeterminateProgressBarRTL = {\n  '100%': {\n    right: '-100% /* @noflip */',\n  },\n  '0%': {\n    right: '100% /* @noflip */',\n  },\n};\n\n/**\n * Styles for the root slot\n */\nconst useRootStyles = makeStyles({\n  root: {\n    display: 'block',\n    backgroundColor: tokens.colorNeutralBackground6,\n    justifySelf: 'stretch',\n    ...shorthands.overflow('hidden'),\n\n    '@media screen and (forced-colors: active)': {\n      ...shorthands.borderBottom('1px', 'solid', 'CanvasText'),\n    },\n  },\n  rounded: {\n    ...shorthands.borderRadius(tokens.borderRadiusMedium),\n  },\n  square: {\n    ...shorthands.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    ...shorthands.borderRadius('inherit'),\n  },\n  medium: {\n    height: barThicknessValues.medium,\n  },\n  large: {\n    height: barThicknessValues.large,\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    animationIterationCount: 'infinite',\n    '@media screen and (prefers-reduced-motion: reduce)': {\n      animationDuration: '0.01ms',\n      animationIterationCount: '1',\n    },\n  },\n\n  rtl: {\n    animationName: indeterminateProgressBarRTL,\n  },\n\n  brand: {\n    backgroundColor: tokens.colorCompoundBrandBackground,\n    '@media screen and (forced-colors: active)': {\n      backgroundColor: 'Highlight',\n    },\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  const { dir } = useFluent();\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 && dir === 'rtl' && barStyles.rtl,\n      barStyles[thickness],\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"]}
         | 
| @@ -4,24 +4,20 @@ Object.defineProperty(exports, "__esModule", { | |
| 4 4 | 
             
              value: true
         | 
| 5 5 | 
             
            });
         | 
| 6 6 | 
             
            exports.ProgressField = exports.progressFieldClassNames = void 0;
         | 
| 7 | 
            -
             | 
| 8 | 
            -
            const React = /*#__PURE__*/require("react");
         | 
| 9 | 
            -
             | 
| 7 | 
            +
            /* eslint-disable deprecation/deprecation */
         | 
| 10 8 | 
             
            const react_field_1 = /*#__PURE__*/require("@fluentui/react-field");
         | 
| 11 | 
            -
             | 
| 12 9 | 
             
            const ProgressBar_1 = /*#__PURE__*/require("../../ProgressBar");
         | 
| 13 | 
            -
             | 
| 14 | 
            -
            exports.progressFieldClassNames = /*#__PURE__*/react_field_1. | 
| 15 | 
            -
             | 
| 16 | 
            -
             | 
| 17 | 
            -
             | 
| 18 | 
            -
             | 
| 19 | 
            -
                 | 
| 20 | 
            -
                 | 
| 21 | 
            -
             | 
| 22 | 
            -
             | 
| 23 | 
            -
             | 
| 24 | 
            -
               | 
| 10 | 
            +
            /** @deprecated Use Field with ProgressBar: `<Field><ProgressBar /></Field>` */
         | 
| 11 | 
            +
            exports.progressFieldClassNames = /*#__PURE__*/react_field_1.getDeprecatedFieldClassNames(ProgressBar_1.progressBarClassNames.root);
         | 
| 12 | 
            +
            /** @deprecated Use Field with ProgressBar: `<Field><ProgressBar /></Field>` */
         | 
| 13 | 
            +
            exports.ProgressField = /*#__PURE__*/react_field_1.makeDeprecatedField(ProgressBar_1.ProgressBar, {
         | 
| 14 | 
            +
              displayName: 'ProgressField',
         | 
| 15 | 
            +
              mapProps: props => ({
         | 
| 16 | 
            +
                ...props,
         | 
| 17 | 
            +
                control: {
         | 
| 18 | 
            +
                  ...props.control,
         | 
| 19 | 
            +
                  validationState: props.validationState
         | 
| 20 | 
            +
                }
         | 
| 21 | 
            +
              })
         | 
| 25 22 | 
             
            });
         | 
| 26 | 
            -
            exports.ProgressField.displayName = 'ProgressField';
         | 
| 27 23 | 
             
            //# sourceMappingURL=ProgressField.js.map
         | 
| @@ -1 +1 @@ | |
| 1 | 
            -
            {"version":3," | 
| 1 | 
            +
            {"version":3,"mappings":";;;;;;AAAA;AACA;AAEA;AAIA;AACaA,+BAAuB,gBAAGC,0CAA4B,CAACC,mCAAqB,CAACC,IAAI,CAAC;AAC/F;AACaH,qBAAa,gBAA4CC,iCAAmB,CAACC,yBAAW,EAAE;EACrGE,WAAW,EAAE,eAAe;EAC5BC,QAAQ,EAAGC,KAAyB,KAAM;IACxC,GAAGA,KAAK;IACRC,OAAO,EAAE;MAAE,GAAGD,KAAK,CAACC,OAAO;MAAEC,eAAe,EAAEF,KAAK,CAACE;IAAe;GACpE;CACF,CAAC","names":["exports","react_field_1","ProgressBar_1","root","displayName","mapProps","props","control","validationState"],"sourceRoot":"../src/","sources":["packages/react-components/react-progress/src/components/ProgressField/ProgressField.tsx"],"sourcesContent":["/* eslint-disable deprecation/deprecation */\nimport { DeprecatedFieldProps, getDeprecatedFieldClassNames, makeDeprecatedField } from '@fluentui/react-field';\nimport type { ForwardRefComponent } from '@fluentui/react-utilities';\nimport { ProgressBar, progressBarClassNames, ProgressBarProps } from '../../ProgressBar';\n\n/** @deprecated Use Field with ProgressBar: `<Field><ProgressBar /></Field>` */\nexport type ProgressFieldProps = DeprecatedFieldProps<ProgressBarProps>;\n/** @deprecated Use Field with ProgressBar: `<Field><ProgressBar /></Field>` */\nexport const progressFieldClassNames = getDeprecatedFieldClassNames(progressBarClassNames.root);\n/** @deprecated Use Field with ProgressBar: `<Field><ProgressBar /></Field>` */\nexport const ProgressField: ForwardRefComponent<ProgressFieldProps> = makeDeprecatedField(ProgressBar, {\n  displayName: 'ProgressField',\n  mapProps: (props: ProgressFieldProps) => ({\n    ...props,\n    control: { ...props.control, validationState: props.validationState },\n  }),\n});\n"]}
         | 
| @@ -1 +1 @@ | |
| 1 | 
            -
            {"version":3,"sources":["packages/react-components/react-progress/src/components/ProgressField/index.ts"]," | 
| 1 | 
            +
            {"version":3,"mappings":";;;;;;AAAAA","names":["tslib_1"],"sourceRoot":"../src/","sources":["packages/react-components/react-progress/src/components/ProgressField/index.ts"],"sourcesContent":["export * from './ProgressField';\n"]}
         | 
    
        package/lib-commonjs/index.js
    CHANGED
    
    | @@ -4,9 +4,7 @@ Object.defineProperty(exports, "__esModule", { | |
| 4 4 | 
             
              value: true
         | 
| 5 5 | 
             
            });
         | 
| 6 6 | 
             
            exports.progressFieldClassNames = exports.ProgressField_unstable = exports.useProgressBarStyles_unstable = exports.useProgressBar_unstable = exports.renderProgressBar_unstable = exports.progressBarClassNames = exports.ProgressBar = void 0;
         | 
| 7 | 
            -
             | 
| 8 7 | 
             
            var ProgressBar_1 = /*#__PURE__*/require("./ProgressBar");
         | 
| 9 | 
            -
             | 
| 10 8 | 
             
            Object.defineProperty(exports, "ProgressBar", {
         | 
| 11 9 | 
             
              enumerable: true,
         | 
| 12 10 | 
             
              get: function () {
         | 
| @@ -37,9 +35,8 @@ Object.defineProperty(exports, "useProgressBarStyles_unstable", { | |
| 37 35 | 
             
                return ProgressBar_1.useProgressBarStyles_unstable;
         | 
| 38 36 | 
             
              }
         | 
| 39 37 | 
             
            });
         | 
| 40 | 
            -
             | 
| 38 | 
            +
            // eslint-disable-next-line deprecation/deprecation
         | 
| 41 39 | 
             
            var ProgressField_1 = /*#__PURE__*/require("./ProgressField");
         | 
| 42 | 
            -
             | 
| 43 40 | 
             
            Object.defineProperty(exports, "ProgressField_unstable", {
         | 
| 44 41 | 
             
              enumerable: true,
         | 
| 45 42 | 
             
              get: function () {
         | 
| @@ -1 +1 @@ | |
| 1 | 
            -
            {"version":3," | 
| 1 | 
            +
            {"version":3,"mappings":";;;;;;AAAA;AACEA;EAAAC;EAAAC;IAAA,gCAAW;EAAA;AAAA;AACXF;EAAAC;EAAAC;IAAA,0CAAqB;EAAA;AAAA;AACrBF;EAAAC;EAAAC;IAAA,+CAA0B;EAAA;AAAA;AAC1BF;EAAAC;EAAAC;IAAA,4CAAuB;EAAA;AAAA;AACvBF;EAAAC;EAAAC;IAAA,kDAA6B;EAAA;AAAA;AAI/B;AACA;AAASF;EAAAC;EAAAC;IAAA,oCAAa;EAAA;AAAA;AAA4BF;EAAAC;EAAAC;IAAA,8CAAuB;EAAA;AAAA","names":["Object","enumerable","get"],"sourceRoot":"../src/","sources":["packages/react-components/react-progress/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\n// eslint-disable-next-line deprecation/deprecation\nexport { ProgressField as ProgressField_unstable, progressFieldClassNames } from './ProgressField';\n// eslint-disable-next-line deprecation/deprecation\nexport type { ProgressFieldProps as ProgressFieldProps_unstable } from './ProgressField';\n"]}
         | 
    
        package/package.json
    CHANGED
    
    | @@ -1,6 +1,6 @@ | |
| 1 1 | 
             
            {
         | 
| 2 2 | 
             
              "name": "@fluentui/react-progress",
         | 
| 3 | 
            -
              "version": "9.0.0 | 
| 3 | 
            +
              "version": "9.0.0",
         | 
| 4 4 | 
             
              "description": "Progress component for FluentUI v9",
         | 
| 5 5 | 
             
              "main": "lib-commonjs/index.js",
         | 
| 6 6 | 
             
              "module": "lib/index.js",
         | 
| @@ -27,15 +27,16 @@ | |
| 27 27 | 
             
              "devDependencies": {
         | 
| 28 28 | 
             
                "@fluentui/eslint-plugin": "*",
         | 
| 29 29 | 
             
                "@fluentui/react-conformance": "*",
         | 
| 30 | 
            -
                "@fluentui/react-conformance-griffel": "9.0.0-beta. | 
| 31 | 
            -
                "@fluentui/scripts": " | 
| 30 | 
            +
                "@fluentui/react-conformance-griffel": "9.0.0-beta.19",
         | 
| 31 | 
            +
                "@fluentui/scripts-api-extractor": "*",
         | 
| 32 | 
            +
                "@fluentui/scripts-tasks": "*"
         | 
| 32 33 | 
             
              },
         | 
| 33 34 | 
             
              "dependencies": {
         | 
| 34 | 
            -
                "@fluentui/react-field": "9.0.0-alpha. | 
| 35 | 
            -
                "@fluentui/react-shared-contexts": "^9. | 
| 36 | 
            -
                "@fluentui/react-theme": "^9.1. | 
| 37 | 
            -
                "@fluentui/react-utilities": "^9. | 
| 38 | 
            -
                "@griffel/react": "^1. | 
| 35 | 
            +
                "@fluentui/react-field": "9.0.0-alpha.21",
         | 
| 36 | 
            +
                "@fluentui/react-shared-contexts": "^9.2.0",
         | 
| 37 | 
            +
                "@fluentui/react-theme": "^9.1.5",
         | 
| 38 | 
            +
                "@fluentui/react-utilities": "^9.6.0",
         | 
| 39 | 
            +
                "@griffel/react": "^1.5.2",
         | 
| 39 40 | 
             
                "tslib": "^2.1.0"
         | 
| 40 41 | 
             
              },
         | 
| 41 42 | 
             
              "peerDependencies": {
         | 
| @@ -47,8 +48,7 @@ | |
| 47 48 | 
             
              "beachball": {
         | 
| 48 49 | 
             
                "disallowedChangeTypes": [
         | 
| 49 50 | 
             
                  "major",
         | 
| 50 | 
            -
                  " | 
| 51 | 
            -
                  "patch"
         | 
| 51 | 
            +
                  "prerelease"
         | 
| 52 52 | 
             
                ]
         | 
| 53 53 | 
             
              },
         | 
| 54 54 | 
             
              "exports": {
         |