boreal-ui 0.0.24 → 0.0.25
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.
- package/dist/core/{Card-DCxLBwi0.cjs → Card-B8vnbUG9.cjs} +23 -7
- package/dist/core/Card-B8vnbUG9.cjs.map +1 -0
- package/dist/core/{Card-DKPk0zgQ.js → Card-CaCboEwS.js} +23 -7
- package/dist/core/Card-CaCboEwS.js.map +1 -0
- package/dist/core/Card.cjs.js +1 -1
- package/dist/core/Card.js +1 -1
- package/dist/core/{Footer-CJOKuXJh.js → Footer-Bi3OLtAi.js} +4 -9
- package/dist/core/Footer-Bi3OLtAi.js.map +1 -0
- package/dist/core/{Footer-BKfoTV0l.cjs → Footer-CgPo0kjA.cjs} +4 -9
- package/dist/core/Footer-CgPo0kjA.cjs.map +1 -0
- package/dist/core/Footer.cjs.js +1 -1
- package/dist/core/Footer.js +1 -1
- package/dist/core/index.cjs.js +2 -2
- package/dist/core/index.js +2 -2
- package/dist/core/style.css +8 -1
- package/dist/next/{Card-B7oD0UlA.cjs → Card-Bk3Kx1sY.cjs} +82 -64
- package/dist/next/Card-Bk3Kx1sY.cjs.map +1 -0
- package/dist/next/{Card-DauNfmwZ.js → Card-CaPhq4Ut.js} +82 -64
- package/dist/next/Card-CaPhq4Ut.js.map +1 -0
- package/dist/next/Card.cjs.js +1 -1
- package/dist/next/Card.js +1 -1
- package/dist/next/{Footer-ASthmMUM.js → Footer-CWUge4tr.js} +5 -10
- package/dist/next/Footer-CWUge4tr.js.map +1 -0
- package/dist/next/{Footer-nuEg78W2.cjs → Footer-EX62svri.cjs} +5 -10
- package/dist/next/Footer-EX62svri.cjs.map +1 -0
- package/dist/next/Footer.cjs.js +1 -1
- package/dist/next/Footer.js +1 -1
- package/dist/next/index.cjs.js +2 -2
- package/dist/next/index.js +3 -3
- package/dist/next/style.css +131 -125
- package/dist/tsconfig.build.tsbuildinfo +1 -1
- package/dist/types/components/Card/Card.types.d.ts +6 -0
- package/dist/types/components/Card/Card.types.d.ts.map +1 -1
- package/dist/types/components/Card/CardBase.d.ts.map +1 -1
- package/dist/types/components/Footer/FooterBase.d.ts +2 -0
- package/dist/types/components/Footer/FooterBase.d.ts.map +1 -1
- package/dist/types/components/Footer/next/Footer.d.ts.map +1 -1
- package/package.json +1 -1
- package/dist/core/Card-DCxLBwi0.cjs.map +0 -1
- package/dist/core/Card-DKPk0zgQ.js.map +0 -1
- package/dist/core/Footer-BKfoTV0l.cjs.map +0 -1
- package/dist/core/Footer-CJOKuXJh.js.map +0 -1
- package/dist/next/Card-B7oD0UlA.cjs.map +0 -1
- package/dist/next/Card-DauNfmwZ.js.map +0 -1
- package/dist/next/Footer-ASthmMUM.js.map +0 -1
- package/dist/next/Footer-nuEg78W2.cjs.map +0 -1
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Card-Bk3Kx1sY.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 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 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 hasImageObj =\r\n typeof imageUrl === \"object\" && imageUrl && \"src\" in imageUrl;\r\n const imgSrc = hasImageObj ? imageUrl.src : (imageUrl as string | undefined);\r\n\r\n const resolvedWidth =\r\n (hasImageObj ? (imageUrl as any).width : undefined) ?? imageWidth;\r\n const resolvedHeight =\r\n (hasImageObj ? (imageUrl as any).height : undefined) ?? imageHeight;\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 [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 (imageFill ? (\r\n <div className={classMap.media}>\r\n <ImageRenderer\r\n src={imgSrc as any}\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 as any}\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=\"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":"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"}
|
|
@@ -7,56 +7,57 @@ import React, { useId, useMemo } from "react";
|
|
|
7
7
|
import { c as combineClassNames } from "./classNames-AS8QjFq7.js";
|
|
8
8
|
import { c as capitalize } from "./capitalize-C0TSQSPh.js";
|
|
9
9
|
import { a as getDefaultRounding, b as getDefaultShadow, c as getDefaultSize, d as getDefaultTheme } from "./boreal-style-config-BILmxkZG.js";
|
|
10
|
-
const noScroll = "
|
|
11
|
-
const errorMessage = "
|
|
12
|
-
const loadingContainer = "
|
|
13
|
-
const hideScrollbar = "
|
|
14
|
-
const sr_only = "
|
|
15
|
-
const card = "
|
|
16
|
-
const roundNone = "
|
|
17
|
-
const roundSmall = "
|
|
18
|
-
const roundMedium = "
|
|
19
|
-
const roundLarge = "
|
|
20
|
-
const roundFull = "
|
|
21
|
-
const shadowNone = "
|
|
22
|
-
const shadowLight = "
|
|
23
|
-
const shadowMedium = "
|
|
24
|
-
const shadowStrong = "
|
|
25
|
-
const shadowIntense = "
|
|
26
|
-
const loading = "
|
|
27
|
-
const fade_in = "
|
|
28
|
-
const
|
|
29
|
-
const
|
|
30
|
-
const
|
|
31
|
-
const
|
|
32
|
-
const
|
|
33
|
-
const
|
|
34
|
-
const
|
|
35
|
-
const
|
|
36
|
-
const
|
|
37
|
-
const
|
|
38
|
-
const
|
|
39
|
-
const
|
|
40
|
-
const
|
|
41
|
-
const
|
|
42
|
-
const
|
|
43
|
-
const
|
|
44
|
-
const
|
|
45
|
-
const
|
|
46
|
-
const
|
|
47
|
-
const
|
|
48
|
-
const
|
|
49
|
-
const
|
|
50
|
-
const
|
|
51
|
-
const
|
|
52
|
-
const
|
|
53
|
-
const
|
|
54
|
-
const
|
|
55
|
-
const
|
|
56
|
-
const
|
|
57
|
-
const
|
|
58
|
-
const
|
|
59
|
-
const
|
|
10
|
+
const noScroll = "_noScroll_1rudq_91";
|
|
11
|
+
const errorMessage = "_errorMessage_1rudq_92";
|
|
12
|
+
const loadingContainer = "_loadingContainer_1rudq_93";
|
|
13
|
+
const hideScrollbar = "_hideScrollbar_1rudq_85";
|
|
14
|
+
const sr_only = "_sr_only_1rudq_94";
|
|
15
|
+
const card = "_card_1rudq_539";
|
|
16
|
+
const roundNone = "_roundNone_1rudq_553";
|
|
17
|
+
const roundSmall = "_roundSmall_1rudq_557";
|
|
18
|
+
const roundMedium = "_roundMedium_1rudq_561";
|
|
19
|
+
const roundLarge = "_roundLarge_1rudq_565";
|
|
20
|
+
const roundFull = "_roundFull_1rudq_569";
|
|
21
|
+
const shadowNone = "_shadowNone_1rudq_573";
|
|
22
|
+
const shadowLight = "_shadowLight_1rudq_577";
|
|
23
|
+
const shadowMedium = "_shadowMedium_1rudq_581";
|
|
24
|
+
const shadowStrong = "_shadowStrong_1rudq_585";
|
|
25
|
+
const shadowIntense = "_shadowIntense_1rudq_589";
|
|
26
|
+
const loading = "_loading_1rudq_93";
|
|
27
|
+
const fade_in = "_fade_in_1rudq_604";
|
|
28
|
+
const media = "_media_1rudq_608";
|
|
29
|
+
const image = "_image_1rudq_617";
|
|
30
|
+
const vertical = "_vertical_1rudq_622";
|
|
31
|
+
const content = "_content_1rudq_625";
|
|
32
|
+
const horizontal = "_horizontal_1rudq_633";
|
|
33
|
+
const body = "_body_1rudq_656";
|
|
34
|
+
const footer = "_footer_1rudq_663";
|
|
35
|
+
const disabled = "_disabled_1rudq_667";
|
|
36
|
+
const outline = "_outline_1rudq_676";
|
|
37
|
+
const primary = "_primary_1rudq_682";
|
|
38
|
+
const icon = "_icon_1rudq_686";
|
|
39
|
+
const description = "_description_1rudq_687";
|
|
40
|
+
const secondary = "_secondary_1rudq_700";
|
|
41
|
+
const tertiary = "_tertiary_1rudq_718";
|
|
42
|
+
const quaternary = "_quaternary_1rudq_736";
|
|
43
|
+
const clear = "_clear_1rudq_754";
|
|
44
|
+
const success = "_success_1rudq_772";
|
|
45
|
+
const error = "_error_1rudq_92";
|
|
46
|
+
const warning = "_warning_1rudq_806";
|
|
47
|
+
const header = "_header_1rudq_829";
|
|
48
|
+
const title = "_title_1rudq_848";
|
|
49
|
+
const actions = "_actions_1rudq_873";
|
|
50
|
+
const xs = "_xs_1rudq_880";
|
|
51
|
+
const children = "_children_1rudq_890";
|
|
52
|
+
const small = "_small_1rudq_894";
|
|
53
|
+
const medium = "_medium_1rudq_907";
|
|
54
|
+
const large = "_large_1rudq_920";
|
|
55
|
+
const xl = "_xl_1rudq_933";
|
|
56
|
+
const left = "_left_1rudq_946";
|
|
57
|
+
const center = "_center_1rudq_958";
|
|
58
|
+
const right = "_right_1rudq_970";
|
|
59
|
+
const spin = "_spin_1rudq_1";
|
|
60
|
+
const pulse = "_pulse_1rudq_1";
|
|
60
61
|
const styles = {
|
|
61
62
|
noScroll,
|
|
62
63
|
errorMessage,
|
|
@@ -76,7 +77,8 @@ const styles = {
|
|
|
76
77
|
shadowIntense,
|
|
77
78
|
loading,
|
|
78
79
|
fade_in,
|
|
79
|
-
"fade-in": "_fade-
|
|
80
|
+
"fade-in": "_fade-in_1rudq_1",
|
|
81
|
+
media,
|
|
80
82
|
image,
|
|
81
83
|
vertical,
|
|
82
84
|
content,
|
|
@@ -107,14 +109,14 @@ const styles = {
|
|
|
107
109
|
left,
|
|
108
110
|
center,
|
|
109
111
|
right,
|
|
110
|
-
"slide-up": "_slide-
|
|
111
|
-
"spin-3d": "_spin-
|
|
112
|
+
"slide-up": "_slide-up_1rudq_1",
|
|
113
|
+
"spin-3d": "_spin-3d_1rudq_1",
|
|
112
114
|
spin,
|
|
113
115
|
pulse,
|
|
114
|
-
"fade-in-up": "_fade-in-
|
|
115
|
-
"progress-grow": "_progress-
|
|
116
|
-
"indeterminate-move": "_indeterminate-
|
|
117
|
-
"skeleton-loading": "_skeleton-
|
|
116
|
+
"fade-in-up": "_fade-in-up_1rudq_1",
|
|
117
|
+
"progress-grow": "_progress-grow_1rudq_1",
|
|
118
|
+
"indeterminate-move": "_indeterminate-move_1rudq_1",
|
|
119
|
+
"skeleton-loading": "_skeleton-loading_1rudq_1"
|
|
118
120
|
};
|
|
119
121
|
const CardBase = ({
|
|
120
122
|
theme = getDefaultTheme(),
|
|
@@ -126,6 +128,9 @@ const CardBase = ({
|
|
|
126
128
|
shadow = getDefaultShadow(),
|
|
127
129
|
imageUrl,
|
|
128
130
|
imageAlt,
|
|
131
|
+
imageHeight,
|
|
132
|
+
imageWidth,
|
|
133
|
+
imageFill,
|
|
129
134
|
className = "",
|
|
130
135
|
imageClassName = "",
|
|
131
136
|
headerClassName = "",
|
|
@@ -154,9 +159,13 @@ const CardBase = ({
|
|
|
154
159
|
const headerId = ariaLabelledBy || `${autoId}-header`;
|
|
155
160
|
const descriptionId = `${autoId}-description`;
|
|
156
161
|
const hasImage = !!imageUrl;
|
|
157
|
-
const showBlur = blur && typeof imageUrl !== "string";
|
|
158
162
|
const derivedAriaLabel = ariaLabel || title2 || description2 || "Content card";
|
|
159
163
|
const FallbackImage = (props) => /* @__PURE__ */ jsx("img", { ...props });
|
|
164
|
+
const hasImageObj = typeof imageUrl === "object" && imageUrl && "src" in imageUrl;
|
|
165
|
+
const imgSrc = hasImageObj ? imageUrl.src : imageUrl;
|
|
166
|
+
const resolvedWidth = (hasImageObj ? imageUrl.width : void 0) ?? imageWidth;
|
|
167
|
+
const resolvedHeight = (hasImageObj ? imageUrl.height : void 0) ?? imageHeight;
|
|
168
|
+
const imgAlt = imageAlt || `${title2 || "Card"} image`;
|
|
160
169
|
const ImageRenderer = ImageComponent || FallbackImage;
|
|
161
170
|
const cardClassName = useMemo(
|
|
162
171
|
() => combineClassNames(
|
|
@@ -183,15 +192,24 @@ const CardBase = ({
|
|
|
183
192
|
"aria-labelledby": title2 ? headerId : void 0,
|
|
184
193
|
"aria-label": !title2 ? derivedAriaLabel : void 0,
|
|
185
194
|
children: loading2 ? /* @__PURE__ */ jsx(SkeletonComponent, { width: "100%", height: "250px", "data-testid": "skeleton" }) : /* @__PURE__ */ jsxs("div", { className: classMap.content, children: [
|
|
186
|
-
hasImage && /* @__PURE__ */ jsx(
|
|
195
|
+
hasImage && (imageFill ? /* @__PURE__ */ jsx("div", { className: classMap.media, children: /* @__PURE__ */ jsx(
|
|
187
196
|
ImageRenderer,
|
|
188
197
|
{
|
|
189
|
-
src:
|
|
190
|
-
alt:
|
|
198
|
+
src: imgSrc,
|
|
199
|
+
alt: imgAlt,
|
|
191
200
|
className: combineClassNames(classMap.image, imageClassName),
|
|
192
|
-
|
|
201
|
+
fill: true
|
|
193
202
|
}
|
|
194
|
-
)
|
|
203
|
+
) }) : /* @__PURE__ */ jsx(
|
|
204
|
+
ImageRenderer,
|
|
205
|
+
{
|
|
206
|
+
src: imgSrc,
|
|
207
|
+
alt: imgAlt,
|
|
208
|
+
className: combineClassNames(classMap.image, imageClassName),
|
|
209
|
+
width: resolvedWidth ?? 640,
|
|
210
|
+
height: resolvedHeight ?? 360
|
|
211
|
+
}
|
|
212
|
+
)),
|
|
195
213
|
/* @__PURE__ */ jsxs("div", { children: [
|
|
196
214
|
/* @__PURE__ */ jsx(
|
|
197
215
|
"div",
|
|
@@ -292,4 +310,4 @@ const Card = (props) => {
|
|
|
292
310
|
export {
|
|
293
311
|
Card as C
|
|
294
312
|
};
|
|
295
|
-
//# sourceMappingURL=Card-
|
|
313
|
+
//# sourceMappingURL=Card-CaPhq4Ut.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Card-CaPhq4Ut.js","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 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 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 hasImageObj =\r\n typeof imageUrl === \"object\" && imageUrl && \"src\" in imageUrl;\r\n const imgSrc = hasImageObj ? imageUrl.src : (imageUrl as string | undefined);\r\n\r\n const resolvedWidth =\r\n (hasImageObj ? (imageUrl as any).width : undefined) ?? imageWidth;\r\n const resolvedHeight =\r\n (hasImageObj ? (imageUrl as any).height : undefined) ?? imageHeight;\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 [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 (imageFill ? (\r\n <div className={classMap.media}>\r\n <ImageRenderer\r\n src={imgSrc as any}\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 as any}\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=\"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":["title","description","outline","loading","children","Skeleton"],"mappings":"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"}
|
package/dist/next/Card.cjs.js
CHANGED
package/dist/next/Card.js
CHANGED
|
@@ -116,14 +116,9 @@ const FooterBase = ({
|
|
|
116
116
|
LinkWrapper,
|
|
117
117
|
{
|
|
118
118
|
href: link.href,
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
className: classMap.link,
|
|
123
|
-
"data-testid": `${testId}-link-${link.label.toLowerCase().replace(/\s+/g, "-")}`,
|
|
124
|
-
children: link.label
|
|
125
|
-
}
|
|
126
|
-
)
|
|
119
|
+
className: classMap.link,
|
|
120
|
+
"data-testid": `${testId}-link-${link.label.toLowerCase().replace(/\s+/g, "-")}`,
|
|
121
|
+
children: link.label
|
|
127
122
|
}
|
|
128
123
|
) }, i)) })
|
|
129
124
|
}
|
|
@@ -247,7 +242,7 @@ const Footer = (props) => {
|
|
|
247
242
|
IconButton,
|
|
248
243
|
ImageComponent: Image,
|
|
249
244
|
ThemeSelect: UserThemeSettings,
|
|
250
|
-
LinkWrapper: ({ href, children }) => /* @__PURE__ */ jsx(Link, { href, children }),
|
|
245
|
+
LinkWrapper: ({ href, children, className, ...rest }) => /* @__PURE__ */ jsx(Link, { href, className, ...rest, children }),
|
|
251
246
|
classMap: styles
|
|
252
247
|
}
|
|
253
248
|
);
|
|
@@ -256,4 +251,4 @@ export {
|
|
|
256
251
|
Footer as F,
|
|
257
252
|
UserThemeSettings as U
|
|
258
253
|
};
|
|
259
|
-
//# sourceMappingURL=Footer-
|
|
254
|
+
//# sourceMappingURL=Footer-CWUge4tr.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Footer-CWUge4tr.js","sources":["../../src/components/Select/ThemeSelect/next/ThemeSelect.tsx","../../src/components/Footer/FooterBase.tsx","../../src/components/Footer/next/Footer.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport React, { useContext } from \"react\";\r\nimport { getAllColorSchemes } from \"../../../../styles/colorSchemeRegistry\";\r\nimport { Select } from \"@/index.next\";\r\nimport { ThemeContext } from \"../../../../context/ThemeContext\";\r\nimport { RoundingType, ShadowType, StateType, ThemeType } from \"@/types/types\";\r\nimport {\r\n getDefaultRounding,\r\n getDefaultShadow,\r\n getDefaultTheme,\r\n} from \"@/config/boreal-style-config\";\r\n\r\ninterface ThemeSelectProps {\r\n theme?: ThemeType;\r\n shadow?: ShadowType;\r\n rounding?: RoundingType;\r\n \"data-testid\"?: string;\r\n state?: StateType;\r\n}\r\n\r\nconst UserThemeSettings: React.FC<ThemeSelectProps> = ({\r\n theme = getDefaultTheme(),\r\n shadow = getDefaultShadow(),\r\n rounding = getDefaultRounding(),\r\n state = \"\",\r\n \"data-testid\": testId = \"theme-select\",\r\n}) => {\r\n const themeContext = useContext(ThemeContext);\r\n\r\n if (!themeContext) {\r\n throw new Error(\r\n \"ThemeContext is undefined. Make sure to wrap this component with ThemeProvider.\"\r\n );\r\n }\r\n\r\n const { selectedScheme, setSelectedScheme } = themeContext;\r\n const allSchemes = getAllColorSchemes();\r\n\r\n const options = allSchemes.map((scheme, index) => ({\r\n value: index.toString(),\r\n label: scheme.name,\r\n }));\r\n\r\n return (\r\n <div className={`control-container`}>\r\n <Select\r\n theme={theme}\r\n state={state}\r\n shadow={shadow}\r\n rounding={rounding}\r\n options={options}\r\n data-testid={`${testId}-select`}\r\n value={selectedScheme.toString()}\r\n onChange={(value: string | number) =>\r\n setSelectedScheme(parseInt(value as string, 10))\r\n }\r\n ariaLabel=\"Select Theme\"\r\n />\r\n </div>\r\n );\r\n};\r\n\r\nexport default UserThemeSettings;\r\n","import React, { JSX, useMemo } from \"react\";\r\nimport { FooterProps } from \"./Footer.types\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { getDefaultTheme } from \"../../config/boreal-style-config\";\r\nimport { capitalize } from \"@/utils/capitalize\";\r\n\r\nexport interface BaseFooterProps extends FooterProps {\r\n IconButton: React.ComponentType<any>;\r\n ThemeSelect: React.ComponentType<any>;\r\n ImageComponent?: React.ElementType;\r\n classMap: Record<string, string>;\r\n LinkWrapper?: (props: {\r\n href: string;\r\n children: React.ReactNode;\r\n className?: string;\r\n [key: string]: any;\r\n }) => JSX.Element;\r\n}\r\n\r\nconst FooterBase: React.FC<BaseFooterProps> = ({\r\n theme = getDefaultTheme(),\r\n attachment = \"static\",\r\n shadow = \"none\",\r\n rounding = \"none\",\r\n className = \"\",\r\n \"data-testid\": testId = \"footer\",\r\n copyright,\r\n links = [],\r\n logo,\r\n socialLinks = [],\r\n showThemeSelect = false,\r\n IconButton,\r\n ImageComponent = \"img\",\r\n ThemeSelect,\r\n classMap,\r\n LinkWrapper = ({ href, children }) => <a href={href}>{children}</a>,\r\n}) => {\r\n const footerClass = useMemo(\r\n () =>\r\n combineClassNames(\r\n classMap.footer,\r\n classMap[theme],\r\n classMap[`shadow${capitalize(shadow)}`],\r\n classMap[`round${capitalize(rounding)}`],\r\n classMap[`attachment${capitalize(attachment)}`],\r\n className\r\n ),\r\n [classMap, theme, className]\r\n );\r\n return (\r\n <footer\r\n className={footerClass}\r\n role=\"contentinfo\"\r\n aria-label=\"Footer\"\r\n data-testid={testId}\r\n >\r\n <div className={classMap.content}>\r\n <div className={classMap.left} data-testid={`${testId}-left`}>\r\n {logo &&\r\n (typeof logo === \"string\" ||\r\n (typeof logo === \"object\" && \"src\" in logo)) ? (\r\n <ImageComponent\r\n className={classMap.logo}\r\n aria-label=\"Logo\"\r\n role=\"img\"\r\n data-testid={`${testId}-logo`}\r\n loading=\"lazy\"\r\n src={logo}\r\n alt=\"Logo\"\r\n height={20}\r\n width={20}\r\n />\r\n ) : (\r\n <span\r\n className={classMap.logo}\r\n aria-label=\"Logo\"\r\n role=\"img\"\r\n data-testid={`${testId}-logo`}\r\n >\r\n {logo}\r\n </span>\r\n )}\r\n\r\n {copyright && (\r\n <div className={classMap.left} data-testid={`${testId}-copyright`}>\r\n <p>{copyright}</p>\r\n </div>\r\n )}\r\n </div>\r\n\r\n {links.length > 0 && (\r\n <nav\r\n className={classMap.links}\r\n aria-label=\"Footer site links\"\r\n data-testid={`${testId}-nav`}\r\n >\r\n <ul role=\"list\">\r\n {links.map((link, i) => (\r\n <li key={i}>\r\n <LinkWrapper\r\n href={link.href}\r\n className={classMap.link}\r\n data-testid={`${testId}-link-${link.label.toLowerCase().replace(/\\s+/g, \"-\")}`}\r\n >\r\n {link.label}\r\n </LinkWrapper>\r\n </li>\r\n ))}\r\n </ul>\r\n </nav>\r\n )}\r\n\r\n {showThemeSelect && (\r\n <div\r\n className={classMap.themeToggle}\r\n data-testid={`${testId}-theme-select`}\r\n aria-label=\"Theme selector container\"\r\n >\r\n <ThemeSelect theme={\"clear\"} shadow={\"none\"} />\r\n </div>\r\n )}\r\n\r\n {socialLinks.length > 0 && (\r\n <div\r\n className={classMap.social}\r\n aria-label=\"Social media\"\r\n role=\"navigation\"\r\n data-testid={`${testId}-social`}\r\n >\r\n {socialLinks.map((social, index) => (\r\n <IconButton\r\n key={index}\r\n icon={social.icon}\r\n href={social.href}\r\n isExternal\r\n shadow=\"none\"\r\n target=\"_blank\"\r\n rel=\"noopener noreferrer\"\r\n ariaLabel={social.title}\r\n title={social.title}\r\n theme=\"clear\"\r\n data-testid={`${testId}-social-${social.title\r\n .toLowerCase()\r\n .replace(/\\s+/g, \"-\")}`}\r\n />\r\n ))}\r\n </div>\r\n )}\r\n </div>\r\n </footer>\r\n );\r\n};\r\n\r\nexport default FooterBase;\r\n","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport FooterBase from \"../FooterBase\";\r\nimport { FooterProps } from \"../Footer.types\";\r\nimport { IconButton, ThemeSelect } from \"@/index.next\";\r\nimport Link from \"next/link\";\r\nimport styles from \"./Footer.module.scss\";\r\nimport Image from \"next/image\";\r\n\r\nconst Footer: React.FC<FooterProps> = (props) => {\r\n return (\r\n <FooterBase\r\n {...props}\r\n IconButton={IconButton}\r\n ImageComponent={Image}\r\n ThemeSelect={ThemeSelect}\r\n LinkWrapper={({ href, children, className, ...rest }) => (\r\n <Link href={href} className={className} {...rest}>\r\n {children}\r\n </Link>\r\n )}\r\n classMap={styles}\r\n />\r\n );\r\n};\r\n\r\nexport default Footer;\r\n"],"names":["links","logo","IconButton","social","ThemeSelect"],"mappings":"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"}
|
|
@@ -117,14 +117,9 @@ const FooterBase = ({
|
|
|
117
117
|
LinkWrapper,
|
|
118
118
|
{
|
|
119
119
|
href: link2.href,
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
className: classMap.link,
|
|
124
|
-
"data-testid": `${testId}-link-${link2.label.toLowerCase().replace(/\s+/g, "-")}`,
|
|
125
|
-
children: link2.label
|
|
126
|
-
}
|
|
127
|
-
)
|
|
120
|
+
className: classMap.link,
|
|
121
|
+
"data-testid": `${testId}-link-${link2.label.toLowerCase().replace(/\s+/g, "-")}`,
|
|
122
|
+
children: link2.label
|
|
128
123
|
}
|
|
129
124
|
) }, i)) })
|
|
130
125
|
}
|
|
@@ -248,11 +243,11 @@ const Footer = (props) => {
|
|
|
248
243
|
IconButton: IconButton.IconButton,
|
|
249
244
|
ImageComponent: image.Image,
|
|
250
245
|
ThemeSelect: UserThemeSettings,
|
|
251
|
-
LinkWrapper: ({ href, children }) => /* @__PURE__ */ require$$2.jsx(link.Link, { href, children }),
|
|
246
|
+
LinkWrapper: ({ href, children, className, ...rest }) => /* @__PURE__ */ require$$2.jsx(link.Link, { href, className, ...rest, children }),
|
|
252
247
|
classMap: styles
|
|
253
248
|
}
|
|
254
249
|
);
|
|
255
250
|
};
|
|
256
251
|
exports.Footer = Footer;
|
|
257
252
|
exports.UserThemeSettings = UserThemeSettings;
|
|
258
|
-
//# sourceMappingURL=Footer-
|
|
253
|
+
//# sourceMappingURL=Footer-EX62svri.cjs.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Footer-EX62svri.cjs","sources":["../../src/components/Select/ThemeSelect/next/ThemeSelect.tsx","../../src/components/Footer/FooterBase.tsx","../../src/components/Footer/next/Footer.tsx"],"sourcesContent":["\"use client\";\r\n\r\nimport React, { useContext } from \"react\";\r\nimport { getAllColorSchemes } from \"../../../../styles/colorSchemeRegistry\";\r\nimport { Select } from \"@/index.next\";\r\nimport { ThemeContext } from \"../../../../context/ThemeContext\";\r\nimport { RoundingType, ShadowType, StateType, ThemeType } from \"@/types/types\";\r\nimport {\r\n getDefaultRounding,\r\n getDefaultShadow,\r\n getDefaultTheme,\r\n} from \"@/config/boreal-style-config\";\r\n\r\ninterface ThemeSelectProps {\r\n theme?: ThemeType;\r\n shadow?: ShadowType;\r\n rounding?: RoundingType;\r\n \"data-testid\"?: string;\r\n state?: StateType;\r\n}\r\n\r\nconst UserThemeSettings: React.FC<ThemeSelectProps> = ({\r\n theme = getDefaultTheme(),\r\n shadow = getDefaultShadow(),\r\n rounding = getDefaultRounding(),\r\n state = \"\",\r\n \"data-testid\": testId = \"theme-select\",\r\n}) => {\r\n const themeContext = useContext(ThemeContext);\r\n\r\n if (!themeContext) {\r\n throw new Error(\r\n \"ThemeContext is undefined. Make sure to wrap this component with ThemeProvider.\"\r\n );\r\n }\r\n\r\n const { selectedScheme, setSelectedScheme } = themeContext;\r\n const allSchemes = getAllColorSchemes();\r\n\r\n const options = allSchemes.map((scheme, index) => ({\r\n value: index.toString(),\r\n label: scheme.name,\r\n }));\r\n\r\n return (\r\n <div className={`control-container`}>\r\n <Select\r\n theme={theme}\r\n state={state}\r\n shadow={shadow}\r\n rounding={rounding}\r\n options={options}\r\n data-testid={`${testId}-select`}\r\n value={selectedScheme.toString()}\r\n onChange={(value: string | number) =>\r\n setSelectedScheme(parseInt(value as string, 10))\r\n }\r\n ariaLabel=\"Select Theme\"\r\n />\r\n </div>\r\n );\r\n};\r\n\r\nexport default UserThemeSettings;\r\n","import React, { JSX, useMemo } from \"react\";\r\nimport { FooterProps } from \"./Footer.types\";\r\nimport { combineClassNames } from \"../../utils/classNames\";\r\nimport { getDefaultTheme } from \"../../config/boreal-style-config\";\r\nimport { capitalize } from \"@/utils/capitalize\";\r\n\r\nexport interface BaseFooterProps extends FooterProps {\r\n IconButton: React.ComponentType<any>;\r\n ThemeSelect: React.ComponentType<any>;\r\n ImageComponent?: React.ElementType;\r\n classMap: Record<string, string>;\r\n LinkWrapper?: (props: {\r\n href: string;\r\n children: React.ReactNode;\r\n className?: string;\r\n [key: string]: any;\r\n }) => JSX.Element;\r\n}\r\n\r\nconst FooterBase: React.FC<BaseFooterProps> = ({\r\n theme = getDefaultTheme(),\r\n attachment = \"static\",\r\n shadow = \"none\",\r\n rounding = \"none\",\r\n className = \"\",\r\n \"data-testid\": testId = \"footer\",\r\n copyright,\r\n links = [],\r\n logo,\r\n socialLinks = [],\r\n showThemeSelect = false,\r\n IconButton,\r\n ImageComponent = \"img\",\r\n ThemeSelect,\r\n classMap,\r\n LinkWrapper = ({ href, children }) => <a href={href}>{children}</a>,\r\n}) => {\r\n const footerClass = useMemo(\r\n () =>\r\n combineClassNames(\r\n classMap.footer,\r\n classMap[theme],\r\n classMap[`shadow${capitalize(shadow)}`],\r\n classMap[`round${capitalize(rounding)}`],\r\n classMap[`attachment${capitalize(attachment)}`],\r\n className\r\n ),\r\n [classMap, theme, className]\r\n );\r\n return (\r\n <footer\r\n className={footerClass}\r\n role=\"contentinfo\"\r\n aria-label=\"Footer\"\r\n data-testid={testId}\r\n >\r\n <div className={classMap.content}>\r\n <div className={classMap.left} data-testid={`${testId}-left`}>\r\n {logo &&\r\n (typeof logo === \"string\" ||\r\n (typeof logo === \"object\" && \"src\" in logo)) ? (\r\n <ImageComponent\r\n className={classMap.logo}\r\n aria-label=\"Logo\"\r\n role=\"img\"\r\n data-testid={`${testId}-logo`}\r\n loading=\"lazy\"\r\n src={logo}\r\n alt=\"Logo\"\r\n height={20}\r\n width={20}\r\n />\r\n ) : (\r\n <span\r\n className={classMap.logo}\r\n aria-label=\"Logo\"\r\n role=\"img\"\r\n data-testid={`${testId}-logo`}\r\n >\r\n {logo}\r\n </span>\r\n )}\r\n\r\n {copyright && (\r\n <div className={classMap.left} data-testid={`${testId}-copyright`}>\r\n <p>{copyright}</p>\r\n </div>\r\n )}\r\n </div>\r\n\r\n {links.length > 0 && (\r\n <nav\r\n className={classMap.links}\r\n aria-label=\"Footer site links\"\r\n data-testid={`${testId}-nav`}\r\n >\r\n <ul role=\"list\">\r\n {links.map((link, i) => (\r\n <li key={i}>\r\n <LinkWrapper\r\n href={link.href}\r\n className={classMap.link}\r\n data-testid={`${testId}-link-${link.label.toLowerCase().replace(/\\s+/g, \"-\")}`}\r\n >\r\n {link.label}\r\n </LinkWrapper>\r\n </li>\r\n ))}\r\n </ul>\r\n </nav>\r\n )}\r\n\r\n {showThemeSelect && (\r\n <div\r\n className={classMap.themeToggle}\r\n data-testid={`${testId}-theme-select`}\r\n aria-label=\"Theme selector container\"\r\n >\r\n <ThemeSelect theme={\"clear\"} shadow={\"none\"} />\r\n </div>\r\n )}\r\n\r\n {socialLinks.length > 0 && (\r\n <div\r\n className={classMap.social}\r\n aria-label=\"Social media\"\r\n role=\"navigation\"\r\n data-testid={`${testId}-social`}\r\n >\r\n {socialLinks.map((social, index) => (\r\n <IconButton\r\n key={index}\r\n icon={social.icon}\r\n href={social.href}\r\n isExternal\r\n shadow=\"none\"\r\n target=\"_blank\"\r\n rel=\"noopener noreferrer\"\r\n ariaLabel={social.title}\r\n title={social.title}\r\n theme=\"clear\"\r\n data-testid={`${testId}-social-${social.title\r\n .toLowerCase()\r\n .replace(/\\s+/g, \"-\")}`}\r\n />\r\n ))}\r\n </div>\r\n )}\r\n </div>\r\n </footer>\r\n );\r\n};\r\n\r\nexport default FooterBase;\r\n","\"use client\";\r\n\r\nimport React from \"react\";\r\nimport FooterBase from \"../FooterBase\";\r\nimport { FooterProps } from \"../Footer.types\";\r\nimport { IconButton, ThemeSelect } from \"@/index.next\";\r\nimport Link from \"next/link\";\r\nimport styles from \"./Footer.module.scss\";\r\nimport Image from \"next/image\";\r\n\r\nconst Footer: React.FC<FooterProps> = (props) => {\r\n return (\r\n <FooterBase\r\n {...props}\r\n IconButton={IconButton}\r\n ImageComponent={Image}\r\n ThemeSelect={ThemeSelect}\r\n LinkWrapper={({ href, children, className, ...rest }) => (\r\n <Link href={href} className={className} {...rest}>\r\n {children}\r\n </Link>\r\n )}\r\n classMap={styles}\r\n />\r\n );\r\n};\r\n\r\nexport default Footer;\r\n"],"names":["getDefaultTheme","getDefaultShadow","getDefaultRounding","useContext","ThemeContext","getAllColorSchemes","jsx","Select","links","logo","IconButton","useMemo","combineClassNames","capitalize","jsxs","link","social","Image","ThemeSelect","Link"],"mappings":";;;;;;;;;;;;AAqBA,MAAM,oBAAgD,CAAC;AAAA,EACrD,QAAQA,kBAAAA,gBAAA;AAAA,EACR,SAASC,kBAAAA,iBAAA;AAAA,EACT,WAAWC,kBAAAA,mBAAA;AAAA,EACX,QAAQ;AAAA,EACR,eAAe,SAAS;AAC1B,MAAM;AACJ,QAAM,eAAeC,MAAAA,WAAWC,yBAAY;AAE5C,MAAI,CAAC,cAAc;AACjB,UAAM,IAAI;AAAA,MACR;AAAA,IAAA;AAAA,EAEJ;AAEA,QAAM,EAAE,gBAAgB,kBAAA,IAAsB;AAC9C,QAAM,aAAaC,mBAAAA,mBAAA;AAEnB,QAAM,UAAU,WAAW,IAAI,CAAC,QAAQ,WAAW;AAAA,IACjD,OAAO,MAAM,SAAA;AAAA,IACb,OAAO,OAAO;AAAA,EAAA,EACd;AAEF,SACEC,2BAAAA,IAAC,OAAA,EAAI,WAAW,qBACd,UAAAA,2BAAAA;AAAAA,IAACC,OAAAA;AAAAA,IAAA;AAAA,MACC;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,eAAa,GAAG,MAAM;AAAA,MACtB,OAAO,eAAe,SAAA;AAAA,MACtB,UAAU,CAAC,UACT,kBAAkB,SAAS,OAAiB,EAAE,CAAC;AAAA,MAEjD,WAAU;AAAA,IAAA;AAAA,EAAA,GAEd;AAEJ;AC1CA,MAAM,aAAwC,CAAC;AAAA,EAC7C,QAAQP,kBAAAA,gBAAA;AAAA,EACR,aAAa;AAAA,EACb,SAAS;AAAA,EACT,WAAW;AAAA,EACX,YAAY;AAAA,EACZ,eAAe,SAAS;AAAA,EACxB;AAAA,EACA,OAAAQ,SAAQ,CAAA;AAAA,EACR,MAAAC;AAAA,EACA,cAAc,CAAA;AAAA,EACd,kBAAkB;AAAA,EAClB,YAAAC;AAAA,EACA,iBAAiB;AAAA,EACjB;AAAA,EACA;AAAA,EACA,cAAc,CAAC,EAAE,MAAM,eAAeJ,2BAAAA,IAAC,KAAA,EAAE,MAAa,SAAA,CAAS;AACjE,MAAM;AACJ,QAAM,cAAcK,MAAAA;AAAAA,IAClB,MACEC,WAAAA;AAAAA,MACE,SAAS;AAAA,MACT,SAAS,KAAK;AAAA,MACd,SAAS,SAASC,WAAAA,WAAW,MAAM,CAAC,EAAE;AAAA,MACtC,SAAS,QAAQA,WAAAA,WAAW,QAAQ,CAAC,EAAE;AAAA,MACvC,SAAS,aAAaA,WAAAA,WAAW,UAAU,CAAC,EAAE;AAAA,MAC9C;AAAA,IAAA;AAAA,IAEJ,CAAC,UAAU,OAAO,SAAS;AAAA,EAAA;AAE7B,SACEP,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,MACX,MAAK;AAAA,MACL,cAAW;AAAA,MACX,eAAa;AAAA,MAEb,UAAAQ,2BAAAA,KAAC,OAAA,EAAI,WAAW,SAAS,SACvB,UAAA;AAAA,QAAAA,2BAAAA,KAAC,SAAI,WAAW,SAAS,MAAM,eAAa,GAAG,MAAM,SAClD,UAAA;AAAA,UAAAL,UACA,OAAOA,UAAS,YACd,OAAOA,UAAS,YAAY,SAASA,SACtCH,2BAAAA;AAAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAW,SAAS;AAAA,cACpB,cAAW;AAAA,cACX,MAAK;AAAA,cACL,eAAa,GAAG,MAAM;AAAA,cACtB,SAAQ;AAAA,cACR,KAAKG;AAAA,cACL,KAAI;AAAA,cACJ,QAAQ;AAAA,cACR,OAAO;AAAA,YAAA;AAAA,UAAA,IAGTH,2BAAAA;AAAAA,YAAC;AAAA,YAAA;AAAA,cACC,WAAW,SAAS;AAAA,cACpB,cAAW;AAAA,cACX,MAAK;AAAA,cACL,eAAa,GAAG,MAAM;AAAA,cAErB,UAAAG;AAAA,YAAA;AAAA,UAAA;AAAA,UAIJ,aACCH,2BAAAA,IAAC,OAAA,EAAI,WAAW,SAAS,MAAM,eAAa,GAAG,MAAM,cACnD,UAAAA,2BAAAA,IAAC,KAAA,EAAG,qBAAU,EAAA,CAChB;AAAA,QAAA,GAEJ;AAAA,QAECE,OAAM,SAAS,KACdF,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW,SAAS;AAAA,YACpB,cAAW;AAAA,YACX,eAAa,GAAG,MAAM;AAAA,YAEtB,UAAAA,2BAAAA,IAAC,MAAA,EAAG,MAAK,QACN,UAAAE,OAAM,IAAI,CAACO,OAAM,MAChBT,2BAAAA,IAAC,MAAA,EACC,UAAAA,2BAAAA;AAAAA,cAAC;AAAA,cAAA;AAAA,gBACC,MAAMS,MAAK;AAAA,gBACX,WAAW,SAAS;AAAA,gBACpB,eAAa,GAAG,MAAM,SAASA,MAAK,MAAM,YAAA,EAAc,QAAQ,QAAQ,GAAG,CAAC;AAAA,gBAE3E,UAAAA,MAAK;AAAA,cAAA;AAAA,YAAA,EACR,GAPO,CAQT,CACD,EAAA,CACH;AAAA,UAAA;AAAA,QAAA;AAAA,QAIH,mBACCT,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW,SAAS;AAAA,YACpB,eAAa,GAAG,MAAM;AAAA,YACtB,cAAW;AAAA,YAEX,UAAAA,2BAAAA,IAAC,aAAA,EAAY,OAAO,SAAS,QAAQ,OAAA,CAAQ;AAAA,UAAA;AAAA,QAAA;AAAA,QAIhD,YAAY,SAAS,KACpBA,2BAAAA;AAAAA,UAAC;AAAA,UAAA;AAAA,YACC,WAAW,SAAS;AAAA,YACpB,cAAW;AAAA,YACX,MAAK;AAAA,YACL,eAAa,GAAG,MAAM;AAAA,YAErB,UAAA,YAAY,IAAI,CAACU,SAAQ,UACxBV,2BAAAA;AAAAA,cAACI;AAAA,cAAA;AAAA,gBAEC,MAAMM,QAAO;AAAA,gBACb,MAAMA,QAAO;AAAA,gBACb,YAAU;AAAA,gBACV,QAAO;AAAA,gBACP,QAAO;AAAA,gBACP,KAAI;AAAA,gBACJ,WAAWA,QAAO;AAAA,gBAClB,OAAOA,QAAO;AAAA,gBACd,OAAM;AAAA,gBACN,eAAa,GAAG,MAAM,WAAWA,QAAO,MACrC,cACA,QAAQ,QAAQ,GAAG,CAAC;AAAA,cAAA;AAAA,cAZlB;AAAA,YAAA,CAcR;AAAA,UAAA;AAAA,QAAA;AAAA,MACH,EAAA,CAEJ;AAAA,IAAA;AAAA,EAAA;AAGN;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AC7IA,MAAM,SAAgC,CAAC,UAAU;AAC/C,SACEV,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAG;AAAA,MAAA,YACJI,WAAAA;AAAAA,MACA,gBAAgBO,MAAAA;AAAAA,MAAA,aAChBC;AAAAA,MACA,aAAa,CAAC,EAAE,MAAM,UAAU,WAAW,GAAG,KAAA,qCAC3CC,KAAAA,MAAA,EAAK,MAAY,WAAuB,GAAG,MACzC,SAAA,CACH;AAAA,MAEF,UAAU;AAAA,IAAA;AAAA,EAAA;AAGhB;;;"}
|
package/dist/next/Footer.cjs.js
CHANGED
package/dist/next/Footer.js
CHANGED
package/dist/next/index.cjs.js
CHANGED
|
@@ -10,7 +10,7 @@ const STT = require("./STT-B8QYAxU7.cjs");
|
|
|
10
10
|
const TextInput = require("./TextInput--th5kygP.cjs");
|
|
11
11
|
const TextArea = require("./TextArea-OVtBBpaP.cjs");
|
|
12
12
|
const Select = require("./Select-BVxDV81c.cjs");
|
|
13
|
-
const Footer = require("./Footer-
|
|
13
|
+
const Footer = require("./Footer-EX62svri.cjs");
|
|
14
14
|
const FileUpload = require("./FileUpload-DoMMMgwj.cjs");
|
|
15
15
|
const TagInput = require("./TagInput-BwoUWtRR.cjs");
|
|
16
16
|
const RadioButton = require("./RadioButton-BvqTDvI8.cjs");
|
|
@@ -52,7 +52,7 @@ const EmptyState = require("./EmptyState-DCjBopC6.cjs");
|
|
|
52
52
|
const CommandPalette = require("./CommandPalette-FO3S6xly.cjs");
|
|
53
53
|
const NotificationCenter = require("./NotificationCenter-Bi6LJr55.cjs");
|
|
54
54
|
const Sidebar = require("./Sidebar-C_zefcbg.cjs");
|
|
55
|
-
const Card = require("./Card-
|
|
55
|
+
const Card = require("./Card-Bk3Kx1sY.cjs");
|
|
56
56
|
const Avatar = require("./Avatar-BX8mh_3b.cjs");
|
|
57
57
|
const ChipGroupBase = React.forwardRef(
|
|
58
58
|
({
|
package/dist/next/index.js
CHANGED
|
@@ -9,8 +9,8 @@ import { S } from "./STT-B89YQxDF.js";
|
|
|
9
9
|
import { T as T2 } from "./TextInput-DXXcGZtq.js";
|
|
10
10
|
import { T as T3 } from "./TextArea-BDYg--3P.js";
|
|
11
11
|
import { S as S2 } from "./Select-DXO2nK78.js";
|
|
12
|
-
import { F as Footer } from "./Footer-
|
|
13
|
-
import { U } from "./Footer-
|
|
12
|
+
import { F as Footer } from "./Footer-CWUge4tr.js";
|
|
13
|
+
import { U } from "./Footer-CWUge4tr.js";
|
|
14
14
|
import { F } from "./FileUpload-BGK2Pg4X.js";
|
|
15
15
|
import { T as T4 } from "./TagInput-DjHDSsny.js";
|
|
16
16
|
import { R } from "./RadioButton-CffrjQlz.js";
|
|
@@ -52,7 +52,7 @@ import { E } from "./EmptyState-Bo9W0BX5.js";
|
|
|
52
52
|
import { C as C4 } from "./CommandPalette-BvgDewF1.js";
|
|
53
53
|
import { N as N2 } from "./NotificationCenter-OqRd6YfC.js";
|
|
54
54
|
import { S as S7 } from "./Sidebar-R1NSvWHu.js";
|
|
55
|
-
import { C as C5 } from "./Card-
|
|
55
|
+
import { C as C5 } from "./Card-CaPhq4Ut.js";
|
|
56
56
|
import { A as A2 } from "./Avatar-B3eTb_Xz.js";
|
|
57
57
|
const ChipGroupBase = forwardRef(
|
|
58
58
|
({
|