tiny-ui 0.0.95 → 1.0.1

package/es/select/select.js

@@ -0,0 +1,309 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import React, { useContext, useEffect, useId, useRef, useState, useCallback, useMemo } from 'react';
+import classNames from 'classnames';
+import { useClickOutside } from '../_utils/hooks';
+import { useCombobox } from '../_utils/useCombobox';
+import { ArrowDown, Close, CloseCircle, LoadingCircle, Check } from '../_utils/components';
+import { SelectContext } from './select-context';
+import { ConfigContext } from '../config-provider/config-context';
+import { getPrefixCls } from '../_utils/general';
+import Popup from '../popup';
+const Select = (props) => {
+    const { defaultOpen = false, disabled = false, defaultValue, prefixCls: customisedCls, value, mode, showSearch = false, filterOption = true, onSearch, allowClear = false, loading = false, size, maxTagCount, notFoundContent, options: optionsProp, onChange, onSelect, onDropdownVisibleChange, optionRender, labelRender, placeholder, className, children, dropdownStyle, ...otherProps } = props;
+    const isMultiple = mode === 'multiple' || mode === 'tags';
+    const defaultVal = defaultValue ?? (isMultiple ? [] : '');
+    const [selectVal, setSelectVal] = useState('value' in props ? value : defaultVal);
+    const [searchValue, setSearchValue] = useState('');
+    const ref = useRef(null);
+    const searchInputRef = useRef(null);
+    const listboxId = useId();
+    const configContext = useContext(ConfigContext);
+    const prefixCls = getPrefixCls('select', configContext.prefixCls, customisedCls);
+    const selectSize = size || configContext.componentSize || 'md';
+    const hasSomeValue = isMultiple
+        ? Array.isArray(selectVal) && selectVal.length > 0
+        : selectVal !== '' && selectVal !== undefined;
+    // Build flat option list from children or options prop
+    const flatOptions = useMemo(() => {
+        if (optionsProp)
+            return optionsProp;
+        const result = [];
+        const extractFromChildren = (nodes) => {
+            React.Children.forEach(nodes, (child) => {
+                const el = child;
+                if (!el?.type)
+                    return;
+                if (el.type.displayName === 'SelectOption') {
+                    result.push({
+                        value: el.props.value,
+                        label: el.props.label ?? el.props.children,
+                        disabled: !!el.props.disabled,
+                    });
+                }
+                else if (el.type.displayName === 'SelectOptGroup') {
+                    extractFromChildren(el.props.children);
+                }
+            });
+        };
+        extractFromChildren(children);
+        return result;
+    }, [optionsProp, children]);
+    // Handle option select
+    const handleSelect = useCallback((optValue) => {
+        if (isMultiple) {
+            const arr = Array.isArray(selectVal) ? selectVal : [];
+            let newVal;
+            if (arr.includes(optValue)) {
+                newVal = arr.filter((v) => v !== optValue);
+            }
+            else {
+                newVal = [...arr, optValue];
+            }
+            if (!('value' in props)) {
+                setSelectVal(newVal);
+            }
+            onChange?.(newVal, flatOptions.filter((o) => newVal.includes(o.value)));
+            onSelect?.(newVal);
+            setSearchValue('');
+        }
+        else {
+            if (!('value' in props)) {
+                setSelectVal(optValue);
+            }
+            onChange?.(optValue, flatOptions.find((o) => o.value === optValue));
+            onSelect?.(optValue);
+            combo.closeDropdown();
+            setSearchValue('');
+        }
+    }, 
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [isMultiple, selectVal, flatOptions, onChange, onSelect, props]);
+    const handleComboSelect = useCallback((item) => {
+        if (!item.disabled)
+            handleSelect(item.value);
+    }, [handleSelect]);
+    const combo = useCombobox({
+        items: flatOptions,
+        searchValue,
+        filterOption,
+        isOpen: 'open' in props ? props.open : undefined,
+        defaultOpen,
+        disabled,
+        defaultActiveFirstOption: false,
+        onOpenChange: onDropdownVisibleChange,
+        onSelect: handleComboSelect,
+    });
+    const cls = classNames(prefixCls, className, `${prefixCls}_${selectSize}`, {
+        [`${prefixCls}_disabled`]: disabled,
+        [`${prefixCls}_open`]: combo.isOpen,
+        [`${prefixCls}_multiple`]: isMultiple,
+        [`${prefixCls}_showSearch`]: showSearch,
+        [`${prefixCls}_has-value`]: allowClear && hasSomeValue && !disabled,
+    });
+    const arrowCls = classNames(`${prefixCls}__arrow`, {
+        [`${prefixCls}__arrow_reverse`]: combo.isOpen,
+    });
+    useClickOutside(ref.current, () => {
+        if (!('open' in props)) {
+            combo.closeDropdown();
+        }
+        setSearchValue('');
+    });
+    // Get display label for a value
+    const getLabelForValue = useCallback((val) => {
+        const opt = flatOptions.find((o) => o.value === val);
+        const label = opt?.label ?? val;
+        if (labelRender && opt) {
+            return labelRender({ label, value: val });
+        }
+        return label;
+    }, [flatOptions, labelRender]);
+    // Remove tag
+    const handleRemoveTag = (val, e) => {
+        e.stopPropagation();
+        if (disabled)
+            return;
+        const arr = Array.isArray(selectVal) ? selectVal : [];
+        const newVal = arr.filter((v) => v !== val);
+        if (!('value' in props)) {
+            setSelectVal(newVal);
+        }
+        onChange?.(newVal, flatOptions.filter((o) => newVal.includes(o.value)));
+        onSelect?.(newVal);
+    };
+    // Clear all
+    const handleClear = (e) => {
+        e.stopPropagation();
+        if (disabled)
+            return;
+        const newVal = isMultiple ? [] : '';
+        if (!('value' in props)) {
+            setSelectVal(newVal);
+        }
+        onChange?.(newVal);
+        onSelect?.(newVal);
+        setSearchValue('');
+    };
+    // Search input change
+    const handleSearchChange = (e) => {
+        const val = e.target.value;
+        setSearchValue(val);
+        onSearch?.(val);
+        if (!combo.isOpen) {
+            combo.openDropdown();
+        }
+    };
+    // Selector click
+    const handleSelectorClick = () => {
+        if (disabled)
+            return;
+        if (combo.isOpen && !showSearch) {
+            combo.closeDropdown();
+        }
+        else {
+            combo.openDropdown();
+            setTimeout(() => searchInputRef.current?.focus(), 0);
+        }
+    };
+    // Keyboard — wrap hook's handler with Select-specific keys
+    const handleKeyDown = (e) => {
+        if (disabled)
+            return;
+        if (e.key === 'Backspace' && isMultiple && !searchValue) {
+            const arr = Array.isArray(selectVal) ? selectVal : [];
+            if (arr.length > 0) {
+                const newVal = arr.slice(0, -1);
+                if (!('value' in props))
+                    setSelectVal(newVal);
+                onChange?.(newVal, flatOptions.filter((o) => newVal.includes(o.value)));
+                onSelect?.(newVal);
+            }
+            return;
+        }
+        if (e.key === ' ') {
+            if (!combo.isOpen) {
+                e.preventDefault();
+                combo.openDropdown();
+            }
+            else if (combo.focusedIndex >= 0 && combo.focusedIndex < combo.filteredItems.length) {
+                e.preventDefault();
+                const opt = combo.filteredItems[combo.focusedIndex];
+                if (!opt.disabled)
+                    handleSelect(opt.value);
+            }
+            return;
+        }
+        combo.handleKeyDown(e);
+    };
+    // Controlled value
+    const hasValueProp = 'value' in props;
+    useEffect(() => {
+        if (hasValueProp)
+            setSelectVal(value);
+    }, [hasValueProp, value]);
+    // Reset focused index when search changes
+    useEffect(() => {
+        combo.setFocusedIndex(-1);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [searchValue]);
+    const hasValue = hasSomeValue;
+    // Context value
+    const contextValue = useMemo(() => ({
+        value: selectVal,
+        mode,
+        searchValue,
+        onSelect: handleSelect,
+        prefixCls,
+    }), [selectVal, mode, searchValue, handleSelect, prefixCls]);
+    // Filter children for dropdown
+    const filterChildren = (nodes) => {
+        return React.Children.map(nodes, (child) => {
+            const el = child;
+            if (!el?.type)
+                return null;
+            if (el.type.displayName === 'SelectOption') {
+                const opt = {
+                    value: el.props.value,
+                    label: el.props.label ?? el.props.children,
+                    disabled: !!el.props.disabled,
+                };
+                if (!combo.matchesFilter(opt))
+                    return null;
+                return React.cloneElement(el, el.props);
+            }
+            if (el.type.displayName === 'SelectOptGroup') {
+                const filteredGroupChildren = filterChildren(el.props.children);
+                const hasVisibleChildren = React.Children.toArray(filteredGroupChildren).some(Boolean);
+                if (!hasVisibleChildren)
+                    return null;
+                return React.cloneElement(el, { ...el.props, children: filteredGroupChildren });
+            }
+            return null;
+        });
+    };
+    // Render dropdown
+    const renderDropdownContent = () => {
+        if (loading) {
+            return (_jsx("div", { className: `${prefixCls}__loading`, children: _jsx(LoadingCircle, { size: 20 }) }));
+        }
+        let content;
+        if (optionsProp) {
+            const filtered = combo.filteredItems;
+            if (filtered.length === 0) {
+                content = null;
+            }
+            else {
+                content = filtered.map((opt, index) => {
+                    const isSelected = isMultiple
+                        ? Array.isArray(selectVal) && selectVal.includes(opt.value)
+                        : selectVal === opt.value;
+                    const optCls = classNames(`${prefixCls}-option`, {
+                        [`${prefixCls}-option_selected`]: isSelected,
+                        [`${prefixCls}-option_active`]: index === combo.focusedIndex,
+                        [`${prefixCls}-option_disabled`]: opt.disabled,
+                    });
+                    const label = opt.label ?? opt.value;
+                    const renderedContent = optionRender ? optionRender(opt, { index }) : label;
+                    return (_jsxs("li", { role: "option", className: optCls, "aria-selected": isSelected, "aria-disabled": opt.disabled, onClick: () => !opt.disabled && handleSelect(opt.value), onMouseEnter: () => combo.setFocusedIndex(index), children: [_jsx("span", { className: `${prefixCls}-option__content`, children: renderedContent }), isMultiple && isSelected && (_jsx("span", { className: `${prefixCls}-option__check`, children: _jsx(Check, { size: 14 }) }))] }, opt.value));
+                });
+            }
+        }
+        else {
+            content = filterChildren(children);
+        }
+        const contentArray = React.Children.toArray(content);
+        if (!contentArray || contentArray.length === 0) {
+            return (_jsx("div", { className: `${prefixCls}__empty`, children: notFoundContent ?? 'No data' }));
+        }
+        return content;
+    };
+    const renderOverlay = () => {
+        const selectorWidth = ref.current?.offsetWidth;
+        return (_jsx(SelectContext.Provider, { value: contextValue, children: _jsx("ul", { className: `${prefixCls}__dropdown`, style: { minWidth: selectorWidth || undefined, ...dropdownStyle }, role: "listbox", id: listboxId, children: renderDropdownContent() }) }));
+    };
+    // Render selector content
+    const renderSelectorContent = () => {
+        if (isMultiple) {
+            const arr = Array.isArray(selectVal) ? selectVal : [];
+            const displayTags = maxTagCount !== undefined && arr.length > maxTagCount
+                ? arr.slice(0, maxTagCount)
+                : arr;
+            const remaining = maxTagCount !== undefined && arr.length > maxTagCount
+                ? arr.length - maxTagCount
+                : 0;
+            return (_jsxs(_Fragment, { children: [displayTags.map((val) => (_jsxs("span", { className: `${prefixCls}__tag`, children: [_jsx("span", { className: `${prefixCls}__tag-content`, children: getLabelForValue(val) }), _jsx("span", { className: `${prefixCls}__tag-close`, onClick: (e) => handleRemoveTag(val, e), "aria-label": "Remove", children: _jsx(Close, { size: 10 }) })] }, val))), remaining > 0 && (_jsxs("span", { className: `${prefixCls}__tag ${prefixCls}__tag_max`, children: ["+", remaining, "..."] })), showSearch && (_jsx("input", { ref: searchInputRef, className: `${prefixCls}__search`, value: searchValue, onChange: handleSearchChange, placeholder: arr.length === 0 ? placeholder : undefined, autoComplete: "off", disabled: disabled })), arr.length === 0 && !searchValue && !showSearch && (_jsx("span", { className: `${prefixCls}__placeholder`, children: placeholder }))] }));
+        }
+        // Single mode
+        if (showSearch && combo.isOpen) {
+            return (_jsx("input", { ref: searchInputRef, className: `${prefixCls}__search`, value: searchValue, onChange: handleSearchChange, placeholder: hasValue ? undefined : placeholder, autoComplete: "off", disabled: disabled }));
+        }
+        if (hasValue) {
+            return (_jsx("span", { className: `${prefixCls}__selection-text`, children: getLabelForValue(Array.isArray(selectVal) ? selectVal[0] : selectVal) }));
+        }
+        return _jsx("span", { className: `${prefixCls}__placeholder`, children: placeholder });
+    };
+    return (_jsx("div", { ...otherProps, ref: ref, className: cls, role: "combobox", "aria-expanded": combo.isOpen, "aria-haspopup": "listbox", "aria-owns": combo.isOpen ? listboxId : undefined, onKeyDown: handleKeyDown, tabIndex: disabled ? undefined : 0, children: _jsx(Popup, { trigger: "manual", placement: "bottom", arrow: false, visible: combo.isOpen, content: renderOverlay(), children: _jsxs("div", { className: `${prefixCls}__selector`, onClick: handleSelectorClick, children: [_jsx("div", { className: `${prefixCls}__selection`, children: renderSelectorContent() }), _jsxs("div", { className: `${prefixCls}__suffix`, children: [_jsx("span", { className: arrowCls, children: _jsx(ArrowDown, { size: 10 }) }), allowClear && hasValue && !disabled && (_jsx("button", { type: "button", className: `${prefixCls}__clear`, onClick: handleClear, "aria-label": "Clear", children: _jsx(CloseCircle, { size: 14, color: "currentColor" }) }))] })] }) }) }));
+};
+Select.displayName = 'Select';
+export default Select;
+//# sourceMappingURL=select.js.map

package/es/select/select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"select.js","sourceRoot":"","sources":["../../components/select/select.tsx"],"names":[],"mappings":"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"}

