boreal-ui 0.0.72 → 0.0.73

package/dist/core/boreal-ui.css

@@ -7569,6 +7569,8 @@ samp {
 }
 .checkbox {
   display: inline-flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
   align-items: center;
   justify-content: center;
   cursor: pointer;
@@ -7925,9 +7927,14 @@ samp {
   border: none;
   transform: none;
 }
+.checkbox_label-wrapper {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: var(--spacing-xs);
+}
 .checkbox_label {
   color: var(--text-color-primary);
-  margin-bottom: -1px;
   font-family: var(--font-family-ui);
   font-size: var(--font-size-body-sm);
   font-weight: var(--font-weight-body);
@@ -11717,6 +11724,25 @@ samp {
   background-color: transparent;
   color: var(--text-color-primary);
 }
+.textInput input {
+  width: 100%;
+  padding: var(--spacing-sm);
+  border: none;
+  height: 100%;
+  background-color: transparent;
+  color: var(--text-color-primary);
+}
+.textInput input:hover {
+  background-color: transparent;
+}
+.textInput input:focus, .textInput input:focus-within {
+  outline: none;
+}
+.textInput:focus-within {
+  outline: 2px solid var(--focus-outline-color, var(--primary-color));
+  outline-offset: 3px;
+  border-radius: var(--border-radius-md);
+}
 .textInput::placeholder {
   color: var(--text-color-primary);
   opacity: 0.8;
@@ -12670,6 +12696,7 @@ samp {
   display: flex;
   flex-direction: column;
   justify-content: center;
+  align-items: center;
   gap: var(--spacing-sm);
   font-family: var(--font-family-ui);
   font-size: var(--font-size-body-sm);
@@ -12773,6 +12800,7 @@ samp {
   padding: 0;
   margin: 0;
   max-height: 300px;
+  width: 100%;
   overflow-y: auto;
 }
 @media (width <= 479.98px) {
@@ -13756,6 +13784,16 @@ samp {
   outline: 2px solid var(--focus-outline-color, var(--primary-color));
   outline-offset: 0.5px;
 }
+.data_table_wrapper .data_table_sort_button {
+  margin-left: var(--spacing-xxs);
+  background-color: transparent;
+  border: none;
+  color: var(--text-color-primary);
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  gap: var(--spacing-xs);
+}
 .data_table_wrapper .data_table_sort_icon {
   margin-left: var(--spacing-xxs);
   font-size: 0.9em;
@@ -21297,7 +21335,7 @@ samp {
 .select_wrapper {
   position: relative;
   display: inline-flex;
-  justify-content: space-evenly;
+  justify-content: center;
   align-items: center;
   width: fit-content;
   margin: var(--spacing-xs) 0;
@@ -21528,7 +21566,7 @@ samp {
 .select {
   width: 100%;
   min-height: 40px;
-  padding: 5px 30px;
+  padding: 5px 10px;
   font-family: var(--font-family-ui);
   font-size: var(--font-size-label);
   font-weight: var(--font-weight-label);

package/dist/core/index.cjs.js

@@ -5,57 +5,57 @@ const ThemeContext = require("./ThemeContext-4edI_44t.cjs");
 const registerColorSheme = require("./registerColorSheme-nhYu5hbY.cjs");
 const colorSchemes = require("./colorSchemes.cjs.js");
 const borealStyleConfig = require("./boreal-style-config-C1UIwOFN.cjs");
-const Typography = require("./Typography-D9WF2TVi.cjs");
-const Button = require("./Button-BT9ID2ki.cjs");
-const IconButton = require("./IconButton-B7DYdUHH.cjs");
-const ScrollToTop = require("./ScrollToTop-CLBwqdLe.cjs");
-const TextInput = require("./TextInput-k_V-hTwW.cjs");
-const TextArea = require("./TextArea-tX4BO8iT.cjs");
-const Select = require("./Select-FS746FcH.cjs");
-const Footer = require("./Footer-DXBSC-EW.cjs");
-const FileUpload = require("./FileUpload-B3gV8uYa.cjs");
-const TagInput = require("./TagInput-BFNzMNLC.cjs");
-const RadioButton = require("./RadioButton-o6h5NsTK.cjs");
-const Slider = require("./Slider-XeEn7t2O.cjs");
-const Checkbox = require("./Checkbox-BN4KCkz0.cjs");
-const ColorPicker = require("./ColorPicker-BE1z0P4n.cjs");
-const FormGroup = require("./FormGroup-Cit_2_Wo.cjs");
-const DataTable = require("./DataTable-CBZ0XtxS.cjs");
-const DateTimePicker = require("./DateTimePicker-Dh83Kd8i.cjs");
-const MarkdownRenderer = require("./MarkdownRenderer-D4emln2b.cjs");
-const Chip = require("./Chip-9iK2hsJj.cjs");
+const Typography = require("./Typography-DdTiWRgQ.cjs");
+const Button = require("./Button-nxtJFOWD.cjs");
+const IconButton = require("./IconButton-C_ktew-6.cjs");
+const ScrollToTop = require("./ScrollToTop-CK74BkzY.cjs");
+const TextInput = require("./TextInput-DbAsQxjr.cjs");
+const TextArea = require("./TextArea-BKmmcXld.cjs");
+const Select = require("./Select-KiOrD0xY.cjs");
+const Footer = require("./Footer-60sTURxB.cjs");
+const FileUpload = require("./FileUpload-BR9-eENT.cjs");
+const TagInput = require("./TagInput-pWRdhaP3.cjs");
+const RadioButton = require("./RadioButton-QK6SCEbU.cjs");
+const Slider = require("./Slider-Davbqf_v.cjs");
+const Checkbox = require("./Checkbox-JWFInEW_.cjs");
+const ColorPicker = require("./ColorPicker-j6djvLOC.cjs");
+const FormGroup = require("./FormGroup-s3n6ZiDT.cjs");
+const DataTable = require("./DataTable-CCPWihcW.cjs");
+const DateTimePicker = require("./DateTimePicker-Ul1dl1A1.cjs");
+const MarkdownRenderer = require("./MarkdownRenderer-CBPB1PJt.cjs");
+const Chip = require("./Chip-DV-l08jr.cjs");
 const jsxRuntime = require("react/jsx-runtime");
 const React = require("react");
 const uuid = require("uuid");
 const classNames = require("./classNames-BcWMx052.cjs");
-const Badge = require("./Badge-BFvrWTX6.cjs");
-const ProgressBar = require("./ProgressBar-Djh3tscr.cjs");
-const CircularProgress = require("./CircularProgress-DVHra4Wi.cjs");
-const Rating = require("./Rating-Ce9hjQVC.cjs");
-const Skeleton = require("./Skeleton-DPR3hXBc.cjs");
-const Spinner = require("./Spinner-D2V23we6.cjs");
-const Tooltip = require("./Tooltip-BqUQU9du.cjs");
-const MessagePopup = require("./MessagePopup-CyU-0yY3.cjs");
-const PopOver = require("./PopOver-DMEKU24G.cjs");
-const NavBar = require("./NavBar-Dn1gUrAi.cjs");
-const Breadcrumbs = require("./Breadcrumbs-CMQYmSDB.cjs");
-const Tabs = require("./Tabs-CncWfZxF.cjs");
-const Stepper = require("./Stepper-O6PTrY95.cjs");
-const Timeline = require("./Timeline-CHxLOSfo.cjs");
-const Accordion = require("./Accordion-CyxuUy_t.cjs");
-const Pager = require("./Pager-wg8JPfcU.cjs");
-const Modal = require("./Modal-gYZyAmkB.cjs");
-const Toggle = require("./Toggle-BjcHSRky.cjs");
-const Toolbar = require("./Toolbar-DS4OWUio.cjs");
-const Dropdown = require("./Dropdown-wW-i6oeS.cjs");
-const Divider = require("./Divider-AaLX554p.cjs");
-const MetricBox = require("./MetricBox-Cy4qboZV.cjs");
-const EmptyState = require("./EmptyState-D47l1YgZ.cjs");
-const CommandPalette = require("./CommandPalette-D4Onjukh.cjs");
-const NotificationCenter = require("./NotificationCenter-DBRsoFv2.cjs");
-const Sidebar = require("./Sidebar-DFAi7pQh.cjs");
-const Card = require("./Card-BmlPaqJZ.cjs");
-const Avatar = require("./Avatar-CxrSOiu7.cjs");
+const Badge = require("./Badge-oXVUTleI.cjs");
+const ProgressBar = require("./ProgressBar-Cjw7Npjq.cjs");
+const CircularProgress = require("./CircularProgress-CAlIuRfH.cjs");
+const Rating = require("./Rating-CIo6DFh5.cjs");
+const Skeleton = require("./Skeleton-BXeQBgX2.cjs");
+const Spinner = require("./Spinner-DvzolXTI.cjs");
+const Tooltip = require("./Tooltip-_e_4s6pE.cjs");
+const MessagePopup = require("./MessagePopup-DIfdILWZ.cjs");
+const PopOver = require("./PopOver-B87GGM3R.cjs");
+const NavBar = require("./NavBar-Dq1f1NSn.cjs");
+const Breadcrumbs = require("./Breadcrumbs-B7hp9_u1.cjs");
+const Tabs = require("./Tabs-r1nyJCFz.cjs");
+const Stepper = require("./Stepper-CQRJID19.cjs");
+const Timeline = require("./Timeline-CfTmjEVS.cjs");
+const Accordion = require("./Accordion-7FjsUwVp.cjs");
+const Pager = require("./Pager-wl7_umU4.cjs");
+const Modal = require("./Modal-DhpY3Kt6.cjs");
+const Toggle = require("./Toggle-BRUwXOhV.cjs");
+const Toolbar = require("./Toolbar-CxJxebIJ.cjs");
+const Dropdown = require("./Dropdown-B7-_OH9p.cjs");
+const Divider = require("./Divider-CgUoL8NV.cjs");
+const MetricBox = require("./MetricBox-Dq8ZwEGV.cjs");
+const EmptyState = require("./EmptyState-Du2xqi6G.cjs");
+const CommandPalette = require("./CommandPalette-BtpQ9cio.cjs");
+const NotificationCenter = require("./NotificationCenter-CsKJTZhk.cjs");
+const Sidebar = require("./Sidebar-DrEQ7PwW.cjs");
+const Card = require("./Card-C3kfPs8j.cjs");
+const Avatar = require("./Avatar-jxGFijtF.cjs");
 const ChipGroupBase = React.forwardRef(
   ({
     chips,

package/dist/core/index.js

@@ -4,57 +4,57 @@ import { r } from "./registerColorSheme-BPX0H7hl.js";
 import { colorSchemes } from "./colorSchemes.js";
 import { c as getDefaultSize } from "./boreal-style-config-DsaRlxmw.js";
 import { s } from "./boreal-style-config-DsaRlxmw.js";
-import { T as T2 } from "./Typography-DeV9eoQj.js";
-import { B } from "./Button-Sn-XGEsn.js";
-import { I } from "./IconButton-6hjW9_Za.js";
-import { S } from "./ScrollToTop-BwntJ7A5.js";
-import { T as T3 } from "./TextInput-D9IHA-K3.js";
-import { T as T4 } from "./TextArea-B7BTlqcx.js";
-import { S as S2 } from "./Select-DQDXyKPq.js";
-import { F, U } from "./Footer-j3QFfvxK.js";
-import { F as F2 } from "./FileUpload-H_G60ktw.js";
-import { T as T5 } from "./TagInput-BdrT33b_.js";
-import { R } from "./RadioButton-Af4h43-j.js";
-import { S as S3 } from "./Slider-BLSK3_yt.js";
-import { C } from "./Checkbox-8EgwIJTX.js";
-import { C as C2 } from "./ColorPicker-N8ZUJmJv.js";
-import { F as F3 } from "./FormGroup-DDZ1D_CI.js";
-import { D } from "./DataTable-CF1AaO2t.js";
-import { D as D2 } from "./DateTimePicker-B_x-Hw30.js";
-import { M } from "./MarkdownRenderer-CIJSu7o6.js";
-import { C as Chip } from "./Chip-BN-6gv8X.js";
+import { T as T2 } from "./Typography-D0hPzK5Y.js";
+import { B } from "./Button-IALg9VKr.js";
+import { I } from "./IconButton-ChJJCB4O.js";
+import { S } from "./ScrollToTop-BYyKPqix.js";
+import { T as T3 } from "./TextInput-BaiDGrKw.js";
+import { T as T4 } from "./TextArea-Ufou1zw1.js";
+import { S as S2 } from "./Select-CeyJGftD.js";
+import { F, U } from "./Footer-CkSzN_PI.js";
+import { F as F2 } from "./FileUpload-BWjOciA3.js";
+import { T as T5 } from "./TagInput-CcuMIlmi.js";
+import { R } from "./RadioButton-BM0-FaUG.js";
+import { S as S3 } from "./Slider-Dxcryk5j.js";
+import { C } from "./Checkbox-DmMDTc5Z.js";
+import { C as C2 } from "./ColorPicker-BpJgDnaw.js";
+import { F as F3 } from "./FormGroup-qqHKY5fP.js";
+import { D } from "./DataTable-FIxUWKG4.js";
+import { D as D2 } from "./DateTimePicker-u2p4sBbR.js";
+import { M } from "./MarkdownRenderer-EbqPYLEM.js";
+import { C as Chip } from "./Chip-DSBIjvJZ.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { forwardRef, useState, useRef, useEffect, useCallback, useImperativeHandle, useMemo, Children, isValidElement, cloneElement } from "react";
 import { v4 } from "uuid";
 import { c as combineClassNames } from "./classNames-AS8QjFq7.js";
-import { B as B2 } from "./Badge-BEj0KQvW.js";
-import { P } from "./ProgressBar-DENoE2ZA.js";
-import { C as C3 } from "./CircularProgress-BAjEgUf9.js";
-import { R as R2 } from "./Rating-D6ltlsWy.js";
-import { S as S4 } from "./Skeleton-B9LVkce_.js";
-import { S as S5 } from "./Spinner-oky6qn-3.js";
-import { T as T6 } from "./Tooltip-fOb5jy6R.js";
-import { M as M2 } from "./MessagePopup-D6h1dJ-D.js";
-import { P as P2 } from "./PopOver-CZ-ZzkVe.js";
-import { N } from "./NavBar-D8IkIqs9.js";
-import { B as B3 } from "./Breadcrumbs-CJ-f4SqB.js";
-import { T as T7 } from "./Tabs-C2MAHi3V.js";
-import { S as S6 } from "./Stepper-D5iUsoKL.js";
-import { T as T8 } from "./Timeline-CysPgst2.js";
-import { A } from "./Accordion-BwtII31u.js";
-import { P as P3 } from "./Pager-rEKbCsap.js";
-import { M as M3 } from "./Modal-GW1_WI8d.js";
-import { T as T9 } from "./Toggle-x0wutBcD.js";
-import { T as T10 } from "./Toolbar-Ce40CpVS.js";
-import { D as D3 } from "./Dropdown-D3hW8fec.js";
-import { D as D4 } from "./Divider-2UcgENdU.js";
-import { M as M4 } from "./MetricBox--nk1HHt-.js";
-import { E } from "./EmptyState-D_7LnNDB.js";
-import { C as C4 } from "./CommandPalette-BVV9ElyC.js";
-import { N as N2 } from "./NotificationCenter-nyzZ8p0t.js";
-import { S as S7 } from "./Sidebar-CniHke_6.js";
-import { C as C5 } from "./Card-CRIPRZ_b.js";
-import { A as A2 } from "./Avatar-CUSWjsVo.js";
+import { B as B2 } from "./Badge-BOd5dF4l.js";
+import { P } from "./ProgressBar-pVPs5lsA.js";
+import { C as C3 } from "./CircularProgress-DEZZm76L.js";
+import { R as R2 } from "./Rating-C7xfIXYT.js";
+import { S as S4 } from "./Skeleton-C-L3OgVt.js";
+import { S as S5 } from "./Spinner-C0bxVDCy.js";
+import { T as T6 } from "./Tooltip-wKNLA3ua.js";
+import { M as M2 } from "./MessagePopup-D6xuwdAv.js";
+import { P as P2 } from "./PopOver-lRqOHUJg.js";
+import { N } from "./NavBar-DelYH3IR.js";
+import { B as B3 } from "./Breadcrumbs-C1Z59ffV.js";
+import { T as T7 } from "./Tabs-B4HRqGuB.js";
+import { S as S6 } from "./Stepper-SDJM-Jju.js";
+import { T as T8 } from "./Timeline-BRLd8boJ.js";
+import { A } from "./Accordion-Bp-rbJiD.js";
+import { P as P3 } from "./Pager-B2MEqAOV.js";
+import { M as M3 } from "./Modal-DVz_GNOL.js";
+import { T as T9 } from "./Toggle-DL0Nhwgr.js";
+import { T as T10 } from "./Toolbar-fSghH1_-.js";
+import { D as D3 } from "./Dropdown-BGJ8mGhg.js";
+import { D as D4 } from "./Divider-C34MwVBv.js";
+import { M as M4 } from "./MetricBox-BlkBoGCL.js";
+import { E } from "./EmptyState-CCSPIDo3.js";
+import { C as C4 } from "./CommandPalette-BBjIib6T.js";
+import { N as N2 } from "./NotificationCenter-MTRIDmMm.js";
+import { S as S7 } from "./Sidebar-BWzuQw-r.js";
+import { C as C5 } from "./Card-dazG4EK1.js";
+import { A as A2 } from "./Avatar-Ct2kXkNR.js";
 const ChipGroupBase = forwardRef(
   ({
     chips,

package/dist/next/{Accordion-D9pe1F_C.cjs → Accordion-BEa1jxTt.cjs}

@@ -28,6 +28,13 @@ const AccordionBase = ({
   className = "",
   getUniqueId,
   classMap,
+  regionAriaLabel,
+  regionAriaLabelledBy,
+  regionAriaDescribedBy,
+  loadingAriaLabel,
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledBy,
+  "aria-describedby": ariaDescribedBy,
   "data-testid": testId = "accordion",
   ...rest
 }) => {
@@ -37,9 +44,17 @@ const AccordionBase = ({
   const [hasBeenExpanded, setHasBeenExpanded] = React.useState(initiallyExpanded);
   const [isLoading, setIsLoading] = React.useState(asyncContent && initiallyExpanded);
   const isExpanded = isControlled ? expanded2 : internalExpanded;
-  const contentId = `${id || internalId}-content`;
-  const buttonId = `${id || internalId}-button`;
-  const descId = description ? `${id || internalId}-desc` : void 0;
+  const baseId = id || internalId;
+  const contentId = `${baseId}-content`;
+  const buttonId = `${baseId}-button`;
+  const descId = description ? `${baseId}-desc` : void 0;
+  const loadingId = `${baseId}-loading`;
+  const buttonDescribedBy = [descId, ariaDescribedBy].filter(Boolean).join(" ") || void 0;
+  const regionLabelledBy = regionAriaLabelledBy || (!regionAriaLabel ? buttonId : void 0);
+  const regionDescribedBy = [
+    regionAriaDescribedBy,
+    asyncContent && isExpanded && isLoading ? loadingId : void 0
+  ].filter(Boolean).join(" ") || void 0;
   const toggleAccordion = () => {
     if (disabled2) return;
     if (!isToggleable && isExpanded) return;
@@ -56,19 +71,21 @@ const AccordionBase = ({
       toggleAccordion();
     }
   };
-  React.useMemo(() => {
+  React.useEffect(() => {
     if (isExpanded && !hasBeenExpanded) {
       setHasBeenExpanded(true);
     }
-  }, [isExpanded]);
-  React.useMemo(() => {
-    if (asyncContent && isExpanded && isLoading) {
+  }, [isExpanded, hasBeenExpanded]);
+  React.useEffect(() => {
+    if (asyncContent && isExpanded) {
+      setIsLoading(true);
       const timer = setTimeout(() => {
         setIsLoading(false);
       }, 1e3);
       return () => clearTimeout(timer);
     }
-  }, [asyncContent, isExpanded, isLoading]);
+    return void 0;
+  }, [asyncContent, isExpanded]);
   const renderedIcon = isExpanded ? customExpandedIcon ?? "−" : customCollapsedIcon ?? "+";
   const wrapperClassName = React.useMemo(
     () => classNames.combineClassNames(
@@ -81,7 +98,7 @@ const AccordionBase = ({
       isExpanded && classMap.expanded,
       className
     ),
-    [classMap, size, disabled2, isExpanded, className]
+    [classMap, size, state, shadow, rounding, disabled2, isExpanded, className]
   );
   const headerClassName = React.useMemo(
     () => classNames.combineClassNames(
@@ -92,7 +109,7 @@ const AccordionBase = ({
       disabled2 && classMap.disabled,
       isExpanded && classMap.expanded
     ),
-    [classMap, isExpanded]
+    [classMap, theme, state, outline2, disabled2, isExpanded]
   );
   const contentClassName = React.useMemo(
     () => classNames.combineClassNames(classMap.content, isExpanded && classMap.expanded),
@@ -113,8 +130,10 @@ const AccordionBase = ({
         type: "button",
         "aria-expanded": isExpanded,
         "aria-controls": contentId,
-        "aria-disabled": disabled2,
-        "aria-describedby": descId,
+        "aria-disabled": disabled2 || void 0,
+        "aria-label": ariaLabel,
+        "aria-labelledby": ariaLabelledBy,
+        "aria-describedby": buttonDescribedBy,
         tabIndex: disabled2 ? -1 : 0,
         disabled: disabled2,
         "data-testid": testId ? `${testId}-accordion-toggle` : void 0,
@@ -162,12 +181,25 @@ const AccordionBase = ({
       {
         id: contentId,
         role: "region",
-        "aria-labelledby": buttonId,
+        "aria-label": regionAriaLabel,
+        "aria-labelledby": regionLabelledBy,
+        "aria-describedby": regionDescribedBy,
+        "aria-busy": asyncContent && isExpanded && isLoading ? true : void 0,
         className: contentClassName,
         "data-state": isExpanded ? "open" : "collapsed",
         "data-testid": testId ? `${testId}-content` : void 0,
         children: [
-          isExpanded && asyncContent && isLoading && /* @__PURE__ */ require$$2.jsx("div", { className: classMap.loading, children: "Loading..." }),
+          isExpanded && asyncContent && isLoading && /* @__PURE__ */ require$$2.jsx(
+            "div",
+            {
+              id: loadingId,
+              className: classMap.loading,
+              "aria-live": "polite",
+              "aria-atomic": "true",
+              "data-testid": testId ? `${testId}-loading` : void 0,
+              children: loadingAriaLabel || "Loading content"
+            }
+          ),
           (!lazyLoad || hasBeenExpanded) && (!asyncContent || !isLoading) && children
         ]
       }
@@ -275,4 +307,4 @@ const Accordion = (props) => {
 };
 Accordion.displayName = "Accordion";
 exports.Accordion = Accordion;
-//# sourceMappingURL=Accordion-D9pe1F_C.cjs.map
+//# sourceMappingURL=Accordion-BEa1jxTt.cjs.map

package/dist/next/Accordion-BEa1jxTt.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Accordion-BEa1jxTt.cjs","sources":["../../src/components/Accordion/AccordionBase.tsx","../../src/components/Accordion/next/Accordion.tsx"],"sourcesContent":["import React, { useMemo, useState, KeyboardEvent, useEffect } from \"react\";\r\nimport { AccordionProps } from \"./Accordion.types\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n  getDefaultRounding,\r\n  getDefaultShadow,\r\n  getDefaultSize,\r\n  getDefaultTheme,\r\n} from \"../../config/boreal-style-config\";\r\n\r\nexport interface AccordionBaseProps extends AccordionProps {\r\n  getUniqueId: () => string;\r\n  classMap: Record<string, string>;\r\n}\r\n\r\nexport const AccordionBase: React.FC<AccordionBaseProps> = ({\r\n  title,\r\n  id,\r\n  children,\r\n  lazyLoad = false,\r\n  iconPosition = \"right\",\r\n  isToggleable = true,\r\n  asyncContent = false,\r\n  rounding = getDefaultRounding(),\r\n  shadow = getDefaultShadow(),\r\n  description,\r\n  size = getDefaultSize(),\r\n  theme = getDefaultTheme(),\r\n  state = \"\",\r\n  outline = false,\r\n  expanded,\r\n  disabled,\r\n  customCollapsedIcon,\r\n  customExpandedIcon,\r\n  onToggle,\r\n  initiallyExpanded = false,\r\n  className = \"\",\r\n  getUniqueId,\r\n  classMap,\r\n  regionAriaLabel,\r\n  regionAriaLabelledBy,\r\n  regionAriaDescribedBy,\r\n  loadingAriaLabel,\r\n  \"aria-label\": ariaLabel,\r\n  \"aria-labelledby\": ariaLabelledBy,\r\n  \"aria-describedby\": ariaDescribedBy,\r\n  \"data-testid\": testId = \"accordion\",\r\n  ...rest\r\n}) => {\r\n  const isControlled = expanded !== undefined;\r\n  const internalId = useMemo(getUniqueId, []);\r\n  const [internalExpanded, setInternalExpanded] = useState(initiallyExpanded);\r\n  const [hasBeenExpanded, setHasBeenExpanded] = useState(initiallyExpanded);\r\n  const [isLoading, setIsLoading] = useState(asyncContent && initiallyExpanded);\r\n\r\n  const isExpanded = isControlled ? expanded : internalExpanded;\r\n\r\n  const baseId = id || internalId;\r\n  const contentId = `${baseId}-content`;\r\n  const buttonId = `${baseId}-button`;\r\n  const descId = description ? `${baseId}-desc` : undefined;\r\n  const loadingId = `${baseId}-loading`;\r\n\r\n  const buttonDescribedBy =\r\n    [descId, ariaDescribedBy].filter(Boolean).join(\" \") || undefined;\r\n\r\n  const regionLabelledBy =\r\n    regionAriaLabelledBy || (!regionAriaLabel ? buttonId : undefined);\r\n\r\n  const regionDescribedBy =\r\n    [\r\n      regionAriaDescribedBy,\r\n      asyncContent && isExpanded && isLoading ? loadingId : undefined,\r\n    ]\r\n      .filter(Boolean)\r\n      .join(\" \") || undefined;\r\n\r\n  const toggleAccordion = () => {\r\n    if (disabled) return;\r\n    if (!isToggleable && isExpanded) return;\r\n\r\n    if (isControlled) {\r\n      onToggle?.(!expanded);\r\n    } else {\r\n      setInternalExpanded((prev) => !prev);\r\n    }\r\n  };\r\n\r\n  const handleKeyDown = (e: KeyboardEvent<HTMLButtonElement>) => {\r\n    if (disabled) return;\r\n\r\n    if (e.key === \"Enter\" || e.key === \" \") {\r\n      e.preventDefault();\r\n      toggleAccordion();\r\n    }\r\n  };\r\n\r\n  useEffect(() => {\r\n    if (isExpanded && !hasBeenExpanded) {\r\n      setHasBeenExpanded(true);\r\n    }\r\n  }, [isExpanded, hasBeenExpanded]);\r\n\r\n  useEffect(() => {\r\n    if (asyncContent && isExpanded) {\r\n      setIsLoading(true);\r\n\r\n      const timer = setTimeout(() => {\r\n        setIsLoading(false);\r\n      }, 1000);\r\n\r\n      return () => clearTimeout(timer);\r\n    }\r\n\r\n    return undefined;\r\n  }, [asyncContent, isExpanded]);\r\n\r\n  const renderedIcon = isExpanded\r\n    ? (customExpandedIcon ?? \"−\")\r\n    : (customCollapsedIcon ?? \"+\");\r\n\r\n  const wrapperClassName = useMemo(\r\n    () =>\r\n      combineClassNames(\r\n        classMap.accordion,\r\n        classMap[size],\r\n        classMap[state],\r\n        shadow && classMap[`shadow${capitalize(shadow)}`],\r\n        rounding && classMap[`round${capitalize(rounding)}`],\r\n        disabled && classMap.disabled,\r\n        isExpanded && classMap.expanded,\r\n        className,\r\n      ),\r\n    [classMap, size, state, shadow, rounding, disabled, isExpanded, className],\r\n  );\r\n\r\n  const headerClassName = useMemo(\r\n    () =>\r\n      combineClassNames(\r\n        classMap.header,\r\n        classMap[theme],\r\n        classMap[state],\r\n        outline && classMap.outline,\r\n        disabled && classMap.disabled,\r\n        isExpanded && classMap.expanded,\r\n      ),\r\n    [classMap, theme, state, outline, disabled, isExpanded],\r\n  );\r\n\r\n  const contentClassName = useMemo(\r\n    () => combineClassNames(classMap.content, isExpanded && classMap.expanded),\r\n    [classMap, isExpanded],\r\n  );\r\n\r\n  const iconClassName = useMemo(\r\n    () => combineClassNames(classMap.icon, isExpanded && classMap.expanded),\r\n    [classMap, isExpanded],\r\n  );\r\n\r\n  return (\r\n    <div {...rest} className={wrapperClassName}>\r\n      <button\r\n        id={buttonId}\r\n        className={headerClassName}\r\n        onClick={toggleAccordion}\r\n        onKeyDown={handleKeyDown}\r\n        type=\"button\"\r\n        aria-expanded={isExpanded}\r\n        aria-controls={contentId}\r\n        aria-disabled={disabled || undefined}\r\n        aria-label={ariaLabel}\r\n        aria-labelledby={ariaLabelledBy}\r\n        aria-describedby={buttonDescribedBy}\r\n        tabIndex={disabled ? -1 : 0}\r\n        disabled={disabled}\r\n        data-testid={testId ? `${testId}-accordion-toggle` : undefined}\r\n      >\r\n        {iconPosition === \"left\" && (\r\n          <span\r\n            className={iconClassName}\r\n            aria-hidden=\"true\"\r\n            data-testid={testId ? `${testId}-icon` : undefined}\r\n          >\r\n            {renderedIcon}\r\n          </span>\r\n        )}\r\n\r\n        <span\r\n          className={classMap.accordionTitle}\r\n          data-testid={testId ? `${testId}-title` : undefined}\r\n        >\r\n          {title}\r\n        </span>\r\n\r\n        {iconPosition === \"right\" && (\r\n          <span\r\n            className={iconClassName}\r\n            aria-hidden=\"true\"\r\n            data-testid={testId ? `${testId}-icon` : undefined}\r\n          >\r\n            {renderedIcon}\r\n          </span>\r\n        )}\r\n      </button>\r\n\r\n      {description && (\r\n        <span\r\n          id={descId}\r\n          className=\"sr_only\"\r\n          data-testid={testId ? `${testId}-description` : undefined}\r\n        >\r\n          {description}\r\n        </span>\r\n      )}\r\n\r\n      <div\r\n        id={contentId}\r\n        role=\"region\"\r\n        aria-label={regionAriaLabel}\r\n        aria-labelledby={regionLabelledBy}\r\n        aria-describedby={regionDescribedBy}\r\n        aria-busy={asyncContent && isExpanded && isLoading ? true : undefined}\r\n        className={contentClassName}\r\n        data-state={isExpanded ? \"open\" : \"collapsed\"}\r\n        data-testid={testId ? `${testId}-content` : undefined}\r\n      >\r\n        {isExpanded && asyncContent && isLoading && (\r\n          <div\r\n            id={loadingId}\r\n            className={classMap.loading}\r\n            aria-live=\"polite\"\r\n            aria-atomic=\"true\"\r\n            data-testid={testId ? `${testId}-loading` : undefined}\r\n          >\r\n            {loadingAriaLabel || \"Loading content\"}\r\n          </div>\r\n        )}\r\n\r\n        {(!lazyLoad || hasBeenExpanded) &&\r\n          (!asyncContent || !isLoading) &&\r\n          children}\r\n      </div>\r\n    </div>\r\n  );\r\n};\r\n\r\nAccordionBase.displayName = \"AccordionBase\";\r\n","\"use client\";\r\n\r\nimport React, { useId } from \"react\";\r\nimport { AccordionBase } from \"../AccordionBase\";\r\nimport type { AccordionProps } from \"../Accordion.types\";\r\nimport styles from \"./Accordion.module.scss\";\r\n\r\nconst Accordion: React.FC<AccordionProps> = (props) => {\r\n  const id = useId();\r\n  const getUniqueId = () => `accordion-${id}`;\r\n\r\n  return (\r\n    <AccordionBase {...props} getUniqueId={getUniqueId} classMap={styles} />\r\n  );\r\n};\r\nAccordion.displayName = \"Accordion\";\r\nexport default Accordion;\r\n"],"names":["title","getDefaultRounding","getDefaultShadow","getDefaultSize","getDefaultTheme","outline","expanded","disabled","useMemo","useState","useEffect","combineClassNames","capitalize","jsxs","jsx","useId"],"mappings":"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"}

package/dist/next/{Accordion-B6n350De.js → Accordion-Bg8V6T38.js}

@@ -1,5 +1,5 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { useMemo, useState, useId } from "react";
+import { useMemo, useState, useEffect, useId } from "react";
 import { c as combineClassNames } from "./classNames-AS8QjFq7.js";
 import { c as capitalize } from "./capitalize-C0TSQSPh.js";
 import { a as getDefaultRounding, b as getDefaultShadow, c as getDefaultSize, d as getDefaultTheme } from "./boreal-style-config-DsaRlxmw.js";
@@ -27,6 +27,13 @@ const AccordionBase = ({
   className = "",
   getUniqueId,
   classMap,
+  regionAriaLabel,
+  regionAriaLabelledBy,
+  regionAriaDescribedBy,
+  loadingAriaLabel,
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledBy,
+  "aria-describedby": ariaDescribedBy,
   "data-testid": testId = "accordion",
   ...rest
 }) => {
@@ -36,9 +43,17 @@ const AccordionBase = ({
   const [hasBeenExpanded, setHasBeenExpanded] = useState(initiallyExpanded);
   const [isLoading, setIsLoading] = useState(asyncContent && initiallyExpanded);
   const isExpanded = isControlled ? expanded2 : internalExpanded;
-  const contentId = `${id || internalId}-content`;
-  const buttonId = `${id || internalId}-button`;
-  const descId = description ? `${id || internalId}-desc` : void 0;
+  const baseId = id || internalId;
+  const contentId = `${baseId}-content`;
+  const buttonId = `${baseId}-button`;
+  const descId = description ? `${baseId}-desc` : void 0;
+  const loadingId = `${baseId}-loading`;
+  const buttonDescribedBy = [descId, ariaDescribedBy].filter(Boolean).join(" ") || void 0;
+  const regionLabelledBy = regionAriaLabelledBy || (!regionAriaLabel ? buttonId : void 0);
+  const regionDescribedBy = [
+    regionAriaDescribedBy,
+    asyncContent && isExpanded && isLoading ? loadingId : void 0
+  ].filter(Boolean).join(" ") || void 0;
   const toggleAccordion = () => {
     if (disabled2) return;
     if (!isToggleable && isExpanded) return;
@@ -55,19 +70,21 @@ const AccordionBase = ({
       toggleAccordion();
     }
   };
-  useMemo(() => {
+  useEffect(() => {
     if (isExpanded && !hasBeenExpanded) {
       setHasBeenExpanded(true);
     }
-  }, [isExpanded]);
-  useMemo(() => {
-    if (asyncContent && isExpanded && isLoading) {
+  }, [isExpanded, hasBeenExpanded]);
+  useEffect(() => {
+    if (asyncContent && isExpanded) {
+      setIsLoading(true);
       const timer = setTimeout(() => {
         setIsLoading(false);
       }, 1e3);
       return () => clearTimeout(timer);
     }
-  }, [asyncContent, isExpanded, isLoading]);
+    return void 0;
+  }, [asyncContent, isExpanded]);
   const renderedIcon = isExpanded ? customExpandedIcon ?? "−" : customCollapsedIcon ?? "+";
   const wrapperClassName = useMemo(
     () => combineClassNames(
@@ -80,7 +97,7 @@ const AccordionBase = ({
       isExpanded && classMap.expanded,
       className
     ),
-    [classMap, size, disabled2, isExpanded, className]
+    [classMap, size, state, shadow, rounding, disabled2, isExpanded, className]
   );
   const headerClassName = useMemo(
     () => combineClassNames(
@@ -91,7 +108,7 @@ const AccordionBase = ({
       disabled2 && classMap.disabled,
       isExpanded && classMap.expanded
     ),
-    [classMap, isExpanded]
+    [classMap, theme, state, outline2, disabled2, isExpanded]
   );
   const contentClassName = useMemo(
     () => combineClassNames(classMap.content, isExpanded && classMap.expanded),
@@ -112,8 +129,10 @@ const AccordionBase = ({
         type: "button",
         "aria-expanded": isExpanded,
         "aria-controls": contentId,
-        "aria-disabled": disabled2,
-        "aria-describedby": descId,
+        "aria-disabled": disabled2 || void 0,
+        "aria-label": ariaLabel,
+        "aria-labelledby": ariaLabelledBy,
+        "aria-describedby": buttonDescribedBy,
         tabIndex: disabled2 ? -1 : 0,
         disabled: disabled2,
         "data-testid": testId ? `${testId}-accordion-toggle` : void 0,
@@ -161,12 +180,25 @@ const AccordionBase = ({
       {
         id: contentId,
         role: "region",
-        "aria-labelledby": buttonId,
+        "aria-label": regionAriaLabel,
+        "aria-labelledby": regionLabelledBy,
+        "aria-describedby": regionDescribedBy,
+        "aria-busy": asyncContent && isExpanded && isLoading ? true : void 0,
         className: contentClassName,
         "data-state": isExpanded ? "open" : "collapsed",
         "data-testid": testId ? `${testId}-content` : void 0,
         children: [
-          isExpanded && asyncContent && isLoading && /* @__PURE__ */ jsx("div", { className: classMap.loading, children: "Loading..." }),
+          isExpanded && asyncContent && isLoading && /* @__PURE__ */ jsx(
+            "div",
+            {
+              id: loadingId,
+              className: classMap.loading,
+              "aria-live": "polite",
+              "aria-atomic": "true",
+              "data-testid": testId ? `${testId}-loading` : void 0,
+              children: loadingAriaLabel || "Loading content"
+            }
+          ),
           (!lazyLoad || hasBeenExpanded) && (!asyncContent || !isLoading) && children
         ]
       }
@@ -276,4 +308,4 @@ Accordion.displayName = "Accordion";
 export {
   Accordion as A
 };
-//# sourceMappingURL=Accordion-B6n350De.js.map
+//# sourceMappingURL=Accordion-Bg8V6T38.js.map

package/dist/next/Accordion-Bg8V6T38.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Accordion-Bg8V6T38.js","sources":["../../src/components/Accordion/AccordionBase.tsx","../../src/components/Accordion/next/Accordion.tsx"],"sourcesContent":["import React, { useMemo, useState, KeyboardEvent, useEffect } from \"react\";\r\nimport { AccordionProps } from \"./Accordion.types\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n  getDefaultRounding,\r\n  getDefaultShadow,\r\n  getDefaultSize,\r\n  getDefaultTheme,\r\n} from \"../../config/boreal-style-config\";\r\n\r\nexport interface AccordionBaseProps extends AccordionProps {\r\n  getUniqueId: () => string;\r\n  classMap: Record<string, string>;\r\n}\r\n\r\nexport const AccordionBase: React.FC<AccordionBaseProps> = ({\r\n  title,\r\n  id,\r\n  children,\r\n  lazyLoad = false,\r\n  iconPosition = \"right\",\r\n  isToggleable = true,\r\n  asyncContent = false,\r\n  rounding = getDefaultRounding(),\r\n  shadow = getDefaultShadow(),\r\n  description,\r\n  size = getDefaultSize(),\r\n  theme = getDefaultTheme(),\r\n  state = \"\",\r\n  outline = false,\r\n  expanded,\r\n  disabled,\r\n  customCollapsedIcon,\r\n  customExpandedIcon,\r\n  onToggle,\r\n  initiallyExpanded = false,\r\n  className = \"\",\r\n  getUniqueId,\r\n  classMap,\r\n  regionAriaLabel,\r\n  regionAriaLabelledBy,\r\n  regionAriaDescribedBy,\r\n  loadingAriaLabel,\r\n  \"aria-label\": ariaLabel,\r\n  \"aria-labelledby\": ariaLabelledBy,\r\n  \"aria-describedby\": ariaDescribedBy,\r\n  \"data-testid\": testId = \"accordion\",\r\n  ...rest\r\n}) => {\r\n  const isControlled = expanded !== undefined;\r\n  const internalId = useMemo(getUniqueId, []);\r\n  const [internalExpanded, setInternalExpanded] = useState(initiallyExpanded);\r\n  const [hasBeenExpanded, setHasBeenExpanded] = useState(initiallyExpanded);\r\n  const [isLoading, setIsLoading] = useState(asyncContent && initiallyExpanded);\r\n\r\n  const isExpanded = isControlled ? expanded : internalExpanded;\r\n\r\n  const baseId = id || internalId;\r\n  const contentId = `${baseId}-content`;\r\n  const buttonId = `${baseId}-button`;\r\n  const descId = description ? `${baseId}-desc` : undefined;\r\n  const loadingId = `${baseId}-loading`;\r\n\r\n  const buttonDescribedBy =\r\n    [descId, ariaDescribedBy].filter(Boolean).join(\" \") || undefined;\r\n\r\n  const regionLabelledBy =\r\n    regionAriaLabelledBy || (!regionAriaLabel ? buttonId : undefined);\r\n\r\n  const regionDescribedBy =\r\n    [\r\n      regionAriaDescribedBy,\r\n      asyncContent && isExpanded && isLoading ? loadingId : undefined,\r\n    ]\r\n      .filter(Boolean)\r\n      .join(\" \") || undefined;\r\n\r\n  const toggleAccordion = () => {\r\n    if (disabled) return;\r\n    if (!isToggleable && isExpanded) return;\r\n\r\n    if (isControlled) {\r\n      onToggle?.(!expanded);\r\n    } else {\r\n      setInternalExpanded((prev) => !prev);\r\n    }\r\n  };\r\n\r\n  const handleKeyDown = (e: KeyboardEvent<HTMLButtonElement>) => {\r\n    if (disabled) return;\r\n\r\n    if (e.key === \"Enter\" || e.key === \" \") {\r\n      e.preventDefault();\r\n      toggleAccordion();\r\n    }\r\n  };\r\n\r\n  useEffect(() => {\r\n    if (isExpanded && !hasBeenExpanded) {\r\n      setHasBeenExpanded(true);\r\n    }\r\n  }, [isExpanded, hasBeenExpanded]);\r\n\r\n  useEffect(() => {\r\n    if (asyncContent && isExpanded) {\r\n      setIsLoading(true);\r\n\r\n      const timer = setTimeout(() => {\r\n        setIsLoading(false);\r\n      }, 1000);\r\n\r\n      return () => clearTimeout(timer);\r\n    }\r\n\r\n    return undefined;\r\n  }, [asyncContent, isExpanded]);\r\n\r\n  const renderedIcon = isExpanded\r\n    ? (customExpandedIcon ?? \"−\")\r\n    : (customCollapsedIcon ?? \"+\");\r\n\r\n  const wrapperClassName = useMemo(\r\n    () =>\r\n      combineClassNames(\r\n        classMap.accordion,\r\n        classMap[size],\r\n        classMap[state],\r\n        shadow && classMap[`shadow${capitalize(shadow)}`],\r\n        rounding && classMap[`round${capitalize(rounding)}`],\r\n        disabled && classMap.disabled,\r\n        isExpanded && classMap.expanded,\r\n        className,\r\n      ),\r\n    [classMap, size, state, shadow, rounding, disabled, isExpanded, className],\r\n  );\r\n\r\n  const headerClassName = useMemo(\r\n    () =>\r\n      combineClassNames(\r\n        classMap.header,\r\n        classMap[theme],\r\n        classMap[state],\r\n        outline && classMap.outline,\r\n        disabled && classMap.disabled,\r\n        isExpanded && classMap.expanded,\r\n      ),\r\n    [classMap, theme, state, outline, disabled, isExpanded],\r\n  );\r\n\r\n  const contentClassName = useMemo(\r\n    () => combineClassNames(classMap.content, isExpanded && classMap.expanded),\r\n    [classMap, isExpanded],\r\n  );\r\n\r\n  const iconClassName = useMemo(\r\n    () => combineClassNames(classMap.icon, isExpanded && classMap.expanded),\r\n    [classMap, isExpanded],\r\n  );\r\n\r\n  return (\r\n    <div {...rest} className={wrapperClassName}>\r\n      <button\r\n        id={buttonId}\r\n        className={headerClassName}\r\n        onClick={toggleAccordion}\r\n        onKeyDown={handleKeyDown}\r\n        type=\"button\"\r\n        aria-expanded={isExpanded}\r\n        aria-controls={contentId}\r\n        aria-disabled={disabled || undefined}\r\n        aria-label={ariaLabel}\r\n        aria-labelledby={ariaLabelledBy}\r\n        aria-describedby={buttonDescribedBy}\r\n        tabIndex={disabled ? -1 : 0}\r\n        disabled={disabled}\r\n        data-testid={testId ? `${testId}-accordion-toggle` : undefined}\r\n      >\r\n        {iconPosition === \"left\" && (\r\n          <span\r\n            className={iconClassName}\r\n            aria-hidden=\"true\"\r\n            data-testid={testId ? `${testId}-icon` : undefined}\r\n          >\r\n            {renderedIcon}\r\n          </span>\r\n        )}\r\n\r\n        <span\r\n          className={classMap.accordionTitle}\r\n          data-testid={testId ? `${testId}-title` : undefined}\r\n        >\r\n          {title}\r\n        </span>\r\n\r\n        {iconPosition === \"right\" && (\r\n          <span\r\n            className={iconClassName}\r\n            aria-hidden=\"true\"\r\n            data-testid={testId ? `${testId}-icon` : undefined}\r\n          >\r\n            {renderedIcon}\r\n          </span>\r\n        )}\r\n      </button>\r\n\r\n      {description && (\r\n        <span\r\n          id={descId}\r\n          className=\"sr_only\"\r\n          data-testid={testId ? `${testId}-description` : undefined}\r\n        >\r\n          {description}\r\n        </span>\r\n      )}\r\n\r\n      <div\r\n        id={contentId}\r\n        role=\"region\"\r\n        aria-label={regionAriaLabel}\r\n        aria-labelledby={regionLabelledBy}\r\n        aria-describedby={regionDescribedBy}\r\n        aria-busy={asyncContent && isExpanded && isLoading ? true : undefined}\r\n        className={contentClassName}\r\n        data-state={isExpanded ? \"open\" : \"collapsed\"}\r\n        data-testid={testId ? `${testId}-content` : undefined}\r\n      >\r\n        {isExpanded && asyncContent && isLoading && (\r\n          <div\r\n            id={loadingId}\r\n            className={classMap.loading}\r\n            aria-live=\"polite\"\r\n            aria-atomic=\"true\"\r\n            data-testid={testId ? `${testId}-loading` : undefined}\r\n          >\r\n            {loadingAriaLabel || \"Loading content\"}\r\n          </div>\r\n        )}\r\n\r\n        {(!lazyLoad || hasBeenExpanded) &&\r\n          (!asyncContent || !isLoading) &&\r\n          children}\r\n      </div>\r\n    </div>\r\n  );\r\n};\r\n\r\nAccordionBase.displayName = \"AccordionBase\";\r\n","\"use client\";\r\n\r\nimport React, { useId } from \"react\";\r\nimport { AccordionBase } from \"../AccordionBase\";\r\nimport type { AccordionProps } from \"../Accordion.types\";\r\nimport styles from \"./Accordion.module.scss\";\r\n\r\nconst Accordion: React.FC<AccordionProps> = (props) => {\r\n  const id = useId();\r\n  const getUniqueId = () => `accordion-${id}`;\r\n\r\n  return (\r\n    <AccordionBase {...props} getUniqueId={getUniqueId} classMap={styles} />\r\n  );\r\n};\r\nAccordion.displayName = \"Accordion\";\r\nexport default Accordion;\r\n"],"names":["title","outline","expanded","disabled"],"mappings":"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"}

package/dist/next/Accordion.cjs.js

@@ -1,4 +1,4 @@
 "use strict";
-const Accordion = require("./Accordion-D9pe1F_C.cjs");
+const Accordion = require("./Accordion-BEa1jxTt.cjs");
 module.exports = Accordion.Accordion;
 //# sourceMappingURL=Accordion.cjs.js.map