@szum-tech/design-system 1.15.3 → 1.15.5
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.mts +224 -0
- package/icons/index.d.mts +13 -0
- package/package.json +7 -7
- package/theme/main-preset.js +1 -1
package/dist/index.d.mts
ADDED
|
@@ -0,0 +1,224 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import React__default from 'react';
|
|
3
|
+
import * as ReactAvatar from '@radix-ui/react-avatar';
|
|
4
|
+
import { VariantProps } from 'class-variance-authority';
|
|
5
|
+
import * as class_variance_authority_dist_types from 'class-variance-authority/dist/types';
|
|
6
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
7
|
+
import * as ReactTooltip from '@radix-ui/react-tooltip';
|
|
8
|
+
import * as ReactSelect from '@radix-ui/react-select';
|
|
9
|
+
import * as ReactSheet from '@radix-ui/react-dialog';
|
|
10
|
+
import * as ReactSeparator from '@radix-ui/react-separator';
|
|
11
|
+
|
|
12
|
+
declare const avatarCva: (props?: ({
|
|
13
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
14
|
+
} & class_variance_authority_dist_types.ClassProp) | undefined) => string;
|
|
15
|
+
|
|
16
|
+
type AvatarCvaProps = VariantProps<typeof avatarCva>;
|
|
17
|
+
type AvatarSizeType = NonNullable<AvatarCvaProps["size"]>;
|
|
18
|
+
|
|
19
|
+
type AvatarProps = ReactAvatar.AvatarProps & {
|
|
20
|
+
/**
|
|
21
|
+
* Defines avatar size
|
|
22
|
+
*/
|
|
23
|
+
size?: AvatarSizeType;
|
|
24
|
+
};
|
|
25
|
+
declare const Avatar: (props: ReactAvatar.AvatarProps & {
|
|
26
|
+
/**
|
|
27
|
+
* Defines avatar size
|
|
28
|
+
*/
|
|
29
|
+
size?: AvatarSizeType | undefined;
|
|
30
|
+
} & React.RefAttributes<HTMLSpanElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
|
31
|
+
|
|
32
|
+
type AvatarImageProps = React.ComponentPropsWithoutRef<typeof ReactAvatar.Image>;
|
|
33
|
+
declare const AvatarImage: (props: Omit<ReactAvatar.AvatarImageProps & React.RefAttributes<HTMLImageElement>, "ref"> & React.RefAttributes<HTMLImageElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
|
34
|
+
|
|
35
|
+
type AvatarFallbackProps = React.ComponentPropsWithoutRef<typeof ReactAvatar.Fallback>;
|
|
36
|
+
declare const AvatarFallback: (props: Omit<ReactAvatar.AvatarFallbackProps & React.RefAttributes<HTMLSpanElement>, "ref"> & React.RefAttributes<HTMLSpanElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
|
37
|
+
|
|
38
|
+
declare const buttonCva: (props?: ({
|
|
39
|
+
fullWidth?: boolean | null | undefined;
|
|
40
|
+
color?: "neutral" | "primary" | "success" | "warning" | "error" | null | undefined;
|
|
41
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
42
|
+
variant?: "text" | "outlined" | "contained" | null | undefined;
|
|
43
|
+
} & class_variance_authority_dist_types.ClassProp) | undefined) => string;
|
|
44
|
+
|
|
45
|
+
type ButtonCvaProps = VariantProps<typeof buttonCva>;
|
|
46
|
+
type ButtonSizeType = NonNullable<ButtonCvaProps["size"]>;
|
|
47
|
+
type ButtonVariantType = NonNullable<ButtonCvaProps["variant"]>;
|
|
48
|
+
type ButtonColorType = NonNullable<ButtonCvaProps["color"]>;
|
|
49
|
+
|
|
50
|
+
type Props$2 = {
|
|
51
|
+
/**
|
|
52
|
+
* Defines button full width
|
|
53
|
+
*/
|
|
54
|
+
fullWidth?: boolean;
|
|
55
|
+
/**
|
|
56
|
+
* Defines button color
|
|
57
|
+
*/
|
|
58
|
+
color?: ButtonColorType;
|
|
59
|
+
/**
|
|
60
|
+
* Defines button variant
|
|
61
|
+
*/
|
|
62
|
+
variant?: ButtonVariantType;
|
|
63
|
+
/**
|
|
64
|
+
* Defines button size
|
|
65
|
+
*/
|
|
66
|
+
size?: ButtonSizeType;
|
|
67
|
+
/**
|
|
68
|
+
* Defines button content
|
|
69
|
+
*/
|
|
70
|
+
children?: React.ReactNode;
|
|
71
|
+
/**
|
|
72
|
+
* Disabled button
|
|
73
|
+
*/
|
|
74
|
+
disabled?: boolean;
|
|
75
|
+
/**
|
|
76
|
+
* Defines left icon
|
|
77
|
+
*/
|
|
78
|
+
startIcon?: React.ReactElement;
|
|
79
|
+
/**
|
|
80
|
+
* Defines right icon
|
|
81
|
+
*/
|
|
82
|
+
endIcon?: React.ReactElement;
|
|
83
|
+
/**
|
|
84
|
+
* Defines is button is in loading state
|
|
85
|
+
*/
|
|
86
|
+
loading?: boolean;
|
|
87
|
+
/**
|
|
88
|
+
* Defines is position of loading icon
|
|
89
|
+
*/
|
|
90
|
+
loadingPosition?: "start" | "end";
|
|
91
|
+
asChild?: boolean;
|
|
92
|
+
};
|
|
93
|
+
type ButtonProps = React.ButtonHTMLAttributes<HTMLButtonElement> & Props$2;
|
|
94
|
+
declare const Button: (props: React.ButtonHTMLAttributes<HTMLButtonElement> & Props$2 & React.RefAttributes<HTMLButtonElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
|
95
|
+
|
|
96
|
+
type OmitStylesProps<T> = Omit<T, "className" | "style">;
|
|
97
|
+
|
|
98
|
+
type Props$1 = {
|
|
99
|
+
invalid?: boolean;
|
|
100
|
+
startIcon?: React.ReactElement | string;
|
|
101
|
+
endIcon?: React.ReactElement | string;
|
|
102
|
+
};
|
|
103
|
+
type InputProps = OmitStylesProps<React.ComponentPropsWithoutRef<"input">> & Props$1;
|
|
104
|
+
declare const Input: (props: OmitStylesProps<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">> & Props$1 & React.RefAttributes<HTMLInputElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
|
105
|
+
|
|
106
|
+
type TooltipProps = ReactTooltip.TooltipContentProps & {
|
|
107
|
+
children?: React.ReactNode;
|
|
108
|
+
defaultOpen?: boolean;
|
|
109
|
+
open?: boolean;
|
|
110
|
+
onOpenChange?: (open: boolean) => void;
|
|
111
|
+
content?: React.ReactNode;
|
|
112
|
+
collisionPadding?: number;
|
|
113
|
+
};
|
|
114
|
+
declare function Tooltip({ defaultOpen, content, open, onOpenChange, children, side, align, collisionPadding, sideOffset, ...props }: TooltipProps): react_jsx_runtime.JSX.Element;
|
|
115
|
+
|
|
116
|
+
type TooltipProviderProps = {
|
|
117
|
+
children: React.ReactNode;
|
|
118
|
+
};
|
|
119
|
+
declare function TooltipProvider({ children }: TooltipProviderProps): react_jsx_runtime.JSX.Element;
|
|
120
|
+
|
|
121
|
+
type Props = {
|
|
122
|
+
invalid?: boolean;
|
|
123
|
+
};
|
|
124
|
+
type TextareaProps = OmitStylesProps<React.ComponentPropsWithoutRef<"textarea">> & Props;
|
|
125
|
+
declare const Textarea: (props: OmitStylesProps<Omit<React.DetailedHTMLProps<React.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref">> & Props & React.RefAttributes<HTMLTextAreaElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
|
126
|
+
|
|
127
|
+
type SelectProps = OmitStylesProps<ReactSelect.SelectProps> & {
|
|
128
|
+
placeholder?: React.ReactNode;
|
|
129
|
+
};
|
|
130
|
+
declare const Select: (props: OmitStylesProps<ReactSelect.SelectProps> & {
|
|
131
|
+
placeholder?: React.ReactNode;
|
|
132
|
+
} & React.RefAttributes<HTMLButtonElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
|
133
|
+
|
|
134
|
+
type SelectItemProps = OmitStylesProps<ReactSelect.SelectItemProps>;
|
|
135
|
+
declare const SelectItem: (props: SelectItemProps & React.RefAttributes<HTMLDivElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
|
136
|
+
|
|
137
|
+
type CardProps = React.HTMLAttributes<HTMLDivElement>;
|
|
138
|
+
declare const Card: (props: CardProps & React.RefAttributes<HTMLDivElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
|
139
|
+
|
|
140
|
+
type CardHeaderProps = React.HTMLAttributes<HTMLDivElement>;
|
|
141
|
+
declare const CardHeader: (props: CardHeaderProps & React.RefAttributes<HTMLDivElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
|
142
|
+
|
|
143
|
+
type CardTitleProps = React__default.HTMLAttributes<HTMLHeadingElement>;
|
|
144
|
+
declare const CardTitle: (props: CardTitleProps & React__default.RefAttributes<HTMLParagraphElement>) => React__default.ReactElement<any, string | React__default.JSXElementConstructor<any>> | null;
|
|
145
|
+
|
|
146
|
+
type CardDescriptionProps = React.HTMLAttributes<HTMLParagraphElement>;
|
|
147
|
+
declare const CardDescription: (props: CardDescriptionProps & React.RefAttributes<HTMLParagraphElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
|
148
|
+
|
|
149
|
+
type CardContentProps = React.HTMLAttributes<HTMLDivElement>;
|
|
150
|
+
declare const CardContent: (props: CardContentProps & React.RefAttributes<HTMLDivElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
|
151
|
+
|
|
152
|
+
type CardFooterProps = React.HTMLAttributes<HTMLDivElement>;
|
|
153
|
+
declare const CardFooter: (props: CardFooterProps & React.RefAttributes<HTMLDivElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
|
154
|
+
|
|
155
|
+
type SheetProps = ReactSheet.DialogProps;
|
|
156
|
+
declare const Sheet: React.FC<ReactSheet.DialogProps>;
|
|
157
|
+
|
|
158
|
+
type SheetTriggerProps = ReactSheet.DialogTriggerProps;
|
|
159
|
+
declare const SheetTrigger: React.ForwardRefExoticComponent<ReactSheet.DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
|
|
160
|
+
|
|
161
|
+
type SheetCloseProps = ReactSheet.DialogCloseProps;
|
|
162
|
+
declare const SheetClose: React.ForwardRefExoticComponent<ReactSheet.DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
|
|
163
|
+
|
|
164
|
+
declare const sheetContentStyles: (props?: ({
|
|
165
|
+
side?: "left" | "right" | "top" | "bottom" | null | undefined;
|
|
166
|
+
} & class_variance_authority_dist_types.ClassProp) | undefined) => string;
|
|
167
|
+
|
|
168
|
+
type SheetContentCvaProps = VariantProps<typeof sheetContentStyles>;
|
|
169
|
+
type SheetContentSide = NonNullable<SheetContentCvaProps["side"]>;
|
|
170
|
+
|
|
171
|
+
type SheetContentProps = React.ComponentPropsWithoutRef<typeof ReactSheet.Content> & {
|
|
172
|
+
side?: SheetContentSide;
|
|
173
|
+
};
|
|
174
|
+
declare const SheetContent: (props: Omit<ReactSheet.DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & {
|
|
175
|
+
side?: SheetContentSide | undefined;
|
|
176
|
+
} & React.RefAttributes<HTMLDivElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
|
177
|
+
|
|
178
|
+
type SheetHeaderProps = React.HTMLAttributes<HTMLDivElement>;
|
|
179
|
+
declare function SheetHeader({ className, ...props }: SheetHeaderProps): react_jsx_runtime.JSX.Element;
|
|
180
|
+
|
|
181
|
+
type SheetFooterProps = React.HTMLAttributes<HTMLDivElement>;
|
|
182
|
+
declare function SheetFooter({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): react_jsx_runtime.JSX.Element;
|
|
183
|
+
|
|
184
|
+
type SheetTitleProps = React.ComponentPropsWithoutRef<typeof ReactSheet.Title>;
|
|
185
|
+
declare const SheetTitle: (props: Omit<ReactSheet.DialogTitleProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
|
186
|
+
|
|
187
|
+
type SheetDescriptionProps = React.ComponentPropsWithoutRef<typeof ReactSheet.Description>;
|
|
188
|
+
declare const SheetDescription: (props: Omit<ReactSheet.DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
|
189
|
+
|
|
190
|
+
type SeparatorProps = React.ComponentPropsWithoutRef<typeof ReactSeparator.Root>;
|
|
191
|
+
declare const Separator: (props: Omit<ReactSeparator.SeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
|
192
|
+
|
|
193
|
+
type HeaderProps = {
|
|
194
|
+
children?: React__default.ReactNode;
|
|
195
|
+
};
|
|
196
|
+
declare function Header({ children }: HeaderProps): react_jsx_runtime.JSX.Element;
|
|
197
|
+
|
|
198
|
+
type ThemeType = "light" | "dark";
|
|
199
|
+
interface ThemeContextType {
|
|
200
|
+
theme: ThemeType;
|
|
201
|
+
setTheme: React__default.Dispatch<React__default.SetStateAction<ThemeType>>;
|
|
202
|
+
}
|
|
203
|
+
|
|
204
|
+
declare const ThemeContext: React__default.Context<ThemeContextType>;
|
|
205
|
+
|
|
206
|
+
interface ThemeProviderProps {
|
|
207
|
+
/**
|
|
208
|
+
* Children Components using theming.
|
|
209
|
+
*/
|
|
210
|
+
children?: React__default.ReactNode;
|
|
211
|
+
/**
|
|
212
|
+
* Define the default theme which is set at the beginning if neither local storage nor media is defined.
|
|
213
|
+
*/
|
|
214
|
+
defaultTheme?: ThemeType;
|
|
215
|
+
/**
|
|
216
|
+
* Define theme that is always set initially.
|
|
217
|
+
*/
|
|
218
|
+
theme?: ThemeType;
|
|
219
|
+
}
|
|
220
|
+
declare function ThemeProvider({ children, defaultTheme, theme }: ThemeProviderProps): react_jsx_runtime.JSX.Element;
|
|
221
|
+
|
|
222
|
+
declare const useTheme: () => ThemeContextType;
|
|
223
|
+
|
|
224
|
+
export { Avatar, AvatarFallback, AvatarFallbackProps, AvatarImage, AvatarImageProps, AvatarProps, AvatarSizeType, Button, ButtonColorType, ButtonProps, ButtonSizeType, ButtonVariantType, Card, CardContent, CardContentProps, CardDescription, CardDescriptionProps, CardFooter, CardFooterProps, CardHeader, CardHeaderProps, CardProps, CardTitle, CardTitleProps, Header, HeaderProps, Input, InputProps, Select, SelectItem, SelectItemProps, SelectProps, Separator, SeparatorProps, Sheet, SheetClose, SheetCloseProps, SheetContent, SheetContentProps, SheetContentSide, SheetDescription, SheetDescriptionProps, SheetFooter, SheetFooterProps, SheetHeader, SheetHeaderProps, SheetProps, SheetTitle, SheetTitleProps, SheetTrigger, SheetTriggerProps, Textarea, TextareaProps, ThemeContext, ThemeContextType, ThemeProvider, ThemeProviderProps, ThemeType, Tooltip, TooltipProps, TooltipProvider, TooltipProviderProps, useTheme };
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
export * from '@radix-ui/react-icons';
|
|
2
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
3
|
+
import * as React from 'react';
|
|
4
|
+
|
|
5
|
+
declare function GoogleLogoIcon(props: React.SVGProps<SVGSVGElement>): react_jsx_runtime.JSX.Element;
|
|
6
|
+
|
|
7
|
+
declare function LoadingIcon(props: React.SVGProps<SVGSVGElement>): react_jsx_runtime.JSX.Element;
|
|
8
|
+
|
|
9
|
+
declare function Auth0LogoIcon(props: React.SVGProps<SVGSVGElement>): react_jsx_runtime.JSX.Element;
|
|
10
|
+
|
|
11
|
+
declare function XLogoIcon(props: React.SVGProps<SVGSVGElement>): react_jsx_runtime.JSX.Element;
|
|
12
|
+
|
|
13
|
+
export { Auth0LogoIcon, GoogleLogoIcon, LoadingIcon, XLogoIcon };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@szum-tech/design-system",
|
|
3
|
-
"version": "1.15.
|
|
3
|
+
"version": "1.15.5",
|
|
4
4
|
"description": "Szum-Tech design system with tailwindcss support",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"szum-tech",
|
|
@@ -62,9 +62,9 @@
|
|
|
62
62
|
"@radix-ui/react-slot": "^1.0.2",
|
|
63
63
|
"@radix-ui/react-tooltip": "^1.0.6",
|
|
64
64
|
"@tailwindcss/container-queries": "^0.1.0",
|
|
65
|
-
"class-variance-authority": "^0.
|
|
66
|
-
"tailwind-merge": "^
|
|
67
|
-
"tailwind-scrollbar": "^3.0.
|
|
65
|
+
"class-variance-authority": "^0.7.0",
|
|
66
|
+
"tailwind-merge": "^2.0.0",
|
|
67
|
+
"tailwind-scrollbar": "^3.0.5",
|
|
68
68
|
"tailwindcss-animate": "^1.0.7"
|
|
69
69
|
},
|
|
70
70
|
"devDependencies": {
|
|
@@ -90,7 +90,7 @@
|
|
|
90
90
|
"babel-loader": "^9.1.2",
|
|
91
91
|
"concurrently": "^8.0.1",
|
|
92
92
|
"cpy-cli": "^4.2.0",
|
|
93
|
-
"happy-dom": "^
|
|
93
|
+
"happy-dom": "^12.10.3",
|
|
94
94
|
"postcss": "^8.4.24",
|
|
95
95
|
"prettier": "^2.8.8",
|
|
96
96
|
"prettier-plugin-tailwindcss": "^0.3.0",
|
|
@@ -103,8 +103,8 @@
|
|
|
103
103
|
"storybook": "^7.0.18",
|
|
104
104
|
"storybook-addon-pseudo-states": "^2.0.1",
|
|
105
105
|
"storybook-dark-mode": "^3.0.0",
|
|
106
|
-
"tailwindcss": "^3.3.
|
|
107
|
-
"tsup": "^
|
|
106
|
+
"tailwindcss": "^3.3.5",
|
|
107
|
+
"tsup": "^7.2.0",
|
|
108
108
|
"typescript": "^5.0.4",
|
|
109
109
|
"vite": "^4.3.9",
|
|
110
110
|
"vite-tsconfig-paths": "^4.2.0",
|