@uxf/data-grid 5.0.0-beta.20 → 5.0.0-beta.21

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@uxf/data-grid",
-  "version": "5.0.0-beta.20",
+  "version": "5.0.0-beta.21",
   "description": "Redux DataGrid",
   "homepage": "https://gitlab.com/uxf-npm/data-grid#readme",
   "main": "index.js",

package/tailwindui/filter-handler/bool-filter.js

@@ -22,11 +22,11 @@ var BoolFilterHandler = {
             { id: "", label: "Nerozhoduje" },
             { id: 1, label: "Ano" },
             { id: 0, label: "Ne" },
-        ], label: props.filter.label, value: props.value.value, onChange: function (value) { return props.onFilter(__assign(__assign({}, props.value), { value: value })); } })); },
+        ], label: props.filter.label, value: props.value.value, onChange: function (value) { return props.onFilter(__assign(__assign({}, props.value), { value: value })); }, isClearable: true })); },
     listItem: function (props) { return (react_1.default.createElement(chip_1.Chip, { onClose: props.onClear },
         props.filter.label,
         ":\u00A0",
         props.value.value ? "Ano" : "Ne")); },
 };
 exports.default = BoolFilterHandler;
-//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYm9vbC1maWx0ZXIuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvdGFpbHdpbmR1aS9maWx0ZXItaGFuZGxlci9ib29sLWZpbHRlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7OztBQUFBLGdEQUEwQjtBQUUxQixxQ0FBb0M7QUFDcEMseUNBQXdDO0FBRXhDLElBQU0saUJBQWlCLEdBQWtCO0lBQ3JDLEtBQUssRUFBRSxVQUFBLEtBQUssSUFBSSxPQUFBLENBQ1osOEJBQUMsZUFBTSxJQUNILE9BQU8sRUFBRTtZQUNMLEVBQUUsRUFBRSxFQUFFLEVBQUUsRUFBRSxLQUFLLEVBQUUsYUFBYSxFQUFFO1lBQ2hDLEVBQUUsRUFBRSxFQUFFLENBQUMsRUFBRSxLQUFLLEVBQUUsS0FBSyxFQUFFO1lBQ3ZCLEVBQUUsRUFBRSxFQUFFLENBQUMsRUFBRSxLQUFLLEVBQUUsSUFBSSxFQUFFO1NBQ3pCLEVBQ0QsS0FBSyxFQUFFLEtBQUssQ0FBQyxNQUFNLENBQUMsS0FBSyxFQUN6QixLQUFLLEVBQUUsS0FBSyxDQUFDLEtBQUssQ0FBQyxLQUFLLEVBQ3hCLFFBQVEsRUFBRSxVQUFBLEtBQUssSUFBSSxPQUFBLEtBQUssQ0FBQyxRQUFRLHVCQUFNLEtBQUssQ0FBQyxLQUFLLEtBQUUsS0FBSyxPQUFBLElBQUcsRUFBekMsQ0FBeUMsR0FDOUQsQ0FDTCxFQVhlLENBV2Y7SUFDRCxRQUFRLEVBQUUsVUFBQSxLQUFLLElBQUksT0FBQSxDQUNmLDhCQUFDLFdBQUksSUFBQyxPQUFPLEVBQUUsS0FBSyxDQUFDLE9BQU87UUFDdkIsS0FBSyxDQUFDLE1BQU0sQ0FBQyxLQUFLOztRQUFTLEtBQUssQ0FBQyxLQUFLLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDLElBQUksQ0FDekQsQ0FDVixFQUprQixDQUlsQjtDQUNKLENBQUM7QUFFRixrQkFBZSxpQkFBaUIsQ0FBQyJ9
+//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYm9vbC1maWx0ZXIuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi9zcmMvdGFpbHdpbmR1aS9maWx0ZXItaGFuZGxlci9ib29sLWZpbHRlci50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6Ijs7Ozs7Ozs7Ozs7Ozs7OztBQUFBLGdEQUEwQjtBQUUxQixxQ0FBb0M7QUFDcEMseUNBQXdDO0FBRXhDLElBQU0saUJBQWlCLEdBQWtCO0lBQ3JDLEtBQUssRUFBRSxVQUFBLEtBQUssSUFBSSxPQUFBLENBQ1osOEJBQUMsZUFBTSxJQUNILE9BQU8sRUFBRTtZQUNMLEVBQUUsRUFBRSxFQUFFLEVBQUUsRUFBRSxLQUFLLEVBQUUsYUFBYSxFQUFFO1lBQ2hDLEVBQUUsRUFBRSxFQUFFLENBQUMsRUFBRSxLQUFLLEVBQUUsS0FBSyxFQUFFO1lBQ3ZCLEVBQUUsRUFBRSxFQUFFLENBQUMsRUFBRSxLQUFLLEVBQUUsSUFBSSxFQUFFO1NBQ3pCLEVBQ0QsS0FBSyxFQUFFLEtBQUssQ0FBQyxNQUFNLENBQUMsS0FBSyxFQUN6QixLQUFLLEVBQUUsS0FBSyxDQUFDLEtBQUssQ0FBQyxLQUFLLEVBQ3hCLFFBQVEsRUFBRSxVQUFBLEtBQUssSUFBSSxPQUFBLEtBQUssQ0FBQyxRQUFRLHVCQUFNLEtBQUssQ0FBQyxLQUFLLEtBQUUsS0FBSyxPQUFBLElBQUcsRUFBekMsQ0FBeUMsRUFDNUQsV0FBVyxTQUNiLENBQ0wsRUFaZSxDQVlmO0lBQ0QsUUFBUSxFQUFFLFVBQUEsS0FBSyxJQUFJLE9BQUEsQ0FDZiw4QkFBQyxXQUFJLElBQUMsT0FBTyxFQUFFLEtBQUssQ0FBQyxPQUFPO1FBQ3ZCLEtBQUssQ0FBQyxNQUFNLENBQUMsS0FBSzs7UUFBUyxLQUFLLENBQUMsS0FBSyxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQ3pELENBQ1YsRUFKa0IsQ0FJbEI7Q0FDSixDQUFDO0FBRUYsa0JBQWUsaUJBQWlCLENBQUMifQ==

