@ioca/react 1.4.79 → 1.4.81

package/lib/cjs/components/select/options.js

@@ -0,0 +1,55 @@
+'use strict';
+
+var jsxRuntime = require('react/jsx-runtime');
+var material = require('@ricons/material');
+var classNames = require('classnames');
+var icon = require('../icon/icon.js');
+var list = require('../list/list.js');
+var tag = require('../tag/tag.js');
+var index = require('../utils/empty/index.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e.default : e; }
+
+var classNames__default = /*#__PURE__*/_interopDefaultCompat(classNames);
+
+const Options = (props) => {
+    const { value: val, options, filter, filterPlaceholder, multiple, empty = jsxRuntime.jsx(index.default, {}), onSelect, onFilter, } = props;
+    return (jsxRuntime.jsxs("div", { className: classNames__default("i-select-options", {
+            "i-select-options-multiple": multiple,
+        }), children: [filter && multiple && (jsxRuntime.jsxs("div", { className: 'i-select-filter', children: [jsxRuntime.jsx(icon.default, { icon: jsxRuntime.jsx(material.SearchRound, {}), className: 'color-8 ml-8 my-auto', size: '1.2em' }), jsxRuntime.jsx("input", { type: 'text', className: 'i-input', placeholder: filterPlaceholder, onChange: onFilter })] })), options.length === 0 && empty, options.map((option, i) => {
+                const { label, value, disabled } = option;
+                const isActive = multiple
+                    ? val?.includes(value)
+                    : val === value;
+                return (jsxRuntime.jsxs(list.default.Item, { active: isActive, type: 'option', onClick: () => onSelect?.(value, option), disabled: disabled, children: [multiple && (jsxRuntime.jsx(icon.default, { icon: jsxRuntime.jsx(material.CheckRound, {}), className: 'i-select-option-check', size: '1em' })), label] }, value || i));
+            })] }));
+};
+const activeOptions = (options = [], value = [], max = 3) => {
+    const total = options.flatMap((opt) => value.includes(opt.value) ? [opt] : []);
+    if (max >= total.length)
+        return total;
+    const rest = total.length - max;
+    const after = total.slice(0, max);
+    after.push(rest);
+    return after;
+};
+const displayValue = (config) => {
+    const { options, value, maxDisplay, multiple, onSelect } = config;
+    if (multiple) {
+        return activeOptions(options, value, maxDisplay).map((opt, i) => {
+            if (typeof opt === "number")
+                return jsxRuntime.jsxs(tag.default, { children: ["+", opt] }, i);
+            const { label, value } = opt;
+            return (jsxRuntime.jsx(tag.default, { hoverShowClose: true, onClose: (e) => {
+                    e?.stopPropagation();
+                    onSelect?.(value, opt);
+                }, children: label }, value));
+        });
+    }
+    return options.find((opt) => opt.value === value)?.label;
+};
+
+exports.Options = Options;
+exports.activeOptions = activeOptions;
+exports.displayValue = displayValue;
+//# sourceMappingURL=options.js.map

package/lib/cjs/components/select/options.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"options.js","sources":["../../../../packages/components/select/options.tsx"],"sourcesContent":["import { CheckRound, SearchRound } from \"@ricons/material\";\nimport classNames from \"classnames\";\nimport { TOption } from \"../../type\";\nimport Icon from \"../icon\";\nimport List from \"../list\";\nimport Tag from \"../tag\";\nimport Empty from \"../utils/empty\";\nimport { ISelectOptions } from \"./type\";\nexport const Options = (props: ISelectOptions) => {\n\tconst {\n\t\tvalue: val,\n\t\toptions,\n\t\tfilter,\n\t\tfilterPlaceholder,\n\t\tmultiple,\n\t\tempty = <Empty />,\n\t\tonSelect,\n\t\tonFilter,\n\t} = props;\n\n\treturn (\n\t\t<div\n\t\t\tclassName={classNames(\"i-select-options\", {\n\t\t\t\t\"i-select-options-multiple\": multiple,\n\t\t\t})}\n\t\t>\n\t\t\t{filter && multiple && (\n\t\t\t\t<div className='i-select-filter'>\n\t\t\t\t\t<Icon\n\t\t\t\t\t\ticon={<SearchRound />}\n\t\t\t\t\t\tclassName='color-8 ml-8 my-auto'\n\t\t\t\t\t\tsize='1.2em'\n\t\t\t\t\t/>\n\t\t\t\t\t<input\n\t\t\t\t\t\ttype='text'\n\t\t\t\t\t\tclassName='i-input'\n\t\t\t\t\t\tplaceholder={filterPlaceholder}\n\t\t\t\t\t\tonChange={onFilter}\n\t\t\t\t\t/>\n\t\t\t\t</div>\n\t\t\t)}\n\n\t\t\t{options.length === 0 && empty}\n\n\t\t\t{options.map((option, i) => {\n\t\t\t\tconst { label, value, disabled } = option;\n\t\t\t\tconst isActive = multiple\n\t\t\t\t\t? val?.includes(value)\n\t\t\t\t\t: val === value;\n\n\t\t\t\treturn (\n\t\t\t\t\t<List.Item\n\t\t\t\t\t\tkey={(value as string) || i}\n\t\t\t\t\t\tactive={isActive}\n\t\t\t\t\t\ttype='option'\n\t\t\t\t\t\tonClick={() => onSelect?.(value, option)}\n\t\t\t\t\t\tdisabled={disabled}\n\t\t\t\t\t>\n\t\t\t\t\t\t{multiple && (\n\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\ticon={<CheckRound />}\n\t\t\t\t\t\t\t\tclassName='i-select-option-check'\n\t\t\t\t\t\t\t\tsize='1em'\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)}\n\t\t\t\t\t\t{label}\n\t\t\t\t\t</List.Item>\n\t\t\t\t);\n\t\t\t})}\n\t\t</div>\n\t);\n};\n\nexport const activeOptions = (\n\toptions: TOption[] = [],\n\tvalue: any[] = [],\n\tmax = 3\n) => {\n\tconst total = options.flatMap((opt) =>\n\t\tvalue.includes(opt.value) ? [opt] : []\n\t);\n\n\tif (max >= total.length) return total;\n\n\tconst rest = total.length - max;\n\tconst after = total.slice(0, max);\n\tafter.push(rest as any);\n\n\treturn after;\n};\n\nexport const displayValue = (config) => {\n\tconst { options, value, maxDisplay, multiple, onSelect } = config;\n\n\tif (multiple) {\n\t\treturn activeOptions(options, value, maxDisplay).map((opt, i) => {\n\t\t\tif (typeof opt === \"number\") return <Tag key={i}>+{opt}</Tag>;\n\n\t\t\tconst { label, value } = opt;\n\n\t\t\treturn (\n\t\t\t\t<Tag\n\t\t\t\t\tkey={value as string}\n\t\t\t\t\thoverShowClose\n\t\t\t\t\tonClose={(e) => {\n\t\t\t\t\t\te?.stopPropagation();\n\t\t\t\t\t\tonSelect?.(value, opt);\n\t\t\t\t\t}}\n\t\t\t\t>\n\t\t\t\t\t{label}\n\t\t\t\t</Tag>\n\t\t\t);\n\t\t});\n\t}\n\n\treturn options.find((opt: TOption) => opt.value === value)?.label;\n};\n"],"names":["_jsx","Empty","_jsxs","classNames","Icon","SearchRound","List","CheckRound","Tag"],"mappings":";;;;;;;;;;;;;;AAQO,MAAM,OAAO,GAAG,CAAC,KAAqB,KAAI;IAChD,MAAM,EACL,KAAK,EAAE,GAAG,EACV,OAAO,EACP,MAAM,EACN,iBAAiB,EACjB,QAAQ,EACR,KAAK,GAAGA,cAAA,CAACC,aAAK,EAAA,EAAA,CAAG,EACjB,QAAQ,EACR,QAAQ,GACR,GAAG,KAAK;AAET,IAAA,QACCC,eAAA,CAAA,KAAA,EAAA,EACC,SAAS,EAAEC,mBAAU,CAAC,kBAAkB,EAAE;AACzC,YAAA,2BAA2B,EAAE,QAAQ;AACrC,SAAA,CAAC,EAAA,QAAA,EAAA,CAED,MAAM,IAAI,QAAQ,KAClBD,eAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,iBAAiB,EAAA,QAAA,EAAA,CAC/BF,cAAA,CAACI,YAAI,EAAA,EACJ,IAAI,EAAEJ,cAAA,CAACK,oBAAW,EAAA,EAAA,CAAG,EACrB,SAAS,EAAC,sBAAsB,EAChC,IAAI,EAAC,OAAO,EAAA,CACX,EACFL,cAAA,CAAA,OAAA,EAAA,EACC,IAAI,EAAC,MAAM,EACX,SAAS,EAAC,SAAS,EACnB,WAAW,EAAE,iBAAiB,EAC9B,QAAQ,EAAE,QAAQ,EAAA,CACjB,CAAA,EAAA,CACG,CACN,EAEA,OAAO,CAAC,MAAM,KAAK,CAAC,IAAI,KAAK,EAE7B,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,CAAC,KAAI;gBAC1B,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,MAAM;gBACzC,MAAM,QAAQ,GAAG;AAChB,sBAAE,GAAG,EAAE,QAAQ,CAAC,KAAK;AACrB,sBAAE,GAAG,KAAK,KAAK;AAEhB,gBAAA,QACCE,eAAA,CAACI,YAAI,CAAC,IAAI,EAAA,EAET,MAAM,EAAE,QAAQ,EAChB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,MAAM,QAAQ,GAAG,KAAK,EAAE,MAAM,CAAC,EACxC,QAAQ,EAAE,QAAQ,EAAA,QAAA,EAAA,CAEjB,QAAQ,KACRN,cAAA,CAACI,YAAI,EAAA,EACJ,IAAI,EAAEJ,cAAA,CAACO,mBAAU,EAAA,EAAA,CAAG,EACpB,SAAS,EAAC,uBAAuB,EACjC,IAAI,EAAC,KAAK,EAAA,CACT,CACF,EACA,KAAK,CAAA,EAAA,EAbA,KAAgB,IAAI,CAAC,CAchB;YAEd,CAAC,CAAC,CAAA,EAAA,CACG;AAER;AAEO,MAAM,aAAa,GAAG,CAC5B,OAAA,GAAqB,EAAE,EACvB,KAAA,GAAe,EAAE,EACjB,GAAG,GAAG,CAAC,KACJ;AACH,IAAA,MAAM,KAAK,GAAG,OAAO,CAAC,OAAO,CAAC,CAAC,GAAG,KACjC,KAAK,CAAC,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,EAAE,CACtC;AAED,IAAA,IAAI,GAAG,IAAI,KAAK,CAAC,MAAM;AAAE,QAAA,OAAO,KAAK;AAErC,IAAA,MAAM,IAAI,GAAG,KAAK,CAAC,MAAM,GAAG,GAAG;IAC/B,MAAM,KAAK,GAAG,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,GAAG,CAAC;AACjC,IAAA,KAAK,CAAC,IAAI,CAAC,IAAW,CAAC;AAEvB,IAAA,OAAO,KAAK;AACb;AAEO,MAAM,YAAY,GAAG,CAAC,MAAM,KAAI;AACtC,IAAA,MAAM,EAAE,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,QAAQ,EAAE,GAAG,MAAM;IAEjE,IAAI,QAAQ,EAAE;AACb,QAAA,OAAO,aAAa,CAAC,OAAO,EAAE,KAAK,EAAE,UAAU,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,KAAI;YAC/D,IAAI,OAAO,GAAG,KAAK,QAAQ;AAAE,gBAAA,OAAOL,gBAACM,WAAG,EAAA,EAAA,QAAA,EAAA,CAAA,GAAA,EAAW,GAAG,CAAA,EAAA,EAAR,CAAC,CAAc;AAE7D,YAAA,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,GAAG,GAAG;YAE5B,QACCR,cAAA,CAACQ,WAAG,EAAA,EAEH,cAAc,EAAA,IAAA,EACd,OAAO,EAAE,CAAC,CAAC,KAAI;oBACd,CAAC,EAAE,eAAe,EAAE;AACpB,oBAAA,QAAQ,GAAG,KAAK,EAAE,GAAG,CAAC;AACvB,gBAAA,CAAC,YAEA,KAAK,EAAA,EAPD,KAAe,CAQf;AAER,QAAA,CAAC,CAAC;IACH;AAEA,IAAA,OAAO,OAAO,CAAC,IAAI,CAAC,CAAC,GAAY,KAAK,GAAG,CAAC,KAAK,KAAK,KAAK,CAAC,EAAE,KAAK;AAClE;;;;;;"}

