@alpic-ai/ui 0.0.0-dev.ad4a0f4 → 0.0.0-dev.ae32a88
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/accordion-card.d.mts +1 -1
- package/dist/components/accordion.d.mts +1 -1
- package/dist/components/alert.d.mts +1 -1
- package/dist/components/attachment-tile.mjs +1 -1
- package/dist/components/avatar.d.mts +1 -1
- package/dist/components/breadcrumb.d.mts +1 -1
- package/dist/components/button.d.mts +4 -2
- package/dist/components/button.mjs +20 -6
- package/dist/components/card.d.mts +1 -1
- package/dist/components/checkbox.d.mts +1 -1
- package/dist/components/collapsible.d.mts +1 -1
- package/dist/components/combobox.d.mts +1 -1
- package/dist/components/combobox.mjs +1 -1
- package/dist/components/command.d.mts +1 -1
- package/dist/components/copyable.d.mts +1 -1
- package/dist/components/copyable.mjs +1 -1
- package/dist/components/description-list.d.mts +1 -1
- package/dist/components/dialog.d.mts +1 -1
- package/dist/components/dropdown-menu.d.mts +1 -1
- package/dist/components/form.d.mts +37 -2
- package/dist/components/form.mjs +115 -5
- package/dist/components/github-button.d.mts +13 -0
- package/dist/components/github-button.mjs +24 -0
- package/dist/components/input-group.d.mts +1 -1
- package/dist/components/input.d.mts +1 -1
- package/dist/components/input.mjs +1 -1
- package/dist/components/label.d.mts +1 -1
- package/dist/components/page-loader.d.mts +11 -0
- package/dist/components/page-loader.mjs +122 -0
- package/dist/components/pagination.d.mts +1 -1
- package/dist/components/popover.d.mts +1 -1
- package/dist/components/radio-group.d.mts +1 -1
- package/dist/components/scroll-area.d.mts +1 -1
- package/dist/components/select.d.mts +1 -1
- package/dist/components/separator.d.mts +1 -1
- package/dist/components/sheet.d.mts +1 -1
- package/dist/components/shimmer-text.d.mts +12 -0
- package/dist/components/shimmer-text.mjs +22 -0
- package/dist/components/sidebar.d.mts +1 -1
- package/dist/components/sidebar.mjs +63 -19
- package/dist/components/sonner.d.mts +1 -1
- package/dist/components/switch.d.mts +1 -1
- package/dist/components/table.d.mts +11 -2
- package/dist/components/table.mjs +4 -4
- package/dist/components/tabs.d.mts +1 -1
- package/dist/components/tabs.mjs +5 -5
- package/dist/components/task-progress.d.mts +27 -0
- package/dist/components/task-progress.mjs +66 -0
- package/dist/components/textarea.d.mts +1 -1
- package/dist/components/textarea.mjs +1 -1
- package/dist/components/toggle-group.d.mts +1 -1
- package/dist/components/toggle-group.mjs +1 -1
- package/dist/components/tooltip-icon-button.mjs +1 -1
- package/dist/components/tooltip.d.mts +1 -1
- package/dist/components/tooltip.mjs +1 -1
- package/dist/components/typography.d.mts +1 -1
- package/dist/components/wizard.d.mts +34 -0
- package/dist/components/wizard.mjs +46 -0
- package/package.json +13 -13
- package/src/components/button.tsx +13 -9
- package/src/components/combobox.tsx +18 -6
- package/src/components/form.tsx +164 -3
- package/src/components/github-button.tsx +34 -0
- package/src/components/page-loader.tsx +59 -0
- package/src/components/shimmer-text.tsx +23 -0
- package/src/components/sidebar.tsx +59 -20
- package/src/components/table.tsx +17 -4
- package/src/components/tabs.tsx +4 -4
- package/src/components/task-progress.tsx +107 -0
- package/src/components/tooltip.tsx +1 -1
- package/src/components/wizard.tsx +69 -0
- package/src/hooks/use-copy-to-clipboard.ts +6 -2
- package/src/stories/button.stories.tsx +23 -1
- package/src/stories/form.stories.tsx +64 -2
- package/src/stories/sidebar.stories.tsx +6 -3
- package/src/stories/table.stories.tsx +2 -2
- package/src/stories/tabs.stories.tsx +4 -2
- package/src/stories/task-progress.stories.tsx +81 -0
- package/src/stories/wizard.stories.tsx +64 -0
- package/src/styles/tokens.css +217 -0
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
1
|
import * as AccordionPrimitive from "@radix-ui/react-accordion";
|
|
3
2
|
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
|
+
import * as React from "react";
|
|
4
4
|
|
|
5
5
|
//#region src/components/accordion-card.d.ts
|
|
6
6
|
declare function AccordionCard({
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
1
|
import * as AccordionPrimitive from "@radix-ui/react-accordion";
|
|
3
2
|
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
|
+
import * as React from "react";
|
|
4
4
|
|
|
5
5
|
//#region src/components/accordion.d.ts
|
|
6
6
|
declare function Accordion({
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
1
|
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
2
|
import { VariantProps } from "class-variance-authority";
|
|
3
|
+
import * as React from "react";
|
|
4
4
|
import * as _$class_variance_authority_types0 from "class-variance-authority/types";
|
|
5
5
|
|
|
6
6
|
//#region src/components/alert.d.ts
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { cn } from "../lib/cn.mjs";
|
|
3
3
|
import { TooltipIconButton } from "./tooltip-icon-button.mjs";
|
|
4
|
-
import { useState } from "react";
|
|
5
4
|
import { FileText, XIcon } from "lucide-react";
|
|
6
5
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
6
|
+
import { useState } from "react";
|
|
7
7
|
//#region src/components/attachment-tile.tsx
|
|
8
8
|
function AttachmentTile({ src, isImage, label, onRemove, onClick, className }) {
|
|
9
9
|
const [hasError, setHasError] = useState(false);
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
1
|
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
2
|
import { VariantProps } from "class-variance-authority";
|
|
3
|
+
import * as React from "react";
|
|
4
4
|
import * as AvatarPrimitive from "@radix-ui/react-avatar";
|
|
5
5
|
import * as _$class_variance_authority_types0 from "class-variance-authority/types";
|
|
6
6
|
|
|
@@ -1,17 +1,18 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
1
|
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
2
|
import { VariantProps } from "class-variance-authority";
|
|
3
|
+
import * as React from "react";
|
|
4
4
|
import * as _$class_variance_authority_types0 from "class-variance-authority/types";
|
|
5
5
|
|
|
6
6
|
//#region src/components/button.d.ts
|
|
7
7
|
declare const buttonVariants: (props?: ({
|
|
8
|
-
variant?: "destructive" | "secondary" | "primary" | "tertiary" | "link" | "link-muted" | null | undefined;
|
|
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> {
|
|
12
12
|
asChild?: boolean;
|
|
13
13
|
loading?: boolean;
|
|
14
14
|
icon?: React.ReactNode;
|
|
15
|
+
iconTrailing?: React.ReactNode;
|
|
15
16
|
}
|
|
16
17
|
declare function Button({
|
|
17
18
|
className,
|
|
@@ -21,6 +22,7 @@ declare function Button({
|
|
|
21
22
|
asChild,
|
|
22
23
|
loading,
|
|
23
24
|
icon,
|
|
25
|
+
iconTrailing,
|
|
24
26
|
disabled,
|
|
25
27
|
children,
|
|
26
28
|
...props
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { cn } from "../lib/cn.mjs";
|
|
3
3
|
import { Loader2 } from "lucide-react";
|
|
4
|
-
import {
|
|
4
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
5
5
|
import { cva } from "class-variance-authority";
|
|
6
|
-
import { Slot } from "@radix-ui/react-slot";
|
|
6
|
+
import { Slot, Slottable } from "@radix-ui/react-slot";
|
|
7
7
|
//#region src/components/button.tsx
|
|
8
8
|
const buttonVariants = cva([
|
|
9
9
|
"inline-flex items-center justify-center gap-1 whitespace-nowrap",
|
|
@@ -35,7 +35,14 @@ const buttonVariants = cva([
|
|
|
35
35
|
"[@media(hover:hover)]:hover:underline",
|
|
36
36
|
"focus-visible:bg-background"
|
|
37
37
|
].join(" "),
|
|
38
|
-
destructive: ["bg-destructive text-destructive-foreground", "[@media(hover:hover)]:hover:bg-destructive-hover"].join(" ")
|
|
38
|
+
destructive: ["bg-destructive text-destructive-foreground", "[@media(hover:hover)]:hover:bg-destructive-hover"].join(" "),
|
|
39
|
+
cta: [
|
|
40
|
+
"button-cta",
|
|
41
|
+
"h-9 px-4 gap-2 rounded-md",
|
|
42
|
+
"dark:bg-inverted text-foreground",
|
|
43
|
+
"transition-[transform,filter] duration-300 ease-out",
|
|
44
|
+
"active:scale-[0.99]"
|
|
45
|
+
].join(" ")
|
|
39
46
|
},
|
|
40
47
|
size: {
|
|
41
48
|
default: "type-text-sm",
|
|
@@ -49,8 +56,8 @@ const buttonVariants = cva([
|
|
|
49
56
|
size: "default"
|
|
50
57
|
}
|
|
51
58
|
});
|
|
52
|
-
function Button({ className, variant, size, type = "button", asChild = false, loading = false, icon, disabled, children, ...props }) {
|
|
53
|
-
return /* @__PURE__ */
|
|
59
|
+
function Button({ className, variant, size, type = "button", asChild = false, loading = false, icon, iconTrailing, disabled, children, ...props }) {
|
|
60
|
+
return /* @__PURE__ */ jsxs(asChild ? Slot : "button", {
|
|
54
61
|
"data-slot": "button",
|
|
55
62
|
className: cn(buttonVariants({
|
|
56
63
|
variant,
|
|
@@ -60,7 +67,14 @@ function Button({ className, variant, size, type = "button", asChild = false, lo
|
|
|
60
67
|
disabled: disabled || loading,
|
|
61
68
|
"aria-busy": loading || void 0,
|
|
62
69
|
...props,
|
|
63
|
-
children:
|
|
70
|
+
children: [
|
|
71
|
+
loading ? /* @__PURE__ */ jsx(Loader2, { className: "motion-safe:animate-spin" }) : icon,
|
|
72
|
+
asChild ? /* @__PURE__ */ jsx(Slottable, { children }) : children,
|
|
73
|
+
!loading && iconTrailing ? /* @__PURE__ */ jsx("span", {
|
|
74
|
+
"data-cta-icon-trailing": true,
|
|
75
|
+
children: iconTrailing
|
|
76
|
+
}) : null
|
|
77
|
+
]
|
|
64
78
|
});
|
|
65
79
|
}
|
|
66
80
|
//#endregion
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { PopoverContent } from "./popover.mjs";
|
|
2
2
|
import { selectTriggerVariants } from "./select-trigger-variants.mjs";
|
|
3
|
-
import { ReactNode } from "react";
|
|
4
3
|
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
5
4
|
import { VariantProps } from "class-variance-authority";
|
|
5
|
+
import { ReactNode } from "react";
|
|
6
6
|
import { Command } from "cmdk";
|
|
7
7
|
|
|
8
8
|
//#region src/components/combobox.d.ts
|
|
@@ -3,9 +3,9 @@ import { cn } from "../lib/cn.mjs";
|
|
|
3
3
|
import { Popover, PopoverContent, PopoverTrigger } from "./popover.mjs";
|
|
4
4
|
import { selectTriggerVariants } from "./select-trigger-variants.mjs";
|
|
5
5
|
import { TagDismissible } from "./tag.mjs";
|
|
6
|
-
import { createContext, useCallback, useContext, useMemo, useState } from "react";
|
|
7
6
|
import { CheckIcon, ChevronDownIcon, SearchIcon } from "lucide-react";
|
|
8
7
|
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
8
|
+
import { createContext, useCallback, useContext, useMemo, useState } from "react";
|
|
9
9
|
import { Command } from "cmdk";
|
|
10
10
|
//#region src/components/combobox.tsx
|
|
11
11
|
const ComboboxContext = createContext(null);
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import { useCopyToClipboard } from "../hooks/use-copy-to-clipboard.mjs";
|
|
3
2
|
import { cn } from "../lib/cn.mjs";
|
|
4
3
|
import { Button } from "./button.mjs";
|
|
4
|
+
import { useCopyToClipboard } from "../hooks/use-copy-to-clipboard.mjs";
|
|
5
5
|
import { Check, Copy } from "lucide-react";
|
|
6
6
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
7
7
|
//#region src/components/copyable.tsx
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { ButtonProps } from "./button.mjs";
|
|
2
|
-
import * as React from "react";
|
|
3
2
|
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
4
3
|
import { VariantProps } from "class-variance-authority";
|
|
4
|
+
import * as React from "react";
|
|
5
5
|
import * as DialogPrimitive from "@radix-ui/react-dialog";
|
|
6
6
|
import * as _$class_variance_authority_types0 from "class-variance-authority/types";
|
|
7
7
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
1
|
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
2
|
import { VariantProps } from "class-variance-authority";
|
|
3
|
+
import * as React from "react";
|
|
4
4
|
import * as DropdownMenuPrimitive from "@radix-ui/react-dropdown-menu";
|
|
5
5
|
import * as _$class_variance_authority_types0 from "class-variance-authority/types";
|
|
6
6
|
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
import { InputProps } from "./input.mjs";
|
|
2
2
|
import { Label } from "./label.mjs";
|
|
3
3
|
import { TextareaProps } from "./textarea.mjs";
|
|
4
|
-
import * as React from "react";
|
|
5
4
|
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
5
|
+
import * as React from "react";
|
|
6
6
|
import { Slot } from "@radix-ui/react-slot";
|
|
7
7
|
import * as _$react_hook_form0 from "react-hook-form";
|
|
8
8
|
import { ControllerProps, FieldPath, FieldValues } from "react-hook-form";
|
|
@@ -115,5 +115,40 @@ declare function SelectField<TFieldValues extends FieldValues, TName extends Fie
|
|
|
115
115
|
options,
|
|
116
116
|
placeholder
|
|
117
117
|
}: SelectFieldProps<TFieldValues, TName>): _$react_jsx_runtime0.JSX.Element;
|
|
118
|
+
interface RadioFieldProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> extends FormFieldBaseProps<TFieldValues, TName> {
|
|
119
|
+
options: SelectFieldOption[];
|
|
120
|
+
}
|
|
121
|
+
declare function RadioField<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>({
|
|
122
|
+
control,
|
|
123
|
+
name,
|
|
124
|
+
rules,
|
|
125
|
+
required,
|
|
126
|
+
label,
|
|
127
|
+
description,
|
|
128
|
+
tooltip,
|
|
129
|
+
options
|
|
130
|
+
}: RadioFieldProps<TFieldValues, TName>): _$react_jsx_runtime0.JSX.Element;
|
|
131
|
+
interface ChecklistFieldProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> extends FormFieldBaseProps<TFieldValues, TName> {
|
|
132
|
+
options: SelectFieldOption[];
|
|
133
|
+
}
|
|
134
|
+
declare function ChecklistField<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>({
|
|
135
|
+
control,
|
|
136
|
+
name,
|
|
137
|
+
rules,
|
|
138
|
+
required,
|
|
139
|
+
label,
|
|
140
|
+
description,
|
|
141
|
+
tooltip,
|
|
142
|
+
options
|
|
143
|
+
}: ChecklistFieldProps<TFieldValues, TName>): _$react_jsx_runtime0.JSX.Element;
|
|
144
|
+
interface CheckboxFieldProps<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>> extends Omit<FormFieldBaseProps<TFieldValues, TName>, "required"> {}
|
|
145
|
+
declare function CheckboxField<TFieldValues extends FieldValues, TName extends FieldPath<TFieldValues>>({
|
|
146
|
+
control,
|
|
147
|
+
name,
|
|
148
|
+
rules,
|
|
149
|
+
label,
|
|
150
|
+
description,
|
|
151
|
+
tooltip
|
|
152
|
+
}: CheckboxFieldProps<TFieldValues, TName>): _$react_jsx_runtime0.JSX.Element;
|
|
118
153
|
//#endregion
|
|
119
|
-
export { Form, FormControl, FormDescription, FormField, FormFields, FormHeader, FormItem, FormLabel, FormMessage, InputField, SelectField, type SelectFieldOption, TextareaField, useFormField };
|
|
154
|
+
export { CheckboxField, ChecklistField, Form, FormControl, FormDescription, FormField, FormFields, FormHeader, FormItem, FormLabel, FormMessage, InputField, RadioField, SelectField, type SelectFieldOption, TextareaField, useFormField };
|
package/dist/components/form.mjs
CHANGED
|
@@ -1,13 +1,15 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { cn } from "../lib/cn.mjs";
|
|
3
3
|
import { Tooltip, TooltipContent, TooltipTrigger } from "./tooltip.mjs";
|
|
4
|
+
import { Checkbox } from "./checkbox.mjs";
|
|
4
5
|
import { Label } from "./label.mjs";
|
|
5
6
|
import { Input } from "./input.mjs";
|
|
7
|
+
import { RadioGroup, RadioGroupItem } from "./radio-group.mjs";
|
|
6
8
|
import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "./select.mjs";
|
|
7
9
|
import { Textarea } from "./textarea.mjs";
|
|
8
|
-
import * as React from "react";
|
|
9
10
|
import { Info } from "lucide-react";
|
|
10
11
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
12
|
+
import * as React from "react";
|
|
11
13
|
import { Slot } from "@radix-ui/react-slot";
|
|
12
14
|
import { Controller, FormProvider, useFormContext, useFormState } from "react-hook-form";
|
|
13
15
|
//#region src/components/form.tsx
|
|
@@ -88,7 +90,7 @@ function FormDescription({ className, ...props }) {
|
|
|
88
90
|
return /* @__PURE__ */ jsx("p", {
|
|
89
91
|
"data-slot": "form-description",
|
|
90
92
|
id: formDescriptionId,
|
|
91
|
-
className: cn("text-muted-foreground text-sm", className),
|
|
93
|
+
className: cn("text-muted-foreground type-text-sm whitespace-pre-line", className),
|
|
92
94
|
...props
|
|
93
95
|
});
|
|
94
96
|
}
|
|
@@ -134,11 +136,11 @@ function InputField({ control, name, rules, required, label, description, toolti
|
|
|
134
136
|
tooltip,
|
|
135
137
|
children: label
|
|
136
138
|
}),
|
|
139
|
+
description && /* @__PURE__ */ jsx(FormDescription, { children: description }),
|
|
137
140
|
/* @__PURE__ */ jsx(FormControl, { children: /* @__PURE__ */ jsx(Input, {
|
|
138
141
|
...inputProps,
|
|
139
142
|
...field
|
|
140
143
|
}) }),
|
|
141
|
-
description && /* @__PURE__ */ jsx(FormDescription, { children: description }),
|
|
142
144
|
/* @__PURE__ */ jsx(FormMessage, {})
|
|
143
145
|
] })
|
|
144
146
|
});
|
|
@@ -154,11 +156,11 @@ function TextareaField({ control, name, rules, required, label, description, too
|
|
|
154
156
|
tooltip,
|
|
155
157
|
children: label
|
|
156
158
|
}),
|
|
159
|
+
description && /* @__PURE__ */ jsx(FormDescription, { children: description }),
|
|
157
160
|
/* @__PURE__ */ jsx(FormControl, { children: /* @__PURE__ */ jsx(Textarea, {
|
|
158
161
|
...textareaProps,
|
|
159
162
|
...field
|
|
160
163
|
}) }),
|
|
161
|
-
description && /* @__PURE__ */ jsx(FormDescription, { children: description }),
|
|
162
164
|
/* @__PURE__ */ jsx(FormMessage, {})
|
|
163
165
|
] })
|
|
164
166
|
});
|
|
@@ -174,6 +176,7 @@ function SelectField({ control, name, rules, required, label, description, toolt
|
|
|
174
176
|
tooltip,
|
|
175
177
|
children: label
|
|
176
178
|
}),
|
|
179
|
+
description && /* @__PURE__ */ jsx(FormDescription, { children: description }),
|
|
177
180
|
/* @__PURE__ */ jsxs(Select, {
|
|
178
181
|
value: field.value,
|
|
179
182
|
onValueChange: field.onChange,
|
|
@@ -183,10 +186,117 @@ function SelectField({ control, name, rules, required, label, description, toolt
|
|
|
183
186
|
children: option.label
|
|
184
187
|
}, option.value)) })]
|
|
185
188
|
}),
|
|
189
|
+
/* @__PURE__ */ jsx(FormMessage, {})
|
|
190
|
+
] })
|
|
191
|
+
});
|
|
192
|
+
}
|
|
193
|
+
function RadioField({ control, name, rules, required, label, description, tooltip, options }) {
|
|
194
|
+
return /* @__PURE__ */ jsx(FormField, {
|
|
195
|
+
control,
|
|
196
|
+
name,
|
|
197
|
+
rules,
|
|
198
|
+
render: ({ field }) => /* @__PURE__ */ jsxs(FormItem, { children: [
|
|
199
|
+
label && /* @__PURE__ */ jsx(FormLabel, {
|
|
200
|
+
required,
|
|
201
|
+
tooltip,
|
|
202
|
+
children: label
|
|
203
|
+
}),
|
|
186
204
|
description && /* @__PURE__ */ jsx(FormDescription, { children: description }),
|
|
205
|
+
/* @__PURE__ */ jsx(FormControl, { children: /* @__PURE__ */ jsx(RadioGroup, {
|
|
206
|
+
value: field.value ?? "",
|
|
207
|
+
onValueChange: field.onChange,
|
|
208
|
+
onBlur: field.onBlur,
|
|
209
|
+
children: options.map((option) => {
|
|
210
|
+
const itemId = `${field.name}-${option.value}`;
|
|
211
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
212
|
+
className: "flex items-center gap-2",
|
|
213
|
+
children: [/* @__PURE__ */ jsx(RadioGroupItem, {
|
|
214
|
+
id: itemId,
|
|
215
|
+
value: option.value,
|
|
216
|
+
disabled: option.disabled
|
|
217
|
+
}), /* @__PURE__ */ jsx(Label, {
|
|
218
|
+
htmlFor: itemId,
|
|
219
|
+
className: "type-text-sm font-normal",
|
|
220
|
+
children: option.label
|
|
221
|
+
})]
|
|
222
|
+
}, option.value);
|
|
223
|
+
})
|
|
224
|
+
}) }),
|
|
187
225
|
/* @__PURE__ */ jsx(FormMessage, {})
|
|
188
226
|
] })
|
|
189
227
|
});
|
|
190
228
|
}
|
|
229
|
+
function ChecklistField({ control, name, rules, required, label, description, tooltip, options }) {
|
|
230
|
+
return /* @__PURE__ */ jsx(FormField, {
|
|
231
|
+
control,
|
|
232
|
+
name,
|
|
233
|
+
rules,
|
|
234
|
+
render: ({ field }) => {
|
|
235
|
+
const selected = Array.isArray(field.value) ? field.value : [];
|
|
236
|
+
const toggle = (value, checked) => {
|
|
237
|
+
if (checked) field.onChange([...selected, value]);
|
|
238
|
+
else field.onChange(selected.filter((existing) => existing !== value));
|
|
239
|
+
};
|
|
240
|
+
return /* @__PURE__ */ jsxs(FormItem, { children: [
|
|
241
|
+
label && /* @__PURE__ */ jsx(FormLabel, {
|
|
242
|
+
required,
|
|
243
|
+
tooltip,
|
|
244
|
+
children: label
|
|
245
|
+
}),
|
|
246
|
+
description && /* @__PURE__ */ jsx(FormDescription, { children: description }),
|
|
247
|
+
/* @__PURE__ */ jsx(FormControl, { children: /* @__PURE__ */ jsx("fieldset", {
|
|
248
|
+
className: "m-0 flex flex-col gap-2 border-0 p-0",
|
|
249
|
+
onBlur: field.onBlur,
|
|
250
|
+
children: options.map((option) => {
|
|
251
|
+
const itemId = `${field.name}-${option.value}`;
|
|
252
|
+
return /* @__PURE__ */ jsxs("div", {
|
|
253
|
+
className: "flex items-start gap-2",
|
|
254
|
+
children: [/* @__PURE__ */ jsx(Checkbox, {
|
|
255
|
+
id: itemId,
|
|
256
|
+
checked: selected.includes(option.value),
|
|
257
|
+
onCheckedChange: (next) => toggle(option.value, Boolean(next)),
|
|
258
|
+
disabled: option.disabled
|
|
259
|
+
}), /* @__PURE__ */ jsx(Label, {
|
|
260
|
+
htmlFor: itemId,
|
|
261
|
+
className: "type-text-sm font-normal leading-tight",
|
|
262
|
+
children: option.label
|
|
263
|
+
})]
|
|
264
|
+
}, option.value);
|
|
265
|
+
})
|
|
266
|
+
}) }),
|
|
267
|
+
/* @__PURE__ */ jsx(FormMessage, {})
|
|
268
|
+
] });
|
|
269
|
+
}
|
|
270
|
+
});
|
|
271
|
+
}
|
|
272
|
+
function CheckboxField({ control, name, rules, label, description, tooltip }) {
|
|
273
|
+
return /* @__PURE__ */ jsx(FormField, {
|
|
274
|
+
control,
|
|
275
|
+
name,
|
|
276
|
+
rules,
|
|
277
|
+
render: ({ field }) => /* @__PURE__ */ jsxs(FormItem, {
|
|
278
|
+
className: "gap-1.5",
|
|
279
|
+
children: [
|
|
280
|
+
/* @__PURE__ */ jsxs("div", {
|
|
281
|
+
className: "flex items-start gap-2",
|
|
282
|
+
children: [/* @__PURE__ */ jsx(FormControl, { children: /* @__PURE__ */ jsx(Checkbox, {
|
|
283
|
+
checked: field.value ?? false,
|
|
284
|
+
onCheckedChange: (next) => field.onChange(Boolean(next)),
|
|
285
|
+
onBlur: field.onBlur
|
|
286
|
+
}) }), label && /* @__PURE__ */ jsx(FormLabel, {
|
|
287
|
+
tooltip,
|
|
288
|
+
className: "font-normal",
|
|
289
|
+
children: label
|
|
290
|
+
})]
|
|
291
|
+
}),
|
|
292
|
+
description && /* @__PURE__ */ jsx(FormDescription, {
|
|
293
|
+
className: "ml-6",
|
|
294
|
+
children: description
|
|
295
|
+
}),
|
|
296
|
+
/* @__PURE__ */ jsx(FormMessage, { className: "ml-6" })
|
|
297
|
+
]
|
|
298
|
+
})
|
|
299
|
+
});
|
|
300
|
+
}
|
|
191
301
|
//#endregion
|
|
192
|
-
export { Form, FormControl, FormDescription, FormField, FormFields, FormHeader, FormItem, FormLabel, FormMessage, InputField, SelectField, TextareaField, useFormField };
|
|
302
|
+
export { CheckboxField, ChecklistField, Form, FormControl, FormDescription, FormField, FormFields, FormHeader, FormItem, FormLabel, FormMessage, InputField, RadioField, SelectField, TextareaField, useFormField };
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { Button } from "./button.mjs";
|
|
2
|
+
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
|
+
import { ComponentProps } from "react";
|
|
4
|
+
|
|
5
|
+
//#region src/components/github-button.d.ts
|
|
6
|
+
type GitHubButtonProps = Omit<ComponentProps<typeof Button>, "variant" | "icon">;
|
|
7
|
+
declare function GitHubButton({
|
|
8
|
+
className,
|
|
9
|
+
children,
|
|
10
|
+
...props
|
|
11
|
+
}: GitHubButtonProps): _$react_jsx_runtime0.JSX.Element;
|
|
12
|
+
//#endregion
|
|
13
|
+
export { GitHubButton, type GitHubButtonProps };
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { cn } from "../lib/cn.mjs";
|
|
3
|
+
import { Button } from "./button.mjs";
|
|
4
|
+
import { jsx } from "react/jsx-runtime";
|
|
5
|
+
//#region src/components/github-button.tsx
|
|
6
|
+
const GITHUB_ICON_PATH = "M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12";
|
|
7
|
+
function GitHubIcon() {
|
|
8
|
+
return /* @__PURE__ */ jsx("svg", {
|
|
9
|
+
fill: "currentColor",
|
|
10
|
+
viewBox: "0 0 24 24",
|
|
11
|
+
"aria-hidden": "true",
|
|
12
|
+
children: /* @__PURE__ */ jsx("path", { d: GITHUB_ICON_PATH })
|
|
13
|
+
});
|
|
14
|
+
}
|
|
15
|
+
function GitHubButton({ className, children, ...props }) {
|
|
16
|
+
return /* @__PURE__ */ jsx(Button, {
|
|
17
|
+
...props,
|
|
18
|
+
icon: /* @__PURE__ */ jsx(GitHubIcon, {}),
|
|
19
|
+
className: cn("bg-foreground text-background [@media(hover:hover)]:hover:bg-foreground/90", className),
|
|
20
|
+
children
|
|
21
|
+
});
|
|
22
|
+
}
|
|
23
|
+
//#endregion
|
|
24
|
+
export { GitHubButton };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import * as React from "react";
|
|
2
1
|
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
3
2
|
import { VariantProps } from "class-variance-authority";
|
|
3
|
+
import * as React from "react";
|
|
4
4
|
import * as _$class_variance_authority_types0 from "class-variance-authority/types";
|
|
5
5
|
|
|
6
6
|
//#region src/components/input-group.d.ts
|
|
@@ -2,9 +2,9 @@
|
|
|
2
2
|
import { cn } from "../lib/cn.mjs";
|
|
3
3
|
import { Tooltip, TooltipContent, TooltipTrigger } from "./tooltip.mjs";
|
|
4
4
|
import { Label } from "./label.mjs";
|
|
5
|
-
import * as React from "react";
|
|
6
5
|
import { Info } from "lucide-react";
|
|
7
6
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
7
|
+
import * as React from "react";
|
|
8
8
|
//#region src/components/input.tsx
|
|
9
9
|
const inputSizeStyles = {
|
|
10
10
|
sm: {
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import * as _$react_jsx_runtime0 from "react/jsx-runtime";
|
|
2
|
+
|
|
3
|
+
//#region src/components/page-loader.d.ts
|
|
4
|
+
interface PageLoaderProps {
|
|
5
|
+
className?: string;
|
|
6
|
+
}
|
|
7
|
+
declare function PageLoader({
|
|
8
|
+
className
|
|
9
|
+
}: PageLoaderProps): _$react_jsx_runtime0.JSX.Element;
|
|
10
|
+
//#endregion
|
|
11
|
+
export { PageLoader, type PageLoaderProps };
|