@sikka/hawa 0.25.2-next → 0.26.1-next

package/dist/signature/index.mjs

@@ -0,0 +1,210 @@
+import {
+  cn
+} from "../chunk-TE3BKEXL.mjs";
+
+// components/elements/signature/Signature.tsx
+import React3, { useRef, useEffect } from "react";
+import SignaturePad from "signature_pad";
+import trimCanvas from "trim-canvas";
+
+// components/elements/label/Label.tsx
+import * as React2 from "react";
+
+// components/elements/tooltip/Tooltip.tsx
+import React from "react";
+import * as TooltipPrimitive from "@radix-ui/react-tooltip";
+var TooltipContent = React.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ React.createElement(
+  TooltipPrimitive.Content,
+  {
+    ref,
+    sideOffset,
+    className: cn(
+      "hawa-z-50 hawa-overflow-hidden hawa-rounded-md hawa-border hawa-bg-popover hawa-px-3 hawa-py-1.5 hawa-text-sm hawa-text-popover-foreground hawa-shadow-md hawa-animate-in hawa-fade-in-0 hawa-zoom-in-95 data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=closed]:hawa-zoom-out-95 data-[side=bottom]:hawa-slide-in-from-top-2 data-[side=left]:hawa-slide-in-from-right-2 data-[side=right]:hawa-slide-in-from-left-2 data-[side=top]:hawa-slide-in-from-bottom-2",
+      className
+    ),
+    ...props
+  }
+));
+TooltipContent.displayName = TooltipPrimitive.Content.displayName;
+var TooltipArrow = React.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React.createElement(TooltipPrimitive.Arrow, { ref, className: cn(className), ...props }));
+TooltipArrow.displayName = TooltipPrimitive.Arrow.displayName;
+var Tooltip = ({
+  side,
+  open,
+  content,
+  children,
+  defaultOpen,
+  onOpenChange,
+  triggerProps,
+  contentProps,
+  providerProps,
+  delayDuration = 300,
+  ...props
+}) => {
+  return /* @__PURE__ */ React.createElement(
+    TooltipPrimitive.TooltipProvider,
+    {
+      delayDuration,
+      ...providerProps
+    },
+    /* @__PURE__ */ React.createElement(
+      TooltipPrimitive.Root,
+      {
+        open,
+        defaultOpen,
+        onOpenChange,
+        ...props
+      },
+      /* @__PURE__ */ React.createElement(TooltipPrimitive.Trigger, { ...triggerProps }, children),
+      /* @__PURE__ */ React.createElement(TooltipContent, { side, align: "center", ...contentProps }, content)
+    )
+  );
+};
+
+// components/elements/label/Label.tsx
+var Label = React2.forwardRef(({ className, hint, hintSide, required, children, ...props }, ref) => /* @__PURE__ */ React2.createElement("div", { className: "hawa-flex hawa-flex-row hawa-items-center hawa-gap-1 hawa-transition-all" }, /* @__PURE__ */ React2.createElement(
+  "label",
+  {
+    ref,
+    className: cn(
+      "hawa-text-sm hawa-font-medium hawa-leading-none peer-disabled:hawa-cursor-not-allowed peer-disabled:hawa-opacity-70",
+      className
+    ),
+    ...props
+  },
+  children,
+  required && /* @__PURE__ */ React2.createElement("span", { className: "hawa-mx-0.5 hawa-text-red-500" }, "*")
+), hint && /* @__PURE__ */ React2.createElement(
+  Tooltip,
+  {
+    content: hint,
+    side: hintSide,
+    triggerProps: {
+      tabIndex: -1,
+      onClick: (event) => event.preventDefault()
+    }
+  },
+  /* @__PURE__ */ React2.createElement("div", null, /* @__PURE__ */ React2.createElement(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      className: "hawa-h-[14px] hawa-w-[14px] hawa-cursor-help",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round"
+    },
+    /* @__PURE__ */ React2.createElement("circle", { cx: "12", cy: "12", r: "10" }),
+    /* @__PURE__ */ React2.createElement("path", { d: "M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3" }),
+    /* @__PURE__ */ React2.createElement("path", { d: "M12 17h.01" })
+  ))
+)));
+Label.displayName = "Label";
+
+// components/elements/signature/Signature.tsx
+var Signature = ({
+  canvasProps,
+  clearOnResize = false,
+  onGetImage,
+  texts,
+  label,
+  labelProps,
+  ...sigPadProps
+}) => {
+  const canvasRef = useRef(null);
+  const sigPadRef = useRef(null);
+  const checkClearOnResize = () => {
+    if (!clearOnResize) {
+      return;
+    }
+    resizeCanvas();
+  };
+  const resizeCanvas = () => {
+    var _a;
+    const canvas = canvasRef.current;
+    if (canvas && canvas.parentElement) {
+      const ratio = Math.max(window.devicePixelRatio || 1, 1);
+      if (typeof (canvasProps == null ? void 0 : canvasProps.width) === "undefined") {
+        canvas.width = canvas.parentElement.offsetWidth * ratio;
+      } else {
+        canvas.width = Number(canvasProps.width) * ratio;
+      }
+      if (typeof (canvasProps == null ? void 0 : canvasProps.height) === "undefined") {
+        canvas.height = canvas.parentElement.offsetHeight * ratio;
+      } else {
+        canvas.height = Number(canvasProps.height) * ratio;
+      }
+      (_a = canvas.getContext("2d")) == null ? void 0 : _a.scale(ratio, ratio);
+      clear();
+    }
+  };
+  const getTrimmedCanvas = () => {
+    var _a;
+    const canvas = canvasRef.current;
+    if (!canvas) {
+      throw new Error("Canvas reference is null");
+    }
+    const copy = document.createElement("canvas");
+    copy.width = canvas.width;
+    copy.height = canvas.height;
+    (_a = copy.getContext("2d")) == null ? void 0 : _a.drawImage(canvas, 0, 0);
+    return trimCanvas(copy);
+  };
+  const getSignatureImage = () => {
+    const trimmedCanvas = getTrimmedCanvas();
+    return trimmedCanvas.toDataURL();
+  };
+  useEffect(() => {
+    if (onGetImage) {
+      onGetImage(getSignatureImage);
+    }
+  }, [onGetImage]);
+  useEffect(() => {
+    const canvas = canvasRef.current;
+    if (canvas) {
+      sigPadRef.current = new SignaturePad(canvas, sigPadProps);
+      resizeCanvas();
+      window.addEventListener("resize", checkClearOnResize);
+    }
+    return () => {
+      window.removeEventListener("resize", checkClearOnResize);
+    };
+  }, [sigPadProps]);
+  const clear = () => {
+    var _a;
+    return (_a = sigPadRef.current) == null ? void 0 : _a.clear();
+  };
+  const isEmpty = () => {
+    var _a;
+    return !!((_a = sigPadRef.current) == null ? void 0 : _a.isEmpty());
+  };
+  const fromDataURL = (dataURL, options) => {
+    var _a;
+    return (_a = sigPadRef.current) == null ? void 0 : _a.fromDataURL(dataURL, options);
+  };
+  const toDataURL = (type, encoderOptions) => {
+    var _a;
+    return (_a = sigPadRef.current) == null ? void 0 : _a.toDataURL(type, encoderOptions);
+  };
+  const fromData = (pointGroups) => {
+    var _a;
+    return (_a = sigPadRef.current) == null ? void 0 : _a.fromData(pointGroups);
+  };
+  const toData = () => {
+    var _a;
+    return (_a = sigPadRef.current) == null ? void 0 : _a.toData();
+  };
+  return /* @__PURE__ */ React3.createElement("div", { className: "hawa-w-full" }, label && /* @__PURE__ */ React3.createElement(Label, { ...labelProps, className: "hawa-mb-2" }, label || "Signature"), /* @__PURE__ */ React3.createElement(
+    "canvas",
+    {
+      ref: canvasRef,
+      ...canvasProps,
+      className: cn("hawa-rounded", canvasProps == null ? void 0 : canvasProps.className)
+    }
+  ), /* @__PURE__ */ React3.createElement("div", { className: "clickable-link hawa-w-fit", onClick: () => clear() }, (texts == null ? void 0 : texts.clear) || "Clear"));
+};
+export {
+  Signature
+};

