@availity/mui-progress 0.5.1 → 1.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.md
CHANGED
|
@@ -2,6 +2,36 @@
|
|
|
2
2
|
|
|
3
3
|
This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
|
|
4
4
|
|
|
5
|
+
## [1.0.0](https://github.com/Availity/element/compare/@availity/mui-progress@1.0.0-alpha.0...@availity/mui-progress@1.0.0) (2025-02-25)
|
|
6
|
+
|
|
7
|
+
### Dependency Updates
|
|
8
|
+
|
|
9
|
+
* `mui-icon` updated to version `0.5.1`
|
|
10
|
+
* `mui-typography` updated to version `0.5.1`
|
|
11
|
+
* `mui-layout` updated to version `0.5.1`
|
|
12
|
+
|
|
13
|
+
### ⚠ BREAKING CHANGES
|
|
14
|
+
|
|
15
|
+
* upgrade to @mui/material v6
|
|
16
|
+
|
|
17
|
+
### Miscellaneous Chores
|
|
18
|
+
|
|
19
|
+
* element v1 release ([a6e3567](https://github.com/Availity/element/commit/a6e35671185b9f13d25c7a39c4488ecb8774633e))
|
|
20
|
+
|
|
21
|
+
## [1.0.0-alpha.0](https://github.com/Availity/element/compare/@availity/mui-progress@0.5.1...@availity/mui-progress@1.0.0-alpha.0) (2025-02-24)
|
|
22
|
+
|
|
23
|
+
|
|
24
|
+
### ⚠ BREAKING CHANGES
|
|
25
|
+
|
|
26
|
+
* upgraded to @mui/material v6
|
|
27
|
+
* **element:** upgraded to @mui/material v6
|
|
28
|
+
|
|
29
|
+
### Features
|
|
30
|
+
|
|
31
|
+
* **element:** upgrade to @mui/material v6 ([cb958bb](https://github.com/Availity/element/commit/cb958bba99a4f1ee6dab323f0ff54b69e6fd3493))
|
|
32
|
+
* upgrade @mui/material ([571453a](https://github.com/Availity/element/commit/571453a34b21c344594ab4c03bc497d19aba942b))
|
|
33
|
+
* upgrade to MUI v6 ([7febd6f](https://github.com/Availity/element/commit/7febd6fd4fd58e87e1c97a832cea3b4595a35d58))
|
|
34
|
+
|
|
5
35
|
## [0.5.1](https://github.com/Availity/element/compare/@availity/mui-progress@0.5.0...@availity/mui-progress@0.5.1) (2025-02-19)
|
|
6
36
|
|
|
7
37
|
|
package/dist/index.js
CHANGED
|
@@ -57,12 +57,12 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
|
|
|
57
57
|
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
58
58
|
|
|
59
59
|
// src/index.ts
|
|
60
|
-
var
|
|
61
|
-
__export(
|
|
60
|
+
var index_exports = {};
|
|
61
|
+
__export(index_exports, {
|
|
62
62
|
CircularProgress: () => CircularProgress,
|
|
63
63
|
LinearProgress: () => LinearProgress
|
|
64
64
|
});
|
|
65
|
-
module.exports = __toCommonJS(
|
|
65
|
+
module.exports = __toCommonJS(index_exports);
|
|
66
66
|
|
|
67
67
|
// src/lib/CircularProgress.tsx
|
|
68
68
|
var import_react = require("react");
|
|
@@ -109,7 +109,7 @@ var CircularProgress = (_a) => {
|
|
|
109
109
|
setStatus("loading");
|
|
110
110
|
}
|
|
111
111
|
}, [error, success]);
|
|
112
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_Stack.default, { width: "fit-content", alignItems: "center", children: [
|
|
112
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_Stack.default, { sx: { width: "fit-content", alignItems: "center" }, children: [
|
|
113
113
|
status === "loading" ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
114
114
|
import_CircularProgress.default,
|
|
115
115
|
__spreadProps(__spreadValues({
|
|
@@ -119,7 +119,7 @@ var CircularProgress = (_a) => {
|
|
|
119
119
|
variant: "indeterminate"
|
|
120
120
|
})
|
|
121
121
|
) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StatusIcon, { status, size }),
|
|
122
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_typography.Typography, { marginTop: "8px", variant: "caption", children: loadingCaption || error || success ? getCaptionText(status) : null })
|
|
122
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_typography.Typography, { sx: { marginTop: "8px" }, variant: "caption", children: loadingCaption || error || success ? getCaptionText(status) : null })
|
|
123
123
|
] });
|
|
124
124
|
};
|
|
125
125
|
|
|
@@ -139,7 +139,7 @@ var import_Container = __toESM(require("@mui/material/Container"));
|
|
|
139
139
|
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
140
140
|
|
|
141
141
|
// ../layout/src/lib/Grid.tsx
|
|
142
|
-
var
|
|
142
|
+
var import_Grid2 = __toESM(require("@mui/material/Grid2"));
|
|
143
143
|
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
144
144
|
|
|
145
145
|
// ../layout/src/lib/Stack.tsx
|
|
@@ -156,7 +156,7 @@ var import_LinearProgress = __toESM(require("@mui/material/LinearProgress"));
|
|
|
156
156
|
var import_jsx_runtime6 = require("react/jsx-runtime");
|
|
157
157
|
var LinearProgress = (_a) => {
|
|
158
158
|
var _b = _a, { variant = "determinate", value = 0, sx, hidePercentage = false } = _b, props = __objRest(_b, ["variant", "value", "sx", "hidePercentage"]);
|
|
159
|
-
return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(Stack2, { direction: "row", alignItems: "center", children: [
|
|
159
|
+
return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(Stack2, { direction: "row", sx: { alignItems: "center" }, children: [
|
|
160
160
|
/* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Box, { sx: { width: "100%", mr: 0.5 }, children: /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_LinearProgress.default, __spreadProps(__spreadValues({ variant }, props), { value, color: "success", sx: __spreadValues({ width: "100%" }, sx) })) }),
|
|
161
161
|
value === 100 && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_mui_icon2.SuccessCircleIcon, { color: "success", "data-icon": "complete" }),
|
|
162
162
|
!hidePercentage && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(import_mui_typography2.Typography, { variant: "body2", sx: { color: "text.secondary", ml: 1 }, children: `${Math.round(value)}%` })
|
package/dist/index.mjs
CHANGED
|
@@ -77,7 +77,7 @@ var CircularProgress = (_a) => {
|
|
|
77
77
|
setStatus("loading");
|
|
78
78
|
}
|
|
79
79
|
}, [error, success]);
|
|
80
|
-
return /* @__PURE__ */ jsxs(Stack, { width: "fit-content", alignItems: "center", children: [
|
|
80
|
+
return /* @__PURE__ */ jsxs(Stack, { sx: { width: "fit-content", alignItems: "center" }, children: [
|
|
81
81
|
status === "loading" ? /* @__PURE__ */ jsx(
|
|
82
82
|
MuiCircularProgress,
|
|
83
83
|
__spreadProps(__spreadValues({
|
|
@@ -87,7 +87,7 @@ var CircularProgress = (_a) => {
|
|
|
87
87
|
variant: "indeterminate"
|
|
88
88
|
})
|
|
89
89
|
) : /* @__PURE__ */ jsx(StatusIcon, { status, size }),
|
|
90
|
-
/* @__PURE__ */ jsx(Typography, { marginTop: "8px", variant: "caption", children: loadingCaption || error || success ? getCaptionText(status) : null })
|
|
90
|
+
/* @__PURE__ */ jsx(Typography, { sx: { marginTop: "8px" }, variant: "caption", children: loadingCaption || error || success ? getCaptionText(status) : null })
|
|
91
91
|
] });
|
|
92
92
|
};
|
|
93
93
|
|
|
@@ -107,7 +107,7 @@ import MuiContainer from "@mui/material/Container";
|
|
|
107
107
|
import { jsx as jsx3 } from "react/jsx-runtime";
|
|
108
108
|
|
|
109
109
|
// ../layout/src/lib/Grid.tsx
|
|
110
|
-
import MuiGrid2 from "@mui/material/
|
|
110
|
+
import MuiGrid2 from "@mui/material/Grid2";
|
|
111
111
|
import { jsx as jsx4 } from "react/jsx-runtime";
|
|
112
112
|
|
|
113
113
|
// ../layout/src/lib/Stack.tsx
|
|
@@ -124,7 +124,7 @@ import MuiLinearProgress from "@mui/material/LinearProgress";
|
|
|
124
124
|
import { jsx as jsx6, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
125
125
|
var LinearProgress = (_a) => {
|
|
126
126
|
var _b = _a, { variant = "determinate", value = 0, sx, hidePercentage = false } = _b, props = __objRest(_b, ["variant", "value", "sx", "hidePercentage"]);
|
|
127
|
-
return /* @__PURE__ */ jsxs2(Stack2, { direction: "row", alignItems: "center", children: [
|
|
127
|
+
return /* @__PURE__ */ jsxs2(Stack2, { direction: "row", sx: { alignItems: "center" }, children: [
|
|
128
128
|
/* @__PURE__ */ jsx6(Box, { sx: { width: "100%", mr: 0.5 }, children: /* @__PURE__ */ jsx6(MuiLinearProgress, __spreadProps(__spreadValues({ variant }, props), { value, color: "success", sx: __spreadValues({ width: "100%" }, sx) })) }),
|
|
129
129
|
value === 100 && /* @__PURE__ */ jsx6(SuccessCircleIcon2, { color: "success", "data-icon": "complete" }),
|
|
130
130
|
!hidePercentage && /* @__PURE__ */ jsx6(Typography2, { variant: "body2", sx: { color: "text.secondary", ml: 1 }, children: `${Math.round(value)}%` })
|
|
@@ -1,7 +1,10 @@
|
|
|
1
1
|
import { Markdown } from '@storybook/blocks';
|
|
2
2
|
import { Meta } from '@storybook/addon-docs';
|
|
3
3
|
import ReadMe from './README.md?raw';
|
|
4
|
+
import CHANGELOG from './CHANGELOG.md?raw';
|
|
4
5
|
|
|
5
6
|
<Meta title="Components/Progress/Introduction" />
|
|
6
7
|
|
|
7
8
|
<Markdown>{ReadMe}</Markdown>
|
|
9
|
+
|
|
10
|
+
<Markdown>{CHANGELOG}</Markdown>
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@availity/mui-progress",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "1.0.0",
|
|
4
4
|
"description": "Availity MUI Progress Component - part of the @availity/element design system",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"react",
|
|
@@ -40,21 +40,21 @@
|
|
|
40
40
|
"publish:canary": "yarn npm publish --access public --tag canary"
|
|
41
41
|
},
|
|
42
42
|
"devDependencies": {
|
|
43
|
-
"@mui/material": "^
|
|
43
|
+
"@mui/material": "^6.4.5",
|
|
44
44
|
"react": "18.2.0",
|
|
45
45
|
"react-dom": "18.2.0",
|
|
46
|
-
"tsup": "^8.
|
|
46
|
+
"tsup": "^8.3.6",
|
|
47
47
|
"typescript": "^5.4.5"
|
|
48
48
|
},
|
|
49
49
|
"peerDependencies": {
|
|
50
|
-
"@mui/material": "^
|
|
50
|
+
"@mui/material": "^6.4.5",
|
|
51
51
|
"react": ">=16.3.0"
|
|
52
52
|
},
|
|
53
53
|
"publishConfig": {
|
|
54
54
|
"access": "public"
|
|
55
55
|
},
|
|
56
56
|
"dependencies": {
|
|
57
|
-
"@availity/mui-icon": "^0.
|
|
58
|
-
"@availity/mui-typography": "^0.
|
|
57
|
+
"@availity/mui-icon": "^1.0.0",
|
|
58
|
+
"@availity/mui-typography": "^1.0.0"
|
|
59
59
|
}
|
|
60
60
|
}
|
|
@@ -52,7 +52,7 @@ const getCaptionText = (status: string) =>
|
|
|
52
52
|
loading: 'Loading',
|
|
53
53
|
error: 'Loading error',
|
|
54
54
|
success: 'Loading successful',
|
|
55
|
-
}[status] || ''
|
|
55
|
+
})[status] || '';
|
|
56
56
|
|
|
57
57
|
export const CircularProgress = ({
|
|
58
58
|
loadingCaption = true,
|
|
@@ -74,7 +74,7 @@ export const CircularProgress = ({
|
|
|
74
74
|
}, [error, success]);
|
|
75
75
|
|
|
76
76
|
return (
|
|
77
|
-
<Stack width
|
|
77
|
+
<Stack sx={{ width: 'fit-content', alignItems: 'center' }}>
|
|
78
78
|
{status === 'loading' ? (
|
|
79
79
|
<MuiCircularProgress
|
|
80
80
|
aria-label="Loading"
|
|
@@ -85,7 +85,7 @@ export const CircularProgress = ({
|
|
|
85
85
|
) : (
|
|
86
86
|
<StatusIcon status={status} size={size} />
|
|
87
87
|
)}
|
|
88
|
-
<Typography marginTop
|
|
88
|
+
<Typography sx={{ marginTop: '8px' }} variant="caption">
|
|
89
89
|
{loadingCaption || error || success ? getCaptionText(status) : null}
|
|
90
90
|
</Typography>
|
|
91
91
|
</Stack>
|
|
@@ -7,7 +7,7 @@ export type LinearProgressProps = Omit<MuiLinearProgressProps, 'color'> & { hide
|
|
|
7
7
|
|
|
8
8
|
export const LinearProgress = ({ variant = 'determinate', value = 0, sx, hidePercentage = false, ...props }: LinearProgressProps) => {
|
|
9
9
|
return (
|
|
10
|
-
<Stack direction="row" alignItems
|
|
10
|
+
<Stack direction="row" sx={{ alignItems: 'center' }}>
|
|
11
11
|
<Box sx={{ width: '100%', mr: 0.5 }}>
|
|
12
12
|
<MuiLinearProgress variant={variant} {...props} value={value} color="success" sx={{ width: '100%', ...sx }} />
|
|
13
13
|
</Box>
|