package/lib/cjs/components/select/select.js

@@ -0,0 +1,103 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var material = require('@ricons/material');
+var classNames = require('classnames');
+var radash = require('radash');
+var react = require('react');
+var utils = require('../../js/utils.js');
+var popup = require('../popup/popup.js');
+var helpericon = require('../utils/helpericon/helpericon.js');
+var options = require('./options.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e.default : e; }
+
+var classNames__default = /*#__PURE__*/_interopDefaultCompat(classNames);
+
+const Select = (props) => {
+    const { ref, type = "text", name, label, value = "", placeholder, options: options$1 = [], multiple, prepend, append, labelInline, style, className, message, status = "normal", hideClear, hideArrow, maxDisplay, border, filter, tip, filterPlaceholder = "...", popupProps, onSelect, onChange, ...restProps } = props;
+    const [filterValue, setFilterValue] = react.useState("");
+    const [selectedValue, setSelectedValue] = react.useState(value);
+    const [active, setActive] = react.useState(false);
+    const formattedOptions = react.useMemo(() => utils.formatOption(options$1), [options$1]);
+    const filterOptions = react.useMemo(() => {
+        const fv = filterValue;
+        if (!fv || !filter)
+            return formattedOptions;
+        const filterFn = typeof filter === "function"
+            ? filter
+            : (opt) => opt.value.includes(fv) || opt.label.includes(fv);
+        return formattedOptions.filter(filterFn);
+    }, [formattedOptions, filter, filterValue]);
+    const changeValue = (v) => {
+        setSelectedValue(v);
+        onChange?.(v);
+    };
+    const displayLabel = react.useMemo(() => {
+        if (multiple) {
+            return "";
+        }
+        const option = formattedOptions.find((opt) => opt.value === selectedValue);
+        return option ? option.label : selectedValue;
+    }, [selectedValue, formattedOptions]);
+    const handleSelect = (value, option) => {
+        onSelect?.(value, option);
+        if (multiple) {
+            const values = [...selectedValue];
+            const i = values.findIndex((v) => v === value);
+            i > -1 ? values.splice(i, 1) : values.push(value);
+            changeValue(values);
+            return;
+        }
+        setActive(false);
+        changeValue(value);
+    };
+    const handleVisibleChange = (visible) => {
+        setActive(visible);
+        if (!filter)
+            return;
+        setFilterValue("");
+    };
+    const handleHelperClick = (e) => {
+        e.stopPropagation();
+        setActive(true);
+        if (!active)
+            return;
+        changeValue(multiple ? [] : "");
+    };
+    const handleFilterChange = radash.debounce({ delay: 400 }, (e) => {
+        const v = e.target.value;
+        setFilterValue(v);
+    });
+    const handleInputChange = (e) => {
+        setFilterValue(e.target.value);
+    };
+    react.useEffect(() => {
+        setSelectedValue(value);
+    }, [value]);
+    const hasValue = multiple
+        ? selectedValue.length > 0
+        : !!selectedValue;
+    const clearable = !hideClear && active && hasValue;
+    const text = message ?? tip;
+    return (jsxRuntime.jsxs("label", { className: classNames__default("i-input-label", className, {
+            "i-input-inline": labelInline,
+        }), style: style, children: [label && jsxRuntime.jsx("span", { className: 'i-input-label-text', children: label }), jsxRuntime.jsx(popup.default, { position: 'bottom', arrow: false, fitSize: true, offset: 0, ...popupProps, visible: active, trigger: 'none', onVisibleChange: handleVisibleChange, content: jsxRuntime.jsx(options.Options, { options: filterOptions, value: selectedValue, multiple: multiple, filter: !!filter, filterPlaceholder: filterPlaceholder, onSelect: handleSelect, onFilter: handleFilterChange }), children: jsxRuntime.jsxs("div", { className: classNames__default("i-input-item", {
+                        [`i-input-${status}`]: status !== "normal",
+                        "i-input-borderless": !border,
+                        "i-input-focus": active,
+                    }), onClick: () => setActive(true), children: [prepend, jsxRuntime.jsx("input", { ref: ref, type: 'hidden', value: selectedValue, ...restProps }), multiple ? (hasValue ? (jsxRuntime.jsx("div", { className: classNames__default("i-input i-select", {
+                                "i-select-multiple": multiple,
+                            }), children: options.displayValue({
+                                options: formattedOptions,
+                                value: selectedValue,
+                                multiple,
+                                maxDisplay,
+                                onSelect: handleSelect,
+                            }) })) : (jsxRuntime.jsx("input", { className: 'i-input i-select', placeholder: placeholder, readOnly: true }))) : null, !multiple && (jsxRuntime.jsx("input", { value: active ? filterValue : displayLabel, className: 'i-input i-select', placeholder: displayLabel || placeholder, onChange: handleInputChange, readOnly: !filter })), jsxRuntime.jsx(helpericon.default, { active: !hideArrow, icon: clearable ? undefined : jsxRuntime.jsx(material.UnfoldMoreRound, {}), onClick: handleHelperClick }), append] }) }), text && jsxRuntime.jsx("span", { className: 'i-input-message', children: text })] }));
+};
+
+exports.default = Select;
+//# sourceMappingURL=select.js.map

package/lib/cjs/components/select/select.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"select.js","sources":["../../../../packages/components/select/select.tsx"],"sourcesContent":["import { UnfoldMoreRound } from \"@ricons/material\";\nimport classNames from \"classnames\";\nimport { debounce } from \"radash\";\nimport { ChangeEvent, useEffect, useMemo, useState } from \"react\";\nimport \"../../css/input.css\";\nimport { formatOption } from \"../../js/utils\";\nimport { TOption } from \"../../type\";\nimport Popup from \"../popup\";\nimport Helpericon from \"../utils/helpericon\";\nimport \"./index.css\";\nimport { Options, displayValue } from \"./options\";\nimport { ISelect } from \"./type\";\n\nconst Select = (props: ISelect) => {\n\tconst {\n\t\tref,\n\t\ttype = \"text\",\n\t\tname,\n\t\tlabel,\n\t\tvalue = \"\",\n\t\tplaceholder,\n\t\toptions = [],\n\t\tmultiple,\n\t\tprepend,\n\t\tappend,\n\t\tlabelInline,\n\t\tstyle,\n\t\tclassName,\n\t\tmessage,\n\t\tstatus = \"normal\",\n\t\thideClear,\n\t\thideArrow,\n\t\tmaxDisplay,\n\t\tborder,\n\t\tfilter,\n\t\ttip,\n\t\tfilterPlaceholder = \"...\",\n\t\tpopupProps,\n\t\tonSelect,\n\t\tonChange,\n\t\t...restProps\n\t} = props;\n\n\tconst [filterValue, setFilterValue] = useState(\"\");\n\tconst [selectedValue, setSelectedValue] = useState(value);\n\n\tconst [active, setActive] = useState<boolean>(false);\n\n\tconst formattedOptions = useMemo(() => formatOption(options), [options]);\n\n\tconst filterOptions = useMemo(() => {\n\t\tconst fv = filterValue;\n\t\tif (!fv || !filter) return formattedOptions;\n\n\t\tconst filterFn =\n\t\t\ttypeof filter === \"function\"\n\t\t\t\t? filter\n\t\t\t\t: (opt) => opt.value.includes(fv) || opt.label.includes(fv);\n\n\t\treturn formattedOptions.filter(filterFn);\n\t}, [formattedOptions, filter, filterValue]);\n\n\tconst changeValue = (v: any) => {\n\t\tsetSelectedValue(v);\n\t\tonChange?.(v);\n\t};\n\n\tconst displayLabel = useMemo(() => {\n\t\tif (multiple) {\n\t\t\treturn \"\";\n\t\t}\n\n\t\tconst option = formattedOptions.find(\n\t\t\t(opt) => opt.value === selectedValue\n\t\t);\n\t\treturn option ? option.label : selectedValue;\n\t}, [selectedValue, formattedOptions]);\n\n\tconst handleSelect = (value: any, option?: TOption) => {\n\t\tonSelect?.(value, option);\n\n\t\tif (multiple) {\n\t\t\tconst values = [...(selectedValue as any[])];\n\t\t\tconst i = values.findIndex((v) => v === value);\n\n\t\t\ti > -1 ? values.splice(i, 1) : values.push(value);\n\t\t\tchangeValue(values as any);\n\n\t\t\treturn;\n\t\t}\n\n\t\tsetActive(false);\n\t\tchangeValue(value);\n\t};\n\n\tconst handleVisibleChange = (visible: boolean) => {\n\t\tsetActive(visible);\n\n\t\tif (!filter) return;\n\n\t\tsetFilterValue(\"\");\n\t};\n\n\tconst handleHelperClick = (e) => {\n\t\te.stopPropagation();\n\t\tsetActive(true);\n\t\tif (!active) return;\n\n\t\tchangeValue(multiple ? [] : \"\");\n\t};\n\n\tconst handleFilterChange = debounce(\n\t\t{ delay: 400 },\n\t\t(e: ChangeEvent<HTMLInputElement>) => {\n\t\t\tconst v = e.target.value;\n\t\t\tsetFilterValue(v);\n\t\t}\n\t);\n\n\tconst handleInputChange = (e: ChangeEvent<HTMLInputElement>) => {\n\t\tsetFilterValue(e.target.value);\n\t};\n\n\tuseEffect(() => {\n\t\tsetSelectedValue(value);\n\t}, [value]);\n\n\tconst hasValue = multiple\n\t\t? (selectedValue as any[]).length > 0\n\t\t: !!selectedValue;\n\tconst clearable = !hideClear && active && hasValue;\n\tconst text = message ?? tip;\n\n\treturn (\n\t\t<label\n\t\t\tclassName={classNames(\"i-input-label\", className, {\n\t\t\t\t\"i-input-inline\": labelInline,\n\t\t\t})}\n\t\t\tstyle={style}\n\t\t>\n\t\t\t{label && <span className='i-input-label-text'>{label}</span>}\n\n\t\t\t<Popup\n\t\t\t\tposition='bottom'\n\t\t\t\tarrow={false}\n\t\t\t\tfitSize\n\t\t\t\toffset={0}\n\t\t\t\t{...popupProps}\n\t\t\t\tvisible={active}\n\t\t\t\ttrigger='none'\n\t\t\t\tonVisibleChange={handleVisibleChange}\n\t\t\t\tcontent={\n\t\t\t\t\t<Options\n\t\t\t\t\t\toptions={filterOptions}\n\t\t\t\t\t\tvalue={selectedValue}\n\t\t\t\t\t\tmultiple={multiple}\n\t\t\t\t\t\tfilter={!!filter}\n\t\t\t\t\t\tfilterPlaceholder={filterPlaceholder}\n\t\t\t\t\t\tonSelect={handleSelect}\n\t\t\t\t\t\tonFilter={handleFilterChange}\n\t\t\t\t\t/>\n\t\t\t\t}\n\t\t\t>\n\t\t\t\t<div\n\t\t\t\t\tclassName={classNames(\"i-input-item\", {\n\t\t\t\t\t\t[`i-input-${status}`]: status !== \"normal\",\n\t\t\t\t\t\t\"i-input-borderless\": !border,\n\t\t\t\t\t\t\"i-input-focus\": active,\n\t\t\t\t\t})}\n\t\t\t\t\tonClick={() => setActive(true)}\n\t\t\t\t>\n\t\t\t\t\t{prepend}\n\n\t\t\t\t\t<input\n\t\t\t\t\t\tref={ref}\n\t\t\t\t\t\ttype='hidden'\n\t\t\t\t\t\tvalue={selectedValue}\n\t\t\t\t\t\t{...restProps}\n\t\t\t\t\t/>\n\n\t\t\t\t\t{multiple ? (\n\t\t\t\t\t\thasValue ? (\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclassName={classNames(\"i-input i-select\", {\n\t\t\t\t\t\t\t\t\t\"i-select-multiple\": multiple,\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t{displayValue({\n\t\t\t\t\t\t\t\t\toptions: formattedOptions,\n\t\t\t\t\t\t\t\t\tvalue: selectedValue,\n\t\t\t\t\t\t\t\t\tmultiple,\n\t\t\t\t\t\t\t\t\tmaxDisplay,\n\t\t\t\t\t\t\t\t\tonSelect: handleSelect,\n\t\t\t\t\t\t\t\t})}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<input\n\t\t\t\t\t\t\t\tclassName='i-input i-select'\n\t\t\t\t\t\t\t\tplaceholder={placeholder}\n\t\t\t\t\t\t\t\treadOnly\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t)\n\t\t\t\t\t) : null}\n\n\t\t\t\t\t{!multiple && (\n\t\t\t\t\t\t<input\n\t\t\t\t\t\t\tvalue={active ? filterValue : displayLabel}\n\t\t\t\t\t\t\tclassName='i-input i-select'\n\t\t\t\t\t\t\tplaceholder={displayLabel || placeholder}\n\t\t\t\t\t\t\tonChange={handleInputChange}\n\t\t\t\t\t\t\treadOnly={!filter}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\n\t\t\t\t\t<Helpericon\n\t\t\t\t\t\tactive={!hideArrow}\n\t\t\t\t\t\ticon={clearable ? undefined : <UnfoldMoreRound />}\n\t\t\t\t\t\tonClick={handleHelperClick}\n\t\t\t\t\t/>\n\n\t\t\t\t\t{append}\n\t\t\t\t</div>\n\t\t\t</Popup>\n\n\t\t\t{text && <span className='i-input-message'>{text}</span>}\n\t\t</label>\n\t);\n};\n\nexport default Select;\n"],"names":["options","useState","useMemo","formatOption","debounce","useEffect","_jsxs","classNames","_jsx","Popup","Options","displayValue","Helpericon","UnfoldMoreRound"],"mappings":"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"}

