@tulip-systems/core 0.6.0 → 0.7.0

package/dist/components/ui/input-group.client.d.mts

@@ -0,0 +1,59 @@
+import { Button } from "./button.mjs";
+import { DateTimeInputProps } from "./input-date-time.client.mjs";
+import { DateInputProps } from "./input-date.mjs";
+import { TimeInputProps } from "./input-time.mjs";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { VariantProps } from "class-variance-authority";
+import * as React$1 from "react";
+import * as class_variance_authority_types0 from "class-variance-authority/types";
+
+//#region src/components/ui/input-group.client.d.ts
+declare function InputGroup({
+  className,
+  ...props
+}: React$1.ComponentProps<"div">): react_jsx_runtime0.JSX.Element;
+declare const inputGroupAddonVariants: (props?: ({
+  align?: "inline-start" | "inline-end" | "block-start" | "block-end" | null | undefined;
+} & class_variance_authority_types0.ClassProp) | undefined) => string;
+declare function InputGroupAddon({
+  className,
+  align,
+  ...props
+}: React$1.ComponentProps<"div"> & VariantProps<typeof inputGroupAddonVariants>): react_jsx_runtime0.JSX.Element;
+declare const inputGroupButtonVariants: (props?: ({
+  size?: "xs" | "sm" | "icon-xs" | "icon-sm" | null | undefined;
+} & class_variance_authority_types0.ClassProp) | undefined) => string;
+declare function InputGroupButton({
+  className,
+  type,
+  variant,
+  size,
+  ...props
+}: Omit<React$1.ComponentProps<typeof Button>, "size"> & VariantProps<typeof inputGroupButtonVariants>): react_jsx_runtime0.JSX.Element;
+declare function InputGroupText({
+  className,
+  ...props
+}: React$1.ComponentProps<"span">): react_jsx_runtime0.JSX.Element;
+declare function InputGroupInput({
+  className,
+  ...props
+}: React$1.ComponentProps<"input">): react_jsx_runtime0.JSX.Element;
+declare function InputGroupTextarea({
+  className,
+  ...props
+}: React$1.ComponentProps<"textarea">): react_jsx_runtime0.JSX.Element;
+declare function InputGroupTimeInput({
+  className,
+  ...props
+}: TimeInputProps): react_jsx_runtime0.JSX.Element;
+declare function InputGroupDateInput({
+  className,
+  ...props
+}: DateInputProps): react_jsx_runtime0.JSX.Element;
+declare function InputGroupDateTimeInput({
+  className,
+  ...props
+}: DateTimeInputProps): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupDateInput, InputGroupDateTimeInput, InputGroupInput, InputGroupText, InputGroupTextarea, InputGroupTimeInput };
+//# sourceMappingURL=input-group.client.d.mts.map

package/dist/components/ui/input-group.client.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-group.client.d.mts","names":[],"sources":["../../../src/components/ui/input-group.client.tsx"],"mappings":";;;;;;;;;;iBAYS,UAAA,CAAA;EAAa,SAAA;EAAA,GAAc;AAAA,GAAS,OAAA,CAAM,cAAA,UAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,cAelE,uBAAA,GAAuB,KAAA;;IAiB5B,+BAAA,CAAA,SAAA;AAAA,iBAEQ,eAAA,CAAA;EACP,SAAA;EACA,KAAA;EAAA,GACG;AAAA,GACF,OAAA,CAAM,cAAA,UAAwB,YAAA,QAAoB,uBAAA,IAAwB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,cAoBvE,wBAAA,GAAwB,KAAA;;IAY5B,+BAAA,CAAA,SAAA;AAAA,iBAEO,gBAAA,CAAA;EACP,SAAA;EACA,IAAA;EACA,OAAA;EACA,IAAA;EAAA,GACG;AAAA,GACF,IAAA,CAAK,OAAA,CAAM,cAAA,QAAsB,MAAA,aAClC,YAAA,QAAoB,wBAAA,IAAyB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAYtC,cAAA,CAAA;EAAiB,SAAA;EAAA,GAAc;AAAA,GAAS,OAAA,CAAM,cAAA,WAAsB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAYpE,eAAA,CAAA;EAAkB,SAAA;EAAA,GAAc;AAAA,GAAS,OAAA,CAAM,cAAA,YAAuB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAatE,kBAAA,CAAA;EAAqB,SAAA;EAAA,GAAc;AAAA,GAAS,OAAA,CAAM,cAAA,eAA0B,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAa5E,mBAAA,CAAA;EAAsB,SAAA;EAAA,GAAc;AAAA,GAAS,cAAA,GAAc,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAa3D,mBAAA,CAAA;EAAsB,SAAA;EAAA,GAAc;AAAA,GAAS,cAAA,GAAc,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAa3D,uBAAA,CAAA;EAA0B,SAAA;EAAA,GAAc;AAAA,GAAS,kBAAA,GAAkB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/ui/input-group.client.mjs

@@ -0,0 +1,106 @@
+"use client";
+
+import { cn } from "../../lib/utils/cn.mjs";
+import { Button } from "./button.mjs";
+import { Input } from "./input.mjs";
+import { Textarea } from "./textarea.mjs";
+import { DateInput } from "./input-date.mjs";
+import { DateTimeInput } from "./input-date-time.client.mjs";
+import { TimeInput } from "./input-time.mjs";
+import { jsx } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+
+//#region src/components/ui/input-group.client.tsx
+function InputGroup({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "input-group",
+		role: "group",
+		className: cn("group/input-group relative flex h-8 w-full min-w-0 items-center rounded-lg border border-input outline-none transition-colors in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-start]]:h-auto has-[>textarea]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:flex-col has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot][aria-invalid=true]]:border-destructive has-disabled:bg-input/50 has-disabled:opacity-50 has-[[data-slot=input-group-control]:focus-visible]:ring-3 has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50 has-[[data-slot][aria-invalid=true]]:ring-3 has-[[data-slot][aria-invalid=true]]:ring-destructive/20 dark:bg-input/30 dark:has-disabled:bg-input/80 dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40 has-[>[data-align=block-end]]:[&>input]:pt-3 has-[>[data-align=inline-end]]:[&>input]:pr-1.5 has-[>[data-align=block-start]]:[&>input]:pb-3 has-[>[data-align=inline-start]]:[&>input]:pl-1.5", className),
+		...props
+	});
+}
+const inputGroupAddonVariants = cva("text-muted-foreground h-auto gap-2 py-1.5 text-sm font-medium group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4 flex cursor-text items-center justify-center select-none", {
+	variants: { align: {
+		"inline-start": "pl-2 has-[>button]:ml-[-0.3rem] has-[>kbd]:ml-[-0.15rem] order-first",
+		"inline-end": "pr-2 has-[>button]:mr-[-0.3rem] has-[>kbd]:mr-[-0.15rem] order-last",
+		"block-start": "px-2.5 pt-2 group-has-[>input]/input-group:pt-2 [.border-b]:pb-2 order-first w-full justify-start",
+		"block-end": "px-2.5 pb-2 group-has-[>input]/input-group:pb-2 [.border-t]:pt-2 order-last w-full justify-start"
+	} },
+	defaultVariants: { align: "inline-start" }
+});
+function InputGroupAddon({ className, align = "inline-start", ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		role: "group",
+		"data-slot": "input-group-addon",
+		"data-align": align,
+		className: cn(inputGroupAddonVariants({ align }), className),
+		onClick: (e) => {
+			if (e.target.closest("button")) return;
+			e.currentTarget.parentElement?.querySelector("input")?.focus();
+		},
+		...props
+	});
+}
+const inputGroupButtonVariants = cva("gap-2 text-sm flex items-center shadow-none", {
+	variants: { size: {
+		xs: "h-6 gap-1 rounded-[calc(var(--radius)-3px)] px-1.5 [&>svg:not([class*='size-'])]:size-3.5",
+		sm: "",
+		"icon-xs": "size-6 rounded-[calc(var(--radius)-3px)] p-0 has-[>svg]:p-0",
+		"icon-sm": "size-8 p-0 has-[>svg]:p-0"
+	} },
+	defaultVariants: { size: "xs" }
+});
+function InputGroupButton({ className, type = "button", variant = "ghost", size = "xs", ...props }) {
+	return /* @__PURE__ */ jsx(Button, {
+		type,
+		"data-size": size,
+		variant,
+		className: cn(inputGroupButtonVariants({ size }), className),
+		...props
+	});
+}
+function InputGroupText({ className, ...props }) {
+	return /* @__PURE__ */ jsx("span", {
+		className: cn("flex items-center gap-2 text-muted-foreground text-sm [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none", className),
+		...props
+	});
+}
+function InputGroupInput({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Input, {
+		"data-slot": "input-group-control",
+		className: cn("flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent", className),
+		...props
+	});
+}
+function InputGroupTextarea({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Textarea, {
+		"data-slot": "input-group-control",
+		className: cn("flex-1 resize-none rounded-none border-0 bg-transparent py-2 shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent", className),
+		...props
+	});
+}
+function InputGroupTimeInput({ className, ...props }) {
+	return /* @__PURE__ */ jsx(TimeInput, {
+		"data-slot": "input-group-control",
+		className: cn("flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent", className),
+		...props
+	});
+}
+function InputGroupDateInput({ className, ...props }) {
+	return /* @__PURE__ */ jsx(DateInput, {
+		"data-slot": "input-group-control",
+		className: cn("flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent", className),
+		...props
+	});
+}
+function InputGroupDateTimeInput({ className, ...props }) {
+	return /* @__PURE__ */ jsx(DateTimeInput, {
+		"data-slot": "input-group-control",
+		className: cn("flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent", className),
+		...props
+	});
+}
+
+//#endregion
+export { InputGroup, InputGroupAddon, InputGroupButton, InputGroupDateInput, InputGroupDateTimeInput, InputGroupInput, InputGroupText, InputGroupTextarea, InputGroupTimeInput };
+//# sourceMappingURL=input-group.client.mjs.map

