boreal-ui 0.0.1

package/dist/next/Toggle-R5pWM7gk.js

@@ -0,0 +1,151 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { forwardRef, useMemo } from "react";
+import { c as combineClassNames } from "./classNames-AS8QjFq7.js";
+import { c as capitalize } from "./capitalize-C0TSQSPh.js";
+import { a as getDefaultRounding, c as getDefaultSize, d as getDefaultTheme, b as getDefaultShadow } from "./boreal-style-config-BILmxkZG.js";
+const container = "_container_6rzuc_68";
+const label = "_label_6rzuc_74";
+const toggle = "_toggle_6rzuc_79";
+const slider = "_slider_6rzuc_89";
+const active = "_active_6rzuc_95";
+const xs = "_xs_6rzuc_99";
+const small = "_small_6rzuc_111";
+const medium = "_medium_6rzuc_123";
+const large = "_large_6rzuc_135";
+const xl = "_xl_6rzuc_147";
+const primary = "_primary_6rzuc_159";
+const secondary = "_secondary_6rzuc_163";
+const tertiary = "_tertiary_6rzuc_167";
+const quaternary = "_quaternary_6rzuc_171";
+const clear = "_clear_6rzuc_175";
+const success = "_success_6rzuc_179";
+const error = "_error_6rzuc_183";
+const warning = "_warning_6rzuc_187";
+const roundNone = "_roundNone_6rzuc_191";
+const roundSmall = "_roundSmall_6rzuc_198";
+const roundMedium = "_roundMedium_6rzuc_205";
+const roundLarge = "_roundLarge_6rzuc_212";
+const roundFull = "_roundFull_6rzuc_219";
+const shadowNone = "_shadowNone_6rzuc_226";
+const shadowLight = "_shadowLight_6rzuc_230";
+const shadowMedium = "_shadowMedium_6rzuc_234";
+const shadowStrong = "_shadowStrong_6rzuc_238";
+const shadowIntense = "_shadowIntense_6rzuc_242";
+const disabled = "_disabled_6rzuc_250";
+const styles = {
+  container,
+  label,
+  toggle,
+  slider,
+  active,
+  xs,
+  small,
+  medium,
+  large,
+  xl,
+  primary,
+  secondary,
+  tertiary,
+  quaternary,
+  clear,
+  success,
+  error,
+  warning,
+  roundNone,
+  roundSmall,
+  roundMedium,
+  roundLarge,
+  roundFull,
+  shadowNone,
+  shadowLight,
+  shadowMedium,
+  shadowStrong,
+  shadowIntense,
+  disabled
+};
+const ToggleBase = forwardRef(
+  ({
+    checked,
+    onChange,
+    label: label2,
+    theme = getDefaultTheme(),
+    rounding = getDefaultRounding(),
+    shadow = getDefaultShadow(),
+    state = "",
+    size = getDefaultSize(),
+    disabled: disabled2 = false,
+    classMap,
+    className,
+    "data-testid": testId = "toggle"
+  }, ref) => {
+    const handleToggle = () => {
+      if (!disabled2) onChange(!checked);
+    };
+    const handleKeyDown = (e) => {
+      if ((e.key === "Enter" || e.key === " ") && !disabled2) {
+        e.preventDefault();
+        handleToggle();
+      }
+    };
+    const containerClass = useMemo(
+      () => combineClassNames(
+        classMap.container,
+        classMap[theme],
+        classMap[state],
+        classMap[size],
+        rounding && classMap[`round${capitalize(rounding)}`],
+        disabled2 && classMap.disabled,
+        className
+      ),
+      [classMap, size, disabled2, shadow, rounding, theme, state]
+    );
+    const toggleClass = useMemo(
+      () => combineClassNames(
+        classMap.toggle,
+        checked && classMap.active,
+        shadow && classMap[`shadow${capitalize(shadow)}`],
+        rounding && classMap[`round${capitalize(rounding)}`]
+      ),
+      [classMap, checked, rounding]
+    );
+    const labelId = label2 ? `${testId}-label` : void 0;
+    return /* @__PURE__ */ jsxs("div", { className: containerClass, "data-testid": `${testId}-wrapper`, children: [
+      /* @__PURE__ */ jsx(
+        "button",
+        {
+          ref,
+          id: `${testId}-button`,
+          className: toggleClass,
+          role: "switch",
+          "aria-checked": checked,
+          "aria-labelledby": labelId,
+          "aria-label": label2 ? void 0 : "Toggle switch",
+          type: "button",
+          disabled: disabled2,
+          onClick: handleToggle,
+          onKeyDown: handleKeyDown,
+          "data-testid": testId,
+          children: /* @__PURE__ */ jsx("span", { className: classMap.slider, "data-testid": `${testId}-slider` })
+        }
+      ),
+      label2 && /* @__PURE__ */ jsx(
+        "label",
+        {
+          id: labelId,
+          htmlFor: `${testId}-button`,
+          className: classMap.label,
+          "data-testid": `${testId}-label`,
+          children: label2
+        }
+      )
+    ] });
+  }
+);
+ToggleBase.displayName = "ToggleBase";
+const Toggle = (props) => {
+  return /* @__PURE__ */ jsx(ToggleBase, { ...props, classMap: styles });
+};
+export {
+  Toggle as T
+};
+//# sourceMappingURL=Toggle-R5pWM7gk.js.map

