@cubud/wen 1.0.0

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.
@@ -0,0 +1 @@
1
+ .wen-editor-root pre code.hljs{display:block;overflow-x:auto;padding:1em}.wen-editor-root code.hljs{padding:3px 5px}.wen-editor-root .hljs{color:#c9d1d9;background:#0d1117}.wen-editor-root .hljs-doctag,.wen-editor-root .hljs-keyword,.wen-editor-root .hljs-meta .hljs-keyword,.wen-editor-root .hljs-template-tag,.wen-editor-root .hljs-template-variable,.wen-editor-root .hljs-type,.wen-editor-root .hljs-variable.language_{color:#ff7b72}.wen-editor-root .hljs-title,.wen-editor-root .hljs-title.class_,.wen-editor-root .hljs-title.class_.inherited__,.wen-editor-root .hljs-title.function_{color:#d2a8ff}.wen-editor-root .hljs-attr,.wen-editor-root .hljs-attribute,.wen-editor-root .hljs-literal,.wen-editor-root .hljs-meta,.wen-editor-root .hljs-number,.wen-editor-root .hljs-operator,.wen-editor-root .hljs-selector-attr,.wen-editor-root .hljs-selector-class,.wen-editor-root .hljs-selector-id,.wen-editor-root .hljs-variable{color:#79c0ff}.wen-editor-root .hljs-meta .hljs-string,.wen-editor-root .hljs-regexp,.wen-editor-root .hljs-string{color:#a5d6ff}.wen-editor-root .hljs-built_in,.wen-editor-root .hljs-symbol{color:#ffa657}.wen-editor-root .hljs-code,.wen-editor-root .hljs-comment,.wen-editor-root .hljs-formula{color:#8b949e}.wen-editor-root .hljs-name,.wen-editor-root .hljs-quote,.wen-editor-root .hljs-selector-pseudo,.wen-editor-root .hljs-selector-tag{color:#7ee787}.wen-editor-root .hljs-subst{color:#c9d1d9}.wen-editor-root .hljs-section{color:#1f6feb;font-weight:700}.wen-editor-root .hljs-bullet{color:#f2cc60}.wen-editor-root .hljs-emphasis{color:#c9d1d9;font-style:italic}.wen-editor-root .hljs-strong{color:#c9d1d9;font-weight:700}.wen-editor-root .hljs-addition{color:#aff5b4;background-color:#033a16}.wen-editor-root .hljs-deletion{color:#ffdcd7;background-color:#67060c}:root{--wen-bg:#ffffff;--wen-surface:#f9fafb;--wen-surface-hover:#f3f4f6;--wen-border:#e5e7eb;--wen-text-main:#1f2937;--wen-text-muted:#6b7280;--wen-accent:#0f172a;--wen-accent-text:#ffffff;--wen-danger:#ef4444;--wen-font-sans:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;--wen-font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,monospace;--wen-radius:8px;--wen-radius-sm:4px;--wen-shadow:0 4px 6px -1px rgba(0, 0, 0, 0.05),0 2px 4px -1px rgba(0, 0, 0, 0.03)}.wen-editor-wrapper{background:var(--wen-bg);border:1px solid var(--wen-border);border-radius:var(--wen-radius);box-shadow:var(--wen-shadow);display:flex;flex-direction:column;font-family:var(--wen-font-sans);color:var(--wen-text-main)}.wen-toolbar{display:flex;flex-wrap:wrap;gap:.25rem;padding:.5rem;background:var(--wen-surface);border-bottom:1px solid var(--wen-border);align-items:center;border-top-left-radius:calc(var(--wen-radius) - 1px);border-top-right-radius:calc(var(--wen-radius) - 1px)}.wen-toolbar-btn{background:0 0;border:1px solid transparent;padding:.35rem .6rem;cursor:pointer;font-family:var(--wen-font-sans);font-size:.85rem;color:var(--wen-text-muted);border-radius:var(--wen-radius-sm);transition:all .15s ease}.wen-toolbar-btn:hover{background:var(--wen-surface-hover);color:var(--wen-text-main)}.wen-toolbar-btn.is-active{background:var(--wen-accent);color:var(--wen-accent-text)}.wen-toolbar-divider{width:1px;height:1.25rem;background:var(--wen-border);margin:0 .25rem}.wen-editor-root{padding:1.5rem;min-height:300px;outline:0;line-height:1.6}.wen-editor-root h1,.wen-editor-root h2,.wen-editor-root h3,.wen-editor-root p{margin-top:0;margin-bottom:1rem}.wen-editor-root h1,.wen-editor-root h2{font-weight:600;color:var(--wen-text-main)}.wen-editor-root p code{background:var(--wen-surface);color:var(--wen-text-main);padding:.2em .4em;border-radius:var(--wen-radius-sm);font-family:var(--wen-font-mono);font-size:.9em;border:1px solid var(--wen-border)}.wen-editor-root pre{background:#0d1117;color:#c9d1d9;padding:1rem;border-radius:var(--wen-radius);font-family:var(--wen-font-mono);font-size:.9rem;overflow-x:auto;margin:1.5rem 0}.wen-editor-root pre code{background:0 0;color:inherit;padding:0;border:none;font-size:inherit}.wen-editor-root blockquote{border-left:3px solid var(--wen-border);margin-left:0;padding-left:1rem;font-style:italic;color:var(--wen-text-muted)}.wen-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.6);z-index:99999!important;display:flex;align-items:center;justify-content:center}.wen-modal{background:var(--wen-bg);padding:1.5rem;border-radius:var(--wen-radius);box-shadow:0 10px 30px rgba(0,0,0,.5);width:350px;display:flex;flex-direction:column;gap:1rem;border:1px solid var(--wen-border);color:var(--wen-text-main);font-family:var(--wen-font-sans)}.wen-modal strong{font-size:1.1rem}.wen-modal input{padding:.5rem;border-radius:var(--wen-radius-sm);border:1px solid var(--wen-border);background:var(--wen-surface);color:var(--wen-text-main);font-family:var(--wen-font-mono);outline:0}.wen-modal input:focus{border-color:#3b82f6}.wen-modal-actions{display:flex;justify-content:flex-end;gap:.5rem}.wen-modal-cancel,.wen-modal-submit{padding:.4rem .8rem;border-radius:var(--wen-radius-sm);cursor:pointer;border:none;font-weight:600}.wen-modal-cancel{background:0 0;color:var(--wen-text-muted)}.wen-modal-cancel:hover{background:var(--wen-surface);color:var(--wen-text-main)}.wen-modal-submit{background:#3b82f6;color:#fff}.wen-modal-submit:hover{background:#2563eb}.wen-toolbar-btn:disabled{opacity:.4;cursor:not-allowed;background:0 0!important;color:var(--wen-text-muted)!important}.wen-editor-root .tableWrapper{overflow-x:auto;margin:1.5rem 0;border:1px solid var(--wen-border);border-radius:var(--wen-radius-sm)}.wen-editor-root table{border-collapse:collapse;table-layout:fixed;width:100%;margin:0;overflow:hidden}.wen-editor-root table td,.wen-editor-root table th{min-width:1em;border:1px solid #cbd5e1;padding:.5rem;vertical-align:top;box-sizing:border-box;position:relative}.wen-editor-root table th{font-weight:600;text-align:left;background-color:var(--wen-surface);color:var(--wen-text-main)}.wen-editor-root table p{margin:0}.wen-editor-root ul[data-type=taskList]{list-style:none;padding:0}.wen-editor-root ul[data-type=taskList] li{display:flex;align-items:flex-start;margin-bottom:.5rem}.wen-editor-root ul[data-type=taskList] li>label{margin-right:.5rem;user-select:none;margin-top:.15rem}.wen-editor-root ul[data-type=taskList] li>label input[type=checkbox]{cursor:pointer}.wen-editor-root ul[data-type=taskList] li>div{flex:1}.wen-editor-root ul[data-type=taskList] li p{margin:0}.wen-editor-root .wen-github-alert{border-left:4px solid var(--wen-border);padding:.75rem 1rem;margin:1.5rem 0;border-radius:0 var(--wen-radius-sm) var(--wen-radius-sm) 0;font-style:normal;color:var(--wen-text-main)}.wen-editor-root .wen-github-alert p:last-child{margin-bottom:0}.wen-editor-root .wen-github-alert-note{border-left-color:#0969da;background-color:rgba(9,105,218,.05)}.wen-editor-root .wen-github-alert-tip{border-left-color:#1a7f37;background-color:rgba(26,127,55,.05)}.wen-editor-root .wen-github-alert-important{border-left-color:#8250df;background-color:rgba(130,80,223,.05)}.wen-editor-root .wen-github-alert-warning{border-left-color:#bf8700;background-color:rgba(191,135,0,.05)}.wen-editor-root .wen-github-alert-caution{border-left-color:#cf222e;background-color:rgba(207,34,46,.05)}.wen-editor-root .wen-github-alert-badge{display:inline-block;font-weight:600;font-size:.9em;font-family:var(--wen-font-mono)}.wen-editor-root .wen-github-alert-badge-note{color:#0969da}.wen-editor-root .wen-github-alert-badge-tip{color:#1a7f37}.wen-editor-root .wen-github-alert-badge-important{color:#8250df}.wen-editor-root .wen-github-alert-badge-warning{color:#bf8700}.wen-editor-root .wen-github-alert-badge-caution{color:#cf222e}.wen-rich-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.7);z-index:9999;display:flex;align-items:center;justify-content:center}.wen-rich-modal{width:90vw;height:90vh;background:#fff;border-radius:var(--wen-radius);display:flex;flex-direction:column;overflow:hidden;box-shadow:0 10px 40px rgba(0,0,0,.5)}.wen-rich-modal-header{padding:1rem 1.5rem;background:#1e1e1e;color:#fff;display:flex;justify-content:space-between;align-items:center}.wen-rich-modal-body{flex:1;min-height:0;display:flex;flex-direction:column;background:var(--wen-bg)}.wen-rich-modal-body .wen-editor-wrapper{height:100%;border:none}.wen-yaml-block *,.wen-yaml-block ::after,.wen-yaml-block ::before{box-sizing:border-box}.wen-yaml-block{border:1px solid var(--wen-border);border-radius:var(--wen-radius);margin:1.5rem 0;background:var(--wen-bg)}.wen-yaml-header{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--wen-border);padding:.5rem 1rem;background:var(--wen-surface);border-top-left-radius:calc(var(--wen-radius) - 1px);border-top-right-radius:calc(var(--wen-radius) - 1px)}.wen-yaml-title{font-size:.85rem;font-weight:600;color:var(--wen-text-muted);text-transform:uppercase;letter-spacing:.05em}.wen-yaml-toggle-btn{background:var(--wen-bg);border:1px solid var(--wen-border);color:var(--wen-text-muted);cursor:pointer;font-size:.75rem;padding:.25rem .6rem;border-radius:var(--wen-radius-sm)}.wen-yaml-toggle-btn:hover{background:var(--wen-surface-hover);color:var(--wen-text-main)}.wen-yaml-visual-container{position:relative;display:block}.wen-yaml-view-visual{padding:.5rem!important}.wen-yaml-error-state,.wen-yaml-view-raw{display:none;padding:1rem}.wen-yaml-error-state.active,.wen-yaml-view-raw.active{display:block}.wen-yaml-visual-container.is-collapsed .wen-yaml-view-visual{max-height:220px;overflow:hidden}.wen-yaml-fade{display:none}.wen-yaml-visual-container.is-collapsed .wen-yaml-fade{display:block;position:absolute;bottom:33px;left:0;right:0;height:60px;background:linear-gradient(transparent,var(--wen-bg));pointer-events:none;z-index:5}.wen-yaml-expand-btn{display:none;width:100%;background:var(--wen-surface);border:none;border-top:1px solid var(--wen-border);padding:.5rem;color:var(--wen-text-muted);cursor:pointer;font-size:.8rem;text-align:center;font-weight:600;transition:background .15s;border-bottom-left-radius:calc(var(--wen-radius) - 1px);border-bottom-right-radius:calc(var(--wen-radius) - 1px)}.wen-yaml-expand-btn:hover{color:var(--wen-text-main);background:var(--wen-border)}.wen-yaml-visual-container.needs-collapse .wen-yaml-expand-btn{display:block}.wen-yaml-raw-input{width:100%;min-height:150px;border:1px solid var(--wen-border);border-radius:var(--wen-radius-sm);padding:.75rem;font-family:var(--wen-font-mono);font-size:.9rem;color:var(--wen-text-main);background:var(--wen-surface);resize:vertical;outline:0}.wen-yaml-error-state{color:var(--wen-danger);background:#fef2f2;border-top:1px solid #fecaca;font-size:.9rem}.wen-type-array,.wen-type-object{display:flex;flex-direction:column;width:100%;background:rgba(0,0,0,.02);border-radius:var(--wen-radius-sm);padding:.5rem;border:1px solid rgba(0,0,0,.05)}.wen-array-item,.wen-row{display:flex;flex-direction:column;margin-bottom:.5rem;transition:background .15s ease;border-radius:var(--wen-radius-sm)}.wen-row-top{display:flex;align-items:flex-start;width:100%;padding:.2rem}.wen-array-item:hover>.wen-row-top,.wen-row:hover>.wen-row-top{background:var(--wen-surface);border-radius:var(--wen-radius-sm)}.wen-key-wrap{display:flex;align-items:baseline;width:140px;flex-shrink:0;padding:0}.wen-key,.wen-val{padding:0;margin:0;font-size:.9rem;font-family:var(--wen-font-sans);line-height:1.5;border:none;background:0 0;outline:0}.wen-key{width:100%;font-weight:600;color:var(--wen-text-muted)}.wen-val{flex-grow:1;color:var(--wen-text-main);resize:none}.wen-colon{margin:0 .5rem 0 0;padding:0;color:var(--wen-text-muted);font-weight:700;font-size:.9rem;line-height:1.5}.wen-key::placeholder,.wen-val::placeholder{font-style:italic;opacity:.6;font-weight:400}.wen-key:focus{color:var(--wen-text-main)}.wen-val-wrap{flex-grow:1;min-width:0;display:flex;align-items:flex-start}.wen-complex-wrap{padding-left:1rem;width:100%;margin-top:.25rem}.wen-type-primitive{display:flex;align-items:flex-start;gap:.5rem;width:100%}.wen-type-controls{display:flex;gap:.25rem;opacity:0;transition:opacity .2s}.wen-array-item:hover .wen-type-controls,.wen-row:hover .wen-type-controls{opacity:1}.wen-type-controls button{background:var(--wen-bg);border:1px solid var(--wen-border);border-radius:var(--wen-radius-sm);cursor:pointer;padding:.2rem .4rem;font-size:.8rem;color:var(--wen-text-muted)}.wen-type-controls button:hover{background:var(--wen-surface-hover);color:var(--wen-text-main)}.wen-bullet{color:var(--wen-text-muted);font-weight:700;padding-top:.2rem;width:24px;text-align:center}.wen-btn-delete{background:0 0;border:none;color:var(--wen-text-muted);font-size:1.25rem;cursor:pointer;opacity:0;padding:0 .5rem;margin-left:auto}.wen-array-item:hover>.wen-row-top>.wen-btn-delete,.wen-row:hover>.wen-row-top>.wen-btn-delete{opacity:1}.wen-btn-delete:hover{color:var(--wen-danger)}.wen-btn-add{background:0 0;border:1px dashed var(--wen-border);color:var(--wen-text-muted);cursor:pointer;text-align:left;font-weight:500;padding:.4rem .75rem;font-family:var(--wen-font-sans);transition:all .15s ease;border-radius:var(--wen-radius-sm);font-size:.85rem;margin-top:.25rem;width:100%}.wen-btn-add:hover{color:var(--wen-text-main);background:var(--wen-surface);border-color:#cbd5e1}.wen-component-block *,.wen-component-block ::after,.wen-component-block ::before{box-sizing:border-box}.wen-component-block{border:2px solid var(--wen-accent);border-radius:var(--wen-radius);margin:1.5rem 0;background:var(--wen-bg)}.wen-component-header{display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid var(--wen-accent);padding:.5rem 1rem;background:var(--wen-accent);color:var(--wen-accent-text);border-top-left-radius:calc(var(--wen-radius) - 2px);border-top-right-radius:calc(var(--wen-radius) - 2px)}.wen-component-title{font-size:.85rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em}.wen-component-toggle-btn{background:var(--wen-bg);border:none;color:var(--wen-text-main);cursor:pointer;font-size:.75rem;padding:.25rem .6rem;border-radius:var(--wen-radius-sm);font-weight:600}.wen-component-view-raw,.wen-component-view-visual{display:none;padding:1rem}.wen-component-view-raw.active,.wen-component-view-visual.active{display:block}.wen-component-raw-input{width:100%;min-height:200px;border:1px solid var(--wen-border);border-radius:var(--wen-radius-sm);padding:.75rem;font-family:var(--wen-font-mono);font-size:.9rem;background:#1e1e1e;color:#d4d4d4;resize:vertical;outline:0}.wen-wireframe{border:1px dashed var(--wen-border);border-radius:var(--wen-radius-sm);background:var(--wen-surface);padding:1rem}.wen-wireframe-header{color:var(--wen-text-main);font-size:1.1rem;margin-bottom:.75rem;font-family:var(--wen-font-mono)}.wen-prop-val{color:var(--wen-accent)}.wen-component-error{color:var(--wen-danger);font-weight:700}.wen-wireframe-props{padding:.5rem;background:var(--wen-surface);border-bottom:1px solid var(--wen-border);display:flex;flex-wrap:wrap;gap:.5rem}.wen-wireframe-prop{background:var(--wen-bg);border:1px solid var(--wen-border);padding:.2rem .5rem;border-radius:4px;font-size:.8rem;font-family:var(--wen-font-mono);display:flex;align-items:center;gap:.25rem}.wen-prop-key{color:#8b5cf6;font-weight:700}.wen-prop-val-input{background:0 0;border:none;border-bottom:1px dashed #cbd5e1;color:#10b981;font-family:inherit;font-size:inherit;outline:0;min-width:60px;padding:0 .2rem;transition:border-color .2s}.wen-prop-val-input:focus{border-bottom-color:#10b981}.wen-wireframe-content{padding:1rem}.wen-wireframe-preview-box{background:#fff;border:1px solid #cbd5e1;border-radius:var(--wen-radius-sm);padding:1rem;margin-bottom:.75rem;max-height:250px;overflow-y:auto;box-shadow:inset 0 2px 4px rgba(0,0,0,.02)}.wen-wireframe-preview{font-size:.9rem;color:#334155;font-family:var(--wen-font-sans);line-height:1.5}.wen-wireframe-preview h1,.wen-wireframe-preview h2,.wen-wireframe-preview h3,.wen-wireframe-preview h4{margin-top:0;margin-bottom:.5rem;font-weight:600;line-height:1.2}.wen-wireframe-preview h1{font-size:1.4em}.wen-wireframe-preview h2{font-size:1.2em;border-bottom:1px solid #e2e8f0;padding-bottom:.2rem}.wen-wireframe-preview h3{font-size:1.1em}.wen-wireframe-preview p{margin-top:0;margin-bottom:.75rem}.wen-wireframe-preview p:last-child{margin-bottom:0}.wen-wireframe-preview blockquote{border-left:3px solid #cbd5e1;margin:0;padding-left:1rem;color:#64748b}.wen-wireframe-edit-btn{background:#3b82f6;color:#fff;border:none;border-radius:var(--wen-radius-sm);padding:.5rem 1rem;font-size:.85rem;font-weight:700;cursor:pointer;transition:background .15s;width:100%;text-align:left}.wen-wireframe-edit-btn:hover{background:#2563eb}.wen-preview-tag{font-family:var(--wen-font-mono);color:#8b5cf6;font-weight:700;font-size:.8rem;background:rgba(139,92,246,.1);display:inline-block;padding:.1rem .4rem;border-radius:4px;margin:.25rem 0}.wen-preview-md p:first-child{margin-top:0}.wen-preview-md p:last-child{margin-bottom:0}.wen-mermaid-block{border:2px solid #0d9488;border-radius:var(--wen-radius);margin:1.5rem 0;background:var(--wen-bg);box-sizing:border-box}.wen-mermaid-block *,.wen-mermaid-block ::after,.wen-mermaid-block ::before{box-sizing:border-box}.wen-mermaid-header{display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid #0d9488;padding:.5rem 1rem;background:#0d9488;color:#fff;border-top-left-radius:calc(var(--wen-radius) - 2px);border-top-right-radius:calc(var(--wen-radius) - 2px)}.wen-mermaid-title{font-size:.85rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em}.wen-mermaid-toggle-btn{background:var(--wen-bg);border:none;color:var(--wen-text-main);cursor:pointer;font-size:.75rem;padding:.25rem .6rem;border-radius:var(--wen-radius-sm);font-weight:600;transition:background .15s}.wen-mermaid-toggle-btn:hover{background:var(--wen-surface-hover)}.wen-mermaid-view-raw,.wen-mermaid-view-visual{display:none!important;padding:1rem}.wen-mermaid-view-raw.active,.wen-mermaid-view-visual.active{display:block!important}.wen-mermaid-view-visual{text-align:center;overflow-x:auto;background:var(--wen-surface);border-bottom-left-radius:var(--wen-radius);border-bottom-right-radius:var(--wen-radius);color:#1f2937!important}.wen-mermaid-view-visual svg{max-width:100%;height:auto!important;color:#1f2937}.wen-mermaid-raw-input{width:100%;min-height:250px;border:1px solid var(--wen-border);border-radius:var(--wen-radius-sm);padding:.75rem;font-family:var(--wen-font-mono);font-size:.9rem;background:#1e1e1e;color:#d4d4d4;resize:vertical;outline:0}.wen-mermaid-error{color:var(--wen-danger);font-family:var(--wen-font-mono);font-size:.85rem;text-align:left;background:#fef2f2;padding:1rem;border-radius:var(--wen-radius-sm);border-left:4px solid var(--wen-danger);white-space:pre-wrap}.wen-chart-block *,.wen-chart-block ::after,.wen-chart-block ::before{box-sizing:border-box}.wen-chart-block{border:2px solid #8250df;border-radius:var(--wen-radius);margin:1.5rem 0;background:var(--wen-bg);box-sizing:border-box}.wen-chart-header{display:flex;justify-content:space-between;align-items:center;border-bottom:2px solid #8250df;padding:.5rem 1rem;background:#8250df;color:#fff;border-top-left-radius:calc(var(--wen-radius) - 2px);border-top-right-radius:calc(var(--wen-radius) - 2px)}.wen-chart-title{font-size:.85rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em}.wen-chart-toggle-btn{background:var(--wen-bg);border:none;color:var(--wen-text-main);cursor:pointer;font-size:.75rem;padding:.25rem .6rem;border-radius:var(--wen-radius-sm);font-weight:600;transition:background .15s}.wen-chart-toggle-btn:hover{background:var(--wen-surface-hover)}.wen-chart-view-raw,.wen-chart-view-visual{display:none!important;padding:1rem}.wen-chart-view-raw.active,.wen-chart-view-visual.active{display:block!important}.wen-chart-raw-input{width:100%;min-height:200px;border:1px solid var(--wen-border);border-radius:var(--wen-radius-sm);padding:.75rem;font-family:var(--wen-font-mono);font-size:.9rem;background:#1e1e1e;color:#d4d4d4;resize:vertical;outline:0;white-space:pre}.wen-chart-error{color:var(--wen-danger);font-family:var(--wen-font-mono);font-size:.85rem;background:#fef2f2;padding:1rem;border-radius:var(--wen-radius-sm);border-left:4px solid var(--wen-danger)}
@@ -0,0 +1,96 @@
1
+ import{Editor as Y}from"https://esm.sh/@tiptap/core@2.2.4";import K from"https://esm.sh/@tiptap/starter-kit@2.2.4";import{Markdown as X}from"https://esm.sh/tiptap-markdown@0.8.9";import Q from"https://esm.sh/@tiptap/extension-link@2.2.4";import J from"https://esm.sh/@tiptap/extension-image@2.2.4";import _ from"https://esm.sh/@tiptap/extension-code-block-lowlight@2.2.4";import{createLowlight as ee,common as te}from"https://esm.sh/lowlight@3.1.0";import ne from"https://esm.sh/@tiptap/extension-table@2.2.4";import ie from"https://esm.sh/@tiptap/extension-table-row@2.2.4";import se from"https://esm.sh/@tiptap/extension-table-header@2.2.4";import re from"https://esm.sh/@tiptap/extension-table-cell@2.2.4";import ae from"https://esm.sh/@tiptap/extension-task-list@2.2.4";import oe from"https://esm.sh/@tiptap/extension-task-item@2.2.4";import{Extension as le}from"https://esm.sh/@tiptap/core@2.2.4";import{Plugin as ce,PluginKey as de}from"https://esm.sh/@tiptap/pm@2.2.4/state";import{Decoration as D,DecorationSet as me}from"https://esm.sh/@tiptap/pm@2.2.4/view";import G from"https://esm.sh/dompurify@3.1.6";function I(q){return String(q??"").replace(/&/g,"&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;").replace(/"/g,"&quot;").replace(/'/g,"&#39;")}function j(q){return G.sanitize(q)}var ue=ee(te),he=le.create({name:"githubAlerts",addProseMirrorPlugins(){return[new ce({key:new de("githubAlerts"),props:{decorations(q){let e=[],{doc:r}=q;return r.descendants((a,t)=>{if(a.type.name==="blockquote"){let n=a.firstChild;if(n&&n.type.name==="paragraph"){let s=n.textContent.match(/^\[!(NOTE|TIP|IMPORTANT|WARNING|CAUTION)\]/i);if(s){let c=s[1].toLowerCase();e.push(D.node(t,t+a.nodeSize,{class:`wen-github-alert wen-github-alert-${c}`}));let E=t+2,A=E+s[0].length;e.push(D.inline(E,A,{class:`wen-github-alert-badge wen-github-alert-badge-${c}`}))}}}}),me.create(r,e)}}})]}}),pe=_.extend({addOptions(){return{...this.parent?.(),blockViews:{},lowlight:ue}},addNodeView(){return({node:q,getPos:e,editor:r})=>{let a=q.attrs.language,t=this.options.blockViews[a];if(t)return new t(q,e,r);let n=document.createElement("pre"),l=document.createElement("code");return a&&(l.className=`language-${a}`),n.appendChild(l),{dom:n,contentDOM:l}}}}),R=class q{constructor(e){this.container=e.element,this.blockViews=e.blockViews||{},this.useFrontmatter=e.useFrontmatter!==!1,this.useNativeComponents=e.useNativeComponents!==!1,this.unsafe=e.unsafe===!0,this.wrapper=document.createElement("div"),this.wrapper.className="wen-editor-wrapper",this.toolbar=document.createElement("div"),this.toolbar.className="wen-toolbar",this.editorNode=document.createElement("div"),this.wrapper.appendChild(this.toolbar),this.wrapper.appendChild(this.editorNode),this.container.appendChild(this.wrapper);let r=this.importMarkdown(e.initialMarkdown||"");this.editor=new Y({element:this.editorNode,extensions:[K.configure({codeBlock:!1}),pe.configure({blockViews:this.blockViews}),he,X,J,Q.configure({openOnClick:!1}),ne.configure({resizable:!0,HTMLAttributes:{class:"wen-table"}}),ie,se,re,ae,oe.configure({nested:!0})],content:r,editorProps:{attributes:{class:"wen-editor-root"}},onTransaction:()=>this.updateToolbarStates()}),this.editor.wenEditorInstance=this,this.buildToolbar()}importMarkdown(e){let r=e;if(this.useFrontmatter&&(r=r.replace(/^---\r?\n([\s\S]*?)\r?\n---\r?\n/,"```yaml\n$1\n```\n\n")),this.useNativeComponents){let a=r.split(/(^```[\s\S]*?^```\r?\n?)/m);for(let t=0;t<a.length;t++)if(t%2===0){let n=a[t],l=/^[ \t]*<([a-zA-Z0-9-]+)[^>]*>[\s\S]*?<\/\1>[ \t]*/gm;n=n.replace(l,c=>"\n```component\n"+c.trim()+"\n```\n");let s=/^[ \t]*<([a-zA-Z0-9-]+)[^>]*\/>[ \t]*/gm;n=n.replace(s,c=>"\n```component\n"+c.trim()+"\n```\n"),a[t]=n}r=a.join("")}return r}loadContent(e){let r=this.importMarkdown(e);this.editor.commands.setContent(r)}exportMarkdown(){let e=this.editor.storage.markdown.getMarkdown();if(this.useFrontmatter&&(e=e.replace(/^```yaml\r?\n([\s\S]*?)\r?\n```\r?\n?/,`---
2
+ $1
3
+ ---
4
+ `)),this.useNativeComponents){let r=/```component\r?\n([ \t]*<(?:[a-zA-Z0-9-]+)[\s\S]*?>)[ \t]*\r?\n```\r?\n?/gm;e=e.replace(r,`$1
5
+ `)}return e}downloadMarkdown(e="wen-document.md"){let r=this.exportMarkdown(),a=new Blob([r],{type:"text/markdown;charset=utf-8"}),t=URL.createObjectURL(a),n=document.createElement("a");n.href=t,n.download=e,document.body.appendChild(n),n.click(),document.body.removeChild(n),URL.revokeObjectURL(t)}buildToolbar(){let e=(a,t,n=null,l=null)=>{let s=document.createElement("button");return s.className="wen-toolbar-btn",s.innerHTML=a,s.addEventListener("click",()=>{t(),this.editor.view.focus()}),n&&(s.isActiveCheck=n),l&&(s.isDisabledCheck=l),this.toolbar.appendChild(s),s},r=()=>{let a=document.createElement("div");a.className="wen-toolbar-divider",this.toolbar.appendChild(a)};e("<b>B</b>",()=>this.editor.chain().focus().toggleBold().run(),()=>this.editor.isActive("bold")),e("<i>I</i>",()=>this.editor.chain().focus().toggleItalic().run(),()=>this.editor.isActive("italic")),e("<s>S</s>",()=>this.editor.chain().focus().toggleStrike().run(),()=>this.editor.isActive("strike")),r(),e("\xB6 Text",()=>this.editor.chain().focus().setParagraph().run(),()=>this.editor.isActive("paragraph")),e("H1",()=>this.editor.chain().focus().toggleHeading({level:1}).run(),()=>this.editor.isActive("heading",{level:1})),e("H2",()=>this.editor.chain().focus().toggleHeading({level:2}).run(),()=>this.editor.isActive("heading",{level:2})),e("H3",()=>this.editor.chain().focus().toggleHeading({level:3}).run(),()=>this.editor.isActive("heading",{level:3})),e("H4",()=>this.editor.chain().focus().toggleHeading({level:4}).run(),()=>this.editor.isActive("heading",{level:4})),r(),e("\u2022 List",()=>this.editor.chain().focus().toggleBulletList().run(),()=>this.editor.isActive("bulletList")),e("1. List",()=>this.editor.chain().focus().toggleOrderedList().run(),()=>this.editor.isActive("orderedList")),e("\u2611\uFE0F Task",()=>this.editor.chain().focus().toggleTaskList().run(),()=>this.editor.isActive("taskList")),e('" Quote',()=>this.editor.chain().focus().toggleBlockquote().run(),()=>this.editor.isActive("blockquote")),e("\u{1F4E2} Alert",()=>{this.editor.chain().focus().insertContent("<blockquote><p>[!NOTE]<br>Your message here...</p></blockquote>").run()}),r(),e("\u{1F517} Link",()=>{let a=this.editor.getAttributes("link").href;this.showModal("Insert Link","URL",a,t=>{t!==null&&(t===""?this.editor.chain().focus().extendMarkRange("link").unsetLink().run():this.editor.chain().focus().extendMarkRange("link").setLink({href:t}).run())})},()=>this.editor.isActive("link")),e("\u{1F5BC}\uFE0F Image",()=>{let t=this.editor.getAttributes("image").src||"";this.showModal(t?"Edit Image":"Insert Image","Image URL",t,n=>{n&&this.editor.chain().focus().setImage({src:n}).run()})},()=>this.editor.isActive("image")),r(),e("\u{1F4CA} Table",()=>this.editor.chain().focus().insertTable({rows:3,cols:3,withHeaderRow:!0}).run()),e("+ Row",()=>this.editor.chain().focus().addRowAfter().run(),null,()=>!this.editor.can().addRowAfter()),e("+ Col",()=>this.editor.chain().focus().addColumnAfter().run(),null,()=>!this.editor.can().addColumnAfter()),e("- Row",()=>this.editor.chain().focus().deleteRow().run(),null,()=>!this.editor.can().deleteRow()),e("- Col",()=>this.editor.chain().focus().deleteColumn().run(),null,()=>!this.editor.can().deleteColumn()),e("x Table",()=>this.editor.chain().focus().deleteTable().run(),null,()=>!this.editor.can().deleteTable()),r(),e("\u{1F4BE} Save",()=>{this.downloadMarkdown("wen-document.md")})}updateToolbarStates(){this.toolbar.querySelectorAll(".wen-toolbar-btn").forEach(e=>{e.isActiveCheck&&(e.isActiveCheck()?e.classList.add("is-active"):e.classList.remove("is-active")),e.isDisabledCheck&&(e.disabled=e.isDisabledCheck())})}showModal(e,r,a,t){let n=document.createElement("div");n.className="wen-modal-overlay",n.innerHTML=`
6
+ <div class="wen-modal">
7
+ <strong>${I(e)}</strong>
8
+ <input type="text" placeholder="${I(r)}" value="${I(a||"")}" />
9
+ <div class="wen-modal-actions">
10
+ <button class="wen-modal-cancel">Cancel</button>
11
+ <button class="wen-modal-submit">Save</button>
12
+ </div>
13
+ </div>
14
+ `,document.body.appendChild(n);let l=n.querySelector("input");l.focus();let s=c=>{document.body.removeChild(n),t(c)};n.querySelector(".wen-modal-cancel").addEventListener("click",()=>s(null)),n.querySelector(".wen-modal-submit").addEventListener("click",()=>s(l.value)),l.addEventListener("keydown",c=>{c.key==="Enter"&&s(l.value),c.key==="Escape"&&s(null)})}showRichModal(e,r,a){let t=document.createElement("div");t.className="wen-rich-modal-overlay",t.innerHTML=`
15
+ <div class="wen-rich-modal">
16
+ <div class="wen-rich-modal-header">
17
+ <strong>Editing Content: &lt;${I(e)}&gt;</strong>
18
+ <div>
19
+ <button class="wen-modal-cancel">Cancel</button>
20
+ <button class="wen-modal-submit">Save Changes</button>
21
+ </div>
22
+ </div>
23
+ <div class="wen-rich-modal-body" id="modal-editor-container"></div>
24
+ </div>
25
+ `,document.body.appendChild(t);let n=new q({element:t.querySelector("#modal-editor-container"),blockViews:this.blockViews,useFrontmatter:!1,useNativeComponents:this.useNativeComponents,unsafe:this.unsafe,initialMarkdown:r}),l=s=>{let c=s?n.exportMarkdown():null;n.editor.destroy(),document.body.removeChild(t),s&&a(c)};t.querySelector(".wen-modal-cancel").addEventListener("click",()=>l(!1)),t.querySelector(".wen-modal-submit").addEventListener("click",()=>l(!0))}};import F from"https://esm.sh/js-yaml@4.1.0";var B=class{constructor(e,r,a){this.node=e,this.getPos=r,this.editor=a,this.dom=document.createElement("div"),this.dom.className="wen-yaml-block",this.dom.contentEditable="false",this.dom.innerHTML=`
26
+ <div class="wen-yaml-header">
27
+ <span class="wen-yaml-title">\u{1F5C2}\uFE0F Properties</span>
28
+ <button class="wen-yaml-toggle-btn" data-state="visual">View Raw</button>
29
+ </div>
30
+ <div class="wen-yaml-visual-container">
31
+ <div class="wen-yaml-view-visual active"></div>
32
+ <div class="wen-yaml-fade"></div>
33
+ <button class="wen-yaml-expand-btn">\u25BC Show More</button>
34
+ </div>
35
+ <div class="wen-yaml-view-raw"><textarea class="wen-yaml-raw-input"></textarea></div>
36
+ <div class="wen-yaml-error-state hidden"><span class="wen-yaml-error-msg"></span></div>
37
+ `;let t=this.dom.querySelector(".wen-yaml-toggle-btn"),n=this.dom.querySelector(".wen-yaml-visual-container"),l=this.dom.querySelector(".wen-yaml-view-visual"),s=this.dom.querySelector(".wen-yaml-expand-btn"),c=this.dom.querySelector(".wen-yaml-view-raw"),E=this.dom.querySelector(".wen-yaml-raw-input"),A=this.dom.querySelector(".wen-yaml-error-state"),h=this.dom.querySelector(".wen-yaml-error-msg");E.value=this.node.textContent;let L=!1,f=!1,m=()=>{l.scrollHeight>220?(n.classList.add("needs-collapse"),n.classList.toggle("is-collapsed",!f)):n.classList.remove("needs-collapse","is-collapsed")};s.addEventListener("click",()=>{f=!f,n.classList.toggle("is-collapsed",!f),s.innerText=f?"\u25B2 Show Less":"\u25BC Show More"});let p=i=>{if(i!==this.node.textContent&&typeof this.getPos=="function"){let o=this.editor.state.tr,u=this.getPos()+1,x=u+this.node.nodeSize-2;i?o.replaceWith(u,x,this.editor.schema.text(i)):o.delete(u,x),this.editor.view.dispatch(o)}},N=i=>i==="true"?!0:i==="false"?!1:i==="null"?null:!isNaN(i)&&i.trim()!==""?Number(i):i,M=i=>{if(i.classList.contains("wen-type-object")){let o={};return i.querySelectorAll(":scope > .wen-row-list > .wen-row").forEach(u=>{let x=u.querySelector(":scope > .wen-row-top > .wen-key-wrap > .wen-key").value.trim(),v=u.querySelector(":scope > .wen-row-top > .wen-val-wrap > div")||u.querySelector(":scope > .wen-complex-wrap > div");x&&v&&(o[x]=M(v))}),o}if(i.classList.contains("wen-type-array")){let o=[];return i.querySelectorAll(":scope > .wen-array-list > .wen-array-item").forEach(u=>{let x=u.querySelector(":scope > .wen-row-top > .wen-val-wrap > div")||u.querySelector(":scope > .wen-complex-wrap > div");x&&o.push(M(x))}),o}return i.classList.contains("wen-type-primitive")?N(i.querySelector(".wen-val").value):""},T=()=>{let i=M(l.firstElementChild),o=Object.keys(i).length?F.dump(i):"";E.value=o,L=!0,p(o),L=!1,m()},V=i=>{let o=v=>{let d=document.createElement("div");d.className="wen-type-primitive",d.innerHTML=`
38
+ <textarea class="wen-val" rows="1" placeholder="Empty value...">${I(v??"")}</textarea>
39
+ <div class="wen-type-controls">
40
+ <button class="wen-make-obj" title="Add Section">\u{1F4C2}</button>
41
+ <button class="wen-make-arr" title="Add List">\u{1F4CB}</button>
42
+ </div>
43
+ `;let C=d.querySelector(".wen-val"),S=()=>{C.style.height="auto",C.style.height=C.scrollHeight+"px"};C.addEventListener("input",()=>{S(),T()}),setTimeout(S,0);let w=g=>{let y=d.closest(".wen-row")||d.closest(".wen-array-item");y?(y.classList.add("has-complex"),y.querySelector(".wen-complex-wrap").appendChild(g),d.remove()):d.replaceWith(g),T()};return d.querySelector(".wen-make-obj").addEventListener("click",()=>w(x({"":""}))),d.querySelector(".wen-make-arr").addEventListener("click",()=>w(u([""]))),d},u=v=>{let d=document.createElement("div");d.className="wen-type-array";let C=document.createElement("div");C.className="wen-array-list";let S=g=>{let y=typeof g=="object"&&g!==null,k=document.createElement("div");k.className=`wen-array-item ${y?"has-complex":""}`,k.innerHTML=`
44
+ <div class="wen-row-top">
45
+ <span class="wen-bullet">-</span>
46
+ <div class="wen-val-wrap"></div>
47
+ <button class="wen-btn-delete" title="Remove Item">\xD7</button>
48
+ </div>
49
+ <div class="wen-complex-wrap"></div>
50
+ `,(y?k.querySelector(".wen-complex-wrap"):k.querySelector(".wen-val-wrap")).appendChild(y?Array.isArray(g)?u(g):x(g):o(g)),k.querySelector(".wen-btn-delete").addEventListener("click",()=>{k.remove(),T()}),C.appendChild(k)};v.forEach(S);let w=document.createElement("button");return w.className="wen-btn-add",w.innerText="+ Add list item",w.addEventListener("click",()=>{S(""),T()}),d.appendChild(C),d.appendChild(w),d},x=v=>{let d=document.createElement("div");d.className="wen-type-object";let C=document.createElement("div");C.className="wen-row-list";let S=(g,y)=>{let k=typeof y=="object"&&y!==null,b=document.createElement("div");b.className=`wen-row ${k?"has-complex":""}`,b.innerHTML=`
51
+ <div class="wen-row-top">
52
+ <div class="wen-key-wrap"><input type="text" class="wen-key" value="${I(g)}" placeholder="Label..." /><span class="wen-colon">:</span></div>
53
+ <div class="wen-val-wrap"></div>
54
+ <button class="wen-btn-delete" title="Remove Property">\xD7</button>
55
+ </div>
56
+ <div class="wen-complex-wrap"></div>
57
+ `,(k?b.querySelector(".wen-complex-wrap"):b.querySelector(".wen-val-wrap")).appendChild(k?Array.isArray(y)?u(y):x(y):o(y)),b.querySelector(".wen-key").addEventListener("input",T),b.querySelector(".wen-btn-delete").addEventListener("click",()=>{b.remove(),T()}),C.appendChild(b)};Object.keys(v).forEach(g=>S(g,v[g]));let w=document.createElement("button");return w.className="wen-btn-add",w.innerText="+ Add property",w.addEventListener("click",()=>{S("",""),T()}),d.appendChild(C),d.appendChild(w),d};return x(i)},$=()=>{l.innerHTML="";let i={};try{i=F.load(E.value)||{},A.classList.remove("active")}catch(o){h.innerText="YAML Error: "+o.message,A.classList.add("active");return}(typeof i!="object"||i===null||Array.isArray(i))&&(i={"":i}),l.appendChild(V(i)),setTimeout(m,0)};t.addEventListener("click",()=>{t.getAttribute("data-state")==="visual"?(n.style.display="none",c.classList.add("active"),t.setAttribute("data-state","raw"),t.innerText="View UI"):($(),A.classList.contains("active")||(c.classList.remove("active"),n.style.display="block",t.setAttribute("data-state","visual"),t.innerText="View Raw"))}),E.addEventListener("input",()=>{p(E.value)}),$(),this.update=i=>i.type.name!=="codeBlock"||i.attrs.language!=="yaml"?!1:(this.node.textContent!==i.textContent&&(this.node=i,E.value=this.node.textContent,L||$()),!0),this.stopEvent=()=>!0}};import{marked as we}from"https://esm.sh/marked@12.0.1";var U=class{constructor(e,r,a){this.node=e,this.getPos=r,this.editor=a,this.dom=document.createElement("div"),this.dom.className="wen-component-block",this.dom.contentEditable="false",this.dom.innerHTML=`
58
+ <div class="wen-component-header">
59
+ <span class="wen-component-title">\u{1F9E9} Component Wireframe</span>
60
+ <button class="wen-component-toggle-btn" data-state="visual">View Raw XML</button>
61
+ </div>
62
+ <div class="wen-component-view-visual active"></div>
63
+ <div class="wen-component-view-raw"><textarea class="wen-component-raw-input"></textarea></div>
64
+ `;let t=this.dom.querySelector(".wen-component-toggle-btn"),n=this.dom.querySelector(".wen-component-view-visual"),l=this.dom.querySelector(".wen-component-view-raw"),s=this.dom.querySelector(".wen-component-raw-input");s.value=this.node.textContent;let c=!1,E=h=>{if(h!==this.node.textContent&&typeof this.getPos=="function"){let L=this.editor.state.tr,f=this.getPos()+1,m=f+this.node.nodeSize-2;h?L.replaceWith(f,m,this.editor.schema.text(h)):L.delete(f,m),this.editor.view.dispatch(L)}},A=()=>{n.innerHTML="";let h=this.editor.wenEditorInstance?.unsafe===!0,L=s.value.trim();L=L.replace(/^```[a-zA-Z0-9-]*\r?\n/,"").replace(/\r?\n```$/,"").trim();let f=/^<([a-zA-Z0-9-]+)\s*([^>]*?)(?:(?:>([\s\S]*)<\/\1>)|(?:\/?>))$/,m=L.match(f);if(!m){n.innerHTML='<div class="wen-component-error">Syntax Error: Cannot parse component structure.</div>';return}let p=m[1],N=m[2].trim(),M=m[3],T=M===void 0&&L.endsWith("/>"),V=[],$=/([a-zA-Z0-9_]+)=(?:'([^']*)'|"([^"]*)"|\{([^}]*)\})/g,i;for(;(i=$.exec(N))!==null;)V.push({name:i[1],value:i[2]||i[3]||i[4]||""});let o=()=>{let v=V.map(S=>`${S.name}="${S.value}"`).join(" "),d=v?" "+v:"",C=T?`<${p}${d} />`:`<${p}${d}>
65
+ ${M}
66
+ </${p}>`;s.value=C,c=!0,E(C),c=!1},u=document.createElement("div");u.className="wen-wireframe";let x=document.createElement("div");if(x.className="wen-wireframe-header",x.innerHTML=`<strong>${p}</strong> ${T?"<em>(Self-Closing)</em>":""}`,u.appendChild(x),V.length>0){let v=document.createElement("div");v.className="wen-wireframe-props",V.forEach((d,C)=>{let S=document.createElement("span");S.className="wen-wireframe-prop",S.innerHTML=`<span class="wen-prop-key">${d.name}</span> = `;let w=document.createElement("input");w.type="text",w.className="wen-prop-val-input",w.value=d.value,w.addEventListener("input",g=>{V[C].value=g.target.value,o()}),S.appendChild(w),v.appendChild(S)}),u.appendChild(v)}if(!T){let v=document.createElement("div");v.className="wen-wireframe-content";let d="<em>Empty content</em>";if((M||"").trim())try{let w=new DOMParser().parseFromString(M,"text/html"),g=b=>{if(b.nodeType===1){let H=b.localName;return b.hasChildNodes()&&b.childNodes.length>0?`<div class="wen-preview-tag">&lt;${H}&gt;</div>
67
+ ${y(b.childNodes)}
68
+ <div class="wen-preview-tag">&lt;/${H}&gt;</div>
69
+ `:`<div class="wen-preview-tag">&lt;${H}/&gt;</div>
70
+ `}else if(b.nodeType===3){let H=b.textContent.replace(/^ +/gm,"");return H.trim()?`<div class="wen-preview-md">${we.parse(H)}</div>`:""}return""},y=b=>{let H="";for(let P=0;P<b.length;P++)H+=g(b[P]);return H},k=y(w.body.childNodes);k.trim()&&(d=k)}catch{d="<em>Preview unavailable</em>"}let C=h?d:j(d);v.innerHTML=`
71
+ <div class="wen-wireframe-preview-box">
72
+ <div class="wen-wireframe-preview">${C}</div>
73
+ </div>
74
+ <button class="wen-wireframe-edit-btn">\u270F\uFE0F Edit in WYSIWYG</button>
75
+ `;let S=w=>{if(!w)return"";let g=w.split(`
76
+ `),y=1/0;return g.forEach(k=>{if(k.trim().length>0){let b=k.match(/^[ \t]*/);if(b){let H=b[0].length;H<y&&(y=H)}}}),y===1/0||y===0?w:g.map(k=>k.trim().length===0?k:k.substring(y)).join(`
77
+ `)};v.querySelector(".wen-wireframe-edit-btn").addEventListener("click",()=>{let w=S(M||"");this.editor.wenEditorInstance.showRichModal(p,w,g=>{M=`
78
+ `+g+`
79
+ `,o(),A()})}),u.appendChild(v)}n.appendChild(u)};t.addEventListener("click",()=>{t.getAttribute("data-state")==="visual"?(n.classList.remove("active"),l.classList.add("active"),t.setAttribute("data-state","raw"),t.innerText="View UI"):(A(),l.classList.remove("active"),n.classList.add("active"),t.setAttribute("data-state","visual"),t.innerText="View Raw XML")}),s.addEventListener("input",()=>{c=!0,E(s.value),c=!1}),A(),this.update=h=>h.type.name!=="codeBlock"||!["xml","component","jsx"].includes(h.attrs.language)?!1:(this.node.textContent!==h.textContent&&(this.node=h,s.value=this.node.textContent,c||A()),!0),this.stopEvent=()=>!0}};import z from"https://esm.sh/mermaid@10.9.1";z.initialize({startOnLoad:!1,theme:"neutral",securityLevel:"strict"});var O=class{constructor(e,r,a){this.node=e,this.getPos=r,this.editor=a,this.id="mermaid-"+Math.random().toString(36).substr(2,9),this.dom=document.createElement("div"),this.dom.className="wen-mermaid-block",this.dom.contentEditable="false",this.dom.innerHTML=`
80
+ <div class="wen-mermaid-header">
81
+ <span class="wen-mermaid-title">\u{1F9DC}\u200D\u2640\uFE0F Mermaid Diagram</span>
82
+ <button class="wen-mermaid-toggle-btn" data-state="visual">Edit Chart</button>
83
+ </div>
84
+ <div class="wen-mermaid-view-visual active"></div>
85
+ <div class="wen-mermaid-view-raw"><textarea class="wen-mermaid-raw-input"></textarea></div>
86
+ `;let t=this.dom.querySelector(".wen-mermaid-toggle-btn"),n=this.dom.querySelector(".wen-mermaid-view-visual"),l=this.dom.querySelector(".wen-mermaid-view-raw"),s=this.dom.querySelector(".wen-mermaid-raw-input");s.value=this.node.textContent;let c=!1,E=h=>{if(h!==this.node.textContent&&typeof this.getPos=="function"){let L=this.editor.state.tr,f=this.getPos()+1,m=f+this.node.nodeSize-2;h?L.replaceWith(f,m,this.editor.schema.text(h)):L.delete(f,m),this.editor.view.dispatch(L)}},A=async()=>{n.innerHTML="";let h=s.value.trim();if(!h){n.innerHTML='<div class="wen-mermaid-empty">Empty diagram</div>';return}try{let L=this.editor.wenEditorInstance?.unsafe===!0;z.initialize({startOnLoad:!1,theme:"neutral",securityLevel:L?"loose":"strict"});let{svg:f}=await z.render(this.id,h);n.innerHTML=f}catch(L){n.innerHTML=`<div class="wen-mermaid-error"><strong>Syntax Error:</strong><br/>${I(L.message)}</div>`;let f=document.getElementById(this.id);f&&f.remove()}};t.addEventListener("click",()=>{t.getAttribute("data-state")==="visual"?(n.classList.remove("active"),l.classList.add("active"),t.setAttribute("data-state","raw"),t.innerText="View Chart"):(A(),l.classList.remove("active"),n.classList.add("active"),t.setAttribute("data-state","visual"),t.innerText="Edit Chart")}),s.addEventListener("input",()=>{c=!0,E(s.value),c=!1}),A(),this.update=h=>h.type.name!=="codeBlock"||h.attrs.language!=="mermaid"?!1:(this.node.textContent!==h.textContent&&(this.node=h,s.value=this.node.textContent,c||A()),!0),this.stopEvent=()=>!0}};import Z from"https://esm.sh/frappe-charts@1.6.2";var ve=Z.Chart||Z,W=class{constructor(e,r,a){this.node=e,this.getPos=r,this.editor=a,this.dom=document.createElement("div"),this.dom.className="wen-chart-block",this.dom.contentEditable="false",this.dom.innerHTML=`
87
+ <div class="wen-chart-header">
88
+ <span class="wen-chart-title">\u{1F4CA} Frappe Chart</span>
89
+ <button class="wen-chart-toggle-btn" data-state="visual">Edit Data</button>
90
+ </div>
91
+ <div class="wen-chart-view-visual active">
92
+ <div class="frappe-container"></div>
93
+ </div>
94
+ <div class="wen-chart-view-raw"><textarea class="wen-chart-raw-input"></textarea></div>
95
+ `;let t=this.dom.querySelector(".wen-chart-toggle-btn"),n=this.dom.querySelector(".wen-chart-view-visual"),l=this.dom.querySelector(".frappe-container"),s=this.dom.querySelector(".wen-chart-view-raw"),c=this.dom.querySelector(".wen-chart-raw-input");c.value=this.node.textContent;let E=!1,A=null,h=m=>{if(m!==this.node.textContent&&typeof this.getPos=="function"){let p=this.editor.state.tr,N=this.getPos()+1,M=N+this.node.nodeSize-2;m?p.replaceWith(N,M,this.editor.schema.text(m)):p.delete(N,M),this.editor.view.dispatch(p)}},L=m=>{let p=m.trim().split(`
96
+ `),N="bar",M="",T=0;for(let o=0;o<p.length;o++){let u=p[o].trim();if(u==="---"){T=o+1;break}u.toLowerCase().startsWith("type:")&&(N=u.split(":")[1].trim()),u.toLowerCase().startsWith("title:")&&(M=u.split(":")[1].trim())}T===0&&(T=0);let V=p[T].split(",").map(o=>o.trim()),$=[],i=V.slice(1).map(o=>({name:o,values:[]}));for(let o=T+1;o<p.length;o++){if(!p[o].trim())continue;let u=p[o].split(",").map(x=>x.trim());$.push(u[0]),u.slice(1).forEach((x,v)=>{i[v]&&i[v].values.push(Number(x)||0)})}return{title:M,type:N,data:{labels:$,datasets:i}}},f=()=>{try{let m=L(c.value);l.innerHTML="",A=new ve(l,{title:m.title,data:m.data,type:m.type,height:250,colors:["#8250df","#0d9488","#cf222e","#bf8700"]});let p=n.querySelector(".wen-chart-error");p&&p.remove(),l.style.display="block"}catch{l.style.display="none";let p=n.querySelector(".wen-chart-error");p||(p=document.createElement("div"),p.className="wen-chart-error",n.appendChild(p)),p.innerHTML="<strong>Data Parsing Error:</strong><br/>Ensure you have a header row and valid numbers."}};t.addEventListener("click",()=>{t.getAttribute("data-state")==="visual"?(n.classList.remove("active"),s.classList.add("active"),t.setAttribute("data-state","raw"),t.innerText="View Chart"):(f(),s.classList.remove("active"),n.classList.add("active"),t.setAttribute("data-state","visual"),t.innerText="Edit Data")}),c.addEventListener("input",()=>{E=!0,h(c.value),E=!1}),f(),this.update=m=>m.type.name!=="codeBlock"||m.attrs.language!=="chart"?!1:(this.node.textContent!==m.textContent&&(this.node=m,c.value=this.node.textContent,E||f()),!0),this.stopEvent=()=>!0}};export{W as WenChartView,U as WenComponentView,R as WenEditor,O as WenMermaidView,B as WenYamlView};
package/package.json ADDED
@@ -0,0 +1,49 @@
1
+ {
2
+ "name": "@cubud/wen",
3
+ "version": "1.0.0",
4
+ "description": "ƿen (wen) — an ESM-native, zero-build WYSIWYG Markdown/YAML editor built on TipTap, with a \"Dumb Router\" architecture for YAML, components, Mermaid and charts.",
5
+ "type": "module",
6
+ "license": "MIT",
7
+ "homepage": "https://github.com/cubud/wen#readme",
8
+ "repository": {
9
+ "type": "git",
10
+ "url": "git+https://github.com/cubud/wen.git"
11
+ },
12
+ "bugs": {
13
+ "url": "https://github.com/cubud/wen/issues"
14
+ },
15
+ "keywords": [
16
+ "markdown",
17
+ "yaml",
18
+ "wysiwyg",
19
+ "editor",
20
+ "tiptap",
21
+ "prosemirror",
22
+ "mermaid",
23
+ "esm",
24
+ "zero-build"
25
+ ],
26
+ "files": [
27
+ "src",
28
+ "dist",
29
+ "README.md",
30
+ "LICENSE",
31
+ "LLM_CONTRIBUTING.md"
32
+ ],
33
+ "main": "./dist/wen-full.js",
34
+ "module": "./dist/wen-full.js",
35
+ "exports": {
36
+ ".": "./dist/wen-full.js",
37
+ "./min": "./dist/wen-full.min.js",
38
+ "./css": "./dist/wen-full.css",
39
+ "./css/min": "./dist/wen-full.min.css",
40
+ "./src/*": "./src/*"
41
+ },
42
+ "scripts": {
43
+ "build": "bash build.sh",
44
+ "prepublishOnly": "npm run build"
45
+ },
46
+ "publishConfig": {
47
+ "access": "public"
48
+ }
49
+ }
@@ -0,0 +1,33 @@
1
+ .wen-chart-block *, .wen-chart-block *::before, .wen-chart-block *::after {
2
+ box-sizing: border-box;
3
+ }
4
+
5
+ .wen-chart-block {
6
+ border: 2px solid #8250df;
7
+ border-radius: var(--wen-radius);
8
+ margin: 1.5rem 0;
9
+ background: var(--wen-bg);
10
+ box-sizing: border-box;
11
+ }
12
+
13
+ .wen-chart-header {
14
+ display: flex;
15
+ justify-content: space-between;
16
+ align-items: center;
17
+ border-bottom: 2px solid #8250df;
18
+ padding: 0.5rem 1rem;
19
+ background: #8250df;
20
+ color: white;
21
+ border-top-left-radius: calc(var(--wen-radius) - 2px);
22
+ border-top-right-radius: calc(var(--wen-radius) - 2px);
23
+ }
24
+
25
+ .wen-chart-title { font-size: 0.85rem; font-weight: bold; text-transform: uppercase; letter-spacing: 0.05em; }
26
+ .wen-chart-toggle-btn { background: var(--wen-bg); border: none; color: var(--wen-text-main); cursor: pointer; font-size: 0.75rem; padding: 0.25rem 0.6rem; border-radius: var(--wen-radius-sm); font-weight: 600; transition: background 0.15s; }
27
+ .wen-chart-toggle-btn:hover { background: var(--wen-surface-hover); }
28
+
29
+ .wen-chart-view-visual, .wen-chart-view-raw { display: none !important; padding: 1rem; }
30
+ .wen-chart-view-visual.active, .wen-chart-view-raw.active { display: block !important; }
31
+
32
+ .wen-chart-raw-input { width: 100%; min-height: 200px; border: 1px solid var(--wen-border); border-radius: var(--wen-radius-sm); padding: 0.75rem; font-family: var(--wen-font-mono); font-size: 0.9rem; background: #1e1e1e; color: #d4d4d4; resize: vertical; outline: none; white-space: pre; }
33
+ .wen-chart-error { color: var(--wen-danger); font-family: var(--wen-font-mono); font-size: 0.85rem; background: #fef2f2; padding: 1rem; border-radius: var(--wen-radius-sm); border-left: 4px solid var(--wen-danger); }
@@ -0,0 +1,148 @@
1
+ import frappe from 'https://esm.sh/frappe-charts@1.6.2';
2
+ const Chart = frappe.Chart || frappe;
3
+
4
+ export class WenChartView {
5
+ constructor(node, getPos, editor) {
6
+ this.node = node;
7
+ this.getPos = getPos;
8
+ this.editor = editor;
9
+
10
+ this.dom = document.createElement('div');
11
+ this.dom.className = 'wen-chart-block';
12
+ this.dom.contentEditable = 'false';
13
+
14
+ this.dom.innerHTML = `
15
+ <div class="wen-chart-header">
16
+ <span class="wen-chart-title">📊 Frappe Chart</span>
17
+ <button class="wen-chart-toggle-btn" data-state="visual">Edit Data</button>
18
+ </div>
19
+ <div class="wen-chart-view-visual active">
20
+ <div class="frappe-container"></div>
21
+ </div>
22
+ <div class="wen-chart-view-raw"><textarea class="wen-chart-raw-input"></textarea></div>
23
+ `;
24
+
25
+ const toggleBtn = this.dom.querySelector('.wen-chart-toggle-btn');
26
+ const visualView = this.dom.querySelector('.wen-chart-view-visual');
27
+ const chartContainer = this.dom.querySelector('.frappe-container');
28
+ const rawView = this.dom.querySelector('.wen-chart-view-raw');
29
+ const rawInput = this.dom.querySelector('.wen-chart-raw-input');
30
+
31
+ rawInput.value = this.node.textContent;
32
+ let isUpdatingFromUI = false;
33
+ let chartInstance = null;
34
+
35
+ const updateTipTapState = (newRawContent) => {
36
+ if (newRawContent === this.node.textContent) return;
37
+ if (typeof this.getPos === 'function') {
38
+ const tr = this.editor.state.tr;
39
+ const start = this.getPos() + 1;
40
+ const end = start + this.node.nodeSize - 2;
41
+ if (newRawContent) tr.replaceWith(start, end, this.editor.schema.text(newRawContent));
42
+ else tr.delete(start, end);
43
+ this.editor.view.dispatch(tr);
44
+ }
45
+ };
46
+
47
+ const parseMicroFormat = (text) => {
48
+ const lines = text.trim().split('\n');
49
+ let type = 'bar';
50
+ let title = '';
51
+ let dataStartIndex = 0;
52
+
53
+ // 1. Extract config above the ---
54
+ for (let i = 0; i < lines.length; i++) {
55
+ const line = lines[i].trim();
56
+ if (line === '---') { dataStartIndex = i + 1; break; }
57
+ if (line.toLowerCase().startsWith('type:')) type = line.split(':')[1].trim();
58
+ if (line.toLowerCase().startsWith('title:')) title = line.split(':')[1].trim();
59
+ }
60
+
61
+ // If no --- divider is found, assume the whole thing is just CSV
62
+ if (dataStartIndex === 0) dataStartIndex = 0;
63
+
64
+ // 2. Parse the CSV headers
65
+ const headers = lines[dataStartIndex].split(',').map(s => s.trim());
66
+ const labels = [];
67
+ const datasets = headers.slice(1).map(name => ({ name, values: [] }));
68
+
69
+ // 3. Parse the CSV data rows
70
+ for (let i = dataStartIndex + 1; i < lines.length; i++) {
71
+ if (!lines[i].trim()) continue; // Skip empty rows
72
+ const cols = lines[i].split(',').map(s => s.trim());
73
+ labels.push(cols[0]);
74
+ cols.slice(1).forEach((val, idx) => {
75
+ if (datasets[idx]) datasets[idx].values.push(Number(val) || 0);
76
+ });
77
+ }
78
+
79
+ return { title, type, data: { labels, datasets } };
80
+ };
81
+
82
+ const renderChart = () => {
83
+ try {
84
+ const config = parseMicroFormat(rawInput.value);
85
+ chartContainer.innerHTML = ''; // Clear previous SVG
86
+
87
+ // Let Frappe do its magic
88
+ chartInstance = new Chart(chartContainer, {
89
+ title: config.title,
90
+ data: config.data,
91
+ type: config.type,
92
+ height: 250,
93
+ colors: ['#8250df', '#0d9488', '#cf222e', '#bf8700'] // Default categorical palette
94
+ });
95
+
96
+ let errorMsg = visualView.querySelector('.wen-chart-error');
97
+ if (errorMsg) errorMsg.remove();
98
+ chartContainer.style.display = 'block';
99
+
100
+ } catch (err) {
101
+ chartContainer.style.display = 'none';
102
+ let errorMsg = visualView.querySelector('.wen-chart-error');
103
+ if (!errorMsg) {
104
+ errorMsg = document.createElement('div');
105
+ errorMsg.className = 'wen-chart-error';
106
+ visualView.appendChild(errorMsg);
107
+ }
108
+ errorMsg.innerHTML = `<strong>Data Parsing Error:</strong><br/>Ensure you have a header row and valid numbers.`;
109
+ }
110
+ };
111
+
112
+ toggleBtn.addEventListener('click', () => {
113
+ const isVisual = toggleBtn.getAttribute('data-state') === 'visual';
114
+ if (isVisual) {
115
+ visualView.classList.remove('active');
116
+ rawView.classList.add('active');
117
+ toggleBtn.setAttribute('data-state', 'raw');
118
+ toggleBtn.innerText = 'View Chart';
119
+ } else {
120
+ renderChart();
121
+ rawView.classList.remove('active');
122
+ visualView.classList.add('active');
123
+ toggleBtn.setAttribute('data-state', 'visual');
124
+ toggleBtn.innerText = 'Edit Data';
125
+ }
126
+ });
127
+
128
+ rawInput.addEventListener('input', () => {
129
+ isUpdatingFromUI = true;
130
+ updateTipTapState(rawInput.value);
131
+ isUpdatingFromUI = false;
132
+ });
133
+
134
+ renderChart();
135
+
136
+ this.update = (updatedNode) => {
137
+ if (updatedNode.type.name !== 'codeBlock' || updatedNode.attrs.language !== 'chart') return false;
138
+ if (this.node.textContent !== updatedNode.textContent) {
139
+ this.node = updatedNode;
140
+ rawInput.value = this.node.textContent;
141
+ if (!isUpdatingFromUI) renderChart();
142
+ }
143
+ return true;
144
+ };
145
+
146
+ this.stopEvent = () => true;
147
+ }
148
+ }
@@ -0,0 +1,120 @@
1
+ .wen-component-block *, .wen-component-block *::before, .wen-component-block *::after {
2
+ box-sizing: border-box;
3
+ }
4
+
5
+ .wen-component-block {
6
+ border: 2px solid var(--wen-accent);
7
+ border-radius: var(--wen-radius);
8
+ margin: 1.5rem 0;
9
+ background: var(--wen-bg);
10
+ }
11
+
12
+ .wen-component-header {
13
+ display: flex;
14
+ justify-content: space-between;
15
+ align-items: center;
16
+ border-bottom: 2px solid var(--wen-accent);
17
+ padding: 0.5rem 1rem;
18
+ background: var(--wen-accent);
19
+ color: var(--wen-accent-text);
20
+ border-top-left-radius: calc(var(--wen-radius) - 2px);
21
+ border-top-right-radius: calc(var(--wen-radius) - 2px);
22
+ }
23
+
24
+ .wen-component-title { font-size: 0.85rem; font-weight: bold; text-transform: uppercase; letter-spacing: 0.05em; }
25
+ .wen-component-toggle-btn { background: var(--wen-bg); border: none; color: var(--wen-text-main); cursor: pointer; font-size: 0.75rem; padding: 0.25rem 0.6rem; border-radius: var(--wen-radius-sm); font-weight: 600; }
26
+
27
+ .wen-component-view-visual, .wen-component-view-raw { display: none; padding: 1rem; }
28
+ .wen-component-view-visual.active, .wen-component-view-raw.active { display: block; }
29
+
30
+ .wen-component-raw-input { width: 100%; min-height: 200px; border: 1px solid var(--wen-border); border-radius: var(--wen-radius-sm); padding: 0.75rem; font-family: var(--wen-font-mono); font-size: 0.9rem; background: #1e1e1e; color: #d4d4d4; resize: vertical; outline: none; }
31
+
32
+ .wen-wireframe { border: 1px dashed var(--wen-border); border-radius: var(--wen-radius-sm); background: var(--wen-surface); padding: 1rem; }
33
+ .wen-wireframe-header { color: var(--wen-text-main); font-size: 1.1rem; margin-bottom: 0.75rem; font-family: var(--wen-font-mono); }
34
+ .wen-prop-val { color: var(--wen-accent); }
35
+ .wen-component-error { color: var(--wen-danger); font-weight: bold; }
36
+
37
+ .wen-wireframe-props {
38
+ padding: 0.5rem; background: var(--wen-surface);
39
+ border-bottom: 1px solid var(--wen-border);
40
+ display: flex; flex-wrap: wrap; gap: 0.5rem;
41
+ }
42
+
43
+ .wen-wireframe-prop {
44
+ background: var(--wen-bg); border: 1px solid var(--wen-border);
45
+ padding: 0.2rem 0.5rem; border-radius: 4px; font-size: 0.8rem;
46
+ font-family: var(--wen-font-mono); display: flex; align-items: center; gap: 0.25rem;
47
+ }
48
+
49
+ .wen-prop-key { color: #8b5cf6; font-weight: bold; }
50
+
51
+ /* The Editable Attribute Input */
52
+ .wen-prop-val-input {
53
+ background: transparent; border: none; border-bottom: 1px dashed #cbd5e1;
54
+ color: #10b981; font-family: inherit; font-size: inherit; outline: none;
55
+ min-width: 60px; padding: 0 0.2rem; transition: border-color 0.2s;
56
+ }
57
+ .wen-prop-val-input:focus { border-bottom-color: #10b981; }
58
+
59
+ .wen-wireframe-content { padding: 1rem; }
60
+
61
+ /* Live Markdown Preview Box */
62
+ .wen-wireframe-preview-box {
63
+ background: #ffffff;
64
+ border: 1px solid #cbd5e1;
65
+ border-radius: var(--wen-radius-sm);
66
+ padding: 1rem;
67
+ margin-bottom: 0.75rem;
68
+ max-height: 250px;
69
+ overflow-y: auto;
70
+ box-shadow: inset 0 2px 4px rgba(0,0,0,0.02);
71
+ }
72
+
73
+ .wen-wireframe-preview {
74
+ font-size: 0.9rem;
75
+ color: #334155;
76
+ font-family: var(--wen-font-sans);
77
+ line-height: 1.5;
78
+ }
79
+
80
+ /* Reset typography inside the preview so headers don't blow out */
81
+ .wen-wireframe-preview h1,
82
+ .wen-wireframe-preview h2,
83
+ .wen-wireframe-preview h3,
84
+ .wen-wireframe-preview h4 {
85
+ margin-top: 0;
86
+ margin-bottom: 0.5rem;
87
+ font-weight: 600;
88
+ line-height: 1.2;
89
+ }
90
+
91
+ .wen-wireframe-preview h1 { font-size: 1.4em; }
92
+ .wen-wireframe-preview h2 { font-size: 1.2em; border-bottom: 1px solid #e2e8f0; padding-bottom: 0.2rem; }
93
+ .wen-wireframe-preview h3 { font-size: 1.1em; }
94
+ .wen-wireframe-preview p { margin-top: 0; margin-bottom: 0.75rem; }
95
+ .wen-wireframe-preview p:last-child { margin-bottom: 0; }
96
+ .wen-wireframe-preview blockquote { border-left: 3px solid #cbd5e1; margin: 0; padding-left: 1rem; color: #64748b; }
97
+
98
+ /* The WYSIWYG Trigger Button */
99
+ .wen-wireframe-edit-btn {
100
+ background: #3b82f6; color: white; border: none; border-radius: var(--wen-radius-sm);
101
+ padding: 0.5rem 1rem; font-size: 0.85rem; font-weight: bold; cursor: pointer;
102
+ transition: background 0.15s; width: 100%; text-align: left;
103
+ }
104
+ .wen-wireframe-edit-btn:hover { background: #2563eb; }
105
+
106
+ /* The Custom Tag & Markdown Preview Styles */
107
+ .wen-preview-tag {
108
+ font-family: var(--wen-font-mono);
109
+ color: #8b5cf6;
110
+ font-weight: bold;
111
+ font-size: 0.8rem;
112
+ background: rgba(139, 92, 246, 0.1);
113
+ display: inline-block;
114
+ padding: 0.1rem 0.4rem;
115
+ border-radius: 4px;
116
+ margin: 0.25rem 0;
117
+ }
118
+
119
+ .wen-preview-md p:first-child { margin-top: 0; }
120
+ .wen-preview-md p:last-child { margin-bottom: 0; }