kempo 4.2.4 → 4.2.5

package/dist/admin/components/TemplateEditor.js

@@ -0,0 +1,125 @@
+import ShadowComponent from"/kempo-ui/components/ShadowComponent.js";import{html}from"/kempo-ui/lit-all.min.js";import{getTemplate,updateTemplate,deleteTemplates,moveTemplate,createTemplate,listDirectories}from"/kempo/sdk.js";import Dialog from"/kempo-ui/components/Dialog.js";import Toast from"/kempo-ui/components/Toast.js";import"/kempo-ui/components/Icon.js";import"/kempo-ui/components/Accordion.js";import"/kempo-ui/components/CodeEditor.js";export default class TemplateEditor extends ShadowComponent{static properties={loading:{state:!0},error:{state:!0},saving:{state:!0},template:{state:!0}};constructor(){super(),this.loading=!0,this.error=!1,this.saving=!1,this.template=null,this.file=""}async connectedCallback(){super.connectedCallback(),document.addEventListener("keydown",this.handleKeyDown);const e=new URLSearchParams(window.location.search).get("template");if(this.file=e+".template.html",!this.file||".template.html"===this.file)return this.loading=!1,void(this.error=!0);const[t,a]=await getTemplate(this.file);this.loading=!1,t?this.error=!0:(this.template=a,document.title=`Edit: ${a.name} - Admin`)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("keydown",this.handleKeyDown)}getFormState(){const e=this.shadowRoot;return{name:e.querySelector("#metaName")?.value??this.template.name,markup:e.querySelector("#templateEditor")?.getValue()??this.template.markup}}handleKeyDown=e=>{(e.ctrlKey||e.metaKey)&&"s"===e.key&&(e.preventDefault(),this.saving||this.template?.locked||this.handleSave())};handleDelete=()=>{Dialog.confirm("Delete this template? This action cannot be undone.",async e=>{if(!e)return;const[t]=await deleteTemplates([this.file]);t?Toast.error(t.msg||"Failed to delete template"):(Toast.success("Template deleted"),setTimeout(()=>{window.location.href="/admin/content/templates"},1e3))})};handleMove=async()=>{const[,e]=await listDirectories(),t=e?.directories||["."],a=this.file.replace(/\.template\.html$/,"").split("/"),l=a.pop(),i=a.join("/")||".",o=e=>(e||"/").replace(/^\//,"").replace(/\/$/,"")||".",n="."===i?"/":"/"+i,s=Dialog.create(html`
+      <div class="p">
+        <div class="p r mb bc-warning tc-warning">
+          <k-icon name="warning"></k-icon>
+          <strong>Warning:</strong> Moving a template may break pages that reference it by name.<br />Pages search for templates by name starting from their own directory up to the root.<br />Moving this template could cause those pages to fall back to the <code>default</code> template.
+        </div>
+        <div class="mb">
+          <label class="d-b mb-sm"><strong>Location</strong></label>
+          <input type="text" id="dlg-move-dir" class="full" list="dlg-move-dir-list" .value="${n}" placeholder="/">
+          <datalist id="dlg-move-dir-list">
+            ${t.map(e=>html`<option value="${"."===e?"/":"/"+e}">`)} 
+          </datalist>
+        </div>
+        <div>
+          <label class="d-b mb-sm"><strong>Template Name</strong></label>
+          <input type="text" id="dlg-move-name" class="full" .value="${l}">
+          <p class="mt-sm muted"><small id="dlg-move-preview"></small></p>
+        </div>
+      </div>
+    `,{title:"Move Template",confirmText:"Save and Move Template",confirmAction:async()=>{const e=s.querySelector("#dlg-move-dir").value.trim()||"/",t=s.querySelector("#dlg-move-name").value.trim();if(!t)return void Toast.error("Template name is required");if(!/^\/[a-zA-Z0-9_\-\[\]\/]*$/.test(a=e)||a.includes("..")||a.includes("//"))return void Toast.error("Invalid directory path");var a;const l=o(e),i="."===l?`${t}.template.html`:`${l}/${t}.template.html`;this.saving=!0;const[n]=await updateTemplate({file:this.file,...this.getFormState()});if(this.saving=!1,n)return void Toast.error(n.msg||"Failed to save template");const[r,m]=await moveTemplate({file:this.file,newFile:i});if(r)return void Toast.error(r.msg||"Failed to move template");Toast.success("Template saved and moved");const d=m.file.replace(/\.template\.html$/,"");setTimeout(()=>{window.location.href=`/admin/content/templates/edit?template=${encodeURIComponent(d)}`},1e3)},cancelText:"Cancel"}),r=()=>{const e=o(s.querySelector("#dlg-move-dir").value||"/"),t=s.querySelector("#dlg-move-name").value,a="."===e?"/":"/"+e+"/";s.querySelector("#dlg-move-preview").textContent=t?a+t:""};s.querySelector("#dlg-move-dir").addEventListener("input",r),s.querySelector("#dlg-move-name").addEventListener("input",r),r()};handleCopy=async()=>{const[,e]=await listDirectories(),t=e?.directories||["."],a=this.file.replace(/\.template\.html$/,"").split("/"),l=a.pop(),i=a.join("/")||".",o=e=>(e||"/").replace(/^\//,"").replace(/\/$/,"")||".",n="."===i?"/":"/"+i,s=Dialog.create(html`
+      <div class="p">
+        <div class="mb">
+          <label class="d-b mb-sm"><strong>Location</strong></label>
+          <input type="text" id="dlg-copy-dir" class="full" list="dlg-copy-dir-list" .value="${n}" placeholder="/">
+          <datalist id="dlg-copy-dir-list">
+            ${t.map(e=>html`<option value="${"."===e?"/":"/"+e}">`)} 
+          </datalist>
+        </div>
+        <div>
+          <label class="d-b mb-sm"><strong>Template Name</strong></label>
+          <input type="text" id="dlg-copy-name" class="full" .value="${l}-copy">
+          <p class="mt-sm muted"><small id="dlg-copy-preview"></small></p>
+        </div>
+      </div>
+    `,{title:"Copy Template",confirmText:"Copy Template",confirmAction:async()=>{const e=s.querySelector("#dlg-copy-dir").value.trim()||"/",t=s.querySelector("#dlg-copy-name").value.trim();if(!t)return void Toast.error("Template name is required");if(!/^\/[a-zA-Z0-9_\-\[\]\/]*$/.test(a=e)||a.includes("..")||a.includes("//"))return void Toast.error("Invalid directory path");var a;const l=o(e),[i,n]=await createTemplate({directory:"."===l?"":l,name:t,copyFrom:this.file});i?Toast.error(i.msg||"Failed to copy template"):(Toast.success("Template copied"),setTimeout(()=>{window.location.href=`/admin/content/templates/edit?template=${encodeURIComponent(n.file.replace(/\.template\.html$/,""))}`},1e3))},cancelText:"Cancel"}),r=()=>{const e=o(s.querySelector("#dlg-copy-dir").value||"/"),t=s.querySelector("#dlg-copy-name").value,a="."===e?"/":"/"+e+"/";s.querySelector("#dlg-copy-preview").textContent=t?a+t:""};s.querySelector("#dlg-copy-dir").addEventListener("input",r),s.querySelector("#dlg-copy-name").addEventListener("input",r),r()};handleReset=()=>{Dialog.confirm("Reset this template? Any unsaved changes will be lost.",e=>{e&&(this.template={...this.template})})};handleSave=async()=>{this.saving=!0;const e=this.getFormState(),[t,a]=await updateTemplate({file:this.file,markup:e.markup});if(this.saving=!1,t)return void Toast.error(t.msg||"Failed to save template");this.template={...this.template,markup:e.markup,updatedAt:a.updatedAt};const l=this.file.replace(/\.template\.html$/,"").split("/"),i=l.pop(),o=l.join("/"),n=e.name.toLowerCase().trim().replace(/[^\w\s-]/g,"").replace(/[\s_]+/g,"-").replace(/-+/g,"-").replace(/^-|-$/g,"");if(n&&n!==i){const e=o?`${o}/${n}.template.html`:`${n}.template.html`,[t,a]=await moveTemplate({file:this.file,newFile:e});if(t)return void Toast.error(t.msg||"Failed to rename template file");Toast.success("Template saved and renamed");const l=a.file.replace(/\.template\.html$/,"");return void setTimeout(()=>{window.location.href=`/admin/content/templates/edit?template=${encodeURIComponent(l)}`},1e3)}document.title=`Edit: ${template.name} - Admin`,Toast.success("Template saved")};render(){if(this.loading)return html`<div>Loading template...</div>`;if(this.error)return html`
+      <div>
+        <p>Template not found.</p>
+        <a href="/admin/content/templates">Back to Templates</a>
+      </div>
+    `;const{template:e}=this,t="custom"===e.owner,a=e.locked;return html`
+      ${a?html`
+        <div class="p r mb bc-warning tc-warning">
+          <k-icon name="lock"></k-icon> This template is locked and cannot be edited. It is managed by an extension.
+        </div>
+      `:""}
+      <div class="d-f mb">
+        <div class="btn-grp mrh mb">
+          <a href="/admin/content/templates" class="btn">
+            <k-icon name="arrow" direction="left"></k-icon> Templates
+          </a>
+        </div>
+        <div class="flex"></div>
+        ${t&&!a?html`
+          <div class="btn-grp mrh mb">
+            <button class="danger" @click="${this.handleDelete}"><k-icon name="delete"></k-icon> Delete</button>
+            <button @click="${this.handleMove}"><k-icon name="drive_file_move"></k-icon> Move Template</button>
+          </div>
+        `:""}
+        <div class="btn-grp mrh mb">
+          <button @click="${this.handleCopy}"><k-icon name="content_copy"></k-icon> Copy Template</button>
+        </div>
+        ${a?"":html`
+          <div class="btn-grp mrh mb">
+            <button @click="${this.handleReset}"><k-icon name="restart_alt"></k-icon> Reset</button>
+            <button id="saveBtn" class="primary" ?disabled="${this.saving}" @click="${this.handleSave}">
+              <k-icon name="save"></k-icon> Save
+            </button>
+          </div>
+        `}
+      </div>
+
+      <h1 class="mb">Template: ${e.name}</h1>
+
+      <k-accordion>
+        <k-accordion-header for-panel="metadata">Metadata</k-accordion-header>
+        <k-accordion-panel name="metadata">
+          <div class="p">
+            <div class="d-f mb" style="align-items: center; gap: var(--spacer);">
+              <label style="min-width: 120px;"><strong>Name</strong></label>
+              <input type="text" id="metaName" class="flex" .value="${e.name||""}" ?disabled="${!t||a}">
+            </div>
+            <div class="d-f mb" style="align-items: center; gap: var(--spacer);">
+              <label style="min-width: 120px;"><strong>Directory</strong></label>
+              <span class="muted">${(()=>{const e=this.file.replace(/\.template\.html$/,"").split("/");return e.pop(),e.length?e.join("/"):"/"})()}</span>
+              ${t&&!a?html`
+                <button class="icon-btn no-btn ph" title="Move Template" @click="${this.handleMove}"><k-icon name="drive_file_move"></k-icon></button>
+              `:""}
+            </div>
+            ${e.author?html`
+              <div class="d-f mb" style="align-items: center; gap: var(--spacer);">
+                <label style="min-width: 120px;"><strong>Author</strong></label>
+                <span class="muted">${e.author}</span>
+              </div>
+            `:""}
+            <div class="d-f mb" style="align-items: center; gap: var(--spacer);">
+              <label style="min-width: 120px;"><strong>Owner</strong></label>
+              <span class="muted">${e.owner||""}</span>
+            </div>
+            <div class="d-f mb" style="align-items: center; gap: var(--spacer);">
+              <label style="min-width: 120px;"><strong>Created</strong></label>
+              <span class="muted">${e.createdAt?new Date(e.createdAt).toLocaleString():""}</span>
+            </div>
+            <div class="d-f" style="align-items: center; gap: var(--spacer);">
+              <label style="min-width: 120px;"><strong>Updated</strong></label>
+              <span class="muted">${e.updatedAt?new Date(e.updatedAt).toLocaleString():""}</span>
+            </div>
+          </div>
+        </k-accordion-panel>
+
+        <k-accordion-header for-panel="template" active>Template</k-accordion-header>
+        <k-accordion-panel name="template" active>
+          <div class="p">
+            <k-code-editor
+              id="templateEditor"
+              class="r b"
+              language="html"
+              .value="${e.markup||""}"
+              style="height: 70vh; min-height: 400px;"
+              ?disabled="${a}"
+            ></k-code-editor>
+          </div>
+        </k-accordion-panel>
+      </k-accordion>
+    `}}customElements.define("admin-template-editor",TemplateEditor);
+//# sourceMappingURL=TemplateEditor.js.map

package/dist/admin/components/TemplateEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"src/admin/components/TemplateEditor.js","names":["ShadowComponent","html","getTemplate","updateTemplate","deleteTemplates","moveTemplate","createTemplate","listDirectories","Dialog","Toast","TemplateEditor","static","loading","state","error","saving","template","constructor","super","this","file","connectedCallback","document","addEventListener","handleKeyDown","param","URLSearchParams","window","location","search","get","err","title","name","disconnectedCallback","removeEventListener","getFormState","root","shadowRoot","querySelector","value","markup","getValue","e","ctrlKey","metaKey","key","preventDefault","locked","handleSave","handleDelete","confirm","async","confirmed","msg","success","setTimeout","href","handleMove","dirData","directories","parts","replace","split","currentName","pop","currentDir","join","dirToInternal","p","currentDirDisplay","$dialog","create","map","d","confirmText","confirmAction","dirInput","trim","newName","test","includes","newDir","newFile","saveError","moveError","moved","newParam","encodeURIComponent","cancelText","updatePreview","dir","prefix","textContent","handleCopy","directory","data","copyFrom","handleReset","saved","updatedAt","currentSlug","newSlug","toLowerCase","render","isCustom","owner","isLocked","length","author","createdAt","Date","toLocaleString","customElements","define"],"sources":["0"],"sourcesContent":["import ShadowComponent from '/kempo-ui/components/ShadowComponent.js';\nimport { html } from '/kempo-ui/lit-all.min.js';\nimport { getTemplate, updateTemplate, deleteTemplates, moveTemplate, createTemplate, listDirectories } from '/kempo/sdk.js';\nimport Dialog from '/kempo-ui/components/Dialog.js';\nimport Toast from '/kempo-ui/components/Toast.js';\nimport '/kempo-ui/components/Icon.js';\nimport '/kempo-ui/components/Accordion.js';\nimport '/kempo-ui/components/CodeEditor.js';\n\nexport default class TemplateEditor extends ShadowComponent {\n  static properties = {\n    loading: { state: true },\n    error: { state: true },\n    saving: { state: true },\n    template: { state: true }\n  };\n\n  constructor() {\n    super();\n    this.loading = true;\n    this.error = false;\n    this.saving = false;\n    this.template = null;\n    this.file = '';\n  }\n\n  async connectedCallback() {\n    super.connectedCallback();\n    document.addEventListener('keydown', this.handleKeyDown);\n    const param = new URLSearchParams(window.location.search).get('template');\n    this.file = param + '.template.html';\n\n    if (!this.file || this.file === '.template.html') {\n      this.loading = false;\n      this.error = true;\n      return;\n    }\n\n    const [err, template] = await getTemplate(this.file);\n    this.loading = false;\n\n    if (err) {\n      this.error = true;\n      return;\n    }\n\n    this.template = template;\n    document.title = `Edit: ${template.name} - Admin`;\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    document.removeEventListener('keydown', this.handleKeyDown);\n  }\n\n  /*\n    Helpers\n  */\n\n  getFormState() {\n    const root = this.shadowRoot;\n    return {\n      name: root.querySelector('#metaName')?.value ?? this.template.name,\n      markup: root.querySelector('#templateEditor')?.getValue() ?? this.template.markup\n    };\n  }\n\n  /*\n    Event Handlers\n  */\n\n  handleKeyDown = e => {\n    if ((e.ctrlKey || e.metaKey) && e.key === 's') {\n      e.preventDefault();\n      if (!this.saving && !this.template?.locked) this.handleSave();\n    }\n  };\n\n  handleDelete = () => {\n    Dialog.confirm('Delete this template? This action cannot be undone.', async confirmed => {\n      if (!confirmed) return;\n      const [error] = await deleteTemplates([this.file]);\n      if (error) {\n        Toast.error(error.msg || 'Failed to delete template');\n        return;\n      }\n      Toast.success('Template deleted');\n      setTimeout(() => { window.location.href = '/admin/content/templates'; }, 1000);\n    });\n  };\n\n  handleMove = async () => {\n    const [, dirData] = await listDirectories();\n    const directories = dirData?.directories || ['.'];\n\n    const parts = this.file.replace(/\\.template\\.html$/, '').split('/');\n    const currentName = parts.pop();\n    const currentDir = parts.join('/') || '.';\n\n    const isValidDir = p => /^\\/[a-zA-Z0-9_\\-\\[\\]\\/]*$/.test(p) && !p.includes('..') && !p.includes('//');\n    const dirToInternal = p => { const t = (p || '/').replace(/^\\//, '').replace(/\\/$/, ''); return t || '.'; };\n    const currentDirDisplay = currentDir === '.' ? '/' : '/' + currentDir;\n\n    const $dialog = Dialog.create(html`\n      <div class=\"p\">\n        <div class=\"p r mb bc-warning tc-warning\">\n          <k-icon name=\"warning\"></k-icon>\n          <strong>Warning:</strong> Moving a template may break pages that reference it by name.<br />Pages search for templates by name starting from their own directory up to the root.<br />Moving this template could cause those pages to fall back to the <code>default</code> template.\n        </div>\n        <div class=\"mb\">\n          <label class=\"d-b mb-sm\"><strong>Location</strong></label>\n          <input type=\"text\" id=\"dlg-move-dir\" class=\"full\" list=\"dlg-move-dir-list\" .value=\"${currentDirDisplay}\" placeholder=\"/\">\n          <datalist id=\"dlg-move-dir-list\">\n            ${directories.map(d => html`<option value=\"${d === '.' ? '/' : '/' + d}\">`)} \n          </datalist>\n        </div>\n        <div>\n          <label class=\"d-b mb-sm\"><strong>Template Name</strong></label>\n          <input type=\"text\" id=\"dlg-move-name\" class=\"full\" .value=\"${currentName}\">\n          <p class=\"mt-sm muted\"><small id=\"dlg-move-preview\"></small></p>\n        </div>\n      </div>\n    `, {\n      title: 'Move Template',\n      confirmText: 'Save and Move Template',\n      confirmAction: async () => {\n        const dirInput = $dialog.querySelector('#dlg-move-dir').value.trim() || '/';\n        const newName = $dialog.querySelector('#dlg-move-name').value.trim();\n        if (!newName) {\n          Toast.error('Template name is required');\n          return;\n        }\n        if (!isValidDir(dirInput)) {\n          Toast.error('Invalid directory path');\n          return;\n        }\n        const newDir = dirToInternal(dirInput);\n        const newFile = newDir === '.'\n          ? `${newName}.template.html`\n          : `${newDir}/${newName}.template.html`;\n\n        this.saving = true;\n        const [saveError] = await updateTemplate({ file: this.file, ...this.getFormState() });\n        this.saving = false;\n        if (saveError) {\n          Toast.error(saveError.msg || 'Failed to save template');\n          return;\n        }\n\n        const [moveError, moved] = await moveTemplate({ file: this.file, newFile });\n        if (moveError) {\n          Toast.error(moveError.msg || 'Failed to move template');\n          return;\n        }\n\n        Toast.success('Template saved and moved');\n        const newParam = moved.file.replace(/\\.template\\.html$/, '');\n        setTimeout(() => {\n          window.location.href = `/admin/content/templates/edit?template=${encodeURIComponent(newParam)}`;\n        }, 1000);\n      },\n      cancelText: 'Cancel'\n    });\n\n    const updatePreview = () => {\n      const dir = dirToInternal($dialog.querySelector('#dlg-move-dir').value || '/');\n      const name = $dialog.querySelector('#dlg-move-name').value;\n      const prefix = dir === '.' ? '/' : '/' + dir + '/';\n      $dialog.querySelector('#dlg-move-preview').textContent = name ? prefix + name : '';\n    };\n    $dialog.querySelector('#dlg-move-dir').addEventListener('input', updatePreview);\n    $dialog.querySelector('#dlg-move-name').addEventListener('input', updatePreview);\n    updatePreview();\n  };\n\n  handleCopy = async () => {\n    const [, dirData] = await listDirectories();\n    const directories = dirData?.directories || ['.'];\n\n    const parts = this.file.replace(/\\.template\\.html$/, '').split('/');\n    const currentName = parts.pop();\n    const currentDir = parts.join('/') || '.';\n\n    const isValidDir = p => /^\\/[a-zA-Z0-9_\\-\\[\\]\\/]*$/.test(p) && !p.includes('..') && !p.includes('//');\n    const dirToInternal = p => { const t = (p || '/').replace(/^\\//, '').replace(/\\/$/, ''); return t || '.'; };\n    const currentDirDisplay = currentDir === '.' ? '/' : '/' + currentDir;\n\n    const $dialog = Dialog.create(html`\n      <div class=\"p\">\n        <div class=\"mb\">\n          <label class=\"d-b mb-sm\"><strong>Location</strong></label>\n          <input type=\"text\" id=\"dlg-copy-dir\" class=\"full\" list=\"dlg-copy-dir-list\" .value=\"${currentDirDisplay}\" placeholder=\"/\">\n          <datalist id=\"dlg-copy-dir-list\">\n            ${directories.map(d => html`<option value=\"${d === '.' ? '/' : '/' + d}\">`)} \n          </datalist>\n        </div>\n        <div>\n          <label class=\"d-b mb-sm\"><strong>Template Name</strong></label>\n          <input type=\"text\" id=\"dlg-copy-name\" class=\"full\" .value=\"${currentName}-copy\">\n          <p class=\"mt-sm muted\"><small id=\"dlg-copy-preview\"></small></p>\n        </div>\n      </div>\n    `, {\n      title: 'Copy Template',\n      confirmText: 'Copy Template',\n      confirmAction: async () => {\n        const dirInput = $dialog.querySelector('#dlg-copy-dir').value.trim() || '/';\n        const newName = $dialog.querySelector('#dlg-copy-name').value.trim();\n        if(!newName){\n          Toast.error('Template name is required');\n          return;\n        }\n        if(!isValidDir(dirInput)){\n          Toast.error('Invalid directory path');\n          return;\n        }\n        const directory = dirToInternal(dirInput);\n        const [error, data] = await createTemplate({ directory: directory === '.' ? '' : directory, name: newName, copyFrom: this.file });\n        if(error){\n          Toast.error(error.msg || 'Failed to copy template');\n          return;\n        }\n        Toast.success('Template copied');\n        setTimeout(() => {\n          window.location.href = `/admin/content/templates/edit?template=${encodeURIComponent(data.file.replace(/\\.template\\.html$/, ''))}`;\n        }, 1000);\n      },\n      cancelText: 'Cancel'\n    });\n\n    const updatePreview = () => {\n      const dir = dirToInternal($dialog.querySelector('#dlg-copy-dir').value || '/');\n      const name = $dialog.querySelector('#dlg-copy-name').value;\n      const prefix = dir === '.' ? '/' : '/' + dir + '/';\n      $dialog.querySelector('#dlg-copy-preview').textContent = name ? prefix + name : '';\n    };\n    $dialog.querySelector('#dlg-copy-dir').addEventListener('input', updatePreview);\n    $dialog.querySelector('#dlg-copy-name').addEventListener('input', updatePreview);\n    updatePreview();\n  };\n\n  handleReset = () => {\n    Dialog.confirm('Reset this template? Any unsaved changes will be lost.', confirmed => {\n      if (!confirmed) return;\n      this.template = { ...this.template };\n    });\n  };\n\n  handleSave = async () => {\n    this.saving = true;\n    const state = this.getFormState();\n    const [saveError, saved] = await updateTemplate({ file: this.file, markup: state.markup });\n    this.saving = false;\n\n    if(saveError){\n      Toast.error(saveError.msg || 'Failed to save template');\n      return;\n    }\n\n    this.template = { ...this.template, markup: state.markup, updatedAt: saved.updatedAt };\n\n    const slugify = n => n.toLowerCase().trim().replace(/[^\\w\\s-]/g, '').replace(/[\\s_]+/g, '-').replace(/-+/g, '-').replace(/^-|-$/g, '');\n    const parts = this.file.replace(/\\.template\\.html$/, '').split('/');\n    const currentSlug = parts.pop();\n    const dir = parts.join('/');\n    const newSlug = slugify(state.name);\n\n    if(newSlug && newSlug !== currentSlug){\n      const newFile = dir ? `${dir}/${newSlug}.template.html` : `${newSlug}.template.html`;\n      const [moveError, moved] = await moveTemplate({ file: this.file, newFile });\n      if(moveError){\n        Toast.error(moveError.msg || 'Failed to rename template file');\n        return;\n      }\n      Toast.success('Template saved and renamed');\n      const newParam = moved.file.replace(/\\.template\\.html$/, '');\n      setTimeout(() => {\n        window.location.href = `/admin/content/templates/edit?template=${encodeURIComponent(newParam)}`;\n      }, 1000);\n      return;\n    }\n\n    document.title = `Edit: ${template.name} - Admin`;\n    Toast.success('Template saved');\n  };\n\n  /*\n    Render\n  */\n\n  render() {\n    if (this.loading) return html`<div>Loading template...</div>`;\n\n    if (this.error) return html`\n      <div>\n        <p>Template not found.</p>\n        <a href=\"/admin/content/templates\">Back to Templates</a>\n      </div>\n    `;\n\n    const { template } = this;\n    const isCustom = template.owner === 'custom';\n    const isLocked = template.locked;\n\n    return html`\n      ${isLocked ? html`\n        <div class=\"p r mb bc-warning tc-warning\">\n          <k-icon name=\"lock\"></k-icon> This template is locked and cannot be edited. It is managed by an extension.\n        </div>\n      ` : ''}\n      <div class=\"d-f mb\">\n        <div class=\"btn-grp mrh mb\">\n          <a href=\"/admin/content/templates\" class=\"btn\">\n            <k-icon name=\"arrow\" direction=\"left\"></k-icon> Templates\n          </a>\n        </div>\n        <div class=\"flex\"></div>\n        ${isCustom && !isLocked ? html`\n          <div class=\"btn-grp mrh mb\">\n            <button class=\"danger\" @click=\"${this.handleDelete}\"><k-icon name=\"delete\"></k-icon> Delete</button>\n            <button @click=\"${this.handleMove}\"><k-icon name=\"drive_file_move\"></k-icon> Move Template</button>\n          </div>\n        ` : ''}\n        <div class=\"btn-grp mrh mb\">\n          <button @click=\"${this.handleCopy}\"><k-icon name=\"content_copy\"></k-icon> Copy Template</button>\n        </div>\n        ${!isLocked ? html`\n          <div class=\"btn-grp mrh mb\">\n            <button @click=\"${this.handleReset}\"><k-icon name=\"restart_alt\"></k-icon> Reset</button>\n            <button id=\"saveBtn\" class=\"primary\" ?disabled=\"${this.saving}\" @click=\"${this.handleSave}\">\n              <k-icon name=\"save\"></k-icon> Save\n            </button>\n          </div>\n        ` : ''}\n      </div>\n\n      <h1 class=\"mb\">Template: ${template.name}</h1>\n\n      <k-accordion>\n        <k-accordion-header for-panel=\"metadata\">Metadata</k-accordion-header>\n        <k-accordion-panel name=\"metadata\">\n          <div class=\"p\">\n            <div class=\"d-f mb\" style=\"align-items: center; gap: var(--spacer);\">\n              <label style=\"min-width: 120px;\"><strong>Name</strong></label>\n              <input type=\"text\" id=\"metaName\" class=\"flex\" .value=\"${template.name || ''}\" ?disabled=\"${!isCustom || isLocked}\">\n            </div>\n            <div class=\"d-f mb\" style=\"align-items: center; gap: var(--spacer);\">\n              <label style=\"min-width: 120px;\"><strong>Directory</strong></label>\n              <span class=\"muted\">${(() => { const parts = this.file.replace(/\\.template\\.html$/, '').split('/'); parts.pop(); return parts.length ? parts.join('/') : '/'; })()}</span>\n              ${isCustom && !isLocked ? html`\n                <button class=\"icon-btn no-btn ph\" title=\"Move Template\" @click=\"${this.handleMove}\"><k-icon name=\"drive_file_move\"></k-icon></button>\n              ` : ''}\n            </div>\n            ${template.author ? html`\n              <div class=\"d-f mb\" style=\"align-items: center; gap: var(--spacer);\">\n                <label style=\"min-width: 120px;\"><strong>Author</strong></label>\n                <span class=\"muted\">${template.author}</span>\n              </div>\n            ` : ''}\n            <div class=\"d-f mb\" style=\"align-items: center; gap: var(--spacer);\">\n              <label style=\"min-width: 120px;\"><strong>Owner</strong></label>\n              <span class=\"muted\">${template.owner || ''}</span>\n            </div>\n            <div class=\"d-f mb\" style=\"align-items: center; gap: var(--spacer);\">\n              <label style=\"min-width: 120px;\"><strong>Created</strong></label>\n              <span class=\"muted\">${template.createdAt ? new Date(template.createdAt).toLocaleString() : ''}</span>\n            </div>\n            <div class=\"d-f\" style=\"align-items: center; gap: var(--spacer);\">\n              <label style=\"min-width: 120px;\"><strong>Updated</strong></label>\n              <span class=\"muted\">${template.updatedAt ? new Date(template.updatedAt).toLocaleString() : ''}</span>\n            </div>\n          </div>\n        </k-accordion-panel>\n\n        <k-accordion-header for-panel=\"template\" active>Template</k-accordion-header>\n        <k-accordion-panel name=\"template\" active>\n          <div class=\"p\">\n            <k-code-editor\n              id=\"templateEditor\"\n              class=\"r b\"\n              language=\"html\"\n              .value=\"${template.markup || ''}\"\n              style=\"height: 70vh; min-height: 400px;\"\n              ?disabled=\"${isLocked}\"\n            ></k-code-editor>\n          </div>\n        </k-accordion-panel>\n      </k-accordion>\n    `;\n  }\n}\n\ncustomElements.define('admin-template-editor', TemplateEditor);\n"],"mappings":"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","ignoreList":[]}

package/dist/admin/components/ValueEditor.js

@@ -0,0 +1,40 @@
+import ShadowComponent from"/kempo-ui/components/ShadowComponent.js";import{html,nothing}from"/kempo-ui/lit-all.min.js";import"/admin/components/Monaco.js";const CODE_TYPES=new Set(["html","css","javascript","json","xml"]),TYPE_TO_LANG={html:"html",css:"css",javascript:"javascript",json:"json",xml:"xml"};export default class ValueEditor extends ShadowComponent{static get properties(){return{type:{type:String,reflect:!0},readonly:{type:Boolean,reflect:!0},disabled:{type:Boolean,reflect:!0},placeholder:{type:String},min:{type:String},max:{type:String},step:{type:String},rows:{type:Number},height:{type:String}}}#t="";#e=null;constructor(){super(),this.type="string",this.readonly=!1,this.disabled=!1,this.placeholder="",this.step="any",this.rows=12,this.height="400px"}get value(){if(CODE_TYPES.has(this.type))return this.#e?.value??this.#t;const t=this.renderRoot?.querySelector("[data-ve-input]");return t?"boolean"===this.type?"true"===t.value:"number"===this.type?Number(t.value):t.value:this.#t}set value(t){this.#t=t??"",CODE_TYPES.has(this.type)&&this.#e?this.#e.value=String(this.#t):this.requestUpdate()}updated(t){t.has("type")&&this.#i(),this.#e&&((t.has("readonly")||t.has("disabled"))&&(this.#e.readOnly=this.readonly||this.disabled),t.has("height")&&(this.#e.height=this.height))}disconnectedCallback(){super.disconnectedCallback(),this.#n()}#i=()=>{CODE_TYPES.has(this.type)?this.#e?this.#e.language=TYPE_TO_LANG[this.type]||"plaintext":this.#a():this.#n()};#a=()=>{this.#e=document.createElement("admin-monaco"),this.#e.language=TYPE_TO_LANG[this.type]||"plaintext",this.#e.readOnly=this.readonly||this.disabled,this.#e.height=this.height,this.#e.value=String(this.#t),this.#e.addEventListener("change",this.#s),this.appendChild(this.#e)};#n=()=>{this.#e&&(this.#e.removeEventListener("change",this.#s),this.#e.remove(),this.#e=null)};#o=t=>{this.dispatchEvent(new Event(t,{bubbles:!0,composed:!0}))};#s=()=>{this.#t=this.#e.value,this.#o("input"),this.#o("change")};#h=()=>{const t=this.renderRoot?.querySelector("[data-ve-input]");t&&(this.#t=t.value),this.#o("input")};#l=()=>{const t=this.renderRoot?.querySelector("[data-ve-input]");t&&(this.#t=t.value),this.#o("change")};render(){return CODE_TYPES.has(this.type)?html`<slot></slot>`:"boolean"===this.type?html`<select
+				data-ve-input
+				class="full"
+				?disabled="${this.disabled||this.readonly}"
+				@change="${this.#l}"
+			>
+				<option value="true" ?selected="${"true"===String(this.#t)}">true</option>
+				<option value="false" ?selected="${"true"!==String(this.#t)}">false</option>
+			</select>`:"number"===this.type?html`<input
+				data-ve-input
+				type="number"
+				class="full"
+				.value="${String(this.#t??0)}"
+				placeholder="${this.placeholder||nothing}"
+				step="${this.step||nothing}"
+				min="${this.min??nothing}"
+				max="${this.max??nothing}"
+				?readonly="${this.readonly}"
+				?disabled="${this.disabled}"
+				@input="${this.#h}"
+				@change="${this.#l}"
+			>`:"color"===this.type?html`<input
+				data-ve-input
+				type="color"
+				.value="${this.#t||"#000000"}"
+				?disabled="${this.disabled||this.readonly}"
+				@input="${this.#h}"
+				@change="${this.#l}"
+			>`:html`<textarea
+			data-ve-input
+			class="full ff-mono"
+			rows="${this.rows}"
+			placeholder="${this.placeholder||nothing}"
+			?readonly="${this.readonly}"
+			?disabled="${this.disabled}"
+			@input="${this.#h}"
+			@change="${this.#l}"
+			.value="${String(this.#t)}"
+		></textarea>`}}customElements.define("admin-value-editor",ValueEditor);
+//# sourceMappingURL=ValueEditor.js.map

package/dist/admin/components/ValueEditor.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"src/admin/components/ValueEditor.js","names":["ShadowComponent","html","nothing","CODE_TYPES","Set","TYPE_TO_LANG","css","javascript","json","xml","ValueEditor","properties","type","String","reflect","readonly","Boolean","disabled","placeholder","min","max","step","rows","Number","height","value","monacoEl","constructor","super","this","has","el","renderRoot","querySelector","v","requestUpdate","updated","changedProperties","syncEditor","readOnly","disconnectedCallback","destroyMonaco","language","createMonaco","document","createElement","addEventListener","onMonacoChange","appendChild","removeEventListener","remove","emit","name","dispatchEvent","Event","bubbles","composed","onInput","onChange","render","customElements","define"],"sources":["0"],"sourcesContent":["import ShadowComponent from '/kempo-ui/components/ShadowComponent.js';\nimport { html, nothing } from '/kempo-ui/lit-all.min.js';\nimport '/admin/components/Monaco.js';\n\nconst CODE_TYPES = new Set(['html', 'css', 'javascript', 'json', 'xml']);\nconst TYPE_TO_LANG = { html: 'html', css: 'css', javascript: 'javascript', json: 'json', xml: 'xml' };\n\nexport default class ValueEditor extends ShadowComponent {\n\t/*\n\t\tReactive Properties\n\t*/\n\n\tstatic get properties() {\n\t\treturn {\n\t\t\ttype: { type: String, reflect: true },\n\t\t\treadonly: { type: Boolean, reflect: true },\n\t\t\tdisabled: { type: Boolean, reflect: true },\n\t\t\tplaceholder: { type: String },\n\t\t\tmin: { type: String },\n\t\t\tmax: { type: String },\n\t\t\tstep: { type: String },\n\t\t\trows: { type: Number },\n\t\t\theight: { type: String },\n\t\t};\n\t}\n\n\t#value = '';\n\t#monacoEl = null;\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis.type = 'string';\n\t\tthis.readonly = false;\n\t\tthis.disabled = false;\n\t\tthis.placeholder = '';\n\t\tthis.step = 'any';\n\t\tthis.rows = 12;\n\t\tthis.height = '400px';\n\t}\n\n\t/*\n\t\tValue Accessors\n\t*/\n\n\tget value() {\n\t\tif(CODE_TYPES.has(this.type)){\n\t\t\treturn this.#monacoEl?.value ?? this.#value;\n\t\t}\n\t\tconst el = this.renderRoot?.querySelector('[data-ve-input]');\n\t\tif(!el) return this.#value;\n\t\tif(this.type === 'boolean') return el.value === 'true';\n\t\tif(this.type === 'number') return Number(el.value);\n\t\treturn el.value;\n\t}\n\n\tset value(v) {\n\t\tthis.#value = v ?? '';\n\t\tif(CODE_TYPES.has(this.type) && this.#monacoEl){\n\t\t\tthis.#monacoEl.value = String(this.#value);\n\t\t\treturn;\n\t\t}\n\t\tthis.requestUpdate();\n\t}\n\n\t/*\n\t\tLifecycle\n\t*/\n\n\tupdated(changedProperties) {\n\t\tif(changedProperties.has('type')) this.#syncEditor();\n\t\tif(!this.#monacoEl) return;\n\t\tif(changedProperties.has('readonly') || changedProperties.has('disabled')){\n\t\t\tthis.#monacoEl.readOnly = this.readonly || this.disabled;\n\t\t}\n\t\tif(changedProperties.has('height')){\n\t\t\tthis.#monacoEl.height = this.height;\n\t\t}\n\t}\n\n\tdisconnectedCallback() {\n\t\tsuper.disconnectedCallback();\n\t\tthis.#destroyMonaco();\n\t}\n\n\t/*\n\t\tMonaco Management (light DOM child projected via <slot> for style compat)\n\t*/\n\n\t#syncEditor = () => {\n\t\tif(CODE_TYPES.has(this.type)){\n\t\t\tif(this.#monacoEl){\n\t\t\t\tthis.#monacoEl.language = TYPE_TO_LANG[this.type] || 'plaintext';\n\t\t\t} else {\n\t\t\t\tthis.#createMonaco();\n\t\t\t}\n\t\t} else {\n\t\t\tthis.#destroyMonaco();\n\t\t}\n\t};\n\n\t#createMonaco = () => {\n\t\tthis.#monacoEl = document.createElement('admin-monaco');\n\t\tthis.#monacoEl.language = TYPE_TO_LANG[this.type] || 'plaintext';\n\t\tthis.#monacoEl.readOnly = this.readonly || this.disabled;\n\t\tthis.#monacoEl.height = this.height;\n\t\tthis.#monacoEl.value = String(this.#value);\n\t\tthis.#monacoEl.addEventListener('change', this.#onMonacoChange);\n\t\tthis.appendChild(this.#monacoEl);\n\t};\n\n\t#destroyMonaco = () => {\n\t\tif(!this.#monacoEl) return;\n\t\tthis.#monacoEl.removeEventListener('change', this.#onMonacoChange);\n\t\tthis.#monacoEl.remove();\n\t\tthis.#monacoEl = null;\n\t};\n\n\t/*\n\t\tEvent Handlers\n\t*/\n\n\t#emit = name => {\n\t\tthis.dispatchEvent(new Event(name, { bubbles: true, composed: true }));\n\t};\n\n\t#onMonacoChange = () => {\n\t\tthis.#value = this.#monacoEl.value;\n\t\tthis.#emit('input');\n\t\tthis.#emit('change');\n\t};\n\n\t#onInput = () => {\n\t\tconst el = this.renderRoot?.querySelector('[data-ve-input]');\n\t\tif(el) this.#value = el.value;\n\t\tthis.#emit('input');\n\t};\n\n\t#onChange = () => {\n\t\tconst el = this.renderRoot?.querySelector('[data-ve-input]');\n\t\tif(el) this.#value = el.value;\n\t\tthis.#emit('change');\n\t};\n\n\t/*\n\t\tRender\n\t*/\n\n\trender() {\n\t\tif(CODE_TYPES.has(this.type)){\n\t\t\treturn html`<slot></slot>`;\n\t\t}\n\n\t\tif(this.type === 'boolean'){\n\t\t\treturn html`<select\n\t\t\t\tdata-ve-input\n\t\t\t\tclass=\"full\"\n\t\t\t\t?disabled=\"${this.disabled || this.readonly}\"\n\t\t\t\t@change=\"${this.#onChange}\"\n\t\t\t>\n\t\t\t\t<option value=\"true\" ?selected=\"${String(this.#value) === 'true'}\">true</option>\n\t\t\t\t<option value=\"false\" ?selected=\"${String(this.#value) !== 'true'}\">false</option>\n\t\t\t</select>`;\n\t\t}\n\n\t\tif(this.type === 'number'){\n\t\t\treturn html`<input\n\t\t\t\tdata-ve-input\n\t\t\t\ttype=\"number\"\n\t\t\t\tclass=\"full\"\n\t\t\t\t.value=\"${String(this.#value ?? 0)}\"\n\t\t\t\tplaceholder=\"${this.placeholder || nothing}\"\n\t\t\t\tstep=\"${this.step || nothing}\"\n\t\t\t\tmin=\"${this.min ?? nothing}\"\n\t\t\t\tmax=\"${this.max ?? nothing}\"\n\t\t\t\t?readonly=\"${this.readonly}\"\n\t\t\t\t?disabled=\"${this.disabled}\"\n\t\t\t\t@input=\"${this.#onInput}\"\n\t\t\t\t@change=\"${this.#onChange}\"\n\t\t\t>`;\n\t\t}\n\n\t\tif(this.type === 'color'){\n\t\t\treturn html`<input\n\t\t\t\tdata-ve-input\n\t\t\t\ttype=\"color\"\n\t\t\t\t.value=\"${this.#value || '#000000'}\"\n\t\t\t\t?disabled=\"${this.disabled || this.readonly}\"\n\t\t\t\t@input=\"${this.#onInput}\"\n\t\t\t\t@change=\"${this.#onChange}\"\n\t\t\t>`;\n\t\t}\n\n\t\treturn html`<textarea\n\t\t\tdata-ve-input\n\t\t\tclass=\"full ff-mono\"\n\t\t\trows=\"${this.rows}\"\n\t\t\tplaceholder=\"${this.placeholder || nothing}\"\n\t\t\t?readonly=\"${this.readonly}\"\n\t\t\t?disabled=\"${this.disabled}\"\n\t\t\t@input=\"${this.#onInput}\"\n\t\t\t@change=\"${this.#onChange}\"\n\t\t\t.value=\"${String(this.#value)}\"\n\t\t></textarea>`;\n\t}\n}\n\ncustomElements.define('admin-value-editor', ValueEditor);\n"],"mappings":"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","ignoreList":[]}

