@kodaris/krubble-app-components 1.0.127 → 1.0.128

package/dist/krubble-app.umd.min.js

@@ -4245,7 +4245,7 @@ function ge(e,t){return(t,i,s)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Ref
         transform: scaleX(0.08);
       }
     }
-  `,Zt([pe({type:String})],Jt.prototype,"logo",void 0),Zt([pe({type:String})],Jt.prototype,"label",void 0),Zt([pe({type:String,attribute:"home-url"})],Jt.prototype,"homeUrl",void 0),Zt([pe({type:String,reflect:!0})],Jt.prototype,"scheme",void 0),Zt([pe({type:Array})],Jt.prototype,"nav",void 0),Zt([pe({type:Boolean,attribute:"nav-icons-displayed",reflect:!0})],Jt.prototype,"navIconsDisplayed",void 0),Zt([pe({type:Boolean,attribute:"nav-expanded"})],Jt.prototype,"navExpanded",void 0),Zt([pe({type:Object})],Jt.prototype,"user",void 0),Zt([pe({type:Boolean})],Jt.prototype,"subbar",void 0),Zt([pe({type:Boolean,attribute:"nav-enabled"})],Jt.prototype,"navEnabled",void 0),Zt([pe({type:String,attribute:"user-type"})],Jt.prototype,"userType",void 0),Zt([pe({type:Array})],Jt.prototype,"breadcrumbs",void 0),Zt([ue()],Jt.prototype,"isDev",void 0),Zt([ue()],Jt.prototype,"navItemsExpanded",void 0),Zt([ue()],Jt.prototype,"navQuery",void 0),Zt([ue()],Jt.prototype,"activeNavItemId",void 0),Zt([ue()],Jt.prototype,"isNavScrolled",void 0),Zt([ue()],Jt.prototype,"isNavOpened",void 0),Zt([ue()],Jt.prototype,"isEditing",void 0),Zt([ue()],Jt.prototype,"isUserMenuOpen",void 0),Zt([ue()],Jt.prototype,"pref",void 0),Zt([ue()],Jt.prototype,"draggedNavItemId",void 0),Zt([ue()],Jt.prototype,"navItemDropTargetId",void 0),Zt([ue()],Jt.prototype,"navItemDropPosition",void 0),Zt([ue()],Jt.prototype,"pendingRequests",void 0),customElements.get("kr-scaffold")||customElements.define("kr-scaffold",Jt);var Gt=function(e,t,i,s){var n,o=arguments.length,r=o<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,i):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(e,t,i,s);else for(var a=e.length-1;a>=0;a--)(n=e[a])&&(r=(o<3?n(r):o>3?n(t,i,r):n(t,i))||r);return o>3&&r&&Object.defineProperty(t,i,r),r};class ei extends le{constructor(){super(...arguments),this.label="",this.subLabel="",this.items=[],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.items.find((t=>!!t.url&&(t.url.startsWith("/")?e===t.url:e.endsWith("/"+t.url))));t&&(this.activeId=t.id)}render(){return q`
+  `,Zt([pe({type:String})],Jt.prototype,"logo",void 0),Zt([pe({type:String})],Jt.prototype,"label",void 0),Zt([pe({type:String,attribute:"home-url"})],Jt.prototype,"homeUrl",void 0),Zt([pe({type:String,reflect:!0})],Jt.prototype,"scheme",void 0),Zt([pe({type:Array})],Jt.prototype,"nav",void 0),Zt([pe({type:Boolean,attribute:"nav-icons-displayed",reflect:!0})],Jt.prototype,"navIconsDisplayed",void 0),Zt([pe({type:Boolean,attribute:"nav-expanded"})],Jt.prototype,"navExpanded",void 0),Zt([pe({type:Object})],Jt.prototype,"user",void 0),Zt([pe({type:Boolean})],Jt.prototype,"subbar",void 0),Zt([pe({type:Boolean,attribute:"nav-enabled"})],Jt.prototype,"navEnabled",void 0),Zt([pe({type:String,attribute:"user-type"})],Jt.prototype,"userType",void 0),Zt([pe({type:Array})],Jt.prototype,"breadcrumbs",void 0),Zt([ue()],Jt.prototype,"isDev",void 0),Zt([ue()],Jt.prototype,"navItemsExpanded",void 0),Zt([ue()],Jt.prototype,"navQuery",void 0),Zt([ue()],Jt.prototype,"activeNavItemId",void 0),Zt([ue()],Jt.prototype,"isNavScrolled",void 0),Zt([ue()],Jt.prototype,"isNavOpened",void 0),Zt([ue()],Jt.prototype,"isEditing",void 0),Zt([ue()],Jt.prototype,"isUserMenuOpen",void 0),Zt([ue()],Jt.prototype,"pref",void 0),Zt([ue()],Jt.prototype,"draggedNavItemId",void 0),Zt([ue()],Jt.prototype,"navItemDropTargetId",void 0),Zt([ue()],Jt.prototype,"navItemDropPosition",void 0),Zt([ue()],Jt.prototype,"pendingRequests",void 0),customElements.get("kr-scaffold")||customElements.define("kr-scaffold",Jt);var Gt=function(e,t,i,s){var n,o=arguments.length,r=o<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,i):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(e,t,i,s);else for(var a=e.length-1;a>=0;a--)(n=e[a])&&(r=(o<3?n(r):o>3?n(t,i,r):n(t,i))||r);return o>3&&r&&Object.defineProperty(t,i,r),r};class ei extends le{constructor(){super(...arguments),this.label="",this.subLabel="",this.items=[],this.activeId="",this.actions=[],this.maxVisibleActions=3,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.items.find((t=>!!t.url&&(t.url.startsWith("/")?e===t.url:e.endsWith("/"+t.url))));t&&(this.activeId=t.id)}handleActionClick(e,t){this.dispatchEvent(new CustomEvent("action-click",{detail:{action:t.id},bubbles:!0,composed:!0}))}handleMoreSelect(e){this.dispatchEvent(new CustomEvent("action-click",{detail:{action:e.detail.id},bubbles:!0,composed:!0}))}render(){const e=this.actions.length>this.maxVisibleActions;let t=this.actions,i=[];return e&&(t=this.actions.slice(0,this.maxVisibleActions-1),i=this.actions.slice(this.maxVisibleActions-1).map((e=>({id:e.id,label:e.label})))),q`
       <nav class="nav">
         ${this.label?q`
           <div class="nav-header">
@@ -4268,6 +4268,31 @@ function ge(e,t){return(t,i,s)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Ref
               `))}
           </div>
         </div>
