@jinmi/ui 0.0.0-stage → 6.0.2

package/es/base-ui/Select/Select.mjs

@@ -0,0 +1,216 @@
+"use client";
+import { styles } from "../DropdownMenu/sharedStyle.mjs";
+import { styles as styles$1, triggerVariants } from "./style.mjs";
+import { SelectPositioner } from "./atoms.mjs";
+import { isValueEmpty } from "./helpers.mjs";
+import { usePortalContainer, useSelectOpen, useSelectSearch, useSelectValue, useSelectVirtual } from "./hooks.mjs";
+import { EmptyContent, SelectListSection, SelectSearchInput, SelectTriggerSuffix, createTriggerValueRenderer, resolveIconNode, resolveSuffixIcon } from "./parts.mjs";
+import { renderOptions } from "./renderOptions.mjs";
+import { memo, useCallback, useEffect, useMemo, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cx, useThemeMode } from "antd-style";
+import { Select } from "@base-ui/react/select";
+//#region src/base-ui/Select/Select.tsx
+const Select$1 = memo(({ allowClear, autoFocus, className, classNames, defaultOpen, defaultValue, disabled, id, labelRender, listHeight = 512, listItemHeight, loading, mode, name, onChange, onOpenChange, onSelect, open, optionRender, options, placeholder, popupClassName, popupMatchSelectWidth, prefix, readOnly, required, behaviorVariant = "default", selectedIndicatorVariant = "check", shadow, showSearch, size = "middle", style, suffixIcon, suffixIconProps, tokenSeparators, value, variant, virtual }) => {
+	const { isDarkMode } = useThemeMode();
+	const resolvedVariant = variant ?? (isDarkMode ? "filled" : "outlined");
+	const isTags = mode === "tags";
+	const isMultiple = mode === "multiple" || mode === "tags";
+	const isItemAligned = behaviorVariant === "item-aligned";
+	const [extraOptions, setExtraOptions] = useState([]);
+	useEffect(() => {
+		if (mode !== "tags" && extraOptions.length > 0) setExtraOptions([]);
+	}, [mode, extraOptions.length]);
+	const { appendTagValues, getOption, handleValueChange, normalizedValue, normalizeValue, removeLastTagValue, resolvedOptions, valueArray } = useSelectValue({
+		defaultValue,
+		extraOptions,
+		isMultiple,
+		onChange,
+		onSelect,
+		options,
+		setExtraOptions,
+		value
+	});
+	const { handleOpenChange, mergedOpen } = useSelectOpen({
+		defaultOpen,
+		onOpenChange,
+		open
+	});
+	const handleRootValueChange = useCallback((nextValue) => {
+		if (!(isTags && !mergedOpen)) handleValueChange(nextValue);
+	}, [
+		handleValueChange,
+		isTags,
+		mergedOpen
+	]);
+	const handleRemoveTag = useCallback((index) => handleValueChange(valueArray.filter((_, itemIndex) => itemIndex !== index)), [handleValueChange, valueArray]);
+	const { filteredOptions, handleSearchChange, handleSearchKeyDown, searchValue, shouldShowSearch, stopSearchPropagation } = useSelectSearch({
+		appendTagValues,
+		handleOpenChange,
+		mergedOpen,
+		mode,
+		removeLastTagValue,
+		resolvedOptions,
+		showSearch,
+		tokenSeparators
+	});
+	const virtualState = useSelectVirtual({
+		filteredOptions,
+		listItemHeight,
+		size,
+		valueArray,
+		virtual
+	});
+	const portalContainer = usePortalContainer();
+	const renderValue = useMemo(() => createTriggerValueRenderer({
+		getOption,
+		isMultiple,
+		isTags,
+		labelRender,
+		normalizeValue,
+		onRemoveValue: handleRemoveTag,
+		placeholder: isTags ? void 0 : placeholder
+	}), [
+		getOption,
+		handleRemoveTag,
+		isMultiple,
+		isTags,
+		labelRender,
+		normalizeValue,
+		placeholder
+	]);
+	const hasValue = isMultiple ? valueArray.length > 0 : !isValueEmpty(normalizedValue);
+	const showClear = Boolean(allowClear && hasValue && !disabled && !readOnly);
+	const handleClear = useCallback((event) => {
+		event.preventDefault();
+		event.stopPropagation();
+		handleValueChange(isMultiple ? [] : null);
+	}, [handleValueChange, isMultiple]);
+	const prefixNode = useMemo(() => resolveIconNode(prefix), [prefix]);
+	const suffixIconNode = useMemo(() => resolveSuffixIcon(suffixIcon, suffixIconProps, loading), [
+		loading,
+		suffixIcon,
+		suffixIconProps
+	]);
+	const popupStyle = useMemo(() => {
+		const maxHeight = isItemAligned ? "80vh" : `${listHeight}px`;
+		const baseStyle = {
+			maxWidth: "var(--available-width)",
+			minWidth: "var(--anchor-width)",
+			["--jinmi-select-popup-max-height"]: maxHeight
+		};
+		if (popupMatchSelectWidth === void 0 || popupMatchSelectWidth === true) return baseStyle;
+		if (typeof popupMatchSelectWidth === "number") return {
+			...baseStyle,
+			minWidth: popupMatchSelectWidth,
+			width: popupMatchSelectWidth
+		};
+		return {
+			...baseStyle,
+			minWidth: "max-content"
+		};
+	}, [
+		isItemAligned,
+		listHeight,
+		popupMatchSelectWidth
+	]);
+	const triggerClassName = cx(triggerVariants({
+		shadow,
+		size,
+		variant: resolvedVariant
+	}), className, classNames?.root, classNames?.trigger);
+	const isBoldIndicator = selectedIndicatorVariant === "bold";
+	const itemTextClassName = cx(optionRender ? styles.itemContent : styles.label, styles$1.itemText, classNames?.itemText);
+	const isEmpty = filteredOptions.length === 0;
+	const listContent = isEmpty ? /* @__PURE__ */ jsx(EmptyContent, { classNames }) : renderOptions({
+		classNames,
+		isBoldIndicator,
+		items: filteredOptions,
+		itemTextClassName,
+		listItemHeight,
+		optionRender
+	});
+	return /* @__PURE__ */ jsxs(Select.Root, {
+		disabled,
+		id,
+		modal: isItemAligned,
+		multiple: isMultiple,
+		name,
+		open: mergedOpen,
+		readOnly,
+		required,
+		value: normalizedValue,
+		onOpenChange: handleOpenChange,
+		onValueChange: handleRootValueChange,
+		children: [/* @__PURE__ */ jsxs(Select.Trigger, {
+			autoFocus: !isTags && autoFocus,
+			className: triggerClassName,
+			disabled,
+			nativeButton: !isTags,
+			render: isTags ? /* @__PURE__ */ jsx("div", {}) : void 0,
+			style,
+			children: [
+				prefixNode !== null && prefixNode !== void 0 && /* @__PURE__ */ jsx("span", {
+					className: cx(styles$1.prefix, classNames?.prefix),
+					children: prefixNode
+				}),
+				/* @__PURE__ */ jsx(Select.Value, {
+					className: cx(styles$1.value, isTags && styles$1.tagsValue, classNames?.value),
+					children: renderValue
+				}),
+				isTags && /* @__PURE__ */ jsx(SelectSearchInput, {
+					inline: true,
+					autoFocus,
+					classNames,
+					disabled,
+					placeholder: valueArray.length === 0 ? placeholder : void 0,
+					readOnly,
+					stopPropagation: stopSearchPropagation,
+					value: searchValue,
+					onChange: handleSearchChange,
+					onKeyDown: handleSearchKeyDown
+				}),
+				/* @__PURE__ */ jsx(SelectTriggerSuffix, {
+					classNames,
+					showClear,
+					suffixIconNode,
+					onClear: handleClear
+				})
+			]
+		}), /* @__PURE__ */ jsx(Select.Portal, {
+			container: portalContainer,
+			children: /* @__PURE__ */ jsx(SelectPositioner, {
+				align: "start",
+				alignItemWithTrigger: isItemAligned,
+				className: styles$1.positioner,
+				side: "bottom",
+				sideOffset: 6,
+				children: /* @__PURE__ */ jsxs(Select.Popup, {
+					style: popupStyle,
+					className: cx(styles.popup, styles$1.popup, popupClassName, classNames?.popup, classNames?.dropdown),
+					children: [shouldShowSearch && !isTags && /* @__PURE__ */ jsx(SelectSearchInput, {
+						classNames,
+						placeholder,
+						stopPropagation: stopSearchPropagation,
+						value: searchValue,
+						onChange: handleSearchChange,
+						onKeyDown: handleSearchKeyDown
+					}), /* @__PURE__ */ jsx(SelectListSection, {
+						classNames,
+						hasSearch: shouldShowSearch && !isTags,
+						isEmpty,
+						listContent,
+						listItemHeight,
+						virtual,
+						virtualState
+					})]
+				})
+			})
+		})]
+	});
+});
+Select$1.displayName = "Select";
+//#endregion
+export { Select$1 as default };
+
+//# sourceMappingURL=Select.mjs.map

