@bigtablet/design-system 1.16.0 → 1.16.2

package/dist/index.d.ts

@@ -109,7 +109,7 @@ interface SelectProps {
     className?: string;
     textAlign?: "left" | "center";
 }
-declare const Select: ({ id, label, placeholder, options, value, onChange, defaultValue, disabled, size, variant, fullWidth, className, textAlign }: SelectProps) => react_jsx_runtime.JSX.Element;
+declare const Select: ({ id, label, placeholder, options, value, onChange, defaultValue, disabled, size, variant, fullWidth, className, textAlign, }: SelectProps) => react_jsx_runtime.JSX.Element;
 
 interface SwitchProps extends Omit<React.ButtonHTMLAttributes<HTMLButtonElement>, "onChange"> {
     checked?: boolean;

package/dist/index.js

@@ -383,9 +383,7 @@ var Select = ({
       case "Home":
         e.preventDefault();
         setIsOpen(true);
-        setActiveIndex(
-          options.findIndex((o) => !o.disabled)
-        );
+        setActiveIndex(options.findIndex((o) => !o.disabled));
         break;
       case "End":
         e.preventDefault();
@@ -405,15 +403,8 @@ var Select = ({
   };
   React3.useEffect(() => {
     if (!isOpen) return;
-    const idx = options.findIndex(
-      (o) => o.value === currentValue && !o.disabled
-    );
-    setActiveIndex(
-      idx >= 0 ? idx : Math.max(
-        0,
-        options.findIndex((o) => !o.disabled)
-      )
-    );
+    const idx = options.findIndex((o) => o.value === currentValue && !o.disabled);
+    setActiveIndex(idx >= 0 ? idx : Math.max(0, options.findIndex((o) => !o.disabled)));
   }, [isOpen, options, currentValue]);
   React3.useLayoutEffect(() => {
     if (!isOpen || !controlRef.current) return;
@@ -431,93 +422,76 @@ var Select = ({
     isOpen && "is_open",
     disabled && "is_disabled"
   ].filter(Boolean).join(" ");
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      ref: wrapperRef,
-      className: rootClassName,
-      style: fullWidth ? { width: "100%" } : void 0,
-      children: [
-        label && /* @__PURE__ */ jsx(
-          "label",
-          {
-            htmlFor: selectId,
-            className: "select_label",
-            children: label
-          }
-        ),
-        /* @__PURE__ */ jsxs(
-          "button",
-          {
-            ref: controlRef,
-            id: selectId,
-            type: "button",
-            className: controlClassName,
-            "aria-haspopup": "listbox",
-            "aria-expanded": isOpen,
-            "aria-controls": `${selectId}_listbox`,
-            onClick: () => !disabled && setIsOpen((o) => !o),
-            onKeyDown,
-            disabled,
-            children: [
-              /* @__PURE__ */ jsx(
-                "span",
-                {
-                  className: currentOption ? "select_value" : "select_placeholder",
-                  style: textAlign === "left" ? { textAlign: "start" } : void 0,
-                  children: currentOption ? currentOption.label : placeholder
-                }
-              ),
-              /* @__PURE__ */ jsx("span", { className: "select_icon", "aria-hidden": "true", children: /* @__PURE__ */ jsx(ChevronDown, { size: 16 }) })
-            ]
-          }
-        ),
-        isOpen && /* @__PURE__ */ jsx(
-          "ul",
-          {
-            id: `${selectId}_listbox`,
-            role: "listbox",
-            className: `select_list${dropUp ? " select_list_up" : ""}`,
-            children: options.map((opt, i) => {
-              const selected = currentValue === opt.value;
-              const active = i === activeIndex;
-              const optionClassName = [
-                "select_option",
-                selected && "is_selected",
-                active && "is_active",
-                opt.disabled && "is_disabled"
-              ].filter(Boolean).join(" ");
-              return /* @__PURE__ */ jsxs(
-                "li",
-                {
-                  role: "option",
-                  "aria-selected": selected,
-                  className: optionClassName,
-                  onMouseEnter: () => !opt.disabled && setActiveIndex(i),
-                  onClick: () => {
-                    if (opt.disabled) return;
-                    setValue(opt.value);
-                    setIsOpen(false);
-                  },
-                  children: [
-                    /* @__PURE__ */ jsx("span", { children: opt.label }),
-                    selected && /* @__PURE__ */ jsx(
-                      Check,
-                      {
-                        size: 16,
-                        "aria-hidden": "true"
-                      }
-                    )
-                  ]
-                },
-                opt.value
-              );
-            })
-          }
-        )
-      ]
-    }
-  );
+  const listClassName = [
+    "select_list",
+    dropUp && "select_list_up"
+  ].filter(Boolean).join(" ");
+  return /* @__PURE__ */ jsxs("div", { ref: wrapperRef, className: rootClassName, style: fullWidth ? { width: "100%" } : void 0, children: [
+    label && /* @__PURE__ */ jsx("label", { htmlFor: selectId, className: "select_label", children: label }),
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        ref: controlRef,
+        id: selectId,
+        type: "button",
+        className: controlClassName,
+        "aria-haspopup": "listbox",
+        "aria-expanded": isOpen,
+        "aria-controls": `${selectId}_listbox`,
+        onClick: () => !disabled && setIsOpen((o) => !o),
+        onKeyDown,
+        disabled,
+        children: [
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              className: currentOption ? "select_value" : "select_placeholder",
+              style: textAlign === "left" ? { textAlign: "start" } : void 0,
+              children: currentOption ? currentOption.label : placeholder
+            }
+          ),
+          /* @__PURE__ */ jsx("span", { className: "select_icon", "aria-hidden": "true", children: /* @__PURE__ */ jsx(ChevronDown, { size: 16 }) })
+        ]
+      }
+    ),
+    isOpen && /* @__PURE__ */ jsx(
+      "ul",
+      {
+        id: `${selectId}_listbox`,
+        role: "listbox",
+        className: listClassName,
+        children: options.map((opt, i) => {
+          const selected = currentValue === opt.value;
+          const active = i === activeIndex;
+          const optionClassName = [
+            "select_option",
+            selected && "is_selected",
+            active && "is_active",
+            opt.disabled && "is_disabled"
+          ].filter(Boolean).join(" ");
+          return /* @__PURE__ */ jsxs(
+            "li",
+            {
+              role: "option",
+              "aria-selected": selected,
+              className: optionClassName,
+              onMouseEnter: () => !opt.disabled && setActiveIndex(i),
+              onClick: () => {
+                if (opt.disabled) return;
+                setValue(opt.value);
+                setIsOpen(false);
+              },
+              children: [
+                /* @__PURE__ */ jsx("span", { children: opt.label }),
+                selected && /* @__PURE__ */ jsx(Check, { size: 16, "aria-hidden": "true" })
+              ]
+            },
+            opt.value
+          );
+        })
+      }
+    )
+  ] });
 };
 var Switch = ({
   checked,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@bigtablet/design-system",
-  "version": "1.16.0",
+  "version": "1.16.2",
   "description": "Bigtablet Design System UI Components",
   "type": "module",
   "types": "dist/index.d.ts",