package/lib/cjs/components/step/divider.js

@@ -0,0 +1,12 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+
+function Divider() {
+    return jsxRuntime.jsx("i", { className: 'i-step-divider' });
+}
+
+exports.default = Divider;
+//# sourceMappingURL=divider.js.map

package/lib/cjs/components/step/divider.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"divider.js","sources":["../../../../packages/components/step/divider.tsx"],"sourcesContent":["import \"./index.css\";\n\nexport default function Divider() {\n\treturn <i className='i-step-divider' />;\n}\n"],"names":["_jsx"],"mappings":";;;;;;AAEc,SAAU,OAAO,GAAA;AAC9B,IAAA,OAAOA,cAAA,CAAA,GAAA,EAAA,EAAG,SAAS,EAAC,gBAAgB,GAAG;AACxC;;;;"}

package/lib/cjs/components/step/index.js

@@ -0,0 +1,10 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var step = require('./step.js');
+
+
+
+exports.default = step.default;
+//# sourceMappingURL=index.js.map

package/lib/cjs/components/step/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/lib/cjs/components/step/item.js

@@ -0,0 +1,30 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var material = require('@ricons/material');
+var classNames = require('classnames');
+var divider = require('./divider.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e.default : e; }
+
+var classNames__default = /*#__PURE__*/_interopDefaultCompat(classNames);
+
+const STATUS = ["finished", "active", "pending"];
+function defaultRenderIcon(i, status) {
+    return (jsxRuntime.jsx("span", { className: 'i-step-item-index', children: status === "finished" ? (jsxRuntime.jsx(material.CheckRound, { style: { width: "1em", height: "1.5em" } })) : (i + 1) }));
+}
+function Item(props) {
+    const { index = 0, active = 0, renderIcon = defaultRenderIcon, title, vertical, line = jsxRuntime.jsx(divider.default, {}), asList, style, className, children, onClick, } = props;
+    const status = STATUS[index === active ? 1 : index < active ? 0 : 2];
+    const handleClick = () => {
+        onClick?.(index);
+    };
+    return (jsxRuntime.jsx("div", { style: style, className: classNames__default("i-step-item", {
+            [`i-step-item-${status}`]: !asList,
+        }, className), onClick: handleClick, children: vertical ? (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: 'i-step-item-left', children: [renderIcon?.(index, status), line] }), jsxRuntime.jsxs("div", { className: 'i-step-item-right', children: [jsxRuntime.jsx("div", { className: 'i-step-item-title', children: title }), children && (jsxRuntime.jsx("div", { className: 'i-step-item-content', children: children }))] })] })) : (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: 'i-step-item-title', children: [renderIcon?.(index, status), jsxRuntime.jsx("span", { children: title }), line] }), children && (jsxRuntime.jsx("div", { className: 'i-step-item-content', children: children }))] })) }));
+}
+
+exports.default = Item;
+//# sourceMappingURL=item.js.map

