@teipublisher/pb-components 2.26.1-next.2 → 3.0.0-next-4.1

package/dist/pb-dialog-tklYGWfc.js

@@ -0,0 +1,121 @@
+import{w as e,a as t,x as n,i as o,p as i}from"./pb-mixin-DHoWQheB.js";import{o as s}from"./unsafe-html-D5VGo9Oq.js";!function(){if("undefined"!=typeof document&&!("adoptedStyleSheets"in document)){var e="ShadyCSS"in window&&!ShadyCSS.nativeShadow,t=document.implementation.createHTMLDocument(""),n=new WeakMap,o="object"==typeof DOMException?Error:DOMException,i=Object.defineProperty,s=Array.prototype.forEach,r=/@import.+?;?$/gm,c=["addRule","deleteRule","insertRule","removeRule"],a=CSSStyleSheet.prototype;a.replace=function(){return Promise.reject(new o("Can't call replace on non-constructed CSSStyleSheets."))},a.replaceSync=function(){throw new o("Failed to execute 'replaceSync' on 'CSSStyleSheet': Can't call replaceSync on non-constructed CSSStyleSheets.")};var l=new WeakMap,u=new WeakMap,h=new WeakMap,d=new WeakMap,p=F.prototype;p.replace=function(e){try{return this.replaceSync(e),Promise.resolve(this)}catch(e){return Promise.reject(e)}},p.replaceSync=function(e){if(T(this),"string"==typeof e){var t=this;l.get(t).textContent=E(e),d.set(t,[]),u.get(t).forEach(function(e){e.isConnected()&&I(t,j(t,e))})}},i(p,"cssRules",{configurable:!0,enumerable:!0,get:function(){return T(this),l.get(this).sheet.cssRules}}),i(p,"media",{configurable:!0,enumerable:!0,get:function(){return T(this),l.get(this).sheet.media}}),c.forEach(function(e){p[e]=function(){var t=this;T(t);var n=arguments;d.get(t).push({method:e,args:n}),u.get(t).forEach(function(o){if(o.isConnected()){var i=j(t,o).sheet;i[e].apply(i,n)}});var o=l.get(t).sheet;return o[e].apply(o,n)}}),i(F,Symbol.hasInstance,{configurable:!0,value:R});var f={childList:!0,subtree:!0},g=new WeakMap,m=new WeakMap,y=new WeakMap,w=new WeakMap;if(B.prototype={isConnected:function(){var e=m.get(this);return e instanceof Document?"loading"!==e.readyState:x(e.host)},connect:function(){var e=A(this);w.get(this).observe(e,f),y.get(this).length>0&&P(this),O(e,function(e){L(e).connect()})},disconnect:function(){w.get(this).disconnect()},update:function(e){var t=this,n=m.get(t)===document?"Document":"ShadowRoot";if(!Array.isArray(e))throw new TypeError("Failed to set the 'adoptedStyleSheets' property on "+n+": Iterator getter is not callable.");if(!e.every(R))throw new TypeError("Failed to set the 'adoptedStyleSheets' property on "+n+": Failed to convert value to 'CSSStyleSheet'");if(e.some(M))throw new TypeError("Failed to set the 'adoptedStyleSheets' property on "+n+": Can't adopt non-constructed stylesheets");t.sheets=e;var o=y.get(t),i=C(e);k(o,i).forEach(function(e){_(j(e,t)),D(e,t)}),y.set(t,i),t.isConnected()&&i.length>0&&P(t)}},window.CSSStyleSheet=F,N(Document),"ShadowRoot"in window){N(ShadowRoot);var S=Element.prototype,b=S.attachShadow;S.attachShadow=function(e){var t=b.call(this,e);return"closed"===e.mode&&n.set(this,t),t}}var v=L(document);v.isConnected()?v.connect():document.addEventListener("DOMContentLoaded",v.connect.bind(v))}function E(e){var t=e.replace(r,"");return t!==e&&console.warn("@import rules are not allowed here. See https://github.com/WICG/construct-stylesheets/issues/119#issuecomment-588352418"),t.trim()}function x(e){return"isConnected"in e?e.isConnected:document.contains(e)}function C(e){return e.filter(function(t,n){return e.indexOf(t)===n})}function k(e,t){return e.filter(function(e){return-1===t.indexOf(e)})}function _(e){e.parentNode.removeChild(e)}function z(e){return e.shadowRoot||n.get(e)}function R(e){return"object"==typeof e&&(p.isPrototypeOf(e)||a.isPrototypeOf(e))}function M(e){return"object"==typeof e&&a.isPrototypeOf(e)}function $(e,t){var n=document.createElement("style");return h.get(e).set(t,n),u.get(e).push(t),n}function j(e,t){return h.get(e).get(t)}function D(e,t){h.get(e).delete(t),u.set(e,u.get(e).filter(function(e){return e!==t}))}function I(e,t){requestAnimationFrame(function(){t.textContent=l.get(e).textContent,d.get(e).forEach(function(e){return t.sheet[e.method].apply(t.sheet,e.args)})})}function T(e){if(!l.has(e))throw new TypeError("Illegal invocation")}function F(){var e=this,n=document.createElement("style");t.body.appendChild(n),l.set(e,n),u.set(e,[]),h.set(e,new WeakMap),d.set(e,[])}function L(e){var t=g.get(e);return t||(t=new B(e),g.set(e,t)),t}function N(e){i(e.prototype,"adoptedStyleSheets",{configurable:!0,enumerable:!0,get:function(){return L(this).sheets},set:function(e){L(this).update(e)}})}function O(e,t){for(var n=document.createNodeIterator(e,NodeFilter.SHOW_ELEMENT,function(e){return z(e)?NodeFilter.FILTER_ACCEPT:NodeFilter.FILTER_REJECT},null,!1),o=void 0;o=n.nextNode();)t(z(o))}function W(e,t){return t instanceof HTMLStyleElement&&y.get(e).some(function(t){return j(t,e)})}function A(e){var t=m.get(e);return t instanceof Document?t.body:t}function P(e){var t=document.createDocumentFragment(),n=y.get(e),o=w.get(e),i=A(e);o.disconnect(),n.forEach(function(n){t.appendChild(j(n,e)||$(n,e))}),i.insertBefore(t,null),o.observe(i,f),n.forEach(function(t){I(t,j(t,e))})}function B(t){var n=this;n.sheets=[],m.set(n,t),y.set(n,[]),w.set(n,new MutationObserver(function(t,o){document?t.forEach(function(t){e||s.call(t.addedNodes,function(e){e instanceof Element&&O(e,function(e){L(e).connect()})}),s.call(t.removedNodes,function(t){t instanceof Element&&(W(n,t)&&P(n),e||O(t,function(e){L(e).disconnect()}))})}):o.disconnect()}))}}();const r=new Map;async function c(e){const t=[];for(const n of e){const e=await a(n);e&&t.push(e)}if(t.length>0){return(new CSSStyleSheet).replace(t.join(""))}return null}function a(e){return fetch(e).then(t=>t.ok?t.text():(console.warn("<theming> Component stylesheet not found: %s",e),null)).then(e=>e).catch(t=>(console.error("<theming> Error loading stylesheet %s: %o",e,t),null))}function l(e){const t=u();if(!t)return null;const n=d(e).join("|");if(r.has(n))return r.get(n);const o=new RegExp(`^(${n})\\b`);let i=null;const s=h(t.cssRules,o,[]);return s.length>0&&(i=new CSSStyleSheet,i.replaceSync(s.join(""))),console.log("<theming> caching stylesheet for %s",n),r.set(n,i),i}function u(){const e=document.querySelector("pb-page");if(!e)return null;const t=e.stylesheet;return t||null}function h(e,t,n){for(let o=0;o<e.length;o++){const i=e[o];if(i instanceof CSSStyleRule){if(t.test(i.selectorText)){const e=i.cssText.replace(t,":host($1) ");n.push(e)}}else i instanceof CSSMediaRule?(n.push(`\n@media ${i.conditionText} {\n`),h(i.cssRules,t,n),n.push("\n}\n")):i instanceof CSSFontFaceRule||n.push(i.cssText)}return n}function d(e){const t=[e.localName];return e.id&&t.push(`#${e.id}`),e.classList.forEach(e=>t.push(`.${e}`)),t}const p=t=>class extends t{connectedCallback(){super.connectedCallback(),e("pb-page-ready",e=>{const t=u();t&&(this.shadowRoot.adoptedStyleSheets=[...this.shadowRoot.adoptedStyleSheets,t])})}};if(!customElements.__pbDefineGuard){const e=customElements.define.bind(customElements);customElements.define=(t,n,o)=>{customElements.get(t)||e(t,n,o)},customElements.__pbDefineGuard=!0}const f={"icons:file-upload":"upload","icons:file-download":"download","icons:cloud-download":"download","icons:clear":"close","icons:check":"check","icons:error-outline":"warning","icons:folder-open":"folder-open","icons:arrow-upward":"arrow-upward","icons:arrow-forward":"chevron-right","icons:arrow-back":"chevron-left","icons:chevron-right":"chevron-right","icons:chevron-left":"chevron-left","icons:open-in-new":"open-in-new","icons:flag":"flag","icons:code":"code","icons:hourglass-empty":"clock","icons:delete":"delete","icons:create":"edit","icons:expand-more":"expand-more","icons:expand-less":"expand-less","icons:view-list":"view-list","icons:zoom-in":"zoom-in","icons:zoom-out":"zoom-out","icons:content-copy":"copy","content-copy":"copy","icons:content-paste":"content-paste","content-paste":"content-paste","icons:arrow-downward":"arrow-downward","icons:refresh":"refresh","icons:save":"save"};class g extends t{static get properties(){return{icon:{type:String},sprite:{type:String},size:{type:String},label:{type:String},decorative:{type:Boolean}}}constructor(){super(),this.icon="",this.size="",this.label="",this.decorative=!1;try{if(void 0!==import.meta&&import.meta.env&&import.meta.env.DEV||"undefined"!=typeof location&&/localhost|127\.0\.0\.1/.test(location.hostname)){const e=window.location.hostname;"8080"===window.location.port||e.includes("tei-publisher")?this.sprite="/exist/apps/tei-publisher/resources/images/icons.svg":this.sprite="/images/icons.svg"}else this.sprite="/dist/images/icons.svg"}catch(e){this.sprite="/dist/images/icons.svg"}}render(){const e=this._getSizeClass(),t=this._getAriaLabel();return n`
+      <span
+        class="pb-icon ${e}"
+        role="img"
+        aria-label="${t}"
+        aria-hidden="${this.decorative?"true":"false"}"
+      >
+        ${this.icon?this._renderSpriteIcon():this._renderSlotIcon()}
+      </span>
+    `}_renderSpriteIcon(){const e=this._normalizeIconName(this.icon);if(!e)return n``;const t=this.sprite&&!this.sprite.startsWith("#")?`${this.sprite}#icon-${e}`:`#icon-${e}`;return n`
+      <svg
+        width="1em"
+        height="1em"
+        viewBox="0 0 24 24"
+        aria-hidden="${this.decorative?"true":"false"}"
+      >
+        <use href="${t}"></use>
+      </svg>
+    `}_renderSlotIcon(){return n`<slot></slot>`}_normalizeIconName(e){if(!e)return"";const t=e.toLowerCase();return f[t]?f[t]:t.includes(":")?t.split(":").pop():t}_getSizeClass(){if(!this.size)return"";return["xs","sm","md","lg","xl"].includes(this.size)?`pb-icon--${this.size}`:(this.style.setProperty("--pb-icon-size",this.size),"")}_getAriaLabel(){if(this.decorative)return"";if(this.label)return this.label;if(this.icon){return this._normalizeIconName(this.icon).replace(/-/g," ").replace(/\b\w/g,e=>e.toUpperCase())}return"Icon"}static get styles(){return o`
+      :host {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+      }
+
+      .pb-icon {
+        display: inline-flex;
+        align-items: center;
+        justify-content: center;
+        width: var(--pb-icon-size, 1em);
+        height: var(--pb-icon-size, 1em);
+        color: var(--pb-icon-color, currentColor);
+        fill: currentColor;
+        flex-shrink: 0;
+        user-select: none;
+        line-height: 1;
+      }
+
+      .pb-icon svg {
+        width: 100%;
+        height: 100%;
+        fill: inherit;
+      }
+
+      /* Size variants */
+      .pb-icon--xs {
+        font-size: 12px;
+        width: 12px;
+        height: 12px;
+      }
+
+      .pb-icon--sm {
+        font-size: 16px;
+        width: 16px;
+        height: 16px;
+      }
+
+      .pb-icon--md {
+        font-size: 20px;
+        width: 20px;
+        height: 20px;
+      }
+
+      .pb-icon--lg {
+        font-size: 24px;
+        width: 24px;
+        height: 24px;
+      }
+
+      .pb-icon--xl {
+        font-size: 32px;
+        width: 32px;
+        height: 32px;
+      }
+
+      /* Ensure slotted SVGs are properly sized */
+      ::slotted(svg) {
+        width: 100%;
+        height: 100%;
+        fill: currentColor;
+      }
+    `}}if(customElements.get("pb-icon")||customElements.define("pb-icon",g),!customElements.get("iron-icon")){class e extends g{}customElements.define("iron-icon",e)}class m extends(p(i(t))){static get properties(){return Object.assign(Object.assign({},super.properties),{},{open:{type:Boolean,reflect:!0},modal:{type:Boolean,reflect:!0},title:{type:String,reflect:!0},message:{type:String,reflect:!0}})}constructor(){super(),this.open=!1,this.modal=!0,this._escListener=this._onEsc.bind(this),this.title=null,this.message=null}_onEsc(e){"Escape"===e.key&&this.open&&this.closeDialog()}openDialog(){this.open||(this.modal?this._dialog.showModal():this._dialog.show(),this.dispatchEvent(new CustomEvent("pb-dialog-opened",{bubbles:!0,composed:!0})),this.open=!0)}closeDialog(){this.open&&(this._dialog.close(),this.dispatchEvent(new CustomEvent("pb-dialog-closed",{bubbles:!0,composed:!0})),this.open=!1)}render(){return n`
+      <dialog @click="${e=>e.target===this._dialog&&this.modal&&this.closeDialog()}">
+        <article>
+          <header>
+            ${this.title?s(this.title):n`<slot name="title"></slot>`}
+            <button rel="prev" aria-label="Close" type="button"></button>
+          </header>
+          ${this.message?s(this.message):n`<slot></slot>`}
+          <footer>
+            <slot name="footer"></slot>
+          </footer>
+        </article>
+      </dialog>
+    `}firstUpdated(){this._dialog=this.renderRoot.querySelector("dialog"),[...this._dialog.querySelectorAll('button[rel="prev"]'),...this.querySelectorAll('button[rel="prev"]')].forEach(e=>e.addEventListener("click",this.closeDialog.bind(this)))}static get styles(){return o`
+      header {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+      }
+      button[rel='prev'] {
+        display: block;
+        height: 1rem;
+        width: 1rem;
+        background-image: var(
+          --pb-dialog-background-image,
+          url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='rgb(136, 145, 164)' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'%3E%3C/line%3E%3Cline x1='6' y1='6' x2='18' y2='18'%3E%3C/line%3E%3C/svg%3E")
+        );
+        background-position: center;
+        background-size: auto 1rem;
+        background-repeat: no-repeat;
+        background-color: transparent;
+        border: none;
+      }
+      footer {
+        display: flex;
+        justify-content: flex-end;
+        align-items: center;
+        margin-top: 16px;
+      }
+    `}}customElements.define("pb-dialog",m);export{l as i,c as l,p as t};

