@aseguragonzalez/ui 1.2.0 → 1.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.
@@ -1 +1 @@
1
- const e=require("../shared/ItemLink.cjs"),t=require("./Navbar.module.css.cjs");let n=require("react"),r=require("react/jsx-runtime");var i=()=>(0,r.jsx)(`svg`,{width:`20`,height:`20`,viewBox:`0 0 20 20`,fill:`currentColor`,"aria-hidden":`true`,children:(0,r.jsx)(`path`,{fillRule:`evenodd`,d:`M2 4.75A.75.75 0 0 1 2.75 4h14.5a.75.75 0 0 1 0 1.5H2.75A.75.75 0 0 1 2 4.75ZM2 10a.75.75 0 0 1 .75-.75h14.5a.75.75 0 0 1 0 1.5H2.75A.75.75 0 0 1 2 10Zm0 5.25a.75.75 0 0 1 .75-.75h14.5a.75.75 0 0 1 0 1.5H2.75a.75.75 0 0 1-.75-.75Z`,clipRule:`evenodd`})}),a=()=>(0,r.jsx)(`svg`,{width:`20`,height:`20`,viewBox:`0 0 20 20`,fill:`currentColor`,"aria-hidden":`true`,children:(0,r.jsx)(`path`,{d:`M6.28 5.22a.75.75 0 0 0-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 1 0 1.06 1.06L10 11.06l3.72 3.72a.75.75 0 1 0 1.06-1.06L11.06 10l3.72-3.72a.75.75 0 0 0-1.06-1.06L10 8.94 6.28 5.22Z`})}),o=(0,n.forwardRef)(({brand:o,items:s=[],actions:c,sticky:l=!1,"aria-label":u=`Main navigation`,linkComponent:d,defaultMobileOpen:f=!1,isMobileOpen:p,onMobileOpenChange:m,className:h},g)=>{let[_,v]=(0,n.useState)(f),y=p??_,b=(0,n.useId)(),x=()=>{let e=!y;p===void 0&&v(e),m?.(e)},S=()=>{p===void 0&&v(!1),m?.(!1)},C=[t.default.navbar,l?t.default.sticky:``,h??``].filter(Boolean).join(` `);return(0,r.jsxs)(`header`,{ref:g,className:C,children:[(0,r.jsxs)(`div`,{className:t.default.inner,children:[o&&(0,r.jsx)(`div`,{className:t.default.brand,children:o}),s.length>0&&(0,r.jsx)(`nav`,{className:t.default.nav,"aria-label":u,children:(0,r.jsx)(`ul`,{className:t.default.navList,children:s.map(n=>(0,r.jsx)(`li`,{className:t.default.navItem,children:(0,r.jsx)(e.ItemLink,{linkComponent:d,href:n.href,onClick:n.onClick,className:[t.default.navLink,n.isActive?t.default.navLinkActive:``].filter(Boolean).join(` `),"aria-current":n.isActive?`page`:void 0,children:n.label})},n.key))})}),c&&(0,r.jsx)(`div`,{className:t.default.actions,children:c}),(0,r.jsx)(`button`,{type:`button`,className:t.default.menuButton,onClick:x,"aria-expanded":y,"aria-controls":b,"aria-label":y?`Close menu`:`Open menu`,children:y?(0,r.jsx)(a,{}):(0,r.jsx)(i,{})})]}),(0,r.jsx)(`div`,{id:b,className:[t.default.mobileMenu,y?t.default.mobileMenuOpen:``].filter(Boolean).join(` `),children:(0,r.jsx)(`nav`,{"aria-label":`${u} — menu`,children:(0,r.jsx)(`ul`,{className:t.default.mobileNavList,children:s.map(n=>(0,r.jsx)(`li`,{className:t.default.mobileNavItem,children:(0,r.jsx)(e.ItemLink,{linkComponent:d,href:n.href,onClick:()=>{n.onClick?.(),S()},className:[t.default.mobileNavLink,n.isActive?t.default.mobileNavLinkActive:``].filter(Boolean).join(` `),"aria-current":n.isActive?`page`:void 0,children:n.label})},n.key))})})})]})});o.displayName=`Navbar`,exports.Navbar=o;
1
+ const e=require("../shared/ItemLink.cjs"),t=require("./Navbar.module.css.cjs");let n=require("react"),r=require("react/jsx-runtime");var i=()=>(0,r.jsx)(`svg`,{width:`20`,height:`20`,viewBox:`0 0 20 20`,fill:`currentColor`,"aria-hidden":`true`,children:(0,r.jsx)(`path`,{fillRule:`evenodd`,d:`M2 4.75A.75.75 0 0 1 2.75 4h14.5a.75.75 0 0 1 0 1.5H2.75A.75.75 0 0 1 2 4.75ZM2 10a.75.75 0 0 1 .75-.75h14.5a.75.75 0 0 1 0 1.5H2.75A.75.75 0 0 1 2 10Zm0 5.25a.75.75 0 0 1 .75-.75h14.5a.75.75 0 0 1 0 1.5H2.75a.75.75 0 0 1-.75-.75Z`,clipRule:`evenodd`})}),a=()=>(0,r.jsx)(`svg`,{width:`20`,height:`20`,viewBox:`0 0 20 20`,fill:`currentColor`,"aria-hidden":`true`,children:(0,r.jsx)(`path`,{d:`M6.28 5.22a.75.75 0 0 0-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 1 0 1.06 1.06L10 11.06l3.72 3.72a.75.75 0 1 0 1.06-1.06L11.06 10l3.72-3.72a.75.75 0 0 0-1.06-1.06L10 8.94 6.28 5.22Z`})}),o=(0,n.forwardRef)(({brand:o,items:s=[],actions:c,sticky:l=!1,"aria-label":u=`Main navigation`,linkComponent:d,openMenuLabel:f=`Open menu`,closeMenuLabel:p=`Close menu`,menuLabel:m,defaultMobileOpen:h=!1,isMobileOpen:g,onMobileOpenChange:_,className:v},y)=>{let[b,x]=(0,n.useState)(h),S=g??b,C=(0,n.useId)(),w=()=>{let e=!S;g===void 0&&x(e),_?.(e)},T=()=>{g===void 0&&x(!1),_?.(!1)},E=[t.default.navbar,l?t.default.sticky:``,v??``].filter(Boolean).join(` `);return(0,r.jsxs)(`header`,{ref:y,className:E,children:[(0,r.jsxs)(`div`,{className:t.default.inner,children:[o&&(0,r.jsx)(`div`,{className:t.default.brand,children:o}),s.length>0&&(0,r.jsx)(`nav`,{className:t.default.nav,"aria-label":u,children:(0,r.jsx)(`ul`,{className:t.default.navList,children:s.map(n=>(0,r.jsx)(`li`,{className:t.default.navItem,children:(0,r.jsx)(e.ItemLink,{linkComponent:d,href:n.href,onClick:n.onClick,className:[t.default.navLink,n.isActive?t.default.navLinkActive:``].filter(Boolean).join(` `),"aria-current":n.isActive?`page`:void 0,children:n.label})},n.key))})}),c&&(0,r.jsx)(`div`,{className:t.default.actions,children:c}),(0,r.jsx)(`button`,{type:`button`,className:t.default.menuButton,onClick:w,"aria-expanded":S,"aria-controls":C,"aria-label":S?p:f,children:S?(0,r.jsx)(a,{}):(0,r.jsx)(i,{})})]}),(0,r.jsx)(`div`,{id:C,className:[t.default.mobileMenu,S?t.default.mobileMenuOpen:``].filter(Boolean).join(` `),children:(0,r.jsx)(`nav`,{"aria-label":m??`${u} — menu`,children:(0,r.jsx)(`ul`,{className:t.default.mobileNavList,children:s.map(n=>(0,r.jsx)(`li`,{className:t.default.mobileNavItem,children:(0,r.jsx)(e.ItemLink,{linkComponent:d,href:n.href,onClick:()=>{n.onClick?.(),T()},className:[t.default.mobileNavLink,n.isActive?t.default.mobileNavLinkActive:``].filter(Boolean).join(` `),"aria-current":n.isActive?`page`:void 0,children:n.label})},n.key))})})})]})});o.displayName=`Navbar`,exports.Navbar=o;
@@ -17,6 +17,12 @@ export interface NavbarProps {
17
17
  * router's link, so navigation happens without a full page load. Defaults to `<a>`.
18
18
  */
19
19
  linkComponent?: LinkComponent;
20
+ /** Accessible name of the mobile menu button while closed. Default: `'Open menu'`. */
21
+ openMenuLabel?: string;
22
+ /** Accessible name of the mobile menu button while open. Default: `'Close menu'`. */
23
+ closeMenuLabel?: string;
24
+ /** Accessible name of the mobile menu's navigation landmark. Default: `` `${aria-label} — menu` ``. */
25
+ menuLabel?: string;
20
26
  defaultMobileOpen?: boolean;
21
27
  isMobileOpen?: boolean;
22
28
  onMobileOpenChange?: (open: boolean) => void;
@@ -21,20 +21,20 @@ var s = () => /* @__PURE__ */ a("svg", {
21
21
  fill: "currentColor",
22
22
  "aria-hidden": "true",
23
23
  children: /* @__PURE__ */ a("path", { d: "M6.28 5.22a.75.75 0 0 0-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 1 0 1.06 1.06L10 11.06l3.72 3.72a.75.75 0 1 0 1.06-1.06L11.06 10l3.72-3.72a.75.75 0 0 0-1.06-1.06L10 8.94 6.28 5.22Z" })
24
- }), l = n(({ brand: n, items: l = [], actions: u, sticky: d = !1, "aria-label": f = "Main navigation", linkComponent: p, defaultMobileOpen: m = !1, isMobileOpen: h, onMobileOpenChange: g, className: _ }, v) => {
25
- let [y, b] = i(m), x = h ?? y, S = r(), C = () => {
26
- let e = !x;
27
- h === void 0 && b(e), g?.(e);
28
- }, w = () => {
29
- h === void 0 && b(!1), g?.(!1);
30
- }, T = [
24
+ }), l = n(({ brand: n, items: l = [], actions: u, sticky: d = !1, "aria-label": f = "Main navigation", linkComponent: p, openMenuLabel: m = "Open menu", closeMenuLabel: h = "Close menu", menuLabel: g, defaultMobileOpen: _ = !1, isMobileOpen: v, onMobileOpenChange: y, className: b }, x) => {
25
+ let [S, C] = i(_), w = v ?? S, T = r(), E = () => {
26
+ let e = !w;
27
+ v === void 0 && C(e), y?.(e);
28
+ }, D = () => {
29
+ v === void 0 && C(!1), y?.(!1);
30
+ }, O = [
31
31
  t.navbar,
32
32
  d ? t.sticky : "",
33
- _ ?? ""
33
+ b ?? ""
34
34
  ].filter(Boolean).join(" ");
35
35
  return /* @__PURE__ */ o("header", {
36
- ref: v,
37
- className: T,
36
+ ref: x,
37
+ className: O,
38
38
  children: [/* @__PURE__ */ o("div", {
39
39
  className: t.inner,
40
40
  children: [
@@ -67,18 +67,18 @@ var s = () => /* @__PURE__ */ a("svg", {
67
67
  /* @__PURE__ */ a("button", {
68
68
  type: "button",
69
69
  className: t.menuButton,
70
- onClick: C,
71
- "aria-expanded": x,
72
- "aria-controls": S,
73
- "aria-label": x ? "Close menu" : "Open menu",
74
- children: a(x ? c : s, {})
70
+ onClick: E,
71
+ "aria-expanded": w,
72
+ "aria-controls": T,
73
+ "aria-label": w ? h : m,
74
+ children: a(w ? c : s, {})
75
75
  })
76
76
  ]
77
77
  }), /* @__PURE__ */ a("div", {
78
- id: S,
79
- className: [t.mobileMenu, x ? t.mobileMenuOpen : ""].filter(Boolean).join(" "),
78
+ id: T,
79
+ className: [t.mobileMenu, w ? t.mobileMenuOpen : ""].filter(Boolean).join(" "),
80
80
  children: /* @__PURE__ */ a("nav", {
81
- "aria-label": `${f} — menu`,
81
+ "aria-label": g ?? `${f} — menu`,
82
82
  children: /* @__PURE__ */ a("ul", {
83
83
  className: t.mobileNavList,
84
84
  children: l.map((n) => /* @__PURE__ */ a("li", {
@@ -87,7 +87,7 @@ var s = () => /* @__PURE__ */ a("svg", {
87
87
  linkComponent: p,
88
88
  href: n.href,
89
89
  onClick: () => {
90
- n.onClick?.(), w();
90
+ n.onClick?.(), D();
91
91
  },
92
92
  className: [t.mobileNavLink, n.isActive ? t.mobileNavLinkActive : ""].filter(Boolean).join(" "),
93
93
  "aria-current": n.isActive ? "page" : void 0,
@@ -1 +1 @@
1
- const e=require("../shared/ItemLink.cjs"),t=require("./Sidebar.module.css.cjs");let n=require("react"),r=require("react/jsx-runtime"),i=require("react-dom");var a=`a[href], button:not([disabled]), input:not([disabled]), [tabindex]:not([tabindex="-1"])`,o=()=>(0,r.jsx)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 16 16`,fill:`none`,"aria-hidden":`true`,children:(0,r.jsx)(`path`,{d:`M10 4L6 8L10 12`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`,strokeLinejoin:`round`})}),s=()=>(0,r.jsx)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 16 16`,fill:`none`,"aria-hidden":`true`,children:(0,r.jsx)(`path`,{d:`M6 4L10 8L6 12`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`,strokeLinejoin:`round`})}),c=()=>(0,r.jsx)(`svg`,{width:`20`,height:`20`,viewBox:`0 0 20 20`,fill:`currentColor`,"aria-hidden":`true`,children:(0,r.jsx)(`path`,{d:`M6.28 5.22a.75.75 0 0 0-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 1 0 1.06 1.06L10 11.06l3.72 3.72a.75.75 0 1 0 1.06-1.06L11.06 10l3.72-3.72a.75.75 0 0 0-1.06-1.06L10 8.94 6.28 5.22Z`})}),l=(0,n.forwardRef)(({items:l,logo:u,header:d,footer:f,"aria-label":p=`Sidebar navigation`,linkComponent:m,defaultCollapsed:h=!1,isCollapsed:g,onCollapsedChange:_,defaultMobileOpen:v=!1,isMobileOpen:y,onMobileOpenChange:b,className:x},S)=>{let[C,w]=(0,n.useState)(h),T=g??C,[E,D]=(0,n.useState)(v),O=y??E,[k]=(0,n.useState)(()=>typeof document<`u`),A=(0,n.useRef)(null),j=(0,n.useRef)(null);(0,n.useEffect)(()=>{if(window.matchMedia?.(`(max-width: 767px)`)?.matches??!1)return O?(j.current=document.activeElement,document.body.style.overflow=`hidden`,(A.current?.querySelector(a))?.focus()):(document.body.style.overflow=``,j.current?.focus(),j.current=null),()=>{document.body.style.overflow=``}},[O]);let M=(0,n.useCallback)(()=>{let e=!T;g===void 0&&w(e),_?.(e)},[T,g,_]),N=(0,n.useCallback)(()=>{y===void 0&&D(!1),b?.(!1)},[y,b]),P=(0,n.useCallback)(e=>{e.key===`Escape`&&N()},[N]),F=[t.default.sidebar,T?t.default.collapsed:``,O?t.default.mobileOpen:``,x??``].filter(Boolean).join(` `);return(0,r.jsxs)(`aside`,{ref:S,className:F,children:[k&&O&&(0,i.createPortal)((0,r.jsx)(`div`,{className:t.default.backdrop,onClick:N,"aria-hidden":`true`}),document.body),(0,r.jsxs)(`div`,{ref:A,className:t.default.panel,onKeyDown:P,tabIndex:-1,children:[(u||d)&&(0,r.jsxs)(`div`,{className:t.default.panelTop,children:[(0,r.jsxs)(`div`,{className:t.default.logoRow,children:[u&&(0,r.jsx)(`div`,{className:t.default.logoSlot,children:u}),d&&(0,r.jsx)(`div`,{className:t.default.headerContent,children:d})]}),(0,r.jsx)(`button`,{type:`button`,className:t.default.mobileCloseButton,onClick:N,"aria-label":`Close sidebar`,children:(0,r.jsx)(c,{})})]}),!u&&!d&&(0,r.jsx)(`div`,{className:t.default.mobileCloseRow,children:(0,r.jsx)(`button`,{type:`button`,className:t.default.mobileCloseButton,onClick:N,"aria-label":`Close sidebar`,children:(0,r.jsx)(c,{})})}),(0,r.jsx)(`nav`,{"aria-label":p,className:t.default.nav,children:(0,r.jsx)(`ul`,{className:t.default.navList,tabIndex:0,children:l.map(n=>(0,r.jsx)(`li`,{className:t.default.navItem,children:(0,r.jsxs)(e.ItemLink,{linkComponent:m,href:n.href,onClick:()=>{n.onClick?.(),O&&N()},className:[t.default.navLink,n.isActive?t.default.navLinkActive:``].filter(Boolean).join(` `),"aria-current":n.isActive?`page`:void 0,"aria-label":n.icon&&T?n.label:void 0,title:n.icon&&T?n.label:void 0,children:[n.icon&&(0,r.jsx)(`span`,{className:t.default.navLinkIcon,"aria-hidden":`true`,children:n.icon}),(0,r.jsx)(`span`,{className:t.default.navLinkLabel,children:n.label})]})},n.key))})}),f&&(0,r.jsx)(`div`,{className:t.default.footer,children:f}),(0,r.jsx)(`button`,{type:`button`,className:t.default.collapseButton,onClick:M,"aria-label":T?`Expand sidebar`:`Collapse sidebar`,"aria-expanded":!T,children:T?(0,r.jsx)(s,{}):(0,r.jsx)(o,{})})]})]})});l.displayName=`Sidebar`,exports.Sidebar=l;
1
+ const e=require("../shared/ItemLink.cjs"),t=require("./Sidebar.module.css.cjs");let n=require("react"),r=require("react/jsx-runtime"),i=require("react-dom");var a=`a[href], button:not([disabled]), input:not([disabled]), [tabindex]:not([tabindex="-1"])`,o=()=>(0,r.jsx)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 16 16`,fill:`none`,"aria-hidden":`true`,children:(0,r.jsx)(`path`,{d:`M10 4L6 8L10 12`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`,strokeLinejoin:`round`})}),s=()=>(0,r.jsx)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 16 16`,fill:`none`,"aria-hidden":`true`,children:(0,r.jsx)(`path`,{d:`M6 4L10 8L6 12`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`,strokeLinejoin:`round`})}),c=()=>(0,r.jsx)(`svg`,{width:`20`,height:`20`,viewBox:`0 0 20 20`,fill:`currentColor`,"aria-hidden":`true`,children:(0,r.jsx)(`path`,{d:`M6.28 5.22a.75.75 0 0 0-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 1 0 1.06 1.06L10 11.06l3.72 3.72a.75.75 0 1 0 1.06-1.06L11.06 10l3.72-3.72a.75.75 0 0 0-1.06-1.06L10 8.94 6.28 5.22Z`})}),l=(0,n.forwardRef)(({items:l,logo:u,header:d,footer:f,"aria-label":p=`Sidebar navigation`,linkComponent:m,closeLabel:h=`Close sidebar`,collapseLabel:g=`Collapse sidebar`,expandLabel:_=`Expand sidebar`,defaultCollapsed:v=!1,isCollapsed:y,onCollapsedChange:b,defaultMobileOpen:x=!1,isMobileOpen:S,onMobileOpenChange:C,className:w},T)=>{let[E,D]=(0,n.useState)(v),O=y??E,[k,A]=(0,n.useState)(x),j=S??k,[M]=(0,n.useState)(()=>typeof document<`u`),N=(0,n.useRef)(null),P=(0,n.useRef)(null);(0,n.useEffect)(()=>{if(window.matchMedia?.(`(max-width: 767px)`)?.matches??!1)return j?(P.current=document.activeElement,document.body.style.overflow=`hidden`,(N.current?.querySelector(a))?.focus()):(document.body.style.overflow=``,P.current?.focus(),P.current=null),()=>{document.body.style.overflow=``}},[j]);let F=(0,n.useCallback)(()=>{let e=!O;y===void 0&&D(e),b?.(e)},[O,y,b]),I=(0,n.useCallback)(()=>{S===void 0&&A(!1),C?.(!1)},[S,C]),L=(0,n.useCallback)(e=>{e.key===`Escape`&&I()},[I]),R=[t.default.sidebar,O?t.default.collapsed:``,j?t.default.mobileOpen:``,w??``].filter(Boolean).join(` `);return(0,r.jsxs)(`aside`,{ref:T,className:R,children:[M&&j&&(0,i.createPortal)((0,r.jsx)(`div`,{className:t.default.backdrop,onClick:I,"aria-hidden":`true`}),document.body),(0,r.jsxs)(`div`,{ref:N,className:t.default.panel,onKeyDown:L,tabIndex:-1,children:[(u||d)&&(0,r.jsxs)(`div`,{className:t.default.panelTop,children:[(0,r.jsxs)(`div`,{className:t.default.logoRow,children:[u&&(0,r.jsx)(`div`,{className:t.default.logoSlot,children:u}),d&&(0,r.jsx)(`div`,{className:t.default.headerContent,children:d})]}),(0,r.jsx)(`button`,{type:`button`,className:t.default.mobileCloseButton,onClick:I,"aria-label":h,children:(0,r.jsx)(c,{})})]}),!u&&!d&&(0,r.jsx)(`div`,{className:t.default.mobileCloseRow,children:(0,r.jsx)(`button`,{type:`button`,className:t.default.mobileCloseButton,onClick:I,"aria-label":h,children:(0,r.jsx)(c,{})})}),(0,r.jsx)(`nav`,{"aria-label":p,className:t.default.nav,children:(0,r.jsx)(`ul`,{className:t.default.navList,tabIndex:0,children:l.map(n=>(0,r.jsx)(`li`,{className:t.default.navItem,children:(0,r.jsxs)(e.ItemLink,{linkComponent:m,href:n.href,onClick:()=>{n.onClick?.(),j&&I()},className:[t.default.navLink,n.isActive?t.default.navLinkActive:``].filter(Boolean).join(` `),"aria-current":n.isActive?`page`:void 0,"aria-label":n.icon&&O?n.label:void 0,title:n.icon&&O?n.label:void 0,children:[n.icon&&(0,r.jsx)(`span`,{className:t.default.navLinkIcon,"aria-hidden":`true`,children:n.icon}),(0,r.jsx)(`span`,{className:t.default.navLinkLabel,children:n.label})]})},n.key))})}),f&&(0,r.jsx)(`div`,{className:t.default.footer,children:f}),(0,r.jsx)(`button`,{type:`button`,className:t.default.collapseButton,onClick:F,"aria-label":O?_:g,"aria-expanded":!O,children:O?(0,r.jsx)(s,{}):(0,r.jsx)(o,{})})]})]})});l.displayName=`Sidebar`,exports.Sidebar=l;
@@ -21,6 +21,12 @@ export interface SidebarProps {
21
21
  * router's link, so navigation happens without a full page load. Defaults to `<a>`.
22
22
  */
23
23
  linkComponent?: LinkComponent;
24
+ /** Accessible name of the mobile drawer's close button. Default: `'Close sidebar'`. */
25
+ closeLabel?: string;
26
+ /** Accessible name of the collapse button while expanded. Default: `'Collapse sidebar'`. */
27
+ collapseLabel?: string;
28
+ /** Accessible name of the collapse button while collapsed. Default: `'Expand sidebar'`. */
29
+ expandLabel?: string;
24
30
  /** Desktop collapse — uncontrolled default */
25
31
  defaultCollapsed?: boolean;
26
32
  /** Desktop collapse — controlled */
@@ -37,41 +37,41 @@ var u = "a[href], button:not([disabled]), input:not([disabled]), [tabindex]:not(
37
37
  fill: "currentColor",
38
38
  "aria-hidden": "true",
39
39
  children: /* @__PURE__ */ s("path", { d: "M6.28 5.22a.75.75 0 0 0-1.06 1.06L8.94 10l-3.72 3.72a.75.75 0 1 0 1.06 1.06L10 11.06l3.72 3.72a.75.75 0 1 0 1.06-1.06L11.06 10l3.72-3.72a.75.75 0 0 0-1.06-1.06L10 8.94 6.28 5.22Z" })
40
- }), m = n(({ items: n, logo: m, header: h, footer: g, "aria-label": _ = "Sidebar navigation", linkComponent: v, defaultCollapsed: y = !1, isCollapsed: b, onCollapsedChange: x, defaultMobileOpen: S = !1, isMobileOpen: C, onMobileOpenChange: w, className: T }, E) => {
41
- let [D, O] = o(y), k = b ?? D, [A, j] = o(S), M = C ?? A, [N] = o(() => typeof document < "u"), P = a(null), F = a(null);
40
+ }), m = n(({ items: n, logo: m, header: h, footer: g, "aria-label": _ = "Sidebar navigation", linkComponent: v, closeLabel: y = "Close sidebar", collapseLabel: b = "Collapse sidebar", expandLabel: x = "Expand sidebar", defaultCollapsed: S = !1, isCollapsed: C, onCollapsedChange: w, defaultMobileOpen: T = !1, isMobileOpen: E, onMobileOpenChange: D, className: O }, k) => {
41
+ let [A, j] = o(S), M = C ?? A, [N, P] = o(T), F = E ?? N, [I] = o(() => typeof document < "u"), L = a(null), R = a(null);
42
42
  i(() => {
43
- if (window.matchMedia?.("(max-width: 767px)")?.matches ?? !1) return M ? (F.current = document.activeElement, document.body.style.overflow = "hidden", (P.current?.querySelector(u))?.focus()) : (document.body.style.overflow = "", F.current?.focus(), F.current = null), () => {
43
+ if (window.matchMedia?.("(max-width: 767px)")?.matches ?? !1) return F ? (R.current = document.activeElement, document.body.style.overflow = "hidden", (L.current?.querySelector(u))?.focus()) : (document.body.style.overflow = "", R.current?.focus(), R.current = null), () => {
44
44
  document.body.style.overflow = "";
45
45
  };
46
- }, [M]);
47
- let I = r(() => {
48
- let e = !k;
49
- b === void 0 && O(e), x?.(e);
46
+ }, [F]);
47
+ let z = r(() => {
48
+ let e = !M;
49
+ C === void 0 && j(e), w?.(e);
50
50
  }, [
51
- k,
52
- b,
53
- x
54
- ]), L = r(() => {
55
- C === void 0 && j(!1), w?.(!1);
56
- }, [C, w]), R = r((e) => {
57
- e.key === "Escape" && L();
58
- }, [L]), z = [
51
+ M,
52
+ C,
53
+ w
54
+ ]), B = r(() => {
55
+ E === void 0 && P(!1), D?.(!1);
56
+ }, [E, D]), V = r((e) => {
57
+ e.key === "Escape" && B();
58
+ }, [B]), H = [
59
59
  t.sidebar,
60
- k ? t.collapsed : "",
61
- M ? t.mobileOpen : "",
62
- T ?? ""
60
+ M ? t.collapsed : "",
61
+ F ? t.mobileOpen : "",
62
+ O ?? ""
63
63
  ].filter(Boolean).join(" ");
64
64
  return /* @__PURE__ */ c("aside", {
65
- ref: E,
66
- className: z,
67
- children: [N && M && l(/* @__PURE__ */ s("div", {
65
+ ref: k,
66
+ className: H,
67
+ children: [I && F && l(/* @__PURE__ */ s("div", {
68
68
  className: t.backdrop,
69
- onClick: L,
69
+ onClick: B,
70
70
  "aria-hidden": "true"
71
71
  }), document.body), /* @__PURE__ */ c("div", {
72
- ref: P,
72
+ ref: L,
73
73
  className: t.panel,
74
- onKeyDown: R,
74
+ onKeyDown: V,
75
75
  tabIndex: -1,
76
76
  children: [
77
77
  (m || h) && /* @__PURE__ */ c("div", {
@@ -88,8 +88,8 @@ var u = "a[href], button:not([disabled]), input:not([disabled]), [tabindex]:not(
88
88
  }), /* @__PURE__ */ s("button", {
89
89
  type: "button",
90
90
  className: t.mobileCloseButton,
91
- onClick: L,
92
- "aria-label": "Close sidebar",
91
+ onClick: B,
92
+ "aria-label": y,
93
93
  children: /* @__PURE__ */ s(p, {})
94
94
  })]
95
95
  }),
@@ -98,8 +98,8 @@ var u = "a[href], button:not([disabled]), input:not([disabled]), [tabindex]:not(
98
98
  children: /* @__PURE__ */ s("button", {
99
99
  type: "button",
100
100
  className: t.mobileCloseButton,
101
- onClick: L,
102
- "aria-label": "Close sidebar",
101
+ onClick: B,
102
+ "aria-label": y,
103
103
  children: /* @__PURE__ */ s(p, {})
104
104
  })
105
105
  }),
@@ -115,12 +115,12 @@ var u = "a[href], button:not([disabled]), input:not([disabled]), [tabindex]:not(
115
115
  linkComponent: v,
116
116
  href: n.href,
117
117
  onClick: () => {
118
- n.onClick?.(), M && L();
118
+ n.onClick?.(), F && B();
119
119
  },
120
120
  className: [t.navLink, n.isActive ? t.navLinkActive : ""].filter(Boolean).join(" "),
121
121
  "aria-current": n.isActive ? "page" : void 0,
122
- "aria-label": n.icon && k ? n.label : void 0,
123
- title: n.icon && k ? n.label : void 0,
122
+ "aria-label": n.icon && M ? n.label : void 0,
123
+ title: n.icon && M ? n.label : void 0,
124
124
  children: [n.icon && /* @__PURE__ */ s("span", {
125
125
  className: t.navLinkIcon,
126
126
  "aria-hidden": "true",
@@ -140,10 +140,10 @@ var u = "a[href], button:not([disabled]), input:not([disabled]), [tabindex]:not(
140
140
  /* @__PURE__ */ s("button", {
141
141
  type: "button",
142
142
  className: t.collapseButton,
143
- onClick: I,
144
- "aria-label": k ? "Expand sidebar" : "Collapse sidebar",
145
- "aria-expanded": !k,
146
- children: s(k ? f : d, {})
143
+ onClick: z,
144
+ "aria-label": M ? x : b,
145
+ "aria-expanded": !M,
146
+ children: s(M ? f : d, {})
147
147
  })
148
148
  ]
149
149
  })]
@@ -1 +1 @@
1
- const e=require("./AuthLayout.module.css.cjs");let t=require("react/jsx-runtime");var n=()=>(0,t.jsxs)(`svg`,{width:`36`,height:`36`,viewBox:`0 0 36 36`,fill:`none`,"aria-hidden":`true`,children:[(0,t.jsx)(`rect`,{width:`36`,height:`36`,rx:`8`,fill:`var(--ds-color-action-primary)`}),(0,t.jsx)(`path`,{d:`M10 12h16M10 18h11M10 24h8`,stroke:`white`,strokeWidth:`2.5`,strokeLinecap:`round`})]});function r({children:r,branding:i,logo:a,brandingLabel:o=`Product branding`,footer:s}){let c=a??(0,t.jsx)(n,{});return(0,t.jsxs)(`div`,{className:[e.default.layout,s?e.default.withFooter:``].filter(Boolean).join(` `),children:[(0,t.jsx)(`aside`,{className:e.default.brandPanel,"aria-label":o,"aria-hidden":`true`,children:(0,t.jsx)(`div`,{className:e.default.brandContent,children:i??(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(`div`,{className:e.default.brandLogo,children:c}),(0,t.jsxs)(`p`,{className:e.default.brandTagline,children:[`Build better products,`,(0,t.jsx)(`br`,{}),`together.`]})]})})}),(0,t.jsx)(`main`,{className:e.default.formPanel,children:(0,t.jsxs)(`div`,{className:e.default.formContent,children:[(0,t.jsx)(`div`,{className:e.default.mobileLogo,"aria-hidden":`true`,children:c}),r]})}),s&&(0,t.jsx)(`footer`,{className:e.default.footer,children:s})]})}r.displayName=`AuthLayout`,exports.AuthLayout=r;
1
+ const e=require("./AuthLayout.module.css.cjs");let t=require("react/jsx-runtime");var n=()=>(0,t.jsxs)(`svg`,{width:`36`,height:`36`,viewBox:`0 0 36 36`,fill:`none`,"aria-hidden":`true`,children:[(0,t.jsx)(`rect`,{width:`36`,height:`36`,rx:`8`,fill:`var(--ds-color-action-primary)`}),(0,t.jsx)(`path`,{d:`M10 12h16M10 18h11M10 24h8`,stroke:`white`,strokeWidth:`2.5`,strokeLinecap:`round`})]});function r({children:r,branding:i,tagline:a,logo:o,brandingLabel:s=`Product branding`,footer:c}){let l=o??(0,t.jsx)(n,{});return(0,t.jsxs)(`div`,{className:[e.default.layout,c?e.default.withFooter:``].filter(Boolean).join(` `),children:[(0,t.jsx)(`aside`,{className:e.default.brandPanel,"aria-label":s,"aria-hidden":`true`,children:(0,t.jsx)(`div`,{className:e.default.brandContent,children:i??(0,t.jsxs)(t.Fragment,{children:[(0,t.jsx)(`div`,{className:e.default.brandLogo,children:l}),(0,t.jsx)(`p`,{className:e.default.brandTagline,children:a??(0,t.jsxs)(t.Fragment,{children:[`Build better products,`,(0,t.jsx)(`br`,{}),`together.`]})})]})})}),(0,t.jsx)(`main`,{className:e.default.formPanel,children:(0,t.jsxs)(`div`,{className:e.default.formContent,children:[(0,t.jsx)(`div`,{className:e.default.mobileLogo,"aria-hidden":`true`,children:l}),r]})}),c&&(0,t.jsx)(`footer`,{className:e.default.footer,children:c})]})}r.displayName=`AuthLayout`,exports.AuthLayout=r;
@@ -2,8 +2,10 @@ import type { ReactNode } from 'react';
2
2
  export interface AuthLayoutProps {
3
3
  /** Form or main content rendered in the right panel. */
4
4
  children: ReactNode;
5
- /** Custom branding content for the left panel. Replaces the default tagline. */
5
+ /** Custom branding content for the left panel. Replaces the default logo and tagline. */
6
6
  branding?: ReactNode;
7
+ /** Tagline shown under the logo in the branding panel. Default: `'Build better products, together.'`. */
8
+ tagline?: ReactNode;
7
9
  /** Logo shown at the top of the form panel on mobile, and inside the branding panel on desktop. */
8
10
  logo?: ReactNode;
9
11
  /** Accessible label for the branding panel (hidden from visual display). */
@@ -14,7 +16,7 @@ export interface AuthLayoutProps {
14
16
  */
15
17
  footer?: ReactNode;
16
18
  }
17
- export declare function AuthLayout({ children, branding, logo, brandingLabel, footer, }: AuthLayoutProps): import("react").JSX.Element;
19
+ export declare function AuthLayout({ children, branding, tagline, logo, brandingLabel, footer, }: AuthLayoutProps): import("react").JSX.Element;
18
20
  export declare namespace AuthLayout {
19
21
  var displayName: string;
20
22
  }
@@ -19,27 +19,27 @@ var i = () => /* @__PURE__ */ r("svg", {
19
19
  strokeLinecap: "round"
20
20
  })]
21
21
  });
22
- function a({ children: a, branding: o, logo: s, brandingLabel: c = "Product branding", footer: l }) {
23
- let u = s ?? /* @__PURE__ */ n(i, {});
22
+ function a({ children: a, branding: o, tagline: s, logo: c, brandingLabel: l = "Product branding", footer: u }) {
23
+ let d = c ?? /* @__PURE__ */ n(i, {});
24
24
  return /* @__PURE__ */ r("div", {
25
- className: [e.layout, l ? e.withFooter : ""].filter(Boolean).join(" "),
25
+ className: [e.layout, u ? e.withFooter : ""].filter(Boolean).join(" "),
26
26
  children: [
27
27
  /* @__PURE__ */ n("aside", {
28
28
  className: e.brandPanel,
29
- "aria-label": c,
29
+ "aria-label": l,
30
30
  "aria-hidden": "true",
31
31
  children: /* @__PURE__ */ n("div", {
32
32
  className: e.brandContent,
33
33
  children: o ?? /* @__PURE__ */ r(t, { children: [/* @__PURE__ */ n("div", {
34
34
  className: e.brandLogo,
35
- children: u
36
- }), /* @__PURE__ */ r("p", {
35
+ children: d
36
+ }), /* @__PURE__ */ n("p", {
37
37
  className: e.brandTagline,
38
- children: [
38
+ children: s ?? /* @__PURE__ */ r(t, { children: [
39
39
  "Build better products,",
40
40
  /* @__PURE__ */ n("br", {}),
41
41
  "together."
42
- ]
42
+ ] })
43
43
  })] })
44
44
  })
45
45
  }),
@@ -50,13 +50,13 @@ function a({ children: a, branding: o, logo: s, brandingLabel: c = "Product bran
50
50
  children: [/* @__PURE__ */ n("div", {
51
51
  className: e.mobileLogo,
52
52
  "aria-hidden": "true",
53
- children: u
53
+ children: d
54
54
  }), a]
55
55
  })
56
56
  }),
57
- l && /* @__PURE__ */ n("footer", {
57
+ u && /* @__PURE__ */ n("footer", {
58
58
  className: e.footer,
59
- children: l
59
+ children: u
60
60
  })
61
61
  ]
62
62
  });
@@ -1 +1 @@
1
- const e=require("./Toast.module.css.cjs");let t=require("react"),n=require("react/jsx-runtime"),r=require("react-dom");var i=(0,t.createContext)(null),a={info:(0,n.jsxs)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 16 16`,fill:`none`,"aria-hidden":`true`,children:[(0,n.jsx)(`circle`,{cx:`8`,cy:`8`,r:`7`,stroke:`currentColor`,strokeWidth:`1.5`}),(0,n.jsx)(`path`,{d:`M8 7v4M8 5v.5`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`})]}),success:(0,n.jsxs)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 16 16`,fill:`none`,"aria-hidden":`true`,children:[(0,n.jsx)(`circle`,{cx:`8`,cy:`8`,r:`7`,stroke:`currentColor`,strokeWidth:`1.5`}),(0,n.jsx)(`path`,{d:`M5 8l2 2 4-4`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`,strokeLinejoin:`round`})]}),error:(0,n.jsxs)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 16 16`,fill:`none`,"aria-hidden":`true`,children:[(0,n.jsx)(`circle`,{cx:`8`,cy:`8`,r:`7`,stroke:`currentColor`,strokeWidth:`1.5`}),(0,n.jsx)(`path`,{d:`M10 6L6 10M6 6l4 4`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`})]}),warning:(0,n.jsxs)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 16 16`,fill:`none`,"aria-hidden":`true`,children:[(0,n.jsx)(`path`,{d:`M8 2L14.9 14H1.1L8 2z`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinejoin:`round`}),(0,n.jsx)(`path`,{d:`M8 6.5v3M8 11v.5`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`})]})};function o({item:t,onDismiss:r,onPause:i,onResume:o}){return(0,n.jsxs)(`div`,{className:[e.default.toast,e.default[t.variant]].join(` `),role:`status`,onMouseEnter:()=>i(t.id),onMouseLeave:()=>o(t.id),onFocus:()=>i(t.id),onBlur:()=>o(t.id),children:[(0,n.jsx)(`span`,{className:e.default.icon,children:a[t.variant]}),(0,n.jsx)(`span`,{className:e.default.message,children:t.message}),(0,n.jsx)(`button`,{type:`button`,"aria-label":`Close notification`,className:e.default.closeButton,onClick:()=>r(t.id),children:(0,n.jsx)(`svg`,{width:`12`,height:`12`,viewBox:`0 0 12 12`,fill:`none`,"aria-hidden":`true`,children:(0,n.jsx)(`path`,{d:`M9 3L3 9M3 3l6 6`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`})})})]})}function s({children:a,maxToasts:s=5}){let[c,l]=(0,t.useState)([]),u=(0,t.useRef)(new Map),d=(0,t.useRef)(new Map),f=(0,t.useRef)(new Map),p=(0,t.useRef)(0),m=(0,t.useCallback)(e=>{let t=u.current.get(e);t!==void 0&&(clearTimeout(t),u.current.delete(e)),d.current.delete(e),f.current.delete(e),l(t=>t.filter(t=>t.id!==e))},[]),h=(0,t.useCallback)((e,t)=>{let n=setTimeout(()=>m(e),t);u.current.set(e,n)},[m]),g=(0,t.useCallback)(e=>{let t=u.current.get(e);t!==void 0&&(clearTimeout(t),u.current.delete(e),d.current.set(e,Date.now()))},[]),_=(0,t.useCallback)(e=>{let t=d.current.get(e);if(t===void 0)return;let n=Date.now()-t,r=Math.max(0,(f.current.get(e)??0)-n);d.current.delete(e),f.current.set(e,r),r>0?h(e,r):m(e)},[m,h]),v=(0,t.useCallback)(e=>{let t=`toast-${++p.current}`,n=e.variant??`info`,r=e.duration??5e3,i={id:t,message:e.message,variant:n,duration:r};return l(e=>{let t=[...e,i];return t.length>s?t.slice(t.length-s):t}),r>0&&(f.current.set(t,r),h(t,r)),t},[s,h]);return(0,n.jsxs)(i.Provider,{value:{show:v,dismiss:m},children:[a,(0,r.createPortal)((0,n.jsx)(`div`,{role:`region`,className:e.default.region,"aria-label":`Notifications`,"aria-live":`polite`,"aria-atomic":`false`,"aria-relevant":`additions text`,children:c.map(e=>(0,n.jsx)(o,{item:e,onDismiss:m,onPause:g,onResume:_},e.id))}),document.body)]})}s.displayName=`ToastProvider`;function c(){let e=(0,t.useContext)(i);if(!e)throw Error(`useToast must be used inside a <ToastProvider>`);return e}exports.ToastProvider=s,exports.useToast=c;
1
+ const e=require("./Toast.module.css.cjs");let t=require("react"),n=require("react/jsx-runtime"),r=require("react-dom");var i=(0,t.createContext)(null),a={info:(0,n.jsxs)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 16 16`,fill:`none`,"aria-hidden":`true`,children:[(0,n.jsx)(`circle`,{cx:`8`,cy:`8`,r:`7`,stroke:`currentColor`,strokeWidth:`1.5`}),(0,n.jsx)(`path`,{d:`M8 7v4M8 5v.5`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`})]}),success:(0,n.jsxs)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 16 16`,fill:`none`,"aria-hidden":`true`,children:[(0,n.jsx)(`circle`,{cx:`8`,cy:`8`,r:`7`,stroke:`currentColor`,strokeWidth:`1.5`}),(0,n.jsx)(`path`,{d:`M5 8l2 2 4-4`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`,strokeLinejoin:`round`})]}),error:(0,n.jsxs)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 16 16`,fill:`none`,"aria-hidden":`true`,children:[(0,n.jsx)(`circle`,{cx:`8`,cy:`8`,r:`7`,stroke:`currentColor`,strokeWidth:`1.5`}),(0,n.jsx)(`path`,{d:`M10 6L6 10M6 6l4 4`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`})]}),warning:(0,n.jsxs)(`svg`,{width:`16`,height:`16`,viewBox:`0 0 16 16`,fill:`none`,"aria-hidden":`true`,children:[(0,n.jsx)(`path`,{d:`M8 2L14.9 14H1.1L8 2z`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinejoin:`round`}),(0,n.jsx)(`path`,{d:`M8 6.5v3M8 11v.5`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`})]})};function o({item:t,dismissLabel:r,onDismiss:i,onPause:o,onResume:s}){return(0,n.jsxs)(`div`,{className:[e.default.toast,e.default[t.variant]].join(` `),role:`status`,onMouseEnter:()=>o(t.id),onMouseLeave:()=>s(t.id),onFocus:()=>o(t.id),onBlur:()=>s(t.id),children:[(0,n.jsx)(`span`,{className:e.default.icon,children:a[t.variant]}),(0,n.jsx)(`span`,{className:e.default.message,children:t.message}),(0,n.jsx)(`button`,{type:`button`,"aria-label":r,className:e.default.closeButton,onClick:()=>i(t.id),children:(0,n.jsx)(`svg`,{width:`12`,height:`12`,viewBox:`0 0 12 12`,fill:`none`,"aria-hidden":`true`,children:(0,n.jsx)(`path`,{d:`M9 3L3 9M3 3l6 6`,stroke:`currentColor`,strokeWidth:`1.5`,strokeLinecap:`round`})})})]})}function s({children:a,maxToasts:s=5,dismissLabel:c=`Close notification`,regionLabel:l=`Notifications`}){let[u,d]=(0,t.useState)([]),f=(0,t.useRef)(new Map),p=(0,t.useRef)(new Map),m=(0,t.useRef)(new Map),h=(0,t.useRef)(0),g=(0,t.useCallback)(e=>{let t=f.current.get(e);t!==void 0&&(clearTimeout(t),f.current.delete(e)),p.current.delete(e),m.current.delete(e),d(t=>t.filter(t=>t.id!==e))},[]),_=(0,t.useCallback)((e,t)=>{let n=setTimeout(()=>g(e),t);f.current.set(e,n)},[g]),v=(0,t.useCallback)(e=>{let t=f.current.get(e);t!==void 0&&(clearTimeout(t),f.current.delete(e),p.current.set(e,Date.now()))},[]),y=(0,t.useCallback)(e=>{let t=p.current.get(e);if(t===void 0)return;let n=Date.now()-t,r=Math.max(0,(m.current.get(e)??0)-n);p.current.delete(e),m.current.set(e,r),r>0?_(e,r):g(e)},[g,_]),b=(0,t.useCallback)(e=>{let t=`toast-${++h.current}`,n=e.variant??`info`,r=e.duration??5e3,i={id:t,message:e.message,variant:n,duration:r};return d(e=>{let t=[...e,i];return t.length>s?t.slice(t.length-s):t}),r>0&&(m.current.set(t,r),_(t,r)),t},[s,_]);return(0,n.jsxs)(i.Provider,{value:{show:b,dismiss:g},children:[a,(0,r.createPortal)((0,n.jsx)(`div`,{role:`region`,className:e.default.region,"aria-label":l,"aria-live":`polite`,"aria-atomic":`false`,"aria-relevant":`additions text`,children:u.map(e=>(0,n.jsx)(o,{item:e,dismissLabel:c,onDismiss:g,onPause:v,onResume:y},e.id))}),document.body)]})}s.displayName=`ToastProvider`;function c(){let e=(0,t.useContext)(i);if(!e)throw Error(`useToast must be used inside a <ToastProvider>`);return e}exports.ToastProvider=s,exports.useToast=c;
@@ -19,8 +19,12 @@ export interface ToastProviderProps {
19
19
  children: React.ReactNode;
20
20
  /** Max toasts visible at once. Default: 5. */
21
21
  maxToasts?: number;
22
+ /** Accessible name of each toast's dismiss button. Default: `'Close notification'`. */
23
+ dismissLabel?: string;
24
+ /** Accessible name of the notifications region. Default: `'Notifications'`. */
25
+ regionLabel?: string;
22
26
  }
23
- export declare function ToastProvider({ children, maxToasts }: ToastProviderProps): import("react").JSX.Element;
27
+ export declare function ToastProvider({ children, maxToasts, dismissLabel, regionLabel, }: ToastProviderProps): import("react").JSX.Element;
24
28
  export declare namespace ToastProvider {
25
29
  var displayName: string;
26
30
  }
@@ -81,14 +81,14 @@ var l = t(null), u = {
81
81
  })]
82
82
  })
83
83
  };
84
- function d({ item: t, onDismiss: n, onPause: r, onResume: i }) {
84
+ function d({ item: t, dismissLabel: n, onDismiss: r, onPause: i, onResume: a }) {
85
85
  return /* @__PURE__ */ s("div", {
86
86
  className: [e.toast, e[t.variant]].join(" "),
87
87
  role: "status",
88
- onMouseEnter: () => r(t.id),
89
- onMouseLeave: () => i(t.id),
90
- onFocus: () => r(t.id),
91
- onBlur: () => i(t.id),
88
+ onMouseEnter: () => i(t.id),
89
+ onMouseLeave: () => a(t.id),
90
+ onFocus: () => i(t.id),
91
+ onBlur: () => a(t.id),
92
92
  children: [
93
93
  /* @__PURE__ */ o("span", {
94
94
  className: e.icon,
@@ -100,9 +100,9 @@ function d({ item: t, onDismiss: n, onPause: r, onResume: i }) {
100
100
  }),
101
101
  /* @__PURE__ */ o("button", {
102
102
  type: "button",
103
- "aria-label": "Close notification",
103
+ "aria-label": n,
104
104
  className: e.closeButton,
105
- onClick: () => n(t.id),
105
+ onClick: () => r(t.id),
106
106
  children: /* @__PURE__ */ o("svg", {
107
107
  width: "12",
108
108
  height: "12",
@@ -120,50 +120,51 @@ function d({ item: t, onDismiss: n, onPause: r, onResume: i }) {
120
120
  ]
121
121
  });
122
122
  }
123
- function f({ children: t, maxToasts: r = 5 }) {
124
- let [u, f] = a([]), p = i(/* @__PURE__ */ new Map()), m = i(/* @__PURE__ */ new Map()), h = i(/* @__PURE__ */ new Map()), g = i(0), _ = n((e) => {
125
- let t = p.current.get(e);
126
- t !== void 0 && (clearTimeout(t), p.current.delete(e)), m.current.delete(e), h.current.delete(e), f((t) => t.filter((t) => t.id !== e));
127
- }, []), v = n((e, t) => {
128
- let n = setTimeout(() => _(e), t);
129
- p.current.set(e, n);
130
- }, [_]), y = n((e) => {
131
- let t = p.current.get(e);
132
- t !== void 0 && (clearTimeout(t), p.current.delete(e), m.current.set(e, Date.now()));
133
- }, []), b = n((e) => {
134
- let t = m.current.get(e);
123
+ function f({ children: t, maxToasts: r = 5, dismissLabel: u = "Close notification", regionLabel: f = "Notifications" }) {
124
+ let [p, m] = a([]), h = i(/* @__PURE__ */ new Map()), g = i(/* @__PURE__ */ new Map()), _ = i(/* @__PURE__ */ new Map()), v = i(0), y = n((e) => {
125
+ let t = h.current.get(e);
126
+ t !== void 0 && (clearTimeout(t), h.current.delete(e)), g.current.delete(e), _.current.delete(e), m((t) => t.filter((t) => t.id !== e));
127
+ }, []), b = n((e, t) => {
128
+ let n = setTimeout(() => y(e), t);
129
+ h.current.set(e, n);
130
+ }, [y]), x = n((e) => {
131
+ let t = h.current.get(e);
132
+ t !== void 0 && (clearTimeout(t), h.current.delete(e), g.current.set(e, Date.now()));
133
+ }, []), S = n((e) => {
134
+ let t = g.current.get(e);
135
135
  if (t === void 0) return;
136
- let n = Date.now() - t, r = Math.max(0, (h.current.get(e) ?? 0) - n);
137
- m.current.delete(e), h.current.set(e, r), r > 0 ? v(e, r) : _(e);
138
- }, [_, v]), x = n((e) => {
139
- let t = `toast-${++g.current}`, n = e.variant ?? "info", i = e.duration ?? 5e3, a = {
136
+ let n = Date.now() - t, r = Math.max(0, (_.current.get(e) ?? 0) - n);
137
+ g.current.delete(e), _.current.set(e, r), r > 0 ? b(e, r) : y(e);
138
+ }, [y, b]), C = n((e) => {
139
+ let t = `toast-${++v.current}`, n = e.variant ?? "info", i = e.duration ?? 5e3, a = {
140
140
  id: t,
141
141
  message: e.message,
142
142
  variant: n,
143
143
  duration: i
144
144
  };
145
- return f((e) => {
145
+ return m((e) => {
146
146
  let t = [...e, a];
147
147
  return t.length > r ? t.slice(t.length - r) : t;
148
- }), i > 0 && (h.current.set(t, i), v(t, i)), t;
149
- }, [r, v]);
148
+ }), i > 0 && (_.current.set(t, i), b(t, i)), t;
149
+ }, [r, b]);
150
150
  return /* @__PURE__ */ s(l.Provider, {
151
151
  value: {
152
- show: x,
153
- dismiss: _
152
+ show: C,
153
+ dismiss: y
154
154
  },
155
155
  children: [t, c(/* @__PURE__ */ o("div", {
156
156
  role: "region",
157
157
  className: e.region,
158
- "aria-label": "Notifications",
158
+ "aria-label": f,
159
159
  "aria-live": "polite",
160
160
  "aria-atomic": "false",
161
161
  "aria-relevant": "additions text",
162
- children: u.map((e) => /* @__PURE__ */ o(d, {
162
+ children: p.map((e) => /* @__PURE__ */ o(d, {
163
163
  item: e,
164
- onDismiss: _,
165
- onPause: y,
166
- onResume: b
164
+ dismissLabel: u,
165
+ onDismiss: y,
166
+ onPause: x,
167
+ onResume: S
167
168
  }, e.id))
168
169
  }), document.body)]
169
170
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@aseguragonzalez/ui",
3
- "version": "1.2.0",
3
+ "version": "1.3.0",
4
4
  "private": false,
5
5
  "type": "module",
6
6
  "description": "Accessible, themeable design system for React SPAs",