@ioca/react 1.5.8 → 1.5.10

package/lib/es/components/button/toggle.js.map

@@ -1 +1 @@
-{"version":3,"file":"toggle.js","sources":["../../../../packages/components/button/toggle.tsx"],"sourcesContent":["import classNames from \"classnames\";\r\nimport { MouseEvent, useEffect, useState } from \"react\";\r\nimport Button from \"./button\";\r\nimport { IButtonToggle } from \"./type\";\r\n\r\nexport default function Toggle(props: IButtonToggle) {\r\n\tconst {\r\n\t\tref,\r\n\t\tactive,\r\n\t\tactiveClass,\r\n\t\tafter,\r\n\t\tdisabled,\r\n\t\tchildren,\r\n\t\tclassName,\r\n\t\ttoggable,\r\n\t\tonClick,\r\n\t\tonToggle,\r\n\t\t...restProps\r\n\t} = props;\r\n\r\n\tconst [isActive, setIsActive] = useState(active);\r\n\tconst [done, setDone] = useState(true);\r\n\r\n\tconst toggle = async () => {\r\n\t\tconst hasAfter = !!after;\r\n\t\tconst nextActive = !isActive;\r\n\r\n\t\tconst canToggle = toggable ? await toggable() : true;\r\n\t\tif (!canToggle) return;\r\n\r\n\t\tsetIsActive(nextActive);\r\n\t\tsetDone(!hasAfter);\r\n\t\tonToggle?.(nextActive);\r\n\r\n\t\tif (!hasAfter) return;\r\n\r\n\t\tsetTimeout(() => {\r\n\t\t\tsetDone(true);\r\n\t\t}, 16);\r\n\t};\r\n\r\n\tconst handleClick = (e: MouseEvent<HTMLElement>) => {\r\n\t\tonClick?.(e);\r\n\r\n\t\t!disabled && toggle();\r\n\t};\r\n\r\n\tuseEffect(() => {\r\n\t\tsetIsActive(active);\r\n\t\tsetDone(true);\r\n\t}, [active]);\r\n\r\n\treturn (\r\n\t\t<Button\r\n\t\t\tref={ref}\r\n\t\t\tclassName={classNames(\r\n\t\t\t\tclassName,\r\n\t\t\t\t{ [activeClass || \"\"]: isActive },\r\n\t\t\t\t\"i-btn-toggle\",\r\n\t\t\t)}\r\n\t\t\t{...restProps}\r\n\t\t\tonClick={handleClick}\r\n\t\t>\r\n\t\t\t<div\r\n\t\t\t\tclassName={classNames(\"i-btn-toggle-content\", {\r\n\t\t\t\t\t\"i-btn-toggle-active\": done,\r\n\t\t\t\t})}\r\n\t\t\t>\r\n\t\t\t\t{isActive ? (after ?? children) : children}\r\n\t\t\t</div>\r\n\t\t</Button>\r\n\t);\r\n}\r\n"],"names":["_jsx"],"mappings":";;;;;AAKc,SAAU,MAAM,CAAC,KAAoB,EAAA;IAClD,MAAM,EACL,GAAG,EACH,MAAM,EACN,WAAW,EACX,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,GAAG,SAAS,EACZ,GAAG,KAAK;IAET,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,MAAM,CAAC;IAChD,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC;AAEtC,IAAA,MAAM,MAAM,GAAG,YAAW;AACzB,QAAA,MAAM,QAAQ,GAAG,CAAC,CAAC,KAAK;AACxB,QAAA,MAAM,UAAU,GAAG,CAAC,QAAQ;AAE5B,QAAA,MAAM,SAAS,GAAG,QAAQ,GAAG,MAAM,QAAQ,EAAE,GAAG,IAAI;AACpD,QAAA,IAAI,CAAC,SAAS;YAAE;QAEhB,WAAW,CAAC,UAAU,CAAC;AACvB,QAAA,OAAO,CAAC,CAAC,QAAQ,CAAC;AAClB,QAAA,QAAQ,GAAG,UAAU,CAAC;AAEtB,QAAA,IAAI,CAAC,QAAQ;YAAE;QAEf,UAAU,CAAC,MAAK;YACf,OAAO,CAAC,IAAI,CAAC;QACd,CAAC,EAAE,EAAE,CAAC;AACP,IAAA,CAAC;AAED,IAAA,MAAM,WAAW,GAAG,CAAC,CAA0B,KAAI;AAClD,QAAA,OAAO,GAAG,CAAC,CAAC;AAEZ,QAAA,CAAC,QAAQ,IAAI,MAAM,EAAE;AACtB,IAAA,CAAC;IAED,SAAS,CAAC,MAAK;QACd,WAAW,CAAC,MAAM,CAAC;QACnB,OAAO,CAAC,IAAI,CAAC;AACd,IAAA,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC;AAEZ,IAAA,QACCA,GAAA,CAAC,MAAM,EAAA,EACN,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,UAAU,CACpB,SAAS,EACT,EAAE,CAAC,WAAW,IAAI,EAAE,GAAG,QAAQ,EAAE,EACjC,cAAc,CACd,EAAA,GACG,SAAS,EACb,OAAO,EAAE,WAAW,YAEpBA,GAAA,CAAA,KAAA,EAAA,EACC,SAAS,EAAE,UAAU,CAAC,sBAAsB,EAAE;AAC7C,gBAAA,qBAAqB,EAAE,IAAI;AAC3B,aAAA,CAAC,YAED,QAAQ,IAAI,KAAK,IAAI,QAAQ,IAAI,QAAQ,EAAA,CACrC,EAAA,CACE;AAEX;;;;"}
+{"version":3,"file":"toggle.js","sources":["../../../../packages/components/button/toggle.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { MouseEvent, useEffect, useState } from \"react\";\nimport Button from \"./button\";\nimport { IButtonToggle } from \"./type\";\n\nexport default function Toggle(props: IButtonToggle) {\n\tconst {\n\t\tref,\n\t\tactive,\n\t\tactiveClass,\n\t\tafter,\n\t\tdisabled,\n\t\tchildren,\n\t\tclassName,\n\t\ttoggable,\n\t\tonClick,\n\t\tonToggle,\n\t\t...restProps\n\t} = props;\n\n\tconst [isActive, setIsActive] = useState(active);\n\tconst [done, setDone] = useState(true);\n\n\tconst toggle = async () => {\n\t\tconst hasAfter = !!after;\n\t\tconst nextActive = !isActive;\n\n\t\tconst canToggle = toggable ? await toggable() : true;\n\t\tif (!canToggle) return;\n\n\t\tsetIsActive(nextActive);\n\t\tsetDone(!hasAfter);\n\t\tonToggle?.(nextActive);\n\n\t\tif (!hasAfter) return;\n\n\t\tsetTimeout(() => {\n\t\t\tsetDone(true);\n\t\t}, 16);\n\t};\n\n\tconst handleClick = (e: MouseEvent<HTMLElement>) => {\n\t\tonClick?.(e);\n\n\t\t!disabled && toggle();\n\t};\n\n\tuseEffect(() => {\n\t\tsetIsActive(active);\n\t\tsetDone(true);\n\t}, [active]);\n\n\treturn (\n\t\t<Button\n\t\t\tref={ref}\n\t\t\tclassName={classNames(\n\t\t\t\tclassName,\n\t\t\t\t{ [activeClass || \"\"]: isActive },\n\t\t\t\t\"i-btn-toggle\",\n\t\t\t)}\n\t\t\t{...restProps}\n\t\t\tonClick={handleClick}\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName={classNames(\"i-btn-toggle-content\", {\n\t\t\t\t\t\"i-btn-toggle-active\": done,\n\t\t\t\t})}\n\t\t\t>\n\t\t\t\t{isActive ? (after ?? children) : children}\n\t\t\t</div>\n\t\t</Button>\n\t);\n}\n"],"names":["_jsx"],"mappings":";;;;;AAKc,SAAU,MAAM,CAAC,KAAoB,EAAA;IAClD,MAAM,EACL,GAAG,EACH,MAAM,EACN,WAAW,EACX,KAAK,EACL,QAAQ,EACR,QAAQ,EACR,SAAS,EACT,QAAQ,EACR,OAAO,EACP,QAAQ,EACR,GAAG,SAAS,EACZ,GAAG,KAAK;IAET,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,QAAQ,CAAC,MAAM,CAAC;IAChD,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAC,IAAI,CAAC;AAEtC,IAAA,MAAM,MAAM,GAAG,YAAW;AACzB,QAAA,MAAM,QAAQ,GAAG,CAAC,CAAC,KAAK;AACxB,QAAA,MAAM,UAAU,GAAG,CAAC,QAAQ;AAE5B,QAAA,MAAM,SAAS,GAAG,QAAQ,GAAG,MAAM,QAAQ,EAAE,GAAG,IAAI;AACpD,QAAA,IAAI,CAAC,SAAS;YAAE;QAEhB,WAAW,CAAC,UAAU,CAAC;AACvB,QAAA,OAAO,CAAC,CAAC,QAAQ,CAAC;AAClB,QAAA,QAAQ,GAAG,UAAU,CAAC;AAEtB,QAAA,IAAI,CAAC,QAAQ;YAAE;QAEf,UAAU,CAAC,MAAK;YACf,OAAO,CAAC,IAAI,CAAC;QACd,CAAC,EAAE,EAAE,CAAC;AACP,IAAA,CAAC;AAED,IAAA,MAAM,WAAW,GAAG,CAAC,CAA0B,KAAI;AAClD,QAAA,OAAO,GAAG,CAAC,CAAC;AAEZ,QAAA,CAAC,QAAQ,IAAI,MAAM,EAAE;AACtB,IAAA,CAAC;IAED,SAAS,CAAC,MAAK;QACd,WAAW,CAAC,MAAM,CAAC;QACnB,OAAO,CAAC,IAAI,CAAC;AACd,IAAA,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC;AAEZ,IAAA,QACCA,GAAA,CAAC,MAAM,EAAA,EACN,GAAG,EAAE,GAAG,EACR,SAAS,EAAE,UAAU,CACpB,SAAS,EACT,EAAE,CAAC,WAAW,IAAI,EAAE,GAAG,QAAQ,EAAE,EACjC,cAAc,CACd,EAAA,GACG,SAAS,EACb,OAAO,EAAE,WAAW,YAEpBA,GAAA,CAAA,KAAA,EAAA,EACC,SAAS,EAAE,UAAU,CAAC,sBAAsB,EAAE;AAC7C,gBAAA,qBAAqB,EAAE,IAAI;AAC3B,aAAA,CAAC,YAED,QAAQ,IAAI,KAAK,IAAI,QAAQ,IAAI,QAAQ,EAAA,CACrC,EAAA,CACE;AAEX;;;;"}

package/lib/es/components/card/card.js.map

@@ -1 +1 @@
-{"version":3,"file":"card.js","sources":["../../../../packages/components/card/card.tsx"],"sourcesContent":["import classNames from \"classnames\";\r\nimport \"./index.css\";\r\nimport { ICard } from \"./type\";\r\n\r\nconst Card = (props: ICard) => {\r\n\tconst {\r\n\t\thideShadow,\r\n\t\tborder,\r\n\t\tclassName,\r\n\t\tchildren,\r\n\t\theader,\r\n\t\tfooter,\r\n\t\t...restProps\r\n\t} = props;\r\n\r\n\treturn (\r\n\t\t<div\r\n\t\t\tclassName={classNames(\"i-card\", className, {\r\n\t\t\t\tshadow: !hideShadow,\r\n\t\t\t\t\"i-card-bordered\": border,\r\n\t\t\t})}\r\n\t\t\t{...restProps}\r\n\t\t>\r\n\t\t\t{header && <div className='i-card-header'>{header}</div>}\r\n\r\n\t\t\t{children && <div className='i-card-content'>{children}</div>}\r\n\r\n\t\t\t{footer && <div className='i-card-footer'>{footer}</div>}\r\n\t\t</div>\r\n\t);\r\n};\r\n\r\nexport default Card;\r\n"],"names":["_jsxs","_jsx"],"mappings":";;;AAIA,MAAM,IAAI,GAAG,CAAC,KAAY,KAAI;AAC7B,IAAA,MAAM,EACL,UAAU,EACV,MAAM,EACN,SAAS,EACT,QAAQ,EACR,MAAM,EACN,MAAM,EACN,GAAG,SAAS,EACZ,GAAG,KAAK;IAET,QACCA,cACC,SAAS,EAAE,UAAU,CAAC,QAAQ,EAAE,SAAS,EAAE;YAC1C,MAAM,EAAE,CAAC,UAAU;AACnB,YAAA,iBAAiB,EAAE,MAAM;AACzB,SAAA,CAAC,EAAA,GACE,SAAS,EAAA,QAAA,EAAA,CAEZ,MAAM,IAAIC,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,eAAe,YAAE,MAAM,EAAA,CAAO,EAEvD,QAAQ,IAAIA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,gBAAgB,EAAA,QAAA,EAAE,QAAQ,EAAA,CAAO,EAE5D,MAAM,IAAIA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,eAAe,EAAA,QAAA,EAAE,MAAM,EAAA,CAAO,CAAA,EAAA,CACnD;AAER;;;;"}
+{"version":3,"file":"card.js","sources":["../../../../packages/components/card/card.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport \"./index.css\";\nimport { ICard } from \"./type\";\n\nconst Card = (props: ICard) => {\n\tconst {\n\t\thideShadow,\n\t\tborder,\n\t\tclassName,\n\t\tchildren,\n\t\theader,\n\t\tfooter,\n\t\t...restProps\n\t} = props;\n\n\treturn (\n\t\t<div\n\t\t\tclassName={classNames(\"i-card\", className, {\n\t\t\t\tshadow: !hideShadow,\n\t\t\t\t\"i-card-bordered\": border,\n\t\t\t})}\n\t\t\t{...restProps}\n\t\t>\n\t\t\t{header && <div className='i-card-header'>{header}</div>}\n\n\t\t\t{children && <div className='i-card-content'>{children}</div>}\n\n\t\t\t{footer && <div className='i-card-footer'>{footer}</div>}\n\t\t</div>\n\t);\n};\n\nexport default Card;\n"],"names":["_jsxs","_jsx"],"mappings":";;;AAIA,MAAM,IAAI,GAAG,CAAC,KAAY,KAAI;AAC7B,IAAA,MAAM,EACL,UAAU,EACV,MAAM,EACN,SAAS,EACT,QAAQ,EACR,MAAM,EACN,MAAM,EACN,GAAG,SAAS,EACZ,GAAG,KAAK;IAET,QACCA,cACC,SAAS,EAAE,UAAU,CAAC,QAAQ,EAAE,SAAS,EAAE;YAC1C,MAAM,EAAE,CAAC,UAAU;AACnB,YAAA,iBAAiB,EAAE,MAAM;AACzB,SAAA,CAAC,EAAA,GACE,SAAS,EAAA,QAAA,EAAA,CAEZ,MAAM,IAAIC,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,eAAe,YAAE,MAAM,EAAA,CAAO,EAEvD,QAAQ,IAAIA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,gBAAgB,EAAA,QAAA,EAAE,QAAQ,EAAA,CAAO,EAE5D,MAAM,IAAIA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,eAAe,EAAA,QAAA,EAAE,MAAM,EAAA,CAAO,CAAA,EAAA,CACnD;AAER;;;;"}

