@ryanodd/design-system 0.1.0 → 0.2.0-dev1

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