@daisychainapp/maily-to-core 0.4.2 → 0.4.4

package/dist/index.cjs

@@ -3489,7 +3489,7 @@ var TooltipContent = React.forwardRef((_a, ref) => {
       ref,
       sideOffset,
       className: cn(
-        "mly:z-50 mly:overflow-hidden mly:rounded-md mly:border mly:border-gray-200 mly:bg-white mly:px-2 mly:py-1 mly:text-xs mly:animate-in mly:fade-in-0 mly:zoom-in-95",
+        "tooltip-surface mly:z-50 mly:overflow-hidden mly:rounded-md mly:border mly:border-gray-200 mly:bg-white mly:px-2 mly:py-1 mly:text-xs mly:animate-in mly:fade-in-0 mly:zoom-in-95",
         className
       )
     }, props)
@@ -3524,7 +3524,7 @@ var BaseButton = React2.forwardRef(
       destructive: "mly:bg-red-500 mly:text-gray-50 mly:hover:bg-red-500/90",
       outline: "mly:border mly:border-gray-200 mly:bg-white mly:hover:bg-gray-100 mly:hover:text-gray-900",
       secondary: "mly:bg-gray-100 mly:text-gray-900 mly:hover:bg-gray-100/80",
-      ghost: "mly:hover:bg-soft-gray bg-transparent mly:hover:text-gray-900 mly:data-[state=true]:bg-soft-gray mly:data-[state=true]:text-gray-900",
+      ghost: "mly:hover:bg-soft-gray mly:bg-transparent mly:hover:text-gray-900 mly:data-[state=true]:bg-soft-gray mly:data-[state=true]:text-gray-900",
       link: "mly:text-gray-900 mly:underline-offset-4 mly:hover:underline"
     };
     const sizeClasses = {
@@ -3548,16 +3548,18 @@ BaseButton.displayName = "BaseButton";
 // src/editor/components/bubble-menu-button.tsx
 var import_jsx_runtime4 = require("react/jsx-runtime");
 function BubbleMenuButton(item) {
-  var _a;
+  var _a, _b;
   const { tooltip } = item;
+  const isActive = (_b = (_a = item == null ? void 0 : item.isActive) == null ? void 0 : _a.call(item)) != null ? _b : false;
   const content = /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
     BaseButton,
     __spreadProps(__spreadValues({
       variant: "ghost",
       size: "sm"
     }, item.command ? { onClick: item.command } : {}), {
-      "data-state": (_a = item == null ? void 0 : item.isActive) == null ? void 0 : _a.call(item),
+      "data-state": isActive,
       className: cn(
+        isActive && "menu-active-option",
         "mly:size-7! mly:px-2.5 mly:disabled:cursor-not-allowed",
         item == null ? void 0 : item.className
       ),
@@ -3590,8 +3592,8 @@ function BubbleMenuButton(item) {
         TooltipContent,
         {
           sideOffset: 8,
-          className: "mly:border-gray-300 mly:bg-transparent mly:p-0 mly:text-gray-700 mly:shadow-sm",
-          children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "mly:block mly:rounded-md mly:bg-soft-gray mly:!px-2 mly:!py-1.5", children: tooltip })
+          className: "tooltip-surface",
+          children: tooltip
         }
       )
     ] });
@@ -3867,7 +3869,14 @@ function _ShowPopover(props) {
               children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_lucide_react3.Eye, { className: "mly:h-3 mly:w-3 mly:stroke-[2.5]" })
             }
           ) }),
-          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(TooltipContent, { sideOffset: 8, children: "Show block conditionally" })
+          /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
+            TooltipContent,
+            {
+              sideOffset: 8,
+              className: "tooltip-surface",
+              children: "Show block conditionally"
+            }
+          )
         ] }),
         /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
           PopoverContent,
