@worldcoin/mini-apps-ui-kit-react 0.0.8 → 1.0.0-canary.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 (198) hide show
  1. package/README.md +8 -17
  2. package/dist/components/AlertDialog/AlertDialog.js +94 -0
  3. package/dist/components/AlertDialog/index.d.ts +1 -0
  4. package/dist/components/AlertDialog/index.js +13 -0
  5. package/dist/components/AlertDialog/types.d.ts +172 -0
  6. package/dist/components/AlertDialog/types.js +1 -0
  7. package/dist/components/AlertDialog/use-alert-dialog.d.ts +6 -0
  8. package/dist/components/AlertDialog/use-alert-dialog.js +11 -0
  9. package/dist/components/BottomBar/BottomBar.d.ts +13 -0
  10. package/dist/components/BottomBar/BottomBar.js +21 -0
  11. package/dist/components/BottomBar/index.d.ts +1 -0
  12. package/dist/components/BottomBar/index.js +4 -0
  13. package/dist/components/BulletList/BulletList.d.ts +10 -0
  14. package/dist/components/BulletList/BulletList.js +11 -0
  15. package/dist/components/BulletList/index.d.ts +1 -0
  16. package/dist/components/BulletList/index.js +4 -0
  17. package/dist/components/BulletListItem/BulletListItem.d.ts +7 -0
  18. package/dist/components/BulletListItem/BulletListItem.js +23 -0
  19. package/dist/components/BulletListItem/index.d.ts +1 -0
  20. package/dist/components/BulletListItem/index.js +4 -0
  21. package/dist/components/BulletPoint/BulletPoint.d.ts +6 -0
  22. package/dist/components/BulletPoint/BulletPoint.js +22 -0
  23. package/dist/components/BulletPoint/index.d.ts +1 -0
  24. package/dist/components/BulletPoint/index.js +1 -0
  25. package/dist/components/Button/Button.d.ts +10 -22
  26. package/dist/components/Button/Button.js +40 -72
  27. package/dist/components/Checkbox/Checkbox.d.ts +24 -4
  28. package/dist/components/Checkbox/Checkbox.js +5 -5
  29. package/dist/components/Chip/Chip.d.ts +2 -1
  30. package/dist/components/Chip/Chip.js +14 -8
  31. package/dist/components/ClearButton/Clear.js +14 -14
  32. package/dist/components/ClearButton/ClearButton.js +11 -11
  33. package/dist/components/ColorPicker/ColorPicker.js +14 -14
  34. package/dist/components/CountryDrawer/CountryDrawer.d.ts +12 -0
  35. package/dist/components/CountryDrawer/CountryDrawer.js +63 -0
  36. package/dist/components/CountryDrawer/index.d.ts +1 -0
  37. package/dist/components/CountryDrawer/index.js +4 -0
  38. package/dist/components/CountryDrawer/useCountryFiltering.d.ts +7 -0
  39. package/dist/components/CountryDrawer/useCountryFiltering.js +9 -0
  40. package/dist/components/CountryDrawer/useCountryGrouping.d.ts +13 -0
  41. package/dist/components/CountryDrawer/useCountryGrouping.js +17 -0
  42. package/dist/components/Drawer/Drawer.d.ts +28 -6
  43. package/dist/components/Drawer/Drawer.js +67 -28
  44. package/dist/components/Drawer/index.js +6 -4
  45. package/dist/components/Drawer/types.d.ts +167 -0
  46. package/dist/components/Drawer/types.js +1 -0
  47. package/dist/components/Drawer/use-drawer.d.ts +8 -0
  48. package/dist/components/Drawer/use-drawer.js +11 -0
  49. package/dist/components/Flag/LazyFlag.js +1 -1
  50. package/dist/components/Flag/flag-components/eu.d.ts +3 -0
  51. package/dist/components/Flag/flag-components/eu.js +83 -0
  52. package/dist/components/Flag/flag-components/index.d.ts +1 -0
  53. package/dist/components/Flag/flag-components/index.js +56 -54
  54. package/dist/components/Form/Form.js +2 -2
  55. package/dist/components/Icons/ArrowDown.js +26 -0
  56. package/dist/components/Icons/Eye.d.ts +8 -0
  57. package/dist/components/Icons/Eye.js +40 -0
  58. package/dist/components/Icons/EyeClosed.d.ts +8 -0
  59. package/dist/components/Icons/EyeClosed.js +60 -0
  60. package/dist/components/Icons/Fail.d.ts +8 -0
  61. package/dist/components/Icons/Fail.js +82 -0
  62. package/dist/components/Icons/MagicWand.d.ts +8 -0
  63. package/dist/components/Icons/MagicWand.js +60 -0
  64. package/dist/components/Icons/Magnifier.d.ts +1 -1
  65. package/dist/components/Icons/Magnifier.js +20 -11
  66. package/dist/components/Icons/Success.d.ts +8 -0
  67. package/dist/components/Icons/Success.js +82 -0
  68. package/dist/components/Icons/Tick.js +6 -7
  69. package/dist/components/Icons/XMark.d.ts +8 -0
  70. package/dist/components/Icons/XMark.js +27 -0
  71. package/dist/components/Input/Input.d.ts +26 -2
  72. package/dist/components/Input/Input.js +116 -51
  73. package/dist/components/ListItem/ListItem.d.ts +17 -6
  74. package/dist/components/ListItem/ListItem.js +29 -22
  75. package/dist/components/Marble/Marble.d.ts +2 -0
  76. package/dist/components/Marble/Marble.js +23 -0
  77. package/dist/components/Marble/index.d.ts +1 -0
  78. package/dist/components/Marble/index.js +4 -0
  79. package/dist/components/NumberPad/Delete.d.ts +1 -8
  80. package/dist/components/NumberPad/Delete.js +9 -10
  81. package/dist/components/NumberPad/NumberPad.js +30 -24
  82. package/dist/components/OTPField/OTPField.js +8 -8
  83. package/dist/components/PasswordField/PasswordField.d.ts +13 -0
  84. package/dist/components/PasswordField/PasswordField.js +45 -0
  85. package/dist/components/PasswordField/index.d.ts +1 -0
  86. package/dist/components/PasswordField/index.js +4 -0
  87. package/dist/components/PasteButton/PasteButton.d.ts +1 -1
  88. package/dist/components/PasteButton/PasteButton.js +21 -17
  89. package/dist/components/PhoneField/CountryListItem.d.ts +3 -4
  90. package/dist/components/PhoneField/CountryListItem.js +21 -25
  91. package/dist/components/PhoneField/CountrySelectorButton.d.ts +3 -4
  92. package/dist/components/PhoneField/CountrySelectorButton.js +17 -17
  93. package/dist/components/PhoneField/GroupedCountryList.d.ts +14 -0
  94. package/dist/components/PhoneField/GroupedCountryList.js +30 -0
  95. package/dist/components/PhoneField/PhoneField.d.ts +3 -14
  96. package/dist/components/PhoneField/PhoneField.js +71 -197
  97. package/dist/components/PhoneField/constants.js +4 -4
  98. package/dist/components/Pill/Pill.js +7 -7
  99. package/dist/components/Progress/Progress.d.ts +14 -0
  100. package/dist/components/Progress/Progress.js +31 -0
  101. package/dist/components/Progress/index.d.ts +1 -0
  102. package/dist/components/Progress/index.js +4 -0
  103. package/dist/components/RadioGroup/RadioGroupItem.js +1 -1
  104. package/dist/components/SearchField/SearchField.d.ts +6 -1
  105. package/dist/components/SearchField/SearchField.js +39 -35
  106. package/dist/components/Select/Select.js +46 -76
  107. package/dist/components/{Button → Spinner}/Spinner.d.ts +2 -2
  108. package/dist/components/Spinner/Spinner.js +36 -0
  109. package/dist/components/Spinner/index.d.ts +1 -0
  110. package/dist/components/Spinner/index.js +4 -0
  111. package/dist/components/Switch/Switch.js +1 -1
  112. package/dist/components/Tabs/Tabs.d.ts +11 -0
  113. package/dist/components/Tabs/Tabs.js +58 -0
  114. package/dist/components/Tabs/index.d.ts +2 -0
  115. package/dist/components/Tabs/index.js +5 -0
  116. package/dist/components/Tabs/types.d.ts +53 -0
  117. package/dist/components/Tabs/types.js +1 -0
  118. package/dist/components/TextArea/TextArea.d.ts +25 -0
  119. package/dist/components/TextArea/TextArea.js +54 -0
  120. package/dist/components/TextArea/index.d.ts +1 -0
  121. package/dist/components/TextArea/index.js +4 -0
  122. package/dist/components/Toast/Toast.d.ts +9 -0
  123. package/dist/components/Toast/Toast.js +51 -0
  124. package/dist/components/Toast/Toaster.d.ts +3 -0
  125. package/dist/components/Toast/Toaster.js +14 -0
  126. package/dist/components/Toast/index.d.ts +3 -0
  127. package/dist/components/Toast/index.js +12 -0
  128. package/dist/components/Toast/use-toast.d.ts +51 -0
  129. package/dist/components/Toast/use-toast.js +101 -0
  130. package/dist/components/ToggleGroup/ToggleGroup.d.ts +5 -0
  131. package/dist/components/ToggleGroup/ToggleGroup.js +28 -0
  132. package/dist/components/ToggleGroup/index.d.ts +1 -0
  133. package/dist/components/ToggleGroup/index.js +5 -0
  134. package/dist/components/ToggleGroup/types.d.ts +101 -0
  135. package/dist/components/ToggleGroup/types.js +1 -0
  136. package/dist/components/Token/Token.d.ts +4 -0
  137. package/dist/components/Token/Token.js +12 -7
  138. package/dist/components/Token/icons/btc.d.ts +2 -2
  139. package/dist/components/Token/icons/btc.js +13 -58
  140. package/dist/components/Token/icons/dai.d.ts +3 -0
  141. package/dist/components/Token/icons/dai.js +27 -0
  142. package/dist/components/Token/icons/eth.d.ts +2 -2
  143. package/dist/components/Token/icons/eth.js +11 -58
  144. package/dist/components/Token/icons/index.d.ts +2 -0
  145. package/dist/components/Token/icons/index.js +8 -4
  146. package/dist/components/Token/icons/types.d.ts +7 -0
  147. package/dist/components/Token/icons/types.js +1 -0
  148. package/dist/components/Token/icons/usdc.d.ts +2 -2
  149. package/dist/components/Token/icons/usdc.js +16 -56
  150. package/dist/components/Token/icons/usdt.d.ts +3 -0
  151. package/dist/components/Token/icons/usdt.js +27 -0
  152. package/dist/components/Token/icons/utils.d.ts +9 -0
  153. package/dist/components/Token/icons/utils.js +11 -0
  154. package/dist/components/Token/icons/wld.d.ts +2 -2
  155. package/dist/components/Token/icons/wld.js +10 -41
  156. package/dist/components/TopBar/TopBar.d.ts +11 -0
  157. package/dist/components/TopBar/TopBar.js +23 -0
  158. package/dist/components/TopBar/index.d.ts +1 -0
  159. package/dist/components/TopBar/index.js +4 -0
  160. package/dist/components/Typography/Typography.d.ts +12 -8
  161. package/dist/components/Typography/Typography.js +72 -60
  162. package/dist/components/WalletAddressField/WalletAddressField.d.ts +23 -0
  163. package/dist/components/WalletAddressField/WalletAddressField.js +81 -0
  164. package/dist/components/WalletAddressField/index.d.ts +1 -0
  165. package/dist/components/WalletAddressField/index.js +4 -0
  166. package/dist/index.d.ts +15 -0
  167. package/dist/index.js +91 -45
  168. package/dist/lib/constants/dropdownStyles.d.ts +1 -1
  169. package/dist/lib/constants/dropdownStyles.js +2 -2
  170. package/dist/node_modules/.pnpm/@radix-ui_react-collection@1.1.2_@types_react-dom@18.3.5_@types_react@18.3.18__@types_react@1_tagbd57u5fsqga6qdjecsll7fm/node_modules/@radix-ui/react-collection/dist/index.js +49 -0
  171. package/dist/node_modules/.pnpm/@radix-ui_react-dismissable-layer@1.1.5_@types_react-dom@18.3.5_@types_react@18.3.18__@types__nitdfoqpcbroetgllwgz3is5ai/node_modules/@radix-ui/react-dismissable-layer/dist/index.js +131 -0
  172. package/dist/node_modules/.pnpm/@radix-ui_react-portal@1.1.4_@types_react-dom@18.3.5_@types_react@18.3.18__@types_react@18.3._ulc3jfxcmrz2rfz7bui53djdtu/node_modules/@radix-ui/react-portal/dist/index.js +17 -0
  173. package/dist/node_modules/.pnpm/@radix-ui_react-primitive@2.0.2_@types_react-dom@18.3.5_@types_react@18.3.18__@types_react@18_sejcxqoscaweil2bvgwwavaoha/node_modules/@radix-ui/react-primitive/dist/index.js +35 -0
  174. package/dist/node_modules/.pnpm/@radix-ui_react-progress@1.1.2_@types_react-dom@18.3.5_@types_react@18.3.18__@types_react@18._wpsg2ubedou6txnsnvgmus4txq/node_modules/@radix-ui/react-progress/dist/index.js +86 -0
  175. package/dist/node_modules/.pnpm/@radix-ui_react-roving-focus@1.1.2_@types_react-dom@18.3.5_@types_react@18.3.18__@types_react_ki7uy4u3diz5446cqygvbjwuge/node_modules/@radix-ui/react-roving-focus/dist/index.js +181 -0
  176. package/dist/node_modules/.pnpm/@radix-ui_react-slot@1.1.2_@types_react@18.3.18_react@18.3.1/node_modules/@radix-ui/react-slot/dist/index.js +44 -0
  177. package/dist/node_modules/.pnpm/@radix-ui_react-toast@1.2.6_@types_react-dom@18.3.5_@types_react@18.3.18__@types_react@18.3.1_mux33mveszkw5z6iia6acnivvy/node_modules/@radix-ui/react-toast/dist/index.js +448 -0
  178. package/dist/node_modules/.pnpm/@radix-ui_react-toggle-group@1.1.2_@types_react-dom@18.3.5_@types_react@18.3.18__@types_react_3smwloudr6a3igss4kifyxcwju/node_modules/@radix-ui/react-toggle-group/dist/index.js +137 -0
  179. package/dist/node_modules/.pnpm/@radix-ui_react-toggle@1.1.2_@types_react-dom@18.3.5_@types_react@18.3.18__@types_react@18.3._yiv2ptaqcv244n5f7zfldmgupm/node_modules/@radix-ui/react-toggle/dist/index.js +31 -0
  180. package/dist/node_modules/.pnpm/@radix-ui_react-visually-hidden@1.1.2_@types_react-dom@18.3.5_@types_react@18.3.18__@types_re_omyrydx3gc2oidaiqb4gsovieq/node_modules/@radix-ui/react-visually-hidden/dist/index.js +30 -0
  181. package/dist/tailwind/index.d.ts +41 -25
  182. package/dist/tailwind/index.js +128 -85
  183. package/package.json +73 -1
  184. package/public/fonts/TWKLausanne-350.woff +0 -0
  185. package/public/fonts/TWKLausanne-350Italic.woff +0 -0
  186. package/public/fonts/TWKLausanne-500.woff +0 -0
  187. package/public/fonts/TWKLausanne-500Italic.woff +0 -0
  188. package/public/fonts/TWKLausanne-600.woff +0 -0
  189. package/public/fonts/TWKLausanne-600Italic.woff +0 -0
  190. package/public/globals.css +1 -1
  191. package/public/images/marbles/marble1.png +0 -0
  192. package/public/images/marbles/marble2.png +0 -0
  193. package/public/images/marbles/marble3.svg +36 -0
  194. package/dist/components/Button/Spinner.js +0 -36
  195. package/dist/components/PhoneField/ArrowDown.js +0 -27
  196. package/dist/components/Select/ArrowDown.d.ts +0 -2
  197. package/dist/components/Select/ArrowDown.js +0 -27
  198. /package/dist/components/{PhoneField → Icons}/ArrowDown.d.ts +0 -0
