@rockshin/tao-ui 0.0.10 → 0.0.11

package/dist/components/splitter/splitter.js

@@ -30,7 +30,8 @@ function CollapseIcon(t0) {
             height: "12",
             viewBox: "0 0 12 12",
             fill: "none",
-            "aria-hidden": true,
+            "aria-hidden": "true",
+            focusable: "false",
             "data-tao-collapse-direction": direction,
             children: t1
         });
@@ -43,43 +44,46 @@ function Panel(_props) {
     return null;
 }
 function Splitter(t0) {
-    const $ = c(66);
+    const $ = c(64);
     const { orientation: t1, onResize, onResizeEnd, onResizeStart, className, classNames, styles, children } = t0;
     const orientation = void 0 === t1 ? "horizontal" : t1;
     const containerRef = useRef(null);
-    let panelChildren;
-    let panels;
+    let t2;
     if ($[0] !== children) {
-        panels = [];
-        panelChildren = [];
+        const nextPanels = [];
+        const nextPanelChildren = [];
         const childArray = Array.isArray(children) ? children : [
             children
         ];
-        for (const child of childArray)if (child && "object" == typeof child && "type" in child && child.type === Panel) {
-            panels.push(child.props);
-            panelChildren.push(child.props.children);
+        for (const child of childArray)if (child && "object" == typeof child && "type" in child) {
+            const panelChild = child;
+            if (panelChild.type === Panel && panelChild.props) {
+                nextPanels.push(panelChild.props);
+                nextPanelChildren.push(panelChild.props.children);
+            }
         }
+        t2 = {
+            panels: nextPanels,
+            panelChildren: nextPanelChildren
+        };
         $[0] = children;
-        $[1] = panelChildren;
-        $[2] = panels;
-    } else {
-        panelChildren = $[1];
-        panels = $[2];
-    }
+        $[1] = t2;
+    } else t2 = $[1];
+    const { panels, panelChildren } = t2;
     const panelCount = panels.length;
     const isHorizontal = "horizontal" === orientation;
-    let t2;
-    if ($[3] === Symbol.for("react.memo_cache_sentinel")) {
-        t2 = [];
-        $[3] = t2;
-    } else t2 = $[3];
-    const [sizes, setSizes] = useState(t2);
+    let t3;
+    if ($[2] === Symbol.for("react.memo_cache_sentinel")) {
+        t3 = [];
+        $[2] = t3;
+    } else t3 = $[2];
+    const [sizes, setSizes] = useState(t3);
     const [containerSize, setContainerSize] = useState(0);
     const initialized = useRef(false);
-    let t3;
     let t4;
-    if ($[4] !== isHorizontal) {
-        t3 = ()=>{
+    let t5;
+    if ($[3] !== isHorizontal) {
+        t4 = ()=>{
             const el = containerRef.current;
             if (!el) return;
             const observer = new ResizeObserver((entries)=>{
@@ -91,20 +95,21 @@ function Splitter(t0) {
             observer.observe(el);
             return ()=>observer.disconnect();
         };
-        t4 = [
+        t5 = [
             isHorizontal
         ];
-        $[4] = isHorizontal;
-        $[5] = t3;
-        $[6] = t4;
+        $[3] = isHorizontal;
+        $[4] = t4;
+        $[5] = t5;
     } else {
-        t3 = $[5];
-        t4 = $[6];
+        t4 = $[4];
+        t5 = $[5];
     }
-    useEffect(t3, t4);
-    let t5;
-    if ($[7] !== containerSize || $[8] !== panelCount || $[9] !== panels || $[10] !== sizes.length) {
-        t5 = ()=>{
+    useEffect(t4, t5);
+    let t6;
+    let t7;
+    if ($[6] !== containerSize || $[7] !== panelCount || $[8] !== panels || $[9] !== sizes.length) {
+        t6 = ()=>{
             if (containerSize <= 0 || 0 === panelCount) return;
             if (initialized.current && sizes.length === panelCount) return;
             const draggerSpace = (panelCount - 1) * 1;
@@ -131,26 +136,27 @@ function Splitter(t0) {
             setSizes(newSizes);
             initialized.current = true;
         };
-        $[7] = containerSize;
-        $[8] = panelCount;
-        $[9] = panels;
-        $[10] = sizes.length;
-        $[11] = t5;
-    } else t5 = $[11];
-    let t6;
-    if ($[12] !== containerSize || $[13] !== panelCount) {
-        t6 = [
+        t7 = [
             containerSize,
-            panelCount
+            panelCount,
+            panels,
+            sizes.length
         ];
-        $[12] = containerSize;
-        $[13] = panelCount;
-        $[14] = t6;
-    } else t6 = $[14];
-    useEffect(t5, t6);
-    let t7;
-    if ($[15] !== containerSize || $[16] !== panelCount || $[17] !== panels || $[18] !== sizes) {
-        t7 = ()=>{
+        $[6] = containerSize;
+        $[7] = panelCount;
+        $[8] = panels;
+        $[9] = sizes.length;
+        $[10] = t6;
+        $[11] = t7;
+    } else {
+        t6 = $[10];
+        t7 = $[11];
+    }
+    useEffect(t6, t7);
+    let t8;
+    let t9;
+    if ($[12] !== containerSize || $[13] !== panelCount || $[14] !== panels || $[15] !== sizes) {
+        t8 = ()=>{
             if (!initialized.current || sizes.length !== panelCount) return;
             const draggerSpace_0 = (panelCount - 1) * 1;
             const available_0 = containerSize - draggerSpace_0;
@@ -167,17 +173,27 @@ function Splitter(t0) {
             }
             if (changed) setSizes(next);
         };
-        $[15] = containerSize;
-        $[16] = panelCount;
-        $[17] = panels;
-        $[18] = sizes;
-        $[19] = t7;
-    } else t7 = $[19];
-    useEffect(t7);
+        t9 = [
+            containerSize,
+            panelCount,
+            panels,
+            sizes
+        ];
+        $[12] = containerSize;
+        $[13] = panelCount;
+        $[14] = panels;
+        $[15] = sizes;
+        $[16] = t8;
+        $[17] = t9;
+    } else {
+        t8 = $[16];
+        t9 = $[17];
+    }
+    useEffect(t8, t9);
     const dragging = useRef(null);
-    let t8;
-    if ($[20] !== containerSize || $[21] !== isHorizontal || $[22] !== onResize || $[23] !== onResizeEnd || $[24] !== onResizeStart || $[25] !== panelCount || $[26] !== panels || $[27] !== sizes) {
-        t8 = (index, e)=>{
+    let t10;
+    if ($[18] !== containerSize || $[19] !== isHorizontal || $[20] !== onResize || $[21] !== onResizeEnd || $[22] !== onResizeStart || $[23] !== panelCount || $[24] !== panels || $[25] !== sizes) {
+        t10 = (index, e)=>{
             e.preventDefault();
             const pos = isHorizontal ? e.clientX : e.clientY;
             dragging.current = {
@@ -232,20 +248,20 @@ function Splitter(t0) {
             document.addEventListener("pointermove", handleMove);
             document.addEventListener("pointerup", handleUp);
         };
-        $[20] = containerSize;
-        $[21] = isHorizontal;
-        $[22] = onResize;
-        $[23] = onResizeEnd;
-        $[24] = onResizeStart;
-        $[25] = panelCount;
-        $[26] = panels;
-        $[27] = sizes;
-        $[28] = t8;
-    } else t8 = $[28];
-    const handleDragStart = t8;
-    let t9;
-    if ($[29] !== containerSize || $[30] !== onResize || $[31] !== onResizeEnd || $[32] !== panelCount || $[33] !== panels) {
-        t9 = (index_0, direction)=>{
+        $[18] = containerSize;
+        $[19] = isHorizontal;
+        $[20] = onResize;
+        $[21] = onResizeEnd;
+        $[22] = onResizeStart;
+        $[23] = panelCount;
+        $[24] = panels;
+        $[25] = sizes;
+        $[26] = t10;
+    } else t10 = $[26];
+    const handleDragStart = t10;
+    let t11;
+    if ($[27] !== containerSize || $[28] !== onResize || $[29] !== onResizeEnd || $[30] !== panelCount || $[31] !== panels) {
+        t11 = (index_0, direction)=>{
             const draggerSpace_2 = (panelCount - 1) * 1;
             const available_2 = containerSize - draggerSpace_2;
             const targetIdx = "start" === direction ? index_0 : index_0 + 1;
@@ -270,17 +286,17 @@ function Splitter(t0) {
                 return next_1;
             });
         };
-        $[29] = containerSize;
-        $[30] = onResize;
-        $[31] = onResizeEnd;
-        $[32] = panelCount;
-        $[33] = panels;
-        $[34] = t9;
-    } else t9 = $[34];
-    const handleCollapse = t9;
-    let t10;
-    if ($[35] !== panels) {
-        t10 = function(index_1) {
+        $[27] = containerSize;
+        $[28] = onResize;
+        $[29] = onResizeEnd;
+        $[30] = panelCount;
+        $[31] = panels;
+        $[32] = t11;
+    } else t11 = $[32];
+    const handleCollapse = t11;
+    let t12;
+    if ($[33] !== panels) {
+        t12 = function(index_1) {
             const leftPanel = panels[index_1];
             const rightPanel = panels[index_1 + 1];
             let startCollapsible = false;
@@ -298,48 +314,48 @@ function Splitter(t0) {
                 end: endCollapsible
             };
         };
-        $[35] = panels;
-        $[36] = t10;
-    } else t10 = $[36];
-    const getDraggerCollapse = t10;
+        $[33] = panels;
+        $[34] = t12;
+    } else t12 = $[34];
+    const getDraggerCollapse = t12;
     if (sizes.length !== panelCount) {
-        const t11 = classNames?.root;
-        let t12;
-        if ($[37] !== className || $[38] !== t11) {
-            t12 = cx(t11, className);
-            $[37] = className;
-            $[38] = t11;
-            $[39] = t12;
-        } else t12 = $[39];
-        const t13 = styles?.root;
+        const t13 = classNames?.root;
         let t14;
-        if ($[40] !== orientation || $[41] !== t12 || $[42] !== t13) {
-            t14 = /*#__PURE__*/ jsx("div", {
+        if ($[35] !== className || $[36] !== t13) {
+            t14 = cx(t13, className);
+            $[35] = className;
+            $[36] = t13;
+            $[37] = t14;
+        } else t14 = $[37];
+        const t15 = styles?.root;
+        let t16;
+        if ($[38] !== orientation || $[39] !== t14 || $[40] !== t15) {
+            t16 = /*#__PURE__*/ jsx("div", {
                 ref: containerRef,
                 "data-tao-splitter": "",
                 "data-tao-orientation": orientation,
-                className: t12,
-                style: t13
+                className: t14,
+                style: t15
             });
-            $[40] = orientation;
-            $[41] = t12;
-            $[42] = t13;
-            $[43] = t14;
-        } else t14 = $[43];
-        return t14;
+            $[38] = orientation;
+            $[39] = t14;
+            $[40] = t15;
+            $[41] = t16;
+        } else t16 = $[41];
+        return t16;
     }
-    const t11 = classNames?.root;
-    let t12;
-    if ($[44] !== className || $[45] !== t11) {
-        t12 = cx(t11, className);
-        $[44] = className;
-        $[45] = t11;
-        $[46] = t12;
-    } else t12 = $[46];
-    const t13 = styles?.root;
+    const t13 = classNames?.root;
     let t14;
-    if ($[47] !== classNames?.dragger || $[48] !== classNames?.panel || $[49] !== getDraggerCollapse || $[50] !== handleCollapse || $[51] !== handleDragStart || $[52] !== isHorizontal || $[53] !== orientation || $[54] !== panelChildren || $[55] !== panelCount || $[56] !== panels || $[57] !== sizes || $[58] !== styles?.dragger || $[59] !== styles?.panel) {
-        t14 = panels.map((panel, i_2)=>{
+    if ($[42] !== className || $[43] !== t13) {
+        t14 = cx(t13, className);
+        $[42] = className;
+        $[43] = t13;
+        $[44] = t14;
+    } else t14 = $[44];
+    const t15 = styles?.root;
+    let t16;
+    if ($[45] !== classNames?.dragger || $[46] !== classNames?.panel || $[47] !== getDraggerCollapse || $[48] !== handleCollapse || $[49] !== handleDragStart || $[50] !== isHorizontal || $[51] !== orientation || $[52] !== panelChildren || $[53] !== panelCount || $[54] !== panels || $[55] !== sizes || $[56] !== styles?.dragger || $[57] !== styles?.panel) {
+        t16 = panels.map((panel, i_2)=>{
             const sizeStyle = isHorizontal ? {
                 width: sizes[i_2],
                 flexShrink: 0,
@@ -414,38 +430,38 @@ function Splitter(t0) {
                 ]
             }, i_2);
         });
-        $[47] = classNames?.dragger;
-        $[48] = classNames?.panel;
-        $[49] = getDraggerCollapse;
-        $[50] = handleCollapse;
-        $[51] = handleDragStart;
-        $[52] = isHorizontal;
-        $[53] = orientation;
-        $[54] = panelChildren;
-        $[55] = panelCount;
-        $[56] = panels;
-        $[57] = sizes;
-        $[58] = styles?.dragger;
-        $[59] = styles?.panel;
-        $[60] = t14;
-    } else t14 = $[60];
-    let t15;
-    if ($[61] !== orientation || $[62] !== t12 || $[63] !== t13 || $[64] !== t14) {
-        t15 = /*#__PURE__*/ jsx("div", {
+        $[45] = classNames?.dragger;
+        $[46] = classNames?.panel;
+        $[47] = getDraggerCollapse;
+        $[48] = handleCollapse;
+        $[49] = handleDragStart;
+        $[50] = isHorizontal;
+        $[51] = orientation;
+        $[52] = panelChildren;
+        $[53] = panelCount;
+        $[54] = panels;
+        $[55] = sizes;
+        $[56] = styles?.dragger;
+        $[57] = styles?.panel;
+        $[58] = t16;
+    } else t16 = $[58];
+    let t17;
+    if ($[59] !== orientation || $[60] !== t14 || $[61] !== t15 || $[62] !== t16) {
+        t17 = /*#__PURE__*/ jsx("div", {
             ref: containerRef,
             "data-tao-splitter": "",
             "data-tao-orientation": orientation,
-            className: t12,
-            style: t13,
-            children: t14
+            className: t14,
+            style: t15,
+            children: t16
         });
-        $[61] = orientation;
-        $[62] = t12;
-        $[63] = t13;
-        $[64] = t14;
-        $[65] = t15;
-    } else t15 = $[65];
-    return t15;
+        $[59] = orientation;
+        $[60] = t14;
+        $[61] = t15;
+        $[62] = t16;
+        $[63] = t17;
+    } else t17 = $[63];
+    return t17;
 }
 Splitter.Panel = Panel;
 export { Panel, Splitter };

package/dist/components/switch/switch.js

@@ -126,6 +126,8 @@ function LoadingIcon() {
     let t0;
     if ($[0] === Symbol.for("react.memo_cache_sentinel")) {
         t0 = /*#__PURE__*/ jsx("svg", {
+            "aria-hidden": "true",
+            focusable: "false",
             "data-tao-switch-loading": "",
             viewBox: "0 0 24 24",
             fill: "none",

package/dist/components/table/table.css

@@ -122,8 +122,13 @@
 }
 
 [data-tao-table-header-title] {
+  color: inherit;
+  font: inherit;
+  background: none;
+  border: 0;
   align-items: center;
   gap: 2px;
+  padding: 0;
   display: inline-flex;
 }
 
@@ -133,6 +138,10 @@
   user-select: none;
 }
 
+[data-tao-table-header-title]:disabled {
+  cursor: default;
+}
+
 [data-tao-table-header-title][data-tao-sortable]:hover {
   color: var(--tao-color-text);
 }
@@ -191,13 +200,18 @@
 [data-tao-table-filter-option] {
   align-items: center;
   gap: var(--tao-padding-xs);
+  width: 100%;
   padding: var(--tao-padding-xxs) var(--tao-padding-xs);
   border-radius: var(--tao-radius-sm);
   cursor: pointer;
   font-size: var(--tao-font-size-sm);
+  font-family: var(--tao-font-family);
+  text-align: start;
   color: var(--tao-color-text);
   transition: background-color var(--tao-motion-duration-fast)
     var(--tao-motion-ease-out);
+  background: none;
+  border: 0;
   display: flex;
 }
 

package/dist/components/table/table.js

@@ -65,7 +65,8 @@ function SortIcon(t0) {
             height: "14",
             viewBox: "0 0 14 14",
             fill: "none",
-            "aria-hidden": true,
+            "aria-hidden": "true",
+            focusable: "false",
             children: [
                 t3,
                 t5
@@ -100,7 +101,8 @@ function FilterIcon(t0) {
             height: "14",
             viewBox: "0 0 14 14",
             fill: "none",
-            "aria-hidden": true,
+            "aria-hidden": "true",
+            focusable: "false",
             children: /*#__PURE__*/ jsx("path", {
                 d: "M2 3h10L8.5 7.5V11L5.5 12V7.5L2 3Z",
                 stroke: "currentColor",
@@ -137,7 +139,8 @@ function LoadingSpinner() {
                 height: "24",
                 viewBox: "0 0 24 24",
                 fill: "none",
-                "aria-hidden": true,
+                "aria-hidden": "true",
+                focusable: "false",
                 children: [
                     /*#__PURE__*/ jsx("circle", {
                         cx: "12",
@@ -169,7 +172,8 @@ function CheckIcon() {
             height: "12",
             viewBox: "0 0 12 12",
             fill: "none",
-            "aria-hidden": true,
+            "aria-hidden": "true",
+            focusable: "false",
             children: /*#__PURE__*/ jsx("path", {
                 d: "M2.5 6L5 8.5L9.5 3.5",
                 stroke: "currentColor",
@@ -258,9 +262,11 @@ function FilterDropdown(t0) {
             children: [
                 filters.map((f)=>{
                     const checked = activeValues.includes(f.value);
-                    return /*#__PURE__*/ jsxs("label", {
+                    return /*#__PURE__*/ jsxs("button", {
+                        type: "button",
                         "data-tao-table-filter-option": "",
                         onClick: ()=>toggle(f.value),
+                        "aria-pressed": checked,
                         children: [
                             /*#__PURE__*/ jsx("span", {
                                 "data-tao-table-filter-check": "",
@@ -950,20 +956,14 @@ function Table(t0) {
                                                 className: resolvedClassNames["header.content"],
                                                 style: resolvedStyles["header.content"],
                                                 children: [
-                                                    /*#__PURE__*/ jsxs("span", {
+                                                    /*#__PURE__*/ jsxs("button", {
+                                                        type: "button",
                                                         "data-tao-table-header-title": "",
                                                         "data-tao-sortable": hasSorter || void 0,
                                                         className: resolvedClassNames["header.title"],
                                                         style: resolvedStyles["header.title"],
+                                                        disabled: !hasSorter,
                                                         onClick: hasSorter ? ()=>handleSort(colKey_2, col_9) : void 0,
-                                                        role: hasSorter ? "button" : void 0,
-                                                        tabIndex: hasSorter ? 0 : void 0,
-                                                        onKeyDown: hasSorter ? (e_0)=>{
-                                                            if ("Enter" === e_0.key || " " === e_0.key) {
-                                                                e_0.preventDefault();
-                                                                handleSort(colKey_2, col_9);
-                                                            }
-                                                        } : void 0,
                                                         children: [
                                                             col_9.title,
                                                             hasSorter && /*#__PURE__*/ jsx(SortIcon, {