@alpic-ai/ui 0.0.0-staging.bfe37ab → 0.0.0-staging.c3e4e32

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.
Files changed (53) hide show
  1. package/dist/components/accordion-card.d.mts +1 -1
  2. package/dist/components/accordion.d.mts +1 -1
  3. package/dist/components/alert.d.mts +1 -1
  4. package/dist/components/attachment-tile.mjs +1 -1
  5. package/dist/components/avatar.d.mts +1 -1
  6. package/dist/components/breadcrumb.d.mts +1 -1
  7. package/dist/components/button.d.mts +1 -1
  8. package/dist/components/card.d.mts +1 -1
  9. package/dist/components/checkbox.d.mts +1 -1
  10. package/dist/components/collapsible.d.mts +1 -1
  11. package/dist/components/combobox.d.mts +1 -1
  12. package/dist/components/combobox.mjs +1 -1
  13. package/dist/components/command.d.mts +1 -1
  14. package/dist/components/copyable.d.mts +1 -1
  15. package/dist/components/copyable.mjs +1 -1
  16. package/dist/components/description-list.d.mts +1 -1
  17. package/dist/components/dialog.d.mts +1 -1
  18. package/dist/components/dropdown-menu.d.mts +1 -1
  19. package/dist/components/form.d.mts +1 -1
  20. package/dist/components/form.mjs +1 -1
  21. package/dist/components/github-button.d.mts +1 -1
  22. package/dist/components/input-group.d.mts +1 -1
  23. package/dist/components/input.d.mts +1 -1
  24. package/dist/components/input.mjs +1 -1
  25. package/dist/components/label.d.mts +1 -1
  26. package/dist/components/page-loader.d.mts +11 -0
  27. package/dist/components/page-loader.mjs +122 -0
  28. package/dist/components/pagination.d.mts +1 -1
  29. package/dist/components/popover.d.mts +1 -1
  30. package/dist/components/radio-group.d.mts +1 -1
  31. package/dist/components/scroll-area.d.mts +1 -1
  32. package/dist/components/select.d.mts +1 -1
  33. package/dist/components/separator.d.mts +1 -1
  34. package/dist/components/sheet.d.mts +1 -1
  35. package/dist/components/sidebar.d.mts +1 -1
  36. package/dist/components/sidebar.mjs +2 -2
  37. package/dist/components/sonner.d.mts +1 -1
  38. package/dist/components/switch.d.mts +1 -1
  39. package/dist/components/table.d.mts +11 -2
  40. package/dist/components/table.mjs +2 -2
  41. package/dist/components/tabs.d.mts +1 -1
  42. package/dist/components/tabs.mjs +1 -1
  43. package/dist/components/textarea.d.mts +1 -1
  44. package/dist/components/textarea.mjs +1 -1
  45. package/dist/components/toggle-group.d.mts +1 -1
  46. package/dist/components/toggle-group.mjs +1 -1
  47. package/dist/components/tooltip-icon-button.mjs +1 -1
  48. package/dist/components/tooltip.d.mts +1 -1
  49. package/dist/components/typography.d.mts +1 -1
  50. package/package.json +1 -1
  51. package/src/components/page-loader.tsx +59 -0
  52. package/src/components/table.tsx +16 -2
  53. package/src/styles/tokens.css +9 -0
@@ -1,6 +1,6 @@
1
+ import * as React from "react";
1
2
  import * as AccordionPrimitive from "@radix-ui/react-accordion";
2
3
  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";
1
2
  import * as AccordionPrimitive from "@radix-ui/react-accordion";
2
3
  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";
1
2
  import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
3
  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";
4
5
  import { FileText, XIcon } from "lucide-react";
5
6
  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";
1
2
  import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
3
  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,5 +1,5 @@
1
- import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
1
  import * as React from "react";
2
+ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
3
3
 
4
4
  //#region src/components/breadcrumb.d.ts