@@ -0,0 +1,101 @@
1
+ "use client";
2
+ import { useState as d, useEffect as p } from "react";
3
+ const A = 1, f = 1e6;
4
+ let T = 0;
5
+ function O() {
6
+ return T = (T + 1) % Number.MAX_SAFE_INTEGER, T.toString();
7
+ }
8
+ const a = /* @__PURE__ */ new Map(), c = (t) => {
9
+ if (a.has(t))
10
+ return;
11
+ const e = setTimeout(() => {
12
+ a.delete(t), r({
13
+ type: "REMOVE_TOAST",
14
+ toastId: t
15
+ });
16
+ }, f);
17
+ a.set(t, e);
18
+ }, E = (t, e) => {
19
+ switch (e.type) {
20
+ case "ADD_TOAST":
21
+ return {
22
+ ...t,
23
+ toasts: [e.toast, ...t.toasts].slice(0, A)
24
+ };
25
+ case "UPDATE_TOAST":
26
+ return {
27
+ ...t,
28
+ toasts: t.toasts.map(
29
+ (s) => s.id === e.toast.id ? { ...s, ...e.toast } : s
30
+ )
31
+ };
32
+ case "DISMISS_TOAST": {
33
+ const { toastId: s } = e;
34
+ return s ? c(s) : t.toasts.forEach((o) => {
35
+ c(o.id);
36
+ }), {
37
+ ...t,
38
+ toasts: t.toasts.map(
39
+ (o) => o.id === s || s === void 0 ? {
40
+ ...o,
41
+ open: !1
42
+ } : o
43
+ )
44
+ };
45
+ }
46
+ case "REMOVE_TOAST":
47
+ return e.toastId === void 0 ? {
48
+ ...t,
49
+ toasts: []
50
+ } : {
51
+ ...t,
52
+ toasts: t.toasts.filter((s) => s.id !== e.toastId)
53
+ };
54
+ }
55
+ }, n = [];
56
+ let i = { toasts: [] };
57
+ function r(t) {
58
+ i = E(i, t), n.forEach((e) => {
59
+ e(i);
60
+ });
61
+ }
62
+ const S = ({ ...t }) => {
63
+ const e = O(), s = (u) => r({
64
+ type: "UPDATE_TOAST",
65
+ toast: { ...u, id: e }
66
+ }), o = () => r({ type: "DISMISS_TOAST", toastId: e });
67
+ return r({
68
+ type: "ADD_TOAST",
69
+ toast: {
70
+ ...t,
71
+ id: e,
72
+ open: !0,
73
+ onOpenChange: (u) => {
74
+ u || o();
75
+ }
76
+ }
77
+ }), {
78
+ id: e,
79
+ dismiss: o,
80
+ update: s
81
+ };
82
+ };
83
+ function m() {
84
+ const [t, e] = d(i);
85
+ return p(() => (n.push(e), () => {
86
+ const s = n.indexOf(e);
87
+ s > -1 && n.splice(s, 1);
88
+ }), [t]), {
89
+ ...t,
90
+ toast: {
91
+ success: (s) => S({ ...s, variant: "success" }),
92
+ error: (s) => S({ ...s, variant: "error" })
93
+ },
94
+ dismiss: (s) => r({ type: "DISMISS_TOAST", toastId: s })
95
+ };
96
+ }
97
+ export {
98
+ E as reducer,
99
+ S as toast,
100
+ m as useToast
101
+ };
@@ -0,0 +1,5 @@
1
+ import { ToggleGroupItemProps, ToggleGroupRootProps } from './types';
2
+ import * as React from "react";
3
+ declare const ToggleGroupRoot: React.ForwardRefExoticComponent<ToggleGroupRootProps & React.RefAttributes<HTMLDivElement>>;
4
+ declare const ToggleGroupItem: React.ForwardRefExoticComponent<ToggleGroupItemProps & React.RefAttributes<HTMLButtonElement>>;
5
+ export { ToggleGroupRoot, ToggleGroupItem };
@@ -0,0 +1,28 @@
1
+ import { jsx as a } from "react/jsx-runtime";
2
+ import { Root as l, Item as n } from "../../node_modules/.pnpm/@radix-ui_react-toggle-group@1.1.2_@types_react-dom@18.3.5_@types_react@18.3.18__@types_react_3smwloudr6a3igss4kifyxcwju/node_modules/@radix-ui/react-toggle-group/dist/index.js";
3
+ import * as e from "react";
4
+ import { cn as r } from "../../lib/utils.js";
5
+ import { typographyVariants as g } from "../Typography/Typography.js";
6
+ const m = e.forwardRef(({ ...o }, t) => /* @__PURE__ */ a(l, { ref: t, className: r("inline-flex gap-5"), ...o }));
7
+ m.displayName = "ToggleGroup";
8
+ const p = e.forwardRef(({ className: o, children: t, ...s }, i) => /* @__PURE__ */ a(
9
+ n,
10
+ {
11
+ ref: i,
12
+ className: r(
13
+ g({ variant: "subtitle", level: 4 }),
14
+ "size-8 rounded-full transition-all text-gray-400 bg-gray-0 outline-none",
15
+ "hover:bg-gray-50",
16
+ "data-[state=on]:bg-gray-100 data-[state=on]:text-gray-900",
17
+ "disabled:pointer-events-none disabled:opacity-50",
18
+ o
19
+ ),
20
+ ...s,
21
+ children: t
22
+ }
23
+ ));
24
+ p.displayName = "ToggleGroupItem";
25
+ export {
26
+ p as ToggleGroupItem,
27
+ m as ToggleGroupRoot
28
+ };
@@ -0,0 +1 @@
1
+ export { ToggleGroupRoot, ToggleGroupItem } from './ToggleGroup';
@@ -0,0 +1,5 @@
1
+ import { ToggleGroupItem as g, ToggleGroupRoot as r } from "./ToggleGroup.js";
2
+ export {
3
+ g as ToggleGroupItem,
4
+ r as ToggleGroupRoot
5
+ };
@@ -0,0 +1,101 @@
1
+ import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group";
2
+ import * as React from "react";
3
+ /**
4
+ * Props for the ToggleGroupItem component
5
+ */
6
+ export interface ToggleGroupItemProps extends Omit<React.ComponentPropsWithoutRef<typeof ToggleGroupPrimitive.Item>, "asChild"> {
7
+ /**
8
+ * Whether this item should be rendered as a child of another component
9
+ * @default false
10
+ */
11
+ asChild?: boolean;
12
+ /**
13
+ * The value of the toggle group item
14
+ */
15
+ value: string;
16
+ /**
17
+ * When true, prevents the user from interacting with the toggle group item
18
+ */
19
+ disabled?: boolean;
20
+ }
21
+ /**
22
+ * Props for single selection mode
23
+ */
24
+ interface SingleToggleGroupProps {
25
+ /**
26
+ * The type of selection that should be used
27
+ */
28
+ type: "single";
29
+ /**
30
+ * The value of the toggle group when initially rendered
31
+ * @default undefined
32
+ */
33
+ defaultValue?: string;
34
+ /**
35
+ * The controlled value of the toggle group
36
+ * @default undefined
37
+ */
38
+ value?: string;
39
+ /**
40
+ * Event handler called when the value changes
41
+ */
42
+ onValueChange?: (value: string) => void;
43
+ }
44
+ /**
45
+ * Props for multiple selection mode
46
+ */
47
+ interface MultipleToggleGroupProps {
48
+ /**
49
+ * The type of selection that should be used
50
+ */
51
+ type: "multiple";
52
+ /**
53
+ * The value of the toggle group when initially rendered
54
+ * @default undefined
55
+ */
56
+ defaultValue?: string[];
57
+ /**
58
+ * The controlled value of the toggle group
59
+ * @default undefined
60
+ */
61
+ value?: string[];
62
+ /**
63
+ * Event handler called when the value changes
64
+ */
65
+ onValueChange?: (value: string[]) => void;
66
+ }
67
+ /**
68
+ * Props for the ToggleGroupRoot component
69
+ */
70
+ export type ToggleGroupRootProps = (SingleToggleGroupProps | MultipleToggleGroupProps) & {
71
+ /**
72
+ * Whether this component should be rendered as a child of another component
73
+ * @default false
74
+ */
75
+ asChild?: boolean;
76
+ /**
77
+ * When true, prevents the user from interacting with the toggle group
78
+ * @default false
79
+ */
80
+ disabled?: boolean;
81
+ /**
82
+ * When true and rovingFocus is true, keyboard navigation will loop from last item to first, and vice versa.
83
+ * @default true
84
+ */
85
+ loop?: boolean;
86
+ /**
87
+ * When false, navigating through the items using arrow keys will be disabled.
88
+ * @default false
89
+ */
90
+ rovingFocus?: boolean;
91
+ /**
92
+ * The reading direction of the toggle group. If omitted, inherits globally from DirectionProvider or assumes LTR (left-to-right) reading mode.
93
+ * @default undefined
94
+ */
95
+ dir?: "ltr" | "rtl";
96
+ /**
97
+ * The children of the toggle group
98
+ */
99
+ children?: React.ReactNode;
100
+ };
101
+ export {};
@@ -8,6 +8,10 @@ interface TokenProps {
8
8
  value: keyof typeof tokens;
9
9
  /** Width and height in pixels of the token icon (default: 40) */
10
10
  size?: number;
11
+ /** Variant of the token icon (default: "default") */
12
+ variant?: "color" | "monochrome";
13
+ /** Whether the token is disabled */
14
+ disabled?: boolean;
11
15
  }