package/es/base-ui/Select/Select.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.mjs","names":["Select","menuStyles","styles","BaseSelect"],"sources":["../../../src/base-ui/Select/Select.tsx"],"sourcesContent":["'use client';\n\nimport { Select as BaseSelect } from '@base-ui/react/select';\nimport { cx, useThemeMode } from 'antd-style';\nimport { type MouseEvent } from 'react';\nimport { memo, useCallback, useEffect, useMemo, useState } from 'react';\n\nimport { styles as menuStyles } from '@/base-ui/DropdownMenu/sharedStyle';\n\nimport { SelectPositioner } from './atoms';\nimport { isValueEmpty } from './helpers';\nimport {\n  usePortalContainer,\n  useSelectOpen,\n  useSelectSearch,\n  useSelectValue,\n  useSelectVirtual,\n} from './hooks';\nimport {\n  createTriggerValueRenderer,\n  EmptyContent,\n  resolveIconNode,\n  resolveSuffixIcon,\n  SelectListSection,\n  SelectSearchInput,\n  SelectTriggerSuffix,\n} from './parts';\nimport { renderOptions } from './renderOptions';\nimport { styles, triggerVariants } from './style';\nimport { type SelectOption, type SelectProps } from './type';\n\nconst Select = memo<SelectProps<any>>(\n  ({\n    allowClear,\n    autoFocus,\n    className,\n    classNames,\n    defaultOpen,\n    defaultValue,\n    disabled,\n    id,\n    labelRender,\n    listHeight = 512,\n    listItemHeight,\n    loading,\n    mode,\n    name,\n    onChange,\n    onOpenChange,\n    onSelect,\n    open,\n    optionRender,\n    options,\n    placeholder,\n    popupClassName,\n    popupMatchSelectWidth,\n    prefix,\n    readOnly,\n    required,\n    behaviorVariant = 'default',\n    selectedIndicatorVariant = 'check',\n    shadow,\n    showSearch,\n    size = 'middle',\n    style,\n    suffixIcon,\n    suffixIconProps,\n    tokenSeparators,\n    value,\n    variant,\n    virtual,\n  }) => {\n    const { isDarkMode } = useThemeMode();\n    const resolvedVariant = variant ?? (isDarkMode ? 'filled' : 'outlined');\n    const isTags = mode === 'tags';\n    const isMultiple = mode === 'multiple' || mode === 'tags';\n    const isItemAligned = behaviorVariant === 'item-aligned';\n\n    const [extraOptions, setExtraOptions] = useState<SelectOption<any>[]>([]);\n\n    useEffect(() => {\n      if (mode !== 'tags' && extraOptions.length > 0) {\n        setExtraOptions([]);\n      }\n    }, [mode, extraOptions.length]);\n\n    const {\n      appendTagValues,\n      getOption,\n      handleValueChange,\n      normalizedValue,\n      normalizeValue,\n      removeLastTagValue,\n      resolvedOptions,\n      valueArray,\n    } = useSelectValue({\n      defaultValue,\n      extraOptions,\n      isMultiple,\n      onChange,\n      onSelect,\n      options,\n      setExtraOptions,\n      value,\n    });\n\n    const { handleOpenChange, mergedOpen } = useSelectOpen({ defaultOpen, onOpenChange, open });\n\n    const handleRootValueChange = useCallback(\n      (nextValue: any) => {\n        if (!(isTags && !mergedOpen)) handleValueChange(nextValue);\n      },\n      [handleValueChange, isTags, mergedOpen],\n    );\n\n    const handleRemoveTag = useCallback(\n      (index: number) =>\n        handleValueChange(valueArray.filter((_, itemIndex) => itemIndex !== index)),\n      [handleValueChange, valueArray],\n    );\n\n    const {\n      filteredOptions,\n      handleSearchChange,\n      handleSearchKeyDown,\n      searchValue,\n      shouldShowSearch,\n      stopSearchPropagation,\n    } = useSelectSearch({\n      appendTagValues,\n      handleOpenChange,\n      mergedOpen,\n      mode,\n      removeLastTagValue,\n      resolvedOptions,\n      showSearch,\n      tokenSeparators,\n    });\n\n    const virtualState = useSelectVirtual({\n      filteredOptions,\n      listItemHeight,\n      size,\n      valueArray,\n      virtual,\n    });\n\n    const portalContainer = usePortalContainer();\n\n    const renderValue = useMemo(\n      () =>\n        createTriggerValueRenderer({\n          getOption,\n          isMultiple,\n          isTags,\n          labelRender,\n          normalizeValue,\n          onRemoveValue: handleRemoveTag,\n          placeholder: isTags ? undefined : placeholder,\n        }),\n      [getOption, handleRemoveTag, isMultiple, isTags, labelRender, normalizeValue, placeholder],\n    );\n\n    const hasValue = isMultiple ? valueArray.length > 0 : !isValueEmpty(normalizedValue);\n    const showClear = Boolean(allowClear && hasValue && !disabled && !readOnly);\n\n    const handleClear = useCallback(\n      (event: MouseEvent) => {\n        event.preventDefault();\n        event.stopPropagation();\n        handleValueChange(isMultiple ? [] : null);\n      },\n      [handleValueChange, isMultiple],\n    );\n\n    const prefixNode = useMemo(() => resolveIconNode(prefix), [prefix]);\n    const suffixIconNode = useMemo(\n      () => resolveSuffixIcon(suffixIcon, suffixIconProps, loading),\n      [loading, suffixIcon, suffixIconProps],\n    );\n\n    const popupStyle = useMemo(() => {\n      const maxHeight = isItemAligned ? '80vh' : `${listHeight}px`;\n      const baseStyle: React.CSSProperties = {\n        maxWidth: 'var(--available-width)',\n        minWidth: 'var(--anchor-width)',\n        ['--jinmi-select-popup-max-height' as any]: maxHeight,\n      };\n\n      if (popupMatchSelectWidth === undefined || popupMatchSelectWidth === true) {\n        return baseStyle;\n      }\n      if (typeof popupMatchSelectWidth === 'number') {\n        return {\n          ...baseStyle,\n          minWidth: popupMatchSelectWidth,\n          width: popupMatchSelectWidth,\n        };\n      }\n      return { ...baseStyle, minWidth: 'max-content' };\n    }, [isItemAligned, listHeight, popupMatchSelectWidth]);\n\n    const triggerClassName = cx(\n      triggerVariants({ shadow, size, variant: resolvedVariant }),\n      className,\n      classNames?.root,\n      classNames?.trigger,\n    );\n\n    const isBoldIndicator = selectedIndicatorVariant === 'bold';\n    const itemTextClassName = cx(\n      optionRender ? menuStyles.itemContent : menuStyles.label,\n      styles.itemText,\n      classNames?.itemText,\n    );\n\n    const isEmpty = filteredOptions.length === 0;\n    const listContent = isEmpty ? (\n      <EmptyContent classNames={classNames} />\n    ) : (\n      renderOptions({\n        classNames,\n        isBoldIndicator,\n        items: filteredOptions,\n        itemTextClassName,\n        listItemHeight,\n        optionRender,\n      })\n    );\n\n    return (\n      <BaseSelect.Root\n        disabled={disabled}\n        id={id}\n        modal={isItemAligned}\n        multiple={isMultiple}\n        name={name}\n        open={mergedOpen}\n        readOnly={readOnly}\n        required={required}\n        value={normalizedValue}\n        onOpenChange={handleOpenChange}\n        onValueChange={handleRootValueChange}\n      >\n        <BaseSelect.Trigger\n          autoFocus={!isTags && autoFocus}\n          className={triggerClassName}\n          disabled={disabled}\n          nativeButton={!isTags}\n          render={isTags ? <div /> : undefined}\n          style={style}\n        >\n          {prefixNode !== null && prefixNode !== undefined && (\n            <span className={cx(styles.prefix, classNames?.prefix)}>{prefixNode}</span>\n          )}\n          <BaseSelect.Value\n            className={cx(styles.value, isTags && styles.tagsValue, classNames?.value)}\n          >\n            {renderValue}\n          </BaseSelect.Value>\n          {isTags && (\n            <SelectSearchInput\n              inline\n              autoFocus={autoFocus}\n              classNames={classNames}\n              disabled={disabled}\n              placeholder={valueArray.length === 0 ? placeholder : undefined}\n              readOnly={readOnly}\n              stopPropagation={stopSearchPropagation}\n              value={searchValue}\n              onChange={handleSearchChange}\n              onKeyDown={handleSearchKeyDown}\n            />\n          )}\n          <SelectTriggerSuffix\n            classNames={classNames}\n            showClear={showClear}\n            suffixIconNode={suffixIconNode}\n            onClear={handleClear}\n          />\n        </BaseSelect.Trigger>\n\n        <BaseSelect.Portal container={portalContainer}>\n          <SelectPositioner\n            align=\"start\"\n            alignItemWithTrigger={isItemAligned}\n            className={styles.positioner}\n            side=\"bottom\"\n            sideOffset={6}\n          >\n            <BaseSelect.Popup\n              style={popupStyle}\n              className={cx(\n                menuStyles.popup,\n                styles.popup,\n                popupClassName,\n                classNames?.popup,\n                classNames?.dropdown,\n              )}\n            >\n              {shouldShowSearch && !isTags && (\n                <SelectSearchInput\n                  classNames={classNames}\n                  placeholder={placeholder}\n                  stopPropagation={stopSearchPropagation}\n                  value={searchValue}\n                  onChange={handleSearchChange}\n                  onKeyDown={handleSearchKeyDown}\n                />\n              )}\n              <SelectListSection\n                classNames={classNames}\n                hasSearch={shouldShowSearch && !isTags}\n                isEmpty={isEmpty}\n                listContent={listContent}\n                listItemHeight={listItemHeight}\n                virtual={virtual}\n                virtualState={virtualState}\n              />\n            </BaseSelect.Popup>\n          </SelectPositioner>\n        </BaseSelect.Portal>\n      </BaseSelect.Root>\n    );\n  },\n);\n\nSelect.displayName = 'Select';\n\nexport default Select;\n"],"mappings":"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"}

package/es/base-ui/Select/atoms.d.mts

@@ -0,0 +1,95 @@
+import { SelectSize, SelectVariant } from "./type.mjs";
+import { ComponentProps, ComponentPropsWithRef } from "react";
+import { Select } from "@base-ui/react/select";
+//#region src/base-ui/Select/atoms.d.ts
+declare const SelectRoot: typeof Select.Root;
+declare const SelectBackdrop: import("react").ForwardRefExoticComponent<Omit<import("@base-ui/react").SelectBackdropProps, "ref"> & import("react").RefAttributes<HTMLDivElement>>;
+declare const SelectSeparator: import("react").ForwardRefExoticComponent<import("@base-ui/react").SelectSeparatorProps & import("react").RefAttributes<HTMLDivElement>>;
+type SelectTriggerProps = Omit<ComponentPropsWithRef<typeof Select.Trigger>, 'children' | 'render'> & {
+  children: ComponentProps<typeof Select.Trigger>['children'];
+  shadow?: boolean;
+  size?: SelectSize;
+  variant?: SelectVariant;
+};
+declare const SelectTrigger: {
+  ({ children, className, nativeButton, shadow, size, variant, ref: refProp, ...rest }: SelectTriggerProps): import("react").JSX.Element;
+  displayName: string;
+};
+type SelectIconProps = ComponentProps<typeof Select.Icon>;
+declare const SelectIcon: {
+  ({ className, ...rest }: SelectIconProps): import("react").JSX.Element;
+  displayName: string;
+};
+type SelectValueProps = ComponentProps<typeof Select.Value>;
+declare const SelectValue: {
+  ({ className, ...rest }: SelectValueProps): import("react").JSX.Element;
+  displayName: string;
+};
+type SelectPortalProps = ComponentProps<typeof Select.Portal> & {
+  /**
+   * When `container` is not provided, it uses a shared container created by `usePortalContainer`.
+   */
+  container?: HTMLElement | null;
+};
+declare const SelectPortal: {
+  ({ container, ...rest }: SelectPortalProps): import("react").JSX.Element;
+  displayName: string;
+};
+type SelectPositionerProps = ComponentProps<typeof Select.Positioner>;
+declare const SelectPositioner: {
+  ({ align, alignItemWithTrigger, className, collisionPadding, side, sideOffset, style, ref: forwardedRef, ...rest }: SelectPositionerProps): import("react").JSX.Element;
+  displayName: string;
+};
+type SelectPopupProps = ComponentProps<typeof Select.Popup>;
+declare const SelectPopup: {
+  ({ className, ...rest }: SelectPopupProps): import("react").JSX.Element;
+  displayName: string;
+};
+type SelectListProps = ComponentProps<typeof Select.List>;
+declare const SelectList: {
+  ({ className, ...rest }: SelectListProps): import("react").JSX.Element;
+  displayName: string;
+};
+type SelectItemProps = ComponentProps<typeof Select.Item>;
+declare const SelectItem: {
+  ({ className, ...rest }: SelectItemProps): import("react").JSX.Element;
+  displayName: string;
+};
+type SelectItemTextProps = ComponentProps<typeof Select.ItemText>;
+declare const SelectItemText: {
+  ({ className, ...rest }: SelectItemTextProps): import("react").JSX.Element;
+  displayName: string;
+};
+type SelectItemIndicatorProps = ComponentProps<typeof Select.ItemIndicator>;
+declare const SelectItemIndicator: {
+  ({ className, ...rest }: SelectItemIndicatorProps): import("react").JSX.Element;
+  displayName: string;
+};
+type SelectGroupProps = ComponentProps<typeof Select.Group>;
+declare const SelectGroup: {
+  ({ className, ...rest }: SelectGroupProps): import("react").JSX.Element;
+  displayName: string;
+};
+type SelectGroupLabelProps = ComponentProps<typeof Select.GroupLabel>;
+declare const SelectGroupLabel: {
+  ({ className, ...rest }: SelectGroupLabelProps): import("react").JSX.Element;
+  displayName: string;
+};
+type SelectScrollUpArrowProps = ComponentProps<typeof Select.ScrollUpArrow>;
+declare const SelectScrollUpArrow: {
+  ({ className, ...rest }: SelectScrollUpArrowProps): import("react").JSX.Element;
+  displayName: string;
+};
+type SelectScrollDownArrowProps = ComponentProps<typeof Select.ScrollDownArrow>;
+declare const SelectScrollDownArrow: {
+  ({ className, ...rest }: SelectScrollDownArrowProps): import("react").JSX.Element;
+  displayName: string;
+};
+type SelectArrowProps = ComponentProps<typeof Select.Arrow>;
+declare const SelectArrow: {
+  ({ className, ...rest }: SelectArrowProps): import("react").JSX.Element;
+  displayName: string;
+};
+//#endregion
+export { SelectArrow, SelectArrowProps, SelectBackdrop, SelectGroup, SelectGroupLabel, SelectGroupLabelProps, SelectGroupProps, SelectIcon, SelectIconProps, SelectItem, SelectItemIndicator, SelectItemIndicatorProps, SelectItemProps, SelectItemText, SelectItemTextProps, SelectList, SelectListProps, SelectPopup, SelectPopupProps, SelectPortal, SelectPortalProps, SelectPositioner, SelectPositionerProps, SelectRoot, SelectScrollDownArrow, SelectScrollDownArrowProps, SelectScrollUpArrow, SelectScrollUpArrowProps, SelectSeparator, SelectTrigger, SelectTriggerProps, SelectValue, SelectValueProps };
+//# sourceMappingURL=atoms.d.mts.map

package/es/base-ui/Select/atoms.mjs

@@ -0,0 +1,184 @@
+"use client";
+import { useNativeButton } from "../../hooks/useNativeButton.mjs";
+import { getFloatingCollisionPadding } from "../floating/collisionPadding.mjs";
+import { useAppElement } from "../../ThemeProvider/AppElementContext.mjs";
+import { useLayerZIndex } from "../zIndex/useLayerZIndex.mjs";
+import { styles } from "../DropdownMenu/sharedStyle.mjs";
+import { styles as styles$1, triggerVariants } from "./style.mjs";
+import { cloneElement, isValidElement } from "react";
+import { jsx } from "react/jsx-runtime";
+import { cx, useThemeMode } from "antd-style";
+import { mergeProps } from "@base-ui/react/merge-props";
+import { mergeRefs, useMergeRefs } from "react-merge-refs";
+import { Select } from "@base-ui/react/select";
+//#region src/base-ui/Select/atoms.tsx
+const mergeStateClassName = (base, className) => {
+	if (typeof className === "function") return (state) => cx(base, className(state));
+	return cx(base, className);
+};
+const SelectRoot = Select.Root;
+const SelectBackdrop = Select.Backdrop;
+const SelectSeparator = Select.Separator;
+const SelectTrigger = ({ children, className, nativeButton, shadow, size = "middle", variant, ref: refProp, ...rest }) => {
+	const { isDarkMode } = useThemeMode();
+	const baseClassName = triggerVariants({
+		shadow,
+		size,
+		variant: variant ?? (isDarkMode ? "filled" : "outlined")
+	});
+	const { isNativeButtonTriggerElement, resolvedNativeButton } = useNativeButton({
+		children,
+		nativeButton
+	});
+	if (isValidElement(children)) return /* @__PURE__ */ jsx(Select.Trigger, {
+		...rest,
+		nativeButton: resolvedNativeButton,
+		render: (props, state) => {
+			const resolvedProps = (() => {
+				if (isNativeButtonTriggerElement) return props;
+				const { type, ref: triggerRef, ...restProps } = props;
+				return restProps;
+			})();
+			const mergedProps = mergeProps(children.props, resolvedProps);
+			const childClassName = typeof mergedProps.className === "function" ? mergedProps.className(state) : mergedProps.className;
+			const extraClassName = typeof className === "function" ? className(state) : className;
+			return cloneElement(children, {
+				...mergedProps,
+				className: cx(baseClassName, childClassName, extraClassName),
+				ref: mergeRefs([
+					children.ref,
+					props.ref,
+					refProp
+				])
+			});
+		}
+	});
+	return /* @__PURE__ */ jsx(Select.Trigger, {
+		...rest,
+		className: mergeStateClassName(baseClassName, className),
+		nativeButton: resolvedNativeButton,
+		ref: refProp,
+		children
+	});
+};
+SelectTrigger.displayName = "SelectTrigger";
+const SelectIcon = ({ className, ...rest }) => {
+	return /* @__PURE__ */ jsx(Select.Icon, {
+		className: mergeStateClassName(styles$1.icon, className),
+		...rest
+	});
+};
+SelectIcon.displayName = "SelectIcon";
+const SelectValue = ({ className, ...rest }) => {
+	return /* @__PURE__ */ jsx(Select.Value, {
+		className: mergeStateClassName(styles$1.value, className),
+		...rest
+	});
+};
+SelectValue.displayName = "SelectValue";
+const SelectPortal = ({ container, ...rest }) => {
+	const appElement = useAppElement();
+	return /* @__PURE__ */ jsx(Select.Portal, {
+		container: container ?? appElement ?? void 0,
+		...rest
+	});
+};
+SelectPortal.displayName = "SelectPortal";
+const SelectPositioner = ({ align, alignItemWithTrigger, className, collisionPadding, side, sideOffset, style, ref: forwardedRef, ...rest }) => {
+	const explicitZIndex = typeof style !== "function" && style?.zIndex != null && typeof style.zIndex === "number" ? style.zIndex : void 0;
+	const { zIndex, ref: zRef } = useLayerZIndex("floating", explicitZIndex);
+	const composedRef = useMergeRefs([forwardedRef, zRef]);
+	const resolvedStyle = typeof style === "function" ? (state) => ({
+		zIndex,
+		...style(state)
+	}) : {
+		zIndex,
+		...style
+	};
+	return /* @__PURE__ */ jsx(Select.Positioner, {
+		align: align ?? "start",
+		alignItemWithTrigger: alignItemWithTrigger ?? false,
+		className: mergeStateClassName(styles$1.positioner, className),
+		collisionPadding: collisionPadding ?? getFloatingCollisionPadding(),
+		ref: composedRef,
+		side: side ?? "bottom",
+		sideOffset: sideOffset ?? 6,
+		style: resolvedStyle,
+		...rest
+	});
+};
+SelectPositioner.displayName = "SelectPositioner";
+const SelectPopup = ({ className, ...rest }) => {
+	return /* @__PURE__ */ jsx(Select.Popup, {
+		className: mergeStateClassName(cx(styles.popup, styles$1.popup), className),
+		...rest
+	});
+};
+SelectPopup.displayName = "SelectPopup";
+const SelectList = ({ className, ...rest }) => {
+	return /* @__PURE__ */ jsx(Select.List, {
+		className: mergeStateClassName(styles$1.list, className),
+		...rest
+	});
+};
+SelectList.displayName = "SelectList";
+const SelectItem = ({ className, ...rest }) => {
+	return /* @__PURE__ */ jsx(Select.Item, {
+		className: mergeStateClassName(cx(styles.item, styles$1.item), className),
+		...rest
+	});
+};
+SelectItem.displayName = "SelectItem";
+const SelectItemText = ({ className, ...rest }) => {
+	return /* @__PURE__ */ jsx(Select.ItemText, {
+		className: mergeStateClassName(cx(styles.label, styles$1.itemText), className),
+		...rest
+	});
+};
+SelectItemText.displayName = "SelectItemText";
+const SelectItemIndicator = ({ className, ...rest }) => {
+	return /* @__PURE__ */ jsx(Select.ItemIndicator, {
+		className: mergeStateClassName(styles$1.itemIndicator, className),
+		...rest
+	});
+};
+SelectItemIndicator.displayName = "SelectItemIndicator";
+const SelectGroup = ({ className, ...rest }) => {
+	return /* @__PURE__ */ jsx(Select.Group, {
+		className: mergeStateClassName(styles$1.group, className),
+		...rest
+	});
+};
+SelectGroup.displayName = "SelectGroup";
+const SelectGroupLabel = ({ className, ...rest }) => {
+	return /* @__PURE__ */ jsx(Select.GroupLabel, {
+		className: mergeStateClassName(cx(styles.groupLabel, styles$1.groupLabel), className),
+		...rest
+	});
+};
+SelectGroupLabel.displayName = "SelectGroupLabel";
+const SelectScrollUpArrow = ({ className, ...rest }) => {
+	return /* @__PURE__ */ jsx(Select.ScrollUpArrow, {
+		className: mergeStateClassName(styles$1.scrollArrow, className),
+		...rest
+	});
+};
+SelectScrollUpArrow.displayName = "SelectScrollUpArrow";
+const SelectScrollDownArrow = ({ className, ...rest }) => {
+	return /* @__PURE__ */ jsx(Select.ScrollDownArrow, {
+		className: mergeStateClassName(styles$1.scrollArrow, className),
+		...rest
+	});
+};
+SelectScrollDownArrow.displayName = "SelectScrollDownArrow";
+const SelectArrow = ({ className, ...rest }) => {
+	return /* @__PURE__ */ jsx(Select.Arrow, {
+		className: mergeStateClassName(styles$1.arrow, className),
+		...rest
+	});
+};
+SelectArrow.displayName = "SelectArrow";
+//#endregion
+export { SelectArrow, SelectBackdrop, SelectGroup, SelectGroupLabel, SelectIcon, SelectItem, SelectItemIndicator, SelectItemText, SelectList, SelectPopup, SelectPortal, SelectPositioner, SelectRoot, SelectScrollDownArrow, SelectScrollUpArrow, SelectSeparator, SelectTrigger, SelectValue };
+
+//# sourceMappingURL=atoms.mjs.map

package/es/base-ui/Select/atoms.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"atoms.mjs","names":["styles","menuStyles"],"sources":["../../../src/base-ui/Select/atoms.tsx"],"sourcesContent":["'use client';\r\n\r\nimport { mergeProps } from '@base-ui/react/merge-props';\r\nimport { Select } from '@base-ui/react/select';\r\nimport { cx, useThemeMode } from 'antd-style';\r\nimport {\r\n  cloneElement,\r\n  type ComponentProps,\r\n  type ComponentPropsWithRef,\r\n  isValidElement,\r\n} from 'react';\r\nimport { mergeRefs, useMergeRefs } from 'react-merge-refs';\r\n\r\nimport { styles as menuStyles } from '@/base-ui/DropdownMenu/sharedStyle';\r\nimport { getFloatingCollisionPadding } from '@/base-ui/floating';\r\nimport { useNativeButton } from '@/hooks/useNativeButton';\r\nimport { useAppElement } from '@/ThemeProvider/AppElementContext';\r\n\r\nimport { useLayerZIndex } from '../zIndex';\r\nimport { styles, triggerVariants } from './style';\r\nimport { type SelectSize, type SelectVariant } from './type';\r\n\r\nconst mergeStateClassName = <TState,>(\r\n  base: string,\r\n  className: string | ((state: TState) => string | undefined) | undefined,\r\n) => {\r\n  if (typeof className === 'function') return (state: TState) => cx(base, className(state));\r\n  return cx(base, className);\r\n};\r\n\r\nexport const SelectRoot = Select.Root;\r\nexport const SelectBackdrop = Select.Backdrop;\r\nexport const SelectSeparator = Select.Separator;\r\n\r\nexport type SelectTriggerProps = Omit<\r\n  ComponentPropsWithRef<typeof Select.Trigger>,\r\n  'children' | 'render'\r\n> & {\r\n  children: ComponentProps<typeof Select.Trigger>['children'];\r\n  shadow?: boolean;\r\n  size?: SelectSize;\r\n  variant?: SelectVariant;\r\n};\r\n\r\nexport const SelectTrigger = ({\r\n  children,\r\n  className,\r\n  nativeButton,\r\n  shadow,\r\n  size = 'middle',\r\n  variant,\r\n  ref: refProp,\r\n  ...rest\r\n}: SelectTriggerProps) => {\r\n  const { isDarkMode } = useThemeMode();\r\n  const resolvedVariant = variant ?? (isDarkMode ? 'filled' : 'outlined');\r\n  const baseClassName = triggerVariants({ shadow, size, variant: resolvedVariant });\r\n\r\n  const { isNativeButtonTriggerElement, resolvedNativeButton } = useNativeButton({\r\n    children,\r\n    nativeButton,\r\n  });\r\n\r\n  if (isValidElement(children)) {\r\n    return (\r\n      <Select.Trigger\r\n        {...rest}\r\n        nativeButton={resolvedNativeButton}\r\n        render={(props, state) => {\r\n          // Base UI's trigger props include `type=\"button\"` by default.\r\n          // If we render into a non-<button> element, that prop is invalid and can warn.\r\n          const resolvedProps = (() => {\r\n            if (isNativeButtonTriggerElement) return props as any;\r\n            // eslint-disable-next-line unused-imports/no-unused-vars\r\n            const { type, ref: triggerRef, ...restProps } = props as any;\r\n            return restProps;\r\n          })();\r\n\r\n          const mergedProps = mergeProps((children as any).props, resolvedProps);\r\n          const childClassName =\r\n            typeof (mergedProps as any).className === 'function'\r\n              ? (mergedProps as any).className(state)\r\n              : (mergedProps as any).className;\r\n          const extraClassName = typeof className === 'function' ? className(state) : className;\r\n\r\n          return cloneElement(children as any, {\r\n            ...mergedProps,\r\n            className: cx(baseClassName, childClassName, extraClassName),\r\n            ref: mergeRefs([(children as any).ref, (props as any).ref, refProp]),\r\n          });\r\n        }}\r\n      />\r\n    );\r\n  }\r\n\r\n  return (\r\n    <Select.Trigger\r\n      {...rest}\r\n      className={mergeStateClassName(baseClassName, className) as any}\r\n      nativeButton={resolvedNativeButton}\r\n      ref={refProp as any}\r\n    >\r\n      {children}\r\n    </Select.Trigger>\r\n  );\r\n};\r\n\r\nSelectTrigger.displayName = 'SelectTrigger';\r\n\r\nexport type SelectIconProps = ComponentProps<typeof Select.Icon>;\r\n\r\nexport const SelectIcon = ({ className, ...rest }: SelectIconProps) => {\r\n  return <Select.Icon className={mergeStateClassName(styles.icon, className) as any} {...rest} />;\r\n};\r\n\r\nSelectIcon.displayName = 'SelectIcon';\r\n\r\nexport type SelectValueProps = ComponentProps<typeof Select.Value>;\r\n\r\nexport const SelectValue = ({ className, ...rest }: SelectValueProps) => {\r\n  return <Select.Value className={mergeStateClassName(styles.value, className) as any} {...rest} />;\r\n};\r\n\r\nSelectValue.displayName = 'SelectValue';\r\n\r\nexport type SelectPortalProps = ComponentProps<typeof Select.Portal> & {\r\n  /**\r\n   * When `container` is not provided, it uses a shared container created by `usePortalContainer`.\r\n   */\r\n  container?: HTMLElement | null;\r\n};\r\n\r\nexport const SelectPortal = ({ container, ...rest }: SelectPortalProps) => {\r\n  const appElement = useAppElement();\r\n  return <Select.Portal container={container ?? appElement ?? undefined} {...rest} />;\r\n};\r\n\r\nSelectPortal.displayName = 'SelectPortal';\r\n\r\nexport type SelectPositionerProps = ComponentProps<typeof Select.Positioner>;\r\n\r\nexport const SelectPositioner = ({\r\n  align,\r\n  alignItemWithTrigger,\r\n  className,\r\n  collisionPadding,\r\n  side,\r\n  sideOffset,\r\n  style,\r\n  ref: forwardedRef,\r\n  ...rest\r\n}: SelectPositionerProps) => {\r\n  const explicitZIndex =\r\n    typeof style !== 'function' && style?.zIndex != null && typeof style.zIndex === 'number'\r\n      ? style.zIndex\r\n      : undefined;\r\n  const { zIndex, ref: zRef } = useLayerZIndex<HTMLDivElement>('floating', explicitZIndex);\r\n  const composedRef = useMergeRefs([forwardedRef, zRef]);\r\n\r\n  const resolvedStyle =\r\n    typeof style === 'function'\r\n      ? (state: any) => ({ zIndex, ...style(state) })\r\n      : { zIndex, ...style };\r\n\r\n  return (\r\n    <Select.Positioner\r\n      align={align ?? 'start'}\r\n      alignItemWithTrigger={alignItemWithTrigger ?? false}\r\n      className={mergeStateClassName(styles.positioner, className) as any}\r\n      collisionPadding={collisionPadding ?? getFloatingCollisionPadding()}\r\n      ref={composedRef as any}\r\n      side={side ?? 'bottom'}\r\n      sideOffset={sideOffset ?? 6}\r\n      style={resolvedStyle}\r\n      {...rest}\r\n    />\r\n  );\r\n};\r\n\r\nSelectPositioner.displayName = 'SelectPositioner';\r\n\r\nexport type SelectPopupProps = ComponentProps<typeof Select.Popup>;\r\n\r\nexport const SelectPopup = ({ className, ...rest }: SelectPopupProps) => {\r\n  return (\r\n    <Select.Popup\r\n      className={mergeStateClassName(cx(menuStyles.popup, styles.popup), className) as any}\r\n      {...rest}\r\n    />\r\n  );\r\n};\r\n\r\nSelectPopup.displayName = 'SelectPopup';\r\n\r\nexport type SelectListProps = ComponentProps<typeof Select.List>;\r\n\r\nexport const SelectList = ({ className, ...rest }: SelectListProps) => {\r\n  return <Select.List className={mergeStateClassName(styles.list, className) as any} {...rest} />;\r\n};\r\n\r\nSelectList.displayName = 'SelectList';\r\n\r\nexport type SelectItemProps = ComponentProps<typeof Select.Item>;\r\n\r\nexport const SelectItem = ({ className, ...rest }: SelectItemProps) => {\r\n  return (\r\n    <Select.Item\r\n      className={mergeStateClassName(cx(menuStyles.item, styles.item), className) as any}\r\n      {...rest}\r\n    />\r\n  );\r\n};\r\n\r\nSelectItem.displayName = 'SelectItem';\r\n\r\nexport type SelectItemTextProps = ComponentProps<typeof Select.ItemText>;\r\n\r\nexport const SelectItemText = ({ className, ...rest }: SelectItemTextProps) => {\r\n  return (\r\n    <Select.ItemText\r\n      className={mergeStateClassName(cx(menuStyles.label, styles.itemText), className) as any}\r\n      {...rest}\r\n    />\r\n  );\r\n};\r\n\r\nSelectItemText.displayName = 'SelectItemText';\r\n\r\nexport type SelectItemIndicatorProps = ComponentProps<typeof Select.ItemIndicator>;\r\n\r\nexport const SelectItemIndicator = ({ className, ...rest }: SelectItemIndicatorProps) => {\r\n  return (\r\n    <Select.ItemIndicator\r\n      className={mergeStateClassName(styles.itemIndicator, className) as any}\r\n      {...rest}\r\n    />\r\n  );\r\n};\r\n\r\nSelectItemIndicator.displayName = 'SelectItemIndicator';\r\n\r\nexport type SelectGroupProps = ComponentProps<typeof Select.Group>;\r\n\r\nexport const SelectGroup = ({ className, ...rest }: SelectGroupProps) => {\r\n  return <Select.Group className={mergeStateClassName(styles.group, className) as any} {...rest} />;\r\n};\r\n\r\nSelectGroup.displayName = 'SelectGroup';\r\n\r\nexport type SelectGroupLabelProps = ComponentProps<typeof Select.GroupLabel>;\r\n\r\nexport const SelectGroupLabel = ({ className, ...rest }: SelectGroupLabelProps) => {\r\n  return (\r\n    <Select.GroupLabel\r\n      className={\r\n        mergeStateClassName(cx(menuStyles.groupLabel, styles.groupLabel), className) as any\r\n      }\r\n      {...rest}\r\n    />\r\n  );\r\n};\r\n\r\nSelectGroupLabel.displayName = 'SelectGroupLabel';\r\n\r\nexport type SelectScrollUpArrowProps = ComponentProps<typeof Select.ScrollUpArrow>;\r\n\r\nexport const SelectScrollUpArrow = ({ className, ...rest }: SelectScrollUpArrowProps) => {\r\n  return (\r\n    <Select.ScrollUpArrow\r\n      className={mergeStateClassName(styles.scrollArrow, className) as any}\r\n      {...rest}\r\n    />\r\n  );\r\n};\r\n\r\nSelectScrollUpArrow.displayName = 'SelectScrollUpArrow';\r\n\r\nexport type SelectScrollDownArrowProps = ComponentProps<typeof Select.ScrollDownArrow>;\r\n\r\nexport const SelectScrollDownArrow = ({ className, ...rest }: SelectScrollDownArrowProps) => {\r\n  return (\r\n    <Select.ScrollDownArrow\r\n      className={mergeStateClassName(styles.scrollArrow, className) as any}\r\n      {...rest}\r\n    />\r\n  );\r\n};\r\n\r\nSelectScrollDownArrow.displayName = 'SelectScrollDownArrow';\r\n\r\nexport type SelectArrowProps = ComponentProps<typeof Select.Arrow>;\r\n\r\nexport const SelectArrow = ({ className, ...rest }: SelectArrowProps) => {\r\n  return <Select.Arrow className={mergeStateClassName(styles.arrow, className) as any} {...rest} />;\r\n};\r\n\r\nSelectArrow.displayName = 'SelectArrow';\r\n"],"mappings":"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"}