package/dist/next/Toggle-R5pWM7gk.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toggle-R5pWM7gk.js","sources":["../../src/components/Toggle/ToggleBase.tsx","../../src/components/Toggle/next/Toggle.tsx"],"sourcesContent":["import { forwardRef, KeyboardEvent, useMemo } from \"react\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { ToggleProps } 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\nexport interface ToggleBaseProps extends ToggleProps {\r\n  classMap: Record<string, string>;\r\n}\r\n\r\nconst ToggleBase = forwardRef<HTMLButtonElement, ToggleBaseProps>(\r\n  (\r\n    {\r\n      checked,\r\n      onChange,\r\n      label,\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 handleToggle = () => {\r\n      if (!disabled) onChange(!checked);\r\n    };\r\n\r\n    const handleKeyDown = (e: KeyboardEvent<HTMLButtonElement>) => {\r\n      if ((e.key === \"Enter\" || e.key === \" \") && !disabled) {\r\n        e.preventDefault();\r\n        handleToggle();\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          rounding && classMap[`round${capitalize(rounding)}`],\r\n          disabled && classMap.disabled,\r\n          className\r\n        ),\r\n      [classMap, size, disabled, shadow, rounding, theme, state]\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, rounding]\r\n    );\r\n\r\n    const labelId = label ? `${testId}-label` : undefined;\r\n\r\n    return (\r\n      <div className={containerClass} data-testid={`${testId}-wrapper`}>\r\n        <button\r\n          ref={ref}\r\n          id={`${testId}-button`}\r\n          className={toggleClass}\r\n          role=\"switch\"\r\n          aria-checked={checked}\r\n          aria-labelledby={labelId}\r\n          aria-label={label ? undefined : \"Toggle switch\"}\r\n          type=\"button\"\r\n          disabled={disabled}\r\n          onClick={handleToggle}\r\n          onKeyDown={handleKeyDown}\r\n          data-testid={testId}\r\n        >\r\n          <span className={classMap.slider} data-testid={`${testId}-slider`} />\r\n        </button>\r\n\r\n        {label && (\r\n          <label\r\n            id={labelId}\r\n            htmlFor={`${testId}-button`}\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","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport styles from \"./Toggle.module.scss\";\r\nimport ToggleBase from \"../ToggleBase\";\r\nimport { ToggleProps } from \"../Toggle.types\";\r\n\r\nconst Toggle: React.FC<ToggleProps> = (props) => {\r\n  return <ToggleBase {...props} classMap={styles} />;\r\n};\r\n\r\nexport default Toggle;\r\n"],"names":["label","disabled"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAeA,MAAM,aAAa;AAAA,EACjB,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA,OAAAA;AAAA,IACA,QAAQ,gBAAgB;AAAA,IACxB,WAAW,mBAAmB;AAAA,IAC9B,SAAS,iBAAiB;AAAA,IAC1B,QAAQ;AAAA,IACR,OAAO,eAAe;AAAA,IACtB,UAAAC,YAAW;AAAA,IACX;AAAA,IACA;AAAA,IACA,eAAe,SAAS;AAAA,KAE1B,QACG;AACH,UAAM,eAAe,MAAM;AACzB,UAAI,CAACA,UAAmB,UAAA,CAAC,OAAO;AAAA,IAClC;AAEM,UAAA,gBAAgB,CAAC,MAAwC;AAC7D,WAAK,EAAE,QAAQ,WAAW,EAAE,QAAQ,QAAQ,CAACA,WAAU;AACrD,UAAE,eAAe;AACJ,qBAAA;AAAA,MAAA;AAAA,IAEjB;AAEA,UAAM,iBAAiB;AAAA,MACrB,MACE;AAAA,QACE,SAAS;AAAA,QACT,SAAS,KAAK;AAAA,QACd,SAAS,KAAK;AAAA,QACd,SAAS,IAAI;AAAA,QACb,YAAY,SAAS,QAAQ,WAAW,QAAQ,CAAC,EAAE;AAAA,QACnDA,aAAY,SAAS;AAAA,QACrB;AAAA,MACF;AAAA,MACF,CAAC,UAAU,MAAMA,WAAU,QAAQ,UAAU,OAAO,KAAK;AAAA,IAC3D;AAEA,UAAM,cAAc;AAAA,MAClB,MACE;AAAA,QACE,SAAS;AAAA,QACT,WAAW,SAAS;AAAA,QACpB,UAAU,SAAS,SAAS,WAAW,MAAM,CAAC,EAAE;AAAA,QAChD,YAAY,SAAS,QAAQ,WAAW,QAAQ,CAAC,EAAE;AAAA,MACrD;AAAA,MACF,CAAC,UAAU,SAAS,QAAQ;AAAA,IAC9B;AAEA,UAAM,UAAUD,SAAQ,GAAG,MAAM,WAAW;AAE5C,gCACG,OAAI,EAAA,WAAW,gBAAgB,eAAa,GAAG,MAAM,YACpD,UAAA;AAAA,MAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC;AAAA,UACA,IAAI,GAAG,MAAM;AAAA,UACb,WAAW;AAAA,UACX,MAAK;AAAA,UACL,gBAAc;AAAA,UACd,mBAAiB;AAAA,UACjB,cAAYA,SAAQ,SAAY;AAAA,UAChC,MAAK;AAAA,UACL,UAAAC;AAAA,UACA,SAAS;AAAA,UACT,WAAW;AAAA,UACX,eAAa;AAAA,UAEb,UAAA,oBAAC,UAAK,WAAW,SAAS,QAAQ,eAAa,GAAG,MAAM,UAAW,CAAA;AAAA,QAAA;AAAA,MACrE;AAAA,MAECD,UACC;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,IAAI;AAAA,UACJ,SAAS,GAAG,MAAM;AAAA,UAClB,WAAW,SAAS;AAAA,UACpB,eAAa,GAAG,MAAM;AAAA,UAErB,UAAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACH,GAEJ;AAAA,EAAA;AAGN;AAEA,WAAW,cAAc;AClGnB,MAAA,SAAgC,CAAC,UAAU;AAC/C,SAAQ,oBAAA,YAAA,EAAY,GAAG,OAAO,UAAU,QAAQ;AAClD;"}

package/dist/next/Toggle.cjs.js

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

package/dist/next/Toggle.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toggle.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/next/Toggle.js

@@ -0,0 +1,5 @@
+import { T } from "./Toggle-R5pWM7gk.js";
+export {
+  T as default
+};
+//# sourceMappingURL=Toggle.js.map

package/dist/next/Toggle.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toggle.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/next/Toolbar-D05Q3wYG.cjs

@@ -0,0 +1,165 @@
+"use strict";
+const require$$2 = require("react/jsx-runtime");
+const Avatar = require("./Avatar-s6BrkUFC.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 noScroll = "_noScroll_dzgc9_91";
+const errorMessage = "_errorMessage_dzgc9_92";
+const loadingContainer = "_loadingContainer_dzgc9_93";
+const hideScrollbar = "_hideScrollbar_dzgc9_85";
+const sr_only = "_sr_only_dzgc9_94";
+const toolbar = "_toolbar_dzgc9_479";
+const primary = "_primary_dzgc9_490";
+const secondary = "_secondary_dzgc9_494";
+const tertiary = "_tertiary_dzgc9_498";
+const quaternary = "_quaternary_dzgc9_502";
+const clear = "_clear_dzgc9_506";
+const section = "_section_dzgc9_512";
+const title = "_title_dzgc9_535";
+const avatarWrapper = "_avatarWrapper_dzgc9_547";
+const roundNone = "_roundNone_dzgc9_557";
+const roundSmall = "_roundSmall_dzgc9_562";
+const roundMedium = "_roundMedium_dzgc9_567";
+const roundLarge = "_roundLarge_dzgc9_572";
+const roundFull = "_roundFull_dzgc9_577";
+const shadowNone = "_shadowNone_dzgc9_582";
+const shadowLight = "_shadowLight_dzgc9_586";
+const shadowMedium = "_shadowMedium_dzgc9_590";
+const shadowStrong = "_shadowStrong_dzgc9_594";
+const shadowIntense = "_shadowIntense_dzgc9_598";
+const spin = "_spin_dzgc9_1";
+const pulse = "_pulse_dzgc9_1";
+const styles = {
+  noScroll,
+  errorMessage,
+  loadingContainer,
+  hideScrollbar,
+  sr_only,
+  toolbar,
+  primary,
+  secondary,
+  tertiary,
+  quaternary,
+  clear,
+  section,
+  title,
+  avatarWrapper,
+  roundNone,
+  roundSmall,
+  roundMedium,
+  roundLarge,
+  roundFull,
+  shadowNone,
+  shadowLight,
+  shadowMedium,
+  shadowStrong,
+  shadowIntense,
+  "fade-in": "_fade-in_dzgc9_1",
+  "slide-up": "_slide-up_dzgc9_1",
+  "spin-3d": "_spin-3d_dzgc9_1",
+  spin,
+  pulse,
+  "fade-in-up": "_fade-in-up_dzgc9_1",
+  "progress-grow": "_progress-grow_dzgc9_1",
+  "indeterminate-move": "_indeterminate-move_dzgc9_1",
+  "skeleton-loading": "_skeleton-loading_dzgc9_1"
+};
+const ToolbarBase = ({
+  title: title2,
+  left,
+  center,
+  right,
+  avatar,
+  theme = borealStyleConfig.getDefaultTheme(),
+  shadow = borealStyleConfig.getDefaultShadow(),
+  rounding = borealStyleConfig.getDefaultRounding(),
+  className = "",
+  "data-testid": testId = "toolbar",
+  AvatarComponent,
+  classMap,
+  ariaLabel = "Toolbar",
+  headingLevel = 1
+}) => {
+  const TitleTag = `h${headingLevel}`;
+  const headerClass = React.useMemo(
+    () => classNames.combineClassNames(
+      classMap.toolbar,
+      classMap[theme],
+      className,
+      shadow && classMap[`shadow${capitalize.capitalize(shadow)}`],
+      rounding && classMap[`round${capitalize.capitalize(rounding)}`]
+    ),
+    [classMap, theme, className]
+  );
+  return /* @__PURE__ */ require$$2.jsxs(
+    "header",
+    {
+      className: headerClass,
+      role: "banner",
+      "aria-label": ariaLabel,
+      "data-testid": testId,
+      children: [
+        /* @__PURE__ */ require$$2.jsx(
+          "div",
+          {
+            className: classMap.section,
+            role: "navigation",
+            "aria-label": "Toolbar left section",
+            "data-testid": `${testId}-left`,
+            children: left
+          }
+        ),
+        /* @__PURE__ */ require$$2.jsxs(
+          "div",
+          {
+            className: classMap.section,
+            role: "navigation",
+            "aria-label": "Toolbar center section",
+            "data-testid": `${testId}-center`,
+            children: [
+              title2 && /* @__PURE__ */ require$$2.jsx(TitleTag, { className: classMap.title, "data-testid": `${testId}-title`, children: title2 }),
+              center
+            ]
+          }
+        ),
+        /* @__PURE__ */ require$$2.jsxs(
+          "div",
+          {
+            className: classMap.section,
+            role: "navigation",
+            "aria-label": "Toolbar right section",
+            "data-testid": `${testId}-right`,
+            children: [
+              right,
+              avatar && /* @__PURE__ */ require$$2.jsx(
+                "div",
+                {
+                  className: classMap.avatarWrapper,
+                  "data-testid": `${testId}-avatar`,
+                  children: /* @__PURE__ */ require$$2.jsx(
+                    AvatarComponent,
+                    {
+                      name: avatar.name,
+                      src: avatar.src,
+                      size: avatar.size || "medium",
+                      shape: avatar.shape || "circle",
+                      theme: avatar.theme,
+                      outline: avatar.outline,
+                      onClick: avatar.onClick,
+                      "aria-hidden": !avatar.name
+                    }
+                  )
+                }
+              )
+            ]
+          }
+        )
+      ]
+    }
+  );
+};
+const Toolbar = (props) => /* @__PURE__ */ require$$2.jsx(ToolbarBase, { ...props, AvatarComponent: Avatar.Avatar, classMap: styles });
+exports.Toolbar = Toolbar;
+//# sourceMappingURL=Toolbar-D05Q3wYG.cjs.map

package/dist/next/Toolbar-D05Q3wYG.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toolbar-D05Q3wYG.cjs","sources":["../../src/components/Toolbar/ToolbarBase.tsx","../../src/components/Toolbar/next/Toolbar.tsx"],"sourcesContent":["import React, { JSX, useMemo } from \"react\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { ToolbarBaseProps, ToolbarProps } 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\nexport const ToolbarBase: React.FC<ToolbarBaseProps> = ({\r\n  title,\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  AvatarComponent,\r\n  classMap,\r\n  ariaLabel = \"Toolbar\",\r\n  headingLevel = 1,\r\n}): JSX.Element => {\r\n  const TitleTag = `h${headingLevel}` as keyof JSX.IntrinsicElements;\r\n\r\n  const headerClass = 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]\r\n  );\r\n\r\n  return (\r\n    <header\r\n      className={headerClass}\r\n      role=\"banner\"\r\n      aria-label={ariaLabel}\r\n      data-testid={testId}\r\n    >\r\n      <div\r\n        className={classMap.section}\r\n        role=\"navigation\"\r\n        aria-label=\"Toolbar left section\"\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=\"navigation\"\r\n        aria-label=\"Toolbar center section\"\r\n        data-testid={`${testId}-center`}\r\n      >\r\n        {title && (\r\n          <TitleTag className={classMap.title} data-testid={`${testId}-title`}>\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=\"navigation\"\r\n        aria-label=\"Toolbar right section\"\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-hidden={!avatar.name}\r\n            />\r\n          </div>\r\n        )}\r\n      </div>\r\n    </header>\r\n  );\r\n};\r\n","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport styles from \"./Toolbar.module.scss\";\r\nimport Avatar from \"../../Avatar/next/Avatar\";\r\nimport { ToolbarBase } from \"../ToolbarBase\";\r\nimport { ToolbarProps } from \"../Toolbar.types\";\r\n\r\nconst Toolbar: React.FC<ToolbarProps> = (props) => (\r\n  <ToolbarBase {...props} AvatarComponent={Avatar} classMap={styles} />\r\n);\r\n\r\nexport default Toolbar;\r\n"],"names":["title","getDefaultTheme","getDefaultShadow","getDefaultRounding","useMemo","combineClassNames","capitalize","jsxs","jsx","Avatar"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUO,MAAM,cAA0C,CAAC;AAAA,EACtD,OAAAA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,QAAQC,kBAAAA,gBAAgB;AAAA,EACxB,SAASC,kBAAAA,iBAAiB;AAAA,EAC1B,WAAWC,kBAAAA,mBAAmB;AAAA,EAC9B,YAAY;AAAA,EACZ,eAAe,SAAS;AAAA,EACxB;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ,eAAe;AACjB,MAAmB;AACX,QAAA,WAAW,IAAI,YAAY;AAEjC,QAAM,cAAcC,MAAA;AAAA,IAClB,MACEC,WAAA;AAAA,MACE,SAAS;AAAA,MACT,SAAS,KAAK;AAAA,MACd;AAAA,MACA,UAAU,SAAS,SAASC,WAAAA,WAAW,MAAM,CAAC,EAAE;AAAA,MAChD,YAAY,SAAS,QAAQA,WAAAA,WAAW,QAAQ,CAAC,EAAE;AAAA,IACrD;AAAA,IACF,CAAC,UAAU,OAAO,SAAS;AAAA,EAC7B;AAGE,SAAAC,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,MACX,MAAK;AAAA,MACL,cAAY;AAAA,MACZ,eAAa;AAAA,MAEb,UAAA;AAAA,QAAAC,2BAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW,SAAS;AAAA,YACpB,MAAK;AAAA,YACL,cAAW;AAAA,YACX,eAAa,GAAG,MAAM;AAAA,YAErB,UAAA;AAAA,UAAA;AAAA,QACH;AAAA,QAEAD,2BAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW,SAAS;AAAA,YACpB,MAAK;AAAA,YACL,cAAW;AAAA,YACX,eAAa,GAAG,MAAM;AAAA,YAErB,UAAA;AAAA,cACCP,UAAAQ,2BAAAA,IAAC,YAAS,WAAW,SAAS,OAAO,eAAa,GAAG,MAAM,UACxD,UACHR,OAAA,CAAA;AAAA,cAED;AAAA,YAAA;AAAA,UAAA;AAAA,QACH;AAAA,QAEAO,2BAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW,SAAS;AAAA,YACpB,MAAK;AAAA,YACL,cAAW;AAAA,YACX,eAAa,GAAG,MAAM;AAAA,YAErB,UAAA;AAAA,cAAA;AAAA,cACA,UACCC,2BAAA;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,WAAW,SAAS;AAAA,kBACpB,eAAa,GAAG,MAAM;AAAA,kBAEtB,UAAAA,2BAAA;AAAA,oBAAC;AAAA,oBAAA;AAAA,sBACC,MAAM,OAAO;AAAA,sBACb,KAAK,OAAO;AAAA,sBACZ,MAAM,OAAO,QAAQ;AAAA,sBACrB,OAAO,OAAO,SAAS;AAAA,sBACvB,OAAO,OAAO;AAAA,sBACd,SAAS,OAAO;AAAA,sBAChB,SAAS,OAAO;AAAA,sBAChB,eAAa,CAAC,OAAO;AAAA,oBAAA;AAAA,kBAAA;AAAA,gBACvB;AAAA,cAAA;AAAA,YACF;AAAA,UAAA;AAAA,QAAA;AAAA,MAEJ;AAAA,IAAA;AAAA,EACF;AAEJ;ACzFM,MAAA,UAAkC,CAAC,UACtCA,2BAAA,IAAA,aAAA,EAAa,GAAG,OAAO,iBAAiBC,OAAAA,QAAQ,UAAU,OAAQ,CAAA;;"}

package/dist/next/Toolbar-vNJ46DTU.js

@@ -0,0 +1,166 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { A as Avatar } from "./Avatar-B0KvtR9U.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";
+const noScroll = "_noScroll_dzgc9_91";
+const errorMessage = "_errorMessage_dzgc9_92";
+const loadingContainer = "_loadingContainer_dzgc9_93";
+const hideScrollbar = "_hideScrollbar_dzgc9_85";
+const sr_only = "_sr_only_dzgc9_94";
+const toolbar = "_toolbar_dzgc9_479";
+const primary = "_primary_dzgc9_490";
+const secondary = "_secondary_dzgc9_494";
+const tertiary = "_tertiary_dzgc9_498";
+const quaternary = "_quaternary_dzgc9_502";
+const clear = "_clear_dzgc9_506";
+const section = "_section_dzgc9_512";
+const title = "_title_dzgc9_535";
+const avatarWrapper = "_avatarWrapper_dzgc9_547";
+const roundNone = "_roundNone_dzgc9_557";
+const roundSmall = "_roundSmall_dzgc9_562";
+const roundMedium = "_roundMedium_dzgc9_567";
+const roundLarge = "_roundLarge_dzgc9_572";
+const roundFull = "_roundFull_dzgc9_577";
+const shadowNone = "_shadowNone_dzgc9_582";
+const shadowLight = "_shadowLight_dzgc9_586";
+const shadowMedium = "_shadowMedium_dzgc9_590";
+const shadowStrong = "_shadowStrong_dzgc9_594";
+const shadowIntense = "_shadowIntense_dzgc9_598";
+const spin = "_spin_dzgc9_1";
+const pulse = "_pulse_dzgc9_1";
+const styles = {
+  noScroll,
+  errorMessage,
+  loadingContainer,
+  hideScrollbar,
+  sr_only,
+  toolbar,
+  primary,
+  secondary,
+  tertiary,
+  quaternary,
+  clear,
+  section,
+  title,
+  avatarWrapper,
+  roundNone,
+  roundSmall,
+  roundMedium,
+  roundLarge,
+  roundFull,
+  shadowNone,
+  shadowLight,
+  shadowMedium,
+  shadowStrong,
+  shadowIntense,
+  "fade-in": "_fade-in_dzgc9_1",
+  "slide-up": "_slide-up_dzgc9_1",
+  "spin-3d": "_spin-3d_dzgc9_1",
+  spin,
+  pulse,
+  "fade-in-up": "_fade-in-up_dzgc9_1",
+  "progress-grow": "_progress-grow_dzgc9_1",
+  "indeterminate-move": "_indeterminate-move_dzgc9_1",
+  "skeleton-loading": "_skeleton-loading_dzgc9_1"
+};
+const ToolbarBase = ({
+  title: title2,
+  left,
+  center,
+  right,
+  avatar,
+  theme = getDefaultTheme(),
+  shadow = getDefaultShadow(),
+  rounding = getDefaultRounding(),
+  className = "",
+  "data-testid": testId = "toolbar",
+  AvatarComponent,
+  classMap,
+  ariaLabel = "Toolbar",
+  headingLevel = 1
+}) => {
+  const TitleTag = `h${headingLevel}`;
+  const headerClass = useMemo(
+    () => combineClassNames(
+      classMap.toolbar,
+      classMap[theme],
+      className,
+      shadow && classMap[`shadow${capitalize(shadow)}`],
+      rounding && classMap[`round${capitalize(rounding)}`]
+    ),
+    [classMap, theme, className]
+  );
+  return /* @__PURE__ */ jsxs(
+    "header",
+    {
+      className: headerClass,
+      role: "banner",
+      "aria-label": ariaLabel,
+      "data-testid": testId,
+      children: [
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: classMap.section,
+            role: "navigation",
+            "aria-label": "Toolbar left section",
+            "data-testid": `${testId}-left`,
+            children: left
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: classMap.section,
+            role: "navigation",
+            "aria-label": "Toolbar center section",
+            "data-testid": `${testId}-center`,
+            children: [
+              title2 && /* @__PURE__ */ jsx(TitleTag, { className: classMap.title, "data-testid": `${testId}-title`, children: title2 }),
+              center
+            ]
+          }
+        ),
+        /* @__PURE__ */ jsxs(
+          "div",
+          {
+            className: classMap.section,
+            role: "navigation",
+            "aria-label": "Toolbar right section",
+            "data-testid": `${testId}-right`,
+            children: [
+              right,
+              avatar && /* @__PURE__ */ jsx(
+                "div",
+                {
+                  className: classMap.avatarWrapper,
+                  "data-testid": `${testId}-avatar`,
+                  children: /* @__PURE__ */ jsx(
+                    AvatarComponent,
+                    {
+                      name: avatar.name,
+                      src: avatar.src,
+                      size: avatar.size || "medium",
+                      shape: avatar.shape || "circle",
+                      theme: avatar.theme,
+                      outline: avatar.outline,
+                      onClick: avatar.onClick,
+                      "aria-hidden": !avatar.name
+                    }
+                  )
+                }
+              )
+            ]
+          }
+        )
+      ]
+    }
+  );
+};
+const Toolbar = (props) => /* @__PURE__ */ jsx(ToolbarBase, { ...props, AvatarComponent: Avatar, classMap: styles });
+export {
+  Toolbar as T
+};
+//# sourceMappingURL=Toolbar-vNJ46DTU.js.map

