@szum-tech/design-system 1.12.2 → 1.13.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 +172 -0
- package/dist/index.js +44 -0
- package/dist/index.mjs +11 -0
- package/icons/index.d.ts +1 -1
- package/icons/index.js +29 -27
- package/icons/index.mjs +6 -2
- package/package.json +7 -12
- package/Avatar-c6a2f50d.d.ts +0 -37
- package/Button-ae5be036.d.ts +0 -63
- package/Input-41362e55.d.ts +0 -12
- package/Textarea-7d32840f.d.ts +0 -10
- package/ThemeProvider-cd78c94b.d.ts +0 -23
- package/Tooltip.provider-6de64d8b.d.ts +0 -20
- package/chunk-3PIF22YM.js +0 -9
- package/chunk-76WB4BRP.mjs +0 -1
- package/chunk-7M2UD3MX.js +0 -2
- package/chunk-ACJI7SSR.mjs +0 -7
- package/chunk-BEZVY5QD.mjs +0 -7
- package/chunk-BYGQEMVJ.js +0 -30
- package/chunk-D2YRORSD.mjs +0 -3
- package/chunk-DKDLYQOD.js +0 -7
- package/chunk-FA4FHRKJ.js +0 -13
- package/chunk-GETS73RC.mjs +0 -7
- package/chunk-IGEGU67W.mjs +0 -7
- package/chunk-IN4WKCCQ.js +0 -29
- package/chunk-IZJ75JZB.js +0 -55
- package/chunk-IZQ36CWU.mjs +0 -36
- package/chunk-JQ4UTWMH.js +0 -2
- package/chunk-KEPEPMEM.mjs +0 -7
- package/chunk-LXYPZK73.mjs +0 -8
- package/chunk-PJ2GPHOZ.js +0 -2
- package/chunk-PJRIZNPB.mjs +0 -7
- package/chunk-TAA4AMBN.mjs +0 -1
- package/chunk-V3HUNIZN.js +0 -30
- package/chunk-WPEQQQCR.mjs +0 -1
- package/chunk-YEKURALR.js +0 -29
- package/chunk-ZHWHVYOY.js +0 -14
- package/components/avatar/index.d.ts +0 -5
- package/components/avatar/index.js +0 -11
- package/components/avatar/index.mjs +0 -2
- package/components/button/index.d.ts +0 -5
- package/components/button/index.js +0 -12
- package/components/button/index.mjs +0 -3
- package/components/index.d.ts +0 -11
- package/components/index.js +0 -37
- package/components/index.mjs +0 -8
- package/components/input/index.d.ts +0 -3
- package/components/input/index.js +0 -11
- package/components/input/index.mjs +0 -2
- package/components/textarea/index.d.ts +0 -3
- package/components/textarea/index.js +0 -11
- package/components/textarea/index.mjs +0 -2
- package/components/tooltip/index.d.ts +0 -4
- package/components/tooltip/index.js +0 -15
- package/components/tooltip/index.mjs +0 -2
- package/contexts/index.d.ts +0 -4
- package/contexts/index.js +0 -16
- package/contexts/index.mjs +0 -3
- package/contexts/theme/index.d.ts +0 -4
- package/contexts/theme/index.js +0 -15
- package/contexts/theme/index.mjs +0 -2
- package/hooks/index.d.ts +0 -3
- package/hooks/index.js +0 -14
- package/hooks/index.mjs +0 -5
- package/hooks/useTheme/index.d.ts +0 -3
- package/hooks/useTheme/index.js +0 -13
- package/hooks/useTheme/index.mjs +0 -4
- package/index.d.ts +0 -14
- package/index.js +0 -53
- package/index.mjs +0 -12
- package/theme.types-a32f0702.d.ts +0 -9
- package/useTheme-01c9253b.d.ts +0 -5
- package/utils.types-3df7903f.d.ts +0 -13
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,172 @@
|
|
|
1
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
+
import * as React from 'react';
|
|
3
|
+
import React__default from 'react';
|
|
4
|
+
import { VariantProps } from 'class-variance-authority';
|
|
5
|
+
import * as class_variance_authority_dist_types from 'class-variance-authority/dist/types';
|
|
6
|
+
import * as ReactTooltip from '@radix-ui/react-tooltip';
|
|
7
|
+
import * as ReactSelect from '@radix-ui/react-select';
|
|
8
|
+
|
|
9
|
+
declare const avatarCva: (props?: ({
|
|
10
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
11
|
+
} & class_variance_authority_dist_types.ClassProp) | undefined) => string;
|
|
12
|
+
|
|
13
|
+
type AvatarCvaProps = VariantProps<typeof avatarCva>;
|
|
14
|
+
type AvatarSizeType = NonNullable<AvatarCvaProps["size"]>;
|
|
15
|
+
|
|
16
|
+
type AvatarProps = React.ComponentPropsWithoutRef<"div"> & {
|
|
17
|
+
/**
|
|
18
|
+
* Defines avatar image alt
|
|
19
|
+
*/
|
|
20
|
+
alt?: string;
|
|
21
|
+
/**
|
|
22
|
+
* Defines background color
|
|
23
|
+
*/
|
|
24
|
+
bg?: `bg-${string}` | `bg-${string}-${number}`;
|
|
25
|
+
/**
|
|
26
|
+
* Defines avatar children
|
|
27
|
+
*/
|
|
28
|
+
children?: React.ReactNode;
|
|
29
|
+
/**
|
|
30
|
+
* Defines avatar size
|
|
31
|
+
*/
|
|
32
|
+
size?: AvatarSizeType;
|
|
33
|
+
/**
|
|
34
|
+
* Defines avatar image src
|
|
35
|
+
*/
|
|
36
|
+
src?: string;
|
|
37
|
+
};
|
|
38
|
+
declare function Avatar({ alt, bg, children, size, src, ...props }: AvatarProps): react_jsx_runtime.JSX.Element;
|
|
39
|
+
|
|
40
|
+
type AsProp<C extends React.ElementType> = {
|
|
41
|
+
/**
|
|
42
|
+
* Defines HTML tag to be used for component
|
|
43
|
+
*/
|
|
44
|
+
as?: C;
|
|
45
|
+
};
|
|
46
|
+
type PropsToOmit<C extends React.ElementType, P> = keyof (AsProp<C> & P);
|
|
47
|
+
type PolymorphicComponentProp<C extends React.ElementType, Props = {}> = Props & AsProp<C> & Omit<React.ComponentPropsWithoutRef<C>, PropsToOmit<C, Props>>;
|
|
48
|
+
type OmitStylesProps<T> = Omit<T, "className" | "style">;
|
|
49
|
+
|
|
50
|
+
declare const buttonCva: (props?: ({
|
|
51
|
+
block?: boolean | null | undefined;
|
|
52
|
+
color?: "neutral" | "primary" | "success" | "warning" | "error" | null | undefined;
|
|
53
|
+
size?: "sm" | "md" | "lg" | null | undefined;
|
|
54
|
+
variant?: "text" | "outlined" | "contained" | null | undefined;
|
|
55
|
+
} & class_variance_authority_dist_types.ClassProp) | undefined) => string;
|
|
56
|
+
|
|
57
|
+
type ButtonCvaProps = VariantProps<typeof buttonCva>;
|
|
58
|
+
type ButtonSizeType = NonNullable<ButtonCvaProps["size"]>;
|
|
59
|
+
type ButtonVariantType = NonNullable<ButtonCvaProps["variant"]>;
|
|
60
|
+
type ButtonColorType = NonNullable<ButtonCvaProps["color"]>;
|
|
61
|
+
|
|
62
|
+
type Props$2 = {
|
|
63
|
+
/**
|
|
64
|
+
* Defines button full width
|
|
65
|
+
*/
|
|
66
|
+
block?: boolean;
|
|
67
|
+
/**
|
|
68
|
+
* Defines button color
|
|
69
|
+
*/
|
|
70
|
+
color?: ButtonColorType;
|
|
71
|
+
/**
|
|
72
|
+
* Defines button variant
|
|
73
|
+
*/
|
|
74
|
+
variant?: ButtonVariantType;
|
|
75
|
+
/**
|
|
76
|
+
* Defines button size
|
|
77
|
+
*/
|
|
78
|
+
size?: ButtonSizeType;
|
|
79
|
+
/**
|
|
80
|
+
* Defines button content
|
|
81
|
+
*/
|
|
82
|
+
children?: React.ReactNode;
|
|
83
|
+
/**
|
|
84
|
+
* Disabled button
|
|
85
|
+
*/
|
|
86
|
+
disabled?: boolean;
|
|
87
|
+
/**
|
|
88
|
+
* Defines left icon
|
|
89
|
+
*/
|
|
90
|
+
startIcon?: React.ReactElement;
|
|
91
|
+
/**
|
|
92
|
+
* Defines right icon
|
|
93
|
+
*/
|
|
94
|
+
endIcon?: React.ReactElement;
|
|
95
|
+
/**
|
|
96
|
+
* Defines is button is in loading state
|
|
97
|
+
*/
|
|
98
|
+
loading?: boolean;
|
|
99
|
+
/**
|
|
100
|
+
* Defines is position of loading icon
|
|
101
|
+
*/
|
|
102
|
+
loadingPosition?: "start" | "end";
|
|
103
|
+
};
|
|
104
|
+
type ButtonProps<T extends React.ElementType = "button"> = PolymorphicComponentProp<T, Props$2>;
|
|
105
|
+
declare const Button: <T extends React.ElementType<any> = "button">(props: Props$2 & AsProp<T> & Omit<React.PropsWithoutRef<React.ComponentProps<T>>, "as" | keyof Props$2> & React.RefAttributes<unknown>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
|
106
|
+
|
|
107
|
+
type Props$1 = {
|
|
108
|
+
invalid?: boolean;
|
|
109
|
+
startIcon?: React.ReactElement | string;
|
|
110
|
+
endIcon?: React.ReactElement | string;
|
|
111
|
+
};
|
|
112
|
+
type InputProps = OmitStylesProps<React.ComponentPropsWithoutRef<"input">> & Props$1;
|
|
113
|
+
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;
|
|
114
|
+
|
|
115
|
+
type TooltipProps = ReactTooltip.TooltipContentProps & {
|
|
116
|
+
children?: React.ReactNode;
|
|
117
|
+
defaultOpen?: boolean;
|
|
118
|
+
open?: boolean;
|
|
119
|
+
onOpenChange?: (open: boolean) => void;
|
|
120
|
+
content?: React.ReactNode;
|
|
121
|
+
collisionPadding?: number;
|
|
122
|
+
};
|
|
123
|
+
declare function Tooltip({ defaultOpen, content, open, onOpenChange, children, side, align, collisionPadding, sideOffset, ...props }: TooltipProps): react_jsx_runtime.JSX.Element;
|
|
124
|
+
|
|
125
|
+
type TooltipProviderProps = {
|
|
126
|
+
children: React.ReactNode;
|
|
127
|
+
};
|
|
128
|
+
declare function TooltipProvider({ children }: TooltipProviderProps): react_jsx_runtime.JSX.Element;
|
|
129
|
+
|
|
130
|
+
type Props = {
|
|
131
|
+
invalid?: boolean;
|
|
132
|
+
};
|
|
133
|
+
type TextareaProps = OmitStylesProps<React.ComponentPropsWithoutRef<"textarea">> & Props;
|
|
134
|
+
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;
|
|
135
|
+
|
|
136
|
+
type SelectProps = OmitStylesProps<ReactSelect.SelectProps> & {
|
|
137
|
+
placeholder?: React.ReactNode;
|
|
138
|
+
};
|
|
139
|
+
declare const Select: (props: OmitStylesProps<ReactSelect.SelectProps> & {
|
|
140
|
+
placeholder?: React.ReactNode;
|
|
141
|
+
} & React.RefAttributes<HTMLButtonElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
|
142
|
+
|
|
143
|
+
type SelectItemProps = OmitStylesProps<ReactSelect.SelectItemProps>;
|
|
144
|
+
declare const SelectItem: (props: SelectItemProps & React.RefAttributes<HTMLDivElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
|
145
|
+
|
|
146
|
+
type ThemeType = "light" | "dark";
|
|
147
|
+
interface ThemeContextType {
|
|
148
|
+
theme: ThemeType;
|
|
149
|
+
setTheme: React__default.Dispatch<React__default.SetStateAction<ThemeType>>;
|
|
150
|
+
}
|
|
151
|
+
|
|
152
|
+
declare const ThemeContext: React__default.Context<ThemeContextType>;
|
|
153
|
+
|
|
154
|
+
interface ThemeProviderProps {
|
|
155
|
+
/**
|
|
156
|
+
* Children Components using theming.
|
|
157
|
+
*/
|
|
158
|
+
children?: React__default.ReactNode;
|
|
159
|
+
/**
|
|
160
|
+
* Define the default theme which is set at the beginning if neither local storage nor media is defined.
|
|
161
|
+
*/
|
|
162
|
+
defaultTheme?: ThemeType;
|
|
163
|
+
/**
|
|
164
|
+
* Define theme that is always set initially.
|
|
165
|
+
*/
|
|
166
|
+
theme?: ThemeType;
|
|
167
|
+
}
|
|
168
|
+
declare function ThemeProvider({ children, defaultTheme, theme }: ThemeProviderProps): react_jsx_runtime.JSX.Element;
|
|
169
|
+
|
|
170
|
+
declare const useTheme: () => ThemeContextType;
|
|
171
|
+
|
|
172
|
+
export { Avatar, AvatarProps, AvatarSizeType, Button, ButtonColorType, ButtonProps, ButtonSizeType, ButtonVariantType, Input, InputProps, Select, SelectItem, SelectItemProps, SelectProps, Textarea, TextareaProps, ThemeContext, ThemeContextType, ThemeProvider, ThemeProviderProps, ThemeType, Tooltip, TooltipProps, TooltipProvider, TooltipProviderProps, useTheme };
|
package/dist/index.js
ADDED
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var classVarianceAuthority = require('class-variance-authority');
|
|
4
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
5
|
+
var f = require('react');
|
|
6
|
+
var iconsReact = require('@tabler/icons-react');
|
|
7
|
+
var s = require('@radix-ui/react-tooltip');
|
|
8
|
+
var n = require('@radix-ui/react-select');
|
|
9
|
+
|
|
10
|
+
function _interopNamespace(e) {
|
|
11
|
+
if (e && e.__esModule) return e;
|
|
12
|
+
var n = Object.create(null);
|
|
13
|
+
if (e) {
|
|
14
|
+
Object.keys(e).forEach(function (k) {
|
|
15
|
+
if (k !== 'default') {
|
|
16
|
+
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
17
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
18
|
+
enumerable: true,
|
|
19
|
+
get: function () { return e[k]; }
|
|
20
|
+
});
|
|
21
|
+
}
|
|
22
|
+
});
|
|
23
|
+
}
|
|
24
|
+
n.default = e;
|
|
25
|
+
return Object.freeze(n);
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
var f__namespace = /*#__PURE__*/_interopNamespace(f);
|
|
29
|
+
var s__namespace = /*#__PURE__*/_interopNamespace(s);
|
|
30
|
+
var n__namespace = /*#__PURE__*/_interopNamespace(n);
|
|
31
|
+
|
|
32
|
+
var L=classVarianceAuthority.cva("select-none rounded font-semibold leading-none justify-center flex items-center bg-gray-500 text-white dark:text-black",{variants:{size:{sm:"h-6 w-6 text-lg",md:"h-10 w-10 text-xl",lg:"h-14 w-14 text-2xl"}},defaultVariants:{size:"md"}});function xe({alt:e,bg:t,children:r,size:o="md",src:a,...l}){let i=L({size:o,className:t});return jsxRuntime.jsx("div",{className:i,...l,children:a?jsxRuntime.jsx("img",{className:"h-full w-full rounded object-cover object-center",alt:e,src:a}):r})}var A=classVarianceAuthority.cva(["inline-flex items-center justify-center align-middle no-underline transition-colors ease-in-out duration-300","font-sans appearance-none select-none rounded-sm border font-medium tracking-[.02857em]","aria-disabled:pointer-events-none aria-disabled:opacity-50 aria-disabled:cursor-not-allowed"],{variants:{block:{true:"w-full"},color:{neutral:"",primary:"",success:"",warning:"",error:""},size:{sm:"px-2.5 py-1 text-[.8125rem] leading-4",md:"px-4 py-1.5 text-sm leading-5",lg:"px-5 py-2 text-[.9375rem] leading-6"},variant:{text:"border-transparent bg-transparent",outlined:"bg-transparent",contained:""}},compoundVariants:[{variant:"text",color:"neutral",class:["text-gray-100","hover:border-gray-100 hover:bg-gray-100 hover:text-black","active:border-gray-200 active:bg-gray-200"]},{variant:"text",color:"primary",class:["text-primary-500","hover:border-primary-500 hover:bg-primary-500 hover:text-white","active:border-primary-600 active:bg-primary-600 active:text-white"]},{variant:"text",color:"success",class:["text-success-500","hover:border-success-500 hover:bg-success-500 hover:text-white","active:border-success-600 active:bg-success-600 active:text-white"]},{variant:"text",color:"warning",class:["text-warning-500","hover:border-warning-500 hover:bg-warning-500 hover:text-white","active:border-warning-600 active:bg-warning-600 active:text-white"]},{variant:"text",color:"error",class:["text-error-500","hover:border-error-500 hover:bg-error-500 hover:text-white","active:border-error-600 active:bg-error-600 active:text-white"]},{variant:"outlined",color:"neutral",class:["text-gray-100 border-gray-100","hover:bg-gray-100 hover:text-black","active:text-gray-600 active:bg-gray-200"]},{variant:"outlined",color:"primary",class:["text-primary-500 border-primary-500","hover:bg-primary-500 hover:text-white","active:text-white active:bg-primary-600"]},{variant:"outlined",color:"success",class:["text-success-500 border-success-500","hover:bg-success-500 hover:text-white","active:text-white active:bg-success-600"]},{variant:"outlined",color:"warning",class:["text-warning-500 border-warning-500","hover:bg-warning-500 hover:text-white","active:text-white active:bg-warning-600"]},{variant:"outlined",color:"error",class:["text-error-500 border-error-500","hover:bg-error-500 hover:text-white","active:text-white active:bg-error-600"]},{variant:"contained",color:"neutral",class:["border-gray-100 bg-gray-100 text-black","hover:border-white hover:bg-white","active:border-gray-200 active:bg-gray-200"]},{variant:"contained",color:"primary",class:["border-primary-500 bg-primary-500 text-white","hover:border-primary-400 hover:bg-primary-400","active:border-primary-600 active:bg-primary-600"]},{variant:"contained",color:"success",class:["border-success-500 bg-success-500 text-white","hover:border-success-400 hover:bg-success-400","active:border-success-600 active:bg-success-600"]},{variant:"contained",color:"warning",class:["border-warning-500 bg-warning-500 text-white","hover:border-warning-400 hover:bg-warning-400","active:border-warning-600 active:bg-warning-600"]},{variant:"contained",color:"error",class:["border-error-500 bg-error-500 text-white","hover:border-error-400 hover:bg-error-400","active:border-error-600 active:bg-error-600"]}],defaultVariants:{block:!1,color:"primary",size:"md",variant:"text"}}),R=classVarianceAuthority.cva("",{variants:{site:{left:"",right:""},size:{sm:"",md:"",lg:""}},compoundVariants:[{site:"left",size:"sm",class:"-ml-0.5 mr-1.5"},{site:"left",size:"md",class:"-ml-1 mr-2"},{site:"left",size:"lg",class:"-ml-1.5 mr-2.5"},{site:"right",size:"sm",class:"-mr-0.5 ml-1.5"},{site:"right",size:"md",class:"-mr-1 ml-2"},{site:"right",size:"lg",class:"-mr-1.5 ml-2.5"}],defaultVariants:{site:"left",size:"md"}}),T=classVarianceAuthority.cva("",{variants:{loading:{true:"motion-reduce:hidden animate-spin"},size:{sm:"h-4.5 w-4.5",md:"h-5 w-5",lg:"h-5.5 w-5.5"}},defaultVariants:{loading:!1,size:"md"}});function S(e){return jsxRuntime.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",xmlnsXlink:"http://www.w3.org/1999/xlink",fill:"currentColor",version:"1.1",viewBox:"0 0 26.349 26.35",xmlSpace:"preserve",...e,children:jsxRuntime.jsx("g",{children:jsxRuntime.jsxs("g",{children:[jsxRuntime.jsx("circle",{cx:"13.792",cy:"3.082",r:"3.082"}),jsxRuntime.jsx("circle",{cx:"13.792",cy:"24.501",r:"1.849"}),jsxRuntime.jsx("circle",{cx:"6.219",cy:"6.218",r:"2.774"}),jsxRuntime.jsx("circle",{cx:"21.365",cy:"21.363",r:"1.541"}),jsxRuntime.jsx("circle",{cx:"3.082",cy:"13.792",r:"2.465"}),jsxRuntime.jsx("circle",{cx:"24.501",cy:"13.791",r:"1.232"}),jsxRuntime.jsx("path",{d:"M4.694,19.84c-0.843,0.843-0.843,2.207,0,3.05c0.842,0.843,2.208,0.843,3.05,0c0.843-0.843,0.843-2.207,0-3.05 C6.902,18.996,5.537,18.988,4.694,19.84z"}),jsxRuntime.jsx("circle",{cx:"21.364",cy:"6.218",r:"0.924"})]})})})}var Qe=f__namespace.forwardRef(function({as:e,block:t=!1,color:r="primary",children:o,size:a="md",variant:l="text",disabled:i=!1,startIcon:m,endIcon:g,type:k,loading:h=!1,loadingPosition:E="start",...Z},_){let B=e||"button",j=A({block:t,size:a,variant:l,color:r}),b=h&&E==="start",V=b?jsxRuntime.jsx(S,{"aria-label":"Loading"}):m||null,ee=T({size:a,loading:b}),te=R({size:a,site:"left"}),u=h&&E==="end",z=u?jsxRuntime.jsx(S,{"aria-label":"Loading"}):g||null,re=T({size:a,loading:u}),oe=R({size:a,site:"right"}),x=i||h;return jsxRuntime.jsxs(B,{"aria-disabled":x||void 0,className:j,"data-state":h?"loading":void 0,disabled:x,ref:_,role:"button",tabIndex:x?-1:0,type:B==="button"?"button":void 0,...Z,children:[V?jsxRuntime.jsx("span",{className:te,role:b?"progressbar":void 0,children:f__namespace.cloneElement(V,{className:ee})}):null,o,z?jsxRuntime.jsx("span",{className:oe,role:u?"progressbar":void 0,children:f__namespace.cloneElement(z,{className:re})}):null]})});var G=classVarianceAuthority.cva(["h-10 w-full appearance-none border bg-app-primary py-2 font-poppins outline-0 transition-colors duration-300 ease-in-out","placeholder:select-none placeholder:text-gray-200","invalid:border-error-500 focus:border-primary-400 active:border-primary-400","disabled:border-gray-400 disabled:text-gray-200 disabled:placeholder:text-gray-300"],{variants:{invalid:{true:["text-error-500 border-error-500 hover:border-error-400 focus:text-gray-100"],false:["text-gray-100 border-gray-350 hover:border-primary-500"]},withStartIcon:{true:"pl-11",false:"pl-3"},withEndIcon:{true:"pr-11",false:"pr-3"}},defaultVariants:{invalid:!1,withStartIcon:!1,withEndIcon:!1}}),I=classVarianceAuthority.cva(["pointer-events-none absolute bottom-2 top-2 inline-flex w-10 content-center items-center justify-center text-center"],{variants:{disabled:{true:"text-gray-200"},site:{right:"right-0 border-l border-l-gray-400 pr-1",left:"left-0 border-r border-r-gray-400 pl-1"}},defaultVariants:{disabled:!1}});var tt=f__namespace.forwardRef(function({invalid:e=!1,startIcon:t,endIcon:r,disabled:o=!1,...a},l){let i=G({withEndIcon:!!r,withStartIcon:!!t,invalid:e}),m=I({site:"left",disabled:o}),g=I({site:"right",disabled:o});return jsxRuntime.jsxs("div",{className:"relative text-gray-100 typography-body-2",children:[t?jsxRuntime.jsx("span",{className:m,children:t}):null,jsxRuntime.jsx("input",{"aria-invalid":e||void 0,disabled:o,className:i,ref:l,...a}),r?jsxRuntime.jsx("span",{"aria-hidden":!0,className:g,children:r}):null]})});function at({defaultOpen:e,content:t,open:r,onOpenChange:o,children:a,side:l,align:i,collisionPadding:m=8,sideOffset:g=8,...k}){return jsxRuntime.jsxs(s__namespace.Root,{delayDuration:0,open:r,defaultOpen:e,onOpenChange:o,children:[jsxRuntime.jsx(s__namespace.Trigger,{asChild:!0,children:a}),t?jsxRuntime.jsx(s__namespace.Portal,{children:jsxRuntime.jsxs(s__namespace.Content,{className:"text-typography-primary select-none rounded bg-white p-2 will-change-[transform,opacity] typography-body-1 data-[state=delayed-open]:data-[side=bottom]:animate-slideUpAndFade data-[state=delayed-open]:data-[side=left]:animate-slideRightAndFade data-[state=delayed-open]:data-[side=right]:animate-slideLeftAndFade data-[state=delayed-open]:data-[side=top]:animate-slideDownAndFade",sideOffset:g,side:l,align:i,collisionPadding:m,...k,style:{maxWidth:"var(--radix-tooltip-content-available-width)"},children:[t,jsxRuntime.jsx(s__namespace.Arrow,{width:8,height:4,className:"fill-white"})]})}):null]})}function ct({children:e}){return jsxRuntime.jsx(s__namespace.Provider,{skipDelayDuration:500,children:e})}var U=classVarianceAuthority.cva(["h-28 min-h-10 w-full appearance-none border bg-app-primary px-3 py-2 font-poppins outline-0 transition-colors duration-300 ease-in-out scroll typography-body-2 placeholder:select-none placeholder:text-gray-200","focus:border-primary-400","active:border-primary-400","disabled:border-gray-400 disabled:text-gray-200 disabled:placeholder:text-gray-300"],{variants:{invalid:{true:["text-error-500 border-error-500","hover:border-error-400","focus:text-gray-100"],false:["text-gray-100 border-gray-350","hover:border-primary-500"]}},defaultVariants:{invalid:!1}});var gt=f__namespace.forwardRef(function({invalid:e=!1,...t},r){let o=U({invalid:e});return jsxRuntime.jsx("textarea",{"aria-invalid":e||void 0,className:o,ref:r,...t})});var q=classVarianceAuthority.cva(["h-10 w-full appearance-none border bg-app-primary py-2 font-poppins outline-0 inline-flex items-center justify-between text-gray-100 typography-body-2 gap-2 transition-colors duration-300 ease-in-out","placeholder:select-none placeholder:text-gray-200","invalid:border-error-500 focus:border-primary-400 active:border-primary-400","disabled:border-gray-400 disabled:text-gray-200 disabled:placeholder:text-gray-300"],{variants:{invalid:{true:["text-error-500 border-error-500 hover:border-error-400 focus:text-gray-100"],false:["text-gray-100 border-gray-350 hover:border-primary-500"]},withStartIcon:{true:"pl-11",false:"pl-3"},withEndIcon:{true:"pr-11",false:"pr-3"}},defaultVariants:{invalid:!1,withStartIcon:!1,withEndIcon:!1}});var xt=f__namespace.forwardRef(({children:e,placeholder:t,...r},o)=>{let a=q();return jsxRuntime.jsxs(n__namespace.Root,{...r,children:[jsxRuntime.jsxs(n__namespace.Trigger,{className:a,ref:o,children:[jsxRuntime.jsx(n__namespace.Value,{placeholder:"Select a fruit\u2026"}),jsxRuntime.jsx(n__namespace.Icon,{className:"-mr-1.5",children:jsxRuntime.jsx(iconsReact.IconSelector,{className:"h-5 w-5 text-gray-200"})})]}),jsxRuntime.jsx(n__namespace.Portal,{children:jsxRuntime.jsx(n__namespace.Content,{sideOffset:4,className:"w-full overflow-hidden border border-gray-350 bg-app-primary py-1",children:jsxRuntime.jsx(n__namespace.Viewport,{children:e})})})]})});var St=f__namespace.forwardRef(({children:e,...t},r)=>jsxRuntime.jsxs(n__namespace.Item,{className:"flex w-full select-none flex-row items-center justify-between px-3 py-2 font-poppins text-gray-100 data-[disabled]:pointer-events-none data-[highlighted]:bg-gray-400 data-[state=checked]:bg-primary-300 data-[highlighted]:outline-none",ref:r,...t,children:[jsxRuntime.jsx(n__namespace.ItemText,{className:"flex-1",children:e}),jsxRuntime.jsx(n__namespace.ItemIndicator,{children:jsxRuntime.jsx(iconsReact.IconCheck,{className:"h-4 w-4"})})]}));var v=f__namespace.default.createContext({});function fe(e){if(typeof window<"u"&&window.localStorage){let t=window.localStorage.getItem("theme");if(t==="dark"||!t&&window.matchMedia("(prefers-color-scheme: dark)").matches)return "dark"}return e??"light"}function Bt({children:e,defaultTheme:t,theme:r}){let[o,a]=f__namespace.default.useState(r||fe(t));function l(i){typeof window<"u"&&window.localStorage&&(i==="dark"?document.documentElement.classList.add("dark"):document.documentElement.classList.remove("dark"),localStorage.setItem("theme",i));}return f__namespace.default.useEffect(()=>{l(o);},[o]),jsxRuntime.jsx(v.Provider,{value:{theme:o,setTheme:a},children:e})}var At=()=>f__namespace.default.useContext(v);
|
|
33
|
+
|
|
34
|
+
exports.Avatar = xe;
|
|
35
|
+
exports.Button = Qe;
|
|
36
|
+
exports.Input = tt;
|
|
37
|
+
exports.Select = xt;
|
|
38
|
+
exports.SelectItem = St;
|
|
39
|
+
exports.Textarea = gt;
|
|
40
|
+
exports.ThemeContext = v;
|
|
41
|
+
exports.ThemeProvider = Bt;
|
|
42
|
+
exports.Tooltip = at;
|
|
43
|
+
exports.TooltipProvider = ct;
|
|
44
|
+
exports.useTheme = At;
|
package/dist/index.mjs
ADDED
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import { cva } from 'class-variance-authority';
|
|
2
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
3
|
+
import * as f from 'react';
|
|
4
|
+
import f__default from 'react';
|
|
5
|
+
import { IconSelector, IconCheck } from '@tabler/icons-react';
|
|
6
|
+
import * as s from '@radix-ui/react-tooltip';
|
|
7
|
+
import * as n from '@radix-ui/react-select';
|
|
8
|
+
|
|
9
|
+
var L=cva("select-none rounded font-semibold leading-none justify-center flex items-center bg-gray-500 text-white dark:text-black",{variants:{size:{sm:"h-6 w-6 text-lg",md:"h-10 w-10 text-xl",lg:"h-14 w-14 text-2xl"}},defaultVariants:{size:"md"}});function xe({alt:e,bg:t,children:r,size:o="md",src:a,...l}){let i=L({size:o,className:t});return jsx("div",{className:i,...l,children:a?jsx("img",{className:"h-full w-full rounded object-cover object-center",alt:e,src:a}):r})}var A=cva(["inline-flex items-center justify-center align-middle no-underline transition-colors ease-in-out duration-300","font-sans appearance-none select-none rounded-sm border font-medium tracking-[.02857em]","aria-disabled:pointer-events-none aria-disabled:opacity-50 aria-disabled:cursor-not-allowed"],{variants:{block:{true:"w-full"},color:{neutral:"",primary:"",success:"",warning:"",error:""},size:{sm:"px-2.5 py-1 text-[.8125rem] leading-4",md:"px-4 py-1.5 text-sm leading-5",lg:"px-5 py-2 text-[.9375rem] leading-6"},variant:{text:"border-transparent bg-transparent",outlined:"bg-transparent",contained:""}},compoundVariants:[{variant:"text",color:"neutral",class:["text-gray-100","hover:border-gray-100 hover:bg-gray-100 hover:text-black","active:border-gray-200 active:bg-gray-200"]},{variant:"text",color:"primary",class:["text-primary-500","hover:border-primary-500 hover:bg-primary-500 hover:text-white","active:border-primary-600 active:bg-primary-600 active:text-white"]},{variant:"text",color:"success",class:["text-success-500","hover:border-success-500 hover:bg-success-500 hover:text-white","active:border-success-600 active:bg-success-600 active:text-white"]},{variant:"text",color:"warning",class:["text-warning-500","hover:border-warning-500 hover:bg-warning-500 hover:text-white","active:border-warning-600 active:bg-warning-600 active:text-white"]},{variant:"text",color:"error",class:["text-error-500","hover:border-error-500 hover:bg-error-500 hover:text-white","active:border-error-600 active:bg-error-600 active:text-white"]},{variant:"outlined",color:"neutral",class:["text-gray-100 border-gray-100","hover:bg-gray-100 hover:text-black","active:text-gray-600 active:bg-gray-200"]},{variant:"outlined",color:"primary",class:["text-primary-500 border-primary-500","hover:bg-primary-500 hover:text-white","active:text-white active:bg-primary-600"]},{variant:"outlined",color:"success",class:["text-success-500 border-success-500","hover:bg-success-500 hover:text-white","active:text-white active:bg-success-600"]},{variant:"outlined",color:"warning",class:["text-warning-500 border-warning-500","hover:bg-warning-500 hover:text-white","active:text-white active:bg-warning-600"]},{variant:"outlined",color:"error",class:["text-error-500 border-error-500","hover:bg-error-500 hover:text-white","active:text-white active:bg-error-600"]},{variant:"contained",color:"neutral",class:["border-gray-100 bg-gray-100 text-black","hover:border-white hover:bg-white","active:border-gray-200 active:bg-gray-200"]},{variant:"contained",color:"primary",class:["border-primary-500 bg-primary-500 text-white","hover:border-primary-400 hover:bg-primary-400","active:border-primary-600 active:bg-primary-600"]},{variant:"contained",color:"success",class:["border-success-500 bg-success-500 text-white","hover:border-success-400 hover:bg-success-400","active:border-success-600 active:bg-success-600"]},{variant:"contained",color:"warning",class:["border-warning-500 bg-warning-500 text-white","hover:border-warning-400 hover:bg-warning-400","active:border-warning-600 active:bg-warning-600"]},{variant:"contained",color:"error",class:["border-error-500 bg-error-500 text-white","hover:border-error-400 hover:bg-error-400","active:border-error-600 active:bg-error-600"]}],defaultVariants:{block:!1,color:"primary",size:"md",variant:"text"}}),R=cva("",{variants:{site:{left:"",right:""},size:{sm:"",md:"",lg:""}},compoundVariants:[{site:"left",size:"sm",class:"-ml-0.5 mr-1.5"},{site:"left",size:"md",class:"-ml-1 mr-2"},{site:"left",size:"lg",class:"-ml-1.5 mr-2.5"},{site:"right",size:"sm",class:"-mr-0.5 ml-1.5"},{site:"right",size:"md",class:"-mr-1 ml-2"},{site:"right",size:"lg",class:"-mr-1.5 ml-2.5"}],defaultVariants:{site:"left",size:"md"}}),T=cva("",{variants:{loading:{true:"motion-reduce:hidden animate-spin"},size:{sm:"h-4.5 w-4.5",md:"h-5 w-5",lg:"h-5.5 w-5.5"}},defaultVariants:{loading:!1,size:"md"}});function S(e){return jsx("svg",{xmlns:"http://www.w3.org/2000/svg",xmlnsXlink:"http://www.w3.org/1999/xlink",fill:"currentColor",version:"1.1",viewBox:"0 0 26.349 26.35",xmlSpace:"preserve",...e,children:jsx("g",{children:jsxs("g",{children:[jsx("circle",{cx:"13.792",cy:"3.082",r:"3.082"}),jsx("circle",{cx:"13.792",cy:"24.501",r:"1.849"}),jsx("circle",{cx:"6.219",cy:"6.218",r:"2.774"}),jsx("circle",{cx:"21.365",cy:"21.363",r:"1.541"}),jsx("circle",{cx:"3.082",cy:"13.792",r:"2.465"}),jsx("circle",{cx:"24.501",cy:"13.791",r:"1.232"}),jsx("path",{d:"M4.694,19.84c-0.843,0.843-0.843,2.207,0,3.05c0.842,0.843,2.208,0.843,3.05,0c0.843-0.843,0.843-2.207,0-3.05 C6.902,18.996,5.537,18.988,4.694,19.84z"}),jsx("circle",{cx:"21.364",cy:"6.218",r:"0.924"})]})})})}var Qe=f.forwardRef(function({as:e,block:t=!1,color:r="primary",children:o,size:a="md",variant:l="text",disabled:i=!1,startIcon:m,endIcon:g,type:k,loading:h=!1,loadingPosition:E="start",...Z},_){let B=e||"button",j=A({block:t,size:a,variant:l,color:r}),b=h&&E==="start",V=b?jsx(S,{"aria-label":"Loading"}):m||null,ee=T({size:a,loading:b}),te=R({size:a,site:"left"}),u=h&&E==="end",z=u?jsx(S,{"aria-label":"Loading"}):g||null,re=T({size:a,loading:u}),oe=R({size:a,site:"right"}),x=i||h;return jsxs(B,{"aria-disabled":x||void 0,className:j,"data-state":h?"loading":void 0,disabled:x,ref:_,role:"button",tabIndex:x?-1:0,type:B==="button"?"button":void 0,...Z,children:[V?jsx("span",{className:te,role:b?"progressbar":void 0,children:f.cloneElement(V,{className:ee})}):null,o,z?jsx("span",{className:oe,role:u?"progressbar":void 0,children:f.cloneElement(z,{className:re})}):null]})});var G=cva(["h-10 w-full appearance-none border bg-app-primary py-2 font-poppins outline-0 transition-colors duration-300 ease-in-out","placeholder:select-none placeholder:text-gray-200","invalid:border-error-500 focus:border-primary-400 active:border-primary-400","disabled:border-gray-400 disabled:text-gray-200 disabled:placeholder:text-gray-300"],{variants:{invalid:{true:["text-error-500 border-error-500 hover:border-error-400 focus:text-gray-100"],false:["text-gray-100 border-gray-350 hover:border-primary-500"]},withStartIcon:{true:"pl-11",false:"pl-3"},withEndIcon:{true:"pr-11",false:"pr-3"}},defaultVariants:{invalid:!1,withStartIcon:!1,withEndIcon:!1}}),I=cva(["pointer-events-none absolute bottom-2 top-2 inline-flex w-10 content-center items-center justify-center text-center"],{variants:{disabled:{true:"text-gray-200"},site:{right:"right-0 border-l border-l-gray-400 pr-1",left:"left-0 border-r border-r-gray-400 pl-1"}},defaultVariants:{disabled:!1}});var tt=f.forwardRef(function({invalid:e=!1,startIcon:t,endIcon:r,disabled:o=!1,...a},l){let i=G({withEndIcon:!!r,withStartIcon:!!t,invalid:e}),m=I({site:"left",disabled:o}),g=I({site:"right",disabled:o});return jsxs("div",{className:"relative text-gray-100 typography-body-2",children:[t?jsx("span",{className:m,children:t}):null,jsx("input",{"aria-invalid":e||void 0,disabled:o,className:i,ref:l,...a}),r?jsx("span",{"aria-hidden":!0,className:g,children:r}):null]})});function at({defaultOpen:e,content:t,open:r,onOpenChange:o,children:a,side:l,align:i,collisionPadding:m=8,sideOffset:g=8,...k}){return jsxs(s.Root,{delayDuration:0,open:r,defaultOpen:e,onOpenChange:o,children:[jsx(s.Trigger,{asChild:!0,children:a}),t?jsx(s.Portal,{children:jsxs(s.Content,{className:"text-typography-primary select-none rounded bg-white p-2 will-change-[transform,opacity] typography-body-1 data-[state=delayed-open]:data-[side=bottom]:animate-slideUpAndFade data-[state=delayed-open]:data-[side=left]:animate-slideRightAndFade data-[state=delayed-open]:data-[side=right]:animate-slideLeftAndFade data-[state=delayed-open]:data-[side=top]:animate-slideDownAndFade",sideOffset:g,side:l,align:i,collisionPadding:m,...k,style:{maxWidth:"var(--radix-tooltip-content-available-width)"},children:[t,jsx(s.Arrow,{width:8,height:4,className:"fill-white"})]})}):null]})}function ct({children:e}){return jsx(s.Provider,{skipDelayDuration:500,children:e})}var U=cva(["h-28 min-h-10 w-full appearance-none border bg-app-primary px-3 py-2 font-poppins outline-0 transition-colors duration-300 ease-in-out scroll typography-body-2 placeholder:select-none placeholder:text-gray-200","focus:border-primary-400","active:border-primary-400","disabled:border-gray-400 disabled:text-gray-200 disabled:placeholder:text-gray-300"],{variants:{invalid:{true:["text-error-500 border-error-500","hover:border-error-400","focus:text-gray-100"],false:["text-gray-100 border-gray-350","hover:border-primary-500"]}},defaultVariants:{invalid:!1}});var gt=f.forwardRef(function({invalid:e=!1,...t},r){let o=U({invalid:e});return jsx("textarea",{"aria-invalid":e||void 0,className:o,ref:r,...t})});var q=cva(["h-10 w-full appearance-none border bg-app-primary py-2 font-poppins outline-0 inline-flex items-center justify-between text-gray-100 typography-body-2 gap-2 transition-colors duration-300 ease-in-out","placeholder:select-none placeholder:text-gray-200","invalid:border-error-500 focus:border-primary-400 active:border-primary-400","disabled:border-gray-400 disabled:text-gray-200 disabled:placeholder:text-gray-300"],{variants:{invalid:{true:["text-error-500 border-error-500 hover:border-error-400 focus:text-gray-100"],false:["text-gray-100 border-gray-350 hover:border-primary-500"]},withStartIcon:{true:"pl-11",false:"pl-3"},withEndIcon:{true:"pr-11",false:"pr-3"}},defaultVariants:{invalid:!1,withStartIcon:!1,withEndIcon:!1}});var xt=f.forwardRef(({children:e,placeholder:t,...r},o)=>{let a=q();return jsxs(n.Root,{...r,children:[jsxs(n.Trigger,{className:a,ref:o,children:[jsx(n.Value,{placeholder:"Select a fruit\u2026"}),jsx(n.Icon,{className:"-mr-1.5",children:jsx(IconSelector,{className:"h-5 w-5 text-gray-200"})})]}),jsx(n.Portal,{children:jsx(n.Content,{sideOffset:4,className:"w-full overflow-hidden border border-gray-350 bg-app-primary py-1",children:jsx(n.Viewport,{children:e})})})]})});var St=f.forwardRef(({children:e,...t},r)=>jsxs(n.Item,{className:"flex w-full select-none flex-row items-center justify-between px-3 py-2 font-poppins text-gray-100 data-[disabled]:pointer-events-none data-[highlighted]:bg-gray-400 data-[state=checked]:bg-primary-300 data-[highlighted]:outline-none",ref:r,...t,children:[jsx(n.ItemText,{className:"flex-1",children:e}),jsx(n.ItemIndicator,{children:jsx(IconCheck,{className:"h-4 w-4"})})]}));var v=f__default.createContext({});function fe(e){if(typeof window<"u"&&window.localStorage){let t=window.localStorage.getItem("theme");if(t==="dark"||!t&&window.matchMedia("(prefers-color-scheme: dark)").matches)return "dark"}return e??"light"}function Bt({children:e,defaultTheme:t,theme:r}){let[o,a]=f__default.useState(r||fe(t));function l(i){typeof window<"u"&&window.localStorage&&(i==="dark"?document.documentElement.classList.add("dark"):document.documentElement.classList.remove("dark"),localStorage.setItem("theme",i));}return f__default.useEffect(()=>{l(o);},[o]),jsx(v.Provider,{value:{theme:o,setTheme:a},children:e})}var At=()=>f__default.useContext(v);
|
|
10
|
+
|
|
11
|
+
export { xe as Avatar, Qe as Button, tt as Input, xt as Select, St as SelectItem, gt as Textarea, v as ThemeContext, Bt as ThemeProvider, at as Tooltip, ct as TooltipProvider, At as useTheme };
|
package/icons/index.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export { IconBadgeFilled, IconBolt, IconBook, IconBrandGithub, IconBrandGoogle, IconBrandLinkedin, IconBrandNpm, IconBrandTwitter, IconCurrencyDollar, IconDownload, IconMail, IconMapPin, IconPhone, IconRocket, IconSend, IconTrash } from '@tabler/icons-react';
|
|
1
|
+
export { IconBadgeFilled, IconBolt, IconBook, IconBrandGithub, IconBrandGoogle, IconBrandLinkedin, IconBrandNpm, IconBrandTwitter, IconCheck, IconCurrencyDollar, IconDownload, IconMail, IconMapPin, IconPhone, IconRocket, IconSelector, IconSend, IconTrash } from '@tabler/icons-react';
|
|
2
2
|
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
3
3
|
import * as React from 'react';
|
|
4
4
|
|
package/icons/index.js
CHANGED
|
@@ -1,79 +1,81 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var
|
|
4
|
-
require('
|
|
3
|
+
var iconsReact = require('@tabler/icons-react');
|
|
4
|
+
var jsxRuntime = require('react/jsx-runtime');
|
|
5
5
|
|
|
6
|
+
function r(e){return jsxRuntime.jsxs("svg",{viewBox:"0 0 18 18",xmlns:"http://www.w3.org/2000/svg",...e,children:[jsxRuntime.jsx("path",{d:"M17.64 9.2c0-.637-.057-1.251-.164-1.84H9v3.481h4.844c-.209 1.125-.843 2.078-1.796 2.717v2.258h2.908c1.702-1.567 2.684-3.874 2.684-6.615z",fillRule:"evenodd",fillOpacity:"1",fill:"#4285f4",stroke:"none"}),jsxRuntime.jsx("path",{d:"M9.003 18c2.43 0 4.467-.806 5.956-2.18L12.05 13.56c-.806.54-1.836.86-3.047.86-2.344 0-4.328-1.584-5.036-3.711H.96v2.332C2.44 15.983 5.485 18 9.003 18z",fillRule:"evenodd",fillOpacity:"1",fill:"#34a853",stroke:"none"}),jsxRuntime.jsx("path",{d:"M3.964 10.712c-.18-.54-.282-1.117-.282-1.71 0-.593.102-1.17.282-1.71V4.96H.957C.347 6.175 0 7.55 0 9.002c0 1.452.348 2.827.957 4.042l3.007-2.332z",fillRule:"evenodd",fillOpacity:"1",fill:"#fbbc05",stroke:"none"}),jsxRuntime.jsx("path",{d:"M9.003 3.58c1.321 0 2.508.454 3.44 1.345l2.582-2.58C13.464.891 11.428 0 9.002 0 5.485 0 2.44 2.017.96 4.958L3.967 7.29c.708-2.127 2.692-3.71 5.036-3.71z",fillRule:"evenodd",fillOpacity:"1",fill:"#ea4335",stroke:"none"})]})}function a(e){return jsxRuntime.jsx("svg",{xmlns:"http://www.w3.org/2000/svg",xmlnsXlink:"http://www.w3.org/1999/xlink",fill:"currentColor",version:"1.1",viewBox:"0 0 26.349 26.35",xmlSpace:"preserve",...e,children:jsxRuntime.jsx("g",{children:jsxRuntime.jsxs("g",{children:[jsxRuntime.jsx("circle",{cx:"13.792",cy:"3.082",r:"3.082"}),jsxRuntime.jsx("circle",{cx:"13.792",cy:"24.501",r:"1.849"}),jsxRuntime.jsx("circle",{cx:"6.219",cy:"6.218",r:"2.774"}),jsxRuntime.jsx("circle",{cx:"21.365",cy:"21.363",r:"1.541"}),jsxRuntime.jsx("circle",{cx:"3.082",cy:"13.792",r:"2.465"}),jsxRuntime.jsx("circle",{cx:"24.501",cy:"13.791",r:"1.232"}),jsxRuntime.jsx("path",{d:"M4.694,19.84c-0.843,0.843-0.843,2.207,0,3.05c0.842,0.843,2.208,0.843,3.05,0c0.843-0.843,0.843-2.207,0-3.05 C6.902,18.996,5.537,18.988,4.694,19.84z"}),jsxRuntime.jsx("circle",{cx:"21.364",cy:"6.218",r:"0.924"})]})})})}
|
|
6
7
|
|
|
7
|
-
|
|
8
|
-
Object.defineProperty(exports, 'GoogleIcon', {
|
|
9
|
-
enumerable: true,
|
|
10
|
-
get: function () { return chunkIZJ75JZB_js.q; }
|
|
11
|
-
});
|
|
12
8
|
Object.defineProperty(exports, 'IconBadgeFilled', {
|
|
13
9
|
enumerable: true,
|
|
14
|
-
get: function () { return
|
|
10
|
+
get: function () { return iconsReact.IconBadgeFilled; }
|
|
15
11
|
});
|
|
16
12
|
Object.defineProperty(exports, 'IconBolt', {
|
|
17
13
|
enumerable: true,
|
|
18
|
-
get: function () { return
|
|
14
|
+
get: function () { return iconsReact.IconBolt; }
|
|
19
15
|
});
|
|
20
16
|
Object.defineProperty(exports, 'IconBook', {
|
|
21
17
|
enumerable: true,
|
|
22
|
-
get: function () { return
|
|
18
|
+
get: function () { return iconsReact.IconBook; }
|
|
23
19
|
});
|
|
24
20
|
Object.defineProperty(exports, 'IconBrandGithub', {
|
|
25
21
|
enumerable: true,
|
|
26
|
-
get: function () { return
|
|
22
|
+
get: function () { return iconsReact.IconBrandGithub; }
|
|
27
23
|
});
|
|
28
24
|
Object.defineProperty(exports, 'IconBrandGoogle', {
|
|
29
25
|
enumerable: true,
|
|
30
|
-
get: function () { return
|
|
26
|
+
get: function () { return iconsReact.IconBrandGoogle; }
|
|
31
27
|
});
|
|
32
28
|
Object.defineProperty(exports, 'IconBrandLinkedin', {
|
|
33
29
|
enumerable: true,
|
|
34
|
-
get: function () { return
|
|
30
|
+
get: function () { return iconsReact.IconBrandLinkedin; }
|
|
35
31
|
});
|
|
36
32
|
Object.defineProperty(exports, 'IconBrandNpm', {
|
|
37
33
|
enumerable: true,
|
|
38
|
-
get: function () { return
|
|
34
|
+
get: function () { return iconsReact.IconBrandNpm; }
|
|
39
35
|
});
|
|
40
36
|
Object.defineProperty(exports, 'IconBrandTwitter', {
|
|
41
37
|
enumerable: true,
|
|
42
|
-
get: function () { return
|
|
38
|
+
get: function () { return iconsReact.IconBrandTwitter; }
|
|
39
|
+
});
|
|
40
|
+
Object.defineProperty(exports, 'IconCheck', {
|
|
41
|
+
enumerable: true,
|
|
42
|
+
get: function () { return iconsReact.IconCheck; }
|
|
43
43
|
});
|
|
44
44
|
Object.defineProperty(exports, 'IconCurrencyDollar', {
|
|
45
45
|
enumerable: true,
|
|
46
|
-
get: function () { return
|
|
46
|
+
get: function () { return iconsReact.IconCurrencyDollar; }
|
|
47
47
|
});
|
|
48
48
|
Object.defineProperty(exports, 'IconDownload', {
|
|
49
49
|
enumerable: true,
|
|
50
|
-
get: function () { return
|
|
50
|
+
get: function () { return iconsReact.IconDownload; }
|
|
51
51
|
});
|
|
52
52
|
Object.defineProperty(exports, 'IconMail', {
|
|
53
53
|
enumerable: true,
|
|
54
|
-
get: function () { return
|
|
54
|
+
get: function () { return iconsReact.IconMail; }
|
|
55
55
|
});
|
|
56
56
|
Object.defineProperty(exports, 'IconMapPin', {
|
|
57
57
|
enumerable: true,
|
|
58
|
-
get: function () { return
|
|
58
|
+
get: function () { return iconsReact.IconMapPin; }
|
|
59
59
|
});
|
|
60
60
|
Object.defineProperty(exports, 'IconPhone', {
|
|
61
61
|
enumerable: true,
|
|
62
|
-
get: function () { return
|
|
62
|
+
get: function () { return iconsReact.IconPhone; }
|
|
63
63
|
});
|
|
64
64
|
Object.defineProperty(exports, 'IconRocket', {
|
|
65
65
|
enumerable: true,
|
|
66
|
-
get: function () { return
|
|
66
|
+
get: function () { return iconsReact.IconRocket; }
|
|
67
67
|
});
|
|
68
|
-
Object.defineProperty(exports, '
|
|
68
|
+
Object.defineProperty(exports, 'IconSelector', {
|
|
69
69
|
enumerable: true,
|
|
70
|
-
get: function () { return
|
|
70
|
+
get: function () { return iconsReact.IconSelector; }
|
|
71
71
|
});
|
|
72
|
-
Object.defineProperty(exports, '
|
|
72
|
+
Object.defineProperty(exports, 'IconSend', {
|
|
73
73
|
enumerable: true,
|
|
74
|
-
get: function () { return
|
|
74
|
+
get: function () { return iconsReact.IconSend; }
|
|
75
75
|
});
|
|
76
|
-
Object.defineProperty(exports, '
|
|
76
|
+
Object.defineProperty(exports, 'IconTrash', {
|
|
77
77
|
enumerable: true,
|
|
78
|
-
get: function () { return
|
|
78
|
+
get: function () { return iconsReact.IconTrash; }
|
|
79
79
|
});
|
|
80
|
+
exports.GoogleIcon = r;
|
|
81
|
+
exports.LoadingIcon = a;
|
package/icons/index.mjs
CHANGED
|
@@ -1,2 +1,6 @@
|
|
|
1
|
-
export {
|
|
2
|
-
import '
|
|
1
|
+
export { IconBadgeFilled, IconBolt, IconBook, IconBrandGithub, IconBrandGoogle, IconBrandLinkedin, IconBrandNpm, IconBrandTwitter, IconCheck, IconCurrencyDollar, IconDownload, IconMail, IconMapPin, IconPhone, IconRocket, IconSelector, IconSend, IconTrash } from '@tabler/icons-react';
|
|
2
|
+
import { jsxs, jsx } from 'react/jsx-runtime';
|
|
3
|
+
|
|
4
|
+
function r(e){return jsxs("svg",{viewBox:"0 0 18 18",xmlns:"http://www.w3.org/2000/svg",...e,children:[jsx("path",{d:"M17.64 9.2c0-.637-.057-1.251-.164-1.84H9v3.481h4.844c-.209 1.125-.843 2.078-1.796 2.717v2.258h2.908c1.702-1.567 2.684-3.874 2.684-6.615z",fillRule:"evenodd",fillOpacity:"1",fill:"#4285f4",stroke:"none"}),jsx("path",{d:"M9.003 18c2.43 0 4.467-.806 5.956-2.18L12.05 13.56c-.806.54-1.836.86-3.047.86-2.344 0-4.328-1.584-5.036-3.711H.96v2.332C2.44 15.983 5.485 18 9.003 18z",fillRule:"evenodd",fillOpacity:"1",fill:"#34a853",stroke:"none"}),jsx("path",{d:"M3.964 10.712c-.18-.54-.282-1.117-.282-1.71 0-.593.102-1.17.282-1.71V4.96H.957C.347 6.175 0 7.55 0 9.002c0 1.452.348 2.827.957 4.042l3.007-2.332z",fillRule:"evenodd",fillOpacity:"1",fill:"#fbbc05",stroke:"none"}),jsx("path",{d:"M9.003 3.58c1.321 0 2.508.454 3.44 1.345l2.582-2.58C13.464.891 11.428 0 9.002 0 5.485 0 2.44 2.017.96 4.958L3.967 7.29c.708-2.127 2.692-3.71 5.036-3.71z",fillRule:"evenodd",fillOpacity:"1",fill:"#ea4335",stroke:"none"})]})}function a(e){return jsx("svg",{xmlns:"http://www.w3.org/2000/svg",xmlnsXlink:"http://www.w3.org/1999/xlink",fill:"currentColor",version:"1.1",viewBox:"0 0 26.349 26.35",xmlSpace:"preserve",...e,children:jsx("g",{children:jsxs("g",{children:[jsx("circle",{cx:"13.792",cy:"3.082",r:"3.082"}),jsx("circle",{cx:"13.792",cy:"24.501",r:"1.849"}),jsx("circle",{cx:"6.219",cy:"6.218",r:"2.774"}),jsx("circle",{cx:"21.365",cy:"21.363",r:"1.541"}),jsx("circle",{cx:"3.082",cy:"13.792",r:"2.465"}),jsx("circle",{cx:"24.501",cy:"13.791",r:"1.232"}),jsx("path",{d:"M4.694,19.84c-0.843,0.843-0.843,2.207,0,3.05c0.842,0.843,2.208,0.843,3.05,0c0.843-0.843,0.843-2.207,0-3.05 C6.902,18.996,5.537,18.988,4.694,19.84z"}),jsx("circle",{cx:"21.364",cy:"6.218",r:"0.924"})]})})})}
|
|
5
|
+
|
|
6
|
+
export { r as GoogleIcon, a as LoadingIcon };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@szum-tech/design-system",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.13.0",
|
|
4
4
|
"description": "Szum-Tech design system with tailwindcss support",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"szum-tech",
|
|
@@ -26,17 +26,11 @@
|
|
|
26
26
|
"license": "MIT",
|
|
27
27
|
"author": "Jan Szewczyk (Szum-Tech)",
|
|
28
28
|
"sideEffects": false,
|
|
29
|
-
"main": "
|
|
30
|
-
"module": "
|
|
31
|
-
"types": "
|
|
29
|
+
"main": ".dist/index.js",
|
|
30
|
+
"module": ".dist/index.mjs",
|
|
31
|
+
"types": ".dist/index.d.ts",
|
|
32
32
|
"files": [
|
|
33
|
-
"
|
|
34
|
-
"*.d.ts",
|
|
35
|
-
"chunk-*.mjs",
|
|
36
|
-
"chunk-*.js",
|
|
37
|
-
"components/**",
|
|
38
|
-
"hooks/**",
|
|
39
|
-
"contexts/**",
|
|
33
|
+
"dist/**",
|
|
40
34
|
"icons/**",
|
|
41
35
|
"theme/**"
|
|
42
36
|
],
|
|
@@ -60,7 +54,9 @@
|
|
|
60
54
|
"type-check": "tsc --noEmit"
|
|
61
55
|
},
|
|
62
56
|
"dependencies": {
|
|
57
|
+
"@radix-ui/react-select": "^1.2.2",
|
|
63
58
|
"@radix-ui/react-tooltip": "^1.0.6",
|
|
59
|
+
"@tabler/icons-react": "^2.20.0",
|
|
64
60
|
"@tailwindcss/container-queries": "^0.1.0",
|
|
65
61
|
"class-variance-authority": "^0.6.0",
|
|
66
62
|
"tailwind-scrollbar": "^3.0.4"
|
|
@@ -75,7 +71,6 @@
|
|
|
75
71
|
"@storybook/react-vite": "^7.0.18",
|
|
76
72
|
"@szum-tech/prettier-config": "^1.2.1",
|
|
77
73
|
"@szum-tech/semantic-release-preset": "^1.5.1",
|
|
78
|
-
"@tabler/icons-react": "^2.20.0",
|
|
79
74
|
"@testing-library/dom": "^9.3.0",
|
|
80
75
|
"@testing-library/jest-dom": "^5.16.5",
|
|
81
76
|
"@testing-library/react": "^14.0.0",
|
package/Avatar-c6a2f50d.d.ts
DELETED
|
@@ -1,37 +0,0 @@
|
|
|
1
|
-
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
-
import * as React from 'react';
|
|
3
|
-
import { VariantProps } from 'class-variance-authority';
|
|
4
|
-
import * as class_variance_authority_dist_types from 'class-variance-authority/dist/types';
|
|
5
|
-
|
|
6
|
-
declare const avatarCva: (props?: ({
|
|
7
|
-
size?: "sm" | "md" | "lg" | null | undefined;
|
|
8
|
-
} & class_variance_authority_dist_types.ClassProp) | undefined) => string;
|
|
9
|
-
|
|
10
|
-
type AvatarCvaProps = VariantProps<typeof avatarCva>;
|
|
11
|
-
type AvatarSizeType = NonNullable<AvatarCvaProps["size"]>;
|
|
12
|
-
|
|
13
|
-
type AvatarProps = React.ComponentPropsWithoutRef<"div"> & {
|
|
14
|
-
/**
|
|
15
|
-
* Defines avatar image alt
|
|
16
|
-
*/
|
|
17
|
-
alt?: string;
|
|
18
|
-
/**
|
|
19
|
-
* Defines background color
|
|
20
|
-
*/
|
|
21
|
-
bg?: `bg-${string}` | `bg-${string}-${number}`;
|
|
22
|
-
/**
|
|
23
|
-
* Defines avatar children
|
|
24
|
-
*/
|
|
25
|
-
children?: React.ReactNode;
|
|
26
|
-
/**
|
|
27
|
-
* Defines avatar size
|
|
28
|
-
*/
|
|
29
|
-
size?: AvatarSizeType;
|
|
30
|
-
/**
|
|
31
|
-
* Defines avatar image src
|
|
32
|
-
*/
|
|
33
|
-
src?: string;
|
|
34
|
-
};
|
|
35
|
-
declare function Avatar({ alt, bg, children, size, src, ...props }: AvatarProps): react_jsx_runtime.JSX.Element;
|
|
36
|
-
|
|
37
|
-
export { AvatarProps as A, Avatar as a, AvatarSizeType as b };
|
package/Button-ae5be036.d.ts
DELETED
|
@@ -1,63 +0,0 @@
|
|
|
1
|
-
import { P as PolymorphicComponentProp, A as AsProp } from './utils.types-3df7903f.js';
|
|
2
|
-
import * as React from 'react';
|
|
3
|
-
import { VariantProps } from 'class-variance-authority';
|
|
4
|
-
import * as class_variance_authority_dist_types from 'class-variance-authority/dist/types';
|
|
5
|
-
|
|
6
|
-
declare const buttonCva: (props?: ({
|
|
7
|
-
block?: boolean | null | undefined;
|
|
8
|
-
color?: "neutral" | "primary" | "success" | "warning" | "error" | null | undefined;
|
|
9
|
-
size?: "sm" | "md" | "lg" | null | undefined;
|
|
10
|
-
variant?: "text" | "outlined" | "contained" | null | undefined;
|
|
11
|
-
} & class_variance_authority_dist_types.ClassProp) | undefined) => string;
|
|
12
|
-
|
|
13
|
-
type ButtonCvaProps = VariantProps<typeof buttonCva>;
|
|
14
|
-
type ButtonSizeType = NonNullable<ButtonCvaProps["size"]>;
|
|
15
|
-
type ButtonVariantType = NonNullable<ButtonCvaProps["variant"]>;
|
|
16
|
-
type ButtonColorType = NonNullable<ButtonCvaProps["color"]>;
|
|
17
|
-
|
|
18
|
-
type Props = {
|
|
19
|
-
/**
|
|
20
|
-
* Defines button full width
|
|
21
|
-
*/
|
|
22
|
-
block?: boolean;
|
|
23
|
-
/**
|
|
24
|
-
* Defines button color
|
|
25
|
-
*/
|
|
26
|
-
color?: ButtonColorType;
|
|
27
|
-
/**
|
|
28
|
-
* Defines button variant
|
|
29
|
-
*/
|
|
30
|
-
variant?: ButtonVariantType;
|
|
31
|
-
/**
|
|
32
|
-
* Defines button size
|
|
33
|
-
*/
|
|
34
|
-
size?: ButtonSizeType;
|
|
35
|
-
/**
|
|
36
|
-
* Defines button content
|
|
37
|
-
*/
|
|
38
|
-
children?: React.ReactNode;
|
|
39
|
-
/**
|
|
40
|
-
* Disabled button
|
|
41
|
-
*/
|
|
42
|
-
disabled?: boolean;
|
|
43
|
-
/**
|
|
44
|
-
* Defines left icon
|
|
45
|
-
*/
|
|
46
|
-
startIcon?: React.ReactElement;
|
|
47
|
-
/**
|
|
48
|
-
* Defines right icon
|
|
49
|
-
*/
|
|
50
|
-
endIcon?: React.ReactElement;
|
|
51
|
-
/**
|
|
52
|
-
* Defines is button is in loading state
|
|
53
|
-
*/
|
|
54
|
-
loading?: boolean;
|
|
55
|
-
/**
|
|
56
|
-
* Defines is position of loading icon
|
|
57
|
-
*/
|
|
58
|
-
loadingPosition?: "start" | "end";
|
|
59
|
-
};
|
|
60
|
-
type ButtonProps<T extends React.ElementType = "button"> = PolymorphicComponentProp<T, Props>;
|
|
61
|
-
declare const Button: <T extends React.ElementType<any> = "button">(props: Props & AsProp<T> & Omit<React.PropsWithoutRef<React.ComponentProps<T>>, "as" | keyof Props> & React.RefAttributes<unknown>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
|
62
|
-
|
|
63
|
-
export { ButtonProps as B, Button as a, ButtonSizeType as b, ButtonVariantType as c, ButtonColorType as d };
|
package/Input-41362e55.d.ts
DELETED
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { O as OmitStylesProps } from './utils.types-3df7903f.js';
|
|
3
|
-
|
|
4
|
-
type Props = {
|
|
5
|
-
invalid?: boolean;
|
|
6
|
-
startIcon?: React.ReactElement | string;
|
|
7
|
-
endIcon?: React.ReactElement | string;
|
|
8
|
-
};
|
|
9
|
-
type InputProps = OmitStylesProps<React.ComponentPropsWithoutRef<"input">> & Props;
|
|
10
|
-
declare const Input: (props: OmitStylesProps<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref">> & Props & React.RefAttributes<HTMLInputElement>) => React.ReactElement<any, string | React.JSXElementConstructor<any>> | null;
|
|
11
|
-
|
|
12
|
-
export { InputProps as I, Input as a };
|
package/Textarea-7d32840f.d.ts
DELETED
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
import { O as OmitStylesProps } from './utils.types-3df7903f.js';
|
|
3
|
-
|
|
4
|
-
type Props = {
|
|
5
|
-
invalid?: boolean;
|
|
6
|
-
};
|
|
7
|
-
type TextareaProps = OmitStylesProps<React.ComponentPropsWithoutRef<"textarea">> & Props;
|
|
8
|
-
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;
|
|
9
|
-
|
|
10
|
-
export { TextareaProps as T, Textarea as a };
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
import React__default from 'react';
|
|
2
|
-
import { a as ThemeContextType, T as ThemeType } from './theme.types-a32f0702.js';
|
|
3
|
-
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
4
|
-
|
|
5
|
-
declare const ThemeContext: React__default.Context<ThemeContextType>;
|
|
6
|
-
|
|
7
|
-
interface ThemeProviderProps {
|
|
8
|
-
/**
|
|
9
|
-
* Children Components using theming.
|
|
10
|
-
*/
|
|
11
|
-
children?: React__default.ReactNode;
|
|
12
|
-
/**
|
|
13
|
-
* Define the default theme which is set at the beginning if neither local storage nor media is defined.
|
|
14
|
-
*/
|
|
15
|
-
defaultTheme?: ThemeType;
|
|
16
|
-
/**
|
|
17
|
-
* Define theme that is always set initially.
|
|
18
|
-
*/
|
|
19
|
-
theme?: ThemeType;
|
|
20
|
-
}
|
|
21
|
-
declare function ThemeProvider({ children, defaultTheme, theme }: ThemeProviderProps): react_jsx_runtime.JSX.Element;
|
|
22
|
-
|
|
23
|
-
export { ThemeContext as T, ThemeProviderProps as a, ThemeProvider as b };
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
2
|
-
import * as React from 'react';
|
|
3
|
-
import * as ReactTooltip from '@radix-ui/react-tooltip';
|
|
4
|
-
|
|
5
|
-
type TooltipProps = ReactTooltip.TooltipContentProps & {
|
|
6
|
-
children?: React.ReactNode;
|
|
7
|
-
defaultOpen?: boolean;
|
|
8
|
-
open?: boolean;
|
|
9
|
-
onOpenChange?: (open: boolean) => void;
|
|
10
|
-
content?: React.ReactNode;
|
|
11
|
-
collisionPadding?: number;
|
|
12
|
-
};
|
|
13
|
-
declare function Tooltip({ defaultOpen, content, open, onOpenChange, children, side, align, collisionPadding, sideOffset, ...props }: TooltipProps): react_jsx_runtime.JSX.Element;
|
|
14
|
-
|
|
15
|
-
type TooltipProviderProps = {
|
|
16
|
-
children: React.ReactNode;
|
|
17
|
-
};
|
|
18
|
-
declare function TooltipProvider({ children }: TooltipProviderProps): react_jsx_runtime.JSX.Element;
|
|
19
|
-
|
|
20
|
-
export { TooltipProps as T, Tooltip as a, TooltipProviderProps as b, TooltipProvider as c };
|