package/tailwindui/styles.css

@@ -1,5 +1,5 @@
 .uxf-data-grid {
-    @apply border border-gray-300 rounded;
+    @apply border border-gray-300 dark:border-gray-700 rounded;
 
     &.no-border {
         @apply border-0;
@@ -8,14 +8,18 @@
     &__action-cell {
         @apply sticky right-0;
 
-        border-inline-start: 1px solid var(--rdg-border-color);
+        border-inline-start: 1px solid theme("colors.gray.200");
+
+        :root .dark & {
+            border-inline-start: 1px solid theme("colors.gray.700");
+        }
     }
 
     &__action-cell-wrapper {
         @apply flex items-center justify-center text-center w-full h-full space-x-2;
 
         .uxf-icon {
-            @apply text-gray-400;
+            @apply text-gray-400 dark:text-gray-500;
         }
     }
 
@@ -26,7 +30,7 @@
     }
 
     &__drawer {
-        @apply fixed overflow-hidden z-10 bg-gray-900 bg-opacity-25 inset-0 transform ease-in-out;
+        @apply fixed overflow-hidden z-10 bg-gray-900 bg-opacity-25 dark:bg-opacity-75 inset-0 transform ease-in-out;
 
         &--open {
             @apply transition-opacity opacity-100 duration-500 translate-x-0;
@@ -45,7 +49,7 @@
         }
 
         &-body {
-            @apply relative w-full max-w-sm pb-10 flex flex-col overflow-y-scroll h-full;
+            @apply relative w-full max-w-sm pb-10 flex flex-col overflow-y-scroll h-full dark:bg-gray-950 dark:text-gray-100;
         }
 
         &-close-button {
@@ -68,7 +72,7 @@
     &__fallback {
         grid-column: 1/-1;
 
-        @apply flex items-center justify-center text-center text-gray-600;
+        @apply flex items-center justify-center text-center text-gray-600; /* ?? */
     }
 
     &__filter {
@@ -165,7 +169,7 @@
     }
 
     &__selected-rows-toolbar {
-        @apply text-white text-sm bg-dataGridPrimary rounded-full px-6 py-2 flex items-center justify-center drop-shadow-xl border border-gray-100;
+        @apply text-white text-sm bg-dataGridPrimary rounded-full px-6 py-2 flex items-center justify-center drop-shadow-xl border border-gray-100 dark:border-gray-800;
     }
 
     &__selected-rows-toolbar-actions {
@@ -177,7 +181,7 @@
     }
 
     &__toolbar {
-        @apply flex flex-wrap gap-2 items-center justify-end border-b border-b-gray-300 px-2 md:pl-0 py-2 md:py-0;
+        @apply flex flex-wrap gap-2 items-center justify-end border-b border-b-gray-300 dark:border-b-gray-700 px-2 md:pl-0 py-2 md:py-0;
     }
 
     &__toolbar-tab {
@@ -211,18 +215,18 @@
                     @apply m-0 flex items-center;
 
                     &-icon {
-                        @apply ml-1 text-lightHigh;
+                        @apply ml-1 text-lightHigh dark:text-darkHigh;
                     }
                 }
             }
 
             &-text {
-                @apply text-lightHigh;
+                @apply text-lightHigh dark:text-darkHigh;
             }
         }
 
         &-modal-content {
-            @apply flex flex-col items-start divide-y divide-lightBorder pb-4 pt-1 text-left;
+            @apply flex flex-col items-start divide-y divide-lightBorder dark:divide-darkBorder pb-4 pt-1 text-left;
         }
 
         &-modal-button {
@@ -230,11 +234,11 @@
         }
 
         &-modal-button-text {
-            @apply text-lightHigh;
+            @apply text-lightHigh dark:text-darkHigh;
         }
 
         &-modal-active-tab-icon {
-            @apply text-lightMedium mr-3;
+            @apply text-lightMedium dark:text-darkMedium mr-3;
         }
     }
 
