boreal-ui 0.0.1

package/dist/next/Button-DUh0L7vy.cjs

@@ -0,0 +1,207 @@
+"use strict";
+const require$$2 = require("react/jsx-runtime");
+const link = require("./link-B8xgzNiC.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_bthea_91";
+const errorMessage = "_errorMessage_bthea_92";
+const loadingContainer = "_loadingContainer_bthea_93";
+const hideScrollbar = "_hideScrollbar_bthea_85";
+const sr_only = "_sr_only_bthea_94";
+const button = "_button_bthea_479";
+const roundNone = "_roundNone_bthea_501";
+const roundSmall = "_roundSmall_bthea_505";
+const roundMedium = "_roundMedium_bthea_509";
+const roundLarge = "_roundLarge_bthea_513";
+const roundFull = "_roundFull_bthea_517";
+const shadowNone = "_shadowNone_bthea_521";
+const shadowLight = "_shadowLight_bthea_525";
+const shadowMedium = "_shadowMedium_bthea_529";
+const shadowStrong = "_shadowStrong_bthea_533";
+const shadowIntense = "_shadowIntense_bthea_537";
+const fullWidth = "_fullWidth_bthea_541";
+const loader = "_loader_bthea_547";
+const spin = "_spin_bthea_1";
+const buttonIcon = "_buttonIcon_bthea_556";
+const buttonLabel = "_buttonLabel_bthea_563";
+const clear = "_clear_bthea_567";
+const outline = "_outline_bthea_573";
+const primary = "_primary_bthea_579";
+const secondary = "_secondary_bthea_600";
+const tertiary = "_tertiary_bthea_621";
+const quaternary = "_quaternary_bthea_642";
+const success = "_success_bthea_684";
+const error = "_error_bthea_92";
+const warning = "_warning_bthea_726";
+const disabled = "_disabled_bthea_747";
+const xs = "_xs_bthea_760";
+const icon = "_icon_bthea_766";
+const small = "_small_bthea_771";
+const medium = "_medium_bthea_782";
+const large = "_large_bthea_793";
+const xl = "_xl_bthea_804";
+const pulse = "_pulse_bthea_1";
+const styles = {
+  noScroll,
+  errorMessage,
+  loadingContainer,
+  hideScrollbar,
+  sr_only,
+  button,
+  roundNone,
+  roundSmall,
+  roundMedium,
+  roundLarge,
+  roundFull,
+  shadowNone,
+  shadowLight,
+  shadowMedium,
+  shadowStrong,
+  shadowIntense,
+  fullWidth,
+  loader,
+  spin,
+  buttonIcon,
+  buttonLabel,
+  clear,
+  outline,
+  primary,
+  secondary,
+  tertiary,
+  quaternary,
+  success,
+  error,
+  warning,
+  disabled,
+  xs,
+  icon,
+  small,
+  medium,
+  large,
+  xl,
+  "fade-in": "_fade-in_bthea_1",
+  "slide-up": "_slide-up_bthea_1",
+  "spin-3d": "_spin-3d_bthea_1",
+  pulse,
+  "fade-in-up": "_fade-in-up_bthea_1",
+  "progress-grow": "_progress-grow_bthea_1",
+  "indeterminate-move": "_indeterminate-move_bthea_1",
+  "skeleton-loading": "_skeleton-loading_bthea_1"
+};
+const ButtonBase = React.forwardRef(
+  ({
+    icon: Icon,
+    theme = borealStyleConfig.getDefaultTheme(),
+    state = "",
+    onClick,
+    type = "button",
+    rounding = borealStyleConfig.getDefaultRounding(),
+    shadow = borealStyleConfig.getDefaultShadow(),
+    children,
+    className = "",
+    disabled: disabled2 = false,
+    ariaLabel,
+    href,
+    isExternal = false,
+    outline: outline2 = false,
+    size = borealStyleConfig.getDefaultSize(),
+    loading = false,
+    fullWidth: fullWidth2 = false,
+    "data-testid": testId,
+    classMap,
+    LinkComponent = "a",
+    ...rest
+  }, ref) => {
+    const computedAriaLabel = ariaLabel || (typeof children === "string" ? children : "Button");
+    const combinedClassName = React.useMemo(
+      () => classNames.combineClassNames(
+        classMap.button,
+        classMap[theme],
+        classMap[state],
+        classMap[size],
+        outline2 && classMap.outline,
+        shadow && classMap[`shadow${capitalize.capitalize(shadow)}`],
+        rounding && classMap[`round${capitalize.capitalize(rounding)}`],
+        fullWidth2 && classMap.fullWidth,
+        disabled2 && classMap.disabled,
+        className
+      ),
+      [theme, outline2, size, fullWidth2, disabled2, className]
+    );
+    const sharedProps = {
+      "aria-label": computedAriaLabel,
+      "aria-busy": loading || void 0,
+      "aria-disabled": disabled2 || void 0,
+      "data-testid": testId,
+      tabIndex: disabled2 ? -1 : 0,
+      onClick: disabled2 ? void 0 : onClick
+    };
+    const content = /* @__PURE__ */ require$$2.jsxs(require$$2.Fragment, { children: [
+      Icon && /* @__PURE__ */ require$$2.jsx(
+        "span",
+        {
+          className: classMap.buttonIcon,
+          "aria-hidden": "true",
+          "data-testid": testId ? `${testId}-icon` : void 0,
+          children: /* @__PURE__ */ require$$2.jsx(Icon, { className: classMap.icon })
+        }
+      ),
+      /* @__PURE__ */ require$$2.jsx(
+        "span",
+        {
+          className: classMap.buttonLabel,
+          "data-testid": testId ? `${testId}-loading` : void 0,
+          children: loading ? /* @__PURE__ */ require$$2.jsx("div", { className: classMap.loader, "aria-hidden": "true" }) : children
+        }
+      )
+    ] });
+    if (href && isExternal) {
+      return /* @__PURE__ */ require$$2.jsx(
+        "a",
+        {
+          href,
+          target: "_blank",
+          rel: "noopener noreferrer",
+          role: "button",
+          className: classNames.combineClassNames(combinedClassName, classMap.link),
+          ref,
+          ...sharedProps,
+          ...rest,
+          children: content
+        }
+      );
+    }
+    if (href && !isExternal) {
+      return /* @__PURE__ */ require$$2.jsx(
+        LinkComponent,
+        {
+          href,
+          role: "button",
+          className: classNames.combineClassNames(combinedClassName, classMap.link),
+          ref,
+          ...sharedProps,
+          ...rest,
+          children: content
+        }
+      );
+    }
+    return /* @__PURE__ */ require$$2.jsx(
+      "button",
+      {
+        ref,
+        type,
+        className: combinedClassName,
+        disabled: disabled2,
+        ...sharedProps,
+        ...rest,
+        children: content
+      }
+    );
+  }
+);
+ButtonBase.displayName = "ButtonBase";
+const Button = (props) => /* @__PURE__ */ require$$2.jsx(ButtonBase, { ...props, classMap: styles, LinkComponent: link.Link });
+exports.Button = Button;
+//# sourceMappingURL=Button-DUh0L7vy.cjs.map

package/dist/next/Button-DUh0L7vy.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Button-DUh0L7vy.cjs","sources":["../../src/components/Button/ButtonBase.tsx","../../src/components/Button/next/Button.tsx"],"sourcesContent":["import React, { forwardRef, useMemo } from \"react\";\r\nimport { ButtonProps } from \"./Button.types\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { capitalize } from \"../../utils/capitalize\";\r\nimport {\r\n  getDefaultRounding,\r\n  getDefaultShadow,\r\n  getDefaultSize,\r\n  getDefaultTheme,\r\n} from \"../../config/boreal-style-config\";\r\n\r\nexport interface ButtonBaseProps extends ButtonProps {\r\n  classMap: Record<string, string>;\r\n  LinkComponent?: React.ElementType;\r\n}\r\n\r\nconst ButtonBase = forwardRef<\r\n  HTMLButtonElement | HTMLAnchorElement,\r\n  ButtonBaseProps\r\n>(\r\n  (\r\n    {\r\n      icon: Icon,\r\n      theme = getDefaultTheme(),\r\n      state = \"\",\r\n      onClick,\r\n      type = \"button\",\r\n      rounding = getDefaultRounding(),\r\n      shadow = getDefaultShadow(),\r\n      children,\r\n      className = \"\",\r\n      disabled = false,\r\n      ariaLabel,\r\n      href,\r\n      isExternal = false,\r\n      outline = false,\r\n      size = getDefaultSize(),\r\n      loading = false,\r\n      fullWidth = false,\r\n      \"data-testid\": testId,\r\n      classMap,\r\n      LinkComponent = \"a\",\r\n      ...rest\r\n    },\r\n    ref\r\n  ) => {\r\n    const computedAriaLabel =\r\n      ariaLabel || (typeof children === \"string\" ? children : \"Button\");\r\n\r\n    const combinedClassName = useMemo(\r\n      () =>\r\n        combineClassNames(\r\n          classMap.button,\r\n          classMap[theme],\r\n          classMap[state],\r\n          classMap[size],\r\n          outline && classMap.outline,\r\n          shadow && classMap[`shadow${capitalize(shadow)}`],\r\n          rounding && classMap[`round${capitalize(rounding)}`],\r\n          fullWidth && classMap.fullWidth,\r\n          disabled && classMap.disabled,\r\n          className\r\n        ),\r\n      [theme, outline, size, fullWidth, disabled, className]\r\n    );\r\n\r\n    const sharedProps = {\r\n      \"aria-label\": computedAriaLabel,\r\n      \"aria-busy\": loading || undefined,\r\n      \"aria-disabled\": disabled || undefined,\r\n      \"data-testid\": testId,\r\n      tabIndex: disabled ? -1 : 0,\r\n      onClick: disabled ? undefined : onClick,\r\n    };\r\n\r\n    const content = (\r\n      <>\r\n        {Icon && (\r\n          <span\r\n            className={classMap.buttonIcon}\r\n            aria-hidden=\"true\"\r\n            data-testid={testId ? `${testId}-icon` : undefined}\r\n          >\r\n            <Icon className={classMap.icon} />\r\n          </span>\r\n        )}\r\n        <span\r\n          className={classMap.buttonLabel}\r\n          data-testid={testId ? `${testId}-loading` : undefined}\r\n        >\r\n          {loading ? (\r\n            <div className={classMap.loader} aria-hidden=\"true\" />\r\n          ) : (\r\n            children\r\n          )}\r\n        </span>\r\n      </>\r\n    );\r\n\r\n    if (href && isExternal) {\r\n      return (\r\n        <a\r\n          href={href}\r\n          target=\"_blank\"\r\n          rel=\"noopener noreferrer\"\r\n          role=\"button\"\r\n          className={combineClassNames(combinedClassName, classMap.link)}\r\n          ref={ref as React.Ref<HTMLAnchorElement>}\r\n          {...sharedProps}\r\n          {...rest}\r\n        >\r\n          {content}\r\n        </a>\r\n      );\r\n    }\r\n\r\n    if (href && !isExternal) {\r\n      return (\r\n        <LinkComponent\r\n          href={href}\r\n          role=\"button\"\r\n          className={combineClassNames(combinedClassName, classMap.link)}\r\n          ref={ref as React.Ref<HTMLAnchorElement>}\r\n          {...sharedProps}\r\n          {...rest}\r\n        >\r\n          {content}\r\n        </LinkComponent>\r\n      );\r\n    }\r\n\r\n    return (\r\n      <button\r\n        ref={ref as React.Ref<HTMLButtonElement>}\r\n        type={type}\r\n        className={combinedClassName}\r\n        disabled={disabled}\r\n        {...sharedProps}\r\n        {...rest}\r\n      >\r\n        {content}\r\n      </button>\r\n    );\r\n  }\r\n);\r\n\r\nButtonBase.displayName = \"ButtonBase\";\r\n\r\nexport default ButtonBase;\r\n","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport Link from \"next/link\";\r\nimport styles from \"./Button.module.scss\";\r\nimport ButtonBase from \"../ButtonBase\";\r\nimport { ButtonProps } from \"../Button.types\";\r\n\r\nconst Button: React.FC<ButtonProps> = (props) => (\r\n  <ButtonBase {...props} classMap={styles} LinkComponent={Link} />\r\n);\r\n\r\nexport default Button;\r\n"],"names":["forwardRef","getDefaultTheme","getDefaultRounding","getDefaultShadow","disabled","outline","getDefaultSize","fullWidth","useMemo","combineClassNames","capitalize","jsxs","Fragment","jsx","Link"],"mappings":"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"}