package/lib/cjs/components/step/item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"item.js","sources":["../../../../packages/components/step/item.tsx"],"sourcesContent":["import { CheckRound } from \"@ricons/material\";\nimport classNames from \"classnames\";\nimport Divider from \"./divider\";\nimport { IStepItem } from \"./type\";\n\nconst STATUS = [\"finished\", \"active\", \"pending\"];\n\nfunction defaultRenderIcon(i: number, status: string) {\n\treturn (\n\t\t<span className='i-step-item-index'>\n\t\t\t{status === \"finished\" ? (\n\t\t\t\t<CheckRound style={{ width: \"1em\", height: \"1.5em\" }} />\n\t\t\t) : (\n\t\t\t\ti + 1\n\t\t\t)}\n\t\t</span>\n\t);\n}\n\nfunction Item(props: IStepItem) {\n\tconst {\n\t\tindex = 0,\n\t\tactive = 0,\n\t\trenderIcon = defaultRenderIcon,\n\t\ttitle,\n\t\tvertical,\n\t\tline = <Divider />,\n\t\tasList,\n\t\tstyle,\n\t\tclassName,\n\t\tchildren,\n\t\tonClick,\n\t} = props;\n\tconst status = STATUS[index === active ? 1 : index < active ? 0 : 2];\n\n\tconst handleClick = () => {\n\t\tonClick?.(index);\n\t};\n\n\treturn (\n\t\t<div\n\t\t\tstyle={style}\n\t\t\tclassName={classNames(\n\t\t\t\t\"i-step-item\",\n\t\t\t\t{\n\t\t\t\t\t[`i-step-item-${status}`]: !asList,\n\t\t\t\t},\n\t\t\t\tclassName\n\t\t\t)}\n\t\t\tonClick={handleClick}\n\t\t>\n\t\t\t{vertical ? (\n\t\t\t\t<>\n\t\t\t\t\t<div className='i-step-item-left'>\n\t\t\t\t\t\t{renderIcon?.(index, status)}\n\t\t\t\t\t\t{line}\n\t\t\t\t\t</div>\n\t\t\t\t\t<div className='i-step-item-right'>\n\t\t\t\t\t\t<div className='i-step-item-title'>{title}</div>\n\t\t\t\t\t\t{children && (\n\t\t\t\t\t\t\t<div className='i-step-item-content'>\n\t\t\t\t\t\t\t\t{children}\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</div>\n\t\t\t\t</>\n\t\t\t) : (\n\t\t\t\t<>\n\t\t\t\t\t<div className='i-step-item-title'>\n\t\t\t\t\t\t{renderIcon?.(index, status)}\n\n\t\t\t\t\t\t<span>{title}</span>\n\n\t\t\t\t\t\t{line}\n\t\t\t\t\t</div>\n\t\t\t\t\t{children && (\n\t\t\t\t\t\t<div className='i-step-item-content'>{children}</div>\n\t\t\t\t\t)}\n\t\t\t\t</>\n\t\t\t)}\n\t\t</div>\n\t);\n}\n\nexport default Item;\n"],"names":["_jsx","CheckRound","Divider","classNames","_jsxs","_Fragment"],"mappings":";;;;;;;;;;;;;AAKA,MAAM,MAAM,GAAG,CAAC,UAAU,EAAE,QAAQ,EAAE,SAAS,CAAC;AAEhD,SAAS,iBAAiB,CAAC,CAAS,EAAE,MAAc,EAAA;AACnD,IAAA,QACCA,cAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,mBAAmB,YACjC,MAAM,KAAK,UAAU,IACrBA,eAACC,mBAAU,EAAA,EAAC,KAAK,EAAE,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,GAAI,KAExD,CAAC,GAAG,CAAC,CACL,EAAA,CACK;AAET;AAEA,SAAS,IAAI,CAAC,KAAgB,EAAA;AAC7B,IAAA,MAAM,EACL,KAAK,GAAG,CAAC,EACT,MAAM,GAAG,CAAC,EACV,UAAU,GAAG,iBAAiB,EAC9B,KAAK,EACL,QAAQ,EACR,IAAI,GAAGD,eAACE,eAAO,EAAA,EAAA,CAAG,EAClB,MAAM,EACN,KAAK,EACL,SAAS,EACT,QAAQ,EACR,OAAO,GACP,GAAG,KAAK;IACT,MAAM,MAAM,GAAG,MAAM,CAAC,KAAK,KAAK,MAAM,GAAG,CAAC,GAAG,KAAK,GAAG,MAAM,GAAG,CAAC,GAAG,CAAC,CAAC;IAEpE,MAAM,WAAW,GAAG,MAAK;AACxB,QAAA,OAAO,GAAG,KAAK,CAAC;AACjB,IAAA,CAAC;IAED,QACCF,cAAA,CAAA,KAAA,EAAA,EACC,KAAK,EAAE,KAAK,EACZ,SAAS,EAAEG,mBAAU,CACpB,aAAa,EACb;AACC,YAAA,CAAC,eAAe,MAAM,CAAA,CAAE,GAAG,CAAC,MAAM;SAClC,EACD,SAAS,CACT,EACD,OAAO,EAAE,WAAW,EAAA,QAAA,EAEnB,QAAQ,IACRC,eAAA,CAAAC,mBAAA,EAAA,EAAA,QAAA,EAAA,CACCD,yBAAK,SAAS,EAAC,kBAAkB,EAAA,QAAA,EAAA,CAC/B,UAAU,GAAG,KAAK,EAAE,MAAM,CAAC,EAC3B,IAAI,CAAA,EAAA,CACA,EACNA,yBAAK,SAAS,EAAC,mBAAmB,EAAA,QAAA,EAAA,CACjCJ,cAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,mBAAmB,YAAE,KAAK,EAAA,CAAO,EAC/C,QAAQ,KACRA,cAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,qBAAqB,EAAA,QAAA,EAClC,QAAQ,GACJ,CACN,CAAA,EAAA,CACI,IACJ,KAEHI,kDACCA,eAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,mBAAmB,EAAA,QAAA,EAAA,CAChC,UAAU,GAAG,KAAK,EAAE,MAAM,CAAC,EAE5BJ,cAAA,CAAA,MAAA,EAAA,EAAA,QAAA,EAAO,KAAK,GAAQ,EAEnB,IAAI,IACA,EACL,QAAQ,KACRA,cAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,qBAAqB,YAAE,QAAQ,EAAA,CAAO,CACrD,CAAA,EAAA,CACC,CACH,EAAA,CACI;AAER;;;;"}

