@sikka/hawa 0.15.1-next → 0.15.2-next

package/dist/index.css

@@ -876,6 +876,10 @@ input[type="number"]::-webkit-inner-spin-button,
   margin-left: 0.5rem;
   margin-right: 0.5rem;
 }
+.hawa-mx-2\.5 {
+  margin-left: 0.625rem;
+  margin-right: 0.625rem;
+}
 .hawa-mx-4 {
   margin-left: 1rem;
   margin-right: 1rem;
@@ -2575,6 +2579,9 @@ input[type="number"]::-webkit-inner-spin-button,
   --tw-text-opacity: 1;
   color: rgb(202 138 4 / var(--tw-text-opacity));
 }
+.hawa-line-through {
+  text-decoration-line: line-through;
+}
 .hawa-underline-offset-4 {
   text-underline-offset: 4px;
 }

package/dist/index.d.mts

@@ -53,9 +53,11 @@ type PricingCardTypes = {
     direction?: DirectionType;
     features: {
         included: boolean;
+        soon?: boolean;
         text: string;
     }[];
     price: number;
+    discount?: string;
     texts: {
         title: string;
         subtitle: string;
@@ -514,6 +516,7 @@ type AlertTypes = {
     persistent?: boolean;
     icon?: any;
     className?: any;
+    onAlertClosed?: any;
 };
 declare const Alert: React__default.FunctionComponent<AlertTypes>;
 

package/dist/index.d.ts

@@ -53,9 +53,11 @@ type PricingCardTypes = {
     direction?: DirectionType;
     features: {
         included: boolean;
+        soon?: boolean;
         text: string;
     }[];
     price: number;
+    discount?: string;
     texts: {
         title: string;
         subtitle: string;
@@ -514,6 +516,7 @@ type AlertTypes = {
     persistent?: boolean;
     icon?: any;
     className?: any;
+    onAlertClosed?: any;
 };
 declare const Alert: React__default.FunctionComponent<AlertTypes>;
 

package/dist/index.js

@@ -1005,7 +1005,6 @@ var AdCard = function(_param) {
     }, "Hide")));
 };
 // components/elements/cards/PricingCard.tsx
-var import_clsx2 = __toESM(require("clsx"));
 var import_react4 = __toESM(require("react"));
 // components/elements/Button.tsx
 var React5 = __toESM(require("react"));
