@namiml/web-sdk 3.4.7-dev.202607230540 → 3.4.7-dev.202607231500

package/dist/components/elements/TextInput.d.ts

@@ -1,6 +1,6 @@
 import { type TTextInputComponent } from "@namiml/sdk-core";
 import { NamiElement } from "../NamiElement";
-import { type CSSResult } from "lit";
+import { type CSSResult, type PropertyValueMap } from "lit";
 export declare class NamiTextInput extends NamiElement<TTextInputComponent> {
     component: TTextInputComponent;
     inFocusedState: boolean;
@@ -9,8 +9,11 @@ export declare class NamiTextInput extends NamiElement<TTextInputComponent> {
     private _value;
     /** Whether the input currently holds DOM focus. */
     private _focused;
+    /** Ref to the rendered `<input>`, used to drive autofocus (`component.focused`). */
+    private _inputEl?;
     constructor();
     connectedCallback(): void;
+    protected updated(changedProperties: PropertyValueMap<this>): void;
     private get isTelevision();
     /** Map the wire `type` to the validator's `TTextInputType`. */
     private validatorType;

package/dist/nami-web.cjs

@@ -604,7 +604,7 @@
         aria-live="polite"
         aria-atomic="true"
       >${0}</span>
-    `),"indeterminate"===e?"":`width: ${this.currentProgress}%`,"indeterminate"===e?void 0:Math.round(this.currentProgress),"indeterminate"===e?void 0:0,"indeterminate"===e?void 0:100,this.isAnimating,this.screenreaderAnnouncement)}}])}();Ae([ot({type:Object})],eW.prototype,"component",void 0),Ae([ot({type:Number})],eW.prototype,"scaleFactor",void 0),Ae([ot({type:Boolean})],eW.prototype,"inFocusedState",void 0),Ae([ot({type:Object})],eW.prototype,"minSDKVersion",void 0),Ae([st()],eW.prototype,"currentProgress",void 0),Ae([st()],eW.prototype,"isAnimating",void 0),Ae([st()],eW.prototype,"screenreaderAnnouncement",void 0),eW=Ae([Fe("nami-progress-bar")],eW);var tW,iW,nW=e=>e,aW=2,rW=6,oW=20,sW=16,uW=16,lW=function(){function i(){var t;return u(this,i),(t=s(this,i)).inFocusedState=!1,t.scaleFactor=1,t._value="",t._focused=!1,t._handleInput=i=>{var n=i.target.value;t._value=n;var a=t.component,r=a.formId,o=a.validateOn;if(t.contextProvider.setFormState(r,n),"change"===o){var s,u=e.validateTextInput(t.validatorType(),!0===t.component.reqed,n);if(u)t.contextProvider.setFormFieldError(r,null!==(s=t.component.validationMessage)&&void 0!==s?s:u);else t.contextProvider.clearFormFieldError(r)}t.requestUpdate()},t._handleFocus=()=>{t._focused=!0,t.isTelevision||document.addEventListener("pointerdown",t._onOutsidePointerDown,!0),t.requestUpdate()},t._handleBlur=()=>{t._focused=!1,document.removeEventListener("pointerdown",t._onOutsidePointerDown,!0),t.requestUpdate()},t._onOutsidePointerDown=e=>{var i;e.composedPath().includes(t)||null===(i=t.shadowRoot)||void 0===i||null===(i=i.querySelector("input"))||void 0===i||i.blur()},t}return y(i,Ss),m(i,[{key:"connectedCallback",value:function(){var e;M(i,"connectedCallback",this)([]);var t=this.component.formId,n=null===(e=this.contextProvider.state.formStates)||void 0===e?void 0:e[t];this._value="string"==typeof n?n:"",this.contextProvider.setFormState(t,this._value),this.contextProvider.registerFormFieldValidator(t,this.validator())}},{key:"isTelevision",get:function(){return"television"===e.getDeviceFormFactor()}},{key:"validatorType",value:function(){return"email"===this.component.type?"email":"name"}},{key:"validator",value:function(){return{type:this.validatorType(),required:!0===this.component.reqed,message:this.component.validationMessage}}},{key:"currentError",get:function(){return this.contextProvider.getFormFieldErrors()[this.component.formId]}},{key:"disconnectedCallback",value:function(){document.removeEventListener("pointerdown",this._onOutsidePointerDown,!0),M(i,"disconnectedCallback",this)([])}},{key:"styles",value:function(){return t.unsafeCSS(`\n      :host {\n        box-sizing: border-box;\n        display: block;\n        ${"100%"===this.component.width?"width: 100%;":""}\n      }\n      :host .nami-text-input-wrapper {\n        display: flex;\n        flex-direction: column;\n        gap: ${this.resolvedSpacing()}px;\n        ${"100%"===this.component.width?"width: 100%;":""}\n      }\n      :host label {\n        ${this.applyLabelStyles()}\n      }\n      :host input {\n        ${this.applyInputStyles()}\n      }\n      :host input::placeholder {\n        ${this.component.placeholderFontColor?`color: ${this.component.placeholderFontColor};`:""}\n      }\n      :host .nami-text-input-error {\n        ${this.applyErrorStyles()}\n      }\n    `)}},{key:"resolvedSpacing",value:function(){var e=this.component.spacing;return null==e?this.isTelevision?sW:0:Number(e)}},{key:"resolvedBorderWidth",value:function(e){return null==e?this.isTelevision?aW:0:Number(e)}},{key:"applyLabelStyles",value:function(){var e,t=this.component,i=null!==(e=t.labelFontSize)&&void 0!==e?e:this.isTelevision?oW:void 0;return`\n      ${Os(t.labelFontColor||"inherit")}\n      ${qs(t.labelFontName)}\n      ${null!=i?`font-size: ${_s(i,this.scaleFactor)};`:""}\n    `}},{key:"applyInputStyles",value:function(){var e,t,i,n,a,r,o,s,u,l,d,h,c=this.component,m=!!this.currentError,f=this._focused,v=c.borderColor||"transparent",p=this.resolvedBorderWidth(c.borderWidth),g=Number(null!==(e=c.borderRadius)&&void 0!==e?e:this.isTelevision?rW:0),y=c.fillColor||"transparent";f&&(v=c.focusedBorderColor||v,p=this.resolvedBorderWidth(null!==(o=c.focusedBorderWidth)&&void 0!==o?o:c.borderWidth),g=Number(null!==(s=null!==(u=c.focusedBorderRadius)&&void 0!==u?u:c.borderRadius)&&void 0!==s?s:g),y=c.focusedFillColor||y);m&&(v=c.errorBorderColor||v,p=this.resolvedBorderWidth(null!==(l=c.errorBorderWidth)&&void 0!==l?l:c.borderWidth),g=Number(null!==(d=null!==(h=c.errorBorderRadius)&&void 0!==h?h:c.borderRadius)&&void 0!==d?d:g));var b=null!==(t=c.fontSize)&&void 0!==t?t:this.isTelevision?oW:void 0,w=null!==(i=c.innerTopPadding)&&void 0!==i?i:this.isTelevision?uW:0,k=null!==(n=c.innerBottomPadding)&&void 0!==n?n:this.isTelevision?uW:0,S=null!==(a=c.innerLeftPadding)&&void 0!==a?a:this.isTelevision?uW:0,E=null!==(r=c.innerRightPadding)&&void 0!==r?r:this.isTelevision?uW:0;return`\n      box-sizing: border-box;\n      width: 100%;\n      outline: none;\n      ${Os(c.fontColor||"inherit")}\n      ${qs(c.fontName)}\n      ${null!=b?`font-size: ${_s(b,this.scaleFactor)};`:""}\n      ${Rs(y)}\n      ${Fs(v)}\n      border-style: solid;\n      border-width: ${p}px !important;\n      border-radius: ${g}px !important;\n      padding: ${Number(w)}px ${Number(E)}px ${Number(k)}px ${Number(S)}px !important;\n      text-align: ${c.alignment||"left"};\n    `}},{key:"applyErrorStyles",value:function(){var e,t=this.component,i=null!==(e=t.validationTextFontSize)&&void 0!==e?e:this.isTelevision?oW:void 0;return`\n      ${Os(t.validationTextFontColor||"#D83A58")}\n      ${qs(t.validationTextFontName)}\n      ${null!=i?`font-size: ${_s(i,this.scaleFactor)};`:""}\n    `}},{key:"render",value:function(){var e,i,n,a,r=this.component,o=`nami-text-input-${r.formId}`,s=this.currentError,u="none"!==r.labelPosition&&!!r.labelText,l=!0===r.reqed?`${r.labelText} *`:r.labelText,d="email"===r.type?"email":"text",h="email"===r.type?"email":"text";return t.html(tW||(tW=nW`
+    `),"indeterminate"===e?"":`width: ${this.currentProgress}%`,"indeterminate"===e?void 0:Math.round(this.currentProgress),"indeterminate"===e?void 0:0,"indeterminate"===e?void 0:100,this.isAnimating,this.screenreaderAnnouncement)}}])}();Ae([ot({type:Object})],eW.prototype,"component",void 0),Ae([ot({type:Number})],eW.prototype,"scaleFactor",void 0),Ae([ot({type:Boolean})],eW.prototype,"inFocusedState",void 0),Ae([ot({type:Object})],eW.prototype,"minSDKVersion",void 0),Ae([st()],eW.prototype,"currentProgress",void 0),Ae([st()],eW.prototype,"isAnimating",void 0),Ae([st()],eW.prototype,"screenreaderAnnouncement",void 0),eW=Ae([Fe("nami-progress-bar")],eW);var tW,iW,nW=e=>e,aW=2,rW=6,oW=20,sW=16,uW=16,lW=function(){function i(){var t;return u(this,i),(t=s(this,i)).inFocusedState=!1,t.scaleFactor=1,t._value="",t._focused=!1,t._handleInput=i=>{var n=i.target.value;t._value=n;var a=t.component,r=a.formId,o=a.validateOn;if(t.contextProvider.setFormState(r,n),"change"===o){var s,u=e.validateTextInput(t.validatorType(),!0===t.component.reqed,n);if(u)t.contextProvider.setFormFieldError(r,null!==(s=t.component.validationMessage)&&void 0!==s?s:u);else t.contextProvider.clearFormFieldError(r)}t.requestUpdate()},t._handleFocus=()=>{t._focused=!0,t.isTelevision||document.addEventListener("pointerdown",t._onOutsidePointerDown,!0),t.requestUpdate()},t._handleBlur=()=>{t._focused=!1,document.removeEventListener("pointerdown",t._onOutsidePointerDown,!0),t.requestUpdate()},t._onOutsidePointerDown=e=>{var i;e.composedPath().includes(t)||null===(i=t.shadowRoot)||void 0===i||null===(i=i.querySelector("input"))||void 0===i||i.blur()},t}return y(i,Ss),m(i,[{key:"connectedCallback",value:function(){var e;M(i,"connectedCallback",this)([]);var t=this.component.formId,n=null===(e=this.contextProvider.state.formStates)||void 0===e?void 0:e[t];this._value="string"==typeof n?n:"",this.contextProvider.setFormState(t,this._value),this.contextProvider.registerFormFieldValidator(t,this.validator())}},{key:"updated",value:function(e){if(M(i,"updated",this)([e]),e.has("component")){var t,n=e.get("component"),a=!0===(null==n?void 0:n.focused);if(!0===this.component.focused&&!a)null===(t=this._inputEl)||void 0===t||t.focus({preventScroll:!0})}}},{key:"isTelevision",get:function(){return"television"===e.getDeviceFormFactor()}},{key:"validatorType",value:function(){return"email"===this.component.type?"email":"name"}},{key:"validator",value:function(){return{type:this.validatorType(),required:!0===this.component.reqed,message:this.component.validationMessage}}},{key:"currentError",get:function(){return this.contextProvider.getFormFieldErrors()[this.component.formId]}},{key:"disconnectedCallback",value:function(){document.removeEventListener("pointerdown",this._onOutsidePointerDown,!0),M(i,"disconnectedCallback",this)([])}},{key:"styles",value:function(){return t.unsafeCSS(`\n      :host {\n        box-sizing: border-box;\n        display: block;\n        ${"100%"===this.component.width?"width: 100%;":""}\n      }\n      :host .nami-text-input-wrapper {\n        display: flex;\n        flex-direction: column;\n        gap: ${this.resolvedSpacing()}px;\n        ${"100%"===this.component.width?"width: 100%;":""}\n      }\n      :host label {\n        ${this.applyLabelStyles()}\n      }\n      :host input {\n        ${this.applyInputStyles()}\n      }\n      :host input::placeholder {\n        ${this.component.placeholderFontColor?`color: ${this.component.placeholderFontColor};`:""}\n      }\n      :host .nami-text-input-error {\n        ${this.applyErrorStyles()}\n      }\n    `)}},{key:"resolvedSpacing",value:function(){var e=this.component.spacing;return null==e?this.isTelevision?sW:0:Number(e)}},{key:"resolvedBorderWidth",value:function(e){return null==e?this.isTelevision?aW:0:Number(e)}},{key:"applyLabelStyles",value:function(){var e,t=this.component,i=null!==(e=t.labelFontSize)&&void 0!==e?e:this.isTelevision?oW:void 0;return`\n      ${Os(t.labelFontColor||"inherit")}\n      ${qs(t.labelFontName)}\n      ${null!=i?`font-size: ${_s(i,this.scaleFactor)};`:""}\n    `}},{key:"applyInputStyles",value:function(){var e,t,i,n,a,r,o,s,u,l,d,h,c=this.component,m=!!this.currentError,f=this._focused,v=c.borderColor||"transparent",p=this.resolvedBorderWidth(c.borderWidth),g=Number(null!==(e=c.borderRadius)&&void 0!==e?e:this.isTelevision?rW:0),y=c.fillColor||"transparent";f&&(v=c.focusedBorderColor||v,p=this.resolvedBorderWidth(null!==(o=c.focusedBorderWidth)&&void 0!==o?o:c.borderWidth),g=Number(null!==(s=null!==(u=c.focusedBorderRadius)&&void 0!==u?u:c.borderRadius)&&void 0!==s?s:g),y=c.focusedFillColor||y);m&&(v=c.errorBorderColor||v,p=this.resolvedBorderWidth(null!==(l=c.errorBorderWidth)&&void 0!==l?l:c.borderWidth),g=Number(null!==(d=null!==(h=c.errorBorderRadius)&&void 0!==h?h:c.borderRadius)&&void 0!==d?d:g));var b=null!==(t=c.fontSize)&&void 0!==t?t:this.isTelevision?oW:void 0,w=null!==(i=c.innerTopPadding)&&void 0!==i?i:this.isTelevision?uW:0,k=null!==(n=c.innerBottomPadding)&&void 0!==n?n:this.isTelevision?uW:0,S=null!==(a=c.innerLeftPadding)&&void 0!==a?a:this.isTelevision?uW:0,E=null!==(r=c.innerRightPadding)&&void 0!==r?r:this.isTelevision?uW:0;return`\n      box-sizing: border-box;\n      width: 100%;\n      outline: none;\n      ${Os(c.fontColor||"inherit")}\n      ${qs(c.fontName)}\n      ${null!=b?`font-size: ${_s(b,this.scaleFactor)};`:""}\n      ${Rs(y)}\n      ${Fs(v)}\n      border-style: solid;\n      border-width: ${p}px !important;\n      border-radius: ${g}px !important;\n      padding: ${Number(w)}px ${Number(E)}px ${Number(k)}px ${Number(S)}px !important;\n      text-align: ${c.alignment||"left"};\n    `}},{key:"applyErrorStyles",value:function(){var e,t=this.component,i=null!==(e=t.validationTextFontSize)&&void 0!==e?e:this.isTelevision?oW:void 0;return`\n      ${Os(t.validationTextFontColor||"#D83A58")}\n      ${qs(t.validationTextFontName)}\n      ${null!=i?`font-size: ${_s(i,this.scaleFactor)};`:""}\n    `}},{key:"render",value:function(){var e,i,n,a,r=this.component,o=`nami-text-input-${r.formId}`,s=this.currentError,u="none"!==r.labelPosition&&!!r.labelText,l=!0===r.reqed?`${r.labelText} *`:r.labelText,d="email"===r.type?"email":"text",h="email"===r.type?"email":"text";return t.html(tW||(tW=nW`
       <div class="nami-text-input-wrapper">
         ${0}
         <input
@@ -627,4 +627,4 @@
           aria-live="polite"
         >${0}</div>
       </div>
-    `),u?t.html(iW||(iW=nW`<label for=${0}>${0}</label>`),o,l):t.nothing,o,d,h,this._value,null!==(e=r.placeholderText)&&void 0!==e?e:"",null!==(i=null!==(n=r.screenreaderText)&&void 0!==n?n:l)&&void 0!==i?i:t.nothing,null!==(a=r.screenreaderHint)&&void 0!==a?a:t.nothing,s?"true":t.nothing,s?`${o}-error`:t.nothing,this._handleInput,this._handleFocus,this._handleBlur,`${o}-error`,null!=s?s:"")}}])}();Ae([ot({type:Object})],lW.prototype,"component",void 0),Ae([ot({type:Boolean})],lW.prototype,"inFocusedState",void 0),Ae([ot({type:Number})],lW.prototype,"scaleFactor",void 0),lW=Ae([Fe("nami-text-input")],lW),Object.defineProperty(exports,"LaunchCampaignError",{enumerable:!0,get:function(){return e.LaunchCampaignError}}),Object.defineProperty(exports,"LogLevel",{enumerable:!0,get:function(){return e.LogLevel}}),Object.defineProperty(exports,"Nami",{enumerable:!0,get:function(){return e.Nami}}),Object.defineProperty(exports,"NamiCampaignManager",{enumerable:!0,get:function(){return e.NamiCampaignManager}}),Object.defineProperty(exports,"NamiCampaignRuleType",{enumerable:!0,get:function(){return e.NamiCampaignRuleType}}),Object.defineProperty(exports,"NamiCustomerManager",{enumerable:!0,get:function(){return e.NamiCustomerManager}}),Object.defineProperty(exports,"NamiEntitlementManager",{enumerable:!0,get:function(){return e.NamiEntitlementManager}}),Object.defineProperty(exports,"NamiFlowManager",{enumerable:!0,get:function(){return e.NamiFlowManager}}),Object.defineProperty(exports,"NamiHandoffTag",{enumerable:!0,get:function(){return e.NamiHandoffTag}}),Object.defineProperty(exports,"NamiPaywallAction",{enumerable:!0,get:function(){return e.NamiPaywallAction}}),Object.defineProperty(exports,"NamiPaywallManager",{enumerable:!0,get:function(){return e.NamiPaywallManager}}),Object.defineProperty(exports,"NamiPaywallManagerEvents",{enumerable:!0,get:function(){return e.NamiPaywallManagerEvents}}),Object.defineProperty(exports,"NamiPermissionOutcome",{enumerable:!0,get:function(){return e.NamiPermissionOutcome}}),Object.defineProperty(exports,"NamiPurchaseManager",{enumerable:!0,get:function(){return e.NamiPurchaseManager}}),Object.defineProperty(exports,"_internal",{enumerable:!0,get:function(){return e._internal}}),Object.defineProperty(exports,"isNamiFlowCampaign",{enumerable:!0,get:function(){return e.isNamiFlowCampaign}});
+    `),u?t.html(iW||(iW=nW`<label for=${0}>${0}</label>`),o,l):t.nothing,o,d,h,this._value,null!==(e=r.placeholderText)&&void 0!==e?e:"",null!==(i=null!==(n=r.screenreaderText)&&void 0!==n?n:l)&&void 0!==i?i:t.nothing,null!==(a=r.screenreaderHint)&&void 0!==a?a:t.nothing,s?"true":t.nothing,s?`${o}-error`:t.nothing,this._handleInput,this._handleFocus,this._handleBlur,`${o}-error`,null!=s?s:"")}}])}();Ae([ot({type:Object})],lW.prototype,"component",void 0),Ae([ot({type:Boolean})],lW.prototype,"inFocusedState",void 0),Ae([ot({type:Number})],lW.prototype,"scaleFactor",void 0),Ae([function(e){return(t,i,n)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Reflect.decorate&&"object"!=typeof t&&Object.defineProperty(e,t,i),i))(t,i,{get(){return(t=>{var i,n;return null!==(i=null===(n=t.renderRoot)||void 0===n?void 0:n.querySelector(e))&&void 0!==i?i:null})(this)}})}("input")],lW.prototype,"_inputEl",void 0),lW=Ae([Fe("nami-text-input")],lW),Object.defineProperty(exports,"LaunchCampaignError",{enumerable:!0,get:function(){return e.LaunchCampaignError}}),Object.defineProperty(exports,"LogLevel",{enumerable:!0,get:function(){return e.LogLevel}}),Object.defineProperty(exports,"Nami",{enumerable:!0,get:function(){return e.Nami}}),Object.defineProperty(exports,"NamiCampaignManager",{enumerable:!0,get:function(){return e.NamiCampaignManager}}),Object.defineProperty(exports,"NamiCampaignRuleType",{enumerable:!0,get:function(){return e.NamiCampaignRuleType}}),Object.defineProperty(exports,"NamiCustomerManager",{enumerable:!0,get:function(){return e.NamiCustomerManager}}),Object.defineProperty(exports,"NamiEntitlementManager",{enumerable:!0,get:function(){return e.NamiEntitlementManager}}),Object.defineProperty(exports,"NamiFlowManager",{enumerable:!0,get:function(){return e.NamiFlowManager}}),Object.defineProperty(exports,"NamiHandoffTag",{enumerable:!0,get:function(){return e.NamiHandoffTag}}),Object.defineProperty(exports,"NamiPaywallAction",{enumerable:!0,get:function(){return e.NamiPaywallAction}}),Object.defineProperty(exports,"NamiPaywallManager",{enumerable:!0,get:function(){return e.NamiPaywallManager}}),Object.defineProperty(exports,"NamiPaywallManagerEvents",{enumerable:!0,get:function(){return e.NamiPaywallManagerEvents}}),Object.defineProperty(exports,"NamiPermissionOutcome",{enumerable:!0,get:function(){return e.NamiPermissionOutcome}}),Object.defineProperty(exports,"NamiPurchaseManager",{enumerable:!0,get:function(){return e.NamiPurchaseManager}}),Object.defineProperty(exports,"_internal",{enumerable:!0,get:function(){return e._internal}}),Object.defineProperty(exports,"isNamiFlowCampaign",{enumerable:!0,get:function(){return e.isNamiFlowCampaign}});

