@lesterarte/sefin-ui 0.0.35 → 0.0.37

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.
Files changed (4) hide show
  1. package/fesm2022/lesterarte-sefin-ui.mjs +136 -28
  2. package/fesm2022/lesterarte-sefin-ui.mjs.map +1 -1
  3. package/package.json +1 -1
  4. package/types/lesterarte-sefin-ui.d.ts +69 -4
package/fesm2022/lesterarte-sefin-ui.mjs CHANGED
@@ -6151,10 +6151,6 @@ class SidebarComponent {
6151
6151
  this.currentRoute = event.urlAfterRedirects;
6152
6152
  // Auto-expand parent items if child is active
6153
6153
  this.updateExpandedStates();
6154
- // Close sidebar on mobile when navigating
6155
- if (this.effectiveIsMobile && this.isOpen) {
6156
- this.handleClose();
6157
- }
6158
6154
  this.cdr.markForCheck();
6159
6155
  }
6160
6156
  });
@@ -6171,10 +6167,6 @@ class SidebarComponent {
6171
6167
  if (this.mediaQuery.addEventListener && !this.mediaQueryHandler) {
6172
6168
  this.mediaQueryHandler = (e) => {
6173
6169
  this._autoDetectedMobile = e.matches;
6174
- // Close sidebar when switching to desktop
6175
- if (!e.matches && this.isOpen) {
6176
- this.handleClose();
6177
- }
6178
6170
  this.cdr.markForCheck();
6179
6171
  };
6180
6172
  this.mediaQuery.addEventListener('change', this.mediaQueryHandler);
@@ -6183,9 +6175,6 @@ class SidebarComponent {
6183
6175
  // Fallback for older browsers
6184
6176
  this.mediaQueryHandler = (e) => {
6185
6177
  this._autoDetectedMobile = e.matches;
6186
- if (!e.matches && this.isOpen) {
6187
- this.handleClose();
6188
- }
6189
6178
  this.cdr.markForCheck();
6190
6179
  };
6191
6180
  this.mediaQuery.addListener(this.mediaQueryHandler);
@@ -6256,17 +6245,6 @@ class SidebarComponent {
6256
6245
  handleClose() {
6257
6246
  this.close.emit();
6258
6247
  }
6259
- handleOverlayClick() {
6260
- if (this.effectiveIsMobile && this.isOpen) {
6261
- this.handleClose();
6262
- }
6263
- }
6264
- handleEscapeKey(event) {
6265
- if (event.key === 'Escape' && this.effectiveIsMobile && this.isOpen) {
6266
- event.preventDefault();
6267
- this.handleClose();
6268
- }
6269
- }
6270
6248
  /**
6271
6249
  * Get SVG icon as SafeHtml based on icon name
6272
6250
  */
@@ -6291,11 +6269,11 @@ class SidebarComponent {
6291
6269
  return this.sanitizer.bypassSecurityTrustHtml(svg);
6292
6270
  }
6293
6271
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SidebarComponent, deps: [{ token: i1$2.Router }, { token: i0.ChangeDetectorRef }, { token: i1$1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
6294
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SidebarComponent, isStandalone: true, selector: "sefin-sidebar", inputs: { navItems: "navItems", isMobile: "isMobile", isOpen: "isOpen", isCollapsed: "isCollapsed", headerTitle: "headerTitle", headerSubtitle: "headerSubtitle", headerIcon: "headerIcon", footerVersion: "footerVersion", showFooter: "showFooter" }, outputs: { toggleCollapse: "toggleCollapse", toggleOpen: "toggleOpen", close: "close" }, host: { listeners: { "document:keydown": "handleEscapeKey($event)" } }, usesOnChanges: true, ngImport: i0, template: "<!-- Overlay for mobile -->\n@if (effectiveIsMobile && isOpen) {\n <div\n class=\"sefin-sidebar__overlay\"\n (click)=\"handleOverlayClick()\"\n [attr.aria-hidden]=\"!isOpen\"\n role=\"presentation\"\n ></div>\n}\n\n<aside\n class=\"sefin-sidebar\"\n [class.sefin-sidebar--mobile]=\"effectiveIsMobile\"\n [class.sefin-sidebar--open]=\"isOpen\"\n [class.sefin-sidebar--collapsed]=\"isCollapsed && !effectiveIsMobile\"\n [attr.aria-hidden]=\"effectiveIsMobile && !isOpen\"\n>\n <div class=\"sefin-sidebar__header\">\n @if (!isCollapsed || effectiveIsMobile) {\n <div class=\"sefin-sidebar__header-content\">\n <div class=\"sefin-sidebar__header-icon-container\">\n <span class=\"sefin-sidebar__header-icon\" [innerHTML]=\"getIconSvg(headerIcon, 24)\"></span>\n </div>\n <div class=\"sefin-sidebar__header-text\">\n <h1 class=\"sefin-sidebar__header-title\">{{ headerTitle }}</h1>\n <span class=\"sefin-sidebar__header-subtitle\">{{ headerSubtitle }}</span>\n </div>\n </div>\n }\n @if (effectiveIsMobile) {\n <button\n type=\"button\"\n class=\"sefin-sidebar__close-button\"\n (click)=\"handleClose()\"\n aria-label=\"Close sidebar\"\n >\n <span class=\"sefin-sidebar__close-icon\" [innerHTML]=\"getIconSvg('x', 20)\"></span>\n </button>\n }\n @if (!effectiveIsMobile) {\n <button\n type=\"button\"\n class=\"sefin-sidebar__toggle\"\n (click)=\"handleToggleCollapse()\"\n [attr.aria-label]=\"isCollapsed ? 'Expand sidebar' : 'Collapse sidebar'\"\n [attr.aria-expanded]=\"!isCollapsed\"\n >\n <span class=\"sefin-sidebar__toggle-icon\" [innerHTML]=\"getIconSvg(isCollapsed ? 'chevron-right' : 'chevron-left', 16)\"></span>\n </button>\n }\n </div>\n\n <nav class=\"sefin-sidebar__nav\">\n <ul class=\"sefin-sidebar__nav-list\">\n @for (item of navItems; track item.label) {\n <li class=\"sefin-sidebar__nav-item\" [class.sefin-sidebar__nav-item--has-children]=\"hasChildren(item)\">\n <!-- Parent item -->\n <button\n type=\"button\"\n class=\"sefin-sidebar__nav-link\"\n [class.sefin-sidebar__nav-link--expandable]=\"hasChildren(item)\"\n [class.sefin-sidebar__nav-link--expanded]=\"item.expanded\"\n [class.sefin-sidebar__nav-link--active]=\"hasActiveChild(item, currentRoute)\"\n [attr.aria-expanded]=\"hasChildren(item) ? item.expanded : null\"\n [attr.aria-label]=\"isCollapsed && !effectiveIsMobile ? item.label : null\"\n (click)=\"hasChildren(item) ? toggleExpand(item) : navigate(item.route || '')\"\n >\n @if (item.icon) {\n <div class=\"sefin-sidebar__nav-icon-wrapper\">\n <span class=\"sefin-sidebar__nav-icon\" [innerHTML]=\"getIconSvg(item.icon, 20)\"></span>\n </div>\n }\n @if (!isCollapsed || effectiveIsMobile) {\n <span class=\"sefin-sidebar__nav-label\">{{ item.label }}</span>\n @if (hasChildren(item)) {\n <div class=\"sefin-sidebar__nav-expand-icon-wrapper\" [class.sefin-sidebar__nav-expand-icon-wrapper--expanded]=\"item.expanded\">\n <span class=\"sefin-sidebar__nav-expand-icon\" [innerHTML]=\"getIconSvg('chevron-down', 16)\"></span>\n </div>\n }\n }\n </button>\n <!-- Children items -->\n @if (hasChildren(item) && item.expanded && (!isCollapsed || effectiveIsMobile)) {\n <ul class=\"sefin-sidebar__nav-sub-list\">\n @for (child of item.children; track child.label) {\n <li class=\"sefin-sidebar__nav-sub-item\" [class.sefin-sidebar__nav-sub-item--has-children]=\"hasChildren(child)\">\n <!-- Level 1: Section headers (non-clickable) -->\n <div class=\"sefin-sidebar__nav-section-header\">\n <span class=\"sefin-sidebar__section-header-text\">{{ child.label }}</span>\n </div>\n <!-- Level 2: Grandchildren items (clickable with bullets) -->\n @if (hasChildren(child)) {\n <ul class=\"sefin-sidebar__nav-sub-sub-list\">\n @for (grandchild of child.children; track grandchild.label) {\n <li class=\"sefin-sidebar__nav-sub-sub-item\">\n <button\n type=\"button\"\n class=\"sefin-sidebar__nav-link sefin-sidebar__nav-link--sub-sub\"\n [class.sefin-sidebar__nav-link--active]=\"isActive(grandchild.route || '')\"\n [attr.aria-current]=\"isActive(grandchild.route || '') ? 'page' : null\"\n (click)=\"navigate(grandchild.route || '')\"\n >\n @if (!isActive(grandchild.route || '')) {\n <div class=\"sefin-sidebar__nav-bullet\"></div>\n }\n <span class=\"sefin-sidebar__nav-label\">{{ grandchild.label }}</span>\n </button>\n </li>\n }\n </ul>\n }\n </li>\n }\n </ul>\n }\n </li>\n }\n </ul>\n </nav>\n \n @if (showFooter) {\n <div class=\"sefin-sidebar__footer\">\n <div class=\"sefin-sidebar__footer-content\">\n <span class=\"sefin-sidebar__footer-text\">{{ footerVersion }}</span>\n </div>\n </div>\n }\n</aside>\n", styles: [".sefin-sidebar{width:288px;min-width:288px;height:100vh;background:#fff;border-right:1px solid #e8e8e8;display:flex;flex-direction:column;position:fixed;left:0;top:0;z-index:100;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);transition:width .3s ease-in-out,transform .3s ease-in-out}.sefin-sidebar__header{padding:var(--sefin-spacing-xl, 1.5rem);border-bottom:1px solid #e8e8e8;display:flex;align-items:center;position:relative;background:linear-gradient(to right,#55c3d8,#4aafc4);min-height:auto}.sefin-sidebar__header .sefin-sidebar__header-content{display:flex;align-items:center;gap:var(--sefin-spacing-md, .75rem);width:100%}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-icon-container{width:40px;height:40px;border-radius:12px;background:#fff3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;flex-shrink:0}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-icon-container .sefin-sidebar__header-icon{color:#fff;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-icon-container .sefin-sidebar__header-icon svg{width:24px;height:24px;color:#fff;fill:none;stroke:currentColor}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text{display:flex;flex-direction:column;gap:0}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text .sefin-sidebar__header-title{color:#fff;font-size:18px;font-weight:700;line-height:1.2;margin:0;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text .sefin-sidebar__header-subtitle{color:#fffc;font-size:12px;line-height:1.2;margin:0;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__header:after{content:\"\";position:absolute;right:-20px;top:50%;transform:translateY(-50%);width:56px;height:56px;z-index:100;pointer-events:none}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__header{padding:var(--sefin-spacing-xl, 1.5rem) var(--sefin-spacing-sm, .5rem);justify-content:center}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__header .sefin-sidebar__header-content{flex-direction:column}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text{display:none}.sefin-sidebar__footer{padding:var(--sefin-spacing-md, 1rem);border-top:1px solid #e8e8e8}.sefin-sidebar__footer .sefin-sidebar__footer-content{background:#f5f5f5;border-radius:8px;padding:var(--sefin-spacing-sm, .75rem);text-align:center}.sefin-sidebar__footer .sefin-sidebar__footer-content .sefin-sidebar__footer-text{color:#828282;font-size:12px;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__toggle{position:absolute;right:-18px;top:50%;transform:translateY(-50%);width:36px;height:36px;border-radius:50%;border:none;background:linear-gradient(135deg,#fff,#f8f9fa);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 8px #0000001a,0 0 0 1px #0000000d,inset 0 1px #ffffffe6;transition:all .3s cubic-bezier(.4,0,.2,1);z-index:101;color:var(--sefin-color-text, #4a5568);padding:0;margin:0;line-height:0}.sefin-sidebar__toggle .sefin-sidebar__toggle-icon{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;flex-shrink:0;transition:transform .3s cubic-bezier(.4,0,.2,1);pointer-events:none}.sefin-sidebar__toggle .sefin-sidebar__toggle-icon svg{width:18px;height:18px;color:currentColor;fill:none;stroke:currentColor;pointer-events:none}.sefin-sidebar__toggle:before{content:\"\";position:absolute;inset:0;border-radius:50%;background:linear-gradient(135deg,rgba(255,255,255,.3) 0%,transparent 50%);pointer-events:none;opacity:.5}.sefin-sidebar__toggle:hover{background:linear-gradient(135deg,#55c3d8,#4db8cc);color:#fff;transform:translateY(-50%) scale(1.08);box-shadow:0 4px 20px #55c3d866,0 0 0 1px #55c3d833,inset 0 1px #ffffff4d}.sefin-sidebar__toggle:hover:before{opacity:.2;background:linear-gradient(135deg,rgba(255,255,255,.4) 0%,transparent 50%)}.sefin-sidebar__toggle:hover .sefin-sidebar__toggle-icon{transform:scale(1.1)}.sefin-sidebar__toggle:active{transform:translateY(-50%) scale(1.02);box-shadow:0 2px 12px #55c3d880,0 0 0 1px #55c3d84d,inset 0 2px 4px #0000001a}.sefin-sidebar__toggle:focus{outline:2px solid var(--sefin-color-primary, #55c3d8);outline-offset:4px;outline-style:solid}.sefin-sidebar--collapsed .sefin-sidebar__toggle{right:-18px}.sefin-sidebar__close-button{position:absolute;right:var(--sefin-spacing-md, 1rem);top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;border:none;background:#fff3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease-in-out;z-index:101;color:#fff;padding:0;margin:0;line-height:0}.sefin-sidebar__close-button .sefin-sidebar__close-icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0;pointer-events:none}.sefin-sidebar__close-button .sefin-sidebar__close-icon svg{width:20px;height:20px;color:currentColor;fill:none;stroke:currentColor;stroke-width:2;pointer-events:none}.sefin-sidebar__close-button:hover{background:#ffffff4d;transform:translateY(-50%) scale(1.05)}.sefin-sidebar__close-button:active{transform:translateY(-50%) scale(.95)}.sefin-sidebar__close-button:focus{outline:2px solid rgba(255,255,255,.5);outline-offset:2px}.sefin-sidebar__nav{flex:1;padding:var(--sefin-spacing-sm, .75rem);overflow:hidden}.sefin-sidebar__nav-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}.sefin-sidebar__nav-item{margin:0}.sefin-sidebar__nav-item.sefin-sidebar__nav-item--has-children{margin-bottom:4px}.sefin-sidebar__nav-link{width:100%;display:flex;align-items:center;gap:var(--sefin-spacing-md, .75rem);padding:var(--sefin-spacing-sm, .75rem) var(--sefin-spacing-md, 1rem);background:none;border:none;outline:none;text-align:left;cursor:pointer;color:#383838;font-size:var(--sefin-font-size-base, 1rem);font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);transition:all .2s ease-in-out;position:relative;border-radius:12px;margin:0;justify-content:flex-start;overflow:hidden;min-width:0;font-weight:500}.sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active){background:#e6f7fb;color:#55c3d8}.sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-label{color:#55c3d8}.sefin-sidebar__nav-link:focus{outline:none}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--active{background:linear-gradient(to right,#55c3d8,#4aafc4);color:#fff;font-weight:500;box-shadow:0 4px 6px #55c3d84d;border:none}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-label{color:#fff}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--expandable{font-weight:500}.sefin-sidebar__nav-icon-wrapper{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:36px;height:36px;border-radius:8px;background:#e6f7fb;transition:all .2s ease-in-out}.sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon{display:flex;align-items:center;justify-content:center;width:20px;height:20px}.sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{width:20px;height:20px;color:#55c3d8;fill:none;stroke:currentColor}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-icon-wrapper{background:#fff3}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{color:#fff;fill:none;stroke:currentColor}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active:hover .sefin-sidebar__nav-icon-wrapper{background:#fff3}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active:hover .sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{color:#fff;fill:none;stroke:currentColor}.sefin-sidebar .sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-icon-wrapper{background:#55c3d8}.sefin-sidebar .sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{color:#fff;fill:none;stroke:currentColor}.sefin-sidebar__nav-expand-icon-wrapper{margin-left:auto;transition:transform .2s ease;display:flex;align-items:center;justify-content:center}.sefin-sidebar__nav-expand-icon-wrapper.sefin-sidebar__nav-expand-icon-wrapper--expanded{transform:rotate(180deg)}.sefin-sidebar__nav-expand-icon-wrapper .sefin-sidebar__nav-expand-icon svg{color:#828282;width:16px;height:16px;fill:none;stroke:currentColor;transition:color .2s ease-in-out}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-expand-icon-wrapper .sefin-sidebar__nav-expand-icon svg{color:#fff}.sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-expand-icon-wrapper .sefin-sidebar__nav-expand-icon svg{color:#55c3d8}.sefin-sidebar__nav-label{flex:1;white-space:normal;word-wrap:break-word;overflow-wrap:break-word;opacity:1;transition:opacity .2s ease;min-width:0;overflow:hidden;display:block;line-height:1.4;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__nav-sub-list{list-style:none;margin:4px 0 8px;padding:0;animation:slideDown .2s ease-out}.sefin-sidebar__nav-sub-item{margin:0 0 2px}.sefin-sidebar__nav-sub-item.sefin-sidebar__nav-sub-item--has-children{margin-bottom:4px}.sefin-sidebar__nav-section-header{padding:var(--sefin-spacing-md, 1rem) var(--sefin-spacing-md, 1rem) var(--sefin-spacing-xs, .5rem) var(--sefin-spacing-md, 1rem)}.sefin-sidebar__nav-section-header .sefin-sidebar__section-header-text{color:#828282;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__nav-sub-sub-list{list-style:none;margin:2px 0 8px;padding:0;animation:slideDown .2s ease-out;display:flex;flex-direction:column;gap:2px}.sefin-sidebar__nav-sub-sub-item{margin:0 0 2px}.sefin-sidebar__nav-link--sub-sub{width:100%;display:flex;align-items:center;gap:var(--sefin-spacing-md, .75rem);padding:var(--sefin-spacing-sm, .75rem) var(--sefin-spacing-md, 1rem);background:none;border:none;outline:none;text-align:left;cursor:pointer;color:#4f4f4f;font-size:var(--sefin-font-size-sm, .875rem);font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);transition:all .2s ease-in-out;position:relative;border-radius:12px;margin:0 var(--sefin-spacing-md, .5rem);justify-content:flex-start;overflow:hidden;min-width:0}.sefin-sidebar__nav-link--sub-sub:hover:not(.sefin-sidebar__nav-link--active){background:#e6f7fb;color:#55c3d8}.sefin-sidebar__nav-link--sub-sub:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-bullet{background:#55c3d8}.sefin-sidebar__nav-link--sub-sub:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-label{color:#55c3d8}.sefin-sidebar__nav-link--sub-sub:focus{outline:none}.sefin-sidebar__nav-link--sub-sub.sefin-sidebar__nav-link--active{background:linear-gradient(to right,#55c3d8,#4aafc4);color:#fff;font-weight:500;box-shadow:0 4px 6px #55c3d84d;border:none}.sefin-sidebar__nav-link--sub-sub.sefin-sidebar__nav-link--active .sefin-sidebar__nav-label{color:#fff}.sefin-sidebar__nav-bullet{width:6px;height:6px;border-radius:50%;background:#cecece;transition:background-color .2s ease-in-out;flex-shrink:0}.sefin-sidebar .sefin-sidebar__nav-link--sub-sub.sefin-sidebar__nav-link--active .sefin-sidebar__nav-bullet{display:none}@keyframes slideDown{0%{opacity:0;max-height:0;overflow:hidden}to{opacity:1;max-height:1000px}}.sefin-sidebar.sefin-sidebar--collapsed{width:80px;min-width:80px}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-link{justify-content:center;padding:var(--sefin-spacing-md, 1rem);border-radius:12px;margin:0}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-label{opacity:0;width:0;overflow:hidden}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-expand-icon,.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-sub-list,.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-sub-sub-list{display:none}.sefin-sidebar.sefin-sidebar--mobile{transform:translate(-100%);z-index:1000}.sefin-sidebar.sefin-sidebar--mobile.sefin-sidebar--open{transform:translate(0)}.sefin-sidebar__overlay{position:fixed;inset:0;background:#00000080;z-index:999;animation:fadeIn .2s ease-in-out;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media(max-width:768px){.sefin-sidebar{display:none}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: RouterModule }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
6272
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SidebarComponent, isStandalone: true, selector: "sefin-sidebar", inputs: { navItems: "navItems", isMobile: "isMobile", isOpen: "isOpen", isCollapsed: "isCollapsed", headerTitle: "headerTitle", headerSubtitle: "headerSubtitle", headerIcon: "headerIcon", footerVersion: "footerVersion", showFooter: "showFooter" }, outputs: { toggleCollapse: "toggleCollapse", toggleOpen: "toggleOpen", close: "close" }, usesOnChanges: true, ngImport: i0, template: "<aside\n class=\"sefin-sidebar\"\n [class.sefin-sidebar--mobile]=\"effectiveIsMobile\"\n [class.sefin-sidebar--collapsed]=\"effectiveIsMobile || isCollapsed\"\n>\n <div class=\"sefin-sidebar__header\">\n @if (!effectiveIsMobile && !isCollapsed) {\n <div class=\"sefin-sidebar__header-content\">\n <div class=\"sefin-sidebar__header-icon-container\">\n <span class=\"sefin-sidebar__header-icon\" [innerHTML]=\"getIconSvg(headerIcon, 24)\"></span>\n </div>\n <div class=\"sefin-sidebar__header-text\">\n <h1 class=\"sefin-sidebar__header-title\">{{ headerTitle }}</h1>\n <span class=\"sefin-sidebar__header-subtitle\">{{ headerSubtitle }}</span>\n </div>\n </div>\n }\n @if (effectiveIsMobile) {\n <div class=\"sefin-sidebar__header-content\">\n <div class=\"sefin-sidebar__header-icon-container\">\n <span class=\"sefin-sidebar__header-icon\" [innerHTML]=\"getIconSvg(headerIcon, 24)\"></span>\n </div>\n </div>\n }\n @if (!effectiveIsMobile) {\n <button\n type=\"button\"\n class=\"sefin-sidebar__toggle\"\n (click)=\"handleToggleCollapse()\"\n [attr.aria-label]=\"isCollapsed ? 'Expand sidebar' : 'Collapse sidebar'\"\n [attr.aria-expanded]=\"!isCollapsed\"\n >\n <span class=\"sefin-sidebar__toggle-icon\" [innerHTML]=\"getIconSvg(isCollapsed ? 'chevron-right' : 'chevron-left', 16)\"></span>\n </button>\n }\n </div>\n\n <nav class=\"sefin-sidebar__nav\">\n <ul class=\"sefin-sidebar__nav-list\">\n @for (item of navItems; track item.label) {\n <li class=\"sefin-sidebar__nav-item\" [class.sefin-sidebar__nav-item--has-children]=\"hasChildren(item)\">\n <!-- Parent item -->\n <button\n type=\"button\"\n class=\"sefin-sidebar__nav-link\"\n [class.sefin-sidebar__nav-link--expandable]=\"hasChildren(item)\"\n [class.sefin-sidebar__nav-link--expanded]=\"item.expanded\"\n [class.sefin-sidebar__nav-link--active]=\"hasActiveChild(item, currentRoute)\"\n [attr.aria-expanded]=\"hasChildren(item) ? item.expanded : null\"\n [attr.aria-label]=\"(effectiveIsMobile || isCollapsed) ? item.label : null\"\n (click)=\"hasChildren(item) ? toggleExpand(item) : navigate(item.route || '')\"\n >\n @if (item.icon) {\n <div class=\"sefin-sidebar__nav-icon-wrapper\">\n <span class=\"sefin-sidebar__nav-icon\" [innerHTML]=\"getIconSvg(item.icon, 20)\"></span>\n </div>\n }\n @if (!effectiveIsMobile && !isCollapsed) {\n <span class=\"sefin-sidebar__nav-label\">{{ item.label }}</span>\n @if (hasChildren(item)) {\n <div class=\"sefin-sidebar__nav-expand-icon-wrapper\" [class.sefin-sidebar__nav-expand-icon-wrapper--expanded]=\"item.expanded\">\n <span class=\"sefin-sidebar__nav-expand-icon\" [innerHTML]=\"getIconSvg('chevron-down', 16)\"></span>\n </div>\n }\n }\n </button>\n <!-- Children items -->\n @if (hasChildren(item) && item.expanded && !effectiveIsMobile && !isCollapsed) {\n <ul class=\"sefin-sidebar__nav-sub-list\">\n @for (child of item.children; track child.label) {\n <li class=\"sefin-sidebar__nav-sub-item\" [class.sefin-sidebar__nav-sub-item--has-children]=\"hasChildren(child)\">\n <!-- Level 1: Section headers (non-clickable) -->\n <div class=\"sefin-sidebar__nav-section-header\">\n <span class=\"sefin-sidebar__section-header-text\">{{ child.label }}</span>\n </div>\n <!-- Level 2: Grandchildren items (clickable with bullets) -->\n @if (hasChildren(child)) {\n <ul class=\"sefin-sidebar__nav-sub-sub-list\">\n @for (grandchild of child.children; track grandchild.label) {\n <li class=\"sefin-sidebar__nav-sub-sub-item\">\n <button\n type=\"button\"\n class=\"sefin-sidebar__nav-link sefin-sidebar__nav-link--sub-sub\"\n [class.sefin-sidebar__nav-link--active]=\"isActive(grandchild.route || '')\"\n [attr.aria-current]=\"isActive(grandchild.route || '') ? 'page' : null\"\n (click)=\"navigate(grandchild.route || '')\"\n >\n @if (!isActive(grandchild.route || '')) {\n <div class=\"sefin-sidebar__nav-bullet\"></div>\n }\n <span class=\"sefin-sidebar__nav-label\">{{ grandchild.label }}</span>\n </button>\n </li>\n }\n </ul>\n }\n </li>\n }\n </ul>\n }\n </li>\n }\n </ul>\n </nav>\n \n @if (showFooter) {\n <div class=\"sefin-sidebar__footer\">\n <div class=\"sefin-sidebar__footer-content\">\n <span class=\"sefin-sidebar__footer-text\">{{ footerVersion }}</span>\n </div>\n </div>\n }\n</aside>\n", styles: [".sefin-sidebar{width:288px;min-width:288px;height:100vh;background:#fff;border-right:1px solid #e8e8e8;display:flex;flex-direction:column;position:fixed;left:0;top:0;z-index:100;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);transition:width .3s ease-in-out,transform .3s ease-in-out}.sefin-sidebar__header{padding:var(--sefin-spacing-xl, 1.5rem);border-bottom:1px solid #e8e8e8;display:flex;align-items:center;position:relative;background:linear-gradient(to right,#55c3d8,#4aafc4);min-height:auto}.sefin-sidebar__header .sefin-sidebar__header-content{display:flex;align-items:center;gap:var(--sefin-spacing-md, .75rem);width:100%}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-icon-container{width:40px;height:40px;border-radius:12px;background:#fff3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;flex-shrink:0}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-icon-container .sefin-sidebar__header-icon{color:#fff;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-icon-container .sefin-sidebar__header-icon svg{width:24px;height:24px;color:#fff;fill:none;stroke:currentColor}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text{display:flex;flex-direction:column;gap:0}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text .sefin-sidebar__header-title{color:#fff;font-size:18px;font-weight:700;line-height:1.2;margin:0;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text .sefin-sidebar__header-subtitle{color:#fffc;font-size:12px;line-height:1.2;margin:0;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__header:after{content:\"\";position:absolute;right:-20px;top:50%;transform:translateY(-50%);width:56px;height:56px;z-index:100;pointer-events:none}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__header{padding:var(--sefin-spacing-xl, 1.5rem) var(--sefin-spacing-sm, .5rem);justify-content:center}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__header .sefin-sidebar__header-content{flex-direction:column}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text{display:none}.sefin-sidebar__footer{padding:var(--sefin-spacing-md, 1rem);border-top:1px solid #e8e8e8}.sefin-sidebar__footer .sefin-sidebar__footer-content{background:#f5f5f5;border-radius:8px;padding:var(--sefin-spacing-sm, .75rem);text-align:center}.sefin-sidebar__footer .sefin-sidebar__footer-content .sefin-sidebar__footer-text{color:#828282;font-size:12px;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__toggle{position:absolute;right:-18px;top:50%;transform:translateY(-50%);width:36px;height:36px;border-radius:50%;border:none;background:linear-gradient(135deg,#fff,#f8f9fa);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 8px #0000001a,0 0 0 1px #0000000d,inset 0 1px #ffffffe6;transition:all .3s cubic-bezier(.4,0,.2,1);z-index:101;color:var(--sefin-color-text, #4a5568);padding:0;margin:0;line-height:0}.sefin-sidebar__toggle .sefin-sidebar__toggle-icon{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;flex-shrink:0;transition:transform .3s cubic-bezier(.4,0,.2,1);pointer-events:none}.sefin-sidebar__toggle .sefin-sidebar__toggle-icon svg{width:18px;height:18px;color:currentColor;fill:none;stroke:currentColor;pointer-events:none}.sefin-sidebar__toggle:before{content:\"\";position:absolute;inset:0;border-radius:50%;background:linear-gradient(135deg,rgba(255,255,255,.3) 0%,transparent 50%);pointer-events:none;opacity:.5}.sefin-sidebar__toggle:hover{background:linear-gradient(135deg,#55c3d8,#4db8cc);color:#fff;transform:translateY(-50%) scale(1.08);box-shadow:0 4px 20px #55c3d866,0 0 0 1px #55c3d833,inset 0 1px #ffffff4d}.sefin-sidebar__toggle:hover:before{opacity:.2;background:linear-gradient(135deg,rgba(255,255,255,.4) 0%,transparent 50%)}.sefin-sidebar__toggle:hover .sefin-sidebar__toggle-icon{transform:scale(1.1)}.sefin-sidebar__toggle:active{transform:translateY(-50%) scale(1.02);box-shadow:0 2px 12px #55c3d880,0 0 0 1px #55c3d84d,inset 0 2px 4px #0000001a}.sefin-sidebar__toggle:focus{outline:2px solid var(--sefin-color-primary, #55c3d8);outline-offset:4px;outline-style:solid}.sefin-sidebar--collapsed .sefin-sidebar__toggle{right:-18px}.sefin-sidebar__close-button{position:absolute;right:var(--sefin-spacing-md, 1rem);top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;border:none;background:#fff3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease-in-out;z-index:101;color:#fff;padding:0;margin:0;line-height:0}.sefin-sidebar__close-button .sefin-sidebar__close-icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0;pointer-events:none}.sefin-sidebar__close-button .sefin-sidebar__close-icon svg{width:20px;height:20px;color:currentColor;fill:none;stroke:currentColor;stroke-width:2;pointer-events:none}.sefin-sidebar__close-button:hover{background:#ffffff4d;transform:translateY(-50%) scale(1.05)}.sefin-sidebar__close-button:active{transform:translateY(-50%) scale(.95)}.sefin-sidebar__close-button:focus{outline:2px solid rgba(255,255,255,.5);outline-offset:2px}.sefin-sidebar__nav{flex:1;padding:var(--sefin-spacing-sm, .75rem);overflow:hidden}.sefin-sidebar__nav-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}.sefin-sidebar__nav-item{margin:0}.sefin-sidebar__nav-item.sefin-sidebar__nav-item--has-children{margin-bottom:4px}.sefin-sidebar__nav-link{width:100%;display:flex;align-items:center;gap:var(--sefin-spacing-md, .75rem);padding:var(--sefin-spacing-sm, .75rem) var(--sefin-spacing-md, 1rem);background:none;border:none;outline:none;text-align:left;cursor:pointer;color:#383838;font-size:var(--sefin-font-size-base, 1rem);font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);transition:all .2s ease-in-out;position:relative;border-radius:12px;margin:0;justify-content:flex-start;overflow:hidden;min-width:0;font-weight:500}.sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active){background:#e6f7fb;color:#55c3d8}.sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-label{color:#55c3d8}.sefin-sidebar__nav-link:focus{outline:none}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--active{background:linear-gradient(to right,#55c3d8,#4aafc4);color:#fff;font-weight:500;box-shadow:0 4px 6px #55c3d84d;border:none}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-label{color:#fff}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--expandable{font-weight:500}.sefin-sidebar__nav-icon-wrapper{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:36px;height:36px;border-radius:8px;background:#e6f7fb;transition:all .2s ease-in-out}.sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon{display:flex;align-items:center;justify-content:center;width:20px;height:20px}.sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{width:20px;height:20px;color:#55c3d8;fill:none;stroke:currentColor}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-icon-wrapper{background:#fff3}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{color:#fff;fill:none;stroke:currentColor}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active:hover .sefin-sidebar__nav-icon-wrapper{background:#fff3}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active:hover .sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{color:#fff;fill:none;stroke:currentColor}.sefin-sidebar .sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-icon-wrapper{background:#55c3d8}.sefin-sidebar .sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{color:#fff;fill:none;stroke:currentColor}.sefin-sidebar__nav-expand-icon-wrapper{margin-left:auto;transition:transform .2s ease;display:flex;align-items:center;justify-content:center}.sefin-sidebar__nav-expand-icon-wrapper.sefin-sidebar__nav-expand-icon-wrapper--expanded{transform:rotate(180deg)}.sefin-sidebar__nav-expand-icon-wrapper .sefin-sidebar__nav-expand-icon svg{color:#828282;width:16px;height:16px;fill:none;stroke:currentColor;transition:color .2s ease-in-out}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-expand-icon-wrapper .sefin-sidebar__nav-expand-icon svg{color:#fff}.sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-expand-icon-wrapper .sefin-sidebar__nav-expand-icon svg{color:#55c3d8}.sefin-sidebar__nav-label{flex:1;white-space:normal;word-wrap:break-word;overflow-wrap:break-word;opacity:1;transition:opacity .2s ease;min-width:0;overflow:hidden;display:block;line-height:1.4;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__nav-sub-list{list-style:none;margin:4px 0 8px;padding:0;animation:slideDown .2s ease-out}.sefin-sidebar__nav-sub-item{margin:0 0 2px}.sefin-sidebar__nav-sub-item.sefin-sidebar__nav-sub-item--has-children{margin-bottom:4px}.sefin-sidebar__nav-section-header{padding:var(--sefin-spacing-md, 1rem) var(--sefin-spacing-md, 1rem) var(--sefin-spacing-xs, .5rem) var(--sefin-spacing-md, 1rem)}.sefin-sidebar__nav-section-header .sefin-sidebar__section-header-text{color:#828282;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__nav-sub-sub-list{list-style:none;margin:2px 0 8px;padding:0;animation:slideDown .2s ease-out;display:flex;flex-direction:column;gap:2px}.sefin-sidebar__nav-sub-sub-item{margin:0 0 2px}.sefin-sidebar__nav-link--sub-sub{width:100%;display:flex;align-items:center;gap:var(--sefin-spacing-md, .75rem);padding:var(--sefin-spacing-sm, .75rem) var(--sefin-spacing-md, 1rem);background:none;border:none;outline:none;text-align:left;cursor:pointer;color:#4f4f4f;font-size:var(--sefin-font-size-sm, .875rem);font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);transition:all .2s ease-in-out;position:relative;border-radius:12px;margin:0 var(--sefin-spacing-md, .5rem);justify-content:flex-start;overflow:hidden;min-width:0}.sefin-sidebar__nav-link--sub-sub:hover:not(.sefin-sidebar__nav-link--active){background:#e6f7fb;color:#55c3d8}.sefin-sidebar__nav-link--sub-sub:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-bullet{background:#55c3d8}.sefin-sidebar__nav-link--sub-sub:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-label{color:#55c3d8}.sefin-sidebar__nav-link--sub-sub:focus{outline:none}.sefin-sidebar__nav-link--sub-sub.sefin-sidebar__nav-link--active{background:linear-gradient(to right,#55c3d8,#4aafc4);color:#fff;font-weight:500;box-shadow:0 4px 6px #55c3d84d;border:none}.sefin-sidebar__nav-link--sub-sub.sefin-sidebar__nav-link--active .sefin-sidebar__nav-label{color:#fff}.sefin-sidebar__nav-bullet{width:6px;height:6px;border-radius:50%;background:#cecece;transition:background-color .2s ease-in-out;flex-shrink:0}.sefin-sidebar .sefin-sidebar__nav-link--sub-sub.sefin-sidebar__nav-link--active .sefin-sidebar__nav-bullet{display:none}@keyframes slideDown{0%{opacity:0;max-height:0;overflow:hidden}to{opacity:1;max-height:1000px}}.sefin-sidebar.sefin-sidebar--collapsed{width:80px;min-width:80px}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-link{justify-content:center;padding:var(--sefin-spacing-md, 1rem);border-radius:12px;margin:0}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-label{opacity:0;width:0;overflow:hidden}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-expand-icon,.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-sub-list,.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-sub-sub-list{display:none}.sefin-sidebar.sefin-sidebar--mobile .sefin-sidebar__header{padding:var(--sefin-spacing-xl, 1.5rem) var(--sefin-spacing-sm, .5rem);justify-content:center}.sefin-sidebar.sefin-sidebar--mobile .sefin-sidebar__header .sefin-sidebar__header-content{flex-direction:column}.sefin-sidebar.sefin-sidebar--mobile .sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text{display:none}.sefin-sidebar.sefin-sidebar--mobile{transform:translate(0);z-index:1000;width:80px;min-width:80px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: RouterModule }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
6295
6273
  }
6296
6274
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SidebarComponent, decorators: [{
6297
6275
  type: Component,
6298
- args: [{ selector: 'sefin-sidebar', standalone: true, imports: [CommonModule, RouterModule], changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, template: "<!-- Overlay for mobile -->\n@if (effectiveIsMobile && isOpen) {\n <div\n class=\"sefin-sidebar__overlay\"\n (click)=\"handleOverlayClick()\"\n [attr.aria-hidden]=\"!isOpen\"\n role=\"presentation\"\n ></div>\n}\n\n<aside\n class=\"sefin-sidebar\"\n [class.sefin-sidebar--mobile]=\"effectiveIsMobile\"\n [class.sefin-sidebar--open]=\"isOpen\"\n [class.sefin-sidebar--collapsed]=\"isCollapsed && !effectiveIsMobile\"\n [attr.aria-hidden]=\"effectiveIsMobile && !isOpen\"\n>\n <div class=\"sefin-sidebar__header\">\n @if (!isCollapsed || effectiveIsMobile) {\n <div class=\"sefin-sidebar__header-content\">\n <div class=\"sefin-sidebar__header-icon-container\">\n <span class=\"sefin-sidebar__header-icon\" [innerHTML]=\"getIconSvg(headerIcon, 24)\"></span>\n </div>\n <div class=\"sefin-sidebar__header-text\">\n <h1 class=\"sefin-sidebar__header-title\">{{ headerTitle }}</h1>\n <span class=\"sefin-sidebar__header-subtitle\">{{ headerSubtitle }}</span>\n </div>\n </div>\n }\n @if (effectiveIsMobile) {\n <button\n type=\"button\"\n class=\"sefin-sidebar__close-button\"\n (click)=\"handleClose()\"\n aria-label=\"Close sidebar\"\n >\n <span class=\"sefin-sidebar__close-icon\" [innerHTML]=\"getIconSvg('x', 20)\"></span>\n </button>\n }\n @if (!effectiveIsMobile) {\n <button\n type=\"button\"\n class=\"sefin-sidebar__toggle\"\n (click)=\"handleToggleCollapse()\"\n [attr.aria-label]=\"isCollapsed ? 'Expand sidebar' : 'Collapse sidebar'\"\n [attr.aria-expanded]=\"!isCollapsed\"\n >\n <span class=\"sefin-sidebar__toggle-icon\" [innerHTML]=\"getIconSvg(isCollapsed ? 'chevron-right' : 'chevron-left', 16)\"></span>\n </button>\n }\n </div>\n\n <nav class=\"sefin-sidebar__nav\">\n <ul class=\"sefin-sidebar__nav-list\">\n @for (item of navItems; track item.label) {\n <li class=\"sefin-sidebar__nav-item\" [class.sefin-sidebar__nav-item--has-children]=\"hasChildren(item)\">\n <!-- Parent item -->\n <button\n type=\"button\"\n class=\"sefin-sidebar__nav-link\"\n [class.sefin-sidebar__nav-link--expandable]=\"hasChildren(item)\"\n [class.sefin-sidebar__nav-link--expanded]=\"item.expanded\"\n [class.sefin-sidebar__nav-link--active]=\"hasActiveChild(item, currentRoute)\"\n [attr.aria-expanded]=\"hasChildren(item) ? item.expanded : null\"\n [attr.aria-label]=\"isCollapsed && !effectiveIsMobile ? item.label : null\"\n (click)=\"hasChildren(item) ? toggleExpand(item) : navigate(item.route || '')\"\n >\n @if (item.icon) {\n <div class=\"sefin-sidebar__nav-icon-wrapper\">\n <span class=\"sefin-sidebar__nav-icon\" [innerHTML]=\"getIconSvg(item.icon, 20)\"></span>\n </div>\n }\n @if (!isCollapsed || effectiveIsMobile) {\n <span class=\"sefin-sidebar__nav-label\">{{ item.label }}</span>\n @if (hasChildren(item)) {\n <div class=\"sefin-sidebar__nav-expand-icon-wrapper\" [class.sefin-sidebar__nav-expand-icon-wrapper--expanded]=\"item.expanded\">\n <span class=\"sefin-sidebar__nav-expand-icon\" [innerHTML]=\"getIconSvg('chevron-down', 16)\"></span>\n </div>\n }\n }\n </button>\n <!-- Children items -->\n @if (hasChildren(item) && item.expanded && (!isCollapsed || effectiveIsMobile)) {\n <ul class=\"sefin-sidebar__nav-sub-list\">\n @for (child of item.children; track child.label) {\n <li class=\"sefin-sidebar__nav-sub-item\" [class.sefin-sidebar__nav-sub-item--has-children]=\"hasChildren(child)\">\n <!-- Level 1: Section headers (non-clickable) -->\n <div class=\"sefin-sidebar__nav-section-header\">\n <span class=\"sefin-sidebar__section-header-text\">{{ child.label }}</span>\n </div>\n <!-- Level 2: Grandchildren items (clickable with bullets) -->\n @if (hasChildren(child)) {\n <ul class=\"sefin-sidebar__nav-sub-sub-list\">\n @for (grandchild of child.children; track grandchild.label) {\n <li class=\"sefin-sidebar__nav-sub-sub-item\">\n <button\n type=\"button\"\n class=\"sefin-sidebar__nav-link sefin-sidebar__nav-link--sub-sub\"\n [class.sefin-sidebar__nav-link--active]=\"isActive(grandchild.route || '')\"\n [attr.aria-current]=\"isActive(grandchild.route || '') ? 'page' : null\"\n (click)=\"navigate(grandchild.route || '')\"\n >\n @if (!isActive(grandchild.route || '')) {\n <div class=\"sefin-sidebar__nav-bullet\"></div>\n }\n <span class=\"sefin-sidebar__nav-label\">{{ grandchild.label }}</span>\n </button>\n </li>\n }\n </ul>\n }\n </li>\n }\n </ul>\n }\n </li>\n }\n </ul>\n </nav>\n \n @if (showFooter) {\n <div class=\"sefin-sidebar__footer\">\n <div class=\"sefin-sidebar__footer-content\">\n <span class=\"sefin-sidebar__footer-text\">{{ footerVersion }}</span>\n </div>\n </div>\n }\n</aside>\n", styles: [".sefin-sidebar{width:288px;min-width:288px;height:100vh;background:#fff;border-right:1px solid #e8e8e8;display:flex;flex-direction:column;position:fixed;left:0;top:0;z-index:100;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);transition:width .3s ease-in-out,transform .3s ease-in-out}.sefin-sidebar__header{padding:var(--sefin-spacing-xl, 1.5rem);border-bottom:1px solid #e8e8e8;display:flex;align-items:center;position:relative;background:linear-gradient(to right,#55c3d8,#4aafc4);min-height:auto}.sefin-sidebar__header .sefin-sidebar__header-content{display:flex;align-items:center;gap:var(--sefin-spacing-md, .75rem);width:100%}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-icon-container{width:40px;height:40px;border-radius:12px;background:#fff3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;flex-shrink:0}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-icon-container .sefin-sidebar__header-icon{color:#fff;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-icon-container .sefin-sidebar__header-icon svg{width:24px;height:24px;color:#fff;fill:none;stroke:currentColor}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text{display:flex;flex-direction:column;gap:0}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text .sefin-sidebar__header-title{color:#fff;font-size:18px;font-weight:700;line-height:1.2;margin:0;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text .sefin-sidebar__header-subtitle{color:#fffc;font-size:12px;line-height:1.2;margin:0;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__header:after{content:\"\";position:absolute;right:-20px;top:50%;transform:translateY(-50%);width:56px;height:56px;z-index:100;pointer-events:none}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__header{padding:var(--sefin-spacing-xl, 1.5rem) var(--sefin-spacing-sm, .5rem);justify-content:center}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__header .sefin-sidebar__header-content{flex-direction:column}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text{display:none}.sefin-sidebar__footer{padding:var(--sefin-spacing-md, 1rem);border-top:1px solid #e8e8e8}.sefin-sidebar__footer .sefin-sidebar__footer-content{background:#f5f5f5;border-radius:8px;padding:var(--sefin-spacing-sm, .75rem);text-align:center}.sefin-sidebar__footer .sefin-sidebar__footer-content .sefin-sidebar__footer-text{color:#828282;font-size:12px;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__toggle{position:absolute;right:-18px;top:50%;transform:translateY(-50%);width:36px;height:36px;border-radius:50%;border:none;background:linear-gradient(135deg,#fff,#f8f9fa);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 8px #0000001a,0 0 0 1px #0000000d,inset 0 1px #ffffffe6;transition:all .3s cubic-bezier(.4,0,.2,1);z-index:101;color:var(--sefin-color-text, #4a5568);padding:0;margin:0;line-height:0}.sefin-sidebar__toggle .sefin-sidebar__toggle-icon{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;flex-shrink:0;transition:transform .3s cubic-bezier(.4,0,.2,1);pointer-events:none}.sefin-sidebar__toggle .sefin-sidebar__toggle-icon svg{width:18px;height:18px;color:currentColor;fill:none;stroke:currentColor;pointer-events:none}.sefin-sidebar__toggle:before{content:\"\";position:absolute;inset:0;border-radius:50%;background:linear-gradient(135deg,rgba(255,255,255,.3) 0%,transparent 50%);pointer-events:none;opacity:.5}.sefin-sidebar__toggle:hover{background:linear-gradient(135deg,#55c3d8,#4db8cc);color:#fff;transform:translateY(-50%) scale(1.08);box-shadow:0 4px 20px #55c3d866,0 0 0 1px #55c3d833,inset 0 1px #ffffff4d}.sefin-sidebar__toggle:hover:before{opacity:.2;background:linear-gradient(135deg,rgba(255,255,255,.4) 0%,transparent 50%)}.sefin-sidebar__toggle:hover .sefin-sidebar__toggle-icon{transform:scale(1.1)}.sefin-sidebar__toggle:active{transform:translateY(-50%) scale(1.02);box-shadow:0 2px 12px #55c3d880,0 0 0 1px #55c3d84d,inset 0 2px 4px #0000001a}.sefin-sidebar__toggle:focus{outline:2px solid var(--sefin-color-primary, #55c3d8);outline-offset:4px;outline-style:solid}.sefin-sidebar--collapsed .sefin-sidebar__toggle{right:-18px}.sefin-sidebar__close-button{position:absolute;right:var(--sefin-spacing-md, 1rem);top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;border:none;background:#fff3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease-in-out;z-index:101;color:#fff;padding:0;margin:0;line-height:0}.sefin-sidebar__close-button .sefin-sidebar__close-icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0;pointer-events:none}.sefin-sidebar__close-button .sefin-sidebar__close-icon svg{width:20px;height:20px;color:currentColor;fill:none;stroke:currentColor;stroke-width:2;pointer-events:none}.sefin-sidebar__close-button:hover{background:#ffffff4d;transform:translateY(-50%) scale(1.05)}.sefin-sidebar__close-button:active{transform:translateY(-50%) scale(.95)}.sefin-sidebar__close-button:focus{outline:2px solid rgba(255,255,255,.5);outline-offset:2px}.sefin-sidebar__nav{flex:1;padding:var(--sefin-spacing-sm, .75rem);overflow:hidden}.sefin-sidebar__nav-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}.sefin-sidebar__nav-item{margin:0}.sefin-sidebar__nav-item.sefin-sidebar__nav-item--has-children{margin-bottom:4px}.sefin-sidebar__nav-link{width:100%;display:flex;align-items:center;gap:var(--sefin-spacing-md, .75rem);padding:var(--sefin-spacing-sm, .75rem) var(--sefin-spacing-md, 1rem);background:none;border:none;outline:none;text-align:left;cursor:pointer;color:#383838;font-size:var(--sefin-font-size-base, 1rem);font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);transition:all .2s ease-in-out;position:relative;border-radius:12px;margin:0;justify-content:flex-start;overflow:hidden;min-width:0;font-weight:500}.sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active){background:#e6f7fb;color:#55c3d8}.sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-label{color:#55c3d8}.sefin-sidebar__nav-link:focus{outline:none}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--active{background:linear-gradient(to right,#55c3d8,#4aafc4);color:#fff;font-weight:500;box-shadow:0 4px 6px #55c3d84d;border:none}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-label{color:#fff}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--expandable{font-weight:500}.sefin-sidebar__nav-icon-wrapper{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:36px;height:36px;border-radius:8px;background:#e6f7fb;transition:all .2s ease-in-out}.sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon{display:flex;align-items:center;justify-content:center;width:20px;height:20px}.sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{width:20px;height:20px;color:#55c3d8;fill:none;stroke:currentColor}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-icon-wrapper{background:#fff3}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{color:#fff;fill:none;stroke:currentColor}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active:hover .sefin-sidebar__nav-icon-wrapper{background:#fff3}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active:hover .sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{color:#fff;fill:none;stroke:currentColor}.sefin-sidebar .sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-icon-wrapper{background:#55c3d8}.sefin-sidebar .sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{color:#fff;fill:none;stroke:currentColor}.sefin-sidebar__nav-expand-icon-wrapper{margin-left:auto;transition:transform .2s ease;display:flex;align-items:center;justify-content:center}.sefin-sidebar__nav-expand-icon-wrapper.sefin-sidebar__nav-expand-icon-wrapper--expanded{transform:rotate(180deg)}.sefin-sidebar__nav-expand-icon-wrapper .sefin-sidebar__nav-expand-icon svg{color:#828282;width:16px;height:16px;fill:none;stroke:currentColor;transition:color .2s ease-in-out}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-expand-icon-wrapper .sefin-sidebar__nav-expand-icon svg{color:#fff}.sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-expand-icon-wrapper .sefin-sidebar__nav-expand-icon svg{color:#55c3d8}.sefin-sidebar__nav-label{flex:1;white-space:normal;word-wrap:break-word;overflow-wrap:break-word;opacity:1;transition:opacity .2s ease;min-width:0;overflow:hidden;display:block;line-height:1.4;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__nav-sub-list{list-style:none;margin:4px 0 8px;padding:0;animation:slideDown .2s ease-out}.sefin-sidebar__nav-sub-item{margin:0 0 2px}.sefin-sidebar__nav-sub-item.sefin-sidebar__nav-sub-item--has-children{margin-bottom:4px}.sefin-sidebar__nav-section-header{padding:var(--sefin-spacing-md, 1rem) var(--sefin-spacing-md, 1rem) var(--sefin-spacing-xs, .5rem) var(--sefin-spacing-md, 1rem)}.sefin-sidebar__nav-section-header .sefin-sidebar__section-header-text{color:#828282;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__nav-sub-sub-list{list-style:none;margin:2px 0 8px;padding:0;animation:slideDown .2s ease-out;display:flex;flex-direction:column;gap:2px}.sefin-sidebar__nav-sub-sub-item{margin:0 0 2px}.sefin-sidebar__nav-link--sub-sub{width:100%;display:flex;align-items:center;gap:var(--sefin-spacing-md, .75rem);padding:var(--sefin-spacing-sm, .75rem) var(--sefin-spacing-md, 1rem);background:none;border:none;outline:none;text-align:left;cursor:pointer;color:#4f4f4f;font-size:var(--sefin-font-size-sm, .875rem);font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);transition:all .2s ease-in-out;position:relative;border-radius:12px;margin:0 var(--sefin-spacing-md, .5rem);justify-content:flex-start;overflow:hidden;min-width:0}.sefin-sidebar__nav-link--sub-sub:hover:not(.sefin-sidebar__nav-link--active){background:#e6f7fb;color:#55c3d8}.sefin-sidebar__nav-link--sub-sub:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-bullet{background:#55c3d8}.sefin-sidebar__nav-link--sub-sub:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-label{color:#55c3d8}.sefin-sidebar__nav-link--sub-sub:focus{outline:none}.sefin-sidebar__nav-link--sub-sub.sefin-sidebar__nav-link--active{background:linear-gradient(to right,#55c3d8,#4aafc4);color:#fff;font-weight:500;box-shadow:0 4px 6px #55c3d84d;border:none}.sefin-sidebar__nav-link--sub-sub.sefin-sidebar__nav-link--active .sefin-sidebar__nav-label{color:#fff}.sefin-sidebar__nav-bullet{width:6px;height:6px;border-radius:50%;background:#cecece;transition:background-color .2s ease-in-out;flex-shrink:0}.sefin-sidebar .sefin-sidebar__nav-link--sub-sub.sefin-sidebar__nav-link--active .sefin-sidebar__nav-bullet{display:none}@keyframes slideDown{0%{opacity:0;max-height:0;overflow:hidden}to{opacity:1;max-height:1000px}}.sefin-sidebar.sefin-sidebar--collapsed{width:80px;min-width:80px}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-link{justify-content:center;padding:var(--sefin-spacing-md, 1rem);border-radius:12px;margin:0}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-label{opacity:0;width:0;overflow:hidden}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-expand-icon,.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-sub-list,.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-sub-sub-list{display:none}.sefin-sidebar.sefin-sidebar--mobile{transform:translate(-100%);z-index:1000}.sefin-sidebar.sefin-sidebar--mobile.sefin-sidebar--open{transform:translate(0)}.sefin-sidebar__overlay{position:fixed;inset:0;background:#00000080;z-index:999;animation:fadeIn .2s ease-in-out;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@media(max-width:768px){.sefin-sidebar{display:none}}\n"] }]
6276
+ args: [{ selector: 'sefin-sidebar', standalone: true, imports: [CommonModule, RouterModule], changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, template: "<aside\n class=\"sefin-sidebar\"\n [class.sefin-sidebar--mobile]=\"effectiveIsMobile\"\n [class.sefin-sidebar--collapsed]=\"effectiveIsMobile || isCollapsed\"\n>\n <div class=\"sefin-sidebar__header\">\n @if (!effectiveIsMobile && !isCollapsed) {\n <div class=\"sefin-sidebar__header-content\">\n <div class=\"sefin-sidebar__header-icon-container\">\n <span class=\"sefin-sidebar__header-icon\" [innerHTML]=\"getIconSvg(headerIcon, 24)\"></span>\n </div>\n <div class=\"sefin-sidebar__header-text\">\n <h1 class=\"sefin-sidebar__header-title\">{{ headerTitle }}</h1>\n <span class=\"sefin-sidebar__header-subtitle\">{{ headerSubtitle }}</span>\n </div>\n </div>\n }\n @if (effectiveIsMobile) {\n <div class=\"sefin-sidebar__header-content\">\n <div class=\"sefin-sidebar__header-icon-container\">\n <span class=\"sefin-sidebar__header-icon\" [innerHTML]=\"getIconSvg(headerIcon, 24)\"></span>\n </div>\n </div>\n }\n @if (!effectiveIsMobile) {\n <button\n type=\"button\"\n class=\"sefin-sidebar__toggle\"\n (click)=\"handleToggleCollapse()\"\n [attr.aria-label]=\"isCollapsed ? 'Expand sidebar' : 'Collapse sidebar'\"\n [attr.aria-expanded]=\"!isCollapsed\"\n >\n <span class=\"sefin-sidebar__toggle-icon\" [innerHTML]=\"getIconSvg(isCollapsed ? 'chevron-right' : 'chevron-left', 16)\"></span>\n </button>\n }\n </div>\n\n <nav class=\"sefin-sidebar__nav\">\n <ul class=\"sefin-sidebar__nav-list\">\n @for (item of navItems; track item.label) {\n <li class=\"sefin-sidebar__nav-item\" [class.sefin-sidebar__nav-item--has-children]=\"hasChildren(item)\">\n <!-- Parent item -->\n <button\n type=\"button\"\n class=\"sefin-sidebar__nav-link\"\n [class.sefin-sidebar__nav-link--expandable]=\"hasChildren(item)\"\n [class.sefin-sidebar__nav-link--expanded]=\"item.expanded\"\n [class.sefin-sidebar__nav-link--active]=\"hasActiveChild(item, currentRoute)\"\n [attr.aria-expanded]=\"hasChildren(item) ? item.expanded : null\"\n [attr.aria-label]=\"(effectiveIsMobile || isCollapsed) ? item.label : null\"\n (click)=\"hasChildren(item) ? toggleExpand(item) : navigate(item.route || '')\"\n >\n @if (item.icon) {\n <div class=\"sefin-sidebar__nav-icon-wrapper\">\n <span class=\"sefin-sidebar__nav-icon\" [innerHTML]=\"getIconSvg(item.icon, 20)\"></span>\n </div>\n }\n @if (!effectiveIsMobile && !isCollapsed) {\n <span class=\"sefin-sidebar__nav-label\">{{ item.label }}</span>\n @if (hasChildren(item)) {\n <div class=\"sefin-sidebar__nav-expand-icon-wrapper\" [class.sefin-sidebar__nav-expand-icon-wrapper--expanded]=\"item.expanded\">\n <span class=\"sefin-sidebar__nav-expand-icon\" [innerHTML]=\"getIconSvg('chevron-down', 16)\"></span>\n </div>\n }\n }\n </button>\n <!-- Children items -->\n @if (hasChildren(item) && item.expanded && !effectiveIsMobile && !isCollapsed) {\n <ul class=\"sefin-sidebar__nav-sub-list\">\n @for (child of item.children; track child.label) {\n <li class=\"sefin-sidebar__nav-sub-item\" [class.sefin-sidebar__nav-sub-item--has-children]=\"hasChildren(child)\">\n <!-- Level 1: Section headers (non-clickable) -->\n <div class=\"sefin-sidebar__nav-section-header\">\n <span class=\"sefin-sidebar__section-header-text\">{{ child.label }}</span>\n </div>\n <!-- Level 2: Grandchildren items (clickable with bullets) -->\n @if (hasChildren(child)) {\n <ul class=\"sefin-sidebar__nav-sub-sub-list\">\n @for (grandchild of child.children; track grandchild.label) {\n <li class=\"sefin-sidebar__nav-sub-sub-item\">\n <button\n type=\"button\"\n class=\"sefin-sidebar__nav-link sefin-sidebar__nav-link--sub-sub\"\n [class.sefin-sidebar__nav-link--active]=\"isActive(grandchild.route || '')\"\n [attr.aria-current]=\"isActive(grandchild.route || '') ? 'page' : null\"\n (click)=\"navigate(grandchild.route || '')\"\n >\n @if (!isActive(grandchild.route || '')) {\n <div class=\"sefin-sidebar__nav-bullet\"></div>\n }\n <span class=\"sefin-sidebar__nav-label\">{{ grandchild.label }}</span>\n </button>\n </li>\n }\n </ul>\n }\n </li>\n }\n </ul>\n }\n </li>\n }\n </ul>\n </nav>\n \n @if (showFooter) {\n <div class=\"sefin-sidebar__footer\">\n <div class=\"sefin-sidebar__footer-content\">\n <span class=\"sefin-sidebar__footer-text\">{{ footerVersion }}</span>\n </div>\n </div>\n }\n</aside>\n", styles: [".sefin-sidebar{width:288px;min-width:288px;height:100vh;background:#fff;border-right:1px solid #e8e8e8;display:flex;flex-direction:column;position:fixed;left:0;top:0;z-index:100;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);transition:width .3s ease-in-out,transform .3s ease-in-out}.sefin-sidebar__header{padding:var(--sefin-spacing-xl, 1.5rem);border-bottom:1px solid #e8e8e8;display:flex;align-items:center;position:relative;background:linear-gradient(to right,#55c3d8,#4aafc4);min-height:auto}.sefin-sidebar__header .sefin-sidebar__header-content{display:flex;align-items:center;gap:var(--sefin-spacing-md, .75rem);width:100%}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-icon-container{width:40px;height:40px;border-radius:12px;background:#fff3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;flex-shrink:0}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-icon-container .sefin-sidebar__header-icon{color:#fff;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-icon-container .sefin-sidebar__header-icon svg{width:24px;height:24px;color:#fff;fill:none;stroke:currentColor}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text{display:flex;flex-direction:column;gap:0}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text .sefin-sidebar__header-title{color:#fff;font-size:18px;font-weight:700;line-height:1.2;margin:0;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text .sefin-sidebar__header-subtitle{color:#fffc;font-size:12px;line-height:1.2;margin:0;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__header:after{content:\"\";position:absolute;right:-20px;top:50%;transform:translateY(-50%);width:56px;height:56px;z-index:100;pointer-events:none}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__header{padding:var(--sefin-spacing-xl, 1.5rem) var(--sefin-spacing-sm, .5rem);justify-content:center}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__header .sefin-sidebar__header-content{flex-direction:column}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text{display:none}.sefin-sidebar__footer{padding:var(--sefin-spacing-md, 1rem);border-top:1px solid #e8e8e8}.sefin-sidebar__footer .sefin-sidebar__footer-content{background:#f5f5f5;border-radius:8px;padding:var(--sefin-spacing-sm, .75rem);text-align:center}.sefin-sidebar__footer .sefin-sidebar__footer-content .sefin-sidebar__footer-text{color:#828282;font-size:12px;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__toggle{position:absolute;right:-18px;top:50%;transform:translateY(-50%);width:36px;height:36px;border-radius:50%;border:none;background:linear-gradient(135deg,#fff,#f8f9fa);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 8px #0000001a,0 0 0 1px #0000000d,inset 0 1px #ffffffe6;transition:all .3s cubic-bezier(.4,0,.2,1);z-index:101;color:var(--sefin-color-text, #4a5568);padding:0;margin:0;line-height:0}.sefin-sidebar__toggle .sefin-sidebar__toggle-icon{display:inline-flex;align-items:center;justify-content:center;width:18px;height:18px;flex-shrink:0;transition:transform .3s cubic-bezier(.4,0,.2,1);pointer-events:none}.sefin-sidebar__toggle .sefin-sidebar__toggle-icon svg{width:18px;height:18px;color:currentColor;fill:none;stroke:currentColor;pointer-events:none}.sefin-sidebar__toggle:before{content:\"\";position:absolute;inset:0;border-radius:50%;background:linear-gradient(135deg,rgba(255,255,255,.3) 0%,transparent 50%);pointer-events:none;opacity:.5}.sefin-sidebar__toggle:hover{background:linear-gradient(135deg,#55c3d8,#4db8cc);color:#fff;transform:translateY(-50%) scale(1.08);box-shadow:0 4px 20px #55c3d866,0 0 0 1px #55c3d833,inset 0 1px #ffffff4d}.sefin-sidebar__toggle:hover:before{opacity:.2;background:linear-gradient(135deg,rgba(255,255,255,.4) 0%,transparent 50%)}.sefin-sidebar__toggle:hover .sefin-sidebar__toggle-icon{transform:scale(1.1)}.sefin-sidebar__toggle:active{transform:translateY(-50%) scale(1.02);box-shadow:0 2px 12px #55c3d880,0 0 0 1px #55c3d84d,inset 0 2px 4px #0000001a}.sefin-sidebar__toggle:focus{outline:2px solid var(--sefin-color-primary, #55c3d8);outline-offset:4px;outline-style:solid}.sefin-sidebar--collapsed .sefin-sidebar__toggle{right:-18px}.sefin-sidebar__close-button{position:absolute;right:var(--sefin-spacing-md, 1rem);top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;border:none;background:#fff3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease-in-out;z-index:101;color:#fff;padding:0;margin:0;line-height:0}.sefin-sidebar__close-button .sefin-sidebar__close-icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0;pointer-events:none}.sefin-sidebar__close-button .sefin-sidebar__close-icon svg{width:20px;height:20px;color:currentColor;fill:none;stroke:currentColor;stroke-width:2;pointer-events:none}.sefin-sidebar__close-button:hover{background:#ffffff4d;transform:translateY(-50%) scale(1.05)}.sefin-sidebar__close-button:active{transform:translateY(-50%) scale(.95)}.sefin-sidebar__close-button:focus{outline:2px solid rgba(255,255,255,.5);outline-offset:2px}.sefin-sidebar__nav{flex:1;padding:var(--sefin-spacing-sm, .75rem);overflow:hidden}.sefin-sidebar__nav-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}.sefin-sidebar__nav-item{margin:0}.sefin-sidebar__nav-item.sefin-sidebar__nav-item--has-children{margin-bottom:4px}.sefin-sidebar__nav-link{width:100%;display:flex;align-items:center;gap:var(--sefin-spacing-md, .75rem);padding:var(--sefin-spacing-sm, .75rem) var(--sefin-spacing-md, 1rem);background:none;border:none;outline:none;text-align:left;cursor:pointer;color:#383838;font-size:var(--sefin-font-size-base, 1rem);font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);transition:all .2s ease-in-out;position:relative;border-radius:12px;margin:0;justify-content:flex-start;overflow:hidden;min-width:0;font-weight:500}.sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active){background:#e6f7fb;color:#55c3d8}.sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-label{color:#55c3d8}.sefin-sidebar__nav-link:focus{outline:none}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--active{background:linear-gradient(to right,#55c3d8,#4aafc4);color:#fff;font-weight:500;box-shadow:0 4px 6px #55c3d84d;border:none}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-label{color:#fff}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--expandable{font-weight:500}.sefin-sidebar__nav-icon-wrapper{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:36px;height:36px;border-radius:8px;background:#e6f7fb;transition:all .2s ease-in-out}.sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon{display:flex;align-items:center;justify-content:center;width:20px;height:20px}.sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{width:20px;height:20px;color:#55c3d8;fill:none;stroke:currentColor}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-icon-wrapper{background:#fff3}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{color:#fff;fill:none;stroke:currentColor}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active:hover .sefin-sidebar__nav-icon-wrapper{background:#fff3}.sefin-sidebar .sefin-sidebar__nav-link.sefin-sidebar__nav-link--active:hover .sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{color:#fff;fill:none;stroke:currentColor}.sefin-sidebar .sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-icon-wrapper{background:#55c3d8}.sefin-sidebar .sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-icon-wrapper .sefin-sidebar__nav-icon svg{color:#fff;fill:none;stroke:currentColor}.sefin-sidebar__nav-expand-icon-wrapper{margin-left:auto;transition:transform .2s ease;display:flex;align-items:center;justify-content:center}.sefin-sidebar__nav-expand-icon-wrapper.sefin-sidebar__nav-expand-icon-wrapper--expanded{transform:rotate(180deg)}.sefin-sidebar__nav-expand-icon-wrapper .sefin-sidebar__nav-expand-icon svg{color:#828282;width:16px;height:16px;fill:none;stroke:currentColor;transition:color .2s ease-in-out}.sefin-sidebar__nav-link.sefin-sidebar__nav-link--active .sefin-sidebar__nav-expand-icon-wrapper .sefin-sidebar__nav-expand-icon svg{color:#fff}.sefin-sidebar__nav-link:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-expand-icon-wrapper .sefin-sidebar__nav-expand-icon svg{color:#55c3d8}.sefin-sidebar__nav-label{flex:1;white-space:normal;word-wrap:break-word;overflow-wrap:break-word;opacity:1;transition:opacity .2s ease;min-width:0;overflow:hidden;display:block;line-height:1.4;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__nav-sub-list{list-style:none;margin:4px 0 8px;padding:0;animation:slideDown .2s ease-out}.sefin-sidebar__nav-sub-item{margin:0 0 2px}.sefin-sidebar__nav-sub-item.sefin-sidebar__nav-sub-item--has-children{margin-bottom:4px}.sefin-sidebar__nav-section-header{padding:var(--sefin-spacing-md, 1rem) var(--sefin-spacing-md, 1rem) var(--sefin-spacing-xs, .5rem) var(--sefin-spacing-md, 1rem)}.sefin-sidebar__nav-section-header .sefin-sidebar__section-header-text{color:#828282;font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.05em;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif)}.sefin-sidebar__nav-sub-sub-list{list-style:none;margin:2px 0 8px;padding:0;animation:slideDown .2s ease-out;display:flex;flex-direction:column;gap:2px}.sefin-sidebar__nav-sub-sub-item{margin:0 0 2px}.sefin-sidebar__nav-link--sub-sub{width:100%;display:flex;align-items:center;gap:var(--sefin-spacing-md, .75rem);padding:var(--sefin-spacing-sm, .75rem) var(--sefin-spacing-md, 1rem);background:none;border:none;outline:none;text-align:left;cursor:pointer;color:#4f4f4f;font-size:var(--sefin-font-size-sm, .875rem);font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);transition:all .2s ease-in-out;position:relative;border-radius:12px;margin:0 var(--sefin-spacing-md, .5rem);justify-content:flex-start;overflow:hidden;min-width:0}.sefin-sidebar__nav-link--sub-sub:hover:not(.sefin-sidebar__nav-link--active){background:#e6f7fb;color:#55c3d8}.sefin-sidebar__nav-link--sub-sub:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-bullet{background:#55c3d8}.sefin-sidebar__nav-link--sub-sub:hover:not(.sefin-sidebar__nav-link--active) .sefin-sidebar__nav-label{color:#55c3d8}.sefin-sidebar__nav-link--sub-sub:focus{outline:none}.sefin-sidebar__nav-link--sub-sub.sefin-sidebar__nav-link--active{background:linear-gradient(to right,#55c3d8,#4aafc4);color:#fff;font-weight:500;box-shadow:0 4px 6px #55c3d84d;border:none}.sefin-sidebar__nav-link--sub-sub.sefin-sidebar__nav-link--active .sefin-sidebar__nav-label{color:#fff}.sefin-sidebar__nav-bullet{width:6px;height:6px;border-radius:50%;background:#cecece;transition:background-color .2s ease-in-out;flex-shrink:0}.sefin-sidebar .sefin-sidebar__nav-link--sub-sub.sefin-sidebar__nav-link--active .sefin-sidebar__nav-bullet{display:none}@keyframes slideDown{0%{opacity:0;max-height:0;overflow:hidden}to{opacity:1;max-height:1000px}}.sefin-sidebar.sefin-sidebar--collapsed{width:80px;min-width:80px}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-link{justify-content:center;padding:var(--sefin-spacing-md, 1rem);border-radius:12px;margin:0}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-label{opacity:0;width:0;overflow:hidden}.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-expand-icon,.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-sub-list,.sefin-sidebar.sefin-sidebar--collapsed .sefin-sidebar__nav-sub-sub-list{display:none}.sefin-sidebar.sefin-sidebar--mobile .sefin-sidebar__header{padding:var(--sefin-spacing-xl, 1.5rem) var(--sefin-spacing-sm, .5rem);justify-content:center}.sefin-sidebar.sefin-sidebar--mobile .sefin-sidebar__header .sefin-sidebar__header-content{flex-direction:column}.sefin-sidebar.sefin-sidebar--mobile .sefin-sidebar__header .sefin-sidebar__header-content .sefin-sidebar__header-text{display:none}.sefin-sidebar.sefin-sidebar--mobile{transform:translate(0);z-index:1000;width:80px;min-width:80px}\n"] }]
6299
6277
  }], ctorParameters: () => [{ type: i1$2.Router }, { type: i0.ChangeDetectorRef }, { type: i1$1.DomSanitizer }], propDecorators: { navItems: [{
6300
6278
  type: Input
6301
6279
  }], isMobile: [{
@@ -6320,9 +6298,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
6320
6298
  type: Output
6321
6299
  }], close: [{
6322
6300
  type: Output
6323
- }], handleEscapeKey: [{
6324
- type: HostListener,
6325
- args: ['document:keydown', ['$event']]
6326
6301
  }] } });
6327
6302
 
6328
6303
  /**
@@ -6416,6 +6391,139 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
6416
6391
  * Drawer component exports
6417
6392
  */
6418
6393
 
6394
+ class AppBarComponent {
6395
+ sanitizer;
6396
+ /** App bar title */
6397
+ title = 'Application';
6398
+ /** App bar subtitle */
6399
+ subtitle;
6400
+ /** Logo icon name */
6401
+ logoIcon;
6402
+ /** Logo image URL */
6403
+ logoImage;
6404
+ /** Show menu button */
6405
+ showMenuButton = false;
6406
+ /** Mobile mode flag */
6407
+ isMobile = null;
6408
+ /** App bar actions */
6409
+ actions = [];
6410
+ /** Elevation level (0-24) */
6411
+ elevation = 1;
6412
+ /** Menu button clicked event */
6413
+ menuClicked = new EventEmitter();
6414
+ /** Action clicked event */
6415
+ actionClicked = new EventEmitter();
6416
+ _autoDetectedMobile = false;
6417
+ mediaQueryHandler;
6418
+ mediaQuery;
6419
+ // Getter that combines explicit input with auto-detected value
6420
+ get effectiveIsMobile() {
6421
+ return this.isMobile !== null ? this.isMobile : this._autoDetectedMobile;
6422
+ }
6423
+ primaryColor = '#55C3D8';
6424
+ textColor = '#383838';
6425
+ constructor(sanitizer) {
6426
+ this.sanitizer = sanitizer;
6427
+ }
6428
+ ngOnChanges(changes) {
6429
+ if (changes['isMobile'] && this.isMobile === null && typeof window !== 'undefined' && window.matchMedia) {
6430
+ if (!this.mediaQuery) {
6431
+ this.mediaQuery = window.matchMedia('(max-width: 768px)');
6432
+ this._autoDetectedMobile = this.mediaQuery.matches;
6433
+ }
6434
+ }
6435
+ }
6436
+ ngOnInit() {
6437
+ // Detect screen size changes (only if isMobile is not explicitly set by parent)
6438
+ if (typeof window !== 'undefined' && window.matchMedia && this.isMobile === null) {
6439
+ if (!this.mediaQuery) {
6440
+ this.mediaQuery = window.matchMedia('(max-width: 768px)');
6441
+ this._autoDetectedMobile = this.mediaQuery.matches;
6442
+ }
6443
+ // Listen to media query changes
6444
+ if (this.mediaQuery.addEventListener && !this.mediaQueryHandler) {
6445
+ this.mediaQueryHandler = (e) => {
6446
+ this._autoDetectedMobile = e.matches;
6447
+ };
6448
+ this.mediaQuery.addEventListener('change', this.mediaQueryHandler);
6449
+ }
6450
+ else if (this.mediaQuery.addListener && !this.mediaQueryHandler) {
6451
+ // Fallback for older browsers
6452
+ this.mediaQueryHandler = (e) => {
6453
+ this._autoDetectedMobile = e.matches;
6454
+ };
6455
+ this.mediaQuery.addListener(this.mediaQueryHandler);
6456
+ }
6457
+ }
6458
+ }
6459
+ ngOnDestroy() {
6460
+ if (this.mediaQuery && this.mediaQueryHandler) {
6461
+ if (this.mediaQuery.removeEventListener) {
6462
+ this.mediaQuery.removeEventListener('change', this.mediaQueryHandler);
6463
+ }
6464
+ else if (this.mediaQuery.removeListener) {
6465
+ this.mediaQuery.removeListener(this.mediaQueryHandler);
6466
+ }
6467
+ }
6468
+ }
6469
+ handleMenuClick() {
6470
+ this.menuClicked.emit();
6471
+ }
6472
+ handleActionClick(action) {
6473
+ this.actionClicked.emit(action);
6474
+ }
6475
+ /**
6476
+ * Get SVG icon as SafeHtml based on icon name
6477
+ */
6478
+ getIconSvg(iconName, size = 24) {
6479
+ const icons = {
6480
+ 'home': 'M3 9l9-7 9 7v11a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z M9 22V12h6v10',
6481
+ 'building-2': 'M6 22V4a2 2 0 0 1 2-2h8a2 2 0 0 1 2 2v18M6 12h12M6 12V8M6 12h12M12 2v20',
6482
+ 'menu': 'M3 12H21M3 6H21M3 18H21',
6483
+ 'x': 'M18 6L6 18M6 6L18 18',
6484
+ 'bell': 'M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9',
6485
+ 'search': 'M21 21l-6-6m2-5a7 7 0 1 1-14 0 7 7 0 0 1 14 0z',
6486
+ 'settings': 'M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z',
6487
+ 'user': 'M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2 M12 11a4 4 0 1 0 0-8 4 4 0 0 0 0 8z',
6488
+ 'user-circle': 'M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2 M12 11a4 4 0 1 0 0-8 4 4 0 0 0 0 8z M12 11a4 4 0 1 0 0-8 4 4 0 0 0 0 8z',
6489
+ 'more-vertical': 'M12 13a1 1 0 1 0 0-2 1 1 0 0 0 0 2z M12 6a1 1 0 1 0 0-2 1 1 0 0 0 0 2z M12 20a1 1 0 1 0 0-2 1 1 0 0 0 0 2z',
6490
+ };
6491
+ const path = icons[iconName] || icons['menu'];
6492
+ const svg = `<svg width="${size}" height="${size}" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="${path}"></path></svg>`;
6493
+ return this.sanitizer.bypassSecurityTrustHtml(svg);
6494
+ }
6495
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: AppBarComponent, deps: [{ token: i1$1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
6496
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: AppBarComponent, isStandalone: true, selector: "sefin-app-bar", inputs: { title: "title", subtitle: "subtitle", logoIcon: "logoIcon", logoImage: "logoImage", showMenuButton: "showMenuButton", isMobile: "isMobile", actions: "actions", elevation: "elevation" }, outputs: { menuClicked: "menuClicked", actionClicked: "actionClicked" }, usesOnChanges: true, ngImport: i0, template: "<header\n class=\"sefin-app-bar\"\n [class.sefin-app-bar--mobile]=\"effectiveIsMobile\"\n [style.box-shadow]=\"'var(--sefin-shadow-' + elevation + ', 0 ' + elevation + 'px ' + (elevation * 2) + 'px rgba(0, 0, 0, 0.1))'\"\n>\n <div class=\"sefin-app-bar__container\">\n <!-- Left section: Menu button and logo/title -->\n <div class=\"sefin-app-bar__left\">\n @if (showMenuButton) {\n <button\n type=\"button\"\n class=\"sefin-app-bar__menu-button\"\n (click)=\"handleMenuClick()\"\n aria-label=\"Toggle menu\"\n aria-expanded=\"false\"\n >\n <span class=\"sefin-app-bar__menu-icon\" [innerHTML]=\"getIconSvg('menu', 24)\"></span>\n </button>\n }\n\n <div class=\"sefin-app-bar__brand\">\n @if (logoImage) {\n <img\n [src]=\"logoImage\"\n [alt]=\"title\"\n class=\"sefin-app-bar__logo-image\"\n />\n }\n @if (logoIcon && !logoImage) {\n <div class=\"sefin-app-bar__logo-icon-container\">\n <span class=\"sefin-app-bar__logo-icon\" [innerHTML]=\"getIconSvg(logoIcon, 24)\"></span>\n </div>\n }\n <div class=\"sefin-app-bar__title-section\">\n <h1 class=\"sefin-app-bar__title\">{{ title }}</h1>\n @if (subtitle) {\n <span class=\"sefin-app-bar__subtitle\">{{ subtitle }}</span>\n }\n </div>\n </div>\n </div>\n\n <!-- Center section: Projected content -->\n <div class=\"sefin-app-bar__center\">\n <ng-content select=\"[slot=center]\"></ng-content>\n </div>\n\n <!-- Right section: Actions and projected content -->\n <div class=\"sefin-app-bar__right\">\n @if (actions.length > 0) {\n <div class=\"sefin-app-bar__actions\">\n @for (action of actions; track action.label) {\n <button\n type=\"button\"\n class=\"sefin-app-bar__action-button\"\n [class.sefin-app-bar__action-button--disabled]=\"action.disabled\"\n [class]=\"action.class || ''\"\n [disabled]=\"action.disabled\"\n [attr.aria-label]=\"action.label\"\n (click)=\"!action.disabled && handleActionClick(action)\"\n >\n <span class=\"sefin-app-bar__action-icon\" [innerHTML]=\"getIconSvg(action.icon, 20)\"></span>\n </button>\n }\n </div>\n }\n <ng-content select=\"[slot=right]\"></ng-content>\n </div>\n </div>\n</header>\n", styles: [".sefin-app-bar{width:100%;height:64px;min-height:64px;background:#fff;border-bottom:1px solid #e8e8e8;display:flex;align-items:center;position:relative;z-index:10;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);transition:box-shadow .3s ease-in-out}.sefin-app-bar__container{width:100%;height:100%;display:flex;align-items:center;justify-content:space-between;padding:0 var(--sefin-spacing-lg, 1.5rem);gap:var(--sefin-spacing-lg, 1.5rem)}.sefin-app-bar__left{display:flex;align-items:center;gap:var(--sefin-spacing-md, 1rem);flex:0 0 auto;min-width:0}.sefin-app-bar__menu-button{width:40px;height:40px;border-radius:8px;border:none;background:transparent;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease-in-out;color:var(--sefin-color-text, #383838);padding:0;margin:0;flex-shrink:0}.sefin-app-bar__menu-button .sefin-app-bar__menu-icon{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;flex-shrink:0}.sefin-app-bar__menu-button .sefin-app-bar__menu-icon svg{width:24px;height:24px;color:currentColor;fill:none;stroke:currentColor}.sefin-app-bar__menu-button:hover{background:#e6f7fb;color:#55c3d8}.sefin-app-bar__menu-button:active{background:#d0f0f7}.sefin-app-bar__menu-button:focus{outline:2px solid var(--sefin-color-primary, #55c3d8);outline-offset:2px}.sefin-app-bar__brand{display:flex;align-items:center;gap:var(--sefin-spacing-md, 1rem);min-width:0}.sefin-app-bar__logo-image{width:40px;height:40px;object-fit:contain;flex-shrink:0}.sefin-app-bar__logo-icon-container{width:40px;height:40px;border-radius:12px;background:linear-gradient(to right,#55c3d8,#4aafc4);display:flex;align-items:center;justify-content:center;flex-shrink:0}.sefin-app-bar__logo-icon-container .sefin-app-bar__logo-icon{color:#fff;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.sefin-app-bar__logo-icon-container .sefin-app-bar__logo-icon svg{width:24px;height:24px;color:#fff;fill:none;stroke:currentColor}.sefin-app-bar__title-section{display:flex;flex-direction:column;gap:0;min-width:0}.sefin-app-bar__title{color:var(--sefin-color-text, #383838);font-size:var(--sefin-font-size-lg, 1.125rem);font-weight:700;line-height:1.2;margin:0;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sefin-app-bar__subtitle{color:#828282;font-size:var(--sefin-font-size-sm, .875rem);line-height:1.2;margin:0;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sefin-app-bar__center{display:flex;align-items:center;flex:1 1 auto;min-width:0;justify-content:center}.sefin-app-bar__right{display:flex;align-items:center;gap:var(--sefin-spacing-sm, .75rem);flex:0 0 auto;min-width:0}.sefin-app-bar__actions{display:flex;align-items:center;gap:var(--sefin-spacing-xs, .5rem)}.sefin-app-bar__action-button{width:40px;height:40px;border-radius:8px;border:none;background:transparent;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease-in-out;color:var(--sefin-color-text, #383838);padding:0;margin:0;flex-shrink:0}.sefin-app-bar__action-button .sefin-app-bar__action-icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0}.sefin-app-bar__action-button .sefin-app-bar__action-icon svg{width:20px;height:20px;color:currentColor;fill:none;stroke:currentColor}.sefin-app-bar__action-button:hover:not(.sefin-app-bar__action-button--disabled){background:#e6f7fb;color:#55c3d8}.sefin-app-bar__action-button:active:not(.sefin-app-bar__action-button--disabled){background:#d0f0f7}.sefin-app-bar__action-button:focus{outline:2px solid var(--sefin-color-primary, #55c3d8);outline-offset:2px}.sefin-app-bar__action-button.sefin-app-bar__action-button--disabled{opacity:.5;cursor:not-allowed}.sefin-app-bar.sefin-app-bar--mobile{height:56px;min-height:56px}.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__container{padding:0 var(--sefin-spacing-md, 1rem);gap:var(--sefin-spacing-md, 1rem)}.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__title{font-size:var(--sefin-font-size-base, 1rem)}.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__subtitle{font-size:var(--sefin-font-size-xs, .75rem)}.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__logo-image,.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__logo-icon-container{width:32px;height:32px}.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__logo-image .sefin-app-bar__logo-icon,.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__logo-icon-container .sefin-app-bar__logo-icon{width:20px;height:20px}.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__logo-image .sefin-app-bar__logo-icon svg,.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__logo-icon-container .sefin-app-bar__logo-icon svg{width:20px;height:20px}.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__menu-button{width:36px;height:36px}.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__menu-button .sefin-app-bar__menu-icon{width:20px;height:20px}.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__menu-button .sefin-app-bar__menu-icon svg{width:20px;height:20px}.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__action-button{width:36px;height:36px}.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__action-button .sefin-app-bar__action-icon{width:18px;height:18px}.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__action-button .sefin-app-bar__action-icon svg{width:18px;height:18px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
6497
+ }
6498
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: AppBarComponent, decorators: [{
6499
+ type: Component,
6500
+ args: [{ selector: 'sefin-app-bar', standalone: true, imports: [CommonModule, IconComponent, IconButtonComponent], changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, template: "<header\n class=\"sefin-app-bar\"\n [class.sefin-app-bar--mobile]=\"effectiveIsMobile\"\n [style.box-shadow]=\"'var(--sefin-shadow-' + elevation + ', 0 ' + elevation + 'px ' + (elevation * 2) + 'px rgba(0, 0, 0, 0.1))'\"\n>\n <div class=\"sefin-app-bar__container\">\n <!-- Left section: Menu button and logo/title -->\n <div class=\"sefin-app-bar__left\">\n @if (showMenuButton) {\n <button\n type=\"button\"\n class=\"sefin-app-bar__menu-button\"\n (click)=\"handleMenuClick()\"\n aria-label=\"Toggle menu\"\n aria-expanded=\"false\"\n >\n <span class=\"sefin-app-bar__menu-icon\" [innerHTML]=\"getIconSvg('menu', 24)\"></span>\n </button>\n }\n\n <div class=\"sefin-app-bar__brand\">\n @if (logoImage) {\n <img\n [src]=\"logoImage\"\n [alt]=\"title\"\n class=\"sefin-app-bar__logo-image\"\n />\n }\n @if (logoIcon && !logoImage) {\n <div class=\"sefin-app-bar__logo-icon-container\">\n <span class=\"sefin-app-bar__logo-icon\" [innerHTML]=\"getIconSvg(logoIcon, 24)\"></span>\n </div>\n }\n <div class=\"sefin-app-bar__title-section\">\n <h1 class=\"sefin-app-bar__title\">{{ title }}</h1>\n @if (subtitle) {\n <span class=\"sefin-app-bar__subtitle\">{{ subtitle }}</span>\n }\n </div>\n </div>\n </div>\n\n <!-- Center section: Projected content -->\n <div class=\"sefin-app-bar__center\">\n <ng-content select=\"[slot=center]\"></ng-content>\n </div>\n\n <!-- Right section: Actions and projected content -->\n <div class=\"sefin-app-bar__right\">\n @if (actions.length > 0) {\n <div class=\"sefin-app-bar__actions\">\n @for (action of actions; track action.label) {\n <button\n type=\"button\"\n class=\"sefin-app-bar__action-button\"\n [class.sefin-app-bar__action-button--disabled]=\"action.disabled\"\n [class]=\"action.class || ''\"\n [disabled]=\"action.disabled\"\n [attr.aria-label]=\"action.label\"\n (click)=\"!action.disabled && handleActionClick(action)\"\n >\n <span class=\"sefin-app-bar__action-icon\" [innerHTML]=\"getIconSvg(action.icon, 20)\"></span>\n </button>\n }\n </div>\n }\n <ng-content select=\"[slot=right]\"></ng-content>\n </div>\n </div>\n</header>\n", styles: [".sefin-app-bar{width:100%;height:64px;min-height:64px;background:#fff;border-bottom:1px solid #e8e8e8;display:flex;align-items:center;position:relative;z-index:10;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);transition:box-shadow .3s ease-in-out}.sefin-app-bar__container{width:100%;height:100%;display:flex;align-items:center;justify-content:space-between;padding:0 var(--sefin-spacing-lg, 1.5rem);gap:var(--sefin-spacing-lg, 1.5rem)}.sefin-app-bar__left{display:flex;align-items:center;gap:var(--sefin-spacing-md, 1rem);flex:0 0 auto;min-width:0}.sefin-app-bar__menu-button{width:40px;height:40px;border-radius:8px;border:none;background:transparent;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease-in-out;color:var(--sefin-color-text, #383838);padding:0;margin:0;flex-shrink:0}.sefin-app-bar__menu-button .sefin-app-bar__menu-icon{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;flex-shrink:0}.sefin-app-bar__menu-button .sefin-app-bar__menu-icon svg{width:24px;height:24px;color:currentColor;fill:none;stroke:currentColor}.sefin-app-bar__menu-button:hover{background:#e6f7fb;color:#55c3d8}.sefin-app-bar__menu-button:active{background:#d0f0f7}.sefin-app-bar__menu-button:focus{outline:2px solid var(--sefin-color-primary, #55c3d8);outline-offset:2px}.sefin-app-bar__brand{display:flex;align-items:center;gap:var(--sefin-spacing-md, 1rem);min-width:0}.sefin-app-bar__logo-image{width:40px;height:40px;object-fit:contain;flex-shrink:0}.sefin-app-bar__logo-icon-container{width:40px;height:40px;border-radius:12px;background:linear-gradient(to right,#55c3d8,#4aafc4);display:flex;align-items:center;justify-content:center;flex-shrink:0}.sefin-app-bar__logo-icon-container .sefin-app-bar__logo-icon{color:#fff;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.sefin-app-bar__logo-icon-container .sefin-app-bar__logo-icon svg{width:24px;height:24px;color:#fff;fill:none;stroke:currentColor}.sefin-app-bar__title-section{display:flex;flex-direction:column;gap:0;min-width:0}.sefin-app-bar__title{color:var(--sefin-color-text, #383838);font-size:var(--sefin-font-size-lg, 1.125rem);font-weight:700;line-height:1.2;margin:0;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sefin-app-bar__subtitle{color:#828282;font-size:var(--sefin-font-size-sm, .875rem);line-height:1.2;margin:0;font-family:var(--sefin-font-family-base, \"Pluto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, \"Helvetica Neue\", Arial, sans-serif);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sefin-app-bar__center{display:flex;align-items:center;flex:1 1 auto;min-width:0;justify-content:center}.sefin-app-bar__right{display:flex;align-items:center;gap:var(--sefin-spacing-sm, .75rem);flex:0 0 auto;min-width:0}.sefin-app-bar__actions{display:flex;align-items:center;gap:var(--sefin-spacing-xs, .5rem)}.sefin-app-bar__action-button{width:40px;height:40px;border-radius:8px;border:none;background:transparent;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s ease-in-out;color:var(--sefin-color-text, #383838);padding:0;margin:0;flex-shrink:0}.sefin-app-bar__action-button .sefin-app-bar__action-icon{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;flex-shrink:0}.sefin-app-bar__action-button .sefin-app-bar__action-icon svg{width:20px;height:20px;color:currentColor;fill:none;stroke:currentColor}.sefin-app-bar__action-button:hover:not(.sefin-app-bar__action-button--disabled){background:#e6f7fb;color:#55c3d8}.sefin-app-bar__action-button:active:not(.sefin-app-bar__action-button--disabled){background:#d0f0f7}.sefin-app-bar__action-button:focus{outline:2px solid var(--sefin-color-primary, #55c3d8);outline-offset:2px}.sefin-app-bar__action-button.sefin-app-bar__action-button--disabled{opacity:.5;cursor:not-allowed}.sefin-app-bar.sefin-app-bar--mobile{height:56px;min-height:56px}.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__container{padding:0 var(--sefin-spacing-md, 1rem);gap:var(--sefin-spacing-md, 1rem)}.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__title{font-size:var(--sefin-font-size-base, 1rem)}.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__subtitle{font-size:var(--sefin-font-size-xs, .75rem)}.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__logo-image,.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__logo-icon-container{width:32px;height:32px}.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__logo-image .sefin-app-bar__logo-icon,.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__logo-icon-container .sefin-app-bar__logo-icon{width:20px;height:20px}.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__logo-image .sefin-app-bar__logo-icon svg,.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__logo-icon-container .sefin-app-bar__logo-icon svg{width:20px;height:20px}.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__menu-button{width:36px;height:36px}.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__menu-button .sefin-app-bar__menu-icon{width:20px;height:20px}.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__menu-button .sefin-app-bar__menu-icon svg{width:20px;height:20px}.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__action-button{width:36px;height:36px}.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__action-button .sefin-app-bar__action-icon{width:18px;height:18px}.sefin-app-bar.sefin-app-bar--mobile .sefin-app-bar__action-button .sefin-app-bar__action-icon svg{width:18px;height:18px}\n"] }]
6501
+ }], ctorParameters: () => [{ type: i1$1.DomSanitizer }], propDecorators: { title: [{
6502
+ type: Input
6503
+ }], subtitle: [{
6504
+ type: Input
6505
+ }], logoIcon: [{
6506
+ type: Input
6507
+ }], logoImage: [{
6508
+ type: Input
6509
+ }], showMenuButton: [{
6510
+ type: Input
6511
+ }], isMobile: [{
6512
+ type: Input
6513
+ }], actions: [{
6514
+ type: Input
6515
+ }], elevation: [{
6516
+ type: Input
6517
+ }], menuClicked: [{
6518
+ type: Output
6519
+ }], actionClicked: [{
6520
+ type: Output
6521
+ }] } });
6522
+
6523
+ /**
6524
+ * App bar component exports
6525
+ */
6526
+
6419
6527
  /**
6420
6528
  * Organisms index
6421
6529
  */
@@ -6431,5 +6539,5 @@ const STYLES_PATH = './styles/index.scss';
6431
6539
  * Generated bundle index. Do not edit.
6432
6540
  */
6433
6541
 
6434
- export { AccordionItemComponent, AlertComponent, AutocompleteComponent, AvatarComponent, BORDER_RADIUS_TOKENS, BRAND_THEME, BadgeComponent, BreadcrumbsComponent, ButtonComponent, ButtonGroupComponent, COLOR_TOKENS, CardComponent, CheckboxComponent, ChipComponent, ContainerComponent, DARK_THEME, DESIGN_TOKENS, DatepickerComponent, DividerComponent, DrawerComponent, FabButtonComponent, FormFieldComponent, IconButtonComponent, IconComponent, ImageComponent, LIGHT_THEME, LinkComponent, PaginationComponent, ProgressBarComponent, RadioComponent, RateComponent, SHADOW_TOKENS, SPACING_TOKENS, STYLES_PATH, SelectComponent, SidebarComponent, SpacerComponent, SpinnerComponent, StackComponent, SwitchComponent, TYPOGRAPHY_TOKENS, TabComponent, TableComponent, TagComponent, TextFieldComponent, TextareaComponent, ThemeLoader, ToastComponent, TooltipComponent, TypographyComponent, buildDisplayedColumns };
6542
+ export { AccordionItemComponent, AlertComponent, AppBarComponent, AutocompleteComponent, AvatarComponent, BORDER_RADIUS_TOKENS, BRAND_THEME, BadgeComponent, BreadcrumbsComponent, ButtonComponent, ButtonGroupComponent, COLOR_TOKENS, CardComponent, CheckboxComponent, ChipComponent, ContainerComponent, DARK_THEME, DESIGN_TOKENS, DatepickerComponent, DividerComponent, DrawerComponent, FabButtonComponent, FormFieldComponent, IconButtonComponent, IconComponent, ImageComponent, LIGHT_THEME, LinkComponent, PaginationComponent, ProgressBarComponent, RadioComponent, RateComponent, SHADOW_TOKENS, SPACING_TOKENS, STYLES_PATH, SelectComponent, SidebarComponent, SpacerComponent, SpinnerComponent, StackComponent, SwitchComponent, TYPOGRAPHY_TOKENS, TabComponent, TableComponent, TagComponent, TextFieldComponent, TextareaComponent, ThemeLoader, ToastComponent, TooltipComponent, TypographyComponent, buildDisplayedColumns };
6435
6543
  //# sourceMappingURL=lesterarte-sefin-ui.mjs.map