package/dist/pb-edit-app.js

@@ -1,110 +1,211 @@
-import{p as e,w as t,h as p,c as o,L as a}from"./pb-mixin-b1caa22e.js";import{t as i}from"./pb-i18n-0611135a.js";import"./paper-listbox-a3b7175c.js";import"./iron-form-3b8dcaa7.js";import"./paper-checkbox-515a5284.js";class n extends(e(a)){static get properties(){return Object.assign(Object.assign({},super.properties),{},{error:{type:String},url:{type:String},templates:{type:Array},odds:{type:Array}})}constructor(){super(),this.templates=[],this.odds=[]}connectedCallback(){super.connectedCallback()}firstUpdated(){const e=this.shadowRoot.getElementById("form"),p=this.shadowRoot.getElementById("defaultView"),o=this.shadowRoot.getElementById("index"),a=this.shadowRoot.getElementById("template");this.subscribeTo("pb-i18n-update",e=>{const t=this.shadowRoot.querySelector("#defaultView paper-listbox");let p=t.selected;t.selected=void 0,t.selected=p;const o=this.shadowRoot.querySelector("#index paper-listbox");p=o.selected,o.selected=void 0,o.selected=p},[]),t("pb-page-ready",e=>{let t;t=this.minApiVersion("1.0.0")?e.endpoint+"/api/templates":e.endpoint+"/modules/lib/components-list-templates.xql",fetch(t,{method:"GET",mode:"cors",credentials:"same-origin"}).then(e=>e.json()).then(e=>{this.templates=e}),t=this.minApiVersion("1.0.0")?e.endpoint+"/api/odd":e.endpoint+"/modules/lib/components-list-odds.xql",fetch(t,{method:"GET",mode:"cors",credentials:"same-origin"}).then(e=>e.json()).then(e=>{this.odds=e});const p=this.shadowRoot.querySelector("form");this.minApiVersion("1.0.0")?p.action=e.endpoint+"/api/apps/generate":p.action=e.endpoint+"/modules/components-generate.xql"}),e.addEventListener("iron-form-presubmit",(function(){const e=p.selectedItem.getAttribute("value");this.request.body["default-view"]=e,this.request.body.index=o.selectedItem.getAttribute("value"),this.request.body.template=a.selectedItem.getAttribute("value")})),e.addEventListener("iron-form-response",e=>{console.log(e),e.detail.completes.then(e=>{this.emitTo("pb-end-update");const t=e.parseResponse();if(console.log("<pb-edit-app> Received response: %o",t),t.target){const e=window.location.href.replace(/^(.*)\/tei-publisher\/.*/,"$1");this.url=e+"/"+this.shadowRoot.querySelector("paper-input[name=abbrev]").value,this.error=null}else this.error=t.description;this.shadowRoot.getElementById("dialog").open()})}),e.addEventListener("iron-form-error",e=>{this.emitTo("pb-end-update"),console.log("<pb-edit-app> Received response: %o",e.detail.request.response),this.error=e.detail.request.response.description,this.shadowRoot.getElementById("dialog").open()}),e.addEventListener("iron-form-invalid",()=>this.emitTo("pb-end-update"))}_doSubmit(){this.emitTo("pb-start-update");this.shadowRoot.getElementById("form").submit()}render(){return p`
-            <iron-form id="form">
-                <form method="POST" accept="application/json" enctype="application/json">
-                    <fieldset>
-                        <legend>${i("document.selectODD")}</legend>
-                        ${this.odds.map(e=>p`<paper-checkbox name="odd" value="${e.name}">${e.label}</paper-checkbox>`)}
-                    </fieldset>
-                    <paper-input name="uri" type="url" required placeholder="https://e-editiones.org/apps/my-simple-app"
-                        label="${i("appgen.uri")}" auto-validate></paper-input>
-                    <paper-input id="abbrev" name="abbrev" pattern="[a-zA-Z0-9-_]+" required placeholder="${i("appgen.abbrev.placeholder")}"
-                        label="${i("appgen.abbrev.label")}" auto-validate></paper-input>
-                    <paper-input name="data-collection" pattern="[a-zA-Z0-9-_/]+" placeholder="data"
-                        label="${i("appgen.collection")}" auto-validate></paper-input>
-                    <paper-input name="title" required placeholder="${i("appgen.title.label")}"
-                        label="${i("appgen.title.help")}"></paper-input>
-                    <fieldset>
-                        <legend>${i("appgen.template.help")}</legend>
-                        <paper-dropdown-menu id="template" label="${i("appgen.template.label")}" name="template">
-                            <paper-listbox slot="dropdown-content" class="dropdown-content" attr-for-selected="value" selected="view.html">
-                            ${this.templates.map(e=>p`<paper-item value="${e.name}">${e.title}</paper-item>`)}
-                            </paper-listbox>
-                        </paper-dropdown-menu>
-                    </fieldset>
-                    <fieldset>
-                        <legend>${i("appgen.view.help")}</legend>
-                        <paper-dropdown-menu id="defaultView" label="${i("appgen.label")}" name="default-view">
-                            <paper-listbox slot="dropdown-content" class="dropdown-content" selected="div" attr-for-selected="value">
-                                <paper-item value="div">${i("appgen.view.div")}</paper-item>
-                                <paper-item value="page">${i("appgen.view.page")}</paper-item>
-                            </paper-listbox>
-                        </paper-dropdown-menu>
-                    </fieldset>
-                    <fieldset>
-                        <legend>${i("appgen.index.help")}</legend>
-                        <paper-dropdown-menu id="index" label="${i("appgen.index.label")}" name="index">
-                            <paper-listbox slot="dropdown-content" class="dropdown-content" selected="tei:div" attr-for-selected="value">
-                                <paper-item value="tei:div">${i("appgen.index.index-div")}</paper-item>
-                                <paper-item value="tei:text">${i("appgen.index.index-text")}</paper-item>
-                            </paper-listbox>
-                        </paper-dropdown-menu>
-                    </fieldset>
-                    <fieldset>
-                        <legend>${i("appgen.account.user")}</legend>
-                        <paper-input name="owner" required placeholder="${i("login.user")}"
-                            label="${i("appgen.account.owner")}" auto-validate></paper-input>
-                        <paper-input name="password" type="password" required placeholder="${i("login.password")}"
-                            label="${i("appgen.account.password")}" auto-validate></paper-input>
-                    </fieldset>
-                    <paper-button id="submit" @click="${this._doSubmit}"><iron-icon icon="save"></iron-icon> ${i("appgen.submit")}</paper-button>
-                </form>
-            </iron-form>
-            <paper-dialog id="dialog">
-                <h2>${i("appgen.dialog.title")}</h2>
-                <div id="dialogContent">
-                ${this.error?p`<div id="error">${this.error}</div>`:p`<a href="${this.url}" target="_blank">
-                            <paper-button><iron-icon icon="icons:open-in-new"></iron-icon> ${i("appgen.open")}</paper-button>
-                        </a>
-                        <p>${i("appgen.success")}</p>`}
-                </div>
-                <div class="buttons">
-                    <paper-button dialog-dismiss autofocus>${i("dialogs.close")}</paper-button>
-                </div>
-            </paper-dialog>
-        `}static get styles(){return o`
-            :host {
-                display: block;
-            }
-            paper-dropdown-menu {
-                width: 100%;
-                max-width: 864px;
-            }
-            fieldset {
-                margin-top: 16px;
-                margin-bottom: 16px;
-                padding: 0;
-                border: 0;
-            }
-            legend {
-                color: #909090;
-            }
-            paper-checkbox {
-                display: block;
-                margin-left: 20px;
-                margin-top: 10px;
-            }
-            paper-dialog {
-                min-width: 420px;
-                max-width: 640px;
-                min-height: 128px;
-            }
+import{p as e,a as t,w as a,E as i,x as l,i as n}from"./pb-mixin-DHoWQheB.js";import{t as s}from"./pb-i18n-C0NDma4h.js";import"./pb-dialog-tklYGWfc.js";import"./unsafe-html-D5VGo9Oq.js";class o extends(e(t)){static get properties(){return Object.assign(Object.assign({},super.properties),{},{error:{type:String},url:{type:String},templates:{type:Array},odds:{type:Array},_templateValue:{type:String},_defaultViewValue:{type:String},_indexValue:{type:String}})}constructor(){super(),this.templates=[],this.odds=[],this._templateValue="view.html",this._defaultViewValue="div",this._indexValue="tei:div"}connectedCallback(){super.connectedCallback()}firstUpdated(){const e=this.shadowRoot.getElementById("form");a("pb-page-ready",t=>{const a=t.endpoint,i=this.minApiVersion("1.0.0")?`${a}/api/templates`:`${a}/modules/lib/components-list-templates.xql`,l=this.minApiVersion("1.0.0")?`${a}/api/odd`:`${a}/modules/lib/components-list-odds.xql`,n=this.minApiVersion("1.0.0")?`${a}/api/apps/generate`:`${a}/modules/components-generate.xql`;e&&(e.action=n),fetch(i,{method:"GET",mode:"cors",credentials:"same-origin"}).then(e=>e.json()).then(e=>{const t=Array.isArray(e)?e:[];this.templates=t,t.find(e=>e.name===this._templateValue)||(this._templateValue=t.length?t[0].name:""),this.requestUpdate()}).catch(e=>console.error("<pb-edit-app> Failed to load templates",e)),fetch(l,{method:"GET",mode:"cors",credentials:"same-origin"}).then(e=>e.json()).then(e=>{this.odds=Array.isArray(e)?e:[],this.requestUpdate()}).catch(e=>console.error("<pb-edit-app> Failed to load odds list",e))}),e&&e.addEventListener("submit",this._handleSubmit.bind(this))}_doSubmit(){const e=this.shadowRoot.getElementById("form");e&&(e.requestSubmit?e.requestSubmit():e.dispatchEvent(new Event("submit",{cancelable:!0,bubbles:!0})))}_renderTextField({id:e,name:t,type:a="text",required:n=!1,pattern:s,placeholder:o="",label:p}){return l`
+      <label class="pb-field" for="${e}">
+        <span class="pb-field__label">${p}</span>
+        <input
+          id="${e}"
+          class="pb-input"
+          type="${a}"
+          name="${t}"
+          ?required=${n}
+          pattern=${s||i}
+          placeholder="${o}"
+        />
+      </label>
+    `}_onTemplateChange(e){this._templateValue=e.target.value}_onDefaultViewChange(e){this._defaultViewValue=e.target.value}_onIndexChange(e){this._indexValue=e.target.value}async _handleSubmit(e){e.preventDefault();const t=e.currentTarget;if(t.reportValidity&&!t.reportValidity())return;this.emitTo("pb-start-update");const a=this._collectFormData(t),i=t.action||"";try{const e=await fetch(i,{method:t.method||"POST",headers:{"content-type":"application/json"},credentials:"same-origin",body:JSON.stringify(a)}),l=e.headers.get("content-type")||"",n=l.includes("application/json")?await e.json():await e.text();if(!e.ok){const t=n&&"object"==typeof n?n:{description:n};throw Object.assign(new Error(t.description||e.statusText),{result:t})}this._handleSubmitSuccess(n,t)}catch(e){this._handleSubmitError(e)}}_collectFormData(e){const t=new FormData(e),a={};return Array.from(e.elements||[]).filter(e=>e.name&&!e.disabled&&!e.closest("[disabled]")).forEach(e=>{e.name in a||(a[e.name]=null)}),t.forEach((e,t)=>{Object.prototype.hasOwnProperty.call(a,t)&&null!=a[t]?Array.isArray(a[t])?a[t].push(e):a[t]=[a[t],e]:a[t]=e}),a}_handleSubmitSuccess(e,t){if(this.emitTo("pb-end-update"),e&&e.target){const e=window.location.href.replace(/^(.*)\/tei-publisher\/.*/,"$1"),a=t.querySelector("input[name=abbrev]");this.url=`${e}/${a?a.value:""}`,this.error=null}else this.error=e&&e.description?e.description:"Request failed",this.url=null;this._openDialog()}_handleSubmitError(e){var t;this.emitTo("pb-end-update");const a=(null==e||null===(t=e.result)||void 0===t?void 0:t.description)||(null==e?void 0:e.message)||"Request failed";this.error=a,this.url=null,this._openDialog()}_openDialog(){const e=this.shadowRoot.getElementById("dialog");null==e||e.openDialog()}render(){return l`
+      <form id="form" method="POST" accept="application/json" enctype="application/json">
+        <fieldset class="pb-fieldset">
+          <legend>${s("document.selectODD")}</legend>
+          ${this.odds.map(e=>l`
+              <label class="pb-checkbox">
+                <input
+                  type="checkbox"
+                  name="odd"
+                  .value="${e.name}"
+                  ?checked=${Boolean(e.checked)}
+                />
+                <span>${e.label}</span>
+              </label>
+            `)}
+        </fieldset>
 
-            paper-dialog h2 {
-                background-color: #607D8B;
-                padding: 16px 8px;
-                margin-top: 0;
-                color: #F0F0F0;
-            }
+        ${this._renderTextField({id:"uri",name:"uri",type:"url",required:!0,placeholder:"https://e-editiones.org/apps/my-simple-app",label:s("appgen.uri")})}
+        ${this._renderTextField({id:"abbrev",name:"abbrev",pattern:"[a-zA-Z0-9-_]+",required:!0,placeholder:s("appgen.abbrev.placeholder"),label:s("appgen.abbrev.label")})}
+        ${this._renderTextField({id:"data-collection",name:"data-collection",pattern:"[a-zA-Z0-9-_/]+",placeholder:"data",label:s("appgen.collection")})}
+        ${this._renderTextField({id:"title",name:"title",required:!0,placeholder:s("appgen.title.label"),label:s("appgen.title.help")})}
 
-            .content {
-                display: flex;
-                flex-direction: row;
-                justify-content: space-between;
-                align-items: center;
-            }
+        <fieldset class="pb-fieldset">
+          <legend>${s("appgen.template.help")}</legend>
+          <label class="pb-field" for="template">
+            <span class="pb-field__label">${s("appgen.template.label")}</span>
+            <select
+              id="template"
+              class="pb-select"
+              name="template"
+              .value=${this._templateValue||""}
+              @change=${this._onTemplateChange}
+            >
+              ${this.templates.map(e=>l`<option value="${e.name}">${e.title}</option>`)}
+            </select>
+          </label>
+        </fieldset>
 
-            .content a {
-                display: block;
-                flex: 1 0;
-            }
-        `}}customElements.define("pb-edit-app",n);export{n as PbEditApp};
+        <fieldset class="pb-fieldset">
+          <legend>${s("appgen.view.help")}</legend>
+          <label class="pb-field" for="defaultView">
+            <span class="pb-field__label">${s("appgen.label")}</span>
+            <select
+              id="defaultView"
+              class="pb-select"
+              name="default-view"
+              .value=${this._defaultViewValue||""}
+              @change=${this._onDefaultViewChange}
+            >
+              <option value="div">${s("appgen.view.div")}</option>
+              <option value="page">${s("appgen.view.page")}</option>
+            </select>
+          </label>
+        </fieldset>
+
+        <fieldset class="pb-fieldset">
+          <legend>${s("appgen.index.help")}</legend>
+          <label class="pb-field" for="index">
+            <span class="pb-field__label">${s("appgen.index.label")}</span>
+            <select
+              id="index"
+              class="pb-select"
+              name="index"
+              .value=${this._indexValue||""}
+              @change=${this._onIndexChange}
+            >
+              <option value="tei:div">${s("appgen.index.index-div")}</option>
+              <option value="tei:text">${s("appgen.index.index-text")}</option>
+            </select>
+          </label>
+        </fieldset>
+
+        <fieldset class="pb-fieldset">
+          <legend>${s("appgen.account.user")}</legend>
+          ${this._renderTextField({id:"owner",name:"owner",required:!0,placeholder:s("login.user"),label:s("appgen.account.owner")})}
+          ${this._renderTextField({id:"password",name:"password",type:"password",required:!0,placeholder:s("login.password"),label:s("appgen.account.password")})}
+        </fieldset>
+        <button
+          id="submit"
+          class="pb-button pb-button--contained"
+          type="button"
+          @click="${this._doSubmit}"
+        >
+          <pb-icon icon="save"></pb-icon>
+          ${s("appgen.submit")}
+        </button>
+      </form>
+      <pb-dialog id="dialog" title="${s("appgen.dialog.title")}">
+        <div id="dialogContent">
+          ${this.error?l`<div id="error">${this.error}</div>`:l`<a href="${this.url}" target="_blank" class="pb-button pb-button--text">
+                  <pb-icon icon="icons:open-in-new"></pb-icon>
+                  ${s("appgen.open")}
+                </a>
+                <p>${s("appgen.success")}</p>`}
+        </div>
+        <div slot="footer" class="buttons">
+          <button class="pb-button pb-button--text" type="button" rel="prev" autofocus>
+            ${s("dialogs.close")}
+          </button>
+        </div>
+      </pb-dialog>
+    `}static get styles(){return n`
+      :host {
+        display: block;
+      }
+      .pb-fieldset {
+        margin: 16px 0;
+        padding: 0;
+        border: 0;
+      }
+      .pb-fieldset legend {
+        color: #909090;
+        font-size: 0.85rem;
+        text-transform: uppercase;
+        letter-spacing: 0.04em;
+        margin-bottom: 8px;
+      }
+      .pb-checkbox {
+        display: block;
+        margin-left: 20px;
+        margin-top: 10px;
+        font-size: 0.95rem;
+        color: rgba(0, 0, 0, 0.87);
+        cursor: pointer;
+      }
+      .pb-checkbox input {
+        margin-right: 8px;
+      }
+      .pb-field {
+        display: flex;
+        flex-direction: column;
+        gap: 0.45rem;
+        margin-bottom: 1rem;
+        max-width: 864px;
+      }
+      .pb-field__label {
+        font-size: 0.85rem;
+        font-weight: 600;
+        letter-spacing: 0.04em;
+        text-transform: uppercase;
+        color: rgba(0, 0, 0, 0.6);
+      }
+      .pb-input,
+      .pb-select {
+        height: var(--pb-input-height, 48px);
+        padding: 0.5rem 0.75rem;
+        border: 1px solid rgba(0, 0, 0, 0.16);
+        border-radius: 8px;
+        font: inherit;
+        color: inherit;
+        background: #fff;
+        transition: border-color 120ms ease, box-shadow 120ms ease;
+        line-height: 1.4;
+      }
+      .pb-input::placeholder {
+        color: rgba(0, 0, 0, 0.4);
+      }
+      .pb-input:focus,
+      .pb-select:focus {
+        outline: none;
+        border-color: #1976d2;
+        box-shadow: 0 0 0 3px rgba(25, 118, 210, 0.16);
+      }
+      .pb-select {
+        appearance: none;
+        background-image: linear-gradient(45deg, transparent 50%, rgba(0, 0, 0, 0.4) 50%),
+          linear-gradient(135deg, rgba(0, 0, 0, 0.4) 50%, transparent 50%),
+          linear-gradient(to right, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.1));
+        background-position: calc(100% - 18px) calc(0.6em + 2px),
+          calc(100% - 13px) calc(0.6em + 2px), calc(100% - 2.5rem) 0.5em;
+        background-size: 5px 5px, 5px 5px, 1px 2.25em;
+        background-repeat: no-repeat;
+      }
+      paper-dialog {
+        min-width: 420px;
+        max-width: 640px;
+        min-height: 128px;
+      }
+
+      paper-dialog h2 {
+        background-color: #607d8b;
+        padding: 16px 8px;
+        margin-top: 0;
+        color: #f0f0f0;
+      }
+
+      .content {
+        display: flex;
+        flex-direction: row;
+        justify-content: space-between;
+        align-items: center;
+      }
+
+      .content a {
+        display: block;
+        flex: 1 0;
+      }
+    `}}customElements.define("pb-edit-app",o);export{o as PbEditApp};