@sikka/hawa 0.24.3-next → 0.24.5-next

package/dist/accordion/index.d.mts

@@ -1,8 +1,7 @@
 import * as React from 'react';
 import React__default from 'react';
 import * as AccordionPrimitive from '@radix-ui/react-accordion';
-
-type RadiusType = "full" | "inherit" | "none";
+import { R as RadiusType } from '../commonTypes-WPhcN3Vr.mjs';
 
 type ChipColors = "green" | "blue" | "red" | "yellow" | "orange" | "purple" | "cyan" | "hyper" | "oceanic";
 type ChipTypes = React__default.HTMLAttributes<HTMLSpanElement> & {

package/dist/accordion/index.d.ts

@@ -1,8 +1,7 @@
 import * as React from 'react';
 import React__default from 'react';
 import * as AccordionPrimitive from '@radix-ui/react-accordion';
-
-type RadiusType = "full" | "inherit" | "none";
+import { R as RadiusType } from '../commonTypes-WPhcN3Vr.js';
 
 type ChipColors = "green" | "blue" | "red" | "yellow" | "orange" | "purple" | "cyan" | "hyper" | "oceanic";
 type ChipTypes = React__default.HTMLAttributes<HTMLSpanElement> & {

package/dist/accordion/index.mjs

@@ -1,11 +1,223 @@
 import {
-  Accordion,
-  AccordionContent,
-  AccordionItem,
-  AccordionRoot,
-  AccordionTrigger
-} from "../chunk-JYSC6GKM.mjs";
-import "../chunk-TE3BKEXL.mjs";
+  cn
+} from "../chunk-TE3BKEXL.mjs";
+
+// components/elements/accordion/Accordion.tsx
+import * as React4 from "react";
+import * as AccordionPrimitive3 from "@radix-ui/react-accordion";
+
+// components/elements/chip/Chip.tsx
+import React from "react";
+var Chip = React.forwardRef(
+  ({
+    label,
+    size = "normal",
+    icon,
+    color,
+    radius = "inherit",
+    dotType,
+    ...rest
+  }, ref) => {
+    let defaultStyles = "hawa-flex hawa-flex-row hawa-w-fit hawa-gap-1 hawa-items-center  hawa-px-2.5 hawa-py-1  hawa-font-bold ";
+    let radiusStyles = {
+      inherit: " hawa-rounded",
+      full: "hawa-rounded-full",
+      none: "hawa-rounded-none"
+    };
+    let sizeStyles = {
+      small: "hawa-h-[15px] hawa-leading-4 hawa-px-0 hawa-py-0 hawa-text-[9px] hawa-gap-0.5 ",
+      normal: "hawa-h-fit hawa-text-xs",
+      large: "hawa-text-base"
+    };
+    let dotStyles = {
+      small: "hawa-flex hawa-h-1 hawa-w-1 hawa-rounded-full",
+      normal: "hawa-flex hawa-h-2 hawa-w-2 hawa-rounded-full",
+      large: "hawa-flex hawa-h-3 hawa-w-3 hawa-rounded-full"
+    };
+    let dotTypeStyles = {
+      available: "hawa-bg-green-500",
+      unavailable: "hawa-bg-red-500"
+    };
+    let colorStyles = {
+      green: "hawa-bg-green-100 hawa-text-green-500 dark:hawa-bg-green-400 dark:hawa-text-green-800",
+      blue: "hawa-bg-blue-100 hawa-text-blue-500 dark:hawa-bg-blue-400 dark:hawa-text-blue-100",
+      red: "hawa-bg-red-100 hawa-text-red-500 dark:hawa-bg-red-400 dark:hawa-text-red-100",
+      yellow: "hawa-bg-yellow-100 hawa-text-yellow-600 dark:hawa-bg-yellow-400 dark:hawa-text-yellow-800",
+      orange: "hawa-bg-orange-100 hawa-text-orange-500 dark:hawa-bg-orange-400 dark:hawa-text-orange-100",
+      purple: "hawa-bg-purple-100 hawa-text-purple-500 dark:hawa-bg-purple-400 dark:hawa-text-purple-100",
+      cyan: "hawa-bg-cyan-100 hawa-text-cyan-800 dark:hawa-bg-cyan-400 dark:hawa-text-cyan-800",
+      hyper: "hawa-text-white hawa-bg-gradient-to-tl hawa-from-pink-500 hawa-via-red-500 hawa-to-yellow-500 ",
+      oceanic: "hawa-text-white hawa-bg-gradient-to-bl hawa-from-green-300 hawa-via-blue-500 hawa-to-purple-600"
+    };
+    if (label) {
+      return /* @__PURE__ */ React.createElement(
+        "span",
+        {
+          ...rest,
+          ref,
+          className: cn(
+            defaultStyles,
+            sizeStyles[size],
+            radiusStyles[radius],
+            color ? colorStyles[color] : "hawa-border hawa-bg-none"
+          )
+        },
+        dotType && /* @__PURE__ */ React.createElement(
+          "span",
+          {
+            className: cn(dotStyles[size], dotTypeStyles[dotType])
+          }
+        ),
+        icon && icon,
+        label
+      );
+    } else {
+      return /* @__PURE__ */ React.createElement(
+        "span",
+        {
+          ...rest,
+          ref,
+          className: cn(
+            "hawa-h-2 hawa-w-2 hawa-rounded-full",
+            color ? colorStyles[color] : "hawa-border hawa-bg-none"
+          )
+        }
+      );
+    }
+  }
+);
+
+// components/elements/accordion/AccordionContent.tsx
+import * as React2 from "react";
+import * as AccordionPrimitive from "@radix-ui/react-accordion";
+var AccordionContent = React2.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ React2.createElement(
+  AccordionPrimitive.Content,
+  {
+    ref,
+    className: !props.unstyled ? cn(
+      "hawa-overflow-hidden hawa-text-sm hawa-transition-all data-[state=closed]:hawa-animate-accordion-up data-[state=open]:hawa-animate-accordion-down",
+      className
+    ) : className,
+    ...props
+  },
+  /* @__PURE__ */ React2.createElement("div", { className: "hawa-bg-background hawa-p-4" }, children)
+));
+AccordionContent.displayName = AccordionPrimitive.Content.displayName;
+
+// components/elements/accordion/AccordionTrigger.tsx
+import * as React3 from "react";
+import * as AccordionPrimitive2 from "@radix-ui/react-accordion";
+var AccordionTrigger = React3.forwardRef(({ className, children, ...props }, ref) => /* @__PURE__ */ React3.createElement(AccordionPrimitive2.Header, { className: "hawa-flex" }, /* @__PURE__ */ React3.createElement(
+  AccordionPrimitive2.Trigger,
+  {
+    ref,
+    className: !props.unstyled ? cn(
+      "hawa-flex hawa-flex-1 hawa-items-center hawa-justify-between hawa-bg-muted/50 hawa-p-4 hawa-font-medium hawa-transition-all [&[data-state=open]>svg]:hawa-rotate-180",
+      props.disabled ? "hawa-bg-muted/30 hawa-text-muted-foreground/50" : "hover:hawa-bg-muted",
+      className
+    ) : className,
+    ...props
+  },
+  children,
+  !props.hideArrow && /* @__PURE__ */ React3.createElement(
+    "svg",
+    {
+      xmlns: "http://www.w3.org/2000/svg",
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      className: "hawa-icon hawa-shrink-0 hawa-transition-transform hawa-duration-200"
+    },
+    /* @__PURE__ */ React3.createElement("path", { d: "m6 9 6 6 6-6" })
+  )
+)));
+AccordionTrigger.displayName = AccordionPrimitive2.Trigger.displayName;
+
+// components/elements/accordion/Accordion.tsx
+var Accordion = React4.forwardRef(
+  ({
+    items,
+    design = "default",
+    itemClassNames,
+    triggerclassNames,
+    contentclassNames,
+    className,
+    ...props
+  }, ref) => /* @__PURE__ */ React4.createElement(AccordionPrimitive3.Root, { type: props.type, collapsible: true }, /* @__PURE__ */ React4.createElement(
+    "div",
+    {
+      className: cn("hawa-flex hawa-flex-col", {
+        "hawa-gap-4": design === "separated",
+        "hawa-gap-0": design === "default"
+      })
+    },
+    items.map((item, index) => /* @__PURE__ */ React4.createElement(
+      AccordionPrimitive3.Item,
+      {
+        disabled: item.disabled || false,
+        className: cn(itemClassNames, "hawa-rounded"),
+        key: index,
+        value: `item-${index}`
+      },
+      /* @__PURE__ */ React4.createElement(
+        AccordionTrigger,
+        {
+          disabled: item.disabled || false,
+          className: cn(
+            "hawa-transition-all",
+            design === "separated" ? "hawa-rounded data-[state=open]:hawa-rounded-b-none" : {
+              "hawa-rounded-t": index === 0,
+              "data-[state=closed]:hawa-rounded-b": index === items.length - 1
+            },
+            triggerclassNames
+          )
+        },
+        /* @__PURE__ */ React4.createElement(
+          "span",
+          {
+            className: cn(
+              "hawa-flex hawa-flex-row",
+              item.chip && "hawa-gap-2"
+            )
+          },
+          item.trigger,
+          " ",
+          item.chip && /* @__PURE__ */ React4.createElement(Chip, { ...item.chip })
+        )
+      ),
+      /* @__PURE__ */ React4.createElement(
+        AccordionContent,
+        {
+          "aria-disabled": item.disabled || false,
+          className: cn(
+            "hawa-border hawa-transition-all",
+            design === "separated" ? "hawa-rounded data-[state=open]:hawa-rounded-t-none" : {
+              "data-[state=open]:hawa-rounded-b": index === items.length - 1
+            },
+            contentclassNames
+          )
+        },
+        item.content
+      )
+    ))
+  ))
+);
+Accordion.displayName = "Accordion";
+
+// components/elements/accordion/AccordionItem.tsx
+import * as React5 from "react";
+import * as AccordionPrimitive4 from "@radix-ui/react-accordion";
+var AccordionItem = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ React5.createElement(AccordionPrimitive4.Item, { ref, className: cn(className), ...props }));
+AccordionItem.displayName = "AccordionItem";
+
+// components/elements/accordion/AccordionRoot.tsx
+import * as AccordionPrimitive5 from "@radix-ui/react-accordion";
+var AccordionRoot = AccordionPrimitive5.Root;
 export {
   Accordion,
   AccordionContent,

package/dist/alert/index.d.mts

@@ -1,5 +1,5 @@
 import React__default from 'react';
-import { S as SeverityType, D as DirectionType } from '../commonTypes-N7XOVCit.mjs';
+import { S as SeverityType, D as DirectionType } from '../commonTypes-WPhcN3Vr.mjs';
 
 type AlertTypes = {
     severity?: SeverityType | "hyper" | "oceanic";

package/dist/alert/index.d.ts

@@ -1,5 +1,5 @@
 import React__default from 'react';
-import { S as SeverityType, D as DirectionType } from '../commonTypes-N7XOVCit.js';
+import { S as SeverityType, D as DirectionType } from '../commonTypes-WPhcN3Vr.js';
 
 type AlertTypes = {
     severity?: SeverityType | "hyper" | "oceanic";

package/dist/appLayout/index.d.mts

@@ -0,0 +1,126 @@
+import * as React from 'react';
+import React__default from 'react';
+
+type DirectionType = "rtl" | "ltr";
+
+type SubItem$1 = {
+    label?: string;
+    value?: any;
+    icon?: any;
+    action?: () => void;
+    onMiddleClick?: (e: any) => void;
+    highlighted?: boolean;
+    disabled?: boolean;
+    slug?: string;
+};
+type MenuItemType = {
+    icon?: React.ReactNode;
+    label?: string;
+    shortcut?: React.ReactNode;
+    badged?: boolean;
+    value?: any;
+    content?: any;
+    slug?: string;
+    end?: any;
+    presist?: boolean;
+    itemType?: "separator" | "label" | string;
+    action?: () => void;
+    highlighted?: boolean;
+    subitems?: SubItem$1[];
+    disabled?: boolean;
+    onMiddleClick?: (e: any) => void;
+    onClick?: any;
+};
+
+type ChipColors = "green" | "blue" | "red" | "yellow" | "orange" | "purple" | "cyan" | "hyper" | "oceanic";
+
+type AppSidebarItemProps = {
+    value: string;
+    slug?: string;
+    label: string;
+    badge?: {
+        label: string;
+        color: ChipColors;
+    };
+    icon?: any;
+    subitems?: SubItem[];
+    onClick?: (e: React.MouseEvent) => void;
+    onMouseDown?: (e: React.MouseEvent) => void;
+};
+type SubItem = {
+    value: string;
+    label: string;
+    slug?: string;
+    icon?: any;
+    onMouseDown?: (e: React.MouseEvent) => void;
+    onClick?: (e: React.MouseEvent) => void;
+};
+
+type AppLayoutTypes = {
+    /** a custom header to replace the logoLink & logoSymbol */
+    header?: React__default.ReactNode;
+    design?: "default";
+    /** The pages of the side drawer */
+    drawerItems: AppSidebarItemProps[];
+    /** The direction of the layout */
+    direction?: DirectionType;
+    /** The title of the current selected page, make sure it's the same as the drawerItem slug */
+    currentPage: string;
+    /** Specifies the title of the page. */
+    pageTitle?: string;
+    /** Specifies the symbol for the logo. */
+    logoSymbol?: any;
+    /** Specifies the link for the logo. */
+    logoLink?: string;
+    /** Specifies the text for the logo. */
+    logoText?: any;
+    /** Specifies the content to be displayed in the layout. */
+    children?: any;
+    /** Specifies whether to display the top bar. */
+    topBar?: boolean;
+    /** Specifies the username to be displayed. */
+    username?: string;
+    /** Specifies the user email to be displayed. */
+    email?: string;
+    /** Specifies the image for the avatar. */
+    avatarImage?: any;
+    /**
+     * Specifies the size of the drawer.
+     * - 'sm': Small.
+     * - 'md': Medium.
+     * - 'large': Large.
+     */
+    drawerSize?: "sm" | "md" | "large";
+    /** Specifies the menu items for the profile menu. */
+    profileMenuItems?: MenuItemType[];
+    /**
+     * Specifies the width of the profile menu.
+     * - 'default': Default width.
+     * - 'sm': Small width.
+     * - 'lg': Large width.
+     * - 'parent': Inherits width from parent element.
+     */
+    profileMenuWidth?: "default" | "sm" | "lg" | "parent";
+    /** Event handler for drawer expansion. */
+    onDrawerExpand?: (e: any) => void;
+    /** Specifies whether to keep the drawer open. */
+    keepOpen: boolean;
+    /** The method used to control whether the drawer is expanded or not. */
+    setKeepOpen: (value: boolean) => void;
+    /** Specifies additional actions for the drawer footer. */
+    DrawerFooterActions?: any;
+    /** Specifies the item that was clicked. */
+    clickedItem?: any;
+    /** Event handler for logo button click. */
+    onLogoClick?: () => void;
+    /** Text labels for various UI elements. */
+    texts?: {
+        /** Label for expand sidebar button. */
+        expandSidebar?: string;
+        /** Label for collapse sidebar button. */
+        collapseSidebar?: string;
+    };
+};
+declare const AppLayout: React__default.FunctionComponent<AppLayoutTypes>;
+
+export { AppLayout };

package/dist/appLayout/index.d.ts

@@ -0,0 +1,126 @@
+import * as React from 'react';
+import React__default from 'react';
+
+type DirectionType = "rtl" | "ltr";
+
+type SubItem$1 = {
+    label?: string;
+    value?: any;
+    icon?: any;
+    action?: () => void;
+    onMiddleClick?: (e: any) => void;
+    highlighted?: boolean;
+    disabled?: boolean;
+    slug?: string;
+};
+type MenuItemType = {
+    icon?: React.ReactNode;
+    label?: string;
+    shortcut?: React.ReactNode;
+    badged?: boolean;
+    value?: any;
+    content?: any;
+    slug?: string;
+    end?: any;
+    presist?: boolean;
+    itemType?: "separator" | "label" | string;
+    action?: () => void;
+    highlighted?: boolean;
+    subitems?: SubItem$1[];
+    disabled?: boolean;
+    onMiddleClick?: (e: any) => void;
+    onClick?: any;
+};
+
+type ChipColors = "green" | "blue" | "red" | "yellow" | "orange" | "purple" | "cyan" | "hyper" | "oceanic";
+
+type AppSidebarItemProps = {
+    value: string;
+    slug?: string;
+    label: string;
+    badge?: {
+        label: string;
+        color: ChipColors;
+    };
+    icon?: any;
+    subitems?: SubItem[];
+    onClick?: (e: React.MouseEvent) => void;
+    onMouseDown?: (e: React.MouseEvent) => void;
+};
+type SubItem = {
+    value: string;
+    label: string;
+    slug?: string;
+    icon?: any;
+    onMouseDown?: (e: React.MouseEvent) => void;
+    onClick?: (e: React.MouseEvent) => void;
+};
+
+type AppLayoutTypes = {
+    /** a custom header to replace the logoLink & logoSymbol */
+    header?: React__default.ReactNode;
+    design?: "default";
+    /** The pages of the side drawer */
+    drawerItems: AppSidebarItemProps[];
+    /** The direction of the layout */
+    direction?: DirectionType;
+    /** The title of the current selected page, make sure it's the same as the drawerItem slug */
+    currentPage: string;
+    /** Specifies the title of the page. */
+    pageTitle?: string;
+    /** Specifies the symbol for the logo. */
+    logoSymbol?: any;
+    /** Specifies the link for the logo. */
+    logoLink?: string;
+    /** Specifies the text for the logo. */
+    logoText?: any;
+    /** Specifies the content to be displayed in the layout. */
+    children?: any;
+    /** Specifies whether to display the top bar. */
+    topBar?: boolean;
+    /** Specifies the username to be displayed. */
+    username?: string;
+    /** Specifies the user email to be displayed. */
+    email?: string;
+    /** Specifies the image for the avatar. */
+    avatarImage?: any;
+    /**
+     * Specifies the size of the drawer.
+     * - 'sm': Small.
+     * - 'md': Medium.
+     * - 'large': Large.
+     */
+    drawerSize?: "sm" | "md" | "large";
+    /** Specifies the menu items for the profile menu. */
+    profileMenuItems?: MenuItemType[];
+    /**
+     * Specifies the width of the profile menu.
+     * - 'default': Default width.
+     * - 'sm': Small width.
+     * - 'lg': Large width.
+     * - 'parent': Inherits width from parent element.
+     */
+    profileMenuWidth?: "default" | "sm" | "lg" | "parent";
+    /** Event handler for drawer expansion. */
+    onDrawerExpand?: (e: any) => void;
+    /** Specifies whether to keep the drawer open. */
+    keepOpen: boolean;
+    /** The method used to control whether the drawer is expanded or not. */
+    setKeepOpen: (value: boolean) => void;
+    /** Specifies additional actions for the drawer footer. */
+    DrawerFooterActions?: any;
+    /** Specifies the item that was clicked. */
+    clickedItem?: any;
+    /** Event handler for logo button click. */
+    onLogoClick?: () => void;
+    /** Text labels for various UI elements. */
+    texts?: {
+        /** Label for expand sidebar button. */
+        expandSidebar?: string;
+        /** Label for collapse sidebar button. */
+        collapseSidebar?: string;
+    };
+};
+declare const AppLayout: React__default.FunctionComponent<AppLayoutTypes>;
+
+export { AppLayout };