@inf-monkeys-tech/monkeys-design 0.4.34 → 0.4.35

package/dist/theme-system/index.mjs

@@ -9774,448 +9774,6 @@ forwardRef(
     );
   }
 );
-function normalizeValues(values) {
-  const nextValues = [];
-  const seen = /* @__PURE__ */ new Set();
-  values?.forEach((value) => {
-    if (seen.has(value)) return;
-    seen.add(value);
-    nextValues.push(value);
-  });
-  return nextValues;
-}
-function getNextEnabledIndex(options, currentIndex, direction) {
-  if (!options.length) return -1;
-  const startIndex = currentIndex >= 0 ? currentIndex : 0;
-  for (let offset = 1; offset <= options.length; offset += 1) {
-    const nextIndex = (startIndex + offset * direction + options.length) % options.length;
-    if (!options[nextIndex]?.disabled) {
-      return nextIndex;
-    }
-  }
-  return -1;
-}
-function getFirstEnabledIndex(options) {
-  return options.findIndex((option) => !option.disabled);
-}
-function getSafeTagCount(maxTagCount, total) {
-  if (maxTagCount === void 0) return total;
-  if (!Number.isFinite(maxTagCount)) return total;
-  return Math.max(0, Math.min(total, Math.floor(maxTagCount)));
-}
-function getDefaultRemoveLabel(option) {
-  return `Remove ${option.value}`;
-}
-forwardRef(
-  function BaseMultiSelect2({
-    options,
-    value,
-    defaultValue,
-    name,
-    placeholder = "Select options",
-    icon,
-    invalid = false,
-    disabled = false,
-    required = false,
-    openForPreview = false,
-    maxTagCount,
-    removeLabel = getDefaultRemoveLabel,
-    emptyLabel = "No options",
-    appearance,
-    className,
-    classNames,
-    style,
-    id,
-    "aria-invalid": nativeAriaInvalid,
-    "aria-label": nativeAriaLabel,
-    "aria-labelledby": nativeAriaLabelledBy,
-    onValueChange,
-    ...rootProps
-  }, ref) {
-    const theme = resolveBaseAppearance(appearance);
-    const generatedId = useId();
-    const multiSelectId = id ?? generatedId;
-    const controlId = `${multiSelectId}-control`;
-    const listboxId = `${multiSelectId}-listbox`;
-    const rootRef = useRef(null);
-    const optionList = options ?? [];
-    const forceOpen = openForPreview;
-    const [uncontrolledOpen, setUncontrolledOpen] = useState(false);
-    const open = forceOpen || uncontrolledOpen;
-    const [uncontrolledValue, setUncontrolledValue] = useState(
-      () => normalizeValues(defaultValue)
-    );
-    const [activeIndex, setActiveIndex] = useState(
-      () => getFirstEnabledIndex(optionList)
-    );
-    const isControlled = value !== void 0;
-    const selectedValues = useMemo(
-      () => normalizeValues(isControlled ? value : uncontrolledValue),
-      [isControlled, uncontrolledValue, value]
-    );
-    const selectedValueSet = useMemo(
-      () => new Set(selectedValues),
-      [selectedValues]
-    );
-    const optionByValue = useMemo(() => {
-      const map = /* @__PURE__ */ new Map();
-      optionList.forEach((option) => {
-        if (!map.has(option.value)) {
-          map.set(option.value, option);
-        }
-      });
-      return map;
-    }, [optionList]);
-    const selectedOptions = useMemo(
-      () => selectedValues.map((selectedValue) => optionByValue.get(selectedValue)).filter(
-        (option) => option !== void 0
-      ),
-      [optionByValue, selectedValues]
-    );
-    const firstEnabledIndex = useMemo(
-      () => getFirstEnabledIndex(optionList),
-      [optionList]
-    );
-    const resolvedActiveIndex = activeIndex >= 0 && !optionList[activeIndex]?.disabled ? activeIndex : firstEnabledIndex;
-    const visibleTagCount = getSafeTagCount(
-      maxTagCount,
-      selectedOptions.length
-    );
-    const visibleOptions = selectedOptions.slice(0, visibleTagCount);
-    const overflowCount = selectedOptions.length - visibleOptions.length;
-    const isPlaceholder = selectedOptions.length === 0;
-    const setRootRef = (node) => {
-      rootRef.current = node;
-      if (typeof ref === "function") {
-        ref(node);
-      } else if (ref) {
-        ref.current = node;
-      }
-    };
-    const setOpen = (nextOpen) => {
-      if (disabled || forceOpen) return;
-      setUncontrolledOpen(nextOpen);
-      if (nextOpen) {
-        setActiveIndex(resolvedActiveIndex);
-      }
-    };
-    useEffect(() => {
-      if (!open || forceOpen) return void 0;
-      const handlePointerDown = (event) => {
-        if (!rootRef.current?.contains(event.target)) {
-          setUncontrolledOpen(false);
-        }
-      };
-      document.addEventListener("pointerdown", handlePointerDown);
-      return () => {
-        document.removeEventListener("pointerdown", handlePointerDown);
-      };
-    }, [forceOpen, open]);
-    useEffect(() => {
-      if (resolvedActiveIndex >= 0 && resolvedActiveIndex !== activeIndex) {
-        setActiveIndex(resolvedActiveIndex);
-      }
-    }, [activeIndex, resolvedActiveIndex]);
-    const commitValues = (nextValues) => {
-      const normalizedValues = normalizeValues(nextValues);
-      if (!isControlled) {
-        setUncontrolledValue(normalizedValues);
-      }
-      onValueChange?.(normalizedValues);
-    };
-    const toggleOption = (option) => {
-      if (!option || option.disabled || disabled) return;
-      const nextValues = selectedValueSet.has(option.value) ? selectedValues.filter((selectedValue) => selectedValue !== option.value) : [...selectedValues, option.value];
-      commitValues(nextValues);
-    };
-    const removeOption = (option) => {
-      if (disabled) return;
-      commitValues(
-        selectedValues.filter((selectedValue) => selectedValue !== option.value)
-      );
-    };
-    const focusOption = (direction) => {
-      const nextIndex = getNextEnabledIndex(
-        optionList,
-        resolvedActiveIndex,
-        direction
-      );
-      if (nextIndex >= 0) {
-        setActiveIndex(nextIndex);
-      }
-    };
-    const handleKeyDown = (event) => {
-      if (disabled) return;
-      if (event.key === "ArrowDown" || event.key === "ArrowUp") {
-        event.preventDefault();
-        if (!open) {
-          setOpen(true);
-          setActiveIndex(firstEnabledIndex);
-          return;
-        }
-        focusOption(event.key === "ArrowDown" ? 1 : -1);
-        return;
-      }
-      if (event.key === "Home") {
-        event.preventDefault();
-        setOpen(true);
-        setActiveIndex(firstEnabledIndex);
-        return;
-      }
-      if (event.key === "End") {
-        event.preventDefault();
-        setOpen(true);
-        for (let index = optionList.length - 1; index >= 0; index -= 1) {
-          if (!optionList[index]?.disabled) {
-            setActiveIndex(index);
-            break;
-          }
-        }
-        return;
-      }
-      if (event.key === "Enter" || event.key === " ") {
-        event.preventDefault();
-        if (!open) {
-          setOpen(true);
-          return;
-        }
-        toggleOption(optionList[resolvedActiveIndex]);
-        return;
-      }
-      if (event.key === "Escape") {
-        setOpen(false);
-      }
-    };
-    return /* @__PURE__ */ jsxs(
-      "div",
-      {
-        ...rootProps,
-        id,
-        ref: setRootRef,
-        className: cn(
-          theme.slots.controlWrapper,
-          "overflow-visible",
-          open && "z-50",
-          invalid && theme.slots.controlInvalid,
-          disabled && theme.slots.controlDisabled,
-          classNames?.root,
-          className
-        ),
-        style: {
-          ...theme.styles.control,
-          ...invalid ? theme.styles.controlInvalid : void 0,
-          ...disabled ? theme.styles.controlDisabled : void 0,
-          ...style
-        },
-        children: [
-          hasRenderableNode(icon) ? /* @__PURE__ */ jsx("span", { className: cn(theme.slots.controlIcon, classNames?.icon), children: icon }) : null,
-          /* @__PURE__ */ jsx(
-            "div",
-            {
-              id: controlId,
-              role: "combobox",
-              tabIndex: disabled ? -1 : 0,
-              "aria-haspopup": "listbox",
-              "aria-expanded": open,
-              "aria-controls": listboxId,
-              "aria-disabled": disabled || void 0,
-              "aria-required": required || void 0,
-              "aria-invalid": nativeAriaInvalid ?? (invalid || void 0),
-              "aria-label": nativeAriaLabel,
-              "aria-labelledby": nativeAriaLabelledBy,
-              className: cn(
-                theme.slots.controlBase,
-                "flex min-h-9 cursor-pointer flex-wrap items-center gap-1.5 py-1.5 pr-9 text-left",
-                disabled && "!cursor-not-allowed",
-                classNames?.control
-              ),
-              onClick: () => setOpen(!open),
-              onKeyDown: handleKeyDown,
-              children: /* @__PURE__ */ jsxs(
-                "span",
-                {
-                  className: cn(
-                    "flex min-w-0 flex-1 flex-wrap items-center gap-1.5",
-                    classNames?.tagList
-                  ),
-                  children: [
-                    visibleOptions.map((option) => /* @__PURE__ */ jsxs(
-                      "span",
-                      {
-                        className: cn(
-                          "inline-flex max-w-full items-center gap-1 rounded-full border border-border/70 bg-muted/65 px-2 py-0.5 text-xs font-medium text-foreground",
-                          classNames?.tag
-                        ),
-                        children: [
-                          /* @__PURE__ */ jsx(
-                            "span",
-                            {
-                              className: cn(
-                                "max-w-40 truncate",
-                                classNames?.tagLabel
-                              ),
-                              children: option.label
-                            }
-                          ),
-                          /* @__PURE__ */ jsx(
-                            "button",
-                            {
-                              type: "button",
-                              "aria-label": removeLabel(option),
-                              disabled,
-                              className: cn(
-                                "inline-flex h-4 w-4 shrink-0 items-center justify-center rounded-full text-muted-foreground hover:bg-background/80 hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-primary/30 disabled:!cursor-not-allowed",
-                                classNames?.tagRemove
-                              ),
-                              onClick: (event) => {
-                                event.preventDefault();
-                                event.stopPropagation();
-                                removeOption(option);
-                              },
-                              onMouseDown: (event) => {
-                                event.preventDefault();
-                                event.stopPropagation();
-                              },
-                              onKeyDown: (event) => event.stopPropagation(),
-                              children: /* @__PURE__ */ jsx("span", { "aria-hidden": "true", children: "x" })
-                            }
-                          )
-                        ]
-                      },
-                      option.value
-                    )),
-                    overflowCount > 0 ? /* @__PURE__ */ jsxs(
-                      "span",
-                      {
-                        className: cn(
-                          "inline-flex max-w-full items-center rounded-full border border-border/70 bg-muted/45 px-2 py-0.5 text-xs font-medium text-muted-foreground",
-                          classNames?.tag
-                        ),
-                        children: [
-                          "+",
-                          overflowCount
-                        ]
-                      }
-                    ) : null,
-                    isPlaceholder ? /* @__PURE__ */ jsx(
-                      "span",
-                      {
-                        className: cn(
-                          "min-w-0 truncate",
-                          theme.slots.selectPlaceholder,
-                          classNames?.placeholder
-                        ),
-                        children: placeholder
-                      }
-                    ) : null
-                  ]
-                }
-              )
-            }
-          ),
-          /* @__PURE__ */ jsx(
-            "span",
-            {
-              className: cn(
-                theme.slots.selectChevron,
-                open && "rotate-[225deg]",
-                classNames?.chevron
-              )
-            }
-          ),
-          name ? selectedValues.map((selectedValue) => /* @__PURE__ */ jsx(
-            "input",
-            {
-              type: "hidden",
-              name,
-              value: selectedValue,
-              className: classNames?.hiddenInput
-            },
-            selectedValue
-          )) : null,
-          open ? /* @__PURE__ */ jsx(
-            "div",
-            {
-              id: listboxId,
-              role: "listbox",
-              "aria-multiselectable": "true",
-              "aria-labelledby": controlId,
-              className: cn(theme.slots.selectMenu, classNames?.menu),
-              style: theme.styles.selectMenu,
-              children: optionList.length > 0 ? optionList.map((option, index) => {
-                const selected = selectedValueSet.has(option.value);
-                const active = index === resolvedActiveIndex;
-                return /* @__PURE__ */ jsxs(
-                  "button",
-                  {
-                    type: "button",
-                    role: "option",
-                    "aria-selected": selected,
-                    disabled: option.disabled,
-                    className: cn(
-                      theme.slots.selectOption,
-                      "gap-2",
-                      active && theme.slots.selectOptionActive,
-                      selected && theme.slots.selectOptionSelected,
-                      option.disabled && theme.slots.selectOptionDisabled,
-                      classNames?.option
-                    ),
-                    style: {
-                      ...theme.styles.selectOption,
-                      ...active ? theme.styles.selectOptionActive : void 0,
-                      ...selected ? theme.styles.selectOptionSelected : void 0
-                    },
-                    onMouseEnter: () => {
-                      if (!option.disabled) {
-                        setActiveIndex(index);
-                      }
-                    },
-                    onMouseDown: (event) => event.preventDefault(),
-                    onClick: () => toggleOption(option),
-                    children: [
-                      /* @__PURE__ */ jsx(
-                        "span",
-                        {
-                          "aria-hidden": "true",
-                          className: cn(
-                            "inline-flex h-4 w-4 shrink-0 items-center justify-center rounded-sm border border-border/70 text-[10px]",
-                            selected && "border-primary/40 bg-primary text-primary-foreground",
-                            classNames?.optionIndicator
-                          ),
-                          children: selected ? "\u2713" : null
-                        }
-                      ),
-                      /* @__PURE__ */ jsx(
-                        "span",
-                        {
-                          className: cn(
-                            "min-w-0 flex-1 truncate",
-                            classNames?.optionLabel
-                          ),
-                          children: option.label
-                        }
-                      )
-                    ]
-                  },
-                  option.value
-                );
-              }) : /* @__PURE__ */ jsx(
-                "div",
-                {
-                  className: cn(
-                    "px-2.5 py-2 text-sm text-muted-foreground",
-                    classNames?.empty
-                  ),
-                  children: emptyLabel
-                }
-              )
-            }
-          ) : null
-        ]
-      }
-    );
-  }
-);
 function findOption(options, value) {
   if (value === void 0) return void 0;
   return options.find((option) => option.value === value);
@@ -10226,7 +9784,7 @@ function getInitialValue(options, defaultValue) {
   }
   return "";
 }
-function getNextEnabledIndex2(options, currentIndex, direction) {
+function getNextEnabledIndex(options, currentIndex, direction) {
   if (!options.length) return -1;
   for (let offset = 1; offset <= options.length; offset += 1) {
     const nextIndex = (currentIndex + offset * direction + options.length) % options.length;
@@ -10328,7 +9886,7 @@ forwardRef(
     };
     const focusOption = (direction) => {
       const currentIndex = activeIndex >= 0 ? activeIndex : 0;
-      const nextIndex = getNextEnabledIndex2(optionList, currentIndex, direction);
+      const nextIndex = getNextEnabledIndex(optionList, currentIndex, direction);
       if (nextIndex >= 0) {
         commitValue(optionList[nextIndex].value, optionList[nextIndex].disabled);
       }