12
16
  export declare const Token: React.FC<TokenProps>;
13
17
  export default Token;
@@ -1,10 +1,15 @@
1
- import { jsx as e } from "react/jsx-runtime";
2
- import * as r from "./icons/index.js";
3
- const c = ({ value: n, size: o = 40 }) => {
4
- const t = r[n];
5
- return /* @__PURE__ */ e(t, { width: o, height: o });
1
+ import { jsx as s } from "react/jsx-runtime";
2
+ import * as c from "./icons/index.js";
3
+ const m = ({
4
+ value: n,
5
+ size: o = 40,
6
+ variant: t = "color",
7
+ disabled: e = !1
8
+ }) => {
9
+ const r = c[n];
10
+ return /* @__PURE__ */ s(r, { width: o, height: o, disabled: e, variant: t });
6
11
  };
7
12
  export {
8
- c as Token,
9
- c as default
13
+ m as Token,
14
+ m as default
10
15
  };
@@ -1,3 +1,3 @@
1
- import { default as React } from 'react';
2
- declare const BTC: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
1
+ import { IconProps } from './types';
2
+ declare const BTC: (props: IconProps) => import("react/jsx-runtime").JSX.Element;
3
3
  export default BTC;
@@ -1,5 +1,6 @@
1
- import { jsxs as r, jsx as t } from "react/jsx-runtime";
2
- const e = (i) => /* @__PURE__ */ r(
1
+ import { jsxs as t, jsx as l } from "react/jsx-runtime";
2
+ import { getBackgroundClass as s, getIconFillClass as o } from "./utils.js";
3
+ const a = (e) => /* @__PURE__ */ t(
3
4
  "svg",
4
5
  {
5
6
  width: "88",
@@ -7,68 +8,22 @@ const e = (i) => /* @__PURE__ */ r(
7
8
  viewBox: "0 0 88 88",
8
9
  fill: "none",
9
10
  xmlns: "http://www.w3.org/2000/svg",
10
- ...i,
11
+ ...e,
12
+ style: { color: "#FF5A00" },
11
13
  children: [
12
- /* @__PURE__ */ t("circle", { cx: "44", cy: "44", r: "44", fill: "#FF4231" }),
13
- /* @__PURE__ */ t("circle", { cx: "44", cy: "44", r: "44", fill: "url(#paint0_radial_12_1265)" }),
14
- /* @__PURE__ */ t("circle", { cx: "44", cy: "44", r: "44", fill: "url(#paint1_radial_12_1265)" }),
15
- /* @__PURE__ */ t(
14
+ /* @__PURE__ */ l("rect", { width: "88", height: "88", rx: "44", className: s(e) }),
15
+ /* @__PURE__ */ l(
16
16
  "path",
17
17
  {
18
- d: "M56.8469 40.0108C57.4042 36.2846 54.5674 34.2816 50.6882 32.9454L51.9466 27.898L48.8741 27.1324L47.649 32.047C46.8412 31.8455 46.0117 31.6557 45.1873 31.4675L46.4212 26.5205L43.3506 25.7549L42.0915 30.8007C41.423 30.6485 40.7665 30.4981 40.1296 30.3396L40.1331 30.3237L35.896 29.2657L35.0787 32.5473C35.0787 32.5473 37.3583 33.0699 37.3102 33.102C38.5544 33.4126 38.7794 34.2362 38.7421 34.889L37.3086 40.6392C37.3943 40.661 37.5054 40.6925 37.628 40.7418C37.5255 40.7163 37.4164 40.6885 37.3032 40.6614L35.294 48.7167C35.1419 49.0947 34.756 49.662 33.8861 49.4466C33.9169 49.4912 31.6529 48.8893 31.6529 48.8893L30.1275 52.4063L34.1259 53.4031C34.8697 53.5896 35.5986 53.7848 36.3165 53.9683L35.045 59.0737L38.114 59.8393L39.3731 54.7881C40.2115 55.0157 41.0252 55.2257 41.8217 55.4236L40.5668 60.4509L43.6395 61.2165L44.9108 56.1207C50.1501 57.1123 54.0897 56.7125 55.7479 51.9736C57.0841 48.1581 55.6814 45.9574 52.925 44.5223C54.9326 44.0593 56.4448 42.7388 56.848 40.0112L56.8471 40.0105L56.8469 40.0108ZM49.8269 49.8547C48.8773 53.6701 42.4533 51.6076 40.3706 51.0904L42.0578 44.3267C44.1404 44.8466 50.8193 45.8756 49.827 49.8547H49.8269ZM50.7771 39.9555C49.9109 43.426 44.5641 41.6628 42.8297 41.2305L44.3594 35.0962C46.0938 35.5286 51.6794 36.3355 50.7774 39.9555H50.7771Z",
19
- fill: "url(#paint2_linear_12_1265)"
18
+ fillRule: "evenodd",
19
+ clipRule: "evenodd",
20
+ d: "M41.9115 24.889H46.707V30.1736C51.5254 30.6529 54.6619 33.1054 54.6619 37.7023C54.6619 40.9261 53.0097 42.941 49.8664 44.1097V44.1903C52.9694 44.7947 55.6693 46.6484 55.6693 50.6782C55.6693 56.012 52.2208 58.3483 46.7071 58.7826L46.7071 64.162H41.9117L41.9117 58.8587H34.6741V30.086H41.9115V24.889ZM44.3456 54.4259H40.074V46.4469H45.0307C48.1336 46.4469 50.3097 47.4947 50.3097 50.3558C50.3097 53.4588 47.9724 54.4259 44.3456 54.4259ZM43.9829 42.1351H40.074V34.4784H44.265C47.4082 34.4784 49.3022 35.2038 49.3022 38.1456C49.3022 41.047 47.4485 42.1351 43.9829 42.1351Z",
21
+ className: o(e)
20
22
  }
21
- ),
22
- /* @__PURE__ */ r("defs", { children: [
23
- /* @__PURE__ */ r(
24
- "radialGradient",
25
- {
26
- id: "paint0_radial_12_1265",
27
- cx: "0",
28
- cy: "0",
29
- r: "1",
30
- gradientUnits: "userSpaceOnUse",
31
- gradientTransform: "translate(83.9633 70.1674) rotate(170.361) scale(62.5095 57.5688)",
32
- children: [
33
- /* @__PURE__ */ t("stop", { stopColor: "#F39631" }),
34
- /* @__PURE__ */ t("stop", { offset: "1", stopColor: "#F39631", stopOpacity: "0" })
35
- ]
36
- }
37
- ),
38
- /* @__PURE__ */ r(
39
- "radialGradient",
40
- {
41
- id: "paint1_radial_12_1265",
42
- cx: "0",
43
- cy: "0",
44
- r: "1",
45
- gradientUnits: "userSpaceOnUse",
46
- gradientTransform: "translate(6.45871 8.33481) rotate(71.0626) scale(53.4853 52.1862)",
47
- children: [
48
- /* @__PURE__ */ t("stop", { stopColor: "#FF9726" }),
49
- /* @__PURE__ */ t("stop", { offset: "1", stopColor: "#FF9726", stopOpacity: "0" })
50
- ]
51
- }
52
- ),
53
- /* @__PURE__ */ r(
54
- "linearGradient",
55
- {
56
- id: "paint2_linear_12_1265",
57
- x1: "43.5222",
58
- y1: "25.7549",
59
- x2: "43.5222",
60
- y2: "61.2165",
61
- gradientUnits: "userSpaceOnUse",
62
- children: [
63
- /* @__PURE__ */ t("stop", { offset: "0.5", stopColor: "white" }),
64
- /* @__PURE__ */ t("stop", { offset: "1", stopColor: "white", stopOpacity: "0.8" })
65
- ]
66
- }
67
- )
68
- ] })
23
+ )
69
24
  ]
70
25
  }
71
26
  );
72
27
  export {
73
- e as default
28
+ a as default
74
29
  };
@@ -0,0 +1,3 @@
1
+ import { IconProps } from './types';
2
+ declare const DAI: (props: IconProps) => import("react/jsx-runtime").JSX.Element;
3
+ export default DAI;
@@ -0,0 +1,27 @@
1
+ import { jsxs as t, jsx as H } from "react/jsx-runtime";
2
+ import { getBackgroundClass as s, getIconFillClass as V } from "./utils.js";
3
+ const o = (C) => /* @__PURE__ */ t(
4
+ "svg",
5
+ {
6
+ width: "88",
7
+ height: "88",
8
+ viewBox: "0 0 88 88",
9
+ fill: "none",
10
+ xmlns: "http://www.w3.org/2000/svg",
11
+ ...C,
12
+ style: { color: "#FFB833" },
13
+ children: [
14
+ /* @__PURE__ */ H("rect", { width: "88", height: "88", rx: "44", className: s(C) }),
15
+ /* @__PURE__ */ H(
16
+ "path",
17
+ {
18
+ d: "M44.562 46.547H58.2374C58.529 46.547 58.6666 46.547 58.6877 46.1648C58.7994 44.7736 58.7994 43.3743 58.6877 41.9815C58.6877 41.7111 58.5532 41.5993 58.2601 41.5993H31.0437C30.7068 41.5993 30.6161 41.7111 30.6161 42.0269V46.0304C30.6161 46.547 30.6161 46.547 31.1554 46.547H44.562ZM57.1604 36.9205C57.1993 36.8184 57.1993 36.7067 57.1604 36.6063C56.9321 36.1091 56.6616 35.6345 56.3474 35.1892C55.8745 34.428 55.3174 33.7267 54.6825 33.0967C54.3829 32.7161 54.0363 32.3744 53.6477 32.0845C51.701 30.4277 49.3866 29.2552 46.899 28.6656C45.6439 28.3838 44.3612 28.2494 43.0753 28.2608H30.9967C30.6598 28.2608 30.6145 28.3952 30.6145 28.6883V36.6727C30.6145 37.0095 30.6145 37.1002 31.042 37.1002H56.9985C56.9985 37.1002 57.2236 37.0549 57.269 36.9205H57.1588H57.1604ZM57.1604 51.2259C56.7782 51.1838 56.3928 51.1838 56.0106 51.2259H31.0663C30.7295 51.2259 30.6161 51.2259 30.6161 51.6761V59.4823C30.6161 59.8419 30.6161 59.9326 31.0663 59.9326H42.5829C43.1336 59.9747 43.6842 59.9358 44.2235 59.8208C45.8949 59.701 47.5387 59.3382 49.1064 58.7406C49.6765 58.543 50.2272 58.2855 50.747 57.9762H50.9041C53.6039 56.572 55.7968 54.3662 57.1799 51.6583C57.1799 51.6583 57.337 51.3182 57.1604 51.2291V51.2259ZM26.096 63.9798V63.8454V58.6045V56.8279V51.5417C26.096 51.2486 26.096 51.2048 25.7364 51.2048H20.8551C20.5846 51.2048 20.4729 51.2048 20.4729 50.8453V46.5713H25.6911C25.9826 46.5713 26.096 46.5713 26.096 46.1891V41.9605C26.096 41.69 26.096 41.6236 25.7364 41.6236H20.8551C20.5846 41.6236 20.4729 41.6236 20.4729 41.2641V37.3059C20.4729 37.0581 20.4729 36.9917 20.8324 36.9917H25.6684C26.0053 36.9917 26.096 36.9917 26.096 36.5642V24.4403C26.096 24.0807 26.096 23.99 26.5462 23.99H43.4154C44.6397 24.0386 45.856 24.173 47.0593 24.3949C49.5389 24.8532 51.9212 25.7391 54.0995 27.004C55.5441 27.8543 56.8738 28.881 58.0577 30.0633C58.9484 30.9881 59.7517 31.989 60.4643 33.0546C61.1721 34.1348 61.76 35.2896 62.2215 36.4961C62.2782 36.8103 62.5794 37.0225 62.8936 36.9691H66.9198C67.4364 36.9691 67.4365 36.969 67.4591 37.4646V41.154C67.4591 41.5135 67.3247 41.6042 66.9635 41.6042H63.8589C63.5447 41.6042 63.454 41.6042 63.4767 42.0091C63.5998 43.3792 63.5998 44.7542 63.4767 46.1243C63.4767 46.5065 63.4767 46.5519 63.9058 46.5519H67.4575C67.6146 46.7543 67.4575 46.9568 67.4575 47.1608C67.4802 47.4216 67.4802 47.6856 67.4575 47.9463V50.6688C67.4575 51.051 67.3458 51.1644 67.0073 51.1644H62.756C62.4596 51.1077 62.1713 51.2972 62.1033 51.5919C61.0911 54.2237 59.4715 56.5833 57.3791 58.475C56.6147 59.1633 55.8114 59.8111 54.9724 60.4087C54.072 60.927 53.1958 61.4663 52.2727 61.8938C50.5738 62.6583 48.7923 63.2219 46.9638 63.5798C45.2276 63.8907 43.4672 64.0316 41.7003 64.0073H26.0895V63.9847L26.096 63.9798Z",
19
+ className: V(C)
20
+ }
21
+ )
22
+ ]
23
+ }
24
+ );
25
+ export {
26
+ o as default
27
+ };
@@ -1,3 +1,3 @@
1
- import { default as React } from 'react';
2
- declare const ETH: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
1
+ import { IconProps } from './types';
2
+ declare const ETH: (props: IconProps) => import("react/jsx-runtime").JSX.Element;
3
3
  export default ETH;
@@ -1,5 +1,6 @@
1
- import { jsxs as r, jsx as t } from "react/jsx-runtime";
2
- const a = (i) => /* @__PURE__ */ r(
1
+ import { jsxs as t, jsx as l } from "react/jsx-runtime";
2
+ import { getBackgroundClass as s, getIconFillClass as o } from "./utils.js";
3
+ const d = (e) => /* @__PURE__ */ t(
3
4
  "svg",
4
5
  {
5
6
  width: "88",
@@ -7,70 +8,22 @@ const a = (i) => /* @__PURE__ */ r(
7
8
  viewBox: "0 0 88 88",
8
9
  fill: "none",
9
10
  xmlns: "http://www.w3.org/2000/svg",
10
- ...i,
11
+ ...e,
12
+ style: { color: "#3385FF" },
11
13
  children: [
12
- /* @__PURE__ */ t("circle", { cx: "44", cy: "44", r: "44", fill: "#007FD3" }),
13
- /* @__PURE__ */ t("circle", { cx: "44", cy: "44", r: "44", fill: "url(#paint0_radial_12_1277)" }),
14
- /* @__PURE__ */ t("circle", { cx: "44", cy: "44", r: "44", fill: "url(#paint1_radial_12_1277)" }),
15
- /* @__PURE__ */ t(
14
+ /* @__PURE__ */ l("rect", { width: "88", height: "88", rx: "44", className: s(e) }),
15
+ /* @__PURE__ */ l(
16
16
  "path",
17
17
  {
18
18
  fillRule: "evenodd",
19
19
  clipRule: "evenodd",
20
- d: "M43.6241 23.0001L43.6242 23V23.0003L56.7466 44.3895L43.6241 38.5258L30.5 44.3895L43.6241 23.0003V23L43.6241 23.0001ZM43.6241 64.9999V65.0001L43.6242 65L43.6242 65.0001V64.9999L56.7553 46.8331L43.6242 54.4506V54.4489L30.5 46.8331L43.6241 64.9999ZM43.6242 52.0088L56.7466 44.3895L43.6242 38.5294V38.5293L43.6241 38.5294L43.6241 38.5293V38.5294L30.5 44.3895L43.6241 52.0088V52.0089L43.6241 52.0088L43.6242 52.0089V52.0088Z",
21
- fill: "url(#paint2_linear_12_1277)"
20
+ d: "M44 51.5001L31 44.0001L44 24.0001L57 44.0001L44 51.5001ZM44 54.5001L31 47.0001L44 65.0001L57 47.0001L44 54.5001Z",
21
+ className: o(e)
22
22
  }
23
- ),
24
- /* @__PURE__ */ r("defs", { children: [
25
- /* @__PURE__ */ r(
26
- "radialGradient",
27
- {
28
- id: "paint0_radial_12_1277",
29
- cx: "0",
30
- cy: "0",
31
- r: "1",
32
- gradientUnits: "userSpaceOnUse",
33
- gradientTransform: "translate(83.9633 70.1674) rotate(170.361) scale(62.5095 57.5688)",
34
- children: [
35
- /* @__PURE__ */ t("stop", { stopColor: "#0AA5DE" }),
36
- /* @__PURE__ */ t("stop", { offset: "1", stopColor: "#0AA5DE", stopOpacity: "0" })
37
- ]
38
- }
39
- ),
40
- /* @__PURE__ */ r(
41
- "radialGradient",
42
- {
43
- id: "paint1_radial_12_1277",
44
- cx: "0",
45
- cy: "0",
46
- r: "1",
47
- gradientUnits: "userSpaceOnUse",
48
- gradientTransform: "translate(6.45871 8.33481) rotate(71.0626) scale(53.4853 52.1862)",
49
- children: [
50
- /* @__PURE__ */ t("stop", { stopColor: "#0B62DF" }),
51
- /* @__PURE__ */ t("stop", { offset: "0.963542", stopColor: "#0B62DF", stopOpacity: "0" })
52
- ]
53
- }
54
- ),
55
- /* @__PURE__ */ r(
56
- "linearGradient",
57
- {
58
- id: "paint2_linear_12_1277",
59
- x1: "43.6277",
60
- y1: "23",
61
- x2: "43.6277",
62
- y2: "65.0001",
63
- gradientUnits: "userSpaceOnUse",
64
- children: [
65
- /* @__PURE__ */ t("stop", { offset: "0.5", stopColor: "white" }),
66
- /* @__PURE__ */ t("stop", { offset: "1", stopColor: "white", stopOpacity: "0.8" })
67
- ]
68
- }
69
- )
70
- ] })
23
+ )
71
24
  ]
72
25
  }
73
26
  );
74
27
  export {
75
- a as default
28
+ d as default
76
29
  };
@@ -1,4 +1,6 @@
1
1
  export { default as BTC } from './btc';
2
2
  export { default as ETH } from './eth';
3
+ export { default as DAI } from './dai';
3
4
  export { default as USDC } from './usdc';
5
+ export { default as USDT } from './usdt';
4
6
  export { default as WLD } from './wld';
@@ -1,10 +1,14 @@
1
1
  import { default as f } from "./btc.js";
2
2
  import { default as r } from "./eth.js";
3
- import { default as d } from "./usdc.js";
4
- import { default as m } from "./wld.js";
3
+ import { default as d } from "./dai.js";
4
+ import { default as m } from "./usdc.js";
5
+ import { default as s } from "./usdt.js";
6
+ import { default as x } from "./wld.js";
5
7
  export {
6
8
  f as BTC,
9
+ d as DAI,
7
10
  r as ETH,
8
- d as USDC,
9
- m as WLD
11
+ m as USDC,
12
+ s as USDT,
13
+ x as WLD
10
14
  };
@@ -0,0 +1,7 @@
1
+ export type TokenVariant = "color" | "monochrome";
2
+ export interface IconProps extends React.SVGProps<SVGSVGElement> {
3
+ /** Variant of the token icon (default: "default") */
4
+ variant?: TokenVariant;
5
+ /** Whether the token is disabled */
6
+ disabled?: boolean;
7
+ }
@@ -1,3 +1,3 @@
1
- import { default as React } from 'react';
2
- declare const USDC: (props: React.SVGProps<SVGSVGElement>) => import("react/jsx-runtime").JSX.Element;
1
+ import { IconProps } from './types';
2
+ declare const USDC: (props: IconProps) => import("react/jsx-runtime").JSX.Element;
3
3
  export default USDC;