package/es/base-ui/Select/helpers.mjs

@@ -0,0 +1,32 @@
+//#region src/base-ui/Select/helpers.ts
+const isGroupOption = (option) => Boolean(option.options);
+const getOptionSearchText = (option) => {
+	if (typeof option.label === "string" || typeof option.label === "number") return String(option.label);
+	if (option.title) return option.title;
+	if (typeof option.value === "string" || typeof option.value === "number") return String(option.value);
+	return "";
+};
+const escapeRegExp = (value) => value.replaceAll(/[$()*+.?[\\\]^{|}]/g, "\\$&");
+const splitBySeparators = (value, separators) => {
+	if (!separators || separators.length === 0) return [value];
+	const pattern = separators.map(escapeRegExp).join("|");
+	return value.split(new RegExp(pattern, "g"));
+};
+const countVirtualItems = (items) => items.reduce((count, item) => {
+	if (isGroupOption(item)) return count + item.options.length + 1;
+	return count + 1;
+}, 0);
+const isValueEmpty = (value) => value === null || value === void 0 || value === "";
+const normalizeValueFor = (isMultiple) => (nextValue) => {
+	if (isMultiple) {
+		if (Array.isArray(nextValue)) return nextValue;
+		if (nextValue === null || nextValue === void 0) return [];
+		return [nextValue];
+	}
+	if (Array.isArray(nextValue)) return nextValue[0] ?? null;
+	return nextValue === void 0 ? null : nextValue;
+};
+//#endregion
+export { countVirtualItems, getOptionSearchText, isGroupOption, isValueEmpty, normalizeValueFor, splitBySeparators };
+
+//# sourceMappingURL=helpers.mjs.map

