erp-pro-ui 0.1.7 → 0.1.8

package/dist/chunks/{select-SOmIt-BD.cjs → select-CORFYTvs.cjs}

@@ -2,14 +2,14 @@ require("./chunk-B_GkZjkl.cjs");
 const require_utils = require("./utils-B4SmmY4J.cjs");
 const require_truncated_text = require("./truncated-text-istgJRUq.cjs");
 const require_icons = require("./icons-CRanVZB1.cjs");
+const require_DropdownMenu = require("./DropdownMenu-DOvo5pV_.cjs");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
 let framer_motion = require("framer-motion");
 //#region src/components/forms/select/Select.tsx
-var Select = (0, react.forwardRef)(function SelectComponent({ className = "", containerClassName = "", triggerClassName = "", dropdownClassName = "", optionClassName = "", label, error, helperText, options, value, onChange, placeholder = "Select...", disabled, bgClassName = "bg-ds-surface-1", size = "default", selectionIndicator = "check", ...props }, ref) {
+var Select = (0, react.forwardRef)(function SelectComponent({ className = "", containerClassName = "", triggerClassName = "", dropdownClassName = "", optionClassName = "", label, error, helperText, options, value, onChange, placeholder = "Select...", noOptionsText = "No options", disabled, bgClassName = "bg-ds-surface-1", size = "default", selectionIndicator = "check", ...props }, ref) {
 	const [open, setOpen] = (0, react.useState)(false);
 	const [visible, setVisible] = (0, react.useState)(false);
-	const containerRef = (0, react.useRef)(null);
 	const hiddenSelectRef = (0, react.useRef)(null);
 	const selectedOptionRef = (0, react.useRef)(null);
 	const mouseX = (0, framer_motion.useMotionValue)(0);
@@ -24,15 +24,6 @@ var Select = (0, react.forwardRef)(function SelectComponent({ className = "", co
 		}
 		if (ref) ref.current = hiddenSelectRef.current;
 	}, [ref]);
-	(0, react.useEffect)(() => {
-		const handleClick = (event) => {
-			if (containerRef.current && !containerRef.current.contains(event.target)) setOpen(false);
-		};
-		if (open) document.addEventListener("mousedown", handleClick);
-		return () => {
-			document.removeEventListener("mousedown", handleClick);
-		};
-	}, [open]);
 	(0, react.useEffect)(() => {
 		if (!open || !selectedOptionRef.current) return;
 		const frameId = window.requestAnimationFrame(() => {
@@ -90,10 +81,19 @@ var Select = (0, react.forwardRef)(function SelectComponent({ className = "", co
 					children: option.label
 				}, option.value))]
 			}),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-				ref: containerRef,
-				className: require_utils.mergeClassNames("relative w-full", className),
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(framer_motion.motion.div, {
+			/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_DropdownMenu.DropdownMenu, {
+				className: require_utils.mergeClassNames("w-full", className),
+				open,
+				onOpenChange: (nextOpen) => {
+					if (disabled) {
+						setOpen(false);
+						return;
+					}
+					setOpen(nextOpen);
+				},
+				panelClassName: require_utils.mergeClassNames(" left-0 top-[40px] z-20 mt-1 flex flex-col overflow-auto rounded-lg border border-ds-border-2 bg-ds-surface-1 shadow-3 backdrop-blur-xl transition", isCompact ? "max-h-56" : "max-h-60", dropdownClassName),
+				animationClassName: "origin-top-left",
+				trigger: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(framer_motion.motion.div, {
 					style: { backgroundImage: disabled ? "none" : framer_motion.useMotionTemplate`
                   radial-gradient(
                     ${visible ? `${radius}px` : "0px"} circle at ${mouseX}px ${mouseY}px,
@@ -104,12 +104,9 @@ var Select = (0, react.forwardRef)(function SelectComponent({ className = "", co
 					onMouseMove: !disabled ? handleMouseMove : void 0,
 					onMouseEnter: !disabled ? () => setVisible(true) : void 0,
 					onMouseLeave: !disabled ? () => setVisible(false) : void 0,
-					className: require_utils.mergeClassNames("group/select rounded-lg p-[2px] transition duration-300 hover:border-ds-border-accent", disabled ? "border-none bg-ds-surface-1" : error ? "border-ds-state-error-border" : "border-ds-border-2"),
+					className: require_utils.mergeClassNames("group/select w-full rounded-lg p-[2px] transition duration-300 hover:border-ds-border-accent", disabled ? "border-none bg-ds-surface-1" : error ? "border-ds-state-error-border" : "border-ds-border-2"),
 					children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
 						className: require_utils.mergeClassNames("flex w-full cursor-pointer items-center justify-between rounded-md border border-ds-border-field transition duration-400 ease-in-out", isCompact ? "h-9 px-2.5 py-2 text-sm" : "h-10 px-3 py-2 text-sm", bgClassName, disabled ? "cursor-not-allowed opacity-50" : "text-ds-1", error ? "border-ds-state-error-border text-ds-state-error-text focus-visible:ring-ds-state-error-border" : "", triggerClassName),
-						onClick: () => {
-							if (!disabled) setOpen((current) => !current);
-						},
 						onKeyDown: handleKeyDown,
 						role: "button",
 						tabIndex: disabled ? -1 : 0,
@@ -134,30 +131,28 @@ var Select = (0, react.forwardRef)(function SelectComponent({ className = "", co
 							})
 						})]
 					})
-				}), open && !disabled ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-					className: require_utils.mergeClassNames("absolute right-0 left-0 z-20 mt-1 flex flex-col overflow-auto rounded-lg border border-ds-border-2 bg-ds-surface-1 shadow-3 backdrop-blur-xl transition", isCompact ? "max-h-56" : "max-h-60", dropdownClassName),
-					children: [options.length === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-						className: "px-3 py-2 text-ds-2",
-						children: "No options"
-					}) : null, options.map((option) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-						ref: option.value === value ? selectedOptionRef : null,
-						className: require_utils.mergeClassNames("mx-1 my-1 flex cursor-pointer items-center rounded-md text-ds-1 transition", isCompact ? "gap-1.5 px-2.5 py-2 text-sm" : "gap-2 px-3 py-2 text-sm", option.value === value ? "bg-ds-accent-subtle font-semibold text-ds-1" : "", "hover:bg-ds-accent hover:text-ds-on-accent", optionClassName),
-						onClick: () => handleSelect(option.value),
-						children: [selectionIndicator === "check" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-							className: require_utils.mergeClassNames("flex items-center justify-center", isCompact ? "w-4" : "w-5"),
-							children: option.value === value ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_icons.CheckIcon, {
-								className: "text-ds-1",
-								width: isCompact ? 16 : 18,
-								height: isCompact ? 16 : 18
-							}) : null
-						}) : null, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_truncated_text.TruncatedText, {
-							as: "span",
-							showTitleOnHover: true,
-							className: "flex-1",
-							children: option.label
-						})]
-					}, option.value))]
-				}) : null]
+				}),
+				children: !disabled ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [options.length === 0 ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+					className: "px-3 py-2 text-ds-2",
+					children: noOptionsText
+				}) : null, options.map((option) => /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+					ref: option.value === value ? selectedOptionRef : null,
+					className: require_utils.mergeClassNames("mx-1 my-1 flex cursor-pointer items-center rounded-md text-ds-1 transition", isCompact ? "gap-1.5 px-2.5 py-2 text-sm" : "gap-2 px-3 py-2 text-sm", option.value === value ? "bg-ds-accent-subtle font-semibold text-ds-1" : "", "hover:bg-ds-accent hover:text-ds-on-accent", optionClassName),
+					onClick: () => handleSelect(option.value),
+					children: [selectionIndicator === "check" ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+						className: require_utils.mergeClassNames("flex items-center justify-center", isCompact ? "w-4" : "w-5"),
+						children: option.value === value ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_icons.CheckIcon, {
+							className: "text-ds-1",
+							width: isCompact ? 16 : 18,
+							height: isCompact ? 16 : 18
+						}) : null
+					}) : null, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_truncated_text.TruncatedText, {
+						as: "span",
+						showTitleOnHover: true,
+						className: "flex-1",
+						children: option.label
+					})]
+				}, option.value))] }) : null
 			}),
 			error ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
 				className: "mt-1 text-sm font-medium text-ds-state-error-text",
@@ -179,4 +174,4 @@ Object.defineProperty(exports, "Select", {
 	}
 });
 
-//# sourceMappingURL=select-SOmIt-BD.cjs.map
+//# sourceMappingURL=select-CORFYTvs.cjs.map

package/dist/chunks/select-CORFYTvs.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"select-CORFYTvs.cjs","names":[],"sources":["../../src/components/forms/select/Select.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useEffect,\n  useRef,\n  useState,\n  type ChangeEvent,\n  type ForwardedRef,\n  type KeyboardEvent,\n  type MouseEvent as ReactMouseEvent,\n} from \"react\";\nimport { motion, useMotionTemplate, useMotionValue } from \"framer-motion\";\n\nimport { CheckIcon, ChevronDownIcon } from \"../../icons\";\nimport { DropdownMenu } from \"../../overlays/dropdown-menu\";\nimport { TruncatedText } from \"../../typography/truncated-text\";\nimport { mergeClassNames } from \"../../../utils\";\nimport type { SelectProps } from \"./types\";\n\nexport const Select = forwardRef(function SelectComponent(\n  {\n    className = \"\",\n    containerClassName = \"\",\n    triggerClassName = \"\",\n    dropdownClassName = \"\",\n    optionClassName = \"\",\n    label,\n    error,\n    helperText,\n    options,\n    value,\n    onChange,\n    placeholder = \"Select...\",\n    noOptionsText = \"No options\",\n    disabled,\n    bgClassName = \"bg-ds-surface-1\",\n    size = \"default\",\n    selectionIndicator = \"check\",\n    ...props\n  }: SelectProps,\n  ref: ForwardedRef<HTMLSelectElement>,\n) {\n  const [open, setOpen] = useState(false);\n  const [visible, setVisible] = useState(false);\n  const hiddenSelectRef = useRef<HTMLSelectElement>(null);\n  const selectedOptionRef = useRef<HTMLDivElement>(null);\n  const mouseX = useMotionValue(0);\n  const mouseY = useMotionValue(0);\n  const radius = 100;\n  const isCompact = size === \"compact\";\n  const selectedOption = options.find((option) => option.value === value);\n\n  useEffect(() => {\n    if (typeof ref === \"function\") {\n      ref(hiddenSelectRef.current);\n      return;\n    }\n\n    if (ref) {\n      ref.current = hiddenSelectRef.current;\n    }\n  }, [ref]);\n\n  useEffect(() => {\n    if (!open || !selectedOptionRef.current) {\n      return;\n    }\n\n    const frameId = window.requestAnimationFrame(() => {\n      selectedOptionRef.current?.scrollIntoView({ block: \"nearest\" });\n    });\n\n    return () => {\n      window.cancelAnimationFrame(frameId);\n    };\n  }, [open, value]);\n\n  const handleMouseMove = (event: ReactMouseEvent<HTMLDivElement>) => {\n    const { left, top } = event.currentTarget.getBoundingClientRect();\n    mouseX.set(event.clientX - left);\n    mouseY.set(event.clientY - top);\n  };\n\n  const handleSelect = (optionValue: string) => {\n    if (onChange && hiddenSelectRef.current) {\n      const syntheticEvent = {\n        target: { value: optionValue, name: props.name },\n        currentTarget: { value: optionValue, name: props.name },\n      } as ChangeEvent<HTMLSelectElement>;\n\n      onChange(syntheticEvent);\n    }\n\n    setOpen(false);\n  };\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n    if (disabled) {\n      return;\n    }\n\n    if (event.key === \"Enter\" || event.key === \" \") {\n      event.preventDefault();\n      setOpen((current) => !current);\n    }\n\n    if (event.key === \"Escape\") {\n      setOpen(false);\n    }\n  };\n\n  return (\n    <div\n      className={mergeClassNames(\n        \"w-full\",\n        isCompact ? \"min-w-0\" : \"min-w-48\",\n        containerClassName,\n      )}\n    >\n      {label ? (\n        <label className=\"mb-2 block text-sm leading-none font-medium text-ds-1 peer-disabled:cursor-not-allowed peer-disabled:opacity-70\">\n          {label}\n        </label>\n      ) : null}\n\n      <select\n        ref={hiddenSelectRef}\n        className=\"sr-only\"\n        value={value}\n        onChange={onChange}\n        disabled={disabled}\n        {...props}\n      >\n        <option value=\"\">{placeholder}</option>\n        {options.map((option) => (\n          <option key={option.value} value={option.value}>\n            {option.label}\n          </option>\n        ))}\n      </select>\n\n      <DropdownMenu\n        className={mergeClassNames(\"w-full\", className)}\n        open={open}\n        onOpenChange={(nextOpen) => {\n          if (disabled) {\n            setOpen(false);\n            return;\n          }\n\n          setOpen(nextOpen);\n        }}\n        panelClassName={mergeClassNames(\n          \" left-0 top-[40px] z-20 mt-1 flex flex-col overflow-auto rounded-lg border border-ds-border-2 bg-ds-surface-1 shadow-3 backdrop-blur-xl transition\",\n          isCompact ? \"max-h-56\" : \"max-h-60\",\n          dropdownClassName,\n        )}\n        animationClassName=\"origin-top-left\"\n        trigger={\n          <motion.div\n            style={{\n              backgroundImage: disabled\n                ? \"none\"\n                : useMotionTemplate`\n                  radial-gradient(\n                    ${visible ? `${radius}px` : \"0px\"} circle at ${mouseX}px ${mouseY}px,\n                    var(--ds-color-accent),\n                    transparent 90%\n                  )\n                `,\n            }}\n            onMouseMove={!disabled ? handleMouseMove : undefined}\n            onMouseEnter={!disabled ? () => setVisible(true) : undefined}\n            onMouseLeave={!disabled ? () => setVisible(false) : undefined}\n            className={mergeClassNames(\n              \"group/select w-full rounded-lg p-[2px] transition duration-300 hover:border-ds-border-accent\",\n              disabled\n                ? \"border-none bg-ds-surface-1\"\n                : error\n                  ? \"border-ds-state-error-border\"\n                  : \"border-ds-border-2\",\n            )}\n          >\n            <div\n              className={mergeClassNames(\n                \"flex w-full cursor-pointer items-center justify-between rounded-md border border-ds-border-field transition duration-400 ease-in-out\",\n                isCompact\n                  ? \"h-9 px-2.5 py-2 text-sm\"\n                  : \"h-10 px-3 py-2 text-sm\",\n                bgClassName,\n                disabled ? \"cursor-not-allowed opacity-50\" : \"text-ds-1\",\n                error\n                  ? \"border-ds-state-error-border text-ds-state-error-text focus-visible:ring-ds-state-error-border\"\n                  : \"\",\n                triggerClassName,\n              )}\n              onKeyDown={handleKeyDown}\n              role=\"button\"\n              tabIndex={disabled ? -1 : 0}\n              aria-haspopup=\"listbox\"\n              aria-expanded={open}\n            >\n              {selectedOption ? (\n                <TruncatedText\n                  as=\"span\"\n                  showTitleOnHover\n                  className=\"flex-1 text-ds-1\"\n                >\n                  {selectedOption.label}\n                </TruncatedText>\n              ) : (\n                <TruncatedText as=\"span\" className=\"flex-1 text-ds-2\">\n                  {placeholder}\n                </TruncatedText>\n              )}\n\n              <span\n                className={mergeClassNames(\n                  \"ml-2 shrink-0 text-ds-2 transition-transform duration-300\",\n                  open ? \"rotate-180\" : \"rotate-0\",\n                )}\n              >\n                <ChevronDownIcon\n                  width={24}\n                  height={24}\n                  color=\"currentColor\"\n                  className={isCompact ? \"h-4 w-4\" : \"h-5 w-5\"}\n                />\n              </span>\n            </div>\n          </motion.div>\n        }\n      >\n        {!disabled ? (\n          <>\n            {options.length === 0 ? (\n              <div className=\"px-3 py-2 text-ds-2\">{noOptionsText}</div>\n            ) : null}\n\n            {options.map((option) => (\n              <div\n                key={option.value}\n                ref={option.value === value ? selectedOptionRef : null}\n                className={mergeClassNames(\n                  \"mx-1 my-1 flex cursor-pointer items-center rounded-md text-ds-1 transition\",\n                  isCompact\n                    ? \"gap-1.5 px-2.5 py-2 text-sm\"\n                    : \"gap-2 px-3 py-2 text-sm\",\n                  option.value === value\n                    ? \"bg-ds-accent-subtle font-semibold text-ds-1\"\n                    : \"\",\n                  \"hover:bg-ds-accent hover:text-ds-on-accent\",\n                  optionClassName,\n                )}\n                onClick={() => handleSelect(option.value)}\n              >\n                {selectionIndicator === \"check\" ? (\n                  <span\n                    className={mergeClassNames(\n                      \"flex items-center justify-center\",\n                      isCompact ? \"w-4\" : \"w-5\",\n                    )}\n                  >\n                    {option.value === value ? (\n                      <CheckIcon\n                        className=\"text-ds-1\"\n                        width={isCompact ? 16 : 18}\n                        height={isCompact ? 16 : 18}\n                      />\n                    ) : null}\n                  </span>\n                ) : null}\n                <TruncatedText as=\"span\" showTitleOnHover className=\"flex-1\">\n                  {option.label}\n                </TruncatedText>\n              </div>\n            ))}\n          </>\n        ) : null}\n      </DropdownMenu>\n\n      {error ? (\n        <p className=\"mt-1 text-sm font-medium text-ds-state-error-text\">\n          {error}\n        </p>\n      ) : null}\n      {helperText && !error ? (\n        <p className=\"mt-1 text-sm text-ds-2\">{helperText}</p>\n      ) : null}\n    </div>\n  );\n});\n\nSelect.displayName = \"Select\";\n"],"mappings":"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"}

package/dist/chunks/{select-1rSJeUBQ.mjs → select-D0GOBB-b.mjs}

@@ -1,14 +1,14 @@
 import { n as mergeClassNames } from "./utils-ati1KkDb.mjs";
 import { t as TruncatedText } from "./truncated-text-DTgks5yS.mjs";
 import { J as CheckIcon, N as ChevronDownIcon } from "./icons-bx3nrxNv.mjs";
+import { t as DropdownMenu } from "./DropdownMenu-C17Zqu_E.mjs";
 import { forwardRef, useEffect, useRef, useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { motion, useMotionTemplate, useMotionValue } from "framer-motion";
 //#region src/components/forms/select/Select.tsx
-var Select = forwardRef(function SelectComponent({ className = "", containerClassName = "", triggerClassName = "", dropdownClassName = "", optionClassName = "", label, error, helperText, options, value, onChange, placeholder = "Select...", disabled, bgClassName = "bg-ds-surface-1", size = "default", selectionIndicator = "check", ...props }, ref) {
+var Select = forwardRef(function SelectComponent({ className = "", containerClassName = "", triggerClassName = "", dropdownClassName = "", optionClassName = "", label, error, helperText, options, value, onChange, placeholder = "Select...", noOptionsText = "No options", disabled, bgClassName = "bg-ds-surface-1", size = "default", selectionIndicator = "check", ...props }, ref) {
 	const [open, setOpen] = useState(false);
 	const [visible, setVisible] = useState(false);
-	const containerRef = useRef(null);
 	const hiddenSelectRef = useRef(null);
 	const selectedOptionRef = useRef(null);
 	const mouseX = useMotionValue(0);
@@ -23,15 +23,6 @@ var Select = forwardRef(function SelectComponent({ className = "", containerClas
 		}
 		if (ref) ref.current = hiddenSelectRef.current;
 	}, [ref]);
-	useEffect(() => {
-		const handleClick = (event) => {
-			if (containerRef.current && !containerRef.current.contains(event.target)) setOpen(false);
-		};
-		if (open) document.addEventListener("mousedown", handleClick);
-		return () => {
-			document.removeEventListener("mousedown", handleClick);
-		};
-	}, [open]);
 	useEffect(() => {
 		if (!open || !selectedOptionRef.current) return;
 		const frameId = window.requestAnimationFrame(() => {
@@ -89,10 +80,19 @@ var Select = forwardRef(function SelectComponent({ className = "", containerClas
 					children: option.label
 				}, option.value))]
 			}),
-			/* @__PURE__ */ jsxs("div", {
-				ref: containerRef,
-				className: mergeClassNames("relative w-full", className),
-				children: [/* @__PURE__ */ jsx(motion.div, {
+			/* @__PURE__ */ jsx(DropdownMenu, {
+				className: mergeClassNames("w-full", className),
+				open,
+				onOpenChange: (nextOpen) => {
+					if (disabled) {
+						setOpen(false);
+						return;
+					}
+					setOpen(nextOpen);
+				},
+				panelClassName: mergeClassNames(" left-0 top-[40px] z-20 mt-1 flex flex-col overflow-auto rounded-lg border border-ds-border-2 bg-ds-surface-1 shadow-3 backdrop-blur-xl transition", isCompact ? "max-h-56" : "max-h-60", dropdownClassName),
+				animationClassName: "origin-top-left",
+				trigger: /* @__PURE__ */ jsx(motion.div, {
 					style: { backgroundImage: disabled ? "none" : useMotionTemplate`
                   radial-gradient(
                     ${visible ? `${radius}px` : "0px"} circle at ${mouseX}px ${mouseY}px,
@@ -103,12 +103,9 @@ var Select = forwardRef(function SelectComponent({ className = "", containerClas
 					onMouseMove: !disabled ? handleMouseMove : void 0,
 					onMouseEnter: !disabled ? () => setVisible(true) : void 0,
 					onMouseLeave: !disabled ? () => setVisible(false) : void 0,
-					className: mergeClassNames("group/select rounded-lg p-[2px] transition duration-300 hover:border-ds-border-accent", disabled ? "border-none bg-ds-surface-1" : error ? "border-ds-state-error-border" : "border-ds-border-2"),
+					className: mergeClassNames("group/select w-full rounded-lg p-[2px] transition duration-300 hover:border-ds-border-accent", disabled ? "border-none bg-ds-surface-1" : error ? "border-ds-state-error-border" : "border-ds-border-2"),
 					children: /* @__PURE__ */ jsxs("div", {
 						className: mergeClassNames("flex w-full cursor-pointer items-center justify-between rounded-md border border-ds-border-field transition duration-400 ease-in-out", isCompact ? "h-9 px-2.5 py-2 text-sm" : "h-10 px-3 py-2 text-sm", bgClassName, disabled ? "cursor-not-allowed opacity-50" : "text-ds-1", error ? "border-ds-state-error-border text-ds-state-error-text focus-visible:ring-ds-state-error-border" : "", triggerClassName),
-						onClick: () => {
-							if (!disabled) setOpen((current) => !current);
-						},
 						onKeyDown: handleKeyDown,
 						role: "button",
 						tabIndex: disabled ? -1 : 0,
@@ -133,30 +130,28 @@ var Select = forwardRef(function SelectComponent({ className = "", containerClas
 							})
 						})]
 					})
-				}), open && !disabled ? /* @__PURE__ */ jsxs("div", {
-					className: mergeClassNames("absolute right-0 left-0 z-20 mt-1 flex flex-col overflow-auto rounded-lg border border-ds-border-2 bg-ds-surface-1 shadow-3 backdrop-blur-xl transition", isCompact ? "max-h-56" : "max-h-60", dropdownClassName),
-					children: [options.length === 0 ? /* @__PURE__ */ jsx("div", {
-						className: "px-3 py-2 text-ds-2",
-						children: "No options"
-					}) : null, options.map((option) => /* @__PURE__ */ jsxs("div", {
-						ref: option.value === value ? selectedOptionRef : null,
-						className: mergeClassNames("mx-1 my-1 flex cursor-pointer items-center rounded-md text-ds-1 transition", isCompact ? "gap-1.5 px-2.5 py-2 text-sm" : "gap-2 px-3 py-2 text-sm", option.value === value ? "bg-ds-accent-subtle font-semibold text-ds-1" : "", "hover:bg-ds-accent hover:text-ds-on-accent", optionClassName),
-						onClick: () => handleSelect(option.value),
-						children: [selectionIndicator === "check" ? /* @__PURE__ */ jsx("span", {
-							className: mergeClassNames("flex items-center justify-center", isCompact ? "w-4" : "w-5"),
-							children: option.value === value ? /* @__PURE__ */ jsx(CheckIcon, {
-								className: "text-ds-1",
-								width: isCompact ? 16 : 18,
-								height: isCompact ? 16 : 18
-							}) : null
-						}) : null, /* @__PURE__ */ jsx(TruncatedText, {
-							as: "span",
-							showTitleOnHover: true,
-							className: "flex-1",
-							children: option.label
-						})]
-					}, option.value))]
-				}) : null]
+				}),
+				children: !disabled ? /* @__PURE__ */ jsxs(Fragment$1, { children: [options.length === 0 ? /* @__PURE__ */ jsx("div", {
+					className: "px-3 py-2 text-ds-2",
+					children: noOptionsText
+				}) : null, options.map((option) => /* @__PURE__ */ jsxs("div", {
+					ref: option.value === value ? selectedOptionRef : null,
+					className: mergeClassNames("mx-1 my-1 flex cursor-pointer items-center rounded-md text-ds-1 transition", isCompact ? "gap-1.5 px-2.5 py-2 text-sm" : "gap-2 px-3 py-2 text-sm", option.value === value ? "bg-ds-accent-subtle font-semibold text-ds-1" : "", "hover:bg-ds-accent hover:text-ds-on-accent", optionClassName),
+					onClick: () => handleSelect(option.value),
+					children: [selectionIndicator === "check" ? /* @__PURE__ */ jsx("span", {
+						className: mergeClassNames("flex items-center justify-center", isCompact ? "w-4" : "w-5"),
+						children: option.value === value ? /* @__PURE__ */ jsx(CheckIcon, {
+							className: "text-ds-1",
+							width: isCompact ? 16 : 18,
+							height: isCompact ? 16 : 18
+						}) : null
+					}) : null, /* @__PURE__ */ jsx(TruncatedText, {
+						as: "span",
+						showTitleOnHover: true,
+						className: "flex-1",
+						children: option.label
+					})]
+				}, option.value))] }) : null
 			}),
 			error ? /* @__PURE__ */ jsx("p", {
 				className: "mt-1 text-sm font-medium text-ds-state-error-text",
@@ -173,4 +168,4 @@ Select.displayName = "Select";
 //#endregion
 export { Select as t };
 
-//# sourceMappingURL=select-1rSJeUBQ.mjs.map
+//# sourceMappingURL=select-D0GOBB-b.mjs.map

package/dist/chunks/select-D0GOBB-b.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"select-D0GOBB-b.mjs","names":[],"sources":["../../src/components/forms/select/Select.tsx"],"sourcesContent":["import {\n  forwardRef,\n  useEffect,\n  useRef,\n  useState,\n  type ChangeEvent,\n  type ForwardedRef,\n  type KeyboardEvent,\n  type MouseEvent as ReactMouseEvent,\n} from \"react\";\nimport { motion, useMotionTemplate, useMotionValue } from \"framer-motion\";\n\nimport { CheckIcon, ChevronDownIcon } from \"../../icons\";\nimport { DropdownMenu } from \"../../overlays/dropdown-menu\";\nimport { TruncatedText } from \"../../typography/truncated-text\";\nimport { mergeClassNames } from \"../../../utils\";\nimport type { SelectProps } from \"./types\";\n\nexport const Select = forwardRef(function SelectComponent(\n  {\n    className = \"\",\n    containerClassName = \"\",\n    triggerClassName = \"\",\n    dropdownClassName = \"\",\n    optionClassName = \"\",\n    label,\n    error,\n    helperText,\n    options,\n    value,\n    onChange,\n    placeholder = \"Select...\",\n    noOptionsText = \"No options\",\n    disabled,\n    bgClassName = \"bg-ds-surface-1\",\n    size = \"default\",\n    selectionIndicator = \"check\",\n    ...props\n  }: SelectProps,\n  ref: ForwardedRef<HTMLSelectElement>,\n) {\n  const [open, setOpen] = useState(false);\n  const [visible, setVisible] = useState(false);\n  const hiddenSelectRef = useRef<HTMLSelectElement>(null);\n  const selectedOptionRef = useRef<HTMLDivElement>(null);\n  const mouseX = useMotionValue(0);\n  const mouseY = useMotionValue(0);\n  const radius = 100;\n  const isCompact = size === \"compact\";\n  const selectedOption = options.find((option) => option.value === value);\n\n  useEffect(() => {\n    if (typeof ref === \"function\") {\n      ref(hiddenSelectRef.current);\n      return;\n    }\n\n    if (ref) {\n      ref.current = hiddenSelectRef.current;\n    }\n  }, [ref]);\n\n  useEffect(() => {\n    if (!open || !selectedOptionRef.current) {\n      return;\n    }\n\n    const frameId = window.requestAnimationFrame(() => {\n      selectedOptionRef.current?.scrollIntoView({ block: \"nearest\" });\n    });\n\n    return () => {\n      window.cancelAnimationFrame(frameId);\n    };\n  }, [open, value]);\n\n  const handleMouseMove = (event: ReactMouseEvent<HTMLDivElement>) => {\n    const { left, top } = event.currentTarget.getBoundingClientRect();\n    mouseX.set(event.clientX - left);\n    mouseY.set(event.clientY - top);\n  };\n\n  const handleSelect = (optionValue: string) => {\n    if (onChange && hiddenSelectRef.current) {\n      const syntheticEvent = {\n        target: { value: optionValue, name: props.name },\n        currentTarget: { value: optionValue, name: props.name },\n      } as ChangeEvent<HTMLSelectElement>;\n\n      onChange(syntheticEvent);\n    }\n\n    setOpen(false);\n  };\n\n  const handleKeyDown = (event: KeyboardEvent<HTMLDivElement>) => {\n    if (disabled) {\n      return;\n    }\n\n    if (event.key === \"Enter\" || event.key === \" \") {\n      event.preventDefault();\n      setOpen((current) => !current);\n    }\n\n    if (event.key === \"Escape\") {\n      setOpen(false);\n    }\n  };\n\n  return (\n    <div\n      className={mergeClassNames(\n        \"w-full\",\n        isCompact ? \"min-w-0\" : \"min-w-48\",\n        containerClassName,\n      )}\n    >\n      {label ? (\n        <label className=\"mb-2 block text-sm leading-none font-medium text-ds-1 peer-disabled:cursor-not-allowed peer-disabled:opacity-70\">\n          {label}\n        </label>\n      ) : null}\n\n      <select\n        ref={hiddenSelectRef}\n        className=\"sr-only\"\n        value={value}\n        onChange={onChange}\n        disabled={disabled}\n        {...props}\n      >\n        <option value=\"\">{placeholder}</option>\n        {options.map((option) => (\n          <option key={option.value} value={option.value}>\n            {option.label}\n          </option>\n        ))}\n      </select>\n\n      <DropdownMenu\n        className={mergeClassNames(\"w-full\", className)}\n        open={open}\n        onOpenChange={(nextOpen) => {\n          if (disabled) {\n            setOpen(false);\n            return;\n          }\n\n          setOpen(nextOpen);\n        }}\n        panelClassName={mergeClassNames(\n          \" left-0 top-[40px] z-20 mt-1 flex flex-col overflow-auto rounded-lg border border-ds-border-2 bg-ds-surface-1 shadow-3 backdrop-blur-xl transition\",\n          isCompact ? \"max-h-56\" : \"max-h-60\",\n          dropdownClassName,\n        )}\n        animationClassName=\"origin-top-left\"\n        trigger={\n          <motion.div\n            style={{\n              backgroundImage: disabled\n                ? \"none\"\n                : useMotionTemplate`\n                  radial-gradient(\n                    ${visible ? `${radius}px` : \"0px\"} circle at ${mouseX}px ${mouseY}px,\n                    var(--ds-color-accent),\n                    transparent 90%\n                  )\n                `,\n            }}\n            onMouseMove={!disabled ? handleMouseMove : undefined}\n            onMouseEnter={!disabled ? () => setVisible(true) : undefined}\n            onMouseLeave={!disabled ? () => setVisible(false) : undefined}\n            className={mergeClassNames(\n              \"group/select w-full rounded-lg p-[2px] transition duration-300 hover:border-ds-border-accent\",\n              disabled\n                ? \"border-none bg-ds-surface-1\"\n                : error\n                  ? \"border-ds-state-error-border\"\n                  : \"border-ds-border-2\",\n            )}\n          >\n            <div\n              className={mergeClassNames(\n                \"flex w-full cursor-pointer items-center justify-between rounded-md border border-ds-border-field transition duration-400 ease-in-out\",\n                isCompact\n                  ? \"h-9 px-2.5 py-2 text-sm\"\n                  : \"h-10 px-3 py-2 text-sm\",\n                bgClassName,\n                disabled ? \"cursor-not-allowed opacity-50\" : \"text-ds-1\",\n                error\n                  ? \"border-ds-state-error-border text-ds-state-error-text focus-visible:ring-ds-state-error-border\"\n                  : \"\",\n                triggerClassName,\n              )}\n              onKeyDown={handleKeyDown}\n              role=\"button\"\n              tabIndex={disabled ? -1 : 0}\n              aria-haspopup=\"listbox\"\n              aria-expanded={open}\n            >\n              {selectedOption ? (\n                <TruncatedText\n                  as=\"span\"\n                  showTitleOnHover\n                  className=\"flex-1 text-ds-1\"\n                >\n                  {selectedOption.label}\n                </TruncatedText>\n              ) : (\n                <TruncatedText as=\"span\" className=\"flex-1 text-ds-2\">\n                  {placeholder}\n                </TruncatedText>\n              )}\n\n              <span\n                className={mergeClassNames(\n                  \"ml-2 shrink-0 text-ds-2 transition-transform duration-300\",\n                  open ? \"rotate-180\" : \"rotate-0\",\n                )}\n              >\n                <ChevronDownIcon\n                  width={24}\n                  height={24}\n                  color=\"currentColor\"\n                  className={isCompact ? \"h-4 w-4\" : \"h-5 w-5\"}\n                />\n              </span>\n            </div>\n          </motion.div>\n        }\n      >\n        {!disabled ? (\n          <>\n            {options.length === 0 ? (\n              <div className=\"px-3 py-2 text-ds-2\">{noOptionsText}</div>\n            ) : null}\n\n            {options.map((option) => (\n              <div\n                key={option.value}\n                ref={option.value === value ? selectedOptionRef : null}\n                className={mergeClassNames(\n                  \"mx-1 my-1 flex cursor-pointer items-center rounded-md text-ds-1 transition\",\n                  isCompact\n                    ? \"gap-1.5 px-2.5 py-2 text-sm\"\n                    : \"gap-2 px-3 py-2 text-sm\",\n                  option.value === value\n                    ? \"bg-ds-accent-subtle font-semibold text-ds-1\"\n                    : \"\",\n                  \"hover:bg-ds-accent hover:text-ds-on-accent\",\n                  optionClassName,\n                )}\n                onClick={() => handleSelect(option.value)}\n              >\n                {selectionIndicator === \"check\" ? (\n                  <span\n                    className={mergeClassNames(\n                      \"flex items-center justify-center\",\n                      isCompact ? \"w-4\" : \"w-5\",\n                    )}\n                  >\n                    {option.value === value ? (\n                      <CheckIcon\n                        className=\"text-ds-1\"\n                        width={isCompact ? 16 : 18}\n                        height={isCompact ? 16 : 18}\n                      />\n                    ) : null}\n                  </span>\n                ) : null}\n                <TruncatedText as=\"span\" showTitleOnHover className=\"flex-1\">\n                  {option.label}\n                </TruncatedText>\n              </div>\n            ))}\n          </>\n        ) : null}\n      </DropdownMenu>\n\n      {error ? (\n        <p className=\"mt-1 text-sm font-medium text-ds-state-error-text\">\n          {error}\n        </p>\n      ) : null}\n      {helperText && !error ? (\n        <p className=\"mt-1 text-sm text-ds-2\">{helperText}</p>\n      ) : null}\n    </div>\n  );\n});\n\nSelect.displayName = \"Select\";\n"],"mappings":"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"}