package/es/select/style/_index.scss

@@ -0,0 +1,313 @@
+@use "../../style/variables" as *;
+
+.#{$prefix}-select {
+  position: relative;
+  display: inline-block;
+  width: 100%;
+  font-size: $font-size-base;
+  cursor: pointer;
+  outline: none;
+
+  &_disabled {
+    cursor: not-allowed;
+    opacity: 0.6;
+
+    .#{$prefix}-select__selector {
+      background-color: var(--ty-color-bg-disabled);
+      cursor: not-allowed;
+    }
+  }
+
+  // Sizes
+  &_sm .#{$prefix}-select__selector {
+    min-height: $height-sm;
+    font-size: $font-size-sm;
+    padding: 0 24px 0 8px;
+  }
+
+  &_md .#{$prefix}-select__selector {
+    min-height: $height-md;
+    font-size: $font-size-base;
+    padding: 0 28px 0 10px;
+  }
+
+  &_lg .#{$prefix}-select__selector {
+    min-height: $height-lg;
+    font-size: $font-size-lg;
+    padding: 0 32px 0 12px;
+  }
+
+  // Multiple mode
+  &_multiple {
+    .#{$prefix}-select__selector {
+      padding-right: 28px;
+    }
+
+    .#{$prefix}-select__selection {
+      flex-wrap: wrap;
+      gap: 4px;
+      padding: 2px 0;
+    }
+  }
+
+  // Open state
+  &_open .#{$prefix}-select__selector {
+    border-color: var(--ty-input-focus-border);
+    box-shadow: var(--ty-input-focus-shadow);
+  }
+
+  // Selector
+  &__selector {
+    display: flex;
+    align-items: center;
+    width: 100%;
+    border: $border-width solid var(--ty-input-border);
+    border-radius: $border-radius;
+    background-color: var(--ty-input-bg);
+    box-sizing: border-box;
+    transition: all 0.3s;
+
+    &:hover {
+      border-color: var(--ty-input-focus-border);
+    }
+  }
+
+  // Selection area
+  &__selection {
+    flex: 1;
+    display: flex;
+    align-items: center;
+    overflow: hidden;
+    min-width: 0;
+  }
+
+  &__selection-text {
+    display: inline-block;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    color: var(--ty-color-text);
+  }
+
+  &__placeholder {
+    color: var(--ty-color-text-placeholder);
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    pointer-events: none;
+  }
+
+  // Search input
+  &__search {
+    flex: 1;
+    min-width: 4px;
+    max-width: 100%;
+    margin: 0;
+    padding: 0;
+    border: none;
+    outline: none;
+    background: transparent;
+    font-size: inherit;
+    font-family: inherit;
+    color: var(--ty-color-text);
+    appearance: none;
+
+    &::placeholder {
+      color: var(--ty-color-text-placeholder);
+    }
+  }
+
+  // Suffix (arrow + clear)
+  &__suffix {
+    position: absolute;
+    right: 8px;
+    top: 50%;
+    transform: translateY(-50%);
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: 14px;
+    height: 14px;
+    color: var(--ty-color-text-quaternary);
+  }
+
+  // Arrow
+  &__arrow {
+    display: inline-flex;
+    align-items: center;
+    transition: transform 300ms;
+
+    &_reverse {
+      transform: rotate(180deg);
+    }
+  }
+
+  // Clear button — overlays arrow on hover (same pattern as TimePicker/DatePicker)
+  &__clear {
+    display: none;
+    position: absolute;
+    inset: 0;
+    align-items: center;
+    justify-content: center;
+    font-size: 14px;
+    color: var(--ty-color-text-quaternary);
+    background: var(--ty-input-bg);
+    cursor: pointer;
+    transition: color 0.2s;
+    border: none;
+    padding: 0;
+
+    &:hover {
+      color: var(--ty-color-text-tertiary);
+    }
+  }
+
+  &_has-value:hover &__clear {
+    display: inline-flex;
+  }
+
+  // Tag pill (multi-select)
+  &__tag {
+    display: inline-flex;
+    align-items: center;
+    max-width: 100%;
+    height: 22px;
+    padding: 0 4px 0 8px;
+    border-radius: $border-radius;
+    background-color: var(--ty-color-fill-secondary);
+    font-size: $font-size-sm;
+    line-height: 20px;
+    color: var(--ty-color-text);
+    box-sizing: border-box;
+
+    &_max {
+      padding: 0 8px;
+    }
+  }
+
+  &__tag-content {
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  &__tag-close {
+    display: inline-flex;
+    align-items: center;
+    margin-left: 4px;
+    cursor: pointer;
+    color: var(--ty-color-text-quaternary);
+    transition: color 0.2s;
+
+    &:hover {
+      color: var(--ty-color-text);
+    }
+  }
+
+  // Dropdown
+  &__dropdown {
+    width: 100%;
+    margin: 0;
+    padding: 4px 0;
+    list-style-type: none;
+    background-color: var(--ty-select-dropdown-bg);
+    box-sizing: border-box;
+    overflow-x: hidden;
+    overflow-y: auto;
+    z-index: 10;
+    box-shadow: var(--ty-shadow-popup);
+    border-radius: $border-radius;
+    font-size: $font-size-base;
+    max-height: $select-dropdown-max-height;
+  }
+
+  // Loading state
+  &__loading {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    padding: 16px;
+
+    svg {
+      animation: ty-select-spin 1s linear infinite;
+    }
+  }
+
+  // Empty state
+  &__empty {
+    padding: 16px;
+    text-align: center;
+    color: var(--ty-color-text-quaternary);
+    font-size: $font-size-sm;
+  }
+}
+
+// Option (used both by Option component and options-prop rendering)
+.#{$prefix}-select-option {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: 7px 12px;
+  font-size: 14px;
+  line-height: 22px;
+  cursor: pointer;
+  color: var(--ty-color-text);
+  transition: background-color 0.2s;
+
+  &__content {
+    flex: 1;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+
+  &__check {
+    flex-shrink: 0;
+    margin-left: 8px;
+    color: var(--ty-color-primary);
+  }
+
+  &_active {
+    background-color: var(--ty-select-option-active-bg);
+  }
+
+  &_selected {
+    background-color: var(--ty-select-option-selected-bg);
+    font-weight: $select-selected-font-weight;
+  }
+
+  &_disabled {
+    cursor: not-allowed;
+    background-color: var(--ty-select-option-disabled-bg);
+    opacity: 0.5;
+  }
+}
+
+.#{$prefix}-select-group {
+
+  &__title {
+    font-size: $font-size-sm;
+    cursor: default;
+    color: $gray-600;
+    padding: 7px 12px;
+  }
+
+  &__list {
+    list-style-type: none;
+    margin: 0;
+    padding: 0;
+
+    > .#{$prefix}-select-option {
+      padding-left: 24px;
+    }
+  }
+}
+
+@keyframes ty-select-spin {
+  from {
+    transform: rotate(0deg);
+  }
+  to {
+    transform: rotate(360deg);
+  }
+}

package/es/select/style/css.js

@@ -0,0 +1,4 @@
+import './index.css';
+import '../../input/style/index.css';
+import '../../popup/style/index.css';
+//# sourceMappingURL=index.js.map

package/es/select/style/index.d.ts

@@ -0,0 +1,3 @@
+import './index.scss';
+import '../../input/style/index.scss';
+import '../../popup/style/index.scss';

package/es/select/style/index.js

@@ -0,0 +1,4 @@
+import './index.scss';
+import '../../input/style/index.scss';
+import '../../popup/style/index.scss';
+//# sourceMappingURL=index.js.map

package/es/select/style/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../components/select/style/index.tsx"],"names":[],"mappings":"AAAA,OAAO,cAAc,CAAC;AAEtB,OAAO,8BAA8B,CAAC;AACtC,OAAO,8BAA8B,CAAC"}