boreal-ui 0.0.49 → 0.0.52

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -47,61 +47,42 @@ const CardBase = ({
47
47
  const headerId = ariaLabelledBy || `${autoId}-header`;
48
48
  const descriptionId = `${autoId}-description`;
49
49
  const derivedAriaLabel = ariaLabel || title || description || "Content card";
50
- function normalizeImageSource(imageUrl2, fallbackWidth, fallbackHeight) {
51
- if (!imageUrl2) {
52
- return {
53
- src: void 0,
54
- width: fallbackWidth,
55
- height: fallbackHeight
56
- };
50
+ const FallbackImage = (props) => /* @__PURE__ */ jsx("img", { ...props });
51
+ function isStaticCardImage(value) {
52
+ return typeof value === "object" && value !== null && "src" in value && typeof value.src === "string";
53
+ }
54
+ function normalizeImageSource(srcInput, fallbackWidth, fallbackHeight) {
55
+ if (!srcInput) {
56
+ return { src: void 0, width: fallbackWidth, height: fallbackHeight };
57
57
  }
58
- if (typeof imageUrl2 === "object" && "src" in imageUrl2 && typeof imageUrl2.src === "string") {
59
- const { src, width, height } = imageUrl2;
60
- const trimmed = src.trim();
58
+ if (typeof srcInput === "string") {
59
+ const trimmed = srcInput.trim();
61
60
  if (!trimmed) {
62
- return {
63
- src: void 0,
64
- width: fallbackWidth,
65
- height: fallbackHeight
66
- };
61
+ return { src: void 0, width: fallbackWidth, height: fallbackHeight };
67
62
  }
68
- return {
69
- src: trimmed,
70
- width: typeof width === "number" ? width : fallbackWidth,
71
- height: typeof height === "number" ? height : fallbackHeight
72
- };
63
+ return { src: trimmed, width: fallbackWidth, height: fallbackHeight };
73
64
  }
74
- if (typeof imageUrl2 === "string") {
75
- const trimmed = imageUrl2.trim();
65
+ if (isStaticCardImage(srcInput)) {
66
+ const trimmed = srcInput.src.trim();
76
67
  if (!trimmed) {
77
- return {
78
- src: void 0,
79
- width: fallbackWidth,
80
- height: fallbackHeight
81
- };
68
+ return { src: void 0, width: fallbackWidth, height: fallbackHeight };
82
69
  }
83
70
  return {
84
71
  src: trimmed,
85
- width: fallbackWidth,
86
- height: fallbackHeight
72
+ width: srcInput.width ?? fallbackWidth,
73
+ height: srcInput.height ?? fallbackHeight
87
74
  };
88
75
  }
89
- return {
90
- src: void 0,
91
- width: fallbackWidth,
92
- height: fallbackHeight
93
- };
76
+ return { src: void 0, width: fallbackWidth, height: fallbackHeight };
94
77
  }
95
- const FallbackImage = (props) => /* @__PURE__ */ jsx("img", { ...props });
96
78
  const {
97
79
  src: imgSrc,
98
80
  width: resolvedWidth,
99
81
  height: resolvedHeight
100
82
  } = normalizeImageSource(imageUrl, imageWidth, imageHeight);
101
- const hasImage = !!imgSrc;
83
+ const hasImage = Boolean(imgSrc);
102
84
  const imgAlt = imageAlt || `${title || "Card"} image`;
103
85
  const ImageRenderer = ImageComponent || FallbackImage;
104
- const isNextImage = typeof ImageRenderer !== "string";
105
86
  const cardClassName = useMemo(
106
87
  () => combineClassNames(
107
88
  classMap.card,
@@ -147,14 +128,13 @@ const CardBase = ({
147
128
  "data-testid": `${testId}-skeleton`
148
129
  }
149
130
  ) : /* @__PURE__ */ jsxs("div", { className: classMap.content, children: [
150
- hasImage && (imageFill ? /* @__PURE__ */ jsx("div", { className: classMap.media, children: /* @__PURE__ */ jsx(
131
+ hasImage && imgSrc && (imageFill ? /* @__PURE__ */ jsx("div", { className: classMap.media, children: /* @__PURE__ */ jsx(
151
132
  ImageRenderer,
152
133
  {
153
134
  src: imgSrc,
154
135
  alt: imgAlt,
155
136
  className: combineClassNames(classMap.image, imageClassName),
156
- ...isNextImage ? { fill: true } : {},
157
- ...!isNextImage ? { loading: "lazy" } : {}
137
+ fill: true
158
138
  }
159
139
  ) }) : /* @__PURE__ */ jsx(
160
140
  ImageRenderer,
@@ -163,8 +143,7 @@ const CardBase = ({
163
143
  alt: imgAlt,
164
144
  className: combineClassNames(classMap.image, imageClassName),
165
145
  width: resolvedWidth ?? 640,
166
- height: resolvedHeight ?? 360,
167
- ...!isNextImage ? { loading: "lazy" } : {}
146
+ height: resolvedHeight ?? 360
168
147
  }
169
148
  )),
170
149
  /* @__PURE__ */ jsxs("div", { children: [
@@ -309,4 +288,4 @@ Card.displayName = "Card";
309
288
  export {
310
289
  Card as C
311
290
  };
312
- //# sourceMappingURL=Card-BzpcEKgi.js.map
291
+ //# sourceMappingURL=Card-BjLC4t0w.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Card-BjLC4t0w.js","sources":["../../src/components/Card/CardBase.tsx","../../src/components/Card/core/Card.tsx"],"sourcesContent":["import React, { useId, useMemo } from \"react\";\r\nimport { CardBaseProps, CardImageSource, StaticCardImage } 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\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 imageHeight,\r\n imageWidth,\r\n imageFill,\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 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 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 function isStaticCardImage(value: unknown): value is StaticCardImage {\r\n return (\r\n typeof value === \"object\" &&\r\n value !== null &&\r\n \"src\" in value &&\r\n typeof (value as { src: unknown }).src === \"string\"\r\n );\r\n }\r\n\r\n function normalizeImageSource(\r\n srcInput: CardImageSource | undefined,\r\n fallbackWidth?: number,\r\n fallbackHeight?: number\r\n ): { src?: string; width?: number; height?: number } {\r\n if (!srcInput) {\r\n return { src: undefined, width: fallbackWidth, height: fallbackHeight };\r\n }\r\n\r\n if (typeof srcInput === \"string\") {\r\n const trimmed = srcInput.trim();\r\n if (!trimmed) {\r\n return { src: undefined, width: fallbackWidth, height: fallbackHeight };\r\n }\r\n return { src: trimmed, width: fallbackWidth, height: fallbackHeight };\r\n }\r\n\r\n if (isStaticCardImage(srcInput)) {\r\n const trimmed = srcInput.src.trim();\r\n if (!trimmed) {\r\n return { src: undefined, width: fallbackWidth, height: fallbackHeight };\r\n }\r\n\r\n return {\r\n src: trimmed,\r\n width: srcInput.width ?? fallbackWidth,\r\n height: srcInput.height ?? fallbackHeight,\r\n };\r\n }\r\n\r\n return { src: undefined, width: fallbackWidth, height: fallbackHeight };\r\n }\r\n\r\n const {\r\n src: imgSrc,\r\n width: resolvedWidth,\r\n height: resolvedHeight,\r\n } = normalizeImageSource(imageUrl, imageWidth, imageHeight);\r\n\r\n const hasImage = Boolean(imgSrc);\r\n\r\n const imgAlt = imageAlt || `${title || \"Card\"} image`;\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 [\r\n classMap,\r\n layout,\r\n align,\r\n theme,\r\n state,\r\n size,\r\n shadow,\r\n rounding,\r\n outline,\r\n loading,\r\n className,\r\n ]\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 aria-busy={loading || undefined}\r\n >\r\n {loading ? (\r\n <SkeletonComponent\r\n width=\"250px\"\r\n height=\"250px\"\r\n data-testid={`${testId}-skeleton`}\r\n />\r\n ) : (\r\n <div className={classMap.content}>\r\n {hasImage &&\r\n imgSrc &&\r\n (imageFill ? (\r\n <div className={classMap.media}>\r\n <ImageRenderer\r\n src={imgSrc}\r\n alt={imgAlt}\r\n className={combineClassNames(classMap.image, imageClassName)}\r\n fill\r\n />\r\n </div>\r\n ) : (\r\n <ImageRenderer\r\n src={imgSrc}\r\n alt={imgAlt}\r\n className={combineClassNames(classMap.image, imageClassName)}\r\n width={resolvedWidth ?? 640}\r\n height={resolvedHeight ?? 360}\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={`${testId}-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 ariaLabel={button.ariaLabel}\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 ariaLabel={button.ariaLabel}\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\nCardBase.displayName = \"CardBase\";\r\n\r\nexport default CardBase;\r\n","import React from \"react\";\r\nimport CardBase from \"../CardBase\";\r\nimport \"./Card.scss\";\r\nimport { Button, IconButton, Skeleton } from \"../../../index.core\";\r\nimport { CardProps } from \"../Card.types\";\r\n\r\nconst classes = {\r\n card: \"card\",\r\n\r\n left: \"card_left\",\r\n right: \"card_right\",\r\n center: \"card_center\",\r\n\r\n primary: \"card_primary\",\r\n secondary: \"card_secondary\",\r\n tertiary: \"card_tertiary\",\r\n quaternary: \"card_quaternary\",\r\n\r\n success: \"card_success\",\r\n warning: \"card_warning\",\r\n error: \"card_error\",\r\n\r\n clear: \"card_clear\",\r\n\r\n outline: \"card_outline\",\r\n loading: \"card_loading\",\r\n\r\n content: \"card_content\",\r\n\r\n xs: \"card_xs\",\r\n small: \"card_small\",\r\n medium: \"card_medium\",\r\n large: \"card_large\",\r\n xl: \"card_xl\",\r\n\r\n shadowNone: \"card_shadow-None\",\r\n shadowLight: \"card_shadow-Light\",\r\n shadowMedium: \"card_shadow-Medium\",\r\n shadowStrong: \"card_shadow-Strong\",\r\n shadowIntense: \"card_shadow-Intense\",\r\n\r\n roundNone: \"card_round-None\",\r\n roundSmall: \"card_round-Small\",\r\n roundMedium: \"card_round-Medium\",\r\n roundLarge: \"card_round-Large\",\r\n\r\n vertical: \"card_vertical\",\r\n horizontal: \"card_horizontal\",\r\n\r\n image: \"card_image\",\r\n header: \"card_header\",\r\n title: \"card_title\",\r\n icon: \"card_icon\",\r\n body: \"card_body\",\r\n description: \"card_description\",\r\n children: \"card_children\",\r\n footer: \"card_footer\",\r\n actions: \"card_actions\",\r\n action_button: \"card_action_button\",\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={classes}\r\n SkeletonComponent={Skeleton}\r\n />\r\n );\r\n};\r\nCard.displayName = \"Card\";\r\nexport default Card;\r\n"],"names":["Skeleton"],"mappings":"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"}
@@ -48,61 +48,42 @@ const CardBase = ({
48
48
  const headerId = ariaLabelledBy || `${autoId}-header`;
49
49
  const descriptionId = `${autoId}-description`;
50
50
  const derivedAriaLabel = ariaLabel || title || description || "Content card";
51
- function normalizeImageSource(imageUrl2, fallbackWidth, fallbackHeight) {
52
- if (!imageUrl2) {
53
- return {
54
- src: void 0,
55
- width: fallbackWidth,
56
- height: fallbackHeight
57
- };
51
+ const FallbackImage = (props) => /* @__PURE__ */ jsxRuntime.jsx("img", { ...props });
52
+ function isStaticCardImage(value) {
53
+ return typeof value === "object" && value !== null && "src" in value && typeof value.src === "string";
54
+ }
55
+ function normalizeImageSource(srcInput, fallbackWidth, fallbackHeight) {
56
+ if (!srcInput) {
57
+ return { src: void 0, width: fallbackWidth, height: fallbackHeight };
58
58
  }
59
- if (typeof imageUrl2 === "object" && "src" in imageUrl2 && typeof imageUrl2.src === "string") {
60
- const { src, width, height } = imageUrl2;
61
- const trimmed = src.trim();
59
+ if (typeof srcInput === "string") {
60
+ const trimmed = srcInput.trim();
62
61
  if (!trimmed) {
63
- return {
64
- src: void 0,
65
- width: fallbackWidth,
66
- height: fallbackHeight
67
- };
62
+ return { src: void 0, width: fallbackWidth, height: fallbackHeight };
68
63
  }
69
- return {
70
- src: trimmed,
71
- width: typeof width === "number" ? width : fallbackWidth,
72
- height: typeof height === "number" ? height : fallbackHeight
73
- };
64
+ return { src: trimmed, width: fallbackWidth, height: fallbackHeight };
74
65
  }
75
- if (typeof imageUrl2 === "string") {
76
- const trimmed = imageUrl2.trim();
66
+ if (isStaticCardImage(srcInput)) {
67
+ const trimmed = srcInput.src.trim();
77
68
  if (!trimmed) {
78
- return {
79
- src: void 0,
80
- width: fallbackWidth,
81
- height: fallbackHeight
82
- };
69
+ return { src: void 0, width: fallbackWidth, height: fallbackHeight };
83
70
  }
84
71
  return {
85
72
  src: trimmed,
86
- width: fallbackWidth,
87
- height: fallbackHeight
73
+ width: srcInput.width ?? fallbackWidth,
74
+ height: srcInput.height ?? fallbackHeight
88
75
  };
89
76
  }
90
- return {
91
- src: void 0,
92
- width: fallbackWidth,
93
- height: fallbackHeight
94
- };
77
+ return { src: void 0, width: fallbackWidth, height: fallbackHeight };
95
78
  }
96
- const FallbackImage = (props) => /* @__PURE__ */ jsxRuntime.jsx("img", { ...props });
97
79
  const {
98
80
  src: imgSrc,
99
81
  width: resolvedWidth,
100
82
  height: resolvedHeight
101
83
  } = normalizeImageSource(imageUrl, imageWidth, imageHeight);
102
- const hasImage = !!imgSrc;
84
+ const hasImage = Boolean(imgSrc);
103
85
  const imgAlt = imageAlt || `${title || "Card"} image`;
104
86
  const ImageRenderer = ImageComponent || FallbackImage;
105
- const isNextImage = typeof ImageRenderer !== "string";
106
87
  const cardClassName = React.useMemo(
107
88
  () => classNames.combineClassNames(
108
89
  classMap.card,
@@ -148,14 +129,13 @@ const CardBase = ({
148
129
  "data-testid": `${testId}-skeleton`
149
130
  }
150
131
  ) : /* @__PURE__ */ jsxRuntime.jsxs("div", { className: classMap.content, children: [
151
- hasImage && (imageFill ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: classMap.media, children: /* @__PURE__ */ jsxRuntime.jsx(
132
+ hasImage && imgSrc && (imageFill ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: classMap.media, children: /* @__PURE__ */ jsxRuntime.jsx(
152
133
  ImageRenderer,
153
134
  {
154
135
  src: imgSrc,
155
136
  alt: imgAlt,
156
137
  className: classNames.combineClassNames(classMap.image, imageClassName),
157
- ...isNextImage ? { fill: true } : {},
158
- ...!isNextImage ? { loading: "lazy" } : {}
138
+ fill: true
159
139
  }
160
140
  ) }) : /* @__PURE__ */ jsxRuntime.jsx(
161
141
  ImageRenderer,
@@ -164,8 +144,7 @@ const CardBase = ({
164
144
  alt: imgAlt,
165
145
  className: classNames.combineClassNames(classMap.image, imageClassName),
166
146
  width: resolvedWidth ?? 640,
167
- height: resolvedHeight ?? 360,
168
- ...!isNextImage ? { loading: "lazy" } : {}
147
+ height: resolvedHeight ?? 360
169
148
  }
170
149
  )),
171
150
  /* @__PURE__ */ jsxRuntime.jsxs("div", { children: [
@@ -308,4 +287,4 @@ const Card = (props) => {
308
287
  };
309
288
  Card.displayName = "Card";
310
289
  exports.Card = Card;
311
- //# sourceMappingURL=Card-D6SI33n_.cjs.map
290
+ //# sourceMappingURL=Card-DRM65kM-.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Card-DRM65kM-.cjs","sources":["../../src/components/Card/CardBase.tsx","../../src/components/Card/core/Card.tsx"],"sourcesContent":["import React, { useId, useMemo } from \"react\";\r\nimport { CardBaseProps, CardImageSource, StaticCardImage } 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\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 imageHeight,\r\n imageWidth,\r\n imageFill,\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 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 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 function isStaticCardImage(value: unknown): value is StaticCardImage {\r\n return (\r\n typeof value === \"object\" &&\r\n value !== null &&\r\n \"src\" in value &&\r\n typeof (value as { src: unknown }).src === \"string\"\r\n );\r\n }\r\n\r\n function normalizeImageSource(\r\n srcInput: CardImageSource | undefined,\r\n fallbackWidth?: number,\r\n fallbackHeight?: number\r\n ): { src?: string; width?: number; height?: number } {\r\n if (!srcInput) {\r\n return { src: undefined, width: fallbackWidth, height: fallbackHeight };\r\n }\r\n\r\n if (typeof srcInput === \"string\") {\r\n const trimmed = srcInput.trim();\r\n if (!trimmed) {\r\n return { src: undefined, width: fallbackWidth, height: fallbackHeight };\r\n }\r\n return { src: trimmed, width: fallbackWidth, height: fallbackHeight };\r\n }\r\n\r\n if (isStaticCardImage(srcInput)) {\r\n const trimmed = srcInput.src.trim();\r\n if (!trimmed) {\r\n return { src: undefined, width: fallbackWidth, height: fallbackHeight };\r\n }\r\n\r\n return {\r\n src: trimmed,\r\n width: srcInput.width ?? fallbackWidth,\r\n height: srcInput.height ?? fallbackHeight,\r\n };\r\n }\r\n\r\n return { src: undefined, width: fallbackWidth, height: fallbackHeight };\r\n }\r\n\r\n const {\r\n src: imgSrc,\r\n width: resolvedWidth,\r\n height: resolvedHeight,\r\n } = normalizeImageSource(imageUrl, imageWidth, imageHeight);\r\n\r\n const hasImage = Boolean(imgSrc);\r\n\r\n const imgAlt = imageAlt || `${title || \"Card\"} image`;\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 [\r\n classMap,\r\n layout,\r\n align,\r\n theme,\r\n state,\r\n size,\r\n shadow,\r\n rounding,\r\n outline,\r\n loading,\r\n className,\r\n ]\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 aria-busy={loading || undefined}\r\n >\r\n {loading ? (\r\n <SkeletonComponent\r\n width=\"250px\"\r\n height=\"250px\"\r\n data-testid={`${testId}-skeleton`}\r\n />\r\n ) : (\r\n <div className={classMap.content}>\r\n {hasImage &&\r\n imgSrc &&\r\n (imageFill ? (\r\n <div className={classMap.media}>\r\n <ImageRenderer\r\n src={imgSrc}\r\n alt={imgAlt}\r\n className={combineClassNames(classMap.image, imageClassName)}\r\n fill\r\n />\r\n </div>\r\n ) : (\r\n <ImageRenderer\r\n src={imgSrc}\r\n alt={imgAlt}\r\n className={combineClassNames(classMap.image, imageClassName)}\r\n width={resolvedWidth ?? 640}\r\n height={resolvedHeight ?? 360}\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={`${testId}-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 ariaLabel={button.ariaLabel}\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 ariaLabel={button.ariaLabel}\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\nCardBase.displayName = \"CardBase\";\r\n\r\nexport default CardBase;\r\n","import React from \"react\";\r\nimport CardBase from \"../CardBase\";\r\nimport \"./Card.scss\";\r\nimport { Button, IconButton, Skeleton } from \"../../../index.core\";\r\nimport { CardProps } from \"../Card.types\";\r\n\r\nconst classes = {\r\n card: \"card\",\r\n\r\n left: \"card_left\",\r\n right: \"card_right\",\r\n center: \"card_center\",\r\n\r\n primary: \"card_primary\",\r\n secondary: \"card_secondary\",\r\n tertiary: \"card_tertiary\",\r\n quaternary: \"card_quaternary\",\r\n\r\n success: \"card_success\",\r\n warning: \"card_warning\",\r\n error: \"card_error\",\r\n\r\n clear: \"card_clear\",\r\n\r\n outline: \"card_outline\",\r\n loading: \"card_loading\",\r\n\r\n content: \"card_content\",\r\n\r\n xs: \"card_xs\",\r\n small: \"card_small\",\r\n medium: \"card_medium\",\r\n large: \"card_large\",\r\n xl: \"card_xl\",\r\n\r\n shadowNone: \"card_shadow-None\",\r\n shadowLight: \"card_shadow-Light\",\r\n shadowMedium: \"card_shadow-Medium\",\r\n shadowStrong: \"card_shadow-Strong\",\r\n shadowIntense: \"card_shadow-Intense\",\r\n\r\n roundNone: \"card_round-None\",\r\n roundSmall: \"card_round-Small\",\r\n roundMedium: \"card_round-Medium\",\r\n roundLarge: \"card_round-Large\",\r\n\r\n vertical: \"card_vertical\",\r\n horizontal: \"card_horizontal\",\r\n\r\n image: \"card_image\",\r\n header: \"card_header\",\r\n title: \"card_title\",\r\n icon: \"card_icon\",\r\n body: \"card_body\",\r\n description: \"card_description\",\r\n children: \"card_children\",\r\n footer: \"card_footer\",\r\n actions: \"card_actions\",\r\n action_button: \"card_action_button\",\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={classes}\r\n SkeletonComponent={Skeleton}\r\n />\r\n );\r\n};\r\nCard.displayName = \"Card\";\r\nexport default Card;\r\n"],"names":["getDefaultTheme","getDefaultRounding","getDefaultShadow","getDefaultSize","useId","jsx","useMemo","combineClassNames","capitalize","jsxs","Fragment","Button","IconButton","Skeleton"],"mappings":"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"}
@@ -1,4 +1,4 @@
1
1
  "use strict";
2
- const Card = require("./Card-D6SI33n_.cjs");
2
+ const Card = require("./Card-DRM65kM-.cjs");
3
3
  module.exports = Card.Card;
4
4
  //# sourceMappingURL=Card.cjs.js.map
package/dist/core/Card.js CHANGED
@@ -1,4 +1,4 @@
1
- import { C } from "./Card-BzpcEKgi.js";
1
+ import { C } from "./Card-BjLC4t0w.js";
2
2
  export {
3
3
  C as default
4
4
  };
@@ -53,7 +53,7 @@ const EmptyState = require("./EmptyState-P-MSItCX.cjs");
53
53
  const CommandPalette = require("./CommandPalette-CPhVbQAc.cjs");
54
54
  const NotificationCenter = require("./NotificationCenter-DfOOEt9N.cjs");
55
55
  const Sidebar = require("./Sidebar-13bKMpw7.cjs");
56
- const Card = require("./Card-D6SI33n_.cjs");
56
+ const Card = require("./Card-DRM65kM-.cjs");
57
57
  const Avatar = require("./Avatar-DOg8W9yf.cjs");
58
58
  const ChipGroupBase = React.forwardRef(
59
59
  ({
@@ -52,7 +52,7 @@ import { E } from "./EmptyState-Cp3ocTQX.js";
52
52
  import { C as C4 } from "./CommandPalette-Df69KRv4.js";
53
53
  import { N as N2 } from "./NotificationCenter-DLCzWNve.js";
54
54
  import { S as S7 } from "./Sidebar-DN_J0CwY.js";
55
- import { C as C5 } from "./Card-BzpcEKgi.js";
55
+ import { C as C5 } from "./Card-BjLC4t0w.js";
56
56
  import { A as A2 } from "./Avatar-BM8AwOB6.js";
57
57
  const ChipGroupBase = forwardRef(
58
58
  ({
@@ -164,61 +164,42 @@ const CardBase = ({
164
164
  const headerId = ariaLabelledBy || `${autoId}-header`;
165
165
  const descriptionId = `${autoId}-description`;
166
166
  const derivedAriaLabel = ariaLabel || title2 || description2 || "Content card";
167
- function normalizeImageSource(imageUrl2, fallbackWidth, fallbackHeight) {
168
- if (!imageUrl2) {
169
- return {
170
- src: void 0,
171
- width: fallbackWidth,
172
- height: fallbackHeight
173
- };
167
+ const FallbackImage = (props) => /* @__PURE__ */ require$$2.jsx("img", { ...props });
168
+ function isStaticCardImage(value) {
169
+ return typeof value === "object" && value !== null && "src" in value && typeof value.src === "string";
170
+ }
171
+ function normalizeImageSource(srcInput, fallbackWidth, fallbackHeight) {
172
+ if (!srcInput) {
173
+ return { src: void 0, width: fallbackWidth, height: fallbackHeight };
174
174
  }
175
- if (typeof imageUrl2 === "object" && "src" in imageUrl2 && typeof imageUrl2.src === "string") {
176
- const { src, width, height } = imageUrl2;
177
- const trimmed = src.trim();
175
+ if (typeof srcInput === "string") {
176
+ const trimmed = srcInput.trim();
178
177
  if (!trimmed) {
179
- return {
180
- src: void 0,
181
- width: fallbackWidth,
182
- height: fallbackHeight
183
- };
178
+ return { src: void 0, width: fallbackWidth, height: fallbackHeight };
184
179
  }
185
- return {
186
- src: trimmed,
187
- width: typeof width === "number" ? width : fallbackWidth,
188
- height: typeof height === "number" ? height : fallbackHeight
189
- };
180
+ return { src: trimmed, width: fallbackWidth, height: fallbackHeight };
190
181
  }
191
- if (typeof imageUrl2 === "string") {
192
- const trimmed = imageUrl2.trim();
182
+ if (isStaticCardImage(srcInput)) {
183
+ const trimmed = srcInput.src.trim();
193
184
  if (!trimmed) {
194
- return {
195
- src: void 0,
196
- width: fallbackWidth,
197
- height: fallbackHeight
198
- };
185
+ return { src: void 0, width: fallbackWidth, height: fallbackHeight };
199
186
  }
200
187
  return {
201
188
  src: trimmed,
202
- width: fallbackWidth,
203
- height: fallbackHeight
189
+ width: srcInput.width ?? fallbackWidth,
190
+ height: srcInput.height ?? fallbackHeight
204
191
  };
205
192
  }
206
- return {
207
- src: void 0,
208
- width: fallbackWidth,
209
- height: fallbackHeight
210
- };
193
+ return { src: void 0, width: fallbackWidth, height: fallbackHeight };
211
194
  }
212
- const FallbackImage = (props) => /* @__PURE__ */ require$$2.jsx("img", { ...props });
213
195
  const {
214
196
  src: imgSrc,
215
197
  width: resolvedWidth,
216
198
  height: resolvedHeight
217
199
  } = normalizeImageSource(imageUrl, imageWidth, imageHeight);
218
- const hasImage = !!imgSrc;
200
+ const hasImage = Boolean(imgSrc);
219
201
  const imgAlt = imageAlt || `${title2 || "Card"} image`;
220
202
  const ImageRenderer = ImageComponent || FallbackImage;
221
- const isNextImage = typeof ImageRenderer !== "string";
222
203
  const cardClassName = React.useMemo(
223
204
  () => classNames.combineClassNames(
224
205
  classMap.card,
@@ -264,14 +245,13 @@ const CardBase = ({
264
245
  "data-testid": `${testId}-skeleton`
265
246
  }
266
247
  ) : /* @__PURE__ */ require$$2.jsxs("div", { className: classMap.content, children: [
267
- hasImage && (imageFill ? /* @__PURE__ */ require$$2.jsx("div", { className: classMap.media, children: /* @__PURE__ */ require$$2.jsx(
248
+ hasImage && imgSrc && (imageFill ? /* @__PURE__ */ require$$2.jsx("div", { className: classMap.media, children: /* @__PURE__ */ require$$2.jsx(
268
249
  ImageRenderer,
269
250
  {
270
251
  src: imgSrc,
271
252
  alt: imgAlt,
272
253
  className: classNames.combineClassNames(classMap.image, imageClassName),
273
- ...isNextImage ? { fill: true } : {},
274
- ...!isNextImage ? { loading: "lazy" } : {}
254
+ fill: true
275
255
  }
276
256
  ) }) : /* @__PURE__ */ require$$2.jsx(
277
257
  ImageRenderer,
@@ -280,8 +260,7 @@ const CardBase = ({
280
260
  alt: imgAlt,
281
261
  className: classNames.combineClassNames(classMap.image, imageClassName),
282
262
  width: resolvedWidth ?? 640,
283
- height: resolvedHeight ?? 360,
284
- ...!isNextImage ? { loading: "lazy" } : {}
263
+ height: resolvedHeight ?? 360
285
264
  }
286
265
  )),
287
266
  /* @__PURE__ */ require$$2.jsxs("div", { children: [
@@ -413,4 +392,4 @@ const Card = (props) => {
413
392
  };
414
393
  Card.displayName = "Card";
415
394
  exports.Card = Card;
416
- //# sourceMappingURL=Card-CHnEexOi.cjs.map
395
+ //# sourceMappingURL=Card-C0SorjuI.cjs.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"Card-C0SorjuI.cjs","sources":["../../src/components/Card/CardBase.tsx","../../src/components/Card/next/Card.tsx"],"sourcesContent":["import React, { useId, useMemo } from \"react\";\r\nimport { CardBaseProps, CardImageSource, StaticCardImage } 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\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 imageHeight,\r\n imageWidth,\r\n imageFill,\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 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 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 function isStaticCardImage(value: unknown): value is StaticCardImage {\r\n return (\r\n typeof value === \"object\" &&\r\n value !== null &&\r\n \"src\" in value &&\r\n typeof (value as { src: unknown }).src === \"string\"\r\n );\r\n }\r\n\r\n function normalizeImageSource(\r\n srcInput: CardImageSource | undefined,\r\n fallbackWidth?: number,\r\n fallbackHeight?: number\r\n ): { src?: string; width?: number; height?: number } {\r\n if (!srcInput) {\r\n return { src: undefined, width: fallbackWidth, height: fallbackHeight };\r\n }\r\n\r\n if (typeof srcInput === \"string\") {\r\n const trimmed = srcInput.trim();\r\n if (!trimmed) {\r\n return { src: undefined, width: fallbackWidth, height: fallbackHeight };\r\n }\r\n return { src: trimmed, width: fallbackWidth, height: fallbackHeight };\r\n }\r\n\r\n if (isStaticCardImage(srcInput)) {\r\n const trimmed = srcInput.src.trim();\r\n if (!trimmed) {\r\n return { src: undefined, width: fallbackWidth, height: fallbackHeight };\r\n }\r\n\r\n return {\r\n src: trimmed,\r\n width: srcInput.width ?? fallbackWidth,\r\n height: srcInput.height ?? fallbackHeight,\r\n };\r\n }\r\n\r\n return { src: undefined, width: fallbackWidth, height: fallbackHeight };\r\n }\r\n\r\n const {\r\n src: imgSrc,\r\n width: resolvedWidth,\r\n height: resolvedHeight,\r\n } = normalizeImageSource(imageUrl, imageWidth, imageHeight);\r\n\r\n const hasImage = Boolean(imgSrc);\r\n\r\n const imgAlt = imageAlt || `${title || \"Card\"} image`;\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 [\r\n classMap,\r\n layout,\r\n align,\r\n theme,\r\n state,\r\n size,\r\n shadow,\r\n rounding,\r\n outline,\r\n loading,\r\n className,\r\n ]\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 aria-busy={loading || undefined}\r\n >\r\n {loading ? (\r\n <SkeletonComponent\r\n width=\"250px\"\r\n height=\"250px\"\r\n data-testid={`${testId}-skeleton`}\r\n />\r\n ) : (\r\n <div className={classMap.content}>\r\n {hasImage &&\r\n imgSrc &&\r\n (imageFill ? (\r\n <div className={classMap.media}>\r\n <ImageRenderer\r\n src={imgSrc}\r\n alt={imgAlt}\r\n className={combineClassNames(classMap.image, imageClassName)}\r\n fill\r\n />\r\n </div>\r\n ) : (\r\n <ImageRenderer\r\n src={imgSrc}\r\n alt={imgAlt}\r\n className={combineClassNames(classMap.image, imageClassName)}\r\n width={resolvedWidth ?? 640}\r\n height={resolvedHeight ?? 360}\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={`${testId}-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 ariaLabel={button.ariaLabel}\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 ariaLabel={button.ariaLabel}\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\nCardBase.displayName = \"CardBase\";\r\n\r\nexport default CardBase;\r\n","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport Image, { StaticImageData } 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 { CardImageComponentProps, CardProps } from \"../Card.types\";\r\n\r\nconst NextImageWrapper: React.FC<CardImageComponentProps> = ({\r\n src,\r\n alt,\r\n className,\r\n width,\r\n height,\r\n fill,\r\n}) => {\r\n if (typeof src === \"string\" && src.toLowerCase().endsWith(\".svg\")) {\r\n return (\r\n <img\r\n src={src}\r\n alt={alt}\r\n className={className}\r\n width={width}\r\n height={height}\r\n loading=\"lazy\"\r\n />\r\n );\r\n }\r\n\r\n return (\r\n <Image\r\n src={src as StaticImageData | string}\r\n alt={alt}\r\n className={className}\r\n {...(fill\r\n ? { fill, sizes: \"100vw\" }\r\n : { width: width ?? 640, height: height ?? 360 })}\r\n />\r\n );\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\nCard.displayName = \"Card\";\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":"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"}
@@ -163,61 +163,42 @@ const CardBase = ({
163
163
  const headerId = ariaLabelledBy || `${autoId}-header`;
164
164
  const descriptionId = `${autoId}-description`;
165
165
  const derivedAriaLabel = ariaLabel || title2 || description2 || "Content card";
166
- function normalizeImageSource(imageUrl2, fallbackWidth, fallbackHeight) {
167
- if (!imageUrl2) {
168
- return {
169
- src: void 0,
170
- width: fallbackWidth,
171
- height: fallbackHeight
172
- };
166
+ const FallbackImage = (props) => /* @__PURE__ */ jsx("img", { ...props });
167
+ function isStaticCardImage(value) {
168
+ return typeof value === "object" && value !== null && "src" in value && typeof value.src === "string";
169
+ }
170
+ function normalizeImageSource(srcInput, fallbackWidth, fallbackHeight) {
171
+ if (!srcInput) {
172
+ return { src: void 0, width: fallbackWidth, height: fallbackHeight };
173
173
  }
174
- if (typeof imageUrl2 === "object" && "src" in imageUrl2 && typeof imageUrl2.src === "string") {
175
- const { src, width, height } = imageUrl2;
176
- const trimmed = src.trim();
174
+ if (typeof srcInput === "string") {
175
+ const trimmed = srcInput.trim();
177
176
  if (!trimmed) {
178
- return {
179
- src: void 0,
180
- width: fallbackWidth,
181
- height: fallbackHeight
182
- };
177
+ return { src: void 0, width: fallbackWidth, height: fallbackHeight };
183
178
  }
184
- return {
185
- src: trimmed,
186
- width: typeof width === "number" ? width : fallbackWidth,
187
- height: typeof height === "number" ? height : fallbackHeight
188
- };
179
+ return { src: trimmed, width: fallbackWidth, height: fallbackHeight };
189
180
  }
190
- if (typeof imageUrl2 === "string") {
191
- const trimmed = imageUrl2.trim();
181
+ if (isStaticCardImage(srcInput)) {
182
+ const trimmed = srcInput.src.trim();
192
183
  if (!trimmed) {
193
- return {
194
- src: void 0,
195
- width: fallbackWidth,
196
- height: fallbackHeight
197
- };
184
+ return { src: void 0, width: fallbackWidth, height: fallbackHeight };
198
185
  }
199
186
  return {
200
187
  src: trimmed,
201
- width: fallbackWidth,
202
- height: fallbackHeight
188
+ width: srcInput.width ?? fallbackWidth,
189
+ height: srcInput.height ?? fallbackHeight
203
190
  };
204
191
  }
205
- return {
206
- src: void 0,
207
- width: fallbackWidth,
208
- height: fallbackHeight
209
- };
192
+ return { src: void 0, width: fallbackWidth, height: fallbackHeight };
210
193
  }
211
- const FallbackImage = (props) => /* @__PURE__ */ jsx("img", { ...props });
212
194
  const {
213
195
  src: imgSrc,
214
196
  width: resolvedWidth,
215
197
  height: resolvedHeight
216
198
  } = normalizeImageSource(imageUrl, imageWidth, imageHeight);
217
- const hasImage = !!imgSrc;
199
+ const hasImage = Boolean(imgSrc);
218
200
  const imgAlt = imageAlt || `${title2 || "Card"} image`;
219
201
  const ImageRenderer = ImageComponent || FallbackImage;
220
- const isNextImage = typeof ImageRenderer !== "string";
221
202
  const cardClassName = useMemo(
222
203
  () => combineClassNames(
223
204
  classMap.card,
@@ -263,14 +244,13 @@ const CardBase = ({
263
244
  "data-testid": `${testId}-skeleton`
264
245
  }
265
246
  ) : /* @__PURE__ */ jsxs("div", { className: classMap.content, children: [
266
- hasImage && (imageFill ? /* @__PURE__ */ jsx("div", { className: classMap.media, children: /* @__PURE__ */ jsx(
247
+ hasImage && imgSrc && (imageFill ? /* @__PURE__ */ jsx("div", { className: classMap.media, children: /* @__PURE__ */ jsx(
267
248
  ImageRenderer,
268
249
  {
269
250
  src: imgSrc,
270
251
  alt: imgAlt,
271
252
  className: combineClassNames(classMap.image, imageClassName),
272
- ...isNextImage ? { fill: true } : {},
273
- ...!isNextImage ? { loading: "lazy" } : {}
253
+ fill: true
274
254
  }
275
255
  ) }) : /* @__PURE__ */ jsx(
276
256
  ImageRenderer,
@@ -279,8 +259,7 @@ const CardBase = ({
279
259
  alt: imgAlt,
280
260
  className: combineClassNames(classMap.image, imageClassName),
281
261
  width: resolvedWidth ?? 640,
282
- height: resolvedHeight ?? 360,
283
- ...!isNextImage ? { loading: "lazy" } : {}
262
+ height: resolvedHeight ?? 360
284
263
  }
285
264
  )),
286
265
  /* @__PURE__ */ jsxs("div", { children: [
@@ -414,4 +393,4 @@ Card.displayName = "Card";
414
393
  export {
415
394
  Card as C
416
395
  };
417
- //# sourceMappingURL=Card-CFPo7HrH.js.map
396
+ //# sourceMappingURL=Card-Da7D02Sj.js.map