xmlui 0.10.23 → 0.10.25

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "xmlui",
-  "version": "0.10.23",
+  "version": "0.10.25",
   "sideEffects": false,
   "scripts": {
     "start-test-bed": "cd src/testing/infrastructure && xmlui start",

package/dist/scripts/src/components/Select/MultiSelectOption.js

@@ -1,42 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.MultiSelectOption = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const SelectContext_1 = require("./SelectContext");
-const classnames_1 = __importDefault(require("classnames"));
-const Select_module_scss_1 = __importDefault(require("./Select.module.scss"));
-const IconNative_1 = __importDefault(require("../Icon/IconNative"));
-exports.MultiSelectOption = (0, react_1.forwardRef)(function MultiSelectOption(option, forwardedRef) {
-    const id = (0, react_1.useId)();
-    const { label, value, enabled = true, keywords, readOnly, children, isHighlighted = false, itemIndex, } = option;
-    const { value: selectedValue, onChange, multiSelect, setOpen, setSelectedIndex, optionRenderer, } = (0, SelectContext_1.useSelect)();
-    const selected = (0, react_1.useMemo)(() => {
-        return Array.isArray(selectedValue) && multiSelect
-            ? selectedValue.map((v) => String(v)).includes(value)
-            : String(selectedValue) === String(value);
-    }, [selectedValue, value, multiSelect]);
-    const handleClick = () => {
-        if (readOnly) {
-            setOpen(false);
-            return;
-        }
-        if (enabled) {
-            onChange(value);
-        }
-    };
-    return ((0, jsx_runtime_1.jsx)("div", { id: id, ref: forwardedRef, role: "option", "aria-disabled": !enabled, "aria-selected": selected, className: (0, classnames_1.default)(Select_module_scss_1.default.multiSelectOption, {
-            [Select_module_scss_1.default.disabledOption]: !enabled,
-            [Select_module_scss_1.default.highlighted]: isHighlighted,
-        }), onMouseDown: (e) => {
-            e.preventDefault();
-            e.stopPropagation();
-        }, onMouseEnter: () => {
-            if (itemIndex !== undefined && setSelectedIndex && enabled) {
-                setSelectedIndex(itemIndex);
-            }
-        }, onClick: handleClick, "data-state": selected ? "checked" : undefined, children: (0, jsx_runtime_1.jsx)("div", { className: Select_module_scss_1.default.multiSelectOptionContent, children: optionRenderer ? (optionRenderer({ label, value, enabled, keywords }, selectedValue, false)) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [children || label, selected && (0, jsx_runtime_1.jsx)(IconNative_1.default, { name: "checkmark" })] })) }) }));
-});

package/dist/scripts/src/components/Select/SelectOption.js

@@ -1,34 +0,0 @@
-"use strict";
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SelectOption = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const react_select_1 = require("@radix-ui/react-select");
-const SelectContext_1 = require("./SelectContext");
-const OptionContext_1 = require("./OptionContext");
-const classnames_1 = __importDefault(require("classnames"));
-const Select_module_scss_1 = __importDefault(require("./Select.module.scss"));
-const IconNative_1 = __importDefault(require("../Icon/IconNative"));
-exports.SelectOption = (0, react_1.forwardRef)(function SelectOption(option, ref) {
-    const visibleContentRef = (0, react_1.useRef)(null);
-    const { value, label, enabled = true, children, className } = option;
-    const { value: selectedValue, optionRenderer } = (0, SelectContext_1.useSelect)();
-    const { onOptionRemove, onOptionAdd } = (0, OptionContext_1.useOption)();
-    const opt = (0, react_1.useMemo)(() => {
-        return Object.assign(Object.assign({}, option), { label: label !== null && label !== void 0 ? label : "", keywords: [label !== null && label !== void 0 ? label : ""] });
-    }, [option, label]);
-    (0, react_1.useEffect)(() => {
-        onOptionAdd(opt);
-        return () => onOptionRemove(opt);
-    }, [opt, onOptionAdd, onOptionRemove]);
-    return ((0, jsx_runtime_1.jsxs)(react_select_1.Item, { ref: ref, className: (0, classnames_1.default)(className, Select_module_scss_1.default.selectOption), value: value, textValue: label, disabled: !enabled, onClick: (event) => {
-            event.stopPropagation();
-        }, "data-state": selectedValue === value && "checked", children: [(0, jsx_runtime_1.jsx)("span", { style: { display: "none" }, children: (0, jsx_runtime_1.jsx)(react_select_1.ItemText, { children: label }) }), children ? ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: Select_module_scss_1.default.selectOptionContent, ref: visibleContentRef, children: children }), selectedValue === value && ((0, jsx_runtime_1.jsx)(react_select_1.ItemIndicator, { className: Select_module_scss_1.default.selectOptionIndicator, children: (0, jsx_runtime_1.jsx)(IconNative_1.default, { name: "checkmark" }) }))] })) : optionRenderer ? ((0, jsx_runtime_1.jsx)("div", { className: Select_module_scss_1.default.selectOptionContent, ref: visibleContentRef, children: optionRenderer({
-                    label,
-                    value,
-                    enabled,
-                }, selectedValue, false) })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("div", { className: Select_module_scss_1.default.selectOptionContent, ref: visibleContentRef, children: label }), selectedValue === value && ((0, jsx_runtime_1.jsx)(react_select_1.ItemIndicator, { className: Select_module_scss_1.default.selectItemIndicator, children: (0, jsx_runtime_1.jsx)(IconNative_1.default, { name: "checkmark" }) }))] }))] }));
-});

