@keboola/design 1.2.1 → 1.3.1

package/dist/markdown-editor.js

@@ -0,0 +1,4413 @@
+import { clsx } from 'clsx';
+import { extendTailwindMerge } from 'tailwind-merge';
+import { Portal, Content, Root, Trigger } from '@radix-ui/react-tooltip';
+import { cva } from 'class-variance-authority';
+import { jsx, Fragment, jsxs } from 'react/jsx-runtime';
+import { createContext, lazy, Suspense, use, useId, useState, useRef, useEffect, useCallback, useMemo } from 'react';
+import { AlignLeft, AlignCenter, AlignRight, AlignJustify, SquareCode, Quote, ListOrdered, List, Heading3, Heading2, Heading1, Type, Bold, Italic, Underline, Strikethrough, Code, Minimize2, Maximize2, ChevronDown, Link, Copy, X, Loader2, AlertCircle, CircleCheck, Info, AlertTriangle, ChevronRight, ToggleRight, Circle, Check } from 'lucide-react';
+import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
+import '@awesome.me/kit-be8bcf7e5e/icons';
+import { Root as Root$2, Slottable } from '@radix-ui/react-slot';
+import { Tooltip as Tooltip$1, cn as cn$1 } from '@keboola/design';
+import { renderMermaidSVG } from 'beautiful-mermaid';
+import colors from '@keboola/tailwind-config/colors';
+import { CodeNode, $isCodeNode, $createCodeNode } from '@lexical/code';
+import { LinkNode, $isLinkNode, TOGGLE_LINK_COMMAND, $createLinkNode } from '@lexical/link';
+import { ListNode, ListItemNode, $isListNode, REMOVE_LIST_COMMAND, INSERT_UNORDERED_LIST_COMMAND, INSERT_ORDERED_LIST_COMMAND } from '@lexical/list';
+import { CHECK_LIST, TRANSFORMERS, $convertFromMarkdownString, $convertToMarkdownString } from '@lexical/markdown';
+import { AutoFocusPlugin } from '@lexical/react/LexicalAutoFocusPlugin';
+import { CheckListPlugin } from '@lexical/react/LexicalCheckListPlugin';
+import { ClickableLinkPlugin } from '@lexical/react/LexicalClickableLinkPlugin';
+import { LexicalComposer } from '@lexical/react/LexicalComposer';
+import { ContentEditable } from '@lexical/react/LexicalContentEditable';
+import { LexicalErrorBoundary } from '@lexical/react/LexicalErrorBoundary';
+import { HistoryPlugin } from '@lexical/react/LexicalHistoryPlugin';
+import { HorizontalRuleNode, $createHorizontalRuleNode, $isHorizontalRuleNode } from '@lexical/react/LexicalHorizontalRuleNode';
+import { HorizontalRulePlugin } from '@lexical/react/LexicalHorizontalRulePlugin';
+import { LinkPlugin } from '@lexical/react/LexicalLinkPlugin';
+import { ListPlugin } from '@lexical/react/LexicalListPlugin';
+import { MarkdownShortcutPlugin } from '@lexical/react/LexicalMarkdownShortcutPlugin';
+import { RichTextPlugin } from '@lexical/react/LexicalRichTextPlugin';
+import { TabIndentationPlugin } from '@lexical/react/LexicalTabIndentationPlugin';
+import { HeadingNode, QuoteNode, $isHeadingNode, $isQuoteNode, $createQuoteNode, $createHeadingNode } from '@lexical/rich-text';
+import { DecoratorNode, $getSelection, $isRangeSelection, FORMAT_TEXT_COMMAND, $createParagraphNode, PASTE_COMMAND, COMMAND_PRIORITY_CRITICAL, DROP_COMMAND, KEY_DOWN_COMMAND, COMMAND_PRIORITY_HIGH, $insertNodes, $getNodeByKey, $setSelection, FORMAT_ELEMENT_COMMAND, $createTextNode } from 'lexical';
+import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
+import { toast as toast$1 } from 'sonner';
+import { createPortal } from 'react-dom';
+import { $getNearestBlockElementAncestorOrThrow } from '@lexical/utils';
+import * as DropdownMenuPrimitive3 from '@radix-ui/react-dropdown-menu';
+import { Root as Root$1, Group, Trigger as Trigger$1 } from '@radix-ui/react-dropdown-menu';
+import * as ScrollAreaPrimitive2 from '@radix-ui/react-scroll-area';
+import TextareaAutosize from 'react-textarea-autosize';
+import { Pipette } from '@keboola/design/icons';
+import * as RLabel from '@radix-ui/react-label';
+
+var __defProp = Object.defineProperty;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __esm = (fn, res) => function __init() {
+  return fn && (res = (0, fn[__getOwnPropNames(fn)[0]])(fn = 0)), res;
+};
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var twMerge, cn;
+var init_classNames = __esm({
+  "src/utils/classNames.ts"() {
+    twMerge = extendTailwindMerge({
+      prefix: "tw-"
+    });
+    cn = (...classes) => twMerge(clsx(...classes));
+  }
+});
+
+// src/utils/copyToClipboard.ts
+var copyToClipboard;
+var init_copyToClipboard = __esm({
+  "src/utils/copyToClipboard.ts"() {
+    copyToClipboard = (text) => {
+      return navigator.clipboard.writeText(text);
+    };
+  }
+});
+
+// src/utils/createChangeInputEvent.ts
+var createChangeInputEvent;
+var init_createChangeInputEvent = __esm({
+  "src/utils/createChangeInputEvent.ts"() {
+    createChangeInputEvent = (input) => {
+      const changeEvent = {
+        target: input,
+        currentTarget: input,
+        type: "change",
+        nativeEvent: new Event("change", { bubbles: true }),
+        bubbles: true,
+        cancelable: false,
+        defaultPrevented: false,
+        eventPhase: 2,
+        // AT_TARGET
+        isTrusted: false,
+        // Synthetic events are not trusted
+        preventDefault: () => {
+        },
+        // Provide dummy functions if not needed
+        isDefaultPrevented: () => false,
+        stopPropagation: () => {
+        },
+        isPropagationStopped: () => false,
+        persist: () => {
+        },
+        timeStamp: Date.now()
+      };
+      Object.defineProperty(changeEvent, "target", {
+        value: input,
+        writable: false
+      });
+      return changeEvent;
+    };
+  }
+});
+
+// src/constants/keyCodes.ts
+var keyCodes;
+var init_keyCodes = __esm({
+  "src/constants/keyCodes.ts"() {
+    keyCodes = {
+      ENTER: "Enter",
+      ESCAPE: "Escape",
+      SPACE: " "
+    };
+  }
+});
+var tooltipVariants, TooltipContent;
+var init_TooltipContent = __esm({
+  "src/components/Tooltip/TooltipContent.tsx"() {
+    tooltipVariants = cva(
+      [
+        "tailwindcss-preflight",
+        "tw-inline-block",
+        "tw-rounded",
+        "tw-bg-neutral-800",
+        "tw-text-white",
+        "tw-break-anywhere",
+        "tw-max-h-96",
+        "tw-overflow-y-auto",
+        "tw-z-[1060]"
+      ],
+      {
+        defaultVariants: {
+          variant: "action"
+        },
+        variants: {
+          variant: {
+            action: [
+              "tw-max-w-fit",
+              "tw-px-3",
+              "tw-py-2",
+              "tw-text-center",
+              "tw-text-xs",
+              "tw-font-medium",
+              "tw-uppercase",
+              "tw-tracking-wider"
+            ],
+            explanatory: [
+              "tw-max-w-80",
+              "tw-px-4",
+              "tw-py-3",
+              "tw-text-left",
+              "tw-text-sm",
+              "tw-font-normal"
+            ]
+          }
+        }
+      }
+    );
+    TooltipContent = ({
+      className,
+      variant,
+      keepOpenOnPointerDownOutside = false,
+      children,
+      onPointerDownOutside,
+      sideOffset = 8,
+      collisionPadding = 8,
+      hideWhenDetached = true,
+      placement = "right",
+      ...rest
+    }) => {
+      const handlePointerDownOutside = (event) => {
+        if (keepOpenOnPointerDownOutside) event.preventDefault();
+        onPointerDownOutside?.(event);
+      };
+      return /* @__PURE__ */ jsx(Portal, { children: /* @__PURE__ */ jsx(
+        Content,
+        {
+          ...rest,
+          "data-tooltip-content": true,
+          sideOffset,
+          collisionPadding,
+          onPointerDownOutside: handlePointerDownOutside,
+          className: tooltipVariants({ className, variant }),
+          hideWhenDetached,
+          side: placement,
+          children
+        }
+      ) });
+    };
+  }
+});
+var DELAY_SHOW_TOOLTIP, TooltipRoot;
+var init_TooltipRoot = __esm({
+  "src/components/Tooltip/TooltipRoot.tsx"() {
+    DELAY_SHOW_TOOLTIP = 300;
+    TooltipRoot = ({ children, delayDuration = DELAY_SHOW_TOOLTIP, ...rest }) => /* @__PURE__ */ jsx(Root, { ...rest, delayDuration, children });
+  }
+});
+var TooltipTrigger;
+var init_TooltipTrigger = __esm({
+  "src/components/Tooltip/TooltipTrigger.tsx"() {
+    init_utils();
+    TooltipTrigger = ({
+      ref,
+      children,
+      className,
+      keepOpenOnClick = false,
+      onClick,
+      onPointerDown,
+      asChild,
+      ...rest
+    }) => {
+      const handleClick = (event) => {
+        if (keepOpenOnClick) event.preventDefault();
+        onClick?.(event);
+      };
+      const handePointerDown = (event) => {
+        if (keepOpenOnClick) event.preventDefault();
+        onPointerDown?.(event);
+      };
+      return /* @__PURE__ */ jsx(
+        Trigger,
+        {
+          ...rest,
+          asChild: true,
+          ref,
+          className: cn("tailwindcss-preflight", className),
+          onClick: handleClick,
+          onPointerDown: handePointerDown,
+          children: asChild ? children : /* @__PURE__ */ jsx("span", { children })
+        }
+      );
+    };
+  }
+});
+var ACTION_TOOLTIP_LIMIT, Tooltip;
+var init_Tooltip = __esm({
+  "src/components/Tooltip/Tooltip.tsx"() {
+    init_keyCodes();
+    init_TooltipContent();
+    init_TooltipRoot();
+    init_TooltipTrigger();
+    ACTION_TOOLTIP_LIMIT = 30;
+    Tooltip = ({
+      tooltip,
+      children,
+      className,
+      keepOpenOnTriggerClick = false,
+      variant,
+      placement = "right",
+      forceHide = false,
+      forceShow = false,
+      // trigger props
+      triggerAsChild = false
+    }) => {
+      const [open, setOpen] = useState(false);
+      const resolvedVariant = (() => {
+        if (!!variant) return variant;
+        if (typeof tooltip === "string" && tooltip.length > ACTION_TOOLTIP_LIMIT) return "explanatory";
+        return "action";
+      })();
+      const isActionVariant = resolvedVariant === "action";
+      const handleKeyUp = (event) => {
+        if (![keyCodes.ENTER, keyCodes.SPACE].includes(event.key)) return;
+        event.stopPropagation();
+      };
+      return /* @__PURE__ */ jsxs(
+        TooltipRoot,
+        {
+          open: !!tooltip && (open || forceShow) && !forceHide,
+          onOpenChange: setOpen,
+          disableHoverableContent: isActionVariant,
+          children: [
+            /* @__PURE__ */ jsx(
+              TooltipTrigger,
+              {
+                asChild: triggerAsChild,
+                keepOpenOnClick: keepOpenOnTriggerClick,
+                onKeyUp: handleKeyUp,
+                children
+              }
+            ),
+            /* @__PURE__ */ jsx(
+              TooltipContent,
+              {
+                className,
+                variant: resolvedVariant,
+                placement,
+                keepOpenOnPointerDownOutside: keepOpenOnTriggerClick,
+                children: tooltip
+              }
+            )
+          ]
+        }
+      );
+    };
+    Tooltip.Root = TooltipRoot;
+    Tooltip.Content = TooltipContent;
+    Tooltip.Trigger = TooltipTrigger;
+  }
+});
+
+// src/components/Tooltip/index.ts
+var init_Tooltip2 = __esm({
+  "src/components/Tooltip/index.ts"() {
+    init_Tooltip();
+  }
+});
+var init_decorators = __esm({
+  "src/utils/decorators.tsx"() {
+  }
+});
+
+// src/utils/createPrefixedString.ts
+var createPrefixedString;
+var init_createPrefixedString = __esm({
+  "src/utils/createPrefixedString.ts"() {
+    createPrefixedString = (prefix) => (literals) => literals.reduce((acc, literal) => acc + literal, `${prefix}-`);
+  }
+});
+
+// src/utils/escapeStringRegexp.ts
+var init_escapeStringRegexp = __esm({
+  "src/utils/escapeStringRegexp.ts"() {
+  }
+});
+
+// src/utils/mergeRefs.ts
+function setRef(ref, value) {
+  if (typeof ref === "function") {
+    ref(value);
+  } else if (ref != null) {
+    ref.current = value;
+  }
+}
+var mergeRefs;
+var init_mergeRefs = __esm({
+  "src/utils/mergeRefs.ts"() {
+    mergeRefs = (...refs) => {
+      return (node) => refs.forEach((ref) => setRef(ref, node));
+    };
+  }
+});
+
+// src/utils/noop.ts
+var init_noop = __esm({
+  "src/utils/noop.ts"() {
+  }
+});
+
+// src/utils/debounce.ts
+var init_debounce = __esm({
+  "src/utils/debounce.ts"() {
+  }
+});
+
+// src/utils/isMac.ts
+var getIsMac;
+var init_isMac = __esm({
+  "src/utils/isMac.ts"() {
+    getIsMac = () => {
+      if (typeof navigator !== "undefined" && "userAgentData" in navigator) {
+        const platform = navigator.userAgentData.platform;
+        if (typeof platform === "string") {
+          return platform.toLowerCase() === "macos";
+        }
+      }
+      if (typeof navigator !== "undefined" && typeof navigator.platform === "string") {
+        return navigator.platform.toUpperCase().indexOf("MAC") >= 0;
+      }
+      return false;
+    };
+    getIsMac();
+  }
+});
+var init_useSHA256 = __esm({
+  "src/utils/useSHA256.ts"() {
+  }
+});
+
+// src/utils/index.ts
+var init_utils = __esm({
+  "src/utils/index.ts"() {
+    init_classNames();
+    init_copyToClipboard();
+    init_createChangeInputEvent();
+    init_decorators();
+    init_createPrefixedString();
+    init_escapeStringRegexp();
+    init_mergeRefs();
+    init_noop();
+    init_debounce();
+    init_isMac();
+    init_useSHA256();
+  }
+});
+var HEIGHT_CLASS_NAME, ANIMATION_CLASS_NAME, Skeleton;
+var init_Skeleton = __esm({
+  "src/components/Skeleton/Skeleton.tsx"() {
+    init_utils();
+    HEIGHT_CLASS_NAME = {
+      xxs: "tw-h-3 tw-rounded",
+      xs: "tw-h-4 tw-rounded",
+      sm: "tw-h-5 tw-rounded",
+      md: "tw-h-6 tw-rounded-md",
+      lg: "tw-h-8 tw-rounded-lg",
+      xl: "tw-h-10 tw-rounded-lg",
+      "2xl": "tw-h-12 tw-rounded-lg"
+    };
+    ANIMATION_CLASS_NAME = cn(
+      // base styles
+      "tw-relative",
+      "tw-overflow-hidden",
+      "tw-pointer-events-none",
+      "tw-bg-neutral-150",
+      // before
+      'before:tw-content-[""]',
+      "before:tw-opacity-100",
+      "before:tw-absolute",
+      "before:tw-inset-0",
+      "before:-tw-translate-x-full",
+      "before:tw-animate-[shimmer_2s_infinite]",
+      "before:tw-bg-gradient-to-r",
+      "before:tw-from-transparent",
+      "before:tw-to-transparent",
+      "before:tw-via-neutral-50"
+    );
+    Skeleton = ({ height = "md", className, count = 1 }) => {
+      const prefixId = useId();
+      const keys = Array.from({ length: count }, (_, i) => `${prefixId}-${i}`);
+      return /* @__PURE__ */ jsx(Fragment, { children: keys.map((key) => /* @__PURE__ */ jsx(
+        "div",
+        {
+          "data-skeleton": "true",
+          className: cn(HEIGHT_CLASS_NAME[height], ANIMATION_CLASS_NAME, className)
+        },
+        key
+      )) });
+    };
+  }
+});
+var init_icons = __esm({
+  "src/icons/index.ts"() {
+  }
+});
+var Icon;
+var init_Icon = __esm({
+  "src/components/Icon/Icon.tsx"() {
+    Icon = ({ ref, icon, ...rest }) => /* @__PURE__ */ jsx(FontAwesomeIcon, { ...rest, ref, icon });
+  }
+});
+var init_Icon2 = __esm({
+  "src/components/Icon/index.ts"() {
+    init_Icon();
+  }
+});
+var variants, argoVariants;
+var init_styles = __esm({
+  "src/components/Button/styles.ts"() {
+    variants = cva(
+      [
+        "tailwindcss-preflight",
+        "tw-group/button",
+        "tw-border-box",
+        // layout
+        "tw-relative",
+        "tw-flex",
+        "tw-items-center",
+        "tw-justify-center",
+        "tw-gap-2",
+        // text
+        "tw-text-xs",
+        "tw-leading-5",
+        "tw-font-medium",
+        "tw-tracking-[1px]",
+        "tw-uppercase",
+        // border
+        "tw-rounded",
+        "tw-border",
+        "tw-border-transparent",
+        // styling
+        "tw-shadow-none",
+        "[a]:tw-cursor-pointer",
+        // explicitly set for anchor
+        "focus-visible:tw-outline",
+        "focus-visible:tw-outline-1",
+        "focus-visible:-tw-outline-offset-1",
+        "focus-visible:tw-outline-secondary-500",
+        "focus-visible:tw-ring-4",
+        "focus-visible:tw-ring-secondary-200",
+        // disabled
+        "disabled:tw-opacity-40",
+        "disabled:tw-cursor-not-allowed",
+        // anchor support
+        "!tw-no-underline",
+        "aria-disabled:tw-opacity-40",
+        "aria-disabled:tw-cursor-not-allowed",
+        "[&_svg]:tw-shrink-0"
+      ],
+      {
+        defaultVariants: {
+          size: "medium",
+          variant: "primary",
+          block: false
+        },
+        variants: {
+          block: {
+            true: ["tw-w-full"]
+          },
+          variant: {
+            primary: [
+              "tw-text-white",
+              "tw-bg-primary-500",
+              "focus:tw-text-white",
+              "hover:tw-text-white",
+              "hover:not-disabled:tw-bg-primary-600",
+              "active:not-disabled:tw-bg-primary-800",
+              // anchor disabled override
+              "aria-disabled:!tw-bg-primary-500"
+            ],
+            secondary: [
+              "tw-text-white",
+              "tw-bg-secondary-500",
+              "focus:tw-text-white",
+              "hover:tw-text-white",
+              "hover:not-disabled:tw-bg-secondary-700",
+              "active:not-disabled:tw-bg-secondary-800",
+              // anchor disabled override
+              "aria-disabled:!tw-bg-secondary-500"
+            ],
+            danger: [
+              "tw-text-white",
+              "tw-bg-error-500",
+              "focus:tw-text-white",
+              "hover:tw-text-white",
+              "hover:not-disabled:tw-bg-error-600",
+              "active:not-disabled:tw-bg-error-700",
+              // anchor disabled override
+              "aria-disabled:!tw-bg-error-500"
+            ],
+            invisible: [
+              "tw-text-neutral-800",
+              "tw-bg-transparent",
+              "focus:tw-text-neutral-800",
+              "hover:not-disabled:tw-bg-neutral-100",
+              "hover:tw-text-neutral-800",
+              "active:not-disabled:tw-bg-neutral-150",
+              // contrasting icon on hover/active
+              "[&_svg]:tw-text-neutral-400",
+              "[&_svg]:hover:not-disabled:tw-text-secondary-600",
+              "[&_svg]:active:not-disabled:tw-text-secondary-600",
+              // anchor disabled override
+              "aria-disabled:!tw-bg-transparent"
+            ],
+            outline: [
+              "tw-text-neutral-800",
+              "tw-bg-white",
+              // border
+              "!tw-border-neutral-200",
+              "hover:tw-text-neutral-800",
+              "focus:tw-text-neutral-800",
+              "hover:not-disabled:!tw-border-neutral-300",
+              "hover:not-disabled:tw-bg-neutral-100",
+              "active:not-disabled:tw-bg-neutral-200",
+              // contrasting icon hover, same as invisible
+              "[&_svg]:tw-text-neutral-400",
+              "[&_svg]:not-disabled:hover:tw-text-secondary-600",
+              "[&_svg]:active:not-disabled:tw-text-secondary-600",
+              // anchor disabled override
+              "aria-disabled:!tw-bg-white",
+              "aria-disabled:!tw-border-neutral-200"
+            ],
+            inline: [
+              "tw-text-neutral-800",
+              "tw-bg-transparent",
+              "tw-rounded-full",
+              "[&_svg]:tw-text-neutral-400",
+              "[&_svg]:not-disabled:hover:tw-text-secondary-600",
+              "[&_svg]:not-disabled:focus:tw-text-secondary-600"
+            ]
+          },
+          size: {
+            medium: ["tw-max-h-10", "tw-min-h-10", "tw-px-4", "tw-py-2.5", "[&_svg]:tw-size-4"],
+            small: ["tw-max-h-8", "tw-min-h-8", "tw-px-4", "tw-py-1.5", "[&_svg]:tw-size-4"],
+            large: ["tw-max-h-12", "tw-min-h-12", "tw-px-4", "tw-py-3.5", "[&_svg]:tw-size-4"],
+            "icon-lg": ["tw-size-12", "tw-p-0", "[&_svg]:tw-size-6"],
+            icon: ["tw-size-10", "tw-p-0", "[&_svg]:tw-size-4"],
+            "icon-sm": ["tw-size-8", "tw-p-0", "[&_svg]:tw-size-4"],
+            "icon-xs": ["tw-size-6", "tw-p-0", "[&_svg]:tw-size-4"],
+            "icon-2xs": ["!tw-inline-flex", "tw-size-5", "tw-max-h-5", "[&_svg]:tw-size-3"],
+            "icon-3xs": ["tw-h-fit", "tw-w-fit", "[&_svg]:tw-size-4"]
+          }
+        }
+      }
+    );
+    argoVariants = cva(
+      [
+        "tailwindcss-preflight",
+        // layout
+        "tw-relative",
+        "tw-inline-flex",
+        "tw-items-center",
+        "tw-justify-center",
+        "tw-whitespace-nowrap",
+        "tw-gap-2",
+        // border
+        "tw-border",
+        "tw-border-transparent",
+        "tw-rounded-lg",
+        // text
+        "tw-font-medium",
+        "tw-select-none",
+        // focus visible
+        "!tw-outline-none",
+        "focus-visible:tw-ring-2",
+        // disabled
+        "disabled:tw-cursor-not-allowed",
+        "disabled:tw-opacity-50",
+        "active:tw-opacity-60",
+        "tw-transition-all",
+        "tw-bg-clip-padding",
+        // anchor support
+        "!tw-no-underline",
+        // icon
+        "tw-shrink-0",
+        "[&_svg]:tw-pointer-events-none",
+        "[&_svg]:tw-shrink-0",
+        "[&_svg:not([class*='tw-size-'])]:tw-size-4"
+      ],
+      {
+        defaultVariants: {
+          variant: "primary",
+          size: "medium"
+        },
+        variants: {
+          block: {
+            true: ["tw-w-full"]
+          },
+          variant: {
+            primary: [
+              "tw-bg-primary",
+              "tw-text-primary-foreground",
+              "[a]:hover:tw-bg-primary/80",
+              "hover:not-disabled:tw-bg-primary/90",
+              "hover:tw-text-primary-foreground",
+              "focus:tw-text-primary-foreground",
+              "focus-visible:tw-border-primary",
+              "focus-visible:tw-ring-primary/50"
+            ],
+            secondary: [
+              "tw-bg-primary/10",
+              "tw-text-primary",
+              "hover:not-disabled:tw-bg-primary/20",
+              "focus-visible:tw-border-primary",
+              "focus-visible:tw-ring-primary/50"
+            ],
+            // should be called "destructive" by Figma
+            danger: [
+              "tw-bg-destructive",
+              "tw-text-destructive-foreground",
+              "hover:tw-text-destructive-foreground",
+              "focus:tw-text-destructive-foreground",
+              "focus-visible:tw-border-destructive",
+              "focus-visible:tw-ring-destructive/20"
+            ],
+            outline: [
+              "!tw-border-input",
+              "tw-bg-background",
+              "hover:not-disabled:tw-bg-accent",
+              "hover:not-disabled:tw-text-accent-foreground",
+              "hover:active:tw-bg-background",
+              "focus-visible:!tw-border-primary",
+              "focus-visible:tw-ring-primary/50"
+            ],
+            // should be called "ghost" by Figma
+            invisible: [
+              "tw-bg-transparent",
+              "tw-text-foreground",
+              "hover:not-disabled:tw-bg-accent",
+              "hover:not-disabled:tw-text-accent-foreground",
+              "hover:not-disabled:tw-border-accent",
+              "focus-visible:tw-ring-primary/50"
+            ],
+            // should be called "link" by Figma
+            inline: [
+              "tw-bg-transparent",
+              "tw-text-primary",
+              "hover:tw-underline",
+              "hover:active:tw-bg-transparent",
+              "focus-visible:tw-ring-primary/50"
+            ]
+          },
+          size: {
+            // should be called "default" by Figma
+            medium: ["tw-max-h-9", "tw-py-2", "tw-px-4", "tw-text-sm"],
+            // should be called "small" by Figma
+            small: ["tw-max-h-8", "tw-py-2", "tw-px-3", "tw-text-xs"],
+            // should be called "large" by Figma
+            large: ["tw-max-h-10", "tw-py-2.5", "tw-px-6", "tw-text-sm"],
+            "icon-lg": ["tw-size-10"],
+            icon: ["tw-size-9"],
+            "icon-sm": ["tw-size-8"],
+            // unsupported in ARGO, remove when old design is gone
+            "icon-xs": [],
+            "icon-2xs": [],
+            "icon-3xs": []
+          }
+        }
+      }
+    );
+  }
+});
+var Button;
+var init_Button = __esm({
+  "src/components/Button/Button.tsx"() {
+    init_icons();
+    init_utils();
+    init_Icon2();
+    init_styles();
+    Button = ({
+      ref,
+      children,
+      disabled = false,
+      className,
+      type = "button",
+      isLoading = false,
+      asChild = false,
+      onClick,
+      argo = false,
+      variant = "primary",
+      size = "medium",
+      block = false,
+      icon,
+      ...buttonProps
+    }) => {
+      const Comp = asChild ? Root$2 : "button";
+      const classNames = argo ? argoVariants({ variant, size, block, className }) : variants({
+        size,
+        variant,
+        block,
+        className
+      });
+      const handleClick = (event) => {
+        const isAnchor = event.currentTarget.tagName === "A";
+        if (isAnchor && disabled) {
+          event.preventDefault();
+          return;
+        }
+        onClick?.(event);
+      };
+      return /* @__PURE__ */ jsxs(
+        Comp,
+        {
+          ...buttonProps,
+          ref,
+          disabled,
+          "aria-disabled": disabled,
+          "data-variant": variant,
+          "data-icon-only": String(size).startsWith("icon"),
+          type,
+          onClick: handleClick,
+          className: cn(classNames),
+          children: [
+            isLoading && /* @__PURE__ */ jsx(Loader2, { className: "tw-size-4 tw-shrink-0 tw-animate-spin" }),
+            !isLoading && icon && /* @__PURE__ */ jsx(Icon, { icon }),
+            /* @__PURE__ */ jsx(Slottable, { children })
+          ]
+        }
+      );
+    };
+  }
+});
+var init_ButtonInline = __esm({
+  "src/components/Button/ButtonInline.tsx"() {
+    cva(
+      [
+        "tailwindcss-preflight",
+        "tw-inline-flex",
+        "tw-items-center",
+        "tw-gap-2",
+        "tw-underline-offset-2",
+        "disabled:tw-opacity-40",
+        "disabled:tw-cursor-not-allowed",
+        "disabled:tw-text-neutral-500",
+        "disabled:tw-no-underline",
+        "[&_svg]:disabled:tw-text-neutral-400"
+      ],
+      {
+        defaultVariants: {
+          variant: "link",
+          color: "link"
+        },
+        variants: {
+          color: {
+            link: [
+              "tw-text-secondary-500",
+              "hover:tw-text-secondary-600",
+              "[&_svg]:tw-text-secondary-500"
+            ],
+            dark: ["tw-text-neutral-800 [&_svg]:tw-text-neutral-400"],
+            danger: ["tw-text-error-500 [&_svg]:tw-text-error-500"],
+            muted: ["tw-text-muted-foreground [&_svg]:tw-text-muted-foreground"],
+            custom: []
+          },
+          variant: {
+            link: ["tw-underline", "hover:tw-no-underline"],
+            "link-reverse": ["tw-no-underline", "", "hover:tw-underline"],
+            custom: []
+          }
+        }
+      }
+    );
+  }
+});
+
+// src/components/Button/index.ts
+var init_Button2 = __esm({
+  "src/components/Button/index.ts"() {
+    init_Button();
+    init_ButtonInline();
+  }
+});
+var Clipboard;
+var init_Clipboard = __esm({
+  "src/components/Clipboard/Clipboard.tsx"() {
+    init_utils();
+    Clipboard = ({
+      ref,
+      text: textProp,
+      children,
+      tooltip = "Copy to Clipboard",
+      tooltipPlacement = "top",
+      tooltipVariant: tooltipVariantProp = "action",
+      asChild = false,
+      onClick,
+      className,
+      ...restButtonProps
+    }) => {
+      const [isTooltipOpen, setIsTooltipOpen] = useState(false);
+      const [state, setState] = useState("ready");
+      const text = typeof textProp === "function" ? textProp() : textProp;
+      const copy = async (text2) => {
+        try {
+          if (!document.hasFocus()) window.focus();
+          await copyToClipboard(text2);
+          setState("copied");
+        } catch {
+          setState("error");
+        }
+      };
+      const handleOnClick = (event) => {
+        if (text && state === "ready") void copy(text);
+        onClick?.(event);
+      };
+      const handleOnOpenChange = (open) => {
+        if (!open && state !== "ready") setState("ready");
+        setIsTooltipOpen(open);
+      };
+      const tooltipContent = (() => {
+        if (!text) return "Nothing to copy";
+        if (state === "error") return "Failed to copy";
+        if (state === "copied") return "Copied to Clipboard";
+        return tooltip;
+      })();
+      const tooltipVariant = state === "ready" && !!text ? tooltipVariantProp : "action";
+      return /* @__PURE__ */ jsxs(Tooltip$1.Root, { open: isTooltipOpen, onOpenChange: handleOnOpenChange, children: [
+        /* @__PURE__ */ jsx(
+          Tooltip$1.Trigger,
+          {
+            ...restButtonProps,
+            asChild,
+            keepOpenOnClick: true,
+            onClick: handleOnClick,
+            className: cn$1("tw-cursor-pointer", className),
+            ref,
+            children: children ?? text
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Tooltip$1.Content,
+          {
+            keepOpenOnPointerDownOutside: true,
+            placement: tooltipPlacement,
+            variant: tooltipVariant,
+            children: tooltipContent
+          }
+        )
+      ] });
+    };
+  }
+});
+
+// src/components/Clipboard/index.ts
+var init_Clipboard2 = __esm({
+  "src/components/Clipboard/index.ts"() {
+    init_Clipboard();
+  }
+});
+var DEFAULT_ICON, ClipboardButton;
+var init_ClipboardButton = __esm({
+  "src/blocks/ClipboardButton/ClipboardButton.tsx"() {
+    init_Button2();
+    init_Clipboard2();
+    init_icons();
+    DEFAULT_ICON = /* @__PURE__ */ jsx(Copy, {});
+    ClipboardButton = ({
+      // clipboard props
+      text,
+      tooltip,
+      tooltipPlacement,
+      tooltipVariant,
+      // button props
+      icon = DEFAULT_ICON,
+      variant = "outline",
+      children,
+      ...rest
+    }) => /* @__PURE__ */ jsx(
+      Clipboard,
+      {
+        asChild: true,
+        tooltip,
+        tooltipPlacement,
+        tooltipVariant,
+        text,
+        children: /* @__PURE__ */ jsxs(Button, { ...rest, variant, disabled: !text, children: [
+          icon,
+          children
+        ] })
+      }
+    );
+  }
+});
+
+// src/blocks/ClipboardButton/index.ts
+var init_ClipboardButton2 = __esm({
+  "src/blocks/ClipboardButton/index.ts"() {
+    init_ClipboardButton();
+  }
+});
+var MIN_SCALE, MAX_SCALE, ZOOM_STEP, ZoomableSvg;
+var init_ZoomableSvg = __esm({
+  "src/components/ZoomableSvg/ZoomableSvg.tsx"() {
+    init_ClipboardButton2();
+    init_icons();
+    init_utils();
+    init_Button2();
+    init_Tooltip2();
+    MIN_SCALE = 0.5;
+    MAX_SCALE = 3;
+    ZOOM_STEP = 0.1;
+    ZoomableSvg = ({ html, copyText, className }) => {
+      const containerRef = useRef(null);
+      const [scale, setScale] = useState(1);
+      const [translate, setTranslate] = useState({ x: 0, y: 0 });
+      const [isFullscreen, setIsFullscreen] = useState(false);
+      useEffect(() => {
+        if (!isFullscreen) return;
+        const onKeyDown = (e) => {
+          if (e.key === "Escape") {
+            e.stopPropagation();
+            setIsFullscreen(false);
+          }
+        };
+        document.addEventListener("keydown", onKeyDown, { capture: true });
+        return () => document.removeEventListener("keydown", onKeyDown, { capture: true });
+      }, [isFullscreen]);
+      const dragRef = useRef(null);
+      useEffect(() => {
+        const el = containerRef.current;
+        if (!el) return;
+        const onWheel = (e) => {
+          if (!e.ctrlKey && !e.metaKey) return;
+          e.preventDefault();
+          const delta = e.deltaY > 0 ? -ZOOM_STEP : ZOOM_STEP;
+          setScale((s) => Math.min(MAX_SCALE, Math.max(MIN_SCALE, s + delta)));
+        };
+        el.addEventListener("wheel", onWheel, { passive: false });
+        return () => el.removeEventListener("wheel", onWheel);
+      }, []);
+      const didDragRef = useRef(false);
+      const handleMouseDown = useCallback(
+        (e) => {
+          if (e.button !== 0) return;
+          e.preventDefault();
+          didDragRef.current = false;
+          dragRef.current = {
+            startX: e.clientX,
+            startY: e.clientY,
+            startTx: translate.x,
+            startTy: translate.y
+          };
+        },
+        [translate]
+      );
+      const handleMouseMove = useCallback((e) => {
+        if (!dragRef.current) return;
+        didDragRef.current = true;
+        setTranslate({
+          x: dragRef.current.startTx + e.clientX - dragRef.current.startX,
+          y: dragRef.current.startTy + e.clientY - dragRef.current.startY
+        });
+      }, []);
+      const handleMouseUp = useCallback(() => {
+        dragRef.current = null;
+      }, []);
+      const handleReset = useCallback(() => {
+        setScale(1);
+        setTranslate({ x: 0, y: 0 });
+      }, []);
+      const isZoomed = Math.abs(scale - 1) > 1e-3 || translate.x !== 0 || translate.y !== 0;
+      const handleClick = useCallback((e) => {
+        if (didDragRef.current) {
+          e.stopPropagation();
+        }
+      }, []);
+      const stopPropagation = useCallback((e) => {
+        e.stopPropagation();
+      }, []);
+      const diagramContent = /* @__PURE__ */ jsxs(
+        "div",
+        {
+          role: "presentation",
+          className: cn("tw-group/zoom tw-relative", isFullscreen && "tw-h-full"),
+          onClick: handleClick,
+          children: [
+            /* @__PURE__ */ jsx(
+              "div",
+              {
+                role: "presentation",
+                ref: containerRef,
+                className: cn(
+                  "tw-overflow-hidden tw-cursor-grab active:tw-cursor-grabbing tw-p-3",
+                  isFullscreen && "tw-h-full"
+                ),
+                onMouseDown: handleMouseDown,
+                onMouseMove: handleMouseMove,
+                onMouseUp: handleMouseUp,
+                onMouseLeave: handleMouseUp,
+                children: /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    className: cn(
+                      "tw-flex tw-justify-center tw-origin-center",
+                      isFullscreen && "tw-h-full [&>svg]:tw-h-full"
+                    ),
+                    style: { transform: `translate(${translate.x}px, ${translate.y}px) scale(${scale})` },
+                    dangerouslySetInnerHTML: { __html: html }
+                  }
+                )
+              }
+            ),
+            /* @__PURE__ */ jsxs(
+              "div",
+              {
+                role: "presentation",
+                className: "tw-absolute tw-right-1 tw-top-1 tw-flex tw-gap-1 tw-opacity-0 tw-transition-opacity group-hover/zoom:tw-opacity-100",
+                onClick: stopPropagation,
+                children: [
+                  isZoomed && /* @__PURE__ */ jsx(Tooltip, { tooltip: "Reset zoom", placement: "top", triggerAsChild: true, children: /* @__PURE__ */ jsx(Button, { size: "small", variant: "outline", onClick: handleReset, argo: true, children: "Reset" }) }),
+                  copyText && /* @__PURE__ */ jsx(
+                    ClipboardButton,
+                    {
+                      text: copyText,
+                      tooltip: "Copy code",
+                      size: "icon-sm",
+                      variant: "outline",
+                      argo: true
+                    }
+                  ),
+                  /* @__PURE__ */ jsx(
+                    Tooltip,
+                    {
+                      tooltip: isFullscreen ? "Exit fullscreen" : "Fullscreen",
+                      placement: "top",
+                      triggerAsChild: true,
+                      children: /* @__PURE__ */ jsx(
+                        Button,
+                        {
+                          size: "icon-sm",
+                          variant: "outline",
+                          "aria-label": isFullscreen ? "Exit fullscreen" : "Fullscreen",
+                          onClick: () => setIsFullscreen((f) => !f),
+                          argo: true,
+                          children: isFullscreen ? /* @__PURE__ */ jsx(Minimize2, { className: "tw-size-4" }) : /* @__PURE__ */ jsx(Maximize2, { className: "tw-size-4" })
+                        }
+                      )
+                    }
+                  )
+                ]
+              }
+            )
+          ]
+        }
+      );
+      if (isFullscreen) {
+        return /* @__PURE__ */ jsx(
+          "div",
+          {
+            role: "presentation",
+            className: "tw-fixed tw-inset-0 tw-z-[1060] tw-bg-neutral-50 tw-p-4",
+            onClick: stopPropagation,
+            children: diagramContent
+          }
+        );
+      }
+      return /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: cn(
+            "tw-overflow-hidden tw-rounded-md tw-border tw-border-neutral-150 tw-bg-neutral-50",
+            className
+          ),
+          children: diagramContent
+        }
+      );
+    };
+  }
+});
+
+// src/components/ZoomableSvg/index.ts
+var init_ZoomableSvg2 = __esm({
+  "src/components/ZoomableSvg/index.ts"() {
+    init_ZoomableSvg();
+  }
+});
+
+// src/blocks/MermaidDiagram/MermaidDiagram.tsx
+var MermaidDiagram_exports = {};
+__export(MermaidDiagram_exports, {
+  MermaidDiagram: () => MermaidDiagram
+});
+var mermaidPromise, getMermaid, stripFontImports, tryFastRender, makeResponsive, RENDER_DEBOUNCE_MS, svgCache, MermaidDiagram;
+var init_MermaidDiagram = __esm({
+  "src/blocks/MermaidDiagram/MermaidDiagram.tsx"() {
+    init_Skeleton();
+    init_ZoomableSvg2();
+    init_utils();
+    mermaidPromise = null;
+    getMermaid = () => {
+      if (!mermaidPromise) {
+        mermaidPromise = import('mermaid').then((m) => {
+          m.default.initialize({
+            startOnLoad: false,
+            securityLevel: "strict",
+            theme: "base",
+            themeVariables: {
+              primaryColor: colors.secondary[100],
+              primaryTextColor: colors.neutral[800],
+              primaryBorderColor: colors.secondary[700],
+              secondaryColor: colors.white,
+              secondaryTextColor: colors.neutral[800],
+              secondaryBorderColor: colors.neutral[150],
+              tertiaryColor: colors.warning[100],
+              tertiaryTextColor: colors.neutral[800],
+              tertiaryBorderColor: colors.warning[500],
+              lineColor: colors.neutral[300],
+              textColor: colors.neutral[800],
+              mainBkg: colors.secondary[100],
+              nodeBorder: colors.secondary[700],
+              clusterBkg: colors.white,
+              clusterBorder: colors.neutral[150],
+              titleColor: colors.neutral[800],
+              edgeLabelBackground: colors.white,
+              nodeTextColor: colors.neutral[800],
+              actorBorder: colors.secondary[700],
+              actorBkg: colors.secondary[100],
+              actorTextColor: colors.neutral[800],
+              actorLineColor: colors.neutral[300],
+              signalColor: colors.neutral[800],
+              signalTextColor: colors.neutral[800],
+              labelBoxBkgColor: colors.secondary[100],
+              labelBoxBorderColor: colors.secondary[700],
+              labelTextColor: colors.neutral[800],
+              loopTextColor: colors.neutral[800],
+              noteBorderColor: colors.warning[500],
+              noteBkgColor: colors.warning[100],
+              noteTextColor: colors.neutral[800],
+              sectionBkgColor: colors.secondary[100],
+              altSectionBkgColor: colors.white,
+              sectionBkgColor2: colors.neutral[100],
+              taskBorderColor: colors.secondary[700],
+              taskBkgColor: colors.secondary[100],
+              taskTextColor: colors.neutral[800],
+              taskTextDarkColor: colors.neutral[800],
+              taskTextLightColor: colors.neutral[800],
+              activeTaskBorderColor: colors.primary.DEFAULT,
+              activeTaskBkgColor: colors.secondary[200],
+              doneTaskBorderColor: colors.primary[600],
+              doneTaskBkgColor: colors.primary[100],
+              critBorderColor: colors.error[500],
+              critBkgColor: colors.error[100],
+              fontFamily: "Inter, system-ui, sans-serif",
+              fontSize: "14px"
+            }
+          });
+          return m;
+        }).catch((err) => {
+          mermaidPromise = null;
+          throw err;
+        });
+      }
+      return mermaidPromise;
+    };
+    stripFontImports = (svg) => svg.replace(/@import\s+url\([^)]*fonts\.googleapis\.com[^)]*\);?\s*/g, "");
+    tryFastRender = (code) => {
+      try {
+        return stripFontImports(
+          renderMermaidSVG(code, {
+            bg: colors.white,
+            fg: colors.neutral[800],
+            transparent: true,
+            font: "Inter, system-ui, sans-serif"
+          })
+        );
+      } catch {
+        return null;
+      }
+    };
+    makeResponsive = (svgString) => {
+      const viewBoxMatch = svgString.match(/viewBox="[^"]*\s([\d.]+)\s[\d.]+"/);
+      const vbWidth = viewBoxMatch ? Math.round(Number(viewBoxMatch[1])) : void 0;
+      let result = svgString.replace(/(<svg[^>]*?)\s+width="[^"]*"/i, '$1 width="100%"').replace(/(<svg[^>]*?)\s+height="[^"]*"/i, "$1");
+      if (!vbWidth) return result;
+      const hasStyle = /(<svg[^>]*?)\s+style="([^"]*)"/i.test(result);
+      if (hasStyle) {
+        result = result.replace(/(<svg[^>]*?)\s+style="([^"]*)"/i, (_m, pre, styles) => {
+          const cleaned = styles.replace(/max-width:\s*[^;"]*;?\s*/g, "").trim();
+          const combined = [cleaned, `max-width: ${vbWidth}px`].filter(Boolean).join("; ");
+          return `${pre} style="${combined}"`;
+        });
+      } else {
+        result = result.replace(/<svg/, `<svg style="max-width: ${vbWidth}px"`);
+      }
+      return result;
+    };
+    RENDER_DEBOUNCE_MS = 300;
+    svgCache = /* @__PURE__ */ new Map();
+    MermaidDiagram = ({ code }) => {
+      const id = useId();
+      const [svg, setSvg] = useState(() => {
+        const cached = svgCache.get(code);
+        if (cached) return cached;
+        const fast = tryFastRender(code);
+        if (fast) {
+          svgCache.set(code, fast);
+          return fast;
+        }
+        return null;
+      });
+      const [renderFailed, setRenderFailed] = useState(false);
+      const debounceRef = useRef(null);
+      const renderIdRef = useRef(0);
+      const [prevCode, setPrevCode] = useState(code);
+      if (code !== prevCode) {
+        setPrevCode(code);
+        const cached = svgCache.get(code);
+        const fast = cached ?? tryFastRender(code);
+        if (fast && !cached) svgCache.set(code, fast);
+        setSvg(fast);
+        setRenderFailed(false);
+      }
+      useEffect(() => {
+        if (svgCache.has(code)) {
+          setSvg(svgCache.get(code));
+          setRenderFailed(false);
+          return;
+        }
+        const fastResult = tryFastRender(code);
+        if (fastResult) {
+          svgCache.set(code, fastResult);
+          setSvg(fastResult);
+          setRenderFailed(false);
+          return;
+        }
+        setSvg(null);
+        const currentRenderId = ++renderIdRef.current;
+        setRenderFailed(false);
+        if (debounceRef.current) {
+          clearTimeout(debounceRef.current);
+        }
+        debounceRef.current = setTimeout(() => {
+          getMermaid().then(async (mermaidModule) => {
+            if (renderIdRef.current !== currentRenderId) return;
+            const rendererId = `mermaid-${id.replaceAll(":", "")}`;
+            const container = document.createElement("div");
+            container.style.visibility = "hidden";
+            container.style.position = "absolute";
+            container.style.top = "-9999px";
+            container.style.width = "900px";
+            document.body.appendChild(container);
+            try {
+              const result = await mermaidModule.default.render(rendererId, code, container);
+              if (renderIdRef.current === currentRenderId && result) {
+                svgCache.set(code, result.svg);
+                setSvg(result.svg);
+                setRenderFailed(false);
+              }
+            } finally {
+              container.remove();
+            }
+          }).catch((err) => {
+            if (renderIdRef.current === currentRenderId) {
+              console.error("[MermaidDiagram] fallback failed:", err);
+              setSvg(null);
+              setRenderFailed(true);
+            }
+          });
+        }, RENDER_DEBOUNCE_MS);
+        const timer = debounceRef.current;
+        const renderId = renderIdRef;
+        return () => {
+          renderId.current++;
+          if (timer) {
+            clearTimeout(timer);
+          }
+        };
+      }, [code, id]);
+      const processedSvg = svg ? makeResponsive(svg) : null;
+      if (renderFailed) {
+        return /* @__PURE__ */ jsx(
+          "pre",
+          {
+            className: cn(
+              "tw-my-3 tw-overflow-auto tw-whitespace-pre-wrap tw-break-all",
+              "tw-py-3 tw-px-4",
+              "tw-bg-neutral-50",
+              "tw-rounded-md tw-text-neutral-400",
+              "tw-text-sm tw-font-mono"
+            ),
+            children: /* @__PURE__ */ jsx("code", { children: code })
+          }
+        );
+      }
+      if (processedSvg) {
+        return /* @__PURE__ */ jsx(
+          ZoomableSvg,
+          {
+            html: processedSvg,
+            copyText: `\`\`\`mermaid
+${code}
+\`\`\``,
+            className: "tw-my-3"
+          },
+          code
+        );
+      }
+      return /* @__PURE__ */ jsx("div", { className: "tw-my-3 tw-overflow-hidden tw-rounded-md tw-border tw-border-neutral-150 tw-bg-neutral-50 tw-p-6", children: /* @__PURE__ */ jsx(Skeleton, { className: "tw-h-40" }) });
+    };
+  }
+});
+
+// src/components/MarkdownEditor/MarkdownEditor.tsx
+init_utils();
+var ImageRendererContext = createContext(null);
+var ImageRendererProvider = ImageRendererContext;
+var useImageRenderer = () => use(ImageRendererContext);
+var isPlaceholder = (src) => src.startsWith("upload-placeholder-");
+var ImageNodeComponent = ({ src, alt }) => {
+  const renderer = useImageRenderer();
+  if (isPlaceholder(src)) {
+    return /* @__PURE__ */ jsx("span", { className: "tw-inline-flex tw-items-center tw-gap-1 tw-rounded tw-bg-neutral-100 tw-px-2 tw-py-1 tw-text-xs tw-text-neutral-400", children: "Uploading image\u2026" });
+  }
+  if (renderer) return /* @__PURE__ */ jsx(Fragment, { children: renderer({ src, alt }) });
+  return /* @__PURE__ */ jsx("img", { src, alt });
+};
+var ImageNode = class _ImageNode extends DecoratorNode {
+  __src;
+  __altText;
+  static getType() {
+    return "image";
+  }
+  static clone(node) {
+    return new _ImageNode(node.__src, node.__altText, node.__key);
+  }
+  constructor(src, altText, key) {
+    super(key);
+    this.__src = src;
+    this.__altText = altText;
+  }
+  getSrc() {
+    return this.__src;
+  }
+  getAlt() {
+    return this.__altText;
+  }
+  setSrc(src) {
+    const writable = this.getWritable();
+    writable.__src = src;
+  }
+  setAlt(altText) {
+    const writable = this.getWritable();
+    writable.__altText = altText;
+  }
+  createDOM(config) {
+    const span = document.createElement("span");
+    const className = config.theme.image;
+    if (typeof className === "string") {
+      span.className = className;
+    }
+    return span;
+  }
+  updateDOM() {
+    return false;
+  }
+  decorate() {
+    return /* @__PURE__ */ jsx(ImageNodeComponent, { src: this.__src, alt: this.__altText });
+  }
+  isInline() {
+    return true;
+  }
+  static importJSON(serializedNode) {
+    return $createImageNode(serializedNode.src, serializedNode.altText);
+  }
+  exportJSON() {
+    return {
+      type: "image",
+      version: 1,
+      src: this.__src,
+      altText: this.__altText
+    };
+  }
+  exportDOM() {
+    const element = document.createElement("img");
+    element.setAttribute("src", this.__src);
+    element.setAttribute("alt", this.__altText);
+    return { element };
+  }
+  static importDOM() {
+    return {
+      img: () => ({
+        conversion: (domNode) => {
+          const src = domNode.getAttribute("src") || "";
+          const alt = domNode.getAttribute("alt") || "";
+          return { node: $createImageNode(src, alt) };
+        },
+        priority: 0
+      })
+    };
+  }
+};
+var $createImageNode = (src, altText) => {
+  return new ImageNode(src, altText);
+};
+var $isImageNode = (node) => {
+  return node instanceof ImageNode;
+};
+
+// src/components/MarkdownEditor/nodes/MermaidNodeComponent.tsx
+init_Skeleton();
+var MermaidDiagram2 = lazy(
+  () => Promise.resolve().then(() => (init_MermaidDiagram(), MermaidDiagram_exports)).then(
+    (m) => ({ default: m.MermaidDiagram }),
+    (error) => {
+      console.error("[MarkdownEditor] failed to load MermaidDiagram chunk", error);
+      return {
+        default: ({ code }) => /* @__PURE__ */ jsx("pre", { children: /* @__PURE__ */ jsx("code", { children: code }) })
+      };
+    }
+  )
+);
+var MermaidNodeComponent = ({ code }) => {
+  return /* @__PURE__ */ jsx(
+    Suspense,
+    {
+      fallback: /* @__PURE__ */ jsx("div", { className: "tw-my-3 tw-overflow-hidden tw-rounded-card tw-border tw-border-neutral-150 tw-bg-neutral-50 tw-p-6", children: /* @__PURE__ */ jsx(Skeleton, { className: "tw-h-40" }) }),
+      children: /* @__PURE__ */ jsx(MermaidDiagram2, { code })
+    }
+  );
+};
+var MermaidNode = class _MermaidNode extends DecoratorNode {
+  __code;
+  static getType() {
+    return "mermaid";
+  }
+  static clone(node) {
+    return new _MermaidNode(node.__code, node.__key);
+  }
+  constructor(code, key) {
+    super(key);
+    this.__code = code;
+  }
+  getCode() {
+    return this.__code;
+  }
+  setCode(code) {
+    const writable = this.getWritable();
+    writable.__code = code;
+  }
+  createDOM() {
+    const div = document.createElement("div");
+    div.setAttribute("data-lexical-mermaid", "true");
+    return div;
+  }
+  updateDOM() {
+    return false;
+  }
+  decorate() {
+    return /* @__PURE__ */ jsx(MermaidNodeComponent, { code: this.__code });
+  }
+  isInline() {
+    return false;
+  }
+  static importJSON(serializedNode) {
+    return $createMermaidNode(serializedNode.code);
+  }
+  exportJSON() {
+    return {
+      type: "mermaid",
+      version: 1,
+      code: this.__code
+    };
+  }
+};
+var $createMermaidNode = (code) => {
+  return new MermaidNode(code);
+};
+var $isMermaidNode = (node) => {
+  return node instanceof MermaidNode;
+};
+
+// src/components/Toast/toast.tsx
+init_utils();
+
+// src/components/Toast/ToastRoot.tsx
+init_icons();
+init_utils();
+
+// src/utils/legacyIcon.tsx
+init_Icon2();
+var isFAIconValue = (value) => typeof value === "string" || Array.isArray(value) && value.length === 2 && typeof value[0] === "string" && typeof value[1] === "string";
+var renderLegacyIcon = (value) => isFAIconValue(value) ? /* @__PURE__ */ jsx(Icon, { icon: value }) : value;
+
+// src/components/Toast/ToastAction.tsx
+init_utils();
+var ToastAction = ({
+  ref,
+  className,
+  ...rest
+}) => /* @__PURE__ */ jsx(
+  "button",
+  {
+    ...rest,
+    ref,
+    "data-slot": "toast-action",
+    type: "button",
+    className: cn(
+      // layout
+      "tw-col-start-3",
+      "tw-row-start-1",
+      "tw-flex",
+      "tw-items-center",
+      "tw-justify-center",
+      // font
+      "tw-text-xs",
+      "tw-font-medium",
+      "tw-text-primary",
+      // sizing
+      "tw-px-2",
+      "tw-h-6",
+      // styles
+      "tw-bg-primary-foreground",
+      "tw-rounded",
+      className
+    )
+  }
+);
+
+// src/components/Toast/ToastDescription.tsx
+init_utils();
+var ToastDescription = ({
+  ref,
+  className,
+  children,
+  ...rest
+}) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    ref,
+    "data-slot": "toast-description",
+    className: cn(
+      "tw-col-start-2",
+      "tw-font-normal",
+      "tw-break-words",
+      "tw-text-white",
+      "group-data-[variant=default]/toast:tw-text-muted-foreground",
+      className
+    ),
+    ...rest,
+    children
+  }
+);
+
+// src/components/Toast/ToastDismiss.tsx
+init_icons();
+init_utils();
+var ToastDismiss = ({
+  ref,
+  className,
+  ...rest
+}) => /* @__PURE__ */ jsxs(
+  "button",
+  {
+    ref,
+    "data-slot": "toast-dismiss",
+    className: cn(
+      "tw-flex",
+      "tw-justify-center",
+      "tw-col-start-4",
+      "tw-row-start-1",
+      "tailwindcss-preflight",
+      "[&_svg]:tw-aspect-square",
+      "[&_svg]:tw-size-4",
+      "[&_svg]:tw-m-1",
+      "tw-text-white",
+      "group-data-[variant=default]/toast:[&_svg]:tw-text-popover-foreground",
+      className
+    ),
+    type: "button",
+    ...rest,
+    children: [
+      /* @__PURE__ */ jsx(X, {}),
+      /* @__PURE__ */ jsx("span", { className: "tw-sr-only", children: "Dismiss" })
+    ]
+  }
+);
+
+// src/components/Toast/ToastDuration.tsx
+init_utils();
+var ToastDuration = ({
+  ref,
+  duration,
+  className,
+  style,
+  ...rest
+}) => /* @__PURE__ */ jsx(
+  "span",
+  {
+    ...rest,
+    ref,
+    className: cn(
+      "tw-bg-white/30",
+      "group-data-[variant=default]/toast:tw-bg-popover-foreground/20",
+      "tw-rounded-bl-lg",
+      "tw-mx-px",
+      // positioning
+      "tw-absolute",
+      "tw-bottom-0",
+      "tw-left-0",
+      // sizing
+      "tw-h-1",
+      // animation
+      "tw-animate-toast-progress",
+      "group-hover/toast:[animation-play-state:paused]",
+      className
+    ),
+    style: {
+      animationDuration: `${duration}ms`,
+      ...style
+    }
+  }
+);
+
+// src/components/Toast/ToastTitle.tsx
+init_utils();
+var ToastTitle = ({
+  ref,
+  className,
+  children,
+  ...rest
+}) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    ref,
+    "data-slot": "toast-title",
+    className: cn(
+      "tw-col-start-2",
+      "tw-text-sm",
+      "tw-leading-6",
+      "tw-min-h-6",
+      "tw-self-center",
+      "tw-text-white",
+      "group-data-[variant=default]/toast:tw-text-popover-foreground",
+      "tw-break-words",
+      "tw-font-medium",
+      className
+    ),
+    ...rest,
+    children
+  }
+);
+var variants2 = cva(
+  [
+    "tailwindcss-preflight",
+    "tw-group/toast",
+    "tw-relative",
+    // layout
+    "tw-grid",
+    "tw-grid-cols-[0_1fr_auto_auto]",
+    "tw-items-start",
+    "has-[[data-slot=toast-description]]:tw-grid-rows-[auto_auto]",
+    "has-[[data-slot=toast-icon]]:tw-grid-cols-[auto_1fr_auto_auto]",
+    "[&_[data-slot=toast-icon]]:tw-mr-2",
+    "[&_[data-slot=toast-title]]:tw-mr-2.5",
+    "[&_[data-slot=toast-description]]:tw-mr-2.5",
+    "[&_[data-slot=toast-action]]:tw-mr-2",
+    "[&_[data-slot=toast-description]]:tw-col-end-3",
+    "tw-gap-y-0",
+    // styles
+    "tw-p-4",
+    "tw-rounded-lg",
+    "tw-shadow-md"
+  ],
+  {
+    defaultVariants: {
+      variant: "info"
+    },
+    variants: {
+      variant: {
+        default: "tw-border tw-border-border tw-bg-popover",
+        error: "tw-bg-error-550",
+        info: "tw-bg-secondary-600",
+        success: "tw-bg-primary-700",
+        warning: "tw-bg-warning-550"
+      }
+    }
+  }
+);
+var DEFAULT_VARIANT_ICON = {
+  error: /* @__PURE__ */ jsx(AlertTriangle, {}),
+  info: /* @__PURE__ */ jsx(Info, {}),
+  success: /* @__PURE__ */ jsx(CircleCheck, {}),
+  warning: /* @__PURE__ */ jsx(AlertCircle, {})
+};
+var ToastRoot = ({
+  id,
+  title,
+  description,
+  action,
+  duration = Infinity,
+  variant = "info",
+  loading = false,
+  icon: iconProp
+}) => {
+  const icon = (() => {
+    if (loading) return /* @__PURE__ */ jsx(Loader2, { className: "tw-animate-spin" });
+    if (iconProp) return renderLegacyIcon(iconProp);
+    if (variant === "default" || variant === null) return null;
+    return DEFAULT_VARIANT_ICON[variant];
+  })();
+  const handleActionClick = (event) => {
+    toast$1.dismiss(id);
+    action?.onClick(event);
+  };
+  return /* @__PURE__ */ jsxs("div", { "data-variant": variant, className: cn(variants2({ variant })), children: [
+    icon && /* @__PURE__ */ jsx(
+      "span",
+      {
+        "data-slot": "toast-icon",
+        className: cn(
+          "tw-inline-flex",
+          "tw-items-center",
+          "tw-justify-center",
+          // styles — container at 20px with no padding so the 20px Lucide
+          // glyph fills the slot (previous tw-size-4 + tw-p-1 clipped a
+          // 16px child into 8px of visible space)
+          "tw-aspect-square",
+          "tw-size-5",
+          "tw-shrink-0",
+          "[&_svg]:tw-size-5",
+          "tw-text-white",
+          "group-data-[variant=default]/toast:tw-text-popover-foreground"
+        ),
+        children: icon
+      }
+    ),
+    /* @__PURE__ */ jsx(ToastTitle, { children: title }),
+    description && /* @__PURE__ */ jsx(ToastDescription, { children: description }),
+    action && /* @__PURE__ */ jsx(ToastAction, { style: action?.actionButtonStyle, onClick: handleActionClick, children: action.label }),
+    /* @__PURE__ */ jsx(ToastDismiss, { onClick: () => toast$1.dismiss(id) }),
+    duration !== Infinity && /* @__PURE__ */ jsx(ToastDuration, { duration })
+  ] });
+};
+var toast = ({
+  onAutoClose,
+  onDismiss,
+  testId,
+  toasterId,
+  dismissible = true,
+  position,
+  title: titleProp,
+  ...toast2
+}) => {
+  const duration = (() => {
+    if (typeof toast2.duration === "number") return toast2.duration;
+    if (toast2.variant === "error" || toast2.variant === "warning") return Infinity;
+    return toast2.duration ?? 5e3;
+  })();
+  const renderCustomToast = (id) => {
+    const title = typeof titleProp === "function" ? titleProp({ dismiss: () => toast$1.dismiss(id) }) : titleProp;
+    return /* @__PURE__ */ jsx(ToastRoot, { ...toast2, id, title, duration });
+  };
+  return toast$1.custom(renderCustomToast, {
+    // toast generated by sonner will always have an id, but we want to allow users to specify their own id if they want to
+    // can not pass undefined, as it will break dismiss
+    ...toast2.id != null ? { id: toast2.id } : {},
+    unstyled: true,
+    position,
+    onAutoClose,
+    onDismiss,
+    testId,
+    toasterId,
+    dismissible,
+    duration,
+    // override defult focus-visible styles to match our design
+    className: cn("tw-rounded-lg", "focus-visible:!tw-ring-4", "focus-visible:!tw-ring-primary/50")
+  });
+};
+toast.success = (title, options) => toast({
+  ...options,
+  title,
+  variant: "success"
+});
+toast.error = (title, options) => toast({
+  ...options,
+  title,
+  variant: "error",
+  duration: options?.duration ?? Infinity
+});
+toast.warning = (title, options) => toast({
+  ...options,
+  title,
+  variant: "warning",
+  duration: options?.duration ?? Infinity
+});
+toast.info = (title, options) => toast({
+  ...options,
+  title,
+  variant: "info"
+});
+toast.dismiss = (toastId) => toast$1.dismiss(toastId);
+toast.dismissAll = () => toast$1.dismiss();
+
+// src/components/MarkdownEditor/plugins/ImagePastePlugin.tsx
+var ACCEPTED_IMAGE_TYPES = [
+  "image/png",
+  "image/jpeg",
+  "image/gif",
+  "image/webp",
+  "image/svg+xml"
+];
+var MAX_IMAGE_SIZE = 10 * 1024 * 1024;
+var PLACEHOLDER_PREFIX = "upload-placeholder-";
+var generatePlaceholderId = () => {
+  if (typeof crypto !== "undefined" && typeof crypto.randomUUID === "function") {
+    return crypto.randomUUID();
+  }
+  return `${Date.now()}-${Math.random().toString(36).slice(2)}`;
+};
+var isAcceptedImageType = (type) => ACCEPTED_IMAGE_TYPES.includes(type);
+var getImageFilesFromDataTransfer = (dataTransfer) => {
+  if (!dataTransfer) return [];
+  if (dataTransfer.items.length > 0) {
+    const files = [];
+    for (const item of dataTransfer.items) {
+      if (item.kind === "file" && isAcceptedImageType(item.type)) {
+        const file = item.getAsFile();
+        if (file) files.push(file);
+      }
+    }
+    if (files.length > 0) return files;
+  }
+  return Array.from(dataTransfer.files).filter((file) => isAcceptedImageType(file.type));
+};
+var escapeMarkdownAlt = (text) => text.replace(/[[\]()]/g, "");
+var ImagePastePlugin = ({ onImageUpload }) => {
+  const [editor] = useLexicalComposerContext();
+  const onImageUploadRef = useRef(onImageUpload);
+  onImageUploadRef.current = onImageUpload;
+  useEffect(() => {
+    const uploadFile = (file) => {
+      const upload = onImageUploadRef.current;
+      if (!upload) return;
+      if (file.size > MAX_IMAGE_SIZE) {
+        toast.error(`Image "${file.name}" is too large. Maximum size is 10 MB.`);
+        return;
+      }
+      let nodeKey = null;
+      editor.update(() => {
+        const placeholderNode = $createImageNode(
+          `${PLACEHOLDER_PREFIX}${generatePlaceholderId()}`,
+          "Uploading image\u2026"
+        );
+        $insertNodes([placeholderNode]);
+        nodeKey = placeholderNode.getKey();
+      });
+      if (!nodeKey) return;
+      const capturedKey = nodeKey;
+      upload(file).then(({ url }) => {
+        editor.update(() => {
+          const node = $getNodeByKey(capturedKey);
+          if ($isImageNode(node)) {
+            const altText = escapeMarkdownAlt(file.name.replace(/\.[^.]+$/, "") || "image");
+            node.setSrc(url);
+            node.setAlt(altText);
+          }
+        });
+      }).catch((error) => {
+        console.error("[MarkdownEditor] image upload failed", error);
+        toast.error(`Failed to upload "${file.name}". Please try again.`);
+        editor.update(() => {
+          const node = $getNodeByKey(capturedKey);
+          if (node) node.remove();
+        });
+      });
+    };
+    const removePaste = editor.registerCommand(
+      PASTE_COMMAND,
+      (event) => {
+        if (!onImageUploadRef.current) return false;
+        if (!(event instanceof ClipboardEvent)) return false;
+        const files = getImageFilesFromDataTransfer(event.clipboardData);
+        if (files.length === 0) return false;
+        event.preventDefault();
+        Promise.resolve().then(() => files.forEach(uploadFile));
+        return true;
+      },
+      COMMAND_PRIORITY_CRITICAL
+    );
+    const removeDrop = editor.registerCommand(
+      DROP_COMMAND,
+      (event) => {
+        if (!onImageUploadRef.current) return false;
+        const files = getImageFilesFromDataTransfer(event.dataTransfer);
+        if (files.length === 0) return false;
+        event.preventDefault();
+        Promise.resolve().then(() => files.forEach(uploadFile));
+        return true;
+      },
+      COMMAND_PRIORITY_CRITICAL
+    );
+    return () => {
+      removePaste();
+      removeDrop();
+    };
+  }, [editor]);
+  return null;
+};
+var KeyboardPlugin = ({
+  onSave,
+  onCancel,
+  singleLine,
+  blurOnEscape,
+  skipBlurSaveRef
+}) => {
+  const [editor] = useLexicalComposerContext();
+  const onSaveRef = useRef(onSave);
+  onSaveRef.current = onSave;
+  const onCancelRef = useRef(onCancel);
+  onCancelRef.current = onCancel;
+  const singleLineRef = useRef(singleLine);
+  singleLineRef.current = singleLine;
+  const blurOnEscapeRef = useRef(blurOnEscape);
+  blurOnEscapeRef.current = blurOnEscape;
+  const skipBlurSaveExternalRef = skipBlurSaveRef;
+  useEffect(() => {
+    return editor.registerCommand(
+      KEY_DOWN_COMMAND,
+      (event) => {
+        if (event.key === "Enter" && (event.ctrlKey || event.metaKey)) {
+          event.preventDefault();
+          onSaveRef.current?.();
+          return true;
+        }
+        if (event.key === "Enter" && !event.shiftKey && !event.altKey && singleLineRef.current) {
+          event.preventDefault();
+          editor.getRootElement()?.blur();
+          return true;
+        }
+        if (event.key === "Escape" && blurOnEscapeRef.current) {
+          if (skipBlurSaveExternalRef) skipBlurSaveExternalRef.current = true;
+          onCancelRef.current?.();
+          editor.getRootElement()?.blur();
+          return true;
+        }
+        return false;
+      },
+      COMMAND_PRIORITY_HIGH
+    );
+  }, [editor, skipBlurSaveExternalRef]);
+  return null;
+};
+var IMAGE = {
+  dependencies: [ImageNode],
+  export: (node) => {
+    if (!$isImageNode(node)) return null;
+    return `![${node.getAlt()}](${node.getSrc()})`;
+  },
+  importRegExp: /!\[([^\]]*)\]\(([^)]+)\)/,
+  regExp: /!\[([^\]]*)\]\(([^)]+)\)$/,
+  replace: (textNode, match) => {
+    const [, alt = "", src = ""] = match;
+    const imageNode = $createImageNode(src, alt);
+    textNode.replace(imageNode);
+  },
+  trigger: ")",
+  type: "text-match"
+};
+var HORIZONTAL_RULE = {
+  dependencies: [HorizontalRuleNode],
+  export: (node) => {
+    return $isHorizontalRuleNode(node) ? "---" : null;
+  },
+  regExp: /^(---|\*\*\*|___)$/,
+  replace: (parentNode) => {
+    const node = $createHorizontalRuleNode();
+    parentNode.replace(node);
+  },
+  type: "element"
+};
+var MERMAID = {
+  dependencies: [MermaidNode],
+  export: (node) => {
+    if (!$isMermaidNode(node)) return null;
+    return "```mermaid\n" + node.getCode() + "\n```";
+  },
+  regExpStart: /^[ \t]*(`{3,})mermaid(?:\s.*)?$/,
+  regExpEnd: {
+    optional: true,
+    regExp: /^[ \t]*`{3,}$/
+  },
+  replace: (rootNode, _children, _startMatch, _endMatch, linesInBetween) => {
+    if (!linesInBetween) return;
+    const code = linesInBetween.join("\n").trim();
+    if (code) {
+      rootNode.append($createMermaidNode(code));
+    }
+  },
+  handleImportAfterStartMatch: ({
+    lines,
+    rootNode,
+    startLineIndex,
+    startMatch
+  }) => {
+    const fence = startMatch[1];
+    if (!fence) return [false, startLineIndex];
+    const fenceLength = fence.trim().length;
+    const endRegex = new RegExp(`^[ \\t]*\`{${fenceLength},}$`);
+    for (let i = startLineIndex + 1; i < lines.length; i++) {
+      if (endRegex.test(lines[i] ?? "")) {
+        const code2 = lines.slice(startLineIndex + 1, i).join("\n").trim();
+        if (code2) {
+          rootNode.append($createMermaidNode(code2));
+        }
+        return [true, i];
+      }
+    }
+    const code = lines.slice(startLineIndex + 1).join("\n").trim();
+    if (code) {
+      rootNode.append($createMermaidNode(code));
+    }
+    return [true, lines.length - 1];
+  },
+  type: "multiline-element"
+};
+var CUSTOM_TRANSFORMERS = [
+  IMAGE,
+  HORIZONTAL_RULE,
+  CHECK_LIST,
+  MERMAID,
+  ...TRANSFORMERS
+];
+var SINGLE_LINE_TRANSFORMERS = CUSTOM_TRANSFORMERS.filter(
+  (t) => t.type === "text-format" || t.type === "text-match"
+);
+var TABLE_FENCE_LANG = "__kbc_table__";
+var isTableLine = (line) => {
+  const trimmed = line.trim();
+  return trimmed.startsWith("|") && trimmed.endsWith("|");
+};
+var CODE_FENCE_REGEX = /^[ \t]*`{3,}/;
+var preprocessMarkdown = (markdown) => {
+  const lines = markdown.split("\n");
+  const result = [];
+  let tableLines = [];
+  let insideCodeFence = false;
+  const flushTable = () => {
+    if (tableLines.length >= 2) {
+      result.push(`\`\`\`${TABLE_FENCE_LANG}`);
+      result.push(...tableLines);
+      result.push("```");
+    } else {
+      result.push(...tableLines);
+    }
+    tableLines = [];
+  };
+  for (const line of lines) {
+    if (CODE_FENCE_REGEX.test(line)) {
+      if (tableLines.length > 0) flushTable();
+      insideCodeFence = !insideCodeFence;
+      result.push(line);
+      continue;
+    }
+    if (insideCodeFence) {
+      result.push(line);
+      continue;
+    }
+    if (isTableLine(line)) {
+      tableLines.push(line);
+    } else {
+      if (tableLines.length > 0) flushTable();
+      result.push(line);
+    }
+  }
+  if (tableLines.length > 0) flushTable();
+  return result.join("\n");
+};
+var postprocessMarkdown = (markdown) => {
+  const regex = new RegExp(`\`\`\`${TABLE_FENCE_LANG}\\n([\\s\\S]*?)\\n\`\`\``, "g");
+  return markdown.replace(regex, "$1");
+};
+
+// src/components/MarkdownEditor/plugins/MarkdownSyncPlugin.tsx
+var IMPORT_TAG = "markdown-import";
+var MarkdownSyncPlugin = ({
+  value,
+  editable,
+  onChange,
+  transformers = CUSTOM_TRANSFORMERS
+}) => {
+  const [editor] = useLexicalComposerContext();
+  const lastExportedRef = useRef(value);
+  const onChangeRef = useRef(onChange);
+  onChangeRef.current = onChange;
+  const transformersRef = useRef(transformers);
+  transformersRef.current = transformers;
+  useEffect(() => {
+    editor.setEditable(editable);
+  }, [editor, editable]);
+  useEffect(() => {
+    if (value === lastExportedRef.current) return;
+    lastExportedRef.current = value;
+    editor.update(
+      () => {
+        $convertFromMarkdownString(preprocessMarkdown(value), transformersRef.current);
+      },
+      { tag: IMPORT_TAG }
+    );
+  }, [editor, value]);
+  useEffect(() => {
+    return editor.registerUpdateListener(({ tags }) => {
+      if (tags.has(IMPORT_TAG)) return;
+      editor.getEditorState().read(() => {
+        const raw = $convertToMarkdownString(transformersRef.current);
+        const markdown = postprocessMarkdown(raw);
+        if (markdown !== lastExportedRef.current) {
+          lastExportedRef.current = markdown;
+          onChangeRef.current?.(markdown);
+        }
+      });
+    });
+  }, [editor]);
+  return null;
+};
+
+// src/components/MarkdownEditor/plugins/ToolbarPlugin.tsx
+init_icons();
+
+// src/components/MarkdownEditor/plugins/toolbar/AlignmentDropdown.tsx
+init_icons();
+init_utils();
+
+// src/components/DropdownMenu/DropdownMenuCheckboxItem.tsx
+init_icons();
+init_utils();
+
+// src/components/DropdownMenu/DropdownMenuItemIndicator.tsx
+init_icons();
+var variants3 = cva(
+  [
+    "tailwindcss-preflight",
+    "tw-pointer-events-none",
+    // sizing
+    "tw-size-4",
+    "tw-aspect-square",
+    "tw-shrink-0",
+    // layout
+    "tw-flex",
+    "tw-items-center",
+    "tw-justify-center"
+  ],
+  {
+    variants: {
+      variant: {
+        none: [],
+        radio: [
+          "tw-border",
+          "tw-border-solid",
+          "tw-border-border",
+          "tw-rounded-full",
+          "tw-bg-white",
+          "[&_svg]:tw-size-2",
+          "[&_svg]:data-[state=unchecked]:tw-hidden",
+          // Lucide Circle is stroke-only — force fill to match the stroke
+          // (currentColor) so the indicator reads as a solid dot.
+          "[&_svg]:tw-fill-current",
+          "group-data-[variant=argo]/dropdown-menu-content:[&_svg]:tw-text-primary",
+          "group-data-[variant=default]/dropdown-menu-content:[&_svg]:tw-text-secondary-500"
+        ],
+        check: ["[&_svg]:tw-size-3.5", "[&_svg]:tw-text-primary"],
+        checkbox: [
+          "[&_svg]:tw-text-white",
+          "tw-border",
+          "tw-border-solid",
+          "tw-border-neutral-200",
+          "tw-rounded",
+          "[&_svg]:tw-size-3",
+          "[&_svg]:data-[state=unchecked]:tw-hidden",
+          "group-data-[variant=argo]/dropdown-menu-content:data-[state=checked]:tw-border-primary",
+          "group-data-[variant=argo]/dropdown-menu-content:data-[state=checked]:tw-bg-primary",
+          "group-data-[variant=default]/dropdown-menu-content:data-[state=checked]:tw-border-secondary-500",
+          "group-data-[variant=default]/dropdown-menu-content:data-[state=checked]:tw-bg-secondary-500"
+        ],
+        switch: [
+          "tw-size-5",
+          // Lucide SVGs default to 24×24 — constrain the rendered ToggleRight
+          // to the indicator slot so it doesn't overflow.
+          "[&_svg]:tw-size-5",
+          "tw-text-neutral-400",
+          "data-[state=unchecked]:tw-rotate-180",
+          "group-data-[variant=default]/dropdown-menu-content:data-[state=checked]:tw-text-secondary-500",
+          "group-data-[variant=argo]/dropdown-menu-content:data-[state=checked]:tw-text-primary"
+        ]
+      }
+    }
+  }
+);
+var DropdownMenuItemIndicator = ({
+  variant,
+  className,
+  forceMount: forceMountProp,
+  ...rest
+}) => {
+  const IconComp = (() => {
+    if (variant === "switch") return ToggleRight;
+    if (variant === "radio") return Circle;
+    return Check;
+  })();
+  const forceMount = (() => {
+    if (forceMountProp) return true;
+    return variant === "check" ? void 0 : true;
+  })();
+  if (variant === "none") return null;
+  return /* @__PURE__ */ jsx(
+    DropdownMenuPrimitive3.ItemIndicator,
+    {
+      ...rest,
+      forceMount,
+      className: variants3({ variant, className }),
+      children: /* @__PURE__ */ jsx(IconComp, {})
+    }
+  );
+};
+
+// src/components/DropdownMenu/ItemIcon.tsx
+init_utils();
+var ItemIcon = ({ className, children, ...props }) => /* @__PURE__ */ jsx(
+  "span",
+  {
+    ...props,
+    className: cn(
+      "tw-inline-flex",
+      "tw-items-center",
+      "tw-justify-center",
+      "tw-aspect-square",
+      // 20px container fits the 16px Lucide glyph plus 2px breathing room
+      // each side — the previous tw-size-4 + tw-p-0.5 clipped the 16px child.
+      "tw-size-5",
+      "[&_svg]:tw-size-4",
+      "group-data-[variant=default]/dropdown-menu-content:tw-text-neutral-400",
+      "group-data-[variant=argo]/dropdown-menu-content:tw-text-primary",
+      "group-data-[variant=argo]/dropdown-menu-content:group-aria-disabled:tw-text-muted-foreground",
+      "group-data-[variant=default]/dropdown-menu-content:group-hover:tw-text-secondary-500",
+      className
+    ),
+    children
+  }
+);
+
+// src/components/DropdownMenu/styles.ts
+init_utils();
+var itemVariants = cn(
+  // reset
+  "tailwindcss-preflight",
+  "tw-outline-none",
+  "tw-group",
+  "tw-peer",
+  "tw-relative",
+  // positioning
+  "tw-flex",
+  "tw-flex-1",
+  "tw-items-center",
+  "tw-gap-2",
+  "tw-cursor-pointer",
+  "tw-select-none",
+  "tw-transition-colors",
+  // spacing
+  "tw-p-2",
+  // typography
+  "tw-font-sans",
+  "tw-text-sm",
+  "aria-disabled:tw-pointer-events-none",
+  "aria-disabled:tw-opacity-50",
+  "focus-visible:tw-outline-none",
+  "group-data-[variant=default]/dropdown-menu-content:tw-rounded",
+  "group-data-[variant=default]/dropdown-menu-content:focus:tw-bg-neutral-100",
+  "group-data-[variant=default]/dropdown-menu-content:focus:tw-text-neutral-900",
+  "group-data-[variant=default]/dropdown-menu-content:hover:tw-bg-neutral-100",
+  "group-data-[variant=default]/dropdown-menu-content:hover:tw-text-neutral-900",
+  "group-data-[variant=argo]/dropdown-menu-content:tw-rounded-md",
+  "group-data-[variant=argo]/dropdown-menu-content:tw-text-slate-800",
+  "group-data-[variant=argo]/dropdown-menu-content:focus:tw-text-slate-800",
+  "group-data-[variant=argo]/dropdown-menu-content:focus:tw-bg-sky-100",
+  "group-data-[variant=argo]/dropdown-menu-content:hover:tw-text-slate-800",
+  "group-data-[variant=argo]/dropdown-menu-content:hover:tw-bg-sky-100"
+);
+var contentVariants = cn(
+  "tailwindcss-preflight",
+  "tw-group/dropdown-menu-content",
+  "tw-z-[1040]",
+  "tw-bg-white",
+  // positioning
+  "tw-flex",
+  "tw-flex-col",
+  "tw-origin-[--radix-dropdown-menu-content-transform-origin]",
+  // sizing
+  "tw-max-h-[var(--radix-dropdown-menu-content-available-height)]",
+  "tw-min-w-32",
+  // border
+  "tw-border",
+  "tw-shadow-md",
+  "data-[variant=default]:tw-rounded-md",
+  "data-[variant=argo]:tw-rounded-2xl",
+  // animations
+  "data-[state=open]:tw-animate-in",
+  "data-[state=open]:tw-fade-in-0",
+  "data-[state=open]:tw-zoom-in-95",
+  "data-[state=closed]:tw-animate-out",
+  "data-[state=closed]:tw-fade-out-0",
+  "data-[state=closed]:tw-zoom-out-95",
+  "data-[side=bottom]:tw-slide-in-from-top-2",
+  "data-[side=left]:tw-slide-in-from-right-2",
+  "data-[side=right]:tw-slide-in-from-left-2",
+  "data-[side=top]:tw-slide-in-from-bottom-2"
+);
+var DropdownMenuCheckboxItem = ({
+  className,
+  children,
+  checked,
+  closeOnSelect = false,
+  onSelect,
+  indicatorAlign = "start",
+  indicator = "checkbox",
+  isLoading = false,
+  ...props
+}) => {
+  const isAtStart = indicatorAlign === "start";
+  const indicatorEle = isLoading ? /* @__PURE__ */ jsx(ItemIcon, { className: isAtStart ? "" : "tw-ml-auto", children: /* @__PURE__ */ jsx(Loader2, { className: "tw-animate-spin" }) }) : /* @__PURE__ */ jsx(DropdownMenuItemIndicator, { variant: indicator, className: isAtStart ? "" : "tw-ml-auto" });
+  const handleSelect = (event) => {
+    if (!closeOnSelect) event.preventDefault();
+    onSelect?.(event);
+  };
+  return /* @__PURE__ */ jsxs(
+    DropdownMenuPrimitive3.CheckboxItem,
+    {
+      className: cn(itemVariants, className),
+      checked,
+      onSelect: handleSelect,
+      ...props,
+      children: [
+        isAtStart && indicatorEle,
+        children,
+        !isAtStart && indicatorEle
+      ]
+    }
+  );
+};
+
+// src/components/DropdownMenu/DropdownMenuContent.tsx
+init_utils();
+
+// src/components/ScrollArea/ScrollArea.tsx
+init_utils();
+
+// src/components/ScrollArea/ScrollBar.tsx
+init_utils();
+var ScrollBar = ({ className, orientation = "vertical", ...props }) => /* @__PURE__ */ jsx(
+  ScrollAreaPrimitive2.ScrollAreaScrollbar,
+  {
+    orientation,
+    className: cn(
+      "tw-flex tw-touch-none tw-select-none tw-transition-color",
+      '[data-state="hidden"]:tw-bg-pink-500',
+      {
+        "tw-h-full tw-w-2.5 tw-p-px": orientation === "vertical",
+        "tw-h-2.5 tw-flex-col tw-p-px": orientation === "horizontal"
+      },
+      className
+    ),
+    ...props,
+    children: /* @__PURE__ */ jsx(
+      ScrollAreaPrimitive2.ScrollAreaThumb,
+      {
+        className: cn(
+          "tw-relative",
+          "tw-flex-1",
+          "tw-rounded-full",
+          "tw-bg-neutral-200",
+          "hover:tw-bg-neutral-400"
+        )
+      }
+    )
+  }
+);
+var ScrollArea = ({
+  ref,
+  className,
+  children,
+  viewPortClassName,
+  orientation,
+  scrollBarClassName,
+  ...props
+}) => /* @__PURE__ */ jsxs(
+  ScrollAreaPrimitive2.Root,
+  {
+    "data-slot": "scroll-area",
+    className: cn(
+      "tw-peer/scroll-area tw-relative tw-overflow-hidden focus-visible:tw-outline-none",
+      className
+    ),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx(
+        ScrollAreaPrimitive2.Viewport,
+        {
+          ref,
+          className: cn(
+            "tw-h-full tw-w-full tw-rounded-[inherit] focus-visible:tw-outline-none",
+            viewPortClassName
+          ),
+          children
+        }
+      ),
+      orientation ? /* @__PURE__ */ jsx(ScrollBar, { className: scrollBarClassName, orientation }) : /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(ScrollBar, { className: scrollBarClassName, orientation: "vertical" }),
+        /* @__PURE__ */ jsx(ScrollBar, { className: scrollBarClassName, orientation: "horizontal" })
+      ] }),
+      /* @__PURE__ */ jsx(ScrollAreaPrimitive2.Corner, {})
+    ]
+  }
+);
+var DropdownMenuContext = createContext({
+  variant: "default"
+});
+var useDropdownMenuContext = () => use(DropdownMenuContext);
+var DropdownMenuContent = ({
+  className,
+  sideOffset = 4,
+  forceMount,
+  children,
+  viewPortClassName,
+  container,
+  ...props
+}) => {
+  const { variant } = useDropdownMenuContext();
+  return /* @__PURE__ */ jsx(DropdownMenuPrimitive3.Portal, { forceMount: forceMount || void 0, container, children: /* @__PURE__ */ jsx(
+    DropdownMenuPrimitive3.Content,
+    {
+      ...props,
+      "data-variant": variant,
+      sideOffset,
+      className: contentVariants,
+      children: /* @__PURE__ */ jsx(
+        ScrollArea,
+        {
+          className,
+          viewPortClassName: cn(
+            "tw-p-2",
+            "tw-max-h-[var(--radix-dropdown-menu-content-available-height)]",
+            viewPortClassName
+          ),
+          scrollBarClassName: "tw-w-1.5",
+          children
+        }
+      )
+    }
+  ) });
+};
+
+// src/components/DropdownMenu/DropdownMenuItem.tsx
+init_icons();
+init_utils();
+var DropdownMenuItem = ({
+  ref,
+  className,
+  asModalTrigger = false,
+  onSelect,
+  onPointerLeave,
+  onPointerMove,
+  children,
+  asChild,
+  icon,
+  iconClassName,
+  isLoading = false,
+  ...props
+}) => {
+  const Comp = asChild ? Root$2 : "div";
+  const adornment = isLoading ? /* @__PURE__ */ jsx(Loader2, { className: "tw-animate-spin" }) : renderLegacyIcon(icon);
+  const handleOnSelect = (event) => {
+    if (asModalTrigger) event.preventDefault();
+    onSelect?.(event);
+  };
+  const handlePointerLeave = (event) => {
+    if (asModalTrigger) event.preventDefault();
+    onPointerLeave?.(event);
+  };
+  const handlePointerMove = (event) => {
+    if (asModalTrigger) event.preventDefault();
+    onPointerMove?.(event);
+  };
+  return /* @__PURE__ */ jsx(
+    DropdownMenuPrimitive3.Item,
+    {
+      ...props,
+      ref,
+      onSelect: handleOnSelect,
+      onPointerLeave: handlePointerLeave,
+      onPointerMove: handlePointerMove,
+      className: cn(itemVariants, className),
+      asChild: true,
+      children: /* @__PURE__ */ jsxs(Comp, { children: [
+        adornment && /* @__PURE__ */ jsx(ItemIcon, { className: iconClassName, children: adornment }),
+        /* @__PURE__ */ jsx(Slottable, { children })
+      ] })
+    }
+  );
+};
+
+// src/components/DropdownMenu/DropdownMenuItemDescription.tsx
+init_utils();
+var descriptionVariants = cva(
+  [
+    "tw-box-border",
+    "tw-ml-auto",
+    "tw-font-sans",
+    "tw-tracking-normal",
+    "tw-font-normal",
+    "tw-text-xs",
+    "tw-text-muted-foreground"
+  ],
+  {
+    variants: {
+      hideOnHover: {
+        true: ["group-focus-within:tw-hidden", "group-hover:tw-hidden"],
+        false: []
+      }
+    },
+    defaultVariants: {}
+  }
+);
+var DropdownMenuItemDescription = ({
+  className,
+  children,
+  hideOnHover = false,
+  ...props
+}) => {
+  return /* @__PURE__ */ jsx("span", { ...props, className: cn(descriptionVariants({ hideOnHover }), className), children });
+};
+
+// src/components/DropdownMenu/DropdownMenuLabel.tsx
+init_utils();
+var DropdownMenuLabel = ({ className, ...props }) => {
+  return /* @__PURE__ */ jsx(
+    DropdownMenuPrimitive3.Label,
+    {
+      className: cn(
+        "tw-p-2",
+        "tw-font-medium",
+        "tw-text-xs",
+        "tw-text-muted-foreground",
+        className
+      ),
+      ...props
+    }
+  );
+};
+var DropdownMenuRadioGroup = ({
+  value,
+  defaultValue,
+  onValueChange,
+  ...props
+}) => {
+  const handleChange = (value2) => {
+    onValueChange?.(value2);
+  };
+  return /* @__PURE__ */ jsx(
+    DropdownMenuPrimitive3.RadioGroup,
+    {
+      ...props,
+      value,
+      defaultValue,
+      onValueChange: handleChange
+    }
+  );
+};
+
+// src/components/DropdownMenu/DropdownMenuRadioGroup/DropdownMenuRadioItem.tsx
+init_icons();
+init_utils();
+var DropdownMenuRadioItem = ({
+  className,
+  children,
+  closeOnSelect,
+  onSelect,
+  indicatorAlign = "start",
+  indicator = "radio",
+  icon,
+  iconClassName,
+  isLoading = false,
+  ...props
+}) => {
+  const isAtStart = indicatorAlign === "start";
+  const indicatorEle = isLoading ? /* @__PURE__ */ jsx(ItemIcon, { className: iconClassName, children: /* @__PURE__ */ jsx(Loader2, { className: "tw-animate-spin" }) }) : /* @__PURE__ */ jsx(DropdownMenuItemIndicator, { variant: indicator });
+  const handleSelect = (event) => {
+    if (!closeOnSelect) event.preventDefault();
+    onSelect?.(event);
+  };
+  return /* @__PURE__ */ jsxs(
+    DropdownMenuPrimitive3.RadioItem,
+    {
+      className: cn(
+        itemVariants,
+        "data-[state=checked]:tw-cursor-default",
+        {
+          "data-[state=checked]:tw-bg-neutral-100": indicator === "none",
+          "group-data-[variant=argo]/dropdown-menu-content:data-[state=checked]:tw-bg-sky-100": indicator === "check"
+        },
+        className
+      ),
+      onSelect: handleSelect,
+      ...props,
+      children: [
+        isAtStart && indicatorEle,
+        icon && /* @__PURE__ */ jsx(ItemIcon, { className: iconClassName, children: renderLegacyIcon(icon) }),
+        /* @__PURE__ */ jsx("span", { className: "tw-flex tw-min-w-0 tw-flex-1 tw-items-center tw-gap-2", children }),
+        !isAtStart && indicatorEle
+      ]
+    }
+  );
+};
+
+// src/components/DropdownMenu/DropdownMenuSeparator.tsx
+init_utils();
+var DropdownMenuSeparator = ({ className, ...props }) => /* @__PURE__ */ jsx(
+  DropdownMenuPrimitive3.Separator,
+  {
+    className: cn(
+      "tw-relative",
+      "tw-z-10",
+      // layout
+      "tw-flex",
+      "tw-items-center",
+      "tw-justify-center",
+      "tw-w-full",
+      // separator line
+      'before:tw-content-[""]',
+      "before:tw-w-full",
+      "before:tw-h-px",
+      "group-data-[variant=default]/dropdown-menu-content:tw-py-2",
+      "group-data-[variant=default]/dropdown-menu-content:before:tw-bg-neutral-150",
+      "group-data-[variant=argo]/dropdown-menu-content:tw-py-1",
+      "group-data-[variant=argo]/dropdown-menu-content:before:tw-bg-border",
+      className
+    ),
+    ...props
+  }
+);
+var DropdownMenuSub = DropdownMenuPrimitive3.Sub;
+
+// src/components/DropdownMenu/DropdownMenuSub/DropdownMenuSubContent.tsx
+init_utils();
+var DropdownMenuSubContent = ({ className, ...props }) => {
+  const { variant } = useDropdownMenuContext();
+  return /* @__PURE__ */ jsx(DropdownMenuPrimitive3.Portal, { children: /* @__PURE__ */ jsx(
+    DropdownMenuPrimitive3.SubContent,
+    {
+      "data-variant": variant,
+      className: cn(contentVariants, "tw-z-[1041]", "tw-p-2", className),
+      ...props
+    }
+  ) });
+};
+
+// src/components/DropdownMenu/DropdownMenuSub/DropdownMenuSubTrigger.tsx
+init_icons();
+init_utils();
+var DropdownMenuSubTrigger = ({ className, children, ...props }) => {
+  return /* @__PURE__ */ jsxs(DropdownMenuPrimitive3.SubTrigger, { className: cn(itemVariants, className), ...props, children: [
+    children,
+    /* @__PURE__ */ jsx(ChevronRight, { className: "tw-ml-auto tw-size-5" })
+  ] });
+};
+
+// src/components/DropdownMenu/DropdownMenuTrigger.tsx
+init_utils();
+var DropdownMenuTrigger = ({
+  ref,
+  className,
+  ...props
+}) => /* @__PURE__ */ jsx(
+  Trigger$1,
+  {
+    ...props,
+    ref,
+    "data-slot": "dropdown-menu-trigger",
+    className: cn("tw-group/dropdown-menu-trigger", className)
+  }
+);
+var DropdownMenu = ({
+  // change a default value to false, for modal property, as it is not used in most cases
+  modal = false,
+  variant = "default",
+  ...props
+}) => {
+  const contextValue = useMemo(() => ({ variant }), [variant]);
+  return /* @__PURE__ */ jsx(DropdownMenuContext, { value: contextValue, children: /* @__PURE__ */ jsx(Root$1, { ...props, modal }) });
+};
+DropdownMenu.Trigger = DropdownMenuTrigger;
+DropdownMenu.Content = DropdownMenuContent;
+DropdownMenu.Group = Group;
+DropdownMenu.Sub = DropdownMenuSub;
+DropdownMenu.SubContent = DropdownMenuSubContent;
+DropdownMenu.SubTrigger = DropdownMenuSubTrigger;
+DropdownMenu.Separator = DropdownMenuSeparator;
+DropdownMenu.Label = DropdownMenuLabel;
+DropdownMenu.Item = DropdownMenuItem;
+DropdownMenu.CheckboxItem = DropdownMenuCheckboxItem;
+DropdownMenu.RadioGroup = DropdownMenuRadioGroup;
+DropdownMenu.RadioItem = DropdownMenuRadioItem;
+DropdownMenu.ItemDescription = DropdownMenuItemDescription;
+
+// src/components/MarkdownEditor/plugins/toolbar/AlignmentDropdown.tsx
+init_Tooltip2();
+var ALIGNMENT_OPTIONS = [
+  { value: "left", label: "Left", icon: AlignLeft },
+  { value: "center", label: "Center", icon: AlignCenter },
+  { value: "right", label: "Right", icon: AlignRight },
+  { value: "justify", label: "Justify", icon: AlignJustify }
+];
+var ALIGNMENT_ICONS = Object.fromEntries(
+  ALIGNMENT_OPTIONS.map(({ value, icon }) => [value, icon])
+);
+var AlignmentDropdown = ({
+  editor,
+  alignment
+}) => {
+  const savedSelectionRef = useRef(null);
+  const handleOpenChange = (open) => {
+    if (open) {
+      editor.getEditorState().read(() => {
+        const selection = $getSelection();
+        savedSelectionRef.current = selection ? selection.clone() : null;
+      });
+    }
+  };
+  const handleSelect = (align) => {
+    editor.update(() => {
+      if (savedSelectionRef.current) {
+        $setSelection(savedSelectionRef.current);
+      }
+      editor.dispatchCommand(FORMAT_ELEMENT_COMMAND, align);
+    });
+  };
+  const CurrentAlignmentIcon = ALIGNMENT_ICONS[alignment] ?? AlignLeft;
+  return /* @__PURE__ */ jsxs(DropdownMenu, { onOpenChange: handleOpenChange, children: [
+    /* @__PURE__ */ jsx(Tooltip, { tooltip: "Text alignment", placement: "top", triggerAsChild: true, children: /* @__PURE__ */ jsx(DropdownMenu.Trigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        className: cn(
+          "tw-flex tw-h-7 tw-cursor-pointer tw-items-center tw-gap-1 tw-rounded tw-border-0 tw-bg-transparent tw-px-1.5 tw-text-xs tw-text-neutral-600",
+          "hover:tw-bg-neutral-100"
+        ),
+        children: [
+          /* @__PURE__ */ jsx(CurrentAlignmentIcon, { className: "tw-size-4" }),
+          /* @__PURE__ */ jsx(ChevronDown, { className: "tw-size-3" })
+        ]
+      }
+    ) }) }),
+    /* @__PURE__ */ jsx(DropdownMenu.Content, { align: "start", className: "tw-min-w-32", children: ALIGNMENT_OPTIONS.map(({ value, label, icon: IconComp }) => /* @__PURE__ */ jsxs(
+      DropdownMenu.Item,
+      {
+        onSelect: () => handleSelect(value),
+        className: cn(
+          "tw-flex tw-items-center tw-gap-2",
+          alignment === value && "tw-bg-secondary-50 tw-text-secondary-500"
+        ),
+        children: [
+          /* @__PURE__ */ jsx(IconComp, { className: "tw-size-4" }),
+          label
+        ]
+      },
+      value
+    )) })
+  ] });
+};
+
+// src/components/MarkdownEditor/plugins/toolbar/BlockTypeDropdown.tsx
+init_icons();
+init_utils();
+init_Tooltip2();
+var BLOCK_TYPE_META = {
+  paragraph: { label: "Normal", icon: Type, selectable: true },
+  h1: { label: "Heading 1", icon: Heading1, selectable: true },
+  h2: { label: "Heading 2", icon: Heading2, selectable: true },
+  h3: { label: "Heading 3", icon: Heading3, selectable: true },
+  bullet: { label: "Bullet List", icon: List, selectable: false },
+  number: { label: "Numbered List", icon: ListOrdered, selectable: false },
+  quote: { label: "Quote", icon: Quote, selectable: false },
+  code: { label: "Code Block", icon: SquareCode, selectable: false }
+};
+var BLOCK_TYPE_OPTIONS = Object.entries(BLOCK_TYPE_META).filter(([, meta]) => meta.selectable).map(([value, { label, icon }]) => ({ value, label, icon }));
+var isBlockType = (value) => Object.prototype.hasOwnProperty.call(BLOCK_TYPE_META, value);
+var BlockTypeDropdown = ({
+  editor,
+  blockType
+}) => {
+  const savedSelectionRef = useRef(null);
+  const currentMeta = isBlockType(blockType) ? BLOCK_TYPE_META[blockType] : null;
+  const CurrentBlockIcon = currentMeta?.icon ?? Type;
+  const handleOpenChange = (open) => {
+    if (open) {
+      editor.getEditorState().read(() => {
+        const selection = $getSelection();
+        savedSelectionRef.current = selection ? selection.clone() : null;
+      });
+    }
+  };
+  const handleSelect = (type) => {
+    editor.update(() => {
+      if (savedSelectionRef.current) {
+        $setSelection(savedSelectionRef.current);
+      }
+      const selection = $getSelection();
+      if (!$isRangeSelection(selection)) return;
+      if (type === "bullet") {
+        editor.dispatchCommand(INSERT_UNORDERED_LIST_COMMAND, void 0);
+        return;
+      }
+      if (type === "number") {
+        editor.dispatchCommand(INSERT_ORDERED_LIST_COMMAND, void 0);
+        return;
+      }
+      const anchorNode = selection.anchor.getNode();
+      const element = $getNearestBlockElementAncestorOrThrow(anchorNode);
+      const newNode = type === "h1" || type === "h2" || type === "h3" ? $createHeadingNode(type) : type === "quote" ? $createQuoteNode() : type === "code" ? $createCodeNode() : $createParagraphNode();
+      element.getChildren().forEach((child) => newNode.append(child));
+      element.replace(newNode);
+    });
+  };
+  return /* @__PURE__ */ jsxs(DropdownMenu, { onOpenChange: handleOpenChange, children: [
+    /* @__PURE__ */ jsx(Tooltip, { tooltip: "Change block type", placement: "top", triggerAsChild: true, children: /* @__PURE__ */ jsx(DropdownMenu.Trigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+      "button",
+      {
+        type: "button",
+        className: cn(
+          "tw-flex tw-h-7 tw-cursor-pointer tw-items-center tw-gap-1.5 tw-rounded tw-border-0 tw-bg-transparent tw-px-1.5 tw-text-xs tw-text-neutral-600",
+          "hover:tw-bg-neutral-100"
+        ),
+        children: [
+          /* @__PURE__ */ jsx(CurrentBlockIcon, { className: "tw-size-4" }),
+          currentMeta?.label ?? "Normal",
+          /* @__PURE__ */ jsx(ChevronDown, { className: "tw-size-3" })
+        ]
+      }
+    ) }) }),
+    /* @__PURE__ */ jsx(DropdownMenu.Content, { align: "start", className: "tw-min-w-40", children: BLOCK_TYPE_OPTIONS.map(({ value, label, icon: IconComp }) => /* @__PURE__ */ jsxs(
+      DropdownMenu.Item,
+      {
+        onSelect: () => handleSelect(value),
+        className: cn(
+          "tw-flex tw-items-center tw-gap-2",
+          blockType === value && "tw-bg-secondary-50 tw-text-secondary-500"
+        ),
+        children: [
+          /* @__PURE__ */ jsx(IconComp, { className: "tw-size-4" }),
+          label
+        ]
+      },
+      value
+    )) })
+  ] });
+};
+
+// src/components/MarkdownEditor/plugins/toolbar/LinkPanel.tsx
+init_icons();
+init_Button2();
+var buttonGroupVariant = cva(
+  ["tailwindcss-preflight", "tw-inline-flex", "tw-items-center", "tw-group/button-group"],
+  {
+    defaultVariants: {
+      variant: "inline",
+      space: "small"
+    },
+    variants: {
+      variant: {
+        inline: [],
+        block: [
+          "tw-w-full",
+          "tw-flex-col",
+          "sm:tw-flex-row",
+          "[&_a]:tw-flex-1",
+          "[&>button:not([data-icon-only=true])]:tw-flex-1"
+        ]
+      },
+      space: {
+        "extra-small": "tw-gap-1",
+        "little-small": "tw-gap-2",
+        small: "tw-gap-3",
+        medium: "tw-gap-4",
+        large: "tw-gap-6",
+        compact: [
+          "tw-border-collapse",
+          "!tw-gap-0",
+          // ensure that focus visible outline is at the top
+          "[&>*:focus-visible]:!tw-z-10",
+          "[&>*:not(:first-child)]:tw-rounded-l-none",
+          "[&>*:not(:last-child)]:tw-rounded-r-none",
+          "[&>*:not(:last-child)]:tw-border-r-0",
+          "[&>*:not(:first-child)]:tw-border-l-0",
+          // separator
+          "[&>*:not(:first-child)]:before:tw-content",
+          "[&>*:not(:first-child)]:before:tw-absolute",
+          "[&>*:not(:first-child)]:before:tw-left-0",
+          "[&>*:not(:first-child)]:before:tw-h-full",
+          "[&>*:not(:first-child)]:before:tw-w-px",
+          "[&>*:not(:first-child)]:before:tw-bg-black/10"
+        ]
+      }
+    }
+  }
+);
+var ButtonGroup = ({
+  ref,
+  children,
+  space = "small",
+  className,
+  variant,
+  ...rest
+}) => {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref,
+      ...rest,
+      role: "group",
+      "data-variant": variant,
+      className: buttonGroupVariant({ variant, className, space }),
+      children
+    }
+  );
+};
+
+// src/components/FormGroup/FormGroup.tsx
+init_utils();
+var FormGroupContext = createContext({
+  state: "default"
+});
+var FormGroupProvider = FormGroupContext;
+var useFormGroupContext = () => use(FormGroupContext);
+
+// src/components/InputGroup/InputGroup.tsx
+init_utils();
+
+// src/components/InputGroup/InputGroupAddon.tsx
+init_utils();
+var addonVariants = cva(["tw-flex", "tw-items-center", "tw-gap-1"], {
+  defaultVariants: {
+    align: "inline-start"
+  },
+  variants: {
+    align: {
+      "inline-start": ["tw-order-first", "[&:not(:empty)]:tw-pl-4"],
+      "inline-end": ["tw-order-last", "[&:not(:empty)]:tw-pr-4"],
+      "block-start": [
+        "tw-order-first",
+        // `tw-w-full` needs to be empty-conditional too — when the addon
+        // has no content the root stays in flex-row, and a 100%-wide
+        // empty addon would claim half of the input row beside the input.
+        "[&:not(:empty)]:tw-w-full",
+        "[&:not(:empty)]:tw-px-4",
+        "[&:not(:empty)]:tw-py-1.5"
+      ],
+      "block-end": [
+        "tw-order-last",
+        "[&:not(:empty)]:tw-w-full",
+        "[&:not(:empty)]:tw-px-4",
+        "[&:not(:empty)]:tw-py-1.5"
+      ]
+    }
+  }
+});
+var InputGroupAddon = ({
+  children,
+  align = "inline-start",
+  className,
+  ...props
+}) => /* @__PURE__ */ jsx("div", { ...props, "data-align": align, className: cn(addonVariants({ align, className })), children });
+
+// src/components/InputGroup/InputGroupButton.tsx
+init_utils();
+init_Button2();
+var InputGroupButton = ({
+  ref,
+  className,
+  tabIndex = -1,
+  ...props
+}) => /* @__PURE__ */ jsx(
+  Button,
+  {
+    argo: true,
+    ...props,
+    tabIndex,
+    ref,
+    variant: "invisible",
+    size: "icon-sm",
+    className: cn("tw-size-5", "[&_svg]:tw-text-muted-foreground", className)
+  }
+);
+
+// src/components/InputGroup/InputGroupInput.tsx
+init_utils();
+var InputGroupInput = ({
+  ref,
+  className,
+  ...inputProps
+}) => /* @__PURE__ */ jsx(
+  "input",
+  {
+    ...inputProps,
+    ref,
+    className: cn(
+      "tw-w-full",
+      "tw-bg-transparent",
+      "tw-outline-none",
+      // font
+      "tw-font-sans",
+      "tw-text-sm",
+      // placeholder
+      "placeholder:tw-text-neutral-400",
+      "placeholder:tw-font-normal",
+      // disabled
+      "disabled:tw-cursor-not-allowed",
+      className
+    )
+  }
+);
+
+// src/components/InputGroup/InputGroupText.tsx
+init_utils();
+var InputGroupText = ({ className, ...props }) => /* @__PURE__ */ jsx(
+  "span",
+  {
+    className: cn(
+      "tw-flex",
+      "tw-items-center",
+      "tw-gap-2",
+      "tw-text-sm",
+      "tw-text-muted-foreground",
+      "[&_svg]:tw-pointer-events-none",
+      '[&_svg:not([class*="tw-size-"])]:tw-size-4',
+      className
+    ),
+    ...props
+  }
+);
+
+// src/components/InputGroup/InputGroupTextArea.tsx
+init_utils();
+var InputGroupTextArea = ({
+  ref,
+  className,
+  onChange,
+  onValueChange,
+  value,
+  defaultValue,
+  onBlur,
+  onValueBlur,
+  disableResize = false,
+  minRows = 1,
+  maxRows = 4,
+  ...props
+}) => {
+  const handleChange = (event) => {
+    onValueChange?.(event.target.value);
+    onChange?.(event);
+  };
+  const handleBlur = (event) => {
+    onValueBlur?.(event.target.value);
+    onBlur?.(event);
+  };
+  return /* @__PURE__ */ jsx(
+    TextareaAutosize,
+    {
+      ...props,
+      ref,
+      value: value ?? void 0,
+      defaultValue: defaultValue ?? void 0,
+      onChange: handleChange,
+      onBlur: handleBlur,
+      minRows,
+      maxRows: maxRows === "unlimited" ? void 0 : maxRows,
+      className: cn(
+        "tw-w-full",
+        "tw-bg-transparent",
+        "tw-outline-none",
+        "tw-px-4",
+        // font
+        "tw-font-sans",
+        "tw-text-sm",
+        // placeholder
+        "placeholder:tw-text-neutral-400",
+        "placeholder:tw-font-normal",
+        // disabled
+        "disabled:tw-cursor-not-allowed",
+        {
+          "tw-resize-none": disableResize
+        },
+        className
+      )
+    }
+  );
+};
+var inputGroupVariants = cva(
+  [
+    "tailwindcss-preflight",
+    "tw-group",
+    "tw-overflow-hidden",
+    "tw-box-border",
+    // positioning
+    "tw-flex",
+    "tw-items-center",
+    // base
+    "tw-rounded",
+    "tw-border",
+    "tw-border-solid",
+    "tw-border-neutral-200",
+    "tw-text-neutral-800",
+    "tw-transition",
+    // focus
+    "has-[:is(input,textarea):focus]:tw-ring-4",
+    // readonly
+    "has-[:is(input,textarea)[readonly]]:tw-bg-neutral-150",
+    "has-[:is(input,textarea)[readonly]]:focus-within:tw-ring-0",
+    "has-[:is(input,textarea)[readonly]]:tw-border-neutral-150",
+    // disabled cursor (opacity owned by variant)
+    "has-[:is(input,textarea):disabled]:tw-cursor-not-allowed",
+    // textarea: top-align addons, allow vertical expansion, own its y-padding
+    "has-[textarea]:tw-items-start",
+    "has-[[data-align=block-start]:not(:empty)]:tw-flex-wrap",
+    "has-[[data-align=block-end]:not(:empty)]:tw-flex-wrap",
+    "[&>input]:has-[[data-align=block-start]:not(:empty)]:tw-w-auto",
+    "[&>input]:has-[[data-align=block-start]:not(:empty)]:tw-flex-1",
+    "[&>input]:has-[[data-align=block-end]:not(:empty)]:tw-w-auto",
+    "[&>input]:has-[[data-align=block-end]:not(:empty)]:tw-flex-1",
+    "[&>input]:tw-px-4",
+    "[&>input]:has-[[data-align=inline-start]:not(:empty)]:tw-pl-2",
+    "[&>input]:has-[[data-align=inline-end]:not(:empty)]:tw-pr-2"
+  ],
+  {
+    defaultVariants: {
+      variant: "primary",
+      state: "default",
+      sizing: "default",
+      focusVariant: "default"
+    },
+    compoundVariants: [
+      {
+        variant: "secondary",
+        state: "error",
+        className: ["tw-bg-error-100"]
+      },
+      {
+        variant: "secondary",
+        state: "warning",
+        className: ["tw-bg-warning-100"]
+      },
+      {
+        variant: "primary",
+        state: "default",
+        focusVariant: "off",
+        className: ["has-[:is(input,textarea):focus]:tw-border-neutral-200"]
+      },
+      {
+        variant: "secondary",
+        state: "default",
+        focusVariant: "off",
+        className: ["has-[:is(input,textarea):focus]:tw-border-neutral-100"]
+      },
+      {
+        variant: ["primary", "secondary"],
+        state: "error",
+        focusVariant: "on",
+        className: ["!tw-border-error-500", "!tw-ring-error-200"]
+      },
+      {
+        variant: ["primary", "secondary"],
+        state: "warning",
+        focusVariant: "on",
+        className: ["!tw-border-warning-500", "!tw-ring-warning-200"]
+      },
+      // --- argo ---
+      {
+        variant: "argo",
+        state: "default",
+        className: [
+          "has-[:is(input,textarea):focus]:tw-border-primary",
+          "has-[:is(input,textarea):focus]:tw-ring-primary/50"
+        ]
+      },
+      {
+        variant: "argo",
+        state: "error",
+        className: [
+          "tw-border-destructive",
+          "has-[:is(input,textarea):focus]:tw-border-destructive",
+          "has-[:is(input,textarea):focus]:tw-ring-destructive/20"
+        ]
+      },
+      {
+        variant: "argo",
+        focusVariant: "on",
+        className: ["!tw-border-primary", "!tw-ring-primary/50"]
+      },
+      {
+        variant: "argo",
+        state: "error",
+        focusVariant: "on",
+        className: ["!tw-border-destructive", "!tw-ring-destructive/20"]
+      },
+      {
+        variant: "argo",
+        state: "default",
+        focusVariant: "off",
+        className: ["has-[:is(input,textarea):focus]:tw-border-input"]
+      }
+    ],
+    variants: {
+      focusVariant: {
+        default: [],
+        on: ["!tw-border-secondary-500", "!tw-ring-secondary-200", "!tw-ring-4"],
+        off: ["has-[:is(input,textarea):focus]:!tw-ring-0"]
+      },
+      variant: {
+        primary: ["tw-bg-white", "has-[:is(input,textarea):disabled]:tw-opacity-40"],
+        secondary: [
+          "tw-bg-neutral-100",
+          "tw-border-neutral-100",
+          "has-[:is(input,textarea):disabled]:tw-opacity-40"
+        ],
+        argo: [
+          "tw-bg-background",
+          "tw-border-input",
+          "tw-rounded-lg",
+          "tw-text-foreground",
+          "has-[:is(input,textarea):disabled]:tw-opacity-50",
+          // higher specificity than has-[:is(input,textarea):focus] — prevents focus border on readonly
+          "has-[:is(input,textarea)[readonly]:focus]:tw-border-neutral-150"
+        ]
+      },
+      sizing: {
+        default: [
+          "[&>:is(input,textarea)]:tw-py-2.5",
+          "[&>:is(input,textarea)]:tw-leading-[18px]",
+          "[&>textarea]:!tw-min-h-[calc(2.5rem-2px)]"
+        ],
+        small: [
+          "[&>:is(input,textarea)]:tw-py-2",
+          "[&>:is(input,textarea)]:tw-leading-[16px]",
+          "[&>textarea]:!tw-min-h-[calc(2rem-2px)]"
+        ],
+        medium: [
+          "[&>:is(input,textarea)]:tw-py-2",
+          "[&>:is(input,textarea)]:tw-leading-[18px]",
+          "[&>textarea]:!tw-min-h-[calc(2.25rem-2px)]"
+        ]
+      },
+      state: {
+        default: [
+          "has-[:is(input,textarea):focus]:tw-border-secondary-500",
+          "has-[:is(input,textarea):focus]:tw-ring-secondary-200"
+        ],
+        error: [
+          "tw-border-error-500",
+          "has-[:is(input,textarea):focus]:tw-border-error-500",
+          "has-[:is(input,textarea):focus]:tw-ring-error-200"
+        ],
+        warning: [
+          "tw-border-warning-500",
+          "has-[:is(input,textarea):focus]:tw-border-warning-500",
+          "has-[:is(input,textarea):focus]:tw-ring-warning-200"
+        ]
+      }
+    }
+  }
+);
+var InputGroupRoot = ({
+  ref,
+  children,
+  state,
+  variant,
+  sizing,
+  focusVariant,
+  className,
+  ...props
+}) => /* @__PURE__ */ jsx(
+  "div",
+  {
+    ...props,
+    ref,
+    className: cn(inputGroupVariants({ state, variant, sizing, focusVariant, className })),
+    children
+  }
+);
+var InputGroup = InputGroupRoot;
+InputGroup.Input = InputGroupInput;
+InputGroup.Addon = InputGroupAddon;
+InputGroup.Button = InputGroupButton;
+InputGroup.TextArea = InputGroupTextArea;
+InputGroup.Text = InputGroupText;
+
+// src/blocks/ColorInput/ColorInput.tsx
+init_icons();
+init_utils();
+
+// src/blocks/ColorInput/utils.ts
+var HEX_CHARSET = /^[0-9a-fA-F]+$/;
+var COMPLETE_HEX_PATTERN = /^#(?:[0-9a-fA-F]{3,4}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/;
+var MAX_HEX_BODY_LENGTH = 8;
+var PICKER_FALLBACK = "#000000";
+var extractHexBody = (value) => {
+  if (typeof value !== "string") return null;
+  const trimmed = value.trim();
+  if (trimmed === "") return null;
+  return trimmed.startsWith("#") ? trimmed.slice(1) : trimmed;
+};
+var isCompleteHexColor = (value) => COMPLETE_HEX_PATTERN.test(value);
+var showPicker = (input) => {
+  const isShowPickerSupported = "showPicker" in HTMLInputElement.prototype;
+  isShowPickerSupported ? input.showPicker() : input.click();
+};
+var coerceHexInputValue = (value) => {
+  const body = extractHexBody(value);
+  if (body === null) return "";
+  const [validBody] = body.match(/^[0-9a-fA-F]+/) ?? [];
+  if (!validBody) return "";
+  return `#${validBody.slice(0, MAX_HEX_BODY_LENGTH)}`;
+};
+var coerceColorPickerValue = (value) => {
+  const body = extractHexBody(value);
+  if (body === null || !HEX_CHARSET.test(body)) return PICKER_FALLBACK;
+  if (body.length === 3 || body.length === 4) {
+    const [r, g, b] = body;
+    return `#${r}${r}${g}${g}${b}${b}`.toLowerCase();
+  }
+  if (body.length === 6 || body.length === 8) {
+    return `#${body.slice(0, 6).toLowerCase()}`;
+  }
+  return PICKER_FALLBACK;
+};
+var ColorPicker = ({ value, disabled, readOnly, ...props }) => {
+  const pickerRef = useRef(null);
+  const handleOpenPicker = () => {
+    if (!pickerRef.current) return;
+    showPicker(pickerRef.current);
+  };
+  return /* @__PURE__ */ jsxs("div", { className: "tw-relative", children: [
+    /* @__PURE__ */ jsx(
+      "input",
+      {
+        ...props,
+        ref: pickerRef,
+        type: "color",
+        value: coerceColorPickerValue(value),
+        tabIndex: -1,
+        "aria-hidden": true,
+        className: "tw-pointer-events-none tw-absolute tw-left-0 tw-top-full tw-size-0 tw-opacity-0",
+        disabled,
+        readOnly
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      InputGroup.Button,
+      {
+        onMouseDown: (event) => event.preventDefault(),
+        disabled: disabled || readOnly,
+        onClick: handleOpenPicker,
+        "aria-label": "Pick color",
+        children: /* @__PURE__ */ jsx(Pipette, { className: "tw-size-4" })
+      }
+    )
+  ] });
+};
+var ColorInput = ({
+  ref,
+  // group props
+  state,
+  variant,
+  focusVariant,
+  sizing,
+  className,
+  // own props
+  value: valueProp,
+  onValueChange,
+  onValueBlur,
+  onChange,
+  onBlur,
+  defaultValue,
+  allowClear = false,
+  // input props
+  disabled,
+  readOnly,
+  ...restInputProps
+}) => {
+  const inputRef = useRef(null);
+  const [internalValue, setInternalValue] = useState(defaultValue ?? "");
+  const isControlled = valueProp !== void 0;
+  const value = isControlled ? valueProp ?? "" : internalValue;
+  const setValue = (nextValue) => {
+    if (!isControlled) setInternalValue(nextValue);
+    onValueChange?.(nextValue);
+  };
+  const canClear = allowClear && !!value && !disabled && !readOnly;
+  const swatchColor = coerceHexInputValue(value);
+  const isValidSwatch = isCompleteHexColor(swatchColor);
+  const handleChange = (event) => {
+    setValue(event.target.value);
+    onChange?.(event);
+  };
+  const handleBlur = (event) => {
+    const newValue = event.target.value;
+    const sanitizedNewValue = coerceHexInputValue(newValue);
+    if (sanitizedNewValue !== newValue) {
+      if (!isControlled) event.target.value = sanitizedNewValue;
+      setValue(sanitizedNewValue);
+    }
+    onValueBlur?.(sanitizedNewValue);
+    onBlur?.(event);
+  };
+  const handlePickerChange = (event) => {
+    setValue(coerceHexInputValue(event.target.value));
+    onChange?.(event);
+  };
+  const handleClear = () => {
+    if (!inputRef.current) return;
+    inputRef.current.value = "";
+    setValue("");
+    onChange?.(createChangeInputEvent(inputRef.current));
+  };
+  return /* @__PURE__ */ jsxs(
+    InputGroup,
+    {
+      state,
+      variant,
+      sizing,
+      focusVariant,
+      className,
+      children: [
+        /* @__PURE__ */ jsx(
+          InputGroup.Addon,
+          {
+            align: "inline-start",
+            className: cn(
+              { "-tw-ml-7 tw-opacity-0": !value },
+              "tw-transition-[opacity,margin]",
+              "tw-ease-linear",
+              "tw-duration-200"
+            ),
+            children: /* @__PURE__ */ jsx(
+              "div",
+              {
+                style: isValidSwatch ? { background: swatchColor } : void 0,
+                className: cn(
+                  "tw-size-5",
+                  "tw-shrink-0",
+                  "tw-rounded-sm",
+                  "tw-border",
+                  "tw-border-solid",
+                  "tw-border-neutral-300",
+                  {
+                    "tw-bg-[linear-gradient(to_top_right,transparent_calc(50%_-_1px),theme(colors.red.300)_calc(50%_-_1px),theme(colors.red.300)_calc(50%_+_1px),transparent_calc(50%_+_1px))]": !isValidSwatch
+                  }
+                )
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          InputGroup.Input,
+          {
+            ...restInputProps,
+            type: "text",
+            ref: mergeRefs(ref ?? null, inputRef),
+            value,
+            onChange: handleChange,
+            onBlur: handleBlur,
+            disabled,
+            readOnly
+          }
+        ),
+        /* @__PURE__ */ jsxs(InputGroup.Addon, { align: "inline-end", children: [
+          canClear && /* @__PURE__ */ jsx(
+            InputGroup.Button,
+            {
+              onMouseDown: (event) => event.preventDefault(),
+              onClick: handleClear,
+              "aria-label": "Clear color",
+              children: /* @__PURE__ */ jsx(X, { className: "tw-size-4" })
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            ColorPicker,
+            {
+              disabled,
+              readOnly,
+              value,
+              onChange: handlePickerChange
+            }
+          )
+        ] })
+      ]
+    }
+  );
+};
+var FormGroupColorInput = ({
+  ref,
+  ...props
+}) => {
+  const { state } = useFormGroupContext();
+  return /* @__PURE__ */ jsx(ColorInput, { state, ...props, ref });
+};
+var helpVariants = cva(["tw-m-0", "tw-text-xs"], {
+  defaultVariants: {
+    state: "default"
+  },
+  variants: {
+    state: {
+      default: ["tw-text-neutral-500"],
+      error: ["tw-text-error-500"],
+      warning: ["tw-text-warning-500"]
+    }
+  }
+});
+var HelpBlock = ({ children, className, state = "default", testId }) => {
+  if (!children) return null;
+  return /* @__PURE__ */ jsx("p", { "data-testid": testId, className: helpVariants({ state, className }), children });
+};
+var FormGroupHelp = ({ children, ...rest }) => {
+  const formGroupContext = useFormGroupContext();
+  return /* @__PURE__ */ jsx(HelpBlock, { state: formGroupContext.state, ...rest, children });
+};
+var toNumberOrNull = (event) => Number.isNaN(event.target.valueAsNumber) ? null : event.target.valueAsNumber;
+var NumberInput = ({
+  ref,
+  state,
+  variant,
+  focusVariant,
+  sizing,
+  className,
+  value,
+  defaultValue,
+  onValueChange,
+  onValueBlur,
+  onChange,
+  onBlur,
+  prefix,
+  suffix,
+  ...inputProps
+}) => {
+  const handleChange = (event) => {
+    onValueChange?.(toNumberOrNull(event));
+    onChange?.(event);
+  };
+  const handleBlur = (event) => {
+    onValueBlur?.(toNumberOrNull(event));
+    onBlur?.(event);
+  };
+  const isControlled = value !== void 0;
+  const valueProp = isControlled ? { value: value ?? "" } : { defaultValue: defaultValue ?? "" };
+  return /* @__PURE__ */ jsxs(
+    InputGroup,
+    {
+      state,
+      variant,
+      sizing,
+      focusVariant,
+      className,
+      children: [
+        prefix && /* @__PURE__ */ jsx(InputGroup.Addon, { align: "inline-start", children: prefix }),
+        /* @__PURE__ */ jsx(
+          InputGroup.Input,
+          {
+            ...inputProps,
+            ...valueProp,
+            ref,
+            type: "number",
+            onChange: handleChange,
+            onBlur: handleBlur
+          }
+        ),
+        suffix && /* @__PURE__ */ jsx(InputGroup.Addon, { align: "inline-end", children: suffix })
+      ]
+    }
+  );
+};
+var FormGroupNumberInput = ({
+  ref,
+  ...props
+}) => {
+  const { state } = useFormGroupContext();
+  return /* @__PURE__ */ jsx(NumberInput, { ...props, ref, state });
+};
+var Textarea = ({
+  ref,
+  containerClassName,
+  // group props
+  state = "default",
+  variant = "primary",
+  sizing,
+  focusVariant,
+  ...rest
+}) => {
+  return /* @__PURE__ */ jsx(
+    InputGroup,
+    {
+      state,
+      sizing,
+      focusVariant,
+      variant,
+      className: containerClassName,
+      children: /* @__PURE__ */ jsx(InputGroup.TextArea, { ...rest, ref })
+    }
+  );
+};
+var FormGroupTextarea = (props) => {
+  const { state } = useFormGroupContext();
+  return /* @__PURE__ */ jsx(Textarea, { state, ...props });
+};
+
+// src/components/Input/Input.tsx
+init_icons();
+init_utils();
+
+// src/components/Input/utils.ts
+init_utils();
+var genInputTestId = (prefix = "") => {
+  const ps = createPrefixedString(prefix);
+  return {
+    toString: () => prefix,
+    inputWrapper: ps`input-wrapper`,
+    input: ps`input`,
+    clearButton: ps`clear-button`
+  };
+};
+var Input = ({
+  ref: forwardedRef,
+  state = "default",
+  sizing = "default",
+  className,
+  prefix = null,
+  rightSuffix = null,
+  rightSuffixVariant = "default",
+  leftSuffix = null,
+  allowClear = false,
+  onClear,
+  disabled = false,
+  testId: prefixTestId = "",
+  autoFocus = false,
+  id,
+  name,
+  variant,
+  readOnly,
+  type = "text",
+  focusVariant = "default",
+  onChange,
+  onBlur,
+  value,
+  defaultValue,
+  ...inputProps
+}) => {
+  const [hasUncontrolledValue, setHasUncontrolledValue] = useState(() => !!defaultValue);
+  const hasValue = !!value || hasUncontrolledValue;
+  const inputRef = useRef(null);
+  const testId = genInputTestId(prefixTestId);
+  const isClearButtonVisible = hasValue && !disabled && !readOnly || !!onClear;
+  const handleChange = (event) => {
+    const val = event.target.value;
+    setHasUncontrolledValue(val !== "");
+    onChange?.(event);
+  };
+  const handleBlur = (event) => {
+    const val = event.target.value;
+    setHasUncontrolledValue(val !== "");
+    onBlur?.(event);
+  };
+  const handleClear = () => {
+    if (inputRef.current === null) return;
+    inputRef.current.value = "";
+    inputRef.current.focus();
+    onClear?.();
+    setHasUncontrolledValue(false);
+    onChange?.(createChangeInputEvent(inputRef.current));
+  };
+  const isControlled = value !== void 0;
+  const valueProp = isControlled ? { value: value ?? "" } : { defaultValue: defaultValue ?? "" };
+  return /* @__PURE__ */ jsxs(
+    InputGroup,
+    {
+      state,
+      variant,
+      sizing,
+      focusVariant,
+      className,
+      "data-testid": testId.inputWrapper,
+      children: [
+        prefix && /* @__PURE__ */ jsx(InputGroup.Addon, { align: "inline-start", children: prefix }),
+        /* @__PURE__ */ jsx(
+          InputGroup.Input,
+          {
+            ...inputProps,
+            ...valueProp,
+            autoFocus,
+            type,
+            onChange: handleChange,
+            onBlur: handleBlur,
+            ref: mergeRefs(forwardedRef ?? null, inputRef),
+            disabled,
+            id,
+            name,
+            readOnly,
+            "data-testid": testId.input
+          }
+        ),
+        (leftSuffix || allowClear || rightSuffix) && /* @__PURE__ */ jsxs(InputGroup.Addon, { align: "inline-end", children: [
+          leftSuffix,
+          allowClear && isClearButtonVisible && /* @__PURE__ */ jsx(
+            InputGroup.Button,
+            {
+              "aria-label": "Clear",
+              onMouseDown: (e) => e.preventDefault(),
+              onClick: handleClear,
+              "data-testid": testId.clearButton,
+              children: /* @__PURE__ */ jsx(X, { className: "tw-size-4" })
+            }
+          ),
+          rightSuffix && /* @__PURE__ */ jsx(
+            "div",
+            {
+              className: cn({
+                "tw-whitespace-nowrap tw-bg-neutral-200 tw-px-4 -tw-mr-4 tw-py-2.5": rightSuffixVariant === "addon"
+              }),
+              children: rightSuffix
+            }
+          )
+        ] })
+      ]
+    }
+  );
+};
+var sanitizeTextInputValue = (value) => {
+  if (typeof value === "string" && value.trim() === "") return "";
+  return value;
+};
+var TextInput = ({
+  ref,
+  value,
+  defaultValue,
+  type = "text",
+  onValueChange,
+  onChange,
+  onValueBlur,
+  onBlur,
+  ...props
+}) => {
+  const handleChange = (event) => {
+    onValueChange?.(event.target.value);
+    onChange?.(event);
+  };
+  const handleBlur = (event) => {
+    onValueBlur?.(event.target.value);
+    onBlur?.(event);
+  };
+  return /* @__PURE__ */ jsx(
+    Input,
+    {
+      ...props,
+      ref,
+      onChange: handleChange,
+      onBlur: handleBlur,
+      type,
+      value: sanitizeTextInputValue(value),
+      defaultValue: sanitizeTextInputValue(defaultValue)
+    }
+  );
+};
+var FormGroupTextInput = ({
+  ref,
+  ...props
+}) => {
+  const { state } = useFormGroupContext();
+  return /* @__PURE__ */ jsx(TextInput, { state, ...props, ref });
+};
+var FormGroup = ({ className, children, state, testId }) => {
+  return /* @__PURE__ */ jsx(FormGroupProvider, { value: { state }, children: /* @__PURE__ */ jsx("div", { "data-testid": testId, className: cn("tw-flex tw-flex-col tw-gap-1", className), children }) });
+};
+FormGroup.Help = FormGroupHelp;
+FormGroup.TextInput = FormGroupTextInput;
+FormGroup.NumberInput = FormGroupNumberInput;
+FormGroup.ColorInput = FormGroupColorInput;
+FormGroup.Textarea = FormGroupTextarea;
+
+// src/components/Label/Label.tsx
+init_utils();
+var Optional = ({ className }) => /* @__PURE__ */ jsx("span", { className: cn("tw-text-neutral-400", className), children: "(optional)" });
+var Label2 = ({ className, children, id, htmlFor, ...rest }) => {
+  return /* @__PURE__ */ jsx(
+    RLabel.Root,
+    {
+      ...rest,
+      id: id?.toString(),
+      htmlFor: htmlFor?.toString(),
+      className: cn(
+        "tw-m-0 tw-text-neutral-800 tw-font-normal peer-disabled:tw-opacity-50",
+        className
+      ),
+      children
+    }
+  );
+};
+Label2.Optional = Optional;
+
+// src/components/MarkdownEditor/plugins/toolbar/ToolbarButton.tsx
+init_utils();
+init_Tooltip2();
+var ToolbarButton = ({
+  active,
+  disabled,
+  onClick,
+  tooltip,
+  children,
+  className: extraClassName
+}) => /* @__PURE__ */ jsx(Tooltip, { tooltip, placement: "top", triggerAsChild: true, children: /* @__PURE__ */ jsx(
+  "button",
+  {
+    type: "button",
+    disabled,
+    onClick,
+    className: cn(
+      "tw-flex tw-h-7 tw-min-w-7 tw-cursor-pointer tw-items-center tw-justify-center tw-rounded tw-border-0 tw-bg-transparent tw-px-1 tw-text-xs tw-text-neutral-600",
+      "hover:tw-bg-neutral-100 disabled:tw-cursor-not-allowed disabled:tw-opacity-30",
+      active && "tw-bg-secondary-100 tw-text-secondary-500",
+      extraClassName
+    ),
+    children
+  }
+) });
+var insertLink = (editor, url, label, savedSelection) => {
+  editor.update(() => {
+    $setSelection(savedSelection);
+    const selection = $getSelection();
+    if ($isRangeSelection(selection)) {
+      const selectedText = selection.getTextContent();
+      if (selectedText && label === selectedText) {
+        editor.dispatchCommand(TOGGLE_LINK_COMMAND, url);
+        return;
+      }
+    }
+    const linkNode = $createLinkNode(url);
+    const textNode = $createTextNode(label || url);
+    linkNode.append(textNode);
+    if ($isRangeSelection(selection)) {
+      selection.insertNodes([linkNode]);
+    }
+  });
+};
+var LinkPanel = ({ editor, isLink }) => {
+  const [open, setOpen] = useState(false);
+  const [url, setUrl] = useState("");
+  const [label, setLabel] = useState("");
+  const savedSelectionRef = useRef(null);
+  const panelRef = useRef(null);
+  const handleOpen = () => {
+    editor.getEditorState().read(() => {
+      const selection = $getSelection();
+      savedSelectionRef.current = selection ? selection.clone() : null;
+      if ($isRangeSelection(selection)) {
+        const text = selection.getTextContent();
+        if (text) setLabel(text);
+      }
+    });
+    setOpen(true);
+  };
+  const handleClose = () => {
+    setOpen(false);
+    setUrl("");
+    setLabel("");
+    savedSelectionRef.current = null;
+    editor.focus();
+  };
+  const handleSubmit = () => {
+    const trimmedUrl = url.trim();
+    if (!trimmedUrl) return;
+    insertLink(editor, trimmedUrl, label.trim(), savedSelectionRef.current);
+    handleClose();
+  };
+  const handleKeyDown = (e) => {
+    if (e.key === "Enter") {
+      e.preventDefault();
+      handleSubmit();
+    }
+    if (e.key === "Escape") {
+      e.preventDefault();
+      handleClose();
+    }
+  };
+  if (isLink) {
+    return /* @__PURE__ */ jsx(
+      ToolbarButton,
+      {
+        active: true,
+        onClick: () => editor.dispatchCommand(TOGGLE_LINK_COMMAND, null),
+        tooltip: "Remove Link",
+        children: /* @__PURE__ */ jsx(Link, { className: "tw-size-4" })
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "tw-relative", children: [
+    /* @__PURE__ */ jsx(ToolbarButton, { active: open, onClick: handleOpen, tooltip: "Insert Link", children: /* @__PURE__ */ jsx(Link, { className: "tw-size-4" }) }),
+    open && /* @__PURE__ */ jsx(
+      "div",
+      {
+        ref: panelRef,
+        className: "tw-absolute tw-left-0 tw-top-full tw-z-50 tw-mt-1 tw-w-80 tw-rounded-md tw-border tw-border-neutral-200 tw-bg-white tw-p-3 tw-shadow-lg",
+        children: /* @__PURE__ */ jsxs("div", { className: "tw-flex tw-flex-col tw-gap-2", children: [
+          /* @__PURE__ */ jsxs(FormGroup, { children: [
+            /* @__PURE__ */ jsx(Label2, { htmlFor: "link-label", className: "tw-mb-1 tw-text-xs", children: "Label" }),
+            /* @__PURE__ */ jsx(
+              TextInput,
+              {
+                id: "link-label",
+                autoFocus: true,
+                placeholder: "Link text",
+                value: label,
+                onValueChange: setLabel,
+                onKeyDown: handleKeyDown,
+                variant: "secondary"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs(FormGroup, { children: [
+            /* @__PURE__ */ jsx(Label2, { htmlFor: "link-url", className: "tw-mb-1 tw-text-xs", children: "URL" }),
+            /* @__PURE__ */ jsx(
+              TextInput,
+              {
+                id: "link-url",
+                placeholder: "https://\u2026",
+                value: url,
+                onValueChange: setUrl,
+                onKeyDown: handleKeyDown,
+                variant: "secondary"
+              }
+            )
+          ] }),
+          /* @__PURE__ */ jsxs(ButtonGroup, { children: [
+            /* @__PURE__ */ jsx(Button, { size: "small", variant: "outline", onClick: handleClose, children: "Cancel" }),
+            /* @__PURE__ */ jsx(Button, { size: "small", onClick: handleSubmit, disabled: !url.trim(), children: "Add link" })
+          ] })
+        ] })
+      }
+    )
+  ] });
+};
+var ToolbarDivider = () => /* @__PURE__ */ jsx("div", { className: "tw-mx-0.5 tw-h-5 tw-w-px tw-bg-neutral-200" });
+var ELEMENT_FORMAT_TYPES = ["left", "center", "right", "justify", "start", "end", ""];
+var isElementFormatType = (value) => ELEMENT_FORMAT_TYPES.includes(value);
+var toElementFormatType = (value) => isElementFormatType(value) ? value : "left";
+var ToolbarPlugin = () => {
+  const [editor] = useLexicalComposerContext();
+  const [isBold, setIsBold] = useState(false);
+  const [isItalic, setIsItalic] = useState(false);
+  const [isUnderline, setIsUnderline] = useState(false);
+  const [isStrikethrough, setIsStrikethrough] = useState(false);
+  const [isCode, setIsCode] = useState(false);
+  const [isLink, setIsLink] = useState(false);
+  const [blockType, setBlockType] = useState("paragraph");
+  const [alignment, setAlignment] = useState("left");
+  const [isVisible, setIsVisible] = useState(false);
+  const [position, setPosition] = useState(null);
+  const toolbarRef = useRef(null);
+  const isMouseDownRef = useRef(false);
+  const hasSelectionRef = useRef(false);
+  const updatePosition = useCallback(() => {
+    const nativeSelection = window.getSelection();
+    if (!nativeSelection || nativeSelection.rangeCount === 0) return;
+    const range = nativeSelection.getRangeAt(0);
+    const rect = range.getBoundingClientRect();
+    if (rect.width > 0) {
+      const toolbarWidth = toolbarRef.current?.offsetWidth ?? 300;
+      setPosition({
+        top: rect.top + window.scrollY - 8,
+        left: Math.max(8, rect.left + window.scrollX + rect.width / 2 - toolbarWidth / 2)
+      });
+    }
+  }, []);
+  useEffect(() => {
+    const handleMouseDown = () => {
+      isMouseDownRef.current = true;
+    };
+    const handleMouseUp = () => {
+      isMouseDownRef.current = false;
+      if (hasSelectionRef.current) {
+        setIsVisible(true);
+      }
+    };
+    document.addEventListener("mousedown", handleMouseDown);
+    document.addEventListener("mouseup", handleMouseUp);
+    return () => {
+      document.removeEventListener("mousedown", handleMouseDown);
+      document.removeEventListener("mouseup", handleMouseUp);
+    };
+  }, []);
+  const updateToolbar = useCallback(() => {
+    const selection = $getSelection();
+    if (!$isRangeSelection(selection)) {
+      hasSelectionRef.current = false;
+      setIsVisible(false);
+      return;
+    }
+    const hasSelection = !selection.isCollapsed() && selection.getTextContent().length > 0;
+    hasSelectionRef.current = hasSelection;
+    if (!hasSelection) {
+      setIsVisible(false);
+    } else if (!isMouseDownRef.current) {
+      setIsVisible(true);
+    }
+    if (hasSelection) {
+      updatePosition();
+    }
+    setIsBold(selection.hasFormat("bold"));
+    setIsItalic(selection.hasFormat("italic"));
+    setIsUnderline(selection.hasFormat("underline"));
+    setIsStrikethrough(selection.hasFormat("strikethrough"));
+    setIsCode(selection.hasFormat("code"));
+    const node = selection.anchor.getNode();
+    const parent = node.getParent();
+    setIsLink($isLinkNode(parent) || $isLinkNode(node));
+    const blockElement = $getNearestBlockElementAncestorOrThrow(node);
+    if ($isListNode(blockElement)) {
+      const listType = blockElement.getListType();
+      setBlockType(listType === "number" ? "number" : "bullet");
+    } else if ($isHeadingNode(blockElement)) {
+      setBlockType(blockElement.getTag());
+    } else if ($isCodeNode(blockElement)) {
+      setBlockType("code");
+    } else if ($isQuoteNode(blockElement)) {
+      setBlockType("quote");
+    } else {
+      setBlockType("paragraph");
+    }
+    setAlignment(toElementFormatType(blockElement.getFormatType()));
+  }, [updatePosition]);
+  useEffect(() => {
+    const unregisterUpdate = editor.registerUpdateListener(({ editorState }) => {
+      editorState.read(() => {
+        updateToolbar();
+      });
+    });
+    return () => {
+      unregisterUpdate();
+    };
+  }, [editor, updateToolbar]);
+  if (!isVisible || !position) return null;
+  return createPortal(
+    /* @__PURE__ */ jsxs(
+      "div",
+      {
+        ref: toolbarRef,
+        role: "toolbar",
+        "aria-label": "Formatting options",
+        onMouseDown: (e) => e.preventDefault(),
+        style: { top: position.top, left: position.left },
+        className: "tw-absolute tw-z-[1060] tw-flex tw--translate-y-full tw-items-center tw-gap-0.5 tw-rounded-lg tw-border tw-border-neutral-200 tw-bg-white tw-px-1.5 tw-py-1 tw-shadow-lg",
+        children: [
+          /* @__PURE__ */ jsx(BlockTypeDropdown, { editor, blockType }),
+          /* @__PURE__ */ jsx(ToolbarDivider, {}),
+          /* @__PURE__ */ jsx(
+            ToolbarButton,
+            {
+              active: isBold,
+              onClick: () => editor.dispatchCommand(FORMAT_TEXT_COMMAND, "bold"),
+              tooltip: "Bold (Ctrl+B)",
+              children: /* @__PURE__ */ jsx(Bold, { className: "tw-size-4" })
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            ToolbarButton,
+            {
+              active: isItalic,
+              onClick: () => editor.dispatchCommand(FORMAT_TEXT_COMMAND, "italic"),
+              tooltip: "Italic (Ctrl+I)",
+              children: /* @__PURE__ */ jsx(Italic, { className: "tw-size-4" })
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            ToolbarButton,
+            {
+              active: isUnderline,
+              onClick: () => editor.dispatchCommand(FORMAT_TEXT_COMMAND, "underline"),
+              tooltip: "Underline (Ctrl+U)",
+              children: /* @__PURE__ */ jsx(Underline, { className: "tw-size-4" })
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            ToolbarButton,
+            {
+              active: isStrikethrough,
+              onClick: () => editor.dispatchCommand(FORMAT_TEXT_COMMAND, "strikethrough"),
+              tooltip: "Strikethrough",
+              children: /* @__PURE__ */ jsx(Strikethrough, { className: "tw-size-4" })
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            ToolbarButton,
+            {
+              active: isCode,
+              onClick: () => editor.dispatchCommand(FORMAT_TEXT_COMMAND, "code"),
+              tooltip: "Inline Code",
+              children: /* @__PURE__ */ jsx(Code, { className: "tw-size-4" })
+            }
+          ),
+          /* @__PURE__ */ jsx(ToolbarDivider, {}),
+          /* @__PURE__ */ jsx(LinkPanel, { editor, isLink }),
+          /* @__PURE__ */ jsx(ToolbarDivider, {}),
+          /* @__PURE__ */ jsx(
+            ToolbarButton,
+            {
+              active: blockType === "bullet",
+              onClick: () => {
+                if (blockType === "bullet") {
+                  editor.dispatchCommand(REMOVE_LIST_COMMAND, void 0);
+                } else {
+                  editor.dispatchCommand(INSERT_UNORDERED_LIST_COMMAND, void 0);
+                }
+              },
+              tooltip: "Bullet List",
+              children: /* @__PURE__ */ jsx(List, { className: "tw-size-4" })
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            ToolbarButton,
+            {
+              active: blockType === "number",
+              onClick: () => {
+                if (blockType === "number") {
+                  editor.dispatchCommand(REMOVE_LIST_COMMAND, void 0);
+                } else {
+                  editor.dispatchCommand(INSERT_ORDERED_LIST_COMMAND, void 0);
+                }
+              },
+              tooltip: "Numbered List",
+              children: /* @__PURE__ */ jsx(ListOrdered, { className: "tw-size-4" })
+            }
+          ),
+          /* @__PURE__ */ jsx(ToolbarDivider, {}),
+          /* @__PURE__ */ jsx(AlignmentDropdown, { editor, alignment }),
+          /* @__PURE__ */ jsx(ToolbarDivider, {}),
+          /* @__PURE__ */ jsx(
+            ToolbarButton,
+            {
+              active: blockType === "quote",
+              onClick: () => {
+                editor.update(() => {
+                  const selection = $getSelection();
+                  if (!$isRangeSelection(selection)) return;
+                  const anchorNode = selection.anchor.getNode();
+                  const element = $getNearestBlockElementAncestorOrThrow(anchorNode);
+                  const newNode = blockType === "quote" ? $createParagraphNode() : $createQuoteNode();
+                  element.getChildren().forEach((child) => newNode.append(child));
+                  element.replace(newNode);
+                });
+              },
+              tooltip: "Quote",
+              children: /* @__PURE__ */ jsx(Quote, { className: "tw-size-4" })
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            ToolbarButton,
+            {
+              active: blockType === "code",
+              onClick: () => {
+                editor.update(() => {
+                  const selection = $getSelection();
+                  if (!$isRangeSelection(selection)) return;
+                  const anchorNode = selection.anchor.getNode();
+                  const element = $getNearestBlockElementAncestorOrThrow(anchorNode);
+                  const newNode = blockType === "code" ? $createParagraphNode() : $createCodeNode();
+                  element.getChildren().forEach((child) => newNode.append(child));
+                  element.replace(newNode);
+                });
+              },
+              tooltip: "Code Block",
+              children: /* @__PURE__ */ jsx(SquareCode, { className: "tw-size-4" })
+            }
+          )
+        ]
+      }
+    ),
+    document.body
+  );
+};
+
+// src/components/MarkdownEditor/theme.ts
+var editorTheme = {
+  link: "tw-cursor-pointer !tw-text-secondary-500 tw-underline",
+  text: {
+    bold: "tw-font-bold",
+    italic: "tw-italic",
+    strikethrough: "tw-line-through",
+    underline: "tw-underline",
+    code: "tw-rounded tw-bg-neutral-100 tw-px-1 tw-py-0.5 tw-font-mono tw-text-[0.85em]"
+  },
+  list: {
+    ol: "!tw-list-decimal",
+    ul: "!tw-list-disc",
+    checklist: "!tw-list-none !tw-pl-0",
+    listitemChecked: [
+      "tw-relative !tw-pl-6 tw-list-none tw-outline-none tw-line-through tw-text-neutral-400",
+      'before:tw-content-[""] before:tw-absolute before:tw-left-0 before:tw-top-[3px]',
+      "before:tw-size-4 before:tw-rounded before:tw-border before:tw-border-solid",
+      "before:tw-bg-secondary-500 before:tw-border-secondary-500 before:tw-cursor-pointer",
+      'after:tw-content-[""] after:tw-absolute after:tw-left-[5.5px] after:tw-top-[5.5px]',
+      "after:tw-w-1 after:tw-h-2 after:tw-border-white after:tw-border-solid",
+      "after:tw-border-r-[1.5px] after:tw-border-b-[1.5px] after:tw-border-t-0 after:tw-border-l-0",
+      "after:tw-rotate-45"
+    ].join(" "),
+    listitemUnchecked: [
+      "tw-relative !tw-pl-6 tw-list-none tw-outline-none",
+      'before:tw-content-[""] before:tw-absolute before:tw-left-0 before:tw-top-[3px]',
+      "before:tw-size-4 before:tw-rounded before:tw-border before:tw-border-solid",
+      "before:tw-border-neutral-200 before:tw-bg-white before:tw-cursor-pointer"
+    ].join(" ")
+  }
+};
+var EDITOR_NODES = [
+  ImageNode,
+  MermaidNode,
+  HeadingNode,
+  QuoteNode,
+  ListNode,
+  ListItemNode,
+  CodeNode,
+  LinkNode,
+  HorizontalRuleNode
+];
+var MarkdownEditor = ({
+  value,
+  onChange,
+  readOnly = false,
+  placeholder,
+  autoFocus = false,
+  disabled = false,
+  onSave,
+  onCancel,
+  onImageUpload,
+  className,
+  imageRenderer,
+  showToolbar = false,
+  compact = false,
+  saveOnBlur = false,
+  singleLine = false,
+  clampDisplay = false
+}) => {
+  const editable = !readOnly && !disabled;
+  const transformers = singleLine ? SINGLE_LINE_TRANSFORMERS : CUSTOM_TRANSFORMERS;
+  const [initialConfig] = useState(() => ({
+    namespace: "MarkdownEditor",
+    theme: editorTheme,
+    nodes: EDITOR_NODES,
+    onError: (error) => {
+      console.error("[MarkdownEditor] uncaught editor error", error);
+    },
+    editable,
+    editorState: () => {
+      $convertFromMarkdownString(preprocessMarkdown(value), transformers);
+    }
+  }));
+  const skipBlurSaveRef = useRef(false);
+  const handleBlur = saveOnBlur && onSave ? (event) => {
+    if (skipBlurSaveRef.current) {
+      skipBlurSaveRef.current = false;
+      return;
+    }
+    if (!event.currentTarget.contains(event.relatedTarget)) {
+      onSave();
+    }
+  } : void 0;
+  return /* @__PURE__ */ jsx(LexicalComposer, { initialConfig, children: /* @__PURE__ */ jsx(ImageRendererProvider, { value: imageRenderer ?? null, children: /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cn(
+        !compact && "tw-prose",
+        // Compact mode drops `tw-prose`, so Lexical's <p> wrappers fall back to the browser
+        // default `margin: 1em 0` — visually huge at heading sizes. Zero them, and use the
+        // adjacent-sibling selector for paragraph spacing so single-paragraph blocks (titles,
+        // short descriptions) stay tight while multi-paragraph blocks still breathe.
+        compact && "[&_p]:tw-m-0 [&_p+p]:tw-mt-2",
+        // Display-state clamp: 2 lines + bottom fade. Drops in focus-within so editing
+        // expands to full height. Fade replaces ellipsis per the pattern spec — the
+        // mask gradient overlays line-clamp's default ellipsis so it's invisible.
+        clampDisplay && "[&:not(:focus-within)]:tw-line-clamp-2 [&:not(:focus-within)]:[mask-image:linear-gradient(to_bottom,black_50%,transparent)]",
+        className
+      ),
+      onBlur: handleBlur,
+      children: [
+        showToolbar && editable && /* @__PURE__ */ jsx(ToolbarPlugin, {}),
+        /* @__PURE__ */ jsx(
+          "div",
+          {
+            className: cn(
+              "tw-relative tw-rounded-md tw-transition-colors",
+              // In compact mode the padding lets the hover bg / focus ring extend past the text,
+              // but a matching negative margin shifts the wrapper outward so the text itself stays
+              // aligned with the parent's content edge (i.e. with where static text would render).
+              compact ? "tw-px-1.5 tw-py-0.5 -tw-mx-1.5 -tw-my-0.5" : "tw-p-2",
+              editable && "tw-cursor-text hover:tw-bg-neutral-50 focus-within:tw-ring-2 focus-within:tw-ring-secondary-500/40"
+            ),
+            children: /* @__PURE__ */ jsx(
+              RichTextPlugin,
+              {
+                contentEditable: /* @__PURE__ */ jsx(
+                  ContentEditable,
+                  {
+                    className: cn("tw-outline-none", !compact && "tw-min-h-[100px]"),
+                    "aria-placeholder": placeholder ?? "",
+                    placeholder: placeholder ? /* @__PURE__ */ jsx(
+                      "div",
+                      {
+                        className: cn(
+                          "tw-pointer-events-none tw-absolute tw-select-none tw-text-neutral-400",
+                          compact ? "tw-left-1.5 tw-top-0.5" : "tw-left-2 tw-top-[calc(0.5rem+0.35em)]"
+                        ),
+                        children: placeholder
+                      }
+                    ) : /* @__PURE__ */ jsx("div", {})
+                  }
+                ),
+                ErrorBoundary: LexicalErrorBoundary
+              }
+            )
+          }
+        ),
+        /* @__PURE__ */ jsx(HistoryPlugin, {}),
+        /* @__PURE__ */ jsx(LinkPlugin, {}),
+        /* @__PURE__ */ jsx(ClickableLinkPlugin, { newTab: true }),
+        !singleLine && /* @__PURE__ */ jsx(ListPlugin, {}),
+        !singleLine && /* @__PURE__ */ jsx(CheckListPlugin, {}),
+        !singleLine && /* @__PURE__ */ jsx(HorizontalRulePlugin, {}),
+        /* @__PURE__ */ jsx(TabIndentationPlugin, {}),
+        /* @__PURE__ */ jsx(MarkdownShortcutPlugin, { transformers }),
+        /* @__PURE__ */ jsx(
+          MarkdownSyncPlugin,
+          {
+            value,
+            editable,
+            onChange,
+            transformers
+          }
+        ),
+        /* @__PURE__ */ jsx(ImagePastePlugin, { onImageUpload }),
+        /* @__PURE__ */ jsx(
+          KeyboardPlugin,
+          {
+            onSave,
+            onCancel,
+            singleLine,
+            blurOnEscape: singleLine || saveOnBlur,
+            skipBlurSaveRef
+          }
+        ),
+        autoFocus && /* @__PURE__ */ jsx(AutoFocusPlugin, {})
+      ]
+    }
+  ) }) });
+};
+
+export { MarkdownEditor };
+//# sourceMappingURL=markdown-editor.js.map
+//# sourceMappingURL=markdown-editor.js.map