package/lib/cjs/components/step/step.js

@@ -0,0 +1,44 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var classNames = require('classnames');
+var react = require('react');
+var item = require('./item.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e.default : e; }
+
+var classNames__default = /*#__PURE__*/_interopDefaultCompat(classNames);
+
+const Step = (props) => {
+    const { active = 0, vertical, renderIcon, line, style, asList, className, children, onClick, } = props;
+    const steps = react.useMemo(() => {
+        const nodes = [];
+        let index = 0;
+        react.Children.map(children, (el) => {
+            if (!el || el.type !== item.default)
+                return;
+            const { props: elProps } = el;
+            nodes.push({
+                ...el,
+                props: {
+                    renderIcon,
+                    line,
+                    onClick,
+                    ...elProps,
+                    vertical,
+                    active,
+                    asList,
+                    index: index++,
+                },
+            });
+        });
+        return nodes;
+    }, [active, children]);
+    return (jsxRuntime.jsx("div", { className: classNames__default("i-step", { "i-step-vertical": vertical }, className), style: style, children: steps }));
+};
+Step.Item = item.default;
+
+exports.default = Step;
+//# sourceMappingURL=step.js.map

package/lib/cjs/components/step/step.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"step.js","sources":["../../../../packages/components/step/step.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { Children, ReactNode, useMemo } from \"react\";\nimport \"./index.css\";\nimport Item from \"./item\";\nimport { IStep } from \"./type\";\n\nconst Step = (props: IStep) => {\n\tconst {\n\t\tactive = 0,\n\t\tvertical,\n\t\trenderIcon,\n\t\tline,\n\t\tstyle,\n\t\tasList,\n\t\tclassName,\n\t\tchildren,\n\t\tonClick,\n\t} = props;\n\n\tconst steps = useMemo(() => {\n\t\tconst nodes: ReactNode[] = [];\n\t\tlet index = 0;\n\n\t\tChildren.map(children, (el: any) => {\n\t\t\tif (!el || el.type !== Item) return;\n\n\t\t\tconst { props: elProps } = el;\n\n\t\t\tnodes.push({\n\t\t\t\t...el,\n\t\t\t\tprops: {\n\t\t\t\t\trenderIcon,\n\t\t\t\t\tline,\n\t\t\t\t\tonClick,\n\t\t\t\t\t...elProps,\n\t\t\t\t\tvertical,\n\t\t\t\t\tactive,\n\t\t\t\t\tasList,\n\t\t\t\t\tindex: index++,\n\t\t\t\t},\n\t\t\t});\n\t\t});\n\n\t\treturn nodes;\n\t}, [active, children]);\n\n\treturn (\n\t\t<div\n\t\t\tclassName={classNames(\n\t\t\t\t\"i-step\",\n\t\t\t\t{ \"i-step-vertical\": vertical },\n\t\t\t\tclassName\n\t\t\t)}\n\t\t\tstyle={style}\n\t\t>\n\t\t\t{steps}\n\t\t</div>\n\t);\n};\n\nStep.Item = Item;\n\nexport default Step;\n"],"names":["useMemo","Children","Item","_jsx","classNames"],"mappings":";;;;;;;;;;;;;AAMA,MAAM,IAAI,GAAG,CAAC,KAAY,KAAI;IAC7B,MAAM,EACL,MAAM,GAAG,CAAC,EACV,QAAQ,EACR,UAAU,EACV,IAAI,EACJ,KAAK,EACL,MAAM,EACN,SAAS,EACT,QAAQ,EACR,OAAO,GACP,GAAG,KAAK;AAET,IAAA,MAAM,KAAK,GAAGA,aAAO,CAAC,MAAK;QAC1B,MAAM,KAAK,GAAgB,EAAE;QAC7B,IAAI,KAAK,GAAG,CAAC;QAEbC,cAAQ,CAAC,GAAG,CAAC,QAAQ,EAAE,CAAC,EAAO,KAAI;AAClC,YAAA,IAAI,CAAC,EAAE,IAAI,EAAE,CAAC,IAAI,KAAKC,YAAI;gBAAE;AAE7B,YAAA,MAAM,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,EAAE;YAE7B,KAAK,CAAC,IAAI,CAAC;AACV,gBAAA,GAAG,EAAE;AACL,gBAAA,KAAK,EAAE;oBACN,UAAU;oBACV,IAAI;oBACJ,OAAO;AACP,oBAAA,GAAG,OAAO;oBACV,QAAQ;oBACR,MAAM;oBACN,MAAM;oBACN,KAAK,EAAE,KAAK,EAAE;AACd,iBAAA;AACD,aAAA,CAAC;AACH,QAAA,CAAC,CAAC;AAEF,QAAA,OAAO,KAAK;AACb,IAAA,CAAC,EAAE,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;IAEtB,QACCC,cAAA,CAAA,KAAA,EAAA,EACC,SAAS,EAAEC,mBAAU,CACpB,QAAQ,EACR,EAAE,iBAAiB,EAAE,QAAQ,EAAE,EAC/B,SAAS,CACT,EACD,KAAK,EAAE,KAAK,EAAA,QAAA,EAEX,KAAK,EAAA,CACD;AAER;AAEA,IAAI,CAAC,IAAI,GAAGF,YAAI;;;;"}