package/lib/es/components/checkbox/checkbox.js

@@ -26,7 +26,7 @@ function Checkbox(props) {
     return (jsxs("div", { className: classNames("i-checkbox i-input-label", {
             [`i-checkbox-${status}`]: status !== "normal",
             "i-input-inline": labelInline,
-        }, className), ...restProps, children: [label && (jsxs("span", { className: 'i-input-label-text', children: [required && jsx("span", { className: 'error', children: "*" }), label, message && jsx("p", { className: 'i-checkbox-message', children: message })] })), jsx("div", { className: classNames("i-checkbox-options", {
+        }, className), ...restProps, children: [label && (jsxs("span", { className: "i-input-label-text", children: [required && jsx("span", { className: "error", children: "*" }), label, message && jsx("p", { className: "i-checkbox-message", children: message })] })), jsx("div", { className: classNames("i-checkbox-options", {
                     "i-options-block": !optionInline,
                     "i-checkbox-options-button": type === "button",
                 }), children: formattedOptions.map((option) => {

package/lib/es/components/checkbox/checkbox.js.map

@@ -1 +1 @@
-{"version":3,"file":"checkbox.js","sources":["../../../../packages/components/checkbox/checkbox.tsx"],"sourcesContent":["import classNames from \"classnames\";\r\nimport { useEffect, useMemo, useState } from \"react\";\r\nimport \"../../css/input.css\";\r\nimport { formatOption } from \"../../js/utils\";\r\nimport \"./index.css\";\r\nimport CheckboxItem from \"./item\";\r\nimport type { ICheckbox } from \"./type\";\r\n\r\nfunction Checkbox(props: ICheckbox) {\r\n\tconst {\r\n\t\tlabel,\r\n\t\tname,\r\n\t\toptions = [],\r\n\t\tvalue = \"\",\r\n\t\ttype = \"default\",\r\n\t\toptionInline = true,\r\n\t\tlabelInline,\r\n\t\tdisabled,\r\n\t\tstatus = \"normal\",\r\n\t\tmessage,\r\n\t\trequired,\r\n\t\tclassName,\r\n\t\trenderItem,\r\n\t\tonChange,\r\n\t\t...restProps\r\n\t} = props;\r\n\r\n\tconst [selectedValues, setSelectedValues] = useState<any>(value);\r\n\r\n\tconst formattedOptions = useMemo(() => formatOption(options), [options]);\r\n\r\n\tconst handleChange = (checked, opt, e) => {\r\n\t\tconst group = [...selectedValues];\r\n\t\tconst i = group.findIndex((item) => item === opt.value);\r\n\r\n\t\tif (checked && i < 0) {\r\n\t\t\tgroup.push(opt.value);\r\n\t\t} else if (!checked && i > -1) {\r\n\t\t\tgroup.splice(i, 1);\r\n\t\t}\r\n\r\n\t\tsetSelectedValues(group);\r\n\t\tonChange?.(group, opt, e);\r\n\t};\r\n\r\n\tuseEffect(() => {\r\n\t\tsetSelectedValues(value);\r\n\t}, [value]);\r\n\r\n\treturn (\r\n\t\t<div\r\n\t\t\tclassName={classNames(\r\n\t\t\t\t\"i-checkbox i-input-label\",\r\n\t\t\t\t{\r\n\t\t\t\t\t[`i-checkbox-${status}`]: status !== \"normal\",\r\n\t\t\t\t\t\"i-input-inline\": labelInline,\r\n\t\t\t\t},\r\n\r\n\t\t\t\tclassName\r\n\t\t\t)}\r\n\t\t\t{...restProps}\r\n\t\t>\r\n\t\t\t{label && (\r\n\t\t\t\t<span className='i-input-label-text'>\r\n\t\t\t\t\t{required && <span className='error'>*</span>}\r\n\t\t\t\t\t{label}\r\n\r\n\t\t\t\t\t{message && <p className='i-checkbox-message'>{message}</p>}\r\n\t\t\t\t</span>\r\n\t\t\t)}\r\n\r\n\t\t\t<div\r\n\t\t\t\tclassName={classNames(\"i-checkbox-options\", {\r\n\t\t\t\t\t\"i-options-block\": !optionInline,\r\n\t\t\t\t\t\"i-checkbox-options-button\": type === \"button\",\r\n\t\t\t\t})}\r\n\t\t\t>\r\n\t\t\t\t{formattedOptions.map((option) => {\r\n\t\t\t\t\treturn (\r\n\t\t\t\t\t\t<CheckboxItem\r\n\t\t\t\t\t\t\tkey={option.value as string}\r\n\t\t\t\t\t\t\tname={name}\r\n\t\t\t\t\t\t\tvalue={selectedValues.includes(option.value)}\r\n\t\t\t\t\t\t\toptionValue={option.value}\r\n\t\t\t\t\t\t\ttype={type}\r\n\t\t\t\t\t\t\tdisabled={disabled || option.disabled}\r\n\t\t\t\t\t\t\tonChange={(checked, e) =>\r\n\t\t\t\t\t\t\t\thandleChange(checked, option, e)\r\n\t\t\t\t\t\t\t}\r\n\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t{renderItem ?? option.label}\r\n\t\t\t\t\t\t</CheckboxItem>\r\n\t\t\t\t\t);\r\n\t\t\t\t})}\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t);\r\n}\r\n\r\nCheckbox.Item = CheckboxItem;\r\n\r\nexport default Checkbox;\r\n"],"names":["_jsxs","_jsx"],"mappings":"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"}
+{"version":3,"file":"checkbox.js","sources":["../../../../packages/components/checkbox/checkbox.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { useEffect, useMemo, useState } from \"react\";\nimport \"../../css/input.css\";\nimport { formatOption } from \"../../js/utils\";\nimport \"./index.css\";\nimport CheckboxItem from \"./item\";\nimport type { ICheckbox } from \"./type\";\n\nfunction Checkbox(props: ICheckbox) {\n    const {\n        label,\n        name,\n        options = [],\n        value = \"\",\n        type = \"default\",\n        optionInline = true,\n        labelInline,\n        disabled,\n        status = \"normal\",\n        message,\n        required,\n        className,\n        renderItem,\n        onChange,\n        ...restProps\n    } = props;\n\n    const [selectedValues, setSelectedValues] = useState<any>(value);\n\n    const formattedOptions = useMemo(() => formatOption(options), [options]);\n\n    const handleChange = (checked, opt, e) => {\n        const group = [...selectedValues];\n        const i = group.findIndex((item) => item === opt.value);\n\n        if (checked && i < 0) {\n            group.push(opt.value);\n        } else if (!checked && i > -1) {\n            group.splice(i, 1);\n        }\n\n        setSelectedValues(group);\n        onChange?.(group, opt, e);\n    };\n\n    useEffect(() => {\n        setSelectedValues(value);\n    }, [value]);\n\n    return (\n        <div\n            className={classNames(\n                \"i-checkbox i-input-label\",\n                {\n                    [`i-checkbox-${status}`]: status !== \"normal\",\n                    \"i-input-inline\": labelInline,\n                },\n\n                className,\n            )}\n            {...restProps}\n        >\n            {label && (\n                <span className=\"i-input-label-text\">\n                    {required && <span className=\"error\">*</span>}\n                    {label}\n\n                    {message && <p className=\"i-checkbox-message\">{message}</p>}\n                </span>\n            )}\n\n            <div\n                className={classNames(\"i-checkbox-options\", {\n                    \"i-options-block\": !optionInline,\n                    \"i-checkbox-options-button\": type === \"button\",\n                })}\n            >\n                {formattedOptions.map((option) => {\n                    return (\n                        <CheckboxItem\n                            key={option.value as string}\n                            name={name}\n                            value={selectedValues.includes(option.value)}\n                            optionValue={option.value}\n                            type={type}\n                            disabled={disabled || option.disabled}\n                            onChange={(checked, e) =>\n                                handleChange(checked, option, e)\n                            }\n                        >\n                            {renderItem ?? option.label}\n                        </CheckboxItem>\n                    );\n                })}\n            </div>\n        </div>\n    );\n}\n\nCheckbox.Item = CheckboxItem;\n\nexport default Checkbox;\n"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/lib/es/components/checkbox/item.js.map

@@ -1 +1 @@
-{"version":3,"file":"item.js","sources":["../../../../packages/components/checkbox/item.tsx"],"sourcesContent":["import classNames from \"classnames\";\r\nimport { ChangeEvent, useEffect, useState } from \"react\";\r\nimport { ICheckboxItem } from \"./type\";\r\n\r\nexport default function CheckboxItem(props: ICheckboxItem) {\r\n\tconst {\r\n\t\ttype = \"default\",\r\n\t\tlabel,\r\n\t\tname,\r\n\t\tvalue = false,\r\n\t\tclassName,\r\n\t\tstatus = \"normal\",\r\n\t\tmessage,\r\n\t\tdisabled,\r\n\t\tpartof,\r\n\t\toptionValue,\r\n\t\tchildren,\r\n\t\tonChange,\r\n\t\t...restProps\r\n\t} = props;\r\n\r\n\tconst [checked, setChecked] = useState(value);\r\n\tconst [itemStatus, setItemStatus] = useState(status);\r\n\tconst [itemMessage, setItemMessage] = useState(message);\r\n\tconst isChildrenFn = typeof children === \"function\";\r\n\r\n\tconst handleChange = (e: ChangeEvent<HTMLInputElement>) => {\r\n\t\tconst next = e.target.checked;\r\n\t\tsetChecked(next);\r\n\t\tsetItemStatus(status);\r\n\t\tsetItemMessage(message);\r\n\t\tonChange?.(next, e);\r\n\t};\r\n\r\n\tuseEffect(() => {\r\n\t\tsetChecked(value);\r\n\t}, [value]);\r\n\r\n\tuseEffect(() => {\r\n\t\tsetItemStatus(status);\r\n\t\tsetItemMessage(message);\r\n\t}, [status, message]);\r\n\r\n\treturn (\r\n\t\t<label\r\n\t\t\tclassName={classNames(\r\n\t\t\t\t\"i-checkbox-item\",\r\n\t\t\t\t{\r\n\t\t\t\t\t[`i-checkbox-${itemStatus}`]: itemStatus !== \"normal\",\r\n\t\t\t\t\tdisabled,\r\n\t\t\t\t},\r\n\t\t\t\tclassName\r\n\t\t\t)}\r\n\t\t\t{...restProps}\r\n\t\t>\r\n\t\t\t<input\r\n\t\t\t\ttype='checkbox'\r\n\t\t\t\tname={name}\r\n\t\t\t\tclassName={classNames(\"i-checkbox-input\", {\r\n\t\t\t\t\t[`i-checkbox-${type}`]: !partof,\r\n\t\t\t\t\t\"i-checkbox-partof\": partof,\r\n\t\t\t\t})}\r\n\t\t\t\tchecked={checked}\r\n\t\t\t\tdisabled={disabled}\r\n\t\t\t\tonChange={handleChange}\r\n\t\t\t/>\r\n\r\n\t\t\t{isChildrenFn ? (\r\n\t\t\t\tchildren(checked, optionValue)\r\n\t\t\t) : (\r\n\t\t\t\t<span className='i-checkbox-text'>{children || label}</span>\r\n\t\t\t)}\r\n\r\n\t\t\t{itemMessage && (\r\n\t\t\t\t<span className='i-checkbox-message'>*{itemMessage}</span>\r\n\t\t\t)}\r\n\t\t</label>\r\n\t);\r\n}\r\n"],"names":["_jsxs","_jsx"],"mappings":";;;;AAIc,SAAU,YAAY,CAAC,KAAoB,EAAA;AACxD,IAAA,MAAM,EACL,IAAI,GAAG,SAAS,EAChB,KAAK,EACL,IAAI,EACJ,KAAK,GAAG,KAAK,EACb,SAAS,EACT,MAAM,GAAG,QAAQ,EACjB,OAAO,EACP,QAAQ,EACR,MAAM,EACN,WAAW,EACX,QAAQ,EACR,QAAQ,EACR,GAAG,SAAS,EACZ,GAAG,KAAK;IAET,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;IAC7C,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,MAAM,CAAC;IACpD,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,OAAO,CAAC;AACvD,IAAA,MAAM,YAAY,GAAG,OAAO,QAAQ,KAAK,UAAU;AAEnD,IAAA,MAAM,YAAY,GAAG,CAAC,CAAgC,KAAI;AACzD,QAAA,MAAM,IAAI,GAAG,CAAC,CAAC,MAAM,CAAC,OAAO;QAC7B,UAAU,CAAC,IAAI,CAAC;QAChB,aAAa,CAAC,MAAM,CAAC;QACrB,cAAc,CAAC,OAAO,CAAC;AACvB,QAAA,QAAQ,GAAG,IAAI,EAAE,CAAC,CAAC;AACpB,IAAA,CAAC;IAED,SAAS,CAAC,MAAK;QACd,UAAU,CAAC,KAAK,CAAC;AAClB,IAAA,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;IAEX,SAAS,CAAC,MAAK;QACd,aAAa,CAAC,MAAM,CAAC;QACrB,cAAc,CAAC,OAAO,CAAC;AACxB,IAAA,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;AAErB,IAAA,QACCA,IAAA,CAAA,OAAA,EAAA,EACC,SAAS,EAAE,UAAU,CACpB,iBAAiB,EACjB;AACC,YAAA,CAAC,cAAc,UAAU,CAAA,CAAE,GAAG,UAAU,KAAK,QAAQ;YACrD,QAAQ;AACR,SAAA,EACD,SAAS,CACT,EAAA,GACG,SAAS,EAAA,QAAA,EAAA,CAEbC,GAAA,CAAA,OAAA,EAAA,EACC,IAAI,EAAC,UAAU,EACf,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,UAAU,CAAC,kBAAkB,EAAE;AACzC,oBAAA,CAAC,cAAc,IAAI,CAAA,CAAE,GAAG,CAAC,MAAM;AAC/B,oBAAA,mBAAmB,EAAE,MAAM;iBAC3B,CAAC,EACF,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,YAAY,GACrB,EAED,YAAY,IACZ,QAAQ,CAAC,OAAO,EAAE,WAAW,CAAC,KAE9BA,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,iBAAiB,YAAE,QAAQ,IAAI,KAAK,EAAA,CAAQ,CAC5D,EAEA,WAAW,KACXD,IAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,oBAAoB,EAAA,QAAA,EAAA,CAAA,GAAA,EAAG,WAAW,CAAA,EAAA,CAAQ,CAC1D,CAAA,EAAA,CACM;AAEV;;;;"}
+{"version":3,"file":"item.js","sources":["../../../../packages/components/checkbox/item.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { ChangeEvent, useEffect, useState } from \"react\";\nimport { ICheckboxItem } from \"./type\";\n\nexport default function CheckboxItem(props: ICheckboxItem) {\n\tconst {\n\t\ttype = \"default\",\n\t\tlabel,\n\t\tname,\n\t\tvalue = false,\n\t\tclassName,\n\t\tstatus = \"normal\",\n\t\tmessage,\n\t\tdisabled,\n\t\tpartof,\n\t\toptionValue,\n\t\tchildren,\n\t\tonChange,\n\t\t...restProps\n\t} = props;\n\n\tconst [checked, setChecked] = useState(value);\n\tconst [itemStatus, setItemStatus] = useState(status);\n\tconst [itemMessage, setItemMessage] = useState(message);\n\tconst isChildrenFn = typeof children === \"function\";\n\n\tconst handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n\t\tconst next = e.target.checked;\n\t\tsetChecked(next);\n\t\tsetItemStatus(status);\n\t\tsetItemMessage(message);\n\t\tonChange?.(next, e);\n\t};\n\n\tuseEffect(() => {\n\t\tsetChecked(value);\n\t}, [value]);\n\n\tuseEffect(() => {\n\t\tsetItemStatus(status);\n\t\tsetItemMessage(message);\n\t}, [status, message]);\n\n\treturn (\n\t\t<label\n\t\t\tclassName={classNames(\n\t\t\t\t\"i-checkbox-item\",\n\t\t\t\t{\n\t\t\t\t\t[`i-checkbox-${itemStatus}`]: itemStatus !== \"normal\",\n\t\t\t\t\tdisabled,\n\t\t\t\t},\n\t\t\t\tclassName\n\t\t\t)}\n\t\t\t{...restProps}\n\t\t>\n\t\t\t<input\n\t\t\t\ttype='checkbox'\n\t\t\t\tname={name}\n\t\t\t\tclassName={classNames(\"i-checkbox-input\", {\n\t\t\t\t\t[`i-checkbox-${type}`]: !partof,\n\t\t\t\t\t\"i-checkbox-partof\": partof,\n\t\t\t\t})}\n\t\t\t\tchecked={checked}\n\t\t\t\tdisabled={disabled}\n\t\t\t\tonChange={handleChange}\n\t\t\t/>\n\n\t\t\t{isChildrenFn ? (\n\t\t\t\tchildren(checked, optionValue)\n\t\t\t) : (\n\t\t\t\t<span className='i-checkbox-text'>{children || label}</span>\n\t\t\t)}\n\n\t\t\t{itemMessage && (\n\t\t\t\t<span className='i-checkbox-message'>*{itemMessage}</span>\n\t\t\t)}\n\t\t</label>\n\t);\n}\n"],"names":["_jsxs","_jsx"],"mappings":";;;;AAIc,SAAU,YAAY,CAAC,KAAoB,EAAA;AACxD,IAAA,MAAM,EACL,IAAI,GAAG,SAAS,EAChB,KAAK,EACL,IAAI,EACJ,KAAK,GAAG,KAAK,EACb,SAAS,EACT,MAAM,GAAG,QAAQ,EACjB,OAAO,EACP,QAAQ,EACR,MAAM,EACN,WAAW,EACX,QAAQ,EACR,QAAQ,EACR,GAAG,SAAS,EACZ,GAAG,KAAK;IAET,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;IAC7C,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,MAAM,CAAC;IACpD,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,QAAQ,CAAC,OAAO,CAAC;AACvD,IAAA,MAAM,YAAY,GAAG,OAAO,QAAQ,KAAK,UAAU;AAEnD,IAAA,MAAM,YAAY,GAAG,CAAC,CAAgC,KAAI;AACzD,QAAA,MAAM,IAAI,GAAG,CAAC,CAAC,MAAM,CAAC,OAAO;QAC7B,UAAU,CAAC,IAAI,CAAC;QAChB,aAAa,CAAC,MAAM,CAAC;QACrB,cAAc,CAAC,OAAO,CAAC;AACvB,QAAA,QAAQ,GAAG,IAAI,EAAE,CAAC,CAAC;AACpB,IAAA,CAAC;IAED,SAAS,CAAC,MAAK;QACd,UAAU,CAAC,KAAK,CAAC;AAClB,IAAA,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;IAEX,SAAS,CAAC,MAAK;QACd,aAAa,CAAC,MAAM,CAAC;QACrB,cAAc,CAAC,OAAO,CAAC;AACxB,IAAA,CAAC,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;AAErB,IAAA,QACCA,IAAA,CAAA,OAAA,EAAA,EACC,SAAS,EAAE,UAAU,CACpB,iBAAiB,EACjB;AACC,YAAA,CAAC,cAAc,UAAU,CAAA,CAAE,GAAG,UAAU,KAAK,QAAQ;YACrD,QAAQ;AACR,SAAA,EACD,SAAS,CACT,EAAA,GACG,SAAS,EAAA,QAAA,EAAA,CAEbC,GAAA,CAAA,OAAA,EAAA,EACC,IAAI,EAAC,UAAU,EACf,IAAI,EAAE,IAAI,EACV,SAAS,EAAE,UAAU,CAAC,kBAAkB,EAAE;AACzC,oBAAA,CAAC,cAAc,IAAI,CAAA,CAAE,GAAG,CAAC,MAAM;AAC/B,oBAAA,mBAAmB,EAAE,MAAM;iBAC3B,CAAC,EACF,OAAO,EAAE,OAAO,EAChB,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,YAAY,GACrB,EAED,YAAY,IACZ,QAAQ,CAAC,OAAO,EAAE,WAAW,CAAC,KAE9BA,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,iBAAiB,YAAE,QAAQ,IAAI,KAAK,EAAA,CAAQ,CAC5D,EAEA,WAAW,KACXD,IAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAC,oBAAoB,EAAA,QAAA,EAAA,CAAA,GAAA,EAAG,WAAW,CAAA,EAAA,CAAQ,CAC1D,CAAA,EAAA,CACM;AAEV;;;;"}

package/lib/es/components/collapse/collapse.js.map

@@ -1 +1 @@
-{"version":3,"file":"collapse.js","sources":["../../../../packages/components/collapse/collapse.tsx"],"sourcesContent":["import { MinusRound, PlusRound } from \"@ricons/material\";\r\nimport classNames from \"classnames\";\r\nimport { Children, useMemo, useState } from \"react\";\r\nimport Helpericon from \"../utils/helpericon\";\r\nimport \"./index.css\";\r\nimport Item from \"./item\";\r\nimport { ICollapse, ICollapseItem, TKey } from \"./type\";\r\n\r\nconst Collapse = (props: ICollapse) => {\r\n\tconst {\r\n\t\tactive,\r\n\t\titems,\r\n\t\tmultiple,\r\n\t\tborder,\r\n\t\theaderClickable,\r\n\t\tclassName,\r\n\t\tchildren,\r\n\t\trenderToggle = (active: boolean) =>\r\n\t\t\tactive ? <MinusRound /> : <PlusRound />,\r\n\t\tonCollapse,\r\n\t\t...restProps\r\n\t} = props;\r\n\r\n\tconst [activeKey, setActiveKey] = useState(active);\r\n\r\n\tconst collapses = useMemo(() => {\r\n\t\tif (!items) {\r\n\t\t\tif (!children) return [];\r\n\r\n\t\t\treturn (\r\n\t\t\t\tChildren.map(children, (node, i) => {\r\n\t\t\t\t\tconst { key, props: nodeProps } = node as {\r\n\t\t\t\t\t\tkey?: TKey;\r\n\t\t\t\t\t\tprops?: any;\r\n\t\t\t\t\t};\r\n\t\t\t\t\tconst { title, children, content, disabled, ...restProps } =\r\n\t\t\t\t\t\tnodeProps;\r\n\r\n\t\t\t\t\treturn {\r\n\t\t\t\t\t\t...restProps,\r\n\t\t\t\t\t\tkey: key || i,\r\n\t\t\t\t\t\ttitle,\r\n\t\t\t\t\t\tcontent: children || content,\r\n\t\t\t\t\t\tdisabled,\r\n\t\t\t\t\t};\r\n\t\t\t\t}) || []\r\n\t\t\t);\r\n\t\t}\r\n\r\n\t\treturn items;\r\n\t}, [children]);\r\n\r\n\tconst handleHeaderClick = (item: ICollapseItem) => {\r\n\t\tif (!headerClickable) return;\r\n\r\n\t\thandleToggle(item);\r\n\t};\r\n\r\n\tconst handleToggle = (item: ICollapseItem, e?) => {\r\n\t\tconst { key, disabled } = item;\r\n\t\te?.stopPropagation();\r\n\t\tif (disabled) return;\r\n\r\n\t\tif (!multiple) {\r\n\t\t\tconst nextActive = activeKey === key ? undefined : key;\r\n\t\t\tsetActiveKey(nextActive);\r\n\t\t\tonCollapse?.(key as TKey, nextActive !== undefined);\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tconst group = Array.isArray(activeKey) ? [...activeKey] : [];\r\n\r\n\t\tconst i = group.findIndex((k) => k === key);\r\n\r\n\t\tif (i > -1) {\r\n\t\t\tgroup.splice(i, 1);\r\n\t\t} else {\r\n\t\t\tkey !== undefined && group.push(key);\r\n\t\t}\r\n\t\tsetActiveKey(group as any);\r\n\t\tonCollapse?.(key as TKey, i < 0);\r\n\t};\r\n\r\n\treturn (\r\n\t\t<div\r\n\t\t\tclassName={classNames(\r\n\t\t\t\t\"i-collapse\",\r\n\t\t\t\t{\r\n\t\t\t\t\t\"i-collapse-bordered\": border,\r\n\t\t\t\t},\r\n\t\t\t\tclassName\r\n\t\t\t)}\r\n\t\t\t{...restProps}\r\n\t\t>\r\n\t\t\t{collapses.map((item) => {\r\n\t\t\t\tconst {\r\n\t\t\t\t\tkey,\r\n\t\t\t\t\ttitle,\r\n\t\t\t\t\tcontent,\r\n\t\t\t\t\tdisabled,\r\n\t\t\t\t\tclassName,\r\n\t\t\t\t\t...restProps\r\n\t\t\t\t} = item;\r\n\t\t\t\tconst isActive = multiple\r\n\t\t\t\t\t? ((activeKey as TKey[]) || []).includes(key)\r\n\t\t\t\t\t: activeKey === key;\r\n\r\n\t\t\t\treturn (\r\n\t\t\t\t\t<div\r\n\t\t\t\t\t\tkey={key}\r\n\t\t\t\t\t\tclassName={classNames(\"i-collapse-item\", className, {\r\n\t\t\t\t\t\t\t\"i-collapse-active\": isActive,\r\n\t\t\t\t\t\t\t\"i-collapse-disabled\": disabled,\r\n\t\t\t\t\t\t})}\r\n\t\t\t\t\t\t{...restProps}\r\n\t\t\t\t\t>\r\n\t\t\t\t\t\t<div\r\n\t\t\t\t\t\t\tclassName='i-collapse-header'\r\n\t\t\t\t\t\t\tonClick={() => handleHeaderClick(item)}\r\n\t\t\t\t\t\t>\r\n\t\t\t\t\t\t\t{title}\r\n\r\n\t\t\t\t\t\t\t<Helpericon\r\n\t\t\t\t\t\t\t\tactive\r\n\t\t\t\t\t\t\t\tclassName='i-collapse-toggle'\r\n\t\t\t\t\t\t\t\ticon={renderToggle(isActive)}\r\n\t\t\t\t\t\t\t\tonClick={(e) => handleToggle(item, e)}\r\n\t\t\t\t\t\t\t/>\r\n\t\t\t\t\t\t</div>\r\n\r\n\t\t\t\t\t\t<div className='i-collapse-content'>{content}</div>\r\n\t\t\t\t\t</div>\r\n\t\t\t\t);\r\n\t\t\t})}\r\n\t\t</div>\r\n\t);\r\n};\r\n\r\nCollapse.Item = Item;\r\n\r\nexport default Collapse;\r\n"],"names":["_jsx","_jsxs"],"mappings":"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"}
+{"version":3,"file":"collapse.js","sources":["../../../../packages/components/collapse/collapse.tsx"],"sourcesContent":["import { MinusRound, PlusRound } from \"@ricons/material\";\nimport classNames from \"classnames\";\nimport { Children, useMemo, useState } from \"react\";\nimport Helpericon from \"../utils/helpericon\";\nimport \"./index.css\";\nimport Item from \"./item\";\nimport { ICollapse, ICollapseItem, TKey } from \"./type\";\n\nconst Collapse = (props: ICollapse) => {\n\tconst {\n\t\tactive,\n\t\titems,\n\t\tmultiple,\n\t\tborder,\n\t\theaderClickable,\n\t\tclassName,\n\t\tchildren,\n\t\trenderToggle = (active: boolean) =>\n\t\t\tactive ? <MinusRound /> : <PlusRound />,\n\t\tonCollapse,\n\t\t...restProps\n\t} = props;\n\n\tconst [activeKey, setActiveKey] = useState(active);\n\n\tconst collapses = useMemo(() => {\n\t\tif (!items) {\n\t\t\tif (!children) return [];\n\n\t\t\treturn (\n\t\t\t\tChildren.map(children, (node, i) => {\n\t\t\t\t\tconst { key, props: nodeProps } = node as {\n\t\t\t\t\t\tkey?: TKey;\n\t\t\t\t\t\tprops?: any;\n\t\t\t\t\t};\n\t\t\t\t\tconst { title, children, content, disabled, ...restProps } =\n\t\t\t\t\t\tnodeProps;\n\n\t\t\t\t\treturn {\n\t\t\t\t\t\t...restProps,\n\t\t\t\t\t\tkey: key || i,\n\t\t\t\t\t\ttitle,\n\t\t\t\t\t\tcontent: children || content,\n\t\t\t\t\t\tdisabled,\n\t\t\t\t\t};\n\t\t\t\t}) || []\n\t\t\t);\n\t\t}\n\n\t\treturn items;\n\t}, [children]);\n\n\tconst handleHeaderClick = (item: ICollapseItem) => {\n\t\tif (!headerClickable) return;\n\n\t\thandleToggle(item);\n\t};\n\n\tconst handleToggle = (item: ICollapseItem, e?) => {\n\t\tconst { key, disabled } = item;\n\t\te?.stopPropagation();\n\t\tif (disabled) return;\n\n\t\tif (!multiple) {\n\t\t\tconst nextActive = activeKey === key ? undefined : key;\n\t\t\tsetActiveKey(nextActive);\n\t\t\tonCollapse?.(key as TKey, nextActive !== undefined);\n\t\t\treturn;\n\t\t}\n\n\t\tconst group = Array.isArray(activeKey) ? [...activeKey] : [];\n\n\t\tconst i = group.findIndex((k) => k === key);\n\n\t\tif (i > -1) {\n\t\t\tgroup.splice(i, 1);\n\t\t} else {\n\t\t\tkey !== undefined && group.push(key);\n\t\t}\n\t\tsetActiveKey(group as any);\n\t\tonCollapse?.(key as TKey, i < 0);\n\t};\n\n\treturn (\n\t\t<div\n\t\t\tclassName={classNames(\n\t\t\t\t\"i-collapse\",\n\t\t\t\t{\n\t\t\t\t\t\"i-collapse-bordered\": border,\n\t\t\t\t},\n\t\t\t\tclassName\n\t\t\t)}\n\t\t\t{...restProps}\n\t\t>\n\t\t\t{collapses.map((item) => {\n\t\t\t\tconst {\n\t\t\t\t\tkey,\n\t\t\t\t\ttitle,\n\t\t\t\t\tcontent,\n\t\t\t\t\tdisabled,\n\t\t\t\t\tclassName,\n\t\t\t\t\t...restProps\n\t\t\t\t} = item;\n\t\t\t\tconst isActive = multiple\n\t\t\t\t\t? ((activeKey as TKey[]) || []).includes(key)\n\t\t\t\t\t: activeKey === key;\n\n\t\t\t\treturn (\n\t\t\t\t\t<div\n\t\t\t\t\t\tkey={key}\n\t\t\t\t\t\tclassName={classNames(\"i-collapse-item\", className, {\n\t\t\t\t\t\t\t\"i-collapse-active\": isActive,\n\t\t\t\t\t\t\t\"i-collapse-disabled\": disabled,\n\t\t\t\t\t\t})}\n\t\t\t\t\t\t{...restProps}\n\t\t\t\t\t>\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tclassName='i-collapse-header'\n\t\t\t\t\t\t\tonClick={() => handleHeaderClick(item)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t{title}\n\n\t\t\t\t\t\t\t<Helpericon\n\t\t\t\t\t\t\t\tactive\n\t\t\t\t\t\t\t\tclassName='i-collapse-toggle'\n\t\t\t\t\t\t\t\ticon={renderToggle(isActive)}\n\t\t\t\t\t\t\t\tonClick={(e) => handleToggle(item, e)}\n\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t</div>\n\n\t\t\t\t\t\t<div className='i-collapse-content'>{content}</div>\n\t\t\t\t\t</div>\n\t\t\t\t);\n\t\t\t})}\n\t\t</div>\n\t);\n};\n\nCollapse.Item = Item;\n\nexport default Collapse;\n"],"names":["_jsx","_jsxs"],"mappings":"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"}

package/lib/es/components/collapse/item.js.map

@@ -1 +1 @@
-{"version":3,"file":"item.js","sources":["../../../../packages/components/collapse/item.tsx"],"sourcesContent":["import { ICollapseItem } from \"./type\";\r\n\r\nexport default function Item(props: ICollapseItem) {\r\n\treturn <></>;\r\n}\r\n"],"names":["_jsx"],"mappings":";;AAEc,SAAU,IAAI,CAAC,KAAoB,EAAA;AAChD,IAAA,OAAOA,iBAAK;AACb;;;;"}
+{"version":3,"file":"item.js","sources":["../../../../packages/components/collapse/item.tsx"],"sourcesContent":["import { ICollapseItem } from \"./type\";\n\nexport default function Item(props: ICollapseItem) {\n\treturn <></>;\n}\n"],"names":["_jsx"],"mappings":";;AAEc,SAAU,IAAI,CAAC,KAAoB,EAAA;AAChD,IAAA,OAAOA,iBAAK;AACb;;;;"}

package/lib/es/components/datagrid/cell.js

@@ -1,5 +1,6 @@
 import { jsx } from 'react/jsx-runtime';
 import classNames from 'classnames';
+import { useMemo, useCallback } from 'react';
 
 function getCellStyle({ justify, col, row, colSpan = 1, rowSpan = 1, }) {
     const style = {
@@ -12,10 +13,12 @@ function getCellStyle({ justify, col, row, colSpan = 1, rowSpan = 1, }) {
 function Cell(props) {
     const { column, row, col, data, cellEllipsis, onCellClick, onCellDoubleClick, } = props;
     const { id, fixed, justify, rowSpan, render } = column;
-    const style = getCellStyle({ justify, col, row, rowSpan });
+    const style = useMemo(() => getCellStyle({ justify, col, row, rowSpan }), [col, fixed, justify, row, rowSpan]);
+    const handleClick = useCallback((e) => onCellClick?.(data, column, row, col, e), [col, column, data, onCellClick, row]);
+    const handleDoubleClick = useCallback((e) => onCellDoubleClick?.(data, column, row, col, e), [col, column, data, onCellDoubleClick, row]);
     return (jsx("div", { className: classNames("i-datagrid-cell", {
             [`i-datagrid-cell-fixed-${fixed}`]: fixed,
-        }), "data-col": id, style: style, onClick: (e) => onCellClick?.(data, column, row, col, e), onDoubleClick: (e) => onCellDoubleClick?.(data, column, row, col, e), children: render?.(data[id], data, row, col) ?? (jsx("div", { className: classNames("i-datagrid-cell-content", {
+        }), "data-col": id, style: style, onClick: handleClick, onDoubleClick: handleDoubleClick, children: render?.(data[id], data, row, col) ?? (jsx("div", { className: classNames("i-datagrid-cell-content", {
                 "i-datagrid-cell-content-ellipsis": cellEllipsis,
             }), children: data[id] })) }));
 }

package/lib/es/components/datagrid/cell.js.map

@@ -1 +1 @@
-{"version":3,"file":"cell.js","sources":["../../../../packages/components/datagrid/cell.tsx"],"sourcesContent":["import classNames from \"classnames\";\r\nimport { ICell, IColumn } from \"./type\";\r\n\r\nexport function getCellStyle({\r\n\tjustify,\r\n\tcol,\r\n\trow,\r\n\tcolSpan = 1,\r\n\trowSpan = 1,\r\n}: Pick<IColumn, \"justify\" | \"fixed\"> & {\r\n\tcol: number;\r\n\trow: number;\r\n\tcolSpan?: number;\r\n\trowSpan?: number;\r\n\tisHeader?: boolean;\r\n}) {\r\n\tconst style = {\r\n\t\t\"--datagrid-justify\": justify,\r\n\t\tgridArea: `${row + 1} / ${col + 1} / ${row + 1 + rowSpan} / ${\r\n\t\t\tcol + 1 + colSpan\r\n\t\t}`,\r\n\t\tinsetInline: `var(--datagrid-cell-inset-${col})`,\r\n\t};\r\n\r\n\treturn style;\r\n}\r\n\r\nexport function Cell(props: ICell) {\r\n\tconst {\r\n\t\tcolumn,\r\n\t\trow,\r\n\t\tcol,\r\n\t\tdata,\r\n\t\tcellEllipsis,\r\n\t\tonCellClick,\r\n\t\tonCellDoubleClick,\r\n\t} = props;\r\n\tconst { id, fixed, justify, rowSpan, render } = column;\r\n\tconst style = getCellStyle({ justify, fixed, col, row, rowSpan });\r\n\r\n\treturn (\r\n\t\t<div\r\n\t\t\tclassName={classNames(\"i-datagrid-cell\", {\r\n\t\t\t\t[`i-datagrid-cell-fixed-${fixed}`]: fixed,\r\n\t\t\t})}\r\n\t\t\tdata-col={id}\r\n\t\t\tstyle={style}\r\n\t\t\tonClick={(e) => onCellClick?.(data, column, row, col, e)}\r\n\t\t\tonDoubleClick={(e) =>\r\n\t\t\t\tonCellDoubleClick?.(data, column, row, col, e)\r\n\t\t\t}\r\n\t\t>\r\n\t\t\t{render?.(data[id], data, row, col) ?? (\r\n\t\t\t\t<div\r\n\t\t\t\t\tclassName={classNames(\"i-datagrid-cell-content\", {\r\n\t\t\t\t\t\t\"i-datagrid-cell-content-ellipsis\": cellEllipsis,\r\n\t\t\t\t\t})}\r\n\t\t\t\t>\r\n\t\t\t\t\t{data[id]}\r\n\t\t\t\t</div>\r\n\t\t\t)}\r\n\t\t</div>\r\n\t);\r\n}\r\n"],"names":["_jsx"],"mappings":";;;SAGgB,YAAY,CAAC,EAC5B,OAAO,EACP,GAAG,EACH,GAAG,EACH,OAAO,GAAG,CAAC,EACX,OAAO,GAAG,CAAC,GAOX,EAAA;AACA,IAAA,MAAM,KAAK,GAAG;AACb,QAAA,oBAAoB,EAAE,OAAO;QAC7B,QAAQ,EAAE,GAAG,GAAG,GAAG,CAAC,CAAA,GAAA,EAAM,GAAG,GAAG,CAAC,CAAA,GAAA,EAAM,GAAG,GAAG,CAAC,GAAG,OAAO,CAAA,GAAA,EACvD,GAAG,GAAG,CAAC,GAAG,OACX,CAAA,CAAE;QACF,WAAW,EAAE,CAAA,0BAAA,EAA6B,GAAG,CAAA,CAAA,CAAG;KAChD;AAED,IAAA,OAAO,KAAK;AACb;AAEM,SAAU,IAAI,CAAC,KAAY,EAAA;AAChC,IAAA,MAAM,EACL,MAAM,EACN,GAAG,EACH,GAAG,EACH,IAAI,EACJ,YAAY,EACZ,WAAW,EACX,iBAAiB,GACjB,GAAG,KAAK;AACT,IAAA,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,MAAM;AACtD,IAAA,MAAM,KAAK,GAAG,YAAY,CAAC,EAAE,OAAO,EAAS,GAAG,EAAE,GAAG,EAAE,OAAO,EAAE,CAAC;AAEjE,IAAA,QACCA,GAAA,CAAA,KAAA,EAAA,EACC,SAAS,EAAE,UAAU,CAAC,iBAAiB,EAAE;AACxC,YAAA,CAAC,CAAA,sBAAA,EAAyB,KAAK,CAAA,CAAE,GAAG,KAAK;AACzC,SAAA,CAAC,EAAA,UAAA,EACQ,EAAE,EACZ,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,CAAC,CAAC,KAAK,WAAW,GAAG,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC,EACxD,aAAa,EAAE,CAAC,CAAC,KAChB,iBAAiB,GAAG,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC,EAAA,QAAA,EAG9C,MAAM,GAAG,IAAI,CAAC,EAAE,CAAC,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,CAAC,KAClCA,aACC,SAAS,EAAE,UAAU,CAAC,yBAAyB,EAAE;AAChD,gBAAA,kCAAkC,EAAE,YAAY;aAChD,CAAC,EAAA,QAAA,EAED,IAAI,CAAC,EAAE,CAAC,EAAA,CACJ,CACN,EAAA,CACI;AAER;;;;"}
+{"version":3,"file":"cell.js","sources":["../../../../packages/components/datagrid/cell.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport { useCallback, useMemo } from \"react\";\nimport { ICell, IColumn } from \"./type\";\n\nexport function getCellStyle({\n\tjustify,\n\tcol,\n\trow,\n\tcolSpan = 1,\n\trowSpan = 1,\n}: Pick<IColumn, \"justify\" | \"fixed\"> & {\n\tcol: number;\n\trow: number;\n\tcolSpan?: number;\n\trowSpan?: number;\n\tisHeader?: boolean;\n}) {\n\tconst style = {\n\t\t\"--datagrid-justify\": justify,\n\t\tgridArea: `${row + 1} / ${col + 1} / ${row + 1 + rowSpan} / ${\n\t\t\tcol + 1 + colSpan\n\t\t}`,\n\t\tinsetInline: `var(--datagrid-cell-inset-${col})`,\n\t};\n\n\treturn style;\n}\n\nexport function Cell(props: ICell) {\n\tconst {\n\t\tcolumn,\n\t\trow,\n\t\tcol,\n\t\tdata,\n\t\tcellEllipsis,\n\t\tonCellClick,\n\t\tonCellDoubleClick,\n\t} = props;\n\tconst { id, fixed, justify, rowSpan, render } = column;\n\tconst style = useMemo(\n\t\t() => getCellStyle({ justify, fixed, col, row, rowSpan }),\n\t\t[col, fixed, justify, row, rowSpan],\n\t);\n\n\tconst handleClick = useCallback(\n\t\t(e: any) => onCellClick?.(data, column, row, col, e),\n\t\t[col, column, data, onCellClick, row],\n\t);\n\tconst handleDoubleClick = useCallback(\n\t\t(e: any) => onCellDoubleClick?.(data, column, row, col, e),\n\t\t[col, column, data, onCellDoubleClick, row],\n\t);\n\n\treturn (\n\t\t<div\n\t\t\tclassName={classNames(\"i-datagrid-cell\", {\n\t\t\t\t[`i-datagrid-cell-fixed-${fixed}`]: fixed,\n\t\t\t})}\n\t\t\tdata-col={id}\n\t\t\tstyle={style}\n\t\t\tonClick={handleClick}\n\t\t\tonDoubleClick={handleDoubleClick}\n\t\t>\n\t\t\t{render?.(data[id], data, row, col) ?? (\n\t\t\t\t<div\n\t\t\t\t\tclassName={classNames(\"i-datagrid-cell-content\", {\n\t\t\t\t\t\t\"i-datagrid-cell-content-ellipsis\": cellEllipsis,\n\t\t\t\t\t})}\n\t\t\t\t>\n\t\t\t\t\t{data[id]}\n\t\t\t\t</div>\n\t\t\t)}\n\t\t</div>\n\t);\n}\n"],"names":["_jsx"],"mappings":";;;;SAIgB,YAAY,CAAC,EAC5B,OAAO,EACP,GAAG,EACH,GAAG,EACH,OAAO,GAAG,CAAC,EACX,OAAO,GAAG,CAAC,GAOX,EAAA;AACA,IAAA,MAAM,KAAK,GAAG;AACb,QAAA,oBAAoB,EAAE,OAAO;QAC7B,QAAQ,EAAE,GAAG,GAAG,GAAG,CAAC,CAAA,GAAA,EAAM,GAAG,GAAG,CAAC,CAAA,GAAA,EAAM,GAAG,GAAG,CAAC,GAAG,OAAO,CAAA,GAAA,EACvD,GAAG,GAAG,CAAC,GAAG,OACX,CAAA,CAAE;QACF,WAAW,EAAE,CAAA,0BAAA,EAA6B,GAAG,CAAA,CAAA,CAAG;KAChD;AAED,IAAA,OAAO,KAAK;AACb;AAEM,SAAU,IAAI,CAAC,KAAY,EAAA;AAChC,IAAA,MAAM,EACL,MAAM,EACN,GAAG,EACH,GAAG,EACH,IAAI,EACJ,YAAY,EACZ,WAAW,EACX,iBAAiB,GACjB,GAAG,KAAK;AACT,IAAA,MAAM,EAAE,EAAE,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,MAAM,EAAE,GAAG,MAAM;AACtD,IAAA,MAAM,KAAK,GAAG,OAAO,CACpB,MAAM,YAAY,CAAC,EAAE,OAAO,EAAS,GAAG,EAAE,GAAG,EAAE,OAAO,EAAE,CAAC,EACzD,CAAC,GAAG,EAAE,KAAK,EAAE,OAAO,EAAE,GAAG,EAAE,OAAO,CAAC,CACnC;AAED,IAAA,MAAM,WAAW,GAAG,WAAW,CAC9B,CAAC,CAAM,KAAK,WAAW,GAAG,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC,EACpD,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,WAAW,EAAE,GAAG,CAAC,CACrC;AACD,IAAA,MAAM,iBAAiB,GAAG,WAAW,CACpC,CAAC,CAAM,KAAK,iBAAiB,GAAG,IAAI,EAAE,MAAM,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC,EAC1D,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,iBAAiB,EAAE,GAAG,CAAC,CAC3C;AAED,IAAA,QACCA,GAAA,CAAA,KAAA,EAAA,EACC,SAAS,EAAE,UAAU,CAAC,iBAAiB,EAAE;AACxC,YAAA,CAAC,CAAA,sBAAA,EAAyB,KAAK,CAAA,CAAE,GAAG,KAAK;AACzC,SAAA,CAAC,cACQ,EAAE,EACZ,KAAK,EAAE,KAAK,EACZ,OAAO,EAAE,WAAW,EACpB,aAAa,EAAE,iBAAiB,EAAA,QAAA,EAE/B,MAAM,GAAG,IAAI,CAAC,EAAE,CAAC,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,CAAC,KAClCA,GAAA,CAAA,KAAA,EAAA,EACC,SAAS,EAAE,UAAU,CAAC,yBAAyB,EAAE;AAChD,gBAAA,kCAAkC,EAAE,YAAY;aAChD,CAAC,EAAA,QAAA,EAED,IAAI,CAAC,EAAE,CAAC,EAAA,CACJ,CACN,EAAA,CACI;AAER;;;;"}

package/lib/es/components/datagrid/datagrid.js

@@ -1,68 +1,90 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
-import { useReactive } from '../../js/hooks.js';
 import classNames from 'classnames';
-import { useRef, useMemo, useEffect } from 'react';
+import { useRef, useEffect, useMemo, useCallback } from 'react';
+import { useReactive } from '../../js/hooks.js';
 import { getNextSorter } from '../../js/utils.js';
 import Loading from '../loading/loading.js';
 import Empty from '../utils/empty/index.js';
+import { buildGridTemplateColumns, buildCssWidths, applyFixedInsets } from './helper.js';
 import Row, { Header } from './row.js';
+import VirtualDatagrid from './virtual.js';
 
 const Datagrid = (props) => {
-    const { data = [], columns = [], border, striped, header = true, resizable, cellPadding = ".5em", cellEllipsis, empty = jsx(Empty, {}), loading, height = "unset", style, className, renderLoading = () => (jsx(Loading, { size: '1.5em', className: 'color-3', absolute: true })), onCellClick, onRowClick, onCellDoubleClick, onHeaderClick, onSort, onScroll, onResize, } = props;
+    const { data = [], columns = [], border, striped, header = true, resizable, cellPadding = ".5em", cellEllipsis, empty = jsx(Empty, {}), loading, height = "unset", style, className, rowKey, virtual, renderLoading = () => (jsx(Loading, { size: '1.5em', className: 'color-3', absolute: true })), onCellClick, onRowClick, onCellDoubleClick, onHeaderClick, onSort, onScroll, onResize, } = props;
     const container = useRef(null);
+    const wrapRef = useRef(null);
     const state = useReactive({
         rows: data,
         widths: columns.map((col) => col.width ?? "min-content"),
         sortBy: "",
         sortType: "",
     });
+    const previewRef = useRef({ index: -1, width: -1, template: "" });
+    useEffect(() => {
+        const next = columns.map((col, i) => {
+            if (col.width != null)
+                return col.width;
+            return state.widths[i] ?? "min-content";
+        });
+        let changed = next.length !== state.widths.length;
+        if (!changed) {
+            for (let i = 0; i < next.length; i++) {
+                if (next[i] !== state.widths[i]) {
+                    changed = true;
+                    break;
+                }
+            }
+        }
+        if (changed)
+            state.widths = next;
+    }, [columns, state]);
     const styles = useMemo(() => {
         const { widths } = state;
         const o = {
             ...style,
-            "--grid-template-columns": widths
-                .map((w) => {
-                return typeof w === "number" ? `${w}px` : w;
-            })
-                .join(" "),
+            "--grid-template-columns": buildGridTemplateColumns(widths),
         };
         if (!resizable)
             return o;
-        const fws = columns.map((col, i) => {
-            const { fixed } = col;
-            if (!fixed)
-                return 0;
-            return widths[i];
-        });
-        columns.map((col, i) => {
-            const { fixed } = col;
-            if (!fixed)
+        const cssWidths = buildCssWidths(widths);
+        applyFixedInsets((k, v) => {
+            o[k] = v;
+        }, columns, cssWidths);
+        return o;
+    }, [columns, resizable, state.widths, style]);
+    const handleWidthChange = useCallback((i, w, phase = "commit") => {
+        if (!resizable)
+            return;
+        if (phase === "preview") {
+            const el = wrapRef.current;
+            if (!el)
+                return;
+            if (previewRef.current.index === i &&
+                previewRef.current.width === w) {
                 return;
-            if (i === 0) {
-                o[`--datagrid-cell-inset-0`] = 0;
-            }
-            else if (i === fws.length - 1) {
-                o[`--datagrid-cell-inset-${fws.length - 1}`] = "auto 0";
             }
-            else {
-                const isLeft = fixed === "left";
-                const before = isLeft ? fws.slice(0, i) : fws.slice(i + 1);
-                const sum = before.reduce((pre, cur) => pre + cur) + "px";
-                const result = isLeft ? `${sum} auto` : `auto ${sum}`;
-                o[`--datagrid-cell-inset-${i}`] = result;
+            const template = buildGridTemplateColumns(state.widths, i, w);
+            if (previewRef.current.template !== template) {
+                el.style.setProperty("--grid-template-columns", template);
+                const cssWidths = buildCssWidths(state.widths, i, w);
+                applyFixedInsets((k, v) => el.style.setProperty(k, v), columns, cssWidths);
+                previewRef.current.template = template;
             }
-        });
-        return o;
-    }, [state.widths, resizable]);
-    const handleWidthChange = (i, w) => {
-        if (!resizable)
+            previewRef.current.index = i;
+            previewRef.current.width = w;
             return;
-        const [...ws] = state.widths;
-        ws[i] = w;
-        state.widths = ws;
+        }
+        previewRef.current.index = -1;
+        previewRef.current.width = -1;
+        previewRef.current.template = "";
+        if (state.widths[i] === w)
+            return;
+        const next = [...state.widths];
+        next[i] = w;
+        state.widths = next;
         onResize?.(columns[i], w);
-    };
-    const handleHeaderClick = (column, e) => {
+    }, [columns, onResize, resizable, state, wrapRef]);
+    const handleHeaderClick = useCallback((column, e) => {
         if (column?.sorter) {
             const [sortBy, sortType] = getNextSorter(state.sortBy, state.sortType, column.id);
             Object.assign(state, {
@@ -72,7 +94,7 @@ const Datagrid = (props) => {
             onSort?.(sortBy, sortType);
         }
         onHeaderClick?.(column, e);
-    };
+    }, [onHeaderClick, onSort, state]);
     const rows = useMemo(() => {
         const { sortBy, sortType } = state;
         if (sortBy && !onSort) {
@@ -85,28 +107,104 @@ const Datagrid = (props) => {
         }
         return data;
     }, [data, columns, state.sortBy, state.sortType]);
+    const useVirtual = useMemo(() => {
+        if (!virtual)
+            return false;
+        const rowHeight = virtual.rowHeight;
+        return !!rowHeight && rowHeight > 0;
+    }, [virtual]);
     useEffect(() => {
+        if (!resizable)
+            return;
         if (!container.current)
             return;
-        const { current: div } = container;
-        const tds = div.querySelector(".i-datagrid-row")?.children;
-        if (!tds?.length)
+        if (!columns.some((col, i) => col.width == null && typeof state.widths[i] !== "number")) {
             return;
-        state.widths = Array.from(tds).map((node) => node.offsetWidth);
-    }, [columns, resizable]);
+        }
+        let rafId = null;
+        let tries = 0;
+        const run = () => {
+            rafId = null;
+            const div = container.current;
+            if (!div)
+                return;
+            const headerRow = div.querySelector(".i-datagrid-header.i-datagrid-row");
+            const bodyRow = div.querySelector(".i-datagrid-row:not(.i-datagrid-header)");
+            const headerCells = headerRow ? Array.from(headerRow.children) : [];
+            const bodyCells = bodyRow ? Array.from(bodyRow.children) : [];
+            const cellCount = Math.max(headerCells.length, bodyCells.length);
+            if (cellCount < 1) {
+                tries++;
+                if (tries < 10)
+                    rafId = requestAnimationFrame(run);
+                return;
+            }
+            const measured = new Array(cellCount).fill(null);
+            for (let i = 0; i < cellCount; i++) {
+                const hw = headerCells[i]
+                    ?.offsetWidth;
+                const bw = bodyCells[i]
+                    ?.offsetWidth;
+                const w = Math.max(hw ?? 0, bw ?? 0);
+                measured[i] = w > 0 ? w : null;
+            }
+            const next = columns.map((col, i) => {
+                if (col.width != null)
+                    return col.width;
+                const cur = state.widths[i];
+                if (typeof cur === "number")
+                    return cur;
+                return measured[i] ?? cur ?? "min-content";
+            });
+            let changed = next.length !== state.widths.length;
+            if (!changed) {
+                for (let i = 0; i < next.length; i++) {
+                    if (next[i] !== state.widths[i]) {
+                        changed = true;
+                        break;
+                    }
+                }
+            }
+            if (changed)
+                state.widths = next;
+        };
+        rafId = requestAnimationFrame(run);
+        return () => {
+            if (rafId != null)
+                cancelAnimationFrame(rafId);
+        };
+    }, [columns, resizable, state, useVirtual]);
     useEffect(() => {
-        loading && container.current?.scrollTo({ top: 0, left: 0 });
-    }, [loading]);
-    const mergedStyle = {
+        if (!loading)
+            return;
+        if (useVirtual)
+            return;
+        container.current?.scrollTo({ top: 0, left: 0 });
+    }, [loading, useVirtual]);
+    const mergedStyle = useMemo(() => ({
         "--cell-padding": cellPadding,
         ...styles,
-    };
-    return (jsxs("div", { style: { maxHeight: height, ...mergedStyle }, className: classNames("i-datagrid-container", className, {
+    }), [cellPadding, styles]);
+    const getRowKey = useMemo(() => {
+        if (typeof rowKey === "function")
+            return rowKey;
+        if (typeof rowKey === "string") {
+            return (row) => row?.[rowKey];
+        }
+        return (_row, index) => index;
+    }, [rowKey]);
+    return (jsxs("div", { ref: wrapRef, style: {
+            maxHeight: height,
+            ...(useVirtual
+                ? { overflowX: "visible", overflowY: "hidden" }
+                : null),
+            ...mergedStyle,
+        }, className: classNames("i-datagrid-container", className, {
             "i-datagrid-bordered": border,
             "i-datagrid-striped": striped,
-        }), children: [jsxs("div", { ref: container, className: classNames("i-datagrid", {
+        }), children: [useVirtual && virtual ? (jsx(VirtualDatagrid, { virtual: virtual, columns: columns, rows: rows, header: header, sortBy: state.sortBy, sortType: state.sortType, height: height, loading: loading, resizable: resizable, striped: striped, cellEllipsis: cellEllipsis, empty: empty, wrapRef: wrapRef, containerRef: container, getRowKey: getRowKey, onHeaderClick: handleHeaderClick, onWidthChange: handleWidthChange, onRowClick: onRowClick, onCellClick: onCellClick, onCellDoubleClick: onCellDoubleClick, onScroll: onScroll })) : (jsxs("div", { ref: container, className: classNames("i-datagrid", {
                     "i-datagrid-loading": loading,
-                }), onWheel: onScroll, children: [header && (jsx(Header, { columns: columns, resizable: resizable, sortType: state.sortType, sortBy: state.sortBy, cellEllipsis: cellEllipsis, onWidthChange: handleWidthChange, onHeaderClick: handleHeaderClick })), rows.map((row, i) => (jsx(Row, { row: i + (header ? 1 : 0), data: row, cellEllipsis: cellEllipsis, columns: columns, onCellClick: onCellClick, onRowClick: onRowClick, onCellDoubleClick: onCellDoubleClick }, i))), rows.length < 1 && empty] }), loading && renderLoading()] }));
+                }), onWheel: onScroll, children: [header && (jsx(Header, { columns: columns, resizable: resizable, sortType: state.sortType, sortBy: state.sortBy, cellEllipsis: cellEllipsis, onWidthChange: handleWidthChange, onHeaderClick: handleHeaderClick })), rows.map((row, i) => (jsx(Row, { row: i + (header ? 1 : 0), data: row, cellEllipsis: cellEllipsis, columns: columns, onCellClick: onCellClick, onRowClick: onRowClick, onCellDoubleClick: onCellDoubleClick }, getRowKey(row, i) ?? i))), rows.length < 1 && empty] })), loading && renderLoading()] }));
 };
 
 export { Datagrid as default };

package/lib/es/components/datagrid/datagrid.js.map

@@ -1 +1 @@
-{"version":3,"file":"datagrid.js","sources":["../../../../packages/components/datagrid/datagrid.tsx"],"sourcesContent":["import { useReactive } from \"../../js/hooks\";\r\nimport classNames from \"classnames\";\r\nimport { CSSProperties, MouseEvent, useEffect, useMemo, useRef } from \"react\";\r\nimport { getNextSorter } from \"../../js/utils\";\r\nimport Loading from \"../loading\";\r\nimport Empty from \"../utils/empty\";\r\nimport \"./index.css\";\r\nimport Row, { Header } from \"./row\";\r\nimport type { IColumn, IData, IDatagrid, TDatagridState } from \"./type\";\r\n\r\nconst Datagrid = (props: IDatagrid) => {\r\n\tconst {\r\n\t\tdata = [],\r\n\t\tcolumns = [],\r\n\t\tborder,\r\n\t\tstriped,\r\n\t\theader = true,\r\n\t\tresizable,\r\n\t\tcellPadding = \".5em\",\r\n\t\tcellEllipsis,\r\n\t\tempty = <Empty />,\r\n\t\tloading,\r\n\t\theight = \"unset\",\r\n\t\tstyle,\r\n\t\tclassName,\r\n\t\trenderLoading = () => (\r\n\t\t\t<Loading size='1.5em' className='color-3' absolute />\r\n\t\t),\r\n\t\tonCellClick,\r\n\t\tonRowClick,\r\n\t\tonCellDoubleClick,\r\n\t\tonHeaderClick,\r\n\t\tonSort,\r\n\t\tonScroll,\r\n\t\tonResize,\r\n\t} = props;\r\n\r\n\tconst container = useRef<HTMLDivElement>(null);\r\n\tconst state = useReactive<TDatagridState>({\r\n\t\trows: data,\r\n\t\twidths: columns.map((col) => col.width ?? \"min-content\"),\r\n\t\tsortBy: \"\",\r\n\t\tsortType: \"\",\r\n\t});\r\n\r\n\tconst styles = useMemo(() => {\r\n\t\tconst { widths } = state;\r\n\r\n\t\tconst o = {\r\n\t\t\t...style,\r\n\t\t\t\"--grid-template-columns\": widths\r\n\t\t\t\t.map((w) => {\r\n\t\t\t\t\treturn typeof w === \"number\" ? `${w}px` : w;\r\n\t\t\t\t})\r\n\t\t\t\t.join(\" \"),\r\n\t\t};\r\n\r\n\t\tif (!resizable) return o;\r\n\r\n\t\tconst fws = columns.map((col, i) => {\r\n\t\t\tconst { fixed } = col;\r\n\t\t\tif (!fixed) return 0;\r\n\t\t\treturn widths[i] as number;\r\n\t\t});\r\n\r\n\t\tcolumns.map((col, i) => {\r\n\t\t\tconst { fixed } = col;\r\n\t\t\tif (!fixed) return;\r\n\t\t\tif (i === 0) {\r\n\t\t\t\to[`--datagrid-cell-inset-0`] = 0;\r\n\t\t\t} else if (i === fws.length - 1) {\r\n\t\t\t\to[`--datagrid-cell-inset-${fws.length - 1}`] = \"auto 0\";\r\n\t\t\t} else {\r\n\t\t\t\tconst isLeft = fixed === \"left\";\r\n\t\t\t\tconst before = isLeft ? fws.slice(0, i) : fws.slice(i + 1);\r\n\t\t\t\tconst sum = before.reduce((pre, cur) => pre + cur) + \"px\";\r\n\t\t\t\tconst result = isLeft ? `${sum} auto` : `auto ${sum}`;\r\n\t\t\t\to[`--datagrid-cell-inset-${i}`] = result;\r\n\t\t\t}\r\n\t\t});\r\n\r\n\t\treturn o;\r\n\t}, [state.widths, resizable]);\r\n\r\n\tconst handleWidthChange = (i: number, w: number) => {\r\n\t\tif (!resizable) return;\r\n\r\n\t\tconst [...ws] = state.widths;\r\n\t\tws[i] = w;\r\n\t\tstate.widths = ws;\r\n\t\tonResize?.(columns[i], w);\r\n\t};\r\n\r\n\tconst handleHeaderClick = (column?: IColumn, e?: MouseEvent) => {\r\n\t\tif (column?.sorter) {\r\n\t\t\tconst [sortBy, sortType] = getNextSorter(\r\n\t\t\t\tstate.sortBy,\r\n\t\t\t\tstate.sortType,\r\n\t\t\t\tcolumn.id\r\n\t\t\t);\r\n\r\n\t\t\tObject.assign(state, {\r\n\t\t\t\tsortBy,\r\n\t\t\t\tsortType,\r\n\t\t\t});\r\n\r\n\t\t\tonSort?.(sortBy, sortType);\r\n\t\t}\r\n\r\n\t\tonHeaderClick?.(column, e);\r\n\t};\r\n\r\n\tconst rows = useMemo(() => {\r\n\t\tconst { sortBy, sortType } = state;\r\n\r\n\t\tif (sortBy && !onSort) {\r\n\t\t\tconst sorter = columns.find((col) => col.id === sortBy)?.sorter;\r\n\t\t\tconst sortFn =\r\n\t\t\t\ttypeof sorter === \"function\"\r\n\t\t\t\t\t? sorter\r\n\t\t\t\t\t: (a: IData, b: IData) => b[sortBy] - a[sortBy];\r\n\t\t\tconst sorted = [...data].sort(sortFn);\r\n\r\n\t\t\treturn sortType === \"desc\" ? sorted : sorted.reverse();\r\n\t\t}\r\n\r\n\t\treturn data;\r\n\t}, [data, columns, state.sortBy, state.sortType]);\r\n\r\n\tuseEffect(() => {\r\n\t\tif (!container.current) return;\r\n\t\tconst { current: div } = container;\r\n\t\tconst tds = div.querySelector(\".i-datagrid-row\")?.children;\r\n\t\tif (!tds?.length) return;\r\n\t\tstate.widths = Array.from(tds).map((node: any) => node.offsetWidth);\r\n\t}, [columns, resizable]);\r\n\r\n\tuseEffect(() => {\r\n\t\tloading && container.current?.scrollTo({ top: 0, left: 0 });\r\n\t}, [loading]);\r\n\r\n\tconst mergedStyle = {\r\n\t\t\"--cell-padding\": cellPadding,\r\n\t\t...styles,\r\n\t} as CSSProperties;\r\n\r\n\treturn (\r\n\t\t<div\r\n\t\t\tstyle={{ maxHeight: height, ...mergedStyle }}\r\n\t\t\tclassName={classNames(\"i-datagrid-container\", className, {\r\n\t\t\t\t\"i-datagrid-bordered\": border,\r\n\t\t\t\t\"i-datagrid-striped\": striped,\r\n\t\t\t})}\r\n\t\t>\r\n\t\t\t<div\r\n\t\t\t\tref={container}\r\n\t\t\t\tclassName={classNames(\"i-datagrid\", {\r\n\t\t\t\t\t\"i-datagrid-loading\": loading,\r\n\t\t\t\t})}\r\n\t\t\t\tonWheel={onScroll}\r\n\t\t\t>\r\n\t\t\t\t{header && (\r\n\t\t\t\t\t<Header\r\n\t\t\t\t\t\tcolumns={columns}\r\n\t\t\t\t\t\tresizable={resizable}\r\n\t\t\t\t\t\tsortType={state.sortType}\r\n\t\t\t\t\t\tsortBy={state.sortBy}\r\n\t\t\t\t\t\tcellEllipsis={cellEllipsis}\r\n\t\t\t\t\t\tonWidthChange={handleWidthChange}\r\n\t\t\t\t\t\tonHeaderClick={handleHeaderClick}\r\n\t\t\t\t\t/>\r\n\t\t\t\t)}\r\n\r\n\t\t\t\t{rows.map((row, i) => (\r\n\t\t\t\t\t<Row\r\n\t\t\t\t\t\tkey={i}\r\n\t\t\t\t\t\trow={i + (header ? 1 : 0)}\r\n\t\t\t\t\t\tdata={row}\r\n\t\t\t\t\t\tcellEllipsis={cellEllipsis}\r\n\t\t\t\t\t\tcolumns={columns}\r\n\t\t\t\t\t\tonCellClick={onCellClick}\r\n\t\t\t\t\t\tonRowClick={onRowClick}\r\n\t\t\t\t\t\tonCellDoubleClick={onCellDoubleClick}\r\n\t\t\t\t\t/>\r\n\t\t\t\t))}\r\n\r\n\t\t\t\t{rows.length < 1 && empty}\r\n\t\t\t</div>\r\n\r\n\t\t\t{loading && renderLoading()}\r\n\t\t</div>\r\n\t);\r\n};\r\n\r\nexport default Datagrid;\r\n"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;;;AAUA,MAAM,QAAQ,GAAG,CAAC,KAAgB,KAAI;AACrC,IAAA,MAAM,EACL,IAAI,GAAG,EAAE,EACT,OAAO,GAAG,EAAE,EACZ,MAAM,EACN,OAAO,EACP,MAAM,GAAG,IAAI,EACb,SAAS,EACT,WAAW,GAAG,MAAM,EACpB,YAAY,EACZ,KAAK,GAAGA,GAAA,CAAC,KAAK,EAAA,EAAA,CAAG,EACjB,OAAO,EACP,MAAM,GAAG,OAAO,EAChB,KAAK,EACL,SAAS,EACT,aAAa,GAAG,OACfA,GAAA,CAAC,OAAO,EAAA,EAAC,IAAI,EAAC,OAAO,EAAC,SAAS,EAAC,SAAS,EAAC,QAAQ,EAAA,IAAA,EAAA,CAAG,CACrD,EACD,WAAW,EACX,UAAU,EACV,iBAAiB,EACjB,aAAa,EACb,MAAM,EACN,QAAQ,EACR,QAAQ,GACR,GAAG,KAAK;AAET,IAAA,MAAM,SAAS,GAAG,MAAM,CAAiB,IAAI,CAAC;IAC9C,MAAM,KAAK,GAAG,WAAW,CAAiB;AACzC,QAAA,IAAI,EAAE,IAAI;AACV,QAAA,MAAM,EAAE,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,KAAK,IAAI,aAAa,CAAC;AACxD,QAAA,MAAM,EAAE,EAAE;AACV,QAAA,QAAQ,EAAE,EAAE;AACZ,KAAA,CAAC;AAEF,IAAA,MAAM,MAAM,GAAG,OAAO,CAAC,MAAK;AAC3B,QAAA,MAAM,EAAE,MAAM,EAAE,GAAG,KAAK;AAExB,QAAA,MAAM,CAAC,GAAG;AACT,YAAA,GAAG,KAAK;AACR,YAAA,yBAAyB,EAAE;AACzB,iBAAA,GAAG,CAAC,CAAC,CAAC,KAAI;AACV,gBAAA,OAAO,OAAO,CAAC,KAAK,QAAQ,GAAG,CAAA,EAAG,CAAC,CAAA,EAAA,CAAI,GAAG,CAAC;AAC5C,YAAA,CAAC;iBACA,IAAI,CAAC,GAAG,CAAC;SACX;AAED,QAAA,IAAI,CAAC,SAAS;AAAE,YAAA,OAAO,CAAC;QAExB,MAAM,GAAG,GAAG,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,KAAI;AAClC,YAAA,MAAM,EAAE,KAAK,EAAE,GAAG,GAAG;AACrB,YAAA,IAAI,CAAC,KAAK;AAAE,gBAAA,OAAO,CAAC;AACpB,YAAA,OAAO,MAAM,CAAC,CAAC,CAAW;AAC3B,QAAA,CAAC,CAAC;QAEF,OAAO,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,KAAI;AACtB,YAAA,MAAM,EAAE,KAAK,EAAE,GAAG,GAAG;AACrB,YAAA,IAAI,CAAC,KAAK;gBAAE;AACZ,YAAA,IAAI,CAAC,KAAK,CAAC,EAAE;AACZ,gBAAA,CAAC,CAAC,CAAA,uBAAA,CAAyB,CAAC,GAAG,CAAC;YACjC;iBAAO,IAAI,CAAC,KAAK,GAAG,CAAC,MAAM,GAAG,CAAC,EAAE;gBAChC,CAAC,CAAC,CAAA,sBAAA,EAAyB,GAAG,CAAC,MAAM,GAAG,CAAC,CAAA,CAAE,CAAC,GAAG,QAAQ;YACxD;iBAAO;AACN,gBAAA,MAAM,MAAM,GAAG,KAAK,KAAK,MAAM;gBAC/B,MAAM,MAAM,GAAG,MAAM,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC;AAC1D,gBAAA,MAAM,GAAG,GAAG,MAAM,CAAC,MAAM,CAAC,CAAC,GAAG,EAAE,GAAG,KAAK,GAAG,GAAG,GAAG,CAAC,GAAG,IAAI;AACzD,gBAAA,MAAM,MAAM,GAAG,MAAM,GAAG,CAAA,EAAG,GAAG,CAAA,KAAA,CAAO,GAAG,CAAA,KAAA,EAAQ,GAAG,EAAE;AACrD,gBAAA,CAAC,CAAC,CAAA,sBAAA,EAAyB,CAAC,EAAE,CAAC,GAAG,MAAM;YACzC;AACD,QAAA,CAAC,CAAC;AAEF,QAAA,OAAO,CAAC;IACT,CAAC,EAAE,CAAC,KAAK,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;AAE7B,IAAA,MAAM,iBAAiB,GAAG,CAAC,CAAS,EAAE,CAAS,KAAI;AAClD,QAAA,IAAI,CAAC,SAAS;YAAE;QAEhB,MAAM,CAAC,GAAG,EAAE,CAAC,GAAG,KAAK,CAAC,MAAM;AAC5B,QAAA,EAAE,CAAC,CAAC,CAAC,GAAG,CAAC;AACT,QAAA,KAAK,CAAC,MAAM,GAAG,EAAE;QACjB,QAAQ,GAAG,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;AAC1B,IAAA,CAAC;AAED,IAAA,MAAM,iBAAiB,GAAG,CAAC,MAAgB,EAAE,CAAc,KAAI;AAC9D,QAAA,IAAI,MAAM,EAAE,MAAM,EAAE;YACnB,MAAM,CAAC,MAAM,EAAE,QAAQ,CAAC,GAAG,aAAa,CACvC,KAAK,CAAC,MAAM,EACZ,KAAK,CAAC,QAAQ,EACd,MAAM,CAAC,EAAE,CACT;AAED,YAAA,MAAM,CAAC,MAAM,CAAC,KAAK,EAAE;gBACpB,MAAM;gBACN,QAAQ;AACR,aAAA,CAAC;AAEF,YAAA,MAAM,GAAG,MAAM,EAAE,QAAQ,CAAC;QAC3B;AAEA,QAAA,aAAa,GAAG,MAAM,EAAE,CAAC,CAAC;AAC3B,IAAA,CAAC;AAED,IAAA,MAAM,IAAI,GAAG,OAAO,CAAC,MAAK;AACzB,QAAA,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK;AAElC,QAAA,IAAI,MAAM,IAAI,CAAC,MAAM,EAAE;AACtB,YAAA,MAAM,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,CAAC,EAAE,KAAK,MAAM,CAAC,EAAE,MAAM;AAC/D,YAAA,MAAM,MAAM,GACX,OAAO,MAAM,KAAK;AACjB,kBAAE;AACF,kBAAE,CAAC,CAAQ,EAAE,CAAQ,KAAK,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC;YACjD,MAAM,MAAM,GAAG,CAAC,GAAG,IAAI,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC;AAErC,YAAA,OAAO,QAAQ,KAAK,MAAM,GAAG,MAAM,GAAG,MAAM,CAAC,OAAO,EAAE;QACvD;AAEA,QAAA,OAAO,IAAI;AACZ,IAAA,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,KAAK,CAAC,MAAM,EAAE,KAAK,CAAC,QAAQ,CAAC,CAAC;IAEjD,SAAS,CAAC,MAAK;QACd,IAAI,CAAC,SAAS,CAAC,OAAO;YAAE;AACxB,QAAA,MAAM,EAAE,OAAO,EAAE,GAAG,EAAE,GAAG,SAAS;QAClC,MAAM,GAAG,GAAG,GAAG,CAAC,aAAa,CAAC,iBAAiB,CAAC,EAAE,QAAQ;QAC1D,IAAI,CAAC,GAAG,EAAE,MAAM;YAAE;QAClB,KAAK,CAAC,MAAM,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,IAAS,KAAK,IAAI,CAAC,WAAW,CAAC;AACpE,IAAA,CAAC,EAAE,CAAC,OAAO,EAAE,SAAS,CAAC,CAAC;IAExB,SAAS,CAAC,MAAK;AACd,QAAA,OAAO,IAAI,SAAS,CAAC,OAAO,EAAE,QAAQ,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,CAAC;AAC5D,IAAA,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC;AAEb,IAAA,MAAM,WAAW,GAAG;AACnB,QAAA,gBAAgB,EAAE,WAAW;AAC7B,QAAA,GAAG,MAAM;KACQ;IAElB,QACCC,cACC,KAAK,EAAE,EAAE,SAAS,EAAE,MAAM,EAAE,GAAG,WAAW,EAAE,EAC5C,SAAS,EAAE,UAAU,CAAC,sBAAsB,EAAE,SAAS,EAAE;AACxD,YAAA,qBAAqB,EAAE,MAAM;AAC7B,YAAA,oBAAoB,EAAE,OAAO;SAC7B,CAAC,EAAA,QAAA,EAAA,CAEFA,IAAA,CAAA,KAAA,EAAA,EACC,GAAG,EAAE,SAAS,EACd,SAAS,EAAE,UAAU,CAAC,YAAY,EAAE;AACnC,oBAAA,oBAAoB,EAAE,OAAO;iBAC7B,CAAC,EACF,OAAO,EAAE,QAAQ,EAAA,QAAA,EAAA,CAEhB,MAAM,KACND,GAAA,CAAC,MAAM,EAAA,EACN,OAAO,EAAE,OAAO,EAChB,SAAS,EAAE,SAAS,EACpB,QAAQ,EAAE,KAAK,CAAC,QAAQ,EACxB,MAAM,EAAE,KAAK,CAAC,MAAM,EACpB,YAAY,EAAE,YAAY,EAC1B,aAAa,EAAE,iBAAiB,EAChC,aAAa,EAAE,iBAAiB,EAAA,CAC/B,CACF,EAEA,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,MAChBA,GAAA,CAAC,GAAG,EAAA,EAEH,GAAG,EAAE,CAAC,IAAI,MAAM,GAAG,CAAC,GAAG,CAAC,CAAC,EACzB,IAAI,EAAE,GAAG,EACT,YAAY,EAAE,YAAY,EAC1B,OAAO,EAAE,OAAO,EAChB,WAAW,EAAE,WAAW,EACxB,UAAU,EAAE,UAAU,EACtB,iBAAiB,EAAE,iBAAiB,EAAA,EAP/B,CAAC,CAQL,CACF,CAAC,EAED,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,KAAK,CAAA,EAAA,CACpB,EAEL,OAAO,IAAI,aAAa,EAAE,CAAA,EAAA,CACtB;AAER;;;;"}
+{"version":3,"file":"datagrid.js","sources":["../../../../packages/components/datagrid/datagrid.tsx"],"sourcesContent":["import classNames from \"classnames\";\nimport {\n\tCSSProperties,\n\tKey,\n\tMouseEvent,\n\tuseCallback,\n\tuseEffect,\n\tuseMemo,\n\tuseRef,\n} from \"react\";\nimport { useReactive } from \"../../js/hooks\";\nimport { getNextSorter } from \"../../js/utils\";\nimport Loading from \"../loading\";\nimport Empty from \"../utils/empty\";\nimport {\n\tapplyFixedInsets,\n\tbuildCssWidths,\n\tbuildGridTemplateColumns,\n} from \"./helper\";\nimport \"./index.css\";\nimport Row, { Header } from \"./row\";\nimport type { IColumn, IData, IDatagrid, TDatagridState } from \"./type\";\nimport VirtualDatagrid from \"./virtual\";\n\nconst Datagrid = (props: IDatagrid) => {\n\tconst {\n\t\tdata = [],\n\t\tcolumns = [],\n\t\tborder,\n\t\tstriped,\n\t\theader = true,\n\t\tresizable,\n\t\tcellPadding = \".5em\",\n\t\tcellEllipsis,\n\t\tempty = <Empty />,\n\t\tloading,\n\t\theight = \"unset\",\n\t\tstyle,\n\t\tclassName,\n\t\trowKey,\n\t\tvirtual,\n\t\trenderLoading = () => (\n\t\t\t<Loading size='1.5em' className='color-3' absolute />\n\t\t),\n\t\tonCellClick,\n\t\tonRowClick,\n\t\tonCellDoubleClick,\n\t\tonHeaderClick,\n\t\tonSort,\n\t\tonScroll,\n\t\tonResize,\n\t} = props;\n\n\tconst container = useRef<HTMLDivElement>(null);\n\tconst wrapRef = useRef<HTMLDivElement>(null);\n\n\tconst state = useReactive<TDatagridState>({\n\t\trows: data,\n\t\twidths: columns.map((col) => col.width ?? \"min-content\"),\n\t\tsortBy: \"\",\n\t\tsortType: \"\",\n\t});\n\tconst previewRef = useRef({ index: -1, width: -1, template: \"\" });\n\n\tuseEffect(() => {\n\t\tconst next = columns.map((col, i) => {\n\t\t\tif (col.width != null) return col.width;\n\t\t\treturn state.widths[i] ?? \"min-content\";\n\t\t});\n\n\t\tlet changed = next.length !== state.widths.length;\n\t\tif (!changed) {\n\t\t\tfor (let i = 0; i < next.length; i++) {\n\t\t\t\tif (next[i] !== state.widths[i]) {\n\t\t\t\t\tchanged = true;\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tif (changed) state.widths = next;\n\t}, [columns, state]);\n\n\tconst styles = useMemo(() => {\n\t\tconst { widths } = state;\n\n\t\tconst o = {\n\t\t\t...style,\n\t\t\t\"--grid-template-columns\": buildGridTemplateColumns(widths),\n\t\t};\n\n\t\tif (!resizable) return o;\n\n\t\tconst cssWidths = buildCssWidths(widths);\n\t\tapplyFixedInsets(\n\t\t\t(k, v) => {\n\t\t\t\t(o as any)[k] = v;\n\t\t\t},\n\t\t\tcolumns,\n\t\t\tcssWidths,\n\t\t);\n\n\t\treturn o;\n\t}, [columns, resizable, state.widths, style]);\n\n\tconst handleWidthChange = useCallback(\n\t\t(i: number, w: number, phase: \"preview\" | \"commit\" = \"commit\") => {\n\t\t\tif (!resizable) return;\n\t\t\tif (phase === \"preview\") {\n\t\t\t\tconst el = wrapRef.current;\n\t\t\t\tif (!el) return;\n\t\t\t\tif (\n\t\t\t\t\tpreviewRef.current.index === i &&\n\t\t\t\t\tpreviewRef.current.width === w\n\t\t\t\t) {\n\t\t\t\t\treturn;\n\t\t\t\t}\n\n\t\t\t\tconst template = buildGridTemplateColumns(state.widths, i, w);\n\t\t\t\tif (previewRef.current.template !== template) {\n\t\t\t\t\tel.style.setProperty(\"--grid-template-columns\", template);\n\t\t\t\t\tconst cssWidths = buildCssWidths(state.widths, i, w);\n\t\t\t\t\tapplyFixedInsets(\n\t\t\t\t\t\t(k, v) => el.style.setProperty(k, v),\n\t\t\t\t\t\tcolumns,\n\t\t\t\t\t\tcssWidths,\n\t\t\t\t\t);\n\t\t\t\t\tpreviewRef.current.template = template;\n\t\t\t\t}\n\t\t\t\tpreviewRef.current.index = i;\n\t\t\t\tpreviewRef.current.width = w;\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tpreviewRef.current.index = -1;\n\t\t\tpreviewRef.current.width = -1;\n\t\t\tpreviewRef.current.template = \"\";\n\n\t\t\tif (state.widths[i] === w) return;\n\n\t\t\tconst next = [...state.widths];\n\t\t\tnext[i] = w;\n\t\t\tstate.widths = next;\n\t\t\tonResize?.(columns[i], w);\n\t\t},\n\t\t[columns, onResize, resizable, state, wrapRef],\n\t);\n\n\tconst handleHeaderClick = useCallback(\n\t\t(column?: IColumn, e?: MouseEvent) => {\n\t\t\tif (column?.sorter) {\n\t\t\t\tconst [sortBy, sortType] = getNextSorter(\n\t\t\t\t\tstate.sortBy,\n\t\t\t\t\tstate.sortType,\n\t\t\t\t\tcolumn.id,\n\t\t\t\t);\n\n\t\t\t\tObject.assign(state, {\n\t\t\t\t\tsortBy,\n\t\t\t\t\tsortType,\n\t\t\t\t});\n\n\t\t\t\tonSort?.(sortBy, sortType);\n\t\t\t}\n\n\t\t\tonHeaderClick?.(column, e);\n\t\t},\n\t\t[onHeaderClick, onSort, state],\n\t);\n\n\tconst rows = useMemo(() => {\n\t\tconst { sortBy, sortType } = state;\n\n\t\tif (sortBy && !onSort) {\n\t\t\tconst sorter = columns.find((col) => col.id === sortBy)?.sorter;\n\t\t\tconst sortFn =\n\t\t\t\ttypeof sorter === \"function\"\n\t\t\t\t\t? sorter\n\t\t\t\t\t: (a: IData, b: IData) => b[sortBy] - a[sortBy];\n\t\t\tconst sorted = [...data].sort(sortFn);\n\n\t\t\treturn sortType === \"desc\" ? sorted : sorted.reverse();\n\t\t}\n\n\t\treturn data;\n\t}, [data, columns, state.sortBy, state.sortType]);\n\n\tconst useVirtual = useMemo(() => {\n\t\tif (!virtual) return false;\n\t\tconst rowHeight = virtual.rowHeight;\n\t\treturn !!rowHeight && rowHeight > 0;\n\t}, [virtual]);\n\n\tuseEffect(() => {\n\t\tif (!resizable) return;\n\t\tif (!container.current) return;\n\t\tif (\n\t\t\t!columns.some(\n\t\t\t\t(col, i) =>\n\t\t\t\t\tcol.width == null && typeof state.widths[i] !== \"number\",\n\t\t\t)\n\t\t) {\n\t\t\treturn;\n\t\t}\n\n\t\tlet rafId: number | null = null;\n\t\tlet tries = 0;\n\n\t\tconst run = () => {\n\t\t\trafId = null;\n\t\t\tconst div = container.current;\n\t\t\tif (!div) return;\n\n\t\t\tconst headerRow = div.querySelector(\n\t\t\t\t\".i-datagrid-header.i-datagrid-row\",\n\t\t\t) as HTMLElement | null;\n\t\t\tconst bodyRow = div.querySelector(\n\t\t\t\t\".i-datagrid-row:not(.i-datagrid-header)\",\n\t\t\t) as HTMLElement | null;\n\n\t\t\tconst headerCells = headerRow ? Array.from(headerRow.children) : [];\n\t\t\tconst bodyCells = bodyRow ? Array.from(bodyRow.children) : [];\n\n\t\t\tconst cellCount = Math.max(headerCells.length, bodyCells.length);\n\t\t\tif (cellCount < 1) {\n\t\t\t\ttries++;\n\t\t\t\tif (tries < 10) rafId = requestAnimationFrame(run);\n\t\t\t\treturn;\n\t\t\t}\n\n\t\t\tconst measured = new Array<number | null>(cellCount).fill(null);\n\t\t\tfor (let i = 0; i < cellCount; i++) {\n\t\t\t\tconst hw = (headerCells[i] as HTMLElement | undefined)\n\t\t\t\t\t?.offsetWidth;\n\t\t\t\tconst bw = (bodyCells[i] as HTMLElement | undefined)\n\t\t\t\t\t?.offsetWidth;\n\t\t\t\tconst w = Math.max(hw ?? 0, bw ?? 0);\n\t\t\t\tmeasured[i] = w > 0 ? w : null;\n\t\t\t}\n\n\t\t\tconst next = columns.map((col, i) => {\n\t\t\t\tif (col.width != null) return col.width;\n\t\t\t\tconst cur = state.widths[i];\n\t\t\t\tif (typeof cur === \"number\") return cur;\n\t\t\t\treturn measured[i] ?? cur ?? \"min-content\";\n\t\t\t});\n\n\t\t\tlet changed = next.length !== state.widths.length;\n\t\t\tif (!changed) {\n\t\t\t\tfor (let i = 0; i < next.length; i++) {\n\t\t\t\t\tif (next[i] !== state.widths[i]) {\n\t\t\t\t\t\tchanged = true;\n\t\t\t\t\t\tbreak;\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t}\n\t\t\tif (changed) state.widths = next;\n\t\t};\n\n\t\trafId = requestAnimationFrame(run);\n\t\treturn () => {\n\t\t\tif (rafId != null) cancelAnimationFrame(rafId);\n\t\t};\n\t}, [columns, resizable, state, useVirtual]);\n\n\tuseEffect(() => {\n\t\tif (!loading) return;\n\t\tif (useVirtual) return;\n\t\tcontainer.current?.scrollTo({ top: 0, left: 0 });\n\t}, [loading, useVirtual]);\n\n\tconst mergedStyle = useMemo(\n\t\t() =>\n\t\t\t({\n\t\t\t\t\"--cell-padding\": cellPadding,\n\t\t\t\t...styles,\n\t\t\t}) as CSSProperties,\n\t\t[cellPadding, styles],\n\t);\n\n\tconst getRowKey = useMemo(() => {\n\t\tif (typeof rowKey === \"function\") return rowKey;\n\t\tif (typeof rowKey === \"string\") {\n\t\t\treturn (row: IData) => row?.[rowKey] as Key;\n\t\t}\n\n\t\treturn (_row: IData, index: number) => index as Key;\n\t}, [rowKey]);\n\n\treturn (\n\t\t<div\n\t\t\tref={wrapRef}\n\t\t\tstyle={{\n\t\t\t\tmaxHeight: height,\n\t\t\t\t...(useVirtual\n\t\t\t\t\t? { overflowX: \"visible\", overflowY: \"hidden\" }\n\t\t\t\t\t: null),\n\t\t\t\t...mergedStyle,\n\t\t\t}}\n\t\t\tclassName={classNames(\"i-datagrid-container\", className, {\n\t\t\t\t\"i-datagrid-bordered\": border,\n\t\t\t\t\"i-datagrid-striped\": striped,\n\t\t\t})}\n\t\t>\n\t\t\t{useVirtual && virtual ? (\n\t\t\t\t<VirtualDatagrid\n\t\t\t\t\tvirtual={virtual}\n\t\t\t\t\tcolumns={columns}\n\t\t\t\t\trows={rows}\n\t\t\t\t\theader={header}\n\t\t\t\t\tsortBy={state.sortBy}\n\t\t\t\t\tsortType={state.sortType}\n\t\t\t\t\theight={height}\n\t\t\t\t\tloading={loading}\n\t\t\t\t\tresizable={resizable}\n\t\t\t\t\tstriped={striped}\n\t\t\t\t\tcellEllipsis={cellEllipsis}\n\t\t\t\t\tempty={empty}\n\t\t\t\t\twrapRef={wrapRef}\n\t\t\t\t\tcontainerRef={container}\n\t\t\t\t\tgetRowKey={getRowKey}\n\t\t\t\t\tonHeaderClick={handleHeaderClick}\n\t\t\t\t\tonWidthChange={handleWidthChange}\n\t\t\t\t\tonRowClick={onRowClick}\n\t\t\t\t\tonCellClick={onCellClick}\n\t\t\t\t\tonCellDoubleClick={onCellDoubleClick}\n\t\t\t\t\tonScroll={onScroll}\n\t\t\t\t/>\n\t\t\t) : (\n\t\t\t\t<div\n\t\t\t\t\tref={container}\n\t\t\t\t\tclassName={classNames(\"i-datagrid\", {\n\t\t\t\t\t\t\"i-datagrid-loading\": loading,\n\t\t\t\t\t})}\n\t\t\t\t\tonWheel={onScroll}\n\t\t\t\t>\n\t\t\t\t\t{header && (\n\t\t\t\t\t\t<Header\n\t\t\t\t\t\t\tcolumns={columns}\n\t\t\t\t\t\t\tresizable={resizable}\n\t\t\t\t\t\t\tsortType={state.sortType}\n\t\t\t\t\t\t\tsortBy={state.sortBy}\n\t\t\t\t\t\t\tcellEllipsis={cellEllipsis}\n\t\t\t\t\t\t\tonWidthChange={handleWidthChange}\n\t\t\t\t\t\t\tonHeaderClick={handleHeaderClick}\n\t\t\t\t\t\t/>\n\t\t\t\t\t)}\n\n\t\t\t\t\t{rows.map((row, i) => (\n\t\t\t\t\t\t<Row\n\t\t\t\t\t\t\tkey={getRowKey(row, i) ?? i}\n\t\t\t\t\t\t\trow={i + (header ? 1 : 0)}\n\t\t\t\t\t\t\tdata={row}\n\t\t\t\t\t\t\tcellEllipsis={cellEllipsis}\n\t\t\t\t\t\t\tcolumns={columns}\n\t\t\t\t\t\t\tonCellClick={onCellClick}\n\t\t\t\t\t\t\tonRowClick={onRowClick}\n\t\t\t\t\t\t\tonCellDoubleClick={onCellDoubleClick}\n\t\t\t\t\t\t/>\n\t\t\t\t\t))}\n\n\t\t\t\t\t{rows.length < 1 && empty}\n\t\t\t\t</div>\n\t\t\t)}\n\n\t\t\t{loading && renderLoading()}\n\t\t</div>\n\t);\n};\n\nexport default Datagrid;\n"],"names":["_jsx","_jsxs"],"mappings":"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"}

package/lib/es/components/datagrid/helper.js

@@ -0,0 +1,79 @@
+const lengthRe = /^-?\d+(\.\d+)?(px|em|rem|%|vw|vh|vmin|vmax|ch|ex|cm|mm|in|pt|pc)$/;
+const isLength = (v) => {
+    if (v === "0")
+        return true;
+    if (v.startsWith("var(") || v.startsWith("calc("))
+        return true;
+    return lengthRe.test(v);
+};
+const sumLengths = (parts) => {
+    let out = null;
+    for (let i = 0; i < parts.length; i++) {
+        const v = parts[i];
+        if (!v || !isLength(v))
+            continue;
+        if (out == null)
+            out = [v];
+        else
+            out.push(v);
+    }
+    if (out == null || out.length < 1)
+        return "0";
+    if (out.length === 1)
+        return out[0];
+    return `calc(${out.join(" + ")})`;
+};
+const toCssWidth = (w) => typeof w === "number" ? `${w}px` : w;
+const buildGridTemplateColumns = (widths, overrideIndex, overrideWidth) => {
+    let out = "";
+    for (let i = 0; i < widths.length; i++) {
+        const w = i === overrideIndex && overrideWidth != null
+            ? overrideWidth
+            : widths[i];
+        out += (i ? " " : "") + toCssWidth(w);
+    }
+    return out;
+};
+const buildCssWidths = (widths, overrideIndex, overrideWidth) => {
+    const out = new Array(widths.length);
+    for (let i = 0; i < widths.length; i++) {
+        const w = i === overrideIndex && overrideWidth != null
+            ? overrideWidth
+            : widths[i];
+        out[i] = toCssWidth(w);
+    }
+    return out;
+};
+const applyFixedInsets = (setVar, columns, cssWidths) => {
+    for (let i = 0; i < columns.length; i++) {
+        const fixed = columns[i]?.fixed;
+        if (!fixed)
+            continue;
+        if (fixed === "left" && i === 0) {
+            setVar(`--datagrid-cell-inset-0`, "0");
+            continue;
+        }
+        if (fixed === "right" && i === columns.length - 1) {
+            setVar(`--datagrid-cell-inset-${columns.length - 1}`, "auto 0");
+            continue;
+        }
+        if (fixed === "left") {
+            const parts = [];
+            for (let j = 0; j < i; j++) {
+                if (columns[j]?.fixed === "left")
+                    parts.push(cssWidths[j]);
+            }
+            setVar(`--datagrid-cell-inset-${i}`, `${sumLengths(parts)} auto`);
+            continue;
+        }
+        const parts = [];
+        for (let j = i + 1; j < columns.length; j++) {
+            if (columns[j]?.fixed === "right")
+                parts.push(cssWidths[j]);
+        }
+        setVar(`--datagrid-cell-inset-${i}`, `auto ${sumLengths(parts)}`);
+    }
+};
+
+export { applyFixedInsets, buildCssWidths, buildGridTemplateColumns };
+//# sourceMappingURL=helper.js.map

package/lib/es/components/datagrid/helper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"helper.js","sources":["../../../../packages/components/datagrid/helper.ts"],"sourcesContent":["import type { IColumn } from \"./type\";\n\nconst lengthRe =\n\t/^-?\\d+(\\.\\d+)?(px|em|rem|%|vw|vh|vmin|vmax|ch|ex|cm|mm|in|pt|pc)$/;\n\nconst isLength = (v: string) => {\n\tif (v === \"0\") return true;\n\tif (v.startsWith(\"var(\") || v.startsWith(\"calc(\")) return true;\n\treturn lengthRe.test(v);\n};\n\nconst sumLengths = (parts: string[]) => {\n\tlet out: string[] | null = null;\n\tfor (let i = 0; i < parts.length; i++) {\n\t\tconst v = parts[i];\n\t\tif (!v || !isLength(v)) continue;\n\t\tif (out == null) out = [v];\n\t\telse out.push(v);\n\t}\n\tif (out == null || out.length < 1) return \"0\";\n\tif (out.length === 1) return out[0];\n\treturn `calc(${out.join(\" + \")})`;\n};\n\nconst toCssWidth = (w: number | string) =>\n\ttypeof w === \"number\" ? `${w}px` : w;\n\nexport const buildGridTemplateColumns = (\n\twidths: (number | string)[],\n\toverrideIndex?: number,\n\toverrideWidth?: number,\n) => {\n\tlet out = \"\";\n\tfor (let i = 0; i < widths.length; i++) {\n\t\tconst w =\n\t\t\ti === overrideIndex && overrideWidth != null\n\t\t\t\t? overrideWidth\n\t\t\t\t: widths[i];\n\t\tout += (i ? \" \" : \"\") + toCssWidth(w);\n\t}\n\treturn out;\n};\n\nexport const buildCssWidths = (\n\twidths: (number | string)[],\n\toverrideIndex?: number,\n\toverrideWidth?: number,\n) => {\n\tconst out = new Array<string>(widths.length);\n\tfor (let i = 0; i < widths.length; i++) {\n\t\tconst w =\n\t\t\ti === overrideIndex && overrideWidth != null\n\t\t\t\t? overrideWidth\n\t\t\t\t: widths[i];\n\t\tout[i] = toCssWidth(w);\n\t}\n\treturn out;\n};\n\nexport const applyFixedInsets = (\n\tsetVar: (name: string, value: string) => void,\n\tcolumns: IColumn[],\n\tcssWidths: string[],\n) => {\n\tfor (let i = 0; i < columns.length; i++) {\n\t\tconst fixed = columns[i]?.fixed;\n\t\tif (!fixed) continue;\n\n\t\tif (fixed === \"left\" && i === 0) {\n\t\t\tsetVar(`--datagrid-cell-inset-0`, \"0\");\n\t\t\tcontinue;\n\t\t}\n\n\t\tif (fixed === \"right\" && i === columns.length - 1) {\n\t\t\tsetVar(`--datagrid-cell-inset-${columns.length - 1}`, \"auto 0\");\n\t\t\tcontinue;\n\t\t}\n\n\t\tif (fixed === \"left\") {\n\t\t\tconst parts: string[] = [];\n\t\t\tfor (let j = 0; j < i; j++) {\n\t\t\t\tif (columns[j]?.fixed === \"left\") parts.push(cssWidths[j]);\n\t\t\t}\n\t\t\tsetVar(`--datagrid-cell-inset-${i}`, `${sumLengths(parts)} auto`);\n\t\t\tcontinue;\n\t\t}\n\n\t\tconst parts: string[] = [];\n\t\tfor (let j = i + 1; j < columns.length; j++) {\n\t\t\tif (columns[j]?.fixed === \"right\") parts.push(cssWidths[j]);\n\t\t}\n\t\tsetVar(`--datagrid-cell-inset-${i}`, `auto ${sumLengths(parts)}`);\n\t}\n};\n"],"names":[],"mappings":"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"}