@cerberus-design/react 0.8.1 → 0.9.0

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.
Files changed (77) hide show
  1. package/build/legacy/_tsup-dts-rollup.d.cts +49 -0
  2. package/build/legacy/components/Avatar.cjs +196 -0
  3. package/build/legacy/components/Avatar.cjs.map +1 -0
  4. package/build/legacy/components/Checkbox.cjs +1 -0
  5. package/build/legacy/components/Checkbox.cjs.map +1 -1
  6. package/build/legacy/components/FileStatus.cjs +1 -0
  7. package/build/legacy/components/FileStatus.cjs.map +1 -1
  8. package/build/legacy/components/FileUploader.cjs +1 -0
  9. package/build/legacy/components/FileUploader.cjs.map +1 -1
  10. package/build/legacy/components/Input.cjs +1 -0
  11. package/build/legacy/components/Input.cjs.map +1 -1
  12. package/build/legacy/components/Notification.cjs +1 -0
  13. package/build/legacy/components/Notification.cjs.map +1 -1
  14. package/build/legacy/components/Select.cjs +1 -0
  15. package/build/legacy/components/Select.cjs.map +1 -1
  16. package/build/legacy/components/Toggle.cjs +1 -0
  17. package/build/legacy/components/Toggle.cjs.map +1 -1
  18. package/build/legacy/config/cerbIcons.cjs +1 -0
  19. package/build/legacy/config/cerbIcons.cjs.map +1 -1
  20. package/build/legacy/config/defineIcons.cjs +1 -0
  21. package/build/legacy/config/defineIcons.cjs.map +1 -1
  22. package/build/legacy/context/confirm-modal.cjs +1 -0
  23. package/build/legacy/context/confirm-modal.cjs.map +1 -1
  24. package/build/legacy/context/notification-center.cjs +1 -0
  25. package/build/legacy/context/notification-center.cjs.map +1 -1
  26. package/build/legacy/context/prompt-modal.cjs +1 -0
  27. package/build/legacy/context/prompt-modal.cjs.map +1 -1
  28. package/build/legacy/index.cjs +499 -403
  29. package/build/legacy/index.cjs.map +1 -1
  30. package/build/modern/_tsup-dts-rollup.d.ts +49 -0
  31. package/build/modern/{chunk-ID3XWGLY.js → chunk-4YJOK7JJ.js} +2 -2
  32. package/build/modern/{chunk-GUECLKHY.js → chunk-BDCFYW34.js} +3 -1
  33. package/build/modern/chunk-BDCFYW34.js.map +1 -0
  34. package/build/modern/{chunk-S6CMAXQF.js → chunk-CZMC77YO.js} +9 -9
  35. package/build/modern/{chunk-53QBTZZF.js → chunk-FMFKM2AB.js} +2 -2
  36. package/build/modern/{chunk-GZY6CH7D.js → chunk-GB3SECCO.js} +8 -8
  37. package/build/modern/{chunk-VPWBSZAR.js → chunk-KKJKOKP7.js} +5 -5
  38. package/build/modern/{chunk-7NX4RGDB.js → chunk-MLCVO7JP.js} +2 -2
  39. package/build/modern/{chunk-5WVXIAG2.js → chunk-NBG2OSYI.js} +2 -2
  40. package/build/modern/{chunk-EJIMJWPB.js → chunk-QZ6NS6VN.js} +2 -2
  41. package/build/modern/{chunk-TF3HRELU.js → chunk-TUIVLIJI.js} +2 -2
  42. package/build/modern/chunk-UN3OAW56.js +104 -0
  43. package/build/modern/chunk-UN3OAW56.js.map +1 -0
  44. package/build/modern/{chunk-RHG26FYL.js → chunk-VRPAW76S.js} +2 -2
  45. package/build/modern/{chunk-4FD33RTW.js → chunk-ZCIJRM2X.js} +2 -2
  46. package/build/modern/components/Avatar.js +11 -0
  47. package/build/modern/components/Avatar.js.map +1 -0
  48. package/build/modern/components/Checkbox.js +3 -3
  49. package/build/modern/components/FileStatus.js +3 -3
  50. package/build/modern/components/FileUploader.js +3 -3
  51. package/build/modern/components/Input.js +3 -3
  52. package/build/modern/components/Notification.js +3 -3
  53. package/build/modern/components/Select.js +3 -3
  54. package/build/modern/components/Toggle.js +3 -3
  55. package/build/modern/config/cerbIcons.js +1 -1
  56. package/build/modern/config/defineIcons.js +2 -2
  57. package/build/modern/context/confirm-modal.js +5 -5
  58. package/build/modern/context/notification-center.js +5 -5
  59. package/build/modern/context/prompt-modal.js +6 -6
  60. package/build/modern/index.js +35 -31
  61. package/build/modern/index.js.map +1 -1
  62. package/package.json +2 -2
  63. package/src/components/Avatar.tsx +132 -0
  64. package/src/config/cerbIcons.ts +3 -0
  65. package/src/index.ts +1 -0
  66. package/build/modern/chunk-GUECLKHY.js.map +0 -1
  67. /package/build/modern/{chunk-ID3XWGLY.js.map → chunk-4YJOK7JJ.js.map} +0 -0
  68. /package/build/modern/{chunk-S6CMAXQF.js.map → chunk-CZMC77YO.js.map} +0 -0
  69. /package/build/modern/{chunk-53QBTZZF.js.map → chunk-FMFKM2AB.js.map} +0 -0
  70. /package/build/modern/{chunk-GZY6CH7D.js.map → chunk-GB3SECCO.js.map} +0 -0
  71. /package/build/modern/{chunk-VPWBSZAR.js.map → chunk-KKJKOKP7.js.map} +0 -0
  72. /package/build/modern/{chunk-7NX4RGDB.js.map → chunk-MLCVO7JP.js.map} +0 -0
  73. /package/build/modern/{chunk-5WVXIAG2.js.map → chunk-NBG2OSYI.js.map} +0 -0
  74. /package/build/modern/{chunk-EJIMJWPB.js.map → chunk-QZ6NS6VN.js.map} +0 -0
  75. /package/build/modern/{chunk-TF3HRELU.js.map → chunk-TUIVLIJI.js.map} +0 -0
  76. /package/build/modern/{chunk-RHG26FYL.js.map → chunk-VRPAW76S.js.map} +0 -0
  77. /package/build/modern/{chunk-4FD33RTW.js.map → chunk-ZCIJRM2X.js.map} +0 -0
