@lotte-innovate/ui-component-test 0.0.129 → 0.0.130
Sign up to get free protection for your applications and to get access to all the features.
|
@@ -21,9 +21,11 @@ var __rest = (this && this.__rest) || function (s, e) {
|
|
|
21
21
|
}
|
|
22
22
|
return t;
|
|
23
23
|
};
|
|
24
|
-
import { jsx as _jsx } from "react/jsx-runtime";
|
|
24
|
+
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
|
|
25
25
|
import { createColumnHelper, getCoreRowModel, getExpandedRowModel, getPaginationRowModel, getSortedRowModel, useReactTable, } from '@tanstack/react-table';
|
|
26
|
-
import React, { useRef } from 'react';
|
|
26
|
+
import React, { useEffect, useRef } from 'react';
|
|
27
|
+
import IconButton from '../IconButton';
|
|
28
|
+
import { ChevronDownIcon, ChevronRightIcon } from '@radix-ui/react-icons';
|
|
27
29
|
import Checkbox from '../Checkbox';
|
|
28
30
|
import { useTheme } from '../../../lib/theme';
|
|
29
31
|
function IndeterminateCheckbox(_a) {
|
|
@@ -47,33 +49,15 @@ export var useGrid = function (_a) {
|
|
|
47
49
|
var columnsData = (_b = props === null || props === void 0 ? void 0 : props.columns) === null || _b === void 0 ? void 0 : _b.map(function (el) {
|
|
48
50
|
return columnHelper.accessor(el.id, __assign({}, el));
|
|
49
51
|
});
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
// <IconButton
|
|
60
|
-
// onClick={props.row.getToggleExpandedHandler()}
|
|
61
|
-
// appearance="ghost"
|
|
62
|
-
// className={`h-3 w-3`}
|
|
63
|
-
// color={props.color ?? theme.themeColor}
|
|
64
|
-
// >
|
|
65
|
-
// {props.row.getIsExpanded() ? <ChevronDownIcon /> : <ChevronRightIcon />}
|
|
66
|
-
// </IconButton>
|
|
67
|
-
// ) : (
|
|
68
|
-
// <></>
|
|
69
|
-
// )}
|
|
70
|
-
// <div>{firstcell ? firstcell(props) : props.getValue()}</div>
|
|
71
|
-
// </div>
|
|
72
|
-
// );
|
|
73
|
-
// },
|
|
74
|
-
// };
|
|
75
|
-
// }
|
|
76
|
-
// }, [props.enableExpanding]);
|
|
52
|
+
useEffect(function () {
|
|
53
|
+
if (props.enableExpanding) {
|
|
54
|
+
var firstcell_1 = columnsData[0].cell;
|
|
55
|
+
columnsData[0] = __assign(__assign({}, columnsData[0]), { cell: function (props) {
|
|
56
|
+
var _a;
|
|
57
|
+
return (_jsxs("div", { className: "flex", style: { paddingLeft: "".concat(props.row.depth * 10, "px") }, children: [props.row.getCanExpand() ? (_jsx(IconButton, { onClick: props.row.getToggleExpandedHandler(), appearance: "ghost", className: "h-3 w-3", color: (_a = props.color) !== null && _a !== void 0 ? _a : theme.themeColor, children: props.row.getIsExpanded() ? _jsx(ChevronDownIcon, {}) : _jsx(ChevronRightIcon, {}) })) : (_jsx(_Fragment, {})), _jsx("div", { children: firstcell_1 ? firstcell_1(props) : props.getValue() })] }));
|
|
58
|
+
} });
|
|
59
|
+
}
|
|
60
|
+
}, [props.enableExpanding]);
|
|
77
61
|
// useEffect(() => {
|
|
78
62
|
// if (props.enableRowSelection) {
|
|
79
63
|
// columnsData?.unshift({
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
"use client";
|
|
2
|
-
import"react/jsx-runtime";import{createColumnHelper as
|
|
2
|
+
import{jsxs as e,jsx as o,Fragment as n}from"react/jsx-runtime";import{createColumnHelper as t,getSortedRowModel as r,getCoreRowModel as a,getExpandedRowModel as i,getPaginationRowModel as l,useReactTable as c}from"@tanstack/react-table";import d,{useEffect as p}from"react";import{IconButton as s}from"../IconButton/index.mjs";import{ChevronDownIcon as u,ChevronRightIcon as g}from"@radix-ui/react-icons";import"../Checkbox/index.mjs";import{useTheme as m}from"../../theme/ThemeProvider.mjs";var f=function(){return f=Object.assign||function(e){for(var o,n=1,t=arguments.length;n<t;n++)for(var r in o=arguments[n])Object.prototype.hasOwnProperty.call(o,r)&&(e[r]=o[r]);return e},f.apply(this,arguments)},x=function(e,o){var n={};for(var t in e)Object.prototype.hasOwnProperty.call(e,t)&&o.indexOf(t)<0&&(n[t]=e[t]);if(null!=e&&"function"==typeof Object.getOwnPropertySymbols){var r=0;for(t=Object.getOwnPropertySymbols(e);r<t.length;r++)o.indexOf(t[r])<0&&Object.prototype.propertyIsEnumerable.call(e,t[r])&&(n[t[r]]=e[t[r]])}return n},h=function(h){var w,b,v=x(h,[]),y=m().theme,O=d.useState([]),E=O[0],j=O[1],S=d.useState({}),C=S[0],R=S[1],P=d.useState({}),M=P[0],k=P[1],I=t(),N=null===(w=null==v?void 0:v.columns)||void 0===w?void 0:w.map((function(e){return I.accessor(e.id,f({},e))}));p((function(){if(v.enableExpanding){var t=N[0].cell;N[0]=f(f({},N[0]),{cell:function(r){var a;return e("div",{className:"flex",style:{paddingLeft:"".concat(10*r.row.depth,"px")},children:[r.row.getCanExpand()?o(s,{onClick:r.row.getToggleExpandedHandler(),appearance:"ghost",className:"h-3 w-3",color:null!==(a=r.color)&&void 0!==a?a:y.themeColor,children:r.row.getIsExpanded()?o(u,{}):o(g,{})}):o(n,{}),o("div",{children:t?t(r):r.getValue()})]})}})}}),[v.enableExpanding]);var T=f(f({state:{sorting:E,rowSelection:M,expanded:C}},v),{data:v.data,columns:N,color:null!==(b=v.color)&&void 0!==b?b:y.themeColor,paginateExpandedRows:!0,enableExpanding:!!v.enableExpanding,getSubRows:function(e){return e.subRows},onExpandedChange:R,onSortingChange:j,onRowSelectionChange:k,getSortedRowModel:r(),getCoreRowModel:a(),getExpandedRowModel:i()});return v.enableRowPagination&&(T.getPaginationRowModel=l()),c(T)};export{h as useGrid};
|
|
3
3
|
//# sourceMappingURL=useGrid.mjs.map
|