@@ -267,13 +271,17 @@
 }
 
 .rdg-header-row {
-    @apply bg-gray-200 text-gray-400 font-medium;
+    @apply bg-gray-200 dark:bg-gray-800 text-gray-400 dark:text-gray-600 font-medium;
 
     .rdg-cell {
-        @apply rounded-none bg-gray-50;
+        @apply rounded-none bg-gray-50 dark:bg-gray-900 dark:text-darkMedium;
 
         &:not(:first-child) {
-            border-inline-start: 1px solid var(--rdg-border-color);
+            border-inline-start: 1px solid theme("colors.gray.200");
+
+            :root .dark & {
+                border-inline-start: 1px solid theme("colors.gray.700");
+            }
         }
     }
 }
@@ -293,26 +301,38 @@
 
 .rdg-cell[aria-selected=true] {
     outline-color: theme("colors.gray.300");
+
+    :root .dark & {
+        outline-color: theme("colors.gray.700");
+    }
 }
 
 .rdg-row[aria-selected=true] {
-    @apply bg-gray-100/75;
+    @apply bg-gray-100/75 dark:bg-gray-900/75;
 
     .uxf-data-grid__action-cell {
         background-color: white;
+
+        :root .dark & {
+            background-color: theme("colors.gray.900");
+        }
     }
 }
 
 .rdg-row:hover {
-    @apply bg-gray-50;
+    @apply bg-gray-50 dark:bg-gray-950;
 
     .uxf-data-grid__action-cell {
         background-color: white;
+
+        :root .dark & {
+            background-color: theme("colors.gray.950");
+        }
     }
 }
 
 .rdg-row[aria-selected=true]:hover {
-    @apply bg-gray-200/75;
+    @apply bg-gray-200/75 dark:bg-gray-800/75;
 }
 
 @keyframes datagridLineAnim {