@@ -6,6 +6,7 @@ import { Announcements } from '@dnd-kit/core';
6
6
  import { applyModifiers } from '@dnd-kit/core';
7
7
  import { AutoScrollActivator } from '@dnd-kit/core';
8
8
  import { AutoScrollOptions } from '@dnd-kit/core';
9
+ import { AvatarVariantProps } from '@cerberus/styled-system/recipes';
9
10
  import { ButtonHTMLAttributes } from 'react';
10
11
  import { ButtonVariantProps } from '@cerberus/styled-system/recipes';
11
12
  import { CancelDrop } from '@dnd-kit/core';
@@ -157,6 +158,41 @@ export { AutoScrollActivator }
157
158
 
158
159
  export { AutoScrollOptions }
159
160
 
161
+ /**
162
+ * The Avatar component is used to represent a user or entity. It will show an image if src provided, otherwise it will show the ariaLabel of the ariaLabel. If the ariaLabel is empty, it will show a `defineIcons().avatar` icon.
163
+ * @definition [Avatar docs](https://cerberus.digitalu.design/react/avatar)
164
+ * @example
165
+ * ```tsx
166
+ * <Avatar
167
+ * ariaLabel="Protector Cerberus"
168
+ * src="https://cerberus.digitalu.design/logo.svg"
169
+ * />
170
+ * ```
171
+ */
172
+ declare function Avatar(props: AvatarProps): JSX_2.Element;
173
+ export { Avatar }
174
+ export { Avatar as Avatar_alias_1 }
175
+
176
+ declare type AvatarAsProps = SharedAvatarProps & {
177
+ as: ReactNode;
178
+ ariaLabel?: never;
179
+ src?: never;
180
+ };
181
+ export { AvatarAsProps }
182
+ export { AvatarAsProps as AvatarAsProps_alias_1 }
183
+
184
+ declare type AvatarImageProps = HtmlHTMLAttributes<HTMLImageElement> & SharedAvatarProps & {
185
+ ariaLabel: string;
186
+ as?: never;
187
+ src: string;
188
+ };
189
+ export { AvatarImageProps }
190
+ export { AvatarImageProps as AvatarImageProps_alias_1 }
191
+
192
+ declare type AvatarProps = (HtmlHTMLAttributes<HTMLDivElement> & AvatarVariantProps) & (AvatarImageProps | AvatarAsProps);
193
+ export { AvatarProps }
194
+ export { AvatarProps as AvatarProps_alias_1 }
195
+
160
196
  declare interface BaseNotificationDescriptionProps extends HTMLAttributes<HTMLParagraphElement> {
161
197
  }
162
198
  export { BaseNotificationDescriptionProps }
@@ -319,6 +355,7 @@ export { DefaultThemes }
319
355
  export { DefaultThemes as DefaultThemes_alias_1 }
320
356
 
