@momentum-ui/web-components 3.0.0-beta.1 → 3.0.0-beta.11

package/dist/6408.js

@@ -1,4 +1,4 @@
-"use strict";(self["momentum-web-components-[id]"]=self["momentum-web-components-[id]"]||[]).push([[6408],{96408:(e,t,i)=>{i(20109),i(61200),i(6396),i(12176);var s,o=i(90195),a=i(31890),n=i(32972),r=i(4313),p=(i(32022),i(87161)),l=i(70429),d=i(85125),h=i(20291),u=i(58175),m=i(10318),c=i(13739),y=function(e,t,i,s){var o,a=arguments.length,n=a<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,i):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)n=Reflect.decorate(e,t,i,s);else for(var r=e.length-1;r>=0;r--)(o=e[r])&&(n=(a<3?o(n):a>3?o(t,i,n):o(t,i))||n);return a>3&&n&&Object.defineProperty(t,i,n),n};!function(e){class t{determineMessageType(e){return e.reduce((e,t)=>"error"===t?e:t.type,"")}filterMessagesByType(e,t){return e.reduce((e,i)=>i.type===t?e.concat(i.message):e,[])}}e.MessageController=t;let i=class extends((0,n.y)(p.LitElement)){constructor(){super(...arguments),this.ariaDescribedBy="",this.ariaInvalid="false",this.ariaLabel="input",this.autofocus=!1,this.auxiliaryContentPosition=null,this.clear=!1,this.clearAriaLabel="",this.compact=!1,this.containerSize="small-12",this.disabled=!1,this.id="",this.inputSize="",this.isFilled=!1,this.isLoading=!1,this.label="",this.helpText="",this.hideMessage=!1,this.htmlId="",this.role="",this.messageArr=[],this.min=void 0,this.max=void 0,this.maxLength=void 0,this.multi=!1,this.multiline=!1,this.name="",this.nestedLevel=0,this.placeholder="",this.readOnly=!1,this.required=!1,this.searchable=!1,this.secondaryLabel="",this.selectWhenInFocus=!1,this.shape="",this.type="text",this.value="",this.ariaControls="",this.ariaExpanded="",this.newMomentum=!1,this.disableUserTextInput=!1,this.showDropdown=!1,this.dropdownExpanded=!1,this.dropdownAriaLabel="Show options",this.isEditing=!1,this.hasRightSlotContent=!1,this.messageController=new t}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this.handleOutsideClick)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this.handleOutsideClick)}select(){this.input.select()}focus(){this.input.focus()}handleOutsideClick(e){let t=!1;const i=e.composedPath();i.length&&(t=!!i.find(e=>e===this),t||(this.input.blur(),this.isEditing=!1))}handleKeyDown(e){this.dispatchEvent(new CustomEvent("input-keydown",{bubbles:!0,composed:!0,detail:{srcEvent:e}}))}handleFocus(e){this.disabled||(this.isEditing=!0,this.selectWhenInFocus&&this.select(),this.dispatchEvent(new CustomEvent("input-focus",{bubbles:!0,composed:!0,detail:{srcEvent:e}})))}handleMouseDown(e){this.disabled||(this.isEditing=!0,this.dispatchEvent(new CustomEvent("input-mousedown",{bubbles:!0,composed:!0,detail:{srcEvent:e}})))}handleChange(e){var t;this.value=e.target.value,null===(t=this.control)||void 0===t||t.setValue(this.value),this.dispatchEvent(new CustomEvent("input-change",{bubbles:!0,composed:!0,detail:{srcEvent:e,value:this.value}}))}handleBlur(e){var t;null===(t=this.control)||void 0===t||t.markAsTouched(),this.isEditing=!1,this.dispatchEvent(new CustomEvent("input-blur",{bubbles:!0,composed:!0,detail:{srcEvent:e}}))}handleClear(e){if("keydown"===e.type){const{code:t}=e;if(t!==o.Uz.Space&&t!==o.Uz.Enter)return;e.preventDefault(),e.stopPropagation()}else"click"===e.type&&(e.preventDefault(),e.stopPropagation());this.input.focus(),this.dispatchEvent(new CustomEvent("input-clear",{bubbles:!0,composed:!0,detail:{srcEvent:e}})),document.dispatchEvent(new CustomEvent("on-widget-update")),this.handleChange(e)}handleLabelClick(){this.input.focus()}handleRighSlotChange(){var e;this.hasRightSlotContent=(null===(e=this.inputSectionRightSlot)||void 0===e?void 0:e.assignedNodes().length)>0}handleDropdownClick(e){e.preventDefault(),this.dropdownExpanded=!this.dropdownExpanded,this.dispatchEvent(new CustomEvent("input-dropdown-click",{bubbles:!0,composed:!0,detail:{srcEvent:e,expanded:this.dropdownExpanded}}))}get messageType(){return this.messageArr.length>0?this.messageController.determineMessageType(this.messageArr):null}get messages(){return this.messageType?this.messageController.filterMessagesByType(this.messageArr,this.messageType):null}get inputClassMap(){return{"md-input--filled":this.isFilled,colums:!!this.containerSize,[`${this.containerSize}`]:!!this.containerSize,"md-read-only":this.readOnly,"md-disabled":this.disabled,[`md-${this.messageType}`]:!!this.messageType,[`md-input--nested-${this.nestedLevel}`]:!!this.nestedLevel,"md-multi":this.multi,"md-new-momentum":this.newMomentum}}get inputWrapperClassMap(){return{columns:!!this.inputSize,[`${this.inputSize}`]:!!this.inputSize}}get inputTemplateClassMap(){return{"md-input--multiline":this.multiline,"md-input--multi":this.multi,[`md-input--${this.shape}`]:!!this.shape,"md-input--compact":this.compact,"md-input--before":"before"===this.auxiliaryContentPosition||this.searchable,"md-input--after":"after"===this.auxiliaryContentPosition,"md-active":this.isEditing,"md-focus":this.isEditing,"md-read-only":this.readOnly,"md-disable-user-text-input":this.disableUserTextInput,"md-disabled":this.disabled,"md-dirty":!!this.value,"md-has-right-icon":this.hasRightIcon}}get ariaExpandedValue(){return"true"===this.ariaExpanded||"false"===this.ariaExpanded?this.ariaExpanded:void 0}get hasRightIcon(){return!(!this.clear||this.disabled||!this.value||this.readOnly)||!!this.showDropdown||!this.compact&&this.hasRightSlotContent}inputTemplate(){var e;return this.multiline?p.html`
+"use strict";(self["momentum-web-components-[id]"]=self["momentum-web-components-[id]"]||[]).push([[6408],{96408:(e,t,i)=>{i(20109),i(61200),i(6396),i(12176);var s,a=i(90195),o=i(31890),n=i(32972),r=i(4313),l=(i(32022),i(87161)),p=i(70429),d=i(85125),h=i(20291),u=i(58175),m=i(10318),c=i(13739),y=function(e,t,i,s){var a,o=arguments.length,n=o<3?t:null===s?s=Object.getOwnPropertyDescriptor(t,i):s;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)n=Reflect.decorate(e,t,i,s);else for(var r=e.length-1;r>=0;r--)(a=e[r])&&(n=(o<3?a(n):o>3?a(t,i,n):a(t,i))||n);return o>3&&n&&Object.defineProperty(t,i,n),n};!function(e){class t{determineMessageType(e){return e.reduce((e,t)=>"error"===t?e:t.type,"")}filterMessagesByType(e,t){return e.reduce((e,i)=>i.type===t?e.concat(i.message):e,[])}}e.MessageController=t;let i=class extends((0,n.y)(l.LitElement)){constructor(){super(...arguments),this.ariaDescribedBy="",this.ariaInvalid="false",this.ariaLabel="input",this.autofocus=!1,this.auxiliaryContentPosition=null,this.clear=!1,this.clearAriaLabel="",this.compact=!1,this.containerSize="small-12",this.disabled=!1,this.id="",this.inputSize="",this.isFilled=!1,this.isLoading=!1,this.label="",this.helpText="",this.hideMessage=!1,this.htmlId="",this.ariaRole=void 0,this.messageArr=[],this.min=void 0,this.max=void 0,this.maxLength=void 0,this.multi=!1,this.multiline=!1,this.name="",this.nestedLevel=0,this.placeholder="",this.readOnly=!1,this.required=!1,this.searchable=!1,this.secondaryLabel="",this.selectWhenInFocus=!1,this.shape="",this.type="text",this.value="",this.ariaControls="",this.ariaExpanded="",this.newMomentum=!1,this.disableUserTextInput=!1,this.autocomplete=void 0,this.showDropdown=!1,this.dropdownExpanded=!1,this.dropdownAriaLabel="Show options",this.maxSuggestedLength=void 0,this.isEditing=!1,this.hasRightSlotContent=!1,this.messageController=new t}connectedCallback(){super.connectedCallback(),document.addEventListener("click",this.handleOutsideClick)}disconnectedCallback(){super.disconnectedCallback(),document.removeEventListener("click",this.handleOutsideClick)}select(){var e;null===(e=this.input)||void 0===e||e.select()}focus(){var e;null===(e=this.input)||void 0===e||e.focus()}handleOutsideClick(e){let t=!1;const i=e.composedPath();i.length&&(t=!!i.find(e=>e===this),t||(this.input.blur(),this.isEditing=!1))}handleKeyDown(e){this.dispatchEvent(new CustomEvent("input-keydown",{bubbles:!0,composed:!0,detail:{srcEvent:e}}))}handleFocus(e){this.disabled||(this.isEditing=!0,this.selectWhenInFocus&&this.select(),this.dispatchEvent(new CustomEvent("input-focus",{bubbles:!0,composed:!0,detail:{srcEvent:e}})))}handleMouseDown(e){this.disabled||(this.isEditing=!0,this.dispatchEvent(new CustomEvent("input-mousedown",{bubbles:!0,composed:!0,detail:{srcEvent:e}})))}handleChange(e){var t;this.value=e.target.value,null===(t=this.control)||void 0===t||t.setValue(this.value),this.dispatchEvent(new CustomEvent("input-change",{bubbles:!0,composed:!0,detail:{srcEvent:e,value:this.value}}))}handleBlur(e){var t;null===(t=this.control)||void 0===t||t.markAsTouched(),this.isEditing=!1,this.dispatchEvent(new CustomEvent("input-blur",{bubbles:!0,composed:!0,detail:{srcEvent:e}}))}handleClear(e){if("keydown"===e.type){const{code:t}=e;if(t!==a.Uz.Space&&t!==a.Uz.Enter)return;e.preventDefault(),e.stopPropagation()}else"click"===e.type&&(e.preventDefault(),e.stopPropagation());this.input.focus(),this.dispatchEvent(new CustomEvent("input-clear",{bubbles:!0,composed:!0,detail:{srcEvent:e}})),document.dispatchEvent(new CustomEvent("on-widget-update")),this.handleChange(e)}handleLabelClick(){this.input.focus()}handleRighSlotChange(){var e;this.hasRightSlotContent=(null===(e=this.inputSectionRightSlot)||void 0===e?void 0:e.assignedNodes().length)>0}handleDropdownClick(e){e.preventDefault(),this.dropdownExpanded=!this.dropdownExpanded,this.dispatchEvent(new CustomEvent("input-dropdown-click",{bubbles:!0,composed:!0,detail:{srcEvent:e,expanded:this.dropdownExpanded}}))}get messageType(){return this.messageArr.length>0?this.messageController.determineMessageType(this.messageArr):null}get messages(){return this.messageType?this.messageController.filterMessagesByType(this.messageArr,this.messageType):null}get inputClassMap(){return{"md-input--filled":this.isFilled,colums:!!this.containerSize,[`${this.containerSize}`]:!!this.containerSize,"md-read-only":this.readOnly,"md-disabled":this.disabled,[`md-${this.messageType}`]:!!this.messageType,[`md-input--nested-${this.nestedLevel}`]:!!this.nestedLevel,"md-multi":this.multi,"md-new-momentum":this.newMomentum}}get inputWrapperClassMap(){return{columns:!!this.inputSize,[`${this.inputSize}`]:!!this.inputSize}}get inputTemplateClassMap(){return{"md-input--multiline":this.multiline,"md-input--multi":this.multi,[`md-input--${this.shape}`]:!!this.shape,"md-input--compact":this.compact,"md-input--before":"before"===this.auxiliaryContentPosition||this.searchable,"md-input--after":"after"===this.auxiliaryContentPosition,"md-active":this.isEditing,"md-focus":this.isEditing,"md-read-only":this.readOnly,"md-disable-user-text-input":this.disableUserTextInput,"md-disabled":this.disabled,"md-dirty":!!this.value,"md-has-right-icon":this.hasRightIcon}}get ariaExpandedValue(){return"true"===this.ariaExpanded||"false"===this.ariaExpanded?this.ariaExpanded:void 0}get hasRightIcon(){return!(!this.clear||this.disabled||!this.value||this.readOnly)||!!this.showDropdown||!this.compact&&this.hasRightSlotContent}inputTemplate(){var e;return this.multiline?l.html`
             <textarea
               part="input"
               class="md-input ${(0,d.classMap)(this.inputTemplateClassMap)}"
@@ -20,8 +20,9 @@
               placeholder=${this.placeholder}
               ?readonly=${this.readOnly}
               maxlength=${(0,h.ifDefined)(this.maxLength)}
+              autocomplete=${(0,h.ifDefined)(this.autocomplete)}
             ></textarea>
-          `:p.html`
+          `:l.html`
             <input
               part="input"
               class="md-input ${(0,d.classMap)(this.inputTemplateClassMap)}"
@@ -43,23 +44,24 @@
               aria-errormessage=${`${this.htmlId}-message`}
               aria-disabled=${(0,h.ifDefined)(this.disabled||void 0)}
               id=${this.htmlId}
-              role=${this.role}
+              role=${(0,h.ifDefined)(this.ariaRole)}
               placeholder=${this.placeholder}
               ?readonly=${this.readOnly||this.disabled||this.disableUserTextInput}
               min=${(0,h.ifDefined)(this.min)}
               max=${(0,h.ifDefined)(this.max)}
               maxlength=${(0,h.ifDefined)(this.maxLength)}
               aria-haspopup=${(0,h.ifDefined)(this.showDropdown?"true":void 0)}
+              autocomplete=${(0,h.ifDefined)(this.autocomplete)}
             />
-          `}inputLeftTemplate(){return this.searchable?p.html`
+          `}inputLeftTemplate(){return this.searchable?l.html`
           <div class="md-input__before">
-            ${this.isLoading?p.html` <md-spinner size="20"></md-spinner> `:p.html` <md-icon ariaHidden="true" name="search-bold" size="16" iconSet="momentumDesign"></md-icon> `}
+            ${this.isLoading?l.html` <md-spinner size="20"></md-spinner> `:l.html` <md-icon ariaHidden="true" name="search-bold" size="16" iconSet="momentumDesign"></md-icon> `}
           </div>
-        `:"before"===this.auxiliaryContentPosition?p.html`
+        `:"before"===this.auxiliaryContentPosition?l.html`
               <div class="md-input__before">
                 <slot name="input-section"> </slot>
               </div>
-            `:p.nothing}get inputRightTemplateClassMap(){return{"md-input__after":!0,hidden:!this.hasRightIcon}}inputRightTemplate(){return this.clear&&!this.disabled&&this.value&&!this.readOnly?p.html`
+            `:l.nothing}get inputRightTemplateClassMap(){return{"md-input__after":!0,hidden:!this.hasRightIcon}}inputRightTemplate(){return this.clear&&!this.disabled&&this.value&&!this.readOnly?l.html`
           <div class="md-input__after">
             <md-button
               hasRemoveStyle
@@ -79,12 +81,12 @@
             </md-button>
             ${this.comboBoxButtonTemplate}
           </div>
-        `:this.compact?this.showDropdown?p.html` <div class=${(0,d.classMap)(this.inputRightTemplateClassMap)}>${this.comboBoxButtonTemplate}</div> `:void 0:p.html`
+        `:this.compact?this.showDropdown?l.html` <div class=${(0,d.classMap)(this.inputRightTemplateClassMap)}>${this.comboBoxButtonTemplate}</div> `:void 0:l.html`
           <div class=${(0,d.classMap)(this.inputRightTemplateClassMap)}>
             <slot name="input-section-right" @slotchange=${this.handleRighSlotChange}></slot>
             ${this.comboBoxButtonTemplate}
           </div>
-        `}get comboBoxButtonTemplate(){return this.showDropdown?p.html`
+        `}get comboBoxButtonTemplate(){return this.showDropdown?l.html`
             <button
               class="md-input__dropdown-button"
               tabindex="-1"
@@ -102,7 +104,12 @@
               >
               </md-icon>
             </button>
-          `:p.nothing}secondaryLabelTemplate(){return this.secondaryLabel?p.html`
+          `:l.nothing}characterCountLabelTemplate(){return!this.maxSuggestedLength||this.disabled||this.readOnly?l.nothing:l.html`<div class="md-input__character-count-label-container">
+            <span
+              class="md-input__character-count-label ${(0,d.classMap)({error:this.value.length>this.maxSuggestedLength})}"
+              >${this.value.length}/${this.maxSuggestedLength}</span
+            >
+          </div> `}secondaryLabelTemplate(){return this.secondaryLabel?l.html`
             <md-label
               class="md-input__secondary-label ${(0,d.classMap)({disabled:this.disabled,newMomentum:this.newMomentum})}"
               secondaryLabel
@@ -110,15 +117,15 @@
               .label=${this.secondaryLabel}
               @label-click=${()=>this.handleLabelClick()}
             ></md-label>
-          `:p.nothing}helpTextTemplate(){return this.helpText?p.html`
+          `:l.nothing}helpTextTemplate(){return this.helpText?l.html`
             <md-help-text
               class="help-text ${(0,d.classMap)({disabled:this.disabled,newMomentum:this.newMomentum})}"
               .message=${this.helpText}
               style=${(0,m.styleMap)({width:"100%"})}
             ></md-help-text>
-          `:p.nothing}messagesTemplate(){return!this.hideMessage&&this.messages&&this.messages.length?p.html`
+          `:l.nothing}messagesTemplate(){return!this.hideMessage&&this.messages&&this.messages.length?l.html`
             <div id="${this.htmlId}-message" part="message" class="md-input__messages">
-              ${(0,u.repeat)(this.messages,(e,t)=>{var i,s;return p.html`
+              ${(0,u.repeat)(this.messages,(e,t)=>{var i,s;return l.html`
                   <md-help-text
                     .message=${e}
                     .id=${null!==(i=this.messageArr[t].id)&&void 0!==i?i:""}
@@ -127,19 +134,24 @@
                   ></md-help-text>
                 `})}
             </div>
-          `:p.nothing}labelTemplate(){return this.label?p.html`
+          `:l.nothing}labelTemplate(){return this.label?l.html`
             <md-label
               class="md-input__label ${(0,d.classMap)({disabled:this.disabled,newMomentum:this.newMomentum})}"
               .htmlFor=${this.htmlId}
               .label=${this.label}
               @label-click=${()=>this.handleLabelClick()}
             ></md-label>
-          `:p.nothing}static get styles(){return[r.A,c.A]}render(){return p.html`
+          `:l.nothing}static get styles(){return[r.A,c.A]}render(){return l.html`
         <div class="md-input-container ${(0,d.classMap)(this.inputClassMap)}" part="md-input-container">
           ${this.labelTemplate()}
           <div class="md-input__wrapper ${(0,d.classMap)(this.inputWrapperClassMap)}">
             ${this.inputLeftTemplate()} ${this.inputTemplate()} ${this.inputRightTemplate()}
           </div>
-          ${this.messagesTemplate()} ${this.secondaryLabelTemplate()} ${this.helpTextTemplate()}
+          <div class="md-input__all-sub-labels-container">
+            <div class="md-input__info-and-error-labels-container">
+              ${this.messagesTemplate()} ${this.secondaryLabelTemplate()} ${this.helpTextTemplate()}
+            </div>
+            ${this.characterCountLabelTemplate()}
+          </div>
         </div>
-      `}};y([(0,l.property)({type:String})],i.prototype,"ariaDescribedBy",void 0),y([(0,l.property)({type:String,reflect:!0})],i.prototype,"ariaInvalid",void 0),y([(0,l.property)({type:String})],i.prototype,"ariaLabel",void 0),y([(0,l.property)({type:Boolean,reflect:!0})],i.prototype,"autofocus",void 0),y([(0,l.property)({type:String})],i.prototype,"auxiliaryContentPosition",void 0),y([(0,l.property)({type:Boolean})],i.prototype,"clear",void 0),y([(0,l.property)({type:String})],i.prototype,"clearAriaLabel",void 0),y([(0,l.property)({type:Boolean})],i.prototype,"compact",void 0),y([(0,l.property)({type:String})],i.prototype,"containerSize",void 0),y([(0,l.property)({type:Boolean})],i.prototype,"disabled",void 0),y([(0,l.property)({type:String})],i.prototype,"id",void 0),y([(0,l.property)({type:String})],i.prototype,"inputSize",void 0),y([(0,l.property)({type:Boolean})],i.prototype,"isFilled",void 0),y([(0,l.property)({type:Boolean})],i.prototype,"isLoading",void 0),y([(0,l.property)({type:String})],i.prototype,"label",void 0),y([(0,l.property)({type:String})],i.prototype,"helpText",void 0),y([(0,l.property)({type:Boolean,attribute:"hide-message",reflect:!0})],i.prototype,"hideMessage",void 0),y([(0,l.property)({type:String})],i.prototype,"htmlId",void 0),y([(0,l.property)({type:String})],i.prototype,"role",void 0),y([(0,l.property)({type:Array})],i.prototype,"messageArr",void 0),y([(0,l.property)({type:Number,reflect:!0})],i.prototype,"min",void 0),y([(0,l.property)({type:Number,reflect:!0})],i.prototype,"max",void 0),y([(0,l.property)({type:Number})],i.prototype,"maxLength",void 0),y([(0,l.property)({type:Boolean})],i.prototype,"multi",void 0),y([(0,l.property)({type:Boolean})],i.prototype,"multiline",void 0),y([(0,l.property)({type:String,reflect:!0})],i.prototype,"name",void 0),y([(0,l.property)({type:Number})],i.prototype,"nestedLevel",void 0),y([(0,l.property)({type:String})],i.prototype,"placeholder",void 0),y([(0,l.property)({type:Boolean})],i.prototype,"readOnly",void 0),y([(0,l.property)({type:Boolean})],i.prototype,"required",void 0),y([(0,l.property)({type:Boolean})],i.prototype,"searchable",void 0),y([(0,l.property)({type:String})],i.prototype,"secondaryLabel",void 0),y([(0,l.property)({type:Boolean,attribute:"select-when-in-focus"})],i.prototype,"selectWhenInFocus",void 0),y([(0,l.property)({type:String})],i.prototype,"shape",void 0),y([(0,l.property)({type:String})],i.prototype,"type",void 0),y([(0,l.property)({type:String,reflect:!0})],i.prototype,"value",void 0),y([(0,l.property)({type:String})],i.prototype,"ariaControls",void 0),y([(0,l.property)({type:String})],i.prototype,"ariaExpanded",void 0),y([(0,l.property)({type:Boolean})],i.prototype,"newMomentum",void 0),y([(0,l.property)({type:Object})],i.prototype,"control",void 0),y([(0,l.property)({type:Boolean})],i.prototype,"disableUserTextInput",void 0),y([(0,l.property)({type:Boolean})],i.prototype,"showDropdown",void 0),y([(0,l.property)({type:Boolean})],i.prototype,"dropdownExpanded",void 0),y([(0,l.property)({type:String})],i.prototype,"dropdownAriaLabel",void 0),y([(0,l.query)(".md-input")],i.prototype,"input",void 0),y([(0,l.state)()],i.prototype,"isEditing",void 0),y([(0,l.query)('slot[name="input-section-right"]')],i.prototype,"inputSectionRightSlot",void 0),y([(0,l.state)()],i.prototype,"hasRightSlotContent",void 0),i=y([(0,a.w)("md-input")],i),e.ELEMENT=i}(s||(s={}))}}]);
+      `}};y([(0,p.property)({type:String})],i.prototype,"ariaDescribedBy",void 0),y([(0,p.property)({type:String,reflect:!0})],i.prototype,"ariaInvalid",void 0),y([(0,p.property)({type:String})],i.prototype,"ariaLabel",void 0),y([(0,p.property)({type:Boolean,reflect:!0})],i.prototype,"autofocus",void 0),y([(0,p.property)({type:String})],i.prototype,"auxiliaryContentPosition",void 0),y([(0,p.property)({type:Boolean})],i.prototype,"clear",void 0),y([(0,p.property)({type:String})],i.prototype,"clearAriaLabel",void 0),y([(0,p.property)({type:Boolean})],i.prototype,"compact",void 0),y([(0,p.property)({type:String})],i.prototype,"containerSize",void 0),y([(0,p.property)({type:Boolean})],i.prototype,"disabled",void 0),y([(0,p.property)({type:String})],i.prototype,"id",void 0),y([(0,p.property)({type:String})],i.prototype,"inputSize",void 0),y([(0,p.property)({type:Boolean})],i.prototype,"isFilled",void 0),y([(0,p.property)({type:Boolean})],i.prototype,"isLoading",void 0),y([(0,p.property)({type:String})],i.prototype,"label",void 0),y([(0,p.property)({type:String})],i.prototype,"helpText",void 0),y([(0,p.property)({type:Boolean,attribute:"hide-message",reflect:!0})],i.prototype,"hideMessage",void 0),y([(0,p.property)({type:String})],i.prototype,"htmlId",void 0),y([(0,p.property)({type:String})],i.prototype,"ariaRole",void 0),y([(0,p.property)({type:Array})],i.prototype,"messageArr",void 0),y([(0,p.property)({type:Number,reflect:!0})],i.prototype,"min",void 0),y([(0,p.property)({type:Number,reflect:!0})],i.prototype,"max",void 0),y([(0,p.property)({type:Number})],i.prototype,"maxLength",void 0),y([(0,p.property)({type:Boolean})],i.prototype,"multi",void 0),y([(0,p.property)({type:Boolean})],i.prototype,"multiline",void 0),y([(0,p.property)({type:String,reflect:!0})],i.prototype,"name",void 0),y([(0,p.property)({type:Number})],i.prototype,"nestedLevel",void 0),y([(0,p.property)({type:String})],i.prototype,"placeholder",void 0),y([(0,p.property)({type:Boolean})],i.prototype,"readOnly",void 0),y([(0,p.property)({type:Boolean})],i.prototype,"required",void 0),y([(0,p.property)({type:Boolean})],i.prototype,"searchable",void 0),y([(0,p.property)({type:String})],i.prototype,"secondaryLabel",void 0),y([(0,p.property)({type:Boolean,attribute:"select-when-in-focus"})],i.prototype,"selectWhenInFocus",void 0),y([(0,p.property)({type:String})],i.prototype,"shape",void 0),y([(0,p.property)({type:String})],i.prototype,"type",void 0),y([(0,p.property)({type:String,reflect:!0})],i.prototype,"value",void 0),y([(0,p.property)({type:String})],i.prototype,"ariaControls",void 0),y([(0,p.property)({type:String})],i.prototype,"ariaExpanded",void 0),y([(0,p.property)({type:Boolean})],i.prototype,"newMomentum",void 0),y([(0,p.property)({type:Object})],i.prototype,"control",void 0),y([(0,p.property)({type:Boolean})],i.prototype,"disableUserTextInput",void 0),y([(0,p.property)({type:String})],i.prototype,"autocomplete",void 0),y([(0,p.property)({type:Boolean})],i.prototype,"showDropdown",void 0),y([(0,p.property)({type:Boolean})],i.prototype,"dropdownExpanded",void 0),y([(0,p.property)({type:String})],i.prototype,"dropdownAriaLabel",void 0),y([(0,p.property)({type:Number})],i.prototype,"maxSuggestedLength",void 0),y([(0,p.query)(".md-input")],i.prototype,"input",void 0),y([(0,p.state)()],i.prototype,"isEditing",void 0),y([(0,p.query)('slot[name="input-section-right"]')],i.prototype,"inputSectionRightSlot",void 0),y([(0,p.state)()],i.prototype,"hasRightSlotContent",void 0),i=y([(0,o.w)("md-input")],i),e.ELEMENT=i}(s||(s={}))}}]);

package/dist/679.js

@@ -5,7 +5,7 @@
     presence-type=${null!=t?t:""}
     newMomentum
     >${null!=o?o:a.nothing}</md-avatar
-  >`,s=(e,t,i,n)=>{switch(e.toLowerCase()){case o.r.PROGRESSIVE_CAMPAIGN:case o.r.CALLBACK:case o.r.TELEPHONY:return m(t,i,"channel-call");case o.r.OUTBOUND_TELEPHONY:return m(t,i,"channel-callback");case o.r.INBOUND_TELEPHONY:return m(t,i,"channel-call-inbound");case o.r.APPLE_MESSAGES:return m(t,i,"channel-apple-chat");case o.r.OUTBOUND_CAMPAIGN:return m(t,i,"channel-campaign");case o.r.CHAT:return m(t,i,"channel-chat");case o.r.EMAIL:return m(t,i,"channel-email-inbound");case o.r.SMS:return m(t,i,"channel-sms-inbound");case o.r.FACEBOOK:return m(t,i,"channel-fb-messenger");case o.r.WHATSAPP:return m(t,i,"channel-whats-app");case o.r.MESSENGER:return m(t,i,"channel-facebook");case o.r.MIDCALL_TELEPHONY:return m(t,i,"channel-monitoring");case o.r.OUTBOUND_EMAIL:return m(t,i,"channel-email-outbound");case o.r.OUTBOUND_SMS:return m(t,i,"channel-sms-outbound");case o.r.SOCIAL_X:return m(t,i,"channel-twitter-x");case o.r.VIBER:return m(t,i,"channel-viber");case o.r.WECHAT:return m(t,i,"channel-we-chat");case o.r.WEBEX:return m(t,i,"channel-webex");case o.r.OUTBOUND_CHAT:return m(t,i,"channel-chat-outbound");case o.r.GOOGLE_MESSAGES:return m(t,i,"channel-custom",a.html`<img height="32px" width="32px" src="${n}" />`);case o.r.ICON_SRC:return m(t,i,"channel-custom",a.html`<img height="20px" width="20px" src="${n}" />`);default:return m(t,i,"channel-custom",a.html`<slot name="task-type"></slot>`)}},r=e=>{switch(e){case o.j.CONSULTING:return a.html` <md-icon name="headset-bold" size="12" iconSet="momentumDesign"></md-icon> `;case o.j.PLAY:return a.html` <md-icon name="play-bold" size="12" iconSet="momentumDesign"></md-icon> `;case o.j.HOLD:return a.html` <md-icon name="pause-bold" size="12" iconSet="momentumDesign"></md-icon> `;case o.j.CONFERENCE:return a.html` <md-icon name="meet-bold" size="16" iconSet="momentumDesign"></md-icon> `;case o.j.TRANSFERED:return a.html` <md-icon name="assign-privilege-bold" size="16" iconSet="momentumDesign"></md-icon> `;case o.j.COURTESY_CALLBACK:return a.html` <md-icon name="callrate-bold" size="12" iconSet="momentumDesign"></md-icon> `;case o.j.CAMPAIGN:return a.html` <md-icon name="announcement-bold" size="12" iconSet="momentumDesign"></md-icon> `;default:return a.html` <slot name="task-status"></slot> `}},l=(e,t,i)=>{switch(e.toLowerCase()){case o.r.TELEPHONY:return a.html`
+  >`,s=(e,t,i,n)=>{switch(e.toLowerCase()){case o.r.PROGRESSIVE_CAMPAIGN:case o.r.CALLBACK:return m(t,i,"channel-callback-v2");case o.r.TELEPHONY:return m(t,i,"channel-call");case o.r.OUTBOUND_TELEPHONY:return m(t,i,"channel-callback");case o.r.INBOUND_TELEPHONY:return m(t,i,"channel-call-inbound");case o.r.APPLE_MESSAGES:return m(t,i,"channel-apple-chat");case o.r.OUTBOUND_CAMPAIGN:return m(t,i,"channel-campaign");case o.r.CHAT:return m(t,i,"channel-chat");case o.r.EMAIL:return m(t,i,"channel-email-inbound");case o.r.SMS:return m(t,i,"channel-sms-inbound");case o.r.FACEBOOK:return m(t,i,"channel-fb-messenger");case o.r.WHATSAPP:return m(t,i,"channel-whats-app");case o.r.MESSENGER:return m(t,i,"channel-facebook");case o.r.MIDCALL_TELEPHONY:return m(t,i,"channel-monitoring");case o.r.OUTBOUND_EMAIL:return m(t,i,"channel-email-outbound");case o.r.OUTBOUND_SMS:return m(t,i,"channel-sms-outbound");case o.r.SOCIAL_X:return m(t,i,"channel-twitter-x");case o.r.VIBER:return m(t,i,"channel-viber");case o.r.WECHAT:return m(t,i,"channel-we-chat");case o.r.WEBEX:return m(t,i,"channel-webex");case o.r.OUTBOUND_CHAT:return m(t,i,"channel-chat-outbound");case o.r.GOOGLE_MESSAGES:return m(t,i,"channel-custom",a.html`<img height="32px" width="32px" src="${n}" />`);case o.r.ICON_SRC:return m(t,i,"channel-custom",a.html`<img height="20px" width="20px" src="${n}" />`);default:return m(t,i,"channel-custom",a.html`<slot name="task-type"></slot>`)}},r=e=>{switch(e){case o.j.CONSULTING:return a.html` <md-icon name="headset-bold" size="12" iconSet="momentumDesign"></md-icon> `;case o.j.PLAY:return a.html` <md-icon name="play-bold" size="12" iconSet="momentumDesign"></md-icon> `;case o.j.HOLD:return a.html` <md-icon name="pause-bold" size="12" iconSet="momentumDesign"></md-icon> `;case o.j.CONFERENCE:return a.html` <md-icon name="meet-bold" size="16" iconSet="momentumDesign"></md-icon> `;case o.j.TRANSFERED:return a.html` <md-icon name="assign-privilege-bold" size="16" iconSet="momentumDesign"></md-icon> `;case o.j.COURTESY_CALLBACK:return a.html` <md-icon name="callrate-bold" size="12" iconSet="momentumDesign"></md-icon> `;case o.j.CAMPAIGN:return a.html` <md-icon name="announcement-bold" size="12" iconSet="momentumDesign"></md-icon> `;default:return a.html` <slot name="task-status"></slot> `}},l=(e,t,i)=>{switch(e.toLowerCase()){case o.r.TELEPHONY:return a.html`
         <md-badge color="green" circle>
           <md-icon name="handset-filled" size="20" iconSet="momentumDesign"></md-icon>
         </md-badge>

package/dist/6798.js

@@ -1,11 +1,11 @@
-"use strict";(self["momentum-web-components-[id]"]=self["momentum-web-components-[id]"]||[]).push([[6798],{96798:(t,e,i)=>{var o,a=i(3643),r=(i(12176),i(31890)),s=i(26283),n=i(4313),d=i(87161),p=i(70429),l=i(85125),h=i(20291),y=i(13017),c=function(t,e,i,o){var a,r=arguments.length,s=r<3?e:null===o?o=Object.getOwnPropertyDescriptor(e,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(t,e,i,o);else for(var n=t.length-1;n>=0;n--)(a=t[n])&&(s=(r<3?a(s):r>3?a(e,i,s):a(e,i))||s);return r>3&&s&&Object.defineProperty(e,i,s),s};!function(t){let e=class extends d.LitElement{constructor(){super(...arguments),this._active=!1,this._tabIndex=0,this.ariaLabel="",this.ariaLabelledBy="",this.ariaLive="",this.ariaExpanded="",this.ariaHaspopup="false",this.ariaPressed="",this.circle=!1,this.rounded=!1,this.color="",this.containerLarge=!1,this.disabled=!1,this.href="",this.id="",this.value="",this.keyboardKey="",this.label="",this.loading=!1,this.outline=!1,this.hasRemoveStyle=!1,this.size="32",this.tag="button",this.type="button",this.role="button",this.variant="secondary",this.width="",this.maxWidth="",this.activityType="",this.iconActive=!1,this.isActive=!1,this.renderWidth=()=>this.width?`width: ${this.width};`:d.nothing,this.renderMaxWidth=()=>this.maxWidth?`max-width: ${this.maxWidth};`:d.nothing,this.getStyles=()=>{if(this.width||this.maxWidth)return d.html`
+"use strict";(self["momentum-web-components-[id]"]=self["momentum-web-components-[id]"]||[]).push([[6798],{96798:(t,e,i)=>{var o,a=i(3643),r=(i(12176),i(31890)),s=i(26283),n=i(4313),d=i(87161),p=i(70429),l=i(85125),h=i(20291),y=i(13017),c=function(t,e,i,o){var a,r=arguments.length,s=r<3?e:null===o?o=Object.getOwnPropertyDescriptor(e,i):o;if("object"==typeof Reflect&&"function"==typeof Reflect.decorate)s=Reflect.decorate(t,e,i,o);else for(var n=t.length-1;n>=0;n--)(a=t[n])&&(s=(r<3?a(s):r>3?a(e,i,s):a(e,i))||s);return r>3&&s&&Object.defineProperty(e,i,s),s};!function(t){let e=class extends d.LitElement{constructor(){super(...arguments),this._active=!1,this._tabIndex=0,this.ariaLabel="",this.ariaLabelledBy="",this.ariaLive="",this.ariaExpanded="",this.ariaHaspopup="false",this.ariaPressed="",this.circle=!1,this.rounded=!1,this.color="",this.containerLarge=!1,this.disabled=!1,this.href="",this.id="",this.value="",this.keyboardKey="",this.label="",this.loading=!1,this.outline=!1,this.hasRemoveStyle=!1,this.size="32",this.tag="button",this.type="button",this.role="button",this.variant="secondary",this.width="",this.maxWidth="",this.activityType="",this.iconActive=!1,this.isActive=!1,this.autofocus=!1,this.renderWidth=()=>this.width?`width: ${this.width};`:d.nothing,this.renderMaxWidth=()=>this.maxWidth?`max-width: ${this.maxWidth};`:d.nothing,this.getStyles=()=>{if(this.width||this.maxWidth)return d.html`
           <style>
             :host .md-button--${this.size} {
               ${this.renderWidth()};
               ${this.renderMaxWidth()};
             }
           </style>
-        `},this.iconTemplate=()=>this.loading?d.html` <md-spinner size="16"></md-spinner> `:d.html` <slot name="icon"></slot> `,this.textTemplate=()=>this.circle&&this.hasIcon?d.nothing:d.html` <slot name="text"></slot> `}get active(){return this._active}set active(t){const e=this._active;this._active=t,this.requestUpdate("active",e)}get tabIndex(){return this._tabIndex}set tabIndex(t){const e=this._tabIndex;this._tabIndex=t,this.requestUpdate("tabIndex",e)}handleKeyDown(t){if(this.disabled)return;const{code:e}=t;(0,s.o)(e)&&this.dispatchEvent(new CustomEvent("button-keydown",{composed:!0,bubbles:!0,detail:{srcEvent:t}}))}handleClick(t){var e;this.disabled||(null===(e=this.clickFunction)||void 0===e||e.call(this),this.dispatchEvent(new CustomEvent("button-click",{composed:!0,bubbles:!0,detail:{srcEvent:t}})))}static get styles(){return[n.A,y.A,a.A]}get buttonClassMap(){return{"md-button--circle":this.circle,"md-button--rounded":this.rounded,"md-button--none":this.hasRemoveStyle,"md-button--outline":this.outline,active:this.active&&!this.disabled,disabled:this.disabled&&!this.active,isActive:this.isActive,[`md-button--${this.size}`]:!this.hasRemoveStyle,[`md-button--${this.color}`]:!this.hasRemoveStyle&&!!this.color,[`md-activity__${this.activityType}`]:!!this.activityType,"md-activity":!!this.activityType,"md-button--icon":this.iconActive,"md-button--onlyicon":this.hasIcon&&!this.slottedText,"md-button--placeholder-text":!0===this.isPlaceholderText}}get slottedText(){var t;return null===(t=this.querySelector("[slot=text]"))||void 0===t?void 0:t.textContent}get hasIcon(){return null!==this.querySelector("[slot=icon]")||this.loading}childrenTemplate(){return d.html`
+        `},this.iconTemplate=()=>this.loading?d.html` <md-spinner size="16"></md-spinner> `:d.html` <slot name="icon"></slot> `,this.textTemplate=()=>this.circle&&this.hasIcon?d.nothing:d.html` <slot name="text"></slot> `}get active(){return this._active}set active(t){const e=this._active;this._active=t,this.requestUpdate("active",e)}get tabIndex(){return this._tabIndex}set tabIndex(t){const e=this._tabIndex;this._tabIndex=t,this.requestUpdate("tabIndex",e)}firstUpdated(t){super.firstUpdated(t),this.autofocus&&requestAnimationFrame(()=>{this.manageAutoFocus()})}manageAutoFocus(t=this){t.focus()}focus(){var t;null===(t=this.button)||void 0===t||t.focus()}blur(){var t;null===(t=this.button)||void 0===t||t.blur()}handleKeyDown(t){if(this.disabled)return;const{code:e}=t;(0,s.o)(e)&&this.dispatchEvent(new CustomEvent("button-keydown",{composed:!0,bubbles:!0,detail:{srcEvent:t}}))}handleClick(t){var e;this.disabled||(null===(e=this.clickFunction)||void 0===e||e.call(this),this.dispatchEvent(new CustomEvent("button-click",{composed:!0,bubbles:!0,detail:{srcEvent:t}})))}static get styles(){return[n.A,y.A,a.A]}get buttonClassMap(){return{"md-button--circle":this.circle,"md-button--rounded":this.rounded,"md-button--none":this.hasRemoveStyle,"md-button--outline":this.outline,active:this.active&&!this.disabled,disabled:this.disabled&&!this.active,isActive:this.isActive,[`md-button--${this.size}`]:!this.hasRemoveStyle,[`md-button--${this.color}`]:!this.hasRemoveStyle&&!!this.color,[`md-activity__${this.activityType}`]:!!this.activityType,"md-activity":!!this.activityType,"md-button--icon":this.iconActive,"md-button--onlyicon":this.hasIcon&&!this.slottedText,"md-button--placeholder-text":!0===this.isPlaceholderText}}get slottedText(){var t;return null===(t=this.querySelector("[slot=text]"))||void 0===t?void 0:t.textContent}get hasIcon(){return null!==this.querySelector("[slot=icon]")||this.loading}childrenTemplate(){return d.html`
         <span part="button-children" class="md-button__children">
           ${this.iconTemplate()} ${this.textTemplate()}
           <slot></slot>
@@ -76,4 +76,4 @@
                 <div part="button-label" class="md-button__label">${this.label}</div>
               </div>
             `:d.html` ${this.buttonTemplate(this.tag)} `}
-      `}};c([(0,p.property)({type:Boolean,reflect:!0})],e.prototype,"active",null),c([(0,p.property)({type:Number,attribute:"tab-index",reflect:!0})],e.prototype,"tabIndex",null),c([(0,p.property)({type:String})],e.prototype,"ariaLabel",void 0),c([(0,p.property)({type:String})],e.prototype,"ariaLabelledBy",void 0),c([(0,p.property)({type:String})],e.prototype,"ariaLive",void 0),c([(0,p.property)({type:String})],e.prototype,"ariaExpanded",void 0),c([(0,p.property)({type:String})],e.prototype,"ariaHaspopup",void 0),c([(0,p.property)({type:String})],e.prototype,"ariaPressed",void 0),c([(0,p.property)({type:Boolean})],e.prototype,"circle",void 0),c([(0,p.property)({type:Boolean})],e.prototype,"rounded",void 0),c([(0,p.property)({type:String})],e.prototype,"color",void 0),c([(0,p.property)({type:Boolean})],e.prototype,"containerLarge",void 0),c([(0,p.property)({type:Boolean})],e.prototype,"disabled",void 0),c([(0,p.property)({type:String})],e.prototype,"href",void 0),c([(0,p.property)({type:String})],e.prototype,"id",void 0),c([(0,p.property)({type:String})],e.prototype,"value",void 0),c([(0,p.property)({type:String})],e.prototype,"keyboardKey",void 0),c([(0,p.property)({type:String})],e.prototype,"label",void 0),c([(0,p.property)({type:Boolean})],e.prototype,"loading",void 0),c([(0,p.property)({type:Boolean})],e.prototype,"outline",void 0),c([(0,p.property)({type:Boolean})],e.prototype,"hasRemoveStyle",void 0),c([(0,p.property)({type:String})],e.prototype,"size",void 0),c([(0,p.property)({type:String})],e.prototype,"tag",void 0),c([(0,p.property)({type:String})],e.prototype,"type",void 0),c([(0,p.property)({type:String})],e.prototype,"role",void 0),c([(0,p.property)({type:String})],e.prototype,"variant",void 0),c([(0,p.property)({type:String})],e.prototype,"width",void 0),c([(0,p.property)({type:String})],e.prototype,"maxWidth",void 0),c([(0,p.property)({type:String})],e.prototype,"activityType",void 0),c([(0,p.property)({type:Boolean})],e.prototype,"iconActive",void 0),c([(0,p.property)({type:Boolean})],e.prototype,"isActive",void 0),c([(0,p.property)({type:String,attribute:"aria-describedby"})],e.prototype,"ariaDescribedBy",void 0),c([(0,p.property)({attribute:!1})],e.prototype,"clickFunction",void 0),c([(0,p.property)({type:Boolean,attribute:"is-placeholder-text"})],e.prototype,"isPlaceholderText",void 0),c([(0,p.query)(".md-button")],e.prototype,"button",void 0),e=c([(0,r.w)("md-button")],e),t.ELEMENT=e}(o||(o={}))}}]);
+      `}};c([(0,p.property)({type:Boolean,reflect:!0})],e.prototype,"active",null),c([(0,p.property)({type:Number,attribute:"tab-index",reflect:!0})],e.prototype,"tabIndex",null),c([(0,p.property)({type:String})],e.prototype,"ariaLabel",void 0),c([(0,p.property)({type:String})],e.prototype,"ariaLabelledBy",void 0),c([(0,p.property)({type:String})],e.prototype,"ariaLive",void 0),c([(0,p.property)({type:String})],e.prototype,"ariaExpanded",void 0),c([(0,p.property)({type:String})],e.prototype,"ariaHaspopup",void 0),c([(0,p.property)({type:String})],e.prototype,"ariaPressed",void 0),c([(0,p.property)({type:Boolean})],e.prototype,"circle",void 0),c([(0,p.property)({type:Boolean})],e.prototype,"rounded",void 0),c([(0,p.property)({type:String})],e.prototype,"color",void 0),c([(0,p.property)({type:Boolean})],e.prototype,"containerLarge",void 0),c([(0,p.property)({type:Boolean})],e.prototype,"disabled",void 0),c([(0,p.property)({type:String})],e.prototype,"href",void 0),c([(0,p.property)({type:String})],e.prototype,"id",void 0),c([(0,p.property)({type:String})],e.prototype,"value",void 0),c([(0,p.property)({type:String})],e.prototype,"keyboardKey",void 0),c([(0,p.property)({type:String})],e.prototype,"label",void 0),c([(0,p.property)({type:Boolean})],e.prototype,"loading",void 0),c([(0,p.property)({type:Boolean})],e.prototype,"outline",void 0),c([(0,p.property)({type:Boolean})],e.prototype,"hasRemoveStyle",void 0),c([(0,p.property)({type:String})],e.prototype,"size",void 0),c([(0,p.property)({type:String})],e.prototype,"tag",void 0),c([(0,p.property)({type:String})],e.prototype,"type",void 0),c([(0,p.property)({type:String})],e.prototype,"role",void 0),c([(0,p.property)({type:String})],e.prototype,"variant",void 0),c([(0,p.property)({type:String})],e.prototype,"width",void 0),c([(0,p.property)({type:String})],e.prototype,"maxWidth",void 0),c([(0,p.property)({type:String})],e.prototype,"activityType",void 0),c([(0,p.property)({type:Boolean})],e.prototype,"iconActive",void 0),c([(0,p.property)({type:Boolean})],e.prototype,"isActive",void 0),c([(0,p.property)({type:String,attribute:"aria-describedby"})],e.prototype,"ariaDescribedBy",void 0),c([(0,p.property)({attribute:!1})],e.prototype,"clickFunction",void 0),c([(0,p.property)({type:Boolean,attribute:"is-placeholder-text"})],e.prototype,"isPlaceholderText",void 0),c([(0,p.property)({type:Boolean,reflect:!0})],e.prototype,"autofocus",void 0),c([(0,p.query)(".md-button")],e.prototype,"button",void 0),e=c([(0,r.w)("md-button")],e),t.ELEMENT=e}(o||(o={}))}}]);