@next-degree/pickle-shared-js 0.3.22 → 0.3.23
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/app/layout.css +22 -5
- package/dist/app/layout.css.map +1 -1
- package/dist/app/page.cjs +249 -4
- package/dist/app/page.cjs.map +1 -1
- package/dist/app/page.js +254 -4
- package/dist/app/page.js.map +1 -1
- package/dist/components/demos/SelectDemo.cjs +323 -0
- package/dist/components/demos/SelectDemo.cjs.map +1 -0
- package/dist/components/demos/SelectDemo.d.cts +5 -0
- package/dist/components/demos/SelectDemo.d.ts +5 -0
- package/dist/components/demos/SelectDemo.js +295 -0
- package/dist/components/demos/SelectDemo.js.map +1 -0
- package/dist/components/demos/index.cjs +247 -2
- package/dist/components/demos/index.cjs.map +1 -1
- package/dist/components/demos/index.js +252 -2
- package/dist/components/demos/index.js.map +1 -1
- package/dist/components/ui/ErrorMessage.cjs +41 -0
- package/dist/components/ui/ErrorMessage.cjs.map +1 -0
- package/dist/components/ui/ErrorMessage.d.cts +9 -0
- package/dist/components/ui/ErrorMessage.d.ts +9 -0
- package/dist/components/ui/ErrorMessage.js +18 -0
- package/dist/components/ui/ErrorMessage.js.map +1 -0
- package/dist/components/ui/Select.cjs +124 -105
- package/dist/components/ui/Select.cjs.map +1 -1
- package/dist/components/ui/Select.d.cts +3 -1
- package/dist/components/ui/Select.d.ts +3 -1
- package/dist/components/ui/Select.js +124 -105
- package/dist/components/ui/Select.js.map +1 -1
- package/dist/index.cjs +191 -172
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +177 -158
- package/dist/index.js.map +1 -1
- package/dist/styles/globals.css +22 -5
- package/dist/styles/globals.css.map +1 -1
- package/package.json +1 -1
|
@@ -45,11 +45,19 @@ function cn(...inputs) {
|
|
|
45
45
|
return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
|
|
46
46
|
}
|
|
47
47
|
|
|
48
|
-
// src/components/ui/
|
|
48
|
+
// src/components/ui/ErrorMessage.tsx
|
|
49
49
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
50
|
+
function ErrorMessage({ message, className, ...props }) {
|
|
51
|
+
if (!message) return null;
|
|
52
|
+
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { className: cn("px-1 text-xs text-red-600", className), ...props, children: message });
|
|
53
|
+
}
|
|
54
|
+
var ErrorMessage_default = ErrorMessage;
|
|
55
|
+
|
|
56
|
+
// src/components/ui/Label.tsx
|
|
57
|
+
var import_jsx_runtime2 = require("react/jsx-runtime");
|
|
50
58
|
function Label({ text, className, ...props }) {
|
|
51
59
|
if (!text) return null;
|
|
52
|
-
return /* @__PURE__ */ (0,
|
|
60
|
+
return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
|
|
53
61
|
"label",
|
|
54
62
|
{
|
|
55
63
|
className: cn(
|
|
@@ -66,8 +74,8 @@ var Label_default = Label;
|
|
|
66
74
|
// src/components/ui/Chip.tsx
|
|
67
75
|
var import_cva = require("cva");
|
|
68
76
|
var import_tailwind_merge2 = require("tailwind-merge");
|
|
69
|
-
var
|
|
70
|
-
var Chip = ({ className, variant, size, ...props }) => /* @__PURE__ */ (0,
|
|
77
|
+
var import_jsx_runtime3 = require("react/jsx-runtime");
|
|
78
|
+
var Chip = ({ className, variant, size, ...props }) => /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: (0, import_tailwind_merge2.twMerge)(chipVariants({ variant, size, className })), ...props });
|
|
71
79
|
var chipVariants = (0, import_cva.cva)(["flex", "items-center", "rounded-3xl", "border", "w-fit"], {
|
|
72
80
|
variants: {
|
|
73
81
|
variant: {
|
|
@@ -92,8 +100,8 @@ var Chip_default = Chip;
|
|
|
92
100
|
// src/components/primitives/separator.tsx
|
|
93
101
|
var SeparatorPrimitive = __toESM(require("@radix-ui/react-separator"), 1);
|
|
94
102
|
var React = __toESM(require("react"), 1);
|
|
95
|
-
var
|
|
96
|
-
var Separator = React.forwardRef(({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ (0,
|
|
103
|
+
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
104
|
+
var Separator = React.forwardRef(({ className, orientation = "horizontal", decorative = true, ...props }, ref) => /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
97
105
|
SeparatorPrimitive.Root,
|
|
98
106
|
{
|
|
99
107
|
ref,
|
|
@@ -110,9 +118,9 @@ var Separator = React.forwardRef(({ className, orientation = "horizontal", decor
|
|
|
110
118
|
Separator.displayName = SeparatorPrimitive.Root.displayName;
|
|
111
119
|
|
|
112
120
|
// src/components/ui/Select.tsx
|
|
113
|
-
var
|
|
121
|
+
var import_jsx_runtime5 = require("react/jsx-runtime");
|
|
114
122
|
var Select = (0, import_react.forwardRef)(
|
|
115
|
-
({ label, options, placeholder, multiselect, classNames, ...props }, ref) => {
|
|
123
|
+
({ label, options, placeholder, multiselect, classNames, error, id, ...props }, ref) => {
|
|
116
124
|
const { value, defaultValue, dir, className, onChange, ...rest } = props;
|
|
117
125
|
const [selected, setSelected] = (0, import_react.useState)([]);
|
|
118
126
|
const [open, setOpen] = (0, import_react.useState)(false);
|
|
@@ -142,104 +150,115 @@ var Select = (0, import_react.forwardRef)(
|
|
|
142
150
|
});
|
|
143
151
|
onChange?.(multiselect ? newSelected : newValue);
|
|
144
152
|
}
|
|
145
|
-
return /* @__PURE__ */ (0,
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
"
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
className: "z-10 max-h-[var(--radix-select-content-available-height)] w-[var(--radix-select-trigger-width)] overflow-hidden rounded-md bg-white py-2 shadow-lg",
|
|
188
|
-
position: "popper",
|
|
189
|
-
sideOffset: 4,
|
|
190
|
-
onPointerDownOutside: toggleOpen,
|
|
191
|
-
onKeyDown: closeOnEscape,
|
|
192
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(SelectPrimitive.Viewport, { children: [
|
|
193
|
-
multiselect && !!chipLabels?.length && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
194
|
-
SelectPrimitive.Group,
|
|
195
|
-
{
|
|
196
|
-
className: "mb-2 flex flex-row flex-wrap gap-1 px-2",
|
|
197
|
-
"data-testid": "selected-labels",
|
|
198
|
-
children: chipLabels?.map(
|
|
199
|
-
(chip) => chip && /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(Chip_default, { size: "small", variant: "primary", children: [
|
|
200
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { children: chip.title }),
|
|
201
|
-
/* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
|
|
202
|
-
import_lucide_react.X,
|
|
203
|
-
{
|
|
204
|
-
size: 18,
|
|
205
|
-
"data-testid": `chip-remove-${chip.value}`,
|
|
206
|
-
className: "cursor-pointer",
|
|
207
|
-
onClick: () => handleChange(chip.value)
|
|
208
|
-
}
|
|
209
|
-
)
|
|
210
|
-
] }, chip.title)
|
|
153
|
+
return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
154
|
+
"div",
|
|
155
|
+
{
|
|
156
|
+
className: cn("flex flex-col space-y-1", className),
|
|
157
|
+
ref: containerRef,
|
|
158
|
+
"data-testid": `${(label ?? id)?.toLowerCase()}-select-element`,
|
|
159
|
+
children: [
|
|
160
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Label_default, { text: label, className: classNames?.label }),
|
|
161
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
162
|
+
SelectPrimitive.Root,
|
|
163
|
+
{
|
|
164
|
+
open,
|
|
165
|
+
value: selected.join(","),
|
|
166
|
+
onOpenChange: handleOnOpenChange,
|
|
167
|
+
onValueChange: multiselect ? void 0 : handleChange,
|
|
168
|
+
defaultValue: typeof defaultValue === "string" ? defaultValue : void 0,
|
|
169
|
+
dir: dir === "rtl" ? "rtl" : "ltr",
|
|
170
|
+
...rest,
|
|
171
|
+
children: [
|
|
172
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
173
|
+
SelectPrimitive.Trigger,
|
|
174
|
+
{
|
|
175
|
+
ref,
|
|
176
|
+
className: cn(
|
|
177
|
+
"group flex h-11 min-w-80 flex-row items-center justify-between gap-3 rounded-lg border px-4 py-3 text-sm font-normal focus:outline-purple-100 disabled:bg-grey-5 data-[placeholder]:text-grey-50 data-[placeholder]:disabled:text-grey-40",
|
|
178
|
+
classNames?.trigger
|
|
179
|
+
),
|
|
180
|
+
children: [
|
|
181
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "truncate", children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
182
|
+
SelectPrimitive.Value,
|
|
183
|
+
{
|
|
184
|
+
placeholder: placeholder ?? "Select an option",
|
|
185
|
+
"aria-label": handleLabels(),
|
|
186
|
+
children: handleLabels()
|
|
187
|
+
}
|
|
188
|
+
) }),
|
|
189
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
190
|
+
import_lucide_react.ChevronDownIcon,
|
|
191
|
+
{
|
|
192
|
+
className: "transform text-black group-data-[state=open]:rotate-180",
|
|
193
|
+
size: "16"
|
|
194
|
+
}
|
|
211
195
|
)
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
196
|
+
]
|
|
197
|
+
}
|
|
198
|
+
),
|
|
199
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SelectPrimitive.Portal, { container: containerRef.current, children: /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
200
|
+
SelectPrimitive.Content,
|
|
201
|
+
{
|
|
202
|
+
hideWhenDetached: true,
|
|
203
|
+
className: "z-10 max-h-[var(--radix-select-content-available-height)] w-[var(--radix-select-trigger-width)] overflow-hidden rounded-md bg-white py-2 shadow-lg",
|
|
204
|
+
position: "popper",
|
|
205
|
+
sideOffset: 4,
|
|
206
|
+
onPointerDownOutside: toggleOpen,
|
|
207
|
+
onKeyDown: closeOnEscape,
|
|
208
|
+
children: /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(SelectPrimitive.Viewport, { children: [
|
|
209
|
+
multiselect && !!chipLabels?.length && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
210
|
+
SelectPrimitive.Group,
|
|
211
|
+
{
|
|
212
|
+
className: "mb-2 flex flex-row flex-wrap gap-1 px-2",
|
|
213
|
+
"data-testid": "selected-labels",
|
|
214
|
+
children: chipLabels?.map(
|
|
215
|
+
(chip) => chip && /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(Chip_default, { size: "small", variant: "primary", children: [
|
|
216
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { children: chip.title }),
|
|
217
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
218
|
+
import_lucide_react.X,
|
|
219
|
+
{
|
|
220
|
+
size: 18,
|
|
221
|
+
"data-testid": `chip-remove-${chip.value}`,
|
|
222
|
+
className: "cursor-pointer",
|
|
223
|
+
onClick: () => handleChange(chip.value)
|
|
224
|
+
}
|
|
225
|
+
)
|
|
226
|
+
] }, chip.title)
|
|
227
|
+
)
|
|
228
|
+
}
|
|
229
|
+
),
|
|
230
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Separator, {}),
|
|
231
|
+
options?.map(({ id: id2, title, value: value2 }) => /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
|
|
232
|
+
SelectPrimitive.Item,
|
|
233
|
+
{
|
|
234
|
+
value: value2,
|
|
235
|
+
className: "group relative cursor-pointer px-4 py-2 text-left text-sm hover:bg-purple-50 focus:bg-purple-50 focus:outline-none data-[state=checked]:bg-purple-50 data-[state=checked]:pr-10 data-[state=checked]:text-purple-100",
|
|
236
|
+
"data-state": selected.includes(value2) ? "checked" : "unchecked",
|
|
237
|
+
onKeyDown: (e) => setValueOnEnter(e, value2),
|
|
238
|
+
onClick: () => handleChange(value2),
|
|
239
|
+
children: [
|
|
240
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(SelectPrimitive.ItemText, { children: title }),
|
|
241
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
|
|
242
|
+
import_lucide_react.CheckIcon,
|
|
243
|
+
{
|
|
244
|
+
className: "absolute inset-y-0 right-3 my-auto hidden w-6 text-purple-100 group-data-[state=checked]:block",
|
|
245
|
+
size: 16
|
|
246
|
+
}
|
|
247
|
+
)
|
|
248
|
+
]
|
|
249
|
+
},
|
|
250
|
+
id2
|
|
251
|
+
))
|
|
252
|
+
] })
|
|
253
|
+
}
|
|
254
|
+
) })
|
|
255
|
+
]
|
|
256
|
+
}
|
|
257
|
+
),
|
|
258
|
+
/* @__PURE__ */ (0, import_jsx_runtime5.jsx)(ErrorMessage_default, { message: error, className: "mt-1" })
|
|
259
|
+
]
|
|
260
|
+
}
|
|
261
|
+
);
|
|
243
262
|
}
|
|
244
263
|
);
|
|
245
264
|
Select.displayName = "Select";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/ui/Select.tsx","../../../src/lib/utils.ts","../../../src/components/ui/Label.tsx","../../../src/components/ui/Chip.tsx","../../../src/components/primitives/separator.tsx"],"sourcesContent":["'use client'\n\nimport * as SelectPrimitive from '@radix-ui/react-select'\nimport { CheckIcon, ChevronDownIcon, X } from 'lucide-react'\nimport {\n type ComponentPropsWithoutRef,\n forwardRef,\n type KeyboardEvent,\n useEffect,\n useRef,\n useState,\n} from 'react'\n\nimport Label from '@/components/ui/Label'\nimport Chip from '@/components/ui/Chip'\nimport { Separator } from '@/components/primitives/separator'\nimport { cn } from '@/lib/utils'\n\ninterface Props extends Omit<ComponentPropsWithoutRef<'select'>, 'value' | 'onChange'> {\n label: string\n value?: string | string[]\n options?: { id: string | number; value: string; title: string }[]\n placeholder?: string\n multiselect?: boolean\n onChange?: (value: string | string[]) => void\n classNames?: { label?: string }\n}\n\nconst Select = forwardRef<HTMLButtonElement, Props>(\n ({ label, options, placeholder, multiselect, classNames, ...props }, ref) => {\n const { value, defaultValue, dir, className, onChange, ...rest } = props\n const [selected, setSelected] = useState<string[]>([])\n const [open, setOpen] = useState(false)\n const containerRef = useRef<HTMLDivElement>(null)\n\n useEffect(() => {\n if (!value) return setSelected([])\n setSelected(Array.isArray(value) ? value : [value])\n }, [value])\n\n const toggleOpen = () => setOpen((prev) => !prev)\n const closeOnEscape = (event: KeyboardEvent) => event.key === 'Escape' && setOpen(false)\n const setValueOnEnter = (event: KeyboardEvent, value: string) =>\n event.key === 'Enter' && handleChange(value)\n\n const chipLabels = selected\n ?.map((s) => options?.find(({ value }) => value === s))\n .filter(Boolean)\n\n function handleLabels() {\n if (multiselect) {\n return selected.map((o) => options?.find((option) => option.value === o)?.title).join(', ')\n }\n return options?.find((option) => option.value === selected.join())?.title\n }\n\n function handleOnOpenChange(isOpen: boolean) {\n if (!multiselect || isOpen) setOpen(isOpen)\n }\n\n function handleChange(newValue: string) {\n let newSelected: string[] = []\n setSelected((prev) => {\n newSelected = prev.includes(newValue)\n ? prev.filter((item) => item !== newValue)\n : [...prev, newValue]\n return multiselect ? newSelected : [newValue]\n })\n onChange?.(multiselect ? newSelected : newValue)\n }\n\n return (\n <div className={cn('flex flex-col space-y-2', className)} ref={containerRef}>\n <Label text={label} className={classNames?.label} />\n\n <SelectPrimitive.Root\n open={open}\n value={selected.join(',')}\n onOpenChange={handleOnOpenChange}\n onValueChange={multiselect ? undefined : handleChange}\n defaultValue={typeof defaultValue === 'string' ? defaultValue : undefined}\n dir={dir === 'rtl' ? 'rtl' : 'ltr'}\n {...rest}\n >\n <SelectPrimitive.Trigger\n ref={ref}\n data-testid={`${label.toLowerCase()}-select-element`}\n className=\"group flex min-w-80 flex-row items-center justify-between gap-3 rounded-lg border border-grey-20 px-4 py-3 text-sm font-normal focus:outline-purple-100 disabled:bg-grey-5 data-[placeholder]:text-grey-50 data-[placeholder]:disabled:text-grey-40\"\n >\n <span className=\"truncate\">\n <SelectPrimitive.Value\n placeholder={placeholder ?? 'Select an option'}\n aria-label={handleLabels()}\n >\n {handleLabels()}\n </SelectPrimitive.Value>\n </span>\n\n <ChevronDownIcon\n className=\"transform text-black group-data-[state=open]:rotate-180\"\n size=\"16\"\n />\n </SelectPrimitive.Trigger>\n\n <SelectPrimitive.Portal container={containerRef.current}>\n <SelectPrimitive.Content\n hideWhenDetached\n className=\"z-10 max-h-[var(--radix-select-content-available-height)] w-[var(--radix-select-trigger-width)] overflow-hidden rounded-md bg-white py-2 shadow-lg\"\n position=\"popper\"\n sideOffset={4}\n onPointerDownOutside={toggleOpen}\n onKeyDown={closeOnEscape}\n >\n <SelectPrimitive.Viewport>\n {multiselect && !!chipLabels?.length && (\n <SelectPrimitive.Group\n className=\"mb-2 flex flex-row flex-wrap gap-1 px-2\"\n data-testid=\"selected-labels\"\n >\n {chipLabels?.map(\n (chip) =>\n chip && (\n <Chip key={chip.title} size=\"small\" variant=\"primary\">\n <span>{chip.title}</span>\n <X\n size={18}\n data-testid={`chip-remove-${chip.value}`}\n className=\"cursor-pointer\"\n onClick={() => handleChange(chip.value)}\n />\n </Chip>\n )\n )}\n </SelectPrimitive.Group>\n )}\n <Separator />\n {options?.map(({ id, title, value }) => (\n <SelectPrimitive.Item\n key={id}\n value={value}\n className=\"group relative cursor-pointer px-4 py-2 text-left text-sm hover:bg-purple-50 focus:bg-purple-50 focus:outline-none data-[state=checked]:bg-purple-50 data-[state=checked]:pr-10 data-[state=checked]:text-purple-100\"\n data-state={selected.includes(value) ? 'checked' : 'unchecked'}\n onKeyDown={(e) => setValueOnEnter(e, value)}\n onClick={() => handleChange(value)}\n >\n <SelectPrimitive.ItemText>{title}</SelectPrimitive.ItemText>\n <CheckIcon\n className=\"absolute inset-y-0 right-3 my-auto hidden w-6 text-purple-100 group-data-[state=checked]:block\"\n size={16}\n />\n </SelectPrimitive.Item>\n ))}\n </SelectPrimitive.Viewport>\n </SelectPrimitive.Content>\n </SelectPrimitive.Portal>\n </SelectPrimitive.Root>\n </div>\n )\n }\n)\n\nSelect.displayName = 'Select'\n\nexport default Select\n","import { type ClassValue, clsx } from 'clsx'\nimport { twMerge } from 'tailwind-merge'\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs))\n}\n","import { type ComponentPropsWithoutRef } from 'react'\n\nimport { cn } from '@/lib/utils'\n\ninterface Props extends ComponentPropsWithoutRef<'label'> {\n text?: string\n}\n\nfunction Label({ text, className, ...props }: Readonly<Props>) {\n if (!text) return null\n\n return (\n <label\n className={cn(\n 'text-xs text-grey-80 peer-disabled:cursor-not-allowed peer-disabled:opacity-70',\n className\n )}\n {...props}\n >\n {text}\n </label>\n )\n}\n\nexport default Label\n","import { cva, type VariantProps } from 'cva'\nimport React from 'react'\nimport { twMerge } from 'tailwind-merge'\n\ninterface ChipProps\n extends React.HTMLAttributes<HTMLDivElement>,\n VariantProps<typeof chipVariants> {}\n\nconst Chip = ({ className, variant, size, ...props }: ChipProps) => (\n <div className={twMerge(chipVariants({ variant, size, className }))} {...props} />\n)\n\nconst chipVariants = cva(['flex', 'items-center', 'rounded-3xl', 'border', 'w-fit'], {\n variants: {\n variant: {\n neutral: ['text-grey-80', 'border-grey-10'],\n primary: ['text-purple-100', 'border-purple-20'],\n danger: ['text-pumpkin-100', 'border-pumpkin-20'],\n onboarding: ['text-green-100', 'bg-green-10', 'cursor-pointer'],\n onboardingSelected: ['text-white', 'bg-green-90', 'cursor-pointer'],\n },\n size: {\n small: ['text-sm', 'leading-5', 'px-2', 'py-1', 'gap-1.5'],\n medium: ['text-base', 'leading-6', 'px-3', 'py-2', 'gap-2'],\n },\n },\n defaultVariants: {\n variant: 'neutral',\n size: 'medium',\n },\n})\n\nexport default Chip\n","'use client'\r\n\r\nimport * as SeparatorPrimitive from '@radix-ui/react-separator'\r\nimport * as React from 'react'\r\n\r\nimport { cn } from '@/lib/utils'\r\n\r\nconst Separator = React.forwardRef<\r\n React.ElementRef<typeof SeparatorPrimitive.Root>,\r\n React.ComponentPropsWithoutRef<typeof SeparatorPrimitive.Root>\r\n>(({ className, orientation = 'horizontal', decorative = true, ...props }, ref) => (\r\n <SeparatorPrimitive.Root\r\n ref={ref}\r\n decorative={decorative}\r\n orientation={orientation}\r\n className={cn(\r\n 'shrink-0 bg-grey-10',\r\n orientation === 'horizontal' ? 'h-[1px] w-full' : 'h-full w-[1px]',\r\n className\r\n )}\r\n {...props}\r\n />\r\n))\r\nSeparator.displayName = SeparatorPrimitive.Root.displayName\r\n\r\nexport { Separator }\r\n"],"mappings":"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","names":["import_tailwind_merge","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime","value"]}
|
|
1
|
+
{"version":3,"sources":["../../../src/components/ui/Select.tsx","../../../src/lib/utils.ts","../../../src/components/ui/ErrorMessage.tsx","../../../src/components/ui/Label.tsx","../../../src/components/ui/Chip.tsx","../../../src/components/primitives/separator.tsx"],"sourcesContent":["'use client'\n\nimport * as SelectPrimitive from '@radix-ui/react-select'\nimport { CheckIcon, ChevronDownIcon, X } from 'lucide-react'\nimport {\n type ComponentPropsWithoutRef,\n forwardRef,\n type KeyboardEvent,\n useEffect,\n useRef,\n useState,\n} from 'react'\n\nimport ErrorMessage from '@/components/ui/ErrorMessage'\nimport Label from '@/components/ui/Label'\nimport Chip from '@/components/ui/Chip'\nimport { Separator } from '@/components/primitives/separator'\nimport { cn } from '@/lib/utils'\n\n\ninterface Props extends Omit<ComponentPropsWithoutRef<'select'>, 'value' | 'onChange'> {\n label?: string\n value?: string | string[]\n options?: { id: string | number; value: string; title: string }[]\n placeholder?: string\n multiselect?: boolean\n onChange?: (value: string | string[]) => void\n classNames?: { label?: string; trigger?: string }\n error?: string\n}\n\nconst Select = forwardRef<HTMLButtonElement, Props>(\n ({ label, options, placeholder, multiselect, classNames, error, id, ...props }, ref) => {\n const { value, defaultValue, dir, className, onChange, ...rest } = props\n const [selected, setSelected] = useState<string[]>([])\n const [open, setOpen] = useState(false)\n const containerRef = useRef<HTMLDivElement>(null)\n\n\n useEffect(() => {\n if (!value) return setSelected([])\n setSelected(Array.isArray(value) ? value : [value])\n }, [value])\n\n const toggleOpen = () => setOpen((prev) => !prev)\n const closeOnEscape = (event: KeyboardEvent) => event.key === 'Escape' && setOpen(false)\n const setValueOnEnter = (event: KeyboardEvent, value: string) =>\n event.key === 'Enter' && handleChange(value)\n\n const chipLabels = selected\n ?.map((s) => options?.find(({ value }) => value === s))\n .filter(Boolean)\n\n function handleLabels() {\n if (multiselect) {\n return selected.map((o) => options?.find((option) => option.value === o)?.title).join(', ')\n }\n return options?.find((option) => option.value === selected.join())?.title\n }\n\n function handleOnOpenChange(isOpen: boolean) {\n if (!multiselect || isOpen) setOpen(isOpen)\n }\n\n function handleChange(newValue: string) {\n let newSelected: string[] = []\n setSelected((prev) => {\n newSelected = prev.includes(newValue)\n ? prev.filter((item) => item !== newValue)\n : [...prev, newValue]\n return multiselect ? newSelected : [newValue]\n })\n onChange?.(multiselect ? newSelected : newValue)\n }\n\n return (\n <div\n className={cn('flex flex-col space-y-1', className)}\n ref={containerRef}\n data-testid={`${(label ?? id)?.toLowerCase()}-select-element`}\n >\n <Label text={label} className={classNames?.label} />\n\n <SelectPrimitive.Root\n open={open}\n value={selected.join(',')}\n onOpenChange={handleOnOpenChange}\n onValueChange={multiselect ? undefined : handleChange}\n defaultValue={typeof defaultValue === 'string' ? defaultValue : undefined}\n dir={dir === 'rtl' ? 'rtl' : 'ltr'}\n {...rest}\n >\n <SelectPrimitive.Trigger\n ref={ref}\n className={cn(\n 'group flex h-11 min-w-80 flex-row items-center justify-between gap-3 rounded-lg border px-4 py-3 text-sm font-normal focus:outline-purple-100 disabled:bg-grey-5 data-[placeholder]:text-grey-50 data-[placeholder]:disabled:text-grey-40',\n classNames?.trigger\n )}\n >\n <span className=\"truncate\">\n <SelectPrimitive.Value\n placeholder={placeholder ?? 'Select an option'}\n aria-label={handleLabels()}\n >\n {handleLabels()}\n </SelectPrimitive.Value>\n </span>\n\n <ChevronDownIcon\n className=\"transform text-black group-data-[state=open]:rotate-180\"\n size=\"16\"\n />\n </SelectPrimitive.Trigger>\n\n <SelectPrimitive.Portal container={containerRef.current}>\n <SelectPrimitive.Content\n hideWhenDetached\n className=\"z-10 max-h-[var(--radix-select-content-available-height)] w-[var(--radix-select-trigger-width)] overflow-hidden rounded-md bg-white py-2 shadow-lg\"\n position=\"popper\"\n sideOffset={4}\n onPointerDownOutside={toggleOpen}\n onKeyDown={closeOnEscape}\n >\n <SelectPrimitive.Viewport>\n {multiselect && !!chipLabels?.length && (\n <SelectPrimitive.Group\n className=\"mb-2 flex flex-row flex-wrap gap-1 px-2\"\n data-testid=\"selected-labels\"\n >\n {chipLabels?.map(\n (chip) =>\n chip && (\n <Chip key={chip.title} size=\"small\" variant=\"primary\">\n <span>{chip.title}</span>\n <X\n size={18}\n data-testid={`chip-remove-${chip.value}`}\n className=\"cursor-pointer\"\n onClick={() => handleChange(chip.value)}\n />\n </Chip>\n )\n )}\n </SelectPrimitive.Group>\n )}\n <Separator />\n {options?.map(({ id, title, value }) => (\n <SelectPrimitive.Item\n key={id}\n value={value}\n className=\"group relative cursor-pointer px-4 py-2 text-left text-sm hover:bg-purple-50 focus:bg-purple-50 focus:outline-none data-[state=checked]:bg-purple-50 data-[state=checked]:pr-10 data-[state=checked]:text-purple-100\"\n data-state={selected.includes(value) ? 'checked' : 'unchecked'}\n onKeyDown={(e) => setValueOnEnter(e, value)}\n onClick={() => handleChange(value)}\n >\n <SelectPrimitive.ItemText>{title}</SelectPrimitive.ItemText>\n <CheckIcon\n className=\"absolute inset-y-0 right-3 my-auto hidden w-6 text-purple-100 group-data-[state=checked]:block\"\n size={16}\n />\n </SelectPrimitive.Item>\n ))}\n </SelectPrimitive.Viewport>\n </SelectPrimitive.Content>\n </SelectPrimitive.Portal>\n </SelectPrimitive.Root>\n <ErrorMessage message={error} className=\"mt-1\" />\n </div>\n )\n }\n)\n\nSelect.displayName = 'Select'\n\nexport default Select\n","import { type ClassValue, clsx } from 'clsx'\nimport { twMerge } from 'tailwind-merge'\n\nexport function cn(...inputs: ClassValue[]) {\n return twMerge(clsx(inputs))\n}\n","import { type ComponentPropsWithoutRef } from 'react'\n\nimport { cn } from '@/lib/utils'\n\ninterface Props extends ComponentPropsWithoutRef<'p'> {\n message?: string\n}\n\nfunction ErrorMessage({ message, className, ...props }: Readonly<Props>) {\n if (!message) return null\n\n return (\n <p className={cn('px-1 text-xs text-red-600', className)} {...props}>\n {message}\n </p>\n )\n}\n\nexport default ErrorMessage\n","import { type ComponentPropsWithoutRef } from 'react'\n\nimport { cn } from '@/lib/utils'\n\ninterface Props extends ComponentPropsWithoutRef<'label'> {\n text?: string\n}\n\nfunction Label({ text, className, ...props }: Readonly<Props>) {\n if (!text) return null\n\n return (\n <label\n className={cn(\n 'text-xs text-grey-80 peer-disabled:cursor-not-allowed peer-disabled:opacity-70',\n className\n )}\n {...props}\n >\n {text}\n </label>\n )\n}\n\nexport default Label\n","import { cva, type VariantProps } from 'cva'\nimport React from 'react'\nimport { twMerge } from 'tailwind-merge'\n\ninterface ChipProps\n extends React.HTMLAttributes<HTMLDivElement>,\n VariantProps<typeof chipVariants> {}\n\nconst Chip = ({ className, variant, size, ...props }: ChipProps) => (\n <div className={twMerge(chipVariants({ variant, size, className }))} {...props} />\n)\n\nconst chipVariants = cva(['flex', 'items-center', 'rounded-3xl', 'border', 'w-fit'], {\n variants: {\n variant: {\n neutral: ['text-grey-80', 'border-grey-10'],\n primary: ['text-purple-100', 'border-purple-20'],\n danger: ['text-pumpkin-100', 'border-pumpkin-20'],\n onboarding: ['text-green-100', 'bg-green-10', 'cursor-pointer'],\n onboardingSelected: ['text-white', 'bg-green-90', 'cursor-pointer'],\n },\n size: {\n small: ['text-sm', 'leading-5', 'px-2', 'py-1', 'gap-1.5'],\n medium: ['text-base', 'leading-6', 'px-3', 'py-2', 'gap-2'],\n },\n },\n defaultVariants: {\n variant: 'neutral',\n size: 'medium',\n },\n})\n\nexport default Chip\n","'use client'\r\n\r\nimport * as SeparatorPrimitive from '@radix-ui/react-separator'\r\nimport * as React from 'react'\r\n\r\nimport { cn } from '@/lib/utils'\r\n\r\nconst Separator = React.forwardRef<\r\n React.ElementRef<typeof SeparatorPrimitive.Root>,\r\n React.ComponentPropsWithoutRef<typeof SeparatorPrimitive.Root>\r\n>(({ className, orientation = 'horizontal', decorative = true, ...props }, ref) => (\r\n <SeparatorPrimitive.Root\r\n ref={ref}\r\n decorative={decorative}\r\n orientation={orientation}\r\n className={cn(\r\n 'shrink-0 bg-grey-10',\r\n orientation === 'horizontal' ? 'h-[1px] w-full' : 'h-full w-[1px]',\r\n className\r\n )}\r\n {...props}\r\n />\r\n))\r\nSeparator.displayName = SeparatorPrimitive.Root.displayName\r\n\r\nexport { Separator }\r\n"],"mappings":"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","names":["import_jsx_runtime","import_tailwind_merge","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime","value","id"]}
|
|
@@ -2,7 +2,7 @@ import * as React from 'react';
|
|
|
2
2
|
import { ComponentPropsWithoutRef } from 'react';
|
|
3
3
|
|
|
4
4
|
interface Props extends Omit<ComponentPropsWithoutRef<'select'>, 'value' | 'onChange'> {
|
|
5
|
-
label
|
|
5
|
+
label?: string;
|
|
6
6
|
value?: string | string[];
|
|
7
7
|
options?: {
|
|
8
8
|
id: string | number;
|
|
@@ -14,7 +14,9 @@ interface Props extends Omit<ComponentPropsWithoutRef<'select'>, 'value' | 'onCh
|
|
|
14
14
|
onChange?: (value: string | string[]) => void;
|
|
15
15
|
classNames?: {
|
|
16
16
|
label?: string;
|
|
17
|
+
trigger?: string;
|
|
17
18
|
};
|
|
19
|
+
error?: string;
|
|
18
20
|
}
|
|
19
21
|
declare const Select: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLButtonElement>>;
|
|
20
22
|
|
|
@@ -2,7 +2,7 @@ import * as React from 'react';
|
|
|
2
2
|
import { ComponentPropsWithoutRef } from 'react';
|
|
3
3
|
|
|
4
4
|
interface Props extends Omit<ComponentPropsWithoutRef<'select'>, 'value' | 'onChange'> {
|
|
5
|
-
label
|
|
5
|
+
label?: string;
|
|
6
6
|
value?: string | string[];
|
|
7
7
|
options?: {
|
|
8
8
|
id: string | number;
|
|
@@ -14,7 +14,9 @@ interface Props extends Omit<ComponentPropsWithoutRef<'select'>, 'value' | 'onCh
|
|
|
14
14
|
onChange?: (value: string | string[]) => void;
|
|
15
15
|
classNames?: {
|
|
16
16
|
label?: string;
|
|
17
|
+
trigger?: string;
|
|
17
18
|
};
|
|
19
|
+
error?: string;
|
|
18
20
|
}
|
|
19
21
|
declare const Select: React.ForwardRefExoticComponent<Props & React.RefAttributes<HTMLButtonElement>>;
|
|
20
22
|
|