markdown-flow-ui 0.3.2-dev.1 → 0.3.2

package/dist/components/MarkdownFlowEditor/locales/zh-CN.json.es.js

@@ -1,141 +1,113 @@
-const o = "输入'/'快速插入内容", e = "请输入你的内容", t = "请输入你的内容，输入 / 唤起更多", Z = "设置", _ = "关闭", l = "添加图片", a = "添加视频", i = "请输入图片地址", $ = "URL", oo = "预览", n = "请输入图片标题", s = "使用图片", c = "图片名称", eo = "上传", r = "拖拽文件或点击上传", d = "正在上传...", b = "上传完成", u = "上传失败，请重试", g = "添加固定文本", v = "固定文本", to = "分割线", h = "图片标题", m = "缩放比例", lo = "取消", T = "请输入图片地址", p = "请输入有效的图片地址", U = "请输入 B 站或 YouTube 视频链接", ao = "URL", io = "预览", I = "使用资源", C = "请输入视频标题", no = "标题", B = "视频标题", L = "哔哩哔哩视频", P = "YouTube 视频", V = "请输入有效的 B 站或 YouTube 视频链接", so = "取消", x = "使用视频", f = "预览将在这里显示", R = "视频预览", co = "图片", ro = "视频", bo = "变量", S = "固定文本", D = "选择变量", E = "搜索变量", N = "未找到变量", O = "暂无变量", w = "变量名称", Y = "变量已存在", y = "名称不能为空，且不能包含控制字符、换行或连续两个右花括号", k = "系统变量", q = "自定义变量", A = "添加变量", F = "插入新变量", z = "插入已有变量", M = "插入确定内容", Q = "插入链接", j = "插入按钮", G = "插入单选", uo = "选项1", go = "选项2", H = "插入多选", J = "插入输入框", vo = "请输入", K = "插入图片", W = "插入视频", X = "你的问题", ho = {
+const o = "输入'/'快速插入内容", e = "请输入你的内容", t = "请输入你的内容，输入 / 唤起更多", F = "设置", M = "关闭", l = "添加图片", i = "添加视频", n = "请输入图片地址", N = "URL", Q = "预览", a = "请输入图片标题", s = "使用图片", c = "图片名称", j = "上传", d = "拖拽文件或点击上传", r = "正在上传...", u = "上传完成", g = "上传失败，请重试", b = "添加固定文本", h = "固定文本", y = "分割线", m = "图片标题", v = "缩放比例", A = "取消", T = "请输入图片地址", U = "请输入有效的图片地址", p = "请输入 B 站或 YouTube 视频链接", G = "URL", H = "预览", I = "使用资源", B = "请输入视频标题", J = "标题", C = "视频标题", L = "哔哩哔哩视频", P = "YouTube 视频", f = "请输入有效的 B 站或 YouTube 视频链接", K = "取消", x = "使用视频", R = "预览将在这里显示", D = "视频预览", W = "图片", X = "视频", O = "固定文本", V = "插入确定内容", Y = "插入链接", E = "插入按钮", S = "插入单选", Z = "选项1", _ = "选项2", k = "插入多选", w = "插入输入框", $ = "请输入", q = "插入图片", z = "插入视频", oo = {
   placeholder: o,
   placeholderCodeEdit: e,
   placeholderQuickEdit: t,
   dialogTitle: "设置",
   dialogCloseLabel: "关闭",
   dialogTitleImage: l,
-  dialogTitleVideo: a,
-  imageUrlPlaceholder: i,
+  dialogTitleVideo: i,
+  imageUrlPlaceholder: n,
   imageUrlLabel: "URL",
   imageRunButton: "预览",
-  imageTitlePlaceholder: n,
+  imageTitlePlaceholder: a,
   imageUseButton: s,
   imageDefaultTitle: c,
   imageUploadLabel: "上传",
-  imageUploadPlaceholder: r,
-  imageUploading: d,
-  imageUploadSuccess: b,
-  imageUploadError: u,
-  fixedTextPlaceholder: g,
-  fixedTextTooltip: v,
+  imageUploadPlaceholder: d,
+  imageUploading: r,
+  imageUploadSuccess: u,
+  imageUploadError: g,
+  fixedTextPlaceholder: b,
+  fixedTextTooltip: h,
   slashDivider: "分割线",
-  imageTitleLabel: h,
-  imageScaleLabel: m,
+  imageTitleLabel: m,
+  imageScaleLabel: v,
   imageCancelButton: "取消",
   imageUrlRequired: T,
-  imageInvalidUrl: p,
-  videoUrlPlaceholder: U,
+  imageInvalidUrl: U,
+  videoUrlPlaceholder: p,
   videoUrlLabel: "URL",
   videoRunButton: "预览",
   videoUseButton: I,
-  videoTitlePlaceholder: C,
+  videoTitlePlaceholder: B,
   videoTitleLabel: "标题",
-  videoDefaultTitle: B,
+  videoDefaultTitle: C,
   videoDefaultTitleBilibili: L,
   videoDefaultTitleYoutube: P,
-  videoInvalidUrl: V,
+  videoInvalidUrl: f,
   videoCancelButton: "取消",
   videoUseVideoButton: x,
-  videoPreviewPlaceholder: f,
-  videoPreviewTitle: R,
+  videoPreviewPlaceholder: R,
+  videoPreviewTitle: D,
   slashImage: "图片",
   slashVideo: "视频",
-  slashVariable: "变量",
-  slashFixedText: S,
-  dialogTitleVariable: D,
-  variableSearchPlaceholder: E,
-  variableNotFound: N,
-  variableEmpty: O,
-  variableNamePlaceholder: w,
-  variableAlreadyExists: Y,
-  variableNameInvalid: y,
-  variableSectionSystem: k,
-  variableSectionCustom: q,
-  variableAddNew: A,
-  toolbarInsertNewVariable: F,
-  toolbarInsertExistingVariable: z,
-  toolbarConfirmOutput: M,
-  toolbarInsertLink: Q,
-  toolbarInsertButton: j,
-  toolbarInsertSingleChoice: G,
+  slashFixedText: O,
+  toolbarConfirmOutput: V,
+  toolbarInsertLink: Y,
+  toolbarInsertButton: E,
+  toolbarInsertSingleChoice: S,
   toolbarChoiceOption1: "选项1",
   toolbarChoiceOption2: "选项2",
-  toolbarInsertMultiChoice: H,
-  toolbarInsertInput: J,
+  toolbarInsertMultiChoice: k,
+  toolbarInsertInput: w,
   toolbarInputPlaceholder: "请输入",
-  toolbarInsertImage: K,
-  toolbarInsertVideo: W,
-  questionPlaceholder: X
+  toolbarInsertImage: q,
+  toolbarInsertVideo: z
 };
 export {
-  ho as default,
-  _ as dialogCloseLabel,
-  Z as dialogTitle,
+  oo as default,
+  M as dialogCloseLabel,
+  F as dialogTitle,
   l as dialogTitleImage,
-  D as dialogTitleVariable,
-  a as dialogTitleVideo,
-  g as fixedTextPlaceholder,
-  v as fixedTextTooltip,
-  lo as imageCancelButton,
+  i as dialogTitleVideo,
+  b as fixedTextPlaceholder,
+  h as fixedTextTooltip,
+  A as imageCancelButton,
   c as imageDefaultTitle,
-  p as imageInvalidUrl,
-  oo as imageRunButton,
-  m as imageScaleLabel,
-  h as imageTitleLabel,
-  n as imageTitlePlaceholder,
-  u as imageUploadError,
-  eo as imageUploadLabel,
-  r as imageUploadPlaceholder,
-  b as imageUploadSuccess,
-  d as imageUploading,
-  $ as imageUrlLabel,
-  i as imageUrlPlaceholder,
+  U as imageInvalidUrl,
+  Q as imageRunButton,
+  v as imageScaleLabel,
+  m as imageTitleLabel,
+  a as imageTitlePlaceholder,
+  g as imageUploadError,
+  j as imageUploadLabel,
+  d as imageUploadPlaceholder,
+  u as imageUploadSuccess,
+  r as imageUploading,
+  N as imageUrlLabel,
+  n as imageUrlPlaceholder,
   T as imageUrlRequired,
   s as imageUseButton,
   o as placeholder,
   e as placeholderCodeEdit,
   t as placeholderQuickEdit,
-  X as questionPlaceholder,
-  to as slashDivider,
-  S as slashFixedText,
-  co as slashImage,
-  bo as slashVariable,
-  ro as slashVideo,
-  uo as toolbarChoiceOption1,
-  go as toolbarChoiceOption2,
-  M as toolbarConfirmOutput,
-  vo as toolbarInputPlaceholder,
-  j as toolbarInsertButton,
-  z as toolbarInsertExistingVariable,
-  K as toolbarInsertImage,
-  J as toolbarInsertInput,
-  Q as toolbarInsertLink,
-  H as toolbarInsertMultiChoice,
-  F as toolbarInsertNewVariable,
-  G as toolbarInsertSingleChoice,
-  W as toolbarInsertVideo,
-  A as variableAddNew,
-  Y as variableAlreadyExists,
-  O as variableEmpty,
-  y as variableNameInvalid,
-  w as variableNamePlaceholder,
-  N as variableNotFound,
-  E as variableSearchPlaceholder,
-  q as variableSectionCustom,
-  k as variableSectionSystem,
-  so as videoCancelButton,
-  B as videoDefaultTitle,
+  y as slashDivider,
+  O as slashFixedText,
+  W as slashImage,
+  X as slashVideo,
+  Z as toolbarChoiceOption1,
+  _ as toolbarChoiceOption2,
+  V as toolbarConfirmOutput,
+  $ as toolbarInputPlaceholder,
+  E as toolbarInsertButton,
+  q as toolbarInsertImage,
+  w as toolbarInsertInput,
+  Y as toolbarInsertLink,
+  k as toolbarInsertMultiChoice,
+  S as toolbarInsertSingleChoice,
+  z as toolbarInsertVideo,
+  K as videoCancelButton,
+  C as videoDefaultTitle,
   L as videoDefaultTitleBilibili,
   P as videoDefaultTitleYoutube,
-  V as videoInvalidUrl,
-  f as videoPreviewPlaceholder,
-  R as videoPreviewTitle,
-  io as videoRunButton,
-  no as videoTitleLabel,
-  C as videoTitlePlaceholder,
-  ao as videoUrlLabel,
-  U as videoUrlPlaceholder,
+  f as videoInvalidUrl,
+  R as videoPreviewPlaceholder,
+  D as videoPreviewTitle,
+  H as videoRunButton,
+  J as videoTitleLabel,
+  B as videoTitlePlaceholder,
+  G as videoUrlLabel,
+  p as videoUrlPlaceholder,
   I as videoUseButton,
   x as videoUseVideoButton
 };

package/dist/components/MarkdownFlowEditor/locales/zh-CN.json.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"zh-CN.json.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"zh-CN.json.es.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/MarkdownFlowEditor/plugins/ImgPlaceholder.cjs

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const a=require("../../../node_modules/@codemirror/view/dist/index.cjs"),f=require("../types.cjs"),x=require("../utils.cjs"),b=require("./PlaceholderWidget.cjs"),s=require("./mediaPlaceholderLabels.cjs"),P=/!\[([^\]]*)\]\(([^)]+)\)|<img\b[^>]*>/i,w=/===\s*(?:!\[[^\]]*\]\([^)]+\)|<img\b[^>]*>)\s*===|!\[[^\]]*\]\([^)]+\)|<img\b[^>]*>/gi,o=(e,r)=>{const t=new RegExp(`${r}\\s*=\\s*("(.*?)"|'(.*?)'|([^\\s"'<>]+))`,"i"),c=e.match(t);if(c)return c[2]??c[3]??c[4]},M=e=>Math.max(1,Math.min(1e3,Math.round(e))),D=e=>{const r=e?.[0]??"",t=x.unwrapFixedOutput(r),c=/^\s*===/.test(r);if(/^<img\b/i.test(t)){const p=o(t,"src")??"",u=o(t,"alt")??o(t,"title")??"",d=o(t,"width");let g;if(d){const m=Number.parseFloat(d);Number.isFinite(m)&&(g=M(m))}return{text:u,url:p,title:u,scalePercent:g,fixedOutput:c}}const l=t.match(P),n=l?.[1]??"",h=l?.[2]??"";return{text:n,url:h,title:n,scalePercent:void 0,fixedOutput:c}},i=new a.MatchDecorator({regexp:w,decoration:(e,r)=>{const t=D(e);return a.Decoration.replace({widget:new b.default(t.text||r.state.facet(s.mediaPlaceholderLabels).image,{tag:"image",url:t.url,title:t.title,scalePercent:t.scalePercent,fixedOutput:t.fixedOutput},"tag-image",f.SelectedOption.Image,r)})}}),O=a.ViewPlugin.fromClass(class{constructor(e){this.placeholders=i.createDeco(e)}update(e){if(e.startState.facet(s.mediaPlaceholderLabels)!==e.state.facet(s.mediaPlaceholderLabels)){this.placeholders=i.createDeco(e.view);return}this.placeholders=i.updateDeco(e,this.placeholders)}},{decorations:e=>e.placeholders,provide:e=>a.EditorView.atomicRanges.of(r=>r.plugin(e)?.placeholders||a.Decoration.none)});exports.default=O;
+"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const i=require("../../../node_modules/@codemirror/view/dist/index.cjs"),f=require("../types.cjs"),x=require("../utils.cjs"),b=require("./PlaceholderWidget.cjs"),u=require("./mediaPlaceholderLabels.cjs"),P=require("../../../_virtual/index.cjs"),w=/!\[([^\]]*)\]\(([^)]+)\)|<img\b[^>]*>/i,M=/===\s*(?:!\[[^\]]*\]\([^)]+\)|<img\b[^>]*>)\s*===|!\[[^\]]*\]\([^)]+\)|<img\b[^>]*>/gi,l=(e,c)=>{const t=new RegExp(`${c}\\s*=\\s*("(.*?)"|'(.*?)'|([^\\s"'<>]+))`,"i"),r=e.match(t);if(r)return r[2]??r[3]??r[4]},D=e=>Math.max(1,Math.min(1e3,Math.round(e))),q=e=>{const c=e?.[0]??"",t=x.unwrapFixedOutput(c),r=/^\s*===/.test(c);if(/^<img\b/i.test(t)){const n=l(t,"src")??"",d=l(t,"alt")??l(t,"title")??"",h=l(t,"width");let m;if(h){const g=Number.parseFloat(h);Number.isFinite(g)&&(m=D(g))}return{text:d,url:n,title:d,scalePercent:m,fixedOutput:r}}const s=t.match(w),o=s?.[1]??"",a=s?.[2]??"";return{text:o,url:a,title:o,scalePercent:void 0,fixedOutput:r}},p=e=>{const c=P.distExports.findDocumentVariableMarkers(e.state.doc.toString()).filter(t=>t.name!==null);return new i.MatchDecorator({regexp:M,decoration:(t,r,s)=>{const o=s+t[0].length;if(c.some(n=>s<n.end&&o>n.start))return null;const a=q(t);return i.Decoration.replace({widget:new b.default(a.text||r.state.facet(u.mediaPlaceholderLabels).image,{tag:"image",url:a.url,title:a.title,scalePercent:a.scalePercent,fixedOutput:a.fixedOutput},"tag-image",f.SelectedOption.Image,r)})}})},v=i.ViewPlugin.fromClass(class{constructor(e){this.matcher=p(e),this.placeholders=this.matcher.createDeco(e)}update(e){if(e.docChanged&&(this.matcher=p(e.view)),e.docChanged||e.startState.facet(u.mediaPlaceholderLabels)!==e.state.facet(u.mediaPlaceholderLabels)){this.placeholders=this.matcher.createDeco(e.view);return}this.placeholders=this.matcher.updateDeco(e,this.placeholders)}},{decorations:e=>e.placeholders,provide:e=>i.EditorView.atomicRanges.of(c=>c.plugin(e)?.placeholders||i.Decoration.none)});exports.default=v;
 //# sourceMappingURL=ImgPlaceholder.cjs.map