package/dist/components/ui/input-group.client.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-group.client.mjs","names":[],"sources":["../../../src/components/ui/input-group.client.tsx"],"sourcesContent":["\"use client\";\n\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport type * as React from \"react\";\nimport { Button } from \"@/components/ui/button\";\nimport { Input } from \"@/components/ui/input\";\nimport { Textarea } from \"@/components/ui/textarea\";\nimport { cn } from \"@/lib/utils/cn\";\nimport { DateInput, type DateInputProps } from \"./input-date\";\nimport { DateTimeInput, type DateTimeInputProps } from \"./input-date-time.client\";\nimport { TimeInput, type TimeInputProps } from \"./input-time\";\n\nfunction InputGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    // biome-ignore lint/a11y/useSemanticElements: The div element is used to group the input and its addons together, and the role=\"group\" attribute is added for accessibility purposes.\n    <div\n      data-slot=\"input-group\"\n      role=\"group\"\n      className={cn(\n        \"group/input-group relative flex h-8 w-full min-w-0 items-center rounded-lg border border-input outline-none transition-colors in-data-[slot=combobox-content]:focus-within:border-inherit in-data-[slot=combobox-content]:focus-within:ring-0 has-[>[data-align=block-end]]:h-auto has-[>[data-align=block-start]]:h-auto has-[>textarea]:h-auto has-[>[data-align=block-end]]:flex-col has-[>[data-align=block-start]]:flex-col has-[[data-slot=input-group-control]:focus-visible]:border-ring has-[[data-slot][aria-invalid=true]]:border-destructive has-disabled:bg-input/50 has-disabled:opacity-50 has-[[data-slot=input-group-control]:focus-visible]:ring-3 has-[[data-slot=input-group-control]:focus-visible]:ring-ring/50 has-[[data-slot][aria-invalid=true]]:ring-3 has-[[data-slot][aria-invalid=true]]:ring-destructive/20 dark:bg-input/30 dark:has-disabled:bg-input/80 dark:has-[[data-slot][aria-invalid=true]]:ring-destructive/40 has-[>[data-align=block-end]]:[&>input]:pt-3 has-[>[data-align=inline-end]]:[&>input]:pr-1.5 has-[>[data-align=block-start]]:[&>input]:pb-3 has-[>[data-align=inline-start]]:[&>input]:pl-1.5\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nconst inputGroupAddonVariants = cva(\n  \"text-muted-foreground h-auto gap-2 py-1.5 text-sm font-medium group-data-[disabled=true]/input-group:opacity-50 [&>kbd]:rounded-[calc(var(--radius)-5px)] [&>svg:not([class*='size-'])]:size-4 flex cursor-text items-center justify-center select-none\",\n  {\n    variants: {\n      align: {\n        \"inline-start\": \"pl-2 has-[>button]:ml-[-0.3rem] has-[>kbd]:ml-[-0.15rem] order-first\",\n        \"inline-end\": \"pr-2 has-[>button]:mr-[-0.3rem] has-[>kbd]:mr-[-0.15rem] order-last\",\n        \"block-start\":\n          \"px-2.5 pt-2 group-has-[>input]/input-group:pt-2 [.border-b]:pb-2 order-first w-full justify-start\",\n        \"block-end\":\n          \"px-2.5 pb-2 group-has-[>input]/input-group:pb-2 [.border-t]:pt-2 order-last w-full justify-start\",\n      },\n    },\n    defaultVariants: {\n      align: \"inline-start\",\n    },\n  },\n);\n\nfunction InputGroupAddon({\n  className,\n  align = \"inline-start\",\n  ...props\n}: React.ComponentProps<\"div\"> & VariantProps<typeof inputGroupAddonVariants>) {\n  return (\n    // biome-ignore lint/a11y/useKeyWithClickEvents: The div element is used as an addon to the input group, and it is not intended to be interactive on its own. The onClick handler is added to allow users to focus the associated input when they click on the addon, but it does not require keyboard interaction as it is not a standalone interactive element.\n    // biome-ignore lint/a11y/useSemanticElements: The div element is used as an addon to the input group, and it is not intended to be interactive on its own. The role=\"group\" attribute is added for accessibility purposes to indicate that this element is part of a group of related elements.\n    <div\n      role=\"group\"\n      data-slot=\"input-group-addon\"\n      data-align={align}\n      className={cn(inputGroupAddonVariants({ align }), className)}\n      onClick={(e) => {\n        if ((e.target as HTMLElement).closest(\"button\")) {\n          return;\n        }\n        e.currentTarget.parentElement?.querySelector(\"input\")?.focus();\n      }}\n      {...props}\n    />\n  );\n}\n\nconst inputGroupButtonVariants = cva(\"gap-2 text-sm flex items-center shadow-none\", {\n  variants: {\n    size: {\n      xs: \"h-6 gap-1 rounded-[calc(var(--radius)-3px)] px-1.5 [&>svg:not([class*='size-'])]:size-3.5\",\n      sm: \"\",\n      \"icon-xs\": \"size-6 rounded-[calc(var(--radius)-3px)] p-0 has-[>svg]:p-0\",\n      \"icon-sm\": \"size-8 p-0 has-[>svg]:p-0\",\n    },\n  },\n  defaultVariants: {\n    size: \"xs\",\n  },\n});\n\nfunction InputGroupButton({\n  className,\n  type = \"button\",\n  variant = \"ghost\",\n  size = \"xs\",\n  ...props\n}: Omit<React.ComponentProps<typeof Button>, \"size\"> &\n  VariantProps<typeof inputGroupButtonVariants>) {\n  return (\n    <Button\n      type={type}\n      data-size={size}\n      variant={variant}\n      className={cn(inputGroupButtonVariants({ size }), className)}\n      {...props}\n    />\n  );\n}\n\nfunction InputGroupText({ className, ...props }: React.ComponentProps<\"span\">) {\n  return (\n    <span\n      className={cn(\n        \"flex items-center gap-2 text-muted-foreground text-sm [&_svg:not([class*='size-'])]:size-4 [&_svg]:pointer-events-none\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction InputGroupInput({ className, ...props }: React.ComponentProps<\"input\">) {\n  return (\n    <Input\n      data-slot=\"input-group-control\"\n      className={cn(\n        \"flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction InputGroupTextarea({ className, ...props }: React.ComponentProps<\"textarea\">) {\n  return (\n    <Textarea\n      data-slot=\"input-group-control\"\n      className={cn(\n        \"flex-1 resize-none rounded-none border-0 bg-transparent py-2 shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction InputGroupTimeInput({ className, ...props }: TimeInputProps) {\n  return (\n    <TimeInput\n      data-slot=\"input-group-control\"\n      className={cn(\n        \"flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction InputGroupDateInput({ className, ...props }: DateInputProps) {\n  return (\n    <DateInput\n      data-slot=\"input-group-control\"\n      className={cn(\n        \"flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction InputGroupDateTimeInput({ className, ...props }: DateTimeInputProps) {\n  return (\n    <DateTimeInput\n      data-slot=\"input-group-control\"\n      className={cn(\n        \"flex-1 rounded-none border-0 bg-transparent shadow-none ring-0 focus-visible:ring-0 disabled:bg-transparent aria-invalid:ring-0 dark:bg-transparent dark:disabled:bg-transparent\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport {\n  InputGroup,\n  InputGroupAddon,\n  InputGroupButton,\n  InputGroupText,\n  InputGroupInput,\n  InputGroupTextarea,\n  InputGroupTimeInput,\n  InputGroupDateInput,\n  InputGroupDateTimeInput,\n};\n"],"mappings":";;;;;;;;;;;;;AAYA,SAAS,WAAW,EAAE,WAAW,GAAG,SAAsC;AACxE,QAEE,oBAAC;EACC,aAAU;EACV,MAAK;EACL,WAAW,GACT,ylCACA,UACD;EACD,GAAI;GACJ;;AAIN,MAAM,0BAA0B,IAC9B,2PACA;CACE,UAAU,EACR,OAAO;EACL,gBAAgB;EAChB,cAAc;EACd,eACE;EACF,aACE;EACH,EACF;CACD,iBAAiB,EACf,OAAO,gBACR;CACF,CACF;AAED,SAAS,gBAAgB,EACvB,WACA,QAAQ,gBACR,GAAG,SAC0E;AAC7E,QAGE,oBAAC;EACC,MAAK;EACL,aAAU;EACV,cAAY;EACZ,WAAW,GAAG,wBAAwB,EAAE,OAAO,CAAC,EAAE,UAAU;EAC5D,UAAU,MAAM;AACd,OAAK,EAAE,OAAuB,QAAQ,SAAS,CAC7C;AAEF,KAAE,cAAc,eAAe,cAAc,QAAQ,EAAE,OAAO;;EAEhE,GAAI;GACJ;;AAIN,MAAM,2BAA2B,IAAI,+CAA+C;CAClF,UAAU,EACR,MAAM;EACJ,IAAI;EACJ,IAAI;EACJ,WAAW;EACX,WAAW;EACZ,EACF;CACD,iBAAiB,EACf,MAAM,MACP;CACF,CAAC;AAEF,SAAS,iBAAiB,EACxB,WACA,OAAO,UACP,UAAU,SACV,OAAO,MACP,GAAG,SAE4C;AAC/C,QACE,oBAAC;EACO;EACN,aAAW;EACF;EACT,WAAW,GAAG,yBAAyB,EAAE,MAAM,CAAC,EAAE,UAAU;EAC5D,GAAI;GACJ;;AAIN,SAAS,eAAe,EAAE,WAAW,GAAG,SAAuC;AAC7E,QACE,oBAAC;EACC,WAAW,GACT,0HACA,UACD;EACD,GAAI;GACJ;;AAIN,SAAS,gBAAgB,EAAE,WAAW,GAAG,SAAwC;AAC/E,QACE,oBAAC;EACC,aAAU;EACV,WAAW,GACT,oLACA,UACD;EACD,GAAI;GACJ;;AAIN,SAAS,mBAAmB,EAAE,WAAW,GAAG,SAA2C;AACrF,QACE,oBAAC;EACC,aAAU;EACV,WAAW,GACT,qMACA,UACD;EACD,GAAI;GACJ;;AAIN,SAAS,oBAAoB,EAAE,WAAW,GAAG,SAAyB;AACpE,QACE,oBAAC;EACC,aAAU;EACV,WAAW,GACT,oLACA,UACD;EACD,GAAI;GACJ;;AAIN,SAAS,oBAAoB,EAAE,WAAW,GAAG,SAAyB;AACpE,QACE,oBAAC;EACC,aAAU;EACV,WAAW,GACT,oLACA,UACD;EACD,GAAI;GACJ;;AAIN,SAAS,wBAAwB,EAAE,WAAW,GAAG,SAA6B;AAC5E,QACE,oBAAC;EACC,aAAU;EACV,WAAW,GACT,oLACA,UACD;EACD,GAAI;GACJ"}