package/dist/admin/components/tableControls/AddMember.js

@@ -0,0 +1,6 @@
+import TableControl from"/kempo-ui/components/tableControls/TableControl.js";import{html}from"/kempo-ui/lit-all.min.js";import Dialog from"/kempo-ui/components/Dialog.js";import Toast from"/kempo-ui/components/Toast.js";import"/kempo-ui/components/Icon.js";import"/kempo-ui/components/Combobox.js";import"/kempo-ui/components/Spinner.js";export default class AddMember extends TableControl{groupName="";addMember=()=>{let e=null;const t=document.createElement("k-combobox");t.setAttribute("placeholder","Search users..."),t.setAttribute("debounce-ms","350"),t.setAttribute("require-match",""),t.addEventListener("search",async e=>{t.searching=!0;const{searchUsers:o}=await import("/kempo/sdk.js"),[m,s]=await o({q:e.detail.value,notInGroup:this.groupName,limit:20});t.searching=!1,!m&&s&&t.setOptions(s.users.map(e=>({label:`${e.name} (${e.email})`,value:e.id})))}),t.addEventListener("select",t=>{e=t.detail.value});const o=document.createElement("div");o.className="p",o.appendChild(t),Dialog.create(o,{title:"Add Member",confirmText:"Add",confirmAction:async()=>{if(!e)return;const{addMemberToGroup:t}=await import("/kempo/sdk.js"),[o]=await t(this.groupName,e);o?Toast.error(o.msg||"Failed to add member"):(Toast.success("Member added"),this.dispatchEvent(new CustomEvent("memberAdded",{bubbles:!0,composed:!0})))},cancelText:"Cancel"})};render(){return html`
+      <button class="no-btn icon-btn" title="Add Member" @click="${this.addMember}">
+        <k-icon name="person_add"></k-icon>
+      </button>
+    `}}customElements.define("admin-add-member",AddMember);
+//# sourceMappingURL=AddMember.js.map

