globalfy-design-system 1.18.0 → 1.19.0

package/dist/components/atoms/Alert/Alert.d.ts

@@ -10,6 +10,8 @@ export declare enum ToastType {
 export type AlertAction = {
     label: string;
     onClick: () => void;
+    isLoading?: boolean;
+    isDisabled?: boolean;
 };
 export type AlertProps = {
     message: string;

package/dist/components/atoms/Button/Button.d.ts

@@ -1,7 +1,7 @@
 import { default as React } from 'react';
 import { ButtonProps as NextUIButtonProps } from '@nextui-org/react';
 
-export type ButtonVariant = 'primaryDark' | 'primaryLight' | 'primary' | 'negative' | 'secondaryNegative' | 'secondary' | 'tertiary' | 'tertiaryDark' | 'tertiaryLight' | 'direction' | 'directionCircle' | 'icon';
+export type ButtonVariant = 'primaryDark' | 'primaryLight' | 'primary' | 'negative' | 'secondaryNegative' | 'secondary' | 'tertiary' | 'tertiaryDark' | 'tertiaryDarkGreen' | 'tertiaryLight' | 'direction' | 'directionCircle' | 'icon';
 export type ButtonProps = Omit<NextUIButtonProps, 'variant' | 'size' | 'ref'> & {
     children: React.ReactNode;
     iconLeft?: React.ReactNode;

package/dist/components/atoms/Button/SpinnerIcon.d.ts

@@ -10,6 +10,7 @@ declare const iconLoadingVariants: import('tailwind-variants').TVReturnType<{
         secondary: string;
         tertiary: string;
         tertiaryDark: string;
+        tertiaryDarkGreen: string;
         tertiaryLight: string;
         direction: string;
         directionCircle: string;
@@ -25,6 +26,7 @@ declare const iconLoadingVariants: import('tailwind-variants').TVReturnType<{
         secondary: string;
         tertiary: string;
         tertiaryDark: string;
+        tertiaryDarkGreen: string;
         tertiaryLight: string;
         direction: string;
         directionCircle: string;
@@ -40,6 +42,7 @@ declare const iconLoadingVariants: import('tailwind-variants').TVReturnType<{
         secondary: string;
         tertiary: string;
         tertiaryDark: string;
+        tertiaryDarkGreen: string;
         tertiaryLight: string;
         direction: string;
         directionCircle: string;
@@ -55,6 +58,7 @@ declare const iconLoadingVariants: import('tailwind-variants').TVReturnType<{
         secondary: string;
         tertiary: string;
         tertiaryDark: string;
+        tertiaryDarkGreen: string;
         tertiaryLight: string;
         direction: string;
         directionCircle: string;
@@ -70,6 +74,7 @@ declare const iconLoadingVariants: import('tailwind-variants').TVReturnType<{
         secondary: string;
         tertiary: string;
         tertiaryDark: string;
+        tertiaryDarkGreen: string;
         tertiaryLight: string;
         direction: string;
         directionCircle: string;
@@ -85,6 +90,7 @@ declare const iconLoadingVariants: import('tailwind-variants').TVReturnType<{
         secondary: string;
         tertiary: string;
         tertiaryDark: string;
+        tertiaryDarkGreen: string;
         tertiaryLight: string;
         direction: string;
         directionCircle: string;
@@ -100,6 +106,7 @@ declare const iconLoadingVariants: import('tailwind-variants').TVReturnType<{
         secondary: string;
         tertiary: string;
         tertiaryDark: string;
+        tertiaryDarkGreen: string;
         tertiaryLight: string;
         direction: string;
         directionCircle: string;

package/dist/components/atoms/DropdownList/DropdownList.d.ts

@@ -32,7 +32,7 @@ export type DropdownListProps = {
     };
 };
 export type DropdownCreditCardOption = {
-    label: string;
+    label?: string;
     prefix: ReactNode;
     isDefault?: boolean;
 };

package/dist/globalfy-design-system.js

@@ -43774,6 +43774,7 @@ const vv0 = ({ icons: e, className: r, isSelected: t, onValueChange: o }) => {
       secondary: "text-secondary-green-500",
       tertiary: "text-primary-green-500",
       tertiaryDark: "text-secondary-green-500",
+      tertiaryDarkGreen: "text-secondary-green-500",
       tertiaryLight: "text-primary-green-500",
       direction: "text-white",
       directionCircle: "text-white",
@@ -43882,6 +43883,14 @@ const vv0 = ({ icons: e, className: r, isSelected: t, onValueChange: o }) => {
         // focus
         "focus:text-secondary-green-500 data-[focus-visible=true]:outline-secondary-green-500"
       ].join(" "),
+      tertiaryDarkGreen: [
+        // default
+        "!bg-transparent px-4 font-medium text-secondary-green-500",
+        // hover
+        "hover:text-primary-green-500",
+        // focus
+        "focus:text-secondary-green-500 data-[focus-visible=true]:outline-secondary-green-500"
+      ].join(" "),
       tertiaryLight: [
         // default
         "!bg-transparent px-4 font-medium text-primary-green-500",
@@ -43978,6 +43987,11 @@ const vv0 = ({ icons: e, className: r, isSelected: t, onValueChange: o }) => {
       isLoading: !0,
       class: "!font-medium"
     },
+    {
+      variant: "tertiaryDarkGreen",
+      isLoading: !0,
+      class: "!font-medium"
+    },
     {
       variant: "tertiaryLight",
       isLoading: !0,
@@ -44004,6 +44018,11 @@ const vv0 = ({ icons: e, className: r, isSelected: t, onValueChange: o }) => {
       disabled: !0,
       class: "!bg-transparent"
     },
+    {
+      variant: "tertiaryDarkGreen",
+      disabled: !0,
+      class: "!bg-transparent"
+    },
     {
       variant: "tertiaryLight",
       disabled: !0,
@@ -44063,7 +44082,7 @@ const vv0 = ({ icons: e, className: r, isSelected: t, onValueChange: o }) => {
       ...h,
       children: /* @__PURE__ */ A.jsxs("div", { className: "relative flex items-center gap-3 text-center", children: [
         !!s && (typeof s == "string" ? /* @__PURE__ */ A.jsx(u1, { "data-testid": "button-component-icon-left", name: s }) : s),
-        e && /* @__PURE__ */ A.jsx("span", { className: t.includes("tertiary") ? "underline" : "", children: e }),
+        e && /* @__PURE__ */ A.jsx("span", { className: t.includes("tertiary") ? "underline underline-offset-4" : "", children: e }),
         !!l && (typeof l == "string" ? /* @__PURE__ */ A.jsx(u1, { "data-testid": "button-component-icon-right", name: l }) : l)
       ] })
     }
@@ -57259,28 +57278,41 @@ const wq = ({
     variants: {
       actionType: {
         link: "mt-[2px]",
-        button: "md:justify-end"
+        button: "flex-col gap-2 sm:flex-row md:justify-end"
       }
     }
   }), f = () => o === "banner" ? "secondaryNegative" : u === "link" ? "tertiary" : "secondary";
   return /* @__PURE__ */ A.jsxs("div", { className: d({ inlineActions: t, toastType: o }), children: [
     a && /* @__PURE__ */ A.jsx("div", { className: p({ iconVariant: s }), children: typeof a == "string" ? /* @__PURE__ */ A.jsx(u1, { name: a }) : a }),
     /* @__PURE__ */ A.jsxs("div", { className: "flex flex-1 flex-col gap-3 md:flex-row", children: [
-      /* @__PURE__ */ A.jsx("div", { className: "mt-[3px] flex items-center gap-4", children: /* @__PURE__ */ A.jsxs("p", { className: h({ toastType: o }), children: [
+      /* @__PURE__ */ A.jsx("div", { className: "flex items-center gap-4", children: /* @__PURE__ */ A.jsxs("p", { className: h({ toastType: o }), children: [
         e,
-        u === "link" && r && r.map(({ label: v, onClick: m }) => /* @__PURE__ */ A.jsx(
+        u === "link" && r && r.map(({ label: v, onClick: m, isLoading: w, isDisabled: b }) => /* @__PURE__ */ A.jsx(
           Qt,
           {
             variant: f(),
             onClick: m,
+            isLoading: w,
+            isDisabled: b,
             size: "small",
-            className: "inline !p-0 md:ml-2",
+            className: "!px-0 md:ml-2",
             children: v
           },
           v
         ))
       ] }) }),
-      u !== "link" && r && /* @__PURE__ */ A.jsx("div", { className: g({ actionType: u }), children: r.map(({ label: v, onClick: m }) => /* @__PURE__ */ A.jsx(Qt, { variant: f(), onClick: m, size: "small", children: v }, v)) })
+      u !== "link" && r && /* @__PURE__ */ A.jsx("div", { className: g({ actionType: u }), children: r.map(({ label: v, onClick: m, isLoading: w, isDisabled: b }) => /* @__PURE__ */ A.jsx(
+        Qt,
+        {
+          variant: f(),
+          onClick: m,
+          size: "small",
+          isLoading: w,
+          isDisabled: b,
+          children: v
+        },
+        v
+      )) })
     ] }),
     l && /* @__PURE__ */ A.jsx("div", { className: "flex self-start md:self-center", children: /* @__PURE__ */ A.jsx("button", { onClick: c, children: /* @__PURE__ */ A.jsx(u1, { name: "close", className: "cursor-pointer text-xs text-black" }) }) })
   ] });