@szum-tech/design-system 2.7.0 → 3.0.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 (126) hide show
  1. package/dist/chunk-2Y2ZCPNV.cjs +61 -0
  2. package/dist/chunk-3376ZTRC.cjs +2 -0
  3. package/dist/{chunk-S5BN23O7.cjs → chunk-3KMXFN6M.cjs} +14 -20
  4. package/dist/chunk-5AA4IE2T.cjs +27 -0
  5. package/dist/chunk-5F2Y65JH.js +32 -0
  6. package/dist/chunk-6BSR3O2J.js +53 -0
  7. package/dist/chunk-BYXBJQAS.js +1 -0
  8. package/dist/{chunk-XIPREW2R.js → chunk-DP7UEOTA.js} +173 -176
  9. package/dist/chunk-HCHVDUI6.cjs +34 -0
  10. package/dist/chunk-HD7ZDQWW.js +173 -0
  11. package/dist/chunk-I3RSTJP6.js +20 -0
  12. package/dist/chunk-I7AV5IQO.cjs +33 -0
  13. package/dist/chunk-N4O2GO6V.cjs +204 -0
  14. package/dist/chunk-NGVFYKAT.js +29 -0
  15. package/dist/chunk-NU5UQPBX.cjs +25 -0
  16. package/dist/chunk-OQCNPNPS.js +23 -0
  17. package/dist/chunk-S3ANEJJ7.cjs +22 -0
  18. package/dist/chunk-U4AWAABZ.js +4901 -0
  19. package/dist/chunk-UGSNASZM.js +25 -0
  20. package/dist/{chunk-EIXSMEDP.cjs → chunk-UIOBJSKZ.cjs} +1 -3
  21. package/dist/{chunk-I5P2HH5Z.js → chunk-WJSS32MY.js} +13 -19
  22. package/dist/{chunk-GEACYHTU.js → chunk-XJIUGEPN.js} +1 -3
  23. package/dist/chunk-Y6EVJSAH.cjs +4928 -0
  24. package/dist/{chunk-D3MOZUNH.cjs → chunk-ZV4467OW.cjs} +176 -185
  25. package/dist/components/alert-dialog/index.cjs +1 -0
  26. package/dist/components/alert-dialog/index.js +1 -0
  27. package/dist/components/avatar/index.cjs +5 -4
  28. package/dist/components/avatar/index.d.cts +5 -19
  29. package/dist/components/avatar/index.d.ts +5 -19
  30. package/dist/components/avatar/index.js +2 -1
  31. package/dist/components/badge/index.cjs +1 -0
  32. package/dist/components/badge/index.js +1 -0
  33. package/dist/components/button/index.cjs +23 -3
  34. package/dist/components/button/index.d.cts +8 -15
  35. package/dist/components/button/index.d.ts +8 -15
  36. package/dist/components/button/index.js +22 -2
  37. package/dist/components/card/index.cjs +12 -7
  38. package/dist/components/card/index.d.cts +8 -5
  39. package/dist/components/card/index.d.ts +8 -5
  40. package/dist/components/card/index.js +2 -1
  41. package/dist/components/checkbox/index.cjs +12 -0
  42. package/dist/components/checkbox/index.d.cts +8 -0
  43. package/dist/components/checkbox/index.d.ts +8 -0
  44. package/dist/components/checkbox/index.js +3 -0
  45. package/dist/components/dialog/index.cjs +1 -0
  46. package/dist/components/dialog/index.d.cts +1 -1
  47. package/dist/components/dialog/index.d.ts +1 -1
  48. package/dist/components/dialog/index.js +1 -0
  49. package/dist/components/field/index.cjs +50 -0
  50. package/dist/components/field/index.d.cts +50 -0
  51. package/dist/components/field/index.d.ts +50 -0
  52. package/dist/components/field/index.js +5 -0
  53. package/dist/components/header/index.cjs +1 -0
  54. package/dist/components/header/index.js +1 -0
  55. package/dist/components/index.cjs +158 -126
  56. package/dist/components/index.d.cts +7 -8
  57. package/dist/components/index.d.ts +7 -8
  58. package/dist/components/index.js +14 -14
  59. package/dist/components/input/index.cjs +3 -2
  60. package/dist/components/input/index.d.cts +2 -4
  61. package/dist/components/input/index.d.ts +2 -4
  62. package/dist/components/input/index.js +2 -1
  63. package/dist/components/item/index.cjs +13 -12
  64. package/dist/components/item/index.d.cts +7 -7
  65. package/dist/components/item/index.d.ts +7 -7
  66. package/dist/components/item/index.js +3 -2
  67. package/dist/components/label/index.cjs +3 -2
  68. package/dist/components/label/index.js +2 -1
  69. package/dist/components/select/index.cjs +20 -3
  70. package/dist/components/select/index.d.cts +20 -6
  71. package/dist/components/select/index.d.ts +20 -6
  72. package/dist/components/select/index.js +2 -1
  73. package/dist/components/separator/index.cjs +3 -2
  74. package/dist/components/separator/index.js +2 -1
  75. package/dist/components/sheet/index.cjs +1 -0
  76. package/dist/components/sheet/index.d.cts +1 -1
  77. package/dist/components/sheet/index.d.ts +1 -1
  78. package/dist/components/sheet/index.js +1 -0
  79. package/dist/components/spinner/index.cjs +1 -0
  80. package/dist/components/spinner/index.js +1 -0
  81. package/dist/components/stepper/index.cjs +33 -33
  82. package/dist/components/stepper/index.js +14 -14
  83. package/dist/components/textarea/index.cjs +4 -2
  84. package/dist/components/textarea/index.d.cts +2 -2
  85. package/dist/components/textarea/index.d.ts +2 -2
  86. package/dist/components/textarea/index.js +3 -1
  87. package/dist/components/tooltip/index.cjs +1 -0
  88. package/dist/components/tooltip/index.js +1 -0
  89. package/dist/contexts/index.cjs +1 -0
  90. package/dist/contexts/index.js +1 -0
  91. package/dist/hooks/index.cjs +1 -0
  92. package/dist/hooks/index.js +1 -0
  93. package/dist/icons/index.cjs +89 -18
  94. package/dist/icons/index.js +88 -1
  95. package/dist/utils/index.cjs +1 -0
  96. package/dist/utils/index.js +1 -0
  97. package/package.json +8 -9
  98. package/tailwind/global.css +5 -9
  99. package/tailwind/palette.css +149 -204
  100. package/tailwind/typography.css +33 -57
  101. package/dist/chunk-36YD6ICC.js +0 -70
  102. package/dist/chunk-4NO6IM75.cjs +0 -40
  103. package/dist/chunk-5BTQ6BQA.js +0 -24
  104. package/dist/chunk-5PBHBOXI.js +0 -30
  105. package/dist/chunk-EU7G37IS.js +0 -36
  106. package/dist/chunk-FPFRA5Q6.cjs +0 -31
  107. package/dist/chunk-FVSO3RHT.cjs +0 -17
  108. package/dist/chunk-G6VXQ7DJ.cjs +0 -63
  109. package/dist/chunk-IAI7BIAG.js +0 -31
  110. package/dist/chunk-K4TRAPRN.cjs +0 -341
  111. package/dist/chunk-MI3CQBHC.js +0 -60
  112. package/dist/chunk-OIWEXHFE.cjs +0 -33
  113. package/dist/chunk-P4J2TTH7.cjs +0 -32
  114. package/dist/chunk-UKWZ5BHD.cjs +0 -93
  115. package/dist/chunk-VZKTT6CG.js +0 -15
  116. package/dist/chunk-XTO7CMIM.js +0 -88
  117. package/dist/chunk-YJFJLF7Y.js +0 -319
  118. package/dist/chunk-ZZ3EBGSD.cjs +0 -72
  119. package/dist/components/form/index.cjs +0 -55
  120. package/dist/components/form/index.d.cts +0 -32
  121. package/dist/components/form/index.d.ts +0 -32
  122. package/dist/components/form/index.js +0 -22
  123. package/dist/components/helper-text/index.cjs +0 -10
  124. package/dist/components/helper-text/index.d.cts +0 -18
  125. package/dist/components/helper-text/index.d.ts +0 -18
  126. package/dist/components/helper-text/index.js +0 -1