package/dist/admin/components/tableControls/AddMember.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"src/admin/components/tableControls/AddMember.js","names":["TableControl","html","Dialog","Toast","AddMember","groupName","addMember","selectedUserId","$combobox","document","createElement","setAttribute","addEventListener","async","searching","searchUsers","import","err","data","q","e","detail","value","notInGroup","this","limit","setOptions","users","map","u","label","name","email","id","$wrap","className","appendChild","create","title","confirmText","confirmAction","addMemberToGroup","error","msg","success","dispatchEvent","CustomEvent","bubbles","composed","cancelText","render","customElements","define"],"sources":["0"],"sourcesContent":["import TableControl from '/kempo-ui/components/tableControls/TableControl.js';\nimport { html } from '/kempo-ui/lit-all.min.js';\nimport Dialog from '/kempo-ui/components/Dialog.js';\nimport Toast from '/kempo-ui/components/Toast.js';\nimport '/kempo-ui/components/Icon.js';\nimport '/kempo-ui/components/Combobox.js';\nimport '/kempo-ui/components/Spinner.js';\n\nexport default class AddMember extends TableControl {\n  groupName = '';\n\n  addMember = () => {\n    let selectedUserId = null;\n\n    const $combobox = document.createElement('k-combobox');\n    $combobox.setAttribute('placeholder', 'Search users...');\n    $combobox.setAttribute('debounce-ms', '350');\n    $combobox.setAttribute('require-match', '');\n\n    $combobox.addEventListener('search', async e => {\n      $combobox.searching = true;\n      const { searchUsers } = await import('/kempo/sdk.js');\n      const [err, data] = await searchUsers({ q: e.detail.value, notInGroup: this.groupName, limit: 20 });\n      $combobox.searching = false;\n      if(err || !data) return;\n      $combobox.setOptions(data.users.map(u => ({ label: `${u.name} (${u.email})`, value: u.id })));\n    });\n\n    $combobox.addEventListener('select', e => {\n      selectedUserId = e.detail.value;\n    });\n\n    const $wrap = document.createElement('div');\n    $wrap.className = 'p';\n    $wrap.appendChild($combobox);\n\n    Dialog.create($wrap, {\n      title: 'Add Member',\n      confirmText: 'Add',\n      confirmAction: async () => {\n        if(!selectedUserId) return;\n        const { addMemberToGroup } = await import('/kempo/sdk.js');\n        const [err] = await addMemberToGroup(this.groupName, selectedUserId);\n        if(err){ Toast.error(err.msg || 'Failed to add member'); return; }\n        Toast.success('Member added');\n        this.dispatchEvent(new CustomEvent('memberAdded', { bubbles: true, composed: true }));\n      },\n      cancelText: 'Cancel'\n    });\n  };\n\n  render(){\n    return html`\n      <button class=\"no-btn icon-btn\" title=\"Add Member\" @click=\"${this.addMember}\">\n        <k-icon name=\"person_add\"></k-icon>\n      </button>\n    `;\n  }\n}\n\ncustomElements.define('admin-add-member', AddMember);\n"],"mappings":"OAAOA,iBAAkB,4DAChBC,SAAY,kCACdC,WAAY,wCACZC,UAAW,sCACX,qCACA,yCACA,iDAEQ,MAAMC,kBAAkBJ,aACrCK,UAAY,GAEZC,UAAY,KACV,IAAIC,EAAiB,KAErB,MAAMC,EAAYC,SAASC,cAAc,cACzCF,EAAUG,aAAa,cAAe,mBACtCH,EAAUG,aAAa,cAAe,OACtCH,EAAUG,aAAa,gBAAiB,IAExCH,EAAUI,iBAAiB,SAAUC,UACnCL,EAAUM,WAAY,EACtB,MAAMC,YAAEA,SAAsBC,OAAO,kBAC9BC,EAAKC,SAAcH,EAAY,CAAEI,EAAGC,EAAEC,OAAOC,MAAOC,WAAYC,KAAKnB,UAAWoB,MAAO,KAC9FjB,EAAUM,WAAY,GACnBG,GAAQC,GACXV,EAAUkB,WAAWR,EAAKS,MAAMC,IAAIC,IAAK,CAAGC,MAAO,GAAGD,EAAEE,SAASF,EAAEG,SAAUV,MAAOO,EAAEI,SAGxFzB,EAAUI,iBAAiB,SAAUQ,IACnCb,EAAiBa,EAAEC,OAAOC,QAG5B,MAAMY,EAAQzB,SAASC,cAAc,OACrCwB,EAAMC,UAAY,IAClBD,EAAME,YAAY5B,GAElBN,OAAOmC,OAAOH,EAAO,CACnBI,MAAO,aACPC,YAAa,MACbC,cAAe3B,UACb,IAAIN,EAAgB,OACpB,MAAMkC,iBAAEA,SAA2BzB,OAAO,kBACnCC,SAAawB,EAAiBjB,KAAKnB,UAAWE,GAClDU,EAAMd,MAAMuC,MAAMzB,EAAI0B,KAAO,yBAChCxC,MAAMyC,QAAQ,gBACdpB,KAAKqB,cAAc,IAAIC,YAAY,cAAe,CAAEC,SAAS,EAAMC,UAAU,OAE/EC,WAAY,YAIhB,MAAAC,GACE,OAAOjD,IAAI;mEACoDuB,KAAKlB;;;KAItE,EAGF6C,eAAeC,OAAO,mBAAoBhD","ignoreList":[]}