package/dist/next/Button.cjs.js

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

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

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

package/dist/next/Button.js

@@ -0,0 +1,5 @@
+import { B } from "./Button-BpVwB1WA.js";
+export {
+  B as default
+};
+//# sourceMappingURL=Button.js.map

package/dist/next/Button.js.map

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

package/dist/next/Card-BjYztK13.cjs

@@ -0,0 +1,294 @@
+"use strict";
+const require$$2 = require("react/jsx-runtime");
+const image$1 = require("./image-C5jTmHeD.cjs");
+const Button = require("./Button-DUh0L7vy.cjs");
+const IconButton = require("./IconButton-mY_E1gsn.cjs");
+const Skeleton = require("./Skeleton-CMuXs5GO.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_1uqf4_91";
+const errorMessage = "_errorMessage_1uqf4_92";
+const loadingContainer = "_loadingContainer_1uqf4_93";
+const hideScrollbar = "_hideScrollbar_1uqf4_85";
+const sr_only = "_sr_only_1uqf4_94";
+const card = "_card_1uqf4_479";
+const roundNone = "_roundNone_1uqf4_493";
+const roundSmall = "_roundSmall_1uqf4_497";
+const roundMedium = "_roundMedium_1uqf4_501";
+const roundLarge = "_roundLarge_1uqf4_505";
+const roundFull = "_roundFull_1uqf4_509";
+const shadowNone = "_shadowNone_1uqf4_513";
+const shadowLight = "_shadowLight_1uqf4_517";
+const shadowMedium = "_shadowMedium_1uqf4_521";
+const shadowStrong = "_shadowStrong_1uqf4_525";
+const shadowIntense = "_shadowIntense_1uqf4_529";
+const loading = "_loading_1uqf4_93";
+const fade_in = "_fade_in_1uqf4_544";
+const image = "_image_1uqf4_548";
+const vertical = "_vertical_1uqf4_556";
+const content = "_content_1uqf4_559";
+const horizontal = "_horizontal_1uqf4_567";
+const body = "_body_1uqf4_590";
+const footer = "_footer_1uqf4_597";
+const disabled = "_disabled_1uqf4_601";
+const outline = "_outline_1uqf4_610";
+const primary = "_primary_1uqf4_616";
+const icon = "_icon_1uqf4_620";
+const description = "_description_1uqf4_621";
+const secondary = "_secondary_1uqf4_634";
+const tertiary = "_tertiary_1uqf4_652";
+const quaternary = "_quaternary_1uqf4_670";
+const clear = "_clear_1uqf4_688";
+const success = "_success_1uqf4_706";
+const error = "_error_1uqf4_92";
+const warning = "_warning_1uqf4_740";
+const header = "_header_1uqf4_763";
+const title = "_title_1uqf4_782";
+const actions = "_actions_1uqf4_807";
+const xs = "_xs_1uqf4_814";
+const children = "_children_1uqf4_824";
+const small = "_small_1uqf4_828";
+const medium = "_medium_1uqf4_841";
+const large = "_large_1uqf4_854";
+const xl = "_xl_1uqf4_867";
+const left = "_left_1uqf4_880";
+const center = "_center_1uqf4_892";
+const right = "_right_1uqf4_904";
+const spin = "_spin_1uqf4_1";
+const pulse = "_pulse_1uqf4_1";
+const styles = {
+  noScroll,
+  errorMessage,
+  loadingContainer,
+  hideScrollbar,
+  sr_only,
+  card,
+  roundNone,
+  roundSmall,
+  roundMedium,
+  roundLarge,
+  roundFull,
+  shadowNone,
+  shadowLight,
+  shadowMedium,
+  shadowStrong,
+  shadowIntense,
+  loading,
+  fade_in,
+  "fade-in": "_fade-in_1uqf4_1",
+  image,
+  vertical,
+  content,
+  horizontal,
+  body,
+  footer,
+  disabled,
+  outline,
+  primary,
+  icon,
+  description,
+  secondary,
+  tertiary,
+  quaternary,
+  clear,
+  success,
+  error,
+  warning,
+  header,
+  title,
+  actions,
+  xs,
+  children,
+  small,
+  medium,
+  large,
+  xl,
+  left,
+  center,
+  right,
+  "slide-up": "_slide-up_1uqf4_1",
+  "spin-3d": "_spin-3d_1uqf4_1",
+  spin,
+  pulse,
+  "fade-in-up": "_fade-in-up_1uqf4_1",
+  "progress-grow": "_progress-grow_1uqf4_1",
+  "indeterminate-move": "_indeterminate-move_1uqf4_1",
+  "skeleton-loading": "_skeleton-loading_1uqf4_1"
+};
+const CardBase = ({
+  theme = borealStyleConfig.getDefaultTheme(),
+  state = "",
+  cardIcon,
+  title: title2 = "",
+  description: description2 = "",
+  rounding = borealStyleConfig.getDefaultRounding(),
+  shadow = borealStyleConfig.getDefaultShadow(),
+  imageUrl,
+  imageAlt,
+  className = "",
+  imageClassName = "",
+  headerClassName = "",
+  bodyClassName = "",
+  footerClassName = "",
+  outline: outline2 = false,
+  size = borealStyleConfig.getDefaultSize(),
+  align = "center",
+  renderHeader,
+  renderContent,
+  renderFooter,
+  actionButtons = [],
+  useIconButtons = false,
+  layout = "vertical",
+  blur = false,
+  loading: loading2 = false,
+  children: children2,
+  "data-testid": testId = "card",
+  "aria-labelledby": ariaLabelledBy,
+  "aria-label": ariaLabel,
+  classMap,
+  SkeletonComponent,
+  ImageComponent
+}) => {
+  const autoId = React.useId();
+  const headerId = ariaLabelledBy || `${autoId}-header`;
+  const descriptionId = `${autoId}-description`;
+  const hasImage = !!imageUrl;
+  const showBlur = blur && typeof imageUrl !== "string";
+  const derivedAriaLabel = ariaLabel || title2 || description2 || "Content card";
+  const FallbackImage = (props) => /* @__PURE__ */ require$$2.jsx("img", { ...props });
+  const ImageRenderer = ImageComponent || FallbackImage;
+  const cardClassName = React.useMemo(
+    () => classNames.combineClassNames(
+      classMap.card,
+      classMap[layout],
+      align && classMap[align],
+      classMap[theme],
+      classMap[state],
+      classMap[size],
+      shadow && classMap[`shadow${capitalize.capitalize(shadow)}`],
+      rounding && classMap[`round${capitalize.capitalize(rounding)}`],
+      outline2 && classMap.outline,
+      loading2 && classMap.loading,
+      className
+    ),
+    [classMap, size, outline2, align, className]
+  );
+  return /* @__PURE__ */ require$$2.jsx(
+    "div",
+    {
+      "data-testid": testId,
+      className: cardClassName,
+      role: "region",
+      "aria-labelledby": title2 ? headerId : void 0,
+      "aria-label": !title2 ? derivedAriaLabel : void 0,
+      children: loading2 ? /* @__PURE__ */ require$$2.jsx(SkeletonComponent, { width: "100%", height: "250px", "data-testid": "skeleton" }) : /* @__PURE__ */ require$$2.jsxs("div", { className: classMap.content, children: [
+        hasImage && /* @__PURE__ */ require$$2.jsx(
+          ImageRenderer,
+          {
+            src: imageUrl,
+            alt: imageAlt || `${title2 || "Card"} image`,
+            className: classNames.combineClassNames(classMap.image, imageClassName),
+            placeholder: showBlur ? "blur" : void 0
+          }
+        ),
+        /* @__PURE__ */ require$$2.jsxs("div", { children: [
+          /* @__PURE__ */ require$$2.jsx(
+            "div",
+            {
+              className: classNames.combineClassNames(classMap.header, headerClassName),
+              id: headerId,
+              children: renderHeader ? renderHeader() : title2 ? /* @__PURE__ */ require$$2.jsxs("h2", { className: classMap.title, children: [
+                cardIcon && /* @__PURE__ */ require$$2.jsx(
+                  "span",
+                  {
+                    className: classMap.icon,
+                    "aria-hidden": "true",
+                    "data-testid": "card-icon",
+                    children: React.createElement(cardIcon)
+                  }
+                ),
+                title2
+              ] }) : null
+            }
+          ),
+          /* @__PURE__ */ require$$2.jsx(
+            "div",
+            {
+              className: classNames.combineClassNames(classMap.body, bodyClassName),
+              role: "group",
+              "aria-describedby": description2 ? descriptionId : void 0,
+              children: renderContent ? renderContent() : /* @__PURE__ */ require$$2.jsxs(require$$2.Fragment, { children: [
+                description2 && /* @__PURE__ */ require$$2.jsx("p", { id: descriptionId, className: classMap.description, children: description2 }),
+                children2 && /* @__PURE__ */ require$$2.jsx("div", { className: classMap.children, children: children2 })
+              ] })
+            }
+          ),
+          (actionButtons.length > 0 || renderFooter) && /* @__PURE__ */ require$$2.jsxs(
+            "div",
+            {
+              className: classNames.combineClassNames(classMap.footer, footerClassName),
+              children: [
+                actionButtons.length > 0 && /* @__PURE__ */ require$$2.jsx("div", { className: classMap.actions, children: actionButtons.map(
+                  (button, index) => useIconButtons && button.icon ? /* @__PURE__ */ require$$2.jsx(
+                    button.iconButtonComponent,
+                    {
+                      icon: button.icon,
+                      onClick: button.onClick,
+                      className: classMap.action_button,
+                      theme: button.theme || "clear",
+                      state: button.state || "",
+                      "aria-label": button.label,
+                      size: button.size || size,
+                      href: button.href,
+                      loading: button.loading
+                    },
+                    index
+                  ) : /* @__PURE__ */ require$$2.jsx(
+                    button.buttonComponent,
+                    {
+                      onClick: button.onClick,
+                      className: classMap.action_button,
+                      theme: button.theme || "secondary",
+                      state: button.state || "",
+                      href: button.href,
+                      loading: button.loading,
+                      size: button.size || size,
+                      "aria-label": button.label,
+                      children: button.label
+                    },
+                    index
+                  )
+                ) }),
+                renderFooter && renderFooter()
+              ]
+            }
+          )
+        ] })
+      ] })
+    }
+  );
+};
+const NextImageWrapper = (props) => {
+  return /* @__PURE__ */ require$$2.jsx(image$1.Image, { ...props });
+};
+const Card = (props) => {
+  const wrappedButtons = (props.actionButtons ?? []).map((b) => ({
+    ...b,
+    buttonComponent: Button.Button,
+    iconButtonComponent: IconButton.IconButton
+  }));
+  return /* @__PURE__ */ require$$2.jsx(
+    CardBase,
+    {
+      ...props,
+      actionButtons: wrappedButtons,
+      classMap: styles,
+      SkeletonComponent: Skeleton.SkeletonLoader,
+      ImageComponent: NextImageWrapper
+    }
+  );
+};
+exports.Card = Card;
+//# sourceMappingURL=Card-BjYztK13.cjs.map

package/dist/next/Card-BjYztK13.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Card-BjYztK13.cjs","sources":["../../src/components/Card/CardBase.tsx","../../src/components/Card/next/Card.tsx"],"sourcesContent":["import React, { useId, useMemo } from \"react\";\r\nimport { ActionButton, CardProps } from \"./Card.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\ntype ExtendedActionButton = ActionButton & {\r\n  buttonComponent: React.ElementType;\r\n  iconButtonComponent: React.ElementType;\r\n};\r\n\r\nexport interface CardBaseProps extends CardProps {\r\n  classMap: Record<string, string>;\r\n  SkeletonComponent: React.FC<{\r\n    width: string;\r\n    height: string;\r\n    [\"data-testid\"]?: string;\r\n  }>;\r\n  ImageComponent?: React.ElementType;\r\n  actionButtons: ExtendedActionButton[];\r\n}\r\n\r\nconst CardBase: React.FC<CardBaseProps> = ({\r\n  theme = getDefaultTheme(),\r\n  state = \"\",\r\n  cardIcon,\r\n  title = \"\",\r\n  description = \"\",\r\n  rounding = getDefaultRounding(),\r\n  shadow = getDefaultShadow(),\r\n  imageUrl,\r\n  imageAlt,\r\n  className = \"\",\r\n  imageClassName = \"\",\r\n  headerClassName = \"\",\r\n  bodyClassName = \"\",\r\n  footerClassName = \"\",\r\n  outline = false,\r\n  size = getDefaultSize(),\r\n  align = \"center\",\r\n  renderHeader,\r\n  renderContent,\r\n  renderFooter,\r\n  actionButtons = [],\r\n  useIconButtons = false,\r\n  layout = \"vertical\",\r\n  blur = false,\r\n  loading = false,\r\n  children,\r\n  \"data-testid\": testId = \"card\",\r\n  \"aria-labelledby\": ariaLabelledBy,\r\n  \"aria-label\": ariaLabel,\r\n  classMap,\r\n  SkeletonComponent,\r\n  ImageComponent,\r\n}) => {\r\n  const autoId = useId();\r\n  const headerId = ariaLabelledBy || `${autoId}-header`;\r\n  const descriptionId = `${autoId}-description`;\r\n  const hasImage = !!imageUrl;\r\n  const showBlur = blur && typeof imageUrl !== \"string\";\r\n  const derivedAriaLabel = ariaLabel || title || description || \"Content card\";\r\n\r\n  const FallbackImage = (props: React.ImgHTMLAttributes<HTMLImageElement>) => (\r\n    <img {...props} />\r\n  );\r\n\r\n  const ImageRenderer = ImageComponent || FallbackImage;\r\n\r\n  const cardClassName = useMemo(\r\n    () =>\r\n      combineClassNames(\r\n        classMap.card,\r\n        classMap[layout],\r\n        align && classMap[align],\r\n        classMap[theme],\r\n        classMap[state],\r\n        classMap[size],\r\n        shadow && classMap[`shadow${capitalize(shadow)}`],\r\n        rounding && classMap[`round${capitalize(rounding)}`],\r\n        outline && classMap.outline,\r\n        loading && classMap.loading,\r\n        className\r\n      ),\r\n    [classMap, size, outline, align, className]\r\n  );\r\n\r\n  return (\r\n    <div\r\n      data-testid={testId}\r\n      className={cardClassName}\r\n      role=\"region\"\r\n      aria-labelledby={title ? headerId : undefined}\r\n      aria-label={!title ? derivedAriaLabel : undefined}\r\n    >\r\n      {loading ? (\r\n        <SkeletonComponent width=\"100%\" height=\"250px\" data-testid=\"skeleton\" />\r\n      ) : (\r\n        <div className={classMap.content}>\r\n          {hasImage && (\r\n            <ImageRenderer\r\n              src={imageUrl}\r\n              alt={imageAlt || `${title || \"Card\"} image`}\r\n              className={combineClassNames(classMap.image, imageClassName)}\r\n              placeholder={showBlur ? \"blur\" : undefined}\r\n            />\r\n          )}\r\n\r\n          <div>\r\n            <div\r\n              className={combineClassNames(classMap.header, headerClassName)}\r\n              id={headerId}\r\n            >\r\n              {renderHeader ? (\r\n                renderHeader()\r\n              ) : title ? (\r\n                <h2 className={classMap.title}>\r\n                  {cardIcon && (\r\n                    <span\r\n                      className={classMap.icon}\r\n                      aria-hidden=\"true\"\r\n                      data-testid=\"card-icon\"\r\n                    >\r\n                      {React.createElement(cardIcon)}\r\n                    </span>\r\n                  )}\r\n                  {title}\r\n                </h2>\r\n              ) : null}\r\n            </div>\r\n\r\n            <div\r\n              className={combineClassNames(classMap.body, bodyClassName)}\r\n              role=\"group\"\r\n              aria-describedby={description ? descriptionId : undefined}\r\n            >\r\n              {renderContent ? (\r\n                renderContent()\r\n              ) : (\r\n                <>\r\n                  {description && (\r\n                    <p id={descriptionId} className={classMap.description}>\r\n                      {description}\r\n                    </p>\r\n                  )}\r\n                  {children && (\r\n                    <div className={classMap.children}>{children}</div>\r\n                  )}\r\n                </>\r\n              )}\r\n            </div>\r\n\r\n            {(actionButtons.length > 0 || renderFooter) && (\r\n              <div\r\n                className={combineClassNames(classMap.footer, footerClassName)}\r\n              >\r\n                {actionButtons.length > 0 && (\r\n                  <div className={classMap.actions}>\r\n                    {actionButtons.map((button, index) =>\r\n                      useIconButtons && button.icon ? (\r\n                        <button.iconButtonComponent\r\n                          key={index}\r\n                          icon={button.icon}\r\n                          onClick={button.onClick}\r\n                          className={classMap.action_button}\r\n                          theme={button.theme || \"clear\"}\r\n                          state={button.state || \"\"}\r\n                          aria-label={button.label}\r\n                          size={button.size || size}\r\n                          href={button.href}\r\n                          loading={button.loading}\r\n                        />\r\n                      ) : (\r\n                        <button.buttonComponent\r\n                          key={index}\r\n                          onClick={button.onClick}\r\n                          className={classMap.action_button}\r\n                          theme={button.theme || \"secondary\"}\r\n                          state={button.state || \"\"}\r\n                          href={button.href}\r\n                          loading={button.loading}\r\n                          size={button.size || size}\r\n                          aria-label={button.label}\r\n                        >\r\n                          {button.label}\r\n                        </button.buttonComponent>\r\n                      )\r\n                    )}\r\n                  </div>\r\n                )}\r\n                {renderFooter && renderFooter()}\r\n              </div>\r\n            )}\r\n          </div>\r\n        </div>\r\n      )}\r\n    </div>\r\n  );\r\n};\r\n\r\nexport default CardBase;\r\n","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport Image from \"next/image\";\r\nimport { Button, IconButton, Skeleton } from \"../../../index.next\";\r\nimport styles from \"./Card.module.scss\";\r\nimport CardBase from \"../CardBase\";\r\nimport { CardProps } from \"../Card.types\";\r\n\r\nconst NextImageWrapper: React.FC<React.ComponentProps<typeof Image>> = (\r\n  props\r\n) => {\r\n  return <Image {...props} />;\r\n};\r\n\r\nconst Card: React.FC<CardProps> = (props) => {\r\n  const wrappedButtons = (props.actionButtons ?? []).map((b) => ({\r\n    ...b,\r\n    buttonComponent: Button,\r\n    iconButtonComponent: IconButton,\r\n  }));\r\n\r\n  return (\r\n    <CardBase\r\n      {...props}\r\n      actionButtons={wrappedButtons}\r\n      classMap={styles}\r\n      SkeletonComponent={Skeleton}\r\n      ImageComponent={NextImageWrapper}\r\n    />\r\n  );\r\n};\r\n\r\nexport default Card;\r\n"],"names":["getDefaultTheme","title","description","getDefaultRounding","getDefaultShadow","outline","getDefaultSize","loading","children","useId","jsx","useMemo","combineClassNames","capitalize","jsxs","Fragment","Image","Button","IconButton","Skeleton"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA2BA,MAAM,WAAoC,CAAC;AAAA,EACzC,QAAQA,kBAAAA,gBAAgB;AAAA,EACxB,QAAQ;AAAA,EACR;AAAA,EACA,OAAAC,SAAQ;AAAA,EACR,aAAAC,eAAc;AAAA,EACd,WAAWC,kBAAAA,mBAAmB;AAAA,EAC9B,SAASC,kBAAAA,iBAAiB;AAAA,EAC1B;AAAA,EACA;AAAA,EACA,YAAY;AAAA,EACZ,iBAAiB;AAAA,EACjB,kBAAkB;AAAA,EAClB,gBAAgB;AAAA,EAChB,kBAAkB;AAAA,EAClB,SAAAC,WAAU;AAAA,EACV,OAAOC,kBAAAA,eAAe;AAAA,EACtB,QAAQ;AAAA,EACR;AAAA,EACA;AAAA,EACA;AAAA,EACA,gBAAgB,CAAC;AAAA,EACjB,iBAAiB;AAAA,EACjB,SAAS;AAAA,EACT,OAAO;AAAA,EACP,SAAAC,WAAU;AAAA,EACV,UAAAC;AAAA,EACA,eAAe,SAAS;AAAA,EACxB,mBAAmB;AAAA,EACnB,cAAc;AAAA,EACd;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,SAASC,MAAAA,MAAM;AACf,QAAA,WAAW,kBAAkB,GAAG,MAAM;AACtC,QAAA,gBAAgB,GAAG,MAAM;AACzB,QAAA,WAAW,CAAC,CAAC;AACb,QAAA,WAAW,QAAQ,OAAO,aAAa;AACvC,QAAA,mBAAmB,aAAaR,UAASC,gBAAe;AAE9D,QAAM,gBAAgB,CAAC,UACpBQ,2BAAAA,IAAA,OAAA,EAAK,GAAG,OAAO;AAGlB,QAAM,gBAAgB,kBAAkB;AAExC,QAAM,gBAAgBC,MAAA;AAAA,IACpB,MACEC,WAAA;AAAA,MACE,SAAS;AAAA,MACT,SAAS,MAAM;AAAA,MACf,SAAS,SAAS,KAAK;AAAA,MACvB,SAAS,KAAK;AAAA,MACd,SAAS,KAAK;AAAA,MACd,SAAS,IAAI;AAAA,MACb,UAAU,SAAS,SAASC,WAAAA,WAAW,MAAM,CAAC,EAAE;AAAA,MAChD,YAAY,SAAS,QAAQA,WAAAA,WAAW,QAAQ,CAAC,EAAE;AAAA,MACnDR,YAAW,SAAS;AAAA,MACpBE,YAAW,SAAS;AAAA,MACpB;AAAA,IACF;AAAA,IACF,CAAC,UAAU,MAAMF,UAAS,OAAO,SAAS;AAAA,EAC5C;AAGE,SAAAK,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,eAAa;AAAA,MACb,WAAW;AAAA,MACX,MAAK;AAAA,MACL,mBAAiBT,SAAQ,WAAW;AAAA,MACpC,cAAY,CAACA,SAAQ,mBAAmB;AAAA,MAEvC,UACCM,WAAAG,+BAAC,mBAAkB,EAAA,OAAM,QAAO,QAAO,SAAQ,eAAY,WAAW,CAAA,IAEtEI,2BAAAA,KAAC,OAAI,EAAA,WAAW,SAAS,SACtB,UAAA;AAAA,QACC,YAAAJ,2BAAA;AAAA,UAAC;AAAA,UAAA;AAAA,YACC,KAAK;AAAA,YACL,KAAK,YAAY,GAAGT,UAAS,MAAM;AAAA,YACnC,WAAWW,WAAA,kBAAkB,SAAS,OAAO,cAAc;AAAA,YAC3D,aAAa,WAAW,SAAS;AAAA,UAAA;AAAA,QACnC;AAAA,wCAGD,OACC,EAAA,UAAA;AAAA,UAAAF,2BAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAWE,WAAA,kBAAkB,SAAS,QAAQ,eAAe;AAAA,cAC7D,IAAI;AAAA,cAEH,UAAA,eACC,aACE,IAAAX,yCACD,MAAG,EAAA,WAAW,SAAS,OACrB,UAAA;AAAA,gBACC,YAAAS,2BAAA;AAAA,kBAAC;AAAA,kBAAA;AAAA,oBACC,WAAW,SAAS;AAAA,oBACpB,eAAY;AAAA,oBACZ,eAAY;AAAA,oBAEX,UAAA,MAAM,cAAc,QAAQ;AAAA,kBAAA;AAAA,gBAC/B;AAAA,gBAEDT;AAAA,cAAA,EAAA,CACH,IACE;AAAA,YAAA;AAAA,UACN;AAAA,UAEAS,2BAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAWE,WAAA,kBAAkB,SAAS,MAAM,aAAa;AAAA,cACzD,MAAK;AAAA,cACL,oBAAkBV,eAAc,gBAAgB;AAAA,cAE/C,UAAA,gBACC,cAAc,IAGXY,2BAAAA,KAAAC,WAAAA,UAAA,EAAA,UAAA;AAAA,gBAAAb,+CACE,KAAE,EAAA,IAAI,eAAe,WAAW,SAAS,aACvC,UACHA,aAAA,CAAA;AAAA,gBAEDM,aACEE,2BAAA,IAAA,OAAA,EAAI,WAAW,SAAS,UAAW,UAAAF,UAAS,CAAA;AAAA,cAAA,EAEjD,CAAA;AAAA,YAAA;AAAA,UAEJ;AAAA,WAEE,cAAc,SAAS,KAAK,iBAC5BM,2BAAA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAWF,WAAA,kBAAkB,SAAS,QAAQ,eAAe;AAAA,cAE5D,UAAA;AAAA,gBAAA,cAAc,SAAS,KACtBF,2BAAAA,IAAC,SAAI,WAAW,SAAS,SACtB,UAAc,cAAA;AAAA,kBAAI,CAAC,QAAQ,UAC1B,kBAAkB,OAAO,OACvBA,2BAAA;AAAA,oBAAC,OAAO;AAAA,oBAAP;AAAA,sBAEC,MAAM,OAAO;AAAA,sBACb,SAAS,OAAO;AAAA,sBAChB,WAAW,SAAS;AAAA,sBACpB,OAAO,OAAO,SAAS;AAAA,sBACvB,OAAO,OAAO,SAAS;AAAA,sBACvB,cAAY,OAAO;AAAA,sBACnB,MAAM,OAAO,QAAQ;AAAA,sBACrB,MAAM,OAAO;AAAA,sBACb,SAAS,OAAO;AAAA,oBAAA;AAAA,oBATX;AAAA,kBAAA,IAYPA,2BAAA;AAAA,oBAAC,OAAO;AAAA,oBAAP;AAAA,sBAEC,SAAS,OAAO;AAAA,sBAChB,WAAW,SAAS;AAAA,sBACpB,OAAO,OAAO,SAAS;AAAA,sBACvB,OAAO,OAAO,SAAS;AAAA,sBACvB,MAAM,OAAO;AAAA,sBACb,SAAS,OAAO;AAAA,sBAChB,MAAM,OAAO,QAAQ;AAAA,sBACrB,cAAY,OAAO;AAAA,sBAElB,UAAO,OAAA;AAAA,oBAAA;AAAA,oBAVH;AAAA,kBAAA;AAAA,gBAWP,GAGN;AAAA,gBAED,gBAAgB,aAAa;AAAA,cAAA;AAAA,YAAA;AAAA,UAAA;AAAA,QAChC,EAEJ,CAAA;AAAA,MAAA,EACF,CAAA;AAAA,IAAA;AAAA,EAEJ;AAEJ;AClMA,MAAM,mBAAiE,CACrE,UACG;AACI,SAAAA,+BAACM,QAAAA,OAAO,EAAA,GAAG,MAAO,CAAA;AAC3B;AAEM,MAAA,OAA4B,CAAC,UAAU;AAC3C,QAAM,kBAAkB,MAAM,iBAAiB,CAAA,GAAI,IAAI,CAAC,OAAO;AAAA,IAC7D,GAAG;AAAA,IACH,iBAAiBC,OAAA;AAAA,IACjB,qBAAqBC,WAAAA;AAAAA,EAAA,EACrB;AAGA,SAAAR,2BAAA;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MACJ,eAAe;AAAA,MACf,UAAU;AAAA,MACV,mBAAmBS,SAAA;AAAA,MACnB,gBAAgB;AAAA,IAAA;AAAA,EAClB;AAEJ;;"}