@wealthx/shadcn 1.5.39 → 1.5.41

package/dist/components/ui/ai-conversations/index.js

@@ -1196,6 +1196,7 @@ function Separator(_a2) {
 
 // src/components/ui/chat-input-area.tsx
 var React5 = __toESM(require("react"));
+var import_react_dom = require("react-dom");
 var import_lucide_react5 = require("lucide-react");
 
 // src/components/ui/textarea.tsx
@@ -1218,6 +1219,97 @@ function Textarea(_a2) {
 // src/components/ui/chat-input-area.tsx
 var import_jsx_runtime17 = require("react/jsx-runtime");
 var DEFAULT_HINT = "Enter to send \xB7 Shift+Enter for new line";
+var TOOLBAR_ITEMS = [
+  {
+    type: "button",
+    icon: import_lucide_react5.Bold,
+    label: "Bold",
+    title: "Bold (Ctrl+B)",
+    before: "**",
+    after: "**",
+    placeholder: "bold text"
+  },
+  {
+    type: "button",
+    icon: import_lucide_react5.Italic,
+    label: "Italic",
+    title: "Italic (Ctrl+I)",
+    before: "*",
+    after: "*",
+    placeholder: "italic text"
+  },
+  {
+    type: "button",
+    icon: import_lucide_react5.Code,
+    label: "Inline code",
+    title: "Inline code",
+    before: "`",
+    after: "`",
+    placeholder: "code"
+  },
+  { type: "divider" },
+  {
+    type: "button",
+    icon: import_lucide_react5.Code2,
+    label: "Code block",
+    title: "Code block",
+    before: "```\n",
+    after: "\n```",
+    placeholder: "code block"
+  }
+];
+function applyMarkdown(textarea, before, after, placeholder, onChange) {
+  const start = textarea.selectionStart;
+  const end = textarea.selectionEnd;
+  const selected = textarea.value.slice(start, end);
+  const insertion = selected || placeholder;
+  const next = textarea.value.slice(0, start) + before + insertion + after + textarea.value.slice(end);
+  const newStart = start + before.length;
+  const newEnd = newStart + insertion.length;
+  (0, import_react_dom.flushSync)(() => onChange(next));
+  textarea.focus();
+  textarea.setSelectionRange(newStart, newEnd);
+}
+var MarkdownToolbar = React5.memo(function MarkdownToolbar2({
+  textareaRef,
+  onChange,
+  disabled
+}) {
+  const handleFormat = React5.useCallback(
+    (e) => {
+      if (!textareaRef.current) return;
+      const { before, after, placeholder } = e.currentTarget.dataset;
+      applyMarkdown(textareaRef.current, before, after, placeholder, onChange);
+    },
+    [textareaRef, onChange]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)("div", { className: "flex items-center gap-0.5 border-b border-border px-2 py-1", children: TOOLBAR_ITEMS.map(
+    (item, i) => item.type === "divider" ? /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+      "span",
+      {
+        className: "mx-0.5 h-3.5 w-px bg-border",
+        "aria-hidden": "true"
+      },
+      i
+    ) : /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+      Button,
+      {
+        variant: "ghost",
+        size: "icon-sm",
+        type: "button",
+        title: item.title,
+        "aria-label": item.label,
+        disabled,
+        "data-before": item.before,
+        "data-after": item.after,
+        "data-placeholder": item.placeholder,
+        onClick: handleFormat,
+        children: /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(item.icon, { className: "size-3.5", "aria-hidden": "true" })
+      },
+      item.label
+    )
+  ) });
+});
 function ChatInputArea({
   value,
   onChange,
@@ -1229,6 +1321,7 @@ function ChatInputArea({
   hint = DEFAULT_HINT,
   maxHeight = 160,
   autoFocus = false,
+  showMarkdownToolbar = false,
   className
 }) {
   const textareaRef = React5.useRef(null);
@@ -1297,6 +1390,14 @@ function ChatInputArea({
       className: cn("flex flex-col gap-1.5", className),
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime17.jsxs)("div", { className: "border border-border bg-background flex flex-col focus-within:ring-1 focus-within:ring-ring", children: [
+          showMarkdownToolbar && /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+            MarkdownToolbar,
+            {
+              textareaRef,
+              onChange,
+              disabled
+            }
+          ),
           /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
             Textarea,
             {

package/dist/components/ui/ai-conversations/index.mjs

@@ -9,14 +9,14 @@ import {
   ConversationStatusChip,
   ConversationsPage,
   LeadInfoPanel
-} from "../../../chunk-RRROLESJ.mjs";
+} from "../../../chunk-XHZONBL4.mjs";
 import "../../../chunk-3S6KVFF5.mjs";
 import "../../../chunk-WE4YKBDE.mjs";
 import "../../../chunk-T5FRVEJQ.mjs";
 import "../../../chunk-H5DTKPJ2.mjs";
 import "../../../chunk-H6NQTIF4.mjs";
 import "../../../chunk-2GIYVERS.mjs";
-import "../../../chunk-EFHPSKVF.mjs";
+import "../../../chunk-EGM4DARZ.mjs";
 import "../../../chunk-BS75ICOO.mjs";
 import "../../../chunk-X6RC5UWB.mjs";
 import "../../../chunk-F3CU6KEI.mjs";

package/dist/components/ui/chat-input-area.js

@@ -63,6 +63,7 @@ __export(chat_input_area_exports, {
 });
 module.exports = __toCommonJS(chat_input_area_exports);
 var React2 = __toESM(require("react"));
+var import_react_dom = require("react-dom");
 var import_lucide_react2 = require("lucide-react");
 
 // src/lib/utils.ts
@@ -250,6 +251,97 @@ function Textarea(_a) {
 // src/components/ui/chat-input-area.tsx
 var import_jsx_runtime3 = require("react/jsx-runtime");
 var DEFAULT_HINT = "Enter to send \xB7 Shift+Enter for new line";
+var TOOLBAR_ITEMS = [
+  {
+    type: "button",
+    icon: import_lucide_react2.Bold,
+    label: "Bold",
+    title: "Bold (Ctrl+B)",
+    before: "**",
+    after: "**",
+    placeholder: "bold text"
+  },
+  {
+    type: "button",
+    icon: import_lucide_react2.Italic,
+    label: "Italic",
+    title: "Italic (Ctrl+I)",
+    before: "*",
+    after: "*",
+    placeholder: "italic text"
+  },
+  {
+    type: "button",
+    icon: import_lucide_react2.Code,
+    label: "Inline code",
+    title: "Inline code",
+    before: "`",
+    after: "`",
+    placeholder: "code"
+  },
+  { type: "divider" },
+  {
+    type: "button",
+    icon: import_lucide_react2.Code2,
+    label: "Code block",
+    title: "Code block",
+    before: "```\n",
+    after: "\n```",
+    placeholder: "code block"
+  }
+];
+function applyMarkdown(textarea, before, after, placeholder, onChange) {
+  const start = textarea.selectionStart;
+  const end = textarea.selectionEnd;
+  const selected = textarea.value.slice(start, end);
+  const insertion = selected || placeholder;
+  const next = textarea.value.slice(0, start) + before + insertion + after + textarea.value.slice(end);
+  const newStart = start + before.length;
+  const newEnd = newStart + insertion.length;
+  (0, import_react_dom.flushSync)(() => onChange(next));
+  textarea.focus();
+  textarea.setSelectionRange(newStart, newEnd);
+}
+var MarkdownToolbar = React2.memo(function MarkdownToolbar2({
+  textareaRef,
+  onChange,
+  disabled
+}) {
+  const handleFormat = React2.useCallback(
+    (e) => {
+      if (!textareaRef.current) return;
+      const { before, after, placeholder } = e.currentTarget.dataset;
+      applyMarkdown(textareaRef.current, before, after, placeholder, onChange);
+    },
+    [textareaRef, onChange]
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)("div", { className: "flex items-center gap-0.5 border-b border-border px-2 py-1", children: TOOLBAR_ITEMS.map(
+    (item, i) => item.type === "divider" ? /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      "span",
+      {
+        className: "mx-0.5 h-3.5 w-px bg-border",
+        "aria-hidden": "true"
+      },
+      i
+    ) : /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+      Button,
+      {
+        variant: "ghost",
+        size: "icon-sm",
+        type: "button",
+        title: item.title,
+        "aria-label": item.label,
+        disabled,
+        "data-before": item.before,
+        "data-after": item.after,
+        "data-placeholder": item.placeholder,
+        onClick: handleFormat,
+        children: /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(item.icon, { className: "size-3.5", "aria-hidden": "true" })
+      },
+      item.label
+    )
+  ) });
+});
 function ChatInputArea({
   value,
   onChange,
@@ -261,6 +353,7 @@ function ChatInputArea({
   hint = DEFAULT_HINT,
   maxHeight = 160,
   autoFocus = false,
+  showMarkdownToolbar = false,
   className
 }) {
   const textareaRef = React2.useRef(null);
@@ -329,6 +422,14 @@ function ChatInputArea({
       className: cn("flex flex-col gap-1.5", className),
       children: [
         /* @__PURE__ */ (0, import_jsx_runtime3.jsxs)("div", { className: "border border-border bg-background flex flex-col focus-within:ring-1 focus-within:ring-ring", children: [
+          showMarkdownToolbar && /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
+            MarkdownToolbar,
+            {
+              textareaRef,
+              onChange,
+              disabled
+            }
+          ),
           /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
             Textarea,
             {

package/dist/components/ui/chat-input-area.mjs

@@ -1,6 +1,6 @@
 import {
   ChatInputArea
-} from "../../chunk-EFHPSKVF.mjs";
+} from "../../chunk-EGM4DARZ.mjs";
 import "../../chunk-BS75ICOO.mjs";
 import "../../chunk-NOOEKOWY.mjs";
 import "../../chunk-R4HCRDU5.mjs";