package/dist/admin/components/tableControls/AddPermission.js

@@ -0,0 +1,6 @@
+import TableControl from"/kempo-ui/components/tableControls/TableControl.js";import{html}from"/kempo-ui/lit-all.min.js";import Dialog from"/kempo-ui/components/Dialog.js";import Toast from"/kempo-ui/components/Toast.js";import"/kempo-ui/components/Icon.js";import"/kempo-ui/components/Combobox.js";export default class AddPermission extends TableControl{groupName="";addPermission=async()=>{const{listPermissions:e,getGroupPermissions:o,addPermissionToGroup:s}=await import("/kempo/sdk.js"),[[t,i],[n,r]]=await Promise.all([e({limit:1e3}),o(this.groupName)]);if(t)return void Toast.error(t.msg||"Failed to load permissions");if(n)return void Toast.error(n.msg||"Failed to load group permissions");const m=new Set(r.permissions),a=i.permissions.filter(e=>!m.has(e.name));let d=null;const l=document.createElement("k-combobox");l.setAttribute("placeholder","Search permissions..."),l.setAttribute("require-match",""),l.setOptions(a.map(e=>({label:e.name,value:e.name}))),l.addEventListener("select",e=>{d=e.detail.value});const c=document.createElement("div");c.className="p",c.appendChild(l),Dialog.create(c,{title:"Add Permission",confirmText:"Add",confirmAction:async()=>{if(!d)return;const[e]=await s(this.groupName,d);e?Toast.error(e.msg||"Failed to add permission"):(Toast.success("Permission added"),this.dispatchEvent(new CustomEvent("permissionAdded",{bubbles:!0,composed:!0})))},cancelText:"Cancel"})};render(){return html`
+      <button class="no-btn icon-btn" title="Add Permission" @click="${this.addPermission}">
+        <k-icon name="lock_add"></k-icon>
+      </button>
+    `}}customElements.define("admin-add-permission",AddPermission);
+//# sourceMappingURL=AddPermission.js.map