321
357
  export declare interface DefinedIcons {
358
+ avatar?: IconType;
322
359
  checkbox?: IconType;
323
360
  close?: IconType;
324
361
  confirmModal?: IconType;
@@ -1209,6 +1246,18 @@ export { SensorResponse }
1209
1246
 
1210
1247
  export { Sensors }
1211
1248
 
1249
+ /**
1250
+ * This module contains the Avatar component.
1251
+ * @module
1252
+ */
1253
+ declare type SharedAvatarProps = {
1254
+ icon?: ReactNode;
1255
+ width?: number;
1256
+ height?: number;
1257
+ };
1258
+ export { SharedAvatarProps }
1259
+ export { SharedAvatarProps as SharedAvatarProps_alias_1 }
1260
+
1212
1261
  /**
1213
1262
  * Conditionally render its children or an optional fallback component
1214
1263
  * based on the SolidJS component.
@@ -3,7 +3,7 @@ import {
3
3
  } from "./chunk-ZAU4JVLL.js";
4
4
  import {
5
5
  $cerberusIcons
6
- } from "./chunk-5WVXIAG2.js";
6
+ } from "./chunk-NBG2OSYI.js";
7
7
 
8
8
  // src/components/Toggle.tsx
9
9
  import { cx } from "@cerberus/styled-system/css";
@@ -55,4 +55,4 @@ function Toggle(props) {
55
55
  export {
56
56
  Toggle
57
57
  };
58
- //# sourceMappingURL=chunk-ID3XWGLY.js.map
58
+ //# sourceMappingURL=chunk-4YJOK7JJ.js.map
@@ -15,10 +15,12 @@ import {
15
15
  InformationFilled,
16
16
  Restart,
17
17
  TrashCan,
18
+ UserFilled,
18
19
  Warning,
19
20
  WarningFilled
20
21
  } from "@cerberus/icons";
21
22
  var defaultIcons = {
23
+ avatar: UserFilled,
22
24
  checkbox: CheckmarkIcon,
23
25
  close: CloseFilled,
24
26
  confirmModal: Information,
@@ -40,4 +42,4 @@ var defaultIcons = {
40
42
  export {
41
43
  defaultIcons
42
44
  };
43
- //# sourceMappingURL=chunk-GUECLKHY.js.map
45
+ //# sourceMappingURL=chunk-BDCFYW34.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/config/cerbIcons.ts"],"sourcesContent":["import {\n Checkmark,\n CheckmarkFilled,\n ChevronDown,\n CloseFilled,\n CloudUpload,\n ErrorFilled,\n Information,\n InformationFilled,\n Restart,\n TrashCan,\n UserFilled,\n Warning,\n WarningFilled,\n type CarbonIconType,\n} from '@cerberus/icons'\nimport type { ElementType } from 'react'\nimport { CheckmarkIcon, IndeterminateIcon } from './icons/checkbox.icons'\n\nexport type IconType = CarbonIconType | ElementType\n\nexport interface DefinedIcons {\n avatar?: IconType\n checkbox?: IconType\n close?: IconType\n confirmModal?: IconType\n delete?: IconType\n promptModal?: IconType\n fileUploader?: IconType\n indeterminate?: IconType\n infoNotification?: IconType\n successNotification?: IconType\n warningNotification?: IconType\n dangerNotification?: IconType\n invalid: IconType\n invalidAlt?: IconType\n redo?: IconType\n selectArrow?: IconType\n toggleChecked?: IconType\n}\n\nexport const defaultIcons: DefinedIcons = {\n avatar: UserFilled,\n checkbox: CheckmarkIcon,\n close: CloseFilled,\n confirmModal: Information,\n delete: TrashCan,\n promptModal: Information,\n fileUploader: CloudUpload,\n indeterminate: IndeterminateIcon,\n infoNotification: InformationFilled,\n successNotification: CheckmarkFilled,\n warningNotification: WarningFilled,\n dangerNotification: ErrorFilled,\n invalid: WarningFilled,\n invalidAlt: Warning,\n redo: Restart,\n selectArrow: ChevronDown,\n toggleChecked: Checkmark,\n}\n"],"mappings":";;;;;;AAAA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OAEK;AA0BA,IAAM,eAA6B;AAAA,EACxC,QAAQ;AAAA,EACR,UAAU;AAAA,EACV,OAAO;AAAA,EACP,cAAc;AAAA,EACd,QAAQ;AAAA,EACR,aAAa;AAAA,EACb,cAAc;AAAA,EACd,eAAe;AAAA,EACf,kBAAkB;AAAA,EAClB,qBAAqB;AAAA,EACrB,qBAAqB;AAAA,EACrB,oBAAoB;AAAA,EACpB,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,MAAM;AAAA,EACN,aAAa;AAAA,EACb,eAAe;AACjB;","names":[]}
@@ -1,12 +1,15 @@
1
- import {
2
- ModalIcon
3
- } from "./chunk-VCR5C6Q3.js";
4
1
  import {
5
2
  Portal
6
3
  } from "./chunk-4CAT3FHV.js";
4
+ import {
5
+ ModalHeading
6
+ } from "./chunk-JB7IQ2BM.js";
7
+ import {
8
+ ModalIcon
9
+ } from "./chunk-VCR5C6Q3.js";
7
10
  import {
8
11
  Input
9
- } from "./chunk-53QBTZZF.js";
12
+ } from "./chunk-FMFKM2AB.js";
10
13
  import {
11
14
  Label
12
15
  } from "./chunk-2FK7NR7Y.js";
@@ -19,9 +22,6 @@ import {
19
22
  import {
20
23
  ModalHeader
21
24
  } from "./chunk-QU7UV5DB.js";
22
- import {
23
- ModalHeading
24
- } from "./chunk-JB7IQ2BM.js";
25
25
  import {
26
26
  Button
27
27
  } from "./chunk-6F34A7NZ.js";
@@ -36,7 +36,7 @@ import {
36
36
  } from "./chunk-JIZQFTW6.js";
37
37
  import {
38
38
  $cerberusIcons
39
- } from "./chunk-5WVXIAG2.js";
39
+ } from "./chunk-NBG2OSYI.js";
40
40
  import {
41
41
  useModal
42
42
  } from "./chunk-C5HLLGME.js";
@@ -204,4 +204,4 @@ export {
204
204
  PromptModal,
205
205
  usePromptModal
206
206
  };
207
- //# sourceMappingURL=chunk-S6CMAXQF.js.map
207
+ //# sourceMappingURL=chunk-CZMC77YO.js.map
@@ -6,7 +6,7 @@ import {
6
6
  } from "./chunk-ZAU4JVLL.js";
7
7
  import {
8
8
  $cerberusIcons
9
- } from "./chunk-5WVXIAG2.js";
9
+ } from "./chunk-NBG2OSYI.js";
10
10
 
11
11
  // src/components/Input.tsx
12
12
  import { input } from "@cerberus/styled-system/recipes";
@@ -39,4 +39,4 @@ function Input(props) {
39
39
  export {
40
40
  Input
41
41
  };
42
- //# sourceMappingURL=chunk-53QBTZZF.js.map
42
+ //# sourceMappingURL=chunk-FMFKM2AB.js.map
@@ -1,9 +1,12 @@
1
- import {
2
- ModalIcon
3
- } from "./chunk-VCR5C6Q3.js";
4
1
  import {
5
2
  Portal
6
3
  } from "./chunk-4CAT3FHV.js";
4
+ import {
5
+ ModalHeading
6
+ } from "./chunk-JB7IQ2BM.js";
7
+ import {
8
+ ModalIcon
9
+ } from "./chunk-VCR5C6Q3.js";
7
10
  import {
8
11
  Modal
9
12
  } from "./chunk-2UFNQM55.js";
@@ -13,9 +16,6 @@ import {
13
16
  import {
14
17
  ModalHeader
15
18
  } from "./chunk-QU7UV5DB.js";
16
- import {
17
- ModalHeading
18
- } from "./chunk-JB7IQ2BM.js";
19
19
  import {
20
20
  Button
21
21
  } from "./chunk-6F34A7NZ.js";
@@ -27,7 +27,7 @@ import {
27
27
  } from "./chunk-JIZQFTW6.js";
28
28
  import {
29
29
  $cerberusIcons
30
- } from "./chunk-5WVXIAG2.js";
30
+ } from "./chunk-NBG2OSYI.js";
31
31
  import {
32
32
  useModal
33
33
  } from "./chunk-C5HLLGME.js";
@@ -151,4 +151,4 @@ export {
151
151
  ConfirmModal,
152
152
  useConfirmModal
153
153
  };
154
- //# sourceMappingURL=chunk-GZY6CH7D.js.map
154
+ //# sourceMappingURL=chunk-GB3SECCO.js.map
@@ -1,15 +1,15 @@
1
+ import {
2
+ Portal
3
+ } from "./chunk-4CAT3FHV.js";
1
4
  import {
2
5
  Notification
3
- } from "./chunk-EJIMJWPB.js";
6
+ } from "./chunk-QZ6NS6VN.js";
4
7
  import {
5
8
  NotificationDescription
6
9
  } from "./chunk-HW76XVA3.js";
7
10
  import {
8
11
  NotificationHeading
9
12
  } from "./chunk-3C2DJSEE.js";
10
- import {
11
- Portal
12
- } from "./chunk-4CAT3FHV.js";
13
13
  import {
14
14
  Button
15
15
  } from "./chunk-6F34A7NZ.js";
@@ -119,4 +119,4 @@ export {
119
119
  NotificationCenter,
120
120
  useNotificationCenter
121
121
  };
122
- //# sourceMappingURL=chunk-VPWBSZAR.js.map
122
+ //# sourceMappingURL=chunk-KKJKOKP7.js.map
@@ -12,7 +12,7 @@ import {
12
12
  } from "./chunk-ZAU4JVLL.js";
13
13
  import {
14
14
  $cerberusIcons
15
- } from "./chunk-5WVXIAG2.js";
15
+ } from "./chunk-NBG2OSYI.js";
16
16
 
17
17
  // src/components/FileStatus.tsx
18
18
  import {
@@ -215,4 +215,4 @@ export {
215
215
  processStatus,
216
216
  FileStatus
217
217
  };
218
- //# sourceMappingURL=chunk-7NX4RGDB.js.map
218
+ //# sourceMappingURL=chunk-MLCVO7JP.js.map
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  defaultIcons
3
- } from "./chunk-GUECLKHY.js";
3
+ } from "./chunk-BDCFYW34.js";
4
4
 
5
5
  // src/config/defineIcons.ts
6
6
  function _validateIconsProperties(icons) {
@@ -24,4 +24,4 @@ export {
24
24
  defineIcons,
25
25
  $cerberusIcons
26
26
  };
27
- //# sourceMappingURL=chunk-5WVXIAG2.js.map
27
+ //# sourceMappingURL=chunk-NBG2OSYI.js.map
@@ -3,7 +3,7 @@ import {
3
3
  } from "./chunk-JIZQFTW6.js";
4
4
  import {
5
5
  $cerberusIcons
6
- } from "./chunk-5WVXIAG2.js";
6
+ } from "./chunk-NBG2OSYI.js";
7
7
 
8
8
  // src/components/Notification.tsx
9
9
  import { cx } from "@cerberus/styled-system/css";
@@ -73,4 +73,4 @@ function Notification(props) {
73
73
  export {
74
74
  Notification
75
75
  };
76
- //# sourceMappingURL=chunk-EJIMJWPB.js.map
76
+ //# sourceMappingURL=chunk-QZ6NS6VN.js.map
@@ -3,7 +3,7 @@ import {
3
3
  } from "./chunk-4O4QFF4S.js";
4
4
  import {
5
5
  $cerberusIcons
6
- } from "./chunk-5WVXIAG2.js";
6
+ } from "./chunk-NBG2OSYI.js";
7
7
 
8
8
  // src/components/FileUploader.tsx
9
9
  import { cx } from "@cerberus/styled-system/css";
@@ -59,4 +59,4 @@ function FileUploader(props) {
59
59
  export {
60
60
  FileUploader
61
61
  };
62
- //# sourceMappingURL=chunk-TF3HRELU.js.map
62
+ //# sourceMappingURL=chunk-TUIVLIJI.js.map
@@ -0,0 +1,104 @@
1
+ import {
2
+ Show
3
+ } from "./chunk-4O4QFF4S.js";
4
+ import {
5
+ $cerberusIcons
6
+ } from "./chunk-NBG2OSYI.js";
7
+
8
+ // src/components/Avatar.tsx
9
+ import { css, cx } from "@cerberus/styled-system/css";
10
+ import { circle } from "@cerberus/styled-system/patterns";
11
+ import {
12
+ avatar
13
+ } from "@cerberus/styled-system/recipes";
14
+ import { jsx } from "react/jsx-runtime";
15
+ function Avatar(props) {
16
+ const {
17
+ ariaLabel,
18
+ as,
19
+ gradient,
20
+ size,
21
+ src,
22
+ width,
23
+ height,
24
+ icon,
25
+ ...nativeProps
26
+ } = props;
27
+ const { avatar: AvatarIcon } = $cerberusIcons;
28
+ const initials = (ariaLabel || "").split(" ").map((word) => word[0]).join("").slice(0, 2);
29
+ return /* @__PURE__ */ jsx(
30
+ "div",
31
+ {
32
+ ...nativeProps,
33
+ className: cx(
34
+ nativeProps.className,
35
+ avatar({ gradient, size }),
36
+ circle()
37
+ ),
38
+ children: /* @__PURE__ */ jsx(
39
+ Show,
40
+ {
41
+ when: Boolean(src) || Boolean(as),
42
+ fallback: /* @__PURE__ */ jsx(
43
+ Show,
44
+ {
45
+ when: Boolean(initials),
46
+ fallback: /* @__PURE__ */ jsx(
47
+ Show,
48
+ {
49
+ when: Boolean(icon),
50
+ fallback: /* @__PURE__ */ jsx(
51
+ AvatarIcon,
52
+ {
53
+ size: iconSizeMap[size]
54
+ }
55
+ ),
56
+ children: icon
57
+ }
58
+ ),
59
+ children: initials
60
+ }
61
+ ),
62
+ children: /* @__PURE__ */ jsx(
63
+ Show,
64
+ {
65
+ when: Boolean(as),
66
+ fallback: /* @__PURE__ */ jsx(
67
+ "img",
68
+ {
69
+ alt: props.ariaLabel,
70
+ className: css({
71
+ h: "full",
72
+ objectFit: "cover",
73
+ w: "full"
74
+ }),
75
+ decoding: "async",
76
+ loading: "lazy",
77
+ src,
78
+ height,
79
+ width
80
+ }
81
+ ),
82
+ children: as
83
+ }
84
+ )
85
+ }
86
+ )
87
+ }
88
+ );
89
+ }
90
+ var iconSizeMap = {
91
+ xs: 16,
92
+ sm: 16,
93
+ md: 20,
94
+ lg: 34,
95
+ xl: 32,
96
+ "2xl": 32,
97
+ "3xl": 32,
98
+ "4xl": 32
99
+ };
100
+
101
+ export {
102
+ Avatar
103
+ };
104
+ //# sourceMappingURL=chunk-UN3OAW56.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/components/Avatar.tsx"],"sourcesContent":["import { css, cx } from '@cerberus/styled-system/css'\nimport { circle } from '@cerberus/styled-system/patterns'\nimport {\n avatar,\n type AvatarVariantProps,\n} from '@cerberus/styled-system/recipes'\nimport { $cerberusIcons } from '../config/defineIcons'\nimport type { HtmlHTMLAttributes, ReactNode } from 'react'\nimport { Show } from './Show'\n\n/**\n * This module contains the Avatar component.\n * @module\n */\n\nexport type SharedAvatarProps = {\n icon?: ReactNode\n width?: number\n height?: number\n}\nexport type AvatarImageProps = HtmlHTMLAttributes<HTMLImageElement> &\n SharedAvatarProps & {\n ariaLabel: string\n as?: never\n src: string\n }\nexport type AvatarAsProps = SharedAvatarProps & {\n as: ReactNode\n ariaLabel?: never\n src?: never\n}\n\nexport type AvatarProps = (HtmlHTMLAttributes<HTMLDivElement> &\n AvatarVariantProps) &\n (AvatarImageProps | AvatarAsProps)\n\n/**\n * The Avatar component is used to represent a user or entity. It will show an image if src provided, otherwise it will show the ariaLabel of the ariaLabel. If the ariaLabel is empty, it will show a `defineIcons().avatar` icon.\n * @definition [Avatar docs](https://cerberus.digitalu.design/react/avatar)\n * @example\n * ```tsx\n * <Avatar\n * ariaLabel=\"Protector Cerberus\"\n * src=\"https://cerberus.digitalu.design/logo.svg\"\n * />\n * ```\n */\nexport function Avatar(props: AvatarProps) {\n const {\n ariaLabel,\n as,\n gradient,\n size,\n src,\n width,\n height,\n icon,\n ...nativeProps\n } = props\n const { avatar: AvatarIcon } = $cerberusIcons\n const initials = (ariaLabel || '')\n .split(' ')\n .map((word) => word[0])\n .join('')\n .slice(0, 2)\n\n return (\n <div\n {...nativeProps}\n className={cx(\n nativeProps.className,\n avatar({ gradient, size }),\n circle(),\n )}\n >\n <Show\n when={Boolean(src) || Boolean(as)}\n fallback={\n <Show\n when={Boolean(initials)}\n fallback={\n <Show\n when={Boolean(icon)}\n fallback={\n <AvatarIcon\n size={iconSizeMap[size as keyof typeof iconSizeMap]}\n />\n }\n >\n {icon}\n </Show>\n }\n >\n {initials}\n </Show>\n }\n >\n <Show\n when={Boolean(as)}\n fallback={\n <img\n alt={props.ariaLabel}\n className={css({\n h: 'full',\n objectFit: 'cover',\n w: 'full',\n })}\n decoding=\"async\"\n loading=\"lazy\"\n src={src}\n height={height}\n width={width}\n />\n }\n >\n {as}\n </Show>\n </Show>\n </div>\n )\n}\n\nconst iconSizeMap = {\n xs: 16,\n sm: 16,\n md: 20,\n lg: 34,\n xl: 32,\n '2xl': 32,\n '3xl': 32,\n '4xl': 32,\n}\n"],"mappings":";;;;;;;;AAAA,SAAS,KAAK,UAAU;AACxB,SAAS,cAAc;AACvB;AAAA,EACE;AAAA,OAEK;AA+EW;AArCX,SAAS,OAAO,OAAoB;AACzC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAG;AAAA,EACL,IAAI;AACJ,QAAM,EAAE,QAAQ,WAAW,IAAI;AAC/B,QAAM,YAAY,aAAa,IAC5B,MAAM,GAAG,EACT,IAAI,CAAC,SAAS,KAAK,CAAC,CAAC,EACrB,KAAK,EAAE,EACP,MAAM,GAAG,CAAC;AAEb,SACE;AAAA,IAAC;AAAA;AAAA,MACE,GAAG;AAAA,MACJ,WAAW;AAAA,QACT,YAAY;AAAA,QACZ,OAAO,EAAE,UAAU,KAAK,CAAC;AAAA,QACzB,OAAO;AAAA,MACT;AAAA,MAEA;AAAA,QAAC;AAAA;AAAA,UACC,MAAM,QAAQ,GAAG,KAAK,QAAQ,EAAE;AAAA,UAChC,UACE;AAAA,YAAC;AAAA;AAAA,cACC,MAAM,QAAQ,QAAQ;AAAA,cACtB,UACE;AAAA,gBAAC;AAAA;AAAA,kBACC,MAAM,QAAQ,IAAI;AAAA,kBAClB,UACE;AAAA,oBAAC;AAAA;AAAA,sBACC,MAAM,YAAY,IAAgC;AAAA;AAAA,kBACpD;AAAA,kBAGD;AAAA;AAAA,cACH;AAAA,cAGD;AAAA;AAAA,UACH;AAAA,UAGF;AAAA,YAAC;AAAA;AAAA,cACC,MAAM,QAAQ,EAAE;AAAA,cAChB,UACE;AAAA,gBAAC;AAAA;AAAA,kBACC,KAAK,MAAM;AAAA,kBACX,WAAW,IAAI;AAAA,oBACb,GAAG;AAAA,oBACH,WAAW;AAAA,oBACX,GAAG;AAAA,kBACL,CAAC;AAAA,kBACD,UAAS;AAAA,kBACT,SAAQ;AAAA,kBACR;AAAA,kBACA;AAAA,kBACA;AAAA;AAAA,cACF;AAAA,cAGD;AAAA;AAAA,UACH;AAAA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;AAEA,IAAM,cAAc;AAAA,EAClB,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,OAAO;AAAA,EACP,OAAO;AAAA,EACP,OAAO;AACT;","names":[]}
@@ -6,7 +6,7 @@ import {
6
6
  } from "./chunk-ZAU4JVLL.js";
