@alpic-ai/ui 0.0.0-dev.85c8341 → 0.0.0-staging.dcd2ccb

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.
@@ -187,7 +187,7 @@ function ComboboxItem({ className, children, itemValue, ...props }) {
187
187
  "data-slot": "combobox-item",
188
188
  "data-selected-item": selected || void 0,
189
189
  onSelect: () => onSelect(itemValue),
190
- className: cn("relative flex cursor-default items-center gap-2 rounded-sm px-2 py-2.5 outline-hidden select-none", "type-text-md font-medium text-foreground mx-1.5 my-px", "data-[selected=true]:bg-background-hover", "data-[selected-item]:bg-accent", "data-[disabled=true]:pointer-events-none data-[disabled=true]:text-disabled-foreground", "[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-5", className),
190
+ className: cn("relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 outline-hidden select-none", "type-text-md font-medium text-foreground mx-1.5 my-px", "data-[selected=true]:bg-background-hover", "data-[selected-item]:bg-accent", "data-[disabled=true]:pointer-events-none data-[disabled=true]:text-disabled-foreground", "[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-5", className),
191
191
  ...props,
192
192
  children: [/* @__PURE__ */ jsx("span", {
193
193
  className: "flex flex-1 items-center gap-2 truncate",
@@ -33,7 +33,7 @@ function DialogOverlay({ className, ...props }) {
33
33
  }
34
34
  const dialogContentVariants = cva([
35
35
  "bg-background fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2",
36
- "overflow-y-auto rounded-2xl px-6 shadow-lg outline-none",
36
+ "max-h-[calc(100vh-4rem)] overflow-hidden rounded-2xl px-6 shadow-lg outline-none",
37
37
  "data-[state=open]:animate-in data-[state=closed]:animate-out",
38
38
  "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
39
39
  "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
@@ -63,7 +63,7 @@ function DialogContent({ className, children, size, showCloseButton = true, ...p
63
63
  function DialogHeader({ className, ...props }) {
64
64
  return /* @__PURE__ */ jsx("div", {
65
65
  "data-slot": "dialog-header",
66
- className: cn("flex flex-col gap-0.5 pt-6 pr-10", className),
66
+ className: cn("flex flex-col gap-0.5 py-6 pr-10", className),
67
67
  ...props
68
68
  });
69
69
  }
@@ -39,13 +39,5 @@ declare function SelectSeparator({
39
39
  className,
40
40
  ...props
41
41
  }: React.ComponentProps<typeof SelectPrimitive.Separator>): _$react_jsx_runtime0.JSX.Element;
42
- declare function SelectScrollUpButton({
43
- className,
44
- ...props
45
- }: React.ComponentProps<typeof SelectPrimitive.ScrollUpButton>): _$react_jsx_runtime0.JSX.Element;
46
- declare function SelectScrollDownButton({
47
- className,
48
- ...props
49
- }: React.ComponentProps<typeof SelectPrimitive.ScrollDownButton>): _$react_jsx_runtime0.JSX.Element;
50
42
  //#endregion
51
- export { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, selectTriggerVariants };
43
+ export { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectSeparator, SelectTrigger, SelectValue, selectTriggerVariants };
@@ -1,7 +1,7 @@
1
1
  "use client";
2
2
  import { cn } from "../lib/cn.mjs";
3
3
  import { selectTriggerVariants } from "./select-trigger-variants.mjs";
4
- import { CheckIcon, ChevronDownIcon, ChevronUpIcon } from "lucide-react";
4
+ import { CheckIcon, ChevronDownIcon } from "lucide-react";
5
5
  import { jsx, jsxs } from "react/jsx-runtime";
6
6
  import * as SelectPrimitive from "@radix-ui/react-select";
7
7
  //#region src/components/select.tsx
@@ -35,19 +35,15 @@ function SelectTrigger({ className, size = "md", children, ...props }) {
35
35
  });
36
36
  }
37
37
  function SelectContent({ className, children, position = "popper", ...props }) {
38
- return /* @__PURE__ */ jsx(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsxs(SelectPrimitive.Content, {
38
+ return /* @__PURE__ */ jsx(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsx(SelectPrimitive.Content, {
39
39
  "data-slot": "select-content",
40
40
  className: cn("bg-popover text-popover-foreground", "relative z-50 max-h-[min(var(--radix-select-content-available-height),300px)] min-w-[8rem] overflow-hidden rounded-md border border-border-secondary py-1 shadow-lg", "origin-(--radix-select-content-transform-origin)", "data-[state=open]:animate-in data-[state=closed]:animate-out", "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0", "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95", "data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2", "data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2", position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1", className),
41
41
  position,
42
42
  ...props,
43
- children: [
44
- /* @__PURE__ */ jsx(SelectScrollUpButton, {}),
45
- /* @__PURE__ */ jsx(SelectPrimitive.Viewport, {
46
- className: cn("p-1", position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)] scroll-my-1"),
47
- children
48
- }),
49
- /* @__PURE__ */ jsx(SelectScrollDownButton, {})
50
- ]
43
+ children: /* @__PURE__ */ jsx(SelectPrimitive.Viewport, {
44
+ className: cn("p-1", position === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)] scroll-my-1"),
45
+ children
46
+ })
51
47
  }) });
52
48
  }
53
49
  function SelectLabel({ className, ...props }) {
@@ -60,7 +56,7 @@ function SelectLabel({ className, ...props }) {
60
56
  function SelectItem({ className, children, ...props }) {
61
57
  return /* @__PURE__ */ jsxs(SelectPrimitive.Item, {
62
58
  "data-slot": "select-item",
63
- className: cn("relative flex w-full cursor-default items-center gap-2 rounded-sm py-2 pr-8 pl-2.5 outline-hidden select-none", "type-text-md font-medium text-foreground mx-1 my-px", "[@media(hover:hover)]:hover:bg-background-hover", "focus:bg-background-hover", "data-[disabled]:pointer-events-none data-[disabled]:text-disabled-foreground", "[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
59
+ className: cn("relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pl-2 outline-hidden select-none", "type-text-md font-medium text-foreground mx-1 my-px", "[@media(hover:hover)]:hover:bg-background-hover", "focus:bg-background-hover", "data-[disabled]:pointer-events-none data-[disabled]:text-disabled-foreground", "[&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", className),
64
60
  ...props,
65
61
  children: [/* @__PURE__ */ jsx("span", {
66
62
  className: "absolute right-2 flex size-4 items-center justify-center",
@@ -75,21 +71,5 @@ function SelectSeparator({ className, ...props }) {
75
71
  ...props
76
72
  });
77
73
  }
78
- function SelectScrollUpButton({ className, ...props }) {
79
- return /* @__PURE__ */ jsx(SelectPrimitive.ScrollUpButton, {
80
- "data-slot": "select-scroll-up-button",
81
- className: cn("flex cursor-default items-center justify-center py-1", className),
82
- ...props,
83
- children: /* @__PURE__ */ jsx(ChevronUpIcon, { className: "size-4" })
84
- });
85
- }
86
- function SelectScrollDownButton({ className, ...props }) {
87
- return /* @__PURE__ */ jsx(SelectPrimitive.ScrollDownButton, {
88
- "data-slot": "select-scroll-down-button",
89
- className: cn("flex cursor-default items-center justify-center py-1", className),
90
- ...props,
91
- children: /* @__PURE__ */ jsx(ChevronDownIcon, { className: "size-4" })
92
- });
93
- }
94
74
  //#endregion
95
- export { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, selectTriggerVariants };
75
+ export { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectSeparator, SelectTrigger, SelectValue, selectTriggerVariants };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@alpic-ai/ui",
3
- "version": "0.0.0-dev.85c8341",
3
+ "version": "0.0.0-staging.dcd2ccb",
4
4
  "description": "Alpic design system — shared UI components",
5
5
  "type": "module",
6
6
  "exports": {
@@ -349,7 +349,7 @@ function ComboboxItem({ className, children, itemValue, ...props }: ComboboxItem
349
349
  data-selected-item={selected || undefined}
350
350
  onSelect={() => onSelect(itemValue)}
351
351
  className={cn(
352
- "relative flex cursor-default items-center gap-2 rounded-sm px-2 py-2.5 outline-hidden select-none",
352
+ "relative flex cursor-default items-center gap-2 rounded-sm px-2 py-1.5 outline-hidden select-none",
353
353
  "type-text-md font-medium text-foreground mx-1.5 my-px",
354
354
  "data-[selected=true]:bg-background-hover",
355
355
  "data-[selected-item]:bg-accent",
@@ -37,7 +37,7 @@ function DialogOverlay({ className, ...props }: React.ComponentProps<typeof Dial
37
37
  const dialogContentVariants = cva(
38
38
  [
39
39
  "bg-background fixed top-1/2 left-1/2 z-50 grid w-full -translate-x-1/2 -translate-y-1/2",
40
- "overflow-y-auto rounded-2xl px-6 shadow-lg outline-none",
40
+ "max-h-[calc(100vh-4rem)] overflow-hidden rounded-2xl px-6 shadow-lg outline-none",
41
41
  "data-[state=open]:animate-in data-[state=closed]:animate-out",
42
42
  "data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
43
43
  "data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95",
@@ -93,7 +93,7 @@ function DialogContent({ className, children, size, showCloseButton = true, ...p
93
93
  }
94
94
 
95
95
  function DialogHeader({ className, ...props }: React.ComponentProps<"div">) {
96
- return <div data-slot="dialog-header" className={cn("flex flex-col gap-0.5 pt-6 pr-10", className)} {...props} />;
96
+ return <div data-slot="dialog-header" className={cn("flex flex-col gap-0.5 py-6 pr-10", className)} {...props} />;
97
97
  }
98
98
 
99
99
  const dialogFooterVariants = cva("pb-6 pt-6", {
@@ -2,7 +2,7 @@
2
2
 
3
3
  import * as SelectPrimitive from "@radix-ui/react-select";
4
4
  import type { VariantProps } from "class-variance-authority";
5
- import { CheckIcon, ChevronDownIcon, ChevronUpIcon } from "lucide-react";
5
+ import { CheckIcon, ChevronDownIcon } from "lucide-react";
6
6
  import type * as React from "react";
7
7
 
8
8
  import { cn } from "../lib/cn";
@@ -75,7 +75,6 @@ function SelectContent({
75
75
  position={position}
76
76
  {...props}
77
77
  >
78
- <SelectScrollUpButton />
79
78
  <SelectPrimitive.Viewport
80
79
  className={cn(
81
80
  "p-1",
@@ -85,7 +84,6 @@ function SelectContent({
85
84
  >
86
85
  {children}
87
86
  </SelectPrimitive.Viewport>
88
- <SelectScrollDownButton />
89
87
  </SelectPrimitive.Content>
90
88
  </SelectPrimitive.Portal>
91
89
  );
@@ -110,7 +108,7 @@ function SelectItem({ className, children, ...props }: React.ComponentProps<type
110
108
  <SelectPrimitive.Item
111
109
  data-slot="select-item"
112
110
  className={cn(
113
- "relative flex w-full cursor-default items-center gap-2 rounded-sm py-2 pr-8 pl-2.5 outline-hidden select-none",
111
+ "relative flex cursor-default items-center gap-2 rounded-sm py-1.5 pl-2 outline-hidden select-none",
114
112
  "type-text-md font-medium text-foreground mx-1 my-px",
115
113
  "[@media(hover:hover)]:hover:bg-background-hover",
116
114
  "focus:bg-background-hover",
@@ -142,43 +140,12 @@ function SelectSeparator({ className, ...props }: React.ComponentProps<typeof Se
142
140
  );
143
141
  }
144
142
 
145
- /* ── Scroll buttons ──────────────────────────────────────────────────────── */
146
-
147
- function SelectScrollUpButton({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.ScrollUpButton>) {
148
- return (
149
- <SelectPrimitive.ScrollUpButton
150
- data-slot="select-scroll-up-button"
151
- className={cn("flex cursor-default items-center justify-center py-1", className)}
152
- {...props}
153
- >
154
- <ChevronUpIcon className="size-4" />
155
- </SelectPrimitive.ScrollUpButton>
156
- );
157
- }
158
-
159
- function SelectScrollDownButton({
160
- className,
161
- ...props
162
- }: React.ComponentProps<typeof SelectPrimitive.ScrollDownButton>) {
163
- return (
164
- <SelectPrimitive.ScrollDownButton
165
- data-slot="select-scroll-down-button"
166
- className={cn("flex cursor-default items-center justify-center py-1", className)}
167
- {...props}
168
- >
169
- <ChevronDownIcon className="size-4" />
170
- </SelectPrimitive.ScrollDownButton>
171
- );
172
- }
173
-
174
143
  export {
175
144
  Select,
176
145
  SelectContent,
177
146
  SelectGroup,
178
147
  SelectItem,
179
148
  SelectLabel,
180
- SelectScrollDownButton,
181
- SelectScrollUpButton,
182
149
  SelectSeparator,
183
150
  SelectTrigger,
184
151
  SelectValue,