package/dist/admin/components/tableControls/AddPermission.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"src/admin/components/tableControls/AddPermission.js","names":["TableControl","html","Dialog","Toast","AddPermission","groupName","addPermission","async","listPermissions","getGroupPermissions","addPermissionToGroup","import","allErr","allData","groupErr","groupPerms","Promise","all","limit","this","error","msg","assigned","Set","permissions","available","filter","p","has","name","selectedPermName","$combobox","document","createElement","setAttribute","setOptions","map","label","value","addEventListener","e","detail","$wrap","className","appendChild","create","title","confirmText","confirmAction","err","success","dispatchEvent","CustomEvent","bubbles","composed","cancelText","render","customElements","define"],"sources":["0"],"sourcesContent":["import TableControl from '/kempo-ui/components/tableControls/TableControl.js';\nimport { html } from '/kempo-ui/lit-all.min.js';\nimport Dialog from '/kempo-ui/components/Dialog.js';\nimport Toast from '/kempo-ui/components/Toast.js';\nimport '/kempo-ui/components/Icon.js';\nimport '/kempo-ui/components/Combobox.js';\n\nexport default class AddPermission extends TableControl {\n  groupName = '';\n\n  addPermission = async () => {\n    const { listPermissions, getGroupPermissions, addPermissionToGroup } = await import('/kempo/sdk.js');\n\n    const [[allErr, allData], [groupErr, groupPerms]] = await Promise.all([\n      listPermissions({ limit: 1000 }),\n      getGroupPermissions(this.groupName)\n    ]);\n\n    if(allErr){ Toast.error(allErr.msg || 'Failed to load permissions'); return; }\n    if(groupErr){ Toast.error(groupErr.msg || 'Failed to load group permissions'); return; }\n\n    const assigned = new Set(groupPerms.permissions);\n    const available = allData.permissions.filter(p => !assigned.has(p.name));\n\n    let selectedPermName = null;\n\n    const $combobox = document.createElement('k-combobox');\n    $combobox.setAttribute('placeholder', 'Search permissions...');\n    $combobox.setAttribute('require-match', '');\n    $combobox.setOptions(available.map(p => ({ label: p.name, value: p.name })));\n\n    $combobox.addEventListener('select', e => {\n      selectedPermName = e.detail.value;\n    });\n\n    const $wrap = document.createElement('div');\n    $wrap.className = 'p';\n    $wrap.appendChild($combobox);\n\n    Dialog.create($wrap, {\n      title: 'Add Permission',\n      confirmText: 'Add',\n      confirmAction: async () => {\n        if(!selectedPermName) return;\n        const [err] = await addPermissionToGroup(this.groupName, selectedPermName);\n        if(err){ Toast.error(err.msg || 'Failed to add permission'); return; }\n        Toast.success('Permission added');\n        this.dispatchEvent(new CustomEvent('permissionAdded', { bubbles: true, composed: true }));\n      },\n      cancelText: 'Cancel'\n    });\n  };\n\n  render(){\n    return html`\n      <button class=\"no-btn icon-btn\" title=\"Add Permission\" @click=\"${this.addPermission}\">\n        <k-icon name=\"lock_add\"></k-icon>\n      </button>\n    `;\n  }\n}\n\ncustomElements.define('admin-add-permission', AddPermission);\n"],"mappings":"OAAOA,iBAAkB,4DAChBC,SAAY,kCACdC,WAAY,wCACZC,UAAW,sCACX,qCACA,kDAEQ,MAAMC,sBAAsBJ,aACzCK,UAAY,GAEZC,cAAgBC,UACd,MAAMC,gBAAEA,EAAeC,oBAAEA,EAAmBC,qBAAEA,SAA+BC,OAAO,mBAE5EC,EAAQC,IAAWC,EAAUC,UAAqBC,QAAQC,IAAI,CACpET,EAAgB,CAAEU,MAAO,MACzBT,EAAoBU,KAAKd,aAG3B,GAAGO,EAAkE,YAAzDT,MAAMiB,MAAMR,EAAOS,KAAO,8BACtC,GAAGP,EAA4E,YAAjEX,MAAMiB,MAAMN,EAASO,KAAO,oCAE1C,MAAMC,EAAW,IAAIC,IAAIR,EAAWS,aAC9BC,EAAYZ,EAAQW,YAAYE,OAAOC,IAAML,EAASM,IAAID,EAAEE,OAElE,IAAIC,EAAmB,KAEvB,MAAMC,EAAYC,SAASC,cAAc,cACzCF,EAAUG,aAAa,cAAe,yBACtCH,EAAUG,aAAa,gBAAiB,IACxCH,EAAUI,WAAWV,EAAUW,IAAIT,IAAK,CAAGU,MAAOV,EAAEE,KAAMS,MAAOX,EAAEE,SAEnEE,EAAUQ,iBAAiB,SAAUC,IACnCV,EAAmBU,EAAEC,OAAOH,QAG9B,MAAMI,EAAQV,SAASC,cAAc,OACrCS,EAAMC,UAAY,IAClBD,EAAME,YAAYb,GAElB7B,OAAO2C,OAAOH,EAAO,CACnBI,MAAO,iBACPC,YAAa,MACbC,cAAezC,UACb,IAAIuB,EAAkB,OACtB,MAAOmB,SAAavC,EAAqBS,KAAKd,UAAWyB,GACtDmB,EAAM9C,MAAMiB,MAAM6B,EAAI5B,KAAO,6BAChClB,MAAM+C,QAAQ,oBACd/B,KAAKgC,cAAc,IAAIC,YAAY,kBAAmB,CAAEC,SAAS,EAAMC,UAAU,OAEnFC,WAAY,YAIhB,MAAAC,GACE,OAAOvD,IAAI;uEACwDkB,KAAKb;;;KAI1E,EAGFmD,eAAeC,OAAO,uBAAwBtD","ignoreList":[]}