package/lib/cjs/components/swiper/index.js

@@ -0,0 +1,10 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var swiper = require('./swiper.js');
+
+
+
+exports.default = swiper.default;
+//# sourceMappingURL=index.js.map

package/lib/cjs/components/swiper/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}

package/lib/cjs/components/swiper/item.js

@@ -0,0 +1,33 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var classNames = require('classnames');
+var react = require('react');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e.default : e; }
+
+var classNames__default = /*#__PURE__*/_interopDefaultCompat(classNames);
+
+function Item(props) {
+    const { index = 0, itemIndex = 0, active, type, transition, gap = 0, itemHeight, vertical, style, className, children, onItemClick, } = props;
+    const selfStyle = react.useMemo(() => {
+        if (type === "normal") {
+            return {
+                [vertical ? "paddingBlock" : "paddingInline"]: gap / 2,
+                height: itemHeight,
+            };
+        }
+        return {
+            transform: `translate(-${index * 100}%, 0)`,
+            transition,
+        };
+    }, [index, gap, itemHeight, vertical, type]);
+    return (jsxRuntime.jsx("div", { style: { ...style, ...selfStyle }, className: classNames__default("i-swiper-item", className, {
+            "i-swiper-active": active,
+        }), "data-index": itemIndex, onClick: (e) => onItemClick?.(itemIndex, e), children: children }));
+}
+
+exports.default = Item;
+//# sourceMappingURL=item.js.map

