@sikka/hawa 0.27.5-next → 0.27.6-next

package/dist/colorPicker/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../elements/colorPicker/ColorPicker.tsx","../../util/index.ts","../../elements/skeleton/Skeleton.tsx","../../elements/label/Label.tsx","../../elements/tooltip/Tooltip.tsx"],"sourcesContent":["import React, {\n  useState,\n  FC,\n  ChangeEvent,\n  InputHTMLAttributes,\n  useEffect,\n  FormEvent\n} from \"react\";\n\nimport { calculateLuminance, cn, getTextColor } from \"@util/index\";\n\nimport { Skeleton } from \"@elements/skeleton\";\n\nimport { Label, LabelProps } from \"../label\";\n\ntype ColorPickerTypes = {\n  label?: string;\n  id?: string;\n  isLoading?: boolean;\n  labelProps?: LabelProps;\n  helperText?: string;\n  forceHideHelperText?: boolean;\n  /** Boolean to enable/disable editing the input field and using it as a text field   */\n  preview?: boolean;\n  /** The hex code for the color */\n  color?: any;\n  /** Fires everytime the color changes */\n  handleChange?: (\n    e: ChangeEvent<HTMLInputElement> | FormEvent<HTMLInputElement>\n  ) => void;\n  colorPickerClassNames?: string;\n  colorTextClassNames?: string;\n  colorPickerProps?: InputHTMLAttributes<HTMLInputElement>;\n  textInputProps?: InputHTMLAttributes<HTMLInputElement>;\n  containerProps?: InputHTMLAttributes<HTMLDivElement>;\n};\n\nexport const ColorPicker: FC<ColorPickerTypes> = ({\n  containerProps,\n  colorPickerProps,\n  textInputProps,\n  labelProps,\n  forceHideHelperText,\n  isLoading,\n  preview = false,\n  ...props\n}) => {\n  const [selectedColor, setSelectedColor] = useState(props.color);\n\n  useEffect(() => {\n    if (selectedColor && selectedColor[0] !== \"#\") {\n      setSelectedColor(`#${selectedColor}`);\n    }\n  }, [selectedColor]);\n\n  const handleTextInputChange = (e: FormEvent<HTMLInputElement>) => {\n    const inputElement = e.target as HTMLInputElement;\n    let inputColor = inputElement.value;\n\n    if (inputColor[0] !== \"#\") {\n      // Prepend a hash (#) to the input value\n      inputColor = `#${inputColor}`;\n      // inputElement.value = inputColor;\n    }\n    // Remove any non-alphanumeric characters except the hash (#)\n    const sanitizedInput = inputColor.replace(/[^a-fA-F0-9#]/g, \"\");\n\n    setSelectedColor(sanitizedInput);\n\n    if (props.handleChange) {\n      props.handleChange(e); // Pass the original event\n    }\n  };\n\n  return (\n    <div className=\"hawa-flex hawa-w-fit hawa-flex-col hawa-gap-2\">\n      {props.label && <Label {...labelProps}>{props.label}</Label>}\n      {isLoading ? (\n        <Skeleton style={{ height: 40, width: 148 }} />\n      ) : (\n        <div dir=\"ltr\" className=\"hawa-flex hawa-w-full hawa-flex-row\">\n          <div\n            style={{ height: 40, backgroundColor: selectedColor }}\n            className=\"hawa-rounded-bl-lg hawa-rounded-tl-lg hawa-border\"\n          >\n            <input\n              disabled={preview}\n              type=\"color\"\n              value={selectedColor}\n              onChange={(e) => {\n                setSelectedColor(e.target.value);\n                if (props.handleChange) {\n                  props.handleChange(e);\n                }\n              }}\n              className={cn(\n                \"hawa-mt-0 hawa-h-[38px] hawa-opacity-0\",\n                props.colorPickerClassNames\n              )}\n              {...colorPickerProps}\n            />\n          </div>\n          <div className=\"hawa-relative hawa-flex hawa-max-h-fit hawa-w-full hawa-flex-col hawa-justify-center hawa-gap-0\">\n            <input\n              disabled={preview}\n              maxLength={7}\n              type=\"text\"\n              onInput={handleTextInputChange}\n              value={selectedColor}\n              className={cn(\n                \"hawa-block hawa-h-[40px] hawa-w-24 hawa-rounded hawa-rounded-l-none hawa-bg-background hawa-p-2 hawa-text-sm hawa-transition-all\",\n                \"hawa-border hawa-border-l-0 hawa-border-l-transparent\"\n                // \"hawa-border hawa-border-x-0 hawa-border-x-transparent hawa-border-b-0 hawa-rounded-tr-none\"\n              )}\n              style={{\n                backgroundColor: preview\n                  ? selectedColor\n                  : \"hsl(var(--background))\",\n                color: preview\n                  ? calculateLuminance(selectedColor) > 0.5\n                    ? \"black\"\n                    : \"white\"\n                  : \"\"\n              }}\n              // 0.179\n              {...textInputProps}\n            />\n          </div>\n        </div>\n      )}\n\n      {!forceHideHelperText && (\n        <p\n          className={cn(\n            \"hawa-my-0 hawa-text-start hawa-text-xs hawa-text-helper-color hawa-transition-all\",\n            props.helperText\n              ? \"hawa-h-4 hawa-opacity-100\"\n              : \"hawa-h-0 hawa-opacity-0\"\n          )}\n        >\n          {props.helperText}\n        </p>\n      )}\n    </div>\n  );\n};\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n\ntype Palette = {\n  name: string;\n  colors: {\n    [key: number]: string;\n  };\n};\ntype Rgb = {\n  r: number;\n  g: number;\n  b: number;\n};\nfunction hexToRgb(hex: string): Rgb | null {\n  const sanitizedHex = hex.replaceAll(\"##\", \"#\");\n  const colorParts = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(\n    sanitizedHex\n  );\n\n  if (!colorParts) {\n    return null;\n  }\n\n  const [, r, g, b] = colorParts;\n\n  return {\n    r: parseInt(r, 16),\n    g: parseInt(g, 16),\n    b: parseInt(b, 16)\n  } as Rgb;\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n  const toHex = (c: number) => `0${c.toString(16)}`.slice(-2);\n  return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport function getTextColor(color: string): \"#FFF\" | \"#333\" {\n  const rgbColor = hexToRgb(color);\n\n  if (!rgbColor) {\n    return \"#333\";\n  }\n\n  const { r, g, b } = rgbColor;\n  const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;\n\n  return luma < 120 ? \"#FFF\" : \"#333\";\n}\n\nfunction lighten(hex: string, intensity: number): string {\n  const color = hexToRgb(`#${hex}`);\n\n  if (!color) {\n    return \"\";\n  }\n\n  const r = Math.round(color.r + (255 - color.r) * intensity);\n  const g = Math.round(color.g + (255 - color.g) * intensity);\n  const b = Math.round(color.b + (255 - color.b) * intensity);\n\n  return rgbToHex(r, g, b);\n}\n\nfunction darken(hex: string, intensity: number): string {\n  const color = hexToRgb(hex);\n\n  if (!color) {\n    return \"\";\n  }\n\n  const r = Math.round(color.r * intensity);\n  const g = Math.round(color.g * intensity);\n  const b = Math.round(color.b * intensity);\n\n  return rgbToHex(r, g, b);\n}\nconst parseColor = (color: any) => {\n  if (color.startsWith(\"#\")) {\n    // Convert hex to RGB\n    let r = parseInt(color.slice(1, 3), 16);\n    let g = parseInt(color.slice(3, 5), 16);\n    let b = parseInt(color.slice(5, 7), 16);\n    return [r, g, b];\n  } else if (color.startsWith(\"rgb\")) {\n    // Extract RGB values from rgb() format\n    return color.match(/\\d+/g).map(Number);\n  }\n  // Default to white if format is unrecognized\n  return [255, 255, 255];\n};\nexport const calculateLuminance = (color: any) => {\n  const [r, g, b] = parseColor(color)?.map((c: any) => {\n    c /= 255;\n    return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n  });\n  return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\nfunction getPallette(baseColor: string): Palette {\n  const name = baseColor;\n\n  const response: Palette = {\n    name,\n    colors: {\n      500: `#${baseColor}`.replace(\"##\", \"#\")\n    }\n  };\n\n  const intensityMap: {\n    [key: number]: number;\n  } = {\n    50: 0.95,\n    100: 0.9,\n    200: 0.75,\n    300: 0.6,\n    400: 0.3,\n    600: 0.9,\n    700: 0.75,\n    800: 0.6,\n    900: 0.49\n  };\n\n  [50, 100, 200, 300, 400].forEach((level) => {\n    response.colors[level] = lighten(baseColor, intensityMap[level]);\n  });\n  [600, 700, 800, 900].forEach((level) => {\n    response.colors[level] = darken(baseColor, intensityMap[level]);\n  });\n\n  return response as Palette;\n}\n\nexport { getPallette };\n\n// const hexToRgb = (hex) => {\n//   let d = hex?.split(\"#\")[1];\n//   var aRgbHex = d?.match(/.{1,2}/g);\n//   var aRgb = [\n//     parseInt(aRgbHex[0], 16),\n//     parseInt(aRgbHex[1], 16),\n//     parseInt(aRgbHex[2], 16)\n//   ];\n//   return aRgb;\n// };\n// const getTextColor = (backColor) => {\n//   let rgbArray = hexToRgb(backColor);\n//   if (rgbArray[0] * 0.299 + rgbArray[1] * 0.587 + rgbArray[2] * 0.114 > 186) {\n//     return \"#000000\";\n//   } else {\n//     return \"#ffffff\";\n//   }\n// };\n// const replaceAt = function (string, index, replacement) {\n//   // if (replacement == \"\" || replacement == \" \") {\n//   //   return (\n//   //     string.substring(0, index) +\n//   //     string.substring(index + replacement.length )\n//   //   );\n//   // }\n//   const replaced = string.substring(0, index) + replacement + string.substring(index + 1)\n//   return replaced\n// };\n\n// export { hexToRgb, getTextColor, replaceAt };\n","import React from \"react\";\n\nimport { cn } from \"@util/index\";\n\ninterface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {\n  className?: string;\n  animation?: \"none\" | \"pulse\" | \"shimmer\";\n  content?: any;\n}\n\nfunction Skeleton({\n  className,\n  content,\n  animation = \"pulse\",\n  ...props\n}: SkeletonProps) {\n  const animationStyles = {\n    none: \"hawa-rounded hawa-bg-muted\",\n    pulse: \"hawa-animate-pulse hawa-rounded hawa-bg-muted\",\n    shimmer:\n      \"hawa-space-y-5 hawa-rounded hawa-bg-muted  hawa-p-4 hawa-relative  before:hawa-absolute before:hawa-inset-0 before:hawa--translate-x-full before:hawa-animate-[shimmer_2s_infinite] before:hawa-bg-gradient-to-r before:hawa-from-transparent before:hawa-via-gray-300/40 dark:before:hawa-via-white/10 before:hawa-to-transparent hawa-isolate hawa-overflow-hidden  before:hawa-border-t before:hawa-border-rose-100/10\"\n  };\n  return (\n    <div\n      className={cn(\n        animationStyles[animation],\n        content &&\n          \"hawa-flex hawa-flex-col hawa-items-center hawa-justify-center\",\n        className\n      )}\n      {...props}\n    >\n      {content && content}\n    </div>\n  );\n}\n\nexport { Skeleton };\n","import * as React from \"react\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\nimport { Tooltip } from \"../tooltip\";\n\nexport type LabelProps = {\n  hint?: React.ReactNode;\n  hintSide?: PositionType;\n  htmlFor?: string;\n  required?: boolean;\n};\n\nconst Label = React.forwardRef<\n  HTMLLabelElement,\n  React.LabelHTMLAttributes<HTMLLabelElement> & LabelProps\n>(({ className, hint, hintSide, required, children, ...props }, ref) => (\n  <div className=\"hawa-flex hawa-flex-row hawa-items-center hawa-gap-1 hawa-transition-all\">\n    <label\n      ref={ref}\n      className={cn(\n        \"hawa-text-sm hawa-font-medium hawa-leading-none peer-disabled:hawa-cursor-not-allowed peer-disabled:hawa-opacity-70\",\n        className\n      )}\n      {...props}\n    >\n      {children}\n      {required && <span className=\"hawa-mx-0.5 hawa-text-red-500\">*</span>}\n    </label>\n    {hint && (\n      <Tooltip\n        content={hint}\n        side={hintSide}\n        triggerProps={{\n          tabIndex: -1,\n          onClick: (event) => event.preventDefault()\n        }}\n      >\n        <div>\n          <svg\n            xmlns=\"http://www.w3.org/2000/svg\"\n            className=\"hawa-h-[14px] hawa-w-[14px] hawa-cursor-help\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            strokeWidth=\"2\"\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n          >\n            <circle cx=\"12\" cy=\"12\" r=\"10\" />\n            <path d=\"M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3\" />\n            <path d=\"M12 17h.01\" />\n          </svg>\n        </div>\n      </Tooltip>\n    )}\n  </div>\n));\n\nLabel.displayName = \"Label\";\n\nexport { Label };\n","import React from \"react\";\n\nimport * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\nimport { cn } from \"@util/index\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\nconst TooltipContent = React.forwardRef<\n  React.ElementRef<typeof TooltipPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content> & {\n    size?: \"default\" | \"small\" | \"large\";\n  }\n>(({ className, sideOffset = 4, size = \"default\", ...props }, ref) => (\n  <TooltipPrimitive.Content\n    ref={ref}\n    sideOffset={sideOffset}\n    className={cn(\n      \"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\",\n      {\n        \"hawa-text-xs\": size === \"small\",\n        \"hawa-text-xl\": size === \"large\"\n      },\n      className\n    )}\n    {...props}\n  />\n));\nTooltipContent.displayName = TooltipPrimitive.Content.displayName;\n\nconst TooltipArrow = React.forwardRef<\n  React.ElementRef<typeof TooltipPrimitive.Arrow>,\n  React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Arrow>\n>(({ className, ...props }, ref) => (\n  <TooltipPrimitive.Arrow ref={ref} className={cn(className)} {...props} />\n));\nTooltipArrow.displayName = TooltipPrimitive.Arrow.displayName;\n\ntype TooltipTypes = {\n  /** Controls the open state of the tooltip. */\n  open?: any;\n  /** Specifies the side where the tooltip will appear. */\n  side?: PositionType;\n  /** Content to be displayed within the tooltip. */\n  content?: any;\n  /** Elements to which the tooltip is anchored. */\n  children?: any;\n  /** Sets the default open state of the tooltip. */\n  defaultOpen?: any;\n  /** Event handler for open state changes. */\n  onOpenChange?: any;\n  /** Duration of the delay before the tooltip appears. */\n  delayDuration?: any;\n  /** Size of the tooltip. */\n  size?: \"default\" | \"small\" | \"large\";\n  triggerProps?: TooltipPrimitive.TooltipTriggerProps;\n  contentProps?: TooltipPrimitive.TooltipContentProps;\n  providerProps?: TooltipPrimitive.TooltipProviderProps;\n};\n\nconst Tooltip: React.FunctionComponent<TooltipTypes> = ({\n  side,\n  size,\n  open,\n  content,\n  children,\n  defaultOpen,\n  onOpenChange,\n  triggerProps,\n  contentProps,\n  providerProps,\n  delayDuration = 300,\n  ...props\n}) => {\n  return (\n    <TooltipPrimitive.TooltipProvider\n      delayDuration={delayDuration}\n      {...providerProps}\n    >\n      <TooltipPrimitive.Root\n        open={open}\n        defaultOpen={defaultOpen}\n        onOpenChange={onOpenChange}\n        {...props}\n      >\n        <TooltipPrimitive.Trigger {...triggerProps}>\n          {children}\n        </TooltipPrimitive.Trigger>\n        <TooltipContent\n          size={size}\n          side={side}\n          align=\"center\"\n          {...contentProps}\n        >\n          {content}\n        </TooltipContent>\n      </TooltipPrimitive.Root>\n    </TooltipPrimitive.TooltipProvider>\n  );\n};\n\nexport { Tooltip };\n"],"mappings":"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","names":["React","React","React","React","React"]}
+{"version":3,"sources":["../../elements/colorPicker/ColorPicker.tsx","../../util/index.ts","../../elements/skeleton/Skeleton.tsx","../../elements/label/Label.tsx","../../elements/tooltip/Tooltip.tsx"],"sourcesContent":["import React, {\n  useState,\n  FC,\n  ChangeEvent,\n  InputHTMLAttributes,\n  useEffect,\n  FormEvent\n} from \"react\";\n\nimport { calculateLuminance, cn, getTextColor } from \"@util/index\";\n\nimport { Skeleton } from \"@elements/skeleton\";\n\nimport { Label, LabelProps } from \"../label\";\n\ntype ColorPickerTypes = {\n  label?: string;\n  id?: string;\n  isLoading?: boolean;\n  labelProps?: LabelProps;\n  helperText?: string;\n  forceHideHelperText?: boolean;\n  /** Boolean to enable/disable editing the input field and using it as a text field   */\n  preview?: boolean;\n  /** The hex code for the color */\n  color?: any;\n  /** Fires everytime the color changes */\n  handleChange?: (\n    e: ChangeEvent<HTMLInputElement> | FormEvent<HTMLInputElement>\n  ) => void;\n  colorPickerClassNames?: string;\n  colorTextClassNames?: string;\n  colorPickerProps?: InputHTMLAttributes<HTMLInputElement>;\n  textInputProps?: InputHTMLAttributes<HTMLInputElement>;\n  containerProps?: InputHTMLAttributes<HTMLDivElement>;\n};\n\nexport const ColorPicker: FC<ColorPickerTypes> = ({\n  containerProps,\n  colorPickerProps,\n  textInputProps,\n  labelProps,\n  forceHideHelperText,\n  isLoading,\n  preview = false,\n  ...props\n}) => {\n  const [selectedColor, setSelectedColor] = useState(props.color);\n\n  useEffect(() => {\n    if (selectedColor && selectedColor[0] !== \"#\") {\n      setSelectedColor(`#${selectedColor}`);\n    }\n  }, [selectedColor]);\n\n  const handleTextInputChange = (e: FormEvent<HTMLInputElement>) => {\n    const inputElement = e.target as HTMLInputElement;\n    let inputColor = inputElement.value;\n\n    if (inputColor[0] !== \"#\") {\n      // Prepend a hash (#) to the input value\n      inputColor = `#${inputColor}`;\n      // inputElement.value = inputColor;\n    }\n    // Remove any non-alphanumeric characters except the hash (#)\n    const sanitizedInput = inputColor.replace(/[^a-fA-F0-9#]/g, \"\");\n\n    setSelectedColor(sanitizedInput);\n\n    if (props.handleChange) {\n      props.handleChange(e); // Pass the original event\n    }\n  };\n\n  return (\n    <div className=\"hawa-flex hawa-w-fit hawa-flex-col hawa-gap-2\">\n      {props.label && <Label {...labelProps}>{props.label}</Label>}\n      {isLoading ? (\n        <Skeleton style={{ height: 40, width: 148 }} />\n      ) : (\n        <div dir=\"ltr\" className=\"hawa-flex hawa-w-full hawa-flex-row\">\n          <div\n            style={{ height: 40, backgroundColor: selectedColor }}\n            className=\"hawa-rounded-bl-lg hawa-rounded-tl-lg hawa-border\"\n          >\n            <input\n              disabled={preview}\n              type=\"color\"\n              value={selectedColor}\n              onChange={(e) => {\n                setSelectedColor(e.target.value);\n                if (props.handleChange) {\n                  props.handleChange(e);\n                }\n              }}\n              className={cn(\n                \"hawa-mt-0 hawa-h-[38px] hawa-opacity-0\",\n                props.colorPickerClassNames\n              )}\n              {...colorPickerProps}\n            />\n          </div>\n          <div className=\"hawa-relative hawa-flex hawa-max-h-fit hawa-w-full hawa-flex-col hawa-justify-center hawa-gap-0\">\n            <input\n              disabled={preview}\n              maxLength={7}\n              type=\"text\"\n              onInput={handleTextInputChange}\n              value={selectedColor}\n              className={cn(\n                \"hawa-block hawa-h-[40px] hawa-w-24 hawa-rounded hawa-rounded-l-none hawa-bg-background hawa-p-2 hawa-text-sm hawa-transition-all\",\n                \"hawa-border hawa-border-l-0 hawa-border-l-transparent\"\n                // \"hawa-border hawa-border-x-0 hawa-border-x-transparent hawa-border-b-0 hawa-rounded-tr-none\"\n              )}\n              style={{\n                backgroundColor: preview\n                  ? selectedColor\n                  : \"hsl(var(--background))\",\n                color: preview\n                  ? calculateLuminance(selectedColor) > 0.5\n                    ? \"black\"\n                    : \"white\"\n                  : \"\"\n              }}\n              // 0.179\n              {...textInputProps}\n            />\n          </div>\n        </div>\n      )}\n\n      {!forceHideHelperText && (\n        <p\n          className={cn(\n            \"hawa-my-0 hawa-text-start hawa-text-xs hawa-text-helper-color hawa-transition-all\",\n            props.helperText\n              ? \"hawa-h-4 hawa-opacity-100\"\n              : \"hawa-h-0 hawa-opacity-0\"\n          )}\n        >\n          {props.helperText}\n        </p>\n      )}\n    </div>\n  );\n};\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n\ntype Palette = {\n  name: string;\n  colors: {\n    [key: number]: string;\n  };\n};\ntype Rgb = {\n  r: number;\n  g: number;\n  b: number;\n};\nfunction hexToRgb(hex: string): Rgb | null {\n  const sanitizedHex = hex.replaceAll(\"##\", \"#\");\n  const colorParts = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(\n    sanitizedHex\n  );\n\n  if (!colorParts) {\n    return null;\n  }\n\n  const [, r, g, b] = colorParts;\n\n  return {\n    r: parseInt(r, 16),\n    g: parseInt(g, 16),\n    b: parseInt(b, 16)\n  } as Rgb;\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n  const toHex = (c: number) => `0${c.toString(16)}`.slice(-2);\n  return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport function getTextColor(color: string): \"#FFF\" | \"#333\" {\n  const rgbColor = hexToRgb(color);\n\n  if (!rgbColor) {\n    return \"#333\";\n  }\n\n  const { r, g, b } = rgbColor;\n  const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;\n\n  return luma < 120 ? \"#FFF\" : \"#333\";\n}\n\nfunction lighten(hex: string, intensity: number): string {\n  const color = hexToRgb(`#${hex}`);\n\n  if (!color) {\n    return \"\";\n  }\n\n  const r = Math.round(color.r + (255 - color.r) * intensity);\n  const g = Math.round(color.g + (255 - color.g) * intensity);\n  const b = Math.round(color.b + (255 - color.b) * intensity);\n\n  return rgbToHex(r, g, b);\n}\n\nfunction darken(hex: string, intensity: number): string {\n  const color = hexToRgb(hex);\n\n  if (!color) {\n    return \"\";\n  }\n\n  const r = Math.round(color.r * intensity);\n  const g = Math.round(color.g * intensity);\n  const b = Math.round(color.b * intensity);\n\n  return rgbToHex(r, g, b);\n}\nconst parseColor = (color: any) => {\n  if (color.startsWith(\"#\")) {\n    // Convert hex to RGB\n    let r = parseInt(color.slice(1, 3), 16);\n    let g = parseInt(color.slice(3, 5), 16);\n    let b = parseInt(color.slice(5, 7), 16);\n    return [r, g, b];\n  } else if (color.startsWith(\"rgb\")) {\n    // Extract RGB values from rgb() format\n    return color.match(/\\d+/g).map(Number);\n  }\n  // Default to white if format is unrecognized\n  return [255, 255, 255];\n};\nexport const calculateLuminance = (color: any) => {\n  const [r, g, b] = parseColor(color)?.map((c: any) => {\n    c /= 255;\n    return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n  });\n  return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\nfunction getPallette(baseColor: string): Palette {\n  const name = baseColor;\n\n  const response: Palette = {\n    name,\n    colors: {\n      500: `#${baseColor}`.replace(\"##\", \"#\")\n    }\n  };\n\n  const intensityMap: {\n    [key: number]: number;\n  } = {\n    50: 0.95,\n    100: 0.9,\n    200: 0.75,\n    300: 0.6,\n    400: 0.3,\n    600: 0.9,\n    700: 0.75,\n    800: 0.6,\n    900: 0.49\n  };\n\n  [50, 100, 200, 300, 400].forEach((level) => {\n    response.colors[level] = lighten(baseColor, intensityMap[level]);\n  });\n  [600, 700, 800, 900].forEach((level) => {\n    response.colors[level] = darken(baseColor, intensityMap[level]);\n  });\n\n  return response as Palette;\n}\n\nexport { getPallette };\n\n// const hexToRgb = (hex) => {\n//   let d = hex?.split(\"#\")[1];\n//   var aRgbHex = d?.match(/.{1,2}/g);\n//   var aRgb = [\n//     parseInt(aRgbHex[0], 16),\n//     parseInt(aRgbHex[1], 16),\n//     parseInt(aRgbHex[2], 16)\n//   ];\n//   return aRgb;\n// };\n// const getTextColor = (backColor) => {\n//   let rgbArray = hexToRgb(backColor);\n//   if (rgbArray[0] * 0.299 + rgbArray[1] * 0.587 + rgbArray[2] * 0.114 > 186) {\n//     return \"#000000\";\n//   } else {\n//     return \"#ffffff\";\n//   }\n// };\n// const replaceAt = function (string, index, replacement) {\n//   // if (replacement == \"\" || replacement == \" \") {\n//   //   return (\n//   //     string.substring(0, index) +\n//   //     string.substring(index + replacement.length )\n//   //   );\n//   // }\n//   const replaced = string.substring(0, index) + replacement + string.substring(index + 1)\n//   return replaced\n// };\n\n// export { hexToRgb, getTextColor, replaceAt };\n","import React from \"react\";\n\nimport { cn } from \"@util/index\";\n\ninterface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {\n  className?: string;\n  animation?: \"none\" | \"pulse\" | \"shimmer\";\n  content?: any;\n  fade?: \"top\" | \"bottom\" | \"left\" | \"right\";\n}\n\nfunction Skeleton({\n  className,\n  content,\n  animation = \"pulse\",\n  fade,\n  ...props\n}: SkeletonProps) {\n  const animationStyles = {\n    none: \"hawa-rounded hawa-bg-muted\",\n    pulse: \"hawa-animate-pulse hawa-rounded hawa-bg-muted\",\n    shimmer:\n      \"hawa-space-y-5 hawa-rounded hawa-bg-muted  hawa-p-4 hawa-relative  before:hawa-absolute before:hawa-inset-0 before:hawa--translate-x-full before:hawa-animate-[shimmer_2s_infinite] before:hawa-bg-gradient-to-r before:hawa-from-transparent before:hawa-via-gray-300/40 dark:before:hawa-via-white/10 before:hawa-to-transparent hawa-isolate hawa-overflow-hidden  before:hawa-border-t before:hawa-border-rose-100/10\"\n  };\n  const fadeStyle = `[mask-image:linear-gradient(to_${fade},#D1D4DC_50%,transparent_100%)]`;\n\n  return (\n    <div\n      className={cn(\n        animationStyles[animation],\n        content &&\n          \"hawa-flex hawa-flex-col hawa-items-center hawa-justify-center\",\n        fade && fadeStyle,\n        className\n      )}\n      {...props}\n    >\n      {content && content}\n    </div>\n  );\n}\n\nexport { Skeleton };\n","import * as React from \"react\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\nimport { Tooltip } from \"../tooltip\";\n\nexport type LabelProps = {\n  hint?: React.ReactNode;\n  hintSide?: PositionType;\n  htmlFor?: string;\n  required?: boolean;\n};\n\nconst Label = React.forwardRef<\n  HTMLLabelElement,\n  React.LabelHTMLAttributes<HTMLLabelElement> & LabelProps\n>(({ className, hint, hintSide, required, children, ...props }, ref) => (\n  <div className=\"hawa-flex hawa-flex-row hawa-items-center hawa-gap-1 hawa-transition-all\">\n    <label\n      ref={ref}\n      className={cn(\n        \"hawa-text-sm hawa-font-medium hawa-leading-none peer-disabled:hawa-cursor-not-allowed peer-disabled:hawa-opacity-70\",\n        className\n      )}\n      {...props}\n    >\n      {children}\n      {required && <span className=\"hawa-mx-0.5 hawa-text-red-500\">*</span>}\n    </label>\n    {hint && (\n      <Tooltip\n        content={hint}\n        side={hintSide}\n        triggerProps={{\n          tabIndex: -1,\n          onClick: (event) => event.preventDefault()\n        }}\n      >\n        <div>\n          <svg\n            xmlns=\"http://www.w3.org/2000/svg\"\n            className=\"hawa-h-[14px] hawa-w-[14px] hawa-cursor-help\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            strokeWidth=\"2\"\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n          >\n            <circle cx=\"12\" cy=\"12\" r=\"10\" />\n            <path d=\"M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3\" />\n            <path d=\"M12 17h.01\" />\n          </svg>\n        </div>\n      </Tooltip>\n    )}\n  </div>\n));\n\nLabel.displayName = \"Label\";\n\nexport { Label };\n","import React from \"react\";\n\nimport * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\nimport { cn } from \"@util/index\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\nconst TooltipContent = React.forwardRef<\n  React.ElementRef<typeof TooltipPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content> & {\n    size?: \"default\" | \"small\" | \"large\";\n  }\n>(({ className, sideOffset = 4, size = \"default\", ...props }, ref) => (\n  <TooltipPrimitive.Content\n    ref={ref}\n    sideOffset={sideOffset}\n    className={cn(\n      \"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\",\n      {\n        \"hawa-text-xs\": size === \"small\",\n        \"hawa-text-xl\": size === \"large\"\n      },\n      className\n    )}\n    {...props}\n  />\n));\nTooltipContent.displayName = TooltipPrimitive.Content.displayName;\n\nconst TooltipArrow = React.forwardRef<\n  React.ElementRef<typeof TooltipPrimitive.Arrow>,\n  React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Arrow>\n>(({ className, ...props }, ref) => (\n  <TooltipPrimitive.Arrow ref={ref} className={cn(className)} {...props} />\n));\nTooltipArrow.displayName = TooltipPrimitive.Arrow.displayName;\n\ntype TooltipTypes = {\n  /** Controls the open state of the tooltip. */\n  open?: any;\n  /** Specifies the side where the tooltip will appear. */\n  side?: PositionType;\n  /** Content to be displayed within the tooltip. */\n  content?: any;\n  /** Elements to which the tooltip is anchored. */\n  children?: any;\n  /** Sets the default open state of the tooltip. */\n  defaultOpen?: any;\n  /** Event handler for open state changes. */\n  onOpenChange?: any;\n  /** Duration of the delay before the tooltip appears. */\n  delayDuration?: any;\n  /** Size of the tooltip. */\n  size?: \"default\" | \"small\" | \"large\";\n  triggerProps?: TooltipPrimitive.TooltipTriggerProps;\n  contentProps?: TooltipPrimitive.TooltipContentProps;\n  providerProps?: TooltipPrimitive.TooltipProviderProps;\n};\n\nconst Tooltip: React.FunctionComponent<TooltipTypes> = ({\n  side,\n  size,\n  open,\n  content,\n  children,\n  defaultOpen,\n  onOpenChange,\n  triggerProps,\n  contentProps,\n  providerProps,\n  delayDuration = 300,\n  ...props\n}) => {\n  return (\n    <TooltipPrimitive.TooltipProvider\n      delayDuration={delayDuration}\n      {...providerProps}\n    >\n      <TooltipPrimitive.Root\n        open={open}\n        defaultOpen={defaultOpen}\n        onOpenChange={onOpenChange}\n        {...props}\n      >\n        <TooltipPrimitive.Trigger {...triggerProps}>\n          {children}\n        </TooltipPrimitive.Trigger>\n        <TooltipContent\n          size={size}\n          side={side}\n          align=\"center\"\n          {...contentProps}\n        >\n          {content}\n        </TooltipContent>\n      </TooltipPrimitive.Root>\n    </TooltipPrimitive.TooltipProvider>\n  );\n};\n\nexport { Tooltip };\n"],"mappings":"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","names":["React","React","React","React","React"]}

