@raystack/apsara 0.14.0 → 0.14.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +56 -23
- package/dist/index.cjs.map +1 -1
- package/dist/index.css +1 -0
- package/dist/index.js +56 -23
- package/dist/index.js.map +1 -1
- package/dist/table/DataTableFilterChips.d.ts.map +1 -1
- package/dist/table/DataTableFilterOptions.d.ts.map +1 -1
- package/dist/table/datatable.d.ts +2 -1
- package/dist/table/datatable.d.ts.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -2404,11 +2404,11 @@ function _objectWithoutPropertiesLoose$1(source, excluded) {
|
|
|
2404
2404
|
return target;
|
|
2405
2405
|
}
|
|
2406
2406
|
|
|
2407
|
-
var _excluded$
|
|
2408
|
-
var
|
|
2407
|
+
var _excluded$I = ["color"];
|
|
2408
|
+
var CalendarIcon = /*#__PURE__*/React.forwardRef(function (_ref, forwardedRef) {
|
|
2409
2409
|
var _ref$color = _ref.color,
|
|
2410
2410
|
color = _ref$color === void 0 ? 'currentColor' : _ref$color,
|
|
2411
|
-
props = _objectWithoutPropertiesLoose$1(_ref, _excluded$
|
|
2411
|
+
props = _objectWithoutPropertiesLoose$1(_ref, _excluded$I);
|
|
2412
2412
|
|
|
2413
2413
|
return React.createElement("svg", Object.assign({
|
|
2414
2414
|
width: "15",
|
|
@@ -2419,18 +2419,18 @@ var ArrowDownIcon = /*#__PURE__*/React.forwardRef(function (_ref, forwardedRef)
|
|
|
2419
2419
|
}, props, {
|
|
2420
2420
|
ref: forwardedRef
|
|
2421
2421
|
}), React.createElement("path", {
|
|
2422
|
-
d: "
|
|
2422
|
+
d: "M4.5 1C4.77614 1 5 1.22386 5 1.5V2H10V1.5C10 1.22386 10.2239 1 10.5 1C10.7761 1 11 1.22386 11 1.5V2H12.5C13.3284 2 14 2.67157 14 3.5V12.5C14 13.3284 13.3284 14 12.5 14H2.5C1.67157 14 1 13.3284 1 12.5V3.5C1 2.67157 1.67157 2 2.5 2H4V1.5C4 1.22386 4.22386 1 4.5 1ZM10 3V3.5C10 3.77614 10.2239 4 10.5 4C10.7761 4 11 3.77614 11 3.5V3H12.5C12.7761 3 13 3.22386 13 3.5V5H2V3.5C2 3.22386 2.22386 3 2.5 3H4V3.5C4 3.77614 4.22386 4 4.5 4C4.77614 4 5 3.77614 5 3.5V3H10ZM2 6V12.5C2 12.7761 2.22386 13 2.5 13H12.5C12.7761 13 13 12.7761 13 12.5V6H2ZM7 7.5C7 7.22386 7.22386 7 7.5 7C7.77614 7 8 7.22386 8 7.5C8 7.77614 7.77614 8 7.5 8C7.22386 8 7 7.77614 7 7.5ZM9.5 7C9.22386 7 9 7.22386 9 7.5C9 7.77614 9.22386 8 9.5 8C9.77614 8 10 7.77614 10 7.5C10 7.22386 9.77614 7 9.5 7ZM11 7.5C11 7.22386 11.2239 7 11.5 7C11.7761 7 12 7.22386 12 7.5C12 7.77614 11.7761 8 11.5 8C11.2239 8 11 7.77614 11 7.5ZM11.5 9C11.2239 9 11 9.22386 11 9.5C11 9.77614 11.2239 10 11.5 10C11.7761 10 12 9.77614 12 9.5C12 9.22386 11.7761 9 11.5 9ZM9 9.5C9 9.22386 9.22386 9 9.5 9C9.77614 9 10 9.22386 10 9.5C10 9.77614 9.77614 10 9.5 10C9.22386 10 9 9.77614 9 9.5ZM7.5 9C7.22386 9 7 9.22386 7 9.5C7 9.77614 7.22386 10 7.5 10C7.77614 10 8 9.77614 8 9.5C8 9.22386 7.77614 9 7.5 9ZM5 9.5C5 9.22386 5.22386 9 5.5 9C5.77614 9 6 9.22386 6 9.5C6 9.77614 5.77614 10 5.5 10C5.22386 10 5 9.77614 5 9.5ZM3.5 9C3.22386 9 3 9.22386 3 9.5C3 9.77614 3.22386 10 3.5 10C3.77614 10 4 9.77614 4 9.5C4 9.22386 3.77614 9 3.5 9ZM3 11.5C3 11.2239 3.22386 11 3.5 11C3.77614 11 4 11.2239 4 11.5C4 11.7761 3.77614 12 3.5 12C3.22386 12 3 11.7761 3 11.5ZM5.5 11C5.22386 11 5 11.2239 5 11.5C5 11.7761 5.22386 12 5.5 12C5.77614 12 6 11.7761 6 11.5C6 11.2239 5.77614 11 5.5 11ZM7 11.5C7 11.2239 7.22386 11 7.5 11C7.77614 11 8 11.2239 8 11.5C8 11.7761 7.77614 12 7.5 12C7.22386 12 7 11.7761 7 11.5ZM9.5 11C9.22386 11 9 11.2239 9 11.5C9 11.7761 9.22386 12 9.5 12C9.77614 12 10 11.7761 10 11.5C10 11.2239 9.77614 11 9.5 11Z",
|
|
2423
2423
|
fill: color,
|
|
2424
2424
|
fillRule: "evenodd",
|
|
2425
2425
|
clipRule: "evenodd"
|
|
2426
2426
|
}));
|
|
2427
2427
|
});
|
|
2428
2428
|
|
|
2429
|
-
var _excluded$
|
|
2430
|
-
var
|
|
2429
|
+
var _excluded$N = ["color"];
|
|
2430
|
+
var CaretDownIcon = /*#__PURE__*/React.forwardRef(function (_ref, forwardedRef) {
|
|
2431
2431
|
var _ref$color = _ref.color,
|
|
2432
2432
|
color = _ref$color === void 0 ? 'currentColor' : _ref$color,
|
|
2433
|
-
props = _objectWithoutPropertiesLoose$1(_ref, _excluded$
|
|
2433
|
+
props = _objectWithoutPropertiesLoose$1(_ref, _excluded$N);
|
|
2434
2434
|
|
|
2435
2435
|
return React.createElement("svg", Object.assign({
|
|
2436
2436
|
width: "15",
|
|
@@ -2441,18 +2441,18 @@ var ArrowUpIcon = /*#__PURE__*/React.forwardRef(function (_ref, forwardedRef) {
|
|
|
2441
2441
|
}, props, {
|
|
2442
2442
|
ref: forwardedRef
|
|
2443
2443
|
}), React.createElement("path", {
|
|
2444
|
-
d: "
|
|
2444
|
+
d: "M4.18179 6.18181C4.35753 6.00608 4.64245 6.00608 4.81819 6.18181L7.49999 8.86362L10.1818 6.18181C10.3575 6.00608 10.6424 6.00608 10.8182 6.18181C10.9939 6.35755 10.9939 6.64247 10.8182 6.81821L7.81819 9.81821C7.73379 9.9026 7.61934 9.95001 7.49999 9.95001C7.38064 9.95001 7.26618 9.9026 7.18179 9.81821L4.18179 6.81821C4.00605 6.64247 4.00605 6.35755 4.18179 6.18181Z",
|
|
2445
2445
|
fill: color,
|
|
2446
2446
|
fillRule: "evenodd",
|
|
2447
2447
|
clipRule: "evenodd"
|
|
2448
2448
|
}));
|
|
2449
2449
|
});
|
|
2450
2450
|
|
|
2451
|
-
var _excluded$
|
|
2452
|
-
var
|
|
2451
|
+
var _excluded$Q = ["color"];
|
|
2452
|
+
var CaretSortIcon = /*#__PURE__*/React.forwardRef(function (_ref, forwardedRef) {
|
|
2453
2453
|
var _ref$color = _ref.color,
|
|
2454
2454
|
color = _ref$color === void 0 ? 'currentColor' : _ref$color,
|
|
2455
|
-
props = _objectWithoutPropertiesLoose$1(_ref, _excluded$
|
|
2455
|
+
props = _objectWithoutPropertiesLoose$1(_ref, _excluded$Q);
|
|
2456
2456
|
|
|
2457
2457
|
return React.createElement("svg", Object.assign({
|
|
2458
2458
|
width: "15",
|
|
@@ -2463,7 +2463,29 @@ var CalendarIcon = /*#__PURE__*/React.forwardRef(function (_ref, forwardedRef) {
|
|
|
2463
2463
|
}, props, {
|
|
2464
2464
|
ref: forwardedRef
|
|
2465
2465
|
}), React.createElement("path", {
|
|
2466
|
-
d: "M4.
|
|
2466
|
+
d: "M4.93179 5.43179C4.75605 5.60753 4.75605 5.89245 4.93179 6.06819C5.10753 6.24392 5.39245 6.24392 5.56819 6.06819L7.49999 4.13638L9.43179 6.06819C9.60753 6.24392 9.89245 6.24392 10.0682 6.06819C10.2439 5.89245 10.2439 5.60753 10.0682 5.43179L7.81819 3.18179C7.73379 3.0974 7.61933 3.04999 7.49999 3.04999C7.38064 3.04999 7.26618 3.0974 7.18179 3.18179L4.93179 5.43179ZM10.0682 9.56819C10.2439 9.39245 10.2439 9.10753 10.0682 8.93179C9.89245 8.75606 9.60753 8.75606 9.43179 8.93179L7.49999 10.8636L5.56819 8.93179C5.39245 8.75606 5.10753 8.75606 4.93179 8.93179C4.75605 9.10753 4.75605 9.39245 4.93179 9.56819L7.18179 11.8182C7.35753 11.9939 7.64245 11.9939 7.81819 11.8182L10.0682 9.56819Z",
|
|
2467
|
+
fill: color,
|
|
2468
|
+
fillRule: "evenodd",
|
|
2469
|
+
clipRule: "evenodd"
|
|
2470
|
+
}));
|
|
2471
|
+
});
|
|
2472
|
+
|
|
2473
|
+
var _excluded$R = ["color"];
|
|
2474
|
+
var CaretUpIcon = /*#__PURE__*/React.forwardRef(function (_ref, forwardedRef) {
|
|
2475
|
+
var _ref$color = _ref.color,
|
|
2476
|
+
color = _ref$color === void 0 ? 'currentColor' : _ref$color,
|
|
2477
|
+
props = _objectWithoutPropertiesLoose$1(_ref, _excluded$R);
|
|
2478
|
+
|
|
2479
|
+
return React.createElement("svg", Object.assign({
|
|
2480
|
+
width: "15",
|
|
2481
|
+
height: "15",
|
|
2482
|
+
viewBox: "0 0 15 15",
|
|
2483
|
+
fill: "none",
|
|
2484
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
2485
|
+
}, props, {
|
|
2486
|
+
ref: forwardedRef
|
|
2487
|
+
}), React.createElement("path", {
|
|
2488
|
+
d: "M4.18179 8.81819C4.00605 8.64245 4.00605 8.35753 4.18179 8.18179L7.18179 5.18179C7.26618 5.0974 7.38064 5.04999 7.49999 5.04999C7.61933 5.04999 7.73379 5.0974 7.81819 5.18179L10.8182 8.18179C10.9939 8.35753 10.9939 8.64245 10.8182 8.81819C10.6424 8.99392 10.3575 8.99392 10.1818 8.81819L7.49999 6.13638L4.81819 8.81819C4.64245 8.99392 4.35753 8.99392 4.18179 8.81819Z",
|
|
2467
2489
|
fill: color,
|
|
2468
2490
|
fillRule: "evenodd",
|
|
2469
2491
|
clipRule: "evenodd"
|
|
@@ -31735,10 +31757,14 @@ function DataTableFilterOptions({ children, ...props }) {
|
|
|
31735
31757
|
const { table, filteredColumns, addFilterColumn } = useTable();
|
|
31736
31758
|
const availableColumns = table
|
|
31737
31759
|
.getAllColumns()
|
|
31738
|
-
.filter((column) => typeof column.accessorFn !== "undefined" &&
|
|
31760
|
+
.filter((column) => typeof column.accessorFn !== "undefined" &&
|
|
31761
|
+
column.getCanHide() &&
|
|
31762
|
+
column.getCanFilter())
|
|
31739
31763
|
.filter((column) => !filteredColumns.includes(column.id));
|
|
31740
31764
|
return (jsxRuntimeExports$1.jsxs(DropdownMenu, { children: [jsxRuntimeExports$1.jsx(DropdownMenu.Trigger, { asChild: true, children: jsxRuntimeExports$1.jsx(Button$1, { variant: "ghost", ...props, children: children || (jsxRuntimeExports$1.jsxs(Flex, { gap: "small", align: "center", justify: "center", children: [jsxRuntimeExports$1.jsx(PlusIcon, { width: 12, height: "12" }), " Filter"] })) }) }), availableColumns.length ? (jsxRuntimeExports$1.jsxs(DropdownMenu.Content, { align: "end", className: "w-[150px]", children: [jsxRuntimeExports$1.jsx(DropdownMenu.Label, { children: "Filter column" }), jsxRuntimeExports$1.jsx(DropdownMenu.Separator, {}), availableColumns.map((column) => {
|
|
31741
|
-
|
|
31765
|
+
const columnHeader = column?.columnDef?.header;
|
|
31766
|
+
const columnName = (typeof columnHeader === "string" && columnHeader) || column.id;
|
|
31767
|
+
return (jsxRuntimeExports$1.jsx(DropdownMenu.Item, { onSelect: () => addFilterColumn(column.id), children: columnName }, column.id));
|
|
31742
31768
|
})] })) : null] }));
|
|
31743
31769
|
}
|
|
31744
31770
|
|
|
@@ -32009,7 +32035,9 @@ function DataTableFilterChips(props) {
|
|
|
32009
32035
|
const { filteredColumns, table, updateColumnCustomFilter } = useTable();
|
|
32010
32036
|
const tableColumns = table
|
|
32011
32037
|
.getAllColumns()
|
|
32012
|
-
.filter((column) => typeof column.accessorFn !== "undefined" &&
|
|
32038
|
+
.filter((column) => typeof column.accessorFn !== "undefined" &&
|
|
32039
|
+
column.getCanHide() &&
|
|
32040
|
+
column.getCanFilter());
|
|
32013
32041
|
if (!filteredColumns.length)
|
|
32014
32042
|
return null;
|
|
32015
32043
|
return (jsxRuntimeExports$1.jsxs(Flex, { gap: "small", align: "center", className: styles$4.chipWrapper, ...props, children: [filteredColumns.map((filter, index) => {
|
|
@@ -32199,7 +32227,7 @@ function Skeleton({ count = 1, wrapper: Wrapper, className: customClassName, con
|
|
|
32199
32227
|
: elements));
|
|
32200
32228
|
}
|
|
32201
32229
|
|
|
32202
|
-
function DataTableRoot({ columns, data, emptyState, children, parentStyle, isLoading = false, ShouldShowHeader = true, ...props }) {
|
|
32230
|
+
function DataTableRoot({ columns, data, emptyState, children, parentStyle, isLoading = false, ShouldShowHeader = true, loaderRow = 5, ...props }) {
|
|
32203
32231
|
const [tableCustomFilter, setTableCustomFilter] = React.useState({});
|
|
32204
32232
|
const convertedChildren = React.Children.toArray(children);
|
|
32205
32233
|
const header = convertedChildren.find((child) => child.type === DataTableToolbar) || null;
|
|
@@ -32208,6 +32236,9 @@ function DataTableRoot({ columns, data, emptyState, children, parentStyle, isLoa
|
|
|
32208
32236
|
null;
|
|
32209
32237
|
const [sorting, setSorting] = React.useState([]);
|
|
32210
32238
|
const [columnFilters, setColumnFilters] = React.useState([]);
|
|
32239
|
+
const tableData = isLoading
|
|
32240
|
+
? [...new Array(loaderRow)].map((_, i) => ({ id: i }))
|
|
32241
|
+
: data;
|
|
32211
32242
|
const [columnVisibility, setColumnVisibility] = React.useState({});
|
|
32212
32243
|
const [rowSelection, setRowSelection] = React.useState({});
|
|
32213
32244
|
const [globalFilter, setGlobalFilter] = React.useState("");
|
|
@@ -32227,7 +32258,7 @@ function DataTableRoot({ columns, data, emptyState, children, parentStyle, isLoa
|
|
|
32227
32258
|
setTableCustomFilter((old) => ({ ...old, [id]: filterFn }));
|
|
32228
32259
|
};
|
|
32229
32260
|
const table = useReactTable({
|
|
32230
|
-
data,
|
|
32261
|
+
data: tableData,
|
|
32231
32262
|
columns: columnWithCustomFilter,
|
|
32232
32263
|
globalFilterFn: "auto",
|
|
32233
32264
|
enableRowSelection: true,
|
|
@@ -32269,14 +32300,16 @@ function DataTableRoot({ columns, data, emptyState, children, parentStyle, isLoa
|
|
|
32269
32300
|
}, children: [jsxRuntimeExports$1.jsxs(Flex, { direction: "column", className: styles$4.datatable, children: [header, jsxRuntimeExports$1.jsxs(Flex, { className: styles$4.tableContainer, style: parentStyle, children: [jsxRuntimeExports$1.jsxs(Table, { ...props, style: tableStyle, children: [jsxRuntimeExports$1.jsx(Table.Header, { children: ShouldShowHeader
|
|
32270
32301
|
? table.getHeaderGroups().map((headerGroup) => (jsxRuntimeExports$1.jsx(Table.Row, { children: headerGroup.headers.map((header, index) => {
|
|
32271
32302
|
return (jsxRuntimeExports$1.jsx(Table.Head, { style: {
|
|
32303
|
+
cursor: "pointer",
|
|
32272
32304
|
...(header.column.columnDef?.meta?.style ?? {}),
|
|
32273
|
-
}, children: jsxRuntimeExports$1.jsxs(Text, { className: styles$4.head, children: [header.isPlaceholder
|
|
32305
|
+
}, onClick: header.column.getToggleSortingHandler(), children: jsxRuntimeExports$1.jsxs(Text, { className: styles$4.head, children: [header.isPlaceholder
|
|
32274
32306
|
? null
|
|
32275
|
-
: flexRender(header.column.columnDef.header, header.getContext()),
|
|
32276
|
-
|
|
32277
|
-
|
|
32278
|
-
|
|
32279
|
-
|
|
32307
|
+
: flexRender(header.column.columnDef.header, header.getContext()), header.column.getCanSort()
|
|
32308
|
+
? {
|
|
32309
|
+
asc: jsxRuntimeExports$1.jsx(CaretUpIcon, {}),
|
|
32310
|
+
desc: jsxRuntimeExports$1.jsx(CaretDownIcon, {}),
|
|
32311
|
+
}[header.column.getIsSorted()] ?? jsxRuntimeExports$1.jsx(CaretSortIcon, {})
|
|
32312
|
+
: null] }) }, `${header.id}_${index}`));
|
|
32280
32313
|
}) }, headerGroup.id)))
|
|
32281
32314
|
: null }), jsxRuntimeExports$1.jsx(Table.Body, { children: table.getRowModel().rows?.length ? (table.getRowModel().rows.map((row) => (jsxRuntimeExports$1.jsx(Table.Row, { "data-state": row.getIsSelected() && "selected", children: row.getVisibleCells().map((cell, index) => (jsxRuntimeExports$1.jsx(Table.Cell, { style: {
|
|
32282
32315
|
...(cell.column.columnDef?.meta?.style ?? {}),
|