package/dist/scripts/src/components/Select/SimpleSelect.js

@@ -1,57 +0,0 @@
-"use strict";
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-var __importDefault = (this && this.__importDefault) || function (mod) {
-    return (mod && mod.__esModule) ? mod : { "default": mod };
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.SimpleSelect = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const ThemeContext_1 = require("../../components-core/theming/ThemeContext");
-const Select_module_scss_1 = __importDefault(require("./Select.module.scss"));
-const SelectContext_1 = require("./SelectContext");
-const IconNative_1 = __importDefault(require("../Icon/IconNative"));
-const classnames_1 = __importDefault(require("classnames"));
-const react_compose_refs_1 = require("@radix-ui/react-compose-refs");
-const react_select_1 = require("@radix-ui/react-select");
-exports.SimpleSelect = (0, react_1.forwardRef)(function SimpleSelect(props, forwardedRef) {
-    const { root } = (0, ThemeContext_1.useTheme)();
-    const { enabled, onBlur, autoFocus, onValueChange, validationStatus, value, height, style, placeholder, id, triggerRef, onFocus, width, children, readOnly, emptyListNode, className } = props, rest = __rest(props, ["enabled", "onBlur", "autoFocus", "onValueChange", "validationStatus", "value", "height", "style", "placeholder", "id", "triggerRef", "onFocus", "width", "children", "readOnly", "emptyListNode", "className"]);
-    const { options } = (0, SelectContext_1.useSelect)();
-    const composedRef = react_1.forwardRef ? (0, react_compose_refs_1.composeRefs)(triggerRef, forwardedRef) : triggerRef;
-    // Convert value to string for Radix UI compatibility
-    const stringValue = (0, react_1.useMemo)(() => {
-        return value != undefined ? String(value) : undefined;
-    }, [value]);
-    // Handle value changes with proper type conversion
-    const handleValueChange = (0, react_1.useCallback)((val) => {
-        if (readOnly)
-            return;
-        onValueChange(val);
-    }, [onValueChange, readOnly]);
-    const optionsArray = (0, react_1.useMemo)(() => Array.from(options), [options]);
-    const selectedOption = (0, react_1.useMemo)(() => {
-        return optionsArray.find((option) => String(option.value) === String(value));
-    }, [optionsArray, value]);
-    return ((0, jsx_runtime_1.jsxs)(react_select_1.Root, { value: stringValue, onValueChange: handleValueChange, children: [(0, jsx_runtime_1.jsxs)(react_select_1.Trigger, Object.assign({}, rest, { id: id, ref: composedRef, "aria-haspopup": "listbox", style: style, onFocus: onFocus, onBlur: onBlur, disabled: !enabled, className: (0, classnames_1.default)(className, Select_module_scss_1.default.selectTrigger, {
-                    [Select_module_scss_1.default.error]: validationStatus === "error",
-                    [Select_module_scss_1.default.warning]: validationStatus === "warning",
-                    [Select_module_scss_1.default.valid]: validationStatus === "valid",
-                }), onClick: (event) => {
-                    // Prevent event propagation to parent elements (e.g., DropdownMenu)
-                    // This ensures that clicking the Select trigger doesn't close the containing DropdownMenu
-                    event.stopPropagation();
-                }, autoFocus: autoFocus, children: [(0, jsx_runtime_1.jsx)("div", { className: (0, classnames_1.default)(Select_module_scss_1.default.selectValue, {
-                            [Select_module_scss_1.default.placeholder]: value === undefined,
-                        }), children: selectedOption ? selectedOption.label : readOnly ? "" : placeholder }), (0, jsx_runtime_1.jsx)("span", { className: Select_module_scss_1.default.action, children: (0, jsx_runtime_1.jsx)(IconNative_1.default, { name: "chevrondown" }) })] })), (0, jsx_runtime_1.jsx)(react_select_1.Portal, { container: root, children: (0, jsx_runtime_1.jsxs)(react_select_1.Content, { className: Select_module_scss_1.default.selectDropdownContent, position: "popper", style: { maxHeight: height, minWidth: width }, children: [(0, jsx_runtime_1.jsx)(react_select_1.ScrollUpButton, { className: Select_module_scss_1.default.selectScrollUpButton, children: (0, jsx_runtime_1.jsx)(IconNative_1.default, { name: "chevronup" }) }), (0, jsx_runtime_1.jsxs)(react_select_1.Viewport, { className: Select_module_scss_1.default.selectViewport, role: "listbox", children: [children, optionsArray.length === 0 && emptyListNode] }), (0, jsx_runtime_1.jsx)(react_select_1.ScrollDownButton, { className: Select_module_scss_1.default.selectScrollDownButton, children: (0, jsx_runtime_1.jsx)(IconNative_1.default, { name: "chevrondown" }) })] }) })] }));
-});