package/lib/cjs/components/swiper/item.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"item.js","sources":["../../../../packages/components/swiper/item.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { useMemo } from \"react\";\nimport { ISwiperItem } from \"./type\";\n\nfunction Item(props: ISwiperItem) {\n\tconst {\n\t\tindex = 0,\n\t\titemIndex = 0,\n\t\tactive,\n\t\ttype,\n\t\ttransition,\n\t\tgap = 0,\n\t\titemHeight,\n\t\tvertical,\n\t\tstyle,\n\t\tclassName,\n\t\tchildren,\n\t\tonItemClick,\n\t} = props;\n\n\tconst selfStyle = useMemo(() => {\n\t\tif (type === \"normal\") {\n\t\t\treturn {\n\t\t\t\t[vertical ? \"paddingBlock\" : \"paddingInline\"]: gap / 2,\n\t\t\t\theight: itemHeight,\n\t\t\t};\n\t\t}\n\n\t\treturn {\n\t\t\ttransform: `translate(-${index * 100}%, 0)`,\n\t\t\ttransition,\n\t\t};\n\t}, [index, gap, itemHeight, vertical, type]);\n\n\treturn (\n\t\t<div\n\t\t\tstyle={{ ...style, ...selfStyle }}\n\t\t\tclassName={classNames(\"i-swiper-item\", className, {\n\t\t\t\t\"i-swiper-active\": active,\n\t\t\t})}\n\t\t\tdata-index={itemIndex}\n\t\t\tonClick={(e) => onItemClick?.(itemIndex, e)}\n\t\t>\n\t\t\t{children}\n\t\t</div>\n\t);\n}\n\nexport default Item;\n"],"names":["useMemo","_jsx","classNames"],"mappings":";;;;;;;;;;;;AAIA,SAAS,IAAI,CAAC,KAAkB,EAAA;AAC/B,IAAA,MAAM,EACL,KAAK,GAAG,CAAC,EACT,SAAS,GAAG,CAAC,EACb,MAAM,EACN,IAAI,EACJ,UAAU,EACV,GAAG,GAAG,CAAC,EACP,UAAU,EACV,QAAQ,EACR,KAAK,EACL,SAAS,EACT,QAAQ,EACR,WAAW,GACX,GAAG,KAAK;AAET,IAAA,MAAM,SAAS,GAAGA,aAAO,CAAC,MAAK;AAC9B,QAAA,IAAI,IAAI,KAAK,QAAQ,EAAE;YACtB,OAAO;AACN,gBAAA,CAAC,QAAQ,GAAG,cAAc,GAAG,eAAe,GAAG,GAAG,GAAG,CAAC;AACtD,gBAAA,MAAM,EAAE,UAAU;aAClB;QACF;QAEA,OAAO;AACN,YAAA,SAAS,EAAE,CAAA,WAAA,EAAc,KAAK,GAAG,GAAG,CAAA,KAAA,CAAO;YAC3C,UAAU;SACV;AACF,IAAA,CAAC,EAAE,CAAC,KAAK,EAAE,GAAG,EAAE,UAAU,EAAE,QAAQ,EAAE,IAAI,CAAC,CAAC;AAE5C,IAAA,QACCC,cAAA,CAAA,KAAA,EAAA,EACC,KAAK,EAAE,EAAE,GAAG,KAAK,EAAE,GAAG,SAAS,EAAE,EACjC,SAAS,EAAEC,mBAAU,CAAC,eAAe,EAAE,SAAS,EAAE;AACjD,YAAA,iBAAiB,EAAE,MAAM;SACzB,CAAC,EAAA,YAAA,EACU,SAAS,EACrB,OAAO,EAAE,CAAC,CAAC,KAAK,WAAW,GAAG,SAAS,EAAE,CAAC,CAAC,EAAA,QAAA,EAE1C,QAAQ,EAAA,CACJ;AAER;;;;"}

package/lib/cjs/components/swiper/swiper.js

