@sikka/hawa 0.26.22 → 0.26.23

package/dist/index.d.mts

@@ -17,6 +17,7 @@ import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
 import * as ProgressPrimitive from '@radix-ui/react-progress';
 import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
 import * as SliderPrimitive from '@radix-ui/react-slider';
+import { HighlightProps } from 'prism-react-renderer';
 import { EmblaOptionsType } from 'embla-carousel';
 import * as ToastPrimitives from '@radix-ui/react-toast';
 import * as MenubarPrimitive from '@radix-ui/react-menubar';
@@ -385,6 +386,7 @@ type AlertTypes = {
             variant: "outline" | "link" | "default" | "destructive" | "secondary" | "ghost";
         }
     ];
+    /** Removes the close button */
     persistent?: boolean;
     icon?: any;
     className?: any;
@@ -914,7 +916,7 @@ declare const ScrollIndicator: FC<ScrollIndicatorProps>;
 
 type CodeBlockTypes = {
     /** Specifies the programming language for syntax highlighting.*/
-    language?: string;
+    language?: HighlightProps["language"];
     /** Defines the width of the code block.*/
     width?: "full" | "md" | "sm";
     /** Array of tabs each containing a title and code content.*/
@@ -938,6 +940,7 @@ type CarouselProps = {
     autoplay?: boolean;
     autoplayInterval?: number;
     options?: EmblaOptionsType;
+    direction?: DirectionType;
 };
 declare const Carousel: React__default.FC<CarouselProps>;
 

package/dist/index.d.ts

@@ -17,6 +17,7 @@ import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
 import * as ProgressPrimitive from '@radix-ui/react-progress';
 import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
 import * as SliderPrimitive from '@radix-ui/react-slider';
+import { HighlightProps } from 'prism-react-renderer';
 import { EmblaOptionsType } from 'embla-carousel';
 import * as ToastPrimitives from '@radix-ui/react-toast';
 import * as MenubarPrimitive from '@radix-ui/react-menubar';
@@ -385,6 +386,7 @@ type AlertTypes = {
             variant: "outline" | "link" | "default" | "destructive" | "secondary" | "ghost";
         }
     ];
+    /** Removes the close button */
     persistent?: boolean;
     icon?: any;
     className?: any;