package/dist/nami-web.d.ts

@@ -558,8 +558,11 @@ declare class NamiTextInput extends NamiElement<TTextInputComponent> {
     private _value;
     /** Whether the input currently holds DOM focus. */
     private _focused;
+    /** Ref to the rendered `<input>`, used to drive autofocus (`component.focused`). */
+    private _inputEl?;
     constructor();
     connectedCallback(): void;
+    protected updated(changedProperties: PropertyValueMap<this>): void;
     private get isTelevision();
     /** Map the wire `type` to the validator's `TTextInputType`. */
     private validatorType;

package/dist/nami-web.mjs

@@ -604,7 +604,7 @@ import{NAMI_SDK_VERSION as e,getExtendedClientInfo as t,PaywallState as i,logger
         aria-live="polite"
         aria-atomic="true"
       >${0}</span>
-    `),"indeterminate"===e?"":`width: ${this.currentProgress}%`,"indeterminate"===e?void 0:Math.round(this.currentProgress),"indeterminate"===e?void 0:0,"indeterminate"===e?void 0:100,this.isAnimating,this.screenreaderAnnouncement)}}])}();yt([Jt({type:Object})],GW.prototype,"component",void 0),yt([Jt({type:Number})],GW.prototype,"scaleFactor",void 0),yt([Jt({type:Boolean})],GW.prototype,"inFocusedState",void 0),yt([Jt({type:Object})],GW.prototype,"minSDKVersion",void 0),yt([Qt()],GW.prototype,"currentProgress",void 0),yt([Qt()],GW.prototype,"isAnimating",void 0),yt([Qt()],GW.prototype,"screenreaderAnnouncement",void 0),GW=yt([Pt("nami-progress-bar")],GW);var VW,KW,XW=e=>e,YW=2,qW=6,JW=20,QW=16,ZW=16,e$=function(){function e(){var t;return Z(this,e),(t=Q(this,e)).inFocusedState=!1,t.scaleFactor=1,t._value="",t._focused=!1,t._handleInput=e=>{var i=e.target.value;t._value=i;var n=t.component,a=n.formId,r=n.validateOn;if(t.contextProvider.setFormState(a,i),"change"===r){var o,s=j(t.validatorType(),!0===t.component.reqed,i);if(s)t.contextProvider.setFormFieldError(a,null!==(o=t.component.validationMessage)&&void 0!==o?o:s);else t.contextProvider.clearFormFieldError(a)}t.requestUpdate()},t._handleFocus=()=>{t._focused=!0,t.isTelevision||document.addEventListener("pointerdown",t._onOutsidePointerDown,!0),t.requestUpdate()},t._handleBlur=()=>{t._focused=!1,document.removeEventListener("pointerdown",t._onOutsidePointerDown,!0),t.requestUpdate()},t._onOutsidePointerDown=e=>{var i;e.composedPath().includes(t)||null===(i=t.shadowRoot)||void 0===i||null===(i=i.querySelector("input"))||void 0===i||i.blur()},t}return le(e,mu),ae(e,[{key:"connectedCallback",value:function(){var t;ge(e,"connectedCallback",this)([]);var i=this.component.formId,n=null===(t=this.contextProvider.state.formStates)||void 0===t?void 0:t[i];this._value="string"==typeof n?n:"",this.contextProvider.setFormState(i,this._value),this.contextProvider.registerFormFieldValidator(i,this.validator())}},{key:"isTelevision",get:function(){return"television"===m()}},{key:"validatorType",value:function(){return"email"===this.component.type?"email":"name"}},{key:"validator",value:function(){return{type:this.validatorType(),required:!0===this.component.reqed,message:this.component.validationMessage}}},{key:"currentError",get:function(){return this.contextProvider.getFormFieldErrors()[this.component.formId]}},{key:"disconnectedCallback",value:function(){document.removeEventListener("pointerdown",this._onOutsidePointerDown,!0),ge(e,"disconnectedCallback",this)([])}},{key:"styles",value:function(){return H(`\n      :host {\n        box-sizing: border-box;\n        display: block;\n        ${"100%"===this.component.width?"width: 100%;":""}\n      }\n      :host .nami-text-input-wrapper {\n        display: flex;\n        flex-direction: column;\n        gap: ${this.resolvedSpacing()}px;\n        ${"100%"===this.component.width?"width: 100%;":""}\n      }\n      :host label {\n        ${this.applyLabelStyles()}\n      }\n      :host input {\n        ${this.applyInputStyles()}\n      }\n      :host input::placeholder {\n        ${this.component.placeholderFontColor?`color: ${this.component.placeholderFontColor};`:""}\n      }\n      :host .nami-text-input-error {\n        ${this.applyErrorStyles()}\n      }\n    `)}},{key:"resolvedSpacing",value:function(){var e=this.component.spacing;return null==e?this.isTelevision?QW:0:Number(e)}},{key:"resolvedBorderWidth",value:function(e){return null==e?this.isTelevision?YW:0:Number(e)}},{key:"applyLabelStyles",value:function(){var e,t=this.component,i=null!==(e=t.labelFontSize)&&void 0!==e?e:this.isTelevision?JW:void 0;return`\n      ${Au(t.labelFontColor||"inherit")}\n      ${Bu(t.labelFontName)}\n      ${null!=i?`font-size: ${Tu(i,this.scaleFactor)};`:""}\n    `}},{key:"applyInputStyles",value:function(){var e,t,i,n,a,r,o,s,u,l,d,h,c=this.component,m=!!this.currentError,f=this._focused,v=c.borderColor||"transparent",p=this.resolvedBorderWidth(c.borderWidth),g=Number(null!==(e=c.borderRadius)&&void 0!==e?e:this.isTelevision?qW:0),y=c.fillColor||"transparent";f&&(v=c.focusedBorderColor||v,p=this.resolvedBorderWidth(null!==(o=c.focusedBorderWidth)&&void 0!==o?o:c.borderWidth),g=Number(null!==(s=null!==(u=c.focusedBorderRadius)&&void 0!==u?u:c.borderRadius)&&void 0!==s?s:g),y=c.focusedFillColor||y);m&&(v=c.errorBorderColor||v,p=this.resolvedBorderWidth(null!==(l=c.errorBorderWidth)&&void 0!==l?l:c.borderWidth),g=Number(null!==(d=null!==(h=c.errorBorderRadius)&&void 0!==h?h:c.borderRadius)&&void 0!==d?d:g));var b=null!==(t=c.fontSize)&&void 0!==t?t:this.isTelevision?JW:void 0,w=null!==(i=c.innerTopPadding)&&void 0!==i?i:this.isTelevision?ZW:0,k=null!==(n=c.innerBottomPadding)&&void 0!==n?n:this.isTelevision?ZW:0,S=null!==(a=c.innerLeftPadding)&&void 0!==a?a:this.isTelevision?ZW:0,E=null!==(r=c.innerRightPadding)&&void 0!==r?r:this.isTelevision?ZW:0;return`\n      box-sizing: border-box;\n      width: 100%;\n      outline: none;\n      ${Au(c.fontColor||"inherit")}\n      ${Bu(c.fontName)}\n      ${null!=b?`font-size: ${Tu(b,this.scaleFactor)};`:""}\n      ${Mu(y)}\n      ${Pu(v)}\n      border-style: solid;\n      border-width: ${p}px !important;\n      border-radius: ${g}px !important;\n      padding: ${Number(w)}px ${Number(E)}px ${Number(k)}px ${Number(S)}px !important;\n      text-align: ${c.alignment||"left"};\n    `}},{key:"applyErrorStyles",value:function(){var e,t=this.component,i=null!==(e=t.validationTextFontSize)&&void 0!==e?e:this.isTelevision?JW:void 0;return`\n      ${Au(t.validationTextFontColor||"#D83A58")}\n      ${Bu(t.validationTextFontName)}\n      ${null!=i?`font-size: ${Tu(i,this.scaleFactor)};`:""}\n    `}},{key:"render",value:function(){var e,t,i,n,a=this.component,r=`nami-text-input-${a.formId}`,o=this.currentError,s="none"!==a.labelPosition&&!!a.labelText,u=!0===a.reqed?`${a.labelText} *`:a.labelText,l="email"===a.type?"email":"text",d="email"===a.type?"email":"text";return z(VW||(VW=XW`
+    `),"indeterminate"===e?"":`width: ${this.currentProgress}%`,"indeterminate"===e?void 0:Math.round(this.currentProgress),"indeterminate"===e?void 0:0,"indeterminate"===e?void 0:100,this.isAnimating,this.screenreaderAnnouncement)}}])}();yt([Jt({type:Object})],GW.prototype,"component",void 0),yt([Jt({type:Number})],GW.prototype,"scaleFactor",void 0),yt([Jt({type:Boolean})],GW.prototype,"inFocusedState",void 0),yt([Jt({type:Object})],GW.prototype,"minSDKVersion",void 0),yt([Qt()],GW.prototype,"currentProgress",void 0),yt([Qt()],GW.prototype,"isAnimating",void 0),yt([Qt()],GW.prototype,"screenreaderAnnouncement",void 0),GW=yt([Pt("nami-progress-bar")],GW);var VW,KW,XW=e=>e,YW=2,qW=6,JW=20,QW=16,ZW=16,e$=function(){function e(){var t;return Z(this,e),(t=Q(this,e)).inFocusedState=!1,t.scaleFactor=1,t._value="",t._focused=!1,t._handleInput=e=>{var i=e.target.value;t._value=i;var n=t.component,a=n.formId,r=n.validateOn;if(t.contextProvider.setFormState(a,i),"change"===r){var o,s=j(t.validatorType(),!0===t.component.reqed,i);if(s)t.contextProvider.setFormFieldError(a,null!==(o=t.component.validationMessage)&&void 0!==o?o:s);else t.contextProvider.clearFormFieldError(a)}t.requestUpdate()},t._handleFocus=()=>{t._focused=!0,t.isTelevision||document.addEventListener("pointerdown",t._onOutsidePointerDown,!0),t.requestUpdate()},t._handleBlur=()=>{t._focused=!1,document.removeEventListener("pointerdown",t._onOutsidePointerDown,!0),t.requestUpdate()},t._onOutsidePointerDown=e=>{var i;e.composedPath().includes(t)||null===(i=t.shadowRoot)||void 0===i||null===(i=i.querySelector("input"))||void 0===i||i.blur()},t}return le(e,mu),ae(e,[{key:"connectedCallback",value:function(){var t;ge(e,"connectedCallback",this)([]);var i=this.component.formId,n=null===(t=this.contextProvider.state.formStates)||void 0===t?void 0:t[i];this._value="string"==typeof n?n:"",this.contextProvider.setFormState(i,this._value),this.contextProvider.registerFormFieldValidator(i,this.validator())}},{key:"updated",value:function(t){if(ge(e,"updated",this)([t]),t.has("component")){var i,n=t.get("component"),a=!0===(null==n?void 0:n.focused);if(!0===this.component.focused&&!a)null===(i=this._inputEl)||void 0===i||i.focus({preventScroll:!0})}}},{key:"isTelevision",get:function(){return"television"===m()}},{key:"validatorType",value:function(){return"email"===this.component.type?"email":"name"}},{key:"validator",value:function(){return{type:this.validatorType(),required:!0===this.component.reqed,message:this.component.validationMessage}}},{key:"currentError",get:function(){return this.contextProvider.getFormFieldErrors()[this.component.formId]}},{key:"disconnectedCallback",value:function(){document.removeEventListener("pointerdown",this._onOutsidePointerDown,!0),ge(e,"disconnectedCallback",this)([])}},{key:"styles",value:function(){return H(`\n      :host {\n        box-sizing: border-box;\n        display: block;\n        ${"100%"===this.component.width?"width: 100%;":""}\n      }\n      :host .nami-text-input-wrapper {\n        display: flex;\n        flex-direction: column;\n        gap: ${this.resolvedSpacing()}px;\n        ${"100%"===this.component.width?"width: 100%;":""}\n      }\n      :host label {\n        ${this.applyLabelStyles()}\n      }\n      :host input {\n        ${this.applyInputStyles()}\n      }\n      :host input::placeholder {\n        ${this.component.placeholderFontColor?`color: ${this.component.placeholderFontColor};`:""}\n      }\n      :host .nami-text-input-error {\n        ${this.applyErrorStyles()}\n      }\n    `)}},{key:"resolvedSpacing",value:function(){var e=this.component.spacing;return null==e?this.isTelevision?QW:0:Number(e)}},{key:"resolvedBorderWidth",value:function(e){return null==e?this.isTelevision?YW:0:Number(e)}},{key:"applyLabelStyles",value:function(){var e,t=this.component,i=null!==(e=t.labelFontSize)&&void 0!==e?e:this.isTelevision?JW:void 0;return`\n      ${Au(t.labelFontColor||"inherit")}\n      ${Bu(t.labelFontName)}\n      ${null!=i?`font-size: ${Tu(i,this.scaleFactor)};`:""}\n    `}},{key:"applyInputStyles",value:function(){var e,t,i,n,a,r,o,s,u,l,d,h,c=this.component,m=!!this.currentError,f=this._focused,v=c.borderColor||"transparent",p=this.resolvedBorderWidth(c.borderWidth),g=Number(null!==(e=c.borderRadius)&&void 0!==e?e:this.isTelevision?qW:0),y=c.fillColor||"transparent";f&&(v=c.focusedBorderColor||v,p=this.resolvedBorderWidth(null!==(o=c.focusedBorderWidth)&&void 0!==o?o:c.borderWidth),g=Number(null!==(s=null!==(u=c.focusedBorderRadius)&&void 0!==u?u:c.borderRadius)&&void 0!==s?s:g),y=c.focusedFillColor||y);m&&(v=c.errorBorderColor||v,p=this.resolvedBorderWidth(null!==(l=c.errorBorderWidth)&&void 0!==l?l:c.borderWidth),g=Number(null!==(d=null!==(h=c.errorBorderRadius)&&void 0!==h?h:c.borderRadius)&&void 0!==d?d:g));var b=null!==(t=c.fontSize)&&void 0!==t?t:this.isTelevision?JW:void 0,w=null!==(i=c.innerTopPadding)&&void 0!==i?i:this.isTelevision?ZW:0,k=null!==(n=c.innerBottomPadding)&&void 0!==n?n:this.isTelevision?ZW:0,S=null!==(a=c.innerLeftPadding)&&void 0!==a?a:this.isTelevision?ZW:0,E=null!==(r=c.innerRightPadding)&&void 0!==r?r:this.isTelevision?ZW:0;return`\n      box-sizing: border-box;\n      width: 100%;\n      outline: none;\n      ${Au(c.fontColor||"inherit")}\n      ${Bu(c.fontName)}\n      ${null!=b?`font-size: ${Tu(b,this.scaleFactor)};`:""}\n      ${Mu(y)}\n      ${Pu(v)}\n      border-style: solid;\n      border-width: ${p}px !important;\n      border-radius: ${g}px !important;\n      padding: ${Number(w)}px ${Number(E)}px ${Number(k)}px ${Number(S)}px !important;\n      text-align: ${c.alignment||"left"};\n    `}},{key:"applyErrorStyles",value:function(){var e,t=this.component,i=null!==(e=t.validationTextFontSize)&&void 0!==e?e:this.isTelevision?JW:void 0;return`\n      ${Au(t.validationTextFontColor||"#D83A58")}\n      ${Bu(t.validationTextFontName)}\n      ${null!=i?`font-size: ${Tu(i,this.scaleFactor)};`:""}\n    `}},{key:"render",value:function(){var e,t,i,n,a=this.component,r=`nami-text-input-${a.formId}`,o=this.currentError,s="none"!==a.labelPosition&&!!a.labelText,u=!0===a.reqed?`${a.labelText} *`:a.labelText,l="email"===a.type?"email":"text",d="email"===a.type?"email":"text";return z(VW||(VW=XW`
       <div class="nami-text-input-wrapper">
         ${0}
         <input
@@ -627,4 +627,4 @@ import{NAMI_SDK_VERSION as e,getExtendedClientInfo as t,PaywallState as i,logger
           aria-live="polite"
         >${0}</div>
       </div>
-    `),s?z(KW||(KW=XW`<label for=${0}>${0}</label>`),r,u):V,r,l,d,this._value,null!==(e=a.placeholderText)&&void 0!==e?e:"",null!==(t=null!==(i=a.screenreaderText)&&void 0!==i?i:u)&&void 0!==t?t:V,null!==(n=a.screenreaderHint)&&void 0!==n?n:V,o?"true":V,o?`${r}-error`:V,this._handleInput,this._handleFocus,this._handleBlur,`${r}-error`,null!=o?o:"")}}])}();yt([Jt({type:Object})],e$.prototype,"component",void 0),yt([Jt({type:Boolean})],e$.prototype,"inFocusedState",void 0),yt([Jt({type:Number})],e$.prototype,"scaleFactor",void 0),e$=yt([Pt("nami-text-input")],e$);
+    `),s?z(KW||(KW=XW`<label for=${0}>${0}</label>`),r,u):V,r,l,d,this._value,null!==(e=a.placeholderText)&&void 0!==e?e:"",null!==(t=null!==(i=a.screenreaderText)&&void 0!==i?i:u)&&void 0!==t?t:V,null!==(n=a.screenreaderHint)&&void 0!==n?n:V,o?"true":V,o?`${r}-error`:V,this._handleInput,this._handleFocus,this._handleBlur,`${r}-error`,null!=o?o:"")}}])}();yt([Jt({type:Object})],e$.prototype,"component",void 0),yt([Jt({type:Boolean})],e$.prototype,"inFocusedState",void 0),yt([Jt({type:Number})],e$.prototype,"scaleFactor",void 0),yt([function(e){return(t,i,n)=>((e,t,i)=>(i.configurable=!0,i.enumerable=!0,Reflect.decorate&&"object"!=typeof t&&Object.defineProperty(e,t,i),i))(t,i,{get(){return(t=>{var i,n;return null!==(i=null===(n=t.renderRoot)||void 0===n?void 0:n.querySelector(e))&&void 0!==i?i:null})(this)}})}("input")],e$.prototype,"_inputEl",void 0),e$=yt([Pt("nami-text-input")],e$);