package/dist/sortButton/index.mjs

@@ -1,265 +1,12 @@
 import {
+  Button,
   cn
-} from "../chunk-TE3BKEXL.mjs";
+} from "../chunk-3N6JJKMN.mjs";
 
 // components/elements/sortButton/SortButton.tsx
-import React3 from "react";
-
-// components/elements/button/Button.tsx
-import * as React2 from "react";
-import { cva } from "class-variance-authority";
-
-// components/elements/loading/Loading.tsx
 import React from "react";
-var Loading = ({
-  design = "spinner",
-  size = "sm",
-  themeMode = "light",
-  color,
-  ...props
-}) => {
-  let sizeStyles = {
-    button: "hawa-h-4 hawa-w-4",
-    xs: "hawa-h-1 hawa-w-1",
-    sm: "hawa-h-6 hawa-w-6",
-    normal: "hawa-h-8 hawa-w-8",
-    lg: "hawa-h-14 hawa-w-14",
-    xl: "hawa-h-24 hawa-w-24"
-  };
-  let animationStyles = {
-    pulse: "hawa-animate-in hawa-fade-in hawa-duration-1000",
-    bounce: "hawa-animate-bounce"
-  };
-  switch (design.split("-")[0]) {
-    case "dots":
-      return /* @__PURE__ */ React.createElement(
-        "div",
-        {
-          className: cn("hawa-flex hawa-flex-row hawa-gap-2", props.className)
-        },
-        /* @__PURE__ */ React.createElement(
-          "div",
-          {
-            className: cn(
-              "hawa-animate-bounce hawa-rounded-full hawa-delay-100 hawa-repeat-infinite",
-              size === "button" ? "hawa-h-2 hawa-w-2" : sizeStyles[size],
-              animationStyles[design.split("-")[1]],
-              color ? color : "hawa-bg-primary"
-            )
-          }
-        ),
-        /* @__PURE__ */ React.createElement(
-          "div",
-          {
-            className: cn(
-              "hawa-animate-bounce hawa-rounded-full hawa-delay-200 hawa-repeat-infinite",
-              size === "button" ? "hawa-h-2 hawa-w-2" : sizeStyles[size],
-              animationStyles[design.split("-")[1]],
-              color ? color : "hawa-bg-primary"
-            )
-          }
-        ),
-        /* @__PURE__ */ React.createElement(
-          "div",
-          {
-            className: cn(
-              "hawa-animate-bounce hawa-rounded-full hawa-delay-300 hawa-repeat-infinite",
-              size === "button" ? "hawa-h-2 hawa-w-2" : sizeStyles[size],
-              animationStyles[design.split("-")[1]],
-              color ? color : "hawa-bg-primary"
-            )
-          }
-        )
-      );
-    case "square":
-      return /* @__PURE__ */ React.createElement(
-        "svg",
-        {
-          className: cn("squircle-container", sizeStyles[size]),
-          viewBox: "0 0 35 35",
-          height: "35",
-          width: "35"
-        },
-        /* @__PURE__ */ React.createElement(
-          "rect",
-          {
-            className: "squircle-track",
-            x: "2.5",
-            y: "2.5",
-            fill: "none",
-            strokeWidth: "5px",
-            width: "32.5",
-            height: "32.5"
-          }
-        ),
-        /* @__PURE__ */ React.createElement(
-          "rect",
-          {
-            className: "square-car",
-            x: "2.5",
-            y: "2.5",
-            fill: "none",
-            strokeWidth: "5px",
-            width: "32.5",
-            height: "32.5",
-            pathLength: "100"
-          }
-        )
-      );
-    case "squircle":
-      return /* @__PURE__ */ React.createElement(
-        "svg",
-        {
-          className: cn("squircle-container", sizeStyles[size]),
-          x: "0px",
-          y: "0px",
-          viewBox: "0 0 37 37",
-          height: "37",
-          width: "37",
-          preserveAspectRatio: "xMidYMid meet"
-        },
-        /* @__PURE__ */ React.createElement(
-          "path",
-          {
-            className: "squircle-track",
-            fill: "none",
-            strokeWidth: "5",
-            pathLength: "100",
-            d: "M0.37 18.5 C0.37 5.772 5.772 0.37 18.5 0.37 S36.63 5.772 36.63 18.5 S31.228 36.63 18.5 36.63 S0.37 31.228 0.37 18.5"
-          }
-        ),
-        /* @__PURE__ */ React.createElement(
-          "path",
-          {
-            className: "squircle-car",
-            fill: "none",
-            strokeWidth: "5",
-            pathLength: "100",
-            d: "M0.37 18.5 C0.37 5.772 5.772 0.37 18.5 0.37 S36.63 5.772 36.63 18.5 S31.228 36.63 18.5 36.63 S0.37 31.228 0.37 18.5"
-          }
-        )
-      );
-    case "progress":
-      return /* @__PURE__ */ React.createElement("div", { className: "progress-loading" });
-    case "orbit":
-      return /* @__PURE__ */ React.createElement("div", { className: "orbit-container" });
-    default:
-      return /* @__PURE__ */ React.createElement(
-        "svg",
-        {
-          className: cn("circle-container", sizeStyles[size]),
-          viewBox: "0 0 40 40",
-          height: "40",
-          width: "40"
-        },
-        /* @__PURE__ */ React.createElement(
-          "circle",
-          {
-            className: cn("circle-track", {
-              "hawa-stroke-primary-foreground": themeMode === "dark",
-              "hawa-stroke-primary": themeMode === "light"
-            }),
-            cx: "20",
-            cy: "20",
-            r: "17.5",
-            pathLength: "100",
-            strokeWidth: "5px",
-            fill: "none"
-          }
-        ),
-        /* @__PURE__ */ React.createElement(
-          "circle",
-          {
-            className: cn("circle-car", {
-              "hawa-stroke-primary-foreground": themeMode === "dark",
-              "hawa-stroke-primary": themeMode === "light"
-            }),
-            cx: "20",
-            cy: "20",
-            r: "17.5",
-            pathLength: "100",
-            strokeWidth: "5px",
-            fill: "none"
-          }
-        )
-      );
-  }
-};
-
-// components/elements/button/Button.tsx
-var buttonVariants = cva(
-  "hawa-inline-flex hawa-items-center  hawa-select-none hawa-rounded-md hawa-text-sm hawa-font-medium hawa-ring-offset-background hawa-transition-colors focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-2 disabled:hawa-pointer-events-none disabled:hawa-opacity-50",
-  {
-    variants: {
-      variant: {
-        default: "hawa-bg-primary hawa-text-primary-foreground hover:hawa-bg-primary/90",
-        light: "hawa-bg-primary/20 hawa-text-primary hover:hawa-bg-primary/40",
-        destructive: "hawa-bg-destructive hawa-text-destructive-foreground hover:hawa-bg-destructive/90",
-        outline: "hawa-border hawa-border-input hawa-bg-transparent hover:hawa-bg-accent hover:hawa-text-accent-foreground",
-        secondary: "hawa-bg-secondary hawa-text-secondary-foreground hover:hawa-bg-secondary/80",
-        ghost: "hover:hawa-bg-accent hover:hawa-text-accent-foreground",
-        link: "hawa-text-primary hawa-underline-offset-4 hover:hawa-underline",
-        combobox: "hawa-bg-background hawa-border",
-        neoBrutalism: "neo-brutalism"
-        // "hawa-cursor-pointer hawa-transition-all hawa-uppercase hawa-font-mono  dark:hawa-bg-black hawa-font-bold hawa-py-2 hawa-px-4 hawa-rounded hawa-border-2 hawa-border-primary hawa-shadow-color-primary hawa-transition-[hawa-transform_50ms, hawa-box-shadow_50ms] active:hawa-translate-x-0.5 active:hawa-translate-y-0.5 active:hawa-shadow-color-primary-active shadow-color-primary active:shadow-color-primary-active",
-      },
-      size: {
-        default: "hawa-h-10 hawa-px-4 hawa-py-2",
-        heightless: "hawa-px-4 hawa-py-4",
-        xs: "hawa-h-fit hawa-min-h-[25px] hawa-py-1 hawa-text-[10px] hawa-px-2 ",
-        sm: "hawa-h-9  hawa-text-[11px] hawa-rounded-md hawa-px-3",
-        lg: "hawa-h-11 hawa-rounded-md hawa-px-8",
-        xl: "hawa-h-14 hawa-rounded-md hawa-px-10",
-        icon: "hawa-h-10 hawa-w-10",
-        smallIcon: "hawa-h-7 hawa-w-7"
-      }
-    },
-    defaultVariants: {
-      variant: "default",
-      size: "default"
-    }
-  }
-);
-var Button = React2.forwardRef(
-  ({
-    className,
-    variant,
-    size,
-    asChild = false,
-    centered = true,
-    isLoading,
-    children,
-    ...props
-  }, ref) => {
-    const Comp = "button";
-    const loadingColor = variant === "outline" || variant === "ghost" || variant === "neoBrutalism" ? "hawa-bg-primary" : "hawa-bg-primary-foreground";
-    return /* @__PURE__ */ React2.createElement(
-      Comp,
-      {
-        className: cn(
-          buttonVariants({ variant, size, className }),
-          centered && "hawa-justify-center"
-        ),
-        ref,
-        ...props
-      },
-      isLoading ? /* @__PURE__ */ React2.createElement(
-        Loading,
-        {
-          design: size === "icon" || size === "smallIcon" ? "spinner" : "dots-pulse",
-          themeMode: variant === "outline" ? "light" : "dark",
-          color: loadingColor,
-          size: size === "sm" || size === "xs" ? "xs" : "button"
-        }
-      ) : children
-    );
-  }
-);
-Button.displayName = "Button";
-
-// components/elements/sortButton/SortButton.tsx
 var SortButton = (props) => {
-  return /* @__PURE__ */ React3.createElement(
+  return /* @__PURE__ */ React.createElement(
     Button,
     {
       variant: "ghost",
@@ -271,7 +18,7 @@ var SortButton = (props) => {
       onClick: props.onSort
     },
     props.label,
-    /* @__PURE__ */ React3.createElement(
+    /* @__PURE__ */ React.createElement(
       "svg",
       {
         xmlns: "http://www.w3.org/2000/svg",
@@ -283,10 +30,10 @@ var SortButton = (props) => {
         strokeLinejoin: "round",
         className: props.condensed ? "hawa-h-3 hawa-w-3" : "hawa-icon"
       },
-      /* @__PURE__ */ React3.createElement("path", { d: "m21 16-4 4-4-4" }),
-      /* @__PURE__ */ React3.createElement("path", { d: "M17 20V4" }),
-      /* @__PURE__ */ React3.createElement("path", { d: "m3 8 4-4 4 4" }),
-      /* @__PURE__ */ React3.createElement("path", { d: "M7 4v16" })
+      /* @__PURE__ */ React.createElement("path", { d: "m21 16-4 4-4-4" }),
+      /* @__PURE__ */ React.createElement("path", { d: "M17 20V4" }),
+      /* @__PURE__ */ React.createElement("path", { d: "m3 8 4-4 4 4" }),
+      /* @__PURE__ */ React.createElement("path", { d: "M7 4v16" })
     )
   );
 };

package/dist/splitButton/index.d.mts

@@ -1,8 +1,9 @@
 import * as React from 'react';
-import { D as DirectionType } from '../commonTypes-2k6FnHw5.mjs';
 import * as class_variance_authority_types from 'class-variance-authority/types';
 import { VariantProps } from 'class-variance-authority';
 
+type DirectionType = "rtl" | "ltr";
+
 type SubItem = {
     label?: string;
     value?: any;
@@ -33,8 +34,8 @@ type MenuItemType = {
 };
 
 declare const buttonVariants: (props?: ({
-    variant?: "link" | "default" | "combobox" | "light" | "destructive" | "outline" | "secondary" | "ghost" | "neoBrutalism" | null | undefined;
-    size?: "default" | "sm" | "lg" | "xs" | "xl" | "heightless" | "icon" | "smallIcon" | null | undefined;
+    variant?: "light" | "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | "combobox" | "neoBrutalism" | null | undefined;
+    size?: "xs" | "sm" | "lg" | "xl" | "default" | "heightless" | "icon" | "smallIcon" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
     asChild?: boolean;

package/dist/splitButton/index.d.ts

@@ -1,8 +1,9 @@
 import * as React from 'react';
-import { D as DirectionType } from '../commonTypes-2k6FnHw5.js';
 import * as class_variance_authority_types from 'class-variance-authority/types';
 import { VariantProps } from 'class-variance-authority';
 
+type DirectionType = "rtl" | "ltr";
+
 type SubItem = {
     label?: string;
     value?: any;
@@ -33,8 +34,8 @@ type MenuItemType = {
 };
 
 declare const buttonVariants: (props?: ({
-    variant?: "link" | "default" | "combobox" | "light" | "destructive" | "outline" | "secondary" | "ghost" | "neoBrutalism" | null | undefined;
-    size?: "default" | "sm" | "lg" | "xs" | "xl" | "heightless" | "icon" | "smallIcon" | null | undefined;
+    variant?: "light" | "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | "combobox" | "neoBrutalism" | null | undefined;
+    size?: "xs" | "sm" | "lg" | "xl" | "default" | "heightless" | "icon" | "smallIcon" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
     asChild?: boolean;