@nayhoo/ui 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.
package/dist/index.d.ts CHANGED
@@ -1,8 +1,8 @@
1
1
  import * as react_jsx_runtime from 'react/jsx-runtime';
2
+ import React$1 from 'react';
2
3
  import * as _vanilla_extract_recipes from '@vanilla-extract/recipes';
3
4
  import { RecipeVariants } from '@vanilla-extract/recipes';
4
5
  import * as AvatarPrimitive from '@radix-ui/react-avatar';
5
- import * as react from 'react';
6
6
  import * as FormPrimitive from '@radix-ui/react-form';
7
7
  import * as SeparatorPrimitive from '@radix-ui/react-separator';
8
8
  import * as SwitchPrimitive from '@radix-ui/react-switch';
@@ -51,17 +51,58 @@ declare const Avatar: ({ alt, fallback, shape, size, src, status, style, ...prop
51
51
  interactive?: boolean | undefined;
52
52
  } & {
53
53
  alt?: string | undefined;
54
- fallback?: React.ReactNode;
54
+ fallback?: React$1.ReactNode;
55
55
  src?: string | undefined;
56
56
  status?: StatusVariants["variant"];
57
57
  }) => react_jsx_runtime.JSX.Element;
58
58
 
59
+ declare const badgeRecipe: _vanilla_extract_recipes.RuntimeFn<{
60
+ color: {
61
+ primary: {
62
+ backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
63
+ color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
64
+ };
65
+ secondary: {
66
+ backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
67
+ color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
68
+ };
69
+ error: {
70
+ backgroundColor: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
71
+ color: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
72
+ };
73
+ };
74
+ size: {
75
+ "1": {
76
+ height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
77
+ paddingLeft: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
78
+ paddingRight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
79
+ fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
80
+ };
81
+ "2": {
82
+ height: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
83
+ paddingLeft: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
84
+ paddingRight: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
85
+ fontSize: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
86
+ };
87
+ };
88
+ }>;
89
+ type BadgeVariants = NonNullable<RecipeVariants<typeof badgeRecipe>>;
90
+
59
91
  type ComponentProps<E extends React.ElementType, Variants> = Variants & React.ComponentProps<E> & {
60
92
  asChild?: boolean;
61
93
  };
62
94
 
95
+ declare const defaultElement$f = "span";
96
+ type BadgeProps = ComponentProps<typeof defaultElement$f, BadgeVariants & {
97
+ label: string;
98
+ }>;
99
+ declare const Badge: ({ asChild, color, size, label, ...props }: BadgeProps) => react_jsx_runtime.JSX.Element;
100
+
101
+ declare const boxRecipe: _vanilla_extract_recipes.RuntimeFn<{}>;
102
+ type BoxVariants = NonNullable<RecipeVariants<typeof boxRecipe>>;
103
+
63
104
  declare const defaultElement$e = "div";
64
- type BoxProps$1 = ComponentProps<typeof defaultElement$e, {}>;
105
+ type BoxProps$1 = ComponentProps<typeof defaultElement$e, BoxVariants>;
65
106
  declare const Box: ({ asChild, ...props }: BoxProps$1) => react_jsx_runtime.JSX.Element;
66
107
 
