boreal-ui 0.0.71 → 0.0.73

package/dist/core/Timeline.js

@@ -1,4 +1,4 @@
-import { T } from "./Timeline-C-FaSSxr.js";
+import { T } from "./Timeline-BRLd8boJ.js";
 export {
   T as default
 };

package/dist/core/{Toggle-B4bJ4Jcj.cjs → Toggle-BRUwXOhV.cjs}

@@ -3,12 +3,20 @@ const jsxRuntime = 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 borealStyleConfig = require("./boreal-style-config-C1UIwOFN.cjs");
 const ToggleBase = React.forwardRef(
   ({
     checked,
     onChange,
     label,
+    id,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy,
+    "aria-describedby": ariaDescribedBy,
+    "aria-invalid": ariaInvalid,
+    "aria-errormessage": ariaErrorMessage,
+    "aria-disabled": ariaDisabled,
+    tabIndex,
     theme = borealStyleConfig.getDefaultTheme(),
     rounding = borealStyleConfig.getDefaultRounding(),
     shadow = borealStyleConfig.getDefaultShadow(),
@@ -20,10 +28,14 @@ const ToggleBase = React.forwardRef(
     "data-testid": testId = "toggle"
   }, ref) => {
     const uid = React.useId();
-    const buttonId = `${testId}-button-${uid}`;
-    const labelId = label ? `${testId}-label-${uid}` : void 0;
+    const buttonId = id ?? `${testId}-button-${uid}`;
+    const internalLabelId = label ? `${testId}-label-${uid}` : void 0;
+    const resolvedAriaLabelledBy = ariaLabelledBy || (!ariaLabel && label ? internalLabelId : void 0);
+    const resolvedAriaLabel = !resolvedAriaLabelledBy ? ariaLabel || (!label ? "Toggle switch" : void 0) : void 0;
     const setOn = (next) => {
-      if (!disabled && next !== checked) onChange(next);
+      if (!disabled && next !== checked) {
+        onChange(next);
+      }
     };
     const toggle = () => setOn(!checked);
     const handleKeyDown = (e) => {
@@ -72,11 +84,16 @@ const ToggleBase = React.forwardRef(
           id: buttonId,
           className: toggleClass,
           role: "switch",
-          "aria-checked": checked,
-          "aria-labelledby": label ? labelId : void 0,
-          "aria-label": label ? void 0 : "Toggle switch",
           type: "button",
           disabled,
+          "aria-checked": checked,
+          "aria-label": resolvedAriaLabel,
+          "aria-labelledby": resolvedAriaLabelledBy,
+          "aria-describedby": ariaDescribedBy,
+          "aria-invalid": ariaInvalid,
+          "aria-errormessage": ariaErrorMessage,
+          "aria-disabled": (ariaDisabled ?? disabled) || void 0,
+          tabIndex,
           onClick: toggle,
           onKeyDown: handleKeyDown,
           "data-testid": testId,
@@ -90,10 +107,10 @@ const ToggleBase = React.forwardRef(
           )
         }
       ),
-      label && /* @__PURE__ */ jsxRuntime.jsx(
+      label && !ariaLabelledBy && /* @__PURE__ */ jsxRuntime.jsx(
         "label",
         {
-          id: labelId,
+          id: internalLabelId,
           htmlFor: buttonId,
           className: classMap.label,
           "data-testid": `${testId}-label`,
@@ -139,4 +156,4 @@ const Toggle = React.forwardRef((props, ref) => {
 });
 Toggle.displayName = "Toggle";
 exports.Toggle = Toggle;
-//# sourceMappingURL=Toggle-B4bJ4Jcj.cjs.map
+//# sourceMappingURL=Toggle-BRUwXOhV.cjs.map

package/dist/core/Toggle-BRUwXOhV.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toggle-BRUwXOhV.cjs","sources":["../../src/components/Toggle/ToggleBase.tsx","../../src/components/Toggle/core/Toggle.tsx"],"sourcesContent":["import { forwardRef, KeyboardEvent, useId, useMemo } from \"react\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { ToggleBaseProps } from \"./Toggle.types\";\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 ToggleBase = forwardRef<HTMLButtonElement, ToggleBaseProps>(\r\n  (\r\n    {\r\n      checked,\r\n      onChange,\r\n      label,\r\n      id,\r\n      \"aria-label\": ariaLabel,\r\n      \"aria-labelledby\": ariaLabelledBy,\r\n      \"aria-describedby\": ariaDescribedBy,\r\n      \"aria-invalid\": ariaInvalid,\r\n      \"aria-errormessage\": ariaErrorMessage,\r\n      \"aria-disabled\": ariaDisabled,\r\n      tabIndex,\r\n      theme = getDefaultTheme(),\r\n      rounding = getDefaultRounding(),\r\n      shadow = getDefaultShadow(),\r\n      state = \"\",\r\n      size = getDefaultSize(),\r\n      disabled = false,\r\n      classMap,\r\n      className,\r\n      \"data-testid\": testId = \"toggle\",\r\n    },\r\n    ref,\r\n  ) => {\r\n    const uid = useId();\r\n\r\n    const buttonId = id ?? `${testId}-button-${uid}`;\r\n    const internalLabelId = label ? `${testId}-label-${uid}` : undefined;\r\n\r\n    const resolvedAriaLabelledBy =\r\n      ariaLabelledBy || (!ariaLabel && label ? internalLabelId : undefined);\r\n\r\n    const resolvedAriaLabel = !resolvedAriaLabelledBy\r\n      ? ariaLabel || (!label ? \"Toggle switch\" : undefined)\r\n      : undefined;\r\n\r\n    const setOn = (next: boolean) => {\r\n      if (!disabled && next !== checked) {\r\n        onChange(next);\r\n      }\r\n    };\r\n\r\n    const toggle = () => setOn(!checked);\r\n\r\n    const handleKeyDown = (e: KeyboardEvent<HTMLButtonElement>) => {\r\n      if (disabled) return;\r\n\r\n      switch (e.key) {\r\n        case \" \":\r\n        case \"Enter\":\r\n          e.preventDefault();\r\n          toggle();\r\n          break;\r\n        case \"ArrowRight\":\r\n          e.preventDefault();\r\n          setOn(true);\r\n          break;\r\n        case \"ArrowLeft\":\r\n          e.preventDefault();\r\n          setOn(false);\r\n          break;\r\n      }\r\n    };\r\n\r\n    const containerClass = useMemo(\r\n      () =>\r\n        combineClassNames(\r\n          classMap.container,\r\n          classMap[theme],\r\n          classMap[state],\r\n          classMap[size],\r\n          disabled && classMap.disabled,\r\n          className,\r\n        ),\r\n      [classMap, theme, state, size, disabled, className],\r\n    );\r\n\r\n    const toggleClass = useMemo(\r\n      () =>\r\n        combineClassNames(\r\n          classMap.toggle,\r\n          checked && classMap.active,\r\n          shadow && classMap[`shadow${capitalize(shadow)}`],\r\n          rounding && classMap[`round${capitalize(rounding)}`],\r\n        ),\r\n      [classMap, checked, shadow, rounding],\r\n    );\r\n\r\n    return (\r\n      <div className={containerClass} data-testid={`${testId}-wrapper`}>\r\n        <button\r\n          ref={ref}\r\n          id={buttonId}\r\n          className={toggleClass}\r\n          role=\"switch\"\r\n          type=\"button\"\r\n          disabled={disabled}\r\n          aria-checked={checked}\r\n          aria-label={resolvedAriaLabel}\r\n          aria-labelledby={resolvedAriaLabelledBy}\r\n          aria-describedby={ariaDescribedBy}\r\n          aria-invalid={ariaInvalid}\r\n          aria-errormessage={ariaErrorMessage}\r\n          aria-disabled={(ariaDisabled ?? disabled) || undefined}\r\n          tabIndex={tabIndex}\r\n          onClick={toggle}\r\n          onKeyDown={handleKeyDown}\r\n          data-testid={testId}\r\n        >\r\n          <span\r\n            className={classMap.slider}\r\n            aria-hidden=\"true\"\r\n            data-testid={`${testId}-slider`}\r\n          />\r\n        </button>\r\n\r\n        {label && !ariaLabelledBy && (\r\n          <label\r\n            id={internalLabelId}\r\n            htmlFor={buttonId}\r\n            className={classMap.label}\r\n            data-testid={`${testId}-label`}\r\n          >\r\n            {label}\r\n          </label>\r\n        )}\r\n      </div>\r\n    );\r\n  },\r\n);\r\n\r\nToggleBase.displayName = \"ToggleBase\";\r\nexport default ToggleBase;\r\n","import { forwardRef } from \"react\";\r\nimport \"./Toggle.scss\";\r\nimport ToggleBase from \"../ToggleBase\";\r\nimport { ToggleProps } from \"../Toggle.types\";\r\n\r\nconst classes = {\r\n  container: \"container\",\r\n  toggle: \"toggle\",\r\n  active: \"toggle_active\",\r\n  slider: \"toggle_slider\",\r\n  label: \"toggle_label\",\r\n\r\n  primary: \"toggle_primary\",\r\n  secondary: \"toggle_secondary\",\r\n  tertiary: \"toggle_tertiary\",\r\n  quaternary: \"toggle_quaternary\",\r\n\r\n  success: \"toggle_success\",\r\n  warning: \"toggle_warning\",\r\n  error: \"toggle_error\",\r\n\r\n  clear: \"toggle_clear\",\r\n\r\n  disabled: \"toggle_disabled\",\r\n\r\n  xs: \"toggle_xs\",\r\n  small: \"toggle_small\",\r\n  medium: \"toggle_medium\",\r\n  large: \"toggle_large\",\r\n  xl: \"toggle_xl\",\r\n\r\n  shadowNone: \"toggle_shadow-None\",\r\n  shadowLight: \"toggle_shadow-Light\",\r\n  shadowMedium: \"toggle_shadow-Medium\",\r\n  shadowStrong: \"toggle_shadow-Strong\",\r\n  shadowIntense: \"toggle_shadow-Intense\",\r\n\r\n  roundNone: \"toggle_round-None\",\r\n  roundSmall: \"toggle_round-Small\",\r\n  roundMedium: \"toggle_round-Medium\",\r\n  roundLarge: \"toggle_round-Large\",\r\n};\r\n\r\nconst Toggle = forwardRef<HTMLButtonElement, ToggleProps>((props, ref) => {\r\n  return <ToggleBase {...props} classMap={classes} ref={ref} />;\r\n});\r\nToggle.displayName = \"Toggle\";\r\nexport default Toggle;\r\n"],"names":["forwardRef","getDefaultTheme","getDefaultRounding","getDefaultShadow","getDefaultSize","useId","useMemo","combineClassNames","capitalize","jsx"],"mappings":"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"}

package/dist/core/{Toggle-DxNHxjZn.js → Toggle-DL0Nhwgr.js}

@@ -2,12 +2,20 @@ import { jsxs, jsx } from "react/jsx-runtime";
 import { forwardRef, useId, useMemo } from "react";
 import { c as combineClassNames } from "./classNames-AS8QjFq7.js";
 import { c as capitalize } from "./capitalize-C0TSQSPh.js";
-import { c as getDefaultSize, d as getDefaultTheme, a as getDefaultRounding, b as getDefaultShadow } from "./boreal-style-config-BILmxkZG.js";
+import { c as getDefaultSize, d as getDefaultTheme, a as getDefaultRounding, b as getDefaultShadow } from "./boreal-style-config-DsaRlxmw.js";
 const ToggleBase = forwardRef(
   ({
     checked,
     onChange,
     label,
+    id,
+    "aria-label": ariaLabel,
+    "aria-labelledby": ariaLabelledBy,
+    "aria-describedby": ariaDescribedBy,
+    "aria-invalid": ariaInvalid,
+    "aria-errormessage": ariaErrorMessage,
+    "aria-disabled": ariaDisabled,
+    tabIndex,
     theme = getDefaultTheme(),
     rounding = getDefaultRounding(),
     shadow = getDefaultShadow(),
@@ -19,10 +27,14 @@ const ToggleBase = forwardRef(
     "data-testid": testId = "toggle"
   }, ref) => {
     const uid = useId();
-    const buttonId = `${testId}-button-${uid}`;
-    const labelId = label ? `${testId}-label-${uid}` : void 0;
+    const buttonId = id ?? `${testId}-button-${uid}`;
+    const internalLabelId = label ? `${testId}-label-${uid}` : void 0;
+    const resolvedAriaLabelledBy = ariaLabelledBy || (!ariaLabel && label ? internalLabelId : void 0);
+    const resolvedAriaLabel = !resolvedAriaLabelledBy ? ariaLabel || (!label ? "Toggle switch" : void 0) : void 0;
     const setOn = (next) => {
-      if (!disabled && next !== checked) onChange(next);
+      if (!disabled && next !== checked) {
+        onChange(next);
+      }
     };
     const toggle = () => setOn(!checked);
     const handleKeyDown = (e) => {
@@ -71,11 +83,16 @@ const ToggleBase = forwardRef(
           id: buttonId,
           className: toggleClass,
           role: "switch",
-          "aria-checked": checked,
-          "aria-labelledby": label ? labelId : void 0,
-          "aria-label": label ? void 0 : "Toggle switch",
           type: "button",
           disabled,
+          "aria-checked": checked,
+          "aria-label": resolvedAriaLabel,
+          "aria-labelledby": resolvedAriaLabelledBy,
+          "aria-describedby": ariaDescribedBy,
+          "aria-invalid": ariaInvalid,
+          "aria-errormessage": ariaErrorMessage,
+          "aria-disabled": (ariaDisabled ?? disabled) || void 0,
+          tabIndex,
           onClick: toggle,
           onKeyDown: handleKeyDown,
           "data-testid": testId,
@@ -89,10 +106,10 @@ const ToggleBase = forwardRef(
           )
         }
       ),
-      label && /* @__PURE__ */ jsx(
+      label && !ariaLabelledBy && /* @__PURE__ */ jsx(
         "label",
         {
-          id: labelId,
+          id: internalLabelId,
           htmlFor: buttonId,
           className: classMap.label,
           "data-testid": `${testId}-label`,
@@ -140,4 +157,4 @@ Toggle.displayName = "Toggle";
 export {
   Toggle as T
 };
-//# sourceMappingURL=Toggle-DxNHxjZn.js.map
+//# sourceMappingURL=Toggle-DL0Nhwgr.js.map

package/dist/core/Toggle-DL0Nhwgr.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toggle-DL0Nhwgr.js","sources":["../../src/components/Toggle/ToggleBase.tsx","../../src/components/Toggle/core/Toggle.tsx"],"sourcesContent":["import { forwardRef, KeyboardEvent, useId, useMemo } from \"react\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { ToggleBaseProps } from \"./Toggle.types\";\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 ToggleBase = forwardRef<HTMLButtonElement, ToggleBaseProps>(\r\n  (\r\n    {\r\n      checked,\r\n      onChange,\r\n      label,\r\n      id,\r\n      \"aria-label\": ariaLabel,\r\n      \"aria-labelledby\": ariaLabelledBy,\r\n      \"aria-describedby\": ariaDescribedBy,\r\n      \"aria-invalid\": ariaInvalid,\r\n      \"aria-errormessage\": ariaErrorMessage,\r\n      \"aria-disabled\": ariaDisabled,\r\n      tabIndex,\r\n      theme = getDefaultTheme(),\r\n      rounding = getDefaultRounding(),\r\n      shadow = getDefaultShadow(),\r\n      state = \"\",\r\n      size = getDefaultSize(),\r\n      disabled = false,\r\n      classMap,\r\n      className,\r\n      \"data-testid\": testId = \"toggle\",\r\n    },\r\n    ref,\r\n  ) => {\r\n    const uid = useId();\r\n\r\n    const buttonId = id ?? `${testId}-button-${uid}`;\r\n    const internalLabelId = label ? `${testId}-label-${uid}` : undefined;\r\n\r\n    const resolvedAriaLabelledBy =\r\n      ariaLabelledBy || (!ariaLabel && label ? internalLabelId : undefined);\r\n\r\n    const resolvedAriaLabel = !resolvedAriaLabelledBy\r\n      ? ariaLabel || (!label ? \"Toggle switch\" : undefined)\r\n      : undefined;\r\n\r\n    const setOn = (next: boolean) => {\r\n      if (!disabled && next !== checked) {\r\n        onChange(next);\r\n      }\r\n    };\r\n\r\n    const toggle = () => setOn(!checked);\r\n\r\n    const handleKeyDown = (e: KeyboardEvent<HTMLButtonElement>) => {\r\n      if (disabled) return;\r\n\r\n      switch (e.key) {\r\n        case \" \":\r\n        case \"Enter\":\r\n          e.preventDefault();\r\n          toggle();\r\n          break;\r\n        case \"ArrowRight\":\r\n          e.preventDefault();\r\n          setOn(true);\r\n          break;\r\n        case \"ArrowLeft\":\r\n          e.preventDefault();\r\n          setOn(false);\r\n          break;\r\n      }\r\n    };\r\n\r\n    const containerClass = useMemo(\r\n      () =>\r\n        combineClassNames(\r\n          classMap.container,\r\n          classMap[theme],\r\n          classMap[state],\r\n          classMap[size],\r\n          disabled && classMap.disabled,\r\n          className,\r\n        ),\r\n      [classMap, theme, state, size, disabled, className],\r\n    );\r\n\r\n    const toggleClass = useMemo(\r\n      () =>\r\n        combineClassNames(\r\n          classMap.toggle,\r\n          checked && classMap.active,\r\n          shadow && classMap[`shadow${capitalize(shadow)}`],\r\n          rounding && classMap[`round${capitalize(rounding)}`],\r\n        ),\r\n      [classMap, checked, shadow, rounding],\r\n    );\r\n\r\n    return (\r\n      <div className={containerClass} data-testid={`${testId}-wrapper`}>\r\n        <button\r\n          ref={ref}\r\n          id={buttonId}\r\n          className={toggleClass}\r\n          role=\"switch\"\r\n          type=\"button\"\r\n          disabled={disabled}\r\n          aria-checked={checked}\r\n          aria-label={resolvedAriaLabel}\r\n          aria-labelledby={resolvedAriaLabelledBy}\r\n          aria-describedby={ariaDescribedBy}\r\n          aria-invalid={ariaInvalid}\r\n          aria-errormessage={ariaErrorMessage}\r\n          aria-disabled={(ariaDisabled ?? disabled) || undefined}\r\n          tabIndex={tabIndex}\r\n          onClick={toggle}\r\n          onKeyDown={handleKeyDown}\r\n          data-testid={testId}\r\n        >\r\n          <span\r\n            className={classMap.slider}\r\n            aria-hidden=\"true\"\r\n            data-testid={`${testId}-slider`}\r\n          />\r\n        </button>\r\n\r\n        {label && !ariaLabelledBy && (\r\n          <label\r\n            id={internalLabelId}\r\n            htmlFor={buttonId}\r\n            className={classMap.label}\r\n            data-testid={`${testId}-label`}\r\n          >\r\n            {label}\r\n          </label>\r\n        )}\r\n      </div>\r\n    );\r\n  },\r\n);\r\n\r\nToggleBase.displayName = \"ToggleBase\";\r\nexport default ToggleBase;\r\n","import { forwardRef } from \"react\";\r\nimport \"./Toggle.scss\";\r\nimport ToggleBase from \"../ToggleBase\";\r\nimport { ToggleProps } from \"../Toggle.types\";\r\n\r\nconst classes = {\r\n  container: \"container\",\r\n  toggle: \"toggle\",\r\n  active: \"toggle_active\",\r\n  slider: \"toggle_slider\",\r\n  label: \"toggle_label\",\r\n\r\n  primary: \"toggle_primary\",\r\n  secondary: \"toggle_secondary\",\r\n  tertiary: \"toggle_tertiary\",\r\n  quaternary: \"toggle_quaternary\",\r\n\r\n  success: \"toggle_success\",\r\n  warning: \"toggle_warning\",\r\n  error: \"toggle_error\",\r\n\r\n  clear: \"toggle_clear\",\r\n\r\n  disabled: \"toggle_disabled\",\r\n\r\n  xs: \"toggle_xs\",\r\n  small: \"toggle_small\",\r\n  medium: \"toggle_medium\",\r\n  large: \"toggle_large\",\r\n  xl: \"toggle_xl\",\r\n\r\n  shadowNone: \"toggle_shadow-None\",\r\n  shadowLight: \"toggle_shadow-Light\",\r\n  shadowMedium: \"toggle_shadow-Medium\",\r\n  shadowStrong: \"toggle_shadow-Strong\",\r\n  shadowIntense: \"toggle_shadow-Intense\",\r\n\r\n  roundNone: \"toggle_round-None\",\r\n  roundSmall: \"toggle_round-Small\",\r\n  roundMedium: \"toggle_round-Medium\",\r\n  roundLarge: \"toggle_round-Large\",\r\n};\r\n\r\nconst Toggle = forwardRef<HTMLButtonElement, ToggleProps>((props, ref) => {\r\n  return <ToggleBase {...props} classMap={classes} ref={ref} />;\r\n});\r\nToggle.displayName = \"Toggle\";\r\nexport default Toggle;\r\n"],"names":[],"mappings":"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"}

package/dist/core/Toggle.cjs.js

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

package/dist/core/Toggle.js

@@ -1,4 +1,4 @@
-import { T } from "./Toggle-DxNHxjZn.js";
+import { T } from "./Toggle-DL0Nhwgr.js";
 export {
   T as default
 };

package/dist/core/{Toolbar-DKSfwRUz.cjs → Toolbar-CxJxebIJ.cjs}

@@ -1,12 +1,13 @@
 "use strict";
 const jsxRuntime = require("react/jsx-runtime");
-const Avatar = require("./Avatar-DOg8W9yf.cjs");
+const Avatar = require("./Avatar-jxGFijtF.cjs");
 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 borealStyleConfig = require("./boreal-style-config-C1UIwOFN.cjs");
 const ToolbarBase = ({
   title,
+  titleId,
   left,
   center,
   right,
@@ -16,9 +17,15 @@ const ToolbarBase = ({
   rounding = borealStyleConfig.getDefaultRounding(),
   className = "",
   "data-testid": testId = "toolbar",
+  "aria-label": ariaLabelProp,
+  "aria-labelledby": ariaLabelledBy,
+  "aria-describedby": ariaDescribedBy,
+  leftAriaLabel = "Toolbar left section",
+  centerAriaLabel = "Toolbar center section",
+  rightAriaLabel = "Toolbar right section",
   AvatarComponent,
   classMap,
-  ariaLabel = "Toolbar",
+  "aria-label": ariaLabel = "Toolbar",
   headingLevel = 1
 }) => {
   const safeHeading = Math.min(6, Math.max(1, headingLevel));
@@ -33,14 +40,18 @@ const ToolbarBase = ({
     ),
     [classMap, theme, className, shadow, rounding]
   );
-  const avatarAriaHidden = avatar && !avatar.name && !avatar.onClick ? true : void 0;
+  const resolvedAriaLabel = ariaLabelledBy ? void 0 : ariaLabelProp ?? ariaLabel;
+  const avatarAriaHidden = avatar && !avatar.name && !avatar.onClick && !avatar["aria-label"] ? true : void 0;
+  const resolvedTitleId = title ? titleId ?? `${testId}-title` : void 0;
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
       className: toolbarClass,
       role: "toolbar",
       "aria-orientation": "horizontal",
-      "aria-label": ariaLabel,
+      "aria-label": resolvedAriaLabel,
+      "aria-labelledby": ariaLabelledBy,
+      "aria-describedby": ariaDescribedBy,
       "data-testid": testId,
       children: [
         /* @__PURE__ */ jsxRuntime.jsx(
@@ -48,7 +59,7 @@ const ToolbarBase = ({
           {
             className: classMap.section,
             role: "group",
-            "aria-label": "Toolbar left section",
+            "aria-label": leftAriaLabel,
             "data-testid": `${testId}-left`,
             children: left
           }
@@ -58,10 +69,18 @@ const ToolbarBase = ({
           {
             className: classMap.section,
             role: "group",
-            "aria-label": "Toolbar center section",
+            "aria-label": centerAriaLabel,
             "data-testid": `${testId}-center`,
             children: [
-              title && /* @__PURE__ */ jsxRuntime.jsx(TitleTag, { className: classMap.title, "data-testid": `${testId}-title`, children: title }),
+              title && /* @__PURE__ */ jsxRuntime.jsx(
+                TitleTag,
+                {
+                  id: resolvedTitleId,
+                  className: classMap.title,
+                  "data-testid": `${testId}-title`,
+                  children: title
+                }
+              ),
               center
             ]
           }
@@ -71,7 +90,7 @@ const ToolbarBase = ({
           {
             className: classMap.section,
             role: "group",
-            "aria-label": "Toolbar right section",
+            "aria-label": rightAriaLabel,
             "data-testid": `${testId}-right`,
             children: [
               right,
@@ -90,6 +109,7 @@ const ToolbarBase = ({
                       theme: avatar.theme,
                       outline: avatar.outline,
                       onClick: avatar.onClick,
+                      "aria-label": avatar["aria-label"],
                       "aria-hidden": avatarAriaHidden
                     }
                   )
@@ -126,4 +146,4 @@ const classes = {
 const Toolbar = (props) => /* @__PURE__ */ jsxRuntime.jsx(ToolbarBase, { ...props, AvatarComponent: Avatar.Avatar, classMap: classes });
 Toolbar.displayName = "Toolbar";
 exports.Toolbar = Toolbar;
-//# sourceMappingURL=Toolbar-DKSfwRUz.cjs.map
+//# sourceMappingURL=Toolbar-CxJxebIJ.cjs.map

package/dist/core/Toolbar-CxJxebIJ.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toolbar-CxJxebIJ.cjs","sources":["../../src/components/Toolbar/ToolbarBase.tsx","../../src/components/Toolbar/core/Toolbar.tsx"],"sourcesContent":["import React, { JSX, useMemo } from \"react\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { ToolbarBaseProps } from \"./Toolbar.types\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n  getDefaultRounding,\r\n  getDefaultShadow,\r\n  getDefaultTheme,\r\n} from \"../../config/boreal-style-config\";\r\n\r\nconst ToolbarBase: React.FC<ToolbarBaseProps> = ({\r\n  title,\r\n  titleId,\r\n  left,\r\n  center,\r\n  right,\r\n  avatar,\r\n  theme = getDefaultTheme(),\r\n  shadow = getDefaultShadow(),\r\n  rounding = getDefaultRounding(),\r\n  className = \"\",\r\n  \"data-testid\": testId = \"toolbar\",\r\n  \"aria-label\": ariaLabelProp,\r\n  \"aria-labelledby\": ariaLabelledBy,\r\n  \"aria-describedby\": ariaDescribedBy,\r\n  leftAriaLabel = \"Toolbar left section\",\r\n  centerAriaLabel = \"Toolbar center section\",\r\n  rightAriaLabel = \"Toolbar right section\",\r\n  AvatarComponent,\r\n  classMap,\r\n  \"aria-label\": ariaLabel = \"Toolbar\",\r\n  headingLevel = 1,\r\n}): JSX.Element => {\r\n  const safeHeading = Math.min(6, Math.max(1, headingLevel));\r\n  const TitleTag = `h${safeHeading}` as keyof JSX.IntrinsicElements;\r\n\r\n  const toolbarClass = useMemo(\r\n    () =>\r\n      combineClassNames(\r\n        classMap.toolbar,\r\n        classMap[theme],\r\n        className,\r\n        shadow && classMap[`shadow${capitalize(shadow)}`],\r\n        rounding && classMap[`round${capitalize(rounding)}`],\r\n      ),\r\n    [classMap, theme, className, shadow, rounding],\r\n  );\r\n\r\n  const resolvedAriaLabel = ariaLabelledBy\r\n    ? undefined\r\n    : (ariaLabelProp ?? ariaLabel);\r\n\r\n  const avatarAriaHidden =\r\n    avatar && !avatar.name && !avatar.onClick && !avatar[\"aria-label\"]\r\n      ? true\r\n      : undefined;\r\n\r\n  const resolvedTitleId = title ? (titleId ?? `${testId}-title`) : undefined;\r\n\r\n  return (\r\n    <div\r\n      className={toolbarClass}\r\n      role=\"toolbar\"\r\n      aria-orientation=\"horizontal\"\r\n      aria-label={resolvedAriaLabel}\r\n      aria-labelledby={ariaLabelledBy}\r\n      aria-describedby={ariaDescribedBy}\r\n      data-testid={testId}\r\n    >\r\n      <div\r\n        className={classMap.section}\r\n        role=\"group\"\r\n        aria-label={leftAriaLabel}\r\n        data-testid={`${testId}-left`}\r\n      >\r\n        {left}\r\n      </div>\r\n\r\n      <div\r\n        className={classMap.section}\r\n        role=\"group\"\r\n        aria-label={centerAriaLabel}\r\n        data-testid={`${testId}-center`}\r\n      >\r\n        {title && (\r\n          <TitleTag\r\n            id={resolvedTitleId}\r\n            className={classMap.title}\r\n            data-testid={`${testId}-title`}\r\n          >\r\n            {title}\r\n          </TitleTag>\r\n        )}\r\n        {center}\r\n      </div>\r\n\r\n      <div\r\n        className={classMap.section}\r\n        role=\"group\"\r\n        aria-label={rightAriaLabel}\r\n        data-testid={`${testId}-right`}\r\n      >\r\n        {right}\r\n        {avatar && (\r\n          <div\r\n            className={classMap.avatarWrapper}\r\n            data-testid={`${testId}-avatar`}\r\n          >\r\n            <AvatarComponent\r\n              name={avatar.name}\r\n              src={avatar.src}\r\n              size={avatar.size || \"medium\"}\r\n              shape={avatar.shape || \"circle\"}\r\n              theme={avatar.theme}\r\n              outline={avatar.outline}\r\n              onClick={avatar.onClick}\r\n              aria-label={avatar[\"aria-label\"]}\r\n              aria-hidden={avatarAriaHidden}\r\n            />\r\n          </div>\r\n        )}\r\n      </div>\r\n    </div>\r\n  );\r\n};\r\n\r\nToolbarBase.displayName = \"ToolbarBase\";\r\nexport default ToolbarBase;\r\n","import React from \"react\";\r\nimport \"./Toolbar.scss\";\r\nimport Avatar from \"../../Avatar/core/Avatar\";\r\nimport ToolbarBase from \"../ToolbarBase\";\r\nimport { ToolbarProps } from \"../Toolbar.types\";\r\n\r\nconst classes = {\r\n  toolbar: \"toolbar\",\r\n  section: \"toolbar_section\",\r\n  title: \"toolbar_title\",\r\n  avatarWrapper: \"toolbar_avatarWrapper\",\r\n\r\n  primary: \"toolbar_primary\",\r\n  secondary: \"toolbar_secondary\",\r\n  tertiary: \"toolbar_tertiary\",\r\n  quaternary: \"toolbar_quaternary\",\r\n\r\n  clear: \"toolbar_clear\",\r\n\r\n  shadowNone: \"toolbar_shadow-None\",\r\n  shadowLight: \"toolbar_shadow-Light\",\r\n  shadowMedium: \"toolbar_shadow-Medium\",\r\n  shadowStrong: \"toolbar_shadow-Strong\",\r\n  shadowIntense: \"toolbar_shadow-Intense\",\r\n\r\n  roundNone: \"toolbar_round-None\",\r\n  roundSmall: \"toolbar_round-Small\",\r\n  roundMedium: \"toolbar_round-Medium\",\r\n  roundLarge: \"toolbar_round-Large\",\r\n};\r\n\r\nconst Toolbar: React.FC<ToolbarProps> = (props) => (\r\n  <ToolbarBase {...props} AvatarComponent={Avatar} classMap={classes} />\r\n);\r\nToolbar.displayName = \"Toolbar\";\r\nexport default Toolbar;\r\n"],"names":["getDefaultTheme","getDefaultShadow","getDefaultRounding","useMemo","combineClassNames","capitalize","jsxs","jsx","Avatar"],"mappings":"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"}

package/dist/core/{Toolbar-CQNKVKK8.js → Toolbar-fSghH1_-.js}

@@ -1,11 +1,12 @@
 import { jsxs, jsx } from "react/jsx-runtime";
-import { A as Avatar } from "./Avatar-BM8AwOB6.js";
+import { A as Avatar } from "./Avatar-Ct2kXkNR.js";
 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, d as getDefaultTheme } from "./boreal-style-config-BILmxkZG.js";
+import { a as getDefaultRounding, b as getDefaultShadow, d as getDefaultTheme } from "./boreal-style-config-DsaRlxmw.js";
 const ToolbarBase = ({
   title,
+  titleId,
   left,
   center,
   right,
@@ -15,9 +16,15 @@ const ToolbarBase = ({
   rounding = getDefaultRounding(),
   className = "",
   "data-testid": testId = "toolbar",
+  "aria-label": ariaLabelProp,
+  "aria-labelledby": ariaLabelledBy,
+  "aria-describedby": ariaDescribedBy,
+  leftAriaLabel = "Toolbar left section",
+  centerAriaLabel = "Toolbar center section",
+  rightAriaLabel = "Toolbar right section",
   AvatarComponent,
   classMap,
-  ariaLabel = "Toolbar",
+  "aria-label": ariaLabel = "Toolbar",
   headingLevel = 1
 }) => {
   const safeHeading = Math.min(6, Math.max(1, headingLevel));
@@ -32,14 +39,18 @@ const ToolbarBase = ({
     ),
     [classMap, theme, className, shadow, rounding]
   );
-  const avatarAriaHidden = avatar && !avatar.name && !avatar.onClick ? true : void 0;
+  const resolvedAriaLabel = ariaLabelledBy ? void 0 : ariaLabelProp ?? ariaLabel;
+  const avatarAriaHidden = avatar && !avatar.name && !avatar.onClick && !avatar["aria-label"] ? true : void 0;
+  const resolvedTitleId = title ? titleId ?? `${testId}-title` : void 0;
   return /* @__PURE__ */ jsxs(
     "div",
     {
       className: toolbarClass,
       role: "toolbar",
       "aria-orientation": "horizontal",
-      "aria-label": ariaLabel,
+      "aria-label": resolvedAriaLabel,
+      "aria-labelledby": ariaLabelledBy,
+      "aria-describedby": ariaDescribedBy,
       "data-testid": testId,
       children: [
         /* @__PURE__ */ jsx(
@@ -47,7 +58,7 @@ const ToolbarBase = ({
           {
             className: classMap.section,
             role: "group",
-            "aria-label": "Toolbar left section",
+            "aria-label": leftAriaLabel,
             "data-testid": `${testId}-left`,
             children: left
           }
@@ -57,10 +68,18 @@ const ToolbarBase = ({
           {
             className: classMap.section,
             role: "group",
-            "aria-label": "Toolbar center section",
+            "aria-label": centerAriaLabel,
             "data-testid": `${testId}-center`,
             children: [
-              title && /* @__PURE__ */ jsx(TitleTag, { className: classMap.title, "data-testid": `${testId}-title`, children: title }),
+              title && /* @__PURE__ */ jsx(
+                TitleTag,
+                {
+                  id: resolvedTitleId,
+                  className: classMap.title,
+                  "data-testid": `${testId}-title`,
+                  children: title
+                }
+              ),
               center
             ]
           }
@@ -70,7 +89,7 @@ const ToolbarBase = ({
           {
             className: classMap.section,
             role: "group",
-            "aria-label": "Toolbar right section",
+            "aria-label": rightAriaLabel,
             "data-testid": `${testId}-right`,
             children: [
               right,
@@ -89,6 +108,7 @@ const ToolbarBase = ({
                       theme: avatar.theme,
                       outline: avatar.outline,
                       onClick: avatar.onClick,
+                      "aria-label": avatar["aria-label"],
                       "aria-hidden": avatarAriaHidden
                     }
                   )
@@ -127,4 +147,4 @@ Toolbar.displayName = "Toolbar";
 export {
   Toolbar as T
 };
-//# sourceMappingURL=Toolbar-CQNKVKK8.js.map
+//# sourceMappingURL=Toolbar-fSghH1_-.js.map

package/dist/core/Toolbar-fSghH1_-.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toolbar-fSghH1_-.js","sources":["../../src/components/Toolbar/ToolbarBase.tsx","../../src/components/Toolbar/core/Toolbar.tsx"],"sourcesContent":["import React, { JSX, useMemo } from \"react\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { ToolbarBaseProps } from \"./Toolbar.types\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n  getDefaultRounding,\r\n  getDefaultShadow,\r\n  getDefaultTheme,\r\n} from \"../../config/boreal-style-config\";\r\n\r\nconst ToolbarBase: React.FC<ToolbarBaseProps> = ({\r\n  title,\r\n  titleId,\r\n  left,\r\n  center,\r\n  right,\r\n  avatar,\r\n  theme = getDefaultTheme(),\r\n  shadow = getDefaultShadow(),\r\n  rounding = getDefaultRounding(),\r\n  className = \"\",\r\n  \"data-testid\": testId = \"toolbar\",\r\n  \"aria-label\": ariaLabelProp,\r\n  \"aria-labelledby\": ariaLabelledBy,\r\n  \"aria-describedby\": ariaDescribedBy,\r\n  leftAriaLabel = \"Toolbar left section\",\r\n  centerAriaLabel = \"Toolbar center section\",\r\n  rightAriaLabel = \"Toolbar right section\",\r\n  AvatarComponent,\r\n  classMap,\r\n  \"aria-label\": ariaLabel = \"Toolbar\",\r\n  headingLevel = 1,\r\n}): JSX.Element => {\r\n  const safeHeading = Math.min(6, Math.max(1, headingLevel));\r\n  const TitleTag = `h${safeHeading}` as keyof JSX.IntrinsicElements;\r\n\r\n  const toolbarClass = useMemo(\r\n    () =>\r\n      combineClassNames(\r\n        classMap.toolbar,\r\n        classMap[theme],\r\n        className,\r\n        shadow && classMap[`shadow${capitalize(shadow)}`],\r\n        rounding && classMap[`round${capitalize(rounding)}`],\r\n      ),\r\n    [classMap, theme, className, shadow, rounding],\r\n  );\r\n\r\n  const resolvedAriaLabel = ariaLabelledBy\r\n    ? undefined\r\n    : (ariaLabelProp ?? ariaLabel);\r\n\r\n  const avatarAriaHidden =\r\n    avatar && !avatar.name && !avatar.onClick && !avatar[\"aria-label\"]\r\n      ? true\r\n      : undefined;\r\n\r\n  const resolvedTitleId = title ? (titleId ?? `${testId}-title`) : undefined;\r\n\r\n  return (\r\n    <div\r\n      className={toolbarClass}\r\n      role=\"toolbar\"\r\n      aria-orientation=\"horizontal\"\r\n      aria-label={resolvedAriaLabel}\r\n      aria-labelledby={ariaLabelledBy}\r\n      aria-describedby={ariaDescribedBy}\r\n      data-testid={testId}\r\n    >\r\n      <div\r\n        className={classMap.section}\r\n        role=\"group\"\r\n        aria-label={leftAriaLabel}\r\n        data-testid={`${testId}-left`}\r\n      >\r\n        {left}\r\n      </div>\r\n\r\n      <div\r\n        className={classMap.section}\r\n        role=\"group\"\r\n        aria-label={centerAriaLabel}\r\n        data-testid={`${testId}-center`}\r\n      >\r\n        {title && (\r\n          <TitleTag\r\n            id={resolvedTitleId}\r\n            className={classMap.title}\r\n            data-testid={`${testId}-title`}\r\n          >\r\n            {title}\r\n          </TitleTag>\r\n        )}\r\n        {center}\r\n      </div>\r\n\r\n      <div\r\n        className={classMap.section}\r\n        role=\"group\"\r\n        aria-label={rightAriaLabel}\r\n        data-testid={`${testId}-right`}\r\n      >\r\n        {right}\r\n        {avatar && (\r\n          <div\r\n            className={classMap.avatarWrapper}\r\n            data-testid={`${testId}-avatar`}\r\n          >\r\n            <AvatarComponent\r\n              name={avatar.name}\r\n              src={avatar.src}\r\n              size={avatar.size || \"medium\"}\r\n              shape={avatar.shape || \"circle\"}\r\n              theme={avatar.theme}\r\n              outline={avatar.outline}\r\n              onClick={avatar.onClick}\r\n              aria-label={avatar[\"aria-label\"]}\r\n              aria-hidden={avatarAriaHidden}\r\n            />\r\n          </div>\r\n        )}\r\n      </div>\r\n    </div>\r\n  );\r\n};\r\n\r\nToolbarBase.displayName = \"ToolbarBase\";\r\nexport default ToolbarBase;\r\n","import React from \"react\";\r\nimport \"./Toolbar.scss\";\r\nimport Avatar from \"../../Avatar/core/Avatar\";\r\nimport ToolbarBase from \"../ToolbarBase\";\r\nimport { ToolbarProps } from \"../Toolbar.types\";\r\n\r\nconst classes = {\r\n  toolbar: \"toolbar\",\r\n  section: \"toolbar_section\",\r\n  title: \"toolbar_title\",\r\n  avatarWrapper: \"toolbar_avatarWrapper\",\r\n\r\n  primary: \"toolbar_primary\",\r\n  secondary: \"toolbar_secondary\",\r\n  tertiary: \"toolbar_tertiary\",\r\n  quaternary: \"toolbar_quaternary\",\r\n\r\n  clear: \"toolbar_clear\",\r\n\r\n  shadowNone: \"toolbar_shadow-None\",\r\n  shadowLight: \"toolbar_shadow-Light\",\r\n  shadowMedium: \"toolbar_shadow-Medium\",\r\n  shadowStrong: \"toolbar_shadow-Strong\",\r\n  shadowIntense: \"toolbar_shadow-Intense\",\r\n\r\n  roundNone: \"toolbar_round-None\",\r\n  roundSmall: \"toolbar_round-Small\",\r\n  roundMedium: \"toolbar_round-Medium\",\r\n  roundLarge: \"toolbar_round-Large\",\r\n};\r\n\r\nconst Toolbar: React.FC<ToolbarProps> = (props) => (\r\n  <ToolbarBase {...props} AvatarComponent={Avatar} classMap={classes} />\r\n);\r\nToolbar.displayName = \"Toolbar\";\r\nexport default Toolbar;\r\n"],"names":[],"mappings":"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"}

package/dist/core/Toolbar.cjs.js

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

package/dist/core/Toolbar.js

@@ -1,4 +1,4 @@
-import { T } from "./Toolbar-CQNKVKK8.js";
+import { T } from "./Toolbar-fSghH1_-.js";
 export {
   T as default
 };

package/dist/core/{Tooltip-DS7DSyij.cjs → Tooltip-_e_4s6pE.cjs}

@@ -3,7 +3,15 @@ const jsxRuntime = 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 borealStyleConfig = require("./boreal-style-config-C1UIwOFN.cjs");
+function mergeIds(...values) {
+  return values.filter(Boolean).join(" ") || void 0;
+}
+function callAll(...handlers) {
+  return (event) => {
+    handlers.forEach((handler) => handler == null ? void 0 : handler(event));
+  };
+}
 const TooltipBase = React.forwardRef(function TooltipBase2({
   content,
   position = "top",
@@ -13,11 +21,20 @@ const TooltipBase = React.forwardRef(function TooltipBase2({
   state = "",
   children,
   className = "",
+  id,
+  triggerId,
+  triggerAriaLabel,
+  triggerAriaLabelledBy,
+  triggerAriaDescribedBy,
+  keepMountedWhenHidden = true,
+  "aria-label": ariaLabel,
+  "aria-labelledby": ariaLabelledBy,
   "data-testid": testId = "tooltip",
   classMap,
   ...rest
 }, ref) {
-  const tooltipId = React.useId();
+  const generatedId = React.useId();
+  const tooltipId = id ?? generatedId;
   const [visible, setVisible] = React.useState(false);
   const show = () => setVisible(true);
   const hide = () => setVisible(false);
@@ -41,26 +58,58 @@ const TooltipBase = React.forwardRef(function TooltipBase2({
     ),
     [classMap, position, theme, state, visible, shadow, rounding]
   );
-  const triggerProps = {
-    onMouseEnter: show,
-    onMouseLeave: hide,
-    onFocus: show,
-    onBlur: hide,
-    "aria-describedby": visible ? tooltipId : void 0,
-    "data-testid": `${testId}-trigger`
-  };
   let trigger;
   if (React.isValidElement(children)) {
-    const isNaturallyFocusable = React.isValidElement(children) && typeof children.type === "string" && ["a", "button", "input", "textarea", "select"].includes(children.type);
-    const existingTabIndex = children.props.tabIndex;
-    const maybeTabIndex = isNaturallyFocusable || existingTabIndex !== void 0 ? {} : { tabIndex: 0 };
-    trigger = React.cloneElement(children, {
-      ...triggerProps,
-      ...maybeTabIndex
+    const child = children;
+    const childProps = child.props;
+    const isNaturallyFocusable = typeof child.type === "string" && ["a", "button", "input", "textarea", "select"].includes(child.type);
+    const maybeTabIndex = isNaturallyFocusable || childProps.tabIndex !== void 0 ? {} : { tabIndex: 0 };
+    const mergedAriaDescribedBy = mergeIds(
+      childProps["aria-describedby"],
+      triggerAriaDescribedBy,
+      visible ? tooltipId : void 0
+    );
+    trigger = React.cloneElement(child, {
+      ...maybeTabIndex,
+      id: triggerId ?? childProps.id,
+      "aria-label": triggerAriaLabel ?? childProps["aria-label"],
+      "aria-labelledby": triggerAriaLabelledBy ?? childProps["aria-labelledby"],
+      "aria-describedby": mergedAriaDescribedBy,
+      "data-testid": `${testId}-trigger`,
+      onMouseEnter: callAll(
+        childProps.onMouseEnter,
+        show
+      ),
+      onMouseLeave: callAll(
+        childProps.onMouseLeave,
+        hide
+      ),
+      onFocus: callAll(childProps.onFocus, show),
+      onBlur: callAll(childProps.onBlur, hide)
     });
   } else {
-    trigger = /* @__PURE__ */ jsxRuntime.jsx("span", { tabIndex: 0, ...triggerProps, className: classMap.triggerWrapper, children });
+    trigger = /* @__PURE__ */ jsxRuntime.jsx(
+      "span",
+      {
+        id: triggerId,
+        tabIndex: 0,
+        className: classMap.triggerWrapper,
+        "aria-label": triggerAriaLabel,
+        "aria-labelledby": triggerAriaLabelledBy,
+        "aria-describedby": mergeIds(
+          triggerAriaDescribedBy,
+          visible ? tooltipId : void 0
+        ),
+        "data-testid": `${testId}-trigger`,
+        onMouseEnter: show,
+        onMouseLeave: hide,
+        onFocus: show,
+        onBlur: hide,
+        children
+      }
+    );
   }
+  const shouldRenderTooltip = keepMountedWhenHidden || visible;
   return /* @__PURE__ */ jsxRuntime.jsxs(
     "div",
     {
@@ -68,7 +117,7 @@ const TooltipBase = React.forwardRef(function TooltipBase2({
       "data-testid": `${testId}-container`,
       children: [
         trigger,
-        /* @__PURE__ */ jsxRuntime.jsx(
+        shouldRenderTooltip && /* @__PURE__ */ jsxRuntime.jsx(
           "div",
           {
             ref,
@@ -76,6 +125,8 @@ const TooltipBase = React.forwardRef(function TooltipBase2({
             className: toolTipClassName,
             role: "tooltip",
             "aria-hidden": !visible,
+            "aria-label": ariaLabel,
+            "aria-labelledby": ariaLabelledBy,
             "data-testid": testId,
             ...rest,
             children: content
@@ -115,4 +166,4 @@ const classes = {
 const Tooltip = React.forwardRef((props, ref) => /* @__PURE__ */ jsxRuntime.jsx(TooltipBase, { ...props, ref, classMap: classes }));
 Tooltip.displayName = "Tooltip";
 exports.Tooltip = Tooltip;
-//# sourceMappingURL=Tooltip-DS7DSyij.cjs.map
+//# sourceMappingURL=Tooltip-_e_4s6pE.cjs.map