@@ -1,93 +0,0 @@
1
- 'use strict';
2
-
3
- var jsxRuntime = require('react/jsx-runtime');
4
-
5
- // src/icons/google-logo.tsx
6
- function GoogleLogoIcon(props) {
7
- return /* @__PURE__ */ jsxRuntime.jsxs(
8
- "svg",
9
- {
10
- xmlns: "http://www.w3.org/2000/svg",
11
- viewBox: "0 0 24 24",
12
- strokeWidth: "2",
13
- stroke: "currentColor",
14
- fill: "none",
15
- strokeLinecap: "round",
16
- strokeLinejoin: "round",
17
- ...props,
18
- children: [
19
- /* @__PURE__ */ jsxRuntime.jsx("path", { stroke: "none", d: "M0 0h24v24H0z", fill: "none" }),
20
- /* @__PURE__ */ jsxRuntime.jsx(
21
- "path",
22
- {
23
- d: "M12 2a9.96 9.96 0 0 1 6.29 2.226a1 1 0 0 1 .04 1.52l-1.51 1.362a1 1 0 0 1 -1.265 .06a6 6 0 1 0 2.103 6.836l.001 -.004h-3.66a1 1 0 0 1 -.992 -.883l-.007 -.117v-2a1 1 0 0 1 1 -1h6.945a1 1 0 0 1 .994 .89c.04 .367 .061 .737 .061 1.11c0 5.523 -4.477 10 -10 10s-10 -4.477 -10 -10s4.477 -10 10 -10z",
24
- strokeWidth: "0",
25
- fill: "currentColor"
26
- }
27
- )
28
- ]
29
- }
30
- );
31
- }
32
- function LoadingIcon(props) {
33
- return /* @__PURE__ */ jsxRuntime.jsx(
34
- "svg",
35
- {
36
- xmlns: "http://www.w3.org/2000/svg",
37
- xmlnsXlink: "http://www.w3.org/1999/xlink",
38
- fill: "currentColor",
39
- version: "1.1",
40
- viewBox: "0 0 26.349 26.35",
41
- xmlSpace: "preserve",
42
- ...props,
43
- children: /* @__PURE__ */ jsxRuntime.jsx("g", { children: /* @__PURE__ */ jsxRuntime.jsxs("g", { children: [
44
- /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "13.792", cy: "3.082", r: "3.082" }),
45
- /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "13.792", cy: "24.501", r: "1.849" }),
46
- /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "6.219", cy: "6.218", r: "2.774" }),
47
- /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "21.365", cy: "21.363", r: "1.541" }),
48
- /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "3.082", cy: "13.792", r: "2.465" }),
49
- /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "24.501", cy: "13.791", r: "1.232" }),
50
- /* @__PURE__ */ jsxRuntime.jsx("path", { d: "M4.694,19.84c-0.843,0.843-0.843,2.207,0,3.05c0.842,0.843,2.208,0.843,3.05,0c0.843-0.843,0.843-2.207,0-3.05 C6.902,18.996,5.537,18.988,4.694,19.84z" }),
51
- /* @__PURE__ */ jsxRuntime.jsx("circle", { cx: "21.364", cy: "6.218", r: "0.924" })
52
- ] }) })
53
- }
54
- );
55
- }
56
- function Auth0LogoIcon(props) {
57
- return /* @__PURE__ */ jsxRuntime.jsxs("svg", { viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
58
- /* @__PURE__ */ jsxRuntime.jsx("title", {}),
59
- /* @__PURE__ */ jsxRuntime.jsx(
60
- "path",
61
- {
62
- d: "M21.98 7.448L19.62 0H4.347L2.02 7.448c-1.352 4.312.03 9.206 3.815 12.015L12.007 24l6.157-4.552c3.755-2.81 5.182-7.688 3.815-12.015l-6.16 4.58 2.343 7.45-6.157-4.597-6.158 4.58 2.358-7.433-6.188-4.55 7.63-.045L12.008 0l2.356 7.404 7.615.044z",
63
- fill: "currentColor"
64
- }
65
- )
66
- ] });
67
- }
68
- function XLogoIcon(props) {
69
- return /* @__PURE__ */ jsxRuntime.jsx(
70
- "svg",
71
- {
72
- xmlns: "http://www.w3.org/2000/svg",
73
- version: "1.1",
74
- id: "Layer_1",
75
- width: "24px",
76
- height: "24px",
77
- viewBox: "0 0 24 24",
78
- ...props,
79
- children: /* @__PURE__ */ jsxRuntime.jsx(
80
- "path",
81
- {
82
- d: "M14.095479,10.316482L22.286354,1h-1.940718l-7.115352,8.087682L7.551414,1H1l8.589488,12.231093L1,23h1.940717 l7.509372-8.542861L16.448587,23H23L14.095479,10.316482z M11.436522,13.338465l-0.871624-1.218704l-6.924311-9.68815h2.981339 l5.58978,7.82155l0.867949,1.218704l7.26506,10.166271h-2.981339L11.436522,13.338465z",
83
- fill: "currentColor"
84
- }
85
- )
86
- }
87
- );
88
- }
89
-
90
- exports.Auth0LogoIcon = Auth0LogoIcon;
91
- exports.GoogleLogoIcon = GoogleLogoIcon;
92
- exports.LoadingIcon = LoadingIcon;
93
- exports.XLogoIcon = XLogoIcon;
@@ -1,15 +0,0 @@
1
- import { cn } from './chunk-ZD2QRAOX.js';
2
- import { Label as Label$1 } from 'radix-ui';
3
- import { jsx } from 'react/jsx-runtime';
4
-
5
- function Label({ className, ...props }) {
6
- return /* @__PURE__ */ jsx(
7
- Label$1.Root,
8
- {
9
- className: cn("text-subtitle-1 peer-disabled:cursor-not-allowed peer-disabled:opacity-70", className),
10
- ...props
11
- }
12
- );
13
- }
14
-
15
- export { Label };
@@ -1,88 +0,0 @@
1
- import { jsxs, jsx } from 'react/jsx-runtime';
2
-
3
- // src/icons/google-logo.tsx
4
- function GoogleLogoIcon(props) {
5
- return /* @__PURE__ */ jsxs(
6
- "svg",
7
- {
8
- xmlns: "http://www.w3.org/2000/svg",
9
- viewBox: "0 0 24 24",
10
- strokeWidth: "2",
11
- stroke: "currentColor",
12
- fill: "none",
13
- strokeLinecap: "round",
14
- strokeLinejoin: "round",
15
- ...props,
16
- children: [
17
- /* @__PURE__ */ jsx("path", { stroke: "none", d: "M0 0h24v24H0z", fill: "none" }),
18
- /* @__PURE__ */ jsx(
19
- "path",
20
- {
21
- d: "M12 2a9.96 9.96 0 0 1 6.29 2.226a1 1 0 0 1 .04 1.52l-1.51 1.362a1 1 0 0 1 -1.265 .06a6 6 0 1 0 2.103 6.836l.001 -.004h-3.66a1 1 0 0 1 -.992 -.883l-.007 -.117v-2a1 1 0 0 1 1 -1h6.945a1 1 0 0 1 .994 .89c.04 .367 .061 .737 .061 1.11c0 5.523 -4.477 10 -10 10s-10 -4.477 -10 -10s4.477 -10 10 -10z",
22
- strokeWidth: "0",
23
- fill: "currentColor"
24
- }
25
- )
26
- ]
27
- }
28
- );
29
- }
30
- function LoadingIcon(props) {
31
- return /* @__PURE__ */ jsx(
32
- "svg",
33
- {
34
- xmlns: "http://www.w3.org/2000/svg",
35
- xmlnsXlink: "http://www.w3.org/1999/xlink",
36
- fill: "currentColor",
37
- version: "1.1",
38
- viewBox: "0 0 26.349 26.35",
39
- xmlSpace: "preserve",
40
- ...props,
41
- children: /* @__PURE__ */ jsx("g", { children: /* @__PURE__ */ jsxs("g", { children: [
42
- /* @__PURE__ */ jsx("circle", { cx: "13.792", cy: "3.082", r: "3.082" }),
43
- /* @__PURE__ */ jsx("circle", { cx: "13.792", cy: "24.501", r: "1.849" }),
44
- /* @__PURE__ */ jsx("circle", { cx: "6.219", cy: "6.218", r: "2.774" }),
45
- /* @__PURE__ */ jsx("circle", { cx: "21.365", cy: "21.363", r: "1.541" }),
46
- /* @__PURE__ */ jsx("circle", { cx: "3.082", cy: "13.792", r: "2.465" }),
47
- /* @__PURE__ */ jsx("circle", { cx: "24.501", cy: "13.791", r: "1.232" }),
48
- /* @__PURE__ */ jsx("path", { d: "M4.694,19.84c-0.843,0.843-0.843,2.207,0,3.05c0.842,0.843,2.208,0.843,3.05,0c0.843-0.843,0.843-2.207,0-3.05 C6.902,18.996,5.537,18.988,4.694,19.84z" }),
49
- /* @__PURE__ */ jsx("circle", { cx: "21.364", cy: "6.218", r: "0.924" })
50
- ] }) })
51
- }
52
- );
53
- }
54
- function Auth0LogoIcon(props) {
55
- return /* @__PURE__ */ jsxs("svg", { viewBox: "0 0 24 24", xmlns: "http://www.w3.org/2000/svg", ...props, children: [
56
- /* @__PURE__ */ jsx("title", {}),
57
- /* @__PURE__ */ jsx(
58
- "path",
59
- {
60
- d: "M21.98 7.448L19.62 0H4.347L2.02 7.448c-1.352 4.312.03 9.206 3.815 12.015L12.007 24l6.157-4.552c3.755-2.81 5.182-7.688 3.815-12.015l-6.16 4.58 2.343 7.45-6.157-4.597-6.158 4.58 2.358-7.433-6.188-4.55 7.63-.045L12.008 0l2.356 7.404 7.615.044z",
61
- fill: "currentColor"
62
- }
63
- )
64
- ] });
65
- }
66
- function XLogoIcon(props) {
67
- return /* @__PURE__ */ jsx(
68
- "svg",
69
- {
70
- xmlns: "http://www.w3.org/2000/svg",
71
- version: "1.1",
72
- id: "Layer_1",
73
- width: "24px",
74
- height: "24px",
75
- viewBox: "0 0 24 24",
76
- ...props,
77
- children: /* @__PURE__ */ jsx(
78
- "path",
79
- {
80
- d: "M14.095479,10.316482L22.286354,1h-1.940718l-7.115352,8.087682L7.551414,1H1l8.589488,12.231093L1,23h1.940717 l7.509372-8.542861L16.448587,23H23L14.095479,10.316482z M11.436522,13.338465l-0.871624-1.218704l-6.924311-9.68815h2.981339 l5.58978,7.82155l0.867949,1.218704l7.26506,10.166271h-2.981339L11.436522,13.338465z",
81
- fill: "currentColor"
82
- }
83
- )
84
- }
85
- );
86
- }
87
-
88
- export { Auth0LogoIcon, GoogleLogoIcon, LoadingIcon, XLogoIcon };
@@ -1,319 +0,0 @@
1
- import { LoadingIcon } from './chunk-XTO7CMIM.js';
2
- import * as React from 'react';
3
- import { Slot } from '@radix-ui/react-slot';
4
- import { cva } from 'class-variance-authority';
5
- import { jsx, jsxs } from 'react/jsx-runtime';
6
-
7
- var buttonCva = cva(
8
- [
9
- "inline-flex cursor-pointer items-center justify-center align-middle no-underline transition-colors duration-300 ease-in-out",
10
- "select-none appearance-none rounded-sm border font-sans font-medium tracking-[.02857em]",
11
- "aria-disabled:pointer-events-none aria-disabled:cursor-not-allowed aria-disabled:opacity-50"
12
- ],
13
- {
14
- variants: {
15
- fullWidth: {
16
- true: "w-full"
17
- },
18
- color: {
19
- neutral: "",
20
- primary: "",
21
- success: "",
22
- warning: "",
23
- error: ""
24
- },
25
- size: {
26
- sm: "px-2.5 py-1 text-[.8125rem] leading-4",
27
- md: "px-4 py-1.5 text-[0.875rem] leading-5",
28
- lg: "px-5 py-2 text-[.9375rem] leading-6"
29
- },
30
- variant: {
31
- text: "border-transparent bg-transparent",
32
- outlined: "bg-transparent",
33
- contained: ""
34
- }
35
- },
36
- compoundVariants: [
37
- // ---------- TEXT ---------- //
38
- {
39
- variant: "text",
40
- color: "neutral",
41
- class: [
42
- "text-gray-100",
43
- "hover:text-app-foreground hover:border-gray-500 hover:bg-gray-500",
44
- "active:border-gray-600 active:bg-gray-600"
45
- ]
46
- },
47
- {
48
- variant: "text",
49
- color: "primary",
50
- class: [
51
- "text-primary-500",
52
- "hover:border-primary-500 hover:bg-primary-500 hover:text-white",
53
- "active:border-primary-600 active:bg-primary-600 active:text-white"
54
- ]
55
- },
56
- {
57
- variant: "text",
58
- color: "success",
59
- class: [
60
- "text-success-500",
61
- "hover:border-success-500 hover:bg-success-500 hover:text-white",
62
- "active:border-success-600 active:bg-success-600 active:text-white"
63
- ]
64
- },
65
- {
66
- variant: "text",
67
- color: "warning",
68
- class: [
69
- "text-warning-500",
70
- "hover:border-warning-500 hover:bg-warning-500 hover:text-white",
71
- "active:border-warning-600 active:bg-warning-600 active:text-white"
72
- ]
73
- },
74
- {
75
- variant: "text",
76
- color: "error",
77
- class: [
78
- "text-error-500",
79
- "hover:border-error-500 hover:bg-error-500 hover:text-white",
80
- "active:border-error-600 active:bg-error-600 active:text-white"
81
- ]
82
- },
83
- // ---------- OUTLINED ---------- //
84
- {
85
- variant: "outlined",
86
- color: "neutral",
87
- class: ["border-gray-500 text-gray-100", "hover:text-app-foreground hover:bg-gray-500", "active:bg-gray-600"]
88
- },
89
- {
90
- variant: "outlined",
91
- color: "primary",
92
- class: [
93
- "text-primary-500 border-primary-500",
94
- "hover:bg-primary-500 hover:text-white",
95
- "active:bg-primary-600 active:text-white"
96
- ]
97
- },
98
- {
99
- variant: "outlined",
100
- color: "success",
101
- class: [
102
- "text-success-500 border-success-500",
103
- "hover:bg-success-500 hover:text-white",
104
- "active:bg-success-600 active:text-white"
105
- ]
106
- },
107
- {
108
- variant: "outlined",
109
- color: "warning",
110
- class: [
111
- "text-warning-500 border-warning-500",
112
- "hover:bg-warning-500 hover:text-white",
113
- "active:bg-warning-600 active:text-white"
114
- ]
115
- },
116
- {
117
- variant: "outlined",
118
- color: "error",
119
- class: [
120
- "text-error-500 border-error-500",
121
- "hover:bg-error-500 hover:text-white",
122
- "active:bg-error-600 active:text-white"
123
- ]
124
- },
125
- // ---------- OUTLINED ---------- //
126
- {
127
- variant: "contained",
128
- color: "neutral",
129
- class: [
130
- "border-gray-500 bg-gray-500 text-gray-100",
131
- "hover:text-app-foreground hover:border-gray-400 hover:bg-gray-400",
132
- "active:border-gray-600 active:bg-gray-600"
133
- ]
134
- },
135
- {
136
- variant: "contained",
137
- color: "primary",
138
- class: [
139
- "border-primary-500 bg-primary-500 text-white",
140
- "hover:border-primary-400 hover:bg-primary-400",
141
- "active:border-primary-600 active:bg-primary-600"
142
- ]
143
- },
144
- {
145
- variant: "contained",
146
- color: "success",
147
- class: [
148
- "border-success-500 bg-success-500 text-white",
149
- "hover:border-success-400 hover:bg-success-400",
150
- "active:border-success-600 active:bg-success-600"
151
- ]
152
- },
153
- {
154
- variant: "contained",
155
- color: "warning",
156
- class: [
157
- "border-warning-500 bg-warning-500 text-white",
158
- "hover:border-warning-400 hover:bg-warning-400",
159
- "active:border-warning-600 active:bg-warning-600"
160
- ]
161
- },
162
- {
163
- variant: "contained",
164
- color: "error",
165
- class: [
166
- "border-error-500 bg-error-500 text-white",
167
- "hover:border-error-400 hover:bg-error-400",
168
- "active:border-error-600 active:bg-error-600"
169
- ]
170
- }
171
- ],
172
- defaultVariants: {
173
- fullWidth: false,
174
- color: "primary",
175
- size: "md",
176
- variant: "text"
177
- }
178
- }
179
- );
180
- var iconContainerCva = cva("", {
181
- variants: {
182
- site: {
183
- left: "",
184
- right: ""
185
- },
186
- size: {
187
- sm: "",
188
- md: "",
189
- lg: ""
190
- }
191
- },
192
- compoundVariants: [
193
- // ---------- LEFT ---------- //
194
- {
195
- site: "left",
196
- size: "sm",
197
- class: "-ml-0.5 mr-1.5"
198
- },
199
- {
200
- site: "left",
201
- size: "md",
202
- class: "-ml-1 mr-2"
203
- },
204
- {
205
- site: "left",
206
- size: "lg",
207
- class: "-ml-1.5 mr-2.5"
208
- },
209
- // ---------- RIGHT ---------- //
210
- {
211
- site: "right",
212
- size: "sm",
213
- class: "-mr-0.5 ml-1.5"
214
- },
215
- {
216
- site: "right",
217
- size: "md",
218
- class: "-mr-1 ml-2"
219
- },
220
- {
221
- site: "right",
222
- size: "lg",
223
- class: "-mr-1.5 ml-2.5"
224
- }
225
- ],
226
- defaultVariants: {
227
- site: "left",
228
- size: "md"
229
- }
230
- });
231
- var iconCva = cva("", {
232
- variants: {
233
- loading: {
234
- true: "animate-spin motion-reduce:hidden"
235
- },
236
- size: {
237
- sm: "h-4.5 w-4.5",
238
- md: "size-5",
239
- lg: "h-5.5 w-5.5"
240
- }
241
- },
242
- defaultVariants: {
243
- loading: false,
244
- size: "md"
245
- }
246
- });
247
- function Button({
248
- asChild = false,
249
- variant = "text",
250
- color = "primary",
251
- disabled = false,
252
- fullWidth = false,
253
- loadingPosition = "start",
254
- ref,
255
- ...props
256
- }) {
257
- const {
258
- children,
259
- type = "button",
260
- loading = false,
261
- size = "md",
262
- endIcon,
263
- startIcon,
264
- ...rest
265
- } = { ...props, loadingPosition };
266
- const Comp = asChild ? Slot : "button";
267
- const buttonStyles = buttonCva({ fullWidth, size, variant, color });
268
- const isDisabled = disabled || loading;
269
- return /* @__PURE__ */ jsx(
270
- Comp,
271
- {
272
- ...asChild ? props : rest,
273
- "aria-disabled": isDisabled || void 0,
274
- className: buttonStyles,
275
- "data-state": loading ? "loading" : void 0,
276
- disabled: isDisabled,
277
- ref,
278
- role: Comp !== "button" ? "button" : void 0,
279
- tabIndex: isDisabled ? -1 : 0,
280
- type: Comp === "button" ? type : void 0,
281
- children: asChild ? /* @__PURE__ */ jsx(ButtonContent, { children }) : /* @__PURE__ */ jsx(ButtonContent, { ...props })
282
- }
283
- );
284
- }
285
- function ButtonContent({
286
- children,
287
- loading = false,
288
- size = "md",
289
- loadingPosition = "start",
290
- startIcon,
291
- endIcon,
292
- ...props
293
- }) {
294
- const isStartLoading = loading && loadingPosition === "start";
295
- const StartIcon = isStartLoading ? /* @__PURE__ */ jsx(LoadingIcon, { "aria-label": "Loading" }) : startIcon || null;
296
- const startIconStyles = iconCva({ size, loading: isStartLoading });
297
- const startIconContainerStyles = iconContainerCva({ size, site: "left" });
298
- const isEndLoading = loading && loadingPosition === "end";
299
- const EndIcon = isEndLoading ? /* @__PURE__ */ jsx(LoadingIcon, { "aria-label": "Loading" }) : endIcon || null;
300
- const endIconStyles = iconCva({ size, loading: isEndLoading });
301
- const endIconContainerStyles = iconContainerCva({ size, site: "right" });
302
- const LeadingIcon = StartIcon ? /* @__PURE__ */ jsx("span", { className: startIconContainerStyles, role: isStartLoading ? "progressbar" : void 0, children: React.cloneElement(StartIcon, { className: startIconStyles }) }) : null;
303
- const TrailingIcon = EndIcon ? /* @__PURE__ */ jsx("span", { className: endIconContainerStyles, role: isEndLoading ? "progressbar" : void 0, children: React.cloneElement(EndIcon, { className: endIconStyles }) }) : null;
304
- return React.isValidElement(children) ? React.cloneElement(
305
- children,
306
- props,
307
- /* @__PURE__ */ jsxs(React.Fragment, { children: [
308
- LeadingIcon,
309
- React.isValidElement(children) ? children.props?.children : null,
310
- TrailingIcon
311
- ] })
312
- ) : /* @__PURE__ */ jsxs(React.Fragment, { children: [
313
- LeadingIcon,
314
- children,
315
- TrailingIcon
316
- ] });
317
- }
318
-
319
- export { Button };
@@ -1,72 +0,0 @@
1
- 'use strict';
2
-
3
- var chunkH2BWO3SI_cjs = require('./chunk-H2BWO3SI.cjs');
4
- var classVarianceAuthority = require('class-variance-authority');
5
- var jsxRuntime = require('react/jsx-runtime');
6
-
7
- var inputCva = classVarianceAuthority.cva(
8
- [
9
- "bg-app-foreground font-poppins h-10 w-full appearance-none border py-2 outline-0 transition-colors duration-300 ease-in-out",
10
- "placeholder:select-none placeholder:text-gray-400",
11
- "invalid:border-error-500 focus:border-primary-500 active:border-primary-500",
12
- "disabled:cursor-not-allowed disabled:border-gray-800 disabled:text-gray-300 disabled:placeholder:text-gray-600"
13
- ],
14
- {
15
- variants: {
16
- invalid: {
17
- true: ["text-error-500 border-error-500 hover:border-error-400 focus:text-gray-100"],
18
- false: ["hover:border-primary-600 border-gray-600 text-gray-100"]
19
- },
20
- withStartIcon: {
21
- true: "pl-11",
22
- false: "pl-3"
23
- },
24
- withEndIcon: {
25
- true: "pr-11",
26
- false: "pr-3"
27
- }
28
- },
29
- defaultVariants: {
30
- invalid: false,
31
- withStartIcon: false,
32
- withEndIcon: false
33
- }
34
- }
35
- );
36
- var inputIconContainerCva = classVarianceAuthority.cva(
37
- ["pointer-events-none absolute inset-y-2 inline-flex w-10 place-content-center items-center text-center"],
38
- {
39
- variants: {
40
- disabled: {
41
- true: "text-gray-300"
42
- },
43
- site: {
44
- right: "right-0 border-l border-l-gray-800 pr-1",
45
- left: "left-0 border-r border-r-gray-800 pl-1"
46
- }
47
- },
48
- defaultVariants: {
49
- disabled: false
50
- }
51
- }
52
- );
53
- function Input({ invalid = false, startIcon, endIcon, disabled = false, className, ...props }) {
54
- const inputStyles = inputCva({ withEndIcon: !!endIcon, withStartIcon: !!startIcon, invalid });
55
- const inputIconStartContainer = inputIconContainerCva({ site: "left", disabled });
56
- const inputIconEndContainer = inputIconContainerCva({ site: "right", disabled });
57
- return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "text-body-2 relative text-gray-100", children: [
58
- startIcon ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: inputIconStartContainer, children: startIcon }) : null,
59
- /* @__PURE__ */ jsxRuntime.jsx(
60
- "input",
61
- {
62
- "aria-invalid": invalid || void 0,
63
- disabled,
64
- className: chunkH2BWO3SI_cjs.cn(inputStyles, className),
65
- ...props
66
- }
67
- ),
68
- endIcon ? /* @__PURE__ */ jsxRuntime.jsx("span", { "aria-hidden": true, className: inputIconEndContainer, children: endIcon }) : null
69
- ] });
70
- }
71
-
72
- exports.Input = Input;
@@ -1,55 +0,0 @@
1
- 'use strict';
2
-
3
- var chunkD3MOZUNH_cjs = require('../../chunk-D3MOZUNH.cjs');
4
- require('../../chunk-G6VXQ7DJ.cjs');
5
- require('../../chunk-S5BN23O7.cjs');
6
- require('../../chunk-EIXSMEDP.cjs');
7
- require('../../chunk-3WSQRFUY.cjs');
8
- require('../../chunk-GHV2TURY.cjs');
9
- require('../../chunk-OIWEXHFE.cjs');
10
- require('../../chunk-GR37JJQK.cjs');
11
- require('../../chunk-K4TRAPRN.cjs');
12
- require('../../chunk-FPFRA5Q6.cjs');
13
- require('../../chunk-PH4LO5TE.cjs');
14
- require('../../chunk-YWG7TML6.cjs');
15
- require('../../chunk-P4J2TTH7.cjs');
16
- require('../../chunk-ZZ3EBGSD.cjs');
17
- require('../../chunk-FVSO3RHT.cjs');
18
- require('../../chunk-EW6TE3N5.cjs');
19
- require('../../chunk-7EYMOUWG.cjs');
20
- require('../../chunk-UKWZ5BHD.cjs');
21
- require('../../chunk-4NO6IM75.cjs');
22
- require('../../chunk-NHFHKMX2.cjs');
23
- require('../../chunk-TMXVL5CV.cjs');
24
- require('../../chunk-H2BWO3SI.cjs');
25
-
26
-
27
-
28
- Object.defineProperty(exports, "Form", {
29
- enumerable: true,
30
- get: function () { return chunkD3MOZUNH_cjs.Form; }
31
- });
32
- Object.defineProperty(exports, "FormControl", {
33
- enumerable: true,
34
- get: function () { return chunkD3MOZUNH_cjs.FormControl; }
35
- });
36
- Object.defineProperty(exports, "FormDescription", {
37
- enumerable: true,
38
- get: function () { return chunkD3MOZUNH_cjs.FormDescription; }
39
- });
40
- Object.defineProperty(exports, "FormField", {
41
- enumerable: true,
42
- get: function () { return chunkD3MOZUNH_cjs.FormField; }
43
- });
44
- Object.defineProperty(exports, "FormItem", {
45
- enumerable: true,
46
- get: function () { return chunkD3MOZUNH_cjs.FormItem; }
47
- });
48
- Object.defineProperty(exports, "FormLabel", {
49
- enumerable: true,
50
- get: function () { return chunkD3MOZUNH_cjs.FormLabel; }
51
- });
52
- Object.defineProperty(exports, "FormMessage", {
53
- enumerable: true,
54
- get: function () { return chunkD3MOZUNH_cjs.FormMessage; }
55
- });
@@ -1,32 +0,0 @@
1
- import * as react_hook_form from 'react-hook-form';
2
- import { FormProviderProps, FieldValues, FieldPath, ControllerProps } from 'react-hook-form';
3
- import * as React$1 from 'react';
4
- import * as react_jsx_runtime from 'react/jsx-runtime';
5
- import { LabelProps } from '../label/index.cjs';
6
- import * as _radix_ui_react_slot from '@radix-ui/react-slot';
7
- import { Slot } from '@radix-ui/react-slot';
8
- import 'radix-ui';
9
-
10
- type FormProps = FormProviderProps;
11
- declare const Form: <TFieldValues extends react_hook_form.FieldValues, TContext = any, TTransformedValues = TFieldValues>(props: FormProviderProps<TFieldValues, TContext, TTransformedValues>) => React.JSX.Element;
12
-
13
- type FormItemProps = React$1.HTMLAttributes<HTMLDivElement>;
14
- declare const FormItem: React$1.ForwardRefExoticComponent<FormItemProps & React$1.RefAttributes<HTMLDivElement>>;
15
-
16
- declare const FormField: <TFieldValues extends FieldValues = FieldValues, TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>>({ ...props }: ControllerProps<TFieldValues, TName>) => react_jsx_runtime.JSX.Element;
17
-
18
- type FormLabelProps = LabelProps & {
19
- caption?: React$1.ReactNode;
20
- };
21
- declare const FormLabel: React$1.ForwardRefExoticComponent<Omit<FormLabelProps, "ref"> & React$1.RefAttributes<HTMLLabelElement>>;
22
-
23
- type FormControlProps = React$1.ComponentPropsWithoutRef<typeof Slot>;
24
- declare const FormControl: React$1.ForwardRefExoticComponent<Omit<_radix_ui_react_slot.SlotProps & React$1.RefAttributes<HTMLElement>, "ref"> & React$1.RefAttributes<HTMLElement>>;
25
-
26
- type FormMessageProps = React$1.HTMLAttributes<HTMLParagraphElement>;
27
- declare const FormMessage: React$1.ForwardRefExoticComponent<FormMessageProps & React$1.RefAttributes<HTMLParagraphElement>>;
28
-
29
- type FormDescriptionProps = React$1.HTMLAttributes<HTMLParagraphElement>;
30
- declare const FormDescription: React$1.ForwardRefExoticComponent<FormDescriptionProps & React$1.RefAttributes<HTMLParagraphElement>>;
31
-
32
- export { Form, FormControl, type FormControlProps, FormDescription, type FormDescriptionProps, FormField, FormItem, type FormItemProps, FormLabel, type FormLabelProps, FormMessage, type FormMessageProps, type FormProps };