@ryanodd/design-system 0.1.0-dev1 → 0.1.0-dev10
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/index.js +19 -19
- package/dist/esm/index.d.ts +205 -6
- package/dist/esm/index.js +3755 -2460
- package/dist/index.css +1 -1
- package/package.json +5 -2
package/dist/esm/index.d.ts
CHANGED
|
@@ -4,6 +4,7 @@ import { ComponentType } from 'react';
|
|
|
4
4
|
import { DetailedHTMLProps } from 'react';
|
|
5
5
|
import { ForwardRefExoticComponent } from 'react';
|
|
6
6
|
import { HTMLAttributes } from 'react';
|
|
7
|
+
import { InputHTMLAttributes } from 'react';
|
|
7
8
|
import { JSX } from 'react/jsx-runtime';
|
|
8
9
|
import * as RadixDialog from '@radix-ui/react-dialog';
|
|
9
10
|
import * as RadixMenuButton from '@radix-ui/react-dropdown-menu';
|
|
@@ -11,7 +12,9 @@ import * as RadixToast from '@radix-ui/react-toast';
|
|
|
11
12
|
import * as RadixTooltip from '@radix-ui/react-tooltip';
|
|
12
13
|
import { ReactNode } from 'react';
|
|
13
14
|
import { RefAttributes } from 'react';
|
|
15
|
+
import * as Select from '@radix-ui/react-select';
|
|
14
16
|
import { SVGProps } from 'react';
|
|
17
|
+
import { TextareaHTMLAttributes } from 'react';
|
|
15
18
|
|
|
16
19
|
export declare const ArrowLeft: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
17
20
|
size?: (typeof iconSizes)[number];
|
|
@@ -21,10 +24,21 @@ export declare const ArrowRight: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGE
|
|
|
21
24
|
size?: (typeof iconSizes)[number];
|
|
22
25
|
} & RefAttributes<SVGSVGElement>>;
|
|
23
26
|
|
|
27
|
+
export declare const Badge: ({ variant, size, className, ...props }: BadgeProps) => JSX.Element;
|
|
28
|
+
|
|
29
|
+
export declare type BadgeProps = React.HTMLAttributes<HTMLDivElement> & {
|
|
30
|
+
variant?: "neutral" | "success" | "warning" | "error" | "brand";
|
|
31
|
+
size?: "sm" | "md" | "lg";
|
|
32
|
+
};
|
|
33
|
+
|
|
24
34
|
export declare const Button: ForwardRefExoticComponent<Omit<DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & Props & RefAttributes<HTMLButtonElement>>;
|
|
25
35
|
|
|
26
36
|
export declare type ButtonProps = ComponentPropsWithoutRef<"button"> & Props;
|
|
27
37
|
|
|
38
|
+
export declare const Calendar: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
39
|
+
size?: (typeof iconSizes)[number];
|
|
40
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
41
|
+
|
|
28
42
|
export declare const Check: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
29
43
|
size?: (typeof iconSizes)[number];
|
|
30
44
|
} & RefAttributes<SVGSVGElement>>;
|
|
@@ -38,6 +52,22 @@ export declare type CheckboxProps = {
|
|
|
38
52
|
onClick: (checked: boolean) => void;
|
|
39
53
|
};
|
|
40
54
|
|
|
55
|
+
export declare const ChevronDown: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
56
|
+
size?: (typeof iconSizes)[number];
|
|
57
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
58
|
+
|
|
59
|
+
export declare const ChevronLeft: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
60
|
+
size?: (typeof iconSizes)[number];
|
|
61
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
62
|
+
|
|
63
|
+
export declare const ChevronRight: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
64
|
+
size?: (typeof iconSizes)[number];
|
|
65
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
66
|
+
|
|
67
|
+
export declare const ChevronUp: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
68
|
+
size?: (typeof iconSizes)[number];
|
|
69
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
70
|
+
|
|
41
71
|
export declare const Circle: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
42
72
|
size?: (typeof iconSizes)[number];
|
|
43
73
|
} & RefAttributes<SVGSVGElement>>;
|
|
@@ -46,16 +76,32 @@ export declare const Close: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElemen
|
|
|
46
76
|
size?: (typeof iconSizes)[number];
|
|
47
77
|
} & RefAttributes<SVGSVGElement>>;
|
|
48
78
|
|
|
79
|
+
export declare const Coffee: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
80
|
+
size?: (typeof iconSizes)[number];
|
|
81
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
82
|
+
|
|
49
83
|
export declare const createIcon: (SVG: ComponentType<HTMLAttributes<SVGSVGElement>>, label: string) => ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
50
84
|
size?: (typeof iconSizes)[number];
|
|
51
85
|
} & RefAttributes<SVGSVGElement>>;
|
|
52
86
|
|
|
53
|
-
export declare const Dialog: ({ trigger,
|
|
87
|
+
export declare const Dialog: ({ trigger, children, title, size, ...props }: DialogProps) => JSX.Element;
|
|
54
88
|
|
|
55
89
|
export declare type DialogProps = RadixDialog.DialogProps & {
|
|
56
90
|
title: ReactNode;
|
|
57
91
|
trigger: ReactNode;
|
|
58
|
-
|
|
92
|
+
children: ReactNode;
|
|
93
|
+
size?: DialogSize;
|
|
94
|
+
};
|
|
95
|
+
|
|
96
|
+
export declare type DialogSize = typeof dialogSizes[number];
|
|
97
|
+
|
|
98
|
+
export declare const dialogSizes: string[];
|
|
99
|
+
|
|
100
|
+
export declare const EmptyState: ({ title, description, ...props }: EmptyStateProps) => JSX.Element;
|
|
101
|
+
|
|
102
|
+
export declare type EmptyStateProps = React.HTMLAttributes<HTMLDivElement> & {
|
|
103
|
+
title: string;
|
|
104
|
+
description?: string;
|
|
59
105
|
};
|
|
60
106
|
|
|
61
107
|
export declare const ExternalLink: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
@@ -74,7 +120,80 @@ export declare const Heart: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElemen
|
|
|
74
120
|
size?: (typeof iconSizes)[number];
|
|
75
121
|
} & RefAttributes<SVGSVGElement>>;
|
|
76
122
|
|
|
77
|
-
export declare const IconMap:
|
|
123
|
+
export declare const IconMap: {
|
|
124
|
+
ArrowLeft: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
125
|
+
size?: (typeof iconSizes)[number];
|
|
126
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
127
|
+
ArrowRight: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
128
|
+
size?: (typeof iconSizes)[number];
|
|
129
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
130
|
+
Calendar: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
131
|
+
size?: (typeof iconSizes)[number];
|
|
132
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
133
|
+
Check: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
134
|
+
size?: (typeof iconSizes)[number];
|
|
135
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
136
|
+
Circle: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
137
|
+
size?: (typeof iconSizes)[number];
|
|
138
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
139
|
+
Close: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
140
|
+
size?: (typeof iconSizes)[number];
|
|
141
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
142
|
+
Coffee: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
143
|
+
size?: (typeof iconSizes)[number];
|
|
144
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
145
|
+
ExternalLink: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
146
|
+
size?: (typeof iconSizes)[number];
|
|
147
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
148
|
+
Gear: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
149
|
+
size?: (typeof iconSizes)[number];
|
|
150
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
151
|
+
Hammer: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
152
|
+
size?: (typeof iconSizes)[number];
|
|
153
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
154
|
+
Heart: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
155
|
+
size?: (typeof iconSizes)[number];
|
|
156
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
157
|
+
Inbox: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
158
|
+
size?: (typeof iconSizes)[number];
|
|
159
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
160
|
+
Kebab: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
161
|
+
size?: (typeof iconSizes)[number];
|
|
162
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
163
|
+
Lamp: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
164
|
+
size?: (typeof iconSizes)[number];
|
|
165
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
166
|
+
Lightning: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
167
|
+
size?: (typeof iconSizes)[number];
|
|
168
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
169
|
+
LogIn: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
170
|
+
size?: (typeof iconSizes)[number];
|
|
171
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
172
|
+
LogOut: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
173
|
+
size?: (typeof iconSizes)[number];
|
|
174
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
175
|
+
Mail: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
176
|
+
size?: (typeof iconSizes)[number];
|
|
177
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
178
|
+
Menu: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
179
|
+
size?: (typeof iconSizes)[number];
|
|
180
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
181
|
+
NoMobile: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
182
|
+
size?: (typeof iconSizes)[number];
|
|
183
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
184
|
+
Pencil: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
185
|
+
size?: (typeof iconSizes)[number];
|
|
186
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
187
|
+
Plus: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
188
|
+
size?: (typeof iconSizes)[number];
|
|
189
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
190
|
+
Signpost: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
191
|
+
size?: (typeof iconSizes)[number];
|
|
192
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
193
|
+
SunMoon: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
194
|
+
size?: (typeof iconSizes)[number];
|
|
195
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
196
|
+
};
|
|
78
197
|
|
|
79
198
|
export declare type IconProps = ComponentPropsWithoutRef<"svg"> & {
|
|
80
199
|
size?: typeof iconSizes[number];
|
|
@@ -82,14 +201,34 @@ export declare type IconProps = ComponentPropsWithoutRef<"svg"> & {
|
|
|
82
201
|
|
|
83
202
|
export declare const iconSizes: readonly ["xs", "sm", "md", "lg", "xl", "2xl", "3xl", "4xl"];
|
|
84
203
|
|
|
204
|
+
export declare const Inbox: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
205
|
+
size?: (typeof iconSizes)[number];
|
|
206
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
207
|
+
|
|
208
|
+
export declare const Input: ForwardRefExoticComponent<Omit<DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & Props_2 & RefAttributes<HTMLInputElement>>;
|
|
209
|
+
|
|
210
|
+
export declare type InputProps = ComponentPropsWithoutRef<"input"> & Props_2;
|
|
211
|
+
|
|
85
212
|
export declare const Kebab: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
86
213
|
size?: (typeof iconSizes)[number];
|
|
87
214
|
} & RefAttributes<SVGSVGElement>>;
|
|
88
215
|
|
|
216
|
+
export declare const Lamp: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
217
|
+
size?: (typeof iconSizes)[number];
|
|
218
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
219
|
+
|
|
89
220
|
export declare const Lightning: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
90
221
|
size?: (typeof iconSizes)[number];
|
|
91
222
|
} & RefAttributes<SVGSVGElement>>;
|
|
92
223
|
|
|
224
|
+
export declare const LogIn: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
225
|
+
size?: (typeof iconSizes)[number];
|
|
226
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
227
|
+
|
|
228
|
+
export declare const LogOut: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
229
|
+
size?: (typeof iconSizes)[number];
|
|
230
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
231
|
+
|
|
93
232
|
export declare const Mail: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
94
233
|
size?: (typeof iconSizes)[number];
|
|
95
234
|
} & RefAttributes<SVGSVGElement>>;
|
|
@@ -98,16 +237,18 @@ export declare const Menu: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement
|
|
|
98
237
|
size?: (typeof iconSizes)[number];
|
|
99
238
|
} & RefAttributes<SVGSVGElement>>;
|
|
100
239
|
|
|
101
|
-
export declare const MenuButton: ({ children, ...props }: MenuButtonProps) => JSX.Element;
|
|
240
|
+
export declare const MenuButton: ({ children, trigger, ...props }: MenuButtonProps) => JSX.Element;
|
|
102
241
|
|
|
103
|
-
export declare const MenuButtonItem: ({ children, ...props }: MenuButtonItemProps) => JSX.Element;
|
|
242
|
+
export declare const MenuButtonItem: ({ children, icon, ...props }: MenuButtonItemProps) => JSX.Element;
|
|
104
243
|
|
|
105
244
|
export declare type MenuButtonItemProps = React.ComponentPropsWithoutRef<typeof RadixMenuButton.Item> & {
|
|
106
245
|
children: ReactNode;
|
|
246
|
+
icon?: keyof typeof IconMap;
|
|
107
247
|
};
|
|
108
248
|
|
|
109
249
|
export declare type MenuButtonProps = React.ComponentPropsWithoutRef<typeof RadixMenuButton.Root> & {
|
|
110
250
|
children: ReactNode;
|
|
251
|
+
trigger: ReactNode;
|
|
111
252
|
};
|
|
112
253
|
|
|
113
254
|
export declare const NoMobile: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
@@ -118,9 +259,24 @@ export declare const Pencil: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGEleme
|
|
|
118
259
|
size?: (typeof iconSizes)[number];
|
|
119
260
|
} & RefAttributes<SVGSVGElement>>;
|
|
120
261
|
|
|
262
|
+
export declare const Plus: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
263
|
+
size?: (typeof iconSizes)[number];
|
|
264
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
265
|
+
|
|
266
|
+
export declare const Popover: ({ trigger, title, size, popoverContent, ...props }: PopoverProps) => JSX.Element;
|
|
267
|
+
|
|
268
|
+
export declare type PopoverProps = {
|
|
269
|
+
trigger: ReactNode;
|
|
270
|
+
title?: string;
|
|
271
|
+
size?: PopoverSize;
|
|
272
|
+
popoverContent: ReactNode;
|
|
273
|
+
} & React.HTMLAttributes<HTMLDivElement>;
|
|
274
|
+
|
|
275
|
+
export declare type PopoverSize = "sm" | "md" | "lg";
|
|
276
|
+
|
|
121
277
|
declare type Props = {
|
|
122
278
|
children?: ReactNode;
|
|
123
|
-
size?: "
|
|
279
|
+
size?: "sm" | "md" | "lg";
|
|
124
280
|
variant?: "primary" | "secondary" | "destructive" | "tertiary";
|
|
125
281
|
loading?: boolean;
|
|
126
282
|
iconOnly?: boolean;
|
|
@@ -136,6 +292,41 @@ declare type Props = {
|
|
|
136
292
|
trailingIcon?: keyof typeof IconMap;
|
|
137
293
|
};
|
|
138
294
|
|
|
295
|
+
declare type Props_2 = {
|
|
296
|
+
label?: string;
|
|
297
|
+
error?: string;
|
|
298
|
+
helperText?: string;
|
|
299
|
+
startIcon?: keyof typeof IconMap;
|
|
300
|
+
endIcon?: keyof typeof IconMap;
|
|
301
|
+
};
|
|
302
|
+
|
|
303
|
+
declare type Props_3 = {
|
|
304
|
+
label?: string;
|
|
305
|
+
error?: string;
|
|
306
|
+
helperText?: string;
|
|
307
|
+
placeholder?: string;
|
|
308
|
+
children?: ReactNode;
|
|
309
|
+
};
|
|
310
|
+
|
|
311
|
+
declare type Props_4 = {
|
|
312
|
+
label?: string;
|
|
313
|
+
error?: string;
|
|
314
|
+
helperText?: string;
|
|
315
|
+
};
|
|
316
|
+
|
|
317
|
+
export declare const SelectInput: {
|
|
318
|
+
({ label, error, helperText, placeholder, children, ...props }: SelectInputProps): JSX.Element;
|
|
319
|
+
displayName: string;
|
|
320
|
+
};
|
|
321
|
+
|
|
322
|
+
export declare type SelectInputProps = ComponentPropsWithoutRef<typeof Select.Root> & Props_3;
|
|
323
|
+
|
|
324
|
+
export declare const SelectItem: ForwardRefExoticComponent<Omit<Select.SelectItemProps & RefAttributes<HTMLDivElement>, "ref"> & RefAttributes<HTMLDivElement>>;
|
|
325
|
+
|
|
326
|
+
export declare const Signpost: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
327
|
+
size?: (typeof iconSizes)[number];
|
|
328
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
329
|
+
|
|
139
330
|
export declare const Spinner: ForwardRefExoticComponent<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
|
|
140
331
|
/**
|
|
141
332
|
* Indicates the diameter (height/width) of the `Spinner`'s container
|
|
@@ -152,6 +343,14 @@ export declare type SpinnerProps = ComponentPropsWithoutRef<"div"> & {
|
|
|
152
343
|
|
|
153
344
|
export declare type SpinnerSize = typeof iconSizes[number];
|
|
154
345
|
|
|
346
|
+
export declare const SunMoon: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
|
|
347
|
+
size?: (typeof iconSizes)[number];
|
|
348
|
+
} & RefAttributes<SVGSVGElement>>;
|
|
349
|
+
|
|
350
|
+
export declare const TextArea: ForwardRefExoticComponent<Omit<DetailedHTMLProps<TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref"> & Props_4 & RefAttributes<HTMLTextAreaElement>>;
|
|
351
|
+
|
|
352
|
+
export declare type TextAreaProps = ComponentPropsWithoutRef<"textarea"> & Props_4;
|
|
353
|
+
|
|
155
354
|
export declare const Toast: ForwardRefExoticComponent<RadixToast.ToastProps & {
|
|
156
355
|
toastTitle: ReactNode;
|
|
157
356
|
toastDescription?: ReactNode;
|