@@ -914,7 +916,7 @@ declare const ScrollIndicator: FC<ScrollIndicatorProps>;
 
 type CodeBlockTypes = {
     /** Specifies the programming language for syntax highlighting.*/
-    language?: string;
+    language?: HighlightProps["language"];
     /** Defines the width of the code block.*/
     width?: "full" | "md" | "sm";
     /** Array of tabs each containing a title and code content.*/
@@ -938,6 +940,7 @@ type CarouselProps = {
     autoplay?: boolean;
     autoplayInterval?: number;
     options?: EmblaOptionsType;
+    direction?: DirectionType;
 };
 declare const Carousel: React__default.FC<CarouselProps>;
 

package/dist/index.js

@@ -7094,6 +7094,8 @@ function useClipboard({ timeout = 2e3 } = {}) {
 }
 
 // elements/codeBlock/CodeBlock.tsx
+(typeof global !== "undefined" ? global : window).Prism = import_prism_react_renderer.Prism;
+require("prismjs/components/prism-bash");
 var CodeBlock = ({
   tabs,
   code,
@@ -7106,8 +7108,7 @@ var CodeBlock = ({
 }) => {
   const clipboard = useClipboard();
   const [selectedTab, setSelectedTab] = (0, import_react30.useState)(0);
-  const isDarkMode = props.forcedDarkMode || document.body.classList.contains("dark");
-  const theme = isDarkMode ? import_prism_react_renderer.themes.vsDark : import_prism_react_renderer.themes.vsLight;
+  const theme = import_prism_react_renderer.themes.oceanicNext;
   let widthStyles = {
     full: "hawa-w-full",
     md: "hawa-w-full hawa-max-w-md",
@@ -7127,15 +7128,15 @@ var CodeBlock = ({
       "div",
       {
         className: cn(
-          "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",
-          fileName && tabs ? "hawa-bg-gray-300 dark:hawa-bg-muted/50" : "hawa-bg-gray-200"
+          "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",
+          fileName && tabs ? "hawa-bg-primary/10" : "hawa-bg-primary/15"
         )
       },
       /* @__PURE__ */ import_react30.default.createElement(
         "div",
         {
           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]"
+            "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]"
           )
         },
         fileName
@@ -7145,7 +7146,8 @@ var CodeBlock = ({
       "div",
       {
         className: cn(
-          "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",
+          // hawa-bg-gray-300 dark:hawa-bg-red-600
+          "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",
           tabs && fileName && "hawa-rounded-t-none"
         )
       },
@@ -7162,7 +7164,7 @@ var CodeBlock = ({
           {
             onClick: () => setSelectedTab(i),
             className: cn(
-              "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"
+              "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"
             )
           },
           tab.title
@@ -7173,7 +7175,7 @@ var CodeBlock = ({
       "div",
       {
         className: cn(
-          "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 ",
+          "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 ",
           tabs || fileName ? "hawa-rounded-b hawa-rounded-t-none" : "hawa-rounded"
         )
       },
@@ -7202,12 +7204,12 @@ var CodeBlock = ({
             size: "icon",
             onClick: () => clipboard.copy(tabs ? tabs[selectedTab].code : code),
             variant: "outline",
-            className: "hawa-text-foreground hawa-opacity-50 sm:hawa-opacity-100"
+            className: "hawa-text-gray-200 hawa-opacity-50 "
           },
           /* @__PURE__ */ import_react30.default.createElement(
             "svg",
             {
-              "aria-label": "Copy Icon",
+              "aria-label": "Copy",
               stroke: "currentColor",
               fill: "none",
               strokeWidth: "2",
@@ -7234,11 +7236,13 @@ var Carousel = ({
   showArrows,
   options,
   autoplay,
+  direction = "ltr",
   autoplayInterval = 3e3,
   ...props
 }) => {
   const [emblaRef, emblaApi] = (0, import_embla_carousel_react.default)({
     ...options,
+    direction,
     loop: autoplay ? true : (options == null ? void 0 : options.loop) || false
   });
   const [selectedIndex, setSelectedIndex] = (0, import_react31.useState)(0);
@@ -7277,6 +7281,7 @@ var Carousel = ({
   ))))), /* @__PURE__ */ import_react31.default.createElement(
     Dots,
     {
+      direction,
       itemsLength: length,
       selectedIndex,
       onDotClick: (index) => emblaApi == null ? void 0 : emblaApi.scrollTo(index)
@@ -7291,22 +7296,34 @@ var Carousel = ({
     }
   ));
 };
-var Dots = ({ onDotClick, itemsLength, selectedIndex }) => {
+var Dots = ({
+  onDotClick,
+  itemsLength,
+  selectedIndex,
+  direction
+}) => {
   const arr = new Array(itemsLength).fill(0);
-  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) => {
-    const selected = index === selectedIndex;
-    return /* @__PURE__ */ import_react31.default.createElement(
-      "div",
-      {
-        key: index,
-        onClick: () => onDotClick(index),
-        className: cn(
-          "hawa-h-2 hawa-rounded-full hawa-bg-primary hawa-transition-all hawa-duration-300 hover:hawa-cursor-pointer",
-          !selected ? "hawa-w-2 hawa-opacity-50" : "hawa-w-6 hawa-opacity-100"
-        )
-      }
-    );
-  }));
+  return /* @__PURE__ */ import_react31.default.createElement(
+    "div",
+    {
+      dir: direction,
+      className: "hawa-z-50 hawa-my-2 hawa-flex hawa-justify-center hawa-gap-1"
+    },
+    arr.map((_, index) => {
+      const selected = index === selectedIndex;
+      return /* @__PURE__ */ import_react31.default.createElement(
+        "div",
+        {
+          key: index,
+          onClick: () => onDotClick(index),
+          className: cn(
+            "hawa-h-2 hawa-rounded-full hawa-bg-primary hawa-transition-all hawa-duration-300 hover:hawa-cursor-pointer",
+            !selected ? "hawa-w-2 hawa-opacity-50" : "hawa-w-6 hawa-opacity-100"
+          )
+        }
+      );
+    })
+  );
 };
 var CarouselControls = (props) => {
   return /* @__PURE__ */ import_react31.default.createElement("div", { className: "hawa-flex hawa-justify-end hawa-gap-2 " }, /* @__PURE__ */ import_react31.default.createElement(

package/dist/index.mjs

@@ -1,3 +1,11 @@
+var __require = /* @__PURE__ */ ((x) => typeof require !== "undefined" ? require : typeof Proxy !== "undefined" ? new Proxy(x, {
+  get: (a, b) => (typeof require !== "undefined" ? require : a)[b]
+}) : x)(function(x) {
+  if (typeof require !== "undefined")
+    return require.apply(this, arguments);
+  throw Error('Dynamic require of "' + x + '" is not supported');
+});
+
 // elements/card/Card.tsx
 import * as React from "react";
 
@@ -6839,7 +6847,11 @@ var ScrollIndicator = ({
 
 // elements/codeBlock/CodeBlock.tsx
 import React54, { useState as useState16 } from "react";
-import { Highlight, themes } from "prism-react-renderer";
+import {
+  Highlight,
+  themes,
+  Prism
+} from "prism-react-renderer";
 
 // hooks/useClipboard.ts
 import { useState as useState15 } from "react";
@@ -6868,6 +6880,8 @@ function useClipboard({ timeout = 2e3 } = {}) {
 }
 
 // elements/codeBlock/CodeBlock.tsx
+(typeof global !== "undefined" ? global : window).Prism = Prism;
+__require("prismjs/components/prism-bash");
 var CodeBlock = ({
   tabs,
   code,
@@ -6880,8 +6894,7 @@ var CodeBlock = ({
 }) => {
   const clipboard = useClipboard();
   const [selectedTab, setSelectedTab] = useState16(0);
-  const isDarkMode = props.forcedDarkMode || document.body.classList.contains("dark");
-  const theme = isDarkMode ? themes.vsDark : themes.vsLight;
+  const theme = themes.oceanicNext;
   let widthStyles = {
     full: "hawa-w-full",
     md: "hawa-w-full hawa-max-w-md",
@@ -6901,15 +6914,15 @@ var CodeBlock = ({
       "div",
       {
         className: cn(
-          "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",
-          fileName && tabs ? "hawa-bg-gray-300 dark:hawa-bg-muted/50" : "hawa-bg-gray-200"
+          "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",
+          fileName && tabs ? "hawa-bg-primary/10" : "hawa-bg-primary/15"
         )
       },
       /* @__PURE__ */ React54.createElement(
         "div",
         {
           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]"
+            "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]"
           )
         },
         fileName
@@ -6919,7 +6932,8 @@ var CodeBlock = ({
       "div",
       {
         className: cn(
-          "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",
+          // hawa-bg-gray-300 dark:hawa-bg-red-600
+          "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",
           tabs && fileName && "hawa-rounded-t-none"
         )
       },
@@ -6936,7 +6950,7 @@ var CodeBlock = ({
           {
             onClick: () => setSelectedTab(i),
             className: cn(
-              "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"
+              "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"
             )
           },
           tab.title
@@ -6947,7 +6961,7 @@ var CodeBlock = ({
       "div",
       {
         className: cn(
-          "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 ",
+          "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 ",
           tabs || fileName ? "hawa-rounded-b hawa-rounded-t-none" : "hawa-rounded"
         )
       },
@@ -6976,12 +6990,12 @@ var CodeBlock = ({
             size: "icon",
             onClick: () => clipboard.copy(tabs ? tabs[selectedTab].code : code),
             variant: "outline",
-            className: "hawa-text-foreground hawa-opacity-50 sm:hawa-opacity-100"
+            className: "hawa-text-gray-200 hawa-opacity-50 "
           },
           /* @__PURE__ */ React54.createElement(
             "svg",
             {
-              "aria-label": "Copy Icon",
+              "aria-label": "Copy",
               stroke: "currentColor",
               fill: "none",
               strokeWidth: "2",
@@ -7008,11 +7022,13 @@ var Carousel = ({
   showArrows,
   options,
   autoplay,
+  direction = "ltr",
   autoplayInterval = 3e3,
   ...props
 }) => {
   const [emblaRef, emblaApi] = useEmblaCarousel({
     ...options,
+    direction,
     loop: autoplay ? true : (options == null ? void 0 : options.loop) || false
   });
   const [selectedIndex, setSelectedIndex] = useState17(0);
@@ -7051,6 +7067,7 @@ var Carousel = ({
   ))))), /* @__PURE__ */ React55.createElement(
     Dots,
     {
+      direction,
       itemsLength: length,
       selectedIndex,
       onDotClick: (index) => emblaApi == null ? void 0 : emblaApi.scrollTo(index)
@@ -7065,22 +7082,34 @@ var Carousel = ({
     }
   ));
 };
-var Dots = ({ onDotClick, itemsLength, selectedIndex }) => {
+var Dots = ({
+  onDotClick,
+  itemsLength,
+  selectedIndex,
+  direction
+}) => {
   const arr = new Array(itemsLength).fill(0);
-  return /* @__PURE__ */ React55.createElement("div", { className: "hawa-z-50 hawa-my-2 hawa-flex hawa-justify-center hawa-gap-1" }, arr.map((_, index) => {
-    const selected = index === selectedIndex;
-    return /* @__PURE__ */ React55.createElement(
-      "div",
-      {
-        key: index,
-        onClick: () => onDotClick(index),
-        className: cn(
-          "hawa-h-2 hawa-rounded-full hawa-bg-primary hawa-transition-all hawa-duration-300 hover:hawa-cursor-pointer",
-          !selected ? "hawa-w-2 hawa-opacity-50" : "hawa-w-6 hawa-opacity-100"
-        )
-      }
-    );
-  }));
+  return /* @__PURE__ */ React55.createElement(
+    "div",
+    {
+      dir: direction,
+      className: "hawa-z-50 hawa-my-2 hawa-flex hawa-justify-center hawa-gap-1"
+    },
+    arr.map((_, index) => {
+      const selected = index === selectedIndex;
+      return /* @__PURE__ */ React55.createElement(
+        "div",
+        {
+          key: index,
+          onClick: () => onDotClick(index),
+          className: cn(
+            "hawa-h-2 hawa-rounded-full hawa-bg-primary hawa-transition-all hawa-duration-300 hover:hawa-cursor-pointer",
+            !selected ? "hawa-w-2 hawa-opacity-50" : "hawa-w-6 hawa-opacity-100"
+          )
+        }
+      );
+    })
+  );
 };
 var CarouselControls = (props) => {
   return /* @__PURE__ */ React55.createElement("div", { className: "hawa-flex hawa-justify-end hawa-gap-2 " }, /* @__PURE__ */ React55.createElement(

package/dist/layout/index.mjs

@@ -18,6 +18,7 @@ import {
   Tooltip,
   cn
 } from "../chunk-MQUAGP7K.mjs";
+import "../chunk-ZFXKCRJC.mjs";
 
 // layout/stats/Stats.tsx
 import React from "react";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sikka/hawa",
-  "version": "0.26.22",
+  "version": "0.26.23",
   "description": "Modern UI Kit made with Tailwind",
   "author": {
     "name": "Sikka Software",
@@ -66,17 +66,18 @@
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.1.0",
     "cmdk": "^0.2.0",
-    "embla-carousel-auto-height": "^8.0.0-rc18",
-    "embla-carousel-react": "^8.0.0-rc18",
+    "embla-carousel-auto-height": "^8.0.0-rc19",
+    "embla-carousel-react": "^8.0.0-rc19",
     "eslint": "^8.56.0",
     "eslint-config-next": "^14.0.4",
     "libphonenumber-js": "^1.10.53",
     "prism-react-renderer": "^2.3.1",
+    "prismjs": "^1.29.0",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "react-dropzone": "^14.2.3",
     "react-headless-pagination": "^1.1.4",
-    "react-hook-form": "^7.49.2",
+    "react-hook-form": "^7.49.3",
     "react-select": "^5.8.0",
     "signature_pad": "^4.1.7",
     "tailwind-merge": "^2.2.0",
@@ -89,17 +90,17 @@
     "@testing-library/jest-dom": "^6.2.0",
     "@testing-library/react": "^14.1.2",
     "@types/jest": "^29.5.11",
-    "@types/react": "^18.2.46",
+    "@types/react": "^18.2.47",
     "@types/react-dom": "^18.2.18",
     "autoprefixer": "^10.4.16",
-    "embla-carousel": "8.0.0-rc18",
+    "embla-carousel": "8.0.0-rc19",
     "jest": "^29.7.0",
     "jest-environment-jsdom": "^29.7.0",
-    "lucide-react": "^0.306.0",
+    "lucide-react": "^0.307.0",
     "postcss": "^8.4.33",
     "postcss-cli": "^11.0.0",
     "postcss-import": "^16.0.0",
-    "tailwindcss": "^3.4.0",
+    "tailwindcss": "^3.4.1",
     "tailwindcss-animate": "^1.0.7",
     "tsconfig-paths-webpack-plugin": "^4.1.0",
     "tsup": "^8.0.1"
@@ -108,10 +109,10 @@
     "check": "tsc --noEmit",
     "test": "jest",
     "prebuild": "node ./util/pre-build.js",
-    "build-lib": "npm run prebuild && node ./util/build-library.js",
+    "build": "npm run prebuild && node ./util/build-library.js",
     "build-lib-old": "tsup --dts",
     "build-css": "postcss styles.css -o dist/index.css",
-    "prepub": "npm run build-lib && npm run build-css",
+    "prepub": "npm run build && npm run build-css",
     "pub": "npm publish --tag next"
   }
 }