@@ -0,0 +1,241 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('react/jsx-runtime');
+var material = require('@ricons/material');
+var classNames = require('classnames');
+var react = require('react');
+var hooks = require('../../js/hooks.js');
+var utils = require('../../js/utils.js');
+var icon = require('../icon/icon.js');
+var item = require('./item.js');
+
+function _interopDefaultCompat (e) { return e && typeof e === 'object' && 'default' in e ? e.default : e; }
+
+var classNames__default = /*#__PURE__*/_interopDefaultCompat(classNames);
+
+const Swiper = ((props) => {
+    const { ref, type = "normal", initial = 0, display = 1, scroll = 1, loop = true, vertical, prev = jsxRuntime.jsx(icon.default, { icon: jsxRuntime.jsx(material.KeyboardArrowLeftRound, {}), size: '2em' }), next = jsxRuntime.jsx(icon.default, { icon: jsxRuntime.jsx(material.KeyboardArrowRightRound, {}), size: '2em' }), duration = 600, interval = 3000, autoplay, pauseOnHover, arrow = true, reverse, draggable, dragOffset = 40, gap = 0, itemHeight, indicator, fixedIndicator, style, className, children, renderIndicator, onBeforeSwipe, onAfterSwipe, onItemClick, } = props;
+    const listRef = react.useRef(null);
+    const timerRef = react.useRef(null);
+    const transition = `all ${duration / 1000}s`;
+    const state = hooks.useReactive({
+        current: initial,
+        swipable: true,
+        transition: type === "fade" ? "none" : transition,
+        dragStart: 0,
+        dragging: false,
+        initialized: false,
+    });
+    const items = react.useMemo(() => {
+        return react.Children.map(children, (node) => {
+            if (node.type !== item.default)
+                return;
+            return node;
+        });
+    }, [children]);
+    const [displayItems, extra, size, total, listSize] = react.useMemo(() => {
+        const extra = type === "normal" && loop && items.length > display
+            ? display + 1
+            : 0;
+        let list = [];
+        if (extra <= 0) {
+            list = [...items];
+        }
+        else {
+            const head = items.slice(0, extra);
+            const tail = items.slice(-extra);
+            list = [...tail, ...items, ...head];
+        }
+        const listSize = `${(list.length / display) * 100}%`;
+        return [list, extra, items.length, list.length, listSize];
+    }, [display, loop, type, items]);
+    const offsetPercent = react.useMemo(() => (-100 * (state.current + extra)) / total, [state.current, total]);
+    const position = react.useMemo(() => {
+        if (size <= display || type === "fade")
+            return;
+        const offset = vertical
+            ? `0, ${offsetPercent}%`
+            : `${offsetPercent}%, 0`;
+        return `translate3d(${offset}, 0)`;
+    }, [offsetPercent, vertical, display, size, type]);
+    const trackStyle = react.useMemo(() => {
+        if (!vertical || !itemHeight)
+            return;
+        return {
+            height: itemHeight * display,
+        };
+    }, [vertical, itemHeight, display]);
+    const indicatorsLoop = react.useMemo(() => {
+        return Array.from({
+            length: Math.ceil((size - display) / scroll) + 1,
+        });
+    }, [loop, indicator]);
+    const clearTimer = () => {
+        clearTimeout(timerRef.current);
+        timerRef.current = null;
+    };
+    const swipeTo = (i) => {
+        if (!state.swipable || i === state.current)
+            return;
+        state.swipable = false;
+        onBeforeSwipe?.(state.current);
+        let reset = false;
+        let next = i;
+        const lastDisplay = size - display;
+        if (loop) {
+            if (i > lastDisplay) {
+                reset = true;
+                i = size;
+                next = 0;
+            }
+            else if (i < 0) {
+                reset = true;
+                i = -display;
+                next = lastDisplay;
+            }
+        }
+        else {
+            next = utils.clamp(next, 0, lastDisplay);
+            i = next;
+        }
+        setTimeout(() => {
+            state.swipable = true;
+        }, duration + 32);
+        if (type === "fade") {
+            state.current = next;
+            onAfterSwipe?.(next);
+            return;
+        }
+        state.current = i;
+        if (!reset) {
+            if (autoplay) {
+                timerRef.current = setTimeout(swipeNext, interval);
+            }
+            setTimeout(() => {
+                onAfterSwipe?.(next);
+            }, duration + 12);
+            return;
+        }
+        setTimeout(() => {
+            state.transition = "none";
+            state.current = next;
+            onAfterSwipe?.(next);
+            if (autoplay) {
+                timerRef.current = setTimeout(swipeNext, interval);
+            }
+            setTimeout(() => {
+                state.transition = transition;
+            }, 60);
+        }, duration + 20);
+    };
+    const swipeNext = () => {
+        swipeTo(reverse ? state.current - scroll : state.current + scroll);
+    };
+    const swipePrev = () => {
+        swipeTo(reverse ? state.current + scroll : state.current - scroll);
+    };
+    const handleMouseDown = (e) => {
+        if (!draggable || !state.swipable || type === "fade")
+            return;
+        e.stopPropagation();
+        e.preventDefault();
+        if (e.touches) {
+            e = e.touches[0];
+        }
+        Object.assign(state, {
+            dragStart: vertical ? e.clientY : e.clientX,
+            dragging: true,
+            transition: "none",
+        });
+    };
+    const handleMouseMove = (e) => {
+        if (!state.dragging || !listRef.current)
+            return;
+        e.preventDefault();
+        if (e.touches) {
+            e = e.touches[0];
+        }
+        const dragEnd = vertical ? e.clientY : e.clientX;
+        const offset = ((dragEnd - state.dragStart) * 61.8) /
+            listRef.current[vertical ? "offsetHeight" : "offsetWidth"] +
+            offsetPercent;
+        listRef.current.style.transform = `translate3d(${vertical ? `0, ${offset}%` : `${offset}%, 0`}, 0)`;
+    };
+    const handleMouseUp = (e) => {
+        if (!state.dragging || !listRef.current)
+            return;
+        if (e.changedTouches) {
+            e = e.changedTouches[0];
+        }
+        const dragEnd = vertical ? e.clientY : e.clientX;
+        const part = listRef.current[vertical ? "offsetHeight" : "offsetWidth"] / total;
+        const offset = (dragEnd - state.dragStart) * 0.618;
+        const absOffset = Math.abs(offset);
+        if (absOffset > dragOffset) {
+            const base = Math.floor(absOffset / part);
+            const mod = (absOffset % part) - dragOffset > 0 ? 1 : 0;
+            const p = base + mod;
+            let to = state.current + (offset > 0 ? -p : p);
+            swipeTo(to);
+        }
+        listRef.current.style.transform = position || "";
+        Object.assign(state, {
+            dragging: false,
+            transition,
+        });
+    };
+    const handleMouseOver = () => {
+        if (!pauseOnHover)
+            return;
+        clearTimer();
+    };
+    const handleMouseLeave = () => {
+        if (!pauseOnHover)
+            return;
+        clearTimer();
+        timerRef.current = setTimeout(swipeNext, interval);
+    };
+    hooks.useMouseMove(handleMouseMove);
+    hooks.useMouseUp(handleMouseUp);
+    react.useImperativeHandle(ref, () => ({
+        swipeTo,
+        swipeNext,
+        swipePrev,
+    }));
+    react.useEffect(() => {
+        if (!autoplay)
+            return;
+        timerRef.current = setTimeout(swipeNext, interval);
+        return () => {
+            clearTimeout(timerRef.current);
+            timerRef.current = null;
+        };
+    }, [autoplay, interval]);
+    return (jsxRuntime.jsxs("div", { style: style, className: classNames__default("i-swiper", {
+            "i-swiper-vertical": vertical,
+            "i-swiper-initialized": state.initialized,
+        }, className), children: [jsxRuntime.jsxs("div", { className: 'i-swiper-track', style: trackStyle, onMouseOver: handleMouseOver, onMouseLeave: handleMouseLeave, children: [jsxRuntime.jsx("div", { ref: listRef, className: classNames__default("i-swiper-list", {
+                            "i-swiper-fade": type === "fade",
+                        }), style: {
+                            [vertical ? "height" : "width"]: listSize,
+                            transform: position,
+                            transition: state.transition,
+                        }, onMouseDown: handleMouseDown, onTouchStart: handleMouseDown, children: displayItems.map((item$1, i) => {
+                            const { props: itemProps } = item$1;
+                            return (jsxRuntime.jsx(item.default, { index: i, itemIndex: (i - extra + size) % size, active: i - extra === state.current, type: type, gap: gap, transition: transition, itemHeight: itemHeight, vertical: vertical, onItemClick: onItemClick, ...itemProps }, i));
+                        }) }), arrow && size > 1 && (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [(loop || state.current !== 0) && (jsxRuntime.jsx("a", { className: 'i-swiper-arrow i-swiper-prev', onClick: swipePrev, children: prev })), (loop || state.current < size - display) && (jsxRuntime.jsx("a", { className: 'i-swiper-arrow i-swiper-next', onClick: swipeNext, children: next }))] }))] }), indicator && (jsxRuntime.jsx("div", { className: classNames__default("i-swiper-indicators", {
+                    "i-swiper-indicators-fixed": fixedIndicator,
+                }), children: indicatorsLoop.map((_, i) => {
+                    return (jsxRuntime.jsx("a", { className: classNames__default("i-swiper-indicator", {
+                            "i-indicator-active": i ===
+                                Math[loop ? "floor" : "ceil"](((state.current + size) % size) /
+                                    scroll),
+                        }), onClick: () => swipeTo(i * scroll), children: renderIndicator?.(i) }, i));
+                }) }))] }));
+});
+Swiper.Item = item.default;
+
+exports.default = Swiper;
+//# sourceMappingURL=swiper.js.map