package/es/base-ui/Select/helpers.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.mjs","names":[],"sources":["../../../src/base-ui/Select/helpers.ts"],"sourcesContent":["import { type SelectOption, type SelectOptionGroup, type SelectOptions } from './type';\r\n\r\nexport const isGroupOption = <Value>(\r\n  option: SelectOption<Value> | SelectOptionGroup<Value>,\r\n): option is SelectOptionGroup<Value> => Boolean((option as SelectOptionGroup<Value>).options);\r\n\r\nexport const getOptionSearchText = <Value>(option: SelectOption<Value>) => {\r\n  if (typeof option.label === 'string' || typeof option.label === 'number') {\r\n    return String(option.label);\r\n  }\r\n  if (option.title) return option.title;\r\n  if (typeof option.value === 'string' || typeof option.value === 'number') {\r\n    return String(option.value);\r\n  }\r\n  return '';\r\n};\r\n\r\nconst escapeRegExp = (value: string) => value.replaceAll(/[$()*+.?[\\\\\\]^{|}]/g, '\\\\$&');\r\n\r\nexport const splitBySeparators = (value: string, separators?: string[]) => {\r\n  if (!separators || separators.length === 0) return [value];\r\n  const pattern = separators.map(escapeRegExp).join('|');\r\n  return value.split(new RegExp(pattern, 'g'));\r\n};\r\n\r\nexport const countVirtualItems = (items: SelectOptions) =>\r\n  items.reduce((count, item) => {\r\n    if (isGroupOption(item)) {\r\n      return count + item.options.length + 1;\r\n    }\r\n    return count + 1;\r\n  }, 0);\r\n\r\nexport const isValueEmpty = (value: unknown) =>\r\n  value === null || value === undefined || value === '';\r\n\r\nexport const normalizeValueFor = (isMultiple: boolean) => (nextValue: any) => {\r\n  if (isMultiple) {\r\n    if (Array.isArray(nextValue)) return nextValue;\r\n    if (nextValue === null || nextValue === undefined) return [];\r\n    return [nextValue];\r\n  }\r\n  if (Array.isArray(nextValue)) return nextValue[0] ?? null;\r\n  return nextValue === undefined ? null : nextValue;\r\n};\r\n"],"mappings":";AAEA,MAAa,iBACX,WACuC,QAAS,OAAoC,OAAO;AAE7F,MAAa,uBAA8B,WAAgC;CACzE,IAAI,OAAO,OAAO,UAAU,YAAY,OAAO,OAAO,UAAU,UAC9D,OAAO,OAAO,OAAO,KAAK;CAE5B,IAAI,OAAO,OAAO,OAAO,OAAO;CAChC,IAAI,OAAO,OAAO,UAAU,YAAY,OAAO,OAAO,UAAU,UAC9D,OAAO,OAAO,OAAO,KAAK;CAE5B,OAAO;AACT;AAEA,MAAM,gBAAgB,UAAkB,MAAM,WAAW,uBAAuB,MAAM;AAEtF,MAAa,qBAAqB,OAAe,eAA0B;CACzE,IAAI,CAAC,cAAc,WAAW,WAAW,GAAG,OAAO,CAAC,KAAK;CACzD,MAAM,UAAU,WAAW,IAAI,YAAY,CAAC,CAAC,KAAK,GAAG;CACrD,OAAO,MAAM,MAAM,IAAI,OAAO,SAAS,GAAG,CAAC;AAC7C;AAEA,MAAa,qBAAqB,UAChC,MAAM,QAAQ,OAAO,SAAS;CAC5B,IAAI,cAAc,IAAI,GACpB,OAAO,QAAQ,KAAK,QAAQ,SAAS;CAEvC,OAAO,QAAQ;AACjB,GAAG,CAAC;AAEN,MAAa,gBAAgB,UAC3B,UAAU,QAAQ,UAAU,KAAA,KAAa,UAAU;AAErD,MAAa,qBAAqB,gBAAyB,cAAmB;CAC5E,IAAI,YAAY;EACd,IAAI,MAAM,QAAQ,SAAS,GAAG,OAAO;EACrC,IAAI,cAAc,QAAQ,cAAc,KAAA,GAAW,OAAO,CAAC;EAC3D,OAAO,CAAC,SAAS;CACnB;CACA,IAAI,MAAM,QAAQ,SAAS,GAAG,OAAO,UAAU,MAAM;CACrD,OAAO,cAAc,KAAA,IAAY,OAAO;AAC1C"}