package/dist/components/MarkdownFlowEditor/plugins/ImgPlaceholder.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"ImgPlaceholder.cjs","sources":["../../../../src/components/MarkdownFlowEditor/plugins/ImgPlaceholder.ts"],"sourcesContent":["import {\n  EditorView,\n  Decoration,\n  DecorationSet,\n  ViewPlugin,\n  ViewUpdate,\n  MatchDecorator,\n} from \"@codemirror/view\";\nimport { SelectedOption } from \"../types\";\nimport { unwrapFixedOutput } from \"../utils\";\nimport PlaceholderWidget from \"./PlaceholderWidget\";\nimport { mediaPlaceholderLabels } from \"./mediaPlaceholderLabels\";\n\nconst imageMarkupRegexp = /!\\[([^\\]]*)\\]\\(([^)]+)\\)|<img\\b[^>]*>/i;\nconst agiImgContextRegexp =\n  /===\\s*(?:!\\[[^\\]]*\\]\\([^)]+\\)|<img\\b[^>]*>)\\s*===|!\\[[^\\]]*\\]\\([^)]+\\)|<img\\b[^>]*>/gi;\n\nconst extractAttributeValue = (tag: string, attribute: string) => {\n  const regexp = new RegExp(\n    `${attribute}\\\\s*=\\\\s*(\"(.*?)\"|'(.*?)'|([^\\\\s\"'<>]+))`,\n    \"i\"\n  );\n  const match = tag.match(regexp);\n  if (!match) return undefined;\n  return match[2] ?? match[3] ?? match[4];\n};\n\nconst clampScalePercent = (value: number) =>\n  Math.max(1, Math.min(1000, Math.round(value)));\n\nconst getImageMatchInfo = (match: RegExpMatchArray) => {\n  const source = match?.[0] ?? \"\";\n  const raw = unwrapFixedOutput(source);\n  const fixedOutput = /^\\s*===/.test(source);\n  if (/^<img\\b/i.test(raw)) {\n    const src = extractAttributeValue(raw, \"src\") ?? \"\";\n    const alt =\n      extractAttributeValue(raw, \"alt\") ??\n      extractAttributeValue(raw, \"title\") ??\n      \"\";\n    const widthAttr = extractAttributeValue(raw, \"width\");\n    let scalePercent: number | undefined;\n    if (widthAttr) {\n      const numeric = Number.parseFloat(widthAttr);\n      if (Number.isFinite(numeric)) {\n        scalePercent = clampScalePercent(numeric);\n      }\n    }\n    return {\n      text: alt,\n      url: src,\n      title: alt,\n      scalePercent,\n      fixedOutput,\n    };\n  }\n  const markdownMatch = raw.match(imageMarkupRegexp);\n  const title = markdownMatch?.[1] ?? \"\";\n  const url = markdownMatch?.[2] ?? \"\";\n  return {\n    text: title,\n    url,\n    title,\n    scalePercent: undefined,\n    fixedOutput,\n  };\n};\n\nconst imageUrlMatcher = new MatchDecorator({\n  regexp: agiImgContextRegexp,\n  decoration: (match, view) => {\n    const info = getImageMatchInfo(match);\n    return Decoration.replace({\n      widget: new PlaceholderWidget(\n        info.text || view.state.facet(mediaPlaceholderLabels).image,\n        {\n          tag: \"image\",\n          url: info.url,\n          title: info.title,\n          scalePercent: info.scalePercent,\n          fixedOutput: info.fixedOutput,\n        },\n        \"tag-image\",\n        SelectedOption.Image,\n        view\n      ),\n    });\n  },\n});\n\nconst ImgPlaceholder = ViewPlugin.fromClass(\n  class {\n    placeholders: DecorationSet;\n    constructor(view: EditorView) {\n      this.placeholders = imageUrlMatcher.createDeco(view);\n    }\n    update(update: ViewUpdate) {\n      if (\n        update.startState.facet(mediaPlaceholderLabels) !==\n        update.state.facet(mediaPlaceholderLabels)\n      ) {\n        this.placeholders = imageUrlMatcher.createDeco(update.view);\n        return;\n      }\n      this.placeholders = imageUrlMatcher.updateDeco(update, this.placeholders);\n    }\n  },\n  {\n    decorations: (instance) => instance.placeholders,\n    provide: (plugin) =>\n      EditorView.atomicRanges.of((view) => {\n        return view.plugin(plugin)?.placeholders || Decoration.none;\n      }),\n  }\n);\n\nexport default ImgPlaceholder;\n"],"names":["imageMarkupRegexp","agiImgContextRegexp","extractAttributeValue","tag","attribute","regexp","match","clampScalePercent","value","getImageMatchInfo","source","raw","unwrapFixedOutput","fixedOutput","src","alt","widthAttr","scalePercent","numeric","markdownMatch","title","url","imageUrlMatcher","MatchDecorator","view","info","Decoration","PlaceholderWidget","mediaPlaceholderLabels","SelectedOption","ImgPlaceholder","ViewPlugin","update","instance","plugin","EditorView"],"mappings":"wTAaMA,EAAoB,yCACpBC,EACJ,wFAEIC,EAAwB,CAACC,EAAaC,IAAsB,CAChE,MAAMC,EAAS,IAAI,OACjB,GAAGD,CAAS,2CACZ,GAAA,EAEIE,EAAQH,EAAI,MAAME,CAAM,EAC9B,GAAKC,EACL,OAAOA,EAAM,CAAC,GAAKA,EAAM,CAAC,GAAKA,EAAM,CAAC,CACxC,EAEMC,EAAqBC,GACzB,KAAK,IAAI,EAAG,KAAK,IAAI,IAAM,KAAK,MAAMA,CAAK,CAAC,CAAC,EAEzCC,EAAqBH,GAA4B,CACrD,MAAMI,EAASJ,IAAQ,CAAC,GAAK,GACvBK,EAAMC,EAAAA,kBAAkBF,CAAM,EAC9BG,EAAc,UAAU,KAAKH,CAAM,EACzC,GAAI,WAAW,KAAKC,CAAG,EAAG,CACxB,MAAMG,EAAMZ,EAAsBS,EAAK,KAAK,GAAK,GAC3CI,EACJb,EAAsBS,EAAK,KAAK,GAChCT,EAAsBS,EAAK,OAAO,GAClC,GACIK,EAAYd,EAAsBS,EAAK,OAAO,EACpD,IAAIM,EACJ,GAAID,EAAW,CACb,MAAME,EAAU,OAAO,WAAWF,CAAS,EACvC,OAAO,SAASE,CAAO,IACzBD,EAAeV,EAAkBW,CAAO,EAE5C,CACA,MAAO,CACL,KAAMH,EACN,IAAKD,EACL,MAAOC,EACP,aAAAE,EACA,YAAAJ,CAAA,CAEJ,CACA,MAAMM,EAAgBR,EAAI,MAAMX,CAAiB,EAC3CoB,EAAQD,IAAgB,CAAC,GAAK,GAC9BE,EAAMF,IAAgB,CAAC,GAAK,GAClC,MAAO,CACL,KAAMC,EACN,IAAAC,EACA,MAAAD,EACA,aAAc,OACd,YAAAP,CAAA,CAEJ,EAEMS,EAAkB,IAAIC,EAAAA,eAAe,CACzC,OAAQtB,EACR,WAAY,CAACK,EAAOkB,IAAS,CAC3B,MAAMC,EAAOhB,EAAkBH,CAAK,EACpC,OAAOoB,EAAAA,WAAW,QAAQ,CACxB,OAAQ,IAAIC,EAAAA,QACVF,EAAK,MAAQD,EAAK,MAAM,MAAMI,EAAAA,sBAAsB,EAAE,MACtD,CACE,IAAK,QACL,IAAKH,EAAK,IACV,MAAOA,EAAK,MACZ,aAAcA,EAAK,aACnB,YAAaA,EAAK,WAAA,EAEpB,YACAI,EAAAA,eAAe,MACfL,CAAA,CACF,CACD,CACH,CACF,CAAC,EAEKM,EAAiBC,EAAAA,WAAW,UAChC,KAAM,CAEJ,YAAYP,EAAkB,CAC5B,KAAK,aAAeF,EAAgB,WAAWE,CAAI,CACrD,CACA,OAAOQ,EAAoB,CACzB,GACEA,EAAO,WAAW,MAAMJ,EAAAA,sBAAsB,IAC9CI,EAAO,MAAM,MAAMJ,EAAAA,sBAAsB,EACzC,CACA,KAAK,aAAeN,EAAgB,WAAWU,EAAO,IAAI,EAC1D,MACF,CACA,KAAK,aAAeV,EAAgB,WAAWU,EAAQ,KAAK,YAAY,CAC1E,CAAA,EAEF,CACE,YAAcC,GAAaA,EAAS,aACpC,QAAUC,GACRC,EAAAA,WAAW,aAAa,GAAIX,GACnBA,EAAK,OAAOU,CAAM,GAAG,cAAgBR,EAAAA,WAAW,IACxD,CAAA,CAEP"}
+{"version":3,"file":"ImgPlaceholder.cjs","sources":["../../../../src/components/MarkdownFlowEditor/plugins/ImgPlaceholder.ts"],"sourcesContent":["import {\n  EditorView,\n  Decoration,\n  DecorationSet,\n  ViewPlugin,\n  ViewUpdate,\n  MatchDecorator,\n} from \"@codemirror/view\";\nimport { SelectedOption } from \"../types\";\nimport { findDocumentVariableMarkers, unwrapFixedOutput } from \"../utils\";\nimport PlaceholderWidget from \"./PlaceholderWidget\";\nimport { mediaPlaceholderLabels } from \"./mediaPlaceholderLabels\";\n\nconst imageMarkupRegexp = /!\\[([^\\]]*)\\]\\(([^)]+)\\)|<img\\b[^>]*>/i;\nconst agiImgContextRegexp =\n  /===\\s*(?:!\\[[^\\]]*\\]\\([^)]+\\)|<img\\b[^>]*>)\\s*===|!\\[[^\\]]*\\]\\([^)]+\\)|<img\\b[^>]*>/gi;\n\nconst extractAttributeValue = (tag: string, attribute: string) => {\n  const regexp = new RegExp(\n    `${attribute}\\\\s*=\\\\s*(\"(.*?)\"|'(.*?)'|([^\\\\s\"'<>]+))`,\n    \"i\"\n  );\n  const match = tag.match(regexp);\n  if (!match) return undefined;\n  return match[2] ?? match[3] ?? match[4];\n};\n\nconst clampScalePercent = (value: number) =>\n  Math.max(1, Math.min(1000, Math.round(value)));\n\nconst getImageMatchInfo = (match: RegExpMatchArray) => {\n  const source = match?.[0] ?? \"\";\n  const raw = unwrapFixedOutput(source);\n  const fixedOutput = /^\\s*===/.test(source);\n  if (/^<img\\b/i.test(raw)) {\n    const src = extractAttributeValue(raw, \"src\") ?? \"\";\n    const alt =\n      extractAttributeValue(raw, \"alt\") ??\n      extractAttributeValue(raw, \"title\") ??\n      \"\";\n    const widthAttr = extractAttributeValue(raw, \"width\");\n    let scalePercent: number | undefined;\n    if (widthAttr) {\n      const numeric = Number.parseFloat(widthAttr);\n      if (Number.isFinite(numeric)) {\n        scalePercent = clampScalePercent(numeric);\n      }\n    }\n    return {\n      text: alt,\n      url: src,\n      title: alt,\n      scalePercent,\n      fixedOutput,\n    };\n  }\n  const markdownMatch = raw.match(imageMarkupRegexp);\n  const title = markdownMatch?.[1] ?? \"\";\n  const url = markdownMatch?.[2] ?? \"\";\n  return {\n    text: title,\n    url,\n    title,\n    scalePercent: undefined,\n    fixedOutput,\n  };\n};\n\nconst createImageUrlMatcher = (view: EditorView) => {\n  const variables = findDocumentVariableMarkers(\n    view.state.doc.toString()\n  ).filter((marker) => marker.name !== null);\n  return new MatchDecorator({\n    regexp: agiImgContextRegexp,\n    decoration: (match, view, from) => {\n      const to = from + match[0].length;\n      if (variables.some((marker) => from < marker.end && to > marker.start)) {\n        return null;\n      }\n      const info = getImageMatchInfo(match);\n      return Decoration.replace({\n        widget: new PlaceholderWidget(\n          info.text || view.state.facet(mediaPlaceholderLabels).image,\n          {\n            tag: \"image\",\n            url: info.url,\n            title: info.title,\n            scalePercent: info.scalePercent,\n            fixedOutput: info.fixedOutput,\n          },\n          \"tag-image\",\n          SelectedOption.Image,\n          view\n        ),\n      });\n    },\n  });\n};\n\nconst ImgPlaceholder = ViewPlugin.fromClass(\n  class {\n    placeholders: DecorationSet;\n    matcher: MatchDecorator;\n    constructor(view: EditorView) {\n      this.matcher = createImageUrlMatcher(view);\n      this.placeholders = this.matcher.createDeco(view);\n    }\n    update(update: ViewUpdate) {\n      if (update.docChanged) {\n        this.matcher = createImageUrlMatcher(update.view);\n      }\n      if (\n        update.docChanged ||\n        update.startState.facet(mediaPlaceholderLabels) !==\n          update.state.facet(mediaPlaceholderLabels)\n      ) {\n        this.placeholders = this.matcher.createDeco(update.view);\n        return;\n      }\n      this.placeholders = this.matcher.updateDeco(update, this.placeholders);\n    }\n  },\n  {\n    decorations: (instance) => instance.placeholders,\n    provide: (plugin) =>\n      EditorView.atomicRanges.of((view) => {\n        return view.plugin(plugin)?.placeholders || Decoration.none;\n      }),\n  }\n);\n\nexport default ImgPlaceholder;\n"],"names":["imageMarkupRegexp","agiImgContextRegexp","extractAttributeValue","tag","attribute","regexp","match","clampScalePercent","value","getImageMatchInfo","source","raw","unwrapFixedOutput","fixedOutput","src","alt","widthAttr","scalePercent","numeric","markdownMatch","title","url","createImageUrlMatcher","view","variables","findDocumentVariableMarkers","marker","MatchDecorator","from","to","info","Decoration","PlaceholderWidget","mediaPlaceholderLabels","SelectedOption","ImgPlaceholder","ViewPlugin","update","instance","plugin","EditorView"],"mappings":"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"}

