FileMaster

Edit File: sc-summary.js

import{h}from"@stencil/core";import{__,sprintf}from"@wordpress/i18n";import{speak}from"@wordpress/a11y";import{animateTo,shimKeyframesHeightAuto,stopAnimations}from"../../../functions/animate";import{getAnimation,setDefaultAnimation}from"../../../functions/animation-registry";export class ScOrderSummary{constructor(){this.loading=void 0,this.busy=void 0,this.closedText=__("Show Summary","surecart"),this.openText=__("Summary","surecart"),this.collapsible=!1,this.collapsedOnMobile=!1,this.collapsedOnDesktop=void 0,this.collapsed=!1}isMobileScreen(){var e,t;const s=null===(e=document.body)||void 0===e?void 0:e.getClientRects();return(null==s?void 0:s.length)&&(null===(t=s[0])||void 0===t?void 0:t.width)<781}componentWillLoad(){this.isMobileScreen()?this.collapsed=this.collapsed||this.collapsedOnMobile:this.collapsed=this.collapsed||this.collapsedOnDesktop,this.handleOpenChange()}handleClick(e){e.preventDefault(),this.collapsed=!this.collapsed}renderHeader(){return this.loading?h("sc-line-item",null,h("sc-skeleton",{slot:"title",style:{width:"120px",display:"inline-block"}}),h("sc-skeleton",{slot:"price",style:{width:"70px",display:"inline-block","--border-radius":"6px"}}),h("sc-skeleton",{slot:"currency",style:{width:"30px",display:"inline-block"}})):h("sc-line-item",{style:{"--price-size":"var(--sc-font-size-x-large)"}},h("span",{class:"collapse-link",slot:"title",onClick:e=>this.handleClick(e),tabIndex:0,"aria-label":sprintf(__("Summary %s","surecart"),this.collapsed?__("collapsed","surecart"):__("expanded","surecart")),onKeyDown:e=>{" "===e.key&&(this.handleClick(e),speak(sprintf(__("Summary %s","surecart"),this.collapsed?__("collapsed","surecart"):__("expanded","surecart")),"assertive"))}},this.collapsed?this.closedText||__("Summary","surecart"):this.openText||__("Summary","surecart"),h("svg",{xmlns:"http://www.w3.org/2000/svg",class:"collapse-link__icon",fill:"none",viewBox:"0 0 24 24",stroke:"currentColor"},h("path",{"stroke-linecap":"round","stroke-linejoin":"round","stroke-width":"2",d:"M19 9l-7 7-7-7"}))),h("span",{slot:"description"},h("slot",{name:"description"})),h("span",{slot:"price",class:{price:!0,"price--collapsed":this.collapsed}},h("slot",{name:"price"})))}async handleOpenChange(){if(this.collapsed){this.scHide.emit(),await stopAnimations(this.body),this.body.style.overflow="hidden";const{keyframes:e,options:t}=getAnimation(this.el,"summary.hide");await animateTo(this.body,shimKeyframesHeightAuto(e,this.body.scrollHeight),t),this.body.hidden=!0,this.body.style.height="auto",this.body.style.overflow="visible"}else{this.scShow.emit(),await stopAnimations(this.body),this.body.hidden=!1,this.body.style.overflow="hidden";const{keyframes:e,options:t}=getAnimation(this.el,"summary.show");await animateTo(this.body,shimKeyframesHeightAuto(e,this.body.scrollHeight),t),this.body.style.height="auto",this.body.style.overflow="visible"}}render(){return h("div",{key:"f8a08c3a0c83d37517ee97e03aa3ce9c4a59c6bb",class:{summary:!0,"summary--open":!this.collapsed}},this.collapsible&&this.renderHeader(),h("div",{key:"913f36a587df9178fb37be78db20b957ab2a7f9e",ref:e=>this.body=e,class:{summary__content:!0}},h("slot",{key:"08c304da401c4aed9140713a7e199908e1bae820"})))}static get is(){return"sc-summary"}static get encapsulation(){return"shadow"}static get originalStyleUrls(){return{$:["sc-summary.scss"]}}static get styleUrls(){return{$:["sc-summary.css"]}}static get properties(){return{loading:{type:"boolean",mutable:!1,complexType:{original:"boolean",resolved:"boolean",references:{}},required:!1,optional:!1,docs:{tags:[],text:""},attribute:"loading",reflect:!1},busy:{type:"boolean",mutable:!1,complexType:{original:"boolean",resolved:"boolean",references:{}},required:!1,optional:!1,docs:{tags:[],text:""},attribute:"busy",reflect:!1},closedText:{type:"string",mutable:!1,complexType:{original:"string",resolved:"string",references:{}},required:!1,optional:!1,docs:{tags:[],text:""},attribute:"closed-text",reflect:!1,defaultValue:"__('Show Summary', 'surecart')"},openText:{type:"string",mutable:!1,complexType:{original:"string",resolved:"string",references:{}},required:!1,optional:!1,docs:{tags:[],text:""},attribute:"open-text",reflect:!1,defaultValue:"__('Summary', 'surecart')"},collapsible:{type:"boolean",mutable:!1,complexType:{original:"boolean",resolved:"boolean",references:{}},required:!1,optional:!1,docs:{tags:[],text:""},attribute:"collapsible",reflect:!1,defaultValue:"false"},collapsedOnMobile:{type:"boolean",mutable:!1,complexType:{original:"boolean",resolved:"boolean",references:{}},required:!1,optional:!1,docs:{tags:[],text:""},attribute:"collapsed-on-mobile",reflect:!1,defaultValue:"false"},collapsedOnDesktop:{type:"boolean",mutable:!1,complexType:{original:"boolean",resolved:"boolean",references:{}},required:!1,optional:!1,docs:{tags:[],text:""},attribute:"collapsed-on-desktop",reflect:!1},collapsed:{type:"boolean",mutable:!0,complexType:{original:"boolean",resolved:"boolean",references:{}},required:!1,optional:!1,docs:{tags:[],text:""},attribute:"collapsed",reflect:!1,defaultValue:"false"}}}static get events(){return[{method:"scShow",name:"scShow",bubbles:!0,cancelable:!0,composed:!0,docs:{tags:[],text:"Show the toggle"},complexType:{original:"void",resolved:"void",references:{}}},{method:"scHide",name:"scHide",bubbles:!0,cancelable:!0,composed:!0,docs:{tags:[],text:"Show the toggle"},complexType:{original:"void",resolved:"void",references:{}}}]}static get elementRef(){return"el"}static get watchers(){return[{propName:"collapsed",methodName:"handleOpenChange"}]}}setDefaultAnimation("summary.show",{keyframes:[{height:"0",opacity:"0"},{height:"auto",opacity:"1"}],options:{duration:250,easing:"ease"}}),setDefaultAnimation("summary.hide",{keyframes:[{height:"auto",opacity:"1"},{height:"0",opacity:"0"}],options:{duration:250,easing:"ease"}});

Back