package/dist/admin/components/tableControls/InstallExtension.js

@@ -0,0 +1,6 @@
+import TableControl from"/kempo-ui/components/tableControls/TableControl.js";import{html}from"/kempo-ui/lit-all.min.js";import Dialog from"/kempo-ui/components/Dialog.js";import Toast from"/kempo-ui/components/Toast.js";import"/kempo-ui/components/Icon.js";export default class InstallExtension extends TableControl{install=async()=>{this.record&&Dialog.confirm(`Install "${this.record.name}"?`,async o=>{if(!o)return;const{installExtension:t}=await import("../../kempo/sdk.js"),[n]=await t(this.record.name);n?Toast.error(n.error||"Failed to install extension"):(Toast.success(`"${this.record.name}" installed successfully`),this.table.deleteRecord(this.record))})};render(){return html`
+      <button class="no-btn icon-btn" title="Install Extension" @click="${this.install}">
+        <k-icon name="download"></k-icon>
+      </button>
+    `}}customElements.define("admin-install-extension",InstallExtension);
+//# sourceMappingURL=InstallExtension.js.map

package/dist/admin/components/tableControls/InstallExtension.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"src/admin/components/tableControls/InstallExtension.js","names":["TableControl","html","Dialog","Toast","InstallExtension","install","async","this","record","confirm","name","confirmed","installExtension","import","error","success","table","deleteRecord","render","customElements","define"],"sources":["0"],"sourcesContent":["import TableControl from '/kempo-ui/components/tableControls/TableControl.js';\nimport { html } from '/kempo-ui/lit-all.min.js';\nimport Dialog from '/kempo-ui/components/Dialog.js';\nimport Toast from '/kempo-ui/components/Toast.js';\nimport '/kempo-ui/components/Icon.js';\n\nexport default class InstallExtension extends TableControl {\n  install = async () => {\n    if(!this.record) return;\n\n    Dialog.confirm(`Install \"${this.record.name}\"?`, async confirmed => {\n      if(!confirmed) return;\n\n      const { installExtension } = await import('../../kempo/sdk.js');\n      const [error] = await installExtension(this.record.name);\n\n      if(error){\n        Toast.error(error.error || 'Failed to install extension');\n        return;\n      }\n\n      Toast.success(`\"${this.record.name}\" installed successfully`);\n      this.table.deleteRecord(this.record);\n    });\n  };\n\n  render(){\n    return html`\n      <button class=\"no-btn icon-btn\" title=\"Install Extension\" @click=\"${this.install}\">\n        <k-icon name=\"download\"></k-icon>\n      </button>\n    `;\n  }\n}\n\ncustomElements.define('admin-install-extension', InstallExtension);\n"],"mappings":"OAAOA,iBAAkB,4DAChBC,SAAY,kCACdC,WAAY,wCACZC,UAAW,sCACX,8CAEQ,MAAMC,yBAAyBJ,aAC5CK,QAAUC,UACJC,KAAKC,QAETN,OAAOO,QAAQ,YAAYF,KAAKC,OAAOE,SAAUJ,UAC/C,IAAIK,EAAW,OAEf,MAAMC,iBAAEA,SAA2BC,OAAO,uBACnCC,SAAeF,EAAiBL,KAAKC,OAAOE,MAEhDI,EACDX,MAAMW,MAAMA,EAAMA,OAAS,gCAI7BX,MAAMY,QAAQ,IAAIR,KAAKC,OAAOE,gCAC9BH,KAAKS,MAAMC,aAAaV,KAAKC,YAIjC,MAAAU,GACE,OAAOjB,IAAI;0EAC2DM,KAAKF;;;KAI7E,EAGFc,eAAeC,OAAO,0BAA2BhB","ignoreList":[]}

