@alpic-ai/ui 0.0.0-staging.e7665b9 → 0.0.0-staging.f0bd982
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/badge.d.mts +1 -1
- package/dist/components/button.d.mts +1 -1
- package/dist/components/sidebar.d.mts +1 -1
- package/dist/components/spinner.d.mts +1 -1
- package/dist/components/tabs.d.mts +1 -1
- package/dist/components/toggle-group.d.mts +1 -1
- package/package.json +7 -7
- package/src/components/combobox.tsx +18 -6
- package/src/hooks/use-copy-to-clipboard.ts +6 -2
- package/src/stories/table.stories.tsx +2 -2
|
@@ -4,7 +4,7 @@ import * as _$class_variance_authority_types0 from "class-variance-authority/typ
|
|
|
4
4
|
|
|
5
5
|
//#region src/components/badge.d.ts
|
|
6
6
|
declare const badgeVariants: (props?: ({
|
|
7
|
-
variant?: "warning" | "success" | "
|
|
7
|
+
variant?: "warning" | "success" | "secondary" | "primary" | "error" | null | undefined;
|
|
8
8
|
size?: "sm" | "md" | null | undefined;
|
|
9
9
|
} & _$class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
10
10
|
interface BadgeProps extends React.ComponentProps<"span">, VariantProps<typeof badgeVariants> {}
|
|
@@ -5,7 +5,7 @@ import * as _$class_variance_authority_types0 from "class-variance-authority/typ
|
|
|
5
5
|
|
|
6
6
|
//#region src/components/button.d.ts
|
|
7
7
|
declare const buttonVariants: (props?: ({
|
|
8
|
-
variant?: "destructive" | "
|
|
8
|
+
variant?: "destructive" | "secondary" | "primary" | "tertiary" | "link" | "link-muted" | "cta" | null | undefined;
|
|
9
9
|
size?: "default" | "icon" | "icon-rounded" | "pill" | null | undefined;
|
|
10
10
|
} & _$class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
11
11
|
interface ButtonProps extends React.ComponentProps<"button">, VariantProps<typeof buttonVariants> {
|
|
@@ -108,7 +108,7 @@ declare function SidebarMenuItem({
|
|
|
108
108
|
}: React.ComponentProps<"li">): _$react_jsx_runtime0.JSX.Element;
|
|
109
109
|
declare const sidebarMenuButtonVariants: (props?: ({
|
|
110
110
|
variant?: "default" | "outline" | null | undefined;
|
|
111
|
-
size?: "
|
|
111
|
+
size?: "default" | "sm" | "lg" | null | undefined;
|
|
112
112
|
} & _$class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
113
113
|
declare function SidebarMenuButton({
|
|
114
114
|
asChild,
|
|
@@ -4,7 +4,7 @@ import * as _$class_variance_authority_types0 from "class-variance-authority/typ
|
|
|
4
4
|
|
|
5
5
|
//#region src/components/spinner.d.ts
|
|
6
6
|
declare const spinnerVariants: (props?: ({
|
|
7
|
-
variant?: "
|
|
7
|
+
variant?: "secondary" | "primary" | null | undefined;
|
|
8
8
|
size?: "sm" | "md" | "lg" | "xl" | null | undefined;
|
|
9
9
|
} & _$class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
10
10
|
interface SpinnerProps extends Omit<React.ComponentProps<"svg">, "children">, VariantProps<typeof spinnerVariants> {}
|
|
@@ -6,7 +6,7 @@ import * as _$class_variance_authority_types0 from "class-variance-authority/typ
|
|
|
6
6
|
|
|
7
7
|
//#region src/components/tabs.d.ts
|
|
8
8
|
declare const tabsTriggerVariants: (props?: ({
|
|
9
|
-
variant?: "default" | "
|
|
9
|
+
variant?: "default" | "pill" | "line" | null | undefined;
|
|
10
10
|
} & _$class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
11
11
|
declare function Tabs({
|
|
12
12
|
className,
|
|
@@ -7,7 +7,7 @@ import * as _$class_variance_authority_types0 from "class-variance-authority/typ
|
|
|
7
7
|
//#region src/components/toggle-group.d.ts
|
|
8
8
|
declare const toggleGroupItemVariants: (props?: ({
|
|
9
9
|
variant?: "default" | "outline" | null | undefined;
|
|
10
|
-
size?: "
|
|
10
|
+
size?: "default" | "sm" | null | undefined;
|
|
11
11
|
} & _$class_variance_authority_types0.ClassProp) | undefined) => string;
|
|
12
12
|
type ToggleGroupContextValue = VariantProps<typeof toggleGroupItemVariants>;
|
|
13
13
|
declare function ToggleGroup({
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@alpic-ai/ui",
|
|
3
|
-
"version": "0.0.0-staging.
|
|
3
|
+
"version": "0.0.0-staging.f0bd982",
|
|
4
4
|
"description": "Alpic design system — shared UI components",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"exports": {
|
|
@@ -23,12 +23,12 @@
|
|
|
23
23
|
"src"
|
|
24
24
|
],
|
|
25
25
|
"peerDependencies": {
|
|
26
|
-
"lucide-react": "^1.
|
|
26
|
+
"lucide-react": "^1.9.0",
|
|
27
27
|
"react": "^19.2.5",
|
|
28
28
|
"react-dom": "^19.2.5",
|
|
29
29
|
"react-hook-form": "^7.73.1",
|
|
30
30
|
"sonner": "^2.0.7",
|
|
31
|
-
"tailwindcss": "^4.2.
|
|
31
|
+
"tailwindcss": "^4.2.4",
|
|
32
32
|
"tw-animate-css": "^1.4.0"
|
|
33
33
|
},
|
|
34
34
|
"dependencies": {
|
|
@@ -56,15 +56,15 @@
|
|
|
56
56
|
},
|
|
57
57
|
"devDependencies": {
|
|
58
58
|
"@ladle/react": "^5.1.1",
|
|
59
|
-
"@tailwindcss/postcss": "^4.2.
|
|
59
|
+
"@tailwindcss/postcss": "^4.2.4",
|
|
60
60
|
"@types/react": "19.2.14",
|
|
61
61
|
"@types/react-dom": "19.2.3",
|
|
62
|
-
"lucide-react": "^1.
|
|
62
|
+
"lucide-react": "^1.9.0",
|
|
63
63
|
"react-hook-form": "^7.73.1",
|
|
64
64
|
"shx": "^0.4.0",
|
|
65
65
|
"sonner": "^2.0.7",
|
|
66
|
-
"tailwindcss": "^4.2.
|
|
67
|
-
"tsdown": "^0.21.
|
|
66
|
+
"tailwindcss": "^4.2.4",
|
|
67
|
+
"tsdown": "^0.21.10",
|
|
68
68
|
"tw-animate-css": "^1.4.0",
|
|
69
69
|
"typescript": "^6.0.3"
|
|
70
70
|
},
|
|
@@ -84,7 +84,9 @@ function Combobox(props: ComboboxProps) {
|
|
|
84
84
|
|
|
85
85
|
const onOpenChange = useCallback(
|
|
86
86
|
(newOpen: boolean) => {
|
|
87
|
-
if (!isOpenControlled)
|
|
87
|
+
if (!isOpenControlled) {
|
|
88
|
+
setUncontrolledOpen(newOpen);
|
|
89
|
+
}
|
|
88
90
|
controlledOnOpenChange?.(newOpen);
|
|
89
91
|
},
|
|
90
92
|
[isOpenControlled, controlledOnOpenChange],
|
|
@@ -105,7 +107,9 @@ function Combobox(props: ComboboxProps) {
|
|
|
105
107
|
|
|
106
108
|
const isSelected = useCallback(
|
|
107
109
|
(itemValue: string) => {
|
|
108
|
-
if (multiple)
|
|
110
|
+
if (multiple) {
|
|
111
|
+
return multiValues.includes(itemValue);
|
|
112
|
+
}
|
|
109
113
|
return singleValue === itemValue;
|
|
110
114
|
},
|
|
111
115
|
[multiple, singleValue, multiValues],
|
|
@@ -123,11 +127,15 @@ function Combobox(props: ComboboxProps) {
|
|
|
123
127
|
const next = multiValues.includes(itemValue)
|
|
124
128
|
? multiValues.filter((val) => val !== itemValue)
|
|
125
129
|
: [...multiValues, itemValue];
|
|
126
|
-
if (!isControlledMulti)
|
|
130
|
+
if (!isControlledMulti) {
|
|
131
|
+
setUncontrolledMultiValue(next);
|
|
132
|
+
}
|
|
127
133
|
onValueChangeMulti?.(next);
|
|
128
134
|
// Stay open in multi mode
|
|
129
135
|
} else {
|
|
130
|
-
if (!isControlledSingle)
|
|
136
|
+
if (!isControlledSingle) {
|
|
137
|
+
setUncontrolledSingleValue(itemValue);
|
|
138
|
+
}
|
|
131
139
|
onValueChangeSingle?.(itemValue);
|
|
132
140
|
onOpenChange(false);
|
|
133
141
|
}
|
|
@@ -145,9 +153,13 @@ function Combobox(props: ComboboxProps) {
|
|
|
145
153
|
|
|
146
154
|
const onDeselect = useCallback(
|
|
147
155
|
(itemValue: string) => {
|
|
148
|
-
if (!multiple)
|
|
156
|
+
if (!multiple) {
|
|
157
|
+
return;
|
|
158
|
+
}
|
|
149
159
|
const next = multiValues.filter((val) => val !== itemValue);
|
|
150
|
-
if (!isControlledMulti)
|
|
160
|
+
if (!isControlledMulti) {
|
|
161
|
+
setUncontrolledMultiValue(next);
|
|
162
|
+
}
|
|
151
163
|
onValueChangeMulti?.(next);
|
|
152
164
|
},
|
|
153
165
|
[multiple, isControlledMulti, onValueChangeMulti, multiValues],
|
|
@@ -8,7 +8,9 @@ export function useCopyToClipboard({ resetDelay = 2000 }: { resetDelay?: number
|
|
|
8
8
|
|
|
9
9
|
useEffect(() => {
|
|
10
10
|
return () => {
|
|
11
|
-
if (timeoutRef.current)
|
|
11
|
+
if (timeoutRef.current) {
|
|
12
|
+
clearTimeout(timeoutRef.current);
|
|
13
|
+
}
|
|
12
14
|
};
|
|
13
15
|
}, []);
|
|
14
16
|
|
|
@@ -16,7 +18,9 @@ export function useCopyToClipboard({ resetDelay = 2000 }: { resetDelay?: number
|
|
|
16
18
|
(text: string) => {
|
|
17
19
|
navigator.clipboard.writeText(text).then(() => {
|
|
18
20
|
setIsCopied(true);
|
|
19
|
-
if (timeoutRef.current)
|
|
21
|
+
if (timeoutRef.current) {
|
|
22
|
+
clearTimeout(timeoutRef.current);
|
|
23
|
+
}
|
|
20
24
|
timeoutRef.current = setTimeout(() => setIsCopied(false), resetDelay);
|
|
21
25
|
});
|
|
22
26
|
},
|
|
@@ -190,8 +190,8 @@ export const AllVariants: Story = () => (
|
|
|
190
190
|
</TableRow>
|
|
191
191
|
</TableHeader>
|
|
192
192
|
<TableBody>
|
|
193
|
-
{USERS.slice(0, 3).map((user,
|
|
194
|
-
<TableRow key={user.id} data-state={
|
|
193
|
+
{USERS.slice(0, 3).map((user, index) => (
|
|
194
|
+
<TableRow key={user.id} data-state={index === 1 ? "selected" : undefined}>
|
|
195
195
|
<TableCell className="font-medium text-foreground">{user.name}</TableCell>
|
|
196
196
|
<TableCell className="text-subtle-foreground">{user.role}</TableCell>
|
|
197
197
|
<TableCell className="text-subtle-foreground">{user.email}</TableCell>
|