boreal-ui 0.0.72 → 0.0.73

package/dist/core/{Sidebar-DFAi7pQh.cjs → Sidebar-DrEQ7PwW.cjs}

@@ -21,7 +21,13 @@ const SidebarBase = ({
   outline = false,
   className = "",
   "data-testid": testId = "sidebar",
-  ariaLabel = "Sidebar navigation",
+  "aria-label": ariaLabel = "Sidebar navigation",
+  "aria-labelledby": ariaLabelledBy,
+  "aria-describedby": ariaDescribedBy,
+  footerAriaLabel = "Sidebar footer",
+  footerAriaLabelledBy,
+  getExpandButtonAriaLabel,
+  getExpandButtonAriaDescription,
   ...rest
 }) => {
   const [openItems, setOpenItems] = React.useState({});
@@ -82,9 +88,17 @@ const SidebarBase = ({
         isChild && classMap.childList
       ),
       "data-testid": `${testId}-list`,
-      children: items.map(({ label, href, children, icon }, idx) => {
+      children: items.map((link, idx) => {
+        const {
+          label,
+          href,
+          children,
+          icon,
+          "aria-label": linkAriaLabel,
+          "aria-description": linkAriaDescription,
+          "aria-disabled": linkAriaDisabled
+        } = link;
         const key = `${label}-${idx}`;
-        const link = { label, href, children, icon };
         const isActive = (isLinkActive == null ? void 0 : isLinkActive(link)) ?? false;
         const containsActiveChild = (hasActiveChild == null ? void 0 : hasActiveChild(link)) ?? !!(children == null ? void 0 : children.some(
           (child) => {
@@ -114,6 +128,9 @@ const SidebarBase = ({
                   onClick: () => toggleItem(label),
                   "aria-expanded": isOpen,
                   "aria-controls": panelId,
+                  "aria-label": (getExpandButtonAriaLabel == null ? void 0 : getExpandButtonAriaLabel(link, isOpen)) ?? linkAriaLabel,
+                  "aria-description": (getExpandButtonAriaDescription == null ? void 0 : getExpandButtonAriaDescription(link, isOpen)) ?? linkAriaDescription,
+                  "aria-disabled": linkAriaDisabled || void 0,
                   "data-testid": `${testId}-expandItemButton`,
                   children: [
                     icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: classMap.icon, children: icon }),
@@ -158,6 +175,9 @@ const SidebarBase = ({
                   isActive && classMap.active
                 ),
                 "aria-current": isActive ? "page" : void 0,
+                "aria-label": linkAriaLabel,
+                "aria-description": linkAriaDescription,
+                "aria-disabled": linkAriaDisabled || void 0,
                 "data-testid": `${testId}-sidebarLink`,
                 children: [
                   icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: classMap.icon, children: icon }),
@@ -171,6 +191,9 @@ const SidebarBase = ({
                   classMap.link,
                   isChild && classMap.childLink
                 ),
+                "aria-label": linkAriaLabel,
+                "aria-description": linkAriaDescription,
+                "aria-disabled": linkAriaDisabled || void 0,
                 "data-testid": `${testId}-sidebarLabel`,
                 children: [
                   icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: classMap.icon, children: icon }),
@@ -188,31 +211,57 @@ const SidebarBase = ({
     "nav",
     {
       className: containerClasses,
-      "aria-label": ariaLabel,
+      "aria-label": ariaLabelledBy ? void 0 : ariaLabel,
+      "aria-labelledby": ariaLabelledBy,
+      "aria-describedby": ariaDescribedBy,
       "data-testid": testId,
       ...rest,
       children: [
         /* @__PURE__ */ jsxRuntime.jsx("div", { className: classMap.nav, children: renderLinks(links) }),
-        showFooter && /* @__PURE__ */ jsxRuntime.jsxs("footer", { className: classMap.footer, "data-testid": `${testId}-footer`, children: [
-          footerLinks == null ? void 0 : footerLinks.map(({ label, href }, i) => /* @__PURE__ */ jsxRuntime.jsx(
-            LinkComponent,
-            {
-              href,
-              className: classMap.footerLink,
-              "data-testid": `${testId}-footerLink`,
-              children: label
-            },
-            `${label}-${i}`
-          )),
-          footerVersion && /* @__PURE__ */ jsxRuntime.jsx(
-            "span",
-            {
-              className: classMap.footerVersion,
-              "data-testid": `${testId}-footerVersion`,
-              children: footerVersion
-            }
-          )
-        ] })
+        showFooter && /* @__PURE__ */ jsxRuntime.jsxs(
+          "footer",
+          {
+            className: classMap.footer,
+            "aria-label": footerAriaLabelledBy ? void 0 : footerAriaLabel,
+            "aria-labelledby": footerAriaLabelledBy,
+            "data-testid": `${testId}-footer`,
+            children: [
+              footerLinks == null ? void 0 : footerLinks.map(
+                ({
+                  label,
+                  href,
+                  icon,
+                  "aria-label": footerLinkAriaLabel,
+                  "aria-description": footerLinkAriaDescription,
+                  "aria-disabled": footerLinkAriaDisabled
+                }, i) => /* @__PURE__ */ jsxRuntime.jsxs(
+                  LinkComponent,
+                  {
+                    href,
+                    className: classMap.footerLink,
+                    "aria-label": footerLinkAriaLabel,
+                    "aria-description": footerLinkAriaDescription,
+                    "aria-disabled": footerLinkAriaDisabled || void 0,
+                    "data-testid": `${testId}-footerLink`,
+                    children: [
+                      icon && /* @__PURE__ */ jsxRuntime.jsx("span", { className: classMap.icon, children: icon }),
+                      label
+                    ]
+                  },
+                  `${label}-${i}`
+                )
+              ),
+              footerVersion && /* @__PURE__ */ jsxRuntime.jsx(
+                "span",
+                {
+                  className: classMap.footerVersion,
+                  "data-testid": `${testId}-footerVersion`,
+                  children: footerVersion
+                }
+              )
+            ]
+          }
+        )
       ]
     }
   );
@@ -301,4 +350,4 @@ const Sidebar = ({
 };
 Sidebar.displayName = "Sidebar";
 exports.Sidebar = Sidebar;
-//# sourceMappingURL=Sidebar-DFAi7pQh.cjs.map
+//# sourceMappingURL=Sidebar-DrEQ7PwW.cjs.map

package/dist/core/Sidebar-DrEQ7PwW.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Sidebar-DrEQ7PwW.cjs","sources":["../../src/components/Sidebar/SidebarBase.tsx","../../src/components/Sidebar/core/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, SidebarLink } from \"./Sidebar.types\";\r\n\r\nconst SidebarBase: React.FC<BaseSidebarProps> = ({\r\n  links,\r\n  classMap,\r\n  LinkComponent = \"a\",\r\n  isLinkActive,\r\n  hasActiveChild,\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  \"aria-label\": ariaLabel = \"Sidebar navigation\",\r\n  \"aria-labelledby\": ariaLabelledBy,\r\n  \"aria-describedby\": ariaDescribedBy,\r\n  footerAriaLabel = \"Sidebar footer\",\r\n  footerAriaLabelledBy,\r\n  getExpandButtonAriaLabel,\r\n  getExpandButtonAriaDescription,\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\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: SidebarLink[]): boolean => {\r\n      for (const node of nodes) {\r\n        if (node.children?.length) {\r\n          const childIsActive =\r\n            hasActiveChild?.(node) ??\r\n            node.children.some(\r\n              (child) =>\r\n                (isLinkActive?.(child) ?? false) ||\r\n                (!!child.children?.length && walk(child.children)),\r\n            );\r\n\r\n          if (childIsActive) {\r\n            next[node.label] = true;\r\n          }\r\n        }\r\n      }\r\n\r\n      return nodes.some(\r\n        (node) =>\r\n          (isLinkActive?.(node) ?? false) ||\r\n          (!!node.children?.length && walk(node.children)),\r\n      );\r\n    };\r\n\r\n    walk(links);\r\n    setOpenItems((prev) => ({ ...prev, ...next }));\r\n  }, [links, isLinkActive, hasActiveChild]);\r\n\r\n  const toggleItem = (key: string) =>\r\n    setOpenItems((prev) => ({ ...prev, [key]: !prev[key] }));\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: SidebarLink[], 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((link, idx) => {\r\n        const {\r\n          label,\r\n          href,\r\n          children,\r\n          icon,\r\n          \"aria-label\": linkAriaLabel,\r\n          \"aria-description\": linkAriaDescription,\r\n          \"aria-disabled\": linkAriaDisabled,\r\n        } = link;\r\n\r\n        const key = `${label}-${idx}`;\r\n\r\n        const isActive = isLinkActive?.(link) ?? false;\r\n        const containsActiveChild =\r\n          hasActiveChild?.(link) ??\r\n          !!children?.some(\r\n            (child) =>\r\n              (isLinkActive?.(child) ?? false) ||\r\n              (child.children?.length && (hasActiveChild?.(child) ?? false)),\r\n          );\r\n\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                    (isActive || isOpen || containsActiveChild) &&\r\n                      classMap.active,\r\n                  )}\r\n                  onClick={() => toggleItem(label)}\r\n                  aria-expanded={isOpen}\r\n                  aria-controls={panelId}\r\n                  aria-label={\r\n                    getExpandButtonAriaLabel?.(link, isOpen) ?? linkAriaLabel\r\n                  }\r\n                  aria-description={\r\n                    getExpandButtonAriaDescription?.(link, isOpen) ??\r\n                    linkAriaDescription\r\n                  }\r\n                  aria-disabled={linkAriaDisabled || undefined}\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                  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                aria-label={linkAriaLabel}\r\n                aria-description={linkAriaDescription}\r\n                aria-disabled={linkAriaDisabled || 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                aria-label={linkAriaLabel}\r\n                aria-description={linkAriaDescription}\r\n                aria-disabled={linkAriaDisabled || undefined}\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={ariaLabelledBy ? undefined : ariaLabel}\r\n      aria-labelledby={ariaLabelledBy}\r\n      aria-describedby={ariaDescribedBy}\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\r\n          className={classMap.footer}\r\n          aria-label={footerAriaLabelledBy ? undefined : footerAriaLabel}\r\n          aria-labelledby={footerAriaLabelledBy}\r\n          data-testid={`${testId}-footer`}\r\n        >\r\n          {footerLinks?.map(\r\n            (\r\n              {\r\n                label,\r\n                href,\r\n                icon,\r\n                \"aria-label\": footerLinkAriaLabel,\r\n                \"aria-description\": footerLinkAriaDescription,\r\n                \"aria-disabled\": footerLinkAriaDisabled,\r\n              },\r\n              i,\r\n            ) => (\r\n              <LinkComponent\r\n                key={`${label}-${i}`}\r\n                href={href}\r\n                className={classMap.footerLink}\r\n                aria-label={footerLinkAriaLabel}\r\n                aria-description={footerLinkAriaDescription}\r\n                aria-disabled={footerLinkAriaDisabled || undefined}\r\n                data-testid={`${testId}-footerLink`}\r\n              >\r\n                {icon && <span className={classMap.icon}>{icon}</span>}\r\n                {label}\r\n              </LinkComponent>\r\n            ),\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","import React, { useState } from \"react\";\r\nimport SidebarBase from \"../SidebarBase\";\r\nimport \"./Sidebar.scss\";\r\nimport { SidebarLink, SidebarProps } from \"../Sidebar.types\";\r\n\r\nconst classes = {\r\n  wrapper: \"sidebar\",\r\n  nav: \"sidebar_nav\",\r\n  list: \"sidebar_list\",\r\n  childList: \"sidebar_child_list\",\r\n  item: \"sidebar_item\",\r\n  link: \"sidebar_link\",\r\n  childLink: \"sidebar_child_link\",\r\n  active: \"sidebar_active\",\r\n  icon: \"sidebar_icon\",\r\n\r\n  footer: \"sidebar_footer\",\r\n  footerLink: \"sidebar_footer_link\",\r\n  footerVersion: \"sidebar_footer_version\",\r\n\r\n  chevron: \"sidebar_chevron\",\r\n  chevronOpen: \"sidebar_chevron_open\",\r\n\r\n  submenu: \"sidebar_submenu\",\r\n  submenuOpen: \"sidebar_submenu_open\",\r\n\r\n  outline: \"sidebar_outline\",\r\n\r\n  primary: \"sidebar_primary\",\r\n  secondary: \"sidebar_secondary\",\r\n  tertiary: \"sidebar_tertiary\",\r\n  quaternary: \"sidebar_quaternary\",\r\n\r\n  success: \"sidebar_success\",\r\n  error: \"sidebar_error\",\r\n  warning: \"sidebar_warning\",\r\n\r\n  clear: \"sidebar_clear\",\r\n\r\n  shadowNone: \"sidebar_shadow-None\",\r\n  shadowLight: \"sidebar_shadow-Light\",\r\n  shadowMedium: \"sidebar_shadow-Medium\",\r\n  shadowStrong: \"sidebar_shadow-Strong\",\r\n  shadowIntense: \"sidebar_shadow-Intense\",\r\n\r\n  roundNone: \"sidebar_round-None\",\r\n  roundSmall: \"sidebar_round-Small\",\r\n  roundMedium: \"sidebar_round-Medium\",\r\n  roundLarge: \"sidebar_round-Large\",\r\n};\r\n\r\nconst normalizePath = (p: string) =>\r\n  p.endsWith(\"/\") && p.length > 1 ? p.slice(0, -1) : p;\r\n\r\nconst getInitialPath = () =>\r\n  typeof window !== \"undefined\" ? window.location.pathname || \"/\" : \"/\";\r\n\r\nconst isDescendantPath = (parentPath: string, currentPath: string): boolean => {\r\n  const parent = normalizePath(parentPath);\r\n  const current = normalizePath(currentPath);\r\n\r\n  if (parent === \"/\") return current === \"/\";\r\n  return current === parent || current.startsWith(`${parent}/`);\r\n};\r\n\r\nconst isActiveRecursive = (\r\n  link: SidebarLink,\r\n  matcher: (link: SidebarLink) => boolean,\r\n): boolean => {\r\n  if (matcher(link)) return true;\r\n  return !!link.children?.some((child) => isActiveRecursive(child, matcher));\r\n};\r\n\r\nconst Sidebar: React.FC<SidebarProps> = ({\r\n  isLinkActive: consumerIsLinkActive,\r\n  hasActiveChild: consumerHasActiveChild,\r\n  ...props\r\n}) => {\r\n  const [pathname] = useState(getInitialPath);\r\n\r\n  const defaultIsLinkActive = (link: SidebarLink): boolean => {\r\n    if (!link.href) return false;\r\n\r\n    if (link.children?.length) {\r\n      return isDescendantPath(link.href, pathname);\r\n    }\r\n\r\n    return normalizePath(link.href) === normalizePath(pathname);\r\n  };\r\n\r\n  const resolvedIsLinkActive = consumerIsLinkActive ?? defaultIsLinkActive;\r\n\r\n  const defaultHasActiveChild = (link: SidebarLink): boolean =>\r\n    !!link.children?.some((child) =>\r\n      isActiveRecursive(child, resolvedIsLinkActive),\r\n    );\r\n\r\n  const resolvedHasActiveChild =\r\n    consumerHasActiveChild ?? defaultHasActiveChild;\r\n\r\n  return (\r\n    <SidebarBase\r\n      {...props}\r\n      classMap={classes}\r\n      isLinkActive={resolvedIsLinkActive}\r\n      hasActiveChild={resolvedHasActiveChild}\r\n    />\r\n  );\r\n};\r\n\r\nSidebar.displayName = \"Sidebar\";\r\nexport default Sidebar;\r\n"],"names":["getDefaultTheme","getDefaultRounding","getDefaultShadow","useState","useRef","useEffect","_a","useMemo","combineClassNames","capitalize","jsx","jsxs","Fragment","ChevronDownIcon"],"mappings":";;;;;;;AAWA,MAAM,cAA0C,CAAC;AAAA,EAC/C;AAAA,EACA;AAAA,EACA,gBAAgB;AAAA,EAChB;AAAA,EACA;AAAA,EACA,QAAQA,kBAAAA,gBAAA;AAAA,EACR,WAAWC,kBAAAA,mBAAA;AAAA,EACX,SAASC,kBAAAA,iBAAA;AAAA,EACT,QAAQ;AAAA,EACR,aAAa;AAAA,EACb;AAAA,EACA;AAAA,EACA,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,eAAe,SAAS;AAAA,EACxB,cAAc,YAAY;AAAA,EAC1B,mBAAmB;AAAA,EACnB,oBAAoB;AAAA,EACpB,kBAAkB;AAAA,EAClB;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,CAAC,WAAW,YAAY,IAAIC,MAAAA,SAAkC,CAAA,CAAE;AAEtE,QAAM,SAASC,MAAAA,OAA+B,EAAE;AAChD,QAAM,SAASA,MAAAA,OAAO,CAAC;AAEvB,QAAM,QAAQ,CAAC,UAAkB;AAC/B,QAAI,CAAC,OAAO,QAAQ,KAAK,GAAG;AAC1B,YAAM,OAAO,MACV,YAAA,EACA,QAAQ,QAAQ,GAAG,EACnB,QAAQ,gBAAgB,EAAE;AAC7B,aAAO,QAAQ,KAAK,IAAI,GAAG,MAAM,YAAY,IAAI,IAAI,OAAO,SAAS;AAAA,IACvE;AACA,WAAO,OAAO,QAAQ,KAAK;AAAA,EAC7B;AAEAC,QAAAA,UAAU,MAAM;AACd,UAAM,OAAgC,CAAA;AAEtC,UAAM,OAAO,CAAC,UAAkC;;AAC9C,iBAAW,QAAQ,OAAO;AACxB,aAAI,UAAK,aAAL,mBAAe,QAAQ;AACzB,gBAAM,iBACJ,iDAAiB,UACjB,KAAK,SAAS;AAAA,YACZ,CAAC,UAAA;;AACE,oEAAe,WAAU,UACzB,CAAC,GAACC,MAAA,MAAM,aAAN,gBAAAA,IAAgB,WAAU,KAAK,MAAM,QAAQ;AAAA;AAAA,UAAA;AAGtD,cAAI,eAAe;AACjB,iBAAK,KAAK,KAAK,IAAI;AAAA,UACrB;AAAA,QACF;AAAA,MACF;AAEA,aAAO,MAAM;AAAA,QACX,CAAC,SAAA;;AACE,gEAAe,UAAS,UACxB,CAAC,GAACA,MAAA,KAAK,aAAL,gBAAAA,IAAe,WAAU,KAAK,KAAK,QAAQ;AAAA;AAAA,MAAA;AAAA,IAEpD;AAEA,SAAK,KAAK;AACV,iBAAa,CAAC,UAAU,EAAE,GAAG,MAAM,GAAG,OAAO;AAAA,EAC/C,GAAG,CAAC,OAAO,cAAc,cAAc,CAAC;AAExC,QAAM,aAAa,CAAC,QAClB,aAAa,CAAC,UAAU,EAAE,GAAG,MAAM,CAAC,GAAG,GAAG,CAAC,KAAK,GAAG,IAAI;AAEzD,QAAM,mBAAmBC,MAAAA;AAAAA,IACvB,MACEC,WAAAA;AAAAA,MACE,SAAS;AAAA,MACT;AAAA,MACA,SAAS,KAAK;AAAA,MACd,SAAS,KAAK;AAAA,MACd,UAAU,SAAS,SAASC,WAAAA,WAAW,MAAM,CAAC,EAAE;AAAA,MAChD,YAAY,SAAS,QAAQA,WAAAA,WAAW,QAAQ,CAAC,EAAE;AAAA,MACnD,WAAW,SAAS;AAAA,IAAA;AAAA,IAExB,CAAC,UAAU,WAAW,OAAO,OAAO,SAAS,UAAU,MAAM;AAAA,EAAA;AAG/D,QAAM,cAAc,CAAC,OAAsB,UAAU,UACnDC,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWF,WAAAA;AAAAA,QACT,SAAS;AAAA,QACT,WAAW,SAAS;AAAA,MAAA;AAAA,MAEtB,eAAa,GAAG,MAAM;AAAA,MAErB,UAAA,MAAM,IAAI,CAAC,MAAM,QAAQ;AACxB,cAAM;AAAA,UACJ;AAAA,UACA;AAAA,UACA;AAAA,UACA;AAAA,UACA,cAAc;AAAA,UACd,oBAAoB;AAAA,UACpB,iBAAiB;AAAA,QAAA,IACf;AAEJ,cAAM,MAAM,GAAG,KAAK,IAAI,GAAG;AAE3B,cAAM,YAAW,6CAAe,UAAS;AACzC,cAAM,uBACJ,iDAAiB,UACjB,CAAC,EAAC,qCAAU;AAAA,UACV,CAAC,UAAA;;AACE,kEAAe,WAAU,YACzB,WAAM,aAAN,mBAAgB,aAAW,iDAAiB,WAAU;AAAA;AAAA;AAG7D,cAAM,SAAS,CAAC,CAAC,UAAU,KAAK;AAChC,cAAM,YAAY,MAAM,KAAK;AAC7B,cAAM,WAAW,GAAG,SAAS;AAC7B,cAAM,UAAU,GAAG,SAAS;AAE5B,eACEE,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YAEC,WAAW,SAAS;AAAA,YACpB,eAAa,GAAG,MAAM;AAAA,YAErB,UAAA,YAAY,SAAS,SAAS,IAC7BC,gCAAAC,WAAAA,UAAA,EACE,UAAA;AAAA,cAAAD,2BAAAA;AAAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,MAAK;AAAA,kBACL,IAAI;AAAA,kBACJ,WAAWH,WAAAA;AAAAA,oBACT,SAAS;AAAA,qBACR,YAAY,UAAU,wBACrB,SAAS;AAAA,kBAAA;AAAA,kBAEb,SAAS,MAAM,WAAW,KAAK;AAAA,kBAC/B,iBAAe;AAAA,kBACf,iBAAe;AAAA,kBACf,eACE,qEAA2B,MAAM,YAAW;AAAA,kBAE9C,qBACE,iFAAiC,MAAM,YACvC;AAAA,kBAEF,iBAAe,oBAAoB;AAAA,kBACnC,eAAa,GAAG,MAAM;AAAA,kBAErB,UAAA;AAAA,oBAAA,QAAQE,2BAAAA,IAAC,QAAA,EAAK,WAAW,SAAS,MAAO,UAAA,MAAK;AAAA,mDAC9C,QAAA,EAAK,eAAa,GAAG,MAAM,oBAAqB,UAAA,OAAM;AAAA,oBACvDA,2BAAAA;AAAAA,sBAACG,iBAAAA;AAAAA,sBAAA;AAAA,wBACC,WAAWL,WAAAA;AAAAA,0BACT,SAAS;AAAA,0BACT,UAAU,SAAS;AAAA,wBAAA;AAAA,wBAErB,eAAY;AAAA,wBACZ,WAAW;AAAA,wBACX,eAAa,GAAG,MAAM;AAAA,sBAAA;AAAA,oBAAA;AAAA,kBACxB;AAAA,gBAAA;AAAA,cAAA;AAAA,cAGFE,2BAAAA;AAAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,IAAI;AAAA,kBACJ,WAAWF,WAAAA;AAAAA,oBACT,SAAS;AAAA,oBACT,UAAU,SAAS;AAAA,kBAAA;AAAA,kBAErB,MAAK;AAAA,kBACL,mBAAiB;AAAA,kBACjB,QAAQ,CAAC;AAAA,kBACT,eAAa,GAAG,MAAM;AAAA,kBAErB,UAAA,YAAY,UAAU,IAAI;AAAA,gBAAA;AAAA,cAAA;AAAA,YAC7B,EAAA,CACF,IACE,OACFG,2BAAAA;AAAAA,cAAC;AAAA,cAAA;AAAA,gBACC;AAAA,gBACA,WAAWH,WAAAA;AAAAA,kBACT,SAAS;AAAA,kBACT,WAAW,SAAS;AAAA,kBACpB,YAAY,SAAS;AAAA,gBAAA;AAAA,gBAEvB,gBAAc,WAAW,SAAS;AAAA,gBAClC,cAAY;AAAA,gBACZ,oBAAkB;AAAA,gBAClB,iBAAe,oBAAoB;AAAA,gBACnC,eAAa,GAAG,MAAM;AAAA,gBAErB,UAAA;AAAA,kBAAA,QAAQE,2BAAAA,IAAC,QAAA,EAAK,WAAW,SAAS,MAAO,UAAA,MAAK;AAAA,kBAC9C;AAAA,gBAAA;AAAA,cAAA;AAAA,YAAA,IAGHC,2BAAAA;AAAAA,cAAC;AAAA,cAAA;AAAA,gBACC,WAAWH,WAAAA;AAAAA,kBACT,SAAS;AAAA,kBACT,WAAW,SAAS;AAAA,gBAAA;AAAA,gBAEtB,cAAY;AAAA,gBACZ,oBAAkB;AAAA,gBAClB,iBAAe,oBAAoB;AAAA,gBACnC,eAAa,GAAG,MAAM;AAAA,gBAErB,UAAA;AAAA,kBAAA,QAAQE,2BAAAA,IAAC,QAAA,EAAK,WAAW,SAAS,MAAO,UAAA,MAAK;AAAA,kBAC9C;AAAA,gBAAA;AAAA,cAAA;AAAA,YAAA;AAAA,UACH;AAAA,UApFG;AAAA,QAAA;AAAA,MAwFX,CAAC;AAAA,IAAA;AAAA,EAAA;AAIL,SACEC,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,MACX,cAAY,iBAAiB,SAAY;AAAA,MACzC,mBAAiB;AAAA,MACjB,oBAAkB;AAAA,MAClB,eAAa;AAAA,MACZ,GAAG;AAAA,MAEJ,UAAA;AAAA,QAAAD,+BAAC,SAAI,WAAW,SAAS,KAAM,UAAA,YAAY,KAAK,GAAE;AAAA,QAEjD,cACCC,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW,SAAS;AAAA,YACpB,cAAY,uBAAuB,SAAY;AAAA,YAC/C,mBAAiB;AAAA,YACjB,eAAa,GAAG,MAAM;AAAA,YAErB,UAAA;AAAA,cAAA,2CAAa;AAAA,gBACZ,CACE;AAAA,kBACE;AAAA,kBACA;AAAA,kBACA;AAAA,kBACA,cAAc;AAAA,kBACd,oBAAoB;AAAA,kBACpB,iBAAiB;AAAA,gBAAA,GAEnB,MAEAA,2BAAAA;AAAAA,kBAAC;AAAA,kBAAA;AAAA,oBAEC;AAAA,oBACA,WAAW,SAAS;AAAA,oBACpB,cAAY;AAAA,oBACZ,oBAAkB;AAAA,oBAClB,iBAAe,0BAA0B;AAAA,oBACzC,eAAa,GAAG,MAAM;AAAA,oBAErB,UAAA;AAAA,sBAAA,QAAQD,2BAAAA,IAAC,QAAA,EAAK,WAAW,SAAS,MAAO,UAAA,MAAK;AAAA,sBAC9C;AAAA,oBAAA;AAAA,kBAAA;AAAA,kBATI,GAAG,KAAK,IAAI,CAAC;AAAA,gBAAA;AAAA;AAAA,cAavB,iBACCA,2BAAAA;AAAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,WAAW,SAAS;AAAA,kBACpB,eAAa,GAAG,MAAM;AAAA,kBAErB,UAAA;AAAA,gBAAA;AAAA,cAAA;AAAA,YACH;AAAA,UAAA;AAAA,QAAA;AAAA,MAEJ;AAAA,IAAA;AAAA,EAAA;AAIR;AAEA,YAAY,cAAc;AC1R1B,MAAM,UAAU;AAAA,EACd,SAAS;AAAA,EACT,KAAK;AAAA,EACL,MAAM;AAAA,EACN,WAAW;AAAA,EACX,MAAM;AAAA,EACN,MAAM;AAAA,EACN,WAAW;AAAA,EACX,QAAQ;AAAA,EACR,MAAM;AAAA,EAEN,QAAQ;AAAA,EACR,YAAY;AAAA,EACZ,eAAe;AAAA,EAEf,SAAS;AAAA,EACT,aAAa;AAAA,EAEb,SAAS;AAAA,EACT,aAAa;AAAA,EAEb,SAAS;AAAA,EAET,SAAS;AAAA,EACT,WAAW;AAAA,EACX,UAAU;AAAA,EACV,YAAY;AAAA,EAEZ,SAAS;AAAA,EACT,OAAO;AAAA,EACP,SAAS;AAAA,EAET,OAAO;AAAA,EAEP,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,cAAc;AAAA,EACd,cAAc;AAAA,EACd,eAAe;AAAA,EAEf,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,YAAY;AACd;AAEA,MAAM,gBAAgB,CAAC,MACrB,EAAE,SAAS,GAAG,KAAK,EAAE,SAAS,IAAI,EAAE,MAAM,GAAG,EAAE,IAAI;AAErD,MAAM,iBAAiB,MACrB,OAAO,WAAW,cAAc,OAAO,SAAS,YAAY,MAAM;AAEpE,MAAM,mBAAmB,CAAC,YAAoB,gBAAiC;AAC7E,QAAM,SAAS,cAAc,UAAU;AACvC,QAAM,UAAU,cAAc,WAAW;AAEzC,MAAI,WAAW,IAAK,QAAO,YAAY;AACvC,SAAO,YAAY,UAAU,QAAQ,WAAW,GAAG,MAAM,GAAG;AAC9D;AAEA,MAAM,oBAAoB,CACxB,MACA,YACY;;AACZ,MAAI,QAAQ,IAAI,EAAG,QAAO;AAC1B,SAAO,CAAC,GAAC,UAAK,aAAL,mBAAe,KAAK,CAAC,UAAU,kBAAkB,OAAO,OAAO;AAC1E;AAEA,MAAM,UAAkC,CAAC;AAAA,EACvC,cAAc;AAAA,EACd,gBAAgB;AAAA,EAChB,GAAG;AACL,MAAM;AACJ,QAAM,CAAC,QAAQ,IAAIP,MAAAA,SAAS,cAAc;AAE1C,QAAM,sBAAsB,CAAC,SAA+B;;AAC1D,QAAI,CAAC,KAAK,KAAM,QAAO;AAEvB,SAAI,UAAK,aAAL,mBAAe,QAAQ;AACzB,aAAO,iBAAiB,KAAK,MAAM,QAAQ;AAAA,IAC7C;AAEA,WAAO,cAAc,KAAK,IAAI,MAAM,cAAc,QAAQ;AAAA,EAC5D;AAEA,QAAM,uBAAuB,wBAAwB;AAErD,QAAM,wBAAwB,CAAC,SAAA;;AAC7B,YAAC,GAAC,UAAK,aAAL,mBAAe;AAAA,MAAK,CAAC,UACrB,kBAAkB,OAAO,oBAAoB;AAAA;AAAA;AAGjD,QAAM,yBACJ,0BAA0B;AAE5B,SACEO,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,UAAU;AAAA,MACV,cAAc;AAAA,MACd,gBAAgB;AAAA,IAAA;AAAA,EAAA;AAGtB;AAEA,QAAQ,cAAc;;"}

package/dist/core/Sidebar.cjs.js

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

package/dist/core/Sidebar.js

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

package/dist/core/{Skeleton-DPR3hXBc.cjs → Skeleton-BXeQBgX2.cjs}

@@ -16,9 +16,17 @@ const SkeletonBase = ({
   as: Tag = "div",
   "data-testid": testId = "skeleton-loader",
   classMap,
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledBy,
+  "aria-describedby": ariaDescribedBy,
+  "aria-live": ariaLive,
+  "aria-busy": ariaBusy,
+  "aria-hidden": ariaHidden,
+  role,
   ...rest
 }) => {
   const descriptionId = `${testId}-desc`;
+  const shouldAnnounce = announce && ariaHidden !== true;
   const skeletonClasses = React.useMemo(
     () => classNames.combineClassNames(
       classMap.skeleton,
@@ -27,24 +35,39 @@ const SkeletonBase = ({
       rounding && classMap[`round${capitalize.capitalize(rounding)}`],
       className
     ),
-    [classMap, animate, shadow, rounding, className, announce]
+    [classMap, animate, shadow, rounding, className]
   );
-  const ariaProps = announce ? {
-    role: "status",
-    "aria-busy": true,
-    "aria-live": "polite",
+  const computedAriaDescribedBy = shouldAnnounce ? [
+    ariaDescribedBy,
+    !ariaLabel && !ariaLabelledBy ? descriptionId : void 0
+  ].filter(Boolean).join(" ") || void 0 : void 0;
+  const accessibilityProps = ariaHidden === true ? {
+    "aria-hidden": true
+  } : shouldAnnounce ? {
+    role: role ?? "status",
+    "aria-busy": ariaBusy ?? true,
+    "aria-live": ariaLive ?? "polite",
     "aria-relevant": "additions text",
-    "aria-describedby": descriptionId
-  } : { "aria-hidden": true };
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy,
+    "aria-describedby": computedAriaDescribedBy
+  } : {
+    "aria-hidden": false,
+    role,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy,
+    "aria-describedby": ariaDescribedBy,
+    "aria-busy": ariaBusy
+  };
   return /* @__PURE__ */ jsxRuntime.jsx(
     Tag,
     {
       className: skeletonClasses,
       style: { width, height },
       "data-testid": testId,
-      ...ariaProps,
+      ...accessibilityProps,
       ...rest,
-      children: announce && /* @__PURE__ */ jsxRuntime.jsx(
+      children: shouldAnnounce && !ariaLabel && !ariaLabelledBy && /* @__PURE__ */ jsxRuntime.jsx(
         "span",
         {
           id: descriptionId,
@@ -80,4 +103,4 @@ const SkeletonLoader = (props) => {
 };
 SkeletonLoader.displayName = "SkeletonLoader";
 exports.SkeletonLoader = SkeletonLoader;
-//# sourceMappingURL=Skeleton-DPR3hXBc.cjs.map
+//# sourceMappingURL=Skeleton-BXeQBgX2.cjs.map

package/dist/core/Skeleton-BXeQBgX2.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Skeleton-BXeQBgX2.cjs","sources":["../../src/components/Skeleton/SkeletonBase.tsx","../../src/components/Skeleton/core/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  \"aria-label\": ariaLabel,\r\n  \"aria-labelledby\": ariaLabelledBy,\r\n  \"aria-describedby\": ariaDescribedBy,\r\n  \"aria-live\": ariaLive,\r\n  \"aria-busy\": ariaBusy,\r\n  \"aria-hidden\": ariaHidden,\r\n  role,\r\n\r\n  ...rest\r\n}) => {\r\n  const descriptionId = `${testId}-desc`;\r\n\r\n  const shouldAnnounce = announce && ariaHidden !== true;\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],\r\n  );\r\n\r\n  const computedAriaDescribedBy = shouldAnnounce\r\n    ? [\r\n        ariaDescribedBy,\r\n        !ariaLabel && !ariaLabelledBy ? descriptionId : undefined,\r\n      ]\r\n        .filter(Boolean)\r\n        .join(\" \") || undefined\r\n    : undefined;\r\n\r\n  const accessibilityProps =\r\n    ariaHidden === true\r\n      ? {\r\n          \"aria-hidden\": true as const,\r\n        }\r\n      : shouldAnnounce\r\n        ? {\r\n            role: role ?? (\"status\" as const),\r\n            \"aria-busy\": ariaBusy ?? true,\r\n            \"aria-live\": ariaLive ?? (\"polite\" as const),\r\n            \"aria-relevant\": \"additions text\" as const,\r\n            \"aria-label\": ariaLabel,\r\n            \"aria-labelledby\": ariaLabelledBy,\r\n            \"aria-describedby\": computedAriaDescribedBy,\r\n          }\r\n        : {\r\n            \"aria-hidden\": false,\r\n            role,\r\n            \"aria-label\": ariaLabel,\r\n            \"aria-labelledby\": ariaLabelledBy,\r\n            \"aria-describedby\": ariaDescribedBy,\r\n            \"aria-busy\": ariaBusy,\r\n          };\r\n\r\n  return (\r\n    <Tag\r\n      className={skeletonClasses}\r\n      style={{ width, height }}\r\n      data-testid={testId}\r\n      {...accessibilityProps}\r\n      {...rest}\r\n    >\r\n      {shouldAnnounce && !ariaLabel && !ariaLabelledBy && (\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","import React from \"react\";\r\nimport \"./Skeleton.scss\";\r\nimport SkeletonBase from \"../SkeletonBase\";\r\nimport { SkeletonProps } from \"../Skeleton.types\";\r\nimport { combineClassNames } from \"../../../utils/classNames\";\r\n\r\nconst classes = {\r\n  shadowNone: \"skeleton_shadow-None\",\r\n  shadowLight: \"skeleton_shadow-Light\",\r\n  shadowMedium: \"skeleton_shadow-Medium\",\r\n  shadowStrong: \"skeleton_shadow-Strong\",\r\n  shadowIntense: \"skeleton_shadow-Intense\",\r\n\r\n  roundNone: \"skeleton_round-None\",\r\n  roundSmall: \"skeleton_round-Small\",\r\n  roundMedium: \"skeleton_round-Medium\",\r\n  roundLarge: \"skeleton_round-Large\",\r\n};\r\n\r\nconst SkeletonLoader: React.FC<SkeletonProps> = (props) => {\r\n  return (\r\n    <SkeletonBase\r\n      {...props}\r\n      className={combineClassNames(\"skeleton_loader\", props.className)}\r\n      classMap={classes}\r\n    />\r\n  );\r\n};\r\nSkeletonLoader.displayName = \"SkeletonLoader\";\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,cAAc;AAAA,EACd,mBAAmB;AAAA,EACnB,oBAAoB;AAAA,EACpB,aAAa;AAAA,EACb,aAAa;AAAA,EACb,eAAe;AAAA,EACf;AAAA,EAEA,GAAG;AACL,MAAM;AACJ,QAAM,gBAAgB,GAAG,MAAM;AAE/B,QAAM,iBAAiB,YAAY,eAAe;AAElD,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,SAAS;AAAA,EAAA;AAGjD,QAAM,0BAA0B,iBAC5B;AAAA,IACE;AAAA,IACA,CAAC,aAAa,CAAC,iBAAiB,gBAAgB;AAAA,EAAA,EAE/C,OAAO,OAAO,EACd,KAAK,GAAG,KAAK,SAChB;AAEJ,QAAM,qBACJ,eAAe,OACX;AAAA,IACE,eAAe;AAAA,EAAA,IAEjB,iBACE;AAAA,IACE,MAAM,QAAS;AAAA,IACf,aAAa,YAAY;AAAA,IACzB,aAAa,YAAa;AAAA,IAC1B,iBAAiB;AAAA,IACjB,cAAc;AAAA,IACd,mBAAmB;AAAA,IACnB,oBAAoB;AAAA,EAAA,IAEtB;AAAA,IACE,eAAe;AAAA,IACf;AAAA,IACA,cAAc;AAAA,IACd,mBAAmB;AAAA,IACnB,oBAAoB;AAAA,IACpB,aAAa;AAAA,EAAA;AAGvB,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,kBAAkB,CAAC,aAAa,CAAC,kBAChCA,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;AC/F3B,MAAM,UAAU;AAAA,EACd,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,cAAc;AAAA,EACd,cAAc;AAAA,EACd,eAAe;AAAA,EAEf,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,YAAY;AACd;AAEA,MAAM,iBAA0C,CAAC,UAAU;AACzD,SACEA,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,WAAWF,WAAAA,kBAAkB,mBAAmB,MAAM,SAAS;AAAA,MAC/D,UAAU;AAAA,IAAA;AAAA,EAAA;AAGhB;AACA,eAAe,cAAc;;"}

package/dist/core/{Skeleton-B9LVkce_.js → Skeleton-C-L3OgVt.js}

@@ -15,9 +15,17 @@ const SkeletonBase = ({
   as: Tag = "div",
   "data-testid": testId = "skeleton-loader",
   classMap,
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledBy,
+  "aria-describedby": ariaDescribedBy,
+  "aria-live": ariaLive,
+  "aria-busy": ariaBusy,
+  "aria-hidden": ariaHidden,
+  role,
   ...rest
 }) => {
   const descriptionId = `${testId}-desc`;
+  const shouldAnnounce = announce && ariaHidden !== true;
   const skeletonClasses = useMemo(
     () => combineClassNames(
       classMap.skeleton,
@@ -26,24 +34,39 @@ const SkeletonBase = ({
       rounding && classMap[`round${capitalize(rounding)}`],
       className
     ),
-    [classMap, animate, shadow, rounding, className, announce]
+    [classMap, animate, shadow, rounding, className]
   );
-  const ariaProps = announce ? {
-    role: "status",
-    "aria-busy": true,
-    "aria-live": "polite",
+  const computedAriaDescribedBy = shouldAnnounce ? [
+    ariaDescribedBy,
+    !ariaLabel && !ariaLabelledBy ? descriptionId : void 0
+  ].filter(Boolean).join(" ") || void 0 : void 0;
+  const accessibilityProps = ariaHidden === true ? {
+    "aria-hidden": true
+  } : shouldAnnounce ? {
+    role: role ?? "status",
+    "aria-busy": ariaBusy ?? true,
+    "aria-live": ariaLive ?? "polite",
     "aria-relevant": "additions text",
-    "aria-describedby": descriptionId
-  } : { "aria-hidden": true };
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy,
+    "aria-describedby": computedAriaDescribedBy
+  } : {
+    "aria-hidden": false,
+    role,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy,
+    "aria-describedby": ariaDescribedBy,
+    "aria-busy": ariaBusy
+  };
   return /* @__PURE__ */ jsx(
     Tag,
     {
       className: skeletonClasses,
       style: { width, height },
       "data-testid": testId,
-      ...ariaProps,
+      ...accessibilityProps,
       ...rest,
-      children: announce && /* @__PURE__ */ jsx(
+      children: shouldAnnounce && !ariaLabel && !ariaLabelledBy && /* @__PURE__ */ jsx(
         "span",
         {
           id: descriptionId,
@@ -81,4 +104,4 @@ SkeletonLoader.displayName = "SkeletonLoader";
 export {
   SkeletonLoader as S
 };
-//# sourceMappingURL=Skeleton-B9LVkce_.js.map
+//# sourceMappingURL=Skeleton-C-L3OgVt.js.map

package/dist/core/Skeleton-C-L3OgVt.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Skeleton-C-L3OgVt.js","sources":["../../src/components/Skeleton/SkeletonBase.tsx","../../src/components/Skeleton/core/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  \"aria-label\": ariaLabel,\r\n  \"aria-labelledby\": ariaLabelledBy,\r\n  \"aria-describedby\": ariaDescribedBy,\r\n  \"aria-live\": ariaLive,\r\n  \"aria-busy\": ariaBusy,\r\n  \"aria-hidden\": ariaHidden,\r\n  role,\r\n\r\n  ...rest\r\n}) => {\r\n  const descriptionId = `${testId}-desc`;\r\n\r\n  const shouldAnnounce = announce && ariaHidden !== true;\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],\r\n  );\r\n\r\n  const computedAriaDescribedBy = shouldAnnounce\r\n    ? [\r\n        ariaDescribedBy,\r\n        !ariaLabel && !ariaLabelledBy ? descriptionId : undefined,\r\n      ]\r\n        .filter(Boolean)\r\n        .join(\" \") || undefined\r\n    : undefined;\r\n\r\n  const accessibilityProps =\r\n    ariaHidden === true\r\n      ? {\r\n          \"aria-hidden\": true as const,\r\n        }\r\n      : shouldAnnounce\r\n        ? {\r\n            role: role ?? (\"status\" as const),\r\n            \"aria-busy\": ariaBusy ?? true,\r\n            \"aria-live\": ariaLive ?? (\"polite\" as const),\r\n            \"aria-relevant\": \"additions text\" as const,\r\n            \"aria-label\": ariaLabel,\r\n            \"aria-labelledby\": ariaLabelledBy,\r\n            \"aria-describedby\": computedAriaDescribedBy,\r\n          }\r\n        : {\r\n            \"aria-hidden\": false,\r\n            role,\r\n            \"aria-label\": ariaLabel,\r\n            \"aria-labelledby\": ariaLabelledBy,\r\n            \"aria-describedby\": ariaDescribedBy,\r\n            \"aria-busy\": ariaBusy,\r\n          };\r\n\r\n  return (\r\n    <Tag\r\n      className={skeletonClasses}\r\n      style={{ width, height }}\r\n      data-testid={testId}\r\n      {...accessibilityProps}\r\n      {...rest}\r\n    >\r\n      {shouldAnnounce && !ariaLabel && !ariaLabelledBy && (\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","import React from \"react\";\r\nimport \"./Skeleton.scss\";\r\nimport SkeletonBase from \"../SkeletonBase\";\r\nimport { SkeletonProps } from \"../Skeleton.types\";\r\nimport { combineClassNames } from \"../../../utils/classNames\";\r\n\r\nconst classes = {\r\n  shadowNone: \"skeleton_shadow-None\",\r\n  shadowLight: \"skeleton_shadow-Light\",\r\n  shadowMedium: \"skeleton_shadow-Medium\",\r\n  shadowStrong: \"skeleton_shadow-Strong\",\r\n  shadowIntense: \"skeleton_shadow-Intense\",\r\n\r\n  roundNone: \"skeleton_round-None\",\r\n  roundSmall: \"skeleton_round-Small\",\r\n  roundMedium: \"skeleton_round-Medium\",\r\n  roundLarge: \"skeleton_round-Large\",\r\n};\r\n\r\nconst SkeletonLoader: React.FC<SkeletonProps> = (props) => {\r\n  return (\r\n    <SkeletonBase\r\n      {...props}\r\n      className={combineClassNames(\"skeleton_loader\", props.className)}\r\n      classMap={classes}\r\n    />\r\n  );\r\n};\r\nSkeletonLoader.displayName = \"SkeletonLoader\";\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,cAAc;AAAA,EACd,mBAAmB;AAAA,EACnB,oBAAoB;AAAA,EACpB,aAAa;AAAA,EACb,aAAa;AAAA,EACb,eAAe;AAAA,EACf;AAAA,EAEA,GAAG;AACL,MAAM;AACJ,QAAM,gBAAgB,GAAG,MAAM;AAE/B,QAAM,iBAAiB,YAAY,eAAe;AAElD,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,SAAS;AAAA,EAAA;AAGjD,QAAM,0BAA0B,iBAC5B;AAAA,IACE;AAAA,IACA,CAAC,aAAa,CAAC,iBAAiB,gBAAgB;AAAA,EAAA,EAE/C,OAAO,OAAO,EACd,KAAK,GAAG,KAAK,SAChB;AAEJ,QAAM,qBACJ,eAAe,OACX;AAAA,IACE,eAAe;AAAA,EAAA,IAEjB,iBACE;AAAA,IACE,MAAM,QAAS;AAAA,IACf,aAAa,YAAY;AAAA,IACzB,aAAa,YAAa;AAAA,IAC1B,iBAAiB;AAAA,IACjB,cAAc;AAAA,IACd,mBAAmB;AAAA,IACnB,oBAAoB;AAAA,EAAA,IAEtB;AAAA,IACE,eAAe;AAAA,IACf;AAAA,IACA,cAAc;AAAA,IACd,mBAAmB;AAAA,IACnB,oBAAoB;AAAA,IACpB,aAAa;AAAA,EAAA;AAGvB,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,kBAAkB,CAAC,aAAa,CAAC,kBAChC;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;AC/F3B,MAAM,UAAU;AAAA,EACd,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,cAAc;AAAA,EACd,cAAc;AAAA,EACd,eAAe;AAAA,EAEf,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,aAAa;AAAA,EACb,YAAY;AACd;AAEA,MAAM,iBAA0C,CAAC,UAAU;AACzD,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,WAAW,kBAAkB,mBAAmB,MAAM,SAAS;AAAA,MAC/D,UAAU;AAAA,IAAA;AAAA,EAAA;AAGhB;AACA,eAAe,cAAc;"}

package/dist/core/Skeleton.cjs.js

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

package/dist/core/Skeleton.js

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

package/dist/core/{Slider-XeEn7t2O.cjs → Slider-Davbqf_v.cjs}

@@ -8,6 +8,8 @@ const SliderBase = ({
   value,
   onChange,
   onValueChange,
+  id,
+  name,
   min = 0,
   max = 100,
   step = 1,
@@ -19,14 +21,24 @@ const SliderBase = ({
   state = "",
   showValue = true,
   className = "",
-  "aria-label": ariaLabel,
   disabled = false,
+  required = false,
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledBy,
+  "aria-describedby": ariaDescribedBy,
+  "aria-valuetext": ariaValueText,
+  "aria-valuemin": ariaValueMin,
+  "aria-valuemax": ariaValueMax,
+  "aria-valuenow": ariaValueNow,
+  "aria-invalid": ariaInvalid,
+  "aria-required": ariaRequired,
+  "aria-orientation": ariaOrientation = "horizontal",
   "data-testid": testId = "slider",
   classMap,
   ...rest
 }) => {
   const uid = React.useId();
-  const inputId = `${testId}-input-${uid}`;
+  const inputId = id || `${testId}-input-${uid}`;
   const labelId = label ? `${testId}-label-${uid}` : void 0;
   const valueId = showValue ? `${testId}-value-${uid}` : void 0;
   const safeMin = Number.isFinite(min) ? Number(min) : 0;
@@ -50,13 +62,27 @@ const SliderBase = ({
     onChange == null ? void 0 : onChange(e);
     onValueChange == null ? void 0 : onValueChange(numeric);
   };
+  const computedAriaLabelledBy = label ? [labelId, ariaLabelledBy].filter(Boolean).join(" ") : ariaLabelledBy;
+  const computedAriaDescribedBy = [ariaDescribedBy, showValue ? valueId : void 0].filter(Boolean).join(" ") || void 0;
+  const computedAriaInvalid = ariaInvalid !== void 0 ? ariaInvalid : state === "error" ? true : void 0;
+  const computedAriaRequired = ariaRequired !== void 0 ? ariaRequired : required ? true : void 0;
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: containerClasses, "data-testid": `${testId}-container`, children: [
-    label && /* @__PURE__ */ jsxRuntime.jsx("label", { id: labelId, htmlFor: inputId, className: classMap.label, children: label }),
-    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classMap.wrapper, children: [
+    label && /* @__PURE__ */ jsxRuntime.jsx(
+      "label",
+      {
+        id: labelId,
+        htmlFor: inputId,
+        className: classMap.label,
+        "data-testid": `${testId}-label`,
+        children: label
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classMap.wrapper, "data-testid": `${testId}-wrapper`, children: [
       /* @__PURE__ */ jsxRuntime.jsx(
         "input",
         {
           id: inputId,
+          name,
           type: "range",
           className: classMap.slider,
           value: clamped,
@@ -64,10 +90,18 @@ const SliderBase = ({
           min: safeMin,
           max: safeMax,
           step: safeStep,
-          "aria-labelledby": label ? labelId : void 0,
-          "aria-label": label ? void 0 : ariaLabel || "Slider",
-          "aria-describedby": valueId,
           disabled,
+          required,
+          "aria-label": !computedAriaLabelledBy ? ariaLabel || "Slider" : void 0,
+          "aria-labelledby": computedAriaLabelledBy || void 0,
+          "aria-describedby": computedAriaDescribedBy,
+          "aria-valuetext": ariaValueText,
+          "aria-valuemin": ariaValueMin ?? safeMin,
+          "aria-valuemax": ariaValueMax ?? safeMax,
+          "aria-valuenow": ariaValueNow ?? clamped,
+          "aria-invalid": computedAriaInvalid,
+          "aria-required": computedAriaRequired,
+          "aria-orientation": ariaOrientation,
           "data-testid": testId,
           ...rest
         }
@@ -127,4 +161,4 @@ const Slider = (props) => {
 };
 Slider.displayName = "Slider";
 exports.Slider = Slider;
-//# sourceMappingURL=Slider-XeEn7t2O.cjs.map
+//# sourceMappingURL=Slider-Davbqf_v.cjs.map

package/dist/core/Slider-Davbqf_v.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Slider-Davbqf_v.cjs","sources":["../../src/components/Slider/SliderBase.tsx","../../src/components/Slider/core/Slider.tsx"],"sourcesContent":["import React, { useMemo, useId } from \"react\";\r\nimport { SliderProps } from \"./Slider.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\nconst SliderBase: React.FC<\r\n  SliderProps & { classMap: Record<string, string> }\r\n> = ({\r\n  value,\r\n  onChange,\r\n  onValueChange,\r\n  id,\r\n  name,\r\n  min = 0,\r\n  max = 100,\r\n  step = 1,\r\n  label,\r\n  size = getDefaultSize(),\r\n  rounding = getDefaultRounding(),\r\n  shadow = getDefaultShadow(),\r\n  theme = getDefaultTheme(),\r\n  state = \"\",\r\n  showValue = true,\r\n  className = \"\",\r\n  disabled = false,\r\n  required = false,\r\n  \"aria-label\": ariaLabel,\r\n  \"aria-labelledby\": ariaLabelledBy,\r\n  \"aria-describedby\": ariaDescribedBy,\r\n  \"aria-valuetext\": ariaValueText,\r\n  \"aria-valuemin\": ariaValueMin,\r\n  \"aria-valuemax\": ariaValueMax,\r\n  \"aria-valuenow\": ariaValueNow,\r\n  \"aria-invalid\": ariaInvalid,\r\n  \"aria-required\": ariaRequired,\r\n  \"aria-orientation\": ariaOrientation = \"horizontal\",\r\n  \"data-testid\": testId = \"slider\",\r\n  classMap,\r\n  ...rest\r\n}) => {\r\n  const uid = useId();\r\n\r\n  const inputId = id || `${testId}-input-${uid}`;\r\n  const labelId = label ? `${testId}-label-${uid}` : undefined;\r\n  const valueId = showValue ? `${testId}-value-${uid}` : undefined;\r\n\r\n  const safeMin = Number.isFinite(min) ? Number(min) : 0;\r\n  const safeMax = Number.isFinite(max) ? Number(max) : 100;\r\n  const safeStep = step > 0 ? step : 1;\r\n  const clamped = Math.min(safeMax, Math.max(safeMin, Number(value)));\r\n\r\n  const containerClasses = useMemo(\r\n    () =>\r\n      combineClassNames(\r\n        classMap.container,\r\n        classMap[size],\r\n        classMap[theme],\r\n        classMap[state],\r\n        shadow && classMap[`shadow${capitalize(shadow)}`],\r\n        rounding && classMap[`round${capitalize(rounding)}`],\r\n        className,\r\n      ),\r\n    [classMap, size, theme, state, className, shadow, rounding],\r\n  );\r\n\r\n  const handleChange = (e: React.ChangeEvent<HTMLInputElement>) => {\r\n    const numeric = Number(e.target.value);\r\n    onChange?.(e);\r\n    onValueChange?.(numeric);\r\n  };\r\n\r\n  const computedAriaLabelledBy = label\r\n    ? [labelId, ariaLabelledBy].filter(Boolean).join(\" \")\r\n    : ariaLabelledBy;\r\n\r\n  const computedAriaDescribedBy =\r\n    [ariaDescribedBy, showValue ? valueId : undefined]\r\n      .filter(Boolean)\r\n      .join(\" \") || undefined;\r\n\r\n  const computedAriaInvalid =\r\n    ariaInvalid !== undefined\r\n      ? ariaInvalid\r\n      : state === \"error\"\r\n        ? true\r\n        : undefined;\r\n\r\n  const computedAriaRequired =\r\n    ariaRequired !== undefined ? ariaRequired : required ? true : undefined;\r\n\r\n  return (\r\n    <div className={containerClasses} data-testid={`${testId}-container`}>\r\n      {label && (\r\n        <label\r\n          id={labelId}\r\n          htmlFor={inputId}\r\n          className={classMap.label}\r\n          data-testid={`${testId}-label`}\r\n        >\r\n          {label}\r\n        </label>\r\n      )}\r\n\r\n      <div className={classMap.wrapper} data-testid={`${testId}-wrapper`}>\r\n        <input\r\n          id={inputId}\r\n          name={name}\r\n          type=\"range\"\r\n          className={classMap.slider}\r\n          value={clamped}\r\n          onChange={handleChange}\r\n          min={safeMin}\r\n          max={safeMax}\r\n          step={safeStep}\r\n          disabled={disabled}\r\n          required={required}\r\n          aria-label={\r\n            !computedAriaLabelledBy ? ariaLabel || \"Slider\" : undefined\r\n          }\r\n          aria-labelledby={computedAriaLabelledBy || undefined}\r\n          aria-describedby={computedAriaDescribedBy}\r\n          aria-valuetext={ariaValueText}\r\n          aria-valuemin={ariaValueMin ?? safeMin}\r\n          aria-valuemax={ariaValueMax ?? safeMax}\r\n          aria-valuenow={ariaValueNow ?? clamped}\r\n          aria-invalid={computedAriaInvalid}\r\n          aria-required={computedAriaRequired}\r\n          aria-orientation={ariaOrientation}\r\n          data-testid={testId}\r\n          {...rest}\r\n        />\r\n\r\n        {showValue && (\r\n          <output\r\n            id={valueId}\r\n            className={classMap.value}\r\n            htmlFor={inputId}\r\n            data-testid={`${testId}-value`}\r\n          >\r\n            {clamped}\r\n          </output>\r\n        )}\r\n      </div>\r\n    </div>\r\n  );\r\n};\r\n\r\nSliderBase.displayName = \"SliderBase\";\r\nexport default SliderBase;\r\n","import React from \"react\";\r\nimport \"./Slider.scss\"; // Non-module SCSS\r\nimport { SliderProps } from \"../Slider.types\";\r\nimport SliderBase from \"../SliderBase\";\r\nimport { combineClassNames } from \"../../../utils/classNames\";\r\n\r\nconst coreStyles = {\r\n  container: \"slider_container\",\r\n  label: \"slider_label\",\r\n  wrapper: \"slider_wrapper\",\r\n  slider: \"slider\",\r\n  value: \"slider_value\",\r\n\r\n  xs: \"slider_xs\",\r\n  small: \"slider_small\",\r\n  medium: \"slider_medium\",\r\n  large: \"slider_large\",\r\n  xl: \"slider_xl\",\r\n\r\n  primary: \"slider_primary\",\r\n  secondary: \"slider_secondary\",\r\n  tertiary: \"slider_tertiary\",\r\n  quaternary: \"slider_quaternary\",\r\n\r\n  success: \"slider_success\",\r\n  error: \"slider_error\",\r\n  warning: \"slider_warning\",\r\n\r\n  clear: \"slider_clear\",\r\n\r\n  shadowNone: \"slider_shadow-None\",\r\n  shadowLight: \"slider_shadow-Light\",\r\n  shadowMedium: \"slider_shadow-Medium\",\r\n  shadowStrong: \"slider_shadow-Strong\",\r\n  shadowIntense: \"slider_shadow-Intense\",\r\n\r\n  roundNone: \"slider_round-None\",\r\n  roundSmall: \"slider_round-Small\",\r\n  roundMedium: \"slider_round-Medium\",\r\n  roundLarge: \"slider_round-Large\",\r\n};\r\n\r\nconst Slider: React.FC<SliderProps> = (props) => {\r\n  return (\r\n    <SliderBase\r\n      {...props}\r\n      className={combineClassNames(props.className)}\r\n      classMap={coreStyles}\r\n    />\r\n  );\r\n};\r\nSlider.displayName = \"Slider\";\r\nexport default Slider;\r\n"],"names":["getDefaultSize","getDefaultRounding","getDefaultShadow","getDefaultTheme","useId","useMemo","combineClassNames","capitalize","jsx","jsxs"],"mappings":"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"}

package/dist/core/{Slider-BLSK3_yt.js → Slider-Dxcryk5j.js}

@@ -7,6 +7,8 @@ const SliderBase = ({
   value,
   onChange,
   onValueChange,
+  id,
+  name,
   min = 0,
   max = 100,
   step = 1,
@@ -18,14 +20,24 @@ const SliderBase = ({
   state = "",
   showValue = true,
   className = "",
-  "aria-label": ariaLabel,
   disabled = false,
+  required = false,
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledBy,
+  "aria-describedby": ariaDescribedBy,
+  "aria-valuetext": ariaValueText,
+  "aria-valuemin": ariaValueMin,
+  "aria-valuemax": ariaValueMax,
+  "aria-valuenow": ariaValueNow,
+  "aria-invalid": ariaInvalid,
+  "aria-required": ariaRequired,
+  "aria-orientation": ariaOrientation = "horizontal",
   "data-testid": testId = "slider",
   classMap,
   ...rest
 }) => {
   const uid = useId();
-  const inputId = `${testId}-input-${uid}`;
+  const inputId = id || `${testId}-input-${uid}`;
   const labelId = label ? `${testId}-label-${uid}` : void 0;
   const valueId = showValue ? `${testId}-value-${uid}` : void 0;
   const safeMin = Number.isFinite(min) ? Number(min) : 0;
@@ -49,13 +61,27 @@ const SliderBase = ({
     onChange == null ? void 0 : onChange(e);
     onValueChange == null ? void 0 : onValueChange(numeric);
   };
+  const computedAriaLabelledBy = label ? [labelId, ariaLabelledBy].filter(Boolean).join(" ") : ariaLabelledBy;
+  const computedAriaDescribedBy = [ariaDescribedBy, showValue ? valueId : void 0].filter(Boolean).join(" ") || void 0;
+  const computedAriaInvalid = ariaInvalid !== void 0 ? ariaInvalid : state === "error" ? true : void 0;
+  const computedAriaRequired = ariaRequired !== void 0 ? ariaRequired : required ? true : void 0;
   return /* @__PURE__ */ jsxs("div", { className: containerClasses, "data-testid": `${testId}-container`, children: [
-    label && /* @__PURE__ */ jsx("label", { id: labelId, htmlFor: inputId, className: classMap.label, children: label }),
-    /* @__PURE__ */ jsxs("div", { className: classMap.wrapper, children: [
+    label && /* @__PURE__ */ jsx(
+      "label",
+      {
+        id: labelId,
+        htmlFor: inputId,
+        className: classMap.label,
+        "data-testid": `${testId}-label`,
+        children: label
+      }
+    ),
+    /* @__PURE__ */ jsxs("div", { className: classMap.wrapper, "data-testid": `${testId}-wrapper`, children: [
       /* @__PURE__ */ jsx(
         "input",
         {
           id: inputId,
+          name,
           type: "range",
           className: classMap.slider,
           value: clamped,
@@ -63,10 +89,18 @@ const SliderBase = ({
           min: safeMin,
           max: safeMax,
           step: safeStep,
-          "aria-labelledby": label ? labelId : void 0,
-          "aria-label": label ? void 0 : ariaLabel || "Slider",
-          "aria-describedby": valueId,
           disabled,
+          required,
+          "aria-label": !computedAriaLabelledBy ? ariaLabel || "Slider" : void 0,
+          "aria-labelledby": computedAriaLabelledBy || void 0,
+          "aria-describedby": computedAriaDescribedBy,
+          "aria-valuetext": ariaValueText,
+          "aria-valuemin": ariaValueMin ?? safeMin,
+          "aria-valuemax": ariaValueMax ?? safeMax,
+          "aria-valuenow": ariaValueNow ?? clamped,
+          "aria-invalid": computedAriaInvalid,
+          "aria-required": computedAriaRequired,
+          "aria-orientation": ariaOrientation,
           "data-testid": testId,
           ...rest
         }
@@ -128,4 +162,4 @@ Slider.displayName = "Slider";
 export {
   Slider as S
 };
-//# sourceMappingURL=Slider-BLSK3_yt.js.map
+//# sourceMappingURL=Slider-Dxcryk5j.js.map