package/dist/admin/components/tableControls/UninstallExtension.js

@@ -0,0 +1,6 @@
+import TableControl from"/kempo-ui/components/tableControls/TableControl.js";import{html}from"/kempo-ui/lit-all.min.js";import Dialog from"/kempo-ui/components/Dialog.js";import Toast from"/kempo-ui/components/Toast.js";import"/kempo-ui/components/Icon.js";export default class UninstallExtension extends TableControl{uninstall=async()=>{this.record&&Dialog.confirm(`Uninstall "${this.record.name}"? This may delete extension data.`,async n=>{if(!n)return;const{uninstallExtension:t}=await import("../../kempo/sdk.js"),[o]=await t(this.record.name);o?Toast.error(o.error||"Failed to uninstall extension"):(Toast.success(`"${this.record.name}" uninstalled successfully`),this.table.deleteRecord(this.record))})};render(){return html`
+      <button class="no-btn icon-btn" title="Uninstall Extension" @click="${this.uninstall}">
+        <k-icon name="delete"></k-icon>
+      </button>
+    `}}customElements.define("admin-uninstall-extension",UninstallExtension);
+//# sourceMappingURL=UninstallExtension.js.map

package/dist/admin/components/tableControls/UninstallExtension.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"src/admin/components/tableControls/UninstallExtension.js","names":["TableControl","html","Dialog","Toast","UninstallExtension","uninstall","async","this","record","confirm","name","confirmed","uninstallExtension","import","error","success","table","deleteRecord","render","customElements","define"],"sources":["0"],"sourcesContent":["import TableControl from '/kempo-ui/components/tableControls/TableControl.js';\nimport { html } from '/kempo-ui/lit-all.min.js';\nimport Dialog from '/kempo-ui/components/Dialog.js';\nimport Toast from '/kempo-ui/components/Toast.js';\nimport '/kempo-ui/components/Icon.js';\n\nexport default class UninstallExtension extends TableControl {\n  uninstall = async () => {\n    if(!this.record) return;\n\n    Dialog.confirm(`Uninstall \"${this.record.name}\"? This may delete extension data.`, async confirmed => {\n      if(!confirmed) return;\n\n      const { uninstallExtension } = await import('../../kempo/sdk.js');\n      const [error] = await uninstallExtension(this.record.name);\n\n      if(error){\n        Toast.error(error.error || 'Failed to uninstall extension');\n        return;\n      }\n\n      Toast.success(`\"${this.record.name}\" uninstalled successfully`);\n      this.table.deleteRecord(this.record);\n    });\n  };\n\n  render(){\n    return html`\n      <button class=\"no-btn icon-btn\" title=\"Uninstall Extension\" @click=\"${this.uninstall}\">\n        <k-icon name=\"delete\"></k-icon>\n      </button>\n    `;\n  }\n}\n\ncustomElements.define('admin-uninstall-extension', UninstallExtension);\n"],"mappings":"OAAOA,iBAAkB,4DAChBC,SAAY,kCACdC,WAAY,wCACZC,UAAW,sCACX,8CAEQ,MAAMC,2BAA2BJ,aAC9CK,UAAYC,UACNC,KAAKC,QAETN,OAAOO,QAAQ,cAAcF,KAAKC,OAAOE,yCAA0CJ,UACjF,IAAIK,EAAW,OAEf,MAAMC,mBAAEA,SAA6BC,OAAO,uBACrCC,SAAeF,EAAmBL,KAAKC,OAAOE,MAElDI,EACDX,MAAMW,MAAMA,EAAMA,OAAS,kCAI7BX,MAAMY,QAAQ,IAAIR,KAAKC,OAAOE,kCAC9BH,KAAKS,MAAMC,aAAaV,KAAKC,YAIjC,MAAAU,GACE,OAAOjB,IAAI;4EAC6DM,KAAKF;;;KAI/E,EAGFc,eAAeC,OAAO,4BAA6BhB","ignoreList":[]}

package/dist/admin/content/fragments/edit/index.page.html

@@ -0,0 +1,4 @@
+<!--
+	locked: true
+-->
+<page title="Edit Fragment - Admin"><content><admin-fragment-editor></admin-fragment-editor></content><content location="head"><script type="module" src="/admin/components/FragmentEditor.js"></script></content></page>

package/dist/admin/content/fragments/index.page.html