67
108
  declare const buttonRecipe: _vanilla_extract_recipes.RuntimeFn<{
@@ -303,12 +344,12 @@ declare const formMessageRecipe: _vanilla_extract_recipes.RuntimeFn<{
303
344
  }>;
304
345
  type FormMessageVariants = NonNullable<RecipeVariants<typeof formMessageRecipe>>;
305
346
 
306
- declare const Form: react.ForwardRefExoticComponent<FormPrimitive.FormProps & react.RefAttributes<HTMLFormElement>>;
307
- declare const FormControl: react.ForwardRefExoticComponent<FormPrimitive.FormControlProps & react.RefAttributes<HTMLInputElement>>;
347
+ declare const Form: React$1.ForwardRefExoticComponent<FormPrimitive.FormProps & React$1.RefAttributes<HTMLFormElement>>;
348
+ declare const FormControl: React$1.ForwardRefExoticComponent<FormPrimitive.FormControlProps & React$1.RefAttributes<HTMLInputElement>>;
308
349
  declare const FormField: ({ ...props }: FormPrimitive.FormFieldProps & FormFieldVariants) => react_jsx_runtime.JSX.Element;
309
350
  declare const FormLabel: ({ ...props }: FormPrimitive.FormLabelProps & FormLabelVariants) => react_jsx_runtime.JSX.Element;
310
351
  declare const FormMessage: ({ error, ...props }: FormPrimitive.FormMessageProps & FormMessageVariants) => react_jsx_runtime.JSX.Element;
311
- declare const FormSubmit: react.ForwardRefExoticComponent<FormPrimitive.FormSubmitProps & react.RefAttributes<HTMLButtonElement>>;
352
+ declare const FormSubmit: React$1.ForwardRefExoticComponent<FormPrimitive.FormSubmitProps & React$1.RefAttributes<HTMLButtonElement>>;
312
353
 
313
354
  declare const gridRecipe: _vanilla_extract_recipes.RuntimeFn<{
314
355
  align: {
@@ -330,10 +371,10 @@ declare const gridRecipe: _vanilla_extract_recipes.RuntimeFn<{
330
371
  };
331
372
  columns: {
332
373
  "1": {
333
- gridTemplateRows: "repeat(1, minmax(0, 1fr))";
374
+ gridTemplateColumns: "repeat(1, minmax(0, 1fr))";
334
375
  };
335
376
  "2": {
336
- gridTemplateRows: "repeat(2, minmax(0, 2fr))";
377
+ gridTemplateColumns: "repeat(2, minmax(0, 2fr))";
337
378
  };
338
379
  "3": {
339
380
  gridTemplateColumns: "repeat(3, minmax(0, 3fr))";
@@ -661,8 +702,11 @@ declare const defaultElement$7 = "a";
661
702
  type LinkProps = ComponentProps<typeof defaultElement$7, LinkVariants>;
662
703
  declare const Link: ({ asChild, color, ...props }: LinkProps) => react_jsx_runtime.JSX.Element;
663
704
 
705
+ declare const panelRecipe: _vanilla_extract_recipes.RuntimeFn<{}>;
706
+ type PanelVariants = NonNullable<RecipeVariants<typeof panelRecipe>>;
707
+
664
708
  declare const defaultElement$6 = "div";
665
- type BoxProps = ComponentProps<typeof defaultElement$6, {}>;
709
+ type BoxProps = ComponentProps<typeof defaultElement$6, PanelVariants>;
666
710
  declare const Panel: ({ asChild, ...props }: BoxProps) => react_jsx_runtime.JSX.Element;
667
711
 
668
712
  declare const defaultElement$5 = "p";
@@ -841,7 +885,7 @@ declare const textFieldRecipe: _vanilla_extract_recipes.RuntimeFn<{
841
885
  };
842
886
  error: {
843
887
  true: {
844
- boxShadow: `inset 0px 0px 0px 1px var(--${string})` | `inset 0px 0px 0px 1px var(--${string}, ${string})` | `inset 0px 0px 0px 1px var(--${string}, ${number})`;
888
+ boxShadow: `inset 0px 0px 0px 1px ${string}`;
845
889
  };
846
890
  };
847
891
  cursor: {
@@ -4580,14 +4624,92 @@ declare const theme: {
4580
4624
  };
4581
4625
  };
4582
4626
  semanticColors: {
4583
- primary: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4584
- primaryLighter: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4627
+ primary: {
4628
+ primary1: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4629
+ primary2: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4630
+ primary3: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4631
+ primary4: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4632
+ primary5: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4633
+ primary6: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4634
+ primary7: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4635
+ primary8: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4636
+ primary9: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4637
+ primary10: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4638
+ primary11: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4639
+ primary12: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4640
+ };
4641
+ primaryA: {
4642
+ primaryA1: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4643
+ primaryA2: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4644
+ primaryA3: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4645
+ primaryA4: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4646
+ primaryA5: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4647
+ primaryA6: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4648
+ primaryA7: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4649
+ primaryA8: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4650
+ primaryA9: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4651
+ primaryA10: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4652
+ primaryA11: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4653
+ primaryA12: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4654
+ };
4585
4655
  primaryTextContrast: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4586
- secondary: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4587
- secondaryLighter: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4656
+ secondary: {
4657
+ secondary1: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4658
+ secondary2: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4659
+ secondary3: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4660
+ secondary4: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4661
+ secondary5: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4662
+ secondary6: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4663
+ secondary7: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4664
+ secondary8: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4665
+ secondary9: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4666
+ secondary10: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4667
+ secondary11: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4668
+ secondary12: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4669
+ };
4670
+ secondaryA: {
4671
+ secondaryA1: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4672
+ secondaryA2: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4673
+ secondaryA3: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4674
+ secondaryA4: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4675
+ secondaryA5: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4676
+ secondaryA6: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4677
+ secondaryA7: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4678
+ secondaryA8: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4679
+ secondaryA9: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4680
+ secondaryA10: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4681
+ secondaryA11: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4682
+ secondaryA12: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4683
+ };
4588
4684
  secondaryTextContrast: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4589
- error: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4590
- errorLighter: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4685
+ error: {
4686
+ error1: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4687
+ error2: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4688
+ error3: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4689
+ error4: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4690
+ error5: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4691
+ error6: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4692
+ error7: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4693
+ error8: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4694
+ error9: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4695
+ error10: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4696
+ error11: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4697
+ error12: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4698
+ };
4699
+ errorA: {
4700
+ errorA1: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4701
+ errorA2: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4702
+ errorA3: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4703
+ errorA4: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4704
+ errorA5: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4705
+ errorA6: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4706
+ errorA7: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4707
+ errorA8: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4708
+ errorA9: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4709
+ errorA10: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4710
+ errorA11: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4711
+ errorA12: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4712
+ };
4591
4713
  errorTextContrast: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4592
4714
  background: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
4593
4715
  backgroundTextContrast: `var(--${string})` | `var(--${string}, ${string})` | `var(--${string}, ${number})`;
@@ -4679,4 +4801,4 @@ declare const lightTheme: string;
4679
4801
 
4680
4802
  declare function mergeClasses(...classes: (string | undefined)[]): string;
4681
4803
 
4682
- export { Avatar, Box, Button, Card, Container, Flex, Form, FormControl, FormField, FormLabel, FormMessage, FormSubmit, Grid, Heading, type HeadingProps, IconButton, Link, Panel, Paragraph, Separator, Skeleton, Spinner, type Sprinkles, Status, Switch, Text, TextField, darkTheme, hide, lightTheme, mergeClasses, pulse, spin, sprinkles, theme };
4804
+ export { Avatar, Badge, Box, Button, Card, Container, Flex, Form, FormControl, FormField, FormLabel, FormMessage, FormSubmit, Grid, Heading, type HeadingProps, IconButton, Link, Panel, Paragraph, Separator, Skeleton, Spinner, type Sprinkles, Status, Switch, Text, TextField, darkTheme, hide, lightTheme, mergeClasses, pulse, spin, sprinkles, theme };