boreal-ui 0.0.31 → 0.0.33

package/dist/next/{Sidebar-C_zefcbg.cjs → Sidebar-CbQ4ssz-.cjs}

@@ -26,17 +26,40 @@ const SidebarBase = ({
   ...rest
 }) => {
   const [openItems, setOpenItems] = React.useState({});
-  const toggleItem = (key) => {
-    setOpenItems((prev) => ({ ...prev, [key]: !prev[key] }));
+  const idsRef = React.useRef({});
+  const seqRef = React.useRef(0);
+  const idFor = (label) => {
+    if (!idsRef.current[label]) {
+      const slug = label.toLowerCase().replace(/\s+/g, "-").replace(/[^a-z0-9_-]/g, "");
+      idsRef.current[label] = `${testId}-section-${slug}-${seqRef.current++}`;
+    }
+    return idsRef.current[label];
   };
+  React.useEffect(() => {
+    const next = {};
+    const walk = (nodes) => {
+      var _a;
+      for (const n of nodes) {
+        if ((_a = n.children) == null ? void 0 : _a.length) {
+          const anyChildActive = n.children.some((c) => c.href && c.href === currentPath) || n.children && walk(n.children);
+          if (anyChildActive) next[n.label] = true;
+        }
+      }
+      return nodes.some(
+        (n) => {
+          var _a2;
+          return n.href && n.href === currentPath || !!((_a2 = n.children) == null ? void 0 : _a2.length) && n.children.some((c) => c.href === currentPath);
+        }
+      );
+    };
+    walk(links);
+    setOpenItems((prev) => ({ ...prev, ...next }));
+  }, [currentPath, links]);
+  const toggleItem = (key) => setOpenItems((prev) => ({ ...prev, [key]: !prev[key] }));
   const submenuRefs = React.useRef({});
   const setSubmenuRef = (key, el) => {
     submenuRefs.current[key] = el;
   };
-  const getSubmenuHeight = (key) => {
-    const el = submenuRefs.current[key];
-    return el ? `${el.scrollHeight}px` : "0px";
-  };
   const containerClasses = React.useMemo(
     () => classNames.combineClassNames(
       classMap.wrapper,
@@ -45,49 +68,57 @@ const SidebarBase = ({
       classMap[state],
       shadow && classMap[`shadow${capitalize.capitalize(shadow)}`],
       rounding && classMap[`round${capitalize.capitalize(rounding)}`],
-      outline2 ? classMap.outline : ""
+      outline2 && classMap.outline
     ),
-    [className, theme, state, outline2, rounding, shadow]
+    [classMap, className, theme, state, outline2, rounding, shadow]
   );
   const renderLinks = (items, isChild = false) => /* @__PURE__ */ require$$2.jsx(
     "ul",
     {
       className: classNames.combineClassNames(
         classMap.list,
-        isChild ? classMap.childList : ""
+        isChild && classMap.childList
       ),
       "data-testid": `${testId}-list`,
-      children: items.map(({ label, href, children, icon }) => {
-        const isActive = href && currentPath === href;
-        const isOpen = openItems[label] || false;
+      children: items.map(({ label, href, children, icon }, idx) => {
+        const key = `${label}-${idx}`;
+        const isActive = !!href && currentPath === href;
+        const isOpen = !!openItems[label];
+        const sectionId = idFor(label);
+        const buttonId = `${sectionId}-button`;
+        const panelId = `${sectionId}-panel`;
         return /* @__PURE__ */ require$$2.jsx(
           "li",
           {
             className: classMap.item,
-            "data-testid": `${testId}-listItems`,
+            "data-testid": `${testId}-listItem`,
             children: children && children.length > 0 ? /* @__PURE__ */ require$$2.jsxs(require$$2.Fragment, { children: [
               /* @__PURE__ */ require$$2.jsxs(
                 "button",
                 {
                   type: "button",
+                  id: buttonId,
                   className: classNames.combineClassNames(
                     classMap.link,
-                    isOpen ? classMap.active : ""
+                    isOpen && classMap.active
                   ),
                   onClick: () => toggleItem(label),
                   "aria-expanded": isOpen,
-                  "data-testid": `${testId}-exapndItemButton`,
+                  "aria-controls": panelId,
+                  "data-testid": `${testId}-expandItemButton`,
                   children: [
                     icon && /* @__PURE__ */ require$$2.jsx("span", { className: classMap.icon, children: icon }),
-                    /* @__PURE__ */ require$$2.jsx("span", { "data-testid": `${testId}-exapndItemLabel`, children: label }),
+                    /* @__PURE__ */ require$$2.jsx("span", { "data-testid": `${testId}-expandItemLabel`, children: label }),
                     /* @__PURE__ */ require$$2.jsx(
                       CheveronDownIcon.ChevronDownIcon,
                       {
                         className: classNames.combineClassNames(
                           classMap.chevron,
-                          isOpen ? classMap.chevronOpen : ""
+                          isOpen && classMap.chevronOpen
                         ),
-                        "data-testid": `${testId}-exapndIcon`
+                        "aria-hidden": "true",
+                        focusable: false,
+                        "data-testid": `${testId}-expandIcon`
                       }
                     )
                   ]
@@ -96,14 +127,15 @@ const SidebarBase = ({
               /* @__PURE__ */ require$$2.jsx(
                 "div",
                 {
+                  id: panelId,
                   ref: (el) => setSubmenuRef(label, el),
                   className: classNames.combineClassNames(
                     classMap.submenu,
-                    isOpen ? classMap.submenuOpen : ""
+                    isOpen && classMap.submenuOpen
                   ),
-                  style: {
-                    maxHeight: isOpen ? getSubmenuHeight(label) : "0px"
-                  },
+                  role: "group",
+                  "aria-labelledby": buttonId,
+                  hidden: !isOpen,
                   "data-testid": `${testId}-subMenu`,
                   children: renderLinks(children, true)
                 }
@@ -114,8 +146,8 @@ const SidebarBase = ({
                 href,
                 className: classNames.combineClassNames(
                   classMap.link,
-                  isChild ? classMap.childLink : "",
-                  isActive ? classMap.active : ""
+                  isChild && classMap.childLink,
+                  isActive && classMap.active
                 ),
                 "aria-current": isActive ? "page" : void 0,
                 "data-testid": `${testId}-sidebarLink`,
@@ -129,7 +161,7 @@ const SidebarBase = ({
               {
                 className: classNames.combineClassNames(
                   classMap.link,
-                  isChild ? classMap.childLink : ""
+                  isChild && classMap.childLink
                 ),
                 "data-testid": `${testId}-sidebarLabel`,
                 children: [
@@ -139,7 +171,7 @@ const SidebarBase = ({
               }
             )
           },
-          label
+          key
         );
       })
     }
@@ -149,12 +181,12 @@ const SidebarBase = ({
     {
       className: containerClasses,
       "aria-label": ariaLabel,
-      ...rest,
       "data-testid": testId,
+      ...rest,
       children: [
-        /* @__PURE__ */ require$$2.jsx("nav", { className: classMap.nav, children: renderLinks(links) }),
+        /* @__PURE__ */ require$$2.jsx("div", { className: classMap.nav, children: renderLinks(links) }),
         showFooter && /* @__PURE__ */ require$$2.jsxs("footer", { className: classMap.footer, "data-testid": `${testId}-footer`, children: [
-          footerLinks == null ? void 0 : footerLinks.map(({ label, href }) => /* @__PURE__ */ require$$2.jsx(
+          footerLinks == null ? void 0 : footerLinks.map(({ label, href }, i) => /* @__PURE__ */ require$$2.jsx(
             LinkComponent,
             {
               href,
@@ -162,7 +194,7 @@ const SidebarBase = ({
               "data-testid": `${testId}-footerLink`,
               children: label
             },
-            label
+            `${label}-${i}`
           )),
           footerVersion2 && /* @__PURE__ */ require$$2.jsx(
             "span",
@@ -178,45 +210,46 @@ const SidebarBase = ({
   );
 };
 SidebarBase.displayName = "SidebarBase";
-const noScroll = "_noScroll_4zh9d_91";
-const errorMessage = "_errorMessage_4zh9d_92";
-const loadingContainer = "_loadingContainer_4zh9d_93";
-const hideScrollbar = "_hideScrollbar_4zh9d_85";
-const sr_only = "_sr_only_4zh9d_94";
-const wrapper = "_wrapper_4zh9d_539";
-const roundNone = "_roundNone_4zh9d_550";
-const roundSmall = "_roundSmall_4zh9d_553";
-const roundMedium = "_roundMedium_4zh9d_556";
-const roundLarge = "_roundLarge_4zh9d_559";
-const roundFull = "_roundFull_4zh9d_562";
-const shadowNone = "_shadowNone_4zh9d_565";
-const shadowLight = "_shadowLight_4zh9d_568";
-const shadowMedium = "_shadowMedium_4zh9d_571";
-const shadowStrong = "_shadowStrong_4zh9d_574";
-const shadowIntense = "_shadowIntense_4zh9d_577";
-const primary = "_primary_4zh9d_581";
-const active = "_active_4zh9d_581";
-const outline = "_outline_4zh9d_585";
-const clear = "_clear_4zh9d_590";
-const secondary = "_secondary_4zh9d_594";
-const tertiary = "_tertiary_4zh9d_607";
-const quaternary = "_quaternary_4zh9d_620";
-const success = "_success_4zh9d_648";
-const error = "_error_4zh9d_92";
-const warning = "_warning_4zh9d_662";
-const nav = "_nav_4zh9d_669";
-const list = "_list_4zh9d_674";
-const link = "_link_4zh9d_680";
-const childLink = "_childLink_4zh9d_710";
-const chevron = "_chevron_4zh9d_714";
-const chevronOpen = "_chevronOpen_4zh9d_718";
-const submenu = "_submenu_4zh9d_722";
-const childList = "_childList_4zh9d_728";
-const footer = "_footer_4zh9d_733";
-const footerLink = "_footerLink_4zh9d_745";
-const footerVersion = "_footerVersion_4zh9d_753";
-const spin = "_spin_4zh9d_1";
-const pulse = "_pulse_4zh9d_1";
+const noScroll = "_noScroll_152fr_91";
+const errorMessage = "_errorMessage_152fr_92";
+const loadingContainer = "_loadingContainer_152fr_93";
+const hideScrollbar = "_hideScrollbar_152fr_85";
+const sr_only = "_sr_only_152fr_94";
+const wrapper = "_wrapper_152fr_540";
+const roundNone = "_roundNone_152fr_550";
+const roundSmall = "_roundSmall_152fr_553";
+const roundMedium = "_roundMedium_152fr_556";
+const roundLarge = "_roundLarge_152fr_559";
+const roundFull = "_roundFull_152fr_562";
+const shadowNone = "_shadowNone_152fr_565";
+const shadowLight = "_shadowLight_152fr_568";
+const shadowMedium = "_shadowMedium_152fr_571";
+const shadowStrong = "_shadowStrong_152fr_574";
+const shadowIntense = "_shadowIntense_152fr_577";
+const primary = "_primary_152fr_581";
+const active = "_active_152fr_581";
+const outline = "_outline_152fr_585";
+const clear = "_clear_152fr_590";
+const secondary = "_secondary_152fr_594";
+const tertiary = "_tertiary_152fr_607";
+const quaternary = "_quaternary_152fr_620";
+const success = "_success_152fr_648";
+const error = "_error_152fr_92";
+const warning = "_warning_152fr_662";
+const nav = "_nav_152fr_669";
+const list = "_list_152fr_674";
+const link = "_link_152fr_680";
+const childLink = "_childLink_152fr_710";
+const chevron = "_chevron_152fr_714";
+const chevronOpen = "_chevronOpen_152fr_718";
+const submenu = "_submenu_152fr_722";
+const submenuOpen = "_submenuOpen_152fr_728";
+const childList = "_childList_152fr_732";
+const footer = "_footer_152fr_737";
+const footerLink = "_footerLink_152fr_749";
+const footerVersion = "_footerVersion_152fr_757";
+const spin = "_spin_152fr_1";
+const pulse = "_pulse_152fr_1";
 const styles = {
   noScroll,
   errorMessage,
@@ -251,19 +284,20 @@ const styles = {
   chevron,
   chevronOpen,
   submenu,
+  submenuOpen,
   childList,
   footer,
   footerLink,
   footerVersion,
-  "fade-in": "_fade-in_4zh9d_1",
-  "slide-up": "_slide-up_4zh9d_1",
-  "spin-3d": "_spin-3d_4zh9d_1",
+  "fade-in": "_fade-in_152fr_1",
+  "slide-up": "_slide-up_152fr_1",
+  "spin-3d": "_spin-3d_152fr_1",
   spin,
   pulse,
-  "fade-in-up": "_fade-in-up_4zh9d_1",
-  "progress-grow": "_progress-grow_4zh9d_1",
-  "indeterminate-move": "_indeterminate-move_4zh9d_1",
-  "skeleton-loading": "_skeleton-loading_4zh9d_1"
+  "fade-in-up": "_fade-in-up_152fr_1",
+  "progress-grow": "_progress-grow_152fr_1",
+  "indeterminate-move": "_indeterminate-move_152fr_1",
+  "skeleton-loading": "_skeleton-loading_152fr_1"
 };
 const Sidebar = ({ links, ...rest }) => {
   const currentPath = navigation.navigation.usePathname();
@@ -281,4 +315,4 @@ const Sidebar = ({ links, ...rest }) => {
   );
 };
 exports.Sidebar = Sidebar;
-//# sourceMappingURL=Sidebar-C_zefcbg.cjs.map
+//# sourceMappingURL=Sidebar-CbQ4ssz-.cjs.map

package/dist/next/Sidebar-CbQ4ssz-.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Sidebar-CbQ4ssz-.cjs","sources":["../../src/components/Sidebar/SidebarBase.tsx","../../src/components/Sidebar/next/Sidebar.tsx"],"sourcesContent":["import React, { useState, useMemo, useRef, useEffect } from \"react\";\r\nimport { combineClassNames } from \"@/utils/classNames\";\r\nimport {\r\n  getDefaultRounding,\r\n  getDefaultShadow,\r\n  getDefaultTheme,\r\n} from \"@/config/boreal-style-config\";\r\nimport { capitalize } from \"@/utils/capitalize\";\r\nimport { ChevronDownIcon } from \"@/Icons\";\r\nimport { BaseSidebarProps } from \"./Sidebar.types\";\r\n\r\nconst SidebarBase: React.FC<BaseSidebarProps> = ({\r\n  links,\r\n  classMap,\r\n  currentPath,\r\n  LinkComponent = \"a\",\r\n  theme = getDefaultTheme(),\r\n  rounding = getDefaultRounding(),\r\n  shadow = getDefaultShadow(),\r\n  state = \"\",\r\n  showFooter = false,\r\n  footerLinks,\r\n  footerVersion,\r\n  outline = false,\r\n  className = \"\",\r\n  \"data-testid\": testId = \"sidebar\",\r\n  ariaLabel = \"Sidebar navigation\",\r\n  ...rest\r\n}) => {\r\n  const [openItems, setOpenItems] = useState<Record<string, boolean>>({});\r\n\r\n  const idsRef = useRef<Record<string, string>>({});\r\n  const seqRef = useRef(0);\r\n  const idFor = (label: string) => {\r\n    if (!idsRef.current[label]) {\r\n      const slug = label\r\n        .toLowerCase()\r\n        .replace(/\\s+/g, \"-\")\r\n        .replace(/[^a-z0-9_-]/g, \"\");\r\n      idsRef.current[label] = `${testId}-section-${slug}-${seqRef.current++}`;\r\n    }\r\n    return idsRef.current[label];\r\n  };\r\n\r\n  useEffect(() => {\r\n    const next: Record<string, boolean> = {};\r\n\r\n    const walk = (nodes: typeof links) => {\r\n      for (const n of nodes) {\r\n        if (n.children?.length) {\r\n          const anyChildActive =\r\n            n.children.some((c) => c.href && c.href === currentPath) ||\r\n            (n.children && walk(n.children));\r\n          if (anyChildActive) next[n.label] = true;\r\n        }\r\n      }\r\n      return nodes.some(\r\n        (n) =>\r\n          (n.href && n.href === currentPath) ||\r\n          (!!n.children?.length &&\r\n            n.children!.some((c) => c.href === currentPath))\r\n      );\r\n    };\r\n\r\n    walk(links);\r\n    setOpenItems((prev) => ({ ...prev, ...next }));\r\n  }, [currentPath, links]);\r\n\r\n  const toggleItem = (key: string) =>\r\n    setOpenItems((prev) => ({ ...prev, [key]: !prev[key] }));\r\n\r\n  const submenuRefs = useRef<Record<string, HTMLDivElement | null>>({});\r\n  const setSubmenuRef = (key: string, el: HTMLDivElement | null) => {\r\n    submenuRefs.current[key] = el;\r\n  };\r\n  const getSubmenuHeight = (key: string) => {\r\n    const el = submenuRefs.current[key];\r\n    return el ? `${el.scrollHeight}px` : \"0px\";\r\n  };\r\n\r\n  const containerClasses = useMemo(\r\n    () =>\r\n      combineClassNames(\r\n        classMap.wrapper,\r\n        className,\r\n        classMap[theme],\r\n        classMap[state],\r\n        shadow && classMap[`shadow${capitalize(shadow)}`],\r\n        rounding && classMap[`round${capitalize(rounding)}`],\r\n        outline && classMap.outline\r\n      ),\r\n    [classMap, className, theme, state, outline, rounding, shadow]\r\n  );\r\n\r\n  const renderLinks = (items: typeof links, isChild = false) => (\r\n    <ul\r\n      className={combineClassNames(\r\n        classMap.list,\r\n        isChild && classMap.childList\r\n      )}\r\n      data-testid={`${testId}-list`}\r\n    >\r\n      {items.map(({ label, href, children, icon }, idx) => {\r\n        const key = `${label}-${idx}`;\r\n        const isActive = !!href && currentPath === href;\r\n        const isOpen = !!openItems[label];\r\n        const sectionId = idFor(label);\r\n        const buttonId = `${sectionId}-button`;\r\n        const panelId = `${sectionId}-panel`;\r\n\r\n        return (\r\n          <li\r\n            key={key}\r\n            className={classMap.item}\r\n            data-testid={`${testId}-listItem`}\r\n          >\r\n            {children && children.length > 0 ? (\r\n              <>\r\n                <button\r\n                  type=\"button\"\r\n                  id={buttonId}\r\n                  className={combineClassNames(\r\n                    classMap.link,\r\n                    isOpen && classMap.active\r\n                  )}\r\n                  onClick={() => toggleItem(label)}\r\n                  aria-expanded={isOpen}\r\n                  aria-controls={panelId}\r\n                  data-testid={`${testId}-expandItemButton`}\r\n                >\r\n                  {icon && <span className={classMap.icon}>{icon}</span>}\r\n                  <span data-testid={`${testId}-expandItemLabel`}>{label}</span>\r\n                  <ChevronDownIcon\r\n                    className={combineClassNames(\r\n                      classMap.chevron,\r\n                      isOpen && classMap.chevronOpen\r\n                    )}\r\n                    aria-hidden=\"true\"\r\n                    focusable={false}\r\n                    data-testid={`${testId}-expandIcon`}\r\n                  />\r\n                </button>\r\n\r\n                <div\r\n                  id={panelId}\r\n                  ref={(el) => setSubmenuRef(label, el)}\r\n                  className={combineClassNames(\r\n                    classMap.submenu,\r\n                    isOpen && classMap.submenuOpen\r\n                  )}\r\n                  role=\"group\"\r\n                  aria-labelledby={buttonId}\r\n                  hidden={!isOpen}\r\n                  data-testid={`${testId}-subMenu`}\r\n                >\r\n                  {renderLinks(children, true)}\r\n                </div>\r\n              </>\r\n            ) : href ? (\r\n              <LinkComponent\r\n                href={href}\r\n                className={combineClassNames(\r\n                  classMap.link,\r\n                  isChild && classMap.childLink,\r\n                  isActive && classMap.active\r\n                )}\r\n                aria-current={isActive ? \"page\" : undefined}\r\n                data-testid={`${testId}-sidebarLink`}\r\n              >\r\n                {icon && <span className={classMap.icon}>{icon}</span>}\r\n                {label}\r\n              </LinkComponent>\r\n            ) : (\r\n              <span\r\n                className={combineClassNames(\r\n                  classMap.link,\r\n                  isChild && classMap.childLink\r\n                )}\r\n                data-testid={`${testId}-sidebarLabel`}\r\n              >\r\n                {icon && <span className={classMap.icon}>{icon}</span>}\r\n                {label}\r\n              </span>\r\n            )}\r\n          </li>\r\n        );\r\n      })}\r\n    </ul>\r\n  );\r\n\r\n  return (\r\n    <nav\r\n      className={containerClasses}\r\n      aria-label={ariaLabel}\r\n      data-testid={testId}\r\n      {...rest}\r\n    >\r\n      <div className={classMap.nav}>{renderLinks(links)}</div>\r\n\r\n      {showFooter && (\r\n        <footer className={classMap.footer} data-testid={`${testId}-footer`}>\r\n          {footerLinks?.map(({ label, href }, i) => (\r\n            <LinkComponent\r\n              key={`${label}-${i}`}\r\n              href={href}\r\n              className={classMap.footerLink}\r\n              data-testid={`${testId}-footerLink`}\r\n            >\r\n              {label}\r\n            </LinkComponent>\r\n          ))}\r\n          {footerVersion && (\r\n            <span\r\n              className={classMap.footerVersion}\r\n              data-testid={`${testId}-footerVersion`}\r\n            >\r\n              {footerVersion}\r\n            </span>\r\n          )}\r\n        </footer>\r\n      )}\r\n    </nav>\r\n  );\r\n};\r\n\r\nSidebarBase.displayName = \"SidebarBase\";\r\nexport default SidebarBase;\r\n","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport Link from \"next/link\";\r\nimport { usePathname } from \"next/navigation\";\r\nimport SidebarBase from \"../SidebarBase\";\r\nimport styles from \"./Sidebar.module.scss\";\r\nimport { SidebarProps } from \"../Sidebar.types\";\r\n\r\nconst Sidebar: React.FC<SidebarProps> = ({ links, ...rest }) => {\r\n  const currentPath = usePathname();\r\n\r\n  const { currentPath: _ignored, ...safeRest } = rest;\r\n\r\n  return (\r\n    <SidebarBase\r\n      links={links}\r\n      classMap={styles}\r\n      currentPath={currentPath}\r\n      LinkComponent={Link}\r\n      key={currentPath}\r\n      {...safeRest}\r\n    />\r\n  );\r\n};\r\n\r\nexport default Sidebar;\r\n"],"names":["getDefaultTheme","getDefaultRounding","getDefaultShadow","footerVersion","outline","useState","useRef","useEffect","_a","useMemo","combineClassNames","capitalize","jsx","jsxs","Fragment","ChevronDownIcon","usePathname","Link"],"mappings":"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"}

package/dist/next/Sidebar.cjs.js

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

package/dist/next/Sidebar.js

@@ -1,4 +1,4 @@
-import { S } from "./Sidebar-R1NSvWHu.js";
+import { S } from "./Sidebar-C6NbdjWV.js";
 export {
   S as default
 };

package/dist/next/Skeleton-BCbvshNz.cjs

@@ -0,0 +1,116 @@
+"use strict";
+const require$$2 = require("react/jsx-runtime");
+const React = require("react");
+const classNames = require("./classNames-BcWMx052.cjs");
+const capitalize = require("./capitalize-DoV-nOmN.cjs");
+const borealStyleConfig = require("./boreal-style-config-Rr5d5Qts.cjs");
+const noScroll = "_noScroll_1f6g8_91";
+const errorMessage = "_errorMessage_1f6g8_92";
+const loadingContainer = "_loadingContainer_1f6g8_93";
+const hideScrollbar = "_hideScrollbar_1f6g8_85";
+const sr_only = "_sr_only_1f6g8_94";
+const skeletonLoader = "_skeletonLoader_1f6g8_540";
+const roundNone = "_roundNone_1f6g8_557";
+const roundSmall = "_roundSmall_1f6g8_561";
+const roundMedium = "_roundMedium_1f6g8_565";
+const roundLarge = "_roundLarge_1f6g8_569";
+const roundFull = "_roundFull_1f6g8_573";
+const shadowNone = "_shadowNone_1f6g8_577";
+const shadowLight = "_shadowLight_1f6g8_581";
+const shadowMedium = "_shadowMedium_1f6g8_585";
+const shadowStrong = "_shadowStrong_1f6g8_589";
+const shadowIntense = "_shadowIntense_1f6g8_593";
+const spin = "_spin_1f6g8_1";
+const pulse = "_pulse_1f6g8_1";
+const styles = {
+  noScroll,
+  errorMessage,
+  loadingContainer,
+  hideScrollbar,
+  sr_only,
+  skeletonLoader,
+  "skeleton-loading": "_skeleton-loading_1f6g8_1",
+  roundNone,
+  roundSmall,
+  roundMedium,
+  roundLarge,
+  roundFull,
+  shadowNone,
+  shadowLight,
+  shadowMedium,
+  shadowStrong,
+  shadowIntense,
+  "fade-in": "_fade-in_1f6g8_1",
+  "slide-up": "_slide-up_1f6g8_1",
+  "spin-3d": "_spin-3d_1f6g8_1",
+  spin,
+  pulse,
+  "fade-in-up": "_fade-in-up_1f6g8_1",
+  "progress-grow": "_progress-grow_1f6g8_1",
+  "indeterminate-move": "_indeterminate-move_1f6g8_1"
+};
+const SkeletonBase = ({
+  width = "100%",
+  height = "100%",
+  rounding = borealStyleConfig.getDefaultRounding(),
+  shadow = borealStyleConfig.getDefaultShadow(),
+  className = "",
+  label = "Loading content…",
+  announce = true,
+  animate = true,
+  as: Tag = "div",
+  "data-testid": testId = "skeleton-loader",
+  classMap,
+  ...rest
+}) => {
+  const descriptionId = `${testId}-desc`;
+  const skeletonClasses = React.useMemo(
+    () => classNames.combineClassNames(
+      classMap.skeleton,
+      animate && classMap.animated,
+      shadow && classMap[`shadow${capitalize.capitalize(shadow)}`],
+      rounding && classMap[`round${capitalize.capitalize(rounding)}`],
+      className
+    ),
+    [classMap, animate, shadow, rounding, className, announce]
+  );
+  const ariaProps = announce ? {
+    role: "status",
+    "aria-busy": true,
+    "aria-live": "polite",
+    "aria-relevant": "additions text",
+    "aria-describedby": descriptionId
+  } : { "aria-hidden": true };
+  return /* @__PURE__ */ require$$2.jsx(
+    Tag,
+    {
+      className: skeletonClasses,
+      style: { width, height },
+      "data-testid": testId,
+      ...ariaProps,
+      ...rest,
+      children: announce && /* @__PURE__ */ require$$2.jsx(
+        "span",
+        {
+          id: descriptionId,
+          className: "sr_only",
+          "data-testid": `${testId}-description`,
+          children: label
+        }
+      )
+    }
+  );
+};
+SkeletonBase.displayName = "SkeletonBase";
+const SkeletonLoader = (props) => {
+  return /* @__PURE__ */ require$$2.jsx(
+    SkeletonBase,
+    {
+      ...props,
+      className: classNames.combineClassNames(styles.skeletonLoader, props.className),
+      classMap: styles
+    }
+  );
+};
+exports.SkeletonLoader = SkeletonLoader;
+//# sourceMappingURL=Skeleton-BCbvshNz.cjs.map

package/dist/next/Skeleton-BCbvshNz.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Skeleton-BCbvshNz.cjs","sources":["../../src/components/Skeleton/SkeletonBase.tsx","../../src/components/Skeleton/next/Skeleton.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n  getDefaultRounding,\r\n  getDefaultShadow,\r\n} from \"../../config/boreal-style-config\";\r\nimport { ExtraProps, SkeletonBaseProps } from \"./Skeleton.types\";\r\n\r\nconst SkeletonBase: React.FC<SkeletonBaseProps & ExtraProps> = ({\r\n  width = \"100%\",\r\n  height = \"100%\",\r\n  rounding = getDefaultRounding(),\r\n  shadow = getDefaultShadow(),\r\n  className = \"\",\r\n  label = \"Loading content…\",\r\n  announce = true,\r\n  animate = true,\r\n  as: Tag = \"div\",\r\n  \"data-testid\": testId = \"skeleton-loader\",\r\n  classMap,\r\n  ...rest\r\n}) => {\r\n  const descriptionId = `${testId}-desc`;\r\n\r\n  const skeletonClasses = useMemo(\r\n    () =>\r\n      combineClassNames(\r\n        classMap.skeleton,\r\n        animate && classMap.animated,\r\n        shadow && classMap[`shadow${capitalize(shadow)}`],\r\n        rounding && classMap[`round${capitalize(rounding)}`],\r\n        className\r\n      ),\r\n    [classMap, animate, shadow, rounding, className, announce]\r\n  );\r\n\r\n  const ariaProps = announce\r\n    ? {\r\n        role: \"status\" as const,\r\n        \"aria-busy\": true,\r\n        \"aria-live\": \"polite\" as const,\r\n        \"aria-relevant\": \"additions text\" as const,\r\n        \"aria-describedby\": descriptionId,\r\n      }\r\n    : { \"aria-hidden\": true as const };\r\n\r\n  return (\r\n    <Tag\r\n      className={skeletonClasses}\r\n      style={{ width, height }}\r\n      data-testid={testId}\r\n      {...ariaProps}\r\n      {...rest}\r\n    >\r\n      {announce && (\r\n        <span\r\n          id={descriptionId}\r\n          className=\"sr_only\"\r\n          data-testid={`${testId}-description`}\r\n        >\r\n          {label}\r\n        </span>\r\n      )}\r\n    </Tag>\r\n  );\r\n};\r\n\r\nSkeletonBase.displayName = \"SkeletonBase\";\r\nexport default SkeletonBase;\r\n","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport styles from \"./Skeleton.module.scss\";\r\nimport SkeletonBase from \"../SkeletonBase\";\r\nimport { SkeletonProps } from \"../Skeleton.types\";\r\nimport { combineClassNames } from \"@/utils/classNames\";\r\n\r\nconst SkeletonLoader: React.FC<SkeletonProps> = (props) => {\r\n  return (\r\n    <SkeletonBase\r\n      {...props}\r\n      className={combineClassNames(styles.skeletonLoader, props.className)}\r\n      classMap={styles}\r\n    />\r\n  );\r\n};\r\n\r\nexport default SkeletonLoader;\r\n"],"names":["getDefaultRounding","getDefaultShadow","useMemo","combineClassNames","capitalize","jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,eAAyD,CAAC;AAAA,EAC9D,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,WAAWA,kBAAAA,mBAAA;AAAA,EACX,SAASC,kBAAAA,iBAAA;AAAA,EACT,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,UAAU;AAAA,EACV,IAAI,MAAM;AAAA,EACV,eAAe,SAAS;AAAA,EACxB;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,gBAAgB,GAAG,MAAM;AAE/B,QAAM,kBAAkBC,MAAAA;AAAAA,IACtB,MACEC,WAAAA;AAAAA,MACE,SAAS;AAAA,MACT,WAAW,SAAS;AAAA,MACpB,UAAU,SAAS,SAASC,WAAAA,WAAW,MAAM,CAAC,EAAE;AAAA,MAChD,YAAY,SAAS,QAAQA,WAAAA,WAAW,QAAQ,CAAC,EAAE;AAAA,MACnD;AAAA,IAAA;AAAA,IAEJ,CAAC,UAAU,SAAS,QAAQ,UAAU,WAAW,QAAQ;AAAA,EAAA;AAG3D,QAAM,YAAY,WACd;AAAA,IACE,MAAM;AAAA,IACN,aAAa;AAAA,IACb,aAAa;AAAA,IACb,iBAAiB;AAAA,IACjB,oBAAoB;AAAA,EAAA,IAEtB,EAAE,eAAe,KAAA;AAErB,SACEC,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,MACX,OAAO,EAAE,OAAO,OAAA;AAAA,MAChB,eAAa;AAAA,MACZ,GAAG;AAAA,MACH,GAAG;AAAA,MAEH,UAAA,YACCA,2BAAAA;AAAAA,QAAC;AAAA,QAAA;AAAA,UACC,IAAI;AAAA,UACJ,WAAU;AAAA,UACV,eAAa,GAAG,MAAM;AAAA,UAErB,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EAAA;AAIR;AAEA,aAAa,cAAc;AC5D3B,MAAM,iBAA0C,CAAC,UAAU;AACzD,SACEA,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,WAAWF,WAAAA,kBAAkB,OAAO,gBAAgB,MAAM,SAAS;AAAA,MACnE,UAAU;AAAA,IAAA;AAAA,EAAA;AAGhB;;"}

package/dist/next/Skeleton-D8Jqmncm.js

@@ -0,0 +1,117 @@
+import { jsx } from "react/jsx-runtime";
+import { useMemo } 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 } from "./boreal-style-config-BILmxkZG.js";
+const noScroll = "_noScroll_1f6g8_91";
+const errorMessage = "_errorMessage_1f6g8_92";
+const loadingContainer = "_loadingContainer_1f6g8_93";
+const hideScrollbar = "_hideScrollbar_1f6g8_85";
+const sr_only = "_sr_only_1f6g8_94";
+const skeletonLoader = "_skeletonLoader_1f6g8_540";
+const roundNone = "_roundNone_1f6g8_557";
+const roundSmall = "_roundSmall_1f6g8_561";
+const roundMedium = "_roundMedium_1f6g8_565";
+const roundLarge = "_roundLarge_1f6g8_569";
+const roundFull = "_roundFull_1f6g8_573";
+const shadowNone = "_shadowNone_1f6g8_577";
+const shadowLight = "_shadowLight_1f6g8_581";
+const shadowMedium = "_shadowMedium_1f6g8_585";
+const shadowStrong = "_shadowStrong_1f6g8_589";
+const shadowIntense = "_shadowIntense_1f6g8_593";
+const spin = "_spin_1f6g8_1";
+const pulse = "_pulse_1f6g8_1";
+const styles = {
+  noScroll,
+  errorMessage,
+  loadingContainer,
+  hideScrollbar,
+  sr_only,
+  skeletonLoader,
+  "skeleton-loading": "_skeleton-loading_1f6g8_1",
+  roundNone,
+  roundSmall,
+  roundMedium,
+  roundLarge,
+  roundFull,
+  shadowNone,
+  shadowLight,
+  shadowMedium,
+  shadowStrong,
+  shadowIntense,
+  "fade-in": "_fade-in_1f6g8_1",
+  "slide-up": "_slide-up_1f6g8_1",
+  "spin-3d": "_spin-3d_1f6g8_1",
+  spin,
+  pulse,
+  "fade-in-up": "_fade-in-up_1f6g8_1",
+  "progress-grow": "_progress-grow_1f6g8_1",
+  "indeterminate-move": "_indeterminate-move_1f6g8_1"
+};
+const SkeletonBase = ({
+  width = "100%",
+  height = "100%",
+  rounding = getDefaultRounding(),
+  shadow = getDefaultShadow(),
+  className = "",
+  label = "Loading content…",
+  announce = true,
+  animate = true,
+  as: Tag = "div",
+  "data-testid": testId = "skeleton-loader",
+  classMap,
+  ...rest
+}) => {
+  const descriptionId = `${testId}-desc`;
+  const skeletonClasses = useMemo(
+    () => combineClassNames(
+      classMap.skeleton,
+      animate && classMap.animated,
+      shadow && classMap[`shadow${capitalize(shadow)}`],
+      rounding && classMap[`round${capitalize(rounding)}`],
+      className
+    ),
+    [classMap, animate, shadow, rounding, className, announce]
+  );
+  const ariaProps = announce ? {
+    role: "status",
+    "aria-busy": true,
+    "aria-live": "polite",
+    "aria-relevant": "additions text",
+    "aria-describedby": descriptionId
+  } : { "aria-hidden": true };
+  return /* @__PURE__ */ jsx(
+    Tag,
+    {
+      className: skeletonClasses,
+      style: { width, height },
+      "data-testid": testId,
+      ...ariaProps,
+      ...rest,
+      children: announce && /* @__PURE__ */ jsx(
+        "span",
+        {
+          id: descriptionId,
+          className: "sr_only",
+          "data-testid": `${testId}-description`,
+          children: label
+        }
+      )
+    }
+  );
+};
+SkeletonBase.displayName = "SkeletonBase";
+const SkeletonLoader = (props) => {
+  return /* @__PURE__ */ jsx(
+    SkeletonBase,
+    {
+      ...props,
+      className: combineClassNames(styles.skeletonLoader, props.className),
+      classMap: styles
+    }
+  );
+};
+export {
+  SkeletonLoader as S
+};
+//# sourceMappingURL=Skeleton-D8Jqmncm.js.map

package/dist/next/Skeleton-D8Jqmncm.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Skeleton-D8Jqmncm.js","sources":["../../src/components/Skeleton/SkeletonBase.tsx","../../src/components/Skeleton/next/Skeleton.tsx"],"sourcesContent":["import React, { useMemo } from \"react\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n  getDefaultRounding,\r\n  getDefaultShadow,\r\n} from \"../../config/boreal-style-config\";\r\nimport { ExtraProps, SkeletonBaseProps } from \"./Skeleton.types\";\r\n\r\nconst SkeletonBase: React.FC<SkeletonBaseProps & ExtraProps> = ({\r\n  width = \"100%\",\r\n  height = \"100%\",\r\n  rounding = getDefaultRounding(),\r\n  shadow = getDefaultShadow(),\r\n  className = \"\",\r\n  label = \"Loading content…\",\r\n  announce = true,\r\n  animate = true,\r\n  as: Tag = \"div\",\r\n  \"data-testid\": testId = \"skeleton-loader\",\r\n  classMap,\r\n  ...rest\r\n}) => {\r\n  const descriptionId = `${testId}-desc`;\r\n\r\n  const skeletonClasses = useMemo(\r\n    () =>\r\n      combineClassNames(\r\n        classMap.skeleton,\r\n        animate && classMap.animated,\r\n        shadow && classMap[`shadow${capitalize(shadow)}`],\r\n        rounding && classMap[`round${capitalize(rounding)}`],\r\n        className\r\n      ),\r\n    [classMap, animate, shadow, rounding, className, announce]\r\n  );\r\n\r\n  const ariaProps = announce\r\n    ? {\r\n        role: \"status\" as const,\r\n        \"aria-busy\": true,\r\n        \"aria-live\": \"polite\" as const,\r\n        \"aria-relevant\": \"additions text\" as const,\r\n        \"aria-describedby\": descriptionId,\r\n      }\r\n    : { \"aria-hidden\": true as const };\r\n\r\n  return (\r\n    <Tag\r\n      className={skeletonClasses}\r\n      style={{ width, height }}\r\n      data-testid={testId}\r\n      {...ariaProps}\r\n      {...rest}\r\n    >\r\n      {announce && (\r\n        <span\r\n          id={descriptionId}\r\n          className=\"sr_only\"\r\n          data-testid={`${testId}-description`}\r\n        >\r\n          {label}\r\n        </span>\r\n      )}\r\n    </Tag>\r\n  );\r\n};\r\n\r\nSkeletonBase.displayName = \"SkeletonBase\";\r\nexport default SkeletonBase;\r\n","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport styles from \"./Skeleton.module.scss\";\r\nimport SkeletonBase from \"../SkeletonBase\";\r\nimport { SkeletonProps } from \"../Skeleton.types\";\r\nimport { combineClassNames } from \"@/utils/classNames\";\r\n\r\nconst SkeletonLoader: React.FC<SkeletonProps> = (props) => {\r\n  return (\r\n    <SkeletonBase\r\n      {...props}\r\n      className={combineClassNames(styles.skeletonLoader, props.className)}\r\n      classMap={styles}\r\n    />\r\n  );\r\n};\r\n\r\nexport default SkeletonLoader;\r\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASA,MAAM,eAAyD,CAAC;AAAA,EAC9D,QAAQ;AAAA,EACR,SAAS;AAAA,EACT,WAAW,mBAAA;AAAA,EACX,SAAS,iBAAA;AAAA,EACT,YAAY;AAAA,EACZ,QAAQ;AAAA,EACR,WAAW;AAAA,EACX,UAAU;AAAA,EACV,IAAI,MAAM;AAAA,EACV,eAAe,SAAS;AAAA,EACxB;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,gBAAgB,GAAG,MAAM;AAE/B,QAAM,kBAAkB;AAAA,IACtB,MACE;AAAA,MACE,SAAS;AAAA,MACT,WAAW,SAAS;AAAA,MACpB,UAAU,SAAS,SAAS,WAAW,MAAM,CAAC,EAAE;AAAA,MAChD,YAAY,SAAS,QAAQ,WAAW,QAAQ,CAAC,EAAE;AAAA,MACnD;AAAA,IAAA;AAAA,IAEJ,CAAC,UAAU,SAAS,QAAQ,UAAU,WAAW,QAAQ;AAAA,EAAA;AAG3D,QAAM,YAAY,WACd;AAAA,IACE,MAAM;AAAA,IACN,aAAa;AAAA,IACb,aAAa;AAAA,IACb,iBAAiB;AAAA,IACjB,oBAAoB;AAAA,EAAA,IAEtB,EAAE,eAAe,KAAA;AAErB,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,MACX,OAAO,EAAE,OAAO,OAAA;AAAA,MAChB,eAAa;AAAA,MACZ,GAAG;AAAA,MACH,GAAG;AAAA,MAEH,UAAA,YACC;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,IAAI;AAAA,UACJ,WAAU;AAAA,UACV,eAAa,GAAG,MAAM;AAAA,UAErB,UAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACH;AAAA,EAAA;AAIR;AAEA,aAAa,cAAc;AC5D3B,MAAM,iBAA0C,CAAC,UAAU;AACzD,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,WAAW,kBAAkB,OAAO,gBAAgB,MAAM,SAAS;AAAA,MACnE,UAAU;AAAA,IAAA;AAAA,EAAA;AAGhB;"}

package/dist/next/Skeleton.cjs.js

@@ -1,4 +1,4 @@
 "use strict";
-const Skeleton = require("./Skeleton-VK_AxGlo.cjs");
+const Skeleton = require("./Skeleton-BCbvshNz.cjs");
 module.exports = Skeleton.SkeletonLoader;
 //# sourceMappingURL=Skeleton.cjs.js.map

package/dist/next/Skeleton.js

@@ -1,4 +1,4 @@
-import { S } from "./Skeleton-CJpwvGKT.js";
+import { S } from "./Skeleton-D8Jqmncm.js";
 export {
   S as default
 };