@a2v2ai/uikit 0.0.6 → 0.0.7
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/Button/Button.d.ts +4 -1
- package/Button/Button.js +16 -2
- package/index.css +29 -0
- package/package.json +1 -1
package/Button/Button.d.ts
CHANGED
|
@@ -2,19 +2,22 @@ import * as React from "react";
|
|
|
2
2
|
type ButtonVariant = "primary" | "secondary" | "outline" | "ghost" | "ghost-muted" | "destructive";
|
|
3
3
|
type ButtonSize = "mini" | "small" | "regular" | "large";
|
|
4
4
|
type ButtonRoundness = "default" | "round";
|
|
5
|
+
type ButtonTextVariant = "h1" | "h2" | "h3" | "h4" | "h5" | "h6" | "subtitle1" | "subtitle2" | "body1" | "body2" | "body3" | "caption";
|
|
5
6
|
declare const buttonVariants: (props?: ({
|
|
6
7
|
variant?: "destructive" | "secondary" | "outline" | "primary" | "ghost" | "ghost-muted" | null | undefined;
|
|
7
8
|
size?: "small" | "regular" | "large" | "mini" | null | undefined;
|
|
8
9
|
roundness?: "default" | "round" | null | undefined;
|
|
10
|
+
textVariant?: "h5" | "h2" | "h3" | "caption" | "h1" | "h4" | "h6" | "subtitle1" | "subtitle2" | "body1" | "body2" | "body3" | null | undefined;
|
|
9
11
|
} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
|
|
10
12
|
export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
|
|
11
13
|
variant?: ButtonVariant;
|
|
12
14
|
size?: ButtonSize;
|
|
13
15
|
roundness?: ButtonRoundness;
|
|
16
|
+
textVariant?: ButtonTextVariant;
|
|
14
17
|
asChild?: boolean;
|
|
15
18
|
leftIcon?: React.ReactNode;
|
|
16
19
|
rightIcon?: React.ReactNode;
|
|
17
20
|
}
|
|
18
21
|
declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
|
|
19
22
|
export { Button, buttonVariants };
|
|
20
|
-
export type { ButtonVariant, ButtonSize, ButtonRoundness };
|
|
23
|
+
export type { ButtonVariant, ButtonSize, ButtonRoundness, ButtonTextVariant };
|
package/Button/Button.js
CHANGED
|
@@ -59,6 +59,20 @@ const buttonVariants = (0, class_variance_authority_1.cva)("inline-flex items-ce
|
|
|
59
59
|
default: "",
|
|
60
60
|
round: "!rounded-full",
|
|
61
61
|
},
|
|
62
|
+
textVariant: {
|
|
63
|
+
h1: "text-[64px] font-extrabold",
|
|
64
|
+
h2: "text-[48px] font-bold",
|
|
65
|
+
h3: "text-[32px] font-bold",
|
|
66
|
+
h4: "text-[24px] font-bold",
|
|
67
|
+
h5: "text-[20px] font-bold",
|
|
68
|
+
h6: "text-[20px] font-semibold",
|
|
69
|
+
subtitle1: "text-[20px] font-semibold",
|
|
70
|
+
subtitle2: "text-[18px] font-semibold",
|
|
71
|
+
body1: "text-[16px] font-normal",
|
|
72
|
+
body2: "text-[14px] font-normal",
|
|
73
|
+
body3: "text-[12px] font-normal",
|
|
74
|
+
caption: "text-[12px] font-light",
|
|
75
|
+
},
|
|
62
76
|
},
|
|
63
77
|
defaultVariants: {
|
|
64
78
|
variant: "primary",
|
|
@@ -67,9 +81,9 @@ const buttonVariants = (0, class_variance_authority_1.cva)("inline-flex items-ce
|
|
|
67
81
|
},
|
|
68
82
|
});
|
|
69
83
|
exports.buttonVariants = buttonVariants;
|
|
70
|
-
const Button = React.forwardRef(({ className, variant, size, roundness, asChild = false, leftIcon, rightIcon, children, ...props }, ref) => {
|
|
84
|
+
const Button = React.forwardRef(({ className, variant, size, roundness, textVariant, asChild = false, leftIcon, rightIcon, children, ...props }, ref) => {
|
|
71
85
|
const Comp = asChild ? react_slot_1.Slot : "button";
|
|
72
|
-
return ((0, jsx_runtime_1.jsxs)(Comp, { className: (0, utils_1.cn)(buttonVariants({ variant, size, roundness, className })), ref: ref, ...props, children: [leftIcon && (0, jsx_runtime_1.jsx)("span", { className: "shrink-0", children: leftIcon }), children, rightIcon && (0, jsx_runtime_1.jsx)("span", { className: "shrink-0", children: rightIcon })] }));
|
|
86
|
+
return ((0, jsx_runtime_1.jsxs)(Comp, { className: (0, utils_1.cn)(buttonVariants({ variant, size, roundness, textVariant, className })), ref: ref, ...props, children: [leftIcon && (0, jsx_runtime_1.jsx)("span", { className: "shrink-0", children: leftIcon }), children, rightIcon && (0, jsx_runtime_1.jsx)("span", { className: "shrink-0", children: rightIcon })] }));
|
|
73
87
|
});
|
|
74
88
|
exports.Button = Button;
|
|
75
89
|
Button.displayName = "Button";
|
package/index.css
CHANGED
|
@@ -126,6 +126,35 @@
|
|
|
126
126
|
--radius-xl: 0.75rem;
|
|
127
127
|
--radius-2xl: 1rem;
|
|
128
128
|
--radius-full: 9999px;
|
|
129
|
+
|
|
130
|
+
/* Typography styles (matching Typography component) */
|
|
131
|
+
/* Font sizes */
|
|
132
|
+
--font-size-h1: 64px;
|
|
133
|
+
--font-size-h2: 48px;
|
|
134
|
+
--font-size-h3: 32px;
|
|
135
|
+
--font-size-h4: 24px;
|
|
136
|
+
--font-size-h5: 20px;
|
|
137
|
+
--font-size-h6: 20px;
|
|
138
|
+
--font-size-subtitle1: 20px;
|
|
139
|
+
--font-size-subtitle2: 18px;
|
|
140
|
+
--font-size-body1: 16px;
|
|
141
|
+
--font-size-body2: 14px;
|
|
142
|
+
--font-size-body3: 12px;
|
|
143
|
+
--font-size-caption: 12px;
|
|
144
|
+
|
|
145
|
+
/* Font weights */
|
|
146
|
+
--font-weight-h1: 800;
|
|
147
|
+
--font-weight-h2: 700;
|
|
148
|
+
--font-weight-h3: 700;
|
|
149
|
+
--font-weight-h4: 700;
|
|
150
|
+
--font-weight-h5: 700;
|
|
151
|
+
--font-weight-h6: 600;
|
|
152
|
+
--font-weight-subtitle1: 600;
|
|
153
|
+
--font-weight-subtitle2: 600;
|
|
154
|
+
--font-weight-body1: 400;
|
|
155
|
+
--font-weight-body2: 400;
|
|
156
|
+
--font-weight-body3: 400;
|
|
157
|
+
--font-weight-caption: 300;
|
|
129
158
|
}
|
|
130
159
|
|
|
131
160
|
/* Base layer */
|