package/dist/components/ui/input-recipient.mjs

@@ -2,7 +2,7 @@
 
 import { cn } from "../../lib/utils/cn.mjs";
 import { Button } from "./button.mjs";
-import { Popover, PopoverContent, PopoverTrigger } from "./popover.mjs";
+import { Popover, PopoverContent, PopoverTrigger } from "./popover.client.mjs";
 import { X } from "lucide-react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 import * as React$1 from "react";
@@ -112,12 +112,12 @@ function RecipientInput({ contacts, value, onChange, placeholder = "Kies een ont
 			asChild: true,
 			children: /* @__PURE__ */ jsxs("div", {
 				ref: containerRef,
-				className: cn("border-input bg-background ring-offset-background flex min-h-0 w-full flex-wrap items-center gap-2 rounded-lg border px-3 py-2 text-base transition-colors md:text-sm", "focus-within:border-ring focus-within:ring-ring/50 focus-within:ring-[3px]", disabled && "cursor-not-allowed opacity-50", className),
+				className: cn("flex min-h-0 w-full flex-wrap items-center gap-2 rounded-lg border border-input bg-background px-3 py-2 text-base ring-offset-background transition-colors md:text-sm", "focus-within:border-ring focus-within:ring-[3px] focus-within:ring-ring/50", disabled && "cursor-not-allowed opacity-50", className),
 				onClick: () => {
 					if (!disabled) inputRef.current?.focus();
 				},
 				children: [selectedContacts.map((contact) => /* @__PURE__ */ jsxs("div", {
-					className: "border-border bg-accent/50 flex items-center gap-2 rounded-full border px-2 py-0.5",
+					className: "flex items-center gap-2 rounded-full border border-border bg-accent/50 px-2 py-0.5",
 					children: [/* @__PURE__ */ jsx("span", {
 						className: "text-xs",
 						children: contact.email
@@ -125,7 +125,7 @@ function RecipientInput({ contacts, value, onChange, placeholder = "Kies een ont
 						type: "button",
 						variant: "ghost",
 						size: "icon",
-						className: "hover:bg-destructive/20 h-4 w-4 rounded-full p-0",
+						className: "h-4 w-4 rounded-full p-0 hover:bg-destructive/20",
 						onClick: (e) => {
 							e.stopPropagation();
 							handleRemove(contact.email);
@@ -147,7 +147,7 @@ function RecipientInput({ contacts, value, onChange, placeholder = "Kies een ont
 					onKeyDown: handleKeyDown,
 					placeholder: value.length === 0 ? placeholder : "",
 					disabled,
-					className: "placeholder:text-muted-foreground min-w-30 flex-1 bg-transparent outline-none placeholder:text-sm disabled:cursor-not-allowed"
+					className: "min-w-30 flex-1 bg-transparent outline-none placeholder:text-muted-foreground placeholder:text-sm disabled:cursor-not-allowed"
 				})]
 			})
 		}), /* @__PURE__ */ jsx(PopoverContent, {
@@ -158,14 +158,14 @@ function RecipientInput({ contacts, value, onChange, placeholder = "Kies een ont
 			children: /* @__PURE__ */ jsx("div", {
 				className: "max-h-75 overflow-y-auto p-1",
 				children: filteredContacts.length === 0 && inputValue ? /* @__PURE__ */ jsxs("div", {
-					className: "text-muted-foreground px-2 py-2",
+					className: "px-2 py-2 text-muted-foreground",
 					children: [/* @__PURE__ */ jsx("div", {
 						className: "mb-2 text-xs",
 						children: "Geen contacten gevonden."
 					}), isValidEmail(inputValue.trim()) && /* @__PURE__ */ jsxs("button", {
 						type: "button",
 						onClick: handleAddManualEmail,
-						className: "hover:bg-accent w-full rounded-sm px-2 py-1.5 text-left text-xs transition-colors",
+						className: "w-full rounded-sm px-2 py-1.5 text-left text-xs transition-colors hover:bg-accent",
 						children: [/* @__PURE__ */ jsx("span", {
 							className: "font-medium",
 							children: "Voeg toe: "
@@ -175,7 +175,7 @@ function RecipientInput({ contacts, value, onChange, placeholder = "Kies een ont
 						})]
 					})]
 				}) : filteredContacts.length === 0 ? /* @__PURE__ */ jsx("div", {
-					className: "text-muted-foreground py-6 text-center text-xs",
+					className: "py-6 text-center text-muted-foreground text-xs",
 					children: "Geen contacten gevonden."
 				}) : /* @__PURE__ */ jsxs(Fragment, { children: [filteredContacts.map((contact, index) => /* @__PURE__ */ jsx("button", {
 					ref: (el) => {
@@ -183,11 +183,11 @@ function RecipientInput({ contacts, value, onChange, placeholder = "Kies een ont
 					},
 					type: "button",
 					onClick: () => handleSelect(contact),
-					className: cn("outline-hidden hover:bg-accent flex w-full items-center gap-2 rounded-sm px-2 py-1.5 text-xs transition-colors", highlightedIndex === index && "bg-accent"),
+					className: cn("flex w-full items-center gap-2 rounded-sm px-2 py-1.5 text-xs outline-hidden transition-colors hover:bg-accent", highlightedIndex === index && "bg-accent"),
 					children: /* @__PURE__ */ jsxs("div", {
 						className: "flex flex-col items-start",
 						children: [/* @__PURE__ */ jsx("span", {
-							className: "text-xs font-medium",
+							className: "font-medium text-xs",
 							children: contact.name
 						}), /* @__PURE__ */ jsx("span", {
 							className: "text-muted-foreground text-xs",
@@ -199,7 +199,7 @@ function RecipientInput({ contacts, value, onChange, placeholder = "Kies een ont
 					children: /* @__PURE__ */ jsxs("button", {
 						type: "button",
 						onClick: handleAddManualEmail,
-						className: "hover:bg-accent w-full rounded-sm px-2 py-1.5 text-left text-xs transition-colors",
+						className: "w-full rounded-sm px-2 py-1.5 text-left text-xs transition-colors hover:bg-accent",
 						children: [/* @__PURE__ */ jsx("span", {
 							className: "font-medium",
 							children: "Voeg toe: "

package/dist/components/ui/input-recipient.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"input-recipient.mjs","names":["React"],"sources":["../../../src/components/ui/input-recipient.tsx"],"sourcesContent":["\"use client\";\n\nimport { X } from \"lucide-react\";\nimport * as React from \"react\";\nimport { toast } from \"sonner\";\nimport { cn } from \"@/lib/utils/cn\";\n\nimport { Button } from \"./button\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"./popover\";\n\nexport type Contact = {\n  id: string;\n  email: string;\n  name: string;\n};\n\ninterface RecipientInputProps {\n  contacts: Contact[];\n  value: string[];\n  onChange: (value: string[]) => void;\n  placeholder?: string;\n  disabled?: boolean;\n  className?: string;\n}\n\n// Simpele email validatie\nconst isValidEmail = (email: string): boolean => {\n  const emailRegex = /^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/;\n  return emailRegex.test(email);\n};\n\nexport function RecipientInput({\n  contacts,\n  value,\n  onChange,\n  placeholder = \"Kies een ontvanger...\",\n  disabled = false,\n  className,\n}: RecipientInputProps) {\n  const [open, setOpen] = React.useState(false);\n  const [inputValue, setInputValue] = React.useState(\"\");\n  const [highlightedIndex, setHighlightedIndex] = React.useState(0);\n  const inputRef = React.useRef<HTMLInputElement>(null);\n  const containerRef = React.useRef<HTMLDivElement>(null);\n  const itemRefs = React.useRef<(HTMLButtonElement | null)[]>([]);\n\n  const selectedContacts = React.useMemo(() => {\n    return value\n      .map((email) => {\n        const contact = contacts.find((c) => c.email === email);\n        return contact || { id: email, email, name: email };\n      })\n      .filter(Boolean) as Contact[];\n  }, [value, contacts]);\n\n  const availableContacts = React.useMemo(() => {\n    return contacts.filter((contact) => !value.includes(contact.email));\n  }, [contacts, value]);\n\n  const filteredContacts = React.useMemo(() => {\n    if (!inputValue || !inputValue.trim()) return availableContacts;\n    const search = inputValue.toLowerCase().trim();\n    return availableContacts.filter(\n      (contact) =>\n        contact.email.toLowerCase().includes(search) || contact.name.toLowerCase().includes(search),\n    );\n  }, [availableContacts, inputValue]);\n\n  // biome-ignore lint/correctness/useExhaustiveDependencies: We only want to reset the highlighted index when the filtered contacts change\n  React.useEffect(() => {\n    setHighlightedIndex(0);\n  }, [filteredContacts]);\n\n  React.useEffect(() => {\n    if (open && highlightedIndex >= 0 && itemRefs.current[highlightedIndex]) {\n      itemRefs.current[highlightedIndex]?.scrollIntoView({\n        block: \"nearest\",\n        behavior: \"smooth\",\n      });\n    }\n  }, [highlightedIndex, open]);\n\n  React.useEffect(() => {\n    const handleClickOutside = (event: MouseEvent) => {\n      if (containerRef.current && !containerRef.current.contains(event.target as Node)) {\n        setOpen(false);\n      }\n    };\n\n    if (open) {\n      document.addEventListener(\"mousedown\", handleClickOutside);\n      return () => {\n        document.removeEventListener(\"mousedown\", handleClickOutside);\n      };\n    }\n  }, [open]);\n\n  const handleSelect = (contact: Contact) => {\n    onChange([...value, contact.email]);\n    setInputValue(\"\");\n    setOpen(false);\n    setHighlightedIndex(0);\n    inputRef.current?.focus();\n  };\n\n  const handleAddManualEmail = () => {\n    const trimmedEmail = inputValue.trim();\n\n    if (!trimmedEmail) return;\n\n    if (!isValidEmail(trimmedEmail)) {\n      toast.error(\"Ongeldig email adres\");\n      return;\n    }\n\n    if (value.includes(trimmedEmail)) {\n      toast.error(\"Email is al toegevoegd\");\n      setInputValue(\"\");\n      return;\n    }\n\n    onChange([...value, trimmedEmail]);\n    setInputValue(\"\");\n    setOpen(false);\n    setHighlightedIndex(0);\n    inputRef.current?.focus();\n  };\n\n  const handleRemove = (email: string) => {\n    onChange(value.filter((v) => v !== email));\n    inputRef.current?.focus();\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    if (e.key === \"ArrowDown\") {\n      e.preventDefault();\n      if (!open) {\n        setOpen(true);\n      } else {\n        setHighlightedIndex((prev) => (prev < filteredContacts.length - 1 ? prev + 1 : prev));\n      }\n    } else if (e.key === \"ArrowUp\") {\n      e.preventDefault();\n      if (open) {\n        setHighlightedIndex((prev) => (prev > 0 ? prev - 1 : prev));\n      }\n    } else if (e.key === \"Enter\") {\n      e.preventDefault();\n      if (open && filteredContacts[highlightedIndex]) {\n        // Selecteer contact uit lijst\n        handleSelect(filteredContacts[highlightedIndex]);\n      } else if (inputValue.trim()) {\n        // Voeg handmatig ingevoerde email toe\n        handleAddManualEmail();\n      }\n    } else if (e.key === \"Escape\") {\n      e.preventDefault();\n      setOpen(false);\n    } else if (e.key === \"Backspace\" && !inputValue && value.length > 0) {\n      e.preventDefault();\n      const lastEmail = value[value.length - 1];\n      if (lastEmail) {\n        handleRemove(lastEmail);\n      }\n    }\n  };\n\n  return (\n    <Popover open={open}>\n      <PopoverTrigger asChild>\n        {/** biome-ignore lint/a11y/useKeyWithClickEvents: This is needed */}\n        {/** biome-ignore lint/a11y/noStaticElementInteractions: This is needed */}\n        <div\n          ref={containerRef}\n          className={cn(\n            \"border-input bg-background ring-offset-background flex min-h-0 w-full flex-wrap items-center gap-2 rounded-lg border px-3 py-2 text-base transition-colors md:text-sm\",\n            \"focus-within:border-ring focus-within:ring-ring/50 focus-within:ring-[3px]\",\n            disabled && \"cursor-not-allowed opacity-50\",\n            className,\n          )}\n          onClick={() => {\n            if (!disabled) {\n              inputRef.current?.focus();\n            }\n          }}\n        >\n          {selectedContacts.map((contact) => (\n            <div\n              key={contact.id}\n              className=\"border-border bg-accent/50 flex items-center gap-2 rounded-full border px-2 py-0.5\"\n            >\n              <span className=\"text-xs\">{contact.email}</span>\n              <Button\n                type=\"button\"\n                variant=\"ghost\"\n                size=\"icon\"\n                className=\"hover:bg-destructive/20 h-4 w-4 rounded-full p-0\"\n                onClick={(e) => {\n                  e.stopPropagation();\n                  handleRemove(contact.email);\n                }}\n                disabled={disabled}\n              >\n                <X className=\"h-3 w-3\" />\n                <span className=\"sr-only\">Verwijder {contact.email}</span>\n              </Button>\n            </div>\n          ))}\n          <input\n            ref={inputRef}\n            type=\"text\"\n            value={inputValue}\n            onChange={(e) => {\n              setInputValue(e.target.value);\n              if (e.target.value) {\n                setOpen(true);\n              }\n            }}\n            onKeyDown={handleKeyDown}\n            placeholder={value.length === 0 ? placeholder : \"\"}\n            disabled={disabled}\n            className=\"placeholder:text-muted-foreground min-w-30 flex-1 bg-transparent outline-none placeholder:text-sm disabled:cursor-not-allowed\"\n          />\n        </div>\n      </PopoverTrigger>\n      <PopoverContent\n        className=\"w-full p-0\"\n        align=\"start\"\n        onOpenAutoFocus={(e) => e.preventDefault()}\n        style={{\n          width: containerRef.current?.offsetWidth || \"auto\",\n        }}\n      >\n        <div className=\"max-h-75 overflow-y-auto p-1\">\n          {filteredContacts.length === 0 && inputValue ? (\n            <div className=\"text-muted-foreground px-2 py-2\">\n              <div className=\"mb-2 text-xs\">Geen contacten gevonden.</div>\n              {isValidEmail(inputValue.trim()) && (\n                <button\n                  type=\"button\"\n                  onClick={handleAddManualEmail}\n                  className=\"hover:bg-accent w-full rounded-sm px-2 py-1.5 text-left text-xs transition-colors\"\n                >\n                  <span className=\"font-medium\">Voeg toe: </span>\n                  <span className=\"text-muted-foreground\">{inputValue.trim()}</span>\n                </button>\n              )}\n            </div>\n          ) : filteredContacts.length === 0 ? (\n            <div className=\"text-muted-foreground py-6 text-center text-xs\">\n              Geen contacten gevonden.\n            </div>\n          ) : (\n            <>\n              {filteredContacts.map((contact, index) => (\n                <button\n                  key={contact.id}\n                  ref={(el) => {\n                    itemRefs.current[index] = el;\n                  }}\n                  type=\"button\"\n                  onClick={() => handleSelect(contact)}\n                  className={cn(\n                    \"outline-hidden hover:bg-accent flex w-full items-center gap-2 rounded-sm px-2 py-1.5 text-xs transition-colors\",\n                    highlightedIndex === index && \"bg-accent\",\n                  )}\n                >\n                  <div className=\"flex flex-col items-start\">\n                    <span className=\"text-xs font-medium\">{contact.name}</span>\n                    <span className=\"text-muted-foreground text-xs\">{contact.email}</span>\n                  </div>\n                </button>\n              ))}\n              {inputValue && isValidEmail(inputValue.trim()) && (\n                <div className=\"mt-1 border-t pt-1\">\n                  <button\n                    type=\"button\"\n                    onClick={handleAddManualEmail}\n                    className=\"hover:bg-accent w-full rounded-sm px-2 py-1.5 text-left text-xs transition-colors\"\n                  >\n                    <span className=\"font-medium\">Voeg toe: </span>\n                    <span className=\"text-muted-foreground\">{inputValue.trim()}</span>\n                  </button>\n                </div>\n              )}\n            </>\n          )}\n        </div>\n      </PopoverContent>\n    </Popover>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"input-recipient.mjs","names":["React"],"sources":["../../../src/components/ui/input-recipient.tsx"],"sourcesContent":["\"use client\";\n\nimport { X } from \"lucide-react\";\nimport * as React from \"react\";\nimport { toast } from \"sonner\";\nimport { cn } from \"@/lib/utils/cn\";\n\nimport { Button } from \"./button\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"./popover.client\";\n\nexport type Contact = {\n  id: string;\n  email: string;\n  name: string;\n};\n\ninterface RecipientInputProps {\n  contacts: Contact[];\n  value: string[];\n  onChange: (value: string[]) => void;\n  placeholder?: string;\n  disabled?: boolean;\n  className?: string;\n}\n\n// Simpele email validatie\nconst isValidEmail = (email: string): boolean => {\n  const emailRegex = /^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/;\n  return emailRegex.test(email);\n};\n\nexport function RecipientInput({\n  contacts,\n  value,\n  onChange,\n  placeholder = \"Kies een ontvanger...\",\n  disabled = false,\n  className,\n}: RecipientInputProps) {\n  const [open, setOpen] = React.useState(false);\n  const [inputValue, setInputValue] = React.useState(\"\");\n  const [highlightedIndex, setHighlightedIndex] = React.useState(0);\n  const inputRef = React.useRef<HTMLInputElement>(null);\n  const containerRef = React.useRef<HTMLDivElement>(null);\n  const itemRefs = React.useRef<(HTMLButtonElement | null)[]>([]);\n\n  const selectedContacts = React.useMemo(() => {\n    return value\n      .map((email) => {\n        const contact = contacts.find((c) => c.email === email);\n        return contact || { id: email, email, name: email };\n      })\n      .filter(Boolean) as Contact[];\n  }, [value, contacts]);\n\n  const availableContacts = React.useMemo(() => {\n    return contacts.filter((contact) => !value.includes(contact.email));\n  }, [contacts, value]);\n\n  const filteredContacts = React.useMemo(() => {\n    if (!inputValue || !inputValue.trim()) return availableContacts;\n    const search = inputValue.toLowerCase().trim();\n    return availableContacts.filter(\n      (contact) =>\n        contact.email.toLowerCase().includes(search) || contact.name.toLowerCase().includes(search),\n    );\n  }, [availableContacts, inputValue]);\n\n  // biome-ignore lint/correctness/useExhaustiveDependencies: We only want to reset the highlighted index when the filtered contacts change\n  React.useEffect(() => {\n    setHighlightedIndex(0);\n  }, [filteredContacts]);\n\n  React.useEffect(() => {\n    if (open && highlightedIndex >= 0 && itemRefs.current[highlightedIndex]) {\n      itemRefs.current[highlightedIndex]?.scrollIntoView({\n        block: \"nearest\",\n        behavior: \"smooth\",\n      });\n    }\n  }, [highlightedIndex, open]);\n\n  React.useEffect(() => {\n    const handleClickOutside = (event: MouseEvent) => {\n      if (containerRef.current && !containerRef.current.contains(event.target as Node)) {\n        setOpen(false);\n      }\n    };\n\n    if (open) {\n      document.addEventListener(\"mousedown\", handleClickOutside);\n      return () => {\n        document.removeEventListener(\"mousedown\", handleClickOutside);\n      };\n    }\n  }, [open]);\n\n  const handleSelect = (contact: Contact) => {\n    onChange([...value, contact.email]);\n    setInputValue(\"\");\n    setOpen(false);\n    setHighlightedIndex(0);\n    inputRef.current?.focus();\n  };\n\n  const handleAddManualEmail = () => {\n    const trimmedEmail = inputValue.trim();\n\n    if (!trimmedEmail) return;\n\n    if (!isValidEmail(trimmedEmail)) {\n      toast.error(\"Ongeldig email adres\");\n      return;\n    }\n\n    if (value.includes(trimmedEmail)) {\n      toast.error(\"Email is al toegevoegd\");\n      setInputValue(\"\");\n      return;\n    }\n\n    onChange([...value, trimmedEmail]);\n    setInputValue(\"\");\n    setOpen(false);\n    setHighlightedIndex(0);\n    inputRef.current?.focus();\n  };\n\n  const handleRemove = (email: string) => {\n    onChange(value.filter((v) => v !== email));\n    inputRef.current?.focus();\n  };\n\n  const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {\n    if (e.key === \"ArrowDown\") {\n      e.preventDefault();\n      if (!open) {\n        setOpen(true);\n      } else {\n        setHighlightedIndex((prev) => (prev < filteredContacts.length - 1 ? prev + 1 : prev));\n      }\n    } else if (e.key === \"ArrowUp\") {\n      e.preventDefault();\n      if (open) {\n        setHighlightedIndex((prev) => (prev > 0 ? prev - 1 : prev));\n      }\n    } else if (e.key === \"Enter\") {\n      e.preventDefault();\n      if (open && filteredContacts[highlightedIndex]) {\n        // Selecteer contact uit lijst\n        handleSelect(filteredContacts[highlightedIndex]);\n      } else if (inputValue.trim()) {\n        // Voeg handmatig ingevoerde email toe\n        handleAddManualEmail();\n      }\n    } else if (e.key === \"Escape\") {\n      e.preventDefault();\n      setOpen(false);\n    } else if (e.key === \"Backspace\" && !inputValue && value.length > 0) {\n      e.preventDefault();\n      const lastEmail = value[value.length - 1];\n      if (lastEmail) {\n        handleRemove(lastEmail);\n      }\n    }\n  };\n\n  return (\n    <Popover open={open}>\n      <PopoverTrigger asChild>\n        {/** biome-ignore lint/a11y/useKeyWithClickEvents: This is needed */}\n        {/** biome-ignore lint/a11y/noStaticElementInteractions: This is needed */}\n        <div\n          ref={containerRef}\n          className={cn(\n            \"flex min-h-0 w-full flex-wrap items-center gap-2 rounded-lg border border-input bg-background px-3 py-2 text-base ring-offset-background transition-colors md:text-sm\",\n            \"focus-within:border-ring focus-within:ring-[3px] focus-within:ring-ring/50\",\n            disabled && \"cursor-not-allowed opacity-50\",\n            className,\n          )}\n          onClick={() => {\n            if (!disabled) {\n              inputRef.current?.focus();\n            }\n          }}\n        >\n          {selectedContacts.map((contact) => (\n            <div\n              key={contact.id}\n              className=\"flex items-center gap-2 rounded-full border border-border bg-accent/50 px-2 py-0.5\"\n            >\n              <span className=\"text-xs\">{contact.email}</span>\n              <Button\n                type=\"button\"\n                variant=\"ghost\"\n                size=\"icon\"\n                className=\"h-4 w-4 rounded-full p-0 hover:bg-destructive/20\"\n                onClick={(e) => {\n                  e.stopPropagation();\n                  handleRemove(contact.email);\n                }}\n                disabled={disabled}\n              >\n                <X className=\"h-3 w-3\" />\n                <span className=\"sr-only\">Verwijder {contact.email}</span>\n              </Button>\n            </div>\n          ))}\n          <input\n            ref={inputRef}\n            type=\"text\"\n            value={inputValue}\n            onChange={(e) => {\n              setInputValue(e.target.value);\n              if (e.target.value) {\n                setOpen(true);\n              }\n            }}\n            onKeyDown={handleKeyDown}\n            placeholder={value.length === 0 ? placeholder : \"\"}\n            disabled={disabled}\n            className=\"min-w-30 flex-1 bg-transparent outline-none placeholder:text-muted-foreground placeholder:text-sm disabled:cursor-not-allowed\"\n          />\n        </div>\n      </PopoverTrigger>\n      <PopoverContent\n        className=\"w-full p-0\"\n        align=\"start\"\n        onOpenAutoFocus={(e) => e.preventDefault()}\n        style={{\n          width: containerRef.current?.offsetWidth || \"auto\",\n        }}\n      >\n        <div className=\"max-h-75 overflow-y-auto p-1\">\n          {filteredContacts.length === 0 && inputValue ? (\n            <div className=\"px-2 py-2 text-muted-foreground\">\n              <div className=\"mb-2 text-xs\">Geen contacten gevonden.</div>\n              {isValidEmail(inputValue.trim()) && (\n                <button\n                  type=\"button\"\n                  onClick={handleAddManualEmail}\n                  className=\"w-full rounded-sm px-2 py-1.5 text-left text-xs transition-colors hover:bg-accent\"\n                >\n                  <span className=\"font-medium\">Voeg toe: </span>\n                  <span className=\"text-muted-foreground\">{inputValue.trim()}</span>\n                </button>\n              )}\n            </div>\n          ) : filteredContacts.length === 0 ? (\n            <div className=\"py-6 text-center text-muted-foreground text-xs\">\n              Geen contacten gevonden.\n            </div>\n          ) : (\n            <>\n              {filteredContacts.map((contact, index) => (\n                <button\n                  key={contact.id}\n                  ref={(el) => {\n                    itemRefs.current[index] = el;\n                  }}\n                  type=\"button\"\n                  onClick={() => handleSelect(contact)}\n                  className={cn(\n                    \"flex w-full items-center gap-2 rounded-sm px-2 py-1.5 text-xs outline-hidden transition-colors hover:bg-accent\",\n                    highlightedIndex === index && \"bg-accent\",\n                  )}\n                >\n                  <div className=\"flex flex-col items-start\">\n                    <span className=\"font-medium text-xs\">{contact.name}</span>\n                    <span className=\"text-muted-foreground text-xs\">{contact.email}</span>\n                  </div>\n                </button>\n              ))}\n              {inputValue && isValidEmail(inputValue.trim()) && (\n                <div className=\"mt-1 border-t pt-1\">\n                  <button\n                    type=\"button\"\n                    onClick={handleAddManualEmail}\n                    className=\"w-full rounded-sm px-2 py-1.5 text-left text-xs transition-colors hover:bg-accent\"\n                  >\n                    <span className=\"font-medium\">Voeg toe: </span>\n                    <span className=\"text-muted-foreground\">{inputValue.trim()}</span>\n                  </button>\n                </div>\n              )}\n            </>\n          )}\n        </div>\n      </PopoverContent>\n    </Popover>\n  );\n}\n"],"mappings":"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"}

package/dist/components/ui/input-time.d.mts

@@ -10,5 +10,5 @@ declare function TimeInput({
   ...props
 }: TimeInputProps): react_jsx_runtime0.JSX.Element;
 //#endregion
-export { TimeInput };
+export { TimeInput, TimeInputProps };
 //# sourceMappingURL=input-time.d.mts.map

package/dist/components/ui/input-time.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"input-time.d.mts","names":[],"sources":["../../../src/components/ui/input-time.tsx"],"mappings":";;;;;;KAMK,cAAA,GAAiB,IAAA,CAAK,KAAA,CAAM,cAAA;AAAA,iBAEjB,SAAA,CAAA;EAAY,SAAA;EAAA,GAAc;AAAA,GAAS,cAAA,GAAc,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"input-time.d.mts","names":[],"sources":["../../../src/components/ui/input-time.tsx"],"mappings":";;;;;;KAMY,cAAA,GAAiB,IAAA,CAAK,KAAA,CAAM,cAAA;AAAA,iBAExB,SAAA,CAAA;EAAY,SAAA;EAAA,GAAc;AAAA,GAAS,cAAA,GAAc,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/ui/input-time.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"input-time.mjs","names":[],"sources":["../../../src/components/ui/input-time.tsx"],"sourcesContent":["import { cn } from \"@/lib/utils/cn\";\nimport { Input } from \"./input\";\n\n/**\n * TimeInput\n */\ntype TimeInputProps = Omit<React.ComponentProps<\"input\">, \"type\">;\n\nexport function TimeInput({ className, ...props }: TimeInputProps) {\n  return (\n    <Input\n      {...props}\n      type=\"time\"\n      className={cn(\n        \"appearance-none [&::-webkit-calendar-picker-indicator]:hidden [&::-webkit-calendar-picker-indicator]:appearance-none\",\n        className,\n      )}\n    />\n  );\n}\n"],"mappings":";;;;;AAQA,SAAgB,UAAU,EAAE,WAAW,GAAG,SAAyB;AACjE,QACE,oBAAC;EACC,GAAI;EACJ,MAAK;EACL,WAAW,GACT,wHACA,UACD;GACD"}
+{"version":3,"file":"input-time.mjs","names":[],"sources":["../../../src/components/ui/input-time.tsx"],"sourcesContent":["import { cn } from \"@/lib/utils/cn\";\nimport { Input } from \"./input\";\n\n/**\n * TimeInput\n */\nexport type TimeInputProps = Omit<React.ComponentProps<\"input\">, \"type\">;\n\nexport function TimeInput({ className, ...props }: TimeInputProps) {\n  return (\n    <Input\n      {...props}\n      type=\"time\"\n      className={cn(\n        \"appearance-none [&::-webkit-calendar-picker-indicator]:hidden [&::-webkit-calendar-picker-indicator]:appearance-none\",\n        className,\n      )}\n    />\n  );\n}\n"],"mappings":";;;;;AAQA,SAAgB,UAAU,EAAE,WAAW,GAAG,SAAyB;AACjE,QACE,oBAAC;EACC,GAAI;EACJ,MAAK;EACL,WAAW,GACT,wHACA,UACD;GACD"}

package/dist/components/ui/input.d.mts.map

@@ -1 +1 @@
-{"version":3,"file":"input.d.mts","names":[],"sources":["../../../src/components/ui/input.tsx"],"mappings":";;;;iBAIS,KAAA,CAAA;EAAQ,SAAA;EAAW,IAAA;EAAA,GAAS;AAAA,GAAS,OAAA,CAAM,cAAA,YAAuB,kBAAA,CAAA,GAAA,CAAA,OAAA"}
+{"version":3,"file":"input.d.mts","names":[],"sources":["../../../src/components/ui/input.tsx"],"mappings":";;;;iBAGS,KAAA,CAAA;EAAQ,SAAA;EAAW,IAAA;EAAA,GAAS;AAAA,GAAS,OAAA,CAAM,cAAA,YAAuB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/ui/input.mjs

@@ -6,7 +6,7 @@ function Input({ className, type, ...props }) {
 	return /* @__PURE__ */ jsx("input", {
 		type,
 		"data-slot": "input",
-		className: cn("border-input file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground shadow-xs flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base outline-none transition-[color,box-shadow] file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm", "focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]", "aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive", className),
+		className: cn("h-8 w-full min-w-0 rounded-lg border border-input bg-transparent px-2.5 py-1 text-base outline-none transition-colors file:inline-flex file:h-6 file:border-0 file:bg-transparent file:font-medium file:text-foreground file:text-sm placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:pointer-events-none disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 dark:disabled:bg-input/80", "[&::-webkit-calendar-picker-indicator]:hidden [&::-webkit-calendar-picker-indicator]:appearance-none", className),
 		...props
 	});
 }

package/dist/components/ui/input.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"input.mjs","names":[],"sources":["../../../src/components/ui/input.tsx"],"sourcesContent":["import type * as React from \"react\";\n\nimport { cn } from \"@/lib/utils/cn\";\n\nfunction Input({ className, type, ...props }: React.ComponentProps<\"input\">) {\n  return (\n    <input\n      type={type}\n      data-slot=\"input\"\n      className={cn(\n        \"border-input file:text-foreground placeholder:text-muted-foreground selection:bg-primary selection:text-primary-foreground shadow-xs flex h-9 w-full min-w-0 rounded-md border bg-transparent px-3 py-1 text-base outline-none transition-[color,box-shadow] file:inline-flex file:h-7 file:border-0 file:bg-transparent file:text-sm file:font-medium disabled:pointer-events-none disabled:cursor-not-allowed disabled:opacity-50 md:text-sm\",\n        \"focus-visible:border-ring focus-visible:ring-ring/50 focus-visible:ring-[3px]\",\n        \"aria-invalid:ring-destructive/20 dark:aria-invalid:ring-destructive/40 aria-invalid:border-destructive\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Input };\n"],"mappings":";;;;AAIA,SAAS,MAAM,EAAE,WAAW,MAAM,GAAG,SAAwC;AAC3E,QACE,oBAAC;EACO;EACN,aAAU;EACV,WAAW,GACT,kbACA,iFACA,0GACA,UACD;EACD,GAAI;GACJ"}
+{"version":3,"file":"input.mjs","names":[],"sources":["../../../src/components/ui/input.tsx"],"sourcesContent":["import type * as React from \"react\";\nimport { cn } from \"@/lib/utils/cn\";\n\nfunction Input({ className, type, ...props }: React.ComponentProps<\"input\">) {\n  return (\n    <input\n      type={type}\n      data-slot=\"input\"\n      className={cn(\n        \"h-8 w-full min-w-0 rounded-lg border border-input bg-transparent px-2.5 py-1 text-base outline-none transition-colors file:inline-flex file:h-6 file:border-0 file:bg-transparent file:font-medium file:text-foreground file:text-sm placeholder:text-muted-foreground focus-visible:border-ring focus-visible:ring-3 focus-visible:ring-ring/50 disabled:pointer-events-none disabled:cursor-not-allowed disabled:bg-input/50 disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive/20 md:text-sm dark:bg-input/30 dark:aria-invalid:border-destructive/50 dark:aria-invalid:ring-destructive/40 dark:disabled:bg-input/80\",\n        \"[&::-webkit-calendar-picker-indicator]:hidden [&::-webkit-calendar-picker-indicator]:appearance-none\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nexport { Input };\n"],"mappings":";;;;AAGA,SAAS,MAAM,EAAE,WAAW,MAAM,GAAG,SAAwC;AAC3E,QACE,oBAAC;EACO;EACN,aAAU;EACV,WAAW,GACT,+oBACA,wGACA,UACD;EACD,GAAI;GACJ"}

package/dist/components/ui/item.d.mts

@@ -0,0 +1,63 @@
+import { Separator } from "./separator.mjs";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+import { VariantProps } from "class-variance-authority";
+import * as React$1 from "react";
+import * as class_variance_authority_types0 from "class-variance-authority/types";
+
+//#region src/components/ui/item.d.ts
+declare function ItemGroup({
+  className,
+  ...props
+}: React$1.ComponentProps<"div">): react_jsx_runtime0.JSX.Element;
+declare function ItemSeparator({
+  className,
+  ...props
+}: React$1.ComponentProps<typeof Separator>): react_jsx_runtime0.JSX.Element;
+declare const itemVariants: (props?: ({
+  variant?: "default" | "outline" | "muted" | null | undefined;
+  size?: "default" | "xs" | "sm" | null | undefined;
+} & class_variance_authority_types0.ClassProp) | undefined) => string;
+declare function Item({
+  className,
+  variant,
+  size,
+  asChild,
+  ...props
+}: React$1.ComponentProps<"div"> & VariantProps<typeof itemVariants> & {
+  asChild?: boolean;
+}): react_jsx_runtime0.JSX.Element;
+declare const itemMediaVariants: (props?: ({
+  variant?: "default" | "image" | "icon" | null | undefined;
+} & class_variance_authority_types0.ClassProp) | undefined) => string;
+declare function ItemMedia({
+  className,
+  variant,
+  ...props
+}: React$1.ComponentProps<"div"> & VariantProps<typeof itemMediaVariants>): react_jsx_runtime0.JSX.Element;
+declare function ItemContent({
+  className,
+  ...props
+}: React$1.ComponentProps<"div">): react_jsx_runtime0.JSX.Element;
+declare function ItemTitle({
+  className,
+  ...props
+}: React$1.ComponentProps<"div">): react_jsx_runtime0.JSX.Element;
+declare function ItemDescription({
+  className,
+  ...props
+}: React$1.ComponentProps<"p">): react_jsx_runtime0.JSX.Element;
+declare function ItemActions({
+  className,
+  ...props
+}: React$1.ComponentProps<"div">): react_jsx_runtime0.JSX.Element;
+declare function ItemHeader({
+  className,
+  ...props
+}: React$1.ComponentProps<"div">): react_jsx_runtime0.JSX.Element;
+declare function ItemFooter({
+  className,
+  ...props
+}: React$1.ComponentProps<"div">): react_jsx_runtime0.JSX.Element;
+//#endregion
+export { Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle };
+//# sourceMappingURL=item.d.mts.map

package/dist/components/ui/item.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"item.d.mts","names":[],"sources":["../../../src/components/ui/item.tsx"],"mappings":";;;;;;;iBAMS,SAAA,CAAA;EAAY,SAAA;EAAA,GAAc;AAAA,GAAS,OAAA,CAAM,cAAA,UAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAe9D,aAAA,CAAA;EAAgB,SAAA;EAAA,GAAc;AAAA,GAAS,OAAA,CAAM,cAAA,QAAsB,SAAA,IAAU,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,cAWhF,YAAA,GAAY,KAAA;;;IAoBjB,+BAAA,CAAA,SAAA;AAAA,iBAEQ,IAAA,CAAA;EACP,SAAA;EACA,OAAA;EACA,IAAA;EACA,OAAA;EAAA,GACG;AAAA,GACF,OAAA,CAAM,cAAA,UAAwB,YAAA,QAAoB,YAAA;EAAkB,OAAA;AAAA,IAAmB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,cAapF,iBAAA,GAAiB,KAAA;;IAetB,+BAAA,CAAA,SAAA;AAAA,iBAEQ,SAAA,CAAA;EACP,SAAA;EACA,OAAA;EAAA,GACG;AAAA,GACF,OAAA,CAAM,cAAA,UAAwB,YAAA,QAAoB,iBAAA,IAAkB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAW9D,WAAA,CAAA;EAAc,SAAA;EAAA,GAAc;AAAA,GAAS,OAAA,CAAM,cAAA,UAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAahE,SAAA,CAAA;EAAY,SAAA;EAAA,GAAc;AAAA,GAAS,OAAA,CAAM,cAAA,UAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAa9D,eAAA,CAAA;EAAkB,SAAA;EAAA,GAAc;AAAA,GAAS,OAAA,CAAM,cAAA,QAAmB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAalE,WAAA,CAAA;EAAc,SAAA;EAAA,GAAc;AAAA,GAAS,OAAA,CAAM,cAAA,UAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAMhE,UAAA,CAAA;EAAa,SAAA;EAAA,GAAc;AAAA,GAAS,OAAA,CAAM,cAAA,UAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA;AAAA,iBAU/D,UAAA,CAAA;EAAa,SAAA;EAAA,GAAc;AAAA,GAAS,OAAA,CAAM,cAAA,UAAqB,kBAAA,CAAA,GAAA,CAAA,OAAA"}

package/dist/components/ui/item.mjs

@@ -0,0 +1,119 @@
+import { cn } from "../../lib/utils/cn.mjs";
+import { Separator as Separator$1 } from "./separator.mjs";
+import { jsx } from "react/jsx-runtime";
+import { cva } from "class-variance-authority";
+import { Slot } from "radix-ui";
+
+//#region src/components/ui/item.tsx
+function ItemGroup({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		role: "list",
+		"data-slot": "item-group",
+		className: cn("group/item-group flex w-full flex-col gap-4 has-data-[size=sm]:gap-2.5 has-data-[size=xs]:gap-2", className),
+		...props
+	});
+}
+function ItemSeparator({ className, ...props }) {
+	return /* @__PURE__ */ jsx(Separator$1, {
+		"data-slot": "item-separator",
+		orientation: "horizontal",
+		className: cn("my-2", className),
+		...props
+	});
+}
+const itemVariants = cva("[a]:hover:bg-muted rounded-lg border text-sm group/item flex w-full flex-wrap items-center transition-colors duration-100 outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 [a]:transition-colors", {
+	variants: {
+		variant: {
+			default: "border-transparent",
+			outline: "border-border",
+			muted: "bg-muted/50 border-transparent"
+		},
+		size: {
+			default: "gap-2.5 px-3 py-2.5",
+			sm: "gap-2.5 px-3 py-2.5",
+			xs: "gap-2 px-2.5 py-2 in-data-[slot=dropdown-menu-content]:p-0"
+		}
+	},
+	defaultVariants: {
+		variant: "default",
+		size: "default"
+	}
+});
+function Item({ className, variant = "default", size = "default", asChild = false, ...props }) {
+	return /* @__PURE__ */ jsx(asChild ? Slot.Root : "div", {
+		"data-slot": "item",
+		"data-variant": variant,
+		"data-size": size,
+		className: cn(itemVariants({
+			variant,
+			size,
+			className
+		})),
+		...props
+	});
+}
+const itemMediaVariants = cva("gap-2 group-has-data-[slot=item-description]/item:translate-y-0.5 group-has-data-[slot=item-description]/item:self-start flex shrink-0 items-center justify-center [&_svg]:pointer-events-none", {
+	variants: { variant: {
+		default: "bg-transparent",
+		icon: "[&_svg:not([class*='size-'])]:size-4",
+		image: "size-10 overflow-hidden rounded-sm group-data-[size=sm]/item:size-8 group-data-[size=xs]/item:size-6 [&_img]:size-full [&_img]:object-cover"
+	} },
+	defaultVariants: { variant: "default" }
+});
+function ItemMedia({ className, variant = "default", ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "item-media",
+		"data-variant": variant,
+		className: cn(itemMediaVariants({
+			variant,
+			className
+		})),
+		...props
+	});
+}
+function ItemContent({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "item-content",
+		className: cn("flex flex-1 flex-col gap-1 group-data-[size=xs]/item:gap-0 [&+[data-slot=item-content]]:flex-none", className),
+		...props
+	});
+}
+function ItemTitle({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "item-title",
+		className: cn("line-clamp-1 flex w-fit items-center gap-2 font-medium text-sm leading-snug underline-offset-4", className),
+		...props
+	});
+}
+function ItemDescription({ className, ...props }) {
+	return /* @__PURE__ */ jsx("p", {
+		"data-slot": "item-description",
+		className: cn("line-clamp-2 text-left font-normal text-muted-foreground text-sm leading-normal group-data-[size=xs]/item:text-xs [&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4", className),
+		...props
+	});
+}
+function ItemActions({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "item-actions",
+		className: cn("flex items-center gap-2", className),
+		...props
+	});
+}
+function ItemHeader({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "item-header",
+		className: cn("flex basis-full items-center justify-between gap-2", className),
+		...props
+	});
+}
+function ItemFooter({ className, ...props }) {
+	return /* @__PURE__ */ jsx("div", {
+		"data-slot": "item-footer",
+		className: cn("flex basis-full items-center justify-between gap-2", className),
+		...props
+	});
+}
+
+//#endregion
+export { Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle };
+//# sourceMappingURL=item.mjs.map

package/dist/components/ui/item.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"item.mjs","names":["Separator"],"sources":["../../../src/components/ui/item.tsx"],"sourcesContent":["import { cva, type VariantProps } from \"class-variance-authority\";\nimport { Slot } from \"radix-ui\";\nimport type * as React from \"react\";\nimport { Separator } from \"@/components/ui/separator\";\nimport { cn } from \"@/lib/utils/cn\";\n\nfunction ItemGroup({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    // biome-ignore lint/a11y/useSemanticElements: The list role is used to group items together, but the div element is used for styling purposes.\n    <div\n      role=\"list\"\n      data-slot=\"item-group\"\n      className={cn(\n        \"group/item-group flex w-full flex-col gap-4 has-data-[size=sm]:gap-2.5 has-data-[size=xs]:gap-2\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction ItemSeparator({ className, ...props }: React.ComponentProps<typeof Separator>) {\n  return (\n    <Separator\n      data-slot=\"item-separator\"\n      orientation=\"horizontal\"\n      className={cn(\"my-2\", className)}\n      {...props}\n    />\n  );\n}\n\nconst itemVariants = cva(\n  \"[a]:hover:bg-muted rounded-lg border text-sm group/item flex w-full flex-wrap items-center transition-colors duration-100 outline-none focus-visible:border-ring focus-visible:ring-[3px] focus-visible:ring-ring/50 [a]:transition-colors\",\n  {\n    variants: {\n      variant: {\n        default: \"border-transparent\",\n        outline: \"border-border\",\n        muted: \"bg-muted/50 border-transparent\",\n      },\n      size: {\n        default: \"gap-2.5 px-3 py-2.5\",\n        sm: \"gap-2.5 px-3 py-2.5\",\n        xs: \"gap-2 px-2.5 py-2 in-data-[slot=dropdown-menu-content]:p-0\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n      size: \"default\",\n    },\n  },\n);\n\nfunction Item({\n  className,\n  variant = \"default\",\n  size = \"default\",\n  asChild = false,\n  ...props\n}: React.ComponentProps<\"div\"> & VariantProps<typeof itemVariants> & { asChild?: boolean }) {\n  const Comp = asChild ? Slot.Root : \"div\";\n  return (\n    <Comp\n      data-slot=\"item\"\n      data-variant={variant}\n      data-size={size}\n      className={cn(itemVariants({ variant, size, className }))}\n      {...props}\n    />\n  );\n}\n\nconst itemMediaVariants = cva(\n  \"gap-2 group-has-data-[slot=item-description]/item:translate-y-0.5 group-has-data-[slot=item-description]/item:self-start flex shrink-0 items-center justify-center [&_svg]:pointer-events-none\",\n  {\n    variants: {\n      variant: {\n        default: \"bg-transparent\",\n        icon: \"[&_svg:not([class*='size-'])]:size-4\",\n        image:\n          \"size-10 overflow-hidden rounded-sm group-data-[size=sm]/item:size-8 group-data-[size=xs]/item:size-6 [&_img]:size-full [&_img]:object-cover\",\n      },\n    },\n    defaultVariants: {\n      variant: \"default\",\n    },\n  },\n);\n\nfunction ItemMedia({\n  className,\n  variant = \"default\",\n  ...props\n}: React.ComponentProps<\"div\"> & VariantProps<typeof itemMediaVariants>) {\n  return (\n    <div\n      data-slot=\"item-media\"\n      data-variant={variant}\n      className={cn(itemMediaVariants({ variant, className }))}\n      {...props}\n    />\n  );\n}\n\nfunction ItemContent({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"item-content\"\n      className={cn(\n        \"flex flex-1 flex-col gap-1 group-data-[size=xs]/item:gap-0 [&+[data-slot=item-content]]:flex-none\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction ItemTitle({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"item-title\"\n      className={cn(\n        \"line-clamp-1 flex w-fit items-center gap-2 font-medium text-sm leading-snug underline-offset-4\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction ItemDescription({ className, ...props }: React.ComponentProps<\"p\">) {\n  return (\n    <p\n      data-slot=\"item-description\"\n      className={cn(\n        \"line-clamp-2 text-left font-normal text-muted-foreground text-sm leading-normal group-data-[size=xs]/item:text-xs [&>a:hover]:text-primary [&>a]:underline [&>a]:underline-offset-4\",\n        className,\n      )}\n      {...props}\n    />\n  );\n}\n\nfunction ItemActions({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div data-slot=\"item-actions\" className={cn(\"flex items-center gap-2\", className)} {...props} />\n  );\n}\n\nfunction ItemHeader({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"item-header\"\n      className={cn(\"flex basis-full items-center justify-between gap-2\", className)}\n      {...props}\n    />\n  );\n}\n\nfunction ItemFooter({ className, ...props }: React.ComponentProps<\"div\">) {\n  return (\n    <div\n      data-slot=\"item-footer\"\n      className={cn(\"flex basis-full items-center justify-between gap-2\", className)}\n      {...props}\n    />\n  );\n}\n\nexport {\n  Item,\n  ItemMedia,\n  ItemContent,\n  ItemActions,\n  ItemGroup,\n  ItemSeparator,\n  ItemTitle,\n  ItemDescription,\n  ItemHeader,\n  ItemFooter,\n};\n"],"mappings":";;;;;;;AAMA,SAAS,UAAU,EAAE,WAAW,GAAG,SAAsC;AACvE,QAEE,oBAAC;EACC,MAAK;EACL,aAAU;EACV,WAAW,GACT,mGACA,UACD;EACD,GAAI;GACJ;;AAIN,SAAS,cAAc,EAAE,WAAW,GAAG,SAAiD;AACtF,QACE,oBAACA;EACC,aAAU;EACV,aAAY;EACZ,WAAW,GAAG,QAAQ,UAAU;EAChC,GAAI;GACJ;;AAIN,MAAM,eAAe,IACnB,8OACA;CACE,UAAU;EACR,SAAS;GACP,SAAS;GACT,SAAS;GACT,OAAO;GACR;EACD,MAAM;GACJ,SAAS;GACT,IAAI;GACJ,IAAI;GACL;EACF;CACD,iBAAiB;EACf,SAAS;EACT,MAAM;EACP;CACF,CACF;AAED,SAAS,KAAK,EACZ,WACA,UAAU,WACV,OAAO,WACP,UAAU,OACV,GAAG,SACuF;AAE1F,QACE,oBAFW,UAAU,KAAK,OAAO;EAG/B,aAAU;EACV,gBAAc;EACd,aAAW;EACX,WAAW,GAAG,aAAa;GAAE;GAAS;GAAM;GAAW,CAAC,CAAC;EACzD,GAAI;GACJ;;AAIN,MAAM,oBAAoB,IACxB,kMACA;CACE,UAAU,EACR,SAAS;EACP,SAAS;EACT,MAAM;EACN,OACE;EACH,EACF;CACD,iBAAiB,EACf,SAAS,WACV;CACF,CACF;AAED,SAAS,UAAU,EACjB,WACA,UAAU,WACV,GAAG,SACoE;AACvE,QACE,oBAAC;EACC,aAAU;EACV,gBAAc;EACd,WAAW,GAAG,kBAAkB;GAAE;GAAS;GAAW,CAAC,CAAC;EACxD,GAAI;GACJ;;AAIN,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;AACzE,QACE,oBAAC;EACC,aAAU;EACV,WAAW,GACT,qGACA,UACD;EACD,GAAI;GACJ;;AAIN,SAAS,UAAU,EAAE,WAAW,GAAG,SAAsC;AACvE,QACE,oBAAC;EACC,aAAU;EACV,WAAW,GACT,kGACA,UACD;EACD,GAAI;GACJ;;AAIN,SAAS,gBAAgB,EAAE,WAAW,GAAG,SAAoC;AAC3E,QACE,oBAAC;EACC,aAAU;EACV,WAAW,GACT,uLACA,UACD;EACD,GAAI;GACJ;;AAIN,SAAS,YAAY,EAAE,WAAW,GAAG,SAAsC;AACzE,QACE,oBAAC;EAAI,aAAU;EAAe,WAAW,GAAG,2BAA2B,UAAU;EAAE,GAAI;GAAS;;AAIpG,SAAS,WAAW,EAAE,WAAW,GAAG,SAAsC;AACxE,QACE,oBAAC;EACC,aAAU;EACV,WAAW,GAAG,sDAAsD,UAAU;EAC9E,GAAI;GACJ;;AAIN,SAAS,WAAW,EAAE,WAAW,GAAG,SAAsC;AACxE,QACE,oBAAC;EACC,aAAU;EACV,WAAW,GAAG,sDAAsD,UAAU;EAC9E,GAAI;GACJ"}