7
7
  import {
8
8
  $cerberusIcons
9
- } from "./chunk-5WVXIAG2.js";
9
+ } from "./chunk-NBG2OSYI.js";
10
10
 
11
11
  // src/components/Select.tsx
12
12
  import { cx } from "@cerberus/styled-system/css";
@@ -65,4 +65,4 @@ export {
65
65
  Select,
66
66
  Option
67
67
  };
68
- //# sourceMappingURL=chunk-RHG26FYL.js.map
68
+ //# sourceMappingURL=chunk-VRPAW76S.js.map
@@ -6,7 +6,7 @@ import {
6
6
  } from "./chunk-ZAU4JVLL.js";
7
7
  import {
8
8
  $cerberusIcons
9
- } from "./chunk-5WVXIAG2.js";
9
+ } from "./chunk-NBG2OSYI.js";
10
10
 
11
11
  // src/components/Checkbox.tsx
12
12
  import {
@@ -53,4 +53,4 @@ function Checkbox(props) {
53
53
  export {
54
54
  Checkbox
55
55
  };
56
- //# sourceMappingURL=chunk-4FD33RTW.js.map
56
+ //# sourceMappingURL=chunk-ZCIJRM2X.js.map
@@ -0,0 +1,11 @@
1
+ import {
2
+ Avatar
3
+ } from "../chunk-UN3OAW56.js";
4
+ import "../chunk-4O4QFF4S.js";
5
+ import "../chunk-NBG2OSYI.js";
6
+ import "../chunk-BDCFYW34.js";
7
+ import "../chunk-CP7OUC2Q.js";
8
+ export {
9
+ Avatar
10
+ };
11
+ //# sourceMappingURL=Avatar.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
@@ -1,11 +1,11 @@
1
1
  "use client";
2
2
  import {
3
3
  Checkbox
4
- } from "../chunk-4FD33RTW.js";
4
+ } from "../chunk-ZCIJRM2X.js";
5
5
  import "../chunk-4O4QFF4S.js";
6
6
  import "../chunk-ZAU4JVLL.js";
7
- import "../chunk-5WVXIAG2.js";
8
- import "../chunk-GUECLKHY.js";
7
+ import "../chunk-NBG2OSYI.js";
8
+ import "../chunk-BDCFYW34.js";
9
9
  import "../chunk-CP7OUC2Q.js";
10
10
  export {
11
11
  Checkbox
@@ -2,13 +2,13 @@
2
2
  import {
3
3
  FileStatus,
4
4
  processStatus
5
- } from "../chunk-7NX4RGDB.js";
5
+ } from "../chunk-MLCVO7JP.js";
6
6
  import "../chunk-TYTEREKZ.js";
7
7
  import "../chunk-SLHX5K6I.js";
8
8
  import "../chunk-VGHVH2T3.js";
9
9
  import "../chunk-ZAU4JVLL.js";
10
- import "../chunk-5WVXIAG2.js";
11
- import "../chunk-GUECLKHY.js";
10
+ import "../chunk-NBG2OSYI.js";
11
+ import "../chunk-BDCFYW34.js";
12
12
  import "../chunk-CP7OUC2Q.js";
13
13
  export {
14
14
  FileStatus,
@@ -1,10 +1,10 @@
1
1
  "use client";
2
2
  import {
3
3
  FileUploader
4
- } from "../chunk-TF3HRELU.js";
4
+ } from "../chunk-TUIVLIJI.js";
5
5
  import "../chunk-4O4QFF4S.js";
6
- import "../chunk-5WVXIAG2.js";
7
- import "../chunk-GUECLKHY.js";
6
+ import "../chunk-NBG2OSYI.js";
7
+ import "../chunk-BDCFYW34.js";
8
8
  import "../chunk-CP7OUC2Q.js";
9
9
  export {
10
10
  FileUploader
@@ -1,11 +1,11 @@
1
1
  "use client";
2
2
  import {
3
3
  Input
4
- } from "../chunk-53QBTZZF.js";
4
+ } from "../chunk-FMFKM2AB.js";
5
5
  import "../chunk-4O4QFF4S.js";
6
6
  import "../chunk-ZAU4JVLL.js";
7
- import "../chunk-5WVXIAG2.js";
8
- import "../chunk-GUECLKHY.js";
7
+ import "../chunk-NBG2OSYI.js";
8
+ import "../chunk-BDCFYW34.js";
9
9
  import "../chunk-CP7OUC2Q.js";
10
10
  export {
11
11
  Input
@@ -1,10 +1,10 @@
1
1
  "use client";
2
2
  import {
3
3
  Notification
4
- } from "../chunk-EJIMJWPB.js";
4
+ } from "../chunk-QZ6NS6VN.js";
5
5
  import "../chunk-JIZQFTW6.js";
6
- import "../chunk-5WVXIAG2.js";
7
- import "../chunk-GUECLKHY.js";
6
+ import "../chunk-NBG2OSYI.js";
7
+ import "../chunk-BDCFYW34.js";
8
8
  import "../chunk-CP7OUC2Q.js";
9
9
  export {
10
10
  Notification
@@ -2,11 +2,11 @@
2
2
  import {
3
3
  Option,
4
4
  Select
5
- } from "../chunk-RHG26FYL.js";
5
+ } from "../chunk-VRPAW76S.js";
6
6
  import "../chunk-4O4QFF4S.js";
7
7
  import "../chunk-ZAU4JVLL.js";
8
- import "../chunk-5WVXIAG2.js";
9
- import "../chunk-GUECLKHY.js";
8
+ import "../chunk-NBG2OSYI.js";
9
+ import "../chunk-BDCFYW34.js";
10
10
  import "../chunk-CP7OUC2Q.js";
11
11
  export {
12
12
  Option,
@@ -1,10 +1,10 @@
1
1
  "use client";
2
2
  import {
3
3
  Toggle
4
- } from "../chunk-ID3XWGLY.js";
4
+ } from "../chunk-4YJOK7JJ.js";
5
5
  import "../chunk-ZAU4JVLL.js";
6
- import "../chunk-5WVXIAG2.js";
7
- import "../chunk-GUECLKHY.js";
6
+ import "../chunk-NBG2OSYI.js";
7
+ import "../chunk-BDCFYW34.js";
8
8
  import "../chunk-CP7OUC2Q.js";
9
9
  export {
10
10
  Toggle
@@ -1,6 +1,6 @@
1
1
  import {
2
2
  defaultIcons
3
- } from "../chunk-GUECLKHY.js";
3
+ } from "../chunk-BDCFYW34.js";
4
4
  import "../chunk-CP7OUC2Q.js";
5
5
  export {
6
6
  defaultIcons
@@ -1,8 +1,8 @@
1
1
  import {
2
2
  $cerberusIcons,
3
3
  defineIcons
4
- } from "../chunk-5WVXIAG2.js";
5
- import "../chunk-GUECLKHY.js";
4
+ } from "../chunk-NBG2OSYI.js";
5
+ import "../chunk-BDCFYW34.js";
6
6
  import "../chunk-CP7OUC2Q.js";
7
7
  export {
8
8
  $cerberusIcons,
@@ -2,18 +2,18 @@
2
2
  import {
3
3
  ConfirmModal,
4
4
  useConfirmModal
5
- } from "../chunk-GZY6CH7D.js";
6
- import "../chunk-VCR5C6Q3.js";
5
+ } from "../chunk-GB3SECCO.js";
7
6
  import "../chunk-4CAT3FHV.js";
7
+ import "../chunk-JB7IQ2BM.js";
8
+ import "../chunk-VCR5C6Q3.js";
8
9
  import "../chunk-2UFNQM55.js";
9
10
  import "../chunk-4M4LCQ43.js";
10
11
  import "../chunk-QU7UV5DB.js";
11
- import "../chunk-JB7IQ2BM.js";
12
12
  import "../chunk-6F34A7NZ.js";
13
13
  import "../chunk-4O4QFF4S.js";
14
14
  import "../chunk-JIZQFTW6.js";
15
- import "../chunk-5WVXIAG2.js";
16
- import "../chunk-GUECLKHY.js";
15
+ import "../chunk-NBG2OSYI.js";
16
+ import "../chunk-BDCFYW34.js";
17
17
  import "../chunk-CP7OUC2Q.js";
18
18
  import "../chunk-C5HLLGME.js";
19
19
  export {
@@ -2,16 +2,16 @@
2
2
  import {
3
3
  NotificationCenter,
4
4
  useNotificationCenter
5
- } from "../chunk-VPWBSZAR.js";
6
- import "../chunk-EJIMJWPB.js";
5
+ } from "../chunk-KKJKOKP7.js";
6
+ import "../chunk-4CAT3FHV.js";
7
+ import "../chunk-QZ6NS6VN.js";
7
8
  import "../chunk-HW76XVA3.js";
8
9
  import "../chunk-3C2DJSEE.js";
9
- import "../chunk-4CAT3FHV.js";
10
10
  import "../chunk-6F34A7NZ.js";
11
11
  import "../chunk-4O4QFF4S.js";
12
12
  import "../chunk-JIZQFTW6.js";
13
- import "../chunk-5WVXIAG2.js";
14
- import "../chunk-GUECLKHY.js";
13
+ import "../chunk-NBG2OSYI.js";
14
+ import "../chunk-BDCFYW34.js";
15
15
  import "../chunk-CP7OUC2Q.js";
16
16
  export {
17
17
  NotificationCenter,