@sikka/hawa 0.26.21 → 0.26.23

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (71) hide show
  1. package/README.md +2 -18
  2. package/dist/alert/index.d.mts +1 -0
  3. package/dist/alert/index.d.ts +1 -0
  4. package/dist/blocks/auth/index.mjs +5 -4
  5. package/dist/blocks/feedback/index.js +114 -118
  6. package/dist/blocks/feedback/index.mjs +6 -5
  7. package/dist/blocks/index.js +28 -30
  8. package/dist/blocks/index.mjs +3 -2
  9. package/dist/blocks/misc/index.js +28 -30
  10. package/dist/blocks/misc/index.mjs +20 -17
  11. package/dist/blocks/pricing/index.mjs +4 -4
  12. package/dist/carousel/index.d.mts +2 -0
  13. package/dist/carousel/index.d.ts +2 -0
  14. package/dist/carousel/index.js +31 -16
  15. package/dist/carousel/index.mjs +30 -15
  16. package/dist/checkbox/index.d.mts +1 -1
  17. package/dist/checkbox/index.d.ts +1 -1
  18. package/dist/chip/index.d.mts +1 -1
  19. package/dist/chip/index.d.ts +1 -1
  20. package/dist/{chunk-OTGCLEKC.mjs → chunk-2R7F2GL7.mjs} +20 -0
  21. package/dist/{chunk-POIP5U4M.mjs → chunk-4EGKGSGY.mjs} +1 -1
  22. package/dist/{chunk-APZM24KK.mjs → chunk-5YXZXYLH.mjs} +15 -18
  23. package/dist/{chunk-WPSUV4AD.mjs → chunk-F3DQJHTG.mjs} +29 -31
  24. package/dist/{chunk-VQQ6MUX5.mjs → chunk-FQ6WVEHW.mjs} +1 -1
  25. package/dist/{chunk-U3TZWNDZ.mjs → chunk-GVJYACGA.mjs} +1 -1
  26. package/dist/{chunk-Z5SL5QTQ.mjs → chunk-MQUAGP7K.mjs} +20 -0
  27. package/dist/{chunk-OAXF3RCQ.mjs → chunk-NMS5LCSQ.mjs} +1 -1
  28. package/dist/{chunk-4IOG44R3.mjs → chunk-OY66MBXP.mjs} +1 -1
  29. package/dist/{chunk-FDKCMEMD.mjs → chunk-R4HAAT6R.mjs} +1 -1
  30. package/dist/chunk-WUHNPHD5.mjs +0 -0
  31. package/dist/chunk-ZFXKCRJC.mjs +11 -0
  32. package/dist/codeBlock/index.d.mts +2 -1
  33. package/dist/codeBlock/index.d.ts +2 -1
  34. package/dist/codeBlock/index.js +21 -17
  35. package/dist/codeBlock/index.mjs +21 -12
  36. package/dist/collapsible/index.mjs +2 -0
  37. package/dist/colorPicker/index.d.mts +4 -0
  38. package/dist/colorPicker/index.d.ts +4 -0
  39. package/dist/colorPicker/index.js +80 -23
  40. package/dist/colorPicker/index.mjs +55 -15
  41. package/dist/commonTypes-2k6FnHw5.d.mts +4 -0
  42. package/dist/commonTypes-2k6FnHw5.d.ts +4 -0
  43. package/dist/dataTable/index.d.mts +2 -1
  44. package/dist/dataTable/index.d.ts +2 -1
  45. package/dist/dataTable/index.js +1 -1
  46. package/dist/dataTable/index.mjs +1 -1
  47. package/dist/elements/index.d.mts +11 -2
  48. package/dist/elements/index.d.ts +11 -2
  49. package/dist/elements/index.js +104 -59
  50. package/dist/elements/index.mjs +69 -33
  51. package/dist/hooks/index.mjs +1 -0
  52. package/dist/index.css +377 -202
  53. package/dist/index.d.mts +11 -2
  54. package/dist/index.d.ts +11 -2
  55. package/dist/index.js +104 -59
  56. package/dist/index.mjs +117 -60
  57. package/dist/layout/index.mjs +3 -2
  58. package/dist/switch/index.d.mts +1 -1
  59. package/dist/switch/index.d.ts +1 -1
  60. package/dist/tabs/index.d.mts +2 -2
  61. package/dist/tabs/index.d.ts +2 -2
  62. package/dist/tabs/index.js +15 -13
  63. package/dist/tabs/index.mjs +15 -13
  64. package/dist/textarea/index.d.mts +1 -0
  65. package/dist/textarea/index.d.ts +1 -0
  66. package/dist/textarea/index.js +59 -36
  67. package/dist/textarea/index.mjs +59 -36
  68. package/package.json +11 -10
  69. package/dist/commonTypes-cyhMPvmz.d.mts +0 -4
  70. package/dist/commonTypes-cyhMPvmz.d.ts +0 -4
  71. /package/dist/{chunk-AREFDTXK.mjs → chunk-D36MPDGE.mjs} +0 -0