+        ${this.actions.length?q`
+          <div class="nav-actions">
+            ${t.map((e=>q`
+                <kr-button
+                  class="nav-actions__button"
+                  variant=${e.variant||"outline"}
+                  size="small"
+                  @click=${t=>this.handleActionClick(t,e)}
+                >
+                  ${e.label}
+                </kr-button>
+              `))}
+            ${e?q`
+              <kr-button
+                class="nav-actions__button"
+                variant="outline"
+                size="small"
+                .options=${i}
+                @option-select=${this.handleMoreSelect}
+              >
+                More
+              </kr-button>
+            `:V}
+          </div>
+        `:V}
       </nav>
       <main class="content">
         <div class="content__main">
@@ -4353,6 +4378,19 @@ function ge(e,t){return(t,i,s)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Ref
       font-weight: 700;
     }
 
+    .nav-actions {
+      display: flex;
+      flex-direction: column;
+      gap: 8px;
+      padding: 12px 16px;
+      border-top: 1px solid rgba(0, 0, 0, 0.08);
+      flex-shrink: 0;
+    }
+
+    .nav-actions__button {
+      width: 100%;
+    }
+
     .content {
       flex: 1;
       min-width: 0;
@@ -4364,7 +4402,7 @@ function ge(e,t){return(t,i,s)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Ref
       flex: 1;
       overflow-y: auto;
     }
-  `,Gt([pe({type:String})],ei.prototype,"label",void 0),Gt([pe({type:String})],ei.prototype,"subLabel",void 0),Gt([pe({type:Array})],ei.prototype,"items",void 0),Gt([pe({type:String})],ei.prototype,"activeId",void 0),customElements.get("kr-screen-nav")||customElements.define("kr-screen-nav",ei);var ti=function(e,t,i,s){var n,o=arguments.length,r=o<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,i):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(e,t,i,s);else for(var a=e.length-1;a>=0;a--)(n=e[a])&&(r=(o<3?n(r):o>3?n(t,i,r):n(t,i))||r);return o>3&&r&&Object.defineProperty(t,i,r),r};class ii extends le{constructor(){super(...arguments),this.title=""}render(){return q`
+  `,Gt([pe({type:String})],ei.prototype,"label",void 0),Gt([pe({type:String})],ei.prototype,"subLabel",void 0),Gt([pe({type:Array})],ei.prototype,"items",void 0),Gt([pe({type:String})],ei.prototype,"activeId",void 0),Gt([pe({type:Array})],ei.prototype,"actions",void 0),Gt([pe({type:Number})],ei.prototype,"maxVisibleActions",void 0),customElements.get("kr-screen-nav")||customElements.define("kr-screen-nav",ei);var ti=function(e,t,i,s){var n,o=arguments.length,r=o<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,i):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)r=Reflect.decorate(e,t,i,s);else for(var a=e.length-1;a>=0;a--)(n=e[a])&&(r=(o<3?n(r):o>3?n(t,i,r):n(t,i))||r);return o>3&&r&&Object.defineProperty(t,i,r),r};class ii extends le{constructor(){super(...arguments),this.title=""}render(){return q`
       <div class="header">
         <h2 class="header__title">${this.title}</h2>
         <div class="header__actions">