5
5
  declare function Breadcrumb({
@@ -1,6 +1,6 @@
1
+ import * as React from "react";
1
2
  import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
3
  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
@@ -1,5 +1,5 @@
1
- import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
1
  import * as React from "react";
2
+ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
3
3
 
4
4
  //#region src/components/card.d.ts
5
5
  declare function Card({
@@ -1,5 +1,5 @@
1
- import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
1
  import * as React from "react";
2
+ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
3
3
  import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
4
4
 
5
5
  //#region src/components/checkbox.d.ts
@@ -1,5 +1,5 @@
1
- import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
1
  import * as React from "react";
2
+ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
3
3
  import * as CollapsiblePrimitive from "@radix-ui/react-collapsible";
4
4
 
5
5
  //#region src/components/collapsible.d.ts
@@ -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";
3
4
  import * as _$react_jsx_runtime0 from "react/jsx-runtime";
4
5
  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";
6
7
  import { CheckIcon, ChevronDownIcon, SearchIcon } from "lucide-react";
7
8
  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,5 +1,5 @@
1
- import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
1
  import * as React from "react";
2
+ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
3
3
  import { Command as Command$1 } from "cmdk";
4
4
 
5
5
  //#region src/components/command.d.ts
@@ -1,5 +1,5 @@
1
- import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
1
  import { ReactNode } from "react";
2
+ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
3
3
 
4
4
  //#region src/components/copyable.d.ts
5
5
  interface CopyableProps {
@@ -1,7 +1,7 @@
1
1
  "use client";
2
+ import { useCopyToClipboard } from "../hooks/use-copy-to-clipboard.mjs";
2
3
  import { cn } from "../lib/cn.mjs";
3
4
  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,5 +1,5 @@
1
- import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
1
  import * as React from "react";
2
+ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
3
3
 
4
4
  //#region src/components/description-list.d.ts
5
5
  declare function DescriptionList({
@@ -1,7 +1,7 @@
1
1
  import { ButtonProps } from "./button.mjs";
2
+ import * as React from "react";
2
3
  import * as _$react_jsx_runtime0 from "react/jsx-runtime";
3
4
  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";
1
2
  import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
3
  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_jsx_runtime0 from "react/jsx-runtime";
5
4
  import * as React from "react";
5
+ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
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";
@@ -5,9 +5,9 @@ import { Label } from "./label.mjs";
5
5
  import { Input } from "./input.mjs";
6
6
  import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "./select.mjs";
7
7
  import { Textarea } from "./textarea.mjs";
8
+ import * as React from "react";
8
9
  import { Info } from "lucide-react";
9
10
  import { jsx, jsxs } from "react/jsx-runtime";
10
- import * as React from "react";
11
11
  import { Slot } from "@radix-ui/react-slot";
12
12
  import { Controller, FormProvider, useFormContext, useFormState } from "react-hook-form";
13
13
  //#region src/components/form.tsx
@@ -1,6 +1,6 @@
1
1
  import { Button } from "./button.mjs";
2
- import * as _$react_jsx_runtime0 from "react/jsx-runtime";
3
2
  import { ComponentProps } from "react";
3
+ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
4
4
 
5
5
  //#region src/components/github-button.d.ts
6
6
  type GitHubButtonProps = Omit<ComponentProps<typeof Button>, "variant" | "icon">;
@@ -1,6 +1,6 @@
1
+ import * as React from "react";
1
2
  import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
3
  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
@@ -1,5 +1,5 @@
1
- import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
1
  import * as React from "react";
2
+ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
3
3
 
4
4
  //#region src/components/input.d.ts
5
5
  interface InputProps extends Omit<React.ComponentProps<"input">, "size"> {
@@ -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";
5
6
  import { Info } from "lucide-react";
6
7
  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: {
@@ -1,5 +1,5 @@
1
- import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
1
  import * as React from "react";
2
+ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
3
3
  import * as LabelPrimitive from "@radix-ui/react-label";
4
4
 
5
5
  //#region src/components/label.d.ts
@@ -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 };
@@ -0,0 +1,122 @@
1
+ "use client";
2
+ import { cn } from "../lib/cn.mjs";
3
+ import { jsx, jsxs } from "react/jsx-runtime";
4
+ //#region src/components/page-loader.tsx
5
+ const CABLE_CAR_SVG = /* @__PURE__ */ jsxs("svg", {
6
+ xmlns: "http://www.w3.org/2000/svg",
7
+ viewBox: "0 0 120 130",
8
+ width: "240",
9
+ height: "260",
10
+ "aria-hidden": "true",
11
+ className: "block h-auto w-full",
12
+ children: [
13
+ /* @__PURE__ */ jsx("line", {
14
+ x1: "60",
15
+ y1: "3",
16
+ x2: "60",
17
+ y2: "58",
18
+ stroke: "#333",
19
+ strokeWidth: "4"
20
+ }),
21
+ /* @__PURE__ */ jsx("circle", {
22
+ cx: "60",
23
+ cy: "11",
24
+ r: "10",
25
+ fill: "#555"
26
+ }),
27
+ /* @__PURE__ */ jsx("rect", {
28
+ x: "5",
29
+ y: "58",
30
+ width: "110",
31
+ height: "64",
32
+ rx: "4",
33
+ fill: "#e90060"
34
+ }),
35
+ /* @__PURE__ */ jsx("rect", {
36
+ x: "5",
37
+ y: "58",
38
+ width: "110",
39
+ height: "20",
40
+ rx: "4",
41
+ fill: "#F5F0E8"
42
+ }),
43
+ /* @__PURE__ */ jsx("rect", {
44
+ x: "5",
45
+ y: "68",
46
+ width: "110",
47
+ height: "10",
48
+ fill: "#F5F0E8"
49
+ }),
50
+ /* @__PURE__ */ jsx("rect", {
51
+ x: "14",
52
+ y: "66",
53
+ width: "26",
54
+ height: "30",
55
+ rx: "2",
56
+ fill: "#5B8EC9",
57
+ stroke: "#C4B9A8",
58
+ strokeWidth: "1.5"
59
+ }),
60
+ /* @__PURE__ */ jsx("rect", {
61
+ x: "47",
62
+ y: "66",
63
+ width: "26",
64
+ height: "30",
65
+ rx: "2",
66
+ fill: "#5B8EC9",
67
+ stroke: "#C4B9A8",
68
+ strokeWidth: "1.5"
69
+ }),
70
+ /* @__PURE__ */ jsx("rect", {
71
+ x: "80",
72
+ y: "66",
73
+ width: "26",
74
+ height: "30",
75
+ rx: "2",
76
+ fill: "#5B8EC9",
77
+ stroke: "#C4B9A8",
78
+ strokeWidth: "1.5"
79
+ }),
80
+ /* @__PURE__ */ jsx("rect", {
81
+ x: "5",
82
+ y: "115",
83
+ width: "110",
84
+ height: "7",
85
+ rx: "3",
86
+ fill: "#9f0042"
87
+ })
88
+ ]
89
+ });
90
+ function PageLoader({ className }) {
91
+ return /* @__PURE__ */ jsx("div", {
92
+ className: cn("flex min-h-screen items-center justify-center bg-background", className),
93
+ role: "status",
94
+ "aria-label": "Loading Alpic…",
95
+ children: /* @__PURE__ */ jsxs("div", {
96
+ className: "relative h-[120px] w-[200px]",
97
+ children: [
98
+ /* @__PURE__ */ jsx("div", {
99
+ className: "absolute top-[30px] left-0 h-[3px] w-full rounded-sm bg-[#6c6c77]",
100
+ style: {
101
+ transform: "rotate(-15deg)",
102
+ transformOrigin: "left center"
103
+ }
104
+ }),
105
+ /* @__PURE__ */ jsx("div", {
106
+ className: "absolute top-[33px] -left-[45px] w-[45px] motion-safe:animate-[alpic-ride_4s_linear_infinite]",
107
+ children: CABLE_CAR_SVG
108
+ }),
109
+ /* @__PURE__ */ jsx("div", {
110
+ className: "pointer-events-none absolute -top-[40px] -left-[45px] z-10 h-[200px] w-[95px]",
111
+ style: { background: "linear-gradient(to right, var(--color-background) 47%, transparent)" }
112
+ }),
113
+ /* @__PURE__ */ jsx("div", {
114
+ className: "pointer-events-none absolute -top-[40px] left-[142px] z-10 h-[200px] w-[95px]",
115
+ style: { background: "linear-gradient(to right, transparent, var(--color-background) 53%)" }
116
+ })
117
+ ]
118
+ })
119
+ });
120
+ }
121
+ //#endregion
122
+ export { PageLoader };
@@ -1,5 +1,5 @@
1
- import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
1
  import * as React from "react";
2
+ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
3
3
 
4
4
  //#region src/components/pagination.d.ts
5
5
  interface PaginationProps extends React.ComponentProps<"nav"> {
@@ -1,5 +1,5 @@
1
- import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
1
  import * as React from "react";
2
+ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
3
3
  import * as PopoverPrimitive from "@radix-ui/react-popover";
4
4
 
5
5
  //#region src/components/popover.d.ts
@@ -1,5 +1,5 @@
1
- import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
1
  import * as React from "react";
2
+ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
3
3
  import * as RadioGroupPrimitive from "@radix-ui/react-radio-group";
4
4
 
5
5
  //#region src/components/radio-group.d.ts
@@ -1,5 +1,5 @@
1
- import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
1
  import * as React from "react";
2
+ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
3
3
  import * as ScrollAreaPrimitive from "@radix-ui/react-scroll-area";
4
4
 
5
5
  //#region src/components/scroll-area.d.ts
@@ -1,7 +1,7 @@
1
1
  import { selectTriggerVariants } from "./select-trigger-variants.mjs";
2
+ import * as React from "react";
2
3
  import * as _$react_jsx_runtime0 from "react/jsx-runtime";
3
4
  import { VariantProps } from "class-variance-authority";
4
- import * as React from "react";
5
5
  import * as SelectPrimitive from "@radix-ui/react-select";
6
6
 
7
7
  //#region src/components/select.d.ts
@@ -1,5 +1,5 @@
1
- import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
1
  import * as React from "react";
2
+ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
3
3
  import * as SeparatorPrimitive from "@radix-ui/react-separator";
4
4
 
5
5
  //#region src/components/separator.d.ts
@@ -1,5 +1,5 @@
1
- import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
1
  import * as React from "react";
2
+ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
3
3
  import * as SheetPrimitive from "@radix-ui/react-dialog";
4
4
 
5
5
  //#region src/components/sheet.d.ts
@@ -1,8 +1,8 @@
1
1
  import { Button } from "./button.mjs";
2
2
  import { TooltipContent } from "./tooltip.mjs";
3
+ import * as React from "react";
3
4
  import * as _$react_jsx_runtime0 from "react/jsx-runtime";
4
5
  import { VariantProps } from "class-variance-authority";
5
- import * as React from "react";
6
6
  import * as _$class_variance_authority_types0 from "class-variance-authority/types";
7
7
 
8
8
  //#region src/components/sidebar.d.ts
@@ -1,14 +1,14 @@
1
1
  "use client";
2
+ import { useIsMobile } from "../hooks/use-mobile.mjs";
2
3
  import { cn } from "../lib/cn.mjs";
3
4
  import { Button } from "./button.mjs";
4
5
  import { Tooltip, TooltipContent, TooltipTrigger } from "./tooltip.mjs";
5
6
  import { Separator } from "./separator.mjs";
6
7
  import { Sheet, SheetContent, SheetDescription, SheetHeader, SheetTitle } from "./sheet.mjs";
7
- import { useIsMobile } from "../hooks/use-mobile.mjs";
8
8
  import { Skeleton } from "./skeleton.mjs";
9
+ import * as React from "react";
9
10
  import { jsx, jsxs } from "react/jsx-runtime";
10
11
  import { cva } from "class-variance-authority";
11
- import * as React from "react";
12
12
  import { Slot } from "@radix-ui/react-slot";
13
13
  //#region src/components/sidebar.tsx
14
14
  const SIDEBAR_COOKIE_NAME = "sidebar_state";
@@ -1,5 +1,5 @@
1
- import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
1
  import * as React from "react";
2
+ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
3
3
  import { Toaster as Toaster$1, toast } from "sonner";
4
4
 
5
5
  //#region src/components/sonner.d.ts
@@ -1,5 +1,5 @@
1
- import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
1
  import * as React from "react";
2
+ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
3
3
  import * as SwitchPrimitive from "@radix-ui/react-switch";
4
4
 
5
5
  //#region src/components/switch.d.ts
@@ -1,5 +1,5 @@
1
- import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
1
  import * as React from "react";
2
+ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
3
3
 
4
4
  //#region src/components/table.d.ts
5
5
  declare function Table({
@@ -26,10 +26,19 @@ declare function TableHead({
26
26
  className,
27
27
  ...props
28
28
  }: React.ComponentProps<"th">): _$react_jsx_runtime0.JSX.Element;
29
+ interface TableCellProps extends React.ComponentProps<"td"> {
30
+ /**
31
+ * When true, the cell renders edge-to-edge so the child can act as the
32
+ * interactive surface (e.g. a button or popover trigger filling the cell).
33
+ * Defaults to false (standard padded cell).
34
+ */
35
+ interactive?: boolean;
36
+ }
29
37
  declare function TableCell({
30
38
  className,
39
+ interactive,
31
40
  ...props
32
- }: React.ComponentProps<"td">): _$react_jsx_runtime0.JSX.Element;
41
+ }: TableCellProps): _$react_jsx_runtime0.JSX.Element;
33
42
  declare function TableCaption({
34
43
  className,
35
44
  ...props
@@ -47,10 +47,10 @@ function TableHead({ className, ...props }) {
47
47
  ...props
48
48
  });
49
49
  }
50
- function TableCell({ className, ...props }) {
50
+ function TableCell({ className, interactive = false, ...props }) {
51
51
  return /* @__PURE__ */ jsx("td", {
52
52
  "data-slot": "table-cell",
53
- className: cn("px-6 py-2 align-middle", "[&:has([role=checkbox])]:w-px [&:has([role=checkbox])]:pr-3", className),
53
+ className: cn("align-middle", interactive ? "h-px p-0" : "px-6 py-2", "[&:has([role=checkbox])]:w-px [&:has([role=checkbox])]:pr-3", className),
54
54
  ...props
55
55
  });
56
56
  }
@@ -1,6 +1,6 @@
1
+ import * as React from "react";
1
2
  import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
3
  import { VariantProps } from "class-variance-authority";
3
- import * as React from "react";
4
4
  import * as TabsPrimitive from "@radix-ui/react-tabs";
5
5
  import * as _$class_variance_authority_types0 from "class-variance-authority/types";
6
6
 
@@ -1,8 +1,8 @@
1
1
  "use client";
2
2
  import { cn } from "../lib/cn.mjs";
3
+ import { createContext, use } from "react";
3
4
  import { jsx } from "react/jsx-runtime";
4
5
  import { cva } from "class-variance-authority";
5
- import { createContext, use } from "react";
6
6
  import { Slot } from "@radix-ui/react-slot";
7
7
  import * as TabsPrimitive from "@radix-ui/react-tabs";
8
8
  //#region src/components/tabs.tsx
@@ -1,5 +1,5 @@
1
- import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
1
  import * as React from "react";
2
+ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
3
3
 
4
4
  //#region src/components/textarea.d.ts
5
5
  interface TextareaProps extends React.ComponentProps<"textarea"> {
@@ -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";
5
6
  import { Info } from "lucide-react";
6
7
  import { jsx, jsxs } from "react/jsx-runtime";
7
- import * as React from "react";
8
8
  //#region src/components/textarea.tsx
9
9
  function Textarea({ className, id, label, required, hint, error, tooltip, ...props }) {
10
10
  const generatedId = React.useId();
@@ -1,6 +1,6 @@
1
+ import * as React from "react";
1
2
  import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
3
  import { VariantProps } from "class-variance-authority";
3
- import * as React from "react";
4
4
  import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group";
5
5
  import * as _$class_variance_authority_types0 from "class-variance-authority/types";
6
6
 
@@ -1,8 +1,8 @@
1
1
  "use client";
2
2
  import { cn } from "../lib/cn.mjs";
3
+ import * as React from "react";
3
4
  import { jsx } from "react/jsx-runtime";
4
5
  import { cva } from "class-variance-authority";
5
- import * as React from "react";
6
6
  import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group";
7
7
  //#region src/components/toggle-group.tsx
8
8
  const toggleGroupItemVariants = cva([
@@ -1,8 +1,8 @@
1
1
  "use client";
2
2
  import { Button } from "./button.mjs";
3
3
  import { Tooltip, TooltipContent, TooltipTrigger } from "./tooltip.mjs";
4
- import { jsx, jsxs } from "react/jsx-runtime";
5
4
  import { forwardRef } from "react";
5
+ import { jsx, jsxs } from "react/jsx-runtime";
6
6
  import { Slottable } from "@radix-ui/react-slot";
7
7
  //#region src/components/tooltip-icon-button.tsx
8
8
  const TooltipIconButton = forwardRef(({ children, tooltip, side = "bottom", ...rest }, ref) => {
@@ -1,5 +1,5 @@
1
- import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
1
  import * as React from "react";
2
+ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
3
3
  import * as TooltipPrimitive from "@radix-ui/react-tooltip";
4
4
 
5
5
  //#region src/components/tooltip.d.ts
@@ -1,5 +1,5 @@
1
- import * as _$react_jsx_runtime0 from "react/jsx-runtime";
2
1
  import { ReactNode } from "react";
2
+ import * as _$react_jsx_runtime0 from "react/jsx-runtime";
3
3
 
4
4
  //#region src/components/typography.d.ts
5
5
  declare function H1({
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alpic-ai/ui",
3
- "version": "0.0.0-staging.bfe37ab",
3
+ "version": "0.0.0-staging.c3e4e32",
4
4
  "description": "Alpic design system — shared UI components",
5
5
  "type": "module",
6
6
  "exports": {
@@ -0,0 +1,59 @@
1
+ "use client";
2
+
3
+ import { cn } from "../lib/cn";
4
+
5
+ const CABLE_CAR_SVG = (
6
+ <svg
7
+ xmlns="http://www.w3.org/2000/svg"
8
+ viewBox="0 0 120 130"
9
+ width="240"
10
+ height="260"
11
+ aria-hidden="true"
12
+ className="block h-auto w-full"
13
+ >
14
+ <line x1="60" y1="3" x2="60" y2="58" stroke="#333" strokeWidth="4" />
15
+ <circle cx="60" cy="11" r="10" fill="#555" />
16
+ <rect x="5" y="58" width="110" height="64" rx="4" fill="#e90060" />
17
+ <rect x="5" y="58" width="110" height="20" rx="4" fill="#F5F0E8" />
18
+ <rect x="5" y="68" width="110" height="10" fill="#F5F0E8" />
19
+ <rect x="14" y="66" width="26" height="30" rx="2" fill="#5B8EC9" stroke="#C4B9A8" strokeWidth="1.5" />
20
+ <rect x="47" y="66" width="26" height="30" rx="2" fill="#5B8EC9" stroke="#C4B9A8" strokeWidth="1.5" />
21
+ <rect x="80" y="66" width="26" height="30" rx="2" fill="#5B8EC9" stroke="#C4B9A8" strokeWidth="1.5" />
22
+ <rect x="5" y="115" width="110" height="7" rx="3" fill="#9f0042" />
23
+ </svg>
24
+ );
25
+
26
+ interface PageLoaderProps {
27
+ className?: string;
28
+ }
29
+
30
+ function PageLoader({ className }: PageLoaderProps) {
31
+ return (
32
+ <div
33
+ className={cn("flex min-h-screen items-center justify-center bg-background", className)}
34
+ role="status"
35
+ aria-label="Loading Alpic…"
36
+ >
37
+ <div className="relative h-[120px] w-[200px]">
38
+ <div
39
+ className="absolute top-[30px] left-0 h-[3px] w-full rounded-sm bg-[#6c6c77]"
40
+ style={{ transform: "rotate(-15deg)", transformOrigin: "left center" }}
41
+ />
42
+ <div className="absolute top-[33px] -left-[45px] w-[45px] motion-safe:animate-[alpic-ride_4s_linear_infinite]">
43
+ {CABLE_CAR_SVG}
44
+ </div>
45
+ <div
46
+ className="pointer-events-none absolute -top-[40px] -left-[45px] z-10 h-[200px] w-[95px]"
47
+ style={{ background: "linear-gradient(to right, var(--color-background) 47%, transparent)" }}
48
+ />
49
+ <div
50
+ className="pointer-events-none absolute -top-[40px] left-[142px] z-10 h-[200px] w-[95px]"
51
+ style={{ background: "linear-gradient(to right, transparent, var(--color-background) 53%)" }}
52
+ />
53
+ </div>
54
+ </div>
55
+ );
56
+ }
57
+
58
+ export type { PageLoaderProps };
59
+ export { PageLoader };
@@ -66,11 +66,25 @@ function TableHead({ className, ...props }: React.ComponentProps<"th">) {
66
66
  );
67
67
  }
68
68
 
69
- function TableCell({ className, ...props }: React.ComponentProps<"td">) {
69
+ interface TableCellProps extends React.ComponentProps<"td"> {
70
+ /**
71
+ * When true, the cell renders edge-to-edge so the child can act as the
72
+ * interactive surface (e.g. a button or popover trigger filling the cell).
73
+ * Defaults to false (standard padded cell).
74
+ */
75
+ interactive?: boolean;
76
+ }
77
+
78
+ function TableCell({ className, interactive = false, ...props }: TableCellProps) {
70
79
  return (
71
80
  <td
72
81
  data-slot="table-cell"
73
- className={cn("px-6 py-2 align-middle", "[&:has([role=checkbox])]:w-px [&:has([role=checkbox])]:pr-3", className)}
82
+ className={cn(
83
+ "align-middle",
84
+ interactive ? "h-px p-0" : "px-6 py-2",
85
+ "[&:has([role=checkbox])]:w-px [&:has([role=checkbox])]:pr-3",
86
+ className,
87
+ )}
74
88
  {...props}
75
89
  />
76
90
  );
@@ -113,6 +113,15 @@
113
113
  --animate-beacon-ring-pulse: beacon-ring-pulse 2.2s ease-in-out infinite;
114
114
  }
115
115
 
116
+ @keyframes alpic-ride {
117
+ 0% {
118
+ transform: translate(0px, 0px);
119
+ }
120
+ 100% {
121
+ transform: translate(237px, -64px);
122
+ }
123
+ }
124
+
116
125
  @keyframes accordion-down {
117
126
  from {
118
127
  height: 0;