package/dist/index.d.mts CHANGED
@@ -9,6 +9,7 @@ import * as SheetPrimitive from '@radix-ui/react-dialog';
9
9
  import { DialogProps } from '@radix-ui/react-dialog';
10
10
  import { VariantProps } from 'class-variance-authority';
11
11
  import { RowData, ColumnDef } from '@tanstack/react-table';
12
+ export { ColumnDef } from '@tanstack/react-table';
12
13
  import * as TabsPrimitive from '@radix-ui/react-tabs';
13
14
  import * as PopoverPrimitive from '@radix-ui/react-popover';
14
15
  import * as SwitchPrimitives from '@radix-ui/react-switch';
@@ -16,6 +17,7 @@ import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
16
17
  import * as ProgressPrimitive from '@radix-ui/react-progress';
17
18
  import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
18
19
  import * as SliderPrimitive from '@radix-ui/react-slider';
20
+ import { HighlightProps } from 'prism-react-renderer';
19
21
  import { EmblaOptionsType } from 'embla-carousel';
20
22
  import * as ToastPrimitives from '@radix-ui/react-toast';
21
23
  import * as MenubarPrimitive from '@radix-ui/react-menubar';
@@ -384,6 +386,7 @@ type AlertTypes = {
384
386
  variant: "outline" | "link" | "default" | "destructive" | "secondary" | "ghost";
385
387
  }
386
388
  ];
389
+ /** Removes the close button */
387
390
  persistent?: boolean;
388
391
  icon?: any;
389
392
  className?: any;
@@ -540,6 +543,7 @@ declare const Combobox: React$1.ForwardRefExoticComponent<ComboboxTypes<any> & R
540
543
 
