@ryanodd/design-system 0.1.0 → 0.2.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 (5) hide show
  1. package/dist/cjs/index.js +19 -19
  2. package/dist/esm/index.d.ts +205 -6
  3. package/dist/esm/index.js +3755 -2460
  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,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: 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
+ 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?: "small" | "medium" | "large";
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;