@omegagrid/markdown 0.10.35 → 0.10.36

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -8,7 +8,7 @@ var _HtmlBlockComponent_content,__decorate=this&&this.__decorate||function(t,e,o
8
8
  language="html"
9
9
  .content="${this.content}"
10
10
  .editorOptions="${{minimap:{enabled:!1},lineNumbers:{renderType:0}}}"
11
- @blur="${()=>this.commit()}"
11
+ @code.blur="${()=>this.commit()}"
12
12
  @code.ready="${()=>this.editor.focus()}">
13
13
  </og-code-block>
14
14
  `:this.content?html`
@@ -1 +1 @@
1
- {"version":3,"file":"htmlBlock.js","sourceRoot":"","sources":["../../../src/components/features/htmlBlock.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAGA,OAAO,EAAE,GAAG,EAAE,MAAM,EAAE,MAAM,iBAAiB,CAAC;AAE9C,OAAO,EAAE,UAAU,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAC5C,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AACnE,OAAO,EAAE,UAAU,EAAE,MAAM,+BAA+B,CAAC;AAC3D,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAGnC,IAAM,kBAAkB,GAAxB,MAAM,kBAAmB,SAAQ,UAAU;IAoCjD,IAAI,OAAO,KAAK,OAAO,uBAAA,IAAI,mCAAS,CAAA,CAAC,CAAC;IACtC,IAAI,OAAO,CAAC,GAAW;QACtB,uBAAA,IAAI,+BAAY,GAAG,MAAA,CAAC;QACpB,IAAI,CAAC,aAAa,EAAE,CAAC;IACtB,CAAC;IAeD;QACC,KAAK,EAAE,CAAC;QAvBT,sCAAmB,EAAE,EAAC;QAUtB,aAAQ,GAAG,KAAK,CAAC;QAGjB,YAAO,GAAG,KAAK,CAAC;QAKhB,cAAS,GAAG,GAAG,EAAE;YAChB,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;QACrB,CAAC,CAAC;QAaF,WAAM,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAA;;;KAG/B,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAA;;;;;iBAKP,IAAI,CAAC,OAAO;uBACN;YACjB,OAAO,EAAE,EAAC,OAAO,EAAE,KAAK,EAAC;YACzB,WAAW,EAAE,EAAC,UAAU,EAAE,CAAC,EAAC;SAC5B;cACQ,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,EAAE;oBACb,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,KAAK,EAAE;;IAEzC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAA;;;iBAGV,IAAI,CAAC,OAAO;;IAEzB,CAAC,CAAC,CAAC,IAAI,CAAA;+BACoB,GAAG,CAAC,aAAa,CAAC;IAC7C,CAAC;;EAEH,CAAC,CAAC,CAAC,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC,CAAC;QAlC5B,IAAI,CAAC,gBAAgB,CAAC,OAAO,EAAE,GAAG,EAAE,CAAC,IAAI,CAAC,SAAS,EAAE,CAAC,CAAC;IACxD,CAAC;IAED,MAAM;QACL,IAAI,CAAC,OAAO,GAAG,KAAK,CAAC;QACrB,uBAAA,IAAI,+BAAY,IAAI,CAAC,MAAM,CAAC,KAAK,CAAC,QAAQ,EAAE,MAAA,CAAC;QAC7C,IAAI,CAAC,aAAa,CAAC,IAAI,MAAM,CAAC,WAAW,CAAC,uBAAA,IAAI,mCAAS,CAAC,CAAC,CAAC;IAC3D,CAAC;;;AA9DM,yBAAM,GAAG,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EA6BlB,AA7BY,CA6BX;AAKF;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;iDACa;AAOtC;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;oDACT;AAGjB;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC;mDACV;AAGhB;IADC,KAAK,CAAC,eAAe,CAAC;kDACL;AAjDN,kBAAkB;IAD9B,aAAa,CAAC,wBAAwB,CAAC;GAC3B,kBAAkB,CA6F9B;;AAGD,MAAM,OAAO,SAAS;IAGrB,0EAA0E;IAC1E,iDAAiD;IAEjD,YACQ,EAAmB,EACnB,IAAU,EACV,IAAgB,EAChB,MAAgC;QAHhC,OAAE,GAAF,EAAE,CAAiB;QACnB,SAAI,GAAJ,IAAI,CAAM;QACV,SAAI,GAAJ,IAAI,CAAY;QAChB,WAAM,GAAN,MAAM,CAA0B;QARhC,aAAQ,GAAG,KAAK,CAAC;QAgBzB,cAAS,GAAG,CAAC,CAAqB,EAAE,EAAE;YACrC,IAAI,IAAI,CAAC,QAAQ;gBAAE,OAAO;YAC1B,MAAM,EAAE,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC;YAC9B,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC,gBAAgB,CAAC,IAAI,CAAC,MAAM,EAAE,IAAI,CAAC,EAAE,OAAO,EAAE,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC;QAC/E,CAAC,CAAA;QAVA,IAAI,CAAC,GAAG,GAAG,GAAG,CAAC,aAAa,CAAqB,wBAAwB,CAAC,CAAC;QAC3E,IAAI,CAAC,GAAG,CAAC,QAAQ,GAAG,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC;QACvC,IAAI,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,KAAK,CAAC;QAC1C,IAAI,CAAC,GAAG,CAAC,gBAAgB,CAAC,QAAQ,EAAE,IAAI,CAAC,SAAS,CAAC,CAAC;IACrD,CAAC;IAQD,MAAM,CAAC,IAAU;QAChB,IAAI,IAAI,CAAC,IAAI,KAAK,IAAI,CAAC,IAAI,CAAC,IAAI;YAAE,OAAO,KAAK,CAAC;QAC/C,IAAI,IAAI,CAAC,QAAQ;YAAE,OAAO,IAAI,CAAC;QAC/B,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC;QACjB,IAAI,CAAC,GAAG,CAAC,OAAO,GAAG,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE,KAAK,CAAC;QAC1C,OAAO,IAAI,CAAC;IACb,CAAC;IAED,UAAU;QACT,IAAI,IAAI,CAAC,IAAI,CAAC,QAAQ;YAAE,IAAI,CAAC,GAAG,CAAC,SAAS,EAAE,CAAC;QAC7C,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,CAAA;IACjB,CAAC;IAED,YAAY;QACX,kCAAkC;IACnC,CAAC;IAED,SAAS;QACR,OAAO,IAAI,CAAA;IACZ,CAAC;IAED,OAAO;QACN,2BAA2B;IAC5B,CAAC;CAuED;AAGD,MAAM,CAAC,MAAM,uBAAuB,GAAG,EAAsB,CAAC;AAE9D,MAAM,UAAU,qBAAqB,CAAC,EAAmB;IACxD,OAAO,EAAE,CAAC,KAAK,CAAC,IAAI,CAAC,uBAAuB,EAAE,qBAAqB,CAAC,CAAC;AACtE,CAAC;AAED,MAAM,UAAU,mBAAmB,CAAC,EAAmB;IACtD,OAAO,EAAE,CAAC,KAAK,CAAC,KAAK,CACpB,EAAE,CAAC,OAAO,CAAC,UAAU,CAAC,UAAU,CAAC,IAAI,EACrC,IAAI,CAAC,EAAE;QACN,+CAA+C;QAC/C,OAAO,CAAC,IAAI,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,CAAC,IAAI,SAAS,CAAC,EAAE,EAAE,IAAI,EAAE,IAAI,EAAE,MAAM,CAAC,CAAC;IACtE,CAAC,CACD,CAAC;AACH,CAAC","sourcesContent":["import type * as milkdown from '@omegagrid/milkdown-kit';\nimport type { NodeView, EditorView } from '@omegagrid/milkdown-kit/dist/prose/view';\nimport type { Node } from '@omegagrid/milkdown-kit/dist/prose/model';\nimport { dom, events } from '@omegagrid/core';\nimport { CodeBlock } from '@omegagrid/code';\nimport { LitElement, css, html } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { unsafeHTML } from 'lit/directives/unsafe-html.js';\nimport { msg } from '@omegagrid/localize';\n\n@customElement('og-markdown-html-block')\nexport class HtmlBlockComponent extends LitElement {\n\n\tstatic styles = css`\n\t\t* {\n\t\t\tbox-sizing: border-box;\n\t\t}\n\n\t\t:host {\n\t\t\tfont-size: var(--og-font-size);\n\t\t\tdisplay: block;\n\t\t\twhite-space: normal;\n\t\t\tborder: 1px solid var(--og-border-color);\n\t\t}\n\n\t\t.title {\n\t\t\tfont-size: 10px;\n\t\t\tcolor: var(--og-accent-color);\n\t\t\tpadding: 2px;\n\t\t\tborder-bottom: 1px solid var(--og-border-color);\n\t\t}\n\t\t\n\t\t.html {\n\t\t\tpadding: 2px;\n\t\t\twhite-space: pre-wrap;\n\t\t\tword-wrap: break-word;\n\t\t\tcursor: pointer;\n\t\t}\n\n\t\tog-code-view, .placeholder {\n\t\t\tcursor: pointer;\n\t\t}\n\t`;\n\n\t#content: string = '';\n\n\t@property({type: String})\n\tget content() { return this.#content }\n\tset content(val: string) {\n\t\tthis.#content = val;\n\t\tthis.requestUpdate();\n\t}\n\n\t@property({type: Boolean})\n\teditable = false;\n\n\t@property({type: Boolean})\n\tediting = false;\n\n\t@query('og-code-block')\n\teditor: CodeBlock;\n\n\tstartEdit = () => {\n\t\tthis.editing = true;\n\t};\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis.addEventListener('click', () => this.startEdit());\n\t}\n\n\tcommit() {\n\t\tthis.editing = false;\n\t\tthis.#content = this.editor.model.getValue();\n\t\tthis.dispatchEvent(new events.ChangeEvent(this.#content));\n\t}\n\n\trender = () => this.editable ? html`\n\t\t<div class=\"title\">Raw HTML</div>\n\t\t<div class=\"body\">\n\t\t\t${this.editing ? html`\n\t\t\t\t<og-code-block\n\t\t\t\t\tdisableToolbar\n\t\t\t\t\tdynamicHeight\n\t\t\t\t\tlanguage=\"html\"\n\t\t\t\t\t.content=\"${this.content}\"\n\t\t\t\t\t.editorOptions=\"${{\n\t\t\t\t\t\tminimap: {enabled: false},\n\t\t\t\t\t\tlineNumbers: {renderType: 0}\n\t\t\t\t\t}}\"\n\t\t\t\t\t@blur=\"${() => this.commit()}\"\n\t\t\t\t\t@code.ready=\"${() => this.editor.focus()}\">\n\t\t\t\t</og-code-block>\n\t\t\t` : (this.content ? html`\n\t\t\t\t<og-code-view \n\t\t\t\t\tlanguage=\"html\"\n\t\t\t\t\t.content=\"${this.content}\" >\n\t\t\t\t</og-code-view>\n\t\t\t` : html`\n\t\t\t\t<div class=\"placeholder\">${msg('Insert HTML')}</div>\n\t\t\t`)}\n\t\t</div>\n\t` : unsafeHTML(this.content);\n//<div class=\"html\" @click=\"${() => this.startEdit()}\">${this.content}</div>\n}\n\n\nexport class HtmlBlock implements NodeView {\n\tdom: HtmlBlockComponent;\n\tprivate updating = false;\n\t// private get editor() { return (this.dom as CodeBlock)?.editor?.editor }\n\t// get model() { return this.editor?.getModel() }\n\n\tconstructor(\n\t\tpublic md: typeof milkdown,\n\t\tpublic node: Node,\n\t\tpublic view: EditorView,\n\t\tpublic getPos: () => number | undefined\n\t) {\n\t\tthis.dom = dom.createElement<HtmlBlockComponent>('og-markdown-html-block');\n\t\tthis.dom.editable = this.view.editable;\n\t\tthis.dom.content = this.node.attrs?.value;\n\t\tthis.dom.addEventListener('change', this._onChange);\n\t}\n\n\t_onChange = (e: events.ChangeEvent) => {\n\t\tif (this.updating) return;\n\t\tconst tr = this.view.state.tr;\n\t\tthis.view.dispatch(tr.setNodeAttribute(this.getPos() ?? 0, 'value', e.value));\n\t}\n\n\tupdate(node: Node) {\n\t\tif (node.type !== this.node.type) return false;\n\t\tif (this.updating) return true;\n\t\tthis.node = node;\n\t\tthis.dom.content = this.node.attrs?.value;\n\t\treturn true;\n\t}\n\n\tselectNode() {\n\t\tif (this.view.editable) this.dom.startEdit();\n\t\tthis.dom.focus()\n\t}\n\n\tdeselectNode() {\n\t\t// this.component.selected = false\n\t}\n\n\tstopEvent() {\n\t\treturn true\n\t}\n\n\tdestroy() {\n\t\t// this.component.destroy()\n\t}\n\n\t// private codeMirrorKeymap = (): KeyBinding[] => {\n\t// \tconst view = this.view\n\t// \treturn [\n\t// \t\t{ key: 'ArrowUp', run: () => this.maybeEscape('line', -1) },\n\t// \t\t{ key: 'ArrowLeft', run: () => this.maybeEscape('char', -1) },\n\t// \t\t{ key: 'ArrowDown', run: () => this.maybeEscape('line', 1) },\n\t// \t\t{ key: 'ArrowRight', run: () => this.maybeEscape('char', 1) },\n\t// \t\t{\n\t// \t\t\tkey: 'Mod-Enter',\n\t// \t\t\trun: () => {\n\t// \t\t\t\tif (!exitCode(view.state, view.dispatch)) return false\n\n\t// \t\t\t\tview.focus()\n\t// \t\t\t\treturn true\n\t// \t\t\t},\n\t// \t\t},\n\t// \t\t{ key: 'Mod-z', run: () => undo(view.state, view.dispatch) },\n\t// \t\t{ key: 'Shift-Mod-z', run: () => redo(view.state, view.dispatch) },\n\t// \t\t{ key: 'Mod-y', run: () => redo(view.state, view.dispatch) },\n\t// \t\t{\n\t// \t\t\tkey: 'Backspace',\n\t// \t\t\trun: () => {\n\t// \t\t\t\tconst ranges = this.cm.state.selection.ranges\n\n\t// \t\t\t\tif (ranges.length > 1) return false\n\n\t// \t\t\t\tconst selection = ranges[0]\n\n\t// \t\t\t\tif (selection && (!selection.empty || selection.anchor > 0))\n\t// \t\t\t\t\treturn false\n\n\t// \t\t\t\tif (this.cm.state.doc.lines >= 2) return false\n\n\t// \t\t\t\tconst state = this.view.state\n\t// \t\t\t\tconst pos = this.getPos() ?? 0\n\t// \t\t\t\tconst tr = state.tr.replaceWith(\n\t// \t\t\t\t\tpos,\n\t// \t\t\t\t\tpos + this.node.nodeSize,\n\t// \t\t\t\t\tstate.schema.nodes.paragraph!.createChecked({}, this.node.content)\n\t// \t\t\t\t)\n\n\t// \t\t\t\ttr.setSelection(TextSelection.near(tr.doc.resolve(pos)))\n\n\t// \t\t\t\tthis.view.dispatch(tr)\n\t// \t\t\t\tthis.view.focus()\n\t// \t\t\t\treturn true\n\t// \t\t\t},\n\t// \t\t},\n\t// \t]\n\t// }\n\n\t// private maybeEscape = (unit: 'line' | 'char', dir: -1 | 1): boolean => {\n\t// \tconst editorSelection = this.editor.getSelection();\n\t// \tlet main: SelectionRange | Line = state.selection.main\n\t// \tif (!main.empty) return false\n\t// \tif (unit === 'line') main = state.doc.lineAt(main.head)\n\t// \tif (dir < 0 ? main.from > 0 : main.to < state.doc.length) return false\n\n\t// \tconst targetPos = (this.getPos() ?? 0) + (dir < 0 ? 0 : this.node.nodeSize)\n\t// \tconst selection = TextSelection.near(\n\t// \t\tthis.view.state.doc.resolve(targetPos),\n\t// \t\tdir\n\t// \t)\n\t// \tconst tr = this.view.state.tr.setSelection(selection).scrollIntoView();\n\t// \tthis.view.dispatch(tr);\n\t// \tthis.view.focus();\n\t// \treturn true;\n\t// }\n\n}\n\nexport type CodeEditorConfig = Record<string, never>;\nexport const defaultCodeEditorConfig = {} as CodeEditorConfig;\n\nexport function createHtmlBlockConfig(md: typeof milkdown) {\n\treturn md.utils.$ctx(defaultCodeEditorConfig, 'htmlEditorConfigCtx');\n}\n\nexport function createHtmlBlockView(md: typeof milkdown) {\n\treturn md.utils.$view(\n\t\tmd.presets.commonmark.htmlSchema.node,\n\t\t_ctx => {\n\t\t\t// const config = ctx.get('codeBlockConfigCtx')\n\t\t\treturn (node, view, getPos) => new HtmlBlock(md, node, view, getPos);\n\t\t}\n\t);\n}\n"]}
1
+ {"version":3,"file":"htmlBlock.js","sourceRoot":"","sources":["../../../src/components/features/htmlBlock.ts"],"names":[],"mappings":"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","sourcesContent":["import type * as milkdown from '@omegagrid/milkdown-kit';\nimport type { NodeView, EditorView } from '@omegagrid/milkdown-kit/dist/prose/view';\nimport type { Node } from '@omegagrid/milkdown-kit/dist/prose/model';\nimport { dom, events } from '@omegagrid/core';\nimport { CodeBlock } from '@omegagrid/code';\nimport { LitElement, css, html } from 'lit';\nimport { customElement, property, query } from 'lit/decorators.js';\nimport { unsafeHTML } from 'lit/directives/unsafe-html.js';\nimport { msg } from '@omegagrid/localize';\n\n@customElement('og-markdown-html-block')\nexport class HtmlBlockComponent extends LitElement {\n\n\tstatic styles = css`\n\t\t* {\n\t\t\tbox-sizing: border-box;\n\t\t}\n\n\t\t:host {\n\t\t\tfont-size: var(--og-font-size);\n\t\t\tdisplay: block;\n\t\t\twhite-space: normal;\n\t\t\tborder: 1px solid var(--og-border-color);\n\t\t}\n\n\t\t.title {\n\t\t\tfont-size: 10px;\n\t\t\tcolor: var(--og-accent-color);\n\t\t\tpadding: 2px;\n\t\t\tborder-bottom: 1px solid var(--og-border-color);\n\t\t}\n\t\t\n\t\t.html {\n\t\t\tpadding: 2px;\n\t\t\twhite-space: pre-wrap;\n\t\t\tword-wrap: break-word;\n\t\t\tcursor: pointer;\n\t\t}\n\n\t\tog-code-view, .placeholder {\n\t\t\tcursor: pointer;\n\t\t}\n\t`;\n\n\t#content: string = '';\n\n\t@property({type: String})\n\tget content() { return this.#content }\n\tset content(val: string) {\n\t\tthis.#content = val;\n\t\tthis.requestUpdate();\n\t}\n\n\t@property({type: Boolean})\n\teditable = false;\n\n\t@property({type: Boolean})\n\tediting = false;\n\n\t@query('og-code-block')\n\teditor: CodeBlock;\n\n\tstartEdit = () => {\n\t\tthis.editing = true;\n\t};\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis.addEventListener('click', () => this.startEdit());\n\t}\n\n\tcommit() {\n\t\tthis.editing = false;\n\t\tthis.#content = this.editor.model.getValue();\n\t\tthis.dispatchEvent(new events.ChangeEvent(this.#content));\n\t}\n\n\trender = () => this.editable ? html`\n\t\t<div class=\"title\">Raw HTML</div>\n\t\t<div class=\"body\">\n\t\t\t${this.editing ? html`\n\t\t\t\t<og-code-block\n\t\t\t\t\tdisableToolbar\n\t\t\t\t\tdynamicHeight\n\t\t\t\t\tlanguage=\"html\"\n\t\t\t\t\t.content=\"${this.content}\"\n\t\t\t\t\t.editorOptions=\"${{\n\t\t\t\t\t\tminimap: {enabled: false},\n\t\t\t\t\t\tlineNumbers: {renderType: 0}\n\t\t\t\t\t}}\"\n\t\t\t\t\t@code.blur=\"${() => this.commit()}\"\n\t\t\t\t\t@code.ready=\"${() => this.editor.focus()}\">\n\t\t\t\t</og-code-block>\n\t\t\t` : (this.content ? html`\n\t\t\t\t<og-code-view \n\t\t\t\t\tlanguage=\"html\"\n\t\t\t\t\t.content=\"${this.content}\" >\n\t\t\t\t</og-code-view>\n\t\t\t` : html`\n\t\t\t\t<div class=\"placeholder\">${msg('Insert HTML')}</div>\n\t\t\t`)}\n\t\t</div>\n\t` : unsafeHTML(this.content);\n//<div class=\"html\" @click=\"${() => this.startEdit()}\">${this.content}</div>\n}\n\n\nexport class HtmlBlock implements NodeView {\n\tdom: HtmlBlockComponent;\n\tprivate updating = false;\n\t// private get editor() { return (this.dom as CodeBlock)?.editor?.editor }\n\t// get model() { return this.editor?.getModel() }\n\n\tconstructor(\n\t\tpublic md: typeof milkdown,\n\t\tpublic node: Node,\n\t\tpublic view: EditorView,\n\t\tpublic getPos: () => number | undefined\n\t) {\n\t\tthis.dom = dom.createElement<HtmlBlockComponent>('og-markdown-html-block');\n\t\tthis.dom.editable = this.view.editable;\n\t\tthis.dom.content = this.node.attrs?.value;\n\t\tthis.dom.addEventListener('change', this._onChange);\n\t}\n\n\t_onChange = (e: events.ChangeEvent) => {\n\t\tif (this.updating) return;\n\t\tconst tr = this.view.state.tr;\n\t\tthis.view.dispatch(tr.setNodeAttribute(this.getPos() ?? 0, 'value', e.value));\n\t}\n\n\tupdate(node: Node) {\n\t\tif (node.type !== this.node.type) return false;\n\t\tif (this.updating) return true;\n\t\tthis.node = node;\n\t\tthis.dom.content = this.node.attrs?.value;\n\t\treturn true;\n\t}\n\n\tselectNode() {\n\t\tif (this.view.editable) this.dom.startEdit();\n\t\tthis.dom.focus()\n\t}\n\n\tdeselectNode() {\n\t\t// this.component.selected = false\n\t}\n\n\tstopEvent() {\n\t\treturn true\n\t}\n\n\tdestroy() {\n\t\t// this.component.destroy()\n\t}\n\n\t// private codeMirrorKeymap = (): KeyBinding[] => {\n\t// \tconst view = this.view\n\t// \treturn [\n\t// \t\t{ key: 'ArrowUp', run: () => this.maybeEscape('line', -1) },\n\t// \t\t{ key: 'ArrowLeft', run: () => this.maybeEscape('char', -1) },\n\t// \t\t{ key: 'ArrowDown', run: () => this.maybeEscape('line', 1) },\n\t// \t\t{ key: 'ArrowRight', run: () => this.maybeEscape('char', 1) },\n\t// \t\t{\n\t// \t\t\tkey: 'Mod-Enter',\n\t// \t\t\trun: () => {\n\t// \t\t\t\tif (!exitCode(view.state, view.dispatch)) return false\n\n\t// \t\t\t\tview.focus()\n\t// \t\t\t\treturn true\n\t// \t\t\t},\n\t// \t\t},\n\t// \t\t{ key: 'Mod-z', run: () => undo(view.state, view.dispatch) },\n\t// \t\t{ key: 'Shift-Mod-z', run: () => redo(view.state, view.dispatch) },\n\t// \t\t{ key: 'Mod-y', run: () => redo(view.state, view.dispatch) },\n\t// \t\t{\n\t// \t\t\tkey: 'Backspace',\n\t// \t\t\trun: () => {\n\t// \t\t\t\tconst ranges = this.cm.state.selection.ranges\n\n\t// \t\t\t\tif (ranges.length > 1) return false\n\n\t// \t\t\t\tconst selection = ranges[0]\n\n\t// \t\t\t\tif (selection && (!selection.empty || selection.anchor > 0))\n\t// \t\t\t\t\treturn false\n\n\t// \t\t\t\tif (this.cm.state.doc.lines >= 2) return false\n\n\t// \t\t\t\tconst state = this.view.state\n\t// \t\t\t\tconst pos = this.getPos() ?? 0\n\t// \t\t\t\tconst tr = state.tr.replaceWith(\n\t// \t\t\t\t\tpos,\n\t// \t\t\t\t\tpos + this.node.nodeSize,\n\t// \t\t\t\t\tstate.schema.nodes.paragraph!.createChecked({}, this.node.content)\n\t// \t\t\t\t)\n\n\t// \t\t\t\ttr.setSelection(TextSelection.near(tr.doc.resolve(pos)))\n\n\t// \t\t\t\tthis.view.dispatch(tr)\n\t// \t\t\t\tthis.view.focus()\n\t// \t\t\t\treturn true\n\t// \t\t\t},\n\t// \t\t},\n\t// \t]\n\t// }\n\n\t// private maybeEscape = (unit: 'line' | 'char', dir: -1 | 1): boolean => {\n\t// \tconst editorSelection = this.editor.getSelection();\n\t// \tlet main: SelectionRange | Line = state.selection.main\n\t// \tif (!main.empty) return false\n\t// \tif (unit === 'line') main = state.doc.lineAt(main.head)\n\t// \tif (dir < 0 ? main.from > 0 : main.to < state.doc.length) return false\n\n\t// \tconst targetPos = (this.getPos() ?? 0) + (dir < 0 ? 0 : this.node.nodeSize)\n\t// \tconst selection = TextSelection.near(\n\t// \t\tthis.view.state.doc.resolve(targetPos),\n\t// \t\tdir\n\t// \t)\n\t// \tconst tr = this.view.state.tr.setSelection(selection).scrollIntoView();\n\t// \tthis.view.dispatch(tr);\n\t// \tthis.view.focus();\n\t// \treturn true;\n\t// }\n\n}\n\nexport type CodeEditorConfig = Record<string, never>;\nexport const defaultCodeEditorConfig = {} as CodeEditorConfig;\n\nexport function createHtmlBlockConfig(md: typeof milkdown) {\n\treturn md.utils.$ctx(defaultCodeEditorConfig, 'htmlEditorConfigCtx');\n}\n\nexport function createHtmlBlockView(md: typeof milkdown) {\n\treturn md.utils.$view(\n\t\tmd.presets.commonmark.htmlSchema.node,\n\t\t_ctx => {\n\t\t\t// const config = ctx.get('codeBlockConfigCtx')\n\t\t\treturn (node, view, getPos) => new HtmlBlock(md, node, view, getPos);\n\t\t}\n\t);\n}\n"]}
@@ -1 +1 @@
1
- import{isInCodeBlock,isInList}from"./utils";import{msg}from"@omegagrid/localize";function isDocEmpty(e){return e.childCount<=1&&!e.firstChild?.content.size}function createPlaceholderDecoration(e,t,o){const{selection:n}=t;if(!n.empty)return null;const r=n.$anchor,c=r.parent;if(c.content.size>0)return null;const l=e.prose.findParent((e=>"table"===e.type.name))(r);if(l)return null;const i=r.before();return e.prose.view.Decoration.node(i,i+c.nodeSize,{class:"crepe-placeholder","data-placeholder":o})}export const createDefaultPlaceholderConfig=()=>({text:msg("Please enter..."),mode:"block"});export const createPlaceHolder=e=>{const t=e.utils.$ctx(createDefaultPlaceholderConfig(),"placeholderConfigCtx");return{plugin:e.utils.$prose((o=>new e.prose.state.Plugin({key:new e.prose.state.PluginKey("MARKDOWN_PLACEHOLDER"),props:{decorations:n=>{const r=o.get(t.key);if("doc"===r.mode&&!isDocEmpty(n.doc))return null;if(isInCodeBlock(n.selection)||isInList(n.selection))return null;const c=r.text??msg("Please enter..."),l=createPlaceholderDecoration(e,n,c);return l?e.prose.view.DecorationSet.create(n.doc,[l]):null}}}))),config:t}};
1
+ import{isInCodeBlock,isInList}from"./utils";import{msg}from"@omegagrid/localize";function isDocEmpty(e){return e.childCount<=1&&!e.firstChild?.content.size}function createPlaceholderDecoration(e,t,o){const{selection:n}=t;if(!n.empty)return null;const r=n.$anchor,c=r.parent;if(c.content.size>0)return null;const i=e.prose.findParent((e=>"table"===e.type.name))(r);if(i)return null;const l=r.before();return e.prose.view.Decoration.node(l,l+c.nodeSize,{class:"crepe-placeholder","data-placeholder":o})}export const createDefaultPlaceholderConfig=()=>({text:msg("Start typing..."),mode:"block"});export const createPlaceHolder=e=>{const t=e.utils.$ctx(createDefaultPlaceholderConfig(),"placeholderConfigCtx");return{plugin:e.utils.$prose((o=>new e.prose.state.Plugin({key:new e.prose.state.PluginKey("MARKDOWN_PLACEHOLDER"),props:{decorations:n=>{const r=o.get(t.key);if("doc"===r.mode&&!isDocEmpty(n.doc))return null;if(isInCodeBlock(n.selection)||isInList(n.selection))return null;const c=r.text??msg("Start typing..."),i=createPlaceholderDecoration(e,n,c);return i?e.prose.view.DecorationSet.create(n.doc,[i]):null}}}))),config:t}};
@@ -1 +1 @@
1
- {"version":3,"file":"placeholder.js","sourceRoot":"","sources":["../../../src/components/features/placeholder.ts"],"names":[],"mappings":"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","sourcesContent":["import type { Node } from '@omegagrid/milkdown-kit/dist/prose/model';\nimport type { EditorState } from '@omegagrid/milkdown-kit/dist/prose/state';\nimport { isInCodeBlock, isInList } from './utils';\nimport type * as milkdown from '@omegagrid/milkdown-kit';\nimport { msg } from '@omegagrid/localize';\n\nfunction isDocEmpty(doc: Node) {\n\treturn doc.childCount <= 1 && !doc.firstChild?.content.size;\n}\n\nfunction createPlaceholderDecoration(md: typeof milkdown, state: EditorState, placeholderText: string) {\n\tconst { selection } = state;\n\tif (!selection.empty) return null;\n\n\tconst $pos = selection.$anchor;\n\tconst node = $pos.parent;\n\tif (node.content.size > 0) return null;\n\n\tconst inTable = md.prose.findParent((node) => node.type.name === 'table')($pos);\n\tif (inTable) return null;\n\n\tconst before = $pos.before();\n\n\treturn md.prose.view.Decoration.node(before, before + node.nodeSize, {\n\t\tclass: 'crepe-placeholder',\n\t\t'data-placeholder': placeholderText,\n\t});\n}\n\ninterface PlaceholderConfig {\n\ttext: string;\n\tmode: 'doc' | 'block';\n}\n\nexport type PlaceHolderFeatureConfig = Partial<PlaceholderConfig>;\n\nexport const createDefaultPlaceholderConfig = (): PlaceholderConfig => ({\n\ttext: msg('Please enter...'),\n\tmode: 'block',\n});\n\nexport const createPlaceHolder = (md: typeof milkdown) => {\n\tconst placeholderConfig = md.utils.$ctx(createDefaultPlaceholderConfig(), 'placeholderConfigCtx');\n\tconst placeholderPlugin = md.utils.$prose(ctx => new md.prose.state.Plugin({\n\t\tkey: new md.prose.state.PluginKey('MARKDOWN_PLACEHOLDER'),\n\t\tprops: {\n\t\t\tdecorations: (state) => {\n\t\t\t\tconst config = ctx.get(placeholderConfig.key);\n\t\t\t\tif (config.mode === 'doc' && !isDocEmpty(state.doc)) return null;\n\t\t\n\t\t\t\tif (isInCodeBlock(state.selection) || isInList(state.selection)) return null;\n\t\t\n\t\t\t\tconst placeholderText = config.text ?? msg('Please enter...');\n\t\t\t\tconst deco = createPlaceholderDecoration(md, state, placeholderText);\n\t\t\t\tif (!deco) return null;\n\t\t\n\t\t\t\treturn md.prose.view.DecorationSet.create(state.doc, [deco]);\n\t\t\t},\n\t\t}\n\t}));\n\n\treturn {\n\t\tplugin: placeholderPlugin,\n\t\tconfig: placeholderConfig,\n\t}\n};\n"]}
1
+ {"version":3,"file":"placeholder.js","sourceRoot":"","sources":["../../../src/components/features/placeholder.ts"],"names":[],"mappings":"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","sourcesContent":["import type { Node } from '@omegagrid/milkdown-kit/dist/prose/model';\nimport type { EditorState } from '@omegagrid/milkdown-kit/dist/prose/state';\nimport { isInCodeBlock, isInList } from './utils';\nimport type * as milkdown from '@omegagrid/milkdown-kit';\nimport { msg } from '@omegagrid/localize';\n\nfunction isDocEmpty(doc: Node) {\n\treturn doc.childCount <= 1 && !doc.firstChild?.content.size;\n}\n\nfunction createPlaceholderDecoration(md: typeof milkdown, state: EditorState, placeholderText: string) {\n\tconst { selection } = state;\n\tif (!selection.empty) return null;\n\n\tconst $pos = selection.$anchor;\n\tconst node = $pos.parent;\n\tif (node.content.size > 0) return null;\n\n\tconst inTable = md.prose.findParent((node) => node.type.name === 'table')($pos);\n\tif (inTable) return null;\n\n\tconst before = $pos.before();\n\n\treturn md.prose.view.Decoration.node(before, before + node.nodeSize, {\n\t\tclass: 'crepe-placeholder',\n\t\t'data-placeholder': placeholderText,\n\t});\n}\n\ninterface PlaceholderConfig {\n\ttext: string;\n\tmode: 'doc' | 'block';\n}\n\nexport type PlaceHolderFeatureConfig = Partial<PlaceholderConfig>;\n\nexport const createDefaultPlaceholderConfig = (): PlaceholderConfig => ({\n\ttext: msg('Start typing...'),\n\tmode: 'block',\n});\n\nexport const createPlaceHolder = (md: typeof milkdown) => {\n\tconst placeholderConfig = md.utils.$ctx(createDefaultPlaceholderConfig(), 'placeholderConfigCtx');\n\tconst placeholderPlugin = md.utils.$prose(ctx => new md.prose.state.Plugin({\n\t\tkey: new md.prose.state.PluginKey('MARKDOWN_PLACEHOLDER'),\n\t\tprops: {\n\t\t\tdecorations: (state) => {\n\t\t\t\tconst config = ctx.get(placeholderConfig.key);\n\t\t\t\tif (config.mode === 'doc' && !isDocEmpty(state.doc)) return null;\n\t\t\n\t\t\t\tif (isInCodeBlock(state.selection) || isInList(state.selection)) return null;\n\t\t\n\t\t\t\tconst placeholderText = config.text ?? msg('Start typing...');\n\t\t\t\tconst deco = createPlaceholderDecoration(md, state, placeholderText);\n\t\t\t\tif (!deco) return null;\n\t\t\n\t\t\t\treturn md.prose.view.DecorationSet.create(state.doc, [deco]);\n\t\t\t},\n\t\t}\n\t}));\n\n\treturn {\n\t\tplugin: placeholderPlugin,\n\t\tconfig: placeholderConfig,\n\t}\n};\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@omegagrid/markdown",
3
- "version": "0.10.35",
3
+ "version": "0.10.36",
4
4
  "license": "UNLICENSED",
5
5
  "description": "Markdown view webcomponent",
6
6
  "main": "./dist/index.js",
@@ -28,11 +28,11 @@
28
28
  },
29
29
  "dependencies": {
30
30
  "@fortawesome/fontawesome-svg-core": "^7.0.1",
31
- "@omegagrid/code": "^0.10.35",
32
- "@omegagrid/core": "^0.10.35",
33
- "@omegagrid/localize": "^0.10.35",
34
- "@omegagrid/milkdown-kit": "^0.10.35",
35
- "@omegagrid/tabs": "^0.10.35",
31
+ "@omegagrid/code": "^0.10.36",
32
+ "@omegagrid/core": "^0.10.36",
33
+ "@omegagrid/localize": "^0.10.36",
34
+ "@omegagrid/milkdown-kit": "^0.10.36",
35
+ "@omegagrid/tabs": "^0.10.36",
36
36
  "lit": "^3.1.1",
37
37
  "markdown-it": "^14.1.0",
38
38
  "ts-debounce": "^4.0.0"