@@ -3896,7 +3905,7 @@ function _ShowPopover(props) {
                     TooltipContent,
                     {
                       sideOffset: 14,
-                      className: "mly:max-w-[285px]",
+                      className: "tooltip-surface mly:max-w-[285px]",
                       align: "start",
                       children: "Show the block if the selected variable is true."
                     }
@@ -4125,8 +4134,8 @@ function Select(props) {
       TooltipContent,
       {
         sideOffset: 8,
-        className: "mly:border-gray-300 mly:bg-transparent mly:p-0 mly:text-gray-700 mly:shadow-sm",
-        children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)("span", { className: "mly:block mly:rounded-md mly:bg-soft-gray mly:!px-2 mly:!py-1.5", children: tooltip })
+        className: "tooltip-surface",
+        children: tooltip
       }
     )
   ] });
@@ -4828,8 +4837,8 @@ function ContentMenu(props) {
             TooltipContent,
             {
               sideOffset: 8,
-              className: "mly:border-gray-300 mly:bg-transparent mly:p-0 mly:text-gray-700 mly:shadow-sm",
-              children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "mly:block mly:rounded-md mly:bg-soft-gray mly:!px-2 mly:!py-1.5", children: "Add new node" })
+              className: "tooltip-surface",
+              children: "Add new node"
             }
           )
         ] }),
@@ -4855,8 +4864,8 @@ function ContentMenu(props) {
                 TooltipContent,
                 {
                   sideOffset: 8,
-                  className: "mly:border-gray-300 mly:bg-transparent mly:p-0 mly:text-gray-700 mly:shadow-sm",
-                  children: /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("span", { className: "mly:block mly:rounded-md mly:bg-soft-gray mly:!px-2 mly:!py-1.5", children: "Node actions" })
+                  className: "tooltip-surface",
+                  children: "Node actions"
                 }
               )
             ] }),
@@ -6224,8 +6233,8 @@ function AlignmentSwitch(props) {
         TooltipContent,
         {
           sideOffset: 8,
-          className: "mly:border-gray-300 mly:bg-transparent mly:p-0 mly:text-gray-700 mly:shadow-sm",
-          children: /* @__PURE__ */ (0, import_jsx_runtime18.jsx)("span", { className: "mly:block mly:rounded-md mly:bg-soft-gray mly:!px-2 mly:!py-1.5", children: "Alignment" })
+          className: "tooltip-surface",
+          children: "Alignment"
         }
       )
     ] }),
@@ -7665,8 +7674,8 @@ function LinkInputPopover(props) {
             TooltipContent,
             {
               sideOffset: 8,
-              className: "mly:border-gray-300 mly:bg-transparent mly:p-0 mly:text-gray-700 mly:shadow-sm",
-              children: /* @__PURE__ */ (0, import_jsx_runtime34.jsx)("span", { className: "mly:block mly:rounded-md mly:bg-soft-gray mly:!px-2 mly:!py-1.5", children: tooltip })
+              className: "tooltip-surface",
+              children: tooltip
             }
           )
         ] }) : popoverButton,
@@ -8302,7 +8311,7 @@ function RepeatBubbleMenu(props) {
               TooltipContent,
               {
                 sideOffset: 14,
-                className: "mly:max-w-[260px]",
+                className: "tooltip-surface mly:max-w-[260px]",
                 align: "start",
                 children: "Ensure the selected variable is iterable, such as an array of objects."
               }
@@ -8526,8 +8535,8 @@ function ColorPicker(props) {
             TooltipContent,
             {
               sideOffset: 8,
-              className: "mly:border-gray-300 mly:bg-transparent mly:p-0 mly:text-gray-700 mly:shadow-sm",
-              children: /* @__PURE__ */ (0, import_jsx_runtime42.jsx)("span", { className: "mly:block mly:rounded-md mly:bg-soft-gray mly:!px-2 mly:!py-1.5", children: tooltip })
+              className: "tooltip-surface",
+              children: tooltip
             }
           )
         ] }) : popoverButton,
@@ -11437,8 +11446,8 @@ function TurnIntoBlock(props) {
         TooltipContent,
         {
           sideOffset: 8,
-          className: "mly:border-gray-300 mly:bg-transparent mly:p-0 mly:text-gray-700 mly:shadow-sm",
-          children: /* @__PURE__ */ (0, import_jsx_runtime56.jsx)("span", { className: "mly:block mly:rounded-md mly:bg-soft-gray mly:!px-2 mly:!py-1.5", children: "Turn into" })
+          className: "tooltip-surface",
+          children: "Turn into"
         }
       )
     ] }),