klun-ui 0.2.2 → 0.3.0

package/dist/{chunk-T7O3RMWL.cjs → chunk-YSCRS555.cjs}

@@ -6541,25 +6541,30 @@ var AutoComplete = react.forwardRef(
 AutoComplete.displayName = "AutoComplete";
 var Cascader = react.forwardRef(function Cascader2({
   options = [],
-  value = [],
+  value,
+  defaultValue,
   onChange,
   placeholder: placeholderProp,
   size: sizeProp,
   disabled = false,
   separator = " / ",
   changeOnSelect = false,
+  clearable = false,
+  renderOption,
   error = false,
   className,
   ...props
 }, ref) {
   const size = useSize(sizeProp);
-  const { cascader } = useLocale();
+  const { cascader, input: inputText } = useLocale();
   const placeholder = placeholderProp ?? cascader.placeholder;
+  const [inner, setInner] = react.useState(defaultValue ?? []);
+  const current = value ?? inner;
   const [open, setOpen] = react.useState(false);
-  const [active, setActive] = react.useState(value);
+  const [active, setActive] = react.useState(current);
   const rootRef = react.useRef(null);
   react.useEffect(() => {
-    setActive(value);
+    setActive(current);
   }, [open]);
   react.useEffect(() => {
     if (!open) return;
@@ -6588,7 +6593,7 @@ var Cascader = react.forwardRef(function Cascader2({
   }
   const labelPath = [];
   let lvl = options;
-  for (const key of value) {
+  for (const key of current) {
     const found = (lvl || []).find((o) => o.value === key);
     if (!found) break;
     labelPath.push(found.label);
@@ -6600,10 +6605,16 @@ var Cascader = react.forwardRef(function Cascader2({
     setActive(nextPath);
     const leaf = !opt.children || !opt.children.length;
     if (leaf || changeOnSelect) {
+      if (value === void 0) setInner(nextPath);
       onChange && onChange(nextPath);
       if (leaf) setOpen(false);
     }
   };
+  const clear = () => {
+    if (value === void 0) setInner([]);
+    setActive([]);
+    onChange && onChange([]);
+  };
   const setRefs = (node) => {
     rootRef.current = node;
     if (typeof ref === "function") ref(node);
@@ -6633,6 +6644,20 @@ var Cascader = react.forwardRef(function Cascader2({
                 i > 0 ? /* @__PURE__ */ jsxRuntime.jsx("span", { className: "klun-cascader__separator", children: separator }) : null,
                 lbl
               ] }, i)) : placeholder }),
+              clearable && labelPath.length && !disabled ? /* @__PURE__ */ jsxRuntime.jsx(
+                "span",
+                {
+                  role: "button",
+                  tabIndex: -1,
+                  "aria-label": inputText.clear,
+                  className: "klun-cascader__clear",
+                  onClick: (e) => {
+                    e.stopPropagation();
+                    clear();
+                  },
+                  children: /* @__PURE__ */ jsxRuntime.jsx("i", { className: "ri-close-circle-fill" })
+                }
+              ) : null,
               /* @__PURE__ */ jsxRuntime.jsx(
                 "svg",
                 {
@@ -6657,7 +6682,7 @@ var Cascader = react.forwardRef(function Cascader2({
             ]
           }
         ),
-        open ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "klun-cascader__panel", children: columns.map((col, ci) => /* @__PURE__ */ jsxRuntime.jsx(
+        open ? /* @__PURE__ */ jsxRuntime.jsx("div", { className: "klun-cascader__panel", role: "menu", children: columns.map((col, ci) => /* @__PURE__ */ jsxRuntime.jsx(
           "div",
           {
             className: chunkTPGAXYFU_cjs.cx(
@@ -6671,12 +6696,14 @@ var Cascader = react.forwardRef(function Cascader2({
                 "button",
                 {
                   type: "button",
+                  role: "menuitem",
                   className: "klun-cascader__option",
                   disabled: opt.disabled,
                   onClick: () => pick(ci, opt),
+                  "aria-selected": selected,
                   "data-selected": selected || void 0,
                   children: [
-                    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "klun-cascader__option-label", children: opt.label }),
+                    /* @__PURE__ */ jsxRuntime.jsx("span", { className: "klun-cascader__option-label", children: renderOption ? renderOption(opt, ci) : opt.label }),
                     hasChildren2 ? /* @__PURE__ */ jsxRuntime.jsx("i", { className: "ri-arrow-right-s-line klun-cascader__option-arrow" }) : selected ? /* @__PURE__ */ jsxRuntime.jsx("i", { className: "ri-check-line klun-cascader__option-check" }) : null
                   ]
                 },
@@ -11759,5 +11786,5 @@ exports.useSize = useSize;
 exports.viVN = viVN;
 exports.zhCN = zhCN;
 exports.zhTW = zhTW;
-//# sourceMappingURL=chunk-T7O3RMWL.cjs.map
-//# sourceMappingURL=chunk-T7O3RMWL.cjs.map
+//# sourceMappingURL=chunk-YSCRS555.cjs.map
+//# sourceMappingURL=chunk-YSCRS555.cjs.map