ar-design 0.4.59 → 0.4.61

package/dist/assets/css/components/data-display/table/styles.css

@@ -126,6 +126,11 @@
               z-index: 3;
             }
 
+            &.subrow-col {
+              width: 2rem;
+              z-index: 3;
+            }
+
             &.type-of-number {
               text-align: right;
             }
@@ -561,6 +566,11 @@
                 z-index: 3;
               }
 
+              &.subrow-col {
+                width: 2rem;
+                z-index: 3;
+              }
+
               &.type-of-number {
                 text-align: right;
               }

package/dist/components/data-display/table/body/TBody.js

@@ -20,6 +20,7 @@ function TBody({ data, columns, refs, methods, states, config }) {
     const renderRow = (item, index, deph, parentKey = "") => {
         const id = methods.trackBy?.(item) ?? index.toString();
         const key = parentKey ? `${parentKey}.${id}` : id;
+        const _subitem = item[_subrowSelector];
         const isHasSubitems = _subrowSelector in item;
         return (React.createElement(Fragment, { key: `row-${index}` },
             React.createElement("tr", { ref: (element) => {
@@ -27,7 +28,7 @@ function TBody({ data, columns, refs, methods, states, config }) {
                 }, ...(methods.rowBackgroundColor ? { style: { backgroundColor: methods.rowBackgroundColor(item) } } : {}), ...(methods.onDnD && data.length > 1 ? { className: "draggable", draggable: true } : {}) },
                 methods.selections && (React.createElement("td", { ref: (element) => {
                         _tHeadTH.current[index] = element;
-                    }, className: "flex justify-content-center sticky-left", style: { display: "flex", alignItems: "center", height: rowHeights[index] ?? 0 }, "data-sticky-position": "left" },
+                    }, className: "flex justify-content-center sticky sticky-left", "data-sticky-position": "left" },
                     React.createElement(Checkbox, { key: Date.now(), ref: (element) => {
                             if (!element)
                                 return;
@@ -45,13 +46,14 @@ function TBody({ data, columns, refs, methods, states, config }) {
                             methods.selections?.(refs._selectionItems.current);
                             setTriggerForRender((prev) => !prev);
                         } }))),
-                isHasSubitems && _subrowButton ? (React.createElement("td", null, item[_subrowSelector] && (React.createElement("div", { className: "subitem-open-button-wrapper" },
-                    React.createElement("span", { className: `subitem-open-button ${(states.showSubitems.get[key] && "opened") ?? ""}`, onClick: () => {
-                            states.showSubitems.set((prev) => ({
-                                ...prev,
-                                [`${key}`]: !prev[`${key}`],
-                            }));
-                        } }))))) : isHasSubitems && _subrowButton ? (React.createElement("td", { style: { width: 0, minWidth: 0 } })) : null,
+                isHasSubitems && _subrowButton ? (React.createElement("td", { className: "subrow-col sticky sticky-left", "data-sticky-position": "left" },
+                    React.createElement("div", { className: "subitem-open-button-wrapper" },
+                        React.createElement("span", { className: `subitem-open-button ${(states.showSubitems.get[key] && "opened") ?? ""} ${!_subitem && "passive"}`, onClick: () => {
+                                states.showSubitems.set((prev) => ({
+                                    ...prev,
+                                    [`${key}`]: !prev[`${key}`],
+                                }));
+                            } })))) : isHasSubitems && _subrowButton ? (React.createElement("td", { style: { width: 0, minWidth: 0 } })) : null,
                 columns.map((column, cIndex) => {
                     return renderCell({
                         item,
@@ -67,6 +69,7 @@ function TBody({ data, columns, refs, methods, states, config }) {
     };
     const renderCell = ({ item, column, index, cIndex, depth, level, height = 0, isSubrows = false }) => {
         let render;
+        const isHasSubitems = _subrowSelector in item;
         // `column.key` bir string ise
         if (typeof column.key !== "object")
             render = column.render ? column.render(item) : item[column.key];
@@ -92,7 +95,11 @@ function TBody({ data, columns, refs, methods, states, config }) {
                     ? { width: column.config.width, minWidth: column.config.width, maxWidth: column.config.width }
                     : {}),
             }, "data-sticky-position": column.config?.sticky },
-            React.createElement("div", { style: { paddingLeft: cIndex === (methods.selections ? 1 : 0) ? `${depth == 0 ? 1 : depth}rem` : "" }, className: "table-cell" },
+            React.createElement("div", { style: {
+                    paddingLeft: cIndex === (methods.selections || (isHasSubitems && _subrowButton) ? 1 : 0)
+                        ? `${depth == 0 ? 1 : depth}rem`
+                        : "",
+                }, className: "table-cell" },
                 config.isTreeView && cIndex === 0 && (React.createElement(React.Fragment, null,
                     isSubrows &&
                         Array.from({ length: level }).map((_, i) => {
@@ -118,7 +125,7 @@ function TBody({ data, columns, refs, methods, states, config }) {
             const isHasSubitems = _subrowSelector in subitem;
             return (React.createElement(Fragment, { key: `subitem-${index}-${subindex}-${Math.random()}` },
                 React.createElement("tr", { className: `subrow-item ${_subrowButton ? "type-b" : "type-a"}`, "data-level": level },
-                    isHasSubitems && _subrowButton ? (React.createElement("td", null,
+                    isHasSubitems && _subrowButton ? (React.createElement("td", { className: "subrow-col sticky sticky-left", "data-sticky-position": "left" },
                         React.createElement("div", { className: "subitem-open-button-wrapper" },
                             React.createElement("span", { className: `${(states.showSubitems.get[key] && "opened") ?? ""} ${!_subitem && "passive"}`, onClick: () => {
                                     if (!_subitem)

package/dist/components/data-display/table/index.js

@@ -606,8 +606,7 @@ const Table = forwardRef(({ children, trackBy, title, description, data, columns
             React.createElement("table", { ref: _innerRef },
                 React.createElement("thead", null,
                     React.createElement("tr", { key: "selection" },
-                        data.some((item) => _subrowSelector in item) && _subrowButton && (React.createElement("td", { style: { width: 0, minWidth: 0 } })),
-                        selections && (React.createElement("th", { className: "selection-col sticky-left", "data-sticky-position": "left", style: { bottom: 0 } },
+                        selections && (React.createElement("th", { className: "selection-col sticky sticky-left", "data-sticky-position": "left", style: { bottom: 0 } },
                             React.createElement(Checkbox, { variant: "filled", color: "green", checked: selectAll, onChange: (event) => {
                                     if (_checkboxItems.current.length > 0) {
                                         setSelectAll(event.target.checked);
@@ -619,6 +618,7 @@ const Table = forwardRef(({ children, trackBy, title, description, data, columns
                                         });
                                     }
                                 } }))),
+                        data.some((item) => _subrowSelector in item) && _subrowButton && (React.createElement("th", { className: "subrow-col sticky sticky-left", "data-sticky-position": "left", style: { bottom: 0 } })),
                         React.createElement(THeadCell, { refs: {
                                 propertiesButton: _propertiesButton,
                             }, states: {
@@ -629,6 +629,7 @@ const Table = forwardRef(({ children, trackBy, title, description, data, columns
                             }, methods: { handleScroll }, columns: columns, config: config })),
                     config?.isSearchable && (React.createElement("tr", { key: "isSearchable" },
                         selections && (React.createElement("th", { key: `column-selections`, className: "selection-col sticky-left", "data-sticky-position": "left" })),
+                        data.some((item) => _subrowSelector in item) && _subrowButton && (React.createElement("th", { key: `column-selections`, className: "subrow-col sticky sticky-left", "data-sticky-position": "left" })),
                         columns.map((c, cIndex) => {
                             let _className = [];
                             const key = typeof c.key !== "object" ? String(c.key) : String(c.key.field);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ar-design",
-  "version": "0.4.59",
+  "version": "0.4.61",
   "main": "./dist/index.js",
   "module": "./dist/index.js",
   "types": "./dist/index.d.ts",
@@ -42,11 +42,11 @@
     "react-dom": ">=18.0.0"
   },
   "devDependencies": {
-    "@types/node": "^25.5.2",
-    "@types/react": "^19.2.14",
+    "@types/node": "^25.9.2",
+    "@types/react": "^19.2.17",
     "@types/react-dom": "^19.2.3",
     "ts-node": "^10.9.2",
     "tslib": "^2.8.1",
-    "typescript": "^6.0.2"
+    "typescript": "^6.0.3"
   }
 }