package/dist/components/MarkdownFlowEditor/plugins/ImgPlaceholder.d.ts

@@ -1,6 +1,7 @@
-import { DecorationSet, ViewPlugin, ViewUpdate } from '@codemirror/view';
+import { DecorationSet, ViewPlugin, ViewUpdate, MatchDecorator } from '@codemirror/view';
 declare const ImgPlaceholder: ViewPlugin<{
     placeholders: DecorationSet;
+    matcher: MatchDecorator;
     update(update: ViewUpdate): void;
 }, undefined>;
 export default ImgPlaceholder;

package/dist/components/MarkdownFlowEditor/plugins/ImgPlaceholder.es.js

@@ -1,76 +1,85 @@
-import { MatchDecorator as f, Decoration as p, ViewPlugin as x, EditorView as w } from "../../../node_modules/@codemirror/view/dist/index.es.js";
-import { SelectedOption as P } from "../types.es.js";
-import { unwrapFixedOutput as b } from "../utils.es.js";
-import M from "./PlaceholderWidget.es.js";
-import { mediaPlaceholderLabels as i } from "./mediaPlaceholderLabels.es.js";
-const D = /!\[([^\]]*)\]\(([^)]+)\)|<img\b[^>]*>/i, I = /===\s*(?:!\[[^\]]*\]\([^)]+\)|<img\b[^>]*>)\s*===|!\[[^\]]*\]\([^)]+\)|<img\b[^>]*>/gi, o = (t, r) => {
+import { ViewPlugin as f, EditorView as x, Decoration as p, MatchDecorator as w } from "../../../node_modules/@codemirror/view/dist/index.es.js";
+import { SelectedOption as b } from "../types.es.js";
+import { unwrapFixedOutput as M } from "../utils.es.js";
+import P from "./PlaceholderWidget.es.js";
+import { mediaPlaceholderLabels as l } from "./mediaPlaceholderLabels.es.js";
+import { d as D } from "../../../_virtual/index.es.js";
+const I = /!\[([^\]]*)\]\(([^)]+)\)|<img\b[^>]*>/i, O = /===\s*(?:!\[[^\]]*\]\([^)]+\)|<img\b[^>]*>)\s*===|!\[[^\]]*\]\([^)]+\)|<img\b[^>]*>/gi, n = (t, c) => {
   const e = new RegExp(
-    `${r}\\s*=\\s*("(.*?)"|'(.*?)'|([^\\s"'<>]+))`,
+    `${c}\\s*=\\s*("(.*?)"|'(.*?)'|([^\\s"'<>]+))`,
     "i"
-  ), c = t.match(e);
-  if (c)
-    return c[2] ?? c[3] ?? c[4];
-}, O = (t) => Math.max(1, Math.min(1e3, Math.round(t))), R = (t) => {
-  const r = t?.[0] ?? "", e = b(r), c = /^\s*===/.test(r);
+  ), r = t.match(e);
+  if (r)
+    return r[2] ?? r[3] ?? r[4];
+}, v = (t) => Math.max(1, Math.min(1e3, Math.round(t))), C = (t) => {
+  const c = t?.[0] ?? "", e = M(c), r = /^\s*===/.test(c);
   if (/^<img\b/i.test(e)) {
-    const h = o(e, "src") ?? "", l = o(e, "alt") ?? o(e, "title") ?? "", m = o(e, "width");
-    let u;
-    if (m) {
-      const g = Number.parseFloat(m);
-      Number.isFinite(g) && (u = O(g));
+    const s = n(e, "src") ?? "", m = n(e, "alt") ?? n(e, "title") ?? "", h = n(e, "width");
+    let d;
+    if (h) {
+      const u = Number.parseFloat(h);
+      Number.isFinite(u) && (d = v(u));
     }
     return {
-      text: l,
-      url: h,
-      title: l,
-      scalePercent: u,
-      fixedOutput: c
+      text: m,
+      url: s,
+      title: m,
+      scalePercent: d,
+      fixedOutput: r
     };
   }
-  const s = e.match(D), n = s?.[1] ?? "", d = s?.[2] ?? "";
+  const a = e.match(I), i = a?.[1] ?? "", o = a?.[2] ?? "";
   return {
-    text: n,
-    url: d,
-    title: n,
+    text: i,
+    url: o,
+    title: i,
     scalePercent: void 0,
-    fixedOutput: c
+    fixedOutput: r
   };
-}, a = new f({
-  regexp: I,
-  decoration: (t, r) => {
-    const e = R(t);
-    return p.replace({
-      widget: new M(
-        e.text || r.state.facet(i).image,
-        {
-          tag: "image",
-          url: e.url,
-          title: e.title,
-          scalePercent: e.scalePercent,
-          fixedOutput: e.fixedOutput
-        },
-        "tag-image",
-        P.Image,
-        r
-      )
-    });
-  }
-}), A = x.fromClass(
+}, g = (t) => {
+  const c = D.findDocumentVariableMarkers(
+    t.state.doc.toString()
+  ).filter((e) => e.name !== null);
+  return new w({
+    regexp: O,
+    decoration: (e, r, a) => {
+      const i = a + e[0].length;
+      if (c.some((s) => a < s.end && i > s.start))
+        return null;
+      const o = C(e);
+      return p.replace({
+        widget: new P(
+          o.text || r.state.facet(l).image,
+          {
+            tag: "image",
+            url: o.url,
+            title: o.title,
+            scalePercent: o.scalePercent,
+            fixedOutput: o.fixedOutput
+          },
+          "tag-image",
+          b.Image,
+          r
+        )
+      });
+    }
+  });
+}, A = f.fromClass(
   class {
     constructor(t) {
-      this.placeholders = a.createDeco(t);
+      this.matcher = g(t), this.placeholders = this.matcher.createDeco(t);
     }
     update(t) {
-      if (t.startState.facet(i) !== t.state.facet(i)) {
-        this.placeholders = a.createDeco(t.view);
+      if (t.docChanged && (this.matcher = g(t.view)), t.docChanged || t.startState.facet(l) !== t.state.facet(l)) {
+        this.placeholders = this.matcher.createDeco(t.view);
         return;
       }
-      this.placeholders = a.updateDeco(t, this.placeholders);
+      this.placeholders = this.matcher.updateDeco(t, this.placeholders);
     }
   },
   {
     decorations: (t) => t.placeholders,
-    provide: (t) => w.atomicRanges.of((r) => r.plugin(t)?.placeholders || p.none)
+    provide: (t) => x.atomicRanges.of((c) => c.plugin(t)?.placeholders || p.none)
   }
 );
 export {

package/dist/components/MarkdownFlowEditor/plugins/ImgPlaceholder.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"ImgPlaceholder.es.js","sources":["../../../../src/components/MarkdownFlowEditor/plugins/ImgPlaceholder.ts"],"sourcesContent":["import {\n  EditorView,\n  Decoration,\n  DecorationSet,\n  ViewPlugin,\n  ViewUpdate,\n  MatchDecorator,\n} from \"@codemirror/view\";\nimport { SelectedOption } from \"../types\";\nimport { unwrapFixedOutput } from \"../utils\";\nimport PlaceholderWidget from \"./PlaceholderWidget\";\nimport { mediaPlaceholderLabels } from \"./mediaPlaceholderLabels\";\n\nconst imageMarkupRegexp = /!\\[([^\\]]*)\\]\\(([^)]+)\\)|<img\\b[^>]*>/i;\nconst agiImgContextRegexp =\n  /===\\s*(?:!\\[[^\\]]*\\]\\([^)]+\\)|<img\\b[^>]*>)\\s*===|!\\[[^\\]]*\\]\\([^)]+\\)|<img\\b[^>]*>/gi;\n\nconst extractAttributeValue = (tag: string, attribute: string) => {\n  const regexp = new RegExp(\n    `${attribute}\\\\s*=\\\\s*(\"(.*?)\"|'(.*?)'|([^\\\\s\"'<>]+))`,\n    \"i\"\n  );\n  const match = tag.match(regexp);\n  if (!match) return undefined;\n  return match[2] ?? match[3] ?? match[4];\n};\n\nconst clampScalePercent = (value: number) =>\n  Math.max(1, Math.min(1000, Math.round(value)));\n\nconst getImageMatchInfo = (match: RegExpMatchArray) => {\n  const source = match?.[0] ?? \"\";\n  const raw = unwrapFixedOutput(source);\n  const fixedOutput = /^\\s*===/.test(source);\n  if (/^<img\\b/i.test(raw)) {\n    const src = extractAttributeValue(raw, \"src\") ?? \"\";\n    const alt =\n      extractAttributeValue(raw, \"alt\") ??\n      extractAttributeValue(raw, \"title\") ??\n      \"\";\n    const widthAttr = extractAttributeValue(raw, \"width\");\n    let scalePercent: number | undefined;\n    if (widthAttr) {\n      const numeric = Number.parseFloat(widthAttr);\n      if (Number.isFinite(numeric)) {\n        scalePercent = clampScalePercent(numeric);\n      }\n    }\n    return {\n      text: alt,\n      url: src,\n      title: alt,\n      scalePercent,\n      fixedOutput,\n    };\n  }\n  const markdownMatch = raw.match(imageMarkupRegexp);\n  const title = markdownMatch?.[1] ?? \"\";\n  const url = markdownMatch?.[2] ?? \"\";\n  return {\n    text: title,\n    url,\n    title,\n    scalePercent: undefined,\n    fixedOutput,\n  };\n};\n\nconst imageUrlMatcher = new MatchDecorator({\n  regexp: agiImgContextRegexp,\n  decoration: (match, view) => {\n    const info = getImageMatchInfo(match);\n    return Decoration.replace({\n      widget: new PlaceholderWidget(\n        info.text || view.state.facet(mediaPlaceholderLabels).image,\n        {\n          tag: \"image\",\n          url: info.url,\n          title: info.title,\n          scalePercent: info.scalePercent,\n          fixedOutput: info.fixedOutput,\n        },\n        \"tag-image\",\n        SelectedOption.Image,\n        view\n      ),\n    });\n  },\n});\n\nconst ImgPlaceholder = ViewPlugin.fromClass(\n  class {\n    placeholders: DecorationSet;\n    constructor(view: EditorView) {\n      this.placeholders = imageUrlMatcher.createDeco(view);\n    }\n    update(update: ViewUpdate) {\n      if (\n        update.startState.facet(mediaPlaceholderLabels) !==\n        update.state.facet(mediaPlaceholderLabels)\n      ) {\n        this.placeholders = imageUrlMatcher.createDeco(update.view);\n        return;\n      }\n      this.placeholders = imageUrlMatcher.updateDeco(update, this.placeholders);\n    }\n  },\n  {\n    decorations: (instance) => instance.placeholders,\n    provide: (plugin) =>\n      EditorView.atomicRanges.of((view) => {\n        return view.plugin(plugin)?.placeholders || Decoration.none;\n      }),\n  }\n);\n\nexport default ImgPlaceholder;\n"],"names":["imageMarkupRegexp","agiImgContextRegexp","extractAttributeValue","tag","attribute","regexp","match","clampScalePercent","value","getImageMatchInfo","source","raw","unwrapFixedOutput","fixedOutput","src","alt","widthAttr","scalePercent","numeric","markdownMatch","title","url","imageUrlMatcher","MatchDecorator","view","info","Decoration","PlaceholderWidget","mediaPlaceholderLabels","SelectedOption","ImgPlaceholder","ViewPlugin","update","instance","plugin","EditorView"],"mappings":";;;;;AAaA,MAAMA,IAAoB,0CACpBC,IACJ,yFAEIC,IAAwB,CAACC,GAAaC,MAAsB;AAChE,QAAMC,IAAS,IAAI;AAAA,IACjB,GAAGD,CAAS;AAAA,IACZ;AAAA,EAAA,GAEIE,IAAQH,EAAI,MAAME,CAAM;AAC9B,MAAKC;AACL,WAAOA,EAAM,CAAC,KAAKA,EAAM,CAAC,KAAKA,EAAM,CAAC;AACxC,GAEMC,IAAoB,CAACC,MACzB,KAAK,IAAI,GAAG,KAAK,IAAI,KAAM,KAAK,MAAMA,CAAK,CAAC,CAAC,GAEzCC,IAAoB,CAACH,MAA4B;AACrD,QAAMI,IAASJ,IAAQ,CAAC,KAAK,IACvBK,IAAMC,EAAkBF,CAAM,GAC9BG,IAAc,UAAU,KAAKH,CAAM;AACzC,MAAI,WAAW,KAAKC,CAAG,GAAG;AACxB,UAAMG,IAAMZ,EAAsBS,GAAK,KAAK,KAAK,IAC3CI,IACJb,EAAsBS,GAAK,KAAK,KAChCT,EAAsBS,GAAK,OAAO,KAClC,IACIK,IAAYd,EAAsBS,GAAK,OAAO;AACpD,QAAIM;AACJ,QAAID,GAAW;AACb,YAAME,IAAU,OAAO,WAAWF,CAAS;AAC3C,MAAI,OAAO,SAASE,CAAO,MACzBD,IAAeV,EAAkBW,CAAO;AAAA,IAE5C;AACA,WAAO;AAAA,MACL,MAAMH;AAAA,MACN,KAAKD;AAAA,MACL,OAAOC;AAAA,MACP,cAAAE;AAAA,MACA,aAAAJ;AAAA,IAAA;AAAA,EAEJ;AACA,QAAMM,IAAgBR,EAAI,MAAMX,CAAiB,GAC3CoB,IAAQD,IAAgB,CAAC,KAAK,IAC9BE,IAAMF,IAAgB,CAAC,KAAK;AAClC,SAAO;AAAA,IACL,MAAMC;AAAA,IACN,KAAAC;AAAA,IACA,OAAAD;AAAA,IACA,cAAc;AAAA,IACd,aAAAP;AAAA,EAAA;AAEJ,GAEMS,IAAkB,IAAIC,EAAe;AAAA,EACzC,QAAQtB;AAAA,EACR,YAAY,CAACK,GAAOkB,MAAS;AAC3B,UAAMC,IAAOhB,EAAkBH,CAAK;AACpC,WAAOoB,EAAW,QAAQ;AAAA,MACxB,QAAQ,IAAIC;AAAA,QACVF,EAAK,QAAQD,EAAK,MAAM,MAAMI,CAAsB,EAAE;AAAA,QACtD;AAAA,UACE,KAAK;AAAA,UACL,KAAKH,EAAK;AAAA,UACV,OAAOA,EAAK;AAAA,UACZ,cAAcA,EAAK;AAAA,UACnB,aAAaA,EAAK;AAAA,QAAA;AAAA,QAEpB;AAAA,QACAI,EAAe;AAAA,QACfL;AAAA,MAAA;AAAA,IACF,CACD;AAAA,EACH;AACF,CAAC,GAEKM,IAAiBC,EAAW;AAAA,EAChC,MAAM;AAAA,IAEJ,YAAYP,GAAkB;AAC5B,WAAK,eAAeF,EAAgB,WAAWE,CAAI;AAAA,IACrD;AAAA,IACA,OAAOQ,GAAoB;AACzB,UACEA,EAAO,WAAW,MAAMJ,CAAsB,MAC9CI,EAAO,MAAM,MAAMJ,CAAsB,GACzC;AACA,aAAK,eAAeN,EAAgB,WAAWU,EAAO,IAAI;AAC1D;AAAA,MACF;AACA,WAAK,eAAeV,EAAgB,WAAWU,GAAQ,KAAK,YAAY;AAAA,IAC1E;AAAA,EAAA;AAAA,EAEF;AAAA,IACE,aAAa,CAACC,MAAaA,EAAS;AAAA,IACpC,SAAS,CAACC,MACRC,EAAW,aAAa,GAAG,CAACX,MACnBA,EAAK,OAAOU,CAAM,GAAG,gBAAgBR,EAAW,IACxD;AAAA,EAAA;AAEP;"}
+{"version":3,"file":"ImgPlaceholder.es.js","sources":["../../../../src/components/MarkdownFlowEditor/plugins/ImgPlaceholder.ts"],"sourcesContent":["import {\n  EditorView,\n  Decoration,\n  DecorationSet,\n  ViewPlugin,\n  ViewUpdate,\n  MatchDecorator,\n} from \"@codemirror/view\";\nimport { SelectedOption } from \"../types\";\nimport { findDocumentVariableMarkers, unwrapFixedOutput } from \"../utils\";\nimport PlaceholderWidget from \"./PlaceholderWidget\";\nimport { mediaPlaceholderLabels } from \"./mediaPlaceholderLabels\";\n\nconst imageMarkupRegexp = /!\\[([^\\]]*)\\]\\(([^)]+)\\)|<img\\b[^>]*>/i;\nconst agiImgContextRegexp =\n  /===\\s*(?:!\\[[^\\]]*\\]\\([^)]+\\)|<img\\b[^>]*>)\\s*===|!\\[[^\\]]*\\]\\([^)]+\\)|<img\\b[^>]*>/gi;\n\nconst extractAttributeValue = (tag: string, attribute: string) => {\n  const regexp = new RegExp(\n    `${attribute}\\\\s*=\\\\s*(\"(.*?)\"|'(.*?)'|([^\\\\s\"'<>]+))`,\n    \"i\"\n  );\n  const match = tag.match(regexp);\n  if (!match) return undefined;\n  return match[2] ?? match[3] ?? match[4];\n};\n\nconst clampScalePercent = (value: number) =>\n  Math.max(1, Math.min(1000, Math.round(value)));\n\nconst getImageMatchInfo = (match: RegExpMatchArray) => {\n  const source = match?.[0] ?? \"\";\n  const raw = unwrapFixedOutput(source);\n  const fixedOutput = /^\\s*===/.test(source);\n  if (/^<img\\b/i.test(raw)) {\n    const src = extractAttributeValue(raw, \"src\") ?? \"\";\n    const alt =\n      extractAttributeValue(raw, \"alt\") ??\n      extractAttributeValue(raw, \"title\") ??\n      \"\";\n    const widthAttr = extractAttributeValue(raw, \"width\");\n    let scalePercent: number | undefined;\n    if (widthAttr) {\n      const numeric = Number.parseFloat(widthAttr);\n      if (Number.isFinite(numeric)) {\n        scalePercent = clampScalePercent(numeric);\n      }\n    }\n    return {\n      text: alt,\n      url: src,\n      title: alt,\n      scalePercent,\n      fixedOutput,\n    };\n  }\n  const markdownMatch = raw.match(imageMarkupRegexp);\n  const title = markdownMatch?.[1] ?? \"\";\n  const url = markdownMatch?.[2] ?? \"\";\n  return {\n    text: title,\n    url,\n    title,\n    scalePercent: undefined,\n    fixedOutput,\n  };\n};\n\nconst createImageUrlMatcher = (view: EditorView) => {\n  const variables = findDocumentVariableMarkers(\n    view.state.doc.toString()\n  ).filter((marker) => marker.name !== null);\n  return new MatchDecorator({\n    regexp: agiImgContextRegexp,\n    decoration: (match, view, from) => {\n      const to = from + match[0].length;\n      if (variables.some((marker) => from < marker.end && to > marker.start)) {\n        return null;\n      }\n      const info = getImageMatchInfo(match);\n      return Decoration.replace({\n        widget: new PlaceholderWidget(\n          info.text || view.state.facet(mediaPlaceholderLabels).image,\n          {\n            tag: \"image\",\n            url: info.url,\n            title: info.title,\n            scalePercent: info.scalePercent,\n            fixedOutput: info.fixedOutput,\n          },\n          \"tag-image\",\n          SelectedOption.Image,\n          view\n        ),\n      });\n    },\n  });\n};\n\nconst ImgPlaceholder = ViewPlugin.fromClass(\n  class {\n    placeholders: DecorationSet;\n    matcher: MatchDecorator;\n    constructor(view: EditorView) {\n      this.matcher = createImageUrlMatcher(view);\n      this.placeholders = this.matcher.createDeco(view);\n    }\n    update(update: ViewUpdate) {\n      if (update.docChanged) {\n        this.matcher = createImageUrlMatcher(update.view);\n      }\n      if (\n        update.docChanged ||\n        update.startState.facet(mediaPlaceholderLabels) !==\n          update.state.facet(mediaPlaceholderLabels)\n      ) {\n        this.placeholders = this.matcher.createDeco(update.view);\n        return;\n      }\n      this.placeholders = this.matcher.updateDeco(update, this.placeholders);\n    }\n  },\n  {\n    decorations: (instance) => instance.placeholders,\n    provide: (plugin) =>\n      EditorView.atomicRanges.of((view) => {\n        return view.plugin(plugin)?.placeholders || Decoration.none;\n      }),\n  }\n);\n\nexport default ImgPlaceholder;\n"],"names":["imageMarkupRegexp","agiImgContextRegexp","extractAttributeValue","tag","attribute","regexp","match","clampScalePercent","value","getImageMatchInfo","source","raw","unwrapFixedOutput","fixedOutput","src","alt","widthAttr","scalePercent","numeric","markdownMatch","title","url","createImageUrlMatcher","view","variables","findDocumentVariableMarkers","marker","MatchDecorator","from","to","info","Decoration","PlaceholderWidget","mediaPlaceholderLabels","SelectedOption","ImgPlaceholder","ViewPlugin","update","instance","plugin","EditorView"],"mappings":";;;;;;AAaA,MAAMA,IAAoB,0CACpBC,IACJ,yFAEIC,IAAwB,CAACC,GAAaC,MAAsB;AAChE,QAAMC,IAAS,IAAI;AAAA,IACjB,GAAGD,CAAS;AAAA,IACZ;AAAA,EAAA,GAEIE,IAAQH,EAAI,MAAME,CAAM;AAC9B,MAAKC;AACL,WAAOA,EAAM,CAAC,KAAKA,EAAM,CAAC,KAAKA,EAAM,CAAC;AACxC,GAEMC,IAAoB,CAACC,MACzB,KAAK,IAAI,GAAG,KAAK,IAAI,KAAM,KAAK,MAAMA,CAAK,CAAC,CAAC,GAEzCC,IAAoB,CAACH,MAA4B;AACrD,QAAMI,IAASJ,IAAQ,CAAC,KAAK,IACvBK,IAAMC,EAAkBF,CAAM,GAC9BG,IAAc,UAAU,KAAKH,CAAM;AACzC,MAAI,WAAW,KAAKC,CAAG,GAAG;AACxB,UAAMG,IAAMZ,EAAsBS,GAAK,KAAK,KAAK,IAC3CI,IACJb,EAAsBS,GAAK,KAAK,KAChCT,EAAsBS,GAAK,OAAO,KAClC,IACIK,IAAYd,EAAsBS,GAAK,OAAO;AACpD,QAAIM;AACJ,QAAID,GAAW;AACb,YAAME,IAAU,OAAO,WAAWF,CAAS;AAC3C,MAAI,OAAO,SAASE,CAAO,MACzBD,IAAeV,EAAkBW,CAAO;AAAA,IAE5C;AACA,WAAO;AAAA,MACL,MAAMH;AAAA,MACN,KAAKD;AAAA,MACL,OAAOC;AAAA,MACP,cAAAE;AAAA,MACA,aAAAJ;AAAA,IAAA;AAAA,EAEJ;AACA,QAAMM,IAAgBR,EAAI,MAAMX,CAAiB,GAC3CoB,IAAQD,IAAgB,CAAC,KAAK,IAC9BE,IAAMF,IAAgB,CAAC,KAAK;AAClC,SAAO;AAAA,IACL,MAAMC;AAAA,IACN,KAAAC;AAAA,IACA,OAAAD;AAAA,IACA,cAAc;AAAA,IACd,aAAAP;AAAA,EAAA;AAEJ,GAEMS,IAAwB,CAACC,MAAqB;AAClD,QAAMC,IAAYC,EAAAA;AAAAA,IAChBF,EAAK,MAAM,IAAI,SAAA;AAAA,EAAS,EACxB,OAAO,CAACG,MAAWA,EAAO,SAAS,IAAI;AACzC,SAAO,IAAIC,EAAe;AAAA,IACxB,QAAQ1B;AAAA,IACR,YAAY,CAACK,GAAOiB,GAAMK,MAAS;AACjC,YAAMC,IAAKD,IAAOtB,EAAM,CAAC,EAAE;AAC3B,UAAIkB,EAAU,KAAK,CAACE,MAAWE,IAAOF,EAAO,OAAOG,IAAKH,EAAO,KAAK;AACnE,eAAO;AAET,YAAMI,IAAOrB,EAAkBH,CAAK;AACpC,aAAOyB,EAAW,QAAQ;AAAA,QACxB,QAAQ,IAAIC;AAAA,UACVF,EAAK,QAAQP,EAAK,MAAM,MAAMU,CAAsB,EAAE;AAAA,UACtD;AAAA,YACE,KAAK;AAAA,YACL,KAAKH,EAAK;AAAA,YACV,OAAOA,EAAK;AAAA,YACZ,cAAcA,EAAK;AAAA,YACnB,aAAaA,EAAK;AAAA,UAAA;AAAA,UAEpB;AAAA,UACAI,EAAe;AAAA,UACfX;AAAAA,QAAA;AAAA,MACF,CACD;AAAA,IACH;AAAA,EAAA,CACD;AACH,GAEMY,IAAiBC,EAAW;AAAA,EAChC,MAAM;AAAA,IAGJ,YAAYb,GAAkB;AAC5B,WAAK,UAAUD,EAAsBC,CAAI,GACzC,KAAK,eAAe,KAAK,QAAQ,WAAWA,CAAI;AAAA,IAClD;AAAA,IACA,OAAOc,GAAoB;AAIzB,UAHIA,EAAO,eACT,KAAK,UAAUf,EAAsBe,EAAO,IAAI,IAGhDA,EAAO,cACPA,EAAO,WAAW,MAAMJ,CAAsB,MAC5CI,EAAO,MAAM,MAAMJ,CAAsB,GAC3C;AACA,aAAK,eAAe,KAAK,QAAQ,WAAWI,EAAO,IAAI;AACvD;AAAA,MACF;AACA,WAAK,eAAe,KAAK,QAAQ,WAAWA,GAAQ,KAAK,YAAY;AAAA,IACvE;AAAA,EAAA;AAAA,EAEF;AAAA,IACE,aAAa,CAACC,MAAaA,EAAS;AAAA,IACpC,SAAS,CAACC,MACRC,EAAW,aAAa,GAAG,CAACjB,MACnBA,EAAK,OAAOgB,CAAM,GAAG,gBAAgBR,EAAW,IACxD;AAAA,EAAA;AAEP;"}

package/dist/components/MarkdownFlowEditor/plugins/PlaceholderWidget.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"PlaceholderWidget.cjs","sources":["../../../../src/components/MarkdownFlowEditor/plugins/PlaceholderWidget.ts"],"sourcesContent":["import { EditorView, Decoration, WidgetType } from \"@codemirror/view\";\nimport { SelectedOption } from \"../types\";\n\nconst SVG_NS = \"http://www.w3.org/2000/svg\";\n\nconst createSvgElement = (tag: string) => document.createElementNS(SVG_NS, tag);\n// TODO: if use renderToStaticMarkup & createElement, it will cause react & react-dom version mismatch\n// so we use lucide-react to build the icon\n// lucide-react image icon\nconst buildImageIcon = () => {\n  const svg = createSvgElement(\"svg\");\n  svg.setAttribute(\"viewBox\", \"0 0 24 24\");\n  svg.setAttribute(\"width\", \"14\");\n  svg.setAttribute(\"height\", \"14\");\n  svg.setAttribute(\"fill\", \"none\");\n  svg.setAttribute(\"stroke\", \"currentColor\");\n  svg.setAttribute(\"stroke-width\", \"1.5\");\n  svg.setAttribute(\"stroke-linecap\", \"round\");\n  svg.setAttribute(\"stroke-linejoin\", \"round\");\n\n  const rect = createSvgElement(\"rect\");\n  rect.setAttribute(\"width\", \"18\");\n  rect.setAttribute(\"height\", \"18\");\n  rect.setAttribute(\"x\", \"3\");\n  rect.setAttribute(\"y\", \"3\");\n  rect.setAttribute(\"rx\", \"2\");\n  rect.setAttribute(\"ry\", \"2\");\n\n  const circle = createSvgElement(\"circle\");\n  circle.setAttribute(\"cx\", \"9\");\n  circle.setAttribute(\"cy\", \"9\");\n  circle.setAttribute(\"r\", \"2\");\n\n  const path = createSvgElement(\"path\");\n  path.setAttribute(\"d\", \"m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21\");\n\n  svg.append(rect, circle, path);\n  return svg;\n};\n\n// lucide-react image icon\nconst buildVideoIcon = () => {\n  const svg = createSvgElement(\"svg\");\n  svg.setAttribute(\"viewBox\", \"0 0 24 24\");\n  svg.setAttribute(\"width\", \"14\");\n  svg.setAttribute(\"height\", \"14\");\n  svg.setAttribute(\"fill\", \"none\");\n  svg.setAttribute(\"stroke\", \"currentColor\");\n  svg.setAttribute(\"stroke-width\", \"1.5\");\n  svg.setAttribute(\"stroke-linecap\", \"round\");\n  svg.setAttribute(\"stroke-linejoin\", \"round\");\n\n  const rect = createSvgElement(\"rect\");\n  rect.setAttribute(\"width\", \"18\");\n  rect.setAttribute(\"height\", \"18\");\n  rect.setAttribute(\"x\", \"3\");\n  rect.setAttribute(\"y\", \"3\");\n  rect.setAttribute(\"rx\", \"2\");\n\n  const path = createSvgElement(\"path\");\n  path.setAttribute(\"d\", \"m9 8 6 4-6 4Z\");\n\n  svg.append(rect, path);\n  return svg;\n};\n\nclass PlaceholderWidget extends WidgetType {\n  constructor(\n    private text: string,\n    private dataset: {\n      tag: \"image\" | \"video\" | \"variable\";\n      title?: string;\n      url?: string;\n      scalePercent?: number;\n      fixedOutput?: boolean;\n    },\n    private styleClass: string,\n    private type: SelectedOption,\n    private view: EditorView\n  ) {\n    super();\n  }\n\n  getPosition() {\n    let from = -1;\n    let to = -1;\n    const decorations = this.view.state.facet(EditorView.decorations);\n    for (const deco of decorations) {\n      const decoSet = typeof deco === \"function\" ? deco(this.view) : deco;\n      decoSet.between(\n        0,\n        this.view.state.doc.length,\n        (start: number, end: number, decoration: Decoration) => {\n          if (decoration.spec.widget === this) {\n            from = start;\n            to = end;\n            return false;\n          }\n        }\n      );\n      if (from !== -1) break;\n    }\n    if (from !== -1 && to !== -1) {\n      return [from, to];\n    }\n  }\n\n  toDOM() {\n    const container = document.createElement(\"span\");\n    container.className = this.styleClass;\n    const content = document.createElement(\"span\");\n    content.className = \"tag-placeholder-content\";\n    const span = document.createElement(\"span\");\n    span.className = \"tag-placeholder-label\";\n    span.textContent = this.text;\n    span.dataset[\"tag\"] = this.dataset.tag || \"\";\n    span.dataset[\"url\"] = this.dataset.url || \"\";\n    span.dataset[\"title\"] = this.dataset.title || \"\";\n    // const icon = document.createElement(\"span\");\n    // icon.className = \"tag-icon\";\n    // icon.innerHTML = \"✕\";\n    // icon.addEventListener(\"click\", (e) => {\n    //   e.stopPropagation();\n    //   const [from, to] = this.getPosition() ?? [-1, -1];\n    //   if (from !== -1 && to !== -1) {\n    //     this.view.dispatch({\n    //       changes: { from, to, insert: \"\" },\n    //     });\n    //   }\n    // });\n    content.addEventListener(\"click\", (e) => {\n      const [from, to] = this.getPosition() ?? [-1, -1];\n      const event = new CustomEvent(\"globalTagClick\", {\n        detail: {\n          view: this.view,\n          type: this.type,\n          dataset: this.dataset,\n          content: span.textContent,\n          from,\n          to,\n          target: e.currentTarget,\n        },\n      });\n      window.dispatchEvent(event);\n    });\n\n    if (this.dataset.fixedOutput) {\n      const prefix = document.createElement(\"span\");\n      prefix.className = \"tag-fixed-output-marker\";\n      prefix.textContent = \"===\";\n      container.appendChild(prefix);\n    }\n\n    if (this.dataset.tag === \"image\" || this.dataset.tag === \"video\") {\n      const iconWrapper = document.createElement(\"span\");\n      iconWrapper.className = \"tag-placeholder-icon\";\n\n      const icon =\n        this.dataset.tag === \"image\" ? buildImageIcon() : buildVideoIcon();\n      iconWrapper.appendChild(icon);\n      content.appendChild(iconWrapper);\n    }\n    content.appendChild(span);\n    container.appendChild(content);\n\n    if (this.dataset.fixedOutput) {\n      const suffix = document.createElement(\"span\");\n      suffix.className = \"tag-fixed-output-marker\";\n      suffix.textContent = \"===\";\n      container.appendChild(suffix);\n    }\n\n    // container.appendChild(icon);\n    return container;\n  }\n\n  ignoreEvent() {\n    return false;\n  }\n}\n\nexport default PlaceholderWidget;\n"],"names":["SVG_NS","createSvgElement","tag","buildImageIcon","svg","rect","circle","path","buildVideoIcon","PlaceholderWidget","WidgetType","text","dataset","styleClass","type","view","from","to","decorations","EditorView","deco","start","end","decoration","container","content","span","e","event","prefix","iconWrapper","icon","suffix"],"mappings":"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"}
+{"version":3,"file":"PlaceholderWidget.cjs","sources":["../../../../src/components/MarkdownFlowEditor/plugins/PlaceholderWidget.ts"],"sourcesContent":["import { EditorView, Decoration, WidgetType } from \"@codemirror/view\";\nimport { SelectedOption } from \"../types\";\n\nconst SVG_NS = \"http://www.w3.org/2000/svg\";\n\nconst createSvgElement = (tag: string) => document.createElementNS(SVG_NS, tag);\n// TODO: if use renderToStaticMarkup & createElement, it will cause react & react-dom version mismatch\n// so we use lucide-react to build the icon\n// lucide-react image icon\nconst buildImageIcon = () => {\n  const svg = createSvgElement(\"svg\");\n  svg.setAttribute(\"viewBox\", \"0 0 24 24\");\n  svg.setAttribute(\"width\", \"14\");\n  svg.setAttribute(\"height\", \"14\");\n  svg.setAttribute(\"fill\", \"none\");\n  svg.setAttribute(\"stroke\", \"currentColor\");\n  svg.setAttribute(\"stroke-width\", \"1.5\");\n  svg.setAttribute(\"stroke-linecap\", \"round\");\n  svg.setAttribute(\"stroke-linejoin\", \"round\");\n\n  const rect = createSvgElement(\"rect\");\n  rect.setAttribute(\"width\", \"18\");\n  rect.setAttribute(\"height\", \"18\");\n  rect.setAttribute(\"x\", \"3\");\n  rect.setAttribute(\"y\", \"3\");\n  rect.setAttribute(\"rx\", \"2\");\n  rect.setAttribute(\"ry\", \"2\");\n\n  const circle = createSvgElement(\"circle\");\n  circle.setAttribute(\"cx\", \"9\");\n  circle.setAttribute(\"cy\", \"9\");\n  circle.setAttribute(\"r\", \"2\");\n\n  const path = createSvgElement(\"path\");\n  path.setAttribute(\"d\", \"m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21\");\n\n  svg.append(rect, circle, path);\n  return svg;\n};\n\n// lucide-react image icon\nconst buildVideoIcon = () => {\n  const svg = createSvgElement(\"svg\");\n  svg.setAttribute(\"viewBox\", \"0 0 24 24\");\n  svg.setAttribute(\"width\", \"14\");\n  svg.setAttribute(\"height\", \"14\");\n  svg.setAttribute(\"fill\", \"none\");\n  svg.setAttribute(\"stroke\", \"currentColor\");\n  svg.setAttribute(\"stroke-width\", \"1.5\");\n  svg.setAttribute(\"stroke-linecap\", \"round\");\n  svg.setAttribute(\"stroke-linejoin\", \"round\");\n\n  const rect = createSvgElement(\"rect\");\n  rect.setAttribute(\"width\", \"18\");\n  rect.setAttribute(\"height\", \"18\");\n  rect.setAttribute(\"x\", \"3\");\n  rect.setAttribute(\"y\", \"3\");\n  rect.setAttribute(\"rx\", \"2\");\n\n  const path = createSvgElement(\"path\");\n  path.setAttribute(\"d\", \"m9 8 6 4-6 4Z\");\n\n  svg.append(rect, path);\n  return svg;\n};\n\nclass PlaceholderWidget extends WidgetType {\n  constructor(\n    private text: string,\n    private dataset: {\n      tag: \"image\" | \"video\";\n      title?: string;\n      url?: string;\n      scalePercent?: number;\n      fixedOutput?: boolean;\n    },\n    private styleClass: string,\n    private type: SelectedOption,\n    private view: EditorView\n  ) {\n    super();\n  }\n\n  getPosition() {\n    let from = -1;\n    let to = -1;\n    const decorations = this.view.state.facet(EditorView.decorations);\n    for (const deco of decorations) {\n      const decoSet = typeof deco === \"function\" ? deco(this.view) : deco;\n      decoSet.between(\n        0,\n        this.view.state.doc.length,\n        (start: number, end: number, decoration: Decoration) => {\n          if (decoration.spec.widget === this) {\n            from = start;\n            to = end;\n            return false;\n          }\n        }\n      );\n      if (from !== -1) break;\n    }\n    if (from !== -1 && to !== -1) {\n      return [from, to];\n    }\n  }\n\n  toDOM() {\n    const container = document.createElement(\"span\");\n    container.className = this.styleClass;\n    const content = document.createElement(\"span\");\n    content.className = \"tag-placeholder-content\";\n    const span = document.createElement(\"span\");\n    span.className = \"tag-placeholder-label\";\n    span.textContent = this.text;\n    span.dataset[\"tag\"] = this.dataset.tag || \"\";\n    span.dataset[\"url\"] = this.dataset.url || \"\";\n    span.dataset[\"title\"] = this.dataset.title || \"\";\n    // const icon = document.createElement(\"span\");\n    // icon.className = \"tag-icon\";\n    // icon.innerHTML = \"✕\";\n    // icon.addEventListener(\"click\", (e) => {\n    //   e.stopPropagation();\n    //   const [from, to] = this.getPosition() ?? [-1, -1];\n    //   if (from !== -1 && to !== -1) {\n    //     this.view.dispatch({\n    //       changes: { from, to, insert: \"\" },\n    //     });\n    //   }\n    // });\n    content.addEventListener(\"click\", (e) => {\n      const [from, to] = this.getPosition() ?? [-1, -1];\n      const event = new CustomEvent(\"globalTagClick\", {\n        detail: {\n          view: this.view,\n          type: this.type,\n          dataset: this.dataset,\n          content: span.textContent,\n          from,\n          to,\n          target: e.currentTarget,\n        },\n      });\n      window.dispatchEvent(event);\n    });\n\n    if (this.dataset.fixedOutput) {\n      const prefix = document.createElement(\"span\");\n      prefix.className = \"tag-fixed-output-marker\";\n      prefix.textContent = \"===\";\n      container.appendChild(prefix);\n    }\n\n    if (this.dataset.tag === \"image\" || this.dataset.tag === \"video\") {\n      const iconWrapper = document.createElement(\"span\");\n      iconWrapper.className = \"tag-placeholder-icon\";\n\n      const icon =\n        this.dataset.tag === \"image\" ? buildImageIcon() : buildVideoIcon();\n      iconWrapper.appendChild(icon);\n      content.appendChild(iconWrapper);\n    }\n    content.appendChild(span);\n    container.appendChild(content);\n\n    if (this.dataset.fixedOutput) {\n      const suffix = document.createElement(\"span\");\n      suffix.className = \"tag-fixed-output-marker\";\n      suffix.textContent = \"===\";\n      container.appendChild(suffix);\n    }\n\n    // container.appendChild(icon);\n    return container;\n  }\n\n  ignoreEvent() {\n    return false;\n  }\n}\n\nexport default PlaceholderWidget;\n"],"names":["SVG_NS","createSvgElement","tag","buildImageIcon","svg","rect","circle","path","buildVideoIcon","PlaceholderWidget","WidgetType","text","dataset","styleClass","type","view","from","to","decorations","EditorView","deco","start","end","decoration","container","content","span","e","event","prefix","iconWrapper","icon","suffix"],"mappings":"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"}

package/dist/components/MarkdownFlowEditor/plugins/PlaceholderWidget.d.ts

@@ -7,7 +7,7 @@ declare class PlaceholderWidget extends WidgetType {
     private type;
     private view;
     constructor(text: string, dataset: {
-        tag: "image" | "video" | "variable";
+        tag: "image" | "video";
         title?: string;
         url?: string;
         scalePercent?: number;

package/dist/components/MarkdownFlowEditor/plugins/PlaceholderWidget.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"PlaceholderWidget.es.js","sources":["../../../../src/components/MarkdownFlowEditor/plugins/PlaceholderWidget.ts"],"sourcesContent":["import { EditorView, Decoration, WidgetType } from \"@codemirror/view\";\nimport { SelectedOption } from \"../types\";\n\nconst SVG_NS = \"http://www.w3.org/2000/svg\";\n\nconst createSvgElement = (tag: string) => document.createElementNS(SVG_NS, tag);\n// TODO: if use renderToStaticMarkup & createElement, it will cause react & react-dom version mismatch\n// so we use lucide-react to build the icon\n// lucide-react image icon\nconst buildImageIcon = () => {\n  const svg = createSvgElement(\"svg\");\n  svg.setAttribute(\"viewBox\", \"0 0 24 24\");\n  svg.setAttribute(\"width\", \"14\");\n  svg.setAttribute(\"height\", \"14\");\n  svg.setAttribute(\"fill\", \"none\");\n  svg.setAttribute(\"stroke\", \"currentColor\");\n  svg.setAttribute(\"stroke-width\", \"1.5\");\n  svg.setAttribute(\"stroke-linecap\", \"round\");\n  svg.setAttribute(\"stroke-linejoin\", \"round\");\n\n  const rect = createSvgElement(\"rect\");\n  rect.setAttribute(\"width\", \"18\");\n  rect.setAttribute(\"height\", \"18\");\n  rect.setAttribute(\"x\", \"3\");\n  rect.setAttribute(\"y\", \"3\");\n  rect.setAttribute(\"rx\", \"2\");\n  rect.setAttribute(\"ry\", \"2\");\n\n  const circle = createSvgElement(\"circle\");\n  circle.setAttribute(\"cx\", \"9\");\n  circle.setAttribute(\"cy\", \"9\");\n  circle.setAttribute(\"r\", \"2\");\n\n  const path = createSvgElement(\"path\");\n  path.setAttribute(\"d\", \"m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21\");\n\n  svg.append(rect, circle, path);\n  return svg;\n};\n\n// lucide-react image icon\nconst buildVideoIcon = () => {\n  const svg = createSvgElement(\"svg\");\n  svg.setAttribute(\"viewBox\", \"0 0 24 24\");\n  svg.setAttribute(\"width\", \"14\");\n  svg.setAttribute(\"height\", \"14\");\n  svg.setAttribute(\"fill\", \"none\");\n  svg.setAttribute(\"stroke\", \"currentColor\");\n  svg.setAttribute(\"stroke-width\", \"1.5\");\n  svg.setAttribute(\"stroke-linecap\", \"round\");\n  svg.setAttribute(\"stroke-linejoin\", \"round\");\n\n  const rect = createSvgElement(\"rect\");\n  rect.setAttribute(\"width\", \"18\");\n  rect.setAttribute(\"height\", \"18\");\n  rect.setAttribute(\"x\", \"3\");\n  rect.setAttribute(\"y\", \"3\");\n  rect.setAttribute(\"rx\", \"2\");\n\n  const path = createSvgElement(\"path\");\n  path.setAttribute(\"d\", \"m9 8 6 4-6 4Z\");\n\n  svg.append(rect, path);\n  return svg;\n};\n\nclass PlaceholderWidget extends WidgetType {\n  constructor(\n    private text: string,\n    private dataset: {\n      tag: \"image\" | \"video\" | \"variable\";\n      title?: string;\n      url?: string;\n      scalePercent?: number;\n      fixedOutput?: boolean;\n    },\n    private styleClass: string,\n    private type: SelectedOption,\n    private view: EditorView\n  ) {\n    super();\n  }\n\n  getPosition() {\n    let from = -1;\n    let to = -1;\n    const decorations = this.view.state.facet(EditorView.decorations);\n    for (const deco of decorations) {\n      const decoSet = typeof deco === \"function\" ? deco(this.view) : deco;\n      decoSet.between(\n        0,\n        this.view.state.doc.length,\n        (start: number, end: number, decoration: Decoration) => {\n          if (decoration.spec.widget === this) {\n            from = start;\n            to = end;\n            return false;\n          }\n        }\n      );\n      if (from !== -1) break;\n    }\n    if (from !== -1 && to !== -1) {\n      return [from, to];\n    }\n  }\n\n  toDOM() {\n    const container = document.createElement(\"span\");\n    container.className = this.styleClass;\n    const content = document.createElement(\"span\");\n    content.className = \"tag-placeholder-content\";\n    const span = document.createElement(\"span\");\n    span.className = \"tag-placeholder-label\";\n    span.textContent = this.text;\n    span.dataset[\"tag\"] = this.dataset.tag || \"\";\n    span.dataset[\"url\"] = this.dataset.url || \"\";\n    span.dataset[\"title\"] = this.dataset.title || \"\";\n    // const icon = document.createElement(\"span\");\n    // icon.className = \"tag-icon\";\n    // icon.innerHTML = \"✕\";\n    // icon.addEventListener(\"click\", (e) => {\n    //   e.stopPropagation();\n    //   const [from, to] = this.getPosition() ?? [-1, -1];\n    //   if (from !== -1 && to !== -1) {\n    //     this.view.dispatch({\n    //       changes: { from, to, insert: \"\" },\n    //     });\n    //   }\n    // });\n    content.addEventListener(\"click\", (e) => {\n      const [from, to] = this.getPosition() ?? [-1, -1];\n      const event = new CustomEvent(\"globalTagClick\", {\n        detail: {\n          view: this.view,\n          type: this.type,\n          dataset: this.dataset,\n          content: span.textContent,\n          from,\n          to,\n          target: e.currentTarget,\n        },\n      });\n      window.dispatchEvent(event);\n    });\n\n    if (this.dataset.fixedOutput) {\n      const prefix = document.createElement(\"span\");\n      prefix.className = \"tag-fixed-output-marker\";\n      prefix.textContent = \"===\";\n      container.appendChild(prefix);\n    }\n\n    if (this.dataset.tag === \"image\" || this.dataset.tag === \"video\") {\n      const iconWrapper = document.createElement(\"span\");\n      iconWrapper.className = \"tag-placeholder-icon\";\n\n      const icon =\n        this.dataset.tag === \"image\" ? buildImageIcon() : buildVideoIcon();\n      iconWrapper.appendChild(icon);\n      content.appendChild(iconWrapper);\n    }\n    content.appendChild(span);\n    container.appendChild(content);\n\n    if (this.dataset.fixedOutput) {\n      const suffix = document.createElement(\"span\");\n      suffix.className = \"tag-fixed-output-marker\";\n      suffix.textContent = \"===\";\n      container.appendChild(suffix);\n    }\n\n    // container.appendChild(icon);\n    return container;\n  }\n\n  ignoreEvent() {\n    return false;\n  }\n}\n\nexport default PlaceholderWidget;\n"],"names":["SVG_NS","createSvgElement","tag","buildImageIcon","svg","rect","circle","path","buildVideoIcon","PlaceholderWidget","WidgetType","text","dataset","styleClass","type","view","from","to","decorations","EditorView","deco","start","end","decoration","container","content","span","e","event","prefix","iconWrapper","icon","suffix"],"mappings":"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"}
+{"version":3,"file":"PlaceholderWidget.es.js","sources":["../../../../src/components/MarkdownFlowEditor/plugins/PlaceholderWidget.ts"],"sourcesContent":["import { EditorView, Decoration, WidgetType } from \"@codemirror/view\";\nimport { SelectedOption } from \"../types\";\n\nconst SVG_NS = \"http://www.w3.org/2000/svg\";\n\nconst createSvgElement = (tag: string) => document.createElementNS(SVG_NS, tag);\n// TODO: if use renderToStaticMarkup & createElement, it will cause react & react-dom version mismatch\n// so we use lucide-react to build the icon\n// lucide-react image icon\nconst buildImageIcon = () => {\n  const svg = createSvgElement(\"svg\");\n  svg.setAttribute(\"viewBox\", \"0 0 24 24\");\n  svg.setAttribute(\"width\", \"14\");\n  svg.setAttribute(\"height\", \"14\");\n  svg.setAttribute(\"fill\", \"none\");\n  svg.setAttribute(\"stroke\", \"currentColor\");\n  svg.setAttribute(\"stroke-width\", \"1.5\");\n  svg.setAttribute(\"stroke-linecap\", \"round\");\n  svg.setAttribute(\"stroke-linejoin\", \"round\");\n\n  const rect = createSvgElement(\"rect\");\n  rect.setAttribute(\"width\", \"18\");\n  rect.setAttribute(\"height\", \"18\");\n  rect.setAttribute(\"x\", \"3\");\n  rect.setAttribute(\"y\", \"3\");\n  rect.setAttribute(\"rx\", \"2\");\n  rect.setAttribute(\"ry\", \"2\");\n\n  const circle = createSvgElement(\"circle\");\n  circle.setAttribute(\"cx\", \"9\");\n  circle.setAttribute(\"cy\", \"9\");\n  circle.setAttribute(\"r\", \"2\");\n\n  const path = createSvgElement(\"path\");\n  path.setAttribute(\"d\", \"m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21\");\n\n  svg.append(rect, circle, path);\n  return svg;\n};\n\n// lucide-react image icon\nconst buildVideoIcon = () => {\n  const svg = createSvgElement(\"svg\");\n  svg.setAttribute(\"viewBox\", \"0 0 24 24\");\n  svg.setAttribute(\"width\", \"14\");\n  svg.setAttribute(\"height\", \"14\");\n  svg.setAttribute(\"fill\", \"none\");\n  svg.setAttribute(\"stroke\", \"currentColor\");\n  svg.setAttribute(\"stroke-width\", \"1.5\");\n  svg.setAttribute(\"stroke-linecap\", \"round\");\n  svg.setAttribute(\"stroke-linejoin\", \"round\");\n\n  const rect = createSvgElement(\"rect\");\n  rect.setAttribute(\"width\", \"18\");\n  rect.setAttribute(\"height\", \"18\");\n  rect.setAttribute(\"x\", \"3\");\n  rect.setAttribute(\"y\", \"3\");\n  rect.setAttribute(\"rx\", \"2\");\n\n  const path = createSvgElement(\"path\");\n  path.setAttribute(\"d\", \"m9 8 6 4-6 4Z\");\n\n  svg.append(rect, path);\n  return svg;\n};\n\nclass PlaceholderWidget extends WidgetType {\n  constructor(\n    private text: string,\n    private dataset: {\n      tag: \"image\" | \"video\";\n      title?: string;\n      url?: string;\n      scalePercent?: number;\n      fixedOutput?: boolean;\n    },\n    private styleClass: string,\n    private type: SelectedOption,\n    private view: EditorView\n  ) {\n    super();\n  }\n\n  getPosition() {\n    let from = -1;\n    let to = -1;\n    const decorations = this.view.state.facet(EditorView.decorations);\n    for (const deco of decorations) {\n      const decoSet = typeof deco === \"function\" ? deco(this.view) : deco;\n      decoSet.between(\n        0,\n        this.view.state.doc.length,\n        (start: number, end: number, decoration: Decoration) => {\n          if (decoration.spec.widget === this) {\n            from = start;\n            to = end;\n            return false;\n          }\n        }\n      );\n      if (from !== -1) break;\n    }\n    if (from !== -1 && to !== -1) {\n      return [from, to];\n    }\n  }\n\n  toDOM() {\n    const container = document.createElement(\"span\");\n    container.className = this.styleClass;\n    const content = document.createElement(\"span\");\n    content.className = \"tag-placeholder-content\";\n    const span = document.createElement(\"span\");\n    span.className = \"tag-placeholder-label\";\n    span.textContent = this.text;\n    span.dataset[\"tag\"] = this.dataset.tag || \"\";\n    span.dataset[\"url\"] = this.dataset.url || \"\";\n    span.dataset[\"title\"] = this.dataset.title || \"\";\n    // const icon = document.createElement(\"span\");\n    // icon.className = \"tag-icon\";\n    // icon.innerHTML = \"✕\";\n    // icon.addEventListener(\"click\", (e) => {\n    //   e.stopPropagation();\n    //   const [from, to] = this.getPosition() ?? [-1, -1];\n    //   if (from !== -1 && to !== -1) {\n    //     this.view.dispatch({\n    //       changes: { from, to, insert: \"\" },\n    //     });\n    //   }\n    // });\n    content.addEventListener(\"click\", (e) => {\n      const [from, to] = this.getPosition() ?? [-1, -1];\n      const event = new CustomEvent(\"globalTagClick\", {\n        detail: {\n          view: this.view,\n          type: this.type,\n          dataset: this.dataset,\n          content: span.textContent,\n          from,\n          to,\n          target: e.currentTarget,\n        },\n      });\n      window.dispatchEvent(event);\n    });\n\n    if (this.dataset.fixedOutput) {\n      const prefix = document.createElement(\"span\");\n      prefix.className = \"tag-fixed-output-marker\";\n      prefix.textContent = \"===\";\n      container.appendChild(prefix);\n    }\n\n    if (this.dataset.tag === \"image\" || this.dataset.tag === \"video\") {\n      const iconWrapper = document.createElement(\"span\");\n      iconWrapper.className = \"tag-placeholder-icon\";\n\n      const icon =\n        this.dataset.tag === \"image\" ? buildImageIcon() : buildVideoIcon();\n      iconWrapper.appendChild(icon);\n      content.appendChild(iconWrapper);\n    }\n    content.appendChild(span);\n    container.appendChild(content);\n\n    if (this.dataset.fixedOutput) {\n      const suffix = document.createElement(\"span\");\n      suffix.className = \"tag-fixed-output-marker\";\n      suffix.textContent = \"===\";\n      container.appendChild(suffix);\n    }\n\n    // container.appendChild(icon);\n    return container;\n  }\n\n  ignoreEvent() {\n    return false;\n  }\n}\n\nexport default PlaceholderWidget;\n"],"names":["SVG_NS","createSvgElement","tag","buildImageIcon","svg","rect","circle","path","buildVideoIcon","PlaceholderWidget","WidgetType","text","dataset","styleClass","type","view","from","to","decorations","EditorView","deco","start","end","decoration","container","content","span","e","event","prefix","iconWrapper","icon","suffix"],"mappings":"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"}