@ryanodd/design-system 0.1.0 → 0.2.0-dev2

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 (5) hide show
  1. package/dist/cjs/index.js +19 -19
  2. package/dist/esm/index.d.ts +220 -7
  3. package/dist/esm/index.js +3787 -2469
  4. package/dist/index.css +1 -1
  5. package/package.json +8 -5
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, content, title, ...props }: DialogProps) => JSX.Element;
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
- content: ReactNode;
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,22 +120,125 @@ 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: Record<string, ComponentType<IconProps> | null>;
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
+ LogoGoogle: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
173
+ size?: (typeof iconSizes)[number];
174
+ } & RefAttributes<SVGSVGElement>>;
175
+ LogOut: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
176
+ size?: (typeof iconSizes)[number];
177
+ } & RefAttributes<SVGSVGElement>>;
178
+ Mail: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
179
+ size?: (typeof iconSizes)[number];
180
+ } & RefAttributes<SVGSVGElement>>;
181
+ Menu: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
182
+ size?: (typeof iconSizes)[number];
183
+ } & RefAttributes<SVGSVGElement>>;
184
+ NoMobile: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
185
+ size?: (typeof iconSizes)[number];
186
+ } & RefAttributes<SVGSVGElement>>;
187
+ Pencil: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
188
+ size?: (typeof iconSizes)[number];
189
+ } & RefAttributes<SVGSVGElement>>;
190
+ Plus: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
191
+ size?: (typeof iconSizes)[number];
192
+ } & RefAttributes<SVGSVGElement>>;
193
+ Signpost: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
194
+ size?: (typeof iconSizes)[number];
195
+ } & RefAttributes<SVGSVGElement>>;
196
+ Sun: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
197
+ size?: (typeof iconSizes)[number];
198
+ } & RefAttributes<SVGSVGElement>>;
199
+ SunMoon: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
200
+ size?: (typeof iconSizes)[number];
201
+ } & RefAttributes<SVGSVGElement>>;
202
+ };
78
203
 
79
204
  export declare type IconProps = ComponentPropsWithoutRef<"svg"> & {
80
- size?: typeof iconSizes[number];
205
+ size?: (typeof iconSizes)[number];
81
206
  };
82
207
 
83
208
  export declare const iconSizes: readonly ["xs", "sm", "md", "lg", "xl", "2xl", "3xl", "4xl"];
84
209
 
210
+ export declare const Inbox: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
211
+ size?: (typeof iconSizes)[number];
212
+ } & RefAttributes<SVGSVGElement>>;
213
+
214
+ export declare const Input: ForwardRefExoticComponent<Omit<DetailedHTMLProps<InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & Props_2 & RefAttributes<HTMLInputElement>>;
215
+
216
+ export declare type InputProps = ComponentPropsWithoutRef<"input"> & Props_2;
217
+
85
218
  export declare const Kebab: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
86
219
  size?: (typeof iconSizes)[number];
87
220
  } & RefAttributes<SVGSVGElement>>;
88
221
 
222
+ export declare const Lamp: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
223
+ size?: (typeof iconSizes)[number];
224
+ } & RefAttributes<SVGSVGElement>>;
225
+
89
226
  export declare const Lightning: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
90
227
  size?: (typeof iconSizes)[number];
91
228
  } & RefAttributes<SVGSVGElement>>;
92
229
 
230
+ export declare const LogIn: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
231
+ size?: (typeof iconSizes)[number];
232
+ } & RefAttributes<SVGSVGElement>>;
233
+
234
+ export declare const LogoGoogle: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
235
+ size?: (typeof iconSizes)[number];
236
+ } & RefAttributes<SVGSVGElement>>;
237
+
238
+ export declare const LogOut: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
239
+ size?: (typeof iconSizes)[number];
240
+ } & RefAttributes<SVGSVGElement>>;
241
+
93
242
  export declare const Mail: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
94
243
  size?: (typeof iconSizes)[number];
95
244
  } & RefAttributes<SVGSVGElement>>;
@@ -98,16 +247,18 @@ export declare const Menu: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement
98
247
  size?: (typeof iconSizes)[number];
99
248
  } & RefAttributes<SVGSVGElement>>;
100
249
 
101
- export declare const MenuButton: ({ children, ...props }: MenuButtonProps) => JSX.Element;
250
+ export declare const MenuButton: ({ children, trigger, ...props }: MenuButtonProps) => JSX.Element;
102
251
 
103
- export declare const MenuButtonItem: ({ children, ...props }: MenuButtonItemProps) => JSX.Element;
252
+ export declare const MenuButtonItem: ({ children, icon, ...props }: MenuButtonItemProps) => JSX.Element;
104
253
 
