@cerberus-design/react 0.9.2-next-dd3210f → 0.9.2-next-863daf6

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.
@@ -1303,6 +1303,16 @@ declare type ShowResult = ((value: boolean | PromiseLike<boolean>) => void) | nu
1303
1303
  export { ShowResult }
1304
1304
  export { ShowResult as ShowResult_alias_1 }
1305
1305
 
1306
+ declare function Spinner(props: SpinnerProps): JSX_2.Element;
1307
+ export { Spinner }
1308
+ export { Spinner as Spinner_alias_1 }
1309
+
1310
+ declare type SpinnerProps = SVGProps<SVGSVGElement> & {
1311
+ size?: number | string;
1312
+ };
1313
+ export { SpinnerProps }
1314
+ export { SpinnerProps as SpinnerProps_alias_1 }
1315
+
1306
1316
  /**
1307
1317
  * This module contains the tag component.
1308
1318
  * @module
@@ -0,0 +1,80 @@
1
+ // src/components/Spinner.tsx
2
+ import { jsx, jsxs } from "react/jsx-runtime";
3
+ function Spinner(props) {
4
+ return /* @__PURE__ */ jsx(
5
+ "svg",
6
+ {
7
+ "aria-busy": "true",
8
+ role: "status",
9
+ xmlns: "http://www.w3.org/2000/svg",
10
+ height: props.size,
11
+ width: props.size,
12
+ viewBox: "0 0 24 24",
13
+ ...props,
14
+ children: /* @__PURE__ */ jsxs(
15
+ "g",
16
+ {
17
+ fill: "none",
18
+ stroke: "currentColor",
19
+ strokeLinecap: "round",
20
+ strokeLinejoin: "round",
21
+ strokeWidth: 2,
22
+ children: [
23
+ /* @__PURE__ */ jsxs(
24
+ "path",
25
+ {
26
+ strokeDasharray: 16,
27
+ strokeDashoffset: 16,
28
+ d: "M12 3c4.97 0 9 4.03 9 9",
29
+ children: [
30
+ /* @__PURE__ */ jsx(
31
+ "animate",
32
+ {
33
+ fill: "freeze",
34
+ attributeName: "stroke-dashoffset",
35
+ dur: "0.15s",
36
+ values: "16;0"
37
+ }
38
+ ),
39
+ /* @__PURE__ */ jsx(
40
+ "animateTransform",
41
+ {
42
+ attributeName: "transform",
43
+ dur: "0.75s",
44
+ repeatCount: "indefinite",
45
+ type: "rotate",
46
+ values: "0 12 12;360 12 12"
47
+ }
48
+ )
49
+ ]
50
+ }
51
+ ),
52
+ /* @__PURE__ */ jsx(
53
+ "path",
54
+ {
55
+ strokeDasharray: 64,
56
+ strokeDashoffset: 64,
57
+ strokeOpacity: 0.3,
58
+ d: "M12 3c4.97 0 9 4.03 9 9c0 4.97 -4.03 9 -9 9c-4.97 0 -9 -4.03 -9 -9c0 -4.97 4.03 -9 9 -9Z",
59
+ children: /* @__PURE__ */ jsx(
60
+ "animate",
61
+ {
62
+ fill: "freeze",
63
+ attributeName: "stroke-dashoffset",
64
+ dur: "0.6s",
65
+ values: "64;0"
66
+ }
67
+ )
68
+ }
69
+ )
70
+ ]
71
+ }
72
+ )
73
+ }
74
+ );
75
+ }
76
+
77
+ export {
78
+ Spinner
79
+ };
80
+ //# sourceMappingURL=chunk-RN6HSKIG.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/components/Spinner.tsx"],"sourcesContent":["import type { SVGProps } from 'react'\n\nexport type SpinnerProps = SVGProps<SVGSVGElement> & {\n size?: number | string\n}\n\nexport function Spinner(props: SpinnerProps) {\n return (\n <svg\n aria-busy=\"true\"\n role=\"status\"\n xmlns=\"http://www.w3.org/2000/svg\"\n height={props.size}\n width={props.size}\n viewBox=\"0 0 24 24\"\n {...props}\n >\n <g\n fill=\"none\"\n stroke=\"currentColor\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n strokeWidth={2}\n >\n <path\n strokeDasharray={16}\n strokeDashoffset={16}\n d=\"M12 3c4.97 0 9 4.03 9 9\"\n >\n <animate\n fill=\"freeze\"\n attributeName=\"stroke-dashoffset\"\n dur=\"0.15s\"\n values=\"16;0\"\n ></animate>\n <animateTransform\n attributeName=\"transform\"\n dur=\"0.75s\"\n repeatCount=\"indefinite\"\n type=\"rotate\"\n values=\"0 12 12;360 12 12\"\n ></animateTransform>\n </path>\n <path\n strokeDasharray={64}\n strokeDashoffset={64}\n strokeOpacity={0.3}\n d=\"M12 3c4.97 0 9 4.03 9 9c0 4.97 -4.03 9 -9 9c-4.97 0 -9 -4.03 -9 -9c0 -4.97 4.03 -9 9 -9Z\"\n >\n <animate\n fill=\"freeze\"\n attributeName=\"stroke-dashoffset\"\n dur=\"0.6s\"\n values=\"64;0\"\n ></animate>\n </path>\n </g>\n </svg>\n )\n}\n"],"mappings":";AAwBQ,SAKE,KALF;AAlBD,SAAS,QAAQ,OAAqB;AAC3C,SACE;AAAA,IAAC;AAAA;AAAA,MACC,aAAU;AAAA,MACV,MAAK;AAAA,MACL,OAAM;AAAA,MACN,QAAQ,MAAM;AAAA,MACd,OAAO,MAAM;AAAA,MACb,SAAQ;AAAA,MACP,GAAG;AAAA,MAEJ;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,QAAO;AAAA,UACP,eAAc;AAAA,UACd,gBAAe;AAAA,UACf,aAAa;AAAA,UAEb;AAAA;AAAA,cAAC;AAAA;AAAA,gBACC,iBAAiB;AAAA,gBACjB,kBAAkB;AAAA,gBAClB,GAAE;AAAA,gBAEF;AAAA;AAAA,oBAAC;AAAA;AAAA,sBACC,MAAK;AAAA,sBACL,eAAc;AAAA,sBACd,KAAI;AAAA,sBACJ,QAAO;AAAA;AAAA,kBACR;AAAA,kBACD;AAAA,oBAAC;AAAA;AAAA,sBACC,eAAc;AAAA,sBACd,KAAI;AAAA,sBACJ,aAAY;AAAA,sBACZ,MAAK;AAAA,sBACL,QAAO;AAAA;AAAA,kBACR;AAAA;AAAA;AAAA,YACH;AAAA,YACA;AAAA,cAAC;AAAA;AAAA,gBACC,iBAAiB;AAAA,gBACjB,kBAAkB;AAAA,gBAClB,eAAe;AAAA,gBACf,GAAE;AAAA,gBAEF;AAAA,kBAAC;AAAA;AAAA,oBACC,MAAK;AAAA,oBACL,eAAc;AAAA,oBACd,KAAI;AAAA,oBACJ,QAAO;AAAA;AAAA,gBACR;AAAA;AAAA,YACH;AAAA;AAAA;AAAA,MACF;AAAA;AAAA,EACF;AAEJ;","names":[]}
@@ -0,0 +1,7 @@
1
+ import {
2
+ Spinner
3
+ } from "../chunk-RN6HSKIG.js";
4
+ export {
5
+ Spinner
6
+ };
7
+ //# sourceMappingURL=Spinner.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":[],"sourcesContent":[],"mappings":"","names":[]}
@@ -1,3 +1,7 @@
1
+ import {
2
+ ConfirmModal,
3
+ useConfirmModal
4
+ } from "./chunk-RSFFVJSM.js";
1
5
  import {
2
6
  NotificationCenter,
3
7
  useNotificationCenter
@@ -10,6 +14,10 @@ import {
10
14
  ThemeProvider,
11
15
  useThemeContext
12
16
  } from "./chunk-S3MTABYX.js";
17
+ import {
18
+ Table,
19
+ Tr
20
+ } from "./chunk-A5WYZVUR.js";
13
21
  import {
14
22
  Tag
15
23
  } from "./chunk-RBZAEOKN.js";
@@ -31,10 +39,6 @@ import {
31
39
  import {
32
40
  Toggle
33
41
  } from "./chunk-4YJOK7JJ.js";
34
- import {
35
- ConfirmModal,
36
- useConfirmModal
37
- } from "./chunk-RSFFVJSM.js";
38
42
  import {
39
43
  Radio
40
44
  } from "./chunk-PH64POOB.js";
@@ -42,6 +46,9 @@ import {
42
46
  Option,
43
47
  Select
44
48
  } from "./chunk-VRPAW76S.js";
49
+ import {
50
+ Spinner
51
+ } from "./chunk-RN6HSKIG.js";
45
52
  import {
46
53
  Tab
47
54
  } from "./chunk-SONHHNYQ.js";
@@ -51,10 +58,6 @@ import {
51
58
  import {
52
59
  TabPanel
53
60
  } from "./chunk-U72VPIZA.js";
54
- import {
55
- Table,
56
- Tr
57
- } from "./chunk-A5WYZVUR.js";
58
61
  import {
59
62
  ModalHeading
60
63
  } from "./chunk-JB7IQ2BM.js";
@@ -212,6 +215,7 @@ export {
212
215
  Radio,
213
216
  Select,
214
217
  Show,
218
+ Spinner,
215
219
  THEME_KEY,
216
220
  Tab,
217
221
  TabList,
@@ -1 +1 @@
1
- {"version":3,"sources":["../../src/index.ts"],"sourcesContent":["/**\n * This module is the entry point for the Cerberus React package.\n * @module\n */\n\n// components\n\nexport * from './components/Avatar'\nexport * from './components/Button'\nexport * from './components/Checkbox'\nexport * from './components/Droppable'\nexport * from './components/FieldMessage'\nexport * from './components/FeatureFlag'\nexport * from './components/FileStatus'\nexport * from './components/FileUploader'\nexport * from './components/IconButton'\nexport * from './components/Input'\nexport * from './components/Label'\nexport * from './components/Modal'\nexport * from './components/ModalHeader'\nexport * from './components/ModalHeading'\nexport * from './components/ModalDescription'\nexport * from './components/NavMenuTrigger'\nexport * from './components/NavMenuList'\nexport * from './components/NavMenuLink'\nexport * from './components/Notification'\nexport * from './components/NotificationHeading'\nexport * from './components/NotificationDescription'\nexport * from './components/Portal'\nexport * from './components/ProgressBar'\nexport * from './components/Radio'\nexport * from './components/Select'\nexport * from './components/Tab'\nexport * from './components/TabList'\nexport * from './components/TabPanel'\nexport * from './components/Table'\nexport * from './components/Thead'\nexport * from './components/Th'\nexport * from './components/Td'\nexport * from './components/Tbody'\nexport * from './components/Tag'\nexport * from './components/Textarea'\nexport * from './components/Toggle'\nexport * from './components/Show'\n\n// context\n\nexport * from './context/confirm-modal'\nexport * from './context/feature-flags'\nexport * from './context/field'\nexport * from './context/navMenu'\nexport * from './context/notification-center'\nexport * from './context/prompt-modal'\nexport * from './context/tabs'\nexport * from './context/theme'\n\n// hooks\n\nexport * from './hooks/useModal'\nexport * from './hooks/useTheme'\nexport * from './hooks/useToggle'\n\n// aria-helpers\n\nexport * from './aria-helpers/nav-menu.aria'\nexport * from './aria-helpers/tabs.aria'\nexport * from './aria-helpers/trap-focus.aria'\n\n// utils\n\nexport * from './config/defineIcons'\n\n// shared types\n\nexport * from './types'\n\n// 3rd party\n\nexport * from '@dnd-kit/core'\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA8EA,cAAc;","names":[]}
1
+ {"version":3,"sources":["../../src/index.ts"],"sourcesContent":["/**\n * This module is the entry point for the Cerberus React package.\n * @module\n */\n\n// components\n\nexport * from './components/Avatar'\nexport * from './components/Button'\nexport * from './components/Checkbox'\nexport * from './components/Droppable'\nexport * from './components/FieldMessage'\nexport * from './components/FeatureFlag'\nexport * from './components/FileStatus'\nexport * from './components/FileUploader'\nexport * from './components/IconButton'\nexport * from './components/Input'\nexport * from './components/Label'\nexport * from './components/Modal'\nexport * from './components/ModalHeader'\nexport * from './components/ModalHeading'\nexport * from './components/ModalDescription'\nexport * from './components/NavMenuTrigger'\nexport * from './components/NavMenuList'\nexport * from './components/NavMenuLink'\nexport * from './components/Notification'\nexport * from './components/NotificationHeading'\nexport * from './components/NotificationDescription'\nexport * from './components/Portal'\nexport * from './components/ProgressBar'\nexport * from './components/Radio'\nexport * from './components/Select'\nexport * from './components/Spinner'\nexport * from './components/Tab'\nexport * from './components/TabList'\nexport * from './components/TabPanel'\nexport * from './components/Table'\nexport * from './components/Thead'\nexport * from './components/Th'\nexport * from './components/Td'\nexport * from './components/Tbody'\nexport * from './components/Tag'\nexport * from './components/Textarea'\nexport * from './components/Toggle'\nexport * from './components/Show'\n\n// context\n\nexport * from './context/confirm-modal'\nexport * from './context/feature-flags'\nexport * from './context/field'\nexport * from './context/navMenu'\nexport * from './context/notification-center'\nexport * from './context/prompt-modal'\nexport * from './context/tabs'\nexport * from './context/theme'\n\n// hooks\n\nexport * from './hooks/useModal'\nexport * from './hooks/useTheme'\nexport * from './hooks/useToggle'\n\n// aria-helpers\n\nexport * from './aria-helpers/nav-menu.aria'\nexport * from './aria-helpers/tabs.aria'\nexport * from './aria-helpers/trap-focus.aria'\n\n// utils\n\nexport * from './config/defineIcons'\n\n// shared types\n\nexport * from './types'\n\n// 3rd party\n\nexport * from '@dnd-kit/core'\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AA+EA,cAAc;","names":[]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@cerberus-design/react",
3
- "version": "0.9.2-next-dd3210f",
3
+ "version": "0.9.2-next-863daf6",
4
4
  "description": "The Cerberus Design React component library.",
5
5
  "browserslist": "> 0.25%, not dead",
6
6
  "sideEffects": false,
@@ -25,8 +25,8 @@
25
25
  "react": "^18",
26
26
  "react-dom": "^18",
27
27
  "tsup": "^8.1.0",
28
- "@cerberus-design/configs": "0.0.0",
29
- "@cerberus-design/styled-system": "0.9.2-next-dd3210f"
28
+ "@cerberus-design/styled-system": "0.9.2-next-863daf6",
29
+ "@cerberus-design/configs": "0.0.0"
30
30
  },
31
31
  "publishConfig": {
32
32
  "access": "public"
@@ -0,0 +1,60 @@
1
+ import type { SVGProps } from 'react'
2
+
3
+ export type SpinnerProps = SVGProps<SVGSVGElement> & {
4
+ size?: number | string
5
+ }
6
+
7
+ export function Spinner(props: SpinnerProps) {
8
+ return (
9
+ <svg
10
+ aria-busy="true"
11
+ role="status"
12
+ xmlns="http://www.w3.org/2000/svg"
13
+ height={props.size}
14
+ width={props.size}
15
+ viewBox="0 0 24 24"
16
+ {...props}
17
+ >
18
+ <g
19
+ fill="none"
20
+ stroke="currentColor"
21
+ strokeLinecap="round"
22
+ strokeLinejoin="round"
23
+ strokeWidth={2}
24
+ >
25
+ <path
26
+ strokeDasharray={16}
27
+ strokeDashoffset={16}
28
+ d="M12 3c4.97 0 9 4.03 9 9"
29
+ >
30
+ <animate
31
+ fill="freeze"
32
+ attributeName="stroke-dashoffset"
33
+ dur="0.15s"
34
+ values="16;0"
35
+ ></animate>
36
+ <animateTransform
37
+ attributeName="transform"
38
+ dur="0.75s"
39
+ repeatCount="indefinite"
40
+ type="rotate"
41
+ values="0 12 12;360 12 12"
42
+ ></animateTransform>
43
+ </path>
44
+ <path
45
+ strokeDasharray={64}
46
+ strokeDashoffset={64}
47
+ strokeOpacity={0.3}
48
+ d="M12 3c4.97 0 9 4.03 9 9c0 4.97 -4.03 9 -9 9c-4.97 0 -9 -4.03 -9 -9c0 -4.97 4.03 -9 9 -9Z"
49
+ >
50
+ <animate
51
+ fill="freeze"
52
+ attributeName="stroke-dashoffset"
53
+ dur="0.6s"
54
+ values="64;0"
55
+ ></animate>
56
+ </path>
57
+ </g>
58
+ </svg>
59
+ )
60
+ }
package/src/index.ts CHANGED
@@ -30,6 +30,7 @@ export * from './components/Portal'
30
30
  export * from './components/ProgressBar'
31
31
  export * from './components/Radio'
32
32
  export * from './components/Select'
33
+ export * from './components/Spinner'
33
34
  export * from './components/Tab'
34
35
  export * from './components/TabList'
35
36
  export * from './components/TabPanel'