package/dist/combobox/index.js

@@ -180,6 +180,7 @@ function Skeleton({
   className,
   content,
   animation = "pulse",
+  fade,
   ...props
 }) {
   const animationStyles = {
@@ -187,12 +188,14 @@ function Skeleton({
     pulse: "hawa-animate-pulse hawa-rounded hawa-bg-muted",
     shimmer: "hawa-space-y-5 hawa-rounded hawa-bg-muted  hawa-p-4 hawa-relative  before:hawa-absolute before:hawa-inset-0 before:hawa--translate-x-full before:hawa-animate-[shimmer_2s_infinite] before:hawa-bg-gradient-to-r before:hawa-from-transparent before:hawa-via-gray-300/40 dark:before:hawa-via-white/10 before:hawa-to-transparent hawa-isolate hawa-overflow-hidden  before:hawa-border-t before:hawa-border-rose-100/10"
   };
+  const fadeStyle = `[mask-image:linear-gradient(to_${fade},#D1D4DC_50%,transparent_100%)]`;
   return /* @__PURE__ */ import_react2.default.createElement(
     "div",
     {
       className: cn(
         animationStyles[animation],
         content && "hawa-flex hawa-flex-col hawa-items-center hawa-justify-center",
+        fade && fadeStyle,
         className
       ),
       ...props

package/dist/combobox/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../elements/combobox/index.ts","../../elements/combobox/Combobox.tsx","../../elements/label/Label.tsx","../../util/index.ts","../../elements/tooltip/Tooltip.tsx","../../elements/popover/Popover.tsx","../../elements/skeleton/Skeleton.tsx","../../elements/command/Command.tsx","../../elements/dialog/Dialog.tsx"],"sourcesContent":["export * from \"./Combobox\";\n","import * as React from \"react\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\nimport * as PopoverPrimitive from \"@radix-ui/react-popover\";\n\nimport { Label, LabelProps } from \"../label\";\nimport { PopoverContent, PopoverTrigger } from \"../popover\";\nimport { Skeleton } from \"../skeleton\";\n\nimport { cn } from \"@util/index\";\nimport {\n  Command,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem\n} from \"../command\";\n\ntype ComboboxTypes<T> = {\n  labelKey?: keyof T;\n  valueKey?: keyof T;\n  data: T[];\n  width?: string;\n  texts?: {\n    noItems?: string;\n    placeholder?: string;\n    searchPlaceholder?: string;\n  };\n  isLoading?: boolean;\n  helperText?: string;\n  popoverClassName?: string;\n  /** This the same value as the one with the key valueKey */\n  defaultValue?: string;\n  preview?: boolean;\n  hideInput?: boolean;\n  direction?: DirectionType;\n  id?: string;\n  /** The label of the input field   */\n  label?: any;\n  labelProps?: LabelProps;\n  /** If true, it will show a red asterisk next to the label*/\n  isRequired?: boolean;\n  onChange?: (e: any) => void;\n};\n\nexport const Combobox = React.forwardRef<HTMLDivElement, ComboboxTypes<any>>(\n  (\n    {\n      labelKey = \"label\",\n      valueKey = \"value\",\n      defaultValue = \"\",\n      popoverClassName,\n      direction,\n      labelProps,\n      data,\n      ...props\n    },\n    ref\n  ) => {\n    const [open, setOpen] = React.useState(false);\n    const [value, setValue] = React.useState(defaultValue);\n    function getProperty<T, K extends keyof T>(obj: T, key: K): T[K] {\n      return obj[key];\n    }\n    const handleOpenChange = (open: boolean) => {\n      if (!(props.isLoading || props.preview)) {\n        setOpen(open);\n      }\n    };\n    return (\n      <div\n        className={cn(\n          \"hawa-relative hawa-flex hawa-h-fit hawa-flex-col hawa-gap-2\",\n          props.width === \"fit\" ? \"hawa-w-fit\" : \"hawa-w-full\"\n        )}\n      >\n        {props.label && <Label {...labelProps}>{props.label}</Label>}\n\n        <PopoverPrimitive.Root open={open} onOpenChange={handleOpenChange}>\n          <PopoverTrigger asChild>\n            {props.isLoading ? (\n              <div className=\"hawa-pb-2\">\n                <Skeleton className=\"hawa-h-[40px] hawa-w-full\" />\n              </div>\n            ) : (\n              <div className=\"hawa-flex hawa-flex-col hawa-items-start hawa-gap-2 \">\n                <div\n                  className={cn(\n                    \"hawa-absolute hawa-top-[22px] hawa-h-[0.8px] hawa-w-full hawa-bg-gray-200 hawa-transition-all dark:hawa-bg-gray-800\",\n                    props.preview ? \"hawa-opacity-100\" : \"hawa-opacity-0\"\n                  )}\n                ></div>\n                <button\n                  role=\"combobox\"\n                  type=\"button\"\n                  aria-expanded={open}\n                  className={cn(\n                    \"hawa-inline-flex hawa-h-10 hawa-w-full hawa-select-none hawa-items-center hawa-justify-between hawa-rounded-md hawa-border hawa-py-2 hawa-text-sm hawa-font-normal  hawa-ring-offset-background  hawa-transition-all  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\",\n                    props.preview\n                      ? \"hawa-cursor-default hawa-rounded-none hawa-border-transparent hawa-px-0\"\n                      : \"hawa-bg-background hawa-px-3 \"\n                  )}\n                >\n                  {value\n                    ? getProperty(\n                        data.find((item: any) => item[valueKey] === value) ||\n                          {},\n                        labelKey\n                      )\n                    : props.texts?.placeholder || \". . .\"}\n                  <svg\n                    xmlns=\"http://www.w3.org/2000/svg\"\n                    className={cn(\n                      \"hawa-icon hawa-transition-all\",\n                      !props.preview\n                        ? \"hawa-visible hawa-opacity-100\"\n                        : \"hawa-invisible hawa-opacity-0\"\n                    )}\n                    aria-label=\"Chevron down icon\"\n                    viewBox=\"0 0 24 24\"\n                    fill=\"none\"\n                    stroke=\"currentColor\"\n                    strokeWidth=\"2\"\n                    strokeLinecap=\"round\"\n                    strokeLinejoin=\"round\"\n                  >\n                    <path d=\"m6 9 6 6 6-6\" />\n                  </svg>\n                </button>\n                <p\n                  className={cn(\n                    \"hawa-my-0 hawa-text-start hawa-text-xs hawa-text-helper-color hawa-transition-all\",\n                    props.helperText\n                      ? \"hawa-h-4 hawa-opacity-100\"\n                      : \"hawa-h-0 hawa-opacity-0\"\n                  )}\n                >\n                  {props.helperText}\n                </p>\n              </div>\n            )}\n          </PopoverTrigger>\n          <PopoverContent\n            sideOffset={0}\n            className={cn(\"popover-w-parent\", props.helperText && \"-hawa-mt-4\")}\n            dir={direction}\n          >\n            <Command>\n              {!props.hideInput && (\n                <CommandInput\n                  dir={direction}\n                  placeholder={props.texts?.searchPlaceholder || \"Search\"}\n                />\n              )}\n              <CommandEmpty>\n                {props.texts?.noItems || \"No items found.\"}\n              </CommandEmpty>\n              <CommandGroup className=\"hawa-max-h-[200px] hawa-overflow-y-auto\">\n                {data.map((item: any, i) => (\n                  <CommandItem\n                    key={i}\n                    onSelect={() => {\n                      const newValue = getProperty(item, valueKey);\n                      setValue(newValue === value ? \"\" : (newValue as string));\n                      if (props.onChange) {\n                        props.onChange(\n                          newValue === value ? \"\" : (newValue as string)\n                        );\n                      }\n                      setOpen(false);\n                    }}\n                  >\n                    <svg\n                      aria-label=\"Check Icon\"\n                      xmlns=\"http://www.w3.org/2000/svg\"\n                      width=\"24\"\n                      height=\"24\"\n                      viewBox=\"0 0 24 24\"\n                      fill=\"none\"\n                      stroke=\"currentColor\"\n                      strokeWidth=\"2\"\n                      strokeLinecap=\"round\"\n                      strokeLinejoin=\"round\"\n                      className={cn(\n                        \"hawa-icon\",\n                        value === getProperty(item, valueKey)\n                          ? \"hawa-opacity-100\"\n                          : \"hawa-opacity-0\"\n                      )}\n                      style={{ marginInlineEnd: \"0.5rem\" }}\n                    >\n                      <polyline points=\"20 6 9 17 4 12\" />\n                    </svg>\n                    {getProperty(item, labelKey)}\n                  </CommandItem>\n                ))}\n              </CommandGroup>\n            </Command>\n          </PopoverContent>\n        </PopoverPrimitive.Root>\n      </div>\n    );\n  }\n);\n","import * as React from \"react\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\nimport { Tooltip } from \"../tooltip\";\n\nexport type LabelProps = {\n  hint?: React.ReactNode;\n  hintSide?: PositionType;\n  htmlFor?: string;\n  required?: boolean;\n};\n\nconst Label = React.forwardRef<\n  HTMLLabelElement,\n  React.LabelHTMLAttributes<HTMLLabelElement> & LabelProps\n>(({ className, hint, hintSide, required, children, ...props }, ref) => (\n  <div className=\"hawa-flex hawa-flex-row hawa-items-center hawa-gap-1 hawa-transition-all\">\n    <label\n      ref={ref}\n      className={cn(\n        \"hawa-text-sm hawa-font-medium hawa-leading-none peer-disabled:hawa-cursor-not-allowed peer-disabled:hawa-opacity-70\",\n        className\n      )}\n      {...props}\n    >\n      {children}\n      {required && <span className=\"hawa-mx-0.5 hawa-text-red-500\">*</span>}\n    </label>\n    {hint && (\n      <Tooltip\n        content={hint}\n        side={hintSide}\n        triggerProps={{\n          tabIndex: -1,\n          onClick: (event) => event.preventDefault()\n        }}\n      >\n        <div>\n          <svg\n            xmlns=\"http://www.w3.org/2000/svg\"\n            className=\"hawa-h-[14px] hawa-w-[14px] hawa-cursor-help\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            strokeWidth=\"2\"\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n          >\n            <circle cx=\"12\" cy=\"12\" r=\"10\" />\n            <path d=\"M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3\" />\n            <path d=\"M12 17h.01\" />\n          </svg>\n        </div>\n      </Tooltip>\n    )}\n  </div>\n));\n\nLabel.displayName = \"Label\";\n\nexport { Label };\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n\ntype Palette = {\n  name: string;\n  colors: {\n    [key: number]: string;\n  };\n};\ntype Rgb = {\n  r: number;\n  g: number;\n  b: number;\n};\nfunction hexToRgb(hex: string): Rgb | null {\n  const sanitizedHex = hex.replaceAll(\"##\", \"#\");\n  const colorParts = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(\n    sanitizedHex\n  );\n\n  if (!colorParts) {\n    return null;\n  }\n\n  const [, r, g, b] = colorParts;\n\n  return {\n    r: parseInt(r, 16),\n    g: parseInt(g, 16),\n    b: parseInt(b, 16)\n  } as Rgb;\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n  const toHex = (c: number) => `0${c.toString(16)}`.slice(-2);\n  return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport function getTextColor(color: string): \"#FFF\" | \"#333\" {\n  const rgbColor = hexToRgb(color);\n\n  if (!rgbColor) {\n    return \"#333\";\n  }\n\n  const { r, g, b } = rgbColor;\n  const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;\n\n  return luma < 120 ? \"#FFF\" : \"#333\";\n}\n\nfunction lighten(hex: string, intensity: number): string {\n  const color = hexToRgb(`#${hex}`);\n\n  if (!color) {\n    return \"\";\n  }\n\n  const r = Math.round(color.r + (255 - color.r) * intensity);\n  const g = Math.round(color.g + (255 - color.g) * intensity);\n  const b = Math.round(color.b + (255 - color.b) * intensity);\n\n  return rgbToHex(r, g, b);\n}\n\nfunction darken(hex: string, intensity: number): string {\n  const color = hexToRgb(hex);\n\n  if (!color) {\n    return \"\";\n  }\n\n  const r = Math.round(color.r * intensity);\n  const g = Math.round(color.g * intensity);\n  const b = Math.round(color.b * intensity);\n\n  return rgbToHex(r, g, b);\n}\nconst parseColor = (color: any) => {\n  if (color.startsWith(\"#\")) {\n    // Convert hex to RGB\n    let r = parseInt(color.slice(1, 3), 16);\n    let g = parseInt(color.slice(3, 5), 16);\n    let b = parseInt(color.slice(5, 7), 16);\n    return [r, g, b];\n  } else if (color.startsWith(\"rgb\")) {\n    // Extract RGB values from rgb() format\n    return color.match(/\\d+/g).map(Number);\n  }\n  // Default to white if format is unrecognized\n  return [255, 255, 255];\n};\nexport const calculateLuminance = (color: any) => {\n  const [r, g, b] = parseColor(color)?.map((c: any) => {\n    c /= 255;\n    return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n  });\n  return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\nfunction getPallette(baseColor: string): Palette {\n  const name = baseColor;\n\n  const response: Palette = {\n    name,\n    colors: {\n      500: `#${baseColor}`.replace(\"##\", \"#\")\n    }\n  };\n\n  const intensityMap: {\n    [key: number]: number;\n  } = {\n    50: 0.95,\n    100: 0.9,\n    200: 0.75,\n    300: 0.6,\n    400: 0.3,\n    600: 0.9,\n    700: 0.75,\n    800: 0.6,\n    900: 0.49\n  };\n\n  [50, 100, 200, 300, 400].forEach((level) => {\n    response.colors[level] = lighten(baseColor, intensityMap[level]);\n  });\n  [600, 700, 800, 900].forEach((level) => {\n    response.colors[level] = darken(baseColor, intensityMap[level]);\n  });\n\n  return response as Palette;\n}\n\nexport { getPallette };\n\n// const hexToRgb = (hex) => {\n//   let d = hex?.split(\"#\")[1];\n//   var aRgbHex = d?.match(/.{1,2}/g);\n//   var aRgb = [\n//     parseInt(aRgbHex[0], 16),\n//     parseInt(aRgbHex[1], 16),\n//     parseInt(aRgbHex[2], 16)\n//   ];\n//   return aRgb;\n// };\n// const getTextColor = (backColor) => {\n//   let rgbArray = hexToRgb(backColor);\n//   if (rgbArray[0] * 0.299 + rgbArray[1] * 0.587 + rgbArray[2] * 0.114 > 186) {\n//     return \"#000000\";\n//   } else {\n//     return \"#ffffff\";\n//   }\n// };\n// const replaceAt = function (string, index, replacement) {\n//   // if (replacement == \"\" || replacement == \" \") {\n//   //   return (\n//   //     string.substring(0, index) +\n//   //     string.substring(index + replacement.length )\n//   //   );\n//   // }\n//   const replaced = string.substring(0, index) + replacement + string.substring(index + 1)\n//   return replaced\n// };\n\n// export { hexToRgb, getTextColor, replaceAt };\n","import React from \"react\";\n\nimport * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\nimport { cn } from \"@util/index\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\nconst TooltipContent = React.forwardRef<\n  React.ElementRef<typeof TooltipPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content> & {\n    size?: \"default\" | \"small\" | \"large\";\n  }\n>(({ className, sideOffset = 4, size = \"default\", ...props }, ref) => (\n  <TooltipPrimitive.Content\n    ref={ref}\n    sideOffset={sideOffset}\n    className={cn(\n      \"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\",\n      {\n        \"hawa-text-xs\": size === \"small\",\n        \"hawa-text-xl\": size === \"large\"\n      },\n      className\n    )}\n    {...props}\n  />\n));\nTooltipContent.displayName = TooltipPrimitive.Content.displayName;\n\nconst TooltipArrow = React.forwardRef<\n  React.ElementRef<typeof TooltipPrimitive.Arrow>,\n  React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Arrow>\n>(({ className, ...props }, ref) => (\n  <TooltipPrimitive.Arrow ref={ref} className={cn(className)} {...props} />\n));\nTooltipArrow.displayName = TooltipPrimitive.Arrow.displayName;\n\ntype TooltipTypes = {\n  /** Controls the open state of the tooltip. */\n  open?: any;\n  /** Specifies the side where the tooltip will appear. */\n  side?: PositionType;\n  /** Content to be displayed within the tooltip. */\n  content?: any;\n  /** Elements to which the tooltip is anchored. */\n  children?: any;\n  /** Sets the default open state of the tooltip. */\n  defaultOpen?: any;\n  /** Event handler for open state changes. */\n  onOpenChange?: any;\n  /** Duration of the delay before the tooltip appears. */\n  delayDuration?: any;\n  /** Size of the tooltip. */\n  size?: \"default\" | \"small\" | \"large\";\n  triggerProps?: TooltipPrimitive.TooltipTriggerProps;\n  contentProps?: TooltipPrimitive.TooltipContentProps;\n  providerProps?: TooltipPrimitive.TooltipProviderProps;\n};\n\nconst Tooltip: React.FunctionComponent<TooltipTypes> = ({\n  side,\n  size,\n  open,\n  content,\n  children,\n  defaultOpen,\n  onOpenChange,\n  triggerProps,\n  contentProps,\n  providerProps,\n  delayDuration = 300,\n  ...props\n}) => {\n  return (\n    <TooltipPrimitive.TooltipProvider\n      delayDuration={delayDuration}\n      {...providerProps}\n    >\n      <TooltipPrimitive.Root\n        open={open}\n        defaultOpen={defaultOpen}\n        onOpenChange={onOpenChange}\n        {...props}\n      >\n        <TooltipPrimitive.Trigger {...triggerProps}>\n          {children}\n        </TooltipPrimitive.Trigger>\n        <TooltipContent\n          size={size}\n          side={side}\n          align=\"center\"\n          {...contentProps}\n        >\n          {content}\n        </TooltipContent>\n      </TooltipPrimitive.Root>\n    </TooltipPrimitive.TooltipProvider>\n  );\n};\n\nexport { Tooltip };\n","import * as React from \"react\";\n\nimport * as PopoverPrimitive from \"@radix-ui/react-popover\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\n\nconst PopoverContent = React.forwardRef<\n  React.ElementRef<typeof PopoverPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>\n>(({ className, align = \"center\", sideOffset = 4, ...props }, ref) => (\n  <PopoverPrimitive.Portal>\n    <PopoverPrimitive.Content\n      ref={ref}\n      align={align}\n      sideOffset={sideOffset}\n      className={cn(\n        \"dark:dark-shadow hawa-z-50 hawa-rounded hawa-border hawa-bg-popover hawa-text-popover-foreground hawa-shadow-md hawa-outline-none data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-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\",\n        className\n      )}\n      {...props}\n    />\n  </PopoverPrimitive.Portal>\n));\nPopoverContent.displayName = PopoverPrimitive.Content.displayName;\n\ninterface PopoverProps {\n  side?: PositionType;\n  align?: \"start\" | \"center\" | \"end\";\n  trigger?: React.ReactNode;\n  children: React.ReactNode;\n  className?: string;\n  sideOffset?: number;\n  disableTrigger?: any;\n  width?: \"trigger\" | \"default\";\n  open?: boolean;\n  contentProps?: PopoverPrimitive.PopoverContentProps;\n  triggerProps?: PopoverPrimitive.PopoverTriggerProps;\n}\n\ntype HawaPopoverTypes = PopoverProps &\n  React.ComponentProps<typeof PopoverPrimitive.Root>;\n\nconst Popover: React.FC<HawaPopoverTypes> = ({\n  trigger,\n  children,\n  className,\n  align = \"center\",\n  side,\n  sideOffset = 4,\n  open,\n  width = \"default\",\n  disableTrigger,\n  contentProps,\n  triggerProps,\n  ...props\n}) => {\n  let widthStyles = {\n    trigger: \"var(--radix-popover-trigger-width)\",\n    default: \"auto\"\n  };\n\n  return (\n    <PopoverPrimitive.Root open={open} {...props}>\n      <PopoverPrimitive.Trigger\n        className=\"hawa-w-full\"\n        disabled={disableTrigger}\n        {...triggerProps}\n      >\n        {trigger}\n      </PopoverPrimitive.Trigger>\n      <PopoverContent\n        side={side}\n        className={className}\n        align={align}\n        sideOffset={sideOffset}\n        style={{\n          width: widthStyles[width]\n        }}\n        {...contentProps}\n      >\n        {children}\n      </PopoverContent>\n    </PopoverPrimitive.Root>\n  );\n};\n\nconst PopoverTrigger = PopoverPrimitive.Trigger;\nexport { Popover, PopoverContent, PopoverTrigger };\n","import React from \"react\";\n\nimport { cn } from \"@util/index\";\n\ninterface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {\n  className?: string;\n  animation?: \"none\" | \"pulse\" | \"shimmer\";\n  content?: any;\n}\n\nfunction Skeleton({\n  className,\n  content,\n  animation = \"pulse\",\n  ...props\n}: SkeletonProps) {\n  const animationStyles = {\n    none: \"hawa-rounded hawa-bg-muted\",\n    pulse: \"hawa-animate-pulse hawa-rounded hawa-bg-muted\",\n    shimmer:\n      \"hawa-space-y-5 hawa-rounded hawa-bg-muted  hawa-p-4 hawa-relative  before:hawa-absolute before:hawa-inset-0 before:hawa--translate-x-full before:hawa-animate-[shimmer_2s_infinite] before:hawa-bg-gradient-to-r before:hawa-from-transparent before:hawa-via-gray-300/40 dark:before:hawa-via-white/10 before:hawa-to-transparent hawa-isolate hawa-overflow-hidden  before:hawa-border-t before:hawa-border-rose-100/10\"\n  };\n  return (\n    <div\n      className={cn(\n        animationStyles[animation],\n        content &&\n          \"hawa-flex hawa-flex-col hawa-items-center hawa-justify-center\",\n        className\n      )}\n      {...props}\n    >\n      {content && content}\n    </div>\n  );\n}\n\nexport { Skeleton };\n","import * as React from \"react\";\n\nimport { DialogProps } from \"@radix-ui/react-dialog\";\nimport { cn } from \"@util/index\";\nimport { Command as CommandPrimitive } from \"cmdk\";\n\nimport { Dialog, DialogContent } from \"../dialog\";\n\ntype CommandProps = React.ComponentPropsWithoutRef<typeof CommandPrimitive>;\ninterface CommandDialogProps extends DialogProps {}\ninterface CommandInputProps\n  extends React.ComponentPropsWithoutRef<typeof CommandPrimitive.Input> {}\ninterface CommandListProps\n  extends React.ComponentPropsWithoutRef<typeof CommandPrimitive.List> {}\ninterface CommandEmptyProps\n  extends React.ComponentPropsWithoutRef<typeof CommandPrimitive.Empty> {}\ninterface CommandGroupProps\n  extends React.ComponentPropsWithoutRef<typeof CommandPrimitive.Group> {}\ninterface CommandSeparatorProps\n  extends React.ComponentPropsWithoutRef<typeof CommandPrimitive.Separator> {}\ninterface CommandItemProps\n  extends React.ComponentPropsWithoutRef<typeof CommandPrimitive.Item> {}\ninterface CommandShortcutProps extends React.HTMLAttributes<HTMLSpanElement> {}\n\nconst Command: React.ForwardRefExoticComponent<\n  CommandProps & React.RefAttributes<React.ElementRef<typeof CommandPrimitive>>\n> = React.forwardRef(({ className, ...props }, ref) => (\n  <CommandPrimitive\n    ref={ref}\n    className={cn(\n      \"hawa-flex hawa-h-full hawa-w-full hawa-flex-col hawa-overflow-hidden hawa-rounded-md hawa-bg-popover hawa-text-popover-foreground\",\n      className\n    )}\n    {...props}\n  />\n));\nCommand.displayName = CommandPrimitive.displayName;\n\nconst CommandDialog = ({ children, ...props }: CommandDialogProps) => {\n  return (\n    <Dialog {...props}>\n      <DialogContent className=\"hawa-overflow-hidden hawa-p-0 hawa-shadow-lg\">\n        <Command className=\"[&_[cmdk-group-heading]]:hawa-px-2 [&_[cmdk-group-heading]]:hawa-font-medium [&_[cmdk-group-heading]]:hawa-text-muted-foreground [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:hawa-pt-0 [&_[cmdk-group]]:hawa-px-2 [&_[cmdk-input-wrapper]_svg]:hawa-h-5 [&_[cmdk-input-wrapper]_svg]:hawa-w-5 [&_[cmdk-input]]:hawa-h-12 [&_[cmdk-item]]:hawa-px-2 [&_[cmdk-item]]:hawa-py-3 [&_[cmdk-item]_svg]:hawa-h-5 [&_[cmdk-item]_svg]:hawa-w-5\">\n          {children}\n        </Command>\n      </DialogContent>\n    </Dialog>\n  );\n};\n\nconst CommandInput = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Input>,\n  CommandInputProps\n>(({ className, ...props }, ref) => (\n  <div\n    className=\"hawa-flex hawa-items-center hawa-border-b hawa-px-3\"\n    cmdk-input-wrapper=\"\"\n  >\n    <svg\n      aria-label=\"Search Icon\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"24\"\n      height=\"24\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      className=\"hawa-icon hawa-me-2 hawa-shrink-0 hawa-opacity-50\"\n    >\n      <circle cx=\"11\" cy=\"11\" r=\"8\" />\n      <path d=\"m21 21-4.3-4.3\" />\n    </svg>\n    <CommandPrimitive.Input\n      ref={ref}\n      className={cn(\n        \"hawa-flex hawa-h-11 hawa-w-full hawa-rounded-md hawa-bg-transparent hawa-py-3 hawa-text-sm hawa-outline-none placeholder:hawa-text-muted-foreground disabled:hawa-cursor-not-allowed disabled:hawa-opacity-50\",\n        className\n      )}\n      {...props}\n    />\n  </div>\n));\n\nCommandInput.displayName = CommandPrimitive.Input.displayName;\n\nconst CommandList = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.List>,\n  CommandListProps\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.List\n    ref={ref}\n    className={cn(\n      \"hawa-max-h-[300px] hawa-overflow-y-auto hawa-overflow-x-hidden\",\n      className\n    )}\n    {...props}\n  />\n));\n\nCommandList.displayName = CommandPrimitive.List.displayName;\n\nconst CommandEmpty = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Empty>,\n  CommandEmptyProps\n>((props, ref) => (\n  <CommandPrimitive.Empty\n    ref={ref}\n    className=\"hawa-py-6 hawa-text-center hawa-text-sm\"\n    {...props}\n  />\n));\n\nCommandEmpty.displayName = CommandPrimitive.Empty.displayName;\n\nconst CommandGroup = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Group>,\n  CommandGroupProps\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.Group\n    ref={ref}\n    className={cn(\n      \"hawa-overflow-hidden hawa-p-1 hawa-text-foreground [&_[cmdk-group-heading]]:hawa-px-2 [&_[cmdk-group-heading]]:hawa-py-1.5 [&_[cmdk-group-heading]]:hawa-text-xs [&_[cmdk-group-heading]]:hawa-font-medium [&_[cmdk-group-heading]]:hawa-text-muted-foreground\",\n      className\n    )}\n    {...props}\n  />\n));\n\nCommandGroup.displayName = CommandPrimitive.Group.displayName;\n\nconst CommandSeparator = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Separator>,\n  CommandSeparatorProps\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.Separator\n    ref={ref}\n    className={cn(\"hawa--mx-1 hawa-h-px hawa-bg-border\", className)}\n    {...props}\n  />\n));\nCommandSeparator.displayName = CommandPrimitive.Separator.displayName;\n\nconst CommandItem = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Item>,\n  CommandItemProps\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.Item\n    ref={ref}\n    className={cn(\n      \"hawa-relative hawa-flex hawa-cursor-default hawa-select-none hawa-items-center hawa-rounded-sm hawa-px-2 hawa-py-1.5 hawa-text-sm hawa-outline-none aria-selected:hawa-bg-accent aria-selected:hawa-text-accent-foreground data-[disabled]:hawa-pointer-events-none data-[disabled]:hawa-opacity-50\",\n      className\n    )}\n    {...props}\n  />\n));\n\nCommandItem.displayName = CommandPrimitive.Item.displayName;\n\nconst CommandShortcut = ({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLSpanElement> & CommandShortcutProps) => {\n  return (\n    <span\n      className={cn(\n        \"hawa-ml-auto hawa-text-xs hawa-tracking-widest hawa-text-muted-foreground\",\n        className\n      )}\n      {...props}\n    />\n  );\n};\nCommandShortcut.displayName = \"CommandShortcut\";\n\nexport {\n  Command,\n  CommandDialog,\n  CommandInput,\n  CommandList,\n  CommandEmpty,\n  CommandGroup,\n  CommandItem,\n  CommandShortcut,\n  CommandSeparator\n};\n","import * as React from \"react\";\n\nimport * as DialogPrimitive from \"@radix-ui/react-dialog\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\n\nconst Dialog = DialogPrimitive.Root;\n\nconst DialogTrigger = DialogPrimitive.Trigger;\n\nconst DialogPortal = ({ ...props }: DialogPrimitive.DialogPortalProps) => (\n  <DialogPrimitive.Portal {...props} />\n);\nconst DialogOverlay = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Overlay>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Overlay\n    ref={ref}\n    className={cn(\n      \"hawa-fixed hawa-inset-0 hawa-z-50 hawa-bg-background/80 hawa-backdrop-blur-sm data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0\",\n      className\n    )}\n    {...props}\n  />\n));\nconst DialogContent = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & {\n    persist?: boolean;\n    hideCloseButton?: boolean;\n  }\n>(({ className, children, persist, hideCloseButton, ...props }, ref) => (\n  <DialogPortal>\n    <DialogOverlay />\n    <DialogPrimitive.Content\n      onPointerDownOutside={(e) => {\n        if (persist) {\n          e.preventDefault();\n        }\n      }}\n      ref={ref}\n      className={cn(\n        \"hawa-fixed hawa-left-[50%] hawa-top-[50%] hawa-z-50 hawa-grid hawa-w-full hawa-max-w-lg hawa-translate-x-[-50%] hawa-translate-y-[-50%] hawa-gap-4 hawa-border hawa-bg-background hawa-p-6 hawa-shadow-lg hawa-transition-all hawa-duration-200 data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[state=closed]:hawa-slide-out-to-left-1/2 data-[state=closed]:hawa-slide-out-to-top-[48%] data-[state=open]:hawa-slide-in-from-left-1/2 data-[state=open]:hawa-slide-in-from-top-[48%] sm:hawa-rounded md:hawa-w-full\",\n        className\n      )}\n      {...props}\n    >\n      {children}\n      {!hideCloseButton && (\n        <DialogPrimitive.Close\n          className={cn(\n            \"hawa-absolute hawa-top-4 hawa-rounded hawa-opacity-70 hawa-ring-offset-background hawa-transition-opacity hover:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none data-[state=open]:hawa-bg-accent data-[state=open]:hawa-text-muted-foreground\",\n            props.dir === \"rtl\" ? \" hawa-left-4\" : \" hawa-right-4\"\n          )}\n        >\n          <svg\n            aria-label=\"Close Icon\"\n            aria-hidden=\"true\"\n            className=\"hawa-h-5 hawa-w-5\"\n            fill=\"currentColor\"\n            viewBox=\"0 0 20 20\"\n          >\n            <path\n              fillRule=\"evenodd\"\n              d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\"\n              clipRule=\"evenodd\"\n            ></path>\n          </svg>\n          <span className=\"hawa-sr-only\">Close</span>\n        </DialogPrimitive.Close>\n      )}\n    </DialogPrimitive.Content>\n  </DialogPortal>\n));\n\nconst DialogCarouselContent = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & {\n    hideCloseButton?: boolean;\n    hidePrevButton?: boolean;\n    persist?: boolean;\n    onPrev?: () => void;\n  }\n>(\n  (\n    {\n      className,\n      children,\n      onPrev,\n      persist,\n      hideCloseButton,\n      hidePrevButton,\n      ...props\n    },\n    ref\n  ) => (\n    <DialogPortal>\n      <DialogOverlay />\n      <DialogPrimitive.Content\n        onPointerDownOutside={(e) => {\n          if (persist) {\n            e.preventDefault();\n          }\n        }}\n        ref={ref}\n        className={cn(\n          \"hawa-fixed hawa-left-[50%] hawa-top-[50%] hawa-z-50 hawa-grid hawa-w-full hawa-max-w-lg hawa-translate-x-[-50%] hawa-translate-y-[-50%] hawa-gap-4 hawa-border hawa-bg-background hawa-p-6 hawa-pt-14 hawa-shadow-lg hawa-transition-all hawa-duration-200 data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[state=closed]:hawa-slide-out-to-left-1/2 data-[state=closed]:hawa-slide-out-to-top-[48%] data-[state=open]:hawa-slide-in-from-left-1/2 data-[state=open]:hawa-slide-in-from-top-[48%] sm:hawa-rounded md:hawa-w-full\",\n          className\n        )}\n        {...props}\n      >\n        {children}\n        <div\n          className={cn(\n            \"hawa-absolute hawa-top-0 hawa-flex hawa-w-full hawa-flex-row hawa-p-4\",\n            onPrev ? \"hawa-justify-between\" : \"hawa-justify-end\"\n          )}\n        >\n          {hidePrevButton ? (\n            <div />\n          ) : (\n            <div\n              onClick={onPrev}\n              className={cn(\n                \"hawa-end-0 hawa-cursor-pointer hawa-rounded hawa-opacity-70 hawa-ring-offset-background hawa-transition-opacity hover:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none data-[state=open]:hawa-bg-accent data-[state=open]:hawa-text-muted-foreground\",\n                props.dir === \"rtl\" && \"hawa-rotate-180\"\n              )}\n            >\n              <svg\n                xmlns=\"http://www.w3.org/2000/svg\"\n                width=\"24\"\n                height=\"24\"\n                viewBox=\"0 0 24 24\"\n                fill=\"none\"\n                className=\"hawa-h-6 hawa-w-6\"\n                stroke=\"currentColor\"\n                strokeWidth=\"2\"\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n              >\n                <path d=\"m15 18-6-6 6-6\" />\n              </svg>\n            </div>\n          )}\n          {!hideCloseButton && (\n            <DialogPrimitive.Close\n              className={cn(\n                \"hawa-end-0 hawa-rounded hawa-opacity-70 hawa-ring-offset-background hawa-transition-opacity hover:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none data-[state=open]:hawa-bg-accent data-[state=open]:hawa-text-muted-foreground \",\n                props.dir === \"rtl\" ? \" hawa-left-4\" : \" hawa-right-4\"\n              )}\n            >\n              <svg\n                aria-label=\"Close Icon\"\n                aria-hidden=\"true\"\n                className=\"hawa-h-6 hawa-w-6\"\n                fill=\"currentColor\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fillRule=\"evenodd\"\n                  d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\"\n                  clipRule=\"evenodd\"\n                ></path>\n              </svg>\n              <span className=\"hawa-sr-only\">Close</span>\n            </DialogPrimitive.Close>\n          )}\n        </div>\n      </DialogPrimitive.Content>\n    </DialogPortal>\n  )\n);\n\nconst DialogHeader = ({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n  <div\n    className={cn(\n      \"hawa-flex hawa-flex-col hawa-space-y-1.5 hawa-text-center sm:hawa-text-left\",\n      className\n    )}\n    {...props}\n  />\n);\nconst DialogTitle = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Title>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Title\n    ref={ref}\n    className={cn(\n      \"hawa-text-start hawa-text-lg hawa-font-semibold hawa-leading-none hawa-tracking-tight\",\n      className\n    )}\n    {...props}\n  />\n));\nconst DialogDescription = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Description>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Description\n    ref={ref}\n    className={cn(\n      \"hawa-text-start hawa-text-sm hawa-text-muted-foreground\",\n      className\n    )}\n    {...props}\n  />\n));\nconst DialogFooter = ({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n  <div\n    className={cn(\n      \"hawa-flex hawa-flex-col-reverse sm:hawa-flex-row sm:hawa-justify-end sm:hawa-gap-2\",\n      className\n    )}\n    {...props}\n  />\n);\ninterface DialogCarouselProps {\n  children: React.ReactNode;\n  stepsApi?: any;\n  stepsRef?: any;\n  direction?: DirectionType;\n}\nconst DialogCarousel: React.FC<DialogCarouselProps> = ({\n  stepsApi,\n  stepsRef,\n  children,\n  direction\n}) => {\n  React.useEffect(() => {\n    if (stepsApi) {\n      stepsApi.reInit();\n    }\n  }, [stepsApi, children]);\n  return (\n    <div className=\"hawa-overflow-hidden\">\n      <div ref={stepsRef} dir={direction}>\n        <div\n          className=\"hawa-flex\"\n          style={{\n            transition: \"height 0.2s\"\n          }}\n        >\n          {React.Children.map(children, (child, index) => (\n            <div\n              className={cn(\n                \"hawa-flex hawa-h-fit hawa-flex-[0_0_100%] hawa-items-center hawa-justify-center\"\n              )}\n              key={index}\n            >\n              {child}\n            </div>\n          ))}\n        </div>\n      </div>\n    </div>\n  );\n};\ninterface DialogStepsProps {\n  currentStep: string;\n  // TODO: update this name\n  visibleStepRef: React.RefObject<HTMLDivElement>;\n  children: React.ReactNode;\n}\nconst DialogSteps: React.FC<DialogStepsProps> = ({\n  currentStep,\n  visibleStepRef,\n  children\n}) => {\n  const [dialogHeight, setDialogHeight] = React.useState<any>(null);\n  React.useEffect(() => {\n    if (visibleStepRef.current) {\n      setDialogHeight(visibleStepRef.current.offsetHeight);\n      console.log(\"height is \", visibleStepRef.current.offsetHeight);\n    }\n  }, [currentStep, visibleStepRef]);\n\n  return (\n    <div\n      className=\"hawa-relative hawa-overflow-clip\"\n      style={{\n        height: dialogHeight || \"fit-content\",\n        transition: \"height 0.2s\"\n      }}\n    >\n      {React.Children.map(children, (child, index) => (\n        <div\n          ref={currentStep === `step-${index + 1}` ? visibleStepRef : null}\n          className={cn(\n            currentStep === `step-${index + 1}`\n              ? \"hawa-visible hawa-block\"\n              : \"hawa-invisible hawa-hidden\"\n          )}\n        >\n          {child}\n        </div>\n      ))}\n    </div>\n  );\n};\ninterface DialogStepProps {\n  id: string;\n  children: React.ReactNode;\n  className?: string;\n  stepRef?: any;\n}\nconst DialogStep: React.FC<DialogStepProps> = ({\n  id,\n  children,\n  className,\n  stepRef\n}) => {\n  return (\n    <div\n      id={id}\n      ref={stepRef}\n      className={cn(\"hawa-w-full  hawa-px-1\", className)}\n    >\n      {children}\n    </div>\n  );\n};\ninterface DialogBodyProps {\n  children: React.ReactNode;\n  className?: string;\n}\nconst DialogBody: React.FC<DialogBodyProps> = ({ children, className }) => {\n  return <div className={cn(\"hawa-py-6\", className)}>{children}</div>;\n};\n\nDialogBody.displayName = \"DialogBody\";\nDialogStep.displayName = \"DialogStep\";\nDialogSteps.displayName = \"DialogSteps\";\nDialogCarousel.displayName = \"DialogCarousel\";\nDialogCarouselContent.displayName = \"DialogCarouselContent\";\nDialogHeader.displayName = \"DialogHeader\";\nDialogFooter.displayName = \"DialogFooter\";\nDialogTitle.displayName = DialogPrimitive.Title.displayName;\nDialogPortal.displayName = DialogPrimitive.Portal.displayName;\nDialogOverlay.displayName = DialogPrimitive.Overlay.displayName;\nDialogContent.displayName = DialogPrimitive.Content.displayName;\nDialogDescription.displayName = DialogPrimitive.Description.displayName;\n\nexport {\n  Dialog,\n  DialogPortal,\n  DialogTrigger,\n  DialogContent,\n  DialogHeader,\n  DialogFooter,\n  DialogTitle,\n  DialogCarousel,\n  DialogCarouselContent,\n  DialogSteps,\n  DialogStep,\n  DialogBody,\n  DialogDescription\n};\n"],"mappings":"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","names":["React","PopoverPrimitive","React","React","React","import_react","React","React","React","CommandPrimitive","CommandPrimitive","open"]}
+{"version":3,"sources":["../../elements/combobox/index.ts","../../elements/combobox/Combobox.tsx","../../elements/label/Label.tsx","../../util/index.ts","../../elements/tooltip/Tooltip.tsx","../../elements/popover/Popover.tsx","../../elements/skeleton/Skeleton.tsx","../../elements/command/Command.tsx","../../elements/dialog/Dialog.tsx"],"sourcesContent":["export * from \"./Combobox\";\n","import * as React from \"react\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\nimport * as PopoverPrimitive from \"@radix-ui/react-popover\";\n\nimport { Label, LabelProps } from \"../label\";\nimport { PopoverContent, PopoverTrigger } from \"../popover\";\nimport { Skeleton } from \"../skeleton\";\n\nimport { cn } from \"@util/index\";\nimport {\n  Command,\n  CommandEmpty,\n  CommandGroup,\n  CommandInput,\n  CommandItem\n} from \"../command\";\n\ntype ComboboxTypes<T> = {\n  labelKey?: keyof T;\n  valueKey?: keyof T;\n  data: T[];\n  width?: string;\n  texts?: {\n    noItems?: string;\n    placeholder?: string;\n    searchPlaceholder?: string;\n  };\n  isLoading?: boolean;\n  helperText?: string;\n  popoverClassName?: string;\n  /** This the same value as the one with the key valueKey */\n  defaultValue?: string;\n  preview?: boolean;\n  hideInput?: boolean;\n  direction?: DirectionType;\n  id?: string;\n  /** The label of the input field   */\n  label?: any;\n  labelProps?: LabelProps;\n  /** If true, it will show a red asterisk next to the label*/\n  isRequired?: boolean;\n  onChange?: (e: any) => void;\n};\n\nexport const Combobox = React.forwardRef<HTMLDivElement, ComboboxTypes<any>>(\n  (\n    {\n      labelKey = \"label\",\n      valueKey = \"value\",\n      defaultValue = \"\",\n      popoverClassName,\n      direction,\n      labelProps,\n      data,\n      ...props\n    },\n    ref\n  ) => {\n    const [open, setOpen] = React.useState(false);\n    const [value, setValue] = React.useState(defaultValue);\n    function getProperty<T, K extends keyof T>(obj: T, key: K): T[K] {\n      return obj[key];\n    }\n    const handleOpenChange = (open: boolean) => {\n      if (!(props.isLoading || props.preview)) {\n        setOpen(open);\n      }\n    };\n    return (\n      <div\n        className={cn(\n          \"hawa-relative hawa-flex hawa-h-fit hawa-flex-col hawa-gap-2\",\n          props.width === \"fit\" ? \"hawa-w-fit\" : \"hawa-w-full\"\n        )}\n      >\n        {props.label && <Label {...labelProps}>{props.label}</Label>}\n\n        <PopoverPrimitive.Root open={open} onOpenChange={handleOpenChange}>\n          <PopoverTrigger asChild>\n            {props.isLoading ? (\n              <div className=\"hawa-pb-2\">\n                <Skeleton className=\"hawa-h-[40px] hawa-w-full\" />\n              </div>\n            ) : (\n              <div className=\"hawa-flex hawa-flex-col hawa-items-start hawa-gap-2 \">\n                <div\n                  className={cn(\n                    \"hawa-absolute hawa-top-[22px] hawa-h-[0.8px] hawa-w-full hawa-bg-gray-200 hawa-transition-all dark:hawa-bg-gray-800\",\n                    props.preview ? \"hawa-opacity-100\" : \"hawa-opacity-0\"\n                  )}\n                ></div>\n                <button\n                  role=\"combobox\"\n                  type=\"button\"\n                  aria-expanded={open}\n                  className={cn(\n                    \"hawa-inline-flex hawa-h-10 hawa-w-full hawa-select-none hawa-items-center hawa-justify-between hawa-rounded-md hawa-border hawa-py-2 hawa-text-sm hawa-font-normal  hawa-ring-offset-background  hawa-transition-all  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\",\n                    props.preview\n                      ? \"hawa-cursor-default hawa-rounded-none hawa-border-transparent hawa-px-0\"\n                      : \"hawa-bg-background hawa-px-3 \"\n                  )}\n                >\n                  {value\n                    ? getProperty(\n                        data.find((item: any) => item[valueKey] === value) ||\n                          {},\n                        labelKey\n                      )\n                    : props.texts?.placeholder || \". . .\"}\n                  <svg\n                    xmlns=\"http://www.w3.org/2000/svg\"\n                    className={cn(\n                      \"hawa-icon hawa-transition-all\",\n                      !props.preview\n                        ? \"hawa-visible hawa-opacity-100\"\n                        : \"hawa-invisible hawa-opacity-0\"\n                    )}\n                    aria-label=\"Chevron down icon\"\n                    viewBox=\"0 0 24 24\"\n                    fill=\"none\"\n                    stroke=\"currentColor\"\n                    strokeWidth=\"2\"\n                    strokeLinecap=\"round\"\n                    strokeLinejoin=\"round\"\n                  >\n                    <path d=\"m6 9 6 6 6-6\" />\n                  </svg>\n                </button>\n                <p\n                  className={cn(\n                    \"hawa-my-0 hawa-text-start hawa-text-xs hawa-text-helper-color hawa-transition-all\",\n                    props.helperText\n                      ? \"hawa-h-4 hawa-opacity-100\"\n                      : \"hawa-h-0 hawa-opacity-0\"\n                  )}\n                >\n                  {props.helperText}\n                </p>\n              </div>\n            )}\n          </PopoverTrigger>\n          <PopoverContent\n            sideOffset={0}\n            className={cn(\"popover-w-parent\", props.helperText && \"-hawa-mt-4\")}\n            dir={direction}\n          >\n            <Command>\n              {!props.hideInput && (\n                <CommandInput\n                  dir={direction}\n                  placeholder={props.texts?.searchPlaceholder || \"Search\"}\n                />\n              )}\n              <CommandEmpty>\n                {props.texts?.noItems || \"No items found.\"}\n              </CommandEmpty>\n              <CommandGroup className=\"hawa-max-h-[200px] hawa-overflow-y-auto\">\n                {data.map((item: any, i) => (\n                  <CommandItem\n                    key={i}\n                    onSelect={() => {\n                      const newValue = getProperty(item, valueKey);\n                      setValue(newValue === value ? \"\" : (newValue as string));\n                      if (props.onChange) {\n                        props.onChange(\n                          newValue === value ? \"\" : (newValue as string)\n                        );\n                      }\n                      setOpen(false);\n                    }}\n                  >\n                    <svg\n                      aria-label=\"Check Icon\"\n                      xmlns=\"http://www.w3.org/2000/svg\"\n                      width=\"24\"\n                      height=\"24\"\n                      viewBox=\"0 0 24 24\"\n                      fill=\"none\"\n                      stroke=\"currentColor\"\n                      strokeWidth=\"2\"\n                      strokeLinecap=\"round\"\n                      strokeLinejoin=\"round\"\n                      className={cn(\n                        \"hawa-icon\",\n                        value === getProperty(item, valueKey)\n                          ? \"hawa-opacity-100\"\n                          : \"hawa-opacity-0\"\n                      )}\n                      style={{ marginInlineEnd: \"0.5rem\" }}\n                    >\n                      <polyline points=\"20 6 9 17 4 12\" />\n                    </svg>\n                    {getProperty(item, labelKey)}\n                  </CommandItem>\n                ))}\n              </CommandGroup>\n            </Command>\n          </PopoverContent>\n        </PopoverPrimitive.Root>\n      </div>\n    );\n  }\n);\n","import * as React from \"react\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\nimport { Tooltip } from \"../tooltip\";\n\nexport type LabelProps = {\n  hint?: React.ReactNode;\n  hintSide?: PositionType;\n  htmlFor?: string;\n  required?: boolean;\n};\n\nconst Label = React.forwardRef<\n  HTMLLabelElement,\n  React.LabelHTMLAttributes<HTMLLabelElement> & LabelProps\n>(({ className, hint, hintSide, required, children, ...props }, ref) => (\n  <div className=\"hawa-flex hawa-flex-row hawa-items-center hawa-gap-1 hawa-transition-all\">\n    <label\n      ref={ref}\n      className={cn(\n        \"hawa-text-sm hawa-font-medium hawa-leading-none peer-disabled:hawa-cursor-not-allowed peer-disabled:hawa-opacity-70\",\n        className\n      )}\n      {...props}\n    >\n      {children}\n      {required && <span className=\"hawa-mx-0.5 hawa-text-red-500\">*</span>}\n    </label>\n    {hint && (\n      <Tooltip\n        content={hint}\n        side={hintSide}\n        triggerProps={{\n          tabIndex: -1,\n          onClick: (event) => event.preventDefault()\n        }}\n      >\n        <div>\n          <svg\n            xmlns=\"http://www.w3.org/2000/svg\"\n            className=\"hawa-h-[14px] hawa-w-[14px] hawa-cursor-help\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            strokeWidth=\"2\"\n            strokeLinecap=\"round\"\n            strokeLinejoin=\"round\"\n          >\n            <circle cx=\"12\" cy=\"12\" r=\"10\" />\n            <path d=\"M9.09 9a3 3 0 0 1 5.83 1c0 2-3 3-3 3\" />\n            <path d=\"M12 17h.01\" />\n          </svg>\n        </div>\n      </Tooltip>\n    )}\n  </div>\n));\n\nLabel.displayName = \"Label\";\n\nexport { Label };\n","import { clsx, type ClassValue } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n\ntype Palette = {\n  name: string;\n  colors: {\n    [key: number]: string;\n  };\n};\ntype Rgb = {\n  r: number;\n  g: number;\n  b: number;\n};\nfunction hexToRgb(hex: string): Rgb | null {\n  const sanitizedHex = hex.replaceAll(\"##\", \"#\");\n  const colorParts = /^#?([a-f\\d]{2})([a-f\\d]{2})([a-f\\d]{2})$/i.exec(\n    sanitizedHex\n  );\n\n  if (!colorParts) {\n    return null;\n  }\n\n  const [, r, g, b] = colorParts;\n\n  return {\n    r: parseInt(r, 16),\n    g: parseInt(g, 16),\n    b: parseInt(b, 16)\n  } as Rgb;\n}\n\nfunction rgbToHex(r: number, g: number, b: number): string {\n  const toHex = (c: number) => `0${c.toString(16)}`.slice(-2);\n  return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport function getTextColor(color: string): \"#FFF\" | \"#333\" {\n  const rgbColor = hexToRgb(color);\n\n  if (!rgbColor) {\n    return \"#333\";\n  }\n\n  const { r, g, b } = rgbColor;\n  const luma = 0.2126 * r + 0.7152 * g + 0.0722 * b;\n\n  return luma < 120 ? \"#FFF\" : \"#333\";\n}\n\nfunction lighten(hex: string, intensity: number): string {\n  const color = hexToRgb(`#${hex}`);\n\n  if (!color) {\n    return \"\";\n  }\n\n  const r = Math.round(color.r + (255 - color.r) * intensity);\n  const g = Math.round(color.g + (255 - color.g) * intensity);\n  const b = Math.round(color.b + (255 - color.b) * intensity);\n\n  return rgbToHex(r, g, b);\n}\n\nfunction darken(hex: string, intensity: number): string {\n  const color = hexToRgb(hex);\n\n  if (!color) {\n    return \"\";\n  }\n\n  const r = Math.round(color.r * intensity);\n  const g = Math.round(color.g * intensity);\n  const b = Math.round(color.b * intensity);\n\n  return rgbToHex(r, g, b);\n}\nconst parseColor = (color: any) => {\n  if (color.startsWith(\"#\")) {\n    // Convert hex to RGB\n    let r = parseInt(color.slice(1, 3), 16);\n    let g = parseInt(color.slice(3, 5), 16);\n    let b = parseInt(color.slice(5, 7), 16);\n    return [r, g, b];\n  } else if (color.startsWith(\"rgb\")) {\n    // Extract RGB values from rgb() format\n    return color.match(/\\d+/g).map(Number);\n  }\n  // Default to white if format is unrecognized\n  return [255, 255, 255];\n};\nexport const calculateLuminance = (color: any) => {\n  const [r, g, b] = parseColor(color)?.map((c: any) => {\n    c /= 255;\n    return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;\n  });\n  return 0.2126 * r + 0.7152 * g + 0.0722 * b;\n};\n\nfunction getPallette(baseColor: string): Palette {\n  const name = baseColor;\n\n  const response: Palette = {\n    name,\n    colors: {\n      500: `#${baseColor}`.replace(\"##\", \"#\")\n    }\n  };\n\n  const intensityMap: {\n    [key: number]: number;\n  } = {\n    50: 0.95,\n    100: 0.9,\n    200: 0.75,\n    300: 0.6,\n    400: 0.3,\n    600: 0.9,\n    700: 0.75,\n    800: 0.6,\n    900: 0.49\n  };\n\n  [50, 100, 200, 300, 400].forEach((level) => {\n    response.colors[level] = lighten(baseColor, intensityMap[level]);\n  });\n  [600, 700, 800, 900].forEach((level) => {\n    response.colors[level] = darken(baseColor, intensityMap[level]);\n  });\n\n  return response as Palette;\n}\n\nexport { getPallette };\n\n// const hexToRgb = (hex) => {\n//   let d = hex?.split(\"#\")[1];\n//   var aRgbHex = d?.match(/.{1,2}/g);\n//   var aRgb = [\n//     parseInt(aRgbHex[0], 16),\n//     parseInt(aRgbHex[1], 16),\n//     parseInt(aRgbHex[2], 16)\n//   ];\n//   return aRgb;\n// };\n// const getTextColor = (backColor) => {\n//   let rgbArray = hexToRgb(backColor);\n//   if (rgbArray[0] * 0.299 + rgbArray[1] * 0.587 + rgbArray[2] * 0.114 > 186) {\n//     return \"#000000\";\n//   } else {\n//     return \"#ffffff\";\n//   }\n// };\n// const replaceAt = function (string, index, replacement) {\n//   // if (replacement == \"\" || replacement == \" \") {\n//   //   return (\n//   //     string.substring(0, index) +\n//   //     string.substring(index + replacement.length )\n//   //   );\n//   // }\n//   const replaced = string.substring(0, index) + replacement + string.substring(index + 1)\n//   return replaced\n// };\n\n// export { hexToRgb, getTextColor, replaceAt };\n","import React from \"react\";\n\nimport * as TooltipPrimitive from \"@radix-ui/react-tooltip\";\nimport { cn } from \"@util/index\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\nconst TooltipContent = React.forwardRef<\n  React.ElementRef<typeof TooltipPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content> & {\n    size?: \"default\" | \"small\" | \"large\";\n  }\n>(({ className, sideOffset = 4, size = \"default\", ...props }, ref) => (\n  <TooltipPrimitive.Content\n    ref={ref}\n    sideOffset={sideOffset}\n    className={cn(\n      \"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\",\n      {\n        \"hawa-text-xs\": size === \"small\",\n        \"hawa-text-xl\": size === \"large\"\n      },\n      className\n    )}\n    {...props}\n  />\n));\nTooltipContent.displayName = TooltipPrimitive.Content.displayName;\n\nconst TooltipArrow = React.forwardRef<\n  React.ElementRef<typeof TooltipPrimitive.Arrow>,\n  React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Arrow>\n>(({ className, ...props }, ref) => (\n  <TooltipPrimitive.Arrow ref={ref} className={cn(className)} {...props} />\n));\nTooltipArrow.displayName = TooltipPrimitive.Arrow.displayName;\n\ntype TooltipTypes = {\n  /** Controls the open state of the tooltip. */\n  open?: any;\n  /** Specifies the side where the tooltip will appear. */\n  side?: PositionType;\n  /** Content to be displayed within the tooltip. */\n  content?: any;\n  /** Elements to which the tooltip is anchored. */\n  children?: any;\n  /** Sets the default open state of the tooltip. */\n  defaultOpen?: any;\n  /** Event handler for open state changes. */\n  onOpenChange?: any;\n  /** Duration of the delay before the tooltip appears. */\n  delayDuration?: any;\n  /** Size of the tooltip. */\n  size?: \"default\" | \"small\" | \"large\";\n  triggerProps?: TooltipPrimitive.TooltipTriggerProps;\n  contentProps?: TooltipPrimitive.TooltipContentProps;\n  providerProps?: TooltipPrimitive.TooltipProviderProps;\n};\n\nconst Tooltip: React.FunctionComponent<TooltipTypes> = ({\n  side,\n  size,\n  open,\n  content,\n  children,\n  defaultOpen,\n  onOpenChange,\n  triggerProps,\n  contentProps,\n  providerProps,\n  delayDuration = 300,\n  ...props\n}) => {\n  return (\n    <TooltipPrimitive.TooltipProvider\n      delayDuration={delayDuration}\n      {...providerProps}\n    >\n      <TooltipPrimitive.Root\n        open={open}\n        defaultOpen={defaultOpen}\n        onOpenChange={onOpenChange}\n        {...props}\n      >\n        <TooltipPrimitive.Trigger {...triggerProps}>\n          {children}\n        </TooltipPrimitive.Trigger>\n        <TooltipContent\n          size={size}\n          side={side}\n          align=\"center\"\n          {...contentProps}\n        >\n          {content}\n        </TooltipContent>\n      </TooltipPrimitive.Root>\n    </TooltipPrimitive.TooltipProvider>\n  );\n};\n\nexport { Tooltip };\n","import * as React from \"react\";\n\nimport * as PopoverPrimitive from \"@radix-ui/react-popover\";\n\nimport { PositionType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\n\nconst PopoverContent = React.forwardRef<\n  React.ElementRef<typeof PopoverPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof PopoverPrimitive.Content>\n>(({ className, align = \"center\", sideOffset = 4, ...props }, ref) => (\n  <PopoverPrimitive.Portal>\n    <PopoverPrimitive.Content\n      ref={ref}\n      align={align}\n      sideOffset={sideOffset}\n      className={cn(\n        \"dark:dark-shadow hawa-z-50 hawa-rounded hawa-border hawa-bg-popover hawa-text-popover-foreground hawa-shadow-md hawa-outline-none data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-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\",\n        className\n      )}\n      {...props}\n    />\n  </PopoverPrimitive.Portal>\n));\nPopoverContent.displayName = PopoverPrimitive.Content.displayName;\n\ninterface PopoverProps {\n  side?: PositionType;\n  align?: \"start\" | \"center\" | \"end\";\n  trigger?: React.ReactNode;\n  children: React.ReactNode;\n  className?: string;\n  sideOffset?: number;\n  disableTrigger?: any;\n  width?: \"trigger\" | \"default\";\n  open?: boolean;\n  contentProps?: PopoverPrimitive.PopoverContentProps;\n  triggerProps?: PopoverPrimitive.PopoverTriggerProps;\n}\n\ntype HawaPopoverTypes = PopoverProps &\n  React.ComponentProps<typeof PopoverPrimitive.Root>;\n\nconst Popover: React.FC<HawaPopoverTypes> = ({\n  trigger,\n  children,\n  className,\n  align = \"center\",\n  side,\n  sideOffset = 4,\n  open,\n  width = \"default\",\n  disableTrigger,\n  contentProps,\n  triggerProps,\n  ...props\n}) => {\n  let widthStyles = {\n    trigger: \"var(--radix-popover-trigger-width)\",\n    default: \"auto\"\n  };\n\n  return (\n    <PopoverPrimitive.Root open={open} {...props}>\n      <PopoverPrimitive.Trigger\n        className=\"hawa-w-full\"\n        disabled={disableTrigger}\n        {...triggerProps}\n      >\n        {trigger}\n      </PopoverPrimitive.Trigger>\n      <PopoverContent\n        side={side}\n        className={className}\n        align={align}\n        sideOffset={sideOffset}\n        style={{\n          width: widthStyles[width]\n        }}\n        {...contentProps}\n      >\n        {children}\n      </PopoverContent>\n    </PopoverPrimitive.Root>\n  );\n};\n\nconst PopoverTrigger = PopoverPrimitive.Trigger;\nexport { Popover, PopoverContent, PopoverTrigger };\n","import React from \"react\";\n\nimport { cn } from \"@util/index\";\n\ninterface SkeletonProps extends React.HTMLAttributes<HTMLDivElement> {\n  className?: string;\n  animation?: \"none\" | \"pulse\" | \"shimmer\";\n  content?: any;\n  fade?: \"top\" | \"bottom\" | \"left\" | \"right\";\n}\n\nfunction Skeleton({\n  className,\n  content,\n  animation = \"pulse\",\n  fade,\n  ...props\n}: SkeletonProps) {\n  const animationStyles = {\n    none: \"hawa-rounded hawa-bg-muted\",\n    pulse: \"hawa-animate-pulse hawa-rounded hawa-bg-muted\",\n    shimmer:\n      \"hawa-space-y-5 hawa-rounded hawa-bg-muted  hawa-p-4 hawa-relative  before:hawa-absolute before:hawa-inset-0 before:hawa--translate-x-full before:hawa-animate-[shimmer_2s_infinite] before:hawa-bg-gradient-to-r before:hawa-from-transparent before:hawa-via-gray-300/40 dark:before:hawa-via-white/10 before:hawa-to-transparent hawa-isolate hawa-overflow-hidden  before:hawa-border-t before:hawa-border-rose-100/10\"\n  };\n  const fadeStyle = `[mask-image:linear-gradient(to_${fade},#D1D4DC_50%,transparent_100%)]`;\n\n  return (\n    <div\n      className={cn(\n        animationStyles[animation],\n        content &&\n          \"hawa-flex hawa-flex-col hawa-items-center hawa-justify-center\",\n        fade && fadeStyle,\n        className\n      )}\n      {...props}\n    >\n      {content && content}\n    </div>\n  );\n}\n\nexport { Skeleton };\n","import * as React from \"react\";\n\nimport { DialogProps } from \"@radix-ui/react-dialog\";\nimport { cn } from \"@util/index\";\nimport { Command as CommandPrimitive } from \"cmdk\";\n\nimport { Dialog, DialogContent } from \"../dialog\";\n\ntype CommandProps = React.ComponentPropsWithoutRef<typeof CommandPrimitive>;\ninterface CommandDialogProps extends DialogProps {}\ninterface CommandInputProps\n  extends React.ComponentPropsWithoutRef<typeof CommandPrimitive.Input> {}\ninterface CommandListProps\n  extends React.ComponentPropsWithoutRef<typeof CommandPrimitive.List> {}\ninterface CommandEmptyProps\n  extends React.ComponentPropsWithoutRef<typeof CommandPrimitive.Empty> {}\ninterface CommandGroupProps\n  extends React.ComponentPropsWithoutRef<typeof CommandPrimitive.Group> {}\ninterface CommandSeparatorProps\n  extends React.ComponentPropsWithoutRef<typeof CommandPrimitive.Separator> {}\ninterface CommandItemProps\n  extends React.ComponentPropsWithoutRef<typeof CommandPrimitive.Item> {}\ninterface CommandShortcutProps extends React.HTMLAttributes<HTMLSpanElement> {}\n\nconst Command: React.ForwardRefExoticComponent<\n  CommandProps & React.RefAttributes<React.ElementRef<typeof CommandPrimitive>>\n> = React.forwardRef(({ className, ...props }, ref) => (\n  <CommandPrimitive\n    ref={ref}\n    className={cn(\n      \"hawa-flex hawa-h-full hawa-w-full hawa-flex-col hawa-overflow-hidden hawa-rounded-md hawa-bg-popover hawa-text-popover-foreground\",\n      className\n    )}\n    {...props}\n  />\n));\nCommand.displayName = CommandPrimitive.displayName;\n\nconst CommandDialog = ({ children, ...props }: CommandDialogProps) => {\n  return (\n    <Dialog {...props}>\n      <DialogContent className=\"hawa-overflow-hidden hawa-p-0 hawa-shadow-lg\">\n        <Command className=\"[&_[cmdk-group-heading]]:hawa-px-2 [&_[cmdk-group-heading]]:hawa-font-medium [&_[cmdk-group-heading]]:hawa-text-muted-foreground [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:hawa-pt-0 [&_[cmdk-group]]:hawa-px-2 [&_[cmdk-input-wrapper]_svg]:hawa-h-5 [&_[cmdk-input-wrapper]_svg]:hawa-w-5 [&_[cmdk-input]]:hawa-h-12 [&_[cmdk-item]]:hawa-px-2 [&_[cmdk-item]]:hawa-py-3 [&_[cmdk-item]_svg]:hawa-h-5 [&_[cmdk-item]_svg]:hawa-w-5\">\n          {children}\n        </Command>\n      </DialogContent>\n    </Dialog>\n  );\n};\n\nconst CommandInput = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Input>,\n  CommandInputProps\n>(({ className, ...props }, ref) => (\n  <div\n    className=\"hawa-flex hawa-items-center hawa-border-b hawa-px-3\"\n    cmdk-input-wrapper=\"\"\n  >\n    <svg\n      aria-label=\"Search Icon\"\n      xmlns=\"http://www.w3.org/2000/svg\"\n      width=\"24\"\n      height=\"24\"\n      viewBox=\"0 0 24 24\"\n      fill=\"none\"\n      stroke=\"currentColor\"\n      strokeWidth=\"2\"\n      strokeLinecap=\"round\"\n      strokeLinejoin=\"round\"\n      className=\"hawa-icon hawa-me-2 hawa-shrink-0 hawa-opacity-50\"\n    >\n      <circle cx=\"11\" cy=\"11\" r=\"8\" />\n      <path d=\"m21 21-4.3-4.3\" />\n    </svg>\n    <CommandPrimitive.Input\n      ref={ref}\n      className={cn(\n        \"hawa-flex hawa-h-11 hawa-w-full hawa-rounded-md hawa-bg-transparent hawa-py-3 hawa-text-sm hawa-outline-none placeholder:hawa-text-muted-foreground disabled:hawa-cursor-not-allowed disabled:hawa-opacity-50\",\n        className\n      )}\n      {...props}\n    />\n  </div>\n));\n\nCommandInput.displayName = CommandPrimitive.Input.displayName;\n\nconst CommandList = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.List>,\n  CommandListProps\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.List\n    ref={ref}\n    className={cn(\n      \"hawa-max-h-[300px] hawa-overflow-y-auto hawa-overflow-x-hidden\",\n      className\n    )}\n    {...props}\n  />\n));\n\nCommandList.displayName = CommandPrimitive.List.displayName;\n\nconst CommandEmpty = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Empty>,\n  CommandEmptyProps\n>((props, ref) => (\n  <CommandPrimitive.Empty\n    ref={ref}\n    className=\"hawa-py-6 hawa-text-center hawa-text-sm\"\n    {...props}\n  />\n));\n\nCommandEmpty.displayName = CommandPrimitive.Empty.displayName;\n\nconst CommandGroup = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Group>,\n  CommandGroupProps\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.Group\n    ref={ref}\n    className={cn(\n      \"hawa-overflow-hidden hawa-p-1 hawa-text-foreground [&_[cmdk-group-heading]]:hawa-px-2 [&_[cmdk-group-heading]]:hawa-py-1.5 [&_[cmdk-group-heading]]:hawa-text-xs [&_[cmdk-group-heading]]:hawa-font-medium [&_[cmdk-group-heading]]:hawa-text-muted-foreground\",\n      className\n    )}\n    {...props}\n  />\n));\n\nCommandGroup.displayName = CommandPrimitive.Group.displayName;\n\nconst CommandSeparator = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Separator>,\n  CommandSeparatorProps\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.Separator\n    ref={ref}\n    className={cn(\"hawa--mx-1 hawa-h-px hawa-bg-border\", className)}\n    {...props}\n  />\n));\nCommandSeparator.displayName = CommandPrimitive.Separator.displayName;\n\nconst CommandItem = React.forwardRef<\n  React.ElementRef<typeof CommandPrimitive.Item>,\n  CommandItemProps\n>(({ className, ...props }, ref) => (\n  <CommandPrimitive.Item\n    ref={ref}\n    className={cn(\n      \"hawa-relative hawa-flex hawa-cursor-default hawa-select-none hawa-items-center hawa-rounded-sm hawa-px-2 hawa-py-1.5 hawa-text-sm hawa-outline-none aria-selected:hawa-bg-accent aria-selected:hawa-text-accent-foreground data-[disabled]:hawa-pointer-events-none data-[disabled]:hawa-opacity-50\",\n      className\n    )}\n    {...props}\n  />\n));\n\nCommandItem.displayName = CommandPrimitive.Item.displayName;\n\nconst CommandShortcut = ({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLSpanElement> & CommandShortcutProps) => {\n  return (\n    <span\n      className={cn(\n        \"hawa-ml-auto hawa-text-xs hawa-tracking-widest hawa-text-muted-foreground\",\n        className\n      )}\n      {...props}\n    />\n  );\n};\nCommandShortcut.displayName = \"CommandShortcut\";\n\nexport {\n  Command,\n  CommandDialog,\n  CommandInput,\n  CommandList,\n  CommandEmpty,\n  CommandGroup,\n  CommandItem,\n  CommandShortcut,\n  CommandSeparator\n};\n","import * as React from \"react\";\n\nimport * as DialogPrimitive from \"@radix-ui/react-dialog\";\n\nimport { DirectionType } from \"@_types/commonTypes\";\n\nimport { cn } from \"@util/index\";\n\nconst Dialog = DialogPrimitive.Root;\n\nconst DialogTrigger = DialogPrimitive.Trigger;\n\nconst DialogPortal = ({ ...props }: DialogPrimitive.DialogPortalProps) => (\n  <DialogPrimitive.Portal {...props} />\n);\nconst DialogOverlay = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Overlay>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Overlay\n    ref={ref}\n    className={cn(\n      \"hawa-fixed hawa-inset-0 hawa-z-50 hawa-bg-background/80 hawa-backdrop-blur-sm data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0\",\n      className\n    )}\n    {...props}\n  />\n));\nconst DialogContent = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & {\n    persist?: boolean;\n    hideCloseButton?: boolean;\n  }\n>(({ className, children, persist, hideCloseButton, ...props }, ref) => (\n  <DialogPortal>\n    <DialogOverlay />\n    <DialogPrimitive.Content\n      onPointerDownOutside={(e) => {\n        if (persist) {\n          e.preventDefault();\n        }\n      }}\n      ref={ref}\n      className={cn(\n        \"hawa-fixed hawa-left-[50%] hawa-top-[50%] hawa-z-50 hawa-grid hawa-w-full hawa-max-w-lg hawa-translate-x-[-50%] hawa-translate-y-[-50%] hawa-gap-4 hawa-border hawa-bg-background hawa-p-6 hawa-shadow-lg hawa-transition-all hawa-duration-200 data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[state=closed]:hawa-slide-out-to-left-1/2 data-[state=closed]:hawa-slide-out-to-top-[48%] data-[state=open]:hawa-slide-in-from-left-1/2 data-[state=open]:hawa-slide-in-from-top-[48%] sm:hawa-rounded md:hawa-w-full\",\n        className\n      )}\n      {...props}\n    >\n      {children}\n      {!hideCloseButton && (\n        <DialogPrimitive.Close\n          className={cn(\n            \"hawa-absolute hawa-top-4 hawa-rounded hawa-opacity-70 hawa-ring-offset-background hawa-transition-opacity hover:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none data-[state=open]:hawa-bg-accent data-[state=open]:hawa-text-muted-foreground\",\n            props.dir === \"rtl\" ? \" hawa-left-4\" : \" hawa-right-4\"\n          )}\n        >\n          <svg\n            aria-label=\"Close Icon\"\n            aria-hidden=\"true\"\n            className=\"hawa-h-5 hawa-w-5\"\n            fill=\"currentColor\"\n            viewBox=\"0 0 20 20\"\n          >\n            <path\n              fillRule=\"evenodd\"\n              d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\"\n              clipRule=\"evenodd\"\n            ></path>\n          </svg>\n          <span className=\"hawa-sr-only\">Close</span>\n        </DialogPrimitive.Close>\n      )}\n    </DialogPrimitive.Content>\n  </DialogPortal>\n));\n\nconst DialogCarouselContent = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Content>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content> & {\n    hideCloseButton?: boolean;\n    hidePrevButton?: boolean;\n    persist?: boolean;\n    onPrev?: () => void;\n  }\n>(\n  (\n    {\n      className,\n      children,\n      onPrev,\n      persist,\n      hideCloseButton,\n      hidePrevButton,\n      ...props\n    },\n    ref\n  ) => (\n    <DialogPortal>\n      <DialogOverlay />\n      <DialogPrimitive.Content\n        onPointerDownOutside={(e) => {\n          if (persist) {\n            e.preventDefault();\n          }\n        }}\n        ref={ref}\n        className={cn(\n          \"hawa-fixed hawa-left-[50%] hawa-top-[50%] hawa-z-50 hawa-grid hawa-w-full hawa-max-w-lg hawa-translate-x-[-50%] hawa-translate-y-[-50%] hawa-gap-4 hawa-border hawa-bg-background hawa-p-6 hawa-pt-14 hawa-shadow-lg hawa-transition-all hawa-duration-200 data-[state=open]:hawa-animate-in data-[state=closed]:hawa-animate-out data-[state=closed]:hawa-fade-out-0 data-[state=open]:hawa-fade-in-0 data-[state=closed]:hawa-zoom-out-95 data-[state=open]:hawa-zoom-in-95 data-[state=closed]:hawa-slide-out-to-left-1/2 data-[state=closed]:hawa-slide-out-to-top-[48%] data-[state=open]:hawa-slide-in-from-left-1/2 data-[state=open]:hawa-slide-in-from-top-[48%] sm:hawa-rounded md:hawa-w-full\",\n          className\n        )}\n        {...props}\n      >\n        {children}\n        <div\n          className={cn(\n            \"hawa-absolute hawa-top-0 hawa-flex hawa-w-full hawa-flex-row hawa-p-4\",\n            onPrev ? \"hawa-justify-between\" : \"hawa-justify-end\"\n          )}\n        >\n          {hidePrevButton ? (\n            <div />\n          ) : (\n            <div\n              onClick={onPrev}\n              className={cn(\n                \"hawa-end-0 hawa-cursor-pointer hawa-rounded hawa-opacity-70 hawa-ring-offset-background hawa-transition-opacity hover:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none data-[state=open]:hawa-bg-accent data-[state=open]:hawa-text-muted-foreground\",\n                props.dir === \"rtl\" && \"hawa-rotate-180\"\n              )}\n            >\n              <svg\n                xmlns=\"http://www.w3.org/2000/svg\"\n                width=\"24\"\n                height=\"24\"\n                viewBox=\"0 0 24 24\"\n                fill=\"none\"\n                className=\"hawa-h-6 hawa-w-6\"\n                stroke=\"currentColor\"\n                strokeWidth=\"2\"\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n              >\n                <path d=\"m15 18-6-6 6-6\" />\n              </svg>\n            </div>\n          )}\n          {!hideCloseButton && (\n            <DialogPrimitive.Close\n              className={cn(\n                \"hawa-end-0 hawa-rounded hawa-opacity-70 hawa-ring-offset-background hawa-transition-opacity hover:hawa-opacity-100 focus:hawa-outline-none focus:hawa-ring-2 focus:hawa-ring-ring focus:hawa-ring-offset-2 disabled:hawa-pointer-events-none data-[state=open]:hawa-bg-accent data-[state=open]:hawa-text-muted-foreground \",\n                props.dir === \"rtl\" ? \" hawa-left-4\" : \" hawa-right-4\"\n              )}\n            >\n              <svg\n                aria-label=\"Close Icon\"\n                aria-hidden=\"true\"\n                className=\"hawa-h-6 hawa-w-6\"\n                fill=\"currentColor\"\n                viewBox=\"0 0 20 20\"\n              >\n                <path\n                  fillRule=\"evenodd\"\n                  d=\"M4.293 4.293a1 1 0 011.414 0L10 8.586l4.293-4.293a1 1 0 111.414 1.414L11.414 10l4.293 4.293a1 1 0 01-1.414 1.414L10 11.414l-4.293 4.293a1 1 0 01-1.414-1.414L8.586 10 4.293 5.707a1 1 0 010-1.414z\"\n                  clipRule=\"evenodd\"\n                ></path>\n              </svg>\n              <span className=\"hawa-sr-only\">Close</span>\n            </DialogPrimitive.Close>\n          )}\n        </div>\n      </DialogPrimitive.Content>\n    </DialogPortal>\n  )\n);\n\nconst DialogHeader = ({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n  <div\n    className={cn(\n      \"hawa-flex hawa-flex-col hawa-space-y-1.5 hawa-text-center sm:hawa-text-left\",\n      className\n    )}\n    {...props}\n  />\n);\nconst DialogTitle = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Title>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Title\n    ref={ref}\n    className={cn(\n      \"hawa-text-start hawa-text-lg hawa-font-semibold hawa-leading-none hawa-tracking-tight\",\n      className\n    )}\n    {...props}\n  />\n));\nconst DialogDescription = React.forwardRef<\n  React.ElementRef<typeof DialogPrimitive.Description>,\n  React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>\n>(({ className, ...props }, ref) => (\n  <DialogPrimitive.Description\n    ref={ref}\n    className={cn(\n      \"hawa-text-start hawa-text-sm hawa-text-muted-foreground\",\n      className\n    )}\n    {...props}\n  />\n));\nconst DialogFooter = ({\n  className,\n  ...props\n}: React.HTMLAttributes<HTMLDivElement>) => (\n  <div\n    className={cn(\n      \"hawa-flex hawa-flex-col-reverse sm:hawa-flex-row sm:hawa-justify-end sm:hawa-gap-2\",\n      className\n    )}\n    {...props}\n  />\n);\ninterface DialogCarouselProps {\n  children: React.ReactNode;\n  stepsApi?: any;\n  stepsRef?: any;\n  direction?: DirectionType;\n}\nconst DialogCarousel: React.FC<DialogCarouselProps> = ({\n  stepsApi,\n  stepsRef,\n  children,\n  direction\n}) => {\n  React.useEffect(() => {\n    if (stepsApi) {\n      stepsApi.reInit();\n    }\n  }, [stepsApi, children]);\n  return (\n    <div className=\"hawa-overflow-hidden\">\n      <div ref={stepsRef} dir={direction}>\n        <div\n          className=\"hawa-flex\"\n          style={{\n            transition: \"height 0.2s\"\n          }}\n        >\n          {React.Children.map(children, (child, index) => (\n            <div\n              className={cn(\n                \"hawa-flex hawa-h-fit hawa-flex-[0_0_100%] hawa-items-center hawa-justify-center\"\n              )}\n              key={index}\n            >\n              {child}\n            </div>\n          ))}\n        </div>\n      </div>\n    </div>\n  );\n};\ninterface DialogStepsProps {\n  currentStep: string;\n  // TODO: update this name\n  visibleStepRef: React.RefObject<HTMLDivElement>;\n  children: React.ReactNode;\n}\nconst DialogSteps: React.FC<DialogStepsProps> = ({\n  currentStep,\n  visibleStepRef,\n  children\n}) => {\n  const [dialogHeight, setDialogHeight] = React.useState<any>(null);\n  React.useEffect(() => {\n    if (visibleStepRef.current) {\n      setDialogHeight(visibleStepRef.current.offsetHeight);\n      console.log(\"height is \", visibleStepRef.current.offsetHeight);\n    }\n  }, [currentStep, visibleStepRef]);\n\n  return (\n    <div\n      className=\"hawa-relative hawa-overflow-clip\"\n      style={{\n        height: dialogHeight || \"fit-content\",\n        transition: \"height 0.2s\"\n      }}\n    >\n      {React.Children.map(children, (child, index) => (\n        <div\n          ref={currentStep === `step-${index + 1}` ? visibleStepRef : null}\n          className={cn(\n            currentStep === `step-${index + 1}`\n              ? \"hawa-visible hawa-block\"\n              : \"hawa-invisible hawa-hidden\"\n          )}\n        >\n          {child}\n        </div>\n      ))}\n    </div>\n  );\n};\ninterface DialogStepProps {\n  id: string;\n  children: React.ReactNode;\n  className?: string;\n  stepRef?: any;\n}\nconst DialogStep: React.FC<DialogStepProps> = ({\n  id,\n  children,\n  className,\n  stepRef\n}) => {\n  return (\n    <div\n      id={id}\n      ref={stepRef}\n      className={cn(\"hawa-w-full  hawa-px-1\", className)}\n    >\n      {children}\n    </div>\n  );\n};\ninterface DialogBodyProps {\n  children: React.ReactNode;\n  className?: string;\n}\nconst DialogBody: React.FC<DialogBodyProps> = ({ children, className }) => {\n  return <div className={cn(\"hawa-py-6\", className)}>{children}</div>;\n};\n\nDialogBody.displayName = \"DialogBody\";\nDialogStep.displayName = \"DialogStep\";\nDialogSteps.displayName = \"DialogSteps\";\nDialogCarousel.displayName = \"DialogCarousel\";\nDialogCarouselContent.displayName = \"DialogCarouselContent\";\nDialogHeader.displayName = \"DialogHeader\";\nDialogFooter.displayName = \"DialogFooter\";\nDialogTitle.displayName = DialogPrimitive.Title.displayName;\nDialogPortal.displayName = DialogPrimitive.Portal.displayName;\nDialogOverlay.displayName = DialogPrimitive.Overlay.displayName;\nDialogContent.displayName = DialogPrimitive.Content.displayName;\nDialogDescription.displayName = DialogPrimitive.Description.displayName;\n\nexport {\n  Dialog,\n  DialogPortal,\n  DialogTrigger,\n  DialogContent,\n  DialogHeader,\n  DialogFooter,\n  DialogTitle,\n  DialogCarousel,\n  DialogCarouselContent,\n  DialogSteps,\n  DialogStep,\n  DialogBody,\n  DialogDescription\n};\n"],"mappings":"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","names":["React","PopoverPrimitive","React","React","React","import_react","React","React","React","CommandPrimitive","CommandPrimitive","open"]}

package/dist/combobox/index.mjs

@@ -144,6 +144,7 @@ function Skeleton({
   className,
   content,
   animation = "pulse",
+  fade,
   ...props
 }) {
   const animationStyles = {
@@ -151,12 +152,14 @@ function Skeleton({
     pulse: "hawa-animate-pulse hawa-rounded hawa-bg-muted",
     shimmer: "hawa-space-y-5 hawa-rounded hawa-bg-muted  hawa-p-4 hawa-relative  before:hawa-absolute before:hawa-inset-0 before:hawa--translate-x-full before:hawa-animate-[shimmer_2s_infinite] before:hawa-bg-gradient-to-r before:hawa-from-transparent before:hawa-via-gray-300/40 dark:before:hawa-via-white/10 before:hawa-to-transparent hawa-isolate hawa-overflow-hidden  before:hawa-border-t before:hawa-border-rose-100/10"
   };
+  const fadeStyle = `[mask-image:linear-gradient(to_${fade},#D1D4DC_50%,transparent_100%)]`;
   return /* @__PURE__ */ React4.createElement(
     "div",
     {
       className: cn(
         animationStyles[animation],
         content && "hawa-flex hawa-flex-col hawa-items-center hawa-justify-center",
+        fade && fadeStyle,
         className
       ),
       ...props