@kodaris/krubble-app-components 1.0.39 → 1.0.41
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/krubble-app.bundled.js +33 -1
- package/dist/krubble-app.bundled.js.map +1 -1
- package/dist/krubble-app.bundled.min.js +28 -28
- package/dist/krubble-app.bundled.min.js.map +1 -1
- package/dist/krubble-app.umd.js +33 -1
- package/dist/krubble-app.umd.js.map +1 -1
- package/dist/krubble-app.umd.min.js +28 -28
- package/dist/krubble-app.umd.min.js.map +1 -1
- package/dist/screen-nav.d.ts +6 -1
- package/dist/screen-nav.d.ts.map +1 -1
- package/dist/screen-nav.js +33 -1
- package/dist/screen-nav.js.map +1 -1
- package/package.json +1 -1
|
@@ -14,12 +14,12 @@ import{KRContextMenu as e,KRDialog as t}from"@kodaris/krubble-components";import
|
|
|
14
14
|
* Copyright 2017 Google LLC
|
|
15
15
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
16
16
|
*/
|
|
17
|
-
const k=globalThis,E=k.trustedTypes,A=E?E.createPolicy("lit-html",{createHTML:e=>e}):void 0,N="$lit$",C=`lit$${Math.random().toFixed(9).slice(2)}$`,S="?"+C,D=`<${S}>`,P=document,
|
|
17
|
+
const k=globalThis,E=k.trustedTypes,A=E?E.createPolicy("lit-html",{createHTML:e=>e}):void 0,N="$lit$",C=`lit$${Math.random().toFixed(9).slice(2)}$`,S="?"+C,D=`<${S}>`,P=document,U=()=>P.createComment(""),M=e=>null===e||"object"!=typeof e&&"function"!=typeof e,O=Array.isArray,T="[ \t\n\f\r]",z=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,R=/-->/g,j=/>/g,H=RegExp(`>|${T}(?:([^\\s"'>=/]+)(${T}*=${T}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),L=/'/g,q=/"/g,X=/^(?:script|style|textarea|title)$/i,F=(e=>(t,...i)=>({_$litType$:e,strings:t,values:i}))(1),B=Symbol.for("lit-noChange"),W=Symbol.for("lit-nothing"),Q=new WeakMap,Y=P.createTreeWalker(P,129);function K(e,t){if(!O(e)||!e.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==A?A.createHTML(t):t}const V=(e,t)=>{const i=e.length-1,r=[];let s,n=2===t?"<svg>":3===t?"<math>":"",a=z;for(let t=0;t<i;t++){const i=e[t];let o,l,d=-1,c=0;for(;c<i.length&&(a.lastIndex=c,l=a.exec(i),null!==l);)c=a.lastIndex,a===z?"!--"===l[1]?a=R:void 0!==l[1]?a=j:void 0!==l[2]?(X.test(l[2])&&(s=RegExp("</"+l[2],"g")),a=H):void 0!==l[3]&&(a=H):a===H?">"===l[0]?(a=s??z,d=-1):void 0===l[1]?d=-2:(d=a.lastIndex-l[2].length,o=l[1],a=void 0===l[3]?H:'"'===l[3]?q:L):a===q||a===L?a=H:a===R||a===j?a=z:(a=H,s=void 0);const h=a===H&&e[t+1].startsWith("/>")?" ":"";n+=a===z?i+D:d>=0?(r.push(o),i.slice(0,d)+N+i.slice(d)+C+h):i+C+(-2===d?t:h)}return[K(e,n+(e[i]||"<?>")+(2===t?"</svg>":3===t?"</math>":"")),r]};class G{constructor({strings:e,_$litType$:t},i){let r;this.parts=[];let s=0,n=0;const a=e.length-1,o=this.parts,[l,d]=V(e,t);if(this.el=G.createElement(l,i),Y.currentNode=this.el.content,2===t||3===t){const e=this.el.content.firstChild;e.replaceWith(...e.childNodes)}for(;null!==(r=Y.nextNode())&&o.length<a;){if(1===r.nodeType){if(r.hasAttributes())for(const e of r.getAttributeNames())if(e.endsWith(N)){const t=d[n++],i=r.getAttribute(e).split(C),a=/([.?@])?(.*)/.exec(t);o.push({type:1,index:s,name:a[2],strings:i,ctor:"."===a[1]?ie:"?"===a[1]?re:"@"===a[1]?se:te}),r.removeAttribute(e)}else e.startsWith(C)&&(o.push({type:6,index:s}),r.removeAttribute(e));if(X.test(r.tagName)){const e=r.textContent.split(C),t=e.length-1;if(t>0){r.textContent=E?E.emptyScript:"";for(let i=0;i<t;i++)r.append(e[i],U()),Y.nextNode(),o.push({type:2,index:++s});r.append(e[t],U())}}}else if(8===r.nodeType)if(r.data===S)o.push({type:2,index:s});else{let e=-1;for(;-1!==(e=r.data.indexOf(C,e+1));)o.push({type:7,index:s}),e+=C.length-1}s++}}static createElement(e,t){const i=P.createElement("template");return i.innerHTML=e,i}}function J(e,t,i=e,r){if(t===B)return t;let s=void 0!==r?i._$Co?.[r]:i._$Cl;const n=M(t)?void 0:t._$litDirective$;return s?.constructor!==n&&(s?._$AO?.(!1),void 0===n?s=void 0:(s=new n(e),s._$AT(e,i,r)),void 0!==r?(i._$Co??=[])[r]=s:i._$Cl=s),void 0!==s&&(t=J(e,s._$AS(e,t.values),s,r)),t}class Z{constructor(e,t){this._$AV=[],this._$AN=void 0,this._$AD=e,this._$AM=t}get parentNode(){return this._$AM.parentNode}get _$AU(){return this._$AM._$AU}u(e){const{el:{content:t},parts:i}=this._$AD,r=(e?.creationScope??P).importNode(t,!0);Y.currentNode=r;let s=Y.nextNode(),n=0,a=0,o=i[0];for(;void 0!==o;){if(n===o.index){let t;2===o.type?t=new ee(s,s.nextSibling,this,e):1===o.type?t=new o.ctor(s,o.name,o.strings,this,e):6===o.type&&(t=new ne(s,this,e)),this._$AV.push(t),o=i[++a]}n!==o?.index&&(s=Y.nextNode(),n++)}return Y.currentNode=P,r}p(e){let t=0;for(const i of this._$AV)void 0!==i&&(void 0!==i.strings?(i._$AI(e,i,t),t+=i.strings.length-2):i._$AI(e[t])),t++}}class ee{get _$AU(){return this._$AM?._$AU??this._$Cv}constructor(e,t,i,r){this.type=2,this._$AH=W,this._$AN=void 0,this._$AA=e,this._$AB=t,this._$AM=i,this.options=r,this._$Cv=r?.isConnected??!0}get parentNode(){let e=this._$AA.parentNode;const t=this._$AM;return void 0!==t&&11===e?.nodeType&&(e=t.parentNode),e}get startNode(){return this._$AA}get endNode(){return this._$AB}_$AI(e,t=this){e=J(this,e,t),M(e)?e===W||null==e||""===e?(this._$AH!==W&&this._$AR(),this._$AH=W):e!==this._$AH&&e!==B&&this._(e):void 0!==e._$litType$?this.$(e):void 0!==e.nodeType?this.T(e):(e=>O(e)||"function"==typeof e?.[Symbol.iterator])(e)?this.k(e):this._(e)}O(e){return this._$AA.parentNode.insertBefore(e,this._$AB)}T(e){this._$AH!==e&&(this._$AR(),this._$AH=this.O(e))}_(e){this._$AH!==W&&M(this._$AH)?this._$AA.nextSibling.data=e:this.T(P.createTextNode(e)),this._$AH=e}$(e){const{values:t,_$litType$:i}=e,r="number"==typeof i?this._$AC(e):(void 0===i.el&&(i.el=G.createElement(K(i.h,i.h[0]),this.options)),i);if(this._$AH?._$AD===r)this._$AH.p(t);else{const e=new Z(r,this),i=e.u(this.options);e.p(t),this.T(i),this._$AH=e}}_$AC(e){let t=Q.get(e.strings);return void 0===t&&Q.set(e.strings,t=new G(e)),t}k(e){O(this._$AH)||(this._$AH=[],this._$AR());const t=this._$AH;let i,r=0;for(const s of e)r===t.length?t.push(i=new ee(this.O(U()),this.O(U()),this,this.options)):i=t[r],i._$AI(s),r++;r<t.length&&(this._$AR(i&&i._$AB.nextSibling,r),t.length=r)}_$AR(e=this._$AA.nextSibling,t){for(this._$AP?.(!1,!0,t);e!==this._$AB;){const t=e.nextSibling;e.remove(),e=t}}setConnected(e){void 0===this._$AM&&(this._$Cv=e,this._$AP?.(e))}}class te{get tagName(){return this.element.tagName}get _$AU(){return this._$AM._$AU}constructor(e,t,i,r,s){this.type=1,this._$AH=W,this._$AN=void 0,this.element=e,this.name=t,this._$AM=r,this.options=s,i.length>2||""!==i[0]||""!==i[1]?(this._$AH=Array(i.length-1).fill(new String),this.strings=i):this._$AH=W}_$AI(e,t=this,i,r){const s=this.strings;let n=!1;if(void 0===s)e=J(this,e,t,0),n=!M(e)||e!==this._$AH&&e!==B,n&&(this._$AH=e);else{const r=e;let a,o;for(e=s[0],a=0;a<s.length-1;a++)o=J(this,r[i+a],t,a),o===B&&(o=this._$AH[a]),n||=!M(o)||o!==this._$AH[a],o===W?e=W:e!==W&&(e+=(o??"")+s[a+1]),this._$AH[a]=o}n&&!r&&this.j(e)}j(e){e===W?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,e??"")}}class ie extends te{constructor(){super(...arguments),this.type=3}j(e){this.element[this.name]=e===W?void 0:e}}class re extends te{constructor(){super(...arguments),this.type=4}j(e){this.element.toggleAttribute(this.name,!!e&&e!==W)}}class se extends te{constructor(e,t,i,r,s){super(e,t,i,r,s),this.type=5}_$AI(e,t=this){if((e=J(this,e,t,0)??W)===B)return;const i=this._$AH,r=e===W&&i!==W||e.capture!==i.capture||e.once!==i.once||e.passive!==i.passive,s=e!==W&&(i===W||r);r&&this.element.removeEventListener(this.name,this,i),s&&this.element.addEventListener(this.name,this,e),this._$AH=e}handleEvent(e){"function"==typeof this._$AH?this._$AH.call(this.options?.host??this.element,e):this._$AH.handleEvent(e)}}class ne{constructor(e,t,i){this.element=e,this.type=6,this._$AN=void 0,this._$AM=t,this.options=i}get _$AU(){return this._$AM._$AU}_$AI(e){J(this,e)}}const ae=k.litHtmlPolyfillSupport;ae?.(G,ee),(k.litHtmlVersions??=[]).push("3.3.2");const oe=globalThis;
|
|
18
18
|
/**
|
|
19
19
|
* @license
|
|
20
20
|
* Copyright 2017 Google LLC
|
|
21
21
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
22
|
-
*/let le=class extends I{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){const e=super.createRenderRoot();return this.renderOptions.renderBefore??=e.firstChild,e}update(e){const t=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(e),this._$Do=((e,t,i)=>{const r=i?.renderBefore??t;let s=r._$litPart$;if(void 0===s){const e=i?.renderBefore??null;r._$litPart$=s=new ee(t.insertBefore(
|
|
22
|
+
*/let le=class extends I{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){const e=super.createRenderRoot();return this.renderOptions.renderBefore??=e.firstChild,e}update(e){const t=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(e),this._$Do=((e,t,i)=>{const r=i?.renderBefore??t;let s=r._$litPart$;if(void 0===s){const e=i?.renderBefore??null;r._$litPart$=s=new ee(t.insertBefore(U(),e),e,void 0,i??{})}return s._$AI(e),s})(t,this.renderRoot,this.renderOptions)}connectedCallback(){super.connectedCallback(),this._$Do?.setConnected(!0)}disconnectedCallback(){super.disconnectedCallback(),this._$Do?.setConnected(!1)}render(){return B}};le._$litElement$=!0,le.finalized=!0,oe.litElementHydrateSupport?.({LitElement:le});const de=oe.litElementPolyfillSupport;de?.({LitElement:le}),(oe.litElementVersions??=[]).push("4.2.2");
|
|
23
23
|
/**
|
|
24
24
|
* @license
|
|
25
25
|
* Copyright 2017 Google LLC
|
|
@@ -45,12 +45,12 @@ const ce=e=>(t,i)=>{void 0!==i?i.addInitializer((()=>{customElements.define(e,t)
|
|
|
45
45
|
* @license
|
|
46
46
|
* Copyright 2017 Google LLC
|
|
47
47
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
48
|
-
*/let xe=class extends be{constructor(e){if(super(e),this.it=W,e.type!==ge)throw Error(this.constructor.directiveName+"() can only be used in child bindings")}render(e){if(e===W||null==e)return this._t=void 0,this.it=e;if(e===
|
|
48
|
+
*/let xe=class extends be{constructor(e){if(super(e),this.it=W,e.type!==ge)throw Error(this.constructor.directiveName+"() can only be used in child bindings")}render(e){if(e===W||null==e)return this._t=void 0,this.it=e;if(e===B)return e;if("string"!=typeof e)throw Error(this.constructor.directiveName+"() called with a non-string value");if(e===this.it)return this._t;this.it=e;const t=[e];return t.raw=t,this._t={_$litType$:this.constructor.resultType,strings:t,values:[]}}};xe.directiveName="unsafeHTML",xe.resultType=1;const ye=me(xe),_e=me(class extends be{constructor(e){if(super(e),e.type!==fe||"class"!==e.name||e.strings?.length>2)throw Error("`classMap()` can only be used in the `class` attribute and must be the only part in the attribute.")}render(e){return" "+Object.keys(e).filter((t=>e[t])).join(" ")+" "}update(e,[t]){if(void 0===this.st){this.st=new Set,void 0!==e.strings&&(this.nt=new Set(e.strings.join(" ").split(/\s/).filter((e=>""!==e))));for(const e in t)t[e]&&!this.nt?.has(e)&&this.st.add(e);return this.render(t)}const i=e.element.classList;for(const e of this.st)e in t||(i.remove(e),this.st.delete(e));for(const e in t){const r=!!t[e];r===this.st.has(e)||this.nt?.has(e)||(r?(i.add(e),this.st.add(e)):(i.remove(e),this.st.delete(e)))}return B}});
|
|
49
49
|
/**
|
|
50
50
|
* @license
|
|
51
51
|
* Copyright 2018 Google LLC
|
|
52
52
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
53
|
-
*/var $e=function(e,t,i,r){var s,n=arguments.length,a=n<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,i):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,r);else for(var o=e.length-1;o>=0;o--)(s=e[o])&&(a=(n<3?s(a):n>3?s(t,i,a):s(t,i))||a);return n>3&&a&&Object.defineProperty(t,i,a),a};let we=class extends le{constructor(){super(...arguments),this.label="",this.icon="",this.url="",this.active=!0}connectedCallback(){super.connectedCallback(),this.data&&(this.label=this.data.label||"",this.icon=this.data.icon||"",this.url=this.data.url||"",this.active=!1!==this.data.active)}handleLabelInput(e){const t=e.target;this.label=t.value}handleIconInput(e){const t=e.target;this.icon=t.value}handleUrlInput(e){const t=e.target;this.url=t.value}handleActiveChange(e){this.active=e.target.checked}handleCancel(){this.dialogRef.close(void 0)}handleSave(){this.dialogRef.close({label:this.label,icon:this.icon||void 0,url:this.url||void 0,active:this.active})}handleKeyDown(e){"Enter"===e.key&&this.handleSave()}render(){return
|
|
53
|
+
*/var $e=function(e,t,i,r){var s,n=arguments.length,a=n<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,i):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,r);else for(var o=e.length-1;o>=0;o--)(s=e[o])&&(a=(n<3?s(a):n>3?s(t,i,a):s(t,i))||a);return n>3&&a&&Object.defineProperty(t,i,a),a};let we=class extends le{constructor(){super(...arguments),this.label="",this.icon="",this.url="",this.active=!0}connectedCallback(){super.connectedCallback(),this.data&&(this.label=this.data.label||"",this.icon=this.data.icon||"",this.url=this.data.url||"",this.active=!1!==this.data.active)}handleLabelInput(e){const t=e.target;this.label=t.value}handleIconInput(e){const t=e.target;this.icon=t.value}handleUrlInput(e){const t=e.target;this.url=t.value}handleActiveChange(e){this.active=e.target.checked}handleCancel(){this.dialogRef.close(void 0)}handleSave(){this.dialogRef.close({label:this.label,icon:this.icon||void 0,url:this.url||void 0,active:this.active})}handleKeyDown(e){"Enter"===e.key&&this.handleSave()}render(){return F`
|
|
54
54
|
<h2>Edit Navigation Item</h2>
|
|
55
55
|
|
|
56
56
|
<div class="form-group">
|
|
@@ -187,9 +187,9 @@ const ce=e=>(t,i)=>{void 0!==i?i.addInitializer((()=>{customElements.define(e,t)
|
|
|
187
187
|
.btn-save:hover {
|
|
188
188
|
background: #d4f472;
|
|
189
189
|
}
|
|
190
|
-
`,$e([ue()],we.prototype,"label",void 0),$e([ue()],we.prototype,"icon",void 0),$e([ue()],we.prototype,"url",void 0),$e([ue()],we.prototype,"active",void 0),we=$e([ce("kr-nav-item-edit")],we);var Ie=function(e,t,i,r){var s,n=arguments.length,a=n<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,i):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,r);else for(var o=e.length-1;o>=0;o--)(s=e[o])&&(a=(n<3?s(a):n>3?s(t,i,a):s(t,i))||a);return n>3&&a&&Object.defineProperty(t,i,a),a};let ke=class extends le{constructor(){super(),this.defaultNavItemIcon='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><circle cx="12" cy="12" r="10"/></svg>',this.navItemsExpanded=new Set,this.navQuery="",this.activeNavItemId=null,this.isNavScrolled=!1,this.isNavOpened="false"!==localStorage.getItem("kr-scaffold-nav-opened"),this.isEditing=!1,this.isUserMenuOpen=!1,this.pref={nav:{}},this.draggedNavItemId=null,this.navItemDropTargetId=null,this.navItemDropPosition="above",this.pendingRequests=0,this.originalFetch=null,this.originalXhrOpen=null,this.navItemDragPreview=null,this.navItemDragStartY=0,this.isNavItemDragging=!1,this.navItemDragExpandTimeout=null,this.navInitialized=!1,this.logo="",this.label="",this.homeUrl="/",this.scheme="light",this.nav=[],this.navIconsDisplayed=!1,this.navExpanded=!1,this.user=null,this.subbar=!1,this.breadcrumbs=[],this.boundHandleMouseMove=this.handleMouseMove.bind(this),this.boundHandleMouseUp=this.handleMouseUp.bind(this)}connectedCallback(){super.connectedCallback(),this.loadPref(),this.installFetchInterceptor()}updated(e){super.updated(e),e.has("nav")&&this.nav.length>0&&(this.updateActiveNavItem(),this.navExpanded&&!this.navInitialized&&(this.navInitialized=!0,this.getComputedNav().filter((e=>"group"===e.type)).forEach((e=>this.navItemsExpanded.add(e.id)))))}disconnectedCallback(){super.disconnectedCallback(),this.uninstallFetchInterceptor()}installFetchInterceptor(){if(this.originalFetch)return;const e=this;this.originalFetch=window.fetch.bind(window);const t=this.originalFetch;window.fetch=function(...i){return e.pendingRequests++,t(...i).finally((()=>{e.pendingRequests--}))},this.originalXhrOpen=XMLHttpRequest.prototype.open;const i=this.originalXhrOpen;XMLHttpRequest.prototype.open=function(t,r,s=!0,n,a){return e.pendingRequests++,this.addEventListener("loadend",(()=>{e.pendingRequests--}),{once:!0}),i.call(this,t,r,s,n,a)}}uninstallFetchInterceptor(){this.originalFetch&&(window.fetch=this.originalFetch,this.originalFetch=null),this.originalXhrOpen&&(XMLHttpRequest.prototype.open=this.originalXhrOpen,this.originalXhrOpen=null)}resolveUrl(e){if(!e.url)return"#";if(e.external)return e.url;const t=e.url.startsWith("/")?e.url.slice(1):e.url,i=document.querySelector("base")?.getAttribute("href")||"/";return(i.endsWith("/")?i:i+"/")+t}getComputedNav(){const e=[];return this.nav.forEach(((t,i)=>{const r=this.pref.nav[t.id];e.push({...t,...r,order:r?.order??t.order??i,parentId:r?.parentId??null}),"group"===t.type&&t.children&&t.children.forEach(((i,r)=>{const s=this.pref.nav[i.id];e.push({...i,...s,order:s?.order??i.order??r,parentId:void 0!==s?.parentId?s.parentId:t.id})}))})),Object.entries(this.pref.nav).forEach((([t,i])=>{t.startsWith("custom")&&i.type&&i.label&&e.push({id:t,type:i.type,label:i.label,icon:i.icon,url:i.url,active:i.active,order:i.order??e.length,parentId:i.parentId??null})})),e}getNavItemChildren(e){let t=this.getComputedNav().filter((t=>t.parentId===e)).sort(((e,t)=>e.order-t.order));if(this.isEditing||(t=t.filter((e=>!1!==e.active))),this.navQuery){const i=this.navQuery.toLowerCase(),r=this.getComputedNav();if(null!==e){const s=r.find((t=>t.id===e));if(s?.label.toLowerCase().includes(i))return t}t=t.filter((e=>"group"===e.type?e.label.toLowerCase().includes(i)||r.some((t=>t.parentId===e.id&&!1!==t.active&&t.label.toLowerCase().includes(i))):e.label.toLowerCase().includes(i)))}return t}handleNavQueryChange(e){this.navQuery=e.target.value,this.navQuery?this.getComputedNav().forEach((e=>{"group"===e.type&&this.navItemsExpanded.add(e.id)})):this.navItemsExpanded.clear()}handleNavQueryClear(){this.navQuery="",this.navItemsExpanded.clear()}handleMenuClick(){this.isNavOpened=!this.isNavOpened,localStorage.setItem("kr-scaffold-nav-opened",String(this.isNavOpened))}handleNavHeaderClick(){this.activeNavItemId=null;const e=new CustomEvent("nav-item-click",{detail:{item:{url:this.homeUrl}},bubbles:!0,composed:!0,cancelable:!0});this.dispatchEvent(e),e.defaultPrevented||(window.location.href=this.homeUrl)}handleNavScroll(e){this.isNavScrolled=e.target.scrollTop>0}toggleNavItem(e){const t=this.shadowRoot?.querySelector(`.nav-item[data-id="${e}"]`),i=t?.nextElementSibling;i&&(this.navItemsExpanded.has(e)?(this.navItemsExpanded.delete(e),i.animate([{height:`${i.scrollHeight}px`},{height:"0px"}],{duration:300,easing:"ease-in-out"}).onfinish=()=>{i.classList.remove("nav-group--expanded")}):(this.navItemsExpanded.add(e),i.classList.add("nav-group--expanded"),i.animate([{height:"0px"},{height:`${i.scrollHeight}px`}],{duration:300,easing:"ease-in-out"})),this.requestUpdate())}handleNavItemClick(e,t){if("group"===t.type)this.toggleNavItem(t.id);else{if(e.ctrlKey||e.metaKey||1===e.button)return;this.activeNavItemId=t.id;const i=new CustomEvent("nav-item-click",{detail:{item:t},bubbles:!0,composed:!0,cancelable:!0});this.dispatchEvent(i),i.defaultPrevented&&e.preventDefault()}}updateActiveNavItem(){const e=window.location.pathname,t=this.getComputedNav().filter((e=>"item"===e.type&&e.url));let i=null,r=0;for(const s of t){const t=this.resolveUrl(s);e.startsWith(t)&&t.length>r&&(i=s,r=t.length)}i?(this.activeNavItemId=i.id,i.parentId&&this.navItemsExpanded.add(i.parentId)):this.activeNavItemId=null}startEditing(){this.isEditing=!0}cancelEditing(){this.isEditing=!1,this.loadPref()}resetPref(){this.pref.nav={}}savePref(){const e=this.pref.uuid?`/api/system/preference/json/scaffold/${this.pref.uuid}?global=true`:"/api/system/preference/json/scaffold?global=true";i.fetch({url:e,method:this.pref.uuid?"PUT":"POST",body:JSON.stringify({nav:this.pref.nav})}).then((e=>e.json())).then((e=>{this.pref=e.data,this.isEditing=!1})).catch((e=>{console.error("Failed to save nav customizations:",e)}))}loadPref(){i.fetch({url:"/api/system/preference/json/scaffold?global=true",method:"GET"}).then((e=>e.json())).then((e=>{const t=e?.data?.[0];t&&(this.pref=t)})).catch((()=>{}))}handleNavItemContextMenu(t,i){this.isEditing&&(t.preventDefault(),e.open({x:t.clientX,y:t.clientY,items:[{id:"edit",label:"Edit Item"},{id:"divider-1",label:"",divider:!0},{id:"add-above",label:"Add Item Above"},{id:"add-below",label:"Add Item Below"}]}).then((e=>{if(e)switch(e.id){case"edit":this.openNavItemEdit(i);break;case"add-above":this.addNavItem(i,"above");break;case"add-below":this.addNavItem(i,"below")}})))}openNavItemEdit(e){t.open(we,{data:e}).afterClosed().then((t=>{const i=t;i&&(this.pref.nav[e.id]||(this.pref.nav[e.id]={}),this.pref.nav[e.id]={...this.pref.nav[e.id],...i},this.requestUpdate())}))}addNavItem(e,t){const i=`custom-${Date.now()}`,r=this.getComputedNav().filter((t=>t.parentId===e.parentId)).sort(((e,t)=>e.order-t.order)),s=r.findIndex((t=>t.id===e.id)),n="above"===t?s:s+1;r.forEach(((e,t)=>{t>=n&&(this.pref.nav[e.id]||(this.pref.nav[e.id]={}),this.pref.nav[e.id].order=t+1)}));const a={id:i,type:"item",label:"New Item",order:n,parentId:e.parentId,active:!0};this.pref.nav[i]=a,this.requestUpdate(),this.openNavItemEdit(a)}handleNavItemMouseDown(e,t){this.isEditing&&(e.preventDefault(),this.draggedNavItemId=t.id,this.navItemDragStartY=e.clientY,this.isNavItemDragging=!1,document.addEventListener("mousemove",this.boundHandleMouseMove),document.addEventListener("mouseup",this.boundHandleMouseUp))}handleMouseMove(e){if(this.draggedNavItemId){if(!this.isNavItemDragging&&Math.abs(e.clientY-this.navItemDragStartY)>5){this.isNavItemDragging=!0,this.classList.add("kr-scaffold--dragging");const t=this.getComputedNav().find((e=>e.id===this.draggedNavItemId));t&&(this.navItemDragPreview=document.createElement("div"),this.navItemDragPreview.className="nav-item-drag-preview",this.navItemDragPreview.textContent=t.label,this.navItemDragPreview.style.left=`${e.clientX+10}px`,this.navItemDragPreview.style.top=e.clientY-20+"px",this.shadowRoot?.appendChild(this.navItemDragPreview))}this.isNavItemDragging&&(this.navItemDragPreview&&(this.navItemDragPreview.style.left=`${e.clientX+10}px`,this.navItemDragPreview.style.top=e.clientY-20+"px"),this.updateNavItemDropTarget(e))}}handleMouseUp(){document.removeEventListener("mousemove",this.boundHandleMouseMove),document.removeEventListener("mouseup",this.boundHandleMouseUp),this.isNavItemDragging&&this.navItemDropTargetId&&this.executeNavItemDrop(),this.draggedNavItemId=null,this.navItemDropTargetId=null,this.isNavItemDragging=!1,this.classList.remove("kr-scaffold--dragging"),this.navItemDragPreview&&(this.navItemDragPreview.remove(),this.navItemDragPreview=null),this.clearNavItemDragExpandTimeout(),this.requestUpdate()}updateNavItemDropTarget(e){const t=this.shadowRoot?.querySelectorAll(".nav-item[data-id]");if(!t)return;let i=!1;t.forEach((t=>{const r=t.getBoundingClientRect(),s=t.getAttribute("data-id");if(!s||s===this.draggedNavItemId)return;if(e.clientX<r.left||e.clientX>r.right||e.clientY<r.top||e.clientY>r.bottom)return;const n=this.getComputedNav().find((e=>e.id===s));if(!n)return;const a=e.clientY-r.top;let o;"group"===n.type?a<r.height/3?(o="above",this.clearNavItemDragExpandTimeout()):a>2*r.height/3?(o="below",this.clearNavItemDragExpandTimeout()):(o="center",this.navItemsExpanded.has(n.id)||this.navItemDragExpandTimeout||this.expandNavGroupOnDrag(n.id)):(o=a<r.height/2?"above":"below",this.clearNavItemDragExpandTimeout());const l="center"===o?n.id:n.parentId,d=this.getComputedNav().find((e=>e.id===this.draggedNavItemId));if(l===this.draggedNavItemId||"group"===d?.type&&null!==l)return this.navItemDropTargetId=null,void this.clearNavItemDragExpandTimeout();this.navItemDropTargetId=n.id,this.navItemDropPosition=o,i=!0})),i||(this.navItemDropTargetId=null,this.clearNavItemDragExpandTimeout()),this.requestUpdate()}clearNavItemDragExpandTimeout(){this.navItemDragExpandTimeout&&(clearTimeout(this.navItemDragExpandTimeout),this.navItemDragExpandTimeout=null)}expandNavGroupOnDrag(e){this.navItemDragExpandTimeout=window.setTimeout((()=>{this.navItemDropTargetId===e&&"center"===this.navItemDropPosition&&(this.navItemsExpanded.add(e),this.requestUpdate()),this.navItemDragExpandTimeout=null}),500)}executeNavItemDrop(){if(!this.draggedNavItemId||!this.navItemDropTargetId)return;const e=this.getComputedNav(),t=e.find((e=>e.id===this.draggedNavItemId)),i=e.find((e=>e.id===this.navItemDropTargetId));if(!t||!i)return;let r;if("center"===this.navItemDropPosition&&"group"===i.type){if(i.id===this.draggedNavItemId)return;r=i.id}else r=i.parentId;if(r===this.draggedNavItemId)return;const s=e.filter((e=>e.parentId===r&&e.id!==this.draggedNavItemId)).sort(((e,t)=>e.order-t.order)),n=this.pref.nav;let a;if("center"===this.navItemDropPosition)a=s.length>0?Math.max(...s.map((e=>e.order)))+1:0;else{const e=s.findIndex((e=>e.id===i.id));a=-1===e?0:"above"===this.navItemDropPosition?e:e+1,s.forEach(((e,t)=>{n[e.id]||(n[e.id]={}),n[e.id].order=t>=a?t+1:t}))}n[this.draggedNavItemId]||(n[this.draggedNavItemId]={}),n[this.draggedNavItemId].order=a,n[this.draggedNavItemId].parentId=r,this.pref.nav=n,this.requestUpdate()}toggleUserMenu(){this.isUserMenuOpen=!this.isUserMenuOpen}closeUserMenu(){this.isUserMenuOpen=!1}handleCustomize(){this.closeUserMenu(),this.startEditing()}renderNormalFooter(){if(!this.user)return W;const e=this.user.name.split(" ").map((e=>e[0])).join("").toUpperCase().slice(0,2);return B`
|
|
190
|
+
`,$e([ue()],we.prototype,"label",void 0),$e([ue()],we.prototype,"icon",void 0),$e([ue()],we.prototype,"url",void 0),$e([ue()],we.prototype,"active",void 0),we=$e([ce("kr-nav-item-edit")],we);var Ie=function(e,t,i,r){var s,n=arguments.length,a=n<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,i):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,r);else for(var o=e.length-1;o>=0;o--)(s=e[o])&&(a=(n<3?s(a):n>3?s(t,i,a):s(t,i))||a);return n>3&&a&&Object.defineProperty(t,i,a),a};let ke=class extends le{constructor(){super(),this.defaultNavItemIcon='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor"><circle cx="12" cy="12" r="10"/></svg>',this.navItemsExpanded=new Set,this.navQuery="",this.activeNavItemId=null,this.isNavScrolled=!1,this.isNavOpened="false"!==localStorage.getItem("kr-scaffold-nav-opened"),this.isEditing=!1,this.isUserMenuOpen=!1,this.pref={nav:{}},this.draggedNavItemId=null,this.navItemDropTargetId=null,this.navItemDropPosition="above",this.pendingRequests=0,this.originalFetch=null,this.originalXhrOpen=null,this.navItemDragPreview=null,this.navItemDragStartY=0,this.isNavItemDragging=!1,this.navItemDragExpandTimeout=null,this.navInitialized=!1,this.logo="",this.label="",this.homeUrl="/",this.scheme="light",this.nav=[],this.navIconsDisplayed=!1,this.navExpanded=!1,this.user=null,this.subbar=!1,this.breadcrumbs=[],this.boundHandleMouseMove=this.handleMouseMove.bind(this),this.boundHandleMouseUp=this.handleMouseUp.bind(this)}connectedCallback(){super.connectedCallback(),this.loadPref(),this.installFetchInterceptor()}updated(e){super.updated(e),e.has("nav")&&this.nav.length>0&&(this.updateActiveNavItem(),this.navExpanded&&!this.navInitialized&&(this.navInitialized=!0,this.getComputedNav().filter((e=>"group"===e.type)).forEach((e=>this.navItemsExpanded.add(e.id)))))}disconnectedCallback(){super.disconnectedCallback(),this.uninstallFetchInterceptor()}installFetchInterceptor(){if(this.originalFetch)return;const e=this;this.originalFetch=window.fetch.bind(window);const t=this.originalFetch;window.fetch=function(...i){return e.pendingRequests++,t(...i).finally((()=>{e.pendingRequests--}))},this.originalXhrOpen=XMLHttpRequest.prototype.open;const i=this.originalXhrOpen;XMLHttpRequest.prototype.open=function(t,r,s=!0,n,a){return e.pendingRequests++,this.addEventListener("loadend",(()=>{e.pendingRequests--}),{once:!0}),i.call(this,t,r,s,n,a)}}uninstallFetchInterceptor(){this.originalFetch&&(window.fetch=this.originalFetch,this.originalFetch=null),this.originalXhrOpen&&(XMLHttpRequest.prototype.open=this.originalXhrOpen,this.originalXhrOpen=null)}resolveUrl(e){if(!e.url)return"#";if(e.external)return e.url;const t=e.url.startsWith("/")?e.url.slice(1):e.url,i=document.querySelector("base")?.getAttribute("href")||"/";return(i.endsWith("/")?i:i+"/")+t}getComputedNav(){const e=[];return this.nav.forEach(((t,i)=>{const r=this.pref.nav[t.id];e.push({...t,...r,order:r?.order??t.order??i,parentId:r?.parentId??null}),"group"===t.type&&t.children&&t.children.forEach(((i,r)=>{const s=this.pref.nav[i.id];e.push({...i,...s,order:s?.order??i.order??r,parentId:void 0!==s?.parentId?s.parentId:t.id})}))})),Object.entries(this.pref.nav).forEach((([t,i])=>{t.startsWith("custom")&&i.type&&i.label&&e.push({id:t,type:i.type,label:i.label,icon:i.icon,url:i.url,active:i.active,order:i.order??e.length,parentId:i.parentId??null})})),e}getNavItemChildren(e){let t=this.getComputedNav().filter((t=>t.parentId===e)).sort(((e,t)=>e.order-t.order));if(this.isEditing||(t=t.filter((e=>!1!==e.active))),this.navQuery){const i=this.navQuery.toLowerCase(),r=this.getComputedNav();if(null!==e){const s=r.find((t=>t.id===e));if(s?.label.toLowerCase().includes(i))return t}t=t.filter((e=>"group"===e.type?e.label.toLowerCase().includes(i)||r.some((t=>t.parentId===e.id&&!1!==t.active&&t.label.toLowerCase().includes(i))):e.label.toLowerCase().includes(i)))}return t}handleNavQueryChange(e){this.navQuery=e.target.value,this.navQuery?this.getComputedNav().forEach((e=>{"group"===e.type&&this.navItemsExpanded.add(e.id)})):this.navItemsExpanded.clear()}handleNavQueryClear(){this.navQuery="",this.navItemsExpanded.clear()}handleMenuClick(){this.isNavOpened=!this.isNavOpened,localStorage.setItem("kr-scaffold-nav-opened",String(this.isNavOpened))}handleNavHeaderClick(){this.activeNavItemId=null;const e=new CustomEvent("nav-item-click",{detail:{item:{url:this.homeUrl}},bubbles:!0,composed:!0,cancelable:!0});this.dispatchEvent(e),e.defaultPrevented||(window.location.href=this.homeUrl)}handleNavScroll(e){this.isNavScrolled=e.target.scrollTop>0}toggleNavItem(e){const t=this.shadowRoot?.querySelector(`.nav-item[data-id="${e}"]`),i=t?.nextElementSibling;i&&(this.navItemsExpanded.has(e)?(this.navItemsExpanded.delete(e),i.animate([{height:`${i.scrollHeight}px`},{height:"0px"}],{duration:300,easing:"ease-in-out"}).onfinish=()=>{i.classList.remove("nav-group--expanded")}):(this.navItemsExpanded.add(e),i.classList.add("nav-group--expanded"),i.animate([{height:"0px"},{height:`${i.scrollHeight}px`}],{duration:300,easing:"ease-in-out"})),this.requestUpdate())}handleNavItemClick(e,t){if("group"===t.type)this.toggleNavItem(t.id);else{if(e.ctrlKey||e.metaKey||1===e.button)return;this.activeNavItemId=t.id;const i=new CustomEvent("nav-item-click",{detail:{item:t},bubbles:!0,composed:!0,cancelable:!0});this.dispatchEvent(i),i.defaultPrevented&&e.preventDefault()}}updateActiveNavItem(){const e=window.location.pathname,t=this.getComputedNav().filter((e=>"item"===e.type&&e.url));let i=null,r=0;for(const s of t){const t=this.resolveUrl(s);e.startsWith(t)&&t.length>r&&(i=s,r=t.length)}i?(this.activeNavItemId=i.id,i.parentId&&this.navItemsExpanded.add(i.parentId)):this.activeNavItemId=null}startEditing(){this.isEditing=!0}cancelEditing(){this.isEditing=!1,this.loadPref()}resetPref(){this.pref.nav={}}savePref(){const e=this.pref.uuid?`/api/system/preference/json/scaffold/${this.pref.uuid}?global=true`:"/api/system/preference/json/scaffold?global=true";i.fetch({url:e,method:this.pref.uuid?"PUT":"POST",body:JSON.stringify({nav:this.pref.nav})}).then((e=>e.json())).then((e=>{this.pref=e.data,this.isEditing=!1})).catch((e=>{console.error("Failed to save nav customizations:",e)}))}loadPref(){i.fetch({url:"/api/system/preference/json/scaffold?global=true",method:"GET"}).then((e=>e.json())).then((e=>{const t=e?.data?.[0];t&&(this.pref=t)})).catch((()=>{}))}handleNavItemContextMenu(t,i){this.isEditing&&(t.preventDefault(),e.open({x:t.clientX,y:t.clientY,items:[{id:"edit",label:"Edit Item"},{id:"divider-1",label:"",divider:!0},{id:"add-above",label:"Add Item Above"},{id:"add-below",label:"Add Item Below"}]}).then((e=>{if(e)switch(e.id){case"edit":this.openNavItemEdit(i);break;case"add-above":this.addNavItem(i,"above");break;case"add-below":this.addNavItem(i,"below")}})))}openNavItemEdit(e){t.open(we,{data:e}).afterClosed().then((t=>{const i=t;i&&(this.pref.nav[e.id]||(this.pref.nav[e.id]={}),this.pref.nav[e.id]={...this.pref.nav[e.id],...i},this.requestUpdate())}))}addNavItem(e,t){const i=`custom-${Date.now()}`,r=this.getComputedNav().filter((t=>t.parentId===e.parentId)).sort(((e,t)=>e.order-t.order)),s=r.findIndex((t=>t.id===e.id)),n="above"===t?s:s+1;r.forEach(((e,t)=>{t>=n&&(this.pref.nav[e.id]||(this.pref.nav[e.id]={}),this.pref.nav[e.id].order=t+1)}));const a={id:i,type:"item",label:"New Item",order:n,parentId:e.parentId,active:!0};this.pref.nav[i]=a,this.requestUpdate(),this.openNavItemEdit(a)}handleNavItemMouseDown(e,t){this.isEditing&&(e.preventDefault(),this.draggedNavItemId=t.id,this.navItemDragStartY=e.clientY,this.isNavItemDragging=!1,document.addEventListener("mousemove",this.boundHandleMouseMove),document.addEventListener("mouseup",this.boundHandleMouseUp))}handleMouseMove(e){if(this.draggedNavItemId){if(!this.isNavItemDragging&&Math.abs(e.clientY-this.navItemDragStartY)>5){this.isNavItemDragging=!0,this.classList.add("kr-scaffold--dragging");const t=this.getComputedNav().find((e=>e.id===this.draggedNavItemId));t&&(this.navItemDragPreview=document.createElement("div"),this.navItemDragPreview.className="nav-item-drag-preview",this.navItemDragPreview.textContent=t.label,this.navItemDragPreview.style.left=`${e.clientX+10}px`,this.navItemDragPreview.style.top=e.clientY-20+"px",this.shadowRoot?.appendChild(this.navItemDragPreview))}this.isNavItemDragging&&(this.navItemDragPreview&&(this.navItemDragPreview.style.left=`${e.clientX+10}px`,this.navItemDragPreview.style.top=e.clientY-20+"px"),this.updateNavItemDropTarget(e))}}handleMouseUp(){document.removeEventListener("mousemove",this.boundHandleMouseMove),document.removeEventListener("mouseup",this.boundHandleMouseUp),this.isNavItemDragging&&this.navItemDropTargetId&&this.executeNavItemDrop(),this.draggedNavItemId=null,this.navItemDropTargetId=null,this.isNavItemDragging=!1,this.classList.remove("kr-scaffold--dragging"),this.navItemDragPreview&&(this.navItemDragPreview.remove(),this.navItemDragPreview=null),this.clearNavItemDragExpandTimeout(),this.requestUpdate()}updateNavItemDropTarget(e){const t=this.shadowRoot?.querySelectorAll(".nav-item[data-id]");if(!t)return;let i=!1;t.forEach((t=>{const r=t.getBoundingClientRect(),s=t.getAttribute("data-id");if(!s||s===this.draggedNavItemId)return;if(e.clientX<r.left||e.clientX>r.right||e.clientY<r.top||e.clientY>r.bottom)return;const n=this.getComputedNav().find((e=>e.id===s));if(!n)return;const a=e.clientY-r.top;let o;"group"===n.type?a<r.height/3?(o="above",this.clearNavItemDragExpandTimeout()):a>2*r.height/3?(o="below",this.clearNavItemDragExpandTimeout()):(o="center",this.navItemsExpanded.has(n.id)||this.navItemDragExpandTimeout||this.expandNavGroupOnDrag(n.id)):(o=a<r.height/2?"above":"below",this.clearNavItemDragExpandTimeout());const l="center"===o?n.id:n.parentId,d=this.getComputedNav().find((e=>e.id===this.draggedNavItemId));if(l===this.draggedNavItemId||"group"===d?.type&&null!==l)return this.navItemDropTargetId=null,void this.clearNavItemDragExpandTimeout();this.navItemDropTargetId=n.id,this.navItemDropPosition=o,i=!0})),i||(this.navItemDropTargetId=null,this.clearNavItemDragExpandTimeout()),this.requestUpdate()}clearNavItemDragExpandTimeout(){this.navItemDragExpandTimeout&&(clearTimeout(this.navItemDragExpandTimeout),this.navItemDragExpandTimeout=null)}expandNavGroupOnDrag(e){this.navItemDragExpandTimeout=window.setTimeout((()=>{this.navItemDropTargetId===e&&"center"===this.navItemDropPosition&&(this.navItemsExpanded.add(e),this.requestUpdate()),this.navItemDragExpandTimeout=null}),500)}executeNavItemDrop(){if(!this.draggedNavItemId||!this.navItemDropTargetId)return;const e=this.getComputedNav(),t=e.find((e=>e.id===this.draggedNavItemId)),i=e.find((e=>e.id===this.navItemDropTargetId));if(!t||!i)return;let r;if("center"===this.navItemDropPosition&&"group"===i.type){if(i.id===this.draggedNavItemId)return;r=i.id}else r=i.parentId;if(r===this.draggedNavItemId)return;const s=e.filter((e=>e.parentId===r&&e.id!==this.draggedNavItemId)).sort(((e,t)=>e.order-t.order)),n=this.pref.nav;let a;if("center"===this.navItemDropPosition)a=s.length>0?Math.max(...s.map((e=>e.order)))+1:0;else{const e=s.findIndex((e=>e.id===i.id));a=-1===e?0:"above"===this.navItemDropPosition?e:e+1,s.forEach(((e,t)=>{n[e.id]||(n[e.id]={}),n[e.id].order=t>=a?t+1:t}))}n[this.draggedNavItemId]||(n[this.draggedNavItemId]={}),n[this.draggedNavItemId].order=a,n[this.draggedNavItemId].parentId=r,this.pref.nav=n,this.requestUpdate()}toggleUserMenu(){this.isUserMenuOpen=!this.isUserMenuOpen}closeUserMenu(){this.isUserMenuOpen=!1}handleCustomize(){this.closeUserMenu(),this.startEditing()}renderNormalFooter(){if(!this.user)return W;const e=this.user.name.split(" ").map((e=>e[0])).join("").toUpperCase().slice(0,2);return F`
|
|
191
191
|
<div class="user-menu-container">
|
|
192
|
-
${this.isUserMenuOpen?
|
|
192
|
+
${this.isUserMenuOpen?F`
|
|
193
193
|
<div class="user-menu">
|
|
194
194
|
<button class="user-menu__item" @click=${this.handleCustomize}>
|
|
195
195
|
Customize Navigation
|
|
@@ -198,15 +198,15 @@ const ce=e=>(t,i)=>{void 0!==i?i.addInitializer((()=>{customElements.define(e,t)
|
|
|
198
198
|
`:W}
|
|
199
199
|
<div class="user" @click=${this.toggleUserMenu}>
|
|
200
200
|
<div class="user__avatar">
|
|
201
|
-
${this.user.avatar?
|
|
201
|
+
${this.user.avatar?F`<img src=${this.user.avatar} alt=${this.user.name} />`:e}
|
|
202
202
|
</div>
|
|
203
203
|
<div class="user__info">
|
|
204
204
|
<div class="user__name">${this.user.name}</div>
|
|
205
|
-
${this.user.email?
|
|
205
|
+
${this.user.email?F`<div class="user__email">${this.user.email}</div>`:W}
|
|
206
206
|
</div>
|
|
207
207
|
</div>
|
|
208
208
|
</div>
|
|
209
|
-
`}renderEditFooter(){return
|
|
209
|
+
`}renderEditFooter(){return F`
|
|
210
210
|
<div class="edit-actions">
|
|
211
211
|
<button class="edit-actions__btn edit-actions__btn--primary" @click=${this.savePref}>
|
|
212
212
|
Save
|
|
@@ -220,9 +220,9 @@ const ce=e=>(t,i)=>{void 0!==i?i.addInitializer((()=>{customElements.define(e,t)
|
|
|
220
220
|
</button>
|
|
221
221
|
</div>
|
|
222
222
|
</div>
|
|
223
|
-
`}renderNavItem(e,t=!1){if("section"===e.type)return
|
|
223
|
+
`}renderNavItem(e,t=!1){if("section"===e.type)return F`
|
|
224
224
|
<div class="nav-section">${e.label}</div>
|
|
225
|
-
`;if("group"===e.type){const t=this.getNavItemChildren(e.id);return
|
|
225
|
+
`;if("group"===e.type){const t=this.getNavItemChildren(e.id);return F`
|
|
226
226
|
<button
|
|
227
227
|
class=${_e({"nav-item":!0,"nav-item--expanded":this.navItemsExpanded.has(e.id),"nav-item--hidden":this.isEditing&&!1===e.active,"nav-item--drop-above":this.navItemDropTargetId===e.id&&"above"===this.navItemDropPosition,"nav-item--drop-below":this.navItemDropTargetId===e.id&&"below"===this.navItemDropPosition,"nav-item--drop-center":this.navItemDropTargetId===e.id&&"center"===this.navItemDropPosition})}
|
|
228
228
|
data-id="${e.id}"
|
|
@@ -230,7 +230,7 @@ const ce=e=>(t,i)=>{void 0!==i?i.addInitializer((()=>{customElements.define(e,t)
|
|
|
230
230
|
@click=${t=>this.handleNavItemClick(t,e)}
|
|
231
231
|
@contextmenu=${t=>this.handleNavItemContextMenu(t,e)}
|
|
232
232
|
>
|
|
233
|
-
${this.navIconsDisplayed?
|
|
233
|
+
${this.navIconsDisplayed?F`<span class="nav-item__icon">${ye(e.icon||this.defaultNavItemIcon)}</span>`:W}
|
|
234
234
|
<span class="nav-item__label">${e.label}</span>
|
|
235
235
|
<svg
|
|
236
236
|
class="nav-item__chevron"
|
|
@@ -245,7 +245,7 @@ const ce=e=>(t,i)=>{void 0!==i?i.addInitializer((()=>{customElements.define(e,t)
|
|
|
245
245
|
<div class=${_e({"nav-group":!0,"nav-group--expanded":this.navItemsExpanded.has(e.id)})}>
|
|
246
246
|
${t.map((e=>this.renderNavItem(e,!0)))}
|
|
247
247
|
</div>
|
|
248
|
-
`}return
|
|
248
|
+
`}return F`
|
|
249
249
|
<a
|
|
250
250
|
class=${_e({"nav-item":!0,"nav-item--active":this.activeNavItemId===e.id,"nav-item--hidden":this.isEditing&&!1===e.active,"nav-item--drop-above":this.navItemDropTargetId===e.id&&"above"===this.navItemDropPosition,"nav-item--drop-below":this.navItemDropTargetId===e.id&&"below"===this.navItemDropPosition})}
|
|
251
251
|
data-id="${e.id}"
|
|
@@ -255,10 +255,10 @@ const ce=e=>(t,i)=>{void 0!==i?i.addInitializer((()=>{customElements.define(e,t)
|
|
|
255
255
|
@click=${t=>this.handleNavItemClick(t,e)}
|
|
256
256
|
@contextmenu=${t=>this.handleNavItemContextMenu(t,e)}
|
|
257
257
|
>
|
|
258
|
-
${this.navIconsDisplayed&&!t?
|
|
258
|
+
${this.navIconsDisplayed&&!t?F`<span class="nav-item__icon">${ye(e.icon||this.defaultNavItemIcon)}</span>`:W}
|
|
259
259
|
<span class="nav-item__label">${e.label}</span>
|
|
260
260
|
</a>
|
|
261
|
-
`}render(){const e=this.getNavItemChildren(null),t=this.getComputedNav().filter((e=>null===e.parentId)).length;return
|
|
261
|
+
`}render(){const e=this.getNavItemChildren(null),t=this.getComputedNav().filter((e=>null===e.parentId)).length;return F`
|
|
262
262
|
<div class=${_e({progress:!0,"progress--loading":this.pendingRequests>0})}>
|
|
263
263
|
<div class="progress__track"></div>
|
|
264
264
|
<div class="progress__bar progress__bar--primary">
|
|
@@ -269,7 +269,7 @@ const ce=e=>(t,i)=>{void 0!==i?i.addInitializer((()=>{customElements.define(e,t)
|
|
|
269
269
|
</div>
|
|
270
270
|
</div>
|
|
271
271
|
|
|
272
|
-
${this.subbar?
|
|
272
|
+
${this.subbar?F`
|
|
273
273
|
<kr-subbar menu .breadcrumbs=${this.breadcrumbs} @menu-click=${this.handleMenuClick}>
|
|
274
274
|
<slot name="subbar"></slot>
|
|
275
275
|
</kr-subbar>
|
|
@@ -278,10 +278,10 @@ const ce=e=>(t,i)=>{void 0!==i?i.addInitializer((()=>{customElements.define(e,t)
|
|
|
278
278
|
<div class="wrapper">
|
|
279
279
|
<nav class=${_e({nav:!0,"nav--scrolled":this.isNavScrolled,"nav--opened":!this.subbar||this.isNavOpened})}>
|
|
280
280
|
<div class="nav-header" @click=${this.handleNavHeaderClick}>
|
|
281
|
-
${this.label?
|
|
281
|
+
${this.label?F`<span class="nav-title">${this.label}</span>`:this.logo?F`<img class="nav-logo" src=${this.logo} alt="Logo" />`:W}
|
|
282
282
|
</div>
|
|
283
283
|
<div class="nav-content" @scroll=${this.handleNavScroll}>
|
|
284
|
-
${t>20?
|
|
284
|
+
${t>20?F`
|
|
285
285
|
<div class="nav-search">
|
|
286
286
|
<div class="nav-search__wrapper">
|
|
287
287
|
<span class="nav-search__icon">
|
|
@@ -296,7 +296,7 @@ const ce=e=>(t,i)=>{void 0!==i?i.addInitializer((()=>{customElements.define(e,t)
|
|
|
296
296
|
.value=${this.navQuery}
|
|
297
297
|
@input=${this.handleNavQueryChange}
|
|
298
298
|
/>
|
|
299
|
-
${this.navQuery?
|
|
299
|
+
${this.navQuery?F`
|
|
300
300
|
<button class="nav-search__clear" @click=${this.handleNavQueryClear}>
|
|
301
301
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="currentColor">
|
|
302
302
|
<path d="M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"/>
|
|
@@ -1045,19 +1045,19 @@ const ce=e=>(t,i)=>{void 0!==i?i.addInitializer((()=>{customElements.define(e,t)
|
|
|
1045
1045
|
transform: scaleX(0.08);
|
|
1046
1046
|
}
|
|
1047
1047
|
}
|
|
1048
|
-
`,Ie([ue()],ke.prototype,"navItemsExpanded",void 0),Ie([ue()],ke.prototype,"navQuery",void 0),Ie([ue()],ke.prototype,"activeNavItemId",void 0),Ie([ue()],ke.prototype,"isNavScrolled",void 0),Ie([ue()],ke.prototype,"isNavOpened",void 0),Ie([ue()],ke.prototype,"isEditing",void 0),Ie([ue()],ke.prototype,"isUserMenuOpen",void 0),Ie([ue()],ke.prototype,"pref",void 0),Ie([ue()],ke.prototype,"draggedNavItemId",void 0),Ie([ue()],ke.prototype,"navItemDropTargetId",void 0),Ie([ue()],ke.prototype,"navItemDropPosition",void 0),Ie([ue()],ke.prototype,"pendingRequests",void 0),Ie([ve({type:String})],ke.prototype,"logo",void 0),Ie([ve({type:String})],ke.prototype,"label",void 0),Ie([ve({type:String,attribute:"home-url"})],ke.prototype,"homeUrl",void 0),Ie([ve({type:String,reflect:!0})],ke.prototype,"scheme",void 0),Ie([ve({type:Array})],ke.prototype,"nav",void 0),Ie([ve({type:Boolean,attribute:"nav-icons-displayed",reflect:!0})],ke.prototype,"navIconsDisplayed",void 0),Ie([ve({type:Boolean,attribute:"nav-expanded"})],ke.prototype,"navExpanded",void 0),Ie([ve({type:Object})],ke.prototype,"user",void 0),Ie([ve({type:Boolean})],ke.prototype,"subbar",void 0),Ie([ve({type:Array})],ke.prototype,"breadcrumbs",void 0),ke=Ie([ce("kr-scaffold")],ke);var Ee=function(e,t,i,r){var s,n=arguments.length,a=n<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,i):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,r);else for(var o=e.length-1;o>=0;o--)(s=e[o])&&(a=(n<3?s(a):n>3?s(t,i,a):s(t,i))||a);return n>3&&a&&Object.defineProperty(t,i,a),a};let Ae=class extends le{constructor(){super(...arguments),this.label="",this.subLabel="",this.navItems=[],this.activeId=""}handleNavItemClick(e,t){const i=new CustomEvent("nav-item-click",{detail:{item:t},bubbles:!0,composed:!0,cancelable:!0});this.dispatchEvent(i),i.defaultPrevented&&e.preventDefault()}render(){return
|
|
1048
|
+
`,Ie([ue()],ke.prototype,"navItemsExpanded",void 0),Ie([ue()],ke.prototype,"navQuery",void 0),Ie([ue()],ke.prototype,"activeNavItemId",void 0),Ie([ue()],ke.prototype,"isNavScrolled",void 0),Ie([ue()],ke.prototype,"isNavOpened",void 0),Ie([ue()],ke.prototype,"isEditing",void 0),Ie([ue()],ke.prototype,"isUserMenuOpen",void 0),Ie([ue()],ke.prototype,"pref",void 0),Ie([ue()],ke.prototype,"draggedNavItemId",void 0),Ie([ue()],ke.prototype,"navItemDropTargetId",void 0),Ie([ue()],ke.prototype,"navItemDropPosition",void 0),Ie([ue()],ke.prototype,"pendingRequests",void 0),Ie([ve({type:String})],ke.prototype,"logo",void 0),Ie([ve({type:String})],ke.prototype,"label",void 0),Ie([ve({type:String,attribute:"home-url"})],ke.prototype,"homeUrl",void 0),Ie([ve({type:String,reflect:!0})],ke.prototype,"scheme",void 0),Ie([ve({type:Array})],ke.prototype,"nav",void 0),Ie([ve({type:Boolean,attribute:"nav-icons-displayed",reflect:!0})],ke.prototype,"navIconsDisplayed",void 0),Ie([ve({type:Boolean,attribute:"nav-expanded"})],ke.prototype,"navExpanded",void 0),Ie([ve({type:Object})],ke.prototype,"user",void 0),Ie([ve({type:Boolean})],ke.prototype,"subbar",void 0),Ie([ve({type:Array})],ke.prototype,"breadcrumbs",void 0),ke=Ie([ce("kr-scaffold")],ke);var Ee=function(e,t,i,r){var s,n=arguments.length,a=n<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,i):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,r);else for(var o=e.length-1;o>=0;o--)(s=e[o])&&(a=(n<3?s(a):n>3?s(t,i,a):s(t,i))||a);return n>3&&a&&Object.defineProperty(t,i,a),a};let Ae=class extends le{constructor(){super(...arguments),this.label="",this.subLabel="",this.navItems=[],this.activeId="",this.handlePopstate=()=>{this.syncActiveFromUrl()}}connectedCallback(){super.connectedCallback(),requestAnimationFrame((()=>this.syncActiveFromUrl())),window.addEventListener("popstate",this.handlePopstate)}disconnectedCallback(){super.disconnectedCallback(),window.removeEventListener("popstate",this.handlePopstate)}handleNavItemClick(e,t){const i=new CustomEvent("nav-item-click",{detail:{item:t},bubbles:!0,composed:!0,cancelable:!0});this.dispatchEvent(i),i.defaultPrevented&&e.preventDefault(),this.activeId=t.id}syncActiveFromUrl(){const e=window.location.pathname,t=this.navItems.find((t=>!!t.url&&(t.url.startsWith("/")?e===t.url:e.endsWith("/"+t.url))));t&&(this.activeId=t.id)}render(){return F`
|
|
1049
1049
|
<nav class="nav">
|
|
1050
|
-
${this.label?
|
|
1050
|
+
${this.label?F`
|
|
1051
1051
|
<div class="nav-header">
|
|
1052
1052
|
<div class="nav-header__text">
|
|
1053
|
-
${this.subLabel?
|
|
1053
|
+
${this.subLabel?F`<div class="nav-header__subtitle">${this.subLabel}</div>`:W}
|
|
1054
1054
|
<div class="nav-header__title">${this.label}</div>
|
|
1055
1055
|
</div>
|
|
1056
1056
|
</div>
|
|
1057
1057
|
`:W}
|
|
1058
1058
|
<div class="nav-content">
|
|
1059
1059
|
<div class="nav-items">
|
|
1060
|
-
${this.navItems.map((e=>
|
|
1060
|
+
${this.navItems.map((e=>F`
|
|
1061
1061
|
<a
|
|
1062
1062
|
class="nav-item ${e.id===this.activeId?"nav-item--active":""}"
|
|
1063
1063
|
href=${e.url||"#"}
|
|
@@ -1165,7 +1165,7 @@ const ce=e=>(t,i)=>{void 0!==i?i.addInitializer((()=>{customElements.define(e,t)
|
|
|
1165
1165
|
flex: 1;
|
|
1166
1166
|
overflow-y: auto;
|
|
1167
1167
|
}
|
|
1168
|
-
`,Ee([ve({type:String})],Ae.prototype,"label",void 0),Ee([ve({type:String})],Ae.prototype,"subLabel",void 0),Ee([ve({type:Array})],Ae.prototype,"navItems",void 0),Ee([ve({type:String})],Ae.prototype,"activeId",void 0),Ae=Ee([ce("kr-screen-nav")],Ae);var Ne=function(e,t,i,r){var s,n=arguments.length,a=n<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,i):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,r);else for(var o=e.length-1;o>=0;o--)(s=e[o])&&(a=(n<3?s(a):n>3?s(t,i,a):s(t,i))||a);return n>3&&a&&Object.defineProperty(t,i,a),a};let Ce=class extends le{constructor(){super(...arguments),this.title=""}render(){return
|
|
1168
|
+
`,Ee([ve({type:String})],Ae.prototype,"label",void 0),Ee([ve({type:String})],Ae.prototype,"subLabel",void 0),Ee([ve({type:Array})],Ae.prototype,"navItems",void 0),Ee([ve({type:String})],Ae.prototype,"activeId",void 0),Ae=Ee([ce("kr-screen-nav")],Ae);var Ne=function(e,t,i,r){var s,n=arguments.length,a=n<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,i):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,r);else for(var o=e.length-1;o>=0;o--)(s=e[o])&&(a=(n<3?s(a):n>3?s(t,i,a):s(t,i))||a);return n>3&&a&&Object.defineProperty(t,i,a),a};let Ce=class extends le{constructor(){super(...arguments),this.title=""}render(){return F`
|
|
1169
1169
|
<div class="header">
|
|
1170
1170
|
<h2 class="header__title">${this.title}</h2>
|
|
1171
1171
|
<div class="header__actions">
|
|
@@ -1221,8 +1221,8 @@ const ce=e=>(t,i)=>{void 0!==i?i.addInitializer((()=>{customElements.define(e,t)
|
|
|
1221
1221
|
width: 100%;
|
|
1222
1222
|
max-width: 700px;
|
|
1223
1223
|
}
|
|
1224
|
-
`,Ne([ve({type:String})],Ce.prototype,"title",void 0),Ce=Ne([ce("kr-screen-detail")],Ce);var Se=function(e,t,i,r){var s,n=arguments.length,a=n<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,i):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,r);else for(var o=e.length-1;o>=0;o--)(s=e[o])&&(a=(n<3?s(a):n>3?s(t,i,a):s(t,i))||a);return n>3&&a&&Object.defineProperty(t,i,a),a};let De=class extends le{constructor(){super(...arguments),this.breadcrumbs=[],this.menu=!1}_handleMenuClick(){this.dispatchEvent(new CustomEvent("menu-click",{bubbles:!0,composed:!0}))}resolveUrl(e){if(!e.url)return"#";const t=e.url.startsWith("/")?e.url.slice(1):e.url,i=document.querySelector("base")?.getAttribute("href")||"/";return(i.endsWith("/")?i:i+"/")+t}_handleBreadcrumbClick(e,t,i){if(i||!t.url)return void e.preventDefault();if(e.ctrlKey||e.metaKey||1===e.button)return;const r=new CustomEvent("breadcrumb-click",{detail:{breadcrumb:t},bubbles:!0,composed:!0,cancelable:!0});this.dispatchEvent(r),r.defaultPrevented&&e.preventDefault()}render(){return
|
|
1225
|
-
${this.menu?
|
|
1224
|
+
`,Ne([ve({type:String})],Ce.prototype,"title",void 0),Ce=Ne([ce("kr-screen-detail")],Ce);var Se=function(e,t,i,r){var s,n=arguments.length,a=n<3?t:null===r?r=Object.getOwnPropertyDescriptor(t,i):r;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)a=Reflect.decorate(e,t,i,r);else for(var o=e.length-1;o>=0;o--)(s=e[o])&&(a=(n<3?s(a):n>3?s(t,i,a):s(t,i))||a);return n>3&&a&&Object.defineProperty(t,i,a),a};let De=class extends le{constructor(){super(...arguments),this.breadcrumbs=[],this.menu=!1}_handleMenuClick(){this.dispatchEvent(new CustomEvent("menu-click",{bubbles:!0,composed:!0}))}resolveUrl(e){if(!e.url)return"#";const t=e.url.startsWith("/")?e.url.slice(1):e.url,i=document.querySelector("base")?.getAttribute("href")||"/";return(i.endsWith("/")?i:i+"/")+t}_handleBreadcrumbClick(e,t,i){if(i||!t.url)return void e.preventDefault();if(e.ctrlKey||e.metaKey||1===e.button)return;const r=new CustomEvent("breadcrumb-click",{detail:{breadcrumb:t},bubbles:!0,composed:!0,cancelable:!0});this.dispatchEvent(r),r.defaultPrevented&&e.preventDefault()}render(){return F`
|
|
1225
|
+
${this.menu?F`
|
|
1226
1226
|
<div class="menu" @click=${this._handleMenuClick}>
|
|
1227
1227
|
<svg class="menu__icon" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2">
|
|
1228
1228
|
<line x1="3" y1="6" x2="21" y2="6"></line>
|
|
@@ -1232,8 +1232,8 @@ const ce=e=>(t,i)=>{void 0!==i?i.addInitializer((()=>{customElements.define(e,t)
|
|
|
1232
1232
|
</div>
|
|
1233
1233
|
`:W}
|
|
1234
1234
|
<div class="breadcrumbs">
|
|
1235
|
-
${this.breadcrumbs.map(((e,t)=>{const i=t===this.breadcrumbs.length-1;return
|
|
1236
|
-
${t>0?
|
|
1235
|
+
${this.breadcrumbs.map(((e,t)=>{const i=t===this.breadcrumbs.length-1;return F`
|
|
1236
|
+
${t>0?F`<span class="breadcrumb-separator">/</span>`:""}
|
|
1237
1237
|
<a
|
|
1238
1238
|
class=${_e({breadcrumb:!0,"breadcrumb--current":i})}
|
|
1239
1239
|
href=${this.resolveUrl(e)}
|