105
254
  export declare type MenuButtonItemProps = React.ComponentPropsWithoutRef<typeof RadixMenuButton.Item> & {
106
255
  children: ReactNode;
256
+ icon?: keyof typeof IconMap;
107
257
  };
108
258
 
109
259
  export declare type MenuButtonProps = React.ComponentPropsWithoutRef<typeof RadixMenuButton.Root> & {
110
260
  children: ReactNode;
261
+ trigger: ReactNode;
111
262
  };
112
263
 
113
264
  export declare const NoMobile: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
@@ -118,9 +269,24 @@ export declare const Pencil: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGEleme
118
269
  size?: (typeof iconSizes)[number];
119
270
  } & RefAttributes<SVGSVGElement>>;
120
271
 
272
+ export declare const Plus: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
273
+ size?: (typeof iconSizes)[number];
274
+ } & RefAttributes<SVGSVGElement>>;
275
+
276
+ export declare const Popover: ({ trigger, title, size, popoverContent, ...props }: PopoverProps) => JSX.Element;
277
+
278
+ export declare type PopoverProps = {
279
+ trigger: ReactNode;
280
+ title?: string;
281
+ size?: PopoverSize;
282
+ popoverContent: ReactNode;
283
+ } & React.HTMLAttributes<HTMLDivElement>;
284
+
285
+ export declare type PopoverSize = "sm" | "md" | "lg";
286
+
121
287
  declare type Props = {
122
288
  children?: ReactNode;
123
- size?: "small" | "medium" | "large";
289
+ size?: "sm" | "md" | "lg";
124
290
  variant?: "primary" | "secondary" | "destructive" | "tertiary";
125
291
  loading?: boolean;
126
292
  iconOnly?: boolean;
@@ -136,6 +302,41 @@ declare type Props = {
136
302
  trailingIcon?: keyof typeof IconMap;
137
303
  };
138
304
 
305
+ declare type Props_2 = {
306
+ label?: string;
307
+ error?: string;
308
+ helperText?: string;
309
+ startIcon?: keyof typeof IconMap;
310
+ endIcon?: keyof typeof IconMap;
311
+ };
312
+
313
+ declare type Props_3 = {
314
+ label?: string;
315
+ error?: string;
316
+ helperText?: string;
317
+ placeholder?: string;
318
+ children?: ReactNode;
319
+ };
320
+
321
+ declare type Props_4 = {
322
+ label?: string;
323
+ error?: string;
324
+ helperText?: string;
325
+ };
326
+
327
+ export declare const SelectInput: {
328
+ ({ label, error, helperText, placeholder, children, ...props }: SelectInputProps): JSX.Element;
329
+ displayName: string;
330
+ };
331
+
332
+ export declare type SelectInputProps = ComponentPropsWithoutRef<typeof Select.Root> & Props_3;
333
+
334
+ export declare const SelectItem: ForwardRefExoticComponent<Omit<Select.SelectItemProps & RefAttributes<HTMLDivElement>, "ref"> & RefAttributes<HTMLDivElement>>;
335
+
336
+ export declare const Signpost: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
337
+ size?: (typeof iconSizes)[number];
338
+ } & RefAttributes<SVGSVGElement>>;
339
+
139
340
  export declare const Spinner: ForwardRefExoticComponent<Omit<DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
140
341
  /**
141
342
  * Indicates the diameter (height/width) of the `Spinner`'s container
@@ -152,6 +353,18 @@ export declare type SpinnerProps = ComponentPropsWithoutRef<"div"> & {
152
353
 
153
354
  export declare type SpinnerSize = typeof iconSizes[number];
154
355
 
356
+ export declare const Sun: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
357
+ size?: (typeof iconSizes)[number];
358
+ } & RefAttributes<SVGSVGElement>>;
359
+
360
+ export declare const SunMoon: ForwardRefExoticComponent<Omit<SVGProps<SVGSVGElement>, "ref"> & {
361
+ size?: (typeof iconSizes)[number];
362
+ } & RefAttributes<SVGSVGElement>>;
363
+
364
+ export declare const TextArea: ForwardRefExoticComponent<Omit<DetailedHTMLProps<TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref"> & Props_4 & RefAttributes<HTMLTextAreaElement>>;
365
+
366
+ export declare type TextAreaProps = ComponentPropsWithoutRef<"textarea"> & Props_4;
367
+
155
368
  export declare const Toast: ForwardRefExoticComponent<RadixToast.ToastProps & {
156
369
  toastTitle: ReactNode;
157
370
  toastDescription?: ReactNode;