@fluentui/react-progress 9.0.0-alpha.12 → 9.0.0-alpha.14
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 +55 -1
- package/CHANGELOG.md +24 -2
- package/dist/index.d.ts +15 -7
- package/lib/components/ProgressBar/ProgressBar.types.js.map +1 -1
- package/lib/components/ProgressBar/useProgressBarStyles.js +1 -1
- 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-commonjs/components/ProgressBar/useProgressBarStyles.js +1 -1
- package/lib-commonjs/components/ProgressBar/useProgressBarStyles.js.map +1 -1
- package/lib-commonjs/components/ProgressField/ProgressField.js +13 -13
- package/lib-commonjs/components/ProgressField/ProgressField.js.map +1 -1
- package/lib-commonjs/index.js +1 -0
- package/lib-commonjs/index.js.map +1 -1
- package/package.json +4 -4
package/CHANGELOG.json
CHANGED
@@ -2,7 +2,61 @@
|
|
2
2
|
"name": "@fluentui/react-progress",
|
3
3
|
"entries": [
|
4
4
|
{
|
5
|
-
"date": "
|
5
|
+
"date": "Thu, 26 Jan 2023 13:27:48 GMT",
|
6
|
+
"tag": "@fluentui/react-progress_v9.0.0-alpha.14",
|
7
|
+
"version": "9.0.0-alpha.14",
|
8
|
+
"comments": {
|
9
|
+
"prerelease": [
|
10
|
+
{
|
11
|
+
"author": "behowell@microsoft.com",
|
12
|
+
"package": "@fluentui/react-progress",
|
13
|
+
"commit": "d6e98c0b5390c5c7e03601537b2026307e01a8d4",
|
14
|
+
"comment": "Deprecate ProgressField_unstable in favor of Field with Progress as its child."
|
15
|
+
},
|
16
|
+
{
|
17
|
+
"author": "beachball",
|
18
|
+
"package": "@fluentui/react-progress",
|
19
|
+
"comment": "Bump @fluentui/react-field to v9.0.0-alpha.17",
|
20
|
+
"commit": "403e1370f1effca7d3db131eda381abf31cf66b1"
|
21
|
+
},
|
22
|
+
{
|
23
|
+
"author": "beachball",
|
24
|
+
"package": "@fluentui/react-progress",
|
25
|
+
"comment": "Bump @fluentui/react-shared-contexts to v9.2.0",
|
26
|
+
"commit": "403e1370f1effca7d3db131eda381abf31cf66b1"
|
27
|
+
},
|
28
|
+
{
|
29
|
+
"author": "beachball",
|
30
|
+
"package": "@fluentui/react-progress",
|
31
|
+
"comment": "Bump @fluentui/react-utilities to v9.5.0",
|
32
|
+
"commit": "403e1370f1effca7d3db131eda381abf31cf66b1"
|
33
|
+
}
|
34
|
+
]
|
35
|
+
}
|
36
|
+
},
|
37
|
+
{
|
38
|
+
"date": "Mon, 23 Jan 2023 16:43:11 GMT",
|
39
|
+
"tag": "@fluentui/react-progress_v9.0.0-alpha.13",
|
40
|
+
"version": "9.0.0-alpha.13",
|
41
|
+
"comments": {
|
42
|
+
"prerelease": [
|
43
|
+
{
|
44
|
+
"author": "miroslav.stastny@microsoft.com",
|
45
|
+
"package": "@fluentui/react-progress",
|
46
|
+
"commit": "22b51ad9694bdaa9dbf0bd1283421d65f77dbf8c",
|
47
|
+
"comment": "Rename rectangular shape to square"
|
48
|
+
},
|
49
|
+
{
|
50
|
+
"author": "beachball",
|
51
|
+
"package": "@fluentui/react-progress",
|
52
|
+
"comment": "Bump @fluentui/react-field to v9.0.0-alpha.16",
|
53
|
+
"commit": "828c4260edc4fba07c9ccc8e94f15051c7fd25d3"
|
54
|
+
}
|
55
|
+
]
|
56
|
+
}
|
57
|
+
},
|
58
|
+
{
|
59
|
+
"date": "Mon, 16 Jan 2023 08:39:07 GMT",
|
6
60
|
"tag": "@fluentui/react-progress_v9.0.0-alpha.12",
|
7
61
|
"version": "9.0.0-alpha.12",
|
8
62
|
"comments": {
|
package/CHANGELOG.md
CHANGED
@@ -1,12 +1,34 @@
|
|
1
1
|
# Change Log - @fluentui/react-progress
|
2
2
|
|
3
|
-
This log was last generated on
|
3
|
+
This log was last generated on Thu, 26 Jan 2023 13:27:48 GMT and should not be manually modified.
|
4
4
|
|
5
5
|
<!-- Start content -->
|
6
6
|
|
7
|
+
## [9.0.0-alpha.14](https://github.com/microsoft/fluentui/tree/@fluentui/react-progress_v9.0.0-alpha.14)
|
8
|
+
|
9
|
+
Thu, 26 Jan 2023 13:27:48 GMT
|
10
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-progress_v9.0.0-alpha.13..@fluentui/react-progress_v9.0.0-alpha.14)
|
11
|
+
|
12
|
+
### Changes
|
13
|
+
|
14
|
+
- Deprecate ProgressField_unstable in favor of Field with Progress as its child. ([PR #26430](https://github.com/microsoft/fluentui/pull/26430) by behowell@microsoft.com)
|
15
|
+
- Bump @fluentui/react-field to v9.0.0-alpha.17 ([PR #26496](https://github.com/microsoft/fluentui/pull/26496) by beachball)
|
16
|
+
- Bump @fluentui/react-shared-contexts to v9.2.0 ([PR #26496](https://github.com/microsoft/fluentui/pull/26496) by beachball)
|
17
|
+
- Bump @fluentui/react-utilities to v9.5.0 ([PR #26496](https://github.com/microsoft/fluentui/pull/26496) by beachball)
|
18
|
+
|
19
|
+
## [9.0.0-alpha.13](https://github.com/microsoft/fluentui/tree/@fluentui/react-progress_v9.0.0-alpha.13)
|
20
|
+
|
21
|
+
Mon, 23 Jan 2023 16:43:11 GMT
|
22
|
+
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-progress_v9.0.0-alpha.12..@fluentui/react-progress_v9.0.0-alpha.13)
|
23
|
+
|
24
|
+
### Changes
|
25
|
+
|
26
|
+
- Rename rectangular shape to square ([PR #26419](https://github.com/microsoft/fluentui/pull/26419) by miroslav.stastny@microsoft.com)
|
27
|
+
- Bump @fluentui/react-field to v9.0.0-alpha.16 ([PR #26434](https://github.com/microsoft/fluentui/pull/26434) by beachball)
|
28
|
+
|
7
29
|
## [9.0.0-alpha.12](https://github.com/microsoft/fluentui/tree/@fluentui/react-progress_v9.0.0-alpha.12)
|
8
30
|
|
9
|
-
Mon, 16 Jan 2023 08:
|
31
|
+
Mon, 16 Jan 2023 08:39:07 GMT
|
10
32
|
[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-progress_v9.0.0-alpha.11..@fluentui/react-progress_v9.0.0-alpha.12)
|
11
33
|
|
12
34
|
### Changes
|
package/dist/index.d.ts
CHANGED
@@ -2,13 +2,11 @@
|
|
2
2
|
|
3
3
|
import type { ComponentProps } from '@fluentui/react-utilities';
|
4
4
|
import type { ComponentState } from '@fluentui/react-utilities';
|
5
|
-
import {
|
6
|
-
import type { FieldProps } from '@fluentui/react-field';
|
7
|
-
import { FieldSlots } from '@fluentui/react-field';
|
5
|
+
import { DeprecatedFieldProps } from '@fluentui/react-field';
|
8
6
|
import type { ForwardRefComponent } from '@fluentui/react-utilities';
|
9
7
|
import * as React_2 from 'react';
|
10
8
|
import type { Slot } from '@fluentui/react-utilities';
|
11
|
-
import { SlotClassNames } from '@fluentui/react-utilities';
|
9
|
+
import type { SlotClassNames } from '@fluentui/react-utilities';
|
12
10
|
|
13
11
|
/**
|
14
12
|
* A ProgressBar bar shows the progression of a task.
|
@@ -25,7 +23,7 @@ export declare type ProgressBarProps = Omit<ComponentProps<ProgressBarSlots>, 's
|
|
25
23
|
* The shape of the bar and track.
|
26
24
|
* @default 'rounded'
|
27
25
|
*/
|
28
|
-
shape?: 'rounded' | '
|
26
|
+
shape?: 'rounded' | 'square';
|
29
27
|
/**
|
30
28
|
* A decimal number between `0` and `1` (or between `0` and `max` if given),
|
31
29
|
* which specifies how much of the task has been completed.
|
@@ -66,11 +64,21 @@ export declare type ProgressBarSlots = {
|
|
66
64
|
*/
|
67
65
|
export declare type ProgressBarState = ComponentState<ProgressBarSlots> & Required<Pick<ProgressBarProps, 'max' | 'shape' | 'thickness'>> & Pick<ProgressBarProps, 'value' | 'validationState'>;
|
68
66
|
|
67
|
+
/** @deprecated Use Field with ProgressBar: `<Field><ProgressBar /></Field>` */
|
69
68
|
export declare const ProgressField_unstable: ForwardRefComponent<ProgressFieldProps_unstable>;
|
70
69
|
|
71
|
-
|
70
|
+
/** @deprecated Use Field with ProgressBar: `<Field><ProgressBar /></Field>` */
|
71
|
+
export declare const progressFieldClassNames: {
|
72
|
+
control: string;
|
73
|
+
root: string;
|
74
|
+
label: string;
|
75
|
+
validationMessage: string;
|
76
|
+
validationMessageIcon: string;
|
77
|
+
hint: string;
|
78
|
+
};
|
72
79
|
|
73
|
-
|
80
|
+
/** @deprecated Use Field with ProgressBar: `<Field><ProgressBar /></Field>` */
|
81
|
+
export declare type ProgressFieldProps_unstable = DeprecatedFieldProps<ProgressBarProps>;
|
74
82
|
|
75
83
|
/**
|
76
84
|
* Render the final JSX of ProgressBar
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"file":"ProgressBar.types.js","sourceRoot":"../src/","sources":["packages/react-components/react-progress/src/components/ProgressBar/ProgressBar.types.ts"],"names":[],"mappings":"","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' | '
|
1
|
+
{"version":3,"file":"ProgressBar.types.js","sourceRoot":"../src/","sources":["packages/react-components/react-progress/src/components/ProgressBar/ProgressBar.types.ts"],"names":[],"mappings":"","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 */\n validationState?: 'success' | 'warning' | 'error';\n};\n\n/**\n * State used in rendering ProgressBar\n */\nexport type ProgressBarState = ComponentState<ProgressBarSlots> &\n Required<Pick<ProgressBarProps, 'max' | 'shape' | 'thickness'>> &\n Pick<ProgressBarProps, 'value' | 'validationState'>;\n"]}
|
@@ -48,7 +48,7 @@ const useRootStyles = /*#__PURE__*/__styles({
|
|
48
48
|
B7oj6ja: ["f1jar5jt", "fyu767a"],
|
49
49
|
Btl43ni: ["fyu767a", "f1jar5jt"]
|
50
50
|
},
|
51
|
-
|
51
|
+
square: {
|
52
52
|
Bbmb7ep: ["fzi6hpg", "fyowgf4"],
|
53
53
|
Beyfa6y: ["fyowgf4", "fzi6hpg"],
|
54
54
|
B7oj6ja: ["f3fg2lr", "f13av6d4"],
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"mappings":"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","names":["mergeClasses","shorthands","tokens","useFluent_unstable","useFluent","progressBarClassNames","root","bar","ZERO_THRESHOLD","barThicknessValues","medium","large","indeterminateProgressBar","left","indeterminateProgressBarRTL","right","useRootStyles","useBarStyles","useProgressBarStyles_unstable","state","max","shape","thickness","validationState","value","rootStyles","barStyles","dir","className","base","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: '0% /* @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
|
1
|
+
{"version":3,"mappings":"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","names":["mergeClasses","shorthands","tokens","useFluent_unstable","useFluent","progressBarClassNames","root","bar","ZERO_THRESHOLD","barThicknessValues","medium","large","indeterminateProgressBar","left","indeterminateProgressBarRTL","right","useRootStyles","useBarStyles","useProgressBarStyles_unstable","state","max","shape","thickness","validationState","value","rootStyles","barStyles","dir","className","base","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: '0% /* @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 backgroundColor: tokens.colorCompoundBrandBackground,\n\n '@media screen and (forced-colors: active)': {\n backgroundColor: 'Highlight',\n },\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 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 { max, shape, thickness, validationState, 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 value === undefined && barStyles.indeterminate,\n value === undefined && dir === 'rtl' && barStyles.rtl,\n barStyles[thickness],\n value !== undefined && value > ZERO_THRESHOLD && barStyles.nonZeroDeterminate,\n validationState && barStyles[validationState],\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"]}
|
@@ -1,17 +1,17 @@
|
|
1
|
-
|
2
|
-
import {
|
3
|
-
import { ProgressBar } from '../../ProgressBar';
|
4
|
-
|
5
|
-
export const
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
1
|
+
/* eslint-disable deprecation/deprecation */
|
2
|
+
import { getDeprecatedFieldClassNames, makeDeprecatedField } from '@fluentui/react-field';
|
3
|
+
import { ProgressBar, progressBarClassNames } from '../../ProgressBar';
|
4
|
+
/** @deprecated Use Field with ProgressBar: `<Field><ProgressBar /></Field>` */
|
5
|
+
export const progressFieldClassNames = /*#__PURE__*/getDeprecatedFieldClassNames(progressBarClassNames.root);
|
6
|
+
/** @deprecated Use Field with ProgressBar: `<Field><ProgressBar /></Field>` */
|
7
|
+
export const ProgressField = /*#__PURE__*/makeDeprecatedField(ProgressBar, {
|
8
|
+
displayName: 'ProgressField',
|
9
|
+
mapProps: props => ({
|
10
|
+
...props,
|
11
|
+
control: {
|
12
|
+
...props.control,
|
13
|
+
validationState: props.validationState
|
14
|
+
}
|
15
|
+
})
|
15
16
|
});
|
16
|
-
ProgressField.displayName = 'ProgressField';
|
17
17
|
//# sourceMappingURL=ProgressField.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"mappings":"AAAA
|
1
|
+
{"version":3,"mappings":"AAAA;AACA,SAA+BA,4BAA4B,EAAEC,mBAAmB,QAAQ,uBAAuB;AAE/G,SAASC,WAAW,EAAEC,qBAAqB,QAA0B,mBAAmB;AAIxF;AACA,OAAO,MAAMC,uBAAuB,gBAAGJ,4BAA4B,CAACG,qBAAqB,CAACE,IAAI,CAAC;AAC/F;AACA,OAAO,MAAMC,aAAa,gBAA4CL,mBAAmB,CAACC,WAAW,EAAE;EACrGK,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":["getDeprecatedFieldClassNames","makeDeprecatedField","ProgressBar","progressBarClassNames","progressFieldClassNames","root","ProgressField","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"]}
|
package/lib/index.js
CHANGED
@@ -1,3 +1,4 @@
|
|
1
1
|
export { ProgressBar, progressBarClassNames, renderProgressBar_unstable, useProgressBar_unstable, useProgressBarStyles_unstable } from './ProgressBar';
|
2
|
+
// eslint-disable-next-line deprecation/deprecation
|
2
3
|
export { ProgressField as ProgressField_unstable, progressFieldClassNames } from './ProgressField';
|
3
4
|
//# sourceMappingURL=index.js.map
|
package/lib/index.js.map
CHANGED
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"mappings":"AAAA,SACEA,WAAW,EACXC,qBAAqB,EACrBC,0BAA0B,EAC1BC,uBAAuB,EACvBC,6BAA6B,QACxB,eAAe;AAGtB,SAASC,aAAa,IAAIC,sBAAsB,EAAEC,uBAAuB,QAAQ,iBAAiB","names":["ProgressBar","progressBarClassNames","renderProgressBar_unstable","useProgressBar_unstable","useProgressBarStyles_unstable","ProgressField","ProgressField_unstable","progressFieldClassNames"],"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\nexport { ProgressField as ProgressField_unstable, progressFieldClassNames } from './ProgressField';\nexport type { ProgressFieldProps as ProgressFieldProps_unstable } from './ProgressField';\n"]}
|
1
|
+
{"version":3,"mappings":"AAAA,SACEA,WAAW,EACXC,qBAAqB,EACrBC,0BAA0B,EAC1BC,uBAAuB,EACvBC,6BAA6B,QACxB,eAAe;AAGtB;AACA,SAASC,aAAa,IAAIC,sBAAsB,EAAEC,uBAAuB,QAAQ,iBAAiB","names":["ProgressBar","progressBarClassNames","renderProgressBar_unstable","useProgressBar_unstable","useProgressBarStyles_unstable","ProgressField","ProgressField_unstable","progressFieldClassNames"],"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"]}
|
@@ -54,7 +54,7 @@ const useRootStyles = /*#__PURE__*/react_1.__styles({
|
|
54
54
|
B7oj6ja: ["f1jar5jt", "fyu767a"],
|
55
55
|
Btl43ni: ["fyu767a", "f1jar5jt"]
|
56
56
|
},
|
57
|
-
|
57
|
+
square: {
|
58
58
|
Bbmb7ep: ["fzi6hpg", "fyowgf4"],
|
59
59
|
Beyfa6y: ["fyowgf4", "fzi6hpg"],
|
60
60
|
B7oj6ja: ["f3fg2lr", "f13av6d4"],
|
@@ -1 +1 @@
|
|
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","max","shape","thickness","validationState","value","rootStyles","barStyles","dir","react_shared_contexts_1","className","base","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: '0% /* @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
|
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","max","shape","thickness","validationState","value","rootStyles","barStyles","dir","react_shared_contexts_1","className","base","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: '0% /* @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 backgroundColor: tokens.colorCompoundBrandBackground,\n\n '@media screen and (forced-colors: active)': {\n backgroundColor: 'Highlight',\n },\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 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 { max, shape, thickness, validationState, 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 value === undefined && barStyles.indeterminate,\n value === undefined && dir === 'rtl' && barStyles.rtl,\n barStyles[thickness],\n value !== undefined && value > ZERO_THRESHOLD && barStyles.nonZeroDeterminate,\n validationState && barStyles[validationState],\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,20 +4,20 @@ Object.defineProperty(exports, "__esModule", {
|
|
4
4
|
value: true
|
5
5
|
});
|
6
6
|
exports.ProgressField = exports.progressFieldClassNames = void 0;
|
7
|
-
|
7
|
+
/* eslint-disable deprecation/deprecation */
|
8
8
|
const react_field_1 = /*#__PURE__*/require("@fluentui/react-field");
|
9
9
|
const ProgressBar_1 = /*#__PURE__*/require("../../ProgressBar");
|
10
|
-
|
11
|
-
exports.
|
12
|
-
|
13
|
-
|
14
|
-
|
15
|
-
|
16
|
-
|
17
|
-
|
18
|
-
|
19
|
-
|
20
|
-
|
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
|
+
})
|
21
22
|
});
|
22
|
-
exports.ProgressField.displayName = 'ProgressField';
|
23
23
|
//# sourceMappingURL=ProgressField.js.map
|
@@ -1 +1 @@
|
|
1
|
-
{"version":3,"mappings":";;;;;;AAAA;AAEA;
|
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"]}
|
package/lib-commonjs/index.js
CHANGED
@@ -35,6 +35,7 @@ Object.defineProperty(exports, "useProgressBarStyles_unstable", {
|
|
35
35
|
return ProgressBar_1.useProgressBarStyles_unstable;
|
36
36
|
}
|
37
37
|
});
|
38
|
+
// eslint-disable-next-line deprecation/deprecation
|
38
39
|
var ProgressField_1 = /*#__PURE__*/require("./ProgressField");
|
39
40
|
Object.defineProperty(exports, "ProgressField_unstable", {
|
40
41
|
enumerable: true,
|
@@ -1 +1 @@
|
|
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;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\nexport { ProgressField as ProgressField_unstable, progressFieldClassNames } from './ProgressField';\nexport type { ProgressFieldProps as ProgressFieldProps_unstable } from './ProgressField';\n"]}
|
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-alpha.
|
3
|
+
"version": "9.0.0-alpha.14",
|
4
4
|
"description": "Progress component for FluentUI v9",
|
5
5
|
"main": "lib-commonjs/index.js",
|
6
6
|
"module": "lib/index.js",
|
@@ -32,10 +32,10 @@
|
|
32
32
|
"@fluentui/scripts-tasks": "*"
|
33
33
|
},
|
34
34
|
"dependencies": {
|
35
|
-
"@fluentui/react-field": "9.0.0-alpha.
|
36
|
-
"@fluentui/react-shared-contexts": "^9.
|
35
|
+
"@fluentui/react-field": "9.0.0-alpha.17",
|
36
|
+
"@fluentui/react-shared-contexts": "^9.2.0",
|
37
37
|
"@fluentui/react-theme": "^9.1.5",
|
38
|
-
"@fluentui/react-utilities": "^9.
|
38
|
+
"@fluentui/react-utilities": "^9.5.0",
|
39
39
|
"@griffel/react": "^1.5.2",
|
40
40
|
"tslib": "^2.1.0"
|
41
41
|
},
|