@sikka/hawa 0.7.0-next → 0.7.2-next

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 (6) hide show
  1. package/dist/index.css +27 -0
  2. package/dist/index.d.mts +35 -1
  3. package/dist/index.d.ts +35 -1
  4. package/dist/index.js +39 -31
  5. package/dist/index.mjs +67 -37
  6. package/package.json +1 -1
package/dist/index.css CHANGED
@@ -1708,6 +1708,10 @@ input[type="number"]::-webkit-inner-spin-button,
1708
1708
  --tw-bg-opacity: 1;
1709
1709
  background-color: rgb(229 231 235 / var(--tw-bg-opacity));
1710
1710
  }
1711
+ .hawa-bg-gray-300 {
1712
+ --tw-bg-opacity: 1;
1713
+ background-color: rgb(209 213 219 / var(--tw-bg-opacity));
1714
+ }
1711
1715
  .hawa-bg-gray-50 {
1712
1716
  --tw-bg-opacity: 1;
1713
1717
  background-color: rgb(249 250 251 / var(--tw-bg-opacity));
@@ -1932,6 +1936,9 @@ input[type="number"]::-webkit-inner-spin-button,
1932
1936
  .hawa-pb-2 {
1933
1937
  padding-bottom: 0.5rem;
1934
1938
  }
1939
+ .hawa-pb-4 {
1940
+ padding-bottom: 1rem;
1941
+ }
1935
1942
  .hawa-pl-0 {
1936
1943
  padding-left: 0px;
1937
1944
  }
@@ -2004,6 +2011,9 @@ input[type="number"]::-webkit-inner-spin-button,
2004
2011
  font-size: 3.75rem;
2005
2012
  line-height: 1;
2006
2013
  }
2014
+ .hawa-text-\[0\.75rem\] {
2015
+ font-size: 0.75rem;
2016
+ }
2007
2017
  .hawa-text-\[10px\] {
2008
2018
  font-size: 10px;
2009
2019
  }
