@deckai/deck-ui 0.0.7 → 0.0.9
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/components/AboutCard.cjs +14 -0
- package/dist/components/AboutCard.cjs.map +1 -0
- package/dist/components/AboutCard.d.cts +12 -0
- package/dist/components/AboutCard.d.ts +12 -0
- package/dist/components/AboutCard.js +14 -0
- package/dist/components/AboutCard.js.map +1 -0
- package/dist/components/Avatar.cjs +2 -0
- package/dist/components/Avatar.cjs.map +1 -0
- package/dist/components/Avatar.d.cts +10 -0
- package/dist/components/Avatar.d.ts +10 -0
- package/dist/components/Avatar.js +2 -0
- package/dist/components/Avatar.js.map +1 -0
- package/dist/components/Badge.cjs +2 -0
- package/dist/components/Badge.cjs.map +1 -0
- package/dist/components/Badge.d.cts +13 -0
- package/dist/components/Badge.d.ts +13 -0
- package/dist/components/Badge.js +2 -0
- package/dist/components/Badge.js.map +1 -0
- package/dist/components/Breadcrumbs.cjs +2 -0
- package/dist/components/Breadcrumbs.cjs.map +1 -0
- package/dist/components/Breadcrumbs.d.cts +15 -0
- package/dist/components/Breadcrumbs.d.ts +15 -0
- package/dist/components/Breadcrumbs.js +2 -0
- package/dist/components/Breadcrumbs.js.map +1 -0
- package/dist/components/Button.cjs +14 -0
- package/dist/components/Button.cjs.map +1 -0
- package/dist/components/Button.d.cts +28 -0
- package/dist/components/Button.d.ts +28 -0
- package/dist/components/Button.js +14 -0
- package/dist/components/Button.js.map +1 -0
- package/dist/components/Combobox.cjs +2 -0
- package/dist/components/Combobox.cjs.map +1 -0
- package/dist/components/Combobox.d.cts +14 -0
- package/dist/components/Combobox.d.ts +14 -0
- package/dist/components/Combobox.js +2 -0
- package/dist/components/Combobox.js.map +1 -0
- package/dist/components/ContactItem.cjs +2 -0
- package/dist/components/ContactItem.cjs.map +1 -0
- package/dist/components/ContactItem.d.cts +11 -0
- package/dist/components/ContactItem.d.ts +11 -0
- package/dist/components/ContactItem.js +2 -0
- package/dist/components/ContactItem.js.map +1 -0
- package/dist/components/Icon.cjs +2 -0
- package/dist/components/Icon.cjs.map +1 -0
- package/dist/components/Icon.d.cts +18 -0
- package/dist/components/Icon.d.ts +18 -0
- package/dist/components/Icon.js +2 -0
- package/dist/components/Icon.js.map +1 -0
- package/dist/components/Input.cjs +2 -0
- package/dist/components/Input.cjs.map +1 -0
- package/dist/components/Input.d.cts +14 -0
- package/dist/components/Input.d.ts +14 -0
- package/dist/components/Input.js +2 -0
- package/dist/components/Input.js.map +1 -0
- package/dist/components/Link.cjs +2 -0
- package/dist/components/Link.cjs.map +1 -0
- package/dist/components/Link.d.cts +13 -0
- package/dist/components/Link.d.ts +13 -0
- package/dist/components/Link.js +2 -0
- package/dist/components/Link.js.map +1 -0
- package/dist/components/Logo.cjs +3 -0
- package/dist/components/Logo.cjs.map +1 -0
- package/dist/components/Logo.d.cts +11 -0
- package/dist/components/Logo.d.ts +11 -0
- package/dist/components/Logo.js +3 -0
- package/dist/components/Logo.js.map +1 -0
- package/dist/components/Navbar.cjs +3 -0
- package/dist/components/Navbar.cjs.map +1 -0
- package/dist/components/Navbar.d.cts +19 -0
- package/dist/components/Navbar.d.ts +19 -0
- package/dist/components/Navbar.js +3 -0
- package/dist/components/Navbar.js.map +1 -0
- package/dist/components/NavbarItem.cjs +2 -0
- package/dist/components/NavbarItem.cjs.map +1 -0
- package/dist/components/NavbarItem.d.cts +13 -0
- package/dist/components/NavbarItem.d.ts +13 -0
- package/dist/components/NavbarItem.js +2 -0
- package/dist/components/NavbarItem.js.map +1 -0
- package/dist/components/Option.cjs +2 -0
- package/dist/components/Option.cjs.map +1 -0
- package/dist/components/Option.d.cts +11 -0
- package/dist/components/Option.d.ts +11 -0
- package/dist/components/Option.js +2 -0
- package/dist/components/Option.js.map +1 -0
- package/dist/components/Pressable.cjs +2 -0
- package/dist/components/Pressable.cjs.map +1 -0
- package/dist/components/Pressable.d.cts +6 -0
- package/dist/components/Pressable.d.ts +6 -0
- package/dist/components/Pressable.js +2 -0
- package/dist/components/Pressable.js.map +1 -0
- package/dist/components/ProfileCard.cjs +14 -0
- package/dist/components/ProfileCard.cjs.map +1 -0
- package/dist/components/ProfileCard.d.cts +15 -0
- package/dist/components/ProfileCard.d.ts +15 -0
- package/dist/components/ProfileCard.js +14 -0
- package/dist/components/ProfileCard.js.map +1 -0
- package/dist/components/SocialCard.cjs +2 -0
- package/dist/components/SocialCard.cjs.map +1 -0
- package/dist/components/SocialCard.d.cts +12 -0
- package/dist/components/SocialCard.d.ts +12 -0
- package/dist/components/SocialCard.js +2 -0
- package/dist/components/SocialCard.js.map +1 -0
- package/dist/components/Switch.cjs +2 -0
- package/dist/components/Switch.cjs.map +1 -0
- package/dist/components/Switch.d.cts +13 -0
- package/dist/components/Switch.d.ts +13 -0
- package/dist/components/Switch.js +2 -0
- package/dist/components/Switch.js.map +1 -0
- package/dist/components/Tabs.cjs +2 -0
- package/dist/components/Tabs.cjs.map +1 -0
- package/dist/components/Tabs.d.cts +16 -0
- package/dist/components/Tabs.d.ts +16 -0
- package/dist/components/Tabs.js +2 -0
- package/dist/components/Tabs.js.map +1 -0
- package/dist/components/Tag.cjs +2 -0
- package/dist/components/Tag.cjs.map +1 -0
- package/dist/components/Tag.d.cts +10 -0
- package/dist/components/Tag.d.ts +10 -0
- package/dist/components/Tag.js +2 -0
- package/dist/components/Tag.js.map +1 -0
- package/dist/components/Text.cjs +2 -0
- package/dist/components/Text.cjs.map +1 -0
- package/dist/components/Text.d.cts +46 -0
- package/dist/components/Text.d.ts +46 -0
- package/dist/components/Text.js +2 -0
- package/dist/components/Text.js.map +1 -0
- package/dist/components/Tooltip.cjs +2 -0
- package/dist/components/Tooltip.cjs.map +1 -0
- package/dist/components/Tooltip.d.cts +13 -0
- package/dist/components/Tooltip.d.ts +13 -0
- package/dist/components/Tooltip.js +2 -0
- package/dist/components/Tooltip.js.map +1 -0
- package/dist/components/WorkCard.cjs +2 -0
- package/dist/components/WorkCard.cjs.map +1 -0
- package/dist/components/WorkCard.d.cts +13 -0
- package/dist/components/WorkCard.d.ts +13 -0
- package/dist/components/WorkCard.js +2 -0
- package/dist/components/WorkCard.js.map +1 -0
- package/dist/index.cjs +5 -1005
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +29 -288
- package/dist/index.d.ts +29 -288
- package/dist/index.js +5 -954
- package/dist/index.js.map +1 -1
- package/dist/styles/fonts.css +1 -29
- package/dist/styles/fonts.css.map +1 -1
- package/dist/styles/styles.css +1 -1
- package/dist/styles/styles.css.map +1 -1
- package/dist/tailwind-DJFscIlV.d.cts +35 -0
- package/dist/tailwind-DJFscIlV.d.ts +35 -0
- package/package.json +10 -3
package/dist/index.d.cts
CHANGED
|
@@ -1,290 +1,31 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
};
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
text: TextShades;
|
|
30
|
-
overlay: string;
|
|
31
|
-
};
|
|
32
|
-
type HeadingSize = "xl" | "lg" | "md" | "sm" | "xs";
|
|
33
|
-
type BodySize = "lg" | "lg-semibold" | "md" | "default" | "default-medium" | "default-semibold" | "default-bold" | "xs" | "xs-medium" | "xxs" | "xxs-medium" | "xxs-semibold";
|
|
34
|
-
type LabelSize = "default";
|
|
35
|
-
type Typography = {
|
|
36
|
-
heading: Record<HeadingSize, TypographyConfig>;
|
|
37
|
-
body: Record<BodySize, TypographyConfig>;
|
|
38
|
-
label: Record<LabelSize, TypographyConfig>;
|
|
39
|
-
};
|
|
40
|
-
type TypographyConfig = {
|
|
41
|
-
fontSize: string;
|
|
42
|
-
lineHeight?: string;
|
|
43
|
-
letterSpacing?: string;
|
|
44
|
-
fontWeight: string;
|
|
45
|
-
textTransform?: string;
|
|
46
|
-
};
|
|
47
|
-
type IconColors = "primary" | "secondary" | "white" | "primaryBlue";
|
|
48
|
-
|
|
49
|
-
type IconProps = {
|
|
50
|
-
name: IconName;
|
|
51
|
-
/** @default 24 */
|
|
52
|
-
size?: number | `${Breakpoint$1}:${number}`;
|
|
53
|
-
/** @default primary */
|
|
54
|
-
color?: IconColors;
|
|
55
|
-
title?: string;
|
|
56
|
-
className?: string;
|
|
57
|
-
style?: React__default.CSSProperties;
|
|
58
|
-
} & Omit<SVGProps<SVGSVGElement>, "aria-hidden" | "aria-label">;
|
|
59
|
-
type Breakpoint$1 = "sm" | "md" | "lg" | "xl" | "2xl";
|
|
60
|
-
declare const Icon: React__default.ForwardRefExoticComponent<Omit<IconProps, "ref"> & React__default.RefAttributes<SVGSVGElement>>;
|
|
61
|
-
|
|
62
|
-
type PressableProps = ButtonHTMLAttributes<HTMLButtonElement>;
|
|
63
|
-
declare const Pressable: React__default.FC<PressableProps>;
|
|
64
|
-
|
|
65
|
-
type NavbarItemProps = {
|
|
66
|
-
iconName: IconName;
|
|
67
|
-
hasNotification?: boolean;
|
|
68
|
-
} & Pick<IconProps, "color" | "title"> & PressableProps;
|
|
69
|
-
declare const NavbarItem: ({ iconName, hasNotification, color, title, ...props }: NavbarItemProps) => React__default.JSX.Element;
|
|
70
|
-
|
|
71
|
-
type NavbarProps = {
|
|
72
|
-
searchOptions: OptionProps[];
|
|
73
|
-
onSearchChange: (value: string) => void;
|
|
74
|
-
navbarItems: NavbarItemProps[];
|
|
75
|
-
onLogoClick?: () => void;
|
|
76
|
-
onProfileClick?: () => void;
|
|
77
|
-
avatarImage: string;
|
|
78
|
-
};
|
|
79
|
-
declare const Navbar: ({ searchOptions, onSearchChange, navbarItems, onLogoClick, onProfileClick, avatarImage }: NavbarProps) => React__default.JSX.Element;
|
|
80
|
-
|
|
81
|
-
type TextElement = "p" | "span" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "strong" | "em" | "blockquote" | "pre" | "code" | "small" | "label" | "a";
|
|
82
|
-
type HTMLPropsMap = {
|
|
83
|
-
p: React__default.HTMLAttributes<HTMLParagraphElement>;
|
|
84
|
-
span: React__default.HTMLAttributes<HTMLSpanElement>;
|
|
85
|
-
h1: React__default.HTMLAttributes<HTMLHeadingElement>;
|
|
86
|
-
h2: React__default.HTMLAttributes<HTMLHeadingElement>;
|
|
87
|
-
h3: React__default.HTMLAttributes<HTMLHeadingElement>;
|
|
88
|
-
h4: React__default.HTMLAttributes<HTMLHeadingElement>;
|
|
89
|
-
h5: React__default.HTMLAttributes<HTMLHeadingElement>;
|
|
90
|
-
h6: React__default.HTMLAttributes<HTMLHeadingElement>;
|
|
91
|
-
strong: React__default.HTMLAttributes<HTMLElement>;
|
|
92
|
-
em: React__default.HTMLAttributes<HTMLElement>;
|
|
93
|
-
blockquote: React__default.HTMLAttributes<HTMLQuoteElement>;
|
|
94
|
-
pre: React__default.HTMLAttributes<HTMLPreElement>;
|
|
95
|
-
code: React__default.HTMLAttributes<HTMLElement>;
|
|
96
|
-
small: React__default.HTMLAttributes<HTMLElement>;
|
|
97
|
-
label: React__default.LabelHTMLAttributes<HTMLLabelElement>;
|
|
98
|
-
a: Omit<React__default.AnchorHTMLAttributes<HTMLAnchorElement>, "color">;
|
|
99
|
-
};
|
|
100
|
-
type ColorCategory = keyof Omit<Colors, "stroke" | "background">;
|
|
101
|
-
type ColorValue<T extends ColorCategory> = T extends "text" ? TextColorVariant : T extends "primary" ? keyof PrimaryShades : T extends "secondary" ? keyof SecondaryShades : T extends "tertiary" ? keyof TertiaryShades : never;
|
|
102
|
-
type ColorKey = {
|
|
103
|
-
[T in ColorCategory]: `${T}-${ColorValue<T>}`;
|
|
104
|
-
}[ColorCategory];
|
|
105
|
-
type TypographyCategory = keyof Typography;
|
|
106
|
-
type TypographyValue<T extends TypographyCategory> = Extract<keyof Typography[T], string | number | bigint | boolean | null | undefined>;
|
|
107
|
-
type TypographyKey = {
|
|
108
|
-
[T in TypographyCategory]: `${T}-${TypographyValue<T>}`;
|
|
109
|
-
}[TypographyCategory];
|
|
110
|
-
type Weight = "light" | "regular" | "semibold" | "bold";
|
|
111
|
-
type Breakpoint = "sm" | "md" | "lg" | "xl" | "2xl";
|
|
112
|
-
type ResponsiveVariant = TypographyKey | `${Breakpoint}:${TypographyKey}`;
|
|
113
|
-
type TextProps<T extends TextElement = "p"> = {
|
|
114
|
-
variant?: ResponsiveVariant | ResponsiveVariant[];
|
|
115
|
-
color?: ColorKey | "inherit";
|
|
116
|
-
as?: T;
|
|
117
|
-
className?: string;
|
|
118
|
-
children: React__default.ReactNode;
|
|
119
|
-
weight?: Weight;
|
|
120
|
-
} & HTMLPropsMap[T];
|
|
121
|
-
declare const Text: React__default.ForwardRefExoticComponent<TextProps<TextElement> & React__default.RefAttributes<HTMLElement | HTMLParagraphElement | HTMLSpanElement | HTMLHeadingElement | HTMLQuoteElement | HTMLPreElement | HTMLLabelElement | HTMLAnchorElement>>;
|
|
122
|
-
|
|
123
|
-
type LinkProps = {
|
|
124
|
-
href: string;
|
|
125
|
-
children: React__default.ReactNode;
|
|
126
|
-
className?: string;
|
|
127
|
-
style?: React__default.CSSProperties;
|
|
128
|
-
} & Pick<TextProps, "variant" | "color"> & React__default.AnchorHTMLAttributes<HTMLAnchorElement>;
|
|
129
|
-
declare const Link: ({ children, color, variant, href, className, ...props }: LinkProps) => React__default.JSX.Element;
|
|
130
|
-
|
|
131
|
-
type TabItem = {
|
|
132
|
-
value: string;
|
|
133
|
-
label: string;
|
|
134
|
-
content: React__default.ReactNode;
|
|
135
|
-
};
|
|
136
|
-
type TabsProps = {
|
|
137
|
-
items: TabItem[];
|
|
138
|
-
defaultValue?: string;
|
|
139
|
-
className?: string;
|
|
140
|
-
onChange?: (value: string) => void;
|
|
141
|
-
};
|
|
142
|
-
declare const Tabs: React__default.ForwardRefExoticComponent<TabsProps & React__default.RefAttributes<HTMLDivElement>>;
|
|
143
|
-
|
|
144
|
-
type WorkCardProps = {
|
|
145
|
-
socialIconName: "instagram-filled" | "tiktok-filled" | "youtube-filled";
|
|
146
|
-
tags: string[];
|
|
147
|
-
caption: string;
|
|
148
|
-
/** play count should already be formatted with k or m */
|
|
149
|
-
playCount: string;
|
|
150
|
-
backgroundImage: string;
|
|
151
|
-
};
|
|
152
|
-
declare const WorkCard: ({ socialIconName, tags, caption, playCount, backgroundImage }: WorkCardProps) => React__default.JSX.Element;
|
|
153
|
-
|
|
154
|
-
type BreadcrumbItem = {
|
|
155
|
-
label: string;
|
|
156
|
-
href?: string;
|
|
157
|
-
};
|
|
158
|
-
type BreadcrumbsProps = {
|
|
159
|
-
items: BreadcrumbItem[];
|
|
160
|
-
className?: string;
|
|
161
|
-
SeparatorComponent?: React__default.ReactElement;
|
|
162
|
-
onHomeClick: () => void;
|
|
163
|
-
};
|
|
164
|
-
declare const Breadcrumbs: React__default.ForwardRefExoticComponent<BreadcrumbsProps & React__default.RefAttributes<HTMLElement>>;
|
|
165
|
-
|
|
166
|
-
interface TooltipProps {
|
|
167
|
-
content: React.ReactNode;
|
|
168
|
-
children: React.ReactNode;
|
|
169
|
-
side?: "top" | "right" | "bottom" | "left";
|
|
170
|
-
align?: "start" | "center" | "end";
|
|
171
|
-
className?: string;
|
|
172
|
-
delayDuration?: number;
|
|
173
|
-
}
|
|
174
|
-
declare const Tooltip: ({ content, children, side, align, className, delayDuration }: TooltipProps) => React.JSX.Element;
|
|
175
|
-
|
|
176
|
-
type ComboboxProps = {
|
|
177
|
-
options: OptionProps[];
|
|
178
|
-
placeholder?: string;
|
|
179
|
-
value?: string;
|
|
180
|
-
onChange: (value: string) => void;
|
|
181
|
-
end?: React__default.ReactNode;
|
|
182
|
-
className?: string;
|
|
183
|
-
};
|
|
184
|
-
declare const Combobox: ({ options, placeholder, value, onChange, end, className }: ComboboxProps) => React__default.JSX.Element;
|
|
185
|
-
|
|
186
|
-
type TagProps = {
|
|
187
|
-
children: React__default.ReactNode;
|
|
188
|
-
padded?: boolean;
|
|
189
|
-
color?: "primary" | "text";
|
|
190
|
-
} & HTMLAttributes<HTMLDivElement>;
|
|
191
|
-
declare const Tag: ({ children, padded, color, ...props }: TagProps) => React__default.JSX.Element;
|
|
192
|
-
|
|
193
|
-
type SocialCardProps = {
|
|
194
|
-
icon: IconName;
|
|
195
|
-
followers: string;
|
|
196
|
-
engagement: string;
|
|
197
|
-
} & PressableProps;
|
|
198
|
-
declare const SocialCard: ({ icon, followers, engagement, ...pressableProps }: SocialCardProps) => React__default.JSX.Element;
|
|
199
|
-
|
|
200
|
-
type SwitchProps = React.ComponentPropsWithoutRef<typeof SwitchPrimitive.Root> & {
|
|
201
|
-
label?: string;
|
|
202
|
-
description?: string;
|
|
203
|
-
};
|
|
204
|
-
declare const Switch: React.ForwardRefExoticComponent<Omit<SwitchPrimitive.SwitchProps & React.RefAttributes<HTMLButtonElement>, "ref"> & {
|
|
205
|
-
label?: string;
|
|
206
|
-
description?: string;
|
|
207
|
-
} & React.RefAttributes<HTMLButtonElement>>;
|
|
208
|
-
|
|
209
|
-
type BadgeProps = {
|
|
210
|
-
variant?: "pink" | "orange" | "green";
|
|
211
|
-
iconName?: IconName;
|
|
212
|
-
} & React.HTMLAttributes<HTMLSpanElement>;
|
|
213
|
-
declare const Badge: React.ForwardRefExoticComponent<{
|
|
214
|
-
variant?: "pink" | "orange" | "green";
|
|
215
|
-
iconName?: IconName;
|
|
216
|
-
} & React.HTMLAttributes<HTMLSpanElement> & React.RefAttributes<HTMLSpanElement>>;
|
|
217
|
-
|
|
218
|
-
type ProfileCardProps = {
|
|
219
|
-
profileImage: string;
|
|
220
|
-
name: string;
|
|
221
|
-
location: string;
|
|
222
|
-
memberSince?: string;
|
|
223
|
-
interests?: string[];
|
|
224
|
-
badges?: BadgeProps[];
|
|
225
|
-
};
|
|
226
|
-
declare const ProfileCard: ({ profileImage, name, location, memberSince, interests, badges }: ProfileCardProps) => React__default.JSX.Element;
|
|
227
|
-
|
|
228
|
-
type ContactItemProps = {
|
|
229
|
-
iconName: IconName$1;
|
|
230
|
-
children: React__default.ReactNode;
|
|
231
|
-
href: string;
|
|
232
|
-
} & Omit<HTMLAttributes<HTMLAnchorElement>, "color">;
|
|
233
|
-
declare const ContactItem: ({ iconName, children, href, ...linkProps }: ContactItemProps) => React__default.JSX.Element;
|
|
234
|
-
|
|
235
|
-
type AboutCardProps = {
|
|
236
|
-
interests: string[];
|
|
237
|
-
contactItems: ContactItemProps[];
|
|
238
|
-
description: string;
|
|
239
|
-
};
|
|
240
|
-
declare const AboutCard: ({ interests, contactItems, description, ...props }: AboutCardProps) => React__default.JSX.Element;
|
|
241
|
-
|
|
242
|
-
type AvatarProps = {
|
|
243
|
-
src: string;
|
|
244
|
-
size?: number | string;
|
|
245
|
-
} & Pick<React__default.ComponentProps<typeof Pressable>, "onClick">;
|
|
246
|
-
declare const Avatar: ({ src, size, onClick, ...props }: AvatarProps) => React__default.JSX.Element;
|
|
247
|
-
|
|
248
|
-
type LogoProps = {
|
|
249
|
-
/** @default 76 */
|
|
250
|
-
width?: number;
|
|
251
|
-
/** @default 25 */
|
|
252
|
-
height?: number;
|
|
253
|
-
};
|
|
254
|
-
declare const Logo: ({ width, height }: LogoProps) => React__default.JSX.Element;
|
|
255
|
-
|
|
256
|
-
type ButtonProps = {
|
|
257
|
-
/** @default filled */
|
|
258
|
-
variant?: "filled" | "outlined";
|
|
259
|
-
/** @default primary */
|
|
260
|
-
color?: "black" | "accent" | "secondary";
|
|
261
|
-
isLoading?: boolean;
|
|
262
|
-
children: React.ReactNode;
|
|
263
|
-
className?: string;
|
|
264
|
-
disabled?: boolean;
|
|
265
|
-
start?: React.ReactNode;
|
|
266
|
-
end?: React.ReactNode;
|
|
267
|
-
} & React.ButtonHTMLAttributes<HTMLButtonElement>;
|
|
268
|
-
declare const Button: React.ForwardRefExoticComponent<{
|
|
269
|
-
/** @default filled */
|
|
270
|
-
variant?: "filled" | "outlined";
|
|
271
|
-
/** @default primary */
|
|
272
|
-
color?: "black" | "accent" | "secondary";
|
|
273
|
-
isLoading?: boolean;
|
|
274
|
-
children: React.ReactNode;
|
|
275
|
-
className?: string;
|
|
276
|
-
disabled?: boolean;
|
|
277
|
-
start?: React.ReactNode;
|
|
278
|
-
end?: React.ReactNode;
|
|
279
|
-
} & React.ButtonHTMLAttributes<HTMLButtonElement> & React.RefAttributes<HTMLButtonElement>>;
|
|
280
|
-
|
|
281
|
-
type InputProps = {
|
|
282
|
-
className?: string;
|
|
283
|
-
end?: React.ReactNode;
|
|
284
|
-
/** renders an icon in the end slot */
|
|
285
|
-
iconName?: IconName;
|
|
286
|
-
} & React.InputHTMLAttributes<HTMLInputElement> & Pick<IconProps, "color" | "size" | "title">;
|
|
287
|
-
declare const Input: ({ className, end, iconName, color, size, title, ...props }: InputProps) => React.JSX.Element;
|
|
1
|
+
export { Navbar, NavbarProps } from './components/Navbar.cjs';
|
|
2
|
+
export { Pressable, PressableProps } from './components/Pressable.cjs';
|
|
3
|
+
export { Link, LinkProps } from './components/Link.cjs';
|
|
4
|
+
export { Tabs, TabsProps } from './components/Tabs.cjs';
|
|
5
|
+
export { WorkCard, WorkCardProps } from './components/WorkCard.cjs';
|
|
6
|
+
export { Icon, IconProps } from './components/Icon.cjs';
|
|
7
|
+
export { Breadcrumbs, BreadcrumbsProps } from './components/Breadcrumbs.cjs';
|
|
8
|
+
export { Tooltip, TooltipProps } from './components/Tooltip.cjs';
|
|
9
|
+
export { Combobox, ComboboxProps } from './components/Combobox.cjs';
|
|
10
|
+
export { Tag, TagProps } from './components/Tag.cjs';
|
|
11
|
+
export { Option, OptionProps } from './components/Option.cjs';
|
|
12
|
+
export { SocialCard, SocialCardProps } from './components/SocialCard.cjs';
|
|
13
|
+
export { Switch, SwitchProps } from './components/Switch.cjs';
|
|
14
|
+
export { ProfileCard, ProfileCardProps } from './components/ProfileCard.cjs';
|
|
15
|
+
export { AboutCard, AboutCardProps } from './components/AboutCard.cjs';
|
|
16
|
+
export { Avatar, AvatarProps } from './components/Avatar.cjs';
|
|
17
|
+
export { NavbarItem, NavbarItemProps } from './components/NavbarItem.cjs';
|
|
18
|
+
export { Logo, LogoProps } from './components/Logo.cjs';
|
|
19
|
+
export { Badge, BadgeProps } from './components/Badge.cjs';
|
|
20
|
+
export { Button, ButtonProps } from './components/Button.cjs';
|
|
21
|
+
export { Text, TextProps } from './components/Text.cjs';
|
|
22
|
+
export { Input, InputProps } from './components/Input.cjs';
|
|
23
|
+
export { ContactItem, ContactItemProps } from './components/ContactItem.cjs';
|
|
24
|
+
import { C as Colors } from './tailwind-DJFscIlV.cjs';
|
|
25
|
+
import 'react';
|
|
26
|
+
import '@deckai/icons';
|
|
27
|
+
import '@radix-ui/react-switch';
|
|
28
|
+
import '@deckai/icons/src/types/icon-names';
|
|
288
29
|
|
|
289
30
|
declare const config: {
|
|
290
31
|
content: string[];
|
|
@@ -334,4 +75,4 @@ declare const config: {
|
|
|
334
75
|
};
|
|
335
76
|
};
|
|
336
77
|
|
|
337
|
-
export {
|
|
78
|
+
export { config as tailwindConfig };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,290 +1,31 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
};
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
text: TextShades;
|
|
30
|
-
overlay: string;
|
|
31
|
-
};
|
|
32
|
-
type HeadingSize = "xl" | "lg" | "md" | "sm" | "xs";
|
|
33
|
-
type BodySize = "lg" | "lg-semibold" | "md" | "default" | "default-medium" | "default-semibold" | "default-bold" | "xs" | "xs-medium" | "xxs" | "xxs-medium" | "xxs-semibold";
|
|
34
|
-
type LabelSize = "default";
|
|
35
|
-
type Typography = {
|
|
36
|
-
heading: Record<HeadingSize, TypographyConfig>;
|
|
37
|
-
body: Record<BodySize, TypographyConfig>;
|
|
38
|
-
label: Record<LabelSize, TypographyConfig>;
|
|
39
|
-
};
|
|
40
|
-
type TypographyConfig = {
|
|
41
|
-
fontSize: string;
|
|
42
|
-
lineHeight?: string;
|
|
43
|
-
letterSpacing?: string;
|
|
44
|
-
fontWeight: string;
|
|
45
|
-
textTransform?: string;
|
|
46
|
-
};
|
|
47
|
-
type IconColors = "primary" | "secondary" | "white" | "primaryBlue";
|
|
48
|
-
|
|
49
|
-
type IconProps = {
|
|
50
|
-
name: IconName;
|
|
51
|
-
/** @default 24 */
|
|
52
|
-
size?: number | `${Breakpoint$1}:${number}`;
|
|
53
|
-
/** @default primary */
|
|
54
|
-
color?: IconColors;
|
|
55
|
-
title?: string;
|
|
56
|
-
className?: string;
|
|
57
|
-
style?: React__default.CSSProperties;
|
|
58
|
-
} & Omit<SVGProps<SVGSVGElement>, "aria-hidden" | "aria-label">;
|
|
59
|
-
type Breakpoint$1 = "sm" | "md" | "lg" | "xl" | "2xl";
|
|
60
|
-
declare const Icon: React__default.ForwardRefExoticComponent<Omit<IconProps, "ref"> & React__default.RefAttributes<SVGSVGElement>>;
|
|
61
|
-
|
|
62
|
-
type PressableProps = ButtonHTMLAttributes<HTMLButtonElement>;
|
|
63
|
-
declare const Pressable: React__default.FC<PressableProps>;
|
|
64
|
-
|
|
65
|
-
type NavbarItemProps = {
|
|
66
|
-
iconName: IconName;
|
|
67
|
-
hasNotification?: boolean;
|
|
68
|
-
} & Pick<IconProps, "color" | "title"> & PressableProps;
|
|
69
|
-
declare const NavbarItem: ({ iconName, hasNotification, color, title, ...props }: NavbarItemProps) => React__default.JSX.Element;
|
|
70
|
-
|
|
71
|
-
type NavbarProps = {
|
|
72
|
-
searchOptions: OptionProps[];
|
|
73
|
-
onSearchChange: (value: string) => void;
|
|
74
|
-
navbarItems: NavbarItemProps[];
|
|
75
|
-
onLogoClick?: () => void;
|
|
76
|
-
onProfileClick?: () => void;
|
|
77
|
-
avatarImage: string;
|
|
78
|
-
};
|
|
79
|
-
declare const Navbar: ({ searchOptions, onSearchChange, navbarItems, onLogoClick, onProfileClick, avatarImage }: NavbarProps) => React__default.JSX.Element;
|
|
80
|
-
|
|
81
|
-
type TextElement = "p" | "span" | "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "strong" | "em" | "blockquote" | "pre" | "code" | "small" | "label" | "a";
|
|
82
|
-
type HTMLPropsMap = {
|
|
83
|
-
p: React__default.HTMLAttributes<HTMLParagraphElement>;
|
|
84
|
-
span: React__default.HTMLAttributes<HTMLSpanElement>;
|
|
85
|
-
h1: React__default.HTMLAttributes<HTMLHeadingElement>;
|
|
86
|
-
h2: React__default.HTMLAttributes<HTMLHeadingElement>;
|
|
87
|
-
h3: React__default.HTMLAttributes<HTMLHeadingElement>;
|
|
88
|
-
h4: React__default.HTMLAttributes<HTMLHeadingElement>;
|
|
89
|
-
h5: React__default.HTMLAttributes<HTMLHeadingElement>;
|
|
90
|
-
h6: React__default.HTMLAttributes<HTMLHeadingElement>;
|
|
91
|
-
strong: React__default.HTMLAttributes<HTMLElement>;
|
|
92
|
-
em: React__default.HTMLAttributes<HTMLElement>;
|
|
93
|
-
blockquote: React__default.HTMLAttributes<HTMLQuoteElement>;
|
|
94
|
-
pre: React__default.HTMLAttributes<HTMLPreElement>;
|
|
95
|
-
code: React__default.HTMLAttributes<HTMLElement>;
|
|
96
|
-
small: React__default.HTMLAttributes<HTMLElement>;
|
|
97
|
-
label: React__default.LabelHTMLAttributes<HTMLLabelElement>;
|
|
98
|
-
a: Omit<React__default.AnchorHTMLAttributes<HTMLAnchorElement>, "color">;
|
|
99
|
-
};
|
|
100
|
-
type ColorCategory = keyof Omit<Colors, "stroke" | "background">;
|
|
101
|
-
type ColorValue<T extends ColorCategory> = T extends "text" ? TextColorVariant : T extends "primary" ? keyof PrimaryShades : T extends "secondary" ? keyof SecondaryShades : T extends "tertiary" ? keyof TertiaryShades : never;
|
|
102
|
-
type ColorKey = {
|
|
103
|
-
[T in ColorCategory]: `${T}-${ColorValue<T>}`;
|
|
104
|
-
}[ColorCategory];
|
|
105
|
-
type TypographyCategory = keyof Typography;
|
|
106
|
-
type TypographyValue<T extends TypographyCategory> = Extract<keyof Typography[T], string | number | bigint | boolean | null | undefined>;
|
|
107
|
-
type TypographyKey = {
|
|
108
|
-
[T in TypographyCategory]: `${T}-${TypographyValue<T>}`;
|
|
109
|
-
}[TypographyCategory];
|
|
110
|
-
type Weight = "light" | "regular" | "semibold" | "bold";
|
|
111
|
-
type Breakpoint = "sm" | "md" | "lg" | "xl" | "2xl";
|
|
112
|
-
type ResponsiveVariant = TypographyKey | `${Breakpoint}:${TypographyKey}`;
|
|
113
|
-
type TextProps<T extends TextElement = "p"> = {
|
|
114
|
-
variant?: ResponsiveVariant | ResponsiveVariant[];
|
|
115
|
-
color?: ColorKey | "inherit";
|
|
116
|
-
as?: T;
|
|
117
|
-
className?: string;
|
|
118
|
-
children: React__default.ReactNode;
|
|
119
|
-
weight?: Weight;
|
|
120
|
-
} & HTMLPropsMap[T];
|
|
121
|
-
declare const Text: React__default.ForwardRefExoticComponent<TextProps<TextElement> & React__default.RefAttributes<HTMLElement | HTMLParagraphElement | HTMLSpanElement | HTMLHeadingElement | HTMLQuoteElement | HTMLPreElement | HTMLLabelElement | HTMLAnchorElement>>;
|
|
122
|
-
|
|
123
|
-
type LinkProps = {
|
|
124
|
-
href: string;
|
|
125
|
-
children: React__default.ReactNode;
|
|
126
|
-
className?: string;
|
|
127
|
-
style?: React__default.CSSProperties;
|
|
128
|
-
} & Pick<TextProps, "variant" | "color"> & React__default.AnchorHTMLAttributes<HTMLAnchorElement>;
|
|
129
|
-
declare const Link: ({ children, color, variant, href, className, ...props }: LinkProps) => React__default.JSX.Element;
|
|
130
|
-
|
|
131
|
-
type TabItem = {
|
|
132
|
-
value: string;
|
|
133
|
-
label: string;
|
|
134
|
-
content: React__default.ReactNode;
|
|
135
|
-
};
|
|
136
|
-
type TabsProps = {
|
|
137
|
-
items: TabItem[];
|
|
138
|
-
defaultValue?: string;
|
|
139
|
-
className?: string;
|
|
140
|
-
onChange?: (value: string) => void;
|
|
141
|
-
};
|
|
142
|
-
declare const Tabs: React__default.ForwardRefExoticComponent<TabsProps & React__default.RefAttributes<HTMLDivElement>>;
|
|
143
|
-
|
|
144
|
-
type WorkCardProps = {
|
|
145
|
-
socialIconName: "instagram-filled" | "tiktok-filled" | "youtube-filled";
|
|
146
|
-
tags: string[];
|
|
147
|
-
caption: string;
|
|
148
|
-
/** play count should already be formatted with k or m */
|
|
149
|
-
playCount: string;
|
|
150
|
-
backgroundImage: string;
|
|
151
|
-
};
|
|
152
|
-
declare const WorkCard: ({ socialIconName, tags, caption, playCount, backgroundImage }: WorkCardProps) => React__default.JSX.Element;
|
|
153
|
-
|
|
154
|
-
type BreadcrumbItem = {
|
|
155
|
-
label: string;
|
|
156
|
-
href?: string;
|
|
157
|
-
};
|
|
158
|
-
type BreadcrumbsProps = {
|
|
159
|
-
items: BreadcrumbItem[];
|
|
160
|
-
className?: string;
|
|
161
|
-
SeparatorComponent?: React__default.ReactElement;
|
|
162
|
-
onHomeClick: () => void;
|
|
163
|
-
};
|
|
164
|
-
declare const Breadcrumbs: React__default.ForwardRefExoticComponent<BreadcrumbsProps & React__default.RefAttributes<HTMLElement>>;
|
|
165
|
-
|
|
166
|
-
interface TooltipProps {
|
|
167
|
-
content: React.ReactNode;
|
|
168
|
-
children: React.ReactNode;
|
|
169
|
-
side?: "top" | "right" | "bottom" | "left";
|
|
170
|
-
align?: "start" | "center" | "end";
|
|
171
|
-
className?: string;
|
|
172
|
-
delayDuration?: number;
|
|
173
|
-
}
|
|
174
|
-
declare const Tooltip: ({ content, children, side, align, className, delayDuration }: TooltipProps) => React.JSX.Element;
|
|
175
|
-
|
|
176
|
-
type ComboboxProps = {
|
|
177
|
-
options: OptionProps[];
|
|
178
|
-
placeholder?: string;
|
|
179
|
-
value?: string;
|
|
180
|
-
onChange: (value: string) => void;
|
|
181
|
-
end?: React__default.ReactNode;
|
|
182
|
-
className?: string;
|
|
183
|
-
};
|
|
184
|
-
declare const Combobox: ({ options, placeholder, value, onChange, end, className }: ComboboxProps) => React__default.JSX.Element;
|
|
185
|
-
|
|
186
|
-
type TagProps = {
|
|
187
|
-
children: React__default.ReactNode;
|
|
188
|
-
padded?: boolean;
|
|
189
|
-
color?: "primary" | "text";
|
|
190
|
-
} & HTMLAttributes<HTMLDivElement>;
|
|
191
|
-
declare const Tag: ({ children, padded, color, ...props }: TagProps) => React__default.JSX.Element;
|
|
192
|
-
|
|
193
|
-
type SocialCardProps = {
|
|
194
|
-
icon: IconName;
|
|
195
|
-
followers: string;
|
|
196
|
-
engagement: string;
|
|
197
|
-
} & PressableProps;
|
|
198
|
-
declare const SocialCard: ({ icon, followers, engagement, ...pressableProps }: SocialCardProps) => React__default.JSX.Element;
|
|
199
|
-
|
|
200
|
-
type SwitchProps = React.ComponentPropsWithoutRef<typeof SwitchPrimitive.Root> & {
|
|
201
|
-
label?: string;
|
|
202
|
-
description?: string;
|
|
203
|
-
};
|
|
204
|
-
declare const Switch: React.ForwardRefExoticComponent<Omit<SwitchPrimitive.SwitchProps & React.RefAttributes<HTMLButtonElement>, "ref"> & {
|
|
205
|
-
label?: string;
|
|
206
|
-
description?: string;
|
|
207
|
-
} & React.RefAttributes<HTMLButtonElement>>;
|
|
208
|
-
|
|
209
|
-
type BadgeProps = {
|
|
210
|
-
variant?: "pink" | "orange" | "green";
|
|
211
|
-
iconName?: IconName;
|
|
212
|
-
} & React.HTMLAttributes<HTMLSpanElement>;
|
|
213
|
-
declare const Badge: React.ForwardRefExoticComponent<{
|
|
214
|
-
variant?: "pink" | "orange" | "green";
|
|
215
|
-
iconName?: IconName;
|
|
216
|
-
} & React.HTMLAttributes<HTMLSpanElement> & React.RefAttributes<HTMLSpanElement>>;
|
|
217
|
-
|
|
218
|
-
type ProfileCardProps = {
|
|
219
|
-
profileImage: string;
|
|
220
|
-
name: string;
|
|
221
|
-
location: string;
|
|
222
|
-
memberSince?: string;
|
|
223
|
-
interests?: string[];
|
|
224
|
-
badges?: BadgeProps[];
|
|
225
|
-
};
|
|
226
|
-
declare const ProfileCard: ({ profileImage, name, location, memberSince, interests, badges }: ProfileCardProps) => React__default.JSX.Element;
|
|
227
|
-
|
|
228
|
-
type ContactItemProps = {
|
|
229
|
-
iconName: IconName$1;
|
|
230
|
-
children: React__default.ReactNode;
|
|
231
|
-
href: string;
|
|
232
|
-
} & Omit<HTMLAttributes<HTMLAnchorElement>, "color">;
|
|
233
|
-
declare const ContactItem: ({ iconName, children, href, ...linkProps }: ContactItemProps) => React__default.JSX.Element;
|
|
234
|
-
|
|
235
|
-
type AboutCardProps = {
|
|
236
|
-
interests: string[];
|
|
237
|
-
contactItems: ContactItemProps[];
|
|
238
|
-
description: string;
|
|
239
|
-
};
|
|
240
|
-
declare const AboutCard: ({ interests, contactItems, description, ...props }: AboutCardProps) => React__default.JSX.Element;
|
|
241
|
-
|
|
242
|
-
type AvatarProps = {
|
|
243
|
-
src: string;
|
|
244
|
-
size?: number | string;
|
|
245
|
-
} & Pick<React__default.ComponentProps<typeof Pressable>, "onClick">;
|
|
246
|
-
declare const Avatar: ({ src, size, onClick, ...props }: AvatarProps) => React__default.JSX.Element;
|
|
247
|
-
|
|
248
|
-
type LogoProps = {
|
|
249
|
-
/** @default 76 */
|
|
250
|
-
width?: number;
|
|
251
|
-
/** @default 25 */
|
|
252
|
-
height?: number;
|
|
253
|
-
};
|
|
254
|
-
declare const Logo: ({ width, height }: LogoProps) => React__default.JSX.Element;
|
|
255
|
-
|
|
256
|
-
type ButtonProps = {
|
|
257
|
-
/** @default filled */
|
|
258
|
-
variant?: "filled" | "outlined";
|
|
259
|
-
/** @default primary */
|
|
260
|
-
color?: "black" | "accent" | "secondary";
|
|
261
|
-
isLoading?: boolean;
|
|
262
|
-
children: React.ReactNode;
|
|
263
|
-
className?: string;
|
|
264
|
-
disabled?: boolean;
|
|
265
|
-
start?: React.ReactNode;
|
|
266
|
-
end?: React.ReactNode;
|
|
267
|
-
} & React.ButtonHTMLAttributes<HTMLButtonElement>;
|
|
268
|
-
declare const Button: React.ForwardRefExoticComponent<{
|
|
269
|
-
/** @default filled */
|
|
270
|
-
variant?: "filled" | "outlined";
|
|
271
|
-
/** @default primary */
|
|
272
|
-
color?: "black" | "accent" | "secondary";
|
|
273
|
-
isLoading?: boolean;
|
|
274
|
-
children: React.ReactNode;
|
|
275
|
-
className?: string;
|
|
276
|
-
disabled?: boolean;
|
|
277
|
-
start?: React.ReactNode;
|
|
278
|
-
end?: React.ReactNode;
|
|
279
|
-
} & React.ButtonHTMLAttributes<HTMLButtonElement> & React.RefAttributes<HTMLButtonElement>>;
|
|
280
|
-
|
|
281
|
-
type InputProps = {
|
|
282
|
-
className?: string;
|
|
283
|
-
end?: React.ReactNode;
|
|
284
|
-
/** renders an icon in the end slot */
|
|
285
|
-
iconName?: IconName;
|
|
286
|
-
} & React.InputHTMLAttributes<HTMLInputElement> & Pick<IconProps, "color" | "size" | "title">;
|
|
287
|
-
declare const Input: ({ className, end, iconName, color, size, title, ...props }: InputProps) => React.JSX.Element;
|
|
1
|
+
export { Navbar, NavbarProps } from './components/Navbar.js';
|
|
2
|
+
export { Pressable, PressableProps } from './components/Pressable.js';
|
|
3
|
+
export { Link, LinkProps } from './components/Link.js';
|
|
4
|
+
export { Tabs, TabsProps } from './components/Tabs.js';
|
|
5
|
+
export { WorkCard, WorkCardProps } from './components/WorkCard.js';
|
|
6
|
+
export { Icon, IconProps } from './components/Icon.js';
|
|
7
|
+
export { Breadcrumbs, BreadcrumbsProps } from './components/Breadcrumbs.js';
|
|
8
|
+
export { Tooltip, TooltipProps } from './components/Tooltip.js';
|
|
9
|
+
export { Combobox, ComboboxProps } from './components/Combobox.js';
|
|
10
|
+
export { Tag, TagProps } from './components/Tag.js';
|
|
11
|
+
export { Option, OptionProps } from './components/Option.js';
|
|
12
|
+
export { SocialCard, SocialCardProps } from './components/SocialCard.js';
|
|
13
|
+
export { Switch, SwitchProps } from './components/Switch.js';
|
|
14
|
+
export { ProfileCard, ProfileCardProps } from './components/ProfileCard.js';
|
|
15
|
+
export { AboutCard, AboutCardProps } from './components/AboutCard.js';
|
|
16
|
+
export { Avatar, AvatarProps } from './components/Avatar.js';
|
|
17
|
+
export { NavbarItem, NavbarItemProps } from './components/NavbarItem.js';
|
|
18
|
+
export { Logo, LogoProps } from './components/Logo.js';
|
|
19
|
+
export { Badge, BadgeProps } from './components/Badge.js';
|
|
20
|
+
export { Button, ButtonProps } from './components/Button.js';
|
|
21
|
+
export { Text, TextProps } from './components/Text.js';
|
|
22
|
+
export { Input, InputProps } from './components/Input.js';
|
|
23
|
+
export { ContactItem, ContactItemProps } from './components/ContactItem.js';
|
|
24
|
+
import { C as Colors } from './tailwind-DJFscIlV.js';
|
|
25
|
+
import 'react';
|
|
26
|
+
import '@deckai/icons';
|
|
27
|
+
import '@radix-ui/react-switch';
|
|
28
|
+
import '@deckai/icons/src/types/icon-names';
|
|
288
29
|
|
|
289
30
|
declare const config: {
|
|
290
31
|
content: string[];
|
|
@@ -334,4 +75,4 @@ declare const config: {
|
|
|
334
75
|
};
|
|
335
76
|
};
|
|
336
77
|
|
|
337
|
-
export {
|
|
78
|
+
export { config as tailwindConfig };
|