package/dist/next/Toolbar-vNJ46DTU.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toolbar-vNJ46DTU.js","sources":["../../src/components/Toolbar/ToolbarBase.tsx","../../src/components/Toolbar/next/Toolbar.tsx"],"sourcesContent":["import React, { JSX, useMemo } from \"react\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { ToolbarBaseProps, ToolbarProps } 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\nexport const ToolbarBase: React.FC<ToolbarBaseProps> = ({\r\n  title,\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  AvatarComponent,\r\n  classMap,\r\n  ariaLabel = \"Toolbar\",\r\n  headingLevel = 1,\r\n}): JSX.Element => {\r\n  const TitleTag = `h${headingLevel}` as keyof JSX.IntrinsicElements;\r\n\r\n  const headerClass = 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]\r\n  );\r\n\r\n  return (\r\n    <header\r\n      className={headerClass}\r\n      role=\"banner\"\r\n      aria-label={ariaLabel}\r\n      data-testid={testId}\r\n    >\r\n      <div\r\n        className={classMap.section}\r\n        role=\"navigation\"\r\n        aria-label=\"Toolbar left section\"\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=\"navigation\"\r\n        aria-label=\"Toolbar center section\"\r\n        data-testid={`${testId}-center`}\r\n      >\r\n        {title && (\r\n          <TitleTag className={classMap.title} data-testid={`${testId}-title`}>\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=\"navigation\"\r\n        aria-label=\"Toolbar right section\"\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-hidden={!avatar.name}\r\n            />\r\n          </div>\r\n        )}\r\n      </div>\r\n    </header>\r\n  );\r\n};\r\n","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport styles from \"./Toolbar.module.scss\";\r\nimport Avatar from \"../../Avatar/next/Avatar\";\r\nimport { ToolbarBase } from \"../ToolbarBase\";\r\nimport { ToolbarProps } from \"../Toolbar.types\";\r\n\r\nconst Toolbar: React.FC<ToolbarProps> = (props) => (\r\n  <ToolbarBase {...props} AvatarComponent={Avatar} classMap={styles} />\r\n);\r\n\r\nexport default Toolbar;\r\n"],"names":["title"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAUO,MAAM,cAA0C,CAAC;AAAA,EACtD,OAAAA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,QAAQ,gBAAgB;AAAA,EACxB,SAAS,iBAAiB;AAAA,EAC1B,WAAW,mBAAmB;AAAA,EAC9B,YAAY;AAAA,EACZ,eAAe,SAAS;AAAA,EACxB;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ,eAAe;AACjB,MAAmB;AACX,QAAA,WAAW,IAAI,YAAY;AAEjC,QAAM,cAAc;AAAA,IAClB,MACE;AAAA,MACE,SAAS;AAAA,MACT,SAAS,KAAK;AAAA,MACd;AAAA,MACA,UAAU,SAAS,SAAS,WAAW,MAAM,CAAC,EAAE;AAAA,MAChD,YAAY,SAAS,QAAQ,WAAW,QAAQ,CAAC,EAAE;AAAA,IACrD;AAAA,IACF,CAAC,UAAU,OAAO,SAAS;AAAA,EAC7B;AAGE,SAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,MACX,MAAK;AAAA,MACL,cAAY;AAAA,MACZ,eAAa;AAAA,MAEb,UAAA;AAAA,QAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW,SAAS;AAAA,YACpB,MAAK;AAAA,YACL,cAAW;AAAA,YACX,eAAa,GAAG,MAAM;AAAA,YAErB,UAAA;AAAA,UAAA;AAAA,QACH;AAAA,QAEA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW,SAAS;AAAA,YACpB,MAAK;AAAA,YACL,cAAW;AAAA,YACX,eAAa,GAAG,MAAM;AAAA,YAErB,UAAA;AAAA,cACCA,UAAA,oBAAC,YAAS,WAAW,SAAS,OAAO,eAAa,GAAG,MAAM,UACxD,UACHA,OAAA,CAAA;AAAA,cAED;AAAA,YAAA;AAAA,UAAA;AAAA,QACH;AAAA,QAEA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW,SAAS;AAAA,YACpB,MAAK;AAAA,YACL,cAAW;AAAA,YACX,eAAa,GAAG,MAAM;AAAA,YAErB,UAAA;AAAA,cAAA;AAAA,cACA,UACC;AAAA,gBAAC;AAAA,gBAAA;AAAA,kBACC,WAAW,SAAS;AAAA,kBACpB,eAAa,GAAG,MAAM;AAAA,kBAEtB,UAAA;AAAA,oBAAC;AAAA,oBAAA;AAAA,sBACC,MAAM,OAAO;AAAA,sBACb,KAAK,OAAO;AAAA,sBACZ,MAAM,OAAO,QAAQ;AAAA,sBACrB,OAAO,OAAO,SAAS;AAAA,sBACvB,OAAO,OAAO;AAAA,sBACd,SAAS,OAAO;AAAA,sBAChB,SAAS,OAAO;AAAA,sBAChB,eAAa,CAAC,OAAO;AAAA,oBAAA;AAAA,kBAAA;AAAA,gBACvB;AAAA,cAAA;AAAA,YACF;AAAA,UAAA;AAAA,QAAA;AAAA,MAEJ;AAAA,IAAA;AAAA,EACF;AAEJ;ACzFM,MAAA,UAAkC,CAAC,UACtC,oBAAA,aAAA,EAAa,GAAG,OAAO,iBAAiB,QAAQ,UAAU,OAAQ,CAAA;"}

package/dist/next/Toolbar.cjs.js

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

package/dist/next/Toolbar.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toolbar.cjs.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/next/Toolbar.js

@@ -0,0 +1,5 @@
+import { T } from "./Toolbar-vNJ46DTU.js";
+export {
+  T as default
+};
+//# sourceMappingURL=Toolbar.js.map

package/dist/next/Toolbar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toolbar.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}