@availity/mui-page-header 1.1.5 → 2.0.0-alpha.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,25 @@
2
2
 
3
3
  This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
4
4
 
5
+ ## [2.0.0-alpha.0](https://github.com/Availity/element/compare/@availity/mui-page-header@1.1.6...@availity/mui-page-header@2.0.0-alpha.0) (2025-02-24)
6
+
7
+
8
+ ### ⚠ BREAKING CHANGES
9
+
10
+ * upgraded to @mui/material v6
11
+ * **element:** upgraded to @mui/material v6
12
+
13
+ ### Features
14
+
15
+ * **element:** upgrade to @mui/material v6 ([cb958bb](https://github.com/Availity/element/commit/cb958bba99a4f1ee6dab323f0ff54b69e6fd3493))
16
+ * upgrade @mui/material ([571453a](https://github.com/Availity/element/commit/571453a34b21c344594ab4c03bc497d19aba942b))
17
+ * upgrade to MUI v6 ([7febd6f](https://github.com/Availity/element/commit/7febd6fd4fd58e87e1c97a832cea3b4595a35d58))
18
+
19
+ ## [1.1.6](https://github.com/Availity/element/compare/@availity/mui-page-header@1.1.5...@availity/mui-page-header@1.1.6) (2025-02-24)
20
+
21
+ ### Dependency Updates
22
+
23
+ * `mui-spaces` updated to version `1.1.5`
5
24
  ## [1.1.5](https://github.com/Availity/element/compare/@availity/mui-page-header@1.1.4...@availity/mui-page-header@1.1.5) (2025-02-20)
6
25
 
7
26
  ### Dependency Updates
package/dist/index.js CHANGED
@@ -57,11 +57,11 @@ 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 src_exports = {};
61
- __export(src_exports, {
60
+ var index_exports = {};
61
+ __export(index_exports, {
62
62
  PageHeader: () => PageHeader
63
63
  });
64
- module.exports = __toCommonJS(src_exports);
64
+ module.exports = __toCommonJS(index_exports);
65
65
 
66
66
  // src/lib/PageHeader.tsx
67
67
  var import_mui_divider = require("@availity/mui-divider");
@@ -93,8 +93,7 @@ var Logo = (props) => {
93
93
  Loader: ({ id }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Skeleton.default, { id, height: "60px", width: "234px" })
94
94
  }
95
95
  );
96
- else
97
- return null;
96
+ else return null;
98
97
  };
99
98
  var PageHeader = ({
100
99
  breadcrumbs,
@@ -110,12 +109,14 @@ var PageHeader = ({
110
109
  component: import_mui_layout.Box,
111
110
  container: true,
112
111
  direction: "column",
113
- marginTop: "1rem",
114
- marginBottom: "1.25rem",
115
- paddingLeft: 3,
116
- paddingRight: 3,
112
+ sx: {
113
+ marginTop: "1rem",
114
+ marginBottom: "1.25rem",
115
+ paddingLeft: 3,
116
+ paddingRight: 3
117
+ },
117
118
  children: [
118
- breadcrumbs || logo || help ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_mui_layout.Grid, { direction: "row", container: true, justifyContent: "space-between", marginBottom: 4, children: [
119
+ breadcrumbs || logo || help ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_mui_layout.Grid, { direction: "row", container: true, sx: { justifyContent: "space-between", marginBottom: 4 }, children: [
119
120
  breadcrumbs && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_layout.Grid, { marginRight: 2, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_breadcrumbs.Breadcrumbs, __spreadValues({}, breadcrumbs)) }),
120
121
  (logo || help) && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_mui_layout.Grid, { children: [
121
122
  help && /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_mui_typography.Typography, { variant: "body1", children: [
@@ -128,14 +129,14 @@ var PageHeader = ({
128
129
  logo && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_layout.Grid, { container: true, justifyContent: "end", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Logo, __spreadValues({}, logo)) })
129
130
  ] })
130
131
  ] }) : null,
131
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_mui_layout.Grid, { direction: "row", container: true, marginBottom: 2, alignItems: "center", justifyContent: "space-between", children: [
132
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_mui_layout.Grid, { direction: "row", container: true, sx: { marginBottom: 2, alignItems: "center", justifyContent: "space-between" }, children: [
132
133
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_layout.Grid, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_typography.Typography, { variant: "h1", children: headerText }) }),
133
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_mui_layout.Grid, { container: true, width: "auto", children: [
134
+ /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_mui_layout.Grid, { container: true, sx: { width: "auto" }, children: [
134
135
  buttons && buttons.length > 0 && (buttons == null ? void 0 : buttons.map((_a) => {
135
136
  var _b = _a, { key } = _b, buttonProps = __objRest(_b, ["key"]);
136
137
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_layout.Grid, { marginLeft: 2, height: "100%", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_button.Button, __spreadProps(__spreadValues({}, buttonProps), { size: "large", color: "secondary" })) }, key);
137
138
  })),
138
- feedback ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_layout.Grid, { marginLeft: 2, height: "100%", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_feedback.Feedback, { appName: headerText }) }) : null
139
+ feedback ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_layout.Grid, { sx: { marginLeft: 2, height: "100%" }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_feedback.Feedback, { appName: headerText }) }) : null
139
140
  ] })
140
141
  ] }),
141
142
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_divider.Divider, {})
package/dist/index.mjs CHANGED
@@ -60,8 +60,7 @@ var Logo = (props) => {
60
60
  Loader: ({ id }) => /* @__PURE__ */ jsx(Skeleton, { id, height: "60px", width: "234px" })
61
61
  }
62
62
  );
63
- else
64
- return null;
63
+ else return null;
65
64
  };
66
65
  var PageHeader = ({
67
66
  breadcrumbs,
@@ -77,12 +76,14 @@ var PageHeader = ({
77
76
  component: Box,
78
77
  container: true,
79
78
  direction: "column",
80
- marginTop: "1rem",
81
- marginBottom: "1.25rem",
82
- paddingLeft: 3,
83
- paddingRight: 3,
79
+ sx: {
80
+ marginTop: "1rem",
81
+ marginBottom: "1.25rem",
82
+ paddingLeft: 3,
83
+ paddingRight: 3
84
+ },
84
85
  children: [
85
- breadcrumbs || logo || help ? /* @__PURE__ */ jsxs(Grid, { direction: "row", container: true, justifyContent: "space-between", marginBottom: 4, children: [
86
+ breadcrumbs || logo || help ? /* @__PURE__ */ jsxs(Grid, { direction: "row", container: true, sx: { justifyContent: "space-between", marginBottom: 4 }, children: [
86
87
  breadcrumbs && /* @__PURE__ */ jsx(Grid, { marginRight: 2, children: /* @__PURE__ */ jsx(Breadcrumbs, __spreadValues({}, breadcrumbs)) }),
87
88
  (logo || help) && /* @__PURE__ */ jsxs(Grid, { children: [
88
89
  help && /* @__PURE__ */ jsxs(Typography, { variant: "body1", children: [
@@ -95,14 +96,14 @@ var PageHeader = ({
95
96
  logo && /* @__PURE__ */ jsx(Grid, { container: true, justifyContent: "end", children: /* @__PURE__ */ jsx(Logo, __spreadValues({}, logo)) })
96
97
  ] })
97
98
  ] }) : null,
98
- /* @__PURE__ */ jsxs(Grid, { direction: "row", container: true, marginBottom: 2, alignItems: "center", justifyContent: "space-between", children: [
99
+ /* @__PURE__ */ jsxs(Grid, { direction: "row", container: true, sx: { marginBottom: 2, alignItems: "center", justifyContent: "space-between" }, children: [
99
100
  /* @__PURE__ */ jsx(Grid, { children: /* @__PURE__ */ jsx(Typography, { variant: "h1", children: headerText }) }),
100
- /* @__PURE__ */ jsxs(Grid, { container: true, width: "auto", children: [
101
+ /* @__PURE__ */ jsxs(Grid, { container: true, sx: { width: "auto" }, children: [
101
102
  buttons && buttons.length > 0 && (buttons == null ? void 0 : buttons.map((_a) => {
102
103
  var _b = _a, { key } = _b, buttonProps = __objRest(_b, ["key"]);
103
104
  return /* @__PURE__ */ jsx(Grid, { marginLeft: 2, height: "100%", children: /* @__PURE__ */ jsx(Button, __spreadProps(__spreadValues({}, buttonProps), { size: "large", color: "secondary" })) }, key);
104
105
  })),
105
- feedback ? /* @__PURE__ */ jsx(Grid, { marginLeft: 2, height: "100%", children: /* @__PURE__ */ jsx(Feedback, { appName: headerText }) }) : null
106
+ feedback ? /* @__PURE__ */ jsx(Grid, { sx: { marginLeft: 2, height: "100%" }, children: /* @__PURE__ */ jsx(Feedback, { appName: headerText }) }) : null
106
107
  ] })
107
108
  ] }),
108
109
  /* @__PURE__ */ jsx(Divider, {})
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@availity/mui-page-header",
3
- "version": "1.1.5",
3
+ "version": "2.0.0-alpha.0",
4
4
  "description": "Availity MUI PageHeader Component - part of the @availity/element design system",
5
5
  "keywords": [
6
6
  "react",
@@ -40,35 +40,35 @@
40
40
  "publish:canary": "yarn npm publish --access public --tag canary"
41
41
  },
42
42
  "devDependencies": {
43
- "@availity/mui-breadcrumbs": "^0.4.0",
44
- "@availity/mui-button": "^0.7.0",
45
- "@availity/mui-divider": "^0.5.0",
46
- "@availity/mui-layout": "^0.3.0",
47
- "@availity/mui-link": "^0.5.0",
48
- "@availity/mui-typography": "^0.3.0",
49
- "@mui/material": "^5.15.15",
43
+ "@availity/mui-breadcrumbs": "^1.0.0-alpha.0",
44
+ "@availity/mui-button": "^1.0.0-alpha.0",
45
+ "@availity/mui-divider": "^1.0.0-alpha.0",
46
+ "@availity/mui-layout": "^1.0.0-alpha.0",
47
+ "@availity/mui-link": "^1.0.0-alpha.0",
48
+ "@availity/mui-typography": "^1.0.0-alpha.0",
49
+ "@mui/material": "^6.4.5",
50
50
  "@tanstack/react-query": "^4.36.1",
51
51
  "react": "18.2.0",
52
52
  "react-dom": "18.2.0",
53
53
  "react-image": "^4.1.0",
54
- "tsup": "^8.0.2",
54
+ "tsup": "^8.3.6",
55
55
  "typescript": "^5.4.5"
56
56
  },
57
57
  "peerDependencies": {
58
- "@availity/mui-breadcrumbs": "^0.4.0",
59
- "@availity/mui-button": "^0.7.0",
60
- "@availity/mui-divider": "^0.5.0",
61
- "@availity/mui-layout": "^0.3.0",
62
- "@availity/mui-link": "^0.5.0",
63
- "@availity/mui-spaces": "^0.7.5",
64
- "@availity/mui-typography": "^0.3.0",
65
- "@mui/material": "^5.11.9",
58
+ "@availity/mui-breadcrumbs": "^1.0.0-alpha.0",
59
+ "@availity/mui-button": "^1.0.0-alpha.0",
60
+ "@availity/mui-divider": "^1.0.0-alpha.0",
61
+ "@availity/mui-layout": "^1.0.0-alpha.0",
62
+ "@availity/mui-link": "^1.0.0-alpha.0",
63
+ "@availity/mui-spaces": "^1.0.0-alpha.0",
64
+ "@availity/mui-typography": "^1.0.0-alpha.0",
65
+ "@mui/material": "^6.4.5",
66
66
  "react": ">=16.3.0"
67
67
  },
68
68
  "publishConfig": {
69
69
  "access": "public"
70
70
  },
71
71
  "dependencies": {
72
- "@availity/mui-feedback": "^0.4.1"
72
+ "@availity/mui-feedback": "^1.0.0-alpha.0"
73
73
  }
74
74
  }
@@ -86,13 +86,15 @@ export const PageHeader = ({
86
86
  component={Box}
87
87
  container
88
88
  direction="column"
89
- marginTop="1rem"
90
- marginBottom="1.25rem"
91
- paddingLeft={3}
92
- paddingRight={3}
89
+ sx={{
90
+ marginTop: '1rem',
91
+ marginBottom: '1.25rem',
92
+ paddingLeft: 3,
93
+ paddingRight: 3,
94
+ }}
93
95
  >
94
96
  {breadcrumbs || logo || help ? (
95
- <Grid direction="row" container justifyContent="space-between" marginBottom={4}>
97
+ <Grid direction="row" container sx={{ justifyContent: 'space-between', marginBottom: 4 }}>
96
98
  {breadcrumbs && (
97
99
  <Grid marginRight={2}>
98
100
  <Breadcrumbs {...breadcrumbs} />
@@ -119,11 +121,11 @@ export const PageHeader = ({
119
121
  </Grid>
120
122
  ) : null}
121
123
 
122
- <Grid direction="row" container marginBottom={2} alignItems="center" justifyContent="space-between">
124
+ <Grid direction="row" container sx={{ marginBottom: 2, alignItems: 'center', justifyContent: 'space-between' }}>
123
125
  <Grid>
124
126
  <Typography variant="h1" children={headerText} />
125
127
  </Grid>
126
- <Grid container width="auto">
128
+ <Grid container sx={{ width: 'auto' }}>
127
129
  {buttons &&
128
130
  buttons.length > 0 &&
129
131
  buttons?.map(({ key, ...buttonProps }) => (
@@ -132,7 +134,7 @@ export const PageHeader = ({
132
134
  </Grid>
133
135
  ))}
134
136
  {feedback ? (
135
- <Grid marginLeft={2} height="100%">
137
+ <Grid sx={{ marginLeft: 2, height: '100%' }}>
136
138
  <Feedback appName={headerText} />
137
139
  </Grid>
138
140
  ) : null}
File without changes