@kubetail/ui 3.0.0-rc6-mm → 3.0.0-rc7-mm
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/elements/select.cjs
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../_virtual/_rolldown/runtime.cjs`);const e=require(`../lib/utils.cjs`);let t=require(`react/jsx-runtime`),n=require(`lucide-react`),
|
|
1
|
+
"use client";Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`}),require(`../_virtual/_rolldown/runtime.cjs`);const e=require(`../lib/utils.cjs`);let t=require(`react/jsx-runtime`),n=require(`class-variance-authority`),r=require(`lucide-react`),i=require(`@base-ui/react/select`);var a=(0,n.cva)(`flex w-fit items-center justify-between gap-1.5 rounded-lg border border-input bg-transparent py-2 pr-2 pl-2.5 text-sm whitespace-nowrap transition-colors outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4`,{variants:{size:{xs:`h-6`,sm:`h-8`,default:`h-9`,lg:`h-10`}},defaultVariants:{size:`default`}}),o=i.Select.Root;function s({className:n,...r}){return(0,t.jsx)(i.Select.Group,{"data-slot":`select-group`,className:e.cn(`scroll-my-1 p-1`,n),...r})}function c({className:n,...r}){return(0,t.jsx)(i.Select.Value,{"data-slot":`select-value`,className:e.cn(`flex flex-1 text-left`,n),...r})}function l({className:n,size:o=`default`,children:s,...c}){return(0,t.jsxs)(i.Select.Trigger,{"data-slot":`select-trigger`,"data-size":o,className:e.cn(a({size:o,className:n})),...c,children:[s,(0,t.jsx)(i.Select.Icon,{render:(0,t.jsx)(r.ChevronDownIcon,{className:`pointer-events-none size-4 text-muted-foreground`})})]})}function u({className:n,...a}){return(0,t.jsx)(i.Select.ScrollUpArrow,{"data-slot":`select-scroll-up-button`,className:e.cn(`top-0 z-10 flex w-full cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4`,n),...a,children:(0,t.jsx)(r.ChevronUpIcon,{})})}function d({className:n,...a}){return(0,t.jsx)(i.Select.ScrollDownArrow,{"data-slot":`select-scroll-down-button`,className:e.cn(`bottom-0 z-10 flex w-full cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4`,n),...a,children:(0,t.jsx)(r.ChevronDownIcon,{})})}function f({className:n,children:r,side:a=`bottom`,sideOffset:o=4,align:s=`center`,alignOffset:c=0,alignItemWithTrigger:l=!0,...f}){return(0,t.jsx)(i.Select.Portal,{children:(0,t.jsx)(i.Select.Positioner,{side:a,sideOffset:o,align:s,alignOffset:c,alignItemWithTrigger:l,className:`isolate z-50`,children:(0,t.jsxs)(i.Select.Popup,{"data-slot":`select-content`,"data-align-trigger":l,className:e.cn(`relative isolate z-50 max-h-(--available-height) w-(--anchor-width) min-w-36 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-lg bg-popover text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 data-[align-trigger=true]:animate-none data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-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 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95`,n),...f,children:[(0,t.jsx)(u,{}),(0,t.jsx)(i.Select.List,{children:r}),(0,t.jsx)(d,{})]})})})}function p({className:n,...r}){return(0,t.jsx)(i.Select.GroupLabel,{"data-slot":`select-label`,className:e.cn(`px-1.5 py-1 text-xs text-muted-foreground`,n),...r})}function m({className:n,children:a,...o}){return(0,t.jsxs)(i.Select.Item,{"data-slot":`select-item`,className:e.cn(`relative flex w-full cursor-default items-center gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2`,n),...o,children:[(0,t.jsx)(i.Select.ItemText,{className:`flex flex-1 shrink-0 gap-2 whitespace-nowrap`,children:a}),(0,t.jsx)(i.Select.ItemIndicator,{render:(0,t.jsx)(`span`,{className:`pointer-events-none absolute right-2 flex size-4 items-center justify-center`,children:(0,t.jsx)(r.CheckIcon,{className:`pointer-events-none`})})})]})}function h({className:n,...r}){return(0,t.jsx)(i.Select.Separator,{"data-slot":`select-separator`,className:e.cn(`pointer-events-none -mx-1 my-1 h-px bg-border`,n),...r})}exports.Select=o,exports.SelectContent=f,exports.SelectGroup=s,exports.SelectItem=m,exports.SelectLabel=p,exports.SelectScrollDownButton=d,exports.SelectScrollUpButton=u,exports.SelectSeparator=h,exports.SelectTrigger=l,exports.SelectValue=c,exports.selectTriggerVariants=a;
|
|
2
2
|
//# sourceMappingURL=select.cjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select.cjs","names":[],"sources":["../../src/elements/select.tsx"],"sourcesContent":["'use client';\n\nimport { Select as SelectPrimitive } from '@base-ui/react/select';\nimport { CheckIcon, ChevronDownIcon, ChevronUpIcon } from 'lucide-react';\n\nimport { cn } from '@/lib/utils';\n\nconst
|
|
1
|
+
{"version":3,"file":"select.cjs","names":[],"sources":["../../src/elements/select.tsx"],"sourcesContent":["'use client';\n\nimport { Select as SelectPrimitive } from '@base-ui/react/select';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { CheckIcon, ChevronDownIcon, ChevronUpIcon } from 'lucide-react';\n\nimport { cn } from '@/lib/utils';\n\nconst selectTriggerVariants = cva(\n \"flex w-fit items-center justify-between gap-1.5 rounded-lg border border-input bg-transparent py-2 pr-2 pl-2.5 text-sm whitespace-nowrap transition-colors outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n {\n variants: {\n size: {\n xs: 'h-6',\n sm: 'h-8',\n default: 'h-9',\n lg: 'h-10',\n },\n },\n defaultVariants: {\n size: 'default',\n },\n },\n);\n\ntype SelectTriggerVariantProps = VariantProps<typeof selectTriggerVariants>;\n\nconst Select = SelectPrimitive.Root;\n\nfunction SelectGroup({ className, ...props }: SelectPrimitive.Group.Props) {\n return <SelectPrimitive.Group data-slot=\"select-group\" className={cn('scroll-my-1 p-1', className)} {...props} />;\n}\n\nfunction SelectValue({ className, ...props }: SelectPrimitive.Value.Props) {\n return (\n <SelectPrimitive.Value data-slot=\"select-value\" className={cn('flex flex-1 text-left', className)} {...props} />\n );\n}\n\nfunction SelectTrigger({\n className,\n size = 'default',\n children,\n ...props\n}: SelectPrimitive.Trigger.Props & SelectTriggerVariantProps) {\n return (\n <SelectPrimitive.Trigger\n data-slot=\"select-trigger\"\n data-size={size}\n className={cn(selectTriggerVariants({ size, className }))}\n {...props}\n >\n {children}\n <SelectPrimitive.Icon render={<ChevronDownIcon className=\"pointer-events-none size-4 text-muted-foreground\" />} />\n </SelectPrimitive.Trigger>\n );\n}\n\nfunction SelectScrollUpButton({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.ScrollUpArrow>) {\n return (\n <SelectPrimitive.ScrollUpArrow\n data-slot=\"select-scroll-up-button\"\n className={cn(\n \"top-0 z-10 flex w-full cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n >\n <ChevronUpIcon />\n </SelectPrimitive.ScrollUpArrow>\n );\n}\n\nfunction SelectScrollDownButton({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.ScrollDownArrow>) {\n return (\n <SelectPrimitive.ScrollDownArrow\n data-slot=\"select-scroll-down-button\"\n className={cn(\n \"bottom-0 z-10 flex w-full cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n >\n <ChevronDownIcon />\n </SelectPrimitive.ScrollDownArrow>\n );\n}\n\nfunction SelectContent({\n className,\n children,\n side = 'bottom',\n sideOffset = 4,\n align = 'center',\n alignOffset = 0,\n alignItemWithTrigger = true,\n ...props\n}: SelectPrimitive.Popup.Props &\n Pick<SelectPrimitive.Positioner.Props, 'align' | 'alignOffset' | 'side' | 'sideOffset' | 'alignItemWithTrigger'>) {\n return (\n <SelectPrimitive.Portal>\n <SelectPrimitive.Positioner\n side={side}\n sideOffset={sideOffset}\n align={align}\n alignOffset={alignOffset}\n alignItemWithTrigger={alignItemWithTrigger}\n className=\"isolate z-50\"\n >\n <SelectPrimitive.Popup\n data-slot=\"select-content\"\n data-align-trigger={alignItemWithTrigger}\n className={cn(\n 'relative isolate z-50 max-h-(--available-height) w-(--anchor-width) min-w-36 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-lg bg-popover text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 data-[align-trigger=true]:animate-none data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-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 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95',\n className,\n )}\n {...props}\n >\n <SelectScrollUpButton />\n <SelectPrimitive.List>{children}</SelectPrimitive.List>\n <SelectScrollDownButton />\n </SelectPrimitive.Popup>\n </SelectPrimitive.Positioner>\n </SelectPrimitive.Portal>\n );\n}\n\nfunction SelectLabel({ className, ...props }: SelectPrimitive.GroupLabel.Props) {\n return (\n <SelectPrimitive.GroupLabel\n data-slot=\"select-label\"\n className={cn('px-1.5 py-1 text-xs text-muted-foreground', className)}\n {...props}\n />\n );\n}\n\nfunction SelectItem({ className, children, ...props }: SelectPrimitive.Item.Props) {\n return (\n <SelectPrimitive.Item\n data-slot=\"select-item\"\n className={cn(\n \"relative flex w-full cursor-default items-center gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2\",\n className,\n )}\n {...props}\n >\n <SelectPrimitive.ItemText className=\"flex flex-1 shrink-0 gap-2 whitespace-nowrap\">\n {children}\n </SelectPrimitive.ItemText>\n <SelectPrimitive.ItemIndicator\n render={\n <span className=\"pointer-events-none absolute right-2 flex size-4 items-center justify-center\">\n <CheckIcon className=\"pointer-events-none\" />\n </span>\n }\n />\n </SelectPrimitive.Item>\n );\n}\n\nfunction SelectSeparator({ className, ...props }: SelectPrimitive.Separator.Props) {\n return (\n <SelectPrimitive.Separator\n data-slot=\"select-separator\"\n className={cn('pointer-events-none -mx-1 my-1 h-px bg-border', className)}\n {...props}\n />\n );\n}\n\nexport {\n Select,\n SelectContent,\n SelectGroup,\n SelectItem,\n SelectLabel,\n SelectScrollDownButton,\n SelectScrollUpButton,\n SelectSeparator,\n SelectTrigger,\n selectTriggerVariants,\n SelectValue,\n};\nexport type { SelectTriggerVariantProps };\n"],"mappings":"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"}
|
|
@@ -1,14 +1,18 @@
|
|
|
1
1
|
import { Select as SelectPrimitive } from '@base-ui/react/select';
|
|
2
|
+
import { type VariantProps } from 'class-variance-authority';
|
|
3
|
+
declare const selectTriggerVariants: (props?: ({
|
|
4
|
+
size?: "default" | "sm" | "lg" | "xs" | null | undefined;
|
|
5
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
6
|
+
type SelectTriggerVariantProps = VariantProps<typeof selectTriggerVariants>;
|
|
2
7
|
declare const Select: typeof SelectPrimitive.Root;
|
|
3
8
|
declare function SelectGroup({ className, ...props }: SelectPrimitive.Group.Props): import("react/jsx-runtime").JSX.Element;
|
|
4
9
|
declare function SelectValue({ className, ...props }: SelectPrimitive.Value.Props): import("react/jsx-runtime").JSX.Element;
|
|
5
|
-
declare function SelectTrigger({ className, size, children, ...props }: SelectPrimitive.Trigger.Props &
|
|
6
|
-
size?: 'sm' | 'default';
|
|
7
|
-
}): import("react/jsx-runtime").JSX.Element;
|
|
10
|
+
declare function SelectTrigger({ className, size, children, ...props }: SelectPrimitive.Trigger.Props & SelectTriggerVariantProps): import("react/jsx-runtime").JSX.Element;
|
|
8
11
|
declare function SelectScrollUpButton({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.ScrollUpArrow>): import("react/jsx-runtime").JSX.Element;
|
|
9
12
|
declare function SelectScrollDownButton({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.ScrollDownArrow>): import("react/jsx-runtime").JSX.Element;
|
|
10
13
|
declare function SelectContent({ className, children, side, sideOffset, align, alignOffset, alignItemWithTrigger, ...props }: SelectPrimitive.Popup.Props & Pick<SelectPrimitive.Positioner.Props, 'align' | 'alignOffset' | 'side' | 'sideOffset' | 'alignItemWithTrigger'>): import("react/jsx-runtime").JSX.Element;
|
|
11
14
|
declare function SelectLabel({ className, ...props }: SelectPrimitive.GroupLabel.Props): import("react/jsx-runtime").JSX.Element;
|
|
12
15
|
declare function SelectItem({ className, children, ...props }: SelectPrimitive.Item.Props): import("react/jsx-runtime").JSX.Element;
|
|
13
16
|
declare function SelectSeparator({ className, ...props }: SelectPrimitive.Separator.Props): import("react/jsx-runtime").JSX.Element;
|
|
14
|
-
export { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, };
|
|
17
|
+
export { Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, selectTriggerVariants, SelectValue, };
|
|
18
|
+
export type { SelectTriggerVariantProps };
|
package/dist/elements/select.js
CHANGED
|
@@ -1,99 +1,111 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { cn as e } from "../lib/utils.js";
|
|
3
3
|
import { jsx as t, jsxs as n } from "react/jsx-runtime";
|
|
4
|
-
import {
|
|
5
|
-
import {
|
|
4
|
+
import { cva as r } from "class-variance-authority";
|
|
5
|
+
import { CheckIcon as i, ChevronDownIcon as a, ChevronUpIcon as o } from "lucide-react";
|
|
6
|
+
import { Select as s } from "@base-ui/react/select";
|
|
6
7
|
//#region src/elements/select.tsx
|
|
7
|
-
var
|
|
8
|
-
|
|
9
|
-
|
|
8
|
+
var c = r("flex w-fit items-center justify-between gap-1.5 rounded-lg border border-input bg-transparent py-2 pr-2 pl-2.5 text-sm whitespace-nowrap transition-colors outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", {
|
|
9
|
+
variants: { size: {
|
|
10
|
+
xs: "h-6",
|
|
11
|
+
sm: "h-8",
|
|
12
|
+
default: "h-9",
|
|
13
|
+
lg: "h-10"
|
|
14
|
+
} },
|
|
15
|
+
defaultVariants: { size: "default" }
|
|
16
|
+
}), l = s.Root;
|
|
17
|
+
function u({ className: n, ...r }) {
|
|
18
|
+
return /* @__PURE__ */ t(s.Group, {
|
|
10
19
|
"data-slot": "select-group",
|
|
11
20
|
className: e("scroll-my-1 p-1", n),
|
|
12
21
|
...r
|
|
13
22
|
});
|
|
14
23
|
}
|
|
15
|
-
function
|
|
16
|
-
return /* @__PURE__ */ t(
|
|
24
|
+
function d({ className: n, ...r }) {
|
|
25
|
+
return /* @__PURE__ */ t(s.Value, {
|
|
17
26
|
"data-slot": "select-value",
|
|
18
27
|
className: e("flex flex-1 text-left", n),
|
|
19
28
|
...r
|
|
20
29
|
});
|
|
21
30
|
}
|
|
22
|
-
function
|
|
23
|
-
return /* @__PURE__ */ n(
|
|
31
|
+
function f({ className: r, size: i = "default", children: o, ...l }) {
|
|
32
|
+
return /* @__PURE__ */ n(s.Trigger, {
|
|
24
33
|
"data-slot": "select-trigger",
|
|
25
|
-
"data-size":
|
|
26
|
-
className: e(
|
|
27
|
-
|
|
28
|
-
|
|
34
|
+
"data-size": i,
|
|
35
|
+
className: e(c({
|
|
36
|
+
size: i,
|
|
37
|
+
className: r
|
|
38
|
+
})),
|
|
39
|
+
...l,
|
|
40
|
+
children: [o, /* @__PURE__ */ t(s.Icon, { render: /* @__PURE__ */ t(a, { className: "pointer-events-none size-4 text-muted-foreground" }) })]
|
|
29
41
|
});
|
|
30
42
|
}
|
|
31
|
-
function
|
|
32
|
-
return /* @__PURE__ */ t(
|
|
43
|
+
function p({ className: n, ...r }) {
|
|
44
|
+
return /* @__PURE__ */ t(s.ScrollUpArrow, {
|
|
33
45
|
"data-slot": "select-scroll-up-button",
|
|
34
46
|
className: e("top-0 z-10 flex w-full cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4", n),
|
|
35
47
|
...r,
|
|
36
|
-
children: /* @__PURE__ */ t(
|
|
48
|
+
children: /* @__PURE__ */ t(o, {})
|
|
37
49
|
});
|
|
38
50
|
}
|
|
39
|
-
function
|
|
40
|
-
return /* @__PURE__ */ t(
|
|
51
|
+
function m({ className: n, ...r }) {
|
|
52
|
+
return /* @__PURE__ */ t(s.ScrollDownArrow, {
|
|
41
53
|
"data-slot": "select-scroll-down-button",
|
|
42
54
|
className: e("bottom-0 z-10 flex w-full cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4", n),
|
|
43
55
|
...r,
|
|
44
|
-
children: /* @__PURE__ */ t(
|
|
56
|
+
children: /* @__PURE__ */ t(a, {})
|
|
45
57
|
});
|
|
46
58
|
}
|
|
47
|
-
function
|
|
48
|
-
return /* @__PURE__ */ t(
|
|
59
|
+
function h({ className: r, children: i, side: a = "bottom", sideOffset: o = 4, align: c = "center", alignOffset: l = 0, alignItemWithTrigger: u = !0, ...d }) {
|
|
60
|
+
return /* @__PURE__ */ t(s.Portal, { children: /* @__PURE__ */ t(s.Positioner, {
|
|
49
61
|
side: a,
|
|
50
|
-
sideOffset:
|
|
62
|
+
sideOffset: o,
|
|
51
63
|
align: c,
|
|
52
64
|
alignOffset: l,
|
|
53
65
|
alignItemWithTrigger: u,
|
|
54
66
|
className: "isolate z-50",
|
|
55
|
-
children: /* @__PURE__ */ n(
|
|
67
|
+
children: /* @__PURE__ */ n(s.Popup, {
|
|
56
68
|
"data-slot": "select-content",
|
|
57
69
|
"data-align-trigger": u,
|
|
58
70
|
className: e("relative isolate z-50 max-h-(--available-height) w-(--anchor-width) min-w-36 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-lg bg-popover text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 data-[align-trigger=true]:animate-none data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-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 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95", r),
|
|
59
|
-
...
|
|
71
|
+
...d,
|
|
60
72
|
children: [
|
|
61
|
-
/* @__PURE__ */ t(
|
|
62
|
-
/* @__PURE__ */ t(
|
|
63
|
-
/* @__PURE__ */ t(
|
|
73
|
+
/* @__PURE__ */ t(p, {}),
|
|
74
|
+
/* @__PURE__ */ t(s.List, { children: i }),
|
|
75
|
+
/* @__PURE__ */ t(m, {})
|
|
64
76
|
]
|
|
65
77
|
})
|
|
66
78
|
}) });
|
|
67
79
|
}
|
|
68
|
-
function
|
|
69
|
-
return /* @__PURE__ */ t(
|
|
80
|
+
function g({ className: n, ...r }) {
|
|
81
|
+
return /* @__PURE__ */ t(s.GroupLabel, {
|
|
70
82
|
"data-slot": "select-label",
|
|
71
83
|
className: e("px-1.5 py-1 text-xs text-muted-foreground", n),
|
|
72
84
|
...r
|
|
73
85
|
});
|
|
74
86
|
}
|
|
75
|
-
function
|
|
76
|
-
return /* @__PURE__ */ n(
|
|
87
|
+
function _({ className: r, children: a, ...o }) {
|
|
88
|
+
return /* @__PURE__ */ n(s.Item, {
|
|
77
89
|
"data-slot": "select-item",
|
|
78
|
-
className: e("relative flex w-full cursor-default items-center gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2",
|
|
79
|
-
...
|
|
80
|
-
children: [/* @__PURE__ */ t(
|
|
90
|
+
className: e("relative flex w-full cursor-default items-center gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2", r),
|
|
91
|
+
...o,
|
|
92
|
+
children: [/* @__PURE__ */ t(s.ItemText, {
|
|
81
93
|
className: "flex flex-1 shrink-0 gap-2 whitespace-nowrap",
|
|
82
94
|
children: a
|
|
83
|
-
}), /* @__PURE__ */ t(
|
|
95
|
+
}), /* @__PURE__ */ t(s.ItemIndicator, { render: /* @__PURE__ */ t("span", {
|
|
84
96
|
className: "pointer-events-none absolute right-2 flex size-4 items-center justify-center",
|
|
85
|
-
children: /* @__PURE__ */ t(
|
|
97
|
+
children: /* @__PURE__ */ t(i, { className: "pointer-events-none" })
|
|
86
98
|
}) })]
|
|
87
99
|
});
|
|
88
100
|
}
|
|
89
|
-
function
|
|
90
|
-
return /* @__PURE__ */ t(
|
|
101
|
+
function v({ className: n, ...r }) {
|
|
102
|
+
return /* @__PURE__ */ t(s.Separator, {
|
|
91
103
|
"data-slot": "select-separator",
|
|
92
104
|
className: e("pointer-events-none -mx-1 my-1 h-px bg-border", n),
|
|
93
105
|
...r
|
|
94
106
|
});
|
|
95
107
|
}
|
|
96
108
|
//#endregion
|
|
97
|
-
export {
|
|
109
|
+
export { l as Select, h as SelectContent, u as SelectGroup, _ as SelectItem, g as SelectLabel, m as SelectScrollDownButton, p as SelectScrollUpButton, v as SelectSeparator, f as SelectTrigger, d as SelectValue, c as selectTriggerVariants };
|
|
98
110
|
|
|
99
111
|
//# sourceMappingURL=select.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"select.js","names":[],"sources":["../../src/elements/select.tsx"],"sourcesContent":["'use client';\n\nimport { Select as SelectPrimitive } from '@base-ui/react/select';\nimport { CheckIcon, ChevronDownIcon, ChevronUpIcon } from 'lucide-react';\n\nimport { cn } from '@/lib/utils';\n\nconst
|
|
1
|
+
{"version":3,"file":"select.js","names":[],"sources":["../../src/elements/select.tsx"],"sourcesContent":["'use client';\n\nimport { Select as SelectPrimitive } from '@base-ui/react/select';\nimport { cva, type VariantProps } from 'class-variance-authority';\nimport { CheckIcon, ChevronDownIcon, ChevronUpIcon } from 'lucide-react';\n\nimport { cn } from '@/lib/utils';\n\nconst selectTriggerVariants = cva(\n \"flex w-fit items-center justify-between gap-1.5 rounded-lg border border-input bg-transparent py-2 pr-2 pl-2.5 text-sm whitespace-nowrap transition-colors outline-none select-none focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 data-placeholder:text-muted-foreground *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-1.5 dark:bg-input/30 dark:hover:bg-input/50 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4\",\n {\n variants: {\n size: {\n xs: 'h-6',\n sm: 'h-8',\n default: 'h-9',\n lg: 'h-10',\n },\n },\n defaultVariants: {\n size: 'default',\n },\n },\n);\n\ntype SelectTriggerVariantProps = VariantProps<typeof selectTriggerVariants>;\n\nconst Select = SelectPrimitive.Root;\n\nfunction SelectGroup({ className, ...props }: SelectPrimitive.Group.Props) {\n return <SelectPrimitive.Group data-slot=\"select-group\" className={cn('scroll-my-1 p-1', className)} {...props} />;\n}\n\nfunction SelectValue({ className, ...props }: SelectPrimitive.Value.Props) {\n return (\n <SelectPrimitive.Value data-slot=\"select-value\" className={cn('flex flex-1 text-left', className)} {...props} />\n );\n}\n\nfunction SelectTrigger({\n className,\n size = 'default',\n children,\n ...props\n}: SelectPrimitive.Trigger.Props & SelectTriggerVariantProps) {\n return (\n <SelectPrimitive.Trigger\n data-slot=\"select-trigger\"\n data-size={size}\n className={cn(selectTriggerVariants({ size, className }))}\n {...props}\n >\n {children}\n <SelectPrimitive.Icon render={<ChevronDownIcon className=\"pointer-events-none size-4 text-muted-foreground\" />} />\n </SelectPrimitive.Trigger>\n );\n}\n\nfunction SelectScrollUpButton({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.ScrollUpArrow>) {\n return (\n <SelectPrimitive.ScrollUpArrow\n data-slot=\"select-scroll-up-button\"\n className={cn(\n \"top-0 z-10 flex w-full cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n >\n <ChevronUpIcon />\n </SelectPrimitive.ScrollUpArrow>\n );\n}\n\nfunction SelectScrollDownButton({ className, ...props }: React.ComponentProps<typeof SelectPrimitive.ScrollDownArrow>) {\n return (\n <SelectPrimitive.ScrollDownArrow\n data-slot=\"select-scroll-down-button\"\n className={cn(\n \"bottom-0 z-10 flex w-full cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4\",\n className,\n )}\n {...props}\n >\n <ChevronDownIcon />\n </SelectPrimitive.ScrollDownArrow>\n );\n}\n\nfunction SelectContent({\n className,\n children,\n side = 'bottom',\n sideOffset = 4,\n align = 'center',\n alignOffset = 0,\n alignItemWithTrigger = true,\n ...props\n}: SelectPrimitive.Popup.Props &\n Pick<SelectPrimitive.Positioner.Props, 'align' | 'alignOffset' | 'side' | 'sideOffset' | 'alignItemWithTrigger'>) {\n return (\n <SelectPrimitive.Portal>\n <SelectPrimitive.Positioner\n side={side}\n sideOffset={sideOffset}\n align={align}\n alignOffset={alignOffset}\n alignItemWithTrigger={alignItemWithTrigger}\n className=\"isolate z-50\"\n >\n <SelectPrimitive.Popup\n data-slot=\"select-content\"\n data-align-trigger={alignItemWithTrigger}\n className={cn(\n 'relative isolate z-50 max-h-(--available-height) w-(--anchor-width) min-w-36 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-lg bg-popover text-popover-foreground shadow-md ring-1 ring-foreground/10 duration-100 data-[align-trigger=true]:animate-none data-[side=bottom]:slide-in-from-top-2 data-[side=inline-end]:slide-in-from-left-2 data-[side=inline-start]:slide-in-from-right-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 data-open:animate-in data-open:fade-in-0 data-open:zoom-in-95 data-closed:animate-out data-closed:fade-out-0 data-closed:zoom-out-95',\n className,\n )}\n {...props}\n >\n <SelectScrollUpButton />\n <SelectPrimitive.List>{children}</SelectPrimitive.List>\n <SelectScrollDownButton />\n </SelectPrimitive.Popup>\n </SelectPrimitive.Positioner>\n </SelectPrimitive.Portal>\n );\n}\n\nfunction SelectLabel({ className, ...props }: SelectPrimitive.GroupLabel.Props) {\n return (\n <SelectPrimitive.GroupLabel\n data-slot=\"select-label\"\n className={cn('px-1.5 py-1 text-xs text-muted-foreground', className)}\n {...props}\n />\n );\n}\n\nfunction SelectItem({ className, children, ...props }: SelectPrimitive.Item.Props) {\n return (\n <SelectPrimitive.Item\n data-slot=\"select-item\"\n className={cn(\n \"relative flex w-full cursor-default items-center gap-1.5 rounded-md py-1 pr-8 pl-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2\",\n className,\n )}\n {...props}\n >\n <SelectPrimitive.ItemText className=\"flex flex-1 shrink-0 gap-2 whitespace-nowrap\">\n {children}\n </SelectPrimitive.ItemText>\n <SelectPrimitive.ItemIndicator\n render={\n <span className=\"pointer-events-none absolute right-2 flex size-4 items-center justify-center\">\n <CheckIcon className=\"pointer-events-none\" />\n </span>\n }\n />\n </SelectPrimitive.Item>\n );\n}\n\nfunction SelectSeparator({ className, ...props }: SelectPrimitive.Separator.Props) {\n return (\n <SelectPrimitive.Separator\n data-slot=\"select-separator\"\n className={cn('pointer-events-none -mx-1 my-1 h-px bg-border', className)}\n {...props}\n />\n );\n}\n\nexport {\n Select,\n SelectContent,\n SelectGroup,\n SelectItem,\n SelectLabel,\n SelectScrollDownButton,\n SelectScrollUpButton,\n SelectSeparator,\n SelectTrigger,\n selectTriggerVariants,\n SelectValue,\n};\nexport type { SelectTriggerVariantProps };\n"],"mappings":";;;;;;;AAQA,IAAM,IAAwB,EAC5B,wwBACA;CACE,UAAU,EACR,MAAM;EACJ,IAAI;EACJ,IAAI;EACJ,SAAS;EACT,IAAI;EACL,EACF;CACD,iBAAiB,EACf,MAAM,WACP;CACF,CACF,EAIK,IAAS,EAAgB;AAE/B,SAAS,EAAY,EAAE,cAAW,GAAG,KAAsC;AACzE,QAAO,kBAAC,EAAgB,OAAjB;EAAuB,aAAU;EAAe,WAAW,EAAG,mBAAmB,EAAU;EAAE,GAAI;EAAS,CAAA;;AAGnH,SAAS,EAAY,EAAE,cAAW,GAAG,KAAsC;AACzE,QACE,kBAAC,EAAgB,OAAjB;EAAuB,aAAU;EAAe,WAAW,EAAG,yBAAyB,EAAU;EAAE,GAAI;EAAS,CAAA;;AAIpH,SAAS,EAAc,EACrB,cACA,UAAO,WACP,aACA,GAAG,KACyD;AAC5D,QACE,kBAAC,EAAgB,SAAjB;EACE,aAAU;EACV,aAAW;EACX,WAAW,EAAG,EAAsB;GAAE;GAAM;GAAW,CAAC,CAAC;EACzD,GAAI;YAJN,CAMG,GACD,kBAAC,EAAgB,MAAjB,EAAsB,QAAQ,kBAAC,GAAD,EAAiB,WAAU,oDAAqD,CAAA,EAAI,CAAA,CAC1F;;;AAI9B,SAAS,EAAqB,EAAE,cAAW,GAAG,KAAqE;AACjH,QACE,kBAAC,EAAgB,eAAjB;EACE,aAAU;EACV,WAAW,EACT,0HACA,EACD;EACD,GAAI;YAEJ,kBAAC,GAAD,EAAiB,CAAA;EACa,CAAA;;AAIpC,SAAS,EAAuB,EAAE,cAAW,GAAG,KAAuE;AACrH,QACE,kBAAC,EAAgB,iBAAjB;EACE,aAAU;EACV,WAAW,EACT,6HACA,EACD;EACD,GAAI;YAEJ,kBAAC,GAAD,EAAmB,CAAA;EACa,CAAA;;AAItC,SAAS,EAAc,EACrB,cACA,aACA,UAAO,UACP,gBAAa,GACb,WAAQ,UACR,iBAAc,GACd,0BAAuB,IACvB,GAAG,KAE+G;AAClH,QACE,kBAAC,EAAgB,QAAjB,EAAA,UACE,kBAAC,EAAgB,YAAjB;EACQ;EACM;EACL;EACM;EACS;EACtB,WAAU;YAEV,kBAAC,EAAgB,OAAjB;GACE,aAAU;GACV,sBAAoB;GACpB,WAAW,EACT,gpBACA,EACD;GACD,GAAI;aAPN;IASE,kBAAC,GAAD,EAAwB,CAAA;IACxB,kBAAC,EAAgB,MAAjB,EAAuB,aAAgC,CAAA;IACvD,kBAAC,GAAD,EAA0B,CAAA;IACJ;;EACG,CAAA,EACN,CAAA;;AAI7B,SAAS,EAAY,EAAE,cAAW,GAAG,KAA2C;AAC9E,QACE,kBAAC,EAAgB,YAAjB;EACE,aAAU;EACV,WAAW,EAAG,6CAA6C,EAAU;EACrE,GAAI;EACJ,CAAA;;AAIN,SAAS,EAAW,EAAE,cAAW,aAAU,GAAG,KAAqC;AACjF,QACE,kBAAC,EAAgB,MAAjB;EACE,aAAU;EACV,WAAW,EACT,sbACA,EACD;EACD,GAAI;YANN,CAQE,kBAAC,EAAgB,UAAjB;GAA0B,WAAU;GACjC;GACwB,CAAA,EAC3B,kBAAC,EAAgB,eAAjB,EACE,QACE,kBAAC,QAAD;GAAM,WAAU;aACd,kBAAC,GAAD,EAAW,WAAU,uBAAwB,CAAA;GACxC,CAAA,EAET,CAAA,CACmB;;;AAI3B,SAAS,EAAgB,EAAE,cAAW,GAAG,KAA0C;AACjF,QACE,kBAAC,EAAgB,WAAjB;EACE,aAAU;EACV,WAAW,EAAG,iDAAiD,EAAU;EACzE,GAAI;EACJ,CAAA"}
|
package/dist/index.css
CHANGED
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
--card-foreground: oklch(0.3211 0 0);
|
|
10
10
|
--popover: oklch(1.0000 0 0);
|
|
11
11
|
--popover-foreground: oklch(0.3211 0 0);
|
|
12
|
-
--primary: oklch(0.
|
|
12
|
+
--primary: oklch(0.563 0.194 262.62);
|
|
13
13
|
--primary-foreground: oklch(1.0000 0 0);
|
|
14
14
|
--secondary: oklch(0.9670 0.0029 264.5419);
|
|
15
15
|
--secondary-foreground: oklch(0.4461 0.0263 256.8018);
|