@sikka/hawa 0.26.22 → 0.26.23

package/dist/elements/index.js

@@ -6938,6 +6938,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,
@@ -6950,8 +6952,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",
@@ -6971,15 +6972,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
@@ -6989,7 +6990,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"
         )
       },
@@ -7006,7 +7008,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
@@ -7017,7 +7019,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"
         )
       },
@@ -7046,12 +7048,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",
@@ -7078,11 +7080,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);
@@ -7121,6 +7125,7 @@ var Carousel = ({
   ))))), /* @__PURE__ */ import_react31.default.createElement(
     Dots,
     {
+      direction,
       itemsLength: length,
       selectedIndex,
       onDotClick: (index) => emblaApi == null ? void 0 : emblaApi.scrollTo(index)
@@ -7135,22 +7140,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/elements/index.mjs

@@ -75,6 +75,9 @@ import {
   calculateLuminance,
   cn
 } from "../chunk-MQUAGP7K.mjs";
+import {
+  __require
+} from "../chunk-ZFXKCRJC.mjs";
 
 // elements/accordion/Accordion.tsx
 import * as React3 from "react";
@@ -2638,7 +2641,13 @@ var ScrollIndicator = ({
 
 // elements/codeBlock/CodeBlock.tsx
 import React27, { useState as useState11 } from "react";
-import { Highlight, themes } from "prism-react-renderer";
+import {
+  Highlight,
+  themes,
+  Prism
+} from "prism-react-renderer";
+(typeof global !== "undefined" ? global : window).Prism = Prism;
+__require("prismjs/components/prism-bash");
 var CodeBlock = ({
   tabs,
   code,
@@ -2651,8 +2660,7 @@ var CodeBlock = ({
 }) => {
   const clipboard = useClipboard();
   const [selectedTab, setSelectedTab] = useState11(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",
@@ -2672,15 +2680,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__ */ React27.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
@@ -2690,7 +2698,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"
         )
       },
@@ -2707,7 +2716,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
@@ -2718,7 +2727,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"
         )
       },
@@ -2747,12 +2756,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__ */ React27.createElement(
             "svg",
             {
-              "aria-label": "Copy Icon",
+              "aria-label": "Copy",
               stroke: "currentColor",
               fill: "none",
               strokeWidth: "2",
@@ -2779,11 +2788,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] = useState12(0);
@@ -2822,6 +2833,7 @@ var Carousel = ({
   ))))), /* @__PURE__ */ React28.createElement(
     Dots,
     {
+      direction,
       itemsLength: length,
       selectedIndex,
       onDotClick: (index) => emblaApi == null ? void 0 : emblaApi.scrollTo(index)
@@ -2836,22 +2848,34 @@ var Carousel = ({
     }
   ));
 };
-var Dots = ({ onDotClick, itemsLength, selectedIndex }) => {
+var Dots = ({
+  onDotClick,
+  itemsLength,
+  selectedIndex,
+  direction
+}) => {
   const arr = new Array(itemsLength).fill(0);
-  return /* @__PURE__ */ React28.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__ */ React28.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__ */ React28.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__ */ React28.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__ */ React28.createElement("div", { className: "hawa-flex hawa-justify-end hawa-gap-2 " }, /* @__PURE__ */ React28.createElement(

package/dist/hooks/index.mjs

@@ -7,6 +7,7 @@ import {
   useClipboard,
   useToast
 } from "../chunk-3GBITBPL.mjs";
+import "../chunk-ZFXKCRJC.mjs";
 
 // hooks/useIsomorphicEffect.ts
 import { useEffect, useLayoutEffect } from "react";