541
544
  interface TextareaProps extends React$1.TextareaHTMLAttributes<HTMLTextAreaElement> {
542
545
  helperText?: string;
546
+ isLoading?: boolean;
543
547
  /** The label of the input field */
544
548
  label?: any;
545
549
  labelProps?: LabelProps;
@@ -595,7 +599,7 @@ type SortButtonProps = {
595
599
  declare const SortButton: React__default.FC<SortButtonProps>;
596
600
 
597
601
  declare const Tabs: React$1.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & {
598
- orientation?: OrientationType | undefined;
602
+ orientation?: "vertical" | "horizontal" | undefined;
599
603
  } & React$1.RefAttributes<HTMLDivElement>>;
600
604
  declare const TabsList: React$1.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsListProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
601
605
  declare const TabsTrigger: React$1.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsTriggerProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & {
@@ -823,8 +827,12 @@ declare const ScrollBar: React$1.ForwardRefExoticComponent<Omit<ScrollAreaPrimit
823
827
  type ColorPickerTypes = {
824
828
  label?: string;
825
829
  id?: string;
830
+ isLoading?: boolean;
826
831
  labelProps?: LabelProps;
827
832
  helperText?: string;
833
+ forceHideHelperText?: boolean;
834
+ /** Boolean to enable/disable editing the input field and using it as a text field */
835
+ preview?: boolean;
828
836
  /** The hex code for the color */
829
837
  color?: any;
830
838
  /** Fires everytime the color changes */
@@ -908,7 +916,7 @@ declare const ScrollIndicator: FC<ScrollIndicatorProps>;
908
916
 
909
917
  type CodeBlockTypes = {
910
918
  /** Specifies the programming language for syntax highlighting.*/
911
- language?: string;
919
+ language?: HighlightProps["language"];
912
920
  /** Defines the width of the code block.*/
913
921
  width?: "full" | "md" | "sm";
914
922
  /** Array of tabs each containing a title and code content.*/
@@ -932,6 +940,7 @@ type CarouselProps = {
932
940
  autoplay?: boolean;
933
941
  autoplayInterval?: number;
934
942
  options?: EmblaOptionsType;
943
+ direction?: DirectionType;
935
944
  };
936
945
  declare const Carousel: React__default.FC<CarouselProps>;
937
946
 
package/dist/index.d.ts CHANGED
@@ -9,6 +9,7 @@ import * as SheetPrimitive from '@radix-ui/react-dialog';
9
9
  import { DialogProps } from '@radix-ui/react-dialog';
10
10
  import { VariantProps } from 'class-variance-authority';
11
11
  import { RowData, ColumnDef } from '@tanstack/react-table';
12
+ export { ColumnDef } from '@tanstack/react-table';
12
13
  import * as TabsPrimitive from '@radix-ui/react-tabs';
13
14
  import * as PopoverPrimitive from '@radix-ui/react-popover';
14
15
  import * as SwitchPrimitives from '@radix-ui/react-switch';
@@ -16,6 +17,7 @@ import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
16
17
  import * as ProgressPrimitive from '@radix-ui/react-progress';
17
18
  import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
18
19
  import * as SliderPrimitive from '@radix-ui/react-slider';
20
+ import { HighlightProps } from 'prism-react-renderer';
19
21
  import { EmblaOptionsType } from 'embla-carousel';
20
22
  import * as ToastPrimitives from '@radix-ui/react-toast';
21
23
  import * as MenubarPrimitive from '@radix-ui/react-menubar';
@@ -384,6 +386,7 @@ type AlertTypes = {
384
386
  variant: "outline" | "link" | "default" | "destructive" | "secondary" | "ghost";
385
387
  }
386
388
  ];
389
+ /** Removes the close button */
387
390
  persistent?: boolean;
388
391
  icon?: any;
389
392
  className?: any;
@@ -540,6 +543,7 @@ declare const Combobox: React$1.ForwardRefExoticComponent<ComboboxTypes<any> & R
540
543
 
541
544
  interface TextareaProps extends React$1.TextareaHTMLAttributes<HTMLTextAreaElement> {
542
545
  helperText?: string;
546
+ isLoading?: boolean;
543
547
  /** The label of the input field */
544
548
  label?: any;
545
549
  labelProps?: LabelProps;
@@ -595,7 +599,7 @@ type SortButtonProps = {
595
599
  declare const SortButton: React__default.FC<SortButtonProps>;
596
600
 
597
601
  declare const Tabs: React$1.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & {
598
- orientation?: OrientationType | undefined;
602
+ orientation?: "vertical" | "horizontal" | undefined;
599
603
  } & React$1.RefAttributes<HTMLDivElement>>;
600
604
  declare const TabsList: React$1.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsListProps & React$1.RefAttributes<HTMLDivElement>, "ref"> & React$1.RefAttributes<HTMLDivElement>>;
601
605
  declare const TabsTrigger: React$1.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsTriggerProps & React$1.RefAttributes<HTMLButtonElement>, "ref"> & {
@@ -823,8 +827,12 @@ declare const ScrollBar: React$1.ForwardRefExoticComponent<Omit<ScrollAreaPrimit
823
827
  type ColorPickerTypes = {
824
828
  label?: string;
825
829
  id?: string;
830
+ isLoading?: boolean;
826
831
  labelProps?: LabelProps;
827
832
  helperText?: string;
833
+ forceHideHelperText?: boolean;
834
+ /** Boolean to enable/disable editing the input field and using it as a text field */
835
+ preview?: boolean;
828
836
  /** The hex code for the color */
829
837
  color?: any;
830
838
  /** Fires everytime the color changes */
@@ -908,7 +916,7 @@ declare const ScrollIndicator: FC<ScrollIndicatorProps>;
908
916
 
909
917
  type CodeBlockTypes = {
910
918
  /** Specifies the programming language for syntax highlighting.*/
911
- language?: string;
919
+ language?: HighlightProps["language"];
912
920
  /** Defines the width of the code block.*/
913
921
  width?: "full" | "md" | "sm";
914
922
  /** Array of tabs each containing a title and code content.*/
@@ -932,6 +940,7 @@ type CarouselProps = {
932
940
  autoplay?: boolean;
933
941
  autoplayInterval?: number;
934
942
  options?: EmblaOptionsType;
943
+ direction?: DirectionType;
935
944
  };
936
945
  declare const Carousel: React__default.FC<CarouselProps>;
937
946
 
package/dist/index.js CHANGED
@@ -248,6 +248,25 @@ var import_tailwind_merge = require("tailwind-merge");
248
248
  function cn(...inputs) {
249
249
  return (0, import_tailwind_merge.twMerge)((0, import_clsx.clsx)(inputs));
250
250
  }
251
+ var parseColor = (color) => {
252
+ if (color.startsWith("#")) {
253
+ let r = parseInt(color.slice(1, 3), 16);
254
+ let g = parseInt(color.slice(3, 5), 16);
255
+ let b = parseInt(color.slice(5, 7), 16);
256
+ return [r, g, b];
257
+ } else if (color.startsWith("rgb")) {
258
+ return color.match(/\d+/g).map(Number);
259
+ }
260
+ return [255, 255, 255];
261
+ };
262
+ var calculateLuminance = (color) => {
263
+ var _a;
264
+ const [r, g, b] = (_a = parseColor(color)) == null ? void 0 : _a.map((c) => {
265
+ c /= 255;
266
+ return c <= 0.03928 ? c / 12.92 : ((c + 0.055) / 1.055) ** 2.4;
267
+ });
268
+ return 0.2126 * r + 0.7152 * g + 0.0722 * b;
269
+ };
251
270
 
252
271
  // elements/card/Card.tsx
253
272
  var Card = React.forwardRef(
@@ -2706,7 +2725,7 @@ var DataTable = ({
2706
2725
  /* @__PURE__ */ React22.createElement("div", { className: "hawa-flex hawa-items-center hawa-justify-between" }, !props.showCount && /* @__PURE__ */ React22.createElement("div", { className: "hawa-flex hawa-w-fit hawa-flex-row hawa-items-center hawa-gap-2 hawa-text-sm hawa-text-muted-foreground" }), props.showCount && /* @__PURE__ */ React22.createElement(
2707
2726
  "div",
2708
2727
  {
2709
- className: "text-sm text-muted-foreground",
2728
+ className: "text-muted-foreground text-sm",
2710
2729
  dir: props.direction
2711
2730
  },
2712
2731
  /* @__PURE__ */ React22.createElement("span", null, (_g = props.texts) == null ? void 0 : _g.total),
@@ -3492,6 +3511,7 @@ var Textarea = React28.forwardRef(
3492
3511
  forceHideHelperText,
3493
3512
  textareaProps,
3494
3513
  countPosition = "bottom",
3514
+ isLoading,
3495
3515
  ...props
3496
3516
  }, ref) => {
3497
3517
  return /* @__PURE__ */ React28.createElement(
@@ -3503,12 +3523,20 @@ var Textarea = React28.forwardRef(
3503
3523
  className
3504
3524
  )
3505
3525
  },
3506
- props.label && /* @__PURE__ */ React28.createElement(Label2, { ...labelProps }, props.label),
3507
- /* @__PURE__ */ React28.createElement(
3526
+ /* @__PURE__ */ React28.createElement("div", { className: "hawa-flex hawa-flex-row hawa-justify-between" }, props.label && /* @__PURE__ */ React28.createElement(Label2, { ...labelProps }, props.label), showCount && countPosition === "top" && /* @__PURE__ */ React28.createElement(
3527
+ "div",
3528
+ {
3529
+ className: "hawa-text-start hawa-text-xs hawa-transition-all hawa-leading-none"
3530
+ },
3531
+ (textareaProps == null ? void 0 : textareaProps.value) ? String(textareaProps == null ? void 0 : textareaProps.value).length : 0,
3532
+ "/",
3533
+ textareaProps == null ? void 0 : textareaProps.maxLength
3534
+ )),
3535
+ isLoading ? /* @__PURE__ */ React28.createElement(Skeleton, { style: { height: 40 } }) : /* @__PURE__ */ React28.createElement(
3508
3536
  "textarea",
3509
3537
  {
3510
3538
  className: cn(
3511
- "hawa-flex hawa-min-h-[40px] hawa-w-full hawa-rounded-md hawa-border hawa-border-input hawa-bg-background hawa-px-3 hawa-py-2 hawa-text-sm hawa-ring-offset-background placeholder:hawa-text-gray-400 placeholder:hawa-text-muted-foreground focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-0 disabled:hawa-cursor-not-allowed disabled:hawa-opacity-50",
3539
+ "hawa-flex hawa-min-h-[40px] hawa-h-[40px] hawa-w-full hawa-rounded-md hawa-border hawa-border-input hawa-bg-background hawa-px-3 hawa-py-2 hawa-text-sm hawa-ring-offset-background placeholder:hawa-text-gray-400 placeholder:hawa-text-muted-foreground focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-0 disabled:hawa-cursor-not-allowed disabled:hawa-opacity-50",
3512
3540
  classNames == null ? void 0 : classNames.textarea
3513
3541
  ),
3514
3542
  ref,
@@ -3524,20 +3552,7 @@ var Textarea = React28.forwardRef(
3524
3552
  )
3525
3553
  },
3526
3554
  props.helperText
3527
- ), showCount && /* @__PURE__ */ React28.createElement(
3528
- "div",
3529
- {
3530
- className: cn(
3531
- "hawa-text-start hawa-text-xs hawa-transition-all",
3532
- {
3533
- "hawa-absolute hawa-bottom-[80px] hawa-end-0 hawa-translate-y-1/2": countPosition === "top"
3534
- }
3535
- )
3536
- },
3537
- (textareaProps == null ? void 0 : textareaProps.value) ? String(textareaProps == null ? void 0 : textareaProps.value).length : 0,
3538
- "/",
3539
- textareaProps == null ? void 0 : textareaProps.maxLength
3540
- ))
3555
+ ), showCount && countPosition === "bottom" && /* @__PURE__ */ React28.createElement("div", { className: "hawa-text-start hawa-text-xs hawa-transition-all" }, (textareaProps == null ? void 0 : textareaProps.value) ? String(textareaProps == null ? void 0 : textareaProps.value).length : 0, "/", textareaProps == null ? void 0 : textareaProps.maxLength))
3541
3556
  );
3542
3557
  }
3543
3558
  );
@@ -3803,19 +3818,21 @@ var SortButton = (props) => {
3803
3818
  var React31 = __toESM(require("react"));
3804
3819
  var TabsPrimitive = __toESM(require("@radix-ui/react-tabs"));
3805
3820
  var TabsContext = React31.createContext({ orientation: "vertical" });
3806
- var Tabs = React31.forwardRef(({ className, orientation, ...props }, ref) => /* @__PURE__ */ React31.createElement(
3807
- TabsPrimitive.Root,
3808
- {
3809
- ref,
3810
- className: cn(
3811
- "hawa-flex hawa-gap-2",
3812
- orientation === "vertical" ? "hawa-flex-row" : "hawa-flex-col",
3813
- className
3814
- ),
3815
- ...props
3816
- },
3817
- /* @__PURE__ */ React31.createElement(TabsContext.Provider, { value: { orientation } }, props.children)
3818
- ));
3821
+ var Tabs = React31.forwardRef(
3822
+ ({ className, orientation = "vertical", ...props }, ref) => /* @__PURE__ */ React31.createElement(
3823
+ TabsPrimitive.Root,
3824
+ {
3825
+ ref,
3826
+ className: cn(
3827
+ "hawa-flex hawa-gap-2",
3828
+ orientation === "vertical" ? "hawa-flex-row" : "hawa-flex-col",
3829
+ className
3830
+ ),
3831
+ ...props
3832
+ },
3833
+ /* @__PURE__ */ React31.createElement(TabsContext.Provider, { value: { orientation } }, props.children)
3834
+ )
3835
+ );
3819
3836
  Tabs.displayName = TabsPrimitive.Root.displayName;
3820
3837
  var TabsList = React31.forwardRef(({ className, ...props }, ref) => {
3821
3838
  const { orientation } = React31.useContext(TabsContext);
@@ -6288,6 +6305,9 @@ var ColorPicker = ({
6288
6305
  colorPickerProps,
6289
6306
  textInputProps,
6290
6307
  labelProps,
6308
+ forceHideHelperText,
6309
+ isLoading,
6310
+ preview = false,
6291
6311
  ...props
6292
6312
  }) => {
6293
6313
  const [selectedColor, setSelectedColor] = (0, import_react21.useState)(props.color);
@@ -6308,7 +6328,7 @@ var ColorPicker = ({
6308
6328
  props.handleChange(e);
6309
6329
  }
6310
6330
  };
6311
- return /* @__PURE__ */ import_react21.default.createElement("div", { className: "hawa-flex hawa-w-full hawa-flex-col hawa-gap-2" }, props.label && /* @__PURE__ */ import_react21.default.createElement(Label2, { ...labelProps }, props.label), /* @__PURE__ */ import_react21.default.createElement("div", { dir: "ltr", className: "hawa-flex hawa-w-full hawa-flex-row" }, /* @__PURE__ */ import_react21.default.createElement(
6331
+ return /* @__PURE__ */ import_react21.default.createElement("div", { className: "hawa-flex hawa-w-fit hawa-flex-col hawa-gap-2" }, props.label && /* @__PURE__ */ import_react21.default.createElement(Label2, { ...labelProps }, props.label), isLoading ? /* @__PURE__ */ import_react21.default.createElement(Skeleton, { style: { height: 40, width: 148 } }) : /* @__PURE__ */ import_react21.default.createElement("div", { dir: "ltr", className: "hawa-flex hawa-w-full hawa-flex-row" }, /* @__PURE__ */ import_react21.default.createElement(
6312
6332
  "div",
6313
6333
  {
6314
6334
  style: { height: 40, backgroundColor: selectedColor },
@@ -6317,6 +6337,7 @@ var ColorPicker = ({
6317
6337
  /* @__PURE__ */ import_react21.default.createElement(
6318
6338
  "input",
6319
6339
  {
6340
+ disabled: preview,
6320
6341
  type: "color",
6321
6342
  value: selectedColor,
6322
6343
  onChange: (e) => {
@@ -6335,16 +6356,23 @@ var ColorPicker = ({
6335
6356
  ), /* @__PURE__ */ import_react21.default.createElement("div", { className: "hawa-relative hawa-flex hawa-max-h-fit hawa-w-full hawa-flex-col hawa-justify-center hawa-gap-0" }, /* @__PURE__ */ import_react21.default.createElement(
6336
6357
  "input",
6337
6358
  {
6359
+ disabled: preview,
6338
6360
  maxLength: 7,
6339
6361
  type: "text",
6340
6362
  onInput: handleTextInputChange,
6341
6363
  value: selectedColor,
6342
6364
  className: cn(
6343
- "hawa-block hawa-h-[40px] hawa-w-24 hawa-rounded hawa-rounded-l-none hawa-border hawa-border-l-0 hawa-border-l-transparent hawa-bg-background hawa-p-2 hawa-text-sm hawa-transition-all"
6365
+ "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",
6366
+ "hawa-border hawa-border-l-0 hawa-border-l-transparent"
6367
+ // "hawa-border hawa-border-x-0 hawa-border-x-transparent hawa-border-b-0 hawa-rounded-tr-none"
6344
6368
  ),
6369
+ style: {
6370
+ backgroundColor: preview ? selectedColor : "hsl(var(--background))",
6371
+ color: preview ? calculateLuminance(selectedColor) > 0.5 ? "black" : "white" : ""
6372
+ },
6345
6373
  ...textInputProps
6346
6374
  }
6347
- ))), /* @__PURE__ */ import_react21.default.createElement(
6375
+ ))), !forceHideHelperText && /* @__PURE__ */ import_react21.default.createElement(
6348
6376
  "p",
6349
6377
  {
6350
6378
  className: cn(
@@ -7066,6 +7094,8 @@ function useClipboard({ timeout = 2e3 } = {}) {
7066
7094
  }
7067
7095
 
7068
7096
  // elements/codeBlock/CodeBlock.tsx
7097
+ (typeof global !== "undefined" ? global : window).Prism = import_prism_react_renderer.Prism;
7098
+ require("prismjs/components/prism-bash");
7069
7099
  var CodeBlock = ({
7070
7100
  tabs,
7071
7101
  code,
@@ -7078,8 +7108,7 @@ var CodeBlock = ({
7078
7108
  }) => {
7079
7109
  const clipboard = useClipboard();
7080
7110
  const [selectedTab, setSelectedTab] = (0, import_react30.useState)(0);
7081
- const isDarkMode = props.forcedDarkMode || document.body.classList.contains("dark");
7082
- const theme = isDarkMode ? import_prism_react_renderer.themes.vsDark : import_prism_react_renderer.themes.vsLight;
7111
+ const theme = import_prism_react_renderer.themes.oceanicNext;
7083
7112
  let widthStyles = {
7084
7113
  full: "hawa-w-full",
7085
7114
  md: "hawa-w-full hawa-max-w-md",
@@ -7099,15 +7128,15 @@ var CodeBlock = ({
7099
7128
  "div",
7100
7129
  {
7101
7130
  className: cn(
7102
- "hawa-flex hawa-flex-row hawa-gap-2 hawa-rounded-t hawa-p-2 hawa-py-0.5 hawa-pb-0 hawa-font-mono hawa-text-foreground dark:hawa-bg-muted",
7103
- fileName && tabs ? "hawa-bg-gray-300 dark:hawa-bg-muted/50" : "hawa-bg-gray-200"
7131
+ "hawa-flex hawa-flex-row hawa-gap-2 hawa-rounded-t hawa-p-2 hawa-py-0.5 hawa-pb-0 hawa-font-mono hawa-text-foreground",
7132
+ fileName && tabs ? "hawa-bg-primary/10" : "hawa-bg-primary/15"
7104
7133
  )
7105
7134
  },
7106
7135
  /* @__PURE__ */ import_react30.default.createElement(
7107
7136
  "div",
7108
7137
  {
7109
7138
  className: cn(
7110
- "mono hawa-w-full hawa-max-w-[52px] hawa-rounded-inner hawa-p-1 hawa-py-0.5 hawa-text-center hawa-text-[0.75rem]"
7139
+ "hawa-font-mono hawa-w-full hawa-max-w-[52px] hawa-rounded-inner hawa-p-1 hawa-py-0.5 hawa-text-center hawa-text-[0.75rem]"
7111
7140
  )
7112
7141
  },
7113
7142
  fileName
@@ -7117,7 +7146,8 @@ var CodeBlock = ({
7117
7146
  "div",
7118
7147
  {
7119
7148
  className: cn(
7120
- "hawa-flex hawa-flex-row hawa-gap-2 hawa-rounded-t hawa-bg-gray-200 hawa-p-2 hawa-pb-0 hawa-font-mono hawa-text-foreground dark:hawa-bg-muted",
7149
+ // hawa-bg-gray-300 dark:hawa-bg-red-600
7150
+ "hawa-flex hawa-flex-row hawa-gap-2 hawa-rounded-t hawa-p-1 hawa-bg-primary/15 hawa-pb-0 hawa-font-mono hawa-text-foreground",
7121
7151
  tabs && fileName && "hawa-rounded-t-none"
7122
7152
  )
7123
7153
  },
@@ -7134,7 +7164,7 @@ var CodeBlock = ({
7134
7164
  {
7135
7165
  onClick: () => setSelectedTab(i),
7136
7166
  className: cn(
7137
- "hawa-mb-1 hawa-w-full hawa-max-w-[52px] hawa-cursor-pointer hawa-rounded-inner hawa-p-2 hawa-py-1 hawa-text-center hawa-text-[1rem] hawa-transition-all hover:hawa-bg-muted-foreground/20"
7167
+ "hawa-mb-0.5 hawa-w-full hawa-max-w-[52px] hawa-cursor-pointer hawa-rounded-inner hawa-p-2 hawa-py-0.5 hawa-text-center hawa-text-[0.7rem] hawa-transition-all hover:hawa-bg-muted-foreground/20"
7138
7168
  )
7139
7169
  },
7140
7170
  tab.title
@@ -7145,7 +7175,7 @@ var CodeBlock = ({
7145
7175
  "div",
7146
7176
  {
7147
7177
  className: cn(
7148
- "hawa-flex hawa-w-full hawa-flex-row hawa-items-start hawa-justify-between hawa-border hawa-bg-foreground/5 hawa-p-0 hawa-text-left hawa-text-sm sm:hawa-text-base ",
7178
+ "hawa-flex hawa-w-full hawa-flex-row hawa-items-start hawa-justify-between hawa-border hawa-bg-gray-700 hawa-p-0 hawa-text-left hawa-text-sm sm:hawa-text-base ",
7149
7179
  tabs || fileName ? "hawa-rounded-b hawa-rounded-t-none" : "hawa-rounded"
7150
7180
  )
7151
7181
  },
@@ -7174,12 +7204,12 @@ var CodeBlock = ({
7174
7204
  size: "icon",
7175
7205
  onClick: () => clipboard.copy(tabs ? tabs[selectedTab].code : code),
7176
7206
  variant: "outline",
7177
- className: "hawa-text-foreground hawa-opacity-50 sm:hawa-opacity-100"
7207
+ className: "hawa-text-gray-200 hawa-opacity-50 "
7178
7208
  },
7179
7209
  /* @__PURE__ */ import_react30.default.createElement(
7180
7210
  "svg",
7181
7211
  {
7182
- "aria-label": "Copy Icon",
7212
+ "aria-label": "Copy",
7183
7213
  stroke: "currentColor",
7184
7214
  fill: "none",
7185
7215
  strokeWidth: "2",
@@ -7206,11 +7236,13 @@ var Carousel = ({
7206
7236
  showArrows,
7207
7237
  options,
7208
7238
  autoplay,
7239
+ direction = "ltr",
7209
7240
  autoplayInterval = 3e3,
7210
7241
  ...props
7211
7242
  }) => {
7212
7243
  const [emblaRef, emblaApi] = (0, import_embla_carousel_react.default)({
7213
7244
  ...options,
7245
+ direction,
7214
7246
  loop: autoplay ? true : (options == null ? void 0 : options.loop) || false
7215
7247
  });
7216
7248
  const [selectedIndex, setSelectedIndex] = (0, import_react31.useState)(0);
@@ -7249,6 +7281,7 @@ var Carousel = ({
7249
7281
  ))))), /* @__PURE__ */ import_react31.default.createElement(
7250
7282
  Dots,
7251
7283
  {
7284
+ direction,
7252
7285
  itemsLength: length,
7253
7286
  selectedIndex,
7254
7287
  onDotClick: (index) => emblaApi == null ? void 0 : emblaApi.scrollTo(index)
@@ -7263,22 +7296,34 @@ var Carousel = ({
7263
7296
  }
7264
7297
  ));
7265
7298
  };
7266
- var Dots = ({ onDotClick, itemsLength, selectedIndex }) => {
7299
+ var Dots = ({
7300
+ onDotClick,
7301
+ itemsLength,
7302
+ selectedIndex,
7303
+ direction
7304
+ }) => {
7267
7305
  const arr = new Array(itemsLength).fill(0);
7268
- return /* @__PURE__ */ import_react31.default.createElement("div", { className: "hawa-z-50 hawa-my-2 hawa-flex hawa-justify-center hawa-gap-1" }, arr.map((_, index) => {
7269
- const selected = index === selectedIndex;
7270
- return /* @__PURE__ */ import_react31.default.createElement(
7271
- "div",
7272
- {
7273
- key: index,
7274
- onClick: () => onDotClick(index),
7275
- className: cn(
7276
- "hawa-h-2 hawa-rounded-full hawa-bg-primary hawa-transition-all hawa-duration-300 hover:hawa-cursor-pointer",
7277
- !selected ? "hawa-w-2 hawa-opacity-50" : "hawa-w-6 hawa-opacity-100"
7278
- )
7279
- }
7280
- );
7281
- }));
7306
+ return /* @__PURE__ */ import_react31.default.createElement(
7307
+ "div",
7308
+ {
7309
+ dir: direction,
7310
+ className: "hawa-z-50 hawa-my-2 hawa-flex hawa-justify-center hawa-gap-1"
7311
+ },
7312
+ arr.map((_, index) => {
7313
+ const selected = index === selectedIndex;
7314
+ return /* @__PURE__ */ import_react31.default.createElement(
7315
+ "div",
7316
+ {
7317
+ key: index,
7318
+ onClick: () => onDotClick(index),
7319
+ className: cn(
7320
+ "hawa-h-2 hawa-rounded-full hawa-bg-primary hawa-transition-all hawa-duration-300 hover:hawa-cursor-pointer",
7321
+ !selected ? "hawa-w-2 hawa-opacity-50" : "hawa-w-6 hawa-opacity-100"
7322
+ )
7323
+ }
7324
+ );
7325
+ })
7326
+ );
7282
7327
  };
7283
7328
  var CarouselControls = (props) => {
7284
7329
  return /* @__PURE__ */ import_react31.default.createElement("div", { className: "hawa-flex hawa-justify-end hawa-gap-2 " }, /* @__PURE__ */ import_react31.default.createElement(