@availity/mui-breadcrumbs 0.2.14 → 0.3.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.
Files changed (8) hide show
  1. package/CHANGELOG.md +7 -0
  2. package/dist/index.d.mts +6 -1
  3. package/dist/index.d.ts +6 -1
  4. package/dist/index.js +7 -5
  5. package/dist/index.mjs +7 -5
  6. package/package.json +1 -1
  7. package/src/lib/Breadcrumbs.stories.tsx +12 -0
  8. package/src/lib/Breadcrumbs.tsx +9 -4
package/CHANGELOG.md CHANGED
@@ -2,6 +2,13 @@
2
2
 
3
3
  This file was generated using [@jscutlery/semver](https://github.com/jscutlery/semver).
4
4
 
5
+ ## [0.3.0](https://github.com/Availity/element/compare/@availity/mui-breadcrumbs@0.2.14...@availity/mui-breadcrumbs@0.3.0) (2024-12-11)
6
+
7
+
8
+ ### Features
9
+
10
+ * **mui-breadcrumbs:** add LinkProps prop to pass props to the links ([ae54fc4](https://github.com/Availity/element/commit/ae54fc41cc0511f22d7abc5e24a62ab19e3e06b6))
11
+
5
12
  ## [0.2.14](https://github.com/Availity/element/compare/@availity/mui-breadcrumbs@0.2.13...@availity/mui-breadcrumbs@0.2.14) (2024-12-09)
6
13
 
7
14
  ### Dependency Updates
package/dist/index.d.mts CHANGED
@@ -1,4 +1,5 @@
1
1
  import { BreadcrumbsProps as BreadcrumbsProps$1 } from '@mui/material/Breadcrumbs';
2
+ import { LinkProps } from '@availity/mui-link';
2
3
 
3
4
  interface Crumb {
4
5
  /** The name of the ancestor page. */
@@ -9,6 +10,8 @@ interface Crumb {
9
10
  * @default _top
10
11
  */
11
12
  target?: string;
13
+ /** Props passed to the Links */
14
+ LinkProps?: Omit<LinkProps, 'href'>;
12
15
  }
13
16
  interface BreadcrumbsProps extends Omit<BreadcrumbsProps$1, 'separator' | 'slotProps' | 'slots'> {
14
17
  /** The name of the active page (the page the user is currently on). */
@@ -28,7 +31,9 @@ interface BreadcrumbsProps extends Omit<BreadcrumbsProps$1, 'separator' | 'slotP
28
31
  /** A string value that can be used to name an element
29
32
  * @default breadcrumbs */
30
33
  'aria-label'?: string;
34
+ /** Props passed to the Links */
35
+ LinkProps?: Omit<LinkProps, 'href'>;
31
36
  }
32
- declare const Breadcrumbs: ({ active, children, crumbs, emptyState, homeUrl, ...rest }: BreadcrumbsProps) => JSX.Element;
37
+ declare const Breadcrumbs: ({ active, children, crumbs, emptyState, homeUrl, LinkProps, ...rest }: BreadcrumbsProps) => JSX.Element;
33
38
 
34
39
  export { Breadcrumbs, type BreadcrumbsProps };
package/dist/index.d.ts CHANGED
@@ -1,4 +1,5 @@
1
1
  import { BreadcrumbsProps as BreadcrumbsProps$1 } from '@mui/material/Breadcrumbs';
2
+ import { LinkProps } from '@availity/mui-link';
2
3
 
3
4
  interface Crumb {
4
5
  /** The name of the ancestor page. */
@@ -9,6 +10,8 @@ interface Crumb {
9
10
  * @default _top
10
11
  */
11
12
  target?: string;
13
+ /** Props passed to the Links */
14
+ LinkProps?: Omit<LinkProps, 'href'>;
12
15
  }
13
16
  interface BreadcrumbsProps extends Omit<BreadcrumbsProps$1, 'separator' | 'slotProps' | 'slots'> {
14
17
  /** The name of the active page (the page the user is currently on). */
@@ -28,7 +31,9 @@ interface BreadcrumbsProps extends Omit<BreadcrumbsProps$1, 'separator' | 'slotP
28
31
  /** A string value that can be used to name an element
29
32
  * @default breadcrumbs */
30
33
  'aria-label'?: string;
34
+ /** Props passed to the Links */
35
+ LinkProps?: Omit<LinkProps, 'href'>;
31
36
  }
32
- declare const Breadcrumbs: ({ active, children, crumbs, emptyState, homeUrl, ...rest }: BreadcrumbsProps) => JSX.Element;
37
+ declare const Breadcrumbs: ({ active, children, crumbs, emptyState, homeUrl, LinkProps, ...rest }: BreadcrumbsProps) => JSX.Element;
33
38
 
34
39
  export { Breadcrumbs, type BreadcrumbsProps };
package/dist/index.js CHANGED
@@ -69,12 +69,12 @@ var import_Typography = __toESM(require("@mui/material/Typography"));
69
69
  var import_mui_icon = require("@availity/mui-icon");
70
70
  var import_mui_link = require("@availity/mui-link");
71
71
  var import_jsx_runtime = require("react/jsx-runtime");
72
- var Breadcrumb = ({ name, url, target = "_top" }) => {
72
+ var Breadcrumb = ({ name, url, target = "_top", LinkProps: LinkProps2 }) => {
73
73
  const props = {
74
74
  "aria-label": name,
75
75
  children: name
76
76
  };
77
- return url ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_link.Link, __spreadProps(__spreadValues({}, props), { href: url, target })) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Typography.default, __spreadValues({}, props));
77
+ return url ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_link.Link, __spreadProps(__spreadValues(__spreadValues({}, props), LinkProps2), { href: url, target })) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Typography.default, __spreadValues({}, props));
78
78
  };
79
79
  var Breadcrumbs = (_a) => {
80
80
  var _b = _a, {
@@ -82,13 +82,15 @@ var Breadcrumbs = (_a) => {
82
82
  children,
83
83
  crumbs,
84
84
  emptyState = "...",
85
- homeUrl = "/public/apps/dashboard"
85
+ homeUrl = "/public/apps/dashboard",
86
+ LinkProps: LinkProps2
86
87
  } = _b, rest = __objRest(_b, [
87
88
  "active",
88
89
  "children",
89
90
  "crumbs",
90
91
  "emptyState",
91
- "homeUrl"
92
+ "homeUrl",
93
+ "LinkProps"
92
94
  ]);
93
95
  return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
94
96
  import_Breadcrumbs.default,
@@ -99,7 +101,7 @@ var Breadcrumbs = (_a) => {
99
101
  "aria-label": rest["aria-label"] || "breadcrumbs",
100
102
  children: [
101
103
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_mui_link.Link, { "aria-label": "Home", href: homeUrl, loadApp: false, children: "Home" }),
102
- crumbs && crumbs.length > 0 && crumbs.map(({ name = emptyState, url, target }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Breadcrumb, { name, url, target }, name)),
104
+ crumbs && crumbs.length > 0 && crumbs.map(({ name = emptyState, url, target }) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Breadcrumb, { name, url, target, LinkProps: LinkProps2 }, name)),
103
105
  children,
104
106
  /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Typography.default, { children: active || emptyState })
105
107
  ]
package/dist/index.mjs CHANGED
@@ -36,12 +36,12 @@ import Typography from "@mui/material/Typography";
36
36
  import { NavigateNextIcon, MoreHorizontalIcon } from "@availity/mui-icon";
37
37
  import { Link } from "@availity/mui-link";
38
38
  import { jsx, jsxs } from "react/jsx-runtime";
39
- var Breadcrumb = ({ name, url, target = "_top" }) => {
39
+ var Breadcrumb = ({ name, url, target = "_top", LinkProps: LinkProps2 }) => {
40
40
  const props = {
41
41
  "aria-label": name,
42
42
  children: name
43
43
  };
44
- return url ? /* @__PURE__ */ jsx(Link, __spreadProps(__spreadValues({}, props), { href: url, target })) : /* @__PURE__ */ jsx(Typography, __spreadValues({}, props));
44
+ return url ? /* @__PURE__ */ jsx(Link, __spreadProps(__spreadValues(__spreadValues({}, props), LinkProps2), { href: url, target })) : /* @__PURE__ */ jsx(Typography, __spreadValues({}, props));
45
45
  };
46
46
  var Breadcrumbs = (_a) => {
47
47
  var _b = _a, {
@@ -49,13 +49,15 @@ var Breadcrumbs = (_a) => {
49
49
  children,
50
50
  crumbs,
51
51
  emptyState = "...",
52
- homeUrl = "/public/apps/dashboard"
52
+ homeUrl = "/public/apps/dashboard",
53
+ LinkProps: LinkProps2
53
54
  } = _b, rest = __objRest(_b, [
54
55
  "active",
55
56
  "children",
56
57
  "crumbs",
57
58
  "emptyState",
58
- "homeUrl"
59
+ "homeUrl",
60
+ "LinkProps"
59
61
  ]);
60
62
  return /* @__PURE__ */ jsxs(
61
63
  MuiBreadcrumbs,
@@ -66,7 +68,7 @@ var Breadcrumbs = (_a) => {
66
68
  "aria-label": rest["aria-label"] || "breadcrumbs",
67
69
  children: [
68
70
  /* @__PURE__ */ jsx(Link, { "aria-label": "Home", href: homeUrl, loadApp: false, children: "Home" }),
69
- crumbs && crumbs.length > 0 && crumbs.map(({ name = emptyState, url, target }) => /* @__PURE__ */ jsx(Breadcrumb, { name, url, target }, name)),
71
+ crumbs && crumbs.length > 0 && crumbs.map(({ name = emptyState, url, target }) => /* @__PURE__ */ jsx(Breadcrumb, { name, url, target, LinkProps: LinkProps2 }, name)),
70
72
  children,
71
73
  /* @__PURE__ */ jsx(Typography, { children: active || emptyState })
72
74
  ]
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@availity/mui-breadcrumbs",
3
- "version": "0.2.14",
3
+ "version": "0.3.0",
4
4
  "description": "Availity MUI Breadcrumbs Component - part of the @availity/element design system",
5
5
  "keywords": [
6
6
  "react",
package/src/lib/Breadcrumbs.stories.tsx CHANGED
@@ -21,6 +21,18 @@ export const _Breadcrumbs: StoryObj<typeof Breadcrumbs> = {
21
21
  },
22
22
  };
23
23
 
24
+ export const _BreadcrumbsLinkProps: StoryObj<typeof Breadcrumbs> = {
25
+ render: (args: BreadcrumbsProps) => <Breadcrumbs {...args} />,
26
+ args: {
27
+ active: 'Current Page',
28
+ 'aria-label': 'test-breadcrumbs',
29
+ crumbs: [{ name: 'Previous Page', url: '/previous-page' }],
30
+ LinkProps: {
31
+ loadApp: false,
32
+ },
33
+ },
34
+ };
35
+
24
36
  export const _BreadcrumbsChildren: StoryObj<typeof Breadcrumbs> = {
25
37
  render: (args: BreadcrumbsProps) => (
26
38
  <Breadcrumbs {...args}>
package/src/lib/Breadcrumbs.tsx CHANGED
@@ -1,7 +1,7 @@
1
1
  import { default as MuiBreadcrumbs, BreadcrumbsProps as MuiBreadcrumbsProps } from '@mui/material/Breadcrumbs';
2
2
  import Typography from '@mui/material/Typography';
3
3
  import { NavigateNextIcon, MoreHorizontalIcon } from '@availity/mui-icon';
4
- import { Link } from '@availity/mui-link';
4
+ import { Link, LinkProps } from '@availity/mui-link';
5
5
 
6
6
  interface Crumb {
7
7
  /** The name of the ancestor page. */
@@ -12,6 +12,8 @@ interface Crumb {
12
12
  * @default _top
13
13
  */
14
14
  target?: string;
15
+ /** Props passed to the Links */
16
+ LinkProps?: Omit<LinkProps, 'href'>;
15
17
  }
16
18
 
17
19
  export interface BreadcrumbsProps extends Omit<MuiBreadcrumbsProps, 'separator' | 'slotProps' | 'slots'> {
@@ -32,15 +34,17 @@ export interface BreadcrumbsProps extends Omit<MuiBreadcrumbsProps, 'separator'
32
34
  /** A string value that can be used to name an element
33
35
  * @default breadcrumbs */
34
36
  'aria-label'?: string;
37
+ /** Props passed to the Links */
38
+ LinkProps?: Omit<LinkProps, 'href'>;
35
39
  }
36
40
 
37
- const Breadcrumb = ({ name, url, target = '_top' }: Crumb) => {
41
+ const Breadcrumb = ({ name, url, target = '_top', LinkProps }: Crumb) => {
38
42
  const props = {
39
43
  'aria-label': name,
40
44
  children: name,
41
45
  };
42
46
 
43
- return url ? <Link {...props} href={url} target={target} /> : <Typography {...props} />;
47
+ return url ? <Link {...props} {...LinkProps} href={url} target={target} /> : <Typography {...props} />;
44
48
  };
45
49
 
46
50
  export const Breadcrumbs = ({
@@ -49,6 +53,7 @@ export const Breadcrumbs = ({
49
53
  crumbs,
50
54
  emptyState = '...',
51
55
  homeUrl = '/public/apps/dashboard',
56
+ LinkProps,
52
57
  ...rest
53
58
  }: BreadcrumbsProps): JSX.Element => {
54
59
  return (
@@ -65,7 +70,7 @@ export const Breadcrumbs = ({
65
70
  {crumbs &&
66
71
  crumbs.length > 0 &&
67
72
  crumbs.map(({ name = emptyState, url, target }) => (
68
- <Breadcrumb name={name} url={url} target={target} key={name} />
73
+ <Breadcrumb name={name} url={url} target={target} key={name} LinkProps={LinkProps} />
69
74
  ))}
70
75
  {children}
71
76
  <Typography>{active || emptyState}</Typography>