@raystack/apsara 0.16.2 → 0.17.1

package/dist/index.css

@@ -1449,9 +1449,9 @@ html[data-theme="dark"] {
   border: none;
 
   color: var(--foreground-base);
-  padding: var(--pd-8);
   background-color: var(--background-base);
   font-size: 12px;
+
   line-height: 16px;
   border-radius: var(--br-4);
   outline: 0.5px solid var(--border-base);
@@ -1461,6 +1461,14 @@ html[data-theme="dark"] {
   user-select: none;
 }
 
+.select-module_trigger-sm__rcLow {
+  padding: var(--pd-4);
+}
+
+.select-module_trigger-md__iDsne {
+  padding: var(--pd-8);
+}
+
 .select-module_trigger__1tSaG:hover {
   cursor: pointer;
 }
@@ -2011,6 +2019,10 @@ html[data-theme="dark"] {
   gap: var(--pd-2);
 }
 
+.datatable-module_header__7-CAd {
+  z-index: 1;
+}
+
 .datatable-module_toolbar__lO-aI {
   width: 100%;
   padding: 0 !important;

package/dist/index.js

@@ -20073,10 +20073,20 @@ function Text({ children, className, size, weight, ...props }) {
     return (jsxRuntimeExports$1.jsx("span", { className: text$1({ size, className, weight }), ...props, children: children }));
 }
 
-var styles$d = {"content":"select-module_content__X0QJ-","menuitem":"select-module_menuitem__DfVEU","separator":"select-module_separator__2UBNd","menugroup":"select-module_menugroup__zJbzr","trigger":"select-module_trigger__1tSaG","triggerIcon":"select-module_triggerIcon__iaoZ3"};
+var styles$d = {"content":"select-module_content__X0QJ-","menuitem":"select-module_menuitem__DfVEU","separator":"select-module_separator__2UBNd","menugroup":"select-module_menugroup__zJbzr","trigger":"select-module_trigger__1tSaG","trigger-sm":"select-module_trigger-sm__rcLow","trigger-md":"select-module_trigger-md__iDsne","triggerIcon":"select-module_triggerIcon__iaoZ3"};
 
-const trigger$1 = cva(styles$d.trigger);
-const SelectTrigger = React.forwardRef(({ className, children, ...props }, ref) => (jsxRuntimeExports$1.jsxs($cc7e05a45900e73f$export$41fb9f06171c75f4, { ref: ref, className: trigger$1({ className }), ...props, children: [children, jsxRuntimeExports$1.jsx($cc7e05a45900e73f$export$f04a61298a47a40f, { asChild: true, children: jsxRuntimeExports$1.jsx(ChevronDownIcon, { className: styles$d.triggerIcon }) })] })));
+const trigger$1 = cva(styles$d.trigger, {
+    variants: {
+        size: {
+            small: styles$d["trigger-sm"],
+            medium: styles$d["trigger-md"],
+        },
+    },
+    defaultVariants: {
+        size: "medium",
+    },
+});
+const SelectTrigger = React.forwardRef(({ size, className, children, ...props }, ref) => (jsxRuntimeExports$1.jsxs($cc7e05a45900e73f$export$41fb9f06171c75f4, { ref: ref, className: trigger$1({ size, className }), ...props, children: [children, jsxRuntimeExports$1.jsx($cc7e05a45900e73f$export$f04a61298a47a40f, { asChild: true, children: jsxRuntimeExports$1.jsx(ChevronDownIcon, { className: styles$d.triggerIcon }) })] })));
 SelectTrigger.displayName = $cc7e05a45900e73f$export$41fb9f06171c75f4.displayName;
 const content$1 = cva(styles$d.content);
 const SelectContent = React.forwardRef(({ className, children, position = "popper", ...props }, ref) => (jsxRuntimeExports$1.jsx($cc7e05a45900e73f$export$602eac185826482c, { children: jsxRuntimeExports$1.jsx($cc7e05a45900e73f$export$7c6e2c02157bb7d2, { ref: ref, className: content$1({ className }), position: position, ...props, children: children }) })));
@@ -31719,7 +31729,7 @@ function DataTableFilterOptions({ children, ...props }) {
                     })] })) : null] }));
 }
 
-var styles$4 = {"wrapper":"datatable-module_wrapper__Sxg2d","datatable":"datatable-module_datatable__z-Th2","table":"datatable-module_table__x2IkY","head":"datatable-module_head__zCfCW","toolbar":"datatable-module_toolbar__lO-aI","chip":"datatable-module_chip__IiwTD","chipWrapper":"datatable-module_chipWrapper__iz69x","filterOperator":"datatable-module_filterOperator__qtDsH","filterText":"datatable-module_filterText__w00L8","flex1":"datatable-module_flex1__fA-kQ","tRow":"datatable-module_tRow__GrMHh","tRowClick":"datatable-module_tRowClick__7wzkh"};
+var styles$4 = {"wrapper":"datatable-module_wrapper__Sxg2d","datatable":"datatable-module_datatable__z-Th2","table":"datatable-module_table__x2IkY","head":"datatable-module_head__zCfCW","header":"datatable-module_header__7-CAd","toolbar":"datatable-module_toolbar__lO-aI","chip":"datatable-module_chip__IiwTD","chipWrapper":"datatable-module_chipWrapper__iz69x","filterOperator":"datatable-module_filterOperator__qtDsH","filterText":"datatable-module_filterText__w00L8","flex1":"datatable-module_flex1__fA-kQ","tRow":"datatable-module_tRow__GrMHh","tRowClick":"datatable-module_tRowClick__7wzkh"};
 
 const columnTypesMap = {
     select: "select",
@@ -32189,17 +32199,20 @@ function DataTableRoot({ columns, data, emptyState, children, parentStyle, isLoa
         ? [...new Array(loaderRow)].map((_, i) => ({ id: i }))
         : data;
     const { filteredColumns, addFilterColumn, removeFilterColumn, resetColumns } = useTableColumn();
-    const columnWithCustomFilter = columns.map((col) => {
-        // @ts-ignore;
+    const columnWithCustomFilter = useMemo(() => columns.map((col) => {
         const colId = col.id || col?.accessorKey;
-        if (colId && tableCustomFilter.hasOwnProperty(colId)) {
-            col.filterFn = tableCustomFilter[colId];
-        }
-        col.cell = isLoading
+        const filterFn = colId && tableCustomFilter.hasOwnProperty(colId)
+            ? tableCustomFilter[colId]
+            : undefined;
+        const cell = isLoading
             ? () => (jsxRuntimeExports$1.jsx(Skeleton, { containerClassName: styles$4.flex1, highlightColor: "var(--background-base)", baseColor: "var(--background-base-hover)" }))
             : col.cell;
-        return col;
-    });
+        return {
+            ...col,
+            cell,
+            filterFn,
+        };
+    }), [isLoading, columns, tableCustomFilter]);
     useEffect(() => {
         if (onStateChange) {
             onStateChange(tableState);
@@ -32243,7 +32256,7 @@ function DataTableRoot({ columns, data, emptyState, children, parentStyle, isLoa
                 tableCustomFilter,
                 updateColumnCustomFilter,
                 isLoading,
-            }, 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
+            }, 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, { className: styles$4.header, children: ShouldShowHeader
                                                 ? table.getHeaderGroups().map((headerGroup) => (jsxRuntimeExports$1.jsx(Table.Row, { children: headerGroup.headers.map((header, index) => {
                                                         return (jsxRuntimeExports$1.jsx(Table.Head, { style: {
                                                                 cursor: "pointer",