@@ -3015,6 +3025,9 @@ body {
3015
3025
  :is(.hawa-dark .dark\:hawa-bg-muted\/40) {
3016
3026
  background-color: hsl(var(--muted) / 0.4);
3017
3027
  }
3028
+ :is(.hawa-dark .dark\:hawa-bg-muted\/50) {
3029
+ background-color: hsl(var(--muted) / 0.5);
3030
+ }
3018
3031
  :is(.hawa-dark .dark\:hawa-bg-primary) {
3019
3032
  background-color: hsl(var(--primary));
3020
3033
  }
@@ -3199,6 +3212,20 @@ body {
3199
3212
  .md\:hawa-grid-cols-2 {
3200
3213
  grid-template-columns: repeat(2, minmax(0, 1fr));
3201
3214
  }
3215
+
3216
+ .md\:hawa-rounded {
3217
+ border-radius: var(--radius);
3218
+ }
3219
+
3220
+ .md\:hawa-px-4 {
3221
+ padding-left: 1rem;
3222
+ padding-right: 1rem;
3223
+ }
3224
+
3225
+ .md\:hawa-px-64 {
3226
+ padding-left: 16rem;
3227
+ padding-right: 16rem;
3228
+ }
3202
3229
  }
3203
3230
  @media (min-width: 1024px) {
3204
3231
 
package/dist/index.d.mts CHANGED
@@ -218,7 +218,7 @@ declare const Radio: FC<RadioTypes>;
218
218
 
219
219
  interface SkeletonProps extends React__default.HTMLAttributes<HTMLDivElement> {
220
220
  className?: string;
221
- animation?: "pulse" | "shimmer";
221
+ animation?: "none" | "pulse" | "shimmer";
222
222
  }
223
223
  declare function Skeleton({ className, animation, ...props }: SkeletonProps): React__default.JSX.Element;
224
224
 
@@ -720,28 +720,62 @@ type AppLayoutTypes = {
720
720
  design?: "default" | "bubbles" | "floating";
721
721
  /** The pages of the side drawer */
722
722
  drawerItems: Item[];
723
+ /** The direction of the layout */
723
724
  direction?: "rtl" | "ltr";
725
+ /** The title of the current selected page, make sure it's the same as the drawerItem slug */
724
726
  currentPage: string;
727
+ /** Specifies the title of the page. */
725
728
  pageTitle?: string;
729
+ /** Specifies the symbol for the logo. */
726
730
  logoSymbol?: any;
731
+ /** Specifies the link for the logo. */
727
732
  logoLink?: string;
733
+ /** Specifies the text for the logo. */
728
734
  logoText?: any;
735
+ /** Specifies the content to be displayed in the layout. */
729
736
  children?: any;
737
+ /** Specifies whether to display the top bar. */
730
738
  topBar?: boolean;
739
+ /** Specifies the username to be displayed. */
731
740
  username?: string;
741
+ /** Specifies the user email to be displayed. */
732
742
  email?: string;
743
+ /** Specifies the image for the avatar. */
733
744
  avatarImage?: any;
745
+ /**
746
+ * Specifies the size of the drawer.
747
+ * - 'sm': Small.
748
+ * - 'md': Medium.
749
+ * - 'large': Large.
750
+ */
734
751
  drawerSize?: "sm" | "md" | "large";
752
+ /** Specifies the menu items for the profile menu. */
735
753
  profileMenuItems?: MenuItemType[];
754
+ /**
755
+ * Specifies the width of the profile menu.
756
+ * - 'default': Default width.
757
+ * - 'sm': Small width.
758
+ * - 'lg': Large width.
759
+ * - 'parent': Inherits width from parent element.
760
+ */
736
761
  profileMenuWidth: "default" | "sm" | "lg" | "parent";
762
+ /** Event handler for settings button click. */
737
763
  onSettingsClick?: () => void;
764
+ /** Event handler for drawer expansion. */
738
765
  onDrawerExpand?: (e: any) => void;
766
+ /** Specifies whether to keep the drawer open. */
739
767
  keepDrawerOpen?: boolean;
768
+ /** Specifies additional actions for the drawer footer. */
740
769
  DrawerFooterActions?: any;
770
+ /** Specifies the item that was clicked. */
741
771
  clickedItem?: any;
772
+ /** Event handler for logo button click. */
742
773
  onLogoClick?: () => void;
774
+ /** Text labels for various UI elements. */
743
775
  texts?: {
776
+ /** Label for expand sidebar button. */
744
777
  expandSidebar?: string;
778
+ /** Label for collapse sidebar button. */
745
779
  collapseSidebar?: string;
746
780
  };
747
781
  };
package/dist/index.d.ts CHANGED
@@ -218,7 +218,7 @@ declare const Radio: FC<RadioTypes>;
218
218
 
219
219
  interface SkeletonProps extends React__default.HTMLAttributes<HTMLDivElement> {
220
220
  className?: string;
221
- animation?: "pulse" | "shimmer";
221
+ animation?: "none" | "pulse" | "shimmer";
222
222
  }
223
223
  declare function Skeleton({ className, animation, ...props }: SkeletonProps): React__default.JSX.Element;
224
224
 
@@ -720,28 +720,62 @@ type AppLayoutTypes = {
720
720
  design?: "default" | "bubbles" | "floating";
721
721
  /** The pages of the side drawer */
722
722
  drawerItems: Item[];
723
+ /** The direction of the layout */
723
724
  direction?: "rtl" | "ltr";
725
+ /** The title of the current selected page, make sure it's the same as the drawerItem slug */
724
726
  currentPage: string;
727
+ /** Specifies the title of the page. */
725
728
  pageTitle?: string;
729
+ /** Specifies the symbol for the logo. */
726
730
  logoSymbol?: any;
731
+ /** Specifies the link for the logo. */
727
732
  logoLink?: string;
733
+ /** Specifies the text for the logo. */
728
734
  logoText?: any;
735
+ /** Specifies the content to be displayed in the layout. */
729
736
  children?: any;
737
+ /** Specifies whether to display the top bar. */
730
738
  topBar?: boolean;
739
+ /** Specifies the username to be displayed. */
731
740
  username?: string;
741
+ /** Specifies the user email to be displayed. */
732
742
  email?: string;
743
+ /** Specifies the image for the avatar. */
733
744
  avatarImage?: any;
745
+ /**
746
+ * Specifies the size of the drawer.
747
+ * - 'sm': Small.
748
+ * - 'md': Medium.
749
+ * - 'large': Large.
750
+ */
734
751
  drawerSize?: "sm" | "md" | "large";
752
+ /** Specifies the menu items for the profile menu. */
735
753
  profileMenuItems?: MenuItemType[];
754
+ /**
755
+ * Specifies the width of the profile menu.
756
+ * - 'default': Default width.
757
+ * - 'sm': Small width.
758
+ * - 'lg': Large width.
759
+ * - 'parent': Inherits width from parent element.
760
+ */
736
761
  profileMenuWidth: "default" | "sm" | "lg" | "parent";
762
+ /** Event handler for settings button click. */
737
763
  onSettingsClick?: () => void;
764
+ /** Event handler for drawer expansion. */
738
765
  onDrawerExpand?: (e: any) => void;
766
+ /** Specifies whether to keep the drawer open. */
739
767
  keepDrawerOpen?: boolean;
768
+ /** Specifies additional actions for the drawer footer. */
740
769
  DrawerFooterActions?: any;
770
+ /** Specifies the item that was clicked. */
741
771
  clickedItem?: any;
772
+ /** Event handler for logo button click. */
742
773
  onLogoClick?: () => void;
774
+ /** Text labels for various UI elements. */
743
775
  texts?: {
776
+ /** Label for expand sidebar button. */
744
777
  expandSidebar?: string;
778
+ /** Label for collapse sidebar button. */
745
779
  collapseSidebar?: string;
746
780
  };
747
781
  };
package/dist/index.js CHANGED
@@ -1299,8 +1299,12 @@ var CodeBlock = function(_param) {
1299
1299
  };
1300
1300
  return /* @__PURE__ */ import_react8.default.createElement("div", {
1301
1301
  className: cn(widthStyles[width], "hawa-w-full hawa-flex-col hawa-items-center hawa-rounded hawa-bg-background hawa-text-left hawa-text-white sm:hawa-text-base")
1302
- }, tabs && /* @__PURE__ */ import_react8.default.createElement("div", {
1303
- className: "hawa-flex hawa-flex-row hawa-gap-2 hawa-rounded-t hawa-bg-gray-200 dark:hawa-bg-muted hawa-p-2 hawa-pb-0 hawa-text-foreground hawa-font-mono "
1302
+ }, fileName && /* @__PURE__ */ import_react8.default.createElement("div", {
1303
+ className: cn("hawa-flex hawa-flex-row hawa-gap-2 hawa-rounded-t dark:hawa-bg-muted hawa-p-2 hawa-py-0.5 hawa-pb-0 hawa-text-foreground hawa-font-mono", fileName && tabs ? "hawa-bg-gray-300 dark:hawa-bg-muted/50" : "hawa-bg-gray-200")
1304
+ }, /* @__PURE__ */ import_react8.default.createElement("div", {
1305
+ className: cn("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]")
1306
+ }, fileName)), tabs && /* @__PURE__ */ import_react8.default.createElement("div", {
1307
+ className: cn("hawa-flex hawa-flex-row hawa-gap-2 hawa-rounded-t hawa-bg-gray-200 dark:hawa-bg-muted hawa-p-2 hawa-pb-0 hawa-text-foreground hawa-font-mono", tabs && fileName && "hawa-rounded-t-none")
1304
1308
  }, tabs.map(function(tab, i) {
1305
1309
  return /* @__PURE__ */ import_react8.default.createElement("div", {
1306
1310
  key: i,
@@ -1311,11 +1315,7 @@ var CodeBlock = function(_param) {
1311
1315
  },
1312
1316
  className: cn("hawa-mb-1 hawa-transition-all 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] hover:hawa-bg-muted-foreground/20")
1313
1317
  }, tab.title));
1314
- })), fileName && /* @__PURE__ */ import_react8.default.createElement("div", {
1315
- className: "hawa-flex hawa-flex-row hawa-gap-2 hawa-rounded-t hawa-bg-gray-200 dark:hawa-bg-muted hawa-p-2 hawa-pb-0 hawa-text-foreground hawa-font-mono"
1316
- }, /* @__PURE__ */ import_react8.default.createElement("div", {
1317
- className: cn("hawa-mb-1 mono hawa-w-full hawa-max-w-[52px] hawa-rounded-inner hawa-p-2 hawa-py-1 hawa-text-center hawa-text-[1rem]")
1318
- }, fileName)), /* @__PURE__ */ import_react8.default.createElement("pre", null, /* @__PURE__ */ import_react8.default.createElement("div", {
1318
+ })), /* @__PURE__ */ import_react8.default.createElement("pre", null, /* @__PURE__ */ import_react8.default.createElement("div", {
1319
1319
  className: cn("hawa-relative hawa-flex hawa-w-full hawa-flex-row hawa-border hawa-items-start hawa-justify-between hawa-bg-foreground/5 hawa-p-0 hawa-text-left hawa-text-sm sm:hawa-text-base ", tabs || fileName ? "hawa-rounded-b hawa-rounded-t-none" : "hawa-rounded")
1320
1320
  }, /* @__PURE__ */ import_react8.default.createElement(import_prism_react_renderer.Highlight, {
1321
1321
  theme: theme,
@@ -1849,8 +1849,16 @@ function Skeleton(_param) {
1849
1849
  "className",
1850
1850
  "animation"
1851
1851
  ]);
1852
+ var animationStyles = {
1853
+ none: "hawa-rounded hawa-bg-muted",
1854
+ pulse: "hawa-animate-pulse hawa-rounded hawa-bg-muted",
1855
+ 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"
1856
+ };
1852
1857
  return /* @__PURE__ */ import_react11.default.createElement("div", _object_spread({
1853
- className: cn(animation === "pulse" ? "hawa-animate-pulse hawa-rounded hawa-bg-muted" : "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", className)
1858
+ className: cn(animationStyles[animation], // animation === "pulse"
1859
+ // ? "hawa-animate-pulse hawa-rounded hawa-bg-muted"
1860
+ // : "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",
1861
+ className)
1854
1862
  }, props));
1855
1863
  }
1856
1864
  {}// components/elements/Chip.tsx
@@ -4315,7 +4323,7 @@ var Input = function(_param) {
4315
4323
  auto: ""
4316
4324
  };
4317
4325
  var defaultStyle = "hawa-flex hawa-max-h-fit hawa-relative hawa-flex-col hawa-justify-center hawa-gap-0";
4318
- var defaultInputStyle = "hawa-block hawa-w-full hawa-rounded hawa-border hawa-transition-all hawa-bg-background hawa-p-2 hawa-text-sm hawa-text-black dark:hawa-text-white ";
4326
+ var defaultInputStyle = "hawa-block hawa-w-full hawa-rounded hawa-border hawa-transition-all hawa-bg-background hawa-p-2 hawa-text-sm ";
4319
4327
  return /* @__PURE__ */ import_react17.default.createElement("div", {
4320
4328
  className: cn(defaultStyle, marginStyles[margin], widthStyles[width], props.containerClassName, "hawa-w-full hawa-gap-2")
4321
4329
  }, props.label && /* @__PURE__ */ import_react17.default.createElement(Label, null, props.label), props.isLoading ? /* @__PURE__ */ import_react17.default.createElement(Skeleton, {
@@ -4327,7 +4335,7 @@ var Input = function(_param) {
4327
4335
  }, props.icon && /* @__PURE__ */ import_react17.default.createElement("div", {
4328
4336
  className: "hawa-absolute hawa-left-3 hawa-top-1/2 hawa--translate-y-1/2"
4329
4337
  }, props.icon), /* @__PURE__ */ import_react17.default.createElement("input", {
4330
- className: cn(defaultInputStyle, props.icon && "hawa-pl-10", "focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-0", preview && "hawa-border-transparent hawa-bg-transparent hawa-px-0", (_props_inputProps = props.inputProps) === null || _props_inputProps === void 0 ? void 0 : _props_inputProps.className),
4338
+ className: cn(defaultInputStyle, "hawa-text-black dark:hawa-text-white", props.icon && "hawa-pl-10", "focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-0", preview && "hawa-border-transparent hawa-bg-transparent hawa-px-0", (_props_inputProps = props.inputProps) === null || _props_inputProps === void 0 ? void 0 : _props_inputProps.className),
4331
4339
  onChange: props.onChange,
4332
4340
  autoComplete: props.autoComplete,
4333
4341
  value: props.value,
@@ -6144,7 +6152,6 @@ var SidebarItem = function(_param) {
6144
6152
  };
6145
6153
  // components/layout/AppLayout.tsx
6146
6154
  var import_react31 = __toESM(require("react"));
6147
- var import_clsx11 = __toESM(require("clsx"));
6148
6155
  // components/hooks/useBreakpoint.ts
6149
6156
  var import_react30 = require("react");
6150
6157
  var useBreakpoint = function() {
@@ -6228,9 +6235,9 @@ var AppLayout = function(_param) {
6228
6235
  return /* @__PURE__ */ import_react31.default.createElement("div", {
6229
6236
  className: "hawa-fixed hawa-left-0"
6230
6237
  }, props.topBar && /* @__PURE__ */ import_react31.default.createElement("div", {
6231
- className: (0, import_clsx11.default)("hawa-fixed hawa-left-0 hawa-right-0 hawa-top-0 hawa-z-30 hawa-flex hawa-h-14 hawa-w-full hawa-items-center hawa-justify-between hawa-bg-primary-foreground hawa-p-2", isRTL ? "hawa-flex-row-reverse" : "hawa-flex-row")
6238
+ className: cn("hawa-fixed hawa-left-0 hawa-right-0 hawa-top-0 hawa-z-30 hawa-flex hawa-h-14 hawa-w-full hawa-items-center hawa-justify-between hawa-bg-primary-foreground hawa-p-2", isRTL ? "hawa-flex-row-reverse" : "hawa-flex-row")
6232
6239
  }, size > 600 ? /* @__PURE__ */ import_react31.default.createElement("div", {
6233
- className: (0, import_clsx11.default)("dark:hawa-text-white", isRTL ? [
6240
+ className: cn("dark:hawa-text-white", isRTL ? [
6234
6241
  size > 600 ? "hawa-mr-14" : "hawa-mr-2",
6235
6242
  keepOpen ? "hawa-mr-40" : ""
6236
6243
  ] : [
@@ -6266,7 +6273,7 @@ var AppLayout = function(_param) {
6266
6273
  }))), props.pageTitle ? /* @__PURE__ */ import_react31.default.createElement("div", {
6267
6274
  className: "hawa-text-sm"
6268
6275
  }, props.pageTitle) : /* @__PURE__ */ import_react31.default.createElement("div", null)), /* @__PURE__ */ import_react31.default.createElement("div", {
6269
- className: (0, import_clsx11.default)("hawa-flex hawa-gap-2 dark:hawa-text-white", isRTL ? "hawa-flex-row-reverse" : "hawa-flex-row")
6276
+ className: cn("hawa-flex hawa-gap-2 dark:hawa-text-white", isRTL ? "hawa-flex-row-reverse" : "hawa-flex-row")
6270
6277
  }, size > 600 ? /* @__PURE__ */ import_react31.default.createElement("div", {
6271
6278
  className: isRTL ? "hawa-text-left hawa-text-xs" : "hawa-text-right hawa-text-xs"
6272
6279
  }, /* @__PURE__ */ import_react31.default.createElement("div", {
@@ -6299,7 +6306,7 @@ var AppLayout = function(_param) {
6299
6306
  clipRule: "evenodd"
6300
6307
  })))
6301
6308
  }))), /* @__PURE__ */ import_react31.default.createElement("div", {
6302
- className: (0, import_clsx11.default)("hawa-fixed hawa-z-40 hawa-flex hawa-flex-col hawa-justify-between hawa-overflow-x-clip hawa-transition-all", design === "floating" ? isRTL ? "hawa-right-5 hawa-top-5" : "hawa-bottom-5 hawa-left-5 hawa-top-5" : isRTL ? "hawa-right-0 hawa-top-0 hawa-h-full" : "hawa-left-0 hawa-top-0 hawa-h-full"),
6309
+ className: cn("hawa-fixed hawa-z-40 hawa-flex hawa-flex-col hawa-justify-between hawa-overflow-x-clip hawa-transition-all", design === "floating" ? isRTL ? "hawa-right-5 hawa-top-5" : "hawa-bottom-5 hawa-left-5 hawa-top-5" : isRTL ? "hawa-right-0 hawa-top-0 hawa-h-full" : "hawa-left-0 hawa-top-0 hawa-h-full"),
6303
6310
  style: {
6304
6311
  width: size > 600 ? openSideMenu ? "".concat(drawerSizeStyle["opened"][drawerSize], "px") : "".concat(drawerSizeStyle["closed"][drawerSize], "px") : openSideMenu ? "".concat(drawerSizeStyle["opened"][drawerSize], "px") : "0px"
6305
6312
  },
@@ -6318,19 +6325,19 @@ var AppLayout = function(_param) {
6318
6325
  }, /* @__PURE__ */ import_react31.default.createElement("div", {
6319
6326
  onClick: props.onLogoClick,
6320
6327
  dir: direction,
6321
- className: "hawa-fixed hawa-z-50 hawa-mb-2 hawa-flex hawa-h-14 hawa-w-full hawa-flex-row hawa-items-center hawa-justify-center hawa-bg-primary-foreground hawa-transition-all",
6328
+ className: cn("hawa-fixed hawa-z-50 hawa-mb-2 hawa-flex hawa-h-14 hawa-w-full hawa-flex-row hawa-items-center hawa-justify-center hawa-bg-primary-foreground hawa-transition-all", props.onLogoClick && "hawa-cursor-pointer"),
6322
6329
  style: {
6323
6330
  width: size > 600 ? "".concat(openSideMenu ? openDrawerWidth : 56, "px") : "".concat(openSideMenu ? openDrawerWidth : 0, "px")
6324
6331
  }
6325
6332
  }, /* @__PURE__ */ import_react31.default.createElement("img", {
6326
- className: (0, import_clsx11.default)("hawa-h-9 hawa-opacity-0 hawa-transition-all", !openSideMenu ? "hawa-invisible hawa-opacity-0" : "hawa-visible hawa-opacity-100"),
6333
+ className: cn("hawa-h-9 hawa-opacity-0 hawa-transition-all", !openSideMenu ? "hawa-invisible hawa-opacity-0" : "hawa-visible hawa-opacity-100"),
6327
6334
  src: props.logoLink
6328
6335
  }), size > 600 ? /* @__PURE__ */ import_react31.default.createElement("img", {
6329
- className: (0, import_clsx11.default)("hawa-fixed hawa-h-9 hawa-transition-all", // isRTL ? "right-2.5" : "left-2.5",
6336
+ className: cn("hawa-fixed hawa-h-9 hawa-transition-all", // isRTL ? "right-2.5" : "left-2.5",
6330
6337
  design === "floating" ? isRTL ? "hawa-right-7.5 hawa-top-7" : "hawa-left-7.5 hawa-top-7" : isRTL ? "hawa-right-2.5 hawa-top-2.5" : "hawa-left-2.5 hawa-top-2.5", openSideMenu ? "hawa-invisible hawa-opacity-0" : "hawa-visible hawa-opacity-100"),
6331
6338
  src: props.logoSymbol
6332
6339
  }) : null), /* @__PURE__ */ import_react31.default.createElement("div", {
6333
- className: (0, import_clsx11.default)("hawa-fixed hawa-bottom-14 hawa-bg-primary-foreground hawa-p-2 hawa-py-2 hawa-transition-all", design === "floating" ? "hawa-top-[76px]" : "hawa-top-14", openSideMenu ? "hawa-overflow-auto" : "hawa-overflow-hidden"),
6340
+ className: cn("hawa-fixed hawa-bottom-14 hawa-bg-primary-foreground hawa-p-2 hawa-py-2 hawa-transition-all", design === "floating" ? "hawa-top-[76px]" : "hawa-top-14", openSideMenu ? "hawa-overflow-auto" : "hawa-overflow-hidden"),
6334
6341
  style: {
6335
6342
  height: design === "floating" ? "calc(100% - 152px)" : "calc(100% - 112px)",
6336
6343
  width: size > 600 ? "".concat(openSideMenu ? openDrawerWidth : 56, "px") : "".concat(openSideMenu ? openDrawerWidth : 0, "px")
@@ -6355,7 +6362,7 @@ var AppLayout = function(_param) {
6355
6362
  isOpen: openSideMenu,
6356
6363
  items: props.drawerItems
6357
6364
  })), /* @__PURE__ */ import_react31.default.createElement("div", {
6358
- className: (0, import_clsx11.default)("hawa-fixed hawa-flex hawa-h-14 hawa-w-full hawa-items-center hawa-justify-center hawa-gap-2 hawa-overflow-clip hawa-bg-primary-foreground hawa-transition-all", direction === "rtl" ? "hawa-flex-row-reverse" : "hawa-flex-row", design === "floating" ? "hawa-bottom-5" : "hawa-bottom-0"),
6365
+ className: cn("hawa-fixed hawa-flex hawa-h-14 hawa-w-full hawa-items-center hawa-justify-center hawa-gap-2 hawa-overflow-clip hawa-bg-primary-foreground hawa-transition-all", direction === "rtl" ? "hawa-flex-row-reverse" : "hawa-flex-row", design === "floating" ? "hawa-bottom-5" : "hawa-bottom-0"),
6359
6366
  style: {
6360
6367
  width: size > 600 ? "".concat(openSideMenu ? openDrawerWidth : 56, "px") : "".concat(openSideMenu ? openDrawerWidth : 0, "px")
6361
6368
  }
@@ -6373,7 +6380,7 @@ var AppLayout = function(_param) {
6373
6380
  },
6374
6381
  size: "smallIcon"
6375
6382
  }, /* @__PURE__ */ import_react31.default.createElement("svg", {
6376
- className: (0, import_clsx11.default)("hawa-h-6 hawa-w-6 hawa-shrink-0 hawa-text-primary hawa-transition-all disabled:hawa-bg-gray-200 ", keepOpen ? isRTL ? "hawa--rotate-90" : "hawa-rotate-90" : isRTL ? "hawa-rotate-90" : "hawa--rotate-90"),
6383
+ className: cn("hawa-h-6 hawa-w-6 hawa-shrink-0 hawa-text-primary hawa-transition-all disabled:hawa-bg-gray-200 ", keepOpen ? isRTL ? "hawa--rotate-90" : "hawa-rotate-90" : isRTL ? "hawa-rotate-90" : "hawa--rotate-90"),
6377
6384
  fill: "currentColor",
6378
6385
  viewBox: "0 0 20 20"
6379
6386
  }, /* @__PURE__ */ import_react31.default.createElement("path", {
@@ -7282,7 +7289,7 @@ var CodeConfirmation = function(props) {
7282
7289
  };
7283
7290
  // components/blocks/feedback/UserReferralSource.tsx
7284
7291
  var import_react40 = __toESM(require("react"));
7285
- var import_clsx12 = __toESM(require("clsx"));
7292
+ var import_clsx11 = __toESM(require("clsx"));
7286
7293
  var UserReferralSource = function(_param) {
7287
7294
  var _param_position = _param.position, position = _param_position === void 0 ? "bottom-right" : _param_position, _param_options = _param.options, options = _param_options === void 0 ? [] : _param_options, props = _object_without_properties(_param, [
7288
7295
  "position",
@@ -7319,7 +7326,7 @@ var UserReferralSource = function(_param) {
7319
7326
  };
7320
7327
  return /* @__PURE__ */ import_react40.default.createElement(Card, {
7321
7328
  ref: popUpRef,
7322
- className: (0, import_clsx12.default)("hawa-fixed hawa-bottom-4 hawa-p-0 ", boxPosition[position])
7329
+ className: (0, import_clsx11.default)("hawa-fixed hawa-bottom-4 hawa-p-0 ", boxPosition[position])
7323
7330
  }, /* @__PURE__ */ import_react40.default.createElement("button", {
7324
7331
  type: "button",
7325
7332
  className: "hawa-absolute hawa-right-2 hawa-top-2 hawa-inline-flex hawa-h-8 hawa-w-8 hawa-rounded hawa-p-1.5 hawa-text-gray-400 hawa-transition-all hover:hawa-bg-gray-100 hover:hawa-text-gray-900 focus:hawa-ring-2 focus:hawa-ring-gray-300 dark:hawa-bg-gray-800 dark:hawa-text-gray-500 dark:hover:hawa-bg-gray-700 dark:hover:hawa-text-white",
@@ -7340,7 +7347,7 @@ var UserReferralSource = function(_param) {
7340
7347
  }))), /* @__PURE__ */ import_react40.default.createElement(CardContent, {
7341
7348
  headless: true
7342
7349
  }, /* @__PURE__ */ import_react40.default.createElement("div", {
7343
- className: (0, import_clsx12.default)("hawa-flex hawa-flex-col hawa-gap-4", closed ? "hawa-opacity-0" : "hawa-opacity-100")
7350
+ className: (0, import_clsx11.default)("hawa-flex hawa-flex-col hawa-gap-4", closed ? "hawa-opacity-0" : "hawa-opacity-100")
7344
7351
  }, /* @__PURE__ */ import_react40.default.createElement("div", {
7345
7352
  className: "hawa-mt-4 hawa-font-bold"
7346
7353
  }, props.question), /* @__PURE__ */ import_react40.default.createElement("div", {
@@ -7354,7 +7361,7 @@ var UserReferralSource = function(_param) {
7354
7361
  };
7355
7362
  // components/blocks/feedback/FeedbackRating.tsx
7356
7363
  var import_react41 = __toESM(require("react"));
7357
- var import_clsx13 = __toESM(require("clsx"));
7364
+ var import_clsx12 = __toESM(require("clsx"));
7358
7365
  var FeedbackRating = function(_param) {
7359
7366
  var _param_position = _param.position, position = _param_position === void 0 ? "bottom-right" : _param_position, props = _object_without_properties(_param, [
7360
7367
  "position"
@@ -7390,9 +7397,9 @@ var FeedbackRating = function(_param) {
7390
7397
  };
7391
7398
  return /* @__PURE__ */ import_react41.default.createElement("div", {
7392
7399
  ref: popUpRef,
7393
- className: (0, import_clsx13.default)(props.banner ? "hawa-w-full hawa-left-0 hawa-fixed hawa-bottom-0" : "hawa-fixed hawa-bottom-4 ", boxPosition[position])
7400
+ className: (0, import_clsx12.default)(props.banner ? "hawa-w-full hawa-left-0 hawa-fixed hawa-bottom-0 hawa-px-0 md:hawa-px-4" : "hawa-fixed hawa-bottom-4 ", boxPosition[position])
7394
7401
  }, /* @__PURE__ */ import_react41.default.createElement("div", {
7395
- className: (0, import_clsx13.default)("hawa-relative hawa-flex hawa-w-full hawa-flex-col hawa-gap-2 hawa-rounded hawa-border hawa-bg-background hawa-p-4 hawa-shadow-md hawa-transition-all", closed ? "hawa-opacity-0" : "hawa-opacity-100")
7402
+ className: (0, import_clsx12.default)("hawa-relative hawa-flex hawa-w-full hawa-flex-col hawa-gap-2 hawa-rounded hawa-border hawa-bg-background hawa-p-4 hawa-shadow-md hawa-transition-all", closed ? "hawa-opacity-0" : "hawa-opacity-100", props.banner && "hawa-rounded-none md:hawa-rounded hawa-px-4 md:hawa-px-64")
7396
7403
  }, /* @__PURE__ */ import_react41.default.createElement("div", {
7397
7404
  className: "hawa-absolute hawa-left-2 hawa-top-2 hawa-p-1.5 hawa-text-sm"
7398
7405
  }, props.title), /* @__PURE__ */ import_react41.default.createElement("button", {
@@ -7434,17 +7441,18 @@ var FeedbackRating = function(_param) {
7434
7441
  clearTimeout(timeoutDestroy);
7435
7442
  }, 5300);
7436
7443
  },
7437
- className: (0, import_clsx13.default)("hawa-w-full hawa-cursor-pointer hawa-rounded hawa-border hawa-p-4 hawa-text-center hawa-transition-all ", clickedOption === op ? "hawa-bg-gray-500 hawa-text-white" : "hawa-border hawa-bg-background hover:hawa-bg-gray-300 dark:hover:hawa-bg-gray-700")
7444
+ className: (0, import_clsx12.default)("hawa-w-full hawa-cursor-pointer hawa-rounded hawa-border hawa-p-4 hawa-text-center hawa-transition-all ", clickedOption === op ? "hawa-bg-gray-500 hawa-text-white" : "hawa-border hawa-bg-background hover:hawa-bg-gray-300 dark:hover:hawa-bg-gray-700")
7438
7445
  }, op);
7439
7446
  })), props.texts && /* @__PURE__ */ import_react41.default.createElement("div", {
7440
7447
  className: " hawa-flex hawa-flex-row hawa-justify-between hawa-text-xs"
7441
7448
  }, /* @__PURE__ */ import_react41.default.createElement("span", null, props.texts.least), /* @__PURE__ */ import_react41.default.createElement("span", null, props.texts.most)), answered && /* @__PURE__ */ import_react41.default.createElement("div", {
7442
7449
  className: "hawa-absolute hawa-left-0 hawa-top-0 hawa-gap-2 hawa-flex hawa-h-full hawa-w-full hawa-flex-col hawa-items-center hawa-justify-center hawa-rounded hawa-bg-black hawa-bg-opacity-80 hawa-p-4 hawa-text-center hawa-transition-all"
7443
7450
  }, /* @__PURE__ */ import_react41.default.createElement("span", {
7444
- className: "font-bold text-white"
7451
+ className: "hawa-font-bold hawa-text-white"
7445
7452
  }, "Thank you for your answer. This box will disappear in", " " + closingTimer, " seconds"), /* @__PURE__ */ import_react41.default.createElement("div", {
7446
7453
  className: "hawa-flex hawa-flex-row hawa-gap-2"
7447
7454
  }, /* @__PURE__ */ import_react41.default.createElement(Button, {
7455
+ variant: "secondary",
7448
7456
  onClick: function() {
7449
7457
  return slowClose();
7450
7458
  }
@@ -8089,7 +8097,7 @@ var ComparingPlans = function(props) {
8089
8097
  };
8090
8098
  // components/blocks/pricing/HorizontalPricing.tsx
8091
8099
  var import_react53 = __toESM(require("react"));
8092
- var import_clsx14 = __toESM(require("clsx"));
8100
+ var import_clsx13 = __toESM(require("clsx"));
8093
8101
  var HorizontalPricing = function(props) {
8094
8102
  var _ref = _sliced_to_array((0, import_react53.useState)(""), 2), selectedCard = _ref[0], setSelectedCard = _ref[1];
8095
8103
  var data = [
@@ -8137,7 +8145,7 @@ var HorizontalPricing = function(props) {
8137
8145
  id: d.title,
8138
8146
  className: "hawa-peer hawa-appearance-none"
8139
8147
  }), /* @__PURE__ */ import_react53.default.createElement("div", {
8140
- className: (0, import_clsx14.default)(selectedCard === d.title ? "peer-checked:hawa-border-blue-500" : "", "hawa-peer hawa-flex hawa-cursor-pointer hawa-items-center hawa-justify-between hawa-rounded-xl hawa-border hawa-bg-background hawa-px-5 hawa-py-4 hawa-shadow dark:hawa-text-white peer-checked:[&_.active]:hawa-block peer-checked:[&_.default]:hawa-hidden")
8148
+ className: (0, import_clsx13.default)(selectedCard === d.title ? "peer-checked:hawa-border-blue-500" : "", "hawa-peer hawa-flex hawa-cursor-pointer hawa-items-center hawa-justify-between hawa-rounded-xl hawa-border hawa-bg-background hawa-px-5 hawa-py-4 hawa-shadow dark:hawa-text-white peer-checked:[&_.active]:hawa-block peer-checked:[&_.default]:hawa-hidden")
8141
8149
  }, /* @__PURE__ */ import_react53.default.createElement("div", {
8142
8150
  className: "hawa-peer hawa-flex hawa-items-center hawa-gap-4"
8143
8151
  }, /* @__PURE__ */ import_react53.default.createElement(CheckIcons, null), /* @__PURE__ */ import_react53.default.createElement(CardText, {
package/dist/index.mjs CHANGED
@@ -636,34 +636,52 @@ var CodeBlock = ({
636
636
  "hawa-w-full hawa-flex-col hawa-items-center hawa-rounded hawa-bg-background hawa-text-left hawa-text-white sm:hawa-text-base"
637
637
  )
638
638
  },
639
- tabs && /* @__PURE__ */ React10.createElement("div", { className: "hawa-flex hawa-flex-row hawa-gap-2 hawa-rounded-t hawa-bg-gray-200 dark:hawa-bg-muted hawa-p-2 hawa-pb-0 hawa-text-foreground hawa-font-mono " }, tabs.map((tab, i) => /* @__PURE__ */ React10.createElement(
639
+ fileName && /* @__PURE__ */ React10.createElement(
640
640
  "div",
641
641
  {
642
- key: i,
643
642
  className: cn(
644
- selectedTab === i ? " hawa-border-b-2 hawa-border-primary" : "hawa-bg-transparent"
643
+ "hawa-flex hawa-flex-row hawa-gap-2 hawa-rounded-t dark:hawa-bg-muted hawa-p-2 hawa-py-0.5 hawa-pb-0 hawa-text-foreground hawa-font-mono",
644
+ fileName && tabs ? "hawa-bg-gray-300 dark:hawa-bg-muted/50" : "hawa-bg-gray-200"
645
645
  )
646
646
  },
647
647
  /* @__PURE__ */ React10.createElement(
648
648
  "div",
649
649
  {
650
- onClick: () => setSelectedTab(i),
651
650
  className: cn(
652
- "hawa-mb-1 hawa-transition-all 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] hover:hawa-bg-muted-foreground/20"
651
+ "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]"
653
652
  )
654
653
  },
655
- tab.title
654
+ fileName
656
655
  )
657
- ))),
658
- fileName && /* @__PURE__ */ React10.createElement("div", { className: "hawa-flex hawa-flex-row hawa-gap-2 hawa-rounded-t hawa-bg-gray-200 dark:hawa-bg-muted hawa-p-2 hawa-pb-0 hawa-text-foreground hawa-font-mono" }, /* @__PURE__ */ React10.createElement(
656
+ ),
657
+ tabs && /* @__PURE__ */ React10.createElement(
659
658
  "div",
660
659
  {
661
660
  className: cn(
662
- "hawa-mb-1 mono hawa-w-full hawa-max-w-[52px] hawa-rounded-inner hawa-p-2 hawa-py-1 hawa-text-center hawa-text-[1rem]"
661
+ "hawa-flex hawa-flex-row hawa-gap-2 hawa-rounded-t hawa-bg-gray-200 dark:hawa-bg-muted hawa-p-2 hawa-pb-0 hawa-text-foreground hawa-font-mono",
662
+ tabs && fileName && "hawa-rounded-t-none"
663
663
  )
664
664
  },
665
- fileName
666
- )),
665
+ tabs.map((tab, i) => /* @__PURE__ */ React10.createElement(
666
+ "div",
667
+ {
668
+ key: i,
669
+ className: cn(
670
+ selectedTab === i ? " hawa-border-b-2 hawa-border-primary" : "hawa-bg-transparent"
671
+ )
672
+ },
673
+ /* @__PURE__ */ React10.createElement(
674
+ "div",
675
+ {
676
+ onClick: () => setSelectedTab(i),
677
+ className: cn(
678
+ "hawa-mb-1 hawa-transition-all 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] hover:hawa-bg-muted-foreground/20"
679
+ )
680
+ },
681
+ tab.title
682
+ )
683
+ ))
684
+ ),
667
685
  /* @__PURE__ */ React10.createElement("pre", null, /* @__PURE__ */ React10.createElement(
668
686
  "div",
669
687
  {
@@ -1266,11 +1284,19 @@ var Radio = ({
1266
1284
  // components/elements/Skeleton.tsx
1267
1285
  import React17 from "react";
1268
1286
  function Skeleton({ className, animation = "pulse", ...props }) {
1287
+ const animationStyles = {
1288
+ none: "hawa-rounded hawa-bg-muted",
1289
+ pulse: "hawa-animate-pulse hawa-rounded hawa-bg-muted",
1290
+ 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"
1291
+ };
1269
1292
  return /* @__PURE__ */ React17.createElement(
1270
1293
  "div",
1271
1294
  {
1272
1295
  className: cn(
1273
- animation === "pulse" ? "hawa-animate-pulse hawa-rounded hawa-bg-muted" : "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",
1296
+ animationStyles[animation],
1297
+ // animation === "pulse"
1298
+ // ? "hawa-animate-pulse hawa-rounded hawa-bg-muted"
1299
+ // : "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",
1274
1300
  className
1275
1301
  ),
1276
1302
  ...props
@@ -3881,7 +3907,7 @@ var Input = ({
3881
3907
  auto: ""
3882
3908
  };
3883
3909
  let defaultStyle = "hawa-flex hawa-max-h-fit hawa-relative hawa-flex-col hawa-justify-center hawa-gap-0";
3884
- let defaultInputStyle = "hawa-block hawa-w-full hawa-rounded hawa-border hawa-transition-all hawa-bg-background hawa-p-2 hawa-text-sm hawa-text-black dark:hawa-text-white ";
3910
+ let defaultInputStyle = "hawa-block hawa-w-full hawa-rounded hawa-border hawa-transition-all hawa-bg-background hawa-p-2 hawa-text-sm ";
3885
3911
  return /* @__PURE__ */ React28.createElement(
3886
3912
  "div",
3887
3913
  {
@@ -3907,6 +3933,7 @@ var Input = ({
3907
3933
  {
3908
3934
  className: cn(
3909
3935
  defaultInputStyle,
3936
+ "hawa-text-black dark:hawa-text-white",
3910
3937
  props.icon && "hawa-pl-10",
3911
3938
  "focus-visible:hawa-outline-none focus-visible:hawa-ring-2 focus-visible:hawa-ring-ring focus-visible:hawa-ring-offset-0",
3912
3939
  preview && "hawa-border-transparent hawa-bg-transparent hawa-px-0",
@@ -5850,7 +5877,6 @@ var SidebarItem = ({
5850
5877
 
5851
5878
  // components/layout/AppLayout.tsx
5852
5879
  import React50, { useEffect as useEffect11, useRef as useRef6, useState as useState18 } from "react";
5853
- import clsx11 from "clsx";
5854
5880
 
5855
5881
  // components/hooks/useBreakpoint.ts
5856
5882
  import { useState as useState17, useEffect as useEffect10 } from "react";
@@ -5929,7 +5955,7 @@ var AppLayout = ({
5929
5955
  return /* @__PURE__ */ React50.createElement("div", { className: "hawa-fixed hawa-left-0" }, props.topBar && /* @__PURE__ */ React50.createElement(
5930
5956
  "div",
5931
5957
  {
5932
- className: clsx11(
5958
+ className: cn(
5933
5959
  "hawa-fixed hawa-left-0 hawa-right-0 hawa-top-0 hawa-z-30 hawa-flex hawa-h-14 hawa-w-full hawa-items-center hawa-justify-between hawa-bg-primary-foreground hawa-p-2",
5934
5960
  isRTL ? "hawa-flex-row-reverse" : "hawa-flex-row"
5935
5961
  )
@@ -5937,7 +5963,7 @@ var AppLayout = ({
5937
5963
  size > 600 ? /* @__PURE__ */ React50.createElement(
5938
5964
  "div",
5939
5965
  {
5940
- className: clsx11(
5966
+ className: cn(
5941
5967
  "dark:hawa-text-white",
5942
5968
  isRTL ? [
5943
5969
  size > 600 ? "hawa-mr-14" : "hawa-mr-2",
@@ -5995,7 +6021,7 @@ var AppLayout = ({
5995
6021
  /* @__PURE__ */ React50.createElement(
5996
6022
  "div",
5997
6023
  {
5998
- className: clsx11(
6024
+ className: cn(
5999
6025
  "hawa-flex hawa-gap-2 dark:hawa-text-white",
6000
6026
  isRTL ? "hawa-flex-row-reverse" : "hawa-flex-row"
6001
6027
  )
@@ -6044,7 +6070,7 @@ var AppLayout = ({
6044
6070
  ), /* @__PURE__ */ React50.createElement(
6045
6071
  "div",
6046
6072
  {
6047
- className: clsx11(
6073
+ className: cn(
6048
6074
  "hawa-fixed hawa-z-40 hawa-flex hawa-flex-col hawa-justify-between hawa-overflow-x-clip hawa-transition-all",
6049
6075
  design === "floating" ? isRTL ? "hawa-right-5 hawa-top-5" : "hawa-bottom-5 hawa-left-5 hawa-top-5" : isRTL ? "hawa-right-0 hawa-top-0 hawa-h-full" : "hawa-left-0 hawa-top-0 hawa-h-full"
6050
6076
  ),
@@ -6069,7 +6095,10 @@ var AppLayout = ({
6069
6095
  {
6070
6096
  onClick: props.onLogoClick,
6071
6097
  dir: direction,
6072
- className: "hawa-fixed hawa-z-50 hawa-mb-2 hawa-flex hawa-h-14 hawa-w-full hawa-flex-row hawa-items-center hawa-justify-center hawa-bg-primary-foreground hawa-transition-all",
6098
+ className: cn(
6099
+ "hawa-fixed hawa-z-50 hawa-mb-2 hawa-flex hawa-h-14 hawa-w-full hawa-flex-row hawa-items-center hawa-justify-center hawa-bg-primary-foreground hawa-transition-all",
6100
+ props.onLogoClick && "hawa-cursor-pointer"
6101
+ ),
6073
6102
  style: {
6074
6103
  width: size > 600 ? `${openSideMenu ? openDrawerWidth : 56}px` : `${openSideMenu ? openDrawerWidth : 0}px`
6075
6104
  }
@@ -6077,7 +6106,7 @@ var AppLayout = ({
6077
6106
  /* @__PURE__ */ React50.createElement(
6078
6107
  "img",
6079
6108
  {
6080
- className: clsx11(
6109
+ className: cn(
6081
6110
  "hawa-h-9 hawa-opacity-0 hawa-transition-all",
6082
6111
  !openSideMenu ? "hawa-invisible hawa-opacity-0" : "hawa-visible hawa-opacity-100"
6083
6112
  ),
@@ -6087,7 +6116,7 @@ var AppLayout = ({
6087
6116
  size > 600 ? /* @__PURE__ */ React50.createElement(
6088
6117
  "img",
6089
6118
  {
6090
- className: clsx11(
6119
+ className: cn(
6091
6120
  "hawa-fixed hawa-h-9 hawa-transition-all",
6092
6121
  // isRTL ? "right-2.5" : "left-2.5",
6093
6122
  design === "floating" ? isRTL ? "hawa-right-7.5 hawa-top-7" : "hawa-left-7.5 hawa-top-7" : isRTL ? "hawa-right-2.5 hawa-top-2.5" : "hawa-left-2.5 hawa-top-2.5",
@@ -6100,7 +6129,7 @@ var AppLayout = ({
6100
6129
  /* @__PURE__ */ React50.createElement(
6101
6130
  "div",
6102
6131
  {
6103
- className: clsx11(
6132
+ className: cn(
6104
6133
  "hawa-fixed hawa-bottom-14 hawa-bg-primary-foreground hawa-p-2 hawa-py-2 hawa-transition-all",
6105
6134
  design === "floating" ? "hawa-top-[76px]" : "hawa-top-14",
6106
6135
  openSideMenu ? "hawa-overflow-auto" : "hawa-overflow-hidden"
@@ -6135,7 +6164,7 @@ var AppLayout = ({
6135
6164
  /* @__PURE__ */ React50.createElement(
6136
6165
  "div",
6137
6166
  {
6138
- className: clsx11(
6167
+ className: cn(
6139
6168
  "hawa-fixed hawa-flex hawa-h-14 hawa-w-full hawa-items-center hawa-justify-center hawa-gap-2 hawa-overflow-clip hawa-bg-primary-foreground hawa-transition-all",
6140
6169
  direction === "rtl" ? "hawa-flex-row-reverse" : "hawa-flex-row",
6141
6170
  design === "floating" ? "hawa-bottom-5" : "hawa-bottom-0"
@@ -6167,7 +6196,7 @@ var AppLayout = ({
6167
6196
  /* @__PURE__ */ React50.createElement(
6168
6197
  "svg",
6169
6198
  {
6170
- className: clsx11(
6199
+ className: cn(
6171
6200
  "hawa-h-6 hawa-w-6 hawa-shrink-0 hawa-text-primary hawa-transition-all disabled:hawa-bg-gray-200 ",
6172
6201
  keepOpen ? isRTL ? "hawa--rotate-90" : "hawa-rotate-90" : isRTL ? "hawa-rotate-90" : "hawa--rotate-90"
6173
6202
  ),
@@ -7102,7 +7131,7 @@ var CodeConfirmation = (props) => {
7102
7131
 
7103
7132
  // components/blocks/feedback/UserReferralSource.tsx
7104
7133
  import React59, { useEffect as useEffect12, useRef as useRef7, useState as useState22 } from "react";
7105
- import clsx12 from "clsx";
7134
+ import clsx11 from "clsx";
7106
7135
  var UserReferralSource = ({
7107
7136
  position = "bottom-right",
7108
7137
  options = [],
@@ -7139,7 +7168,7 @@ var UserReferralSource = ({
7139
7168
  Card,
7140
7169
  {
7141
7170
  ref: popUpRef,
7142
- className: clsx12(
7171
+ className: clsx11(
7143
7172
  "hawa-fixed hawa-bottom-4 hawa-p-0 ",
7144
7173
  boxPosition[position]
7145
7174
  )
@@ -7174,7 +7203,7 @@ var UserReferralSource = ({
7174
7203
  /* @__PURE__ */ React59.createElement(CardContent, { headless: true }, /* @__PURE__ */ React59.createElement(
7175
7204
  "div",
7176
7205
  {
7177
- className: clsx12(
7206
+ className: clsx11(
7178
7207
  "hawa-flex hawa-flex-col hawa-gap-4",
7179
7208
  closed ? "hawa-opacity-0" : "hawa-opacity-100"
7180
7209
  )
@@ -7188,7 +7217,7 @@ var UserReferralSource = ({
7188
7217
 
7189
7218
  // components/blocks/feedback/FeedbackRating.tsx
7190
7219
  import React60, { useEffect as useEffect13, useRef as useRef8, useState as useState23 } from "react";
7191
- import clsx13 from "clsx";
7220
+ import clsx12 from "clsx";
7192
7221
  var FeedbackRating = ({
7193
7222
  position = "bottom-right",
7194
7223
  ...props
@@ -7224,17 +7253,18 @@ var FeedbackRating = ({
7224
7253
  "div",
7225
7254
  {
7226
7255
  ref: popUpRef,
7227
- className: clsx13(
7228
- props.banner ? "hawa-w-full hawa-left-0 hawa-fixed hawa-bottom-0" : "hawa-fixed hawa-bottom-4 ",
7256
+ className: clsx12(
7257
+ props.banner ? "hawa-w-full hawa-left-0 hawa-fixed hawa-bottom-0 hawa-px-0 md:hawa-px-4" : "hawa-fixed hawa-bottom-4 ",
7229
7258
  boxPosition[position]
7230
7259
  )
7231
7260
  },
7232
7261
  /* @__PURE__ */ React60.createElement(
7233
7262
  "div",
7234
7263
  {
7235
- className: clsx13(
7236
- "hawa-relative hawa-flex hawa-w-full hawa-flex-col hawa-gap-2 hawa-rounded hawa-border hawa-bg-background hawa-p-4 hawa-shadow-md hawa-transition-all",
7237
- closed ? "hawa-opacity-0" : "hawa-opacity-100"
7264
+ className: clsx12(
7265
+ "hawa-relative hawa-flex hawa-w-full hawa-flex-col hawa-gap-2 hawa-rounded hawa-border hawa-bg-background hawa-p-4 hawa-shadow-md hawa-transition-all",
7266
+ closed ? "hawa-opacity-0" : "hawa-opacity-100",
7267
+ props.banner && "hawa-rounded-none md:hawa-rounded hawa-px-4 md:hawa-px-64"
7238
7268
  )
7239
7269
  },
7240
7270
  /* @__PURE__ */ React60.createElement("div", { className: "hawa-absolute hawa-left-2 hawa-top-2 hawa-p-1.5 hawa-text-sm" }, props.title),
@@ -7286,7 +7316,7 @@ var FeedbackRating = ({
7286
7316
  clearTimeout(timeoutDestroy);
7287
7317
  }, 5300);
7288
7318
  },
7289
- className: clsx13(
7319
+ className: clsx12(
7290
7320
  "hawa-w-full hawa-cursor-pointer hawa-rounded hawa-border hawa-p-4 hawa-text-center hawa-transition-all ",
7291
7321
  clickedOption === op ? "hawa-bg-gray-500 hawa-text-white" : "hawa-border hawa-bg-background hover:hawa-bg-gray-300 dark:hover:hawa-bg-gray-700"
7292
7322
  )
@@ -7294,7 +7324,7 @@ var FeedbackRating = ({
7294
7324
  op
7295
7325
  ))),
7296
7326
  props.texts && /* @__PURE__ */ React60.createElement("div", { className: " hawa-flex hawa-flex-row hawa-justify-between hawa-text-xs" }, /* @__PURE__ */ React60.createElement("span", null, props.texts.least), /* @__PURE__ */ React60.createElement("span", null, props.texts.most)),
7297
- answered && /* @__PURE__ */ React60.createElement("div", { className: "hawa-absolute hawa-left-0 hawa-top-0 hawa-gap-2 hawa-flex hawa-h-full hawa-w-full hawa-flex-col hawa-items-center hawa-justify-center hawa-rounded hawa-bg-black hawa-bg-opacity-80 hawa-p-4 hawa-text-center hawa-transition-all" }, /* @__PURE__ */ React60.createElement("span", { className: "font-bold text-white" }, "Thank you for your answer. This box will disappear in", " " + closingTimer, " seconds"), /* @__PURE__ */ React60.createElement("div", { className: "hawa-flex hawa-flex-row hawa-gap-2" }, /* @__PURE__ */ React60.createElement(Button, { onClick: () => slowClose() }, "Close")))
7327
+ answered && /* @__PURE__ */ React60.createElement("div", { className: "hawa-absolute hawa-left-0 hawa-top-0 hawa-gap-2 hawa-flex hawa-h-full hawa-w-full hawa-flex-col hawa-items-center hawa-justify-center hawa-rounded hawa-bg-black hawa-bg-opacity-80 hawa-p-4 hawa-text-center hawa-transition-all" }, /* @__PURE__ */ React60.createElement("span", { className: "hawa-font-bold hawa-text-white" }, "Thank you for your answer. This box will disappear in", " " + closingTimer, " seconds"), /* @__PURE__ */ React60.createElement("div", { className: "hawa-flex hawa-flex-row hawa-gap-2" }, /* @__PURE__ */ React60.createElement(Button, { variant: "secondary", onClick: () => slowClose() }, "Close")))
7298
7328
  )
7299
7329
  );
7300
7330
  };
@@ -7874,7 +7904,7 @@ var ComparingPlans = (props) => {
7874
7904
 
7875
7905
  // components/blocks/pricing/HorizontalPricing.tsx
7876
7906
  import React72, { useState as useState26 } from "react";
7877
- import clsx14 from "clsx";
7907
+ import clsx13 from "clsx";
7878
7908
  var HorizontalPricing = (props) => {
7879
7909
  const [selectedCard, setSelectedCard] = useState26("");
7880
7910
  let data = [
@@ -7916,7 +7946,7 @@ var HorizontalPricing = (props) => {
7916
7946
  /* @__PURE__ */ React72.createElement(
7917
7947
  "div",
7918
7948
  {
7919
- className: clsx14(
7949
+ className: clsx13(
7920
7950
  selectedCard === d.title ? "peer-checked:hawa-border-blue-500" : "",
7921
7951
  "hawa-peer hawa-flex hawa-cursor-pointer hawa-items-center hawa-justify-between hawa-rounded-xl hawa-border hawa-bg-background hawa-px-5 hawa-py-4 hawa-shadow dark:hawa-text-white peer-checked:[&_.active]:hawa-block peer-checked:[&_.default]:hawa-hidden"
7922
7952
  )
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sikka/hawa",
3
- "version": "0.7.0-next",
3
+ "version": "0.7.2-next",
4
4
  "main": "./dist/index.js",
5
5
  "types": "./dist/index.d.ts",
6
6
  "exports": {