14 lines
2.7 KiB
JavaScript
14 lines
2.7 KiB
JavaScript
/*
|
|
* This file is part of the TYPO3 CMS project.
|
|
*
|
|
* It is free software; you can redistribute it and/or modify it under
|
|
* the terms of the GNU General Public License, either version 2
|
|
* of the License, or any later version.
|
|
*
|
|
* For the full copyright and license information, please read the
|
|
* LICENSE.txt file that was distributed with this source code.
|
|
*
|
|
* The TYPO3 project - inspiring people to share!
|
|
*/
|
|
import{css as h,html as f}from"lit";import{property as b,state as m,customElement as g}from"lit/decorators.js";import{PseudoButtonLitElement as c}from"@typo3/backend/element/pseudo-button.js";import{ScaffoldState as r,ScaffoldSidebarToggleEvent as u}from"@typo3/backend/viewport/scaffold-state.js";import"@typo3/backend/element/icon-element.js";var l=function(d,e,a,s){var n=arguments.length,t=n<3?e:s===null?s=Object.getOwnPropertyDescriptor(e,a):s,o;if(typeof Reflect=="object"&&typeof Reflect.decorate=="function")t=Reflect.decorate(d,e,a,s);else for(var p=d.length-1;p>=0;p--)(o=d[p])&&(t=(n<3?o(t):n>3?o(e,a,t):o(e,a))||t);return n>3&&t&&Object.defineProperty(e,a,t),t};let i=class extends c{constructor(){super(...arguments),this.labelCollapse="Collapse sidebar",this.labelExpand="Expand sidebar",this.disabled=!1,this.expanded=!1,this.handleSidebarToggle=e=>{this.expanded=e.detail.expanded}}static{this.styles=[...c.styles,h`:host{display:inline-flex;align-items:center;justify-content:center;user-select:none}:host([disabled]){pointer-events:none;opacity:.5;cursor:default}`]}connectedCallback(){super.connectedCallback(),this.expanded=r.isLargeScreen()?r.isSidebarExpanded():r.isSidebarVisible(),this.updateLabels(),document.addEventListener(u.eventName,this.handleSidebarToggle)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener(u.eventName,this.handleSidebarToggle)}updated(){this.updateLabels(),this.updateDisabledState()}render(){const e=this.expanded?"actions-menu-sidebar-collapsed":"actions-menu-sidebar-expanded",a=this.disabled?"overlay-readonly":null;return f`<typo3-backend-icon identifier=${e} size=small overlay=${a}></typo3-backend-icon>`}buttonActivated(){this.disabled||r.toggleSidebar()}updateLabels(){const e=this.expanded?this.labelCollapse:this.labelExpand;this.title=e,this.setAttribute("aria-label",e)}updateDisabledState(){this.disabled?(this.setAttribute("aria-disabled","true"),this.tabIndex=-1):(this.removeAttribute("aria-disabled"),this.tabIndex=0)}};l([b({type:String,attribute:"label-collapse"})],i.prototype,"labelCollapse",void 0),l([b({type:String,attribute:"label-expand"})],i.prototype,"labelExpand",void 0),l([b({type:Boolean,reflect:!0})],i.prototype,"disabled",void 0),l([m()],i.prototype,"expanded",void 0),i=l([g("typo3-backend-sidebar-toggle")],i);export{i as SidebarToggleElement};
|