@@ -0,0 +1,169 @@
+<!--
+	locked: true
+-->
+<page title="Fragments - Admin"><content><script type="module" src="/kempo-ui/components/Table.js"></script><script type="module" src="/kempo-ui/components/tableControls/FirstPage.js"></script><script type="module" src="/kempo-ui/components/tableControls/PrevPage.js"></script><script type="module" src="/kempo-ui/components/tableControls/NextPage.js"></script><script type="module" src="/kempo-ui/components/tableControls/LastPage.js"></script><script type="module" src="/kempo-ui/components/tableControls/PageSelect.js"></script><script type="module" src="/kempo-ui/components/tableControls/PageSize.js"></script><script type="module" src="/kempo-ui/components/tableControls/DeleteRecord.js"></script><script type="module" src="/kempo-ui/components/tableControls/DeleteSelected.js"></script><script type="module" src="/kempo-ui/components/Icon.js"></script><script type="module" src="/admin/components/TableRowLink.js"></script><script type="module" src="/kempo/components/Permission.js"></script><div class="d-f mb" style="align-items: center; gap: var(--spacer);"><h1 class="flex mb0">Fragments</h1><k-permission has="system:fragments:create"><button id="createFragmentBtn" class="primary">Create Fragment</button></k-permission></div><h2>Custom Fragments</h2><k-table id="customTable" enable-pages page-size="25" page-size-options="[10,25,50,100]" placeholder="No custom fragments have been created yet."><admin-table-row-link slot="before" url-pattern="/admin/content/fragments/edit?fragment={editPath}" field-name="editPath"></admin-table-row-link><div slot="top" class="d-f full" style="align-items: center;"><div><k-permission has="system:fragments:delete"><k-tc-delete-selected></k-tc-delete-selected></k-permission></div></div><div class="d-f full" style="align-items: center;"><div><k-tc-first-page></k-tc-first-page><k-tc-prev-page></k-tc-prev-page><k-tc-next-page></k-tc-next-page><k-tc-last-page></k-tc-last-page></div><div class="flex"></div><div><k-tc-page-select></k-tc-page-select></div><div class="flex"></div><div><k-tc-page-size></k-tc-page-size></div></div></k-table><h2>Extension Fragments</h2><k-table id="extensionTable" enable-pages page-size="25" page-size-options="[10,25,50,100]" placeholder="No extension fragments installed."><admin-table-row-link slot="before" url-pattern="/admin/content/fragments/edit?fragment={editPath}" field-name="editPath"></admin-table-row-link><div class="d-f full" style="align-items: center;"><div><k-tc-first-page></k-tc-first-page><k-tc-prev-page></k-tc-prev-page><k-tc-next-page></k-tc-next-page><k-tc-last-page></k-tc-last-page></div><div class="flex"></div><div><k-tc-page-select></k-tc-page-select></div><div class="flex"></div><div><k-tc-page-size></k-tc-page-size></div></div></k-table><h2>System Fragments</h2><k-table id="systemTable" enable-pages page-size="25" page-size-options="[10,25,50,100]" placeholder="No system fragments found."><admin-table-row-link slot="before" url-pattern="/admin/content/fragments/edit?fragment={editPath}" field-name="editPath"></admin-table-row-link><div class="d-f full" style="align-items: center;"><div><k-tc-first-page></k-tc-first-page><k-tc-prev-page></k-tc-prev-page><k-tc-next-page></k-tc-next-page><k-tc-last-page></k-tc-last-page></div><div class="flex"></div><div><k-tc-page-select></k-tc-page-select></div><div class="flex"></div><div><k-tc-page-size></k-tc-page-size></div></div></k-table><script type="module">import { listFragments, listDirectories, createFragment, deleteFragments, getAllCurrentUserPermissions } from '/kempo/sdk.js';
+			import { html } from '/kempo-ui/lit-all.min.js';
+			import Dialog from '/kempo-ui/components/Dialog.js';
+			import Toast from '/kempo-ui/components/Toast.js';
+
+			await window.customElements.whenDefined('k-table');
+
+			const [, permData] = await getAllCurrentUserPermissions();
+			const myPerms = new Set(permData?.permissions ?? []);
+
+			const fields = [
+				{ name: 'lockedBadge', label: '', size: 40, formatter: v => v },
+				{ name: 'name', label: 'Name', size: 200 },
+				{ name: 'file', label: 'File', size: 300 },
+				{ name: 'author', label: 'Author', size: 150 },
+				{ name: 'updatedAt', label: 'Updated', size: 190, formatter: v => v ? new Date(v).toLocaleString() : '' },
+				{ name: 'createdAt', label: 'Created', size: 190, formatter: v => v ? new Date(v).toLocaleString() : '' }
+			];
+
+			const extensionFields = [
+				{ name: 'owner', label: 'Extension', size: 120 },
+				...fields
+			];
+
+			const $customTable = document.getElementById('customTable');
+			const $extensionTable = document.getElementById('extensionTable');
+			const $systemTable = document.getElementById('systemTable');
+
+			const loadFragments = async () => {
+				const [error, data] = await listFragments();
+				if(error){
+					Toast.error(error.msg || 'Failed to load fragments');
+					return;
+				}
+				const toEditPath = f => ({ ...f, editPath: f.file.replace(/\.fragment\.html$/, ''), lockedBadge: f.locked ? '<k-icon name="lock"></k-icon>' : '' });
+				const custom = data.fragments.filter(f => f.owner === 'custom').map(toEditPath);
+				const extension = data.fragments.filter(f => f.owner !== 'custom' && f.owner !== 'system').map(toEditPath);
+				const system = data.fragments.filter(f => f.owner === 'system').map(toEditPath);
+				$customTable.setData({ records: custom, fields });
+				$extensionTable.setData({ records: extension, fields: extensionFields });
+				$systemTable.setData({ records: system, fields });
+			};
+
+			if(myPerms.has('system:fragments:delete')){
+				$customTable.setAttribute('request-delete', '');
+				$customTable.setAttribute('enable-selection', '');
+				const del = document.createElement('k-tc-delete-record');
+				del.setAttribute('slot', 'after');
+				$customTable.appendChild(del);
+			}
+
+			await loadFragments();
+
+			$customTable.addEventListener('requestDelete', ({ detail: { records, approve, reject } }) => {
+				const locked = records.filter(r => r.locked);
+				if(locked.length){
+					Toast.error(locked.length === 1 ? `"${locked[0].name || locked[0].file}" is locked and cannot be deleted.` : `${locked.length} selected fragments are locked and cannot be deleted.`);
+					reject();
+					return;
+				}
+				const count = records.length;
+				const msg = count === 1
+					? `Delete "${records[0].name || records[0].file}"? This action cannot be undone.`
+					: `Delete ${count} fragments? This action cannot be undone.`;
+				Dialog.confirm(msg, async (confirmed) => {
+					if(!confirmed){ reject(); return; }
+					const files = records.map(r => r.file);
+					const [error] = await deleteFragments(files);
+					if(error){
+						reject();
+						Toast.error(error.msg || 'Failed to delete');
+						return;
+					}
+					approve();
+					Toast.success(count === 1 ? 'Fragment deleted' : `${count} fragments deleted`);
+				});
+			});
+
+			/*
+				Create Fragment Dialog
+			*/
+
+			const slugify = name => name
+				.toLowerCase()
+				.trim()
+				.replace(/[^\w\s-]/g, '')
+				.replace(/[\s_]+/g, '-')
+				.replace(/-+/g, '-')
+				.replace(/^-|-$/g, '');
+
+			document.getElementById('createFragmentBtn')?.addEventListener('click', async () => {
+				const [dirError, dirData] = await listDirectories();
+				if(dirError){
+					Toast.error(dirError.msg || 'Failed to load directories');
+					return;
+				}
+
+				const directories = dirData.directories;
+				const isValidDir = p => /^\/[a-zA-Z0-9_\-\[\]\/]*$/.test(p) && !p.includes('..') && !p.includes('//');
+				const dirToInternal = p => { const t = (p || '/').replace(/^\//, '').replace(/\/$/, ''); return t || '.'; };
+
+				const $dialog = Dialog.create(html`
+					<div class="p">
+						<div class="mb">
+							<label class="d-b mb-sm">Location</label>
+							<input type="text" id="dlg-directory" class="full" list="dlg-dir-list" value="/" placeholder="/">
+							<datalist id="dlg-dir-list">
+								${directories.map(d => html`<option value="${d === '.' ? '/' : '/' + d}">`)}
+							</datalist>
+							<p id="dlg-dir-error" class="mt-sm tc-danger d-n"><small>Invalid path — use format: /path/to/directory</small></p>
+						</div>
+						<div>
+							<label class="d-b mb-sm">Fragment Name</label>
+							<input type="text" id="dlg-name" class="full" placeholder="My Fragment" required>
+							<p class="mt-sm muted"><small id="dlg-slug"></small></p>
+						</div>
+					</div>
+				`, {
+					title: 'Create Fragment',
+					confirmText: 'Create',
+					confirmAction: async () => {
+						const name = $dialog.querySelector('#dlg-name').value.trim();
+						const dirInput = $dialog.querySelector('#dlg-directory').value.trim() || '/';
+
+						if(!name){
+							Toast.error('Fragment name is required');
+							return;
+						}
+
+						if(!isValidDir(dirInput)){
+							Toast.error('Invalid directory path');
+							return;
+						}
+
+						const directory = dirToInternal(dirInput);
+
+						const [error, data] = await createFragment({
+							directory: directory === '.' ? '' : directory,
+							name
+						});
+
+						if(error){
+							Toast.error(error.msg || 'Failed to create fragment');
+							return;
+						}
+
+						Toast.success('Fragment created — redirecting to editor...');
+						setTimeout(() => {
+							window.location.href = `/admin/content/fragments/edit?fragment=${encodeURIComponent(data.file.replace(/\.fragment\.html$/, ''))}`;
+						}, 1500);
+					},
+					cancelText: 'Cancel'
+				});
+
+				const updateSlug = () => {
+					const slug = slugify($dialog.querySelector('#dlg-name').value);
+					const dir = dirToInternal($dialog.querySelector('#dlg-directory').value);
+					const prefix = dir === '.' ? '' : dir + '/';
+					$dialog.querySelector('#dlg-slug').textContent = slug ? prefix + slug + '.fragment.html' : '';
+				};
+				$dialog.querySelector('#dlg-directory').addEventListener('input', e => {
+					$dialog.querySelector('#dlg-dir-error').classList.toggle('d-n', isValidDir(e.target.value || '/'));
+					updateSlug();
+				});
+				$dialog.querySelector('#dlg-name').addEventListener('input', updateSlug);
+			});</script></content></page>

package/dist/admin/content/globals/edit/index.page.html

@@ -0,0 +1,4 @@
+<!--
+	locked: true
+-->
+<page title="Edit Global Content - Admin"><content><admin-global-content-editor></admin-global-content-editor></content><content location="head"><script type="module" src="/admin/components/GlobalContentEditor.js"></script></content></page>