@sikka/hawa 0.30.15-next → 0.30.17-next

package/dist/elements/index.mjs

@@ -28,7 +28,7 @@ import {
   TabsTrigger,
   Textarea,
   UncheckMark
-} from "../chunk-VVRT5XAJ.mjs";
+} from "../chunk-CXBN42TF.mjs";
 import {
   Sheet,
   SheetClose,
@@ -925,15 +925,9 @@ var DataTable = ({
   const [expanded, setExpanded] = React10.useState({});
   const [columnVisibility, setColumnVisibility] = React10.useState({});
   const [rowSelection, setRowSelection] = React10.useState({});
-  const visibleColumns = columns.filter(
-    (column) => {
-      var _a2;
-      return ((_a2 = column.meta) == null ? void 0 : _a2.hidden) !== true;
-    }
-  );
   const table = useReactTable({
     data,
-    columns: visibleColumns,
+    columns,
     onExpandedChange: setExpanded,
     getExpandedRowModel: getExpandedRowModel(),
     onGlobalFilterChange: setGlobalFilter,
@@ -953,15 +947,22 @@ var DataTable = ({
       rowSelection,
       expanded
     }
-    // defaultColumn: {
-    //   maxSize: 200
-    // }
   });
   const pageText = ((_a = props.texts) == null ? void 0 : _a.page) || "page";
   const itemsPerPageOptions = (_b = props.itemsPerPage) == null ? void 0 : _b.map((item) => ({
     label: `${item} / ${pageText}`,
     value: item
   }));
+  React10.useEffect(() => {
+    setColumnVisibility((prev) => {
+      let newColumnVisibility = {};
+      columns.forEach((column) => {
+        var _a2;
+        newColumnVisibility[column.accessorKey] = !((_a2 = column.meta) == null ? void 0 : _a2.hidden);
+      });
+      return newColumnVisibility;
+    });
+  }, [columns]);
   return /* @__PURE__ */ React10.createElement("div", { className: "hawa-flex hawa-w-full hawa-flex-col hawa-gap-4" }, (enableSearch || enableHideColumns) && /* @__PURE__ */ React10.createElement("div", { className: "hawa-flex hawa-flex-row hawa-items-center hawa-gap-4" }, enableSearch && /* @__PURE__ */ React10.createElement(
     Input,
     {
@@ -1238,7 +1239,7 @@ var DataTable = ({
 };
 
 // elements/backToTop/BackToTop.tsx
-import React11, { useState as useState3, useEffect as useEffect2, useRef as useRef2 } from "react";
+import React11, { useState as useState3, useEffect as useEffect3, useRef as useRef2 } from "react";
 var BackToTop = ({ ...props }) => {
   const [visible, setVisible] = useState3(false);
   const [rect, _setRect] = useState3(null);
@@ -1268,7 +1269,7 @@ var BackToTop = ({ ...props }) => {
       props.anchor.current.scrollTo({ top: 0, behavior: "smooth" });
     }
   };
-  useEffect2(() => {
+  useEffect3(() => {
     if (!props.anchor.current)
       return;
     props.anchor.current.addEventListener("scroll", onScroll);
@@ -1607,7 +1608,7 @@ var Combobox = React13.forwardRef(
 );
 
 // elements/fileDropzone/FileDropzone.tsx
-import React14, { useEffect as useEffect3, useState as useState5 } from "react";
+import React14, { useEffect as useEffect4, useState as useState5 } from "react";
 import { useDropzone } from "react-dropzone";
 import clsx from "clsx";
 var FileDropzone = ({
@@ -1652,7 +1653,7 @@ var FileDropzone = ({
       );
     }
   });
-  useEffect3(
+  useEffect4(
     () => () => {
       files == null ? void 0 : files.forEach((file) => {
         URL.revokeObjectURL(file.preview);
@@ -1660,7 +1661,7 @@ var FileDropzone = ({
     },
     [files]
   );
-  useEffect3(() => {
+  useEffect4(() => {
     setFiles(acceptedFiles);
   }, [acceptedFiles, cmp, setFiles]);
   onClearFiles = () => {
@@ -1672,7 +1673,7 @@ var FileDropzone = ({
     acceptedFiles.length = 0;
     setFiles([]);
   };
-  useEffect3(() => {
+  useEffect4(() => {
     if (maxSize > 0) {
       const k = 1024;
       const sizes = ["Bytes", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"];
@@ -2000,7 +2001,7 @@ var AppStores = (props) => {
 };
 
 // elements/badge/Badge.tsx
-import React19, { useEffect as useEffect5, useState as useState7, useRef as useRef5 } from "react";
+import React19, { useEffect as useEffect6, useState as useState7, useRef as useRef5 } from "react";
 var Badge = ({
   anchor,
   position = "right",
@@ -2015,7 +2016,7 @@ var Badge = ({
     default: { top: 4, left: 7, right: 5, classes: "hawa-w-3 hawa-h-3" },
     large: { top: 6, left: 12, right: 7, classes: "hawa-w-6 hawa-h-6" }
   };
-  useEffect5(() => {
+  useEffect6(() => {
     const handlePositioning = () => {
       var _a;
       if (anchor.current && indicatorRef.current) {
@@ -2079,7 +2080,7 @@ var BadgedComponent = ({
 // elements/colorPicker/ColorPicker.tsx
 import React20, {
   useState as useState8,
-  useEffect as useEffect6
+  useEffect as useEffect7
 } from "react";
 var ColorPicker = ({
   containerProps,
@@ -2092,7 +2093,7 @@ var ColorPicker = ({
   ...props
 }) => {
   const [selectedColor, setSelectedColor] = useState8(props.color);
-  useEffect6(() => {
+  useEffect7(() => {
     if (selectedColor && selectedColor[0] !== "#") {
       setSelectedColor(`#${selectedColor}`);
     }
@@ -2374,7 +2375,7 @@ var Pagination = ({
 };
 
 // elements/passwordInput/PasswordInput.tsx
-import React23, { useEffect as useEffect7, useState as useState9 } from "react";
+import React23, { useEffect as useEffect8, useState as useState9 } from "react";
 var PasswordStrengthIndicator = ({ strength }) => {
   const strengthLevels = [
     "none",
@@ -2422,7 +2423,7 @@ var PasswordInput = ({
   const [specialCharCriteriaMet, setSpecialCharCriteriaMet] = useState9(false);
   const [lowercaseCriteriaMet, setLowercaseCriteriaMet] = useState9(false);
   const [uppercaseCriteriaMet, setUppercaseCriteriaMet] = useState9(false);
-  useEffect7(() => {
+  useEffect8(() => {
     const calculateStrength = () => {
       let strengthScore = 0;
       if (lengthCriteriaMet)
@@ -2605,7 +2606,7 @@ var SimpleTable = ({
 };
 
 // elements/scrollIndicator/ScrollIndicator.tsx
-import React26, { useState as useState10, useEffect as useEffect8 } from "react";
+import React26, { useState as useState10, useEffect as useEffect9 } from "react";
 var ScrollIndicator = ({
   anchor,
   inContainer = false
@@ -2621,7 +2622,7 @@ var ScrollIndicator = ({
       setScrollPercentage(percentageScrolled);
     }
   };
-  useEffect8(() => {
+  useEffect9(() => {
     if (!anchor.current)
       return;
     anchor.current.addEventListener("scroll", onScroll);
@@ -2806,7 +2807,7 @@ var CodeBlock = ({
 };
 
 // elements/carousel/Carousel.tsx
-import React28, { useEffect as useEffect9, useState as useState12 } from "react";
+import React28, { useEffect as useEffect10, useState as useState12 } from "react";
 import useEmblaCarousel from "embla-carousel-react";
 var Carousel = ({
   items,
@@ -2823,7 +2824,7 @@ var Carousel = ({
     loop: autoplay ? true : (options == null ? void 0 : options.loop) || false
   });
   const [selectedIndex, setSelectedIndex] = useState12(0);
-  useEffect9(() => {
+  useEffect10(() => {
     function selectHandler() {
       const index = emblaApi == null ? void 0 : emblaApi.selectedScrollSnap();
       setSelectedIndex(index || 0);
@@ -2833,7 +2834,7 @@ var Carousel = ({
       emblaApi == null ? void 0 : emblaApi.off("select", selectHandler);
     };
   }, [emblaApi]);
-  useEffect9(() => {
+  useEffect10(() => {
     let autoplayTimer;
     if (autoplay && emblaApi) {
       autoplayTimer = setInterval(() => {

package/dist/index.css

@@ -2190,9 +2190,8 @@ input[type="number"]::-webkit-inner-spin-button,
   --tw-border-opacity: 1;
   border-color: hsl(var(--error) / var(--tw-border-opacity));
 }
-.hawa-border-gray-200 {
-  --tw-border-opacity: 1;
-  border-color: rgb(229 231 235 / var(--tw-border-opacity));
+.hawa-border-foreground\/10 {
+  border-color: hsl(var(--foreground) / 0.1);
 }
 .hawa-border-gray-800 {
   --tw-border-opacity: 1;
@@ -2784,9 +2783,6 @@ input[type="number"]::-webkit-inner-spin-button,
 .hawa-uppercase {
   text-transform: uppercase;
 }
-.hawa-capitalize {
-  text-transform: capitalize;
-}
 .hawa-leading-4 {
   line-height: 1rem;
 }
@@ -3937,6 +3933,9 @@ body {
   --tw-scale-y: 1;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
+:is(.hawa-dark .dark\:hawa-border-foreground\/10) {
+  border-color: hsl(var(--foreground) / 0.1);
+}
 :is(.hawa-dark .dark\:hawa-border-gray-200) {
   --tw-border-opacity: 1;
   border-color: rgb(229 231 235 / var(--tw-border-opacity));

package/dist/index.js

@@ -2849,15 +2849,9 @@ var DataTable = ({
   const [expanded, setExpanded] = React22.useState({});
   const [columnVisibility, setColumnVisibility] = React22.useState({});
   const [rowSelection, setRowSelection] = React22.useState({});
-  const visibleColumns = columns.filter(
-    (column) => {
-      var _a2;
-      return ((_a2 = column.meta) == null ? void 0 : _a2.hidden) !== true;
-    }
-  );
   const table = (0, import_react_table.useReactTable)({
     data,
-    columns: visibleColumns,
+    columns,
     onExpandedChange: setExpanded,
     getExpandedRowModel: (0, import_react_table.getExpandedRowModel)(),
     onGlobalFilterChange: setGlobalFilter,
@@ -2877,15 +2871,22 @@ var DataTable = ({
       rowSelection,
       expanded
     }
-    // defaultColumn: {
-    //   maxSize: 200
-    // }
   });
   const pageText = ((_a = props.texts) == null ? void 0 : _a.page) || "page";
   const itemsPerPageOptions = (_b = props.itemsPerPage) == null ? void 0 : _b.map((item) => ({
     label: `${item} / ${pageText}`,
     value: item
   }));
+  React22.useEffect(() => {
+    setColumnVisibility((prev) => {
+      let newColumnVisibility = {};
+      columns.forEach((column) => {
+        var _a2;
+        newColumnVisibility[column.accessorKey] = !((_a2 = column.meta) == null ? void 0 : _a2.hidden);
+      });
+      return newColumnVisibility;
+    });
+  }, [columns]);
   return /* @__PURE__ */ React22.createElement("div", { className: "hawa-flex hawa-w-full hawa-flex-col hawa-gap-4" }, (enableSearch || enableHideColumns) && /* @__PURE__ */ React22.createElement("div", { className: "hawa-flex hawa-flex-row hawa-items-center hawa-gap-4" }, enableSearch && /* @__PURE__ */ React22.createElement(
     Input,
     {
@@ -3412,7 +3413,7 @@ var Radio = (0, import_react11.forwardRef)(
           {
             htmlFor: opt.value.toString(),
             className: cn(
-              "hawa-inline-flex hawa-h-full hawa-w-full hawa-transition-all  hawa-items-center hawa-justify-between hawa-rounded-lg hawa-border hawa-border-gray-200 hawa-bg-background hawa-p-5 hawa-text-gray-500  peer-checked:hawa-border-primary peer-checked:hawa-text-primary dark:hawa-border-gray-700 dark:hawa-bg-foreground/5 dark:hawa-text-gray-400  dark:peer-checked:hawa-text-primary",
+              "hawa-inline-flex hawa-h-full hawa-w-full hawa-transition-all  hawa-items-center hawa-justify-between hawa-rounded-lg hawa-border hawa-border-foreground/10 hawa-bg-background hawa-p-5 hawa-text-gray-500  peer-checked:hawa-border-primary peer-checked:hawa-text-primary dark:hawa-border-foreground/10 dark:hawa-bg-foreground/5 dark:hawa-text-gray-400  dark:peer-checked:hawa-text-primary",
               opt.disabled ? "hawa-opacity-50" : "hawa-cursor-pointer hover:hawa-bg-foreground/10 hover:hawa-text-gray-600 dark:hover:hawa-bg-foreground/20 dark:hover:hawa-text-gray-300"
             )
           },