@@ -1200,8 +1199,12 @@ var PricingCard = function(_param) {
     };
     return /* @__PURE__ */ import_react4.default.createElement(Card, {
         dir: direction,
-        className: (0, import_clsx2.default)(currentPlan ? "hawa-border-primary dark:hawa-border-primary/70 hawa-border-2 " : "hawa-border", cardSizes[size], "hawa-flex hawa-flex-col hawa-gap-4 hawa-rounded hawa-p-4 ")
-    }, /* @__PURE__ */ import_react4.default.createElement("h5", {
+        className: cn(currentPlan ? "hawa-border-primary dark:hawa-border-primary/70 hawa-border-2 " : "hawa-border", cardSizes[size], "hawa-flex hawa-flex-col hawa-gap-4 hawa-rounded hawa-p-4 ")
+    }, props.discount && /* @__PURE__ */ import_react4.default.createElement(Chip, {
+        label: props.discount,
+        size: "large",
+        color: "hyper"
+    }), " ", /* @__PURE__ */ import_react4.default.createElement("h5", {
         className: "hawa-text-md 0 hawa-font-bold hawa-text-primary/70"
     }, props.texts.title), /* @__PURE__ */ import_react4.default.createElement("div", {
         className: " hawa-text-primary hawa-flex  hawa-items-baseline"
@@ -1219,8 +1222,8 @@ var PricingCard = function(_param) {
     }, (_props_features = props.features) === null || _props_features === void 0 ? void 0 : _props_features.map(function(feature, o) {
         return /* @__PURE__ */ import_react4.default.createElement("li", {
             key: o,
-            className: "hawa-flex"
-        }, /* @__PURE__ */ import_react4.default.createElement("svg", {
+            className: cn("hawa-flex", !feature.included && "hawa-line-through")
+        }, feature.included ? /* @__PURE__ */ import_react4.default.createElement("svg", {
             "aria-label": "Check Icon",
             "aria-hidden": "true",
             className: "hawa-m-2 hawa-h-5 hawa-w-5 hawa-flex-shrink-0 hawa-text-primary",
@@ -1230,9 +1233,15 @@ var PricingCard = function(_param) {
             fillRule: "evenodd",
             d: "M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z",
             clipRule: "evenodd"
-        })), /* @__PURE__ */ import_react4.default.createElement("span", {
-            className: "hawa-flex hawa-items-center  hawa-text-center hawa-font-normal hawa-leading-tight hawa-text-primary/70 "
-        }, feature.text));
+        })) : /* @__PURE__ */ import_react4.default.createElement("div", {
+            className: "hawa-w-4 hawa-h-4 hawa-rounded-full hawa-bg-primary/10 hawa-m-2 hawa-mx-2.5"
+        }), /* @__PURE__ */ import_react4.default.createElement("span", {
+            className: "hawa-flex hawa-items-center hawa-flex-row hawa-gap-2 hawa-text-center hawa-font-normal hawa-leading-tight hawa-text-primary/70 "
+        }, feature.text, " ", feature.soon && feature.included && /* @__PURE__ */ import_react4.default.createElement(Chip, {
+            label: "soon",
+            color: "oceanic",
+            size: "small"
+        })));
     })), /* @__PURE__ */ import_react4.default.createElement(Button, {
         onClick: props.onPlanClicked,
         disabled: currentPlan,
@@ -3365,7 +3374,7 @@ var countries = [
 ];
 var countries_default = countries;
 // components/elements/Select.tsx
-var import_clsx3 = __toESM(require("clsx"));
+var import_clsx2 = __toESM(require("clsx"));
 var import_react11 = __toESM(require("react"));
 var import_react_select = __toESM(require("react-select"));
 var import_creatable = __toESM(require("react-select/creatable"));
@@ -3495,7 +3504,7 @@ var Select = function(_param) {
         var children = param.children, innerProps = param.innerProps, innerRef = param.innerRef;
         return /* @__PURE__ */ import_react11.default.createElement("div", _object_spread({
             ref: innerRef,
-            className: (0, import_clsx3.default)("hawa-text-sm hawa-flex hawa-p-2 hawa-w-full hawa-rounded hawa-border hawa-bg-background hawa-text-gray-900 focus:hawa-border-blue-500 focus:hawa-ring-blue-500 dark:focus:hawa-ring-blue-500")
+            className: (0, import_clsx2.default)("hawa-text-sm hawa-flex hawa-p-2 hawa-w-full hawa-rounded hawa-border hawa-bg-background hawa-text-gray-900 focus:hawa-border-blue-500 focus:hawa-ring-blue-500 dark:focus:hawa-ring-blue-500")
         }, innerProps), children);
     };
     var Option = function(param) {
@@ -4977,6 +4986,7 @@ var Alert = function(_param) {
         "aria-label": "Close",
         className: cn("hawa-absolute  hawa-top-2 hawa-inline-flex hawa-h-9 hawa-w-9 hawa-items-center hawa-justify-center hawa-rounded-inner hawa-p-1.5 hawa-transition-all  hover:hawa-text-gray-900", closeButtonStyle[severity], direction === "rtl" ? "hawa-left-2" : "hawa-right-2"),
         onClick: function() {
+            props.onAlertClosed();
             setClosed(true);
             setTimeout(function() {
                 if (alertRef === null || alertRef === void 0 ? void 0 : alertRef.current) {
@@ -5047,7 +5057,7 @@ var DestroyableCard = function(_param) {
 // components/elements/FileDropzone.tsx
 var import_react23 = __toESM(require("react"));
 var import_react_dropzone = require("react-dropzone");
-var import_clsx4 = __toESM(require("clsx"));
+var import_clsx3 = __toESM(require("clsx"));
 var FileDropzone = function(param) {
     var texts = param.texts, files = param.files, setFiles = param.setFiles, setDeletedFiles = param.setDeletedFiles, onAcceptedFiles = param.onAcceptedFiles, errorMessages = param.errorMessages, maxFiles = param.maxFiles, accept = param.accept, showPreview = param.showPreview, onDeleteFile = param.onDeleteFile, onClearFiles = param.onClearFiles, disclaimer = param.disclaimer, maxSize = param.maxSize, label = param.label, termsLink = param.termsLink, privacyLink = param.privacyLink;
     var _fileRejections__errors_, _fileRejections_;
@@ -5189,7 +5199,7 @@ var FileDropzone = function(param) {
     return /* @__PURE__ */ import_react23.default.createElement("div", null, label && /* @__PURE__ */ import_react23.default.createElement("div", {
         className: "hawa-mb-2 hawa-block hawa-text-sm hawa-font-medium hawa-text-gray-900 dark:hawa-text-gray-300"
     }, label), /* @__PURE__ */ import_react23.default.createElement("div", {
-        className: (0, import_clsx4.default)("hawa-flex hawa-flex-col hawa-justify-center hawa-rounded hawa-border hawa-border-dashed  hawa-p-6 hawa-transition-all  ", isDragActive ? "hawa-bg-muted" : "hawa-bg-muted/20 hover:hawa-bg-muted/50 ")
+        className: (0, import_clsx3.default)("hawa-flex hawa-flex-col hawa-justify-center hawa-rounded hawa-border hawa-border-dashed  hawa-p-6 hawa-transition-all  ", isDragActive ? "hawa-bg-muted" : "hawa-bg-muted/20 hover:hawa-bg-muted/50 ")
     }, /* @__PURE__ */ import_react23.default.createElement("div", _object_spread({}, getRootProps({})), /* @__PURE__ */ import_react23.default.createElement("p", _object_spread({}, getInputProps())), /* @__PURE__ */ import_react23.default.createElement("div", {
         className: "hawa-flex hawa-flex-col hawa-items-center hawa-justify-center hawa-gap-2 hawa-pt-4 hawa-text-center"
     }, /* @__PURE__ */ import_react23.default.createElement("svg", {

package/dist/index.mjs

@@ -116,7 +116,6 @@ var AdCard = ({ orientation, ...props }) => {
 };
 
 // components/elements/cards/PricingCard.tsx
-import clsx2 from "clsx";
 import React7 from "react";
 
 // components/elements/Button.tsx
@@ -366,34 +365,47 @@ var PricingCard = ({
     Card,
     {
       dir: direction,
-      className: clsx2(
+      className: cn(
         currentPlan ? "hawa-border-primary dark:hawa-border-primary/70 hawa-border-2 " : "hawa-border",
         cardSizes[size],
         "hawa-flex hawa-flex-col hawa-gap-4 hawa-rounded hawa-p-4 "
       )
     },
+    props.discount && /* @__PURE__ */ React7.createElement(Chip, { label: props.discount, size: "large", color: "hyper" }),
+    " ",
     /* @__PURE__ */ React7.createElement("h5", { className: "hawa-text-md 0 hawa-font-bold hawa-text-primary/70" }, props.texts.title),
     /* @__PURE__ */ React7.createElement("div", { className: " hawa-text-primary hawa-flex  hawa-items-baseline" }, /* @__PURE__ */ React7.createElement(React7.Fragment, null, /* @__PURE__ */ React7.createElement("span", { className: "hawa-text-5xl hawa-font-extrabold hawa-tracking-tight" }, props.price), /* @__PURE__ */ React7.createElement("span", { className: "hawa-mx-1 hawa-text-sm hawa-font-semibold" }, props.texts.currencyText)), /* @__PURE__ */ React7.createElement("span", { className: "hawa-ml-1 hawa-text-xl hawa-font-normal hawa-text-primary/70" }, "/ ", props.texts.cycleText)),
     /* @__PURE__ */ React7.createElement("h5", { className: "hawa-text-sm  hawa-font-normal hawa-text-primary/70" }, props.texts.subtitle),
     props.features && /* @__PURE__ */ React7.createElement("ul", { role: "list", className: "hawa-space-y-0 " }, props.features?.map((feature, o) => {
-      return /* @__PURE__ */ React7.createElement("li", { key: o, className: "hawa-flex" }, /* @__PURE__ */ React7.createElement(
-        "svg",
+      return /* @__PURE__ */ React7.createElement(
+        "li",
         {
-          "aria-label": "Check Icon",
-          "aria-hidden": "true",
-          className: "hawa-m-2 hawa-h-5 hawa-w-5 hawa-flex-shrink-0 hawa-text-primary",
-          fill: "currentColor",
-          viewBox: "0 0 20 20"
+          key: o,
+          className: cn(
+            "hawa-flex",
+            !feature.included && "hawa-line-through"
+          )
         },
-        /* @__PURE__ */ React7.createElement(
-          "path",
+        feature.included ? /* @__PURE__ */ React7.createElement(
+          "svg",
           {
-            fillRule: "evenodd",
-            d: "M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z",
-            clipRule: "evenodd"
-          }
-        )
-      ), /* @__PURE__ */ React7.createElement("span", { className: "hawa-flex hawa-items-center  hawa-text-center hawa-font-normal hawa-leading-tight hawa-text-primary/70 " }, feature.text));
+            "aria-label": "Check Icon",
+            "aria-hidden": "true",
+            className: "hawa-m-2 hawa-h-5 hawa-w-5 hawa-flex-shrink-0 hawa-text-primary",
+            fill: "currentColor",
+            viewBox: "0 0 20 20"
+          },
+          /* @__PURE__ */ React7.createElement(
+            "path",
+            {
+              fillRule: "evenodd",
+              d: "M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z",
+              clipRule: "evenodd"
+            }
+          )
+        ) : /* @__PURE__ */ React7.createElement("div", { className: "hawa-w-4 hawa-h-4 hawa-rounded-full hawa-bg-primary/10 hawa-m-2 hawa-mx-2.5" }),
+        /* @__PURE__ */ React7.createElement("span", { className: "hawa-flex hawa-items-center hawa-flex-row hawa-gap-2 hawa-text-center hawa-font-normal hawa-leading-tight hawa-text-primary/70 " }, feature.text, " ", feature.soon && feature.included && /* @__PURE__ */ React7.createElement(Chip, { label: "soon", color: "oceanic", size: "small" }))
+      );
     })),
     /* @__PURE__ */ React7.createElement(
       Button,
@@ -2632,7 +2644,7 @@ var countries = [
 var countries_default = countries;
 
 // components/elements/Select.tsx
-import clsx3 from "clsx";
+import clsx2 from "clsx";
 import React16 from "react";
 import ReactSelect from "react-select";
 import CreatableSelect from "react-select/creatable";
@@ -2750,7 +2762,7 @@ var Select = ({ labelKey = "label", ...props }) => {
       "div",
       {
         ref: innerRef,
-        className: clsx3(
+        className: clsx2(
           "hawa-text-sm hawa-flex hawa-p-2 hawa-w-full hawa-rounded hawa-border hawa-bg-background hawa-text-gray-900 focus:hawa-border-blue-500 focus:hawa-ring-blue-500 dark:focus:hawa-ring-blue-500"
         ),
         ...innerProps
@@ -4576,6 +4588,7 @@ var Alert = ({
           direction === "rtl" ? "hawa-left-2" : "hawa-right-2"
         ),
         onClick: () => {
+          props.onAlertClosed();
           setClosed(true);
           setTimeout(() => {
             if (alertRef?.current) {
@@ -4684,7 +4697,7 @@ var DestroyableCard = ({
 // components/elements/FileDropzone.tsx
 import React38, { useEffect as useEffect11, useState as useState15 } from "react";
 import { useDropzone } from "react-dropzone";
-import clsx4 from "clsx";
+import clsx3 from "clsx";
 var FileDropzone = ({
   texts,
   files,
@@ -4853,7 +4866,7 @@ var FileDropzone = ({
   return /* @__PURE__ */ React38.createElement("div", null, label && /* @__PURE__ */ React38.createElement("div", { className: "hawa-mb-2 hawa-block hawa-text-sm hawa-font-medium hawa-text-gray-900 dark:hawa-text-gray-300" }, label), /* @__PURE__ */ React38.createElement(
     "div",
     {
-      className: clsx4(
+      className: clsx3(
         "hawa-flex hawa-flex-col hawa-justify-center hawa-rounded hawa-border hawa-border-dashed  hawa-p-6 hawa-transition-all  ",
         isDragActive ? "hawa-bg-muted" : "hawa-bg-muted/20 hover:hawa-bg-muted/50 "
       )

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sikka/hawa",
-  "version": "0.15.1-next",
+  "version": "0.15.2-next",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "exports": {