aw-wizard-forms 3.0.7 → 3.1.0
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.
- package/README.md +7 -1
- package/dist/wizard-form.esm.js +847 -2052
- package/dist/wizard-form.esm.js.map +1 -1
- package/dist/wizard-form.min.js +78 -1061
- package/dist/wizard-form.min.js.map +1 -1
- package/package.json +8 -2
package/dist/wizard-form.min.js
CHANGED
|
@@ -1,96 +1,40 @@
|
|
|
1
|
-
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).WizardForm={})}(this,function(t){"use strict";function e(){if("undefined"==typeof document)return;const t=document.cookie.match(/hubspotutk=([^;]+)/);return t?t[1]:void 0}function s(t){const{portalId:s,formId:i,fieldMapping:r={},mock:o=!1}=t;return{name:"hubspot",mapFields(t){const e={};for(const[s,i]of Object.entries(t))e[r[s]||s]=i;return e},async submit(t,r){if(o)return await new Promise(t=>setTimeout(t,500)),{success:!0,data:{mock:!0,formData:t}};const a=`https://api.hsforms.com/submissions/v3/integration/submit/${s}/${i}`,n=this.mapFields(t),h={fields:Object.entries(n).map(([t,e])=>({name:t,value:Array.isArray(e)?e.join(";"):(e??"")+""})),context:{pageUri:r.pageUrl,pageName:r.pageTitle,hutk:e()}};try{const t=await fetch(a,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(h)});return t.ok?{success:!0,data:await t.json()}:{success:!1,error:(await t.json().catch(()=>({}))).message||"HubSpot submission failed: "+t.status}}catch(l){return{success:!1,error:l instanceof Error?l.message:"Network error"}}}}}function i(t){const{url:e,method:s="POST",headers:i={},fieldMapping:r={},mock:o=!1}=t;return{name:"webhook",mapFields(t){const e={};for(const[s,i]of Object.entries(t))e[r[s]||s]=i;return e},async submit(t,r){if(o)return await new Promise(t=>setTimeout(t,500)),{success:!0,data:{mock:!0,formData:t}};if(!e)return{success:!1,error:"Webhook URL is required"};const a={formData:this.mapFields(t),context:{pageUrl:r.pageUrl,pageTitle:r.pageTitle,referrer:r.referrer,submittedAt:r.timestamp}};try{const t=await fetch(e,{method:s,headers:{"Content-Type":"application/json",...i},body:JSON.stringify(a)});if(!t.ok){const e=await t.text().catch(()=>"");return{success:!1,error:`Webhook failed: ${t.status} ${e}`.trim()}}let r;try{r=await t.json()}catch{r={status:t.status}}return{success:!0,data:r}}catch(n){return{success:!1,error:n instanceof Error?n.message:"Network error"}}}}}function r(){return"undefined"!=typeof window&&void 0!==window.RevenueHero}function o(t){const{routerId:e,fieldMapping:s={},mock:i=!1}=t;return{name:"revenuehero",mapFields(t){const e={};for(const[i,r]of Object.entries(t))e[s[i]||i]=r;return e},async submit(t,s){if(i)return await new Promise(t=>setTimeout(t,500)),{success:!0,data:{mock:!0,scheduled:!0}};if(!e)return{success:!1,error:"RevenueHero router ID is required"};if(!r())return{success:!1,error:"RevenueHero SDK not loaded. Please load the SDK in your page."};const o=this.mapFields(t),a=(o.email||o.workEmail||"")+"";if(!a)return{success:!1,error:"Email is required for RevenueHero scheduling"};try{return window.RevenueHero.schedule({routerId:e,email:a,...o}),{success:!0,data:{scheduled:!0,email:a}}}catch(n){return{success:!1,error:n instanceof Error?n.message:"RevenueHero error"}}}}}const a=globalThis,n=a.ShadowRoot&&(void 0===a.ShadyCSS||a.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,h=Symbol(),l=new WeakMap;let c=class{constructor(t,e,s){if(this.i=!0,s!==h)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e}get styleSheet(){let t=this.o;const e=this.t;if(n&&void 0===t){const s=void 0!==e&&1===e.length;s&&(t=l.get(e)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),s&&l.set(e,t))}return t}toString(){return this.cssText}};const d=(t,...e)=>{const s=1===t.length?t[0]:e.reduce((e,s,i)=>e+(t=>{if(!0===t.i)return t.cssText;if("number"==typeof t)return t;throw Error("Value passed to 'css' function must be a 'css' function result: "+t+". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.")})(s)+t[i+1],t[0]);return new c(s,t,h)},f=n?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const s of t.cssRules)e+=s.cssText;return(t=>new c("string"==typeof t?t:t+"",void 0,h))(e)})(t):t,{is:u,defineProperty:p,getOwnPropertyDescriptor:w,getOwnPropertyNames:m,getOwnPropertySymbols:b,getPrototypeOf:g}=Object,v=globalThis,y=v.trustedTypes,x=y?y.emptyScript:"",$=v.reactiveElementPolyfillSupport,S=(t,e)=>t,k={toAttribute(t,e){switch(e){case Boolean:t=t?x:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t)}return t},fromAttribute(t,e){let s=t;switch(e){case Boolean:s=null!==t;break;case Number:s=null===t?null:Number(t);break;case Object:case Array:try{s=JSON.parse(t)}catch(i){s=null}}return s}},_=(t,e)=>!u(t,e),E={attribute:!0,type:String,converter:k,reflect:!1,useDefault:!1,hasChanged:_};Symbol.metadata??(Symbol.metadata=Symbol("metadata")),v.litPropertyMetadata??(v.litPropertyMetadata=new WeakMap);let z=class extends HTMLElement{static addInitializer(t){this.m(),(this.l??(this.l=[])).push(t)}static get observedAttributes(){return this.finalize(),this.v&&[...this.v.keys()]}static createProperty(t,e=E){if(e.state&&(e.attribute=!1),this.m(),this.prototype.hasOwnProperty(t)&&((e=Object.create(e)).wrapped=!0),this.elementProperties.set(t,e),!e.noAccessor){const s=Symbol(),i=this.getPropertyDescriptor(t,s,e);void 0!==i&&p(this.prototype,t,i)}}static getPropertyDescriptor(t,e,s){const{get:i,set:r}=w(this.prototype,t)??{get(){return this[e]},set(t){this[e]=t}};return{get:i,set(e){const o=i?.call(this);r?.call(this,e),this.requestUpdate(t,o,s)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)??E}static m(){if(this.hasOwnProperty(S("elementProperties")))return;const t=g(this);t.finalize(),void 0!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties)}static finalize(){if(this.hasOwnProperty(S("finalized")))return;if(this.finalized=!0,this.m(),this.hasOwnProperty(S("properties"))){const t=this.properties,e=[...m(t),...b(t)];for(const s of e)this.createProperty(s,t[s])}const t=this[Symbol.metadata];if(null!==t){const e=litPropertyMetadata.get(t);if(void 0!==e)for(const[t,s]of e)this.elementProperties.set(t,s)}this.v=new Map;for(const[e,s]of this.elementProperties){const t=this.S(e,s);void 0!==t&&this.v.set(t,e)}this.elementStyles=this.finalizeStyles(this.styles)}static finalizeStyles(t){const e=[];if(Array.isArray(t)){const s=new Set(t.flat(1/0).reverse());for(const t of s)e.unshift(f(t))}else void 0!==t&&e.push(f(t));return e}static S(t,e){const s=e.attribute;return!1===s?void 0:"string"==typeof s?s:"string"==typeof t?t.toLowerCase():void 0}constructor(){super(),this._=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this.A=null,this.N()}N(){this.M=new Promise(t=>this.enableUpdating=t),this.P=new Map,this.V(),this.requestUpdate(),this.constructor.l?.forEach(t=>t(this))}addController(t){(this.q??(this.q=new Set)).add(t),void 0!==this.renderRoot&&this.isConnected&&t.hostConnected?.()}removeController(t){this.q?.delete(t)}V(){const t=new Map,e=this.constructor.elementProperties;for(const s of e.keys())this.hasOwnProperty(s)&&(t.set(s,this[s]),delete this[s]);t.size>0&&(this._=t)}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return((t,e)=>{if(n)t.adoptedStyleSheets=e.map(t=>t instanceof CSSStyleSheet?t:t.styleSheet);else for(const s of e){const e=document.createElement("style"),i=a.litNonce;void 0!==i&&e.setAttribute("nonce",i),e.textContent=s.cssText,t.appendChild(e)}})(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??(this.renderRoot=this.createRenderRoot()),this.enableUpdating(!0),this.q?.forEach(t=>t.hostConnected?.())}enableUpdating(t){}disconnectedCallback(){this.q?.forEach(t=>t.hostDisconnected?.())}attributeChangedCallback(t,e,s){this.I(t,s)}B(t,e){const s=this.constructor.elementProperties.get(t),i=this.constructor.S(t,s);if(void 0!==i&&!0===s.reflect){const r=(void 0!==s.converter?.toAttribute?s.converter:k).toAttribute(e,s.type);this.A=t,null==r?this.removeAttribute(i):this.setAttribute(i,r),this.A=null}}I(t,e){const s=this.constructor,i=s.v.get(t);if(void 0!==i&&this.A!==i){const t=s.getPropertyOptions(i),r="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==t.converter?.fromAttribute?t.converter:k;this.A=i;const o=r.fromAttribute(e,t.type);this[i]=o??this.D?.get(i)??o,this.A=null}}requestUpdate(t,e,s,i=!1,r){if(void 0!==t){const o=this.constructor;if(!1===i&&(r=this[t]),s??(s=o.getPropertyOptions(t)),!((s.hasChanged??_)(r,e)||s.useDefault&&s.reflect&&r===this.D?.get(t)&&!this.hasAttribute(o.S(t,s))))return;this.C(t,e,s)}!1===this.isUpdatePending&&(this.M=this.F())}C(t,e,{useDefault:s,reflect:i,wrapped:r},o){s&&!(this.D??(this.D=new Map)).has(t)&&(this.D.set(t,o??e??this[t]),!0!==r||void 0!==o)||(this.P.has(t)||(this.hasUpdated||s||(e=void 0),this.P.set(t,e)),!0===i&&this.A!==t&&(this.U??(this.U=new Set)).add(t))}async F(){this.isUpdatePending=!0;try{await this.M}catch(e){Promise.reject(e)}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??(this.renderRoot=this.createRenderRoot()),this._){for(const[t,e]of this._)this[t]=e;this._=void 0}const t=this.constructor.elementProperties;if(t.size>0)for(const[e,s]of t){const{wrapped:t}=s,i=this[e];!0!==t||this.P.has(e)||void 0===i||this.C(e,void 0,s,i)}}let t=!1;const e=this.P;try{t=this.shouldUpdate(e),t?(this.willUpdate(e),this.q?.forEach(t=>t.hostUpdate?.()),this.update(e)):this.R()}catch(s){throw t=!1,this.R(),s}t&&this.L(e)}willUpdate(t){}L(t){this.q?.forEach(t=>t.hostUpdated?.()),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}R(){this.P=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this.M}shouldUpdate(t){return!0}update(t){this.U&&(this.U=this.U.forEach(t=>this.B(t,this[t]))),this.R()}updated(t){}firstUpdated(t){}};z.elementStyles=[],z.shadowRootOptions={mode:"open"},z[S("elementProperties")]=new Map,z[S("finalized")]=new Map,$?.({ReactiveElement:z}),(v.reactiveElementVersions??(v.reactiveElementVersions=[])).push("2.1.2");const C=globalThis,T=t=>t,O=C.trustedTypes,j=O?O.createPolicy("lit-html",{createHTML:t=>t}):void 0,A="$lit$",N=`lit$${Math.random().toFixed(9).slice(2)}$`,M="?"+N,P=`<${M}>`,V=document,q=()=>V.createComment(""),I=t=>null===t||"object"!=typeof t&&"function"!=typeof t,B=Array.isArray,D="[ \t\n\f\r]",F=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,U=/-->/g,R=/>/g,L=RegExp(`>|${D}(?:([^\\s"'>=/]+)(${D}*=${D}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),W=/'/g,H=/"/g,X=/^(?:script|style|textarea|title)$/i,Y=(t,...e)=>({W:1,strings:t,values:e}),J=Symbol.for("lit-noChange"),K=Symbol.for("lit-nothing"),Z=new WeakMap,G=V.createTreeWalker(V,129);function Q(t,e){if(!B(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==j?j.createHTML(e):e}class tt{constructor({strings:t,W:e},s){let i;this.parts=[];let r=0,o=0;const a=t.length-1,n=this.parts,[h,l]=((t,e)=>{const s=t.length-1,i=[];let r,o=2===e?"<svg>":3===e?"<math>":"",a=F;for(let n=0;n<s;n++){const e=t[n];let s,h,l=-1,c=0;for(;c<e.length&&(a.lastIndex=c,h=a.exec(e),null!==h);)c=a.lastIndex,a===F?"!--"===h[1]?a=U:void 0!==h[1]?a=R:void 0!==h[2]?(X.test(h[2])&&(r=RegExp("</"+h[2],"g")),a=L):void 0!==h[3]&&(a=L):a===L?">"===h[0]?(a=r??F,l=-1):void 0===h[1]?l=-2:(l=a.lastIndex-h[2].length,s=h[1],a=void 0===h[3]?L:'"'===h[3]?H:W):a===H||a===W?a=L:a===U||a===R?a=F:(a=L,r=void 0);const d=a===L&&t[n+1].startsWith("/>")?" ":"";o+=a===F?e+P:l>=0?(i.push(s),e.slice(0,l)+A+e.slice(l)+N+d):e+N+(-2===l?n:d)}return[Q(t,o+(t[s]||"<?>")+(2===e?"</svg>":3===e?"</math>":"")),i]})(t,e);if(this.el=tt.createElement(h,s),G.currentNode=this.el.content,2===e||3===e){const t=this.el.content.firstChild;t.replaceWith(...t.childNodes)}for(;null!==(i=G.nextNode())&&n.length<a;){if(1===i.nodeType){if(i.hasAttributes())for(const t of i.getAttributeNames())if(t.endsWith(A)){const e=l[o++],s=i.getAttribute(t).split(N),a=/([.?@])?(.*)/.exec(e);n.push({type:1,index:r,name:a[2],strings:s,ctor:"."===a[1]?ot:"?"===a[1]?at:"@"===a[1]?nt:rt}),i.removeAttribute(t)}else t.startsWith(N)&&(n.push({type:6,index:r}),i.removeAttribute(t));if(X.test(i.tagName)){const t=i.textContent.split(N),e=t.length-1;if(e>0){i.textContent=O?O.emptyScript:"";for(let s=0;s<e;s++)i.append(t[s],q()),G.nextNode(),n.push({type:2,index:++r});i.append(t[e],q())}}}else if(8===i.nodeType)if(i.data===M)n.push({type:2,index:r});else{let t=-1;for(;-1!==(t=i.data.indexOf(N,t+1));)n.push({type:7,index:r}),t+=N.length-1}r++}}static createElement(t,e){const s=V.createElement("template");return s.innerHTML=t,s}}function et(t,e,s=t,i){if(e===J)return e;let r=void 0!==i?s.H?.[i]:s.X;const o=I(e)?void 0:e.Y;return r?.constructor!==o&&(r?.J?.(!1),void 0===o?r=void 0:(r=new o(t),r.K(t,s,i)),void 0!==i?(s.H??(s.H=[]))[i]=r:s.X=r),void 0!==r&&(e=et(t,r.Z(t,e.values),r,i)),e}class st{constructor(t,e){this.G=[],this.tt=void 0,this.et=t,this.st=e}get parentNode(){return this.st.parentNode}get it(){return this.st.it}u(t){const{el:{content:e},parts:s}=this.et,i=(t?.creationScope??V).importNode(e,!0);G.currentNode=i;let r=G.nextNode(),o=0,a=0,n=s[0];for(;void 0!==n;){if(o===n.index){let e;2===n.type?e=new it(r,r.nextSibling,this,t):1===n.type?e=new n.ctor(r,n.name,n.strings,this,t):6===n.type&&(e=new ht(r,this,t)),this.G.push(e),n=s[++a]}o!==n?.index&&(r=G.nextNode(),o++)}return G.currentNode=V,i}p(t){let e=0;for(const s of this.G)void 0!==s&&(void 0!==s.strings?(s.rt(t,s,e),e+=s.strings.length-2):s.rt(t[e])),e++}}class it{get it(){return this.st?.it??this.ot}constructor(t,e,s,i){this.type=2,this.nt=K,this.tt=void 0,this.ht=t,this.lt=e,this.st=s,this.options=i,this.ot=i?.isConnected??!0}get parentNode(){let t=this.ht.parentNode;const e=this.st;return void 0!==e&&11===t?.nodeType&&(t=e.parentNode),t}get startNode(){return this.ht}get endNode(){return this.lt}rt(t,e=this){t=et(this,t,e),I(t)?t===K||null==t||""===t?(this.nt!==K&&this.ct(),this.nt=K):t!==this.nt&&t!==J&&this.dt(t):void 0!==t.W?this.$(t):void 0!==t.nodeType?this.T(t):(t=>B(t)||"function"==typeof t?.[Symbol.iterator])(t)?this.k(t):this.dt(t)}O(t){return this.ht.parentNode.insertBefore(t,this.lt)}T(t){this.nt!==t&&(this.ct(),this.nt=this.O(t))}dt(t){this.nt!==K&&I(this.nt)?this.ht.nextSibling.data=t:this.T(V.createTextNode(t)),this.nt=t}$(t){const{values:e,W:s}=t,i="number"==typeof s?this.ft(t):(void 0===s.el&&(s.el=tt.createElement(Q(s.h,s.h[0]),this.options)),s);if(this.nt?.et===i)this.nt.p(e);else{const t=new st(i,this),s=t.u(this.options);t.p(e),this.T(s),this.nt=t}}ft(t){let e=Z.get(t.strings);return void 0===e&&Z.set(t.strings,e=new tt(t)),e}k(t){B(this.nt)||(this.nt=[],this.ct());const e=this.nt;let s,i=0;for(const r of t)i===e.length?e.push(s=new it(this.O(q()),this.O(q()),this,this.options)):s=e[i],s.rt(r),i++;i<e.length&&(this.ct(s&&s.lt.nextSibling,i),e.length=i)}ct(t=this.ht.nextSibling,e){for(this.ut?.(!1,!0,e);t!==this.lt;){const e=T(t).nextSibling;T(t).remove(),t=e}}setConnected(t){void 0===this.st&&(this.ot=t,this.ut?.(t))}}class rt{get tagName(){return this.element.tagName}get it(){return this.st.it}constructor(t,e,s,i,r){this.type=1,this.nt=K,this.tt=void 0,this.element=t,this.name=e,this.st=i,this.options=r,s.length>2||""!==s[0]||""!==s[1]?(this.nt=Array(s.length-1).fill(new String),this.strings=s):this.nt=K}rt(t,e=this,s,i){const r=this.strings;let o=!1;if(void 0===r)t=et(this,t,e,0),o=!I(t)||t!==this.nt&&t!==J,o&&(this.nt=t);else{const i=t;let a,n;for(t=r[0],a=0;a<r.length-1;a++)n=et(this,i[s+a],e,a),n===J&&(n=this.nt[a]),o||(o=!I(n)||n!==this.nt[a]),n===K?t=K:t!==K&&(t+=(n??"")+r[a+1]),this.nt[a]=n}o&&!i&&this.j(t)}j(t){t===K?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"")}}class ot extends rt{constructor(){super(...arguments),this.type=3}j(t){this.element[this.name]=t===K?void 0:t}}class at extends rt{constructor(){super(...arguments),this.type=4}j(t){this.element.toggleAttribute(this.name,!!t&&t!==K)}}class nt extends rt{constructor(t,e,s,i,r){super(t,e,s,i,r),this.type=5}rt(t,e=this){if((t=et(this,t,e,0)??K)===J)return;const s=this.nt,i=t===K&&s!==K||t.capture!==s.capture||t.once!==s.once||t.passive!==s.passive,r=t!==K&&(s===K||i);i&&this.element.removeEventListener(this.name,this,s),r&&this.element.addEventListener(this.name,this,t),this.nt=t}handleEvent(t){"function"==typeof this.nt?this.nt.call(this.options?.host??this.element,t):this.nt.handleEvent(t)}}class ht{constructor(t,e,s){this.element=t,this.type=6,this.tt=void 0,this.st=e,this.options=s}get it(){return this.st.it}rt(t){et(this,t)}}const lt=C.litHtmlPolyfillSupport;lt?.(tt,it),(C.litHtmlVersions??(C.litHtmlVersions=[])).push("3.3.2");const ct=globalThis;class dt extends z{constructor(){super(...arguments),this.renderOptions={host:this},this.wt=void 0}createRenderRoot(){var t;const e=super.createRenderRoot();return(t=this.renderOptions).renderBefore??(t.renderBefore=e.firstChild),e}update(t){const e=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this.wt=((t,e,s)=>{const i=s?.renderBefore??e;let r=i.bt;if(void 0===r){const t=s?.renderBefore??null;i.bt=r=new it(e.insertBefore(q(),t),t,void 0,s??{})}return r.rt(t),r})(e,this.renderRoot,this.renderOptions)}connectedCallback(){super.connectedCallback(),this.wt?.setConnected(!0)}disconnectedCallback(){super.disconnectedCallback(),this.wt?.setConnected(!1)}render(){return J}}dt.gt=!0,dt.finalized=!0,ct.litElementHydrateSupport?.({LitElement:dt});const ft=ct.litElementPolyfillSupport;ft?.({LitElement:dt}),(ct.litElementVersions??(ct.litElementVersions=[])).push("4.2.2");const ut=t=>(e,s)=>{void 0!==s?s.addInitializer(()=>{customElements.define(t,e)}):customElements.define(t,e)},pt={attribute:!0,type:String,converter:k,reflect:!1,hasChanged:_},wt=(t=pt,e,s)=>{const{kind:i,metadata:r}=s;let o=globalThis.litPropertyMetadata.get(r);if(void 0===o&&globalThis.litPropertyMetadata.set(r,o=new Map),"setter"===i&&((t=Object.create(t)).wrapped=!0),o.set(s.name,t),"accessor"===i){const{name:i}=s;return{set(s){const r=e.get.call(this);e.set.call(this,s),this.requestUpdate(i,r,t,!0,s)},init(e){return void 0!==e&&this.C(i,void 0,t,e),e}}}if("setter"===i){const{name:i}=s;return function(s){const r=this[i];e.call(this,s),this.requestUpdate(i,r,t,!0,s)}}throw Error("Unsupported decorator location: "+i)};function mt(t){return(e,s)=>"object"==typeof s?wt(t,e,s):((t,e,s)=>{const i=e.hasOwnProperty(s);return e.constructor.createProperty(s,t),i?Object.getOwnPropertyDescriptor(e,s):void 0})(t,e,s)}function bt(t){return mt({...t,state:!0,attribute:!1})}class gt{constructor(t){this.vt={},this.yt={},this.xt=1,this.$t=0,this.St=!1,this.kt=!1,this._t=new Map,this.Et=new Set,this.host=t,t.addController(this)}hostConnected(){}hostDisconnected(){this.Et.clear()}get formData(){return{...this.vt}}get validation(){return{...this.yt}}get currentStep(){return this.xt}get totalSteps(){return this.$t}get submitting(){return this.St}get submitted(){return this.kt}get error(){return this.zt}get state(){return{formData:this.formData,validation:this.validation,currentStep:this.xt,totalSteps:this.$t,submitting:this.St,submitted:this.kt,error:this.zt}}setValue(t,e){this.vt[t]=e,this.yt[t]?this.yt[t]={...this.yt[t],value:e,dirty:!0}:this.yt[t]={name:t,value:e,result:{valid:!0},touched:!1,dirty:!0},this.Ct()}getValue(t){return this.vt[t]}setValidation(t,e){const s=this.yt[t];this.yt[t]={name:t,value:s?.value??this.vt[t],result:e,touched:s?.touched??!1,dirty:s?.dirty??!1},this.Ct()}markTouched(t){this.yt[t]?this.yt[t]={...this.yt[t],touched:!0}:this.yt[t]={name:t,value:this.vt[t],result:{valid:!0},touched:!0,dirty:!1},this.Ct()}setTotalSteps(t){this.$t=t,this.Ct()}setStepConfig(t,e){this._t.set(t,e)}getStepConfig(t){return this._t.get(t)}getStepFields(t){return this._t.get(t)?.fields??[]}goToStep(t){if(t<1||t>this.$t)return!1;const e=this._t.get(t);return e?.skipIf?.(this.vt)?t>this.xt?this.goToStep(t+1):this.goToStep(t-1):(this.xt=t,this.Ct(),!0)}nextStep(){return this.goToStep(this.xt+1)}previousStep(){return this.goToStep(this.xt-1)}isFirstStep(){return 1===this.xt}isLastStep(){return this.xt===this.$t}isStepValid(t){return this.getStepFields(t).every(t=>{const e=this.yt[t];return!e||e.result.valid})}isCurrentStepValid(){return this.isStepValid(this.xt)}getFieldError(t){const e=this.yt[t];if(e?.touched&&!e.result.valid)return e.result.error}hasFieldError(t){return void 0!==this.getFieldError(t)}setSubmitting(t){this.St=t,this.Ct()}setSubmitted(t){this.kt=t,this.Ct()}setError(t){this.zt=t,this.Ct()}reset(){this.vt={},this.yt={},this.xt=1,this.St=!1,this.kt=!1,this.zt=void 0,this.Ct()}subscribe(t){return this.Et.add(t),()=>{this.Et.delete(t)}}Ct(){this.host.requestUpdate();const t=this.state;this.Et.forEach(e=>{try{e(t)}catch(s){}})}}class vt{constructor(t,e={}){this.Tt=!0,this.host=t,this.Ot={blockEnterOnTextarea:!0,...e},this.jt=this.At.bind(this),t.addController(this)}hostConnected(){this.host.addEventListener("keydown",this.jt),document.addEventListener("keydown",this.jt)}hostDisconnected(){this.host.removeEventListener("keydown",this.jt),document.removeEventListener("keydown",this.jt)}At(t){if(!this.Tt)return;const e=this.Nt(),s="TEXTAREA"===e?.tagName,i="INPUT"===e?.tagName,r="true"===e?.getAttribute("contenteditable"),o=s||i||r;switch(t.key){case"Enter":if(s&&this.Ot.blockEnterOnTextarea)return;this.Ot.onEnter&&(t.preventDefault(),this.Ot.onEnter());break;case"Escape":this.Ot.onEscape&&(t.preventDefault(),this.Ot.onEscape());break;case"ArrowUp":!o&&this.Ot.onArrowUp&&(t.preventDefault(),this.Ot.onArrowUp());break;case"ArrowDown":!o&&this.Ot.onArrowDown&&(t.preventDefault(),this.Ot.onArrowDown());break;case"ArrowLeft":!o&&this.Ot.onArrowLeft&&(t.preventDefault(),this.Ot.onArrowLeft());break;case"ArrowRight":!o&&this.Ot.onArrowRight&&(t.preventDefault(),this.Ot.onArrowRight())}}Nt(){let t=document.activeElement;for(;t?.shadowRoot?.activeElement;)t=t.shadowRoot.activeElement;return t}updateConfig(t){this.Ot={...this.Ot,...t}}enable(){this.Tt=!0}disable(){this.Tt=!1}get enabled(){return this.Tt}}var yt=Object.defineProperty,xt=Object.getOwnPropertyDescriptor,$t=(t,e,s,i)=>{for(var r,o=i>1?void 0:i?xt(e,s):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(i?r(e,s,o):r(o))||o);return i&&o&&yt(e,s,o),o};t.WfBadge=class extends dt{constructor(){super(...arguments),this.shortcut="",this.variant="default"}render(){return Y`
|
|
1
|
+
!function(t,e){"object"==typeof exports&&"undefined"!=typeof module?e(exports):"function"==typeof define&&define.amd?define(["exports"],e):e((t="undefined"!=typeof globalThis?globalThis:t||self).WizardForm={})}(this,function(t){"use strict";function e(){if("undefined"==typeof document)return;const t=document.cookie.match(/hubspotutk=([^;]+)/);return t?t[1]:void 0}function i(t){const{portalId:i,formId:s,fieldMapping:r={},mock:o=!1}=t;return{name:"hubspot",mapFields(t){const e={};for(const[i,s]of Object.entries(t))e[r[i]||i]=s;return e},async submit(t,r){if(o)return await new Promise(t=>setTimeout(t,500)),{success:!0,data:{mock:!0,formData:t}};const a=`https://api.hsforms.com/submissions/v3/integration/submit/${i}/${s}`,n=this.mapFields(t),h={fields:Object.entries(n).map(([t,e])=>({name:t,value:Array.isArray(e)?e.join(";"):(e??"")+""})),context:{pageUri:r.pageUrl,pageName:r.pageTitle,hutk:e()}};try{const t=await fetch(a,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(h)});return t.ok?{success:!0,data:await t.json()}:{success:!1,error:(await t.json().catch(()=>({}))).message||"HubSpot submission failed: "+t.status}}catch(c){return{success:!1,error:c instanceof Error?c.message:"Network error"}}}}}function s(t){const{url:e,method:i="POST",headers:s={},fieldMapping:r={},mock:o=!1}=t;return{name:"webhook",mapFields(t){const e={};for(const[i,s]of Object.entries(t))e[r[i]||i]=s;return e},async submit(t,r){if(o)return await new Promise(t=>setTimeout(t,500)),{success:!0,data:{mock:!0,formData:t}};if(!e)return{success:!1,error:"Webhook URL is required"};const a={formData:this.mapFields(t),context:{pageUrl:r.pageUrl,pageTitle:r.pageTitle,referrer:r.referrer,submittedAt:r.timestamp}};try{const t=await fetch(e,{method:i,headers:{"Content-Type":"application/json",...s},body:JSON.stringify(a)});if(!t.ok){const e=await t.text().catch(()=>"");return{success:!1,error:`Webhook failed: ${t.status} ${e}`.trim()}}let r;try{r=await t.json()}catch{r={status:t.status}}return{success:!0,data:r}}catch(n){return{success:!1,error:n instanceof Error?n.message:"Network error"}}}}}function r(){return"undefined"!=typeof window&&void 0!==window.RevenueHero}function o(t){const{routerId:e,fieldMapping:i={},mock:s=!1}=t;return{name:"revenuehero",mapFields(t){const e={};for(const[s,r]of Object.entries(t))e[i[s]||s]=r;return e},async submit(t,i){if(s)return await new Promise(t=>setTimeout(t,500)),{success:!0,data:{mock:!0,scheduled:!0}};if(!e)return{success:!1,error:"RevenueHero router ID is required"};if(!r())return{success:!1,error:"RevenueHero SDK not loaded. Please load the SDK in your page."};const o=this.mapFields(t),a=(o.email||o.workEmail||"")+"";if(!a)return{success:!1,error:"Email is required for RevenueHero scheduling"};try{return window.RevenueHero.schedule({routerId:e,email:a,...o}),{success:!0,data:{scheduled:!0,email:a}}}catch(n){return{success:!1,error:n instanceof Error?n.message:"RevenueHero error"}}}}}const a=globalThis,n=a.ShadowRoot&&(void 0===a.ShadyCSS||a.ShadyCSS.nativeShadow)&&"adoptedStyleSheets"in Document.prototype&&"replace"in CSSStyleSheet.prototype,h=Symbol(),c=new WeakMap;let l=class{constructor(t,e,i){if(this.i=!0,i!==h)throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");this.cssText=t,this.t=e}get styleSheet(){let t=this.o;const e=this.t;if(n&&void 0===t){const i=void 0!==e&&1===e.length;i&&(t=c.get(e)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),i&&c.set(e,t))}return t}toString(){return this.cssText}};const d=n?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e="";for(const i of t.cssRules)e+=i.cssText;return(t=>new l("string"==typeof t?t:t+"",void 0,h))(e)})(t):t,{is:f,defineProperty:u,getOwnPropertyDescriptor:p,getOwnPropertyNames:w,getOwnPropertySymbols:b,getPrototypeOf:m}=Object,g=globalThis,v=g.trustedTypes,y=v?v.emptyScript:"",x=g.reactiveElementPolyfillSupport,$=(t,e)=>t,k={toAttribute(t,e){switch(e){case Boolean:t=t?y:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t)}return t},fromAttribute(t,e){let i=t;switch(e){case Boolean:i=null!==t;break;case Number:i=null===t?null:Number(t);break;case Object:case Array:try{i=JSON.parse(t)}catch(s){i=null}}return i}},S=(t,e)=>!f(t,e),_={attribute:!0,type:String,converter:k,reflect:!1,useDefault:!1,hasChanged:S};Symbol.metadata??(Symbol.metadata=Symbol("metadata")),g.litPropertyMetadata??(g.litPropertyMetadata=new WeakMap);let z=class extends HTMLElement{static addInitializer(t){this.m(),(this.l??(this.l=[])).push(t)}static get observedAttributes(){return this.finalize(),this.v&&[...this.v.keys()]}static createProperty(t,e=_){if(e.state&&(e.attribute=!1),this.m(),this.prototype.hasOwnProperty(t)&&((e=Object.create(e)).wrapped=!0),this.elementProperties.set(t,e),!e.noAccessor){const i=Symbol(),s=this.getPropertyDescriptor(t,i,e);void 0!==s&&u(this.prototype,t,s)}}static getPropertyDescriptor(t,e,i){const{get:s,set:r}=p(this.prototype,t)??{get(){return this[e]},set(t){this[e]=t}};return{get:s,set(e){const o=s?.call(this);r?.call(this,e),this.requestUpdate(t,o,i)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)??_}static m(){if(this.hasOwnProperty($("elementProperties")))return;const t=m(this);t.finalize(),void 0!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties)}static finalize(){if(this.hasOwnProperty($("finalized")))return;if(this.finalized=!0,this.m(),this.hasOwnProperty($("properties"))){const t=this.properties,e=[...w(t),...b(t)];for(const i of e)this.createProperty(i,t[i])}const t=this[Symbol.metadata];if(null!==t){const e=litPropertyMetadata.get(t);if(void 0!==e)for(const[t,i]of e)this.elementProperties.set(t,i)}this.v=new Map;for(const[e,i]of this.elementProperties){const t=this.S(e,i);void 0!==t&&this.v.set(t,e)}this.elementStyles=this.finalizeStyles(this.styles)}static finalizeStyles(t){const e=[];if(Array.isArray(t)){const i=new Set(t.flat(1/0).reverse());for(const t of i)e.unshift(d(t))}else void 0!==t&&e.push(d(t));return e}static S(t,e){const i=e.attribute;return!1===i?void 0:"string"==typeof i?i:"string"==typeof t?t.toLowerCase():void 0}constructor(){super(),this._=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this.A=null,this.P()}P(){this.N=new Promise(t=>this.enableUpdating=t),this.M=new Map,this.R(),this.requestUpdate(),this.constructor.l?.forEach(t=>t(this))}addController(t){(this.I??(this.I=new Set)).add(t),void 0!==this.renderRoot&&this.isConnected&&t.hostConnected?.()}removeController(t){this.I?.delete(t)}R(){const t=new Map,e=this.constructor.elementProperties;for(const i of e.keys())this.hasOwnProperty(i)&&(t.set(i,this[i]),delete this[i]);t.size>0&&(this._=t)}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return((t,e)=>{if(n)t.adoptedStyleSheets=e.map(t=>t instanceof CSSStyleSheet?t:t.styleSheet);else for(const i of e){const e=document.createElement("style"),s=a.litNonce;void 0!==s&&e.setAttribute("nonce",s),e.textContent=i.cssText,t.appendChild(e)}})(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??(this.renderRoot=this.createRenderRoot()),this.enableUpdating(!0),this.I?.forEach(t=>t.hostConnected?.())}enableUpdating(t){}disconnectedCallback(){this.I?.forEach(t=>t.hostDisconnected?.())}attributeChangedCallback(t,e,i){this.q(t,i)}D(t,e){const i=this.constructor.elementProperties.get(t),s=this.constructor.S(t,i);if(void 0!==s&&!0===i.reflect){const r=(void 0!==i.converter?.toAttribute?i.converter:k).toAttribute(e,i.type);this.A=t,null==r?this.removeAttribute(s):this.setAttribute(s,r),this.A=null}}q(t,e){const i=this.constructor,s=i.v.get(t);if(void 0!==s&&this.A!==s){const t=i.getPropertyOptions(s),r="function"==typeof t.converter?{fromAttribute:t.converter}:void 0!==t.converter?.fromAttribute?t.converter:k;this.A=s;const o=r.fromAttribute(e,t.type);this[s]=o??this.F?.get(s)??o,this.A=null}}requestUpdate(t,e,i,s=!1,r){if(void 0!==t){const o=this.constructor;if(!1===s&&(r=this[t]),i??(i=o.getPropertyOptions(t)),!((i.hasChanged??S)(r,e)||i.useDefault&&i.reflect&&r===this.F?.get(t)&&!this.hasAttribute(o.S(t,i))))return;this.C(t,e,i)}!1===this.isUpdatePending&&(this.N=this.V())}C(t,e,{useDefault:i,reflect:s,wrapped:r},o){i&&!(this.F??(this.F=new Map)).has(t)&&(this.F.set(t,o??e??this[t]),!0!==r||void 0!==o)||(this.M.has(t)||(this.hasUpdated||i||(e=void 0),this.M.set(t,e)),!0===s&&this.A!==t&&(this.B??(this.B=new Set)).add(t))}async V(){this.isUpdatePending=!0;try{await this.N}catch(e){Promise.reject(e)}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??(this.renderRoot=this.createRenderRoot()),this._){for(const[t,e]of this._)this[t]=e;this._=void 0}const t=this.constructor.elementProperties;if(t.size>0)for(const[e,i]of t){const{wrapped:t}=i,s=this[e];!0!==t||this.M.has(e)||void 0===s||this.C(e,void 0,i,s)}}let t=!1;const e=this.M;try{t=this.shouldUpdate(e),t?(this.willUpdate(e),this.I?.forEach(t=>t.hostUpdate?.()),this.update(e)):this.U()}catch(i){throw t=!1,this.U(),i}t&&this.L(e)}willUpdate(t){}L(t){this.I?.forEach(t=>t.hostUpdated?.()),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}U(){this.M=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this.N}shouldUpdate(t){return!0}update(t){this.B&&(this.B=this.B.forEach(t=>this.D(t,this[t]))),this.U()}updated(t){}firstUpdated(t){}};z.elementStyles=[],z.shadowRootOptions={mode:"open"},z[$("elementProperties")]=new Map,z[$("finalized")]=new Map,x?.({ReactiveElement:z}),(g.reactiveElementVersions??(g.reactiveElementVersions=[])).push("2.1.2");const E=globalThis,C=t=>t,O=E.trustedTypes,T=O?O.createPolicy("lit-html",{createHTML:t=>t}):void 0,j="$lit$",A=`lit$${Math.random().toFixed(9).slice(2)}$`,P="?"+A,N=`<${P}>`,M=document,R=()=>M.createComment(""),I=t=>null===t||"object"!=typeof t&&"function"!=typeof t,q=Array.isArray,D="[ \t\n\f\r]",F=/<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g,V=/-->/g,B=/>/g,U=RegExp(`>|${D}(?:([^\\s"'>=/]+)(${D}*=${D}*(?:[^ \t\n\f\r"'\`<>=]|("|')|))|$)`,"g"),L=/'/g,H=/"/g,W=/^(?:script|style|textarea|title)$/i,Y=(t,...e)=>({H:1,strings:t,values:e}),J=Symbol.for("lit-noChange"),K=Symbol.for("lit-nothing"),X=new WeakMap,Z=M.createTreeWalker(M,129);function G(t,e){if(!q(t)||!t.hasOwnProperty("raw"))throw Error("invalid template strings array");return void 0!==T?T.createHTML(e):e}class Q{constructor({strings:t,H:e},i){let s;this.parts=[];let r=0,o=0;const a=t.length-1,n=this.parts,[h,c]=((t,e)=>{const i=t.length-1,s=[];let r,o=2===e?"<svg>":3===e?"<math>":"",a=F;for(let n=0;n<i;n++){const e=t[n];let i,h,c=-1,l=0;for(;l<e.length&&(a.lastIndex=l,h=a.exec(e),null!==h);)l=a.lastIndex,a===F?"!--"===h[1]?a=V:void 0!==h[1]?a=B:void 0!==h[2]?(W.test(h[2])&&(r=RegExp("</"+h[2],"g")),a=U):void 0!==h[3]&&(a=U):a===U?">"===h[0]?(a=r??F,c=-1):void 0===h[1]?c=-2:(c=a.lastIndex-h[2].length,i=h[1],a=void 0===h[3]?U:'"'===h[3]?H:L):a===H||a===L?a=U:a===V||a===B?a=F:(a=U,r=void 0);const d=a===U&&t[n+1].startsWith("/>")?" ":"";o+=a===F?e+N:c>=0?(s.push(i),e.slice(0,c)+j+e.slice(c)+A+d):e+A+(-2===c?n:d)}return[G(t,o+(t[i]||"<?>")+(2===e?"</svg>":3===e?"</math>":"")),s]})(t,e);if(this.el=Q.createElement(h,i),Z.currentNode=this.el.content,2===e||3===e){const t=this.el.content.firstChild;t.replaceWith(...t.childNodes)}for(;null!==(s=Z.nextNode())&&n.length<a;){if(1===s.nodeType){if(s.hasAttributes())for(const t of s.getAttributeNames())if(t.endsWith(j)){const e=c[o++],i=s.getAttribute(t).split(A),a=/([.?@])?(.*)/.exec(e);n.push({type:1,index:r,name:a[2],strings:i,ctor:"."===a[1]?rt:"?"===a[1]?ot:"@"===a[1]?at:st}),s.removeAttribute(t)}else t.startsWith(A)&&(n.push({type:6,index:r}),s.removeAttribute(t));if(W.test(s.tagName)){const t=s.textContent.split(A),e=t.length-1;if(e>0){s.textContent=O?O.emptyScript:"";for(let i=0;i<e;i++)s.append(t[i],R()),Z.nextNode(),n.push({type:2,index:++r});s.append(t[e],R())}}}else if(8===s.nodeType)if(s.data===P)n.push({type:2,index:r});else{let t=-1;for(;-1!==(t=s.data.indexOf(A,t+1));)n.push({type:7,index:r}),t+=A.length-1}r++}}static createElement(t,e){const i=M.createElement("template");return i.innerHTML=t,i}}function tt(t,e,i=t,s){if(e===J)return e;let r=void 0!==s?i.W?.[s]:i.Y;const o=I(e)?void 0:e.J;return r?.constructor!==o&&(r?.K?.(!1),void 0===o?r=void 0:(r=new o(t),r.X(t,i,s)),void 0!==s?(i.W??(i.W=[]))[s]=r:i.Y=r),void 0!==r&&(e=tt(t,r.Z(t,e.values),r,s)),e}class et{constructor(t,e){this.G=[],this.tt=void 0,this.et=t,this.it=e}get parentNode(){return this.it.parentNode}get st(){return this.it.st}u(t){const{el:{content:e},parts:i}=this.et,s=(t?.creationScope??M).importNode(e,!0);Z.currentNode=s;let r=Z.nextNode(),o=0,a=0,n=i[0];for(;void 0!==n;){if(o===n.index){let e;2===n.type?e=new it(r,r.nextSibling,this,t):1===n.type?e=new n.ctor(r,n.name,n.strings,this,t):6===n.type&&(e=new nt(r,this,t)),this.G.push(e),n=i[++a]}o!==n?.index&&(r=Z.nextNode(),o++)}return Z.currentNode=M,s}p(t){let e=0;for(const i of this.G)void 0!==i&&(void 0!==i.strings?(i.rt(t,i,e),e+=i.strings.length-2):i.rt(t[e])),e++}}class it{get st(){return this.it?.st??this.ot}constructor(t,e,i,s){this.type=2,this.nt=K,this.tt=void 0,this.ht=t,this.ct=e,this.it=i,this.options=s,this.ot=s?.isConnected??!0}get parentNode(){let t=this.ht.parentNode;const e=this.it;return void 0!==e&&11===t?.nodeType&&(t=e.parentNode),t}get startNode(){return this.ht}get endNode(){return this.ct}rt(t,e=this){t=tt(this,t,e),I(t)?t===K||null==t||""===t?(this.nt!==K&&this.lt(),this.nt=K):t!==this.nt&&t!==J&&this.dt(t):void 0!==t.H?this.$(t):void 0!==t.nodeType?this.T(t):(t=>q(t)||"function"==typeof t?.[Symbol.iterator])(t)?this.k(t):this.dt(t)}O(t){return this.ht.parentNode.insertBefore(t,this.ct)}T(t){this.nt!==t&&(this.lt(),this.nt=this.O(t))}dt(t){this.nt!==K&&I(this.nt)?this.ht.nextSibling.data=t:this.T(M.createTextNode(t)),this.nt=t}$(t){const{values:e,H:i}=t,s="number"==typeof i?this.ft(t):(void 0===i.el&&(i.el=Q.createElement(G(i.h,i.h[0]),this.options)),i);if(this.nt?.et===s)this.nt.p(e);else{const t=new et(s,this),i=t.u(this.options);t.p(e),this.T(i),this.nt=t}}ft(t){let e=X.get(t.strings);return void 0===e&&X.set(t.strings,e=new Q(t)),e}k(t){q(this.nt)||(this.nt=[],this.lt());const e=this.nt;let i,s=0;for(const r of t)s===e.length?e.push(i=new it(this.O(R()),this.O(R()),this,this.options)):i=e[s],i.rt(r),s++;s<e.length&&(this.lt(i&&i.ct.nextSibling,s),e.length=s)}lt(t=this.ht.nextSibling,e){for(this.ut?.(!1,!0,e);t!==this.ct;){const e=C(t).nextSibling;C(t).remove(),t=e}}setConnected(t){void 0===this.it&&(this.ot=t,this.ut?.(t))}}class st{get tagName(){return this.element.tagName}get st(){return this.it.st}constructor(t,e,i,s,r){this.type=1,this.nt=K,this.tt=void 0,this.element=t,this.name=e,this.it=s,this.options=r,i.length>2||""!==i[0]||""!==i[1]?(this.nt=Array(i.length-1).fill(new String),this.strings=i):this.nt=K}rt(t,e=this,i,s){const r=this.strings;let o=!1;if(void 0===r)t=tt(this,t,e,0),o=!I(t)||t!==this.nt&&t!==J,o&&(this.nt=t);else{const s=t;let a,n;for(t=r[0],a=0;a<r.length-1;a++)n=tt(this,s[i+a],e,a),n===J&&(n=this.nt[a]),o||(o=!I(n)||n!==this.nt[a]),n===K?t=K:t!==K&&(t+=(n??"")+r[a+1]),this.nt[a]=n}o&&!s&&this.j(t)}j(t){t===K?this.element.removeAttribute(this.name):this.element.setAttribute(this.name,t??"")}}class rt extends st{constructor(){super(...arguments),this.type=3}j(t){this.element[this.name]=t===K?void 0:t}}class ot extends st{constructor(){super(...arguments),this.type=4}j(t){this.element.toggleAttribute(this.name,!!t&&t!==K)}}class at extends st{constructor(t,e,i,s,r){super(t,e,i,s,r),this.type=5}rt(t,e=this){if((t=tt(this,t,e,0)??K)===J)return;const i=this.nt,s=t===K&&i!==K||t.capture!==i.capture||t.once!==i.once||t.passive!==i.passive,r=t!==K&&(i===K||s);s&&this.element.removeEventListener(this.name,this,i),r&&this.element.addEventListener(this.name,this,t),this.nt=t}handleEvent(t){"function"==typeof this.nt?this.nt.call(this.options?.host??this.element,t):this.nt.handleEvent(t)}}class nt{constructor(t,e,i){this.element=t,this.type=6,this.tt=void 0,this.it=e,this.options=i}get st(){return this.it.st}rt(t){tt(this,t)}}const ht=E.litHtmlPolyfillSupport;ht?.(Q,it),(E.litHtmlVersions??(E.litHtmlVersions=[])).push("3.3.2");const ct=globalThis;class lt extends z{constructor(){super(...arguments),this.renderOptions={host:this},this.wt=void 0}createRenderRoot(){var t;const e=super.createRenderRoot();return(t=this.renderOptions).renderBefore??(t.renderBefore=e.firstChild),e}update(t){const e=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this.wt=((t,e,i)=>{const s=i?.renderBefore??e;let r=s.bt;if(void 0===r){const t=i?.renderBefore??null;s.bt=r=new it(e.insertBefore(R(),t),t,void 0,i??{})}return r.rt(t),r})(e,this.renderRoot,this.renderOptions)}connectedCallback(){super.connectedCallback(),this.wt?.setConnected(!0)}disconnectedCallback(){super.disconnectedCallback(),this.wt?.setConnected(!1)}render(){return J}}lt.gt=!0,lt.finalized=!0,ct.litElementHydrateSupport?.({LitElement:lt});const dt=ct.litElementPolyfillSupport;dt?.({LitElement:lt}),(ct.litElementVersions??(ct.litElementVersions=[])).push("4.2.2");const ft=t=>(e,i)=>{void 0!==i?i.addInitializer(()=>{customElements.define(t,e)}):customElements.define(t,e)},ut={attribute:!0,type:String,converter:k,reflect:!1,hasChanged:S},pt=(t=ut,e,i)=>{const{kind:s,metadata:r}=i;let o=globalThis.litPropertyMetadata.get(r);if(void 0===o&&globalThis.litPropertyMetadata.set(r,o=new Map),"setter"===s&&((t=Object.create(t)).wrapped=!0),o.set(i.name,t),"accessor"===s){const{name:s}=i;return{set(i){const r=e.get.call(this);e.set.call(this,i),this.requestUpdate(s,r,t,!0,i)},init(e){return void 0!==e&&this.C(s,void 0,t,e),e}}}if("setter"===s){const{name:s}=i;return function(i){const r=this[s];e.call(this,i),this.requestUpdate(s,r,t,!0,i)}}throw Error("Unsupported decorator location: "+s)};function wt(t){return(e,i)=>"object"==typeof i?pt(t,e,i):((t,e,i)=>{const s=e.hasOwnProperty(i);return e.constructor.createProperty(i,t),s?Object.getOwnPropertyDescriptor(e,i):void 0})(t,e,i)}function bt(t){return wt({...t,state:!0,attribute:!1})}class mt{constructor(t){this.vt={},this.yt={},this.xt=1,this.$t=0,this.kt=!1,this.St=!1,this._t=new Map,this.zt=new Set,this.host=t,t.addController(this)}hostConnected(){}hostDisconnected(){this.zt.clear()}get formData(){return{...this.vt}}get validation(){return{...this.yt}}get currentStep(){return this.xt}get totalSteps(){return this.$t}get submitting(){return this.kt}get submitted(){return this.St}get error(){return this.Et}get state(){return{formData:this.formData,validation:this.validation,currentStep:this.xt,totalSteps:this.$t,submitting:this.kt,submitted:this.St,error:this.Et}}setValue(t,e){this.vt[t]=e,this.yt[t]?this.yt[t]={...this.yt[t],value:e,dirty:!0}:this.yt[t]={name:t,value:e,result:{valid:!0},touched:!1,dirty:!0},this.Ct()}getValue(t){return this.vt[t]}setValidation(t,e){const i=this.yt[t];this.yt[t]={name:t,value:i?.value??this.vt[t],result:e,touched:i?.touched??!1,dirty:i?.dirty??!1},this.Ct()}markTouched(t){this.yt[t]?this.yt[t]={...this.yt[t],touched:!0}:this.yt[t]={name:t,value:this.vt[t],result:{valid:!0},touched:!0,dirty:!1},this.Ct()}setTotalSteps(t){this.$t=t,this.Ct()}setStepConfig(t,e){this._t.set(t,e)}getStepConfig(t){return this._t.get(t)}getStepFields(t){return this._t.get(t)?.fields??[]}goToStep(t){if(t<1||t>this.$t)return!1;const e=this._t.get(t);return e?.skipIf?.(this.vt)?t>this.xt?this.goToStep(t+1):this.goToStep(t-1):(this.xt=t,this.Ct(),!0)}nextStep(){return this.goToStep(this.xt+1)}previousStep(){return this.goToStep(this.xt-1)}isFirstStep(){return 1===this.xt}isLastStep(){return this.xt===this.$t}isStepValid(t){return this.getStepFields(t).every(t=>{const e=this.yt[t];return!e||e.result.valid})}isCurrentStepValid(){return this.isStepValid(this.xt)}getFieldError(t){const e=this.yt[t];if(e?.touched&&!e.result.valid)return e.result.error}hasFieldError(t){return void 0!==this.getFieldError(t)}setSubmitting(t){this.kt=t,this.Ct()}setSubmitted(t){this.St=t,this.Ct()}setError(t){this.Et=t,this.Ct()}reset(){this.vt={},this.yt={},this.xt=1,this.kt=!1,this.St=!1,this.Et=void 0,this.Ct()}subscribe(t){return this.zt.add(t),()=>{this.zt.delete(t)}}Ct(){this.host.requestUpdate();const t=this.state;this.zt.forEach(e=>{try{e(t)}catch(i){}})}}class gt{constructor(t,e={}){this.Ot=!0,this.host=t,this.Tt={blockEnterOnTextarea:!0,...e},this.jt=this.At.bind(this),t.addController(this)}hostConnected(){this.host.addEventListener("keydown",this.jt),document.addEventListener("keydown",this.jt)}hostDisconnected(){this.host.removeEventListener("keydown",this.jt),document.removeEventListener("keydown",this.jt)}At(t){if(!this.Ot)return;const e=this.Pt(),i="TEXTAREA"===e?.tagName,s="INPUT"===e?.tagName,r="true"===e?.getAttribute("contenteditable"),o=i||s||r;switch(t.key){case"Enter":if(i&&this.Tt.blockEnterOnTextarea)return;this.Tt.onEnter&&(t.preventDefault(),this.Tt.onEnter());break;case"Escape":this.Tt.onEscape&&(t.preventDefault(),this.Tt.onEscape());break;case"ArrowUp":!o&&this.Tt.onArrowUp&&(t.preventDefault(),this.Tt.onArrowUp());break;case"ArrowDown":!o&&this.Tt.onArrowDown&&(t.preventDefault(),this.Tt.onArrowDown());break;case"ArrowLeft":!o&&this.Tt.onArrowLeft&&(t.preventDefault(),this.Tt.onArrowLeft());break;case"ArrowRight":!o&&this.Tt.onArrowRight&&(t.preventDefault(),this.Tt.onArrowRight())}}Pt(){let t=document.activeElement;for(;t?.shadowRoot?.activeElement;)t=t.shadowRoot.activeElement;return t}updateConfig(t){this.Tt={...this.Tt,...t}}enable(){this.Ot=!0}disable(){this.Ot=!1}get enabled(){return this.Ot}}var vt=Object.defineProperty,yt=Object.getOwnPropertyDescriptor,xt=(t,e,i,s)=>{for(var r,o=s>1?void 0:s?yt(e,i):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(s?r(e,i,o):r(o))||o);return s&&o&&vt(e,i,o),o};t.WfBadge=class extends lt{constructor(){super(...arguments),this.shortcut="",this.variant="default"}createRenderRoot(){return this}render(){return Y`
|
|
2
2
|
<span
|
|
3
3
|
class="wf-badge wf-badge--${this.variant}"
|
|
4
4
|
aria-hidden="true"
|
|
5
5
|
>
|
|
6
6
|
${this.shortcut}
|
|
7
7
|
</span>
|
|
8
|
-
`}},t.WfBadge.
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
.wf-badge {
|
|
18
|
-
display: inline-flex;
|
|
19
|
-
align-items: center;
|
|
20
|
-
justify-content: center;
|
|
21
|
-
box-sizing: border-box;
|
|
22
|
-
min-width: 24px;
|
|
23
|
-
height: 24px;
|
|
24
|
-
padding: var(--wf-spacing-1, 4px) var(--wf-spacing-2, 8px);
|
|
25
|
-
font-size: var(--wf-font-size-xs, 0.75rem);
|
|
26
|
-
font-weight: 500;
|
|
27
|
-
font-family: inherit;
|
|
28
|
-
text-transform: uppercase;
|
|
29
|
-
flex-shrink: 0;
|
|
30
|
-
line-height: 1;
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
/* Default variant - unselected options */
|
|
34
|
-
.wf-badge--default {
|
|
35
|
-
background-color: var(--wf-color-badge-bg, #fcfcfc);
|
|
36
|
-
border: 1px solid var(--wf-color-badge-border, #d4d4d4);
|
|
37
|
-
border-radius: var(--wf-radius-sm, 4px);
|
|
38
|
-
color: var(--wf-color-badge-text, #5f5f5f);
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
/* Selected variant - selected options */
|
|
42
|
-
.wf-badge--selected {
|
|
43
|
-
background-color: var(--wf-color-primary, #8040f0);
|
|
44
|
-
border: 1px solid var(--wf-color-primary, #8040f0);
|
|
45
|
-
border-radius: var(--wf-radius-sm, 4px);
|
|
46
|
-
color: white;
|
|
47
|
-
}
|
|
48
|
-
|
|
49
|
-
/* Button variant - primary buttons (transparent) */
|
|
50
|
-
.wf-badge--button {
|
|
51
|
-
background-color: transparent;
|
|
52
|
-
border: none;
|
|
53
|
-
border-radius: var(--wf-radius-sm, 4px);
|
|
54
|
-
color: rgba(255, 255, 255, 0.65);
|
|
55
|
-
}
|
|
56
|
-
|
|
57
|
-
/* Button-secondary variant - back button (transparent like primary) */
|
|
58
|
-
.wf-badge--button-secondary {
|
|
59
|
-
background-color: transparent;
|
|
60
|
-
border: none;
|
|
61
|
-
border-radius: var(--wf-radius-sm, 4px);
|
|
62
|
-
color: var(--wf-color-text-muted, #5f5f5f);
|
|
63
|
-
}
|
|
64
|
-
`,$t([mt({type:String})],t.WfBadge.prototype,"shortcut",2),$t([mt({type:String})],t.WfBadge.prototype,"variant",2),t.WfBadge=$t([ut("wf-badge")],t.WfBadge);var St=Object.defineProperty,kt=Object.getOwnPropertyDescriptor,_t=(t,e,s,i)=>{for(var r,o=i>1?void 0:i?kt(e,s):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(i?r(e,s,o):r(o))||o);return i&&o&&St(e,s,o),o};t.WizardForm=class extends dt{constructor(){super(),this.hubspotPortal="",this.hubspotForm="",this.theme="light",this.mock=!1,this.showProgress=!1,this.autoAdvance=!0,this.hideBack=!0,this.Mt=[],this.xt=1,this.$t=0,this.vt={},this.St=!1,this.kt=!1,this.zt="",this.Pt=new gt(this),this.Vt=t=>{const{name:e,value:s,extraFields:i}=t.detail;this.vt[e]=s,this.Pt.setValue(e,s),i&&Object.entries(i).forEach(([t,e])=>{this.vt[t]=e,this.Pt.setValue(t,e)}),this.zt="",this.dispatchEvent(new CustomEvent("wf:field-change",{detail:{name:e,value:s,formData:{...this.vt}},bubbles:!0,composed:!0}))},this.qt=t=>{if(this.autoAdvance){const e=t.target.closest("wf-options");e&&!e.hasAttribute("multi")&&setTimeout(()=>{this.It()},300)}},new vt(this,{onEnter:()=>this.Bt(),onEscape:()=>this.Dt()})}connectedCallback(){super.connectedCallback(),this.addEventListener("wf-change",this.Vt),this.addEventListener("wf-option-select",this.qt)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("wf-change",this.Vt),this.removeEventListener("wf-option-select",this.qt)}firstUpdated(){this.Ft(),this.Ut()}render(){return this.kt?Y`
|
|
65
|
-
<div class="wf-container">
|
|
8
|
+
`}},xt([wt({type:String})],t.WfBadge.prototype,"shortcut",2),xt([wt({type:String})],t.WfBadge.prototype,"variant",2),t.WfBadge=xt([ft("wf-badge")],t.WfBadge);var $t=Object.defineProperty,kt=Object.getOwnPropertyDescriptor,St=(t,e,i,s)=>{for(var r,o=s>1?void 0:s?kt(e,i):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(s?r(e,i,o):r(o))||o);return s&&o&&$t(e,i,o),o};t.WizardForm=class extends lt{constructor(){super(),this.hubspotPortal="",this.hubspotForm="",this.theme="light",this.mock=!1,this.showProgress=!1,this.autoAdvance=!0,this.hideBack=!0,this.submitOnStep=!1,this.Nt=[],this.xt=1,this.$t=0,this.vt={},this.kt=!1,this.St=!1,this.Et="",this.Mt=null,this.Rt=new mt(this),this.It=t=>{const{name:e,value:i,extraFields:s}=t.detail;this.vt[e]=i,this.Rt.setValue(e,i),s&&Object.entries(s).forEach(([t,e])=>{this.vt[t]=e,this.Rt.setValue(t,e)}),this.Et="",this.dispatchEvent(new CustomEvent("wf:field-change",{detail:{name:e,value:i,formData:{...this.vt}},bubbles:!0,composed:!0}))},this.qt=t=>{if(this.autoAdvance){const e=t.target.closest("wf-options");e&&!e.hasAttribute("multi")&&setTimeout(()=>{this.Dt()},300)}},new gt(this,{onEnter:()=>this.Ft(),onEscape:()=>this.Vt()})}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),this.addEventListener("wf-change",this.It),this.addEventListener("wf-option-select",this.qt)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("wf-change",this.It),this.removeEventListener("wf-option-select",this.qt)}firstUpdated(){this.Mt=this.querySelector('[slot="success"]'),this.Bt(),this.Ut()}render(){return this.St?(this.Nt.forEach(t=>{t.active=!1,t.style.display="none"}),this.Mt?(this.Mt.style.display="",Y`
|
|
9
|
+
<div class="wf-container wf-submitted">
|
|
10
|
+
<div class="wf-success-screen">
|
|
11
|
+
${this.Mt}
|
|
12
|
+
</div>
|
|
13
|
+
</div>
|
|
14
|
+
`):Y`
|
|
15
|
+
<div class="wf-container wf-submitted">
|
|
66
16
|
<div class="wf-success-screen">
|
|
67
|
-
<
|
|
68
|
-
|
|
69
|
-
<p>Your submission has been received.</p>
|
|
70
|
-
</slot>
|
|
17
|
+
<h2>Thank you!</h2>
|
|
18
|
+
<p>Your submission has been received.</p>
|
|
71
19
|
</div>
|
|
72
20
|
</div>
|
|
73
|
-
|
|
21
|
+
`):(this.Mt&&(this.Mt.style.display="none"),Y`
|
|
74
22
|
<div class="wf-container">
|
|
75
|
-
${this.
|
|
76
|
-
|
|
77
|
-
<div class="wf-steps-container">
|
|
78
|
-
<slot @slotchange="${this.Rt}"></slot>
|
|
79
|
-
</div>
|
|
23
|
+
${this.Et?Y`<div class="wf-form-error" role="alert">${this.Et}</div>`:K}
|
|
80
24
|
|
|
81
25
|
${this.Lt()}
|
|
82
26
|
</div>
|
|
83
|
-
`}
|
|
27
|
+
`)}Ht(){const t=[];for(let e=1;e<=this.$t;e++){const i=e<this.xt,s=e===this.xt;t.push(Y`
|
|
84
28
|
<div
|
|
85
|
-
class="wf-progress-segment ${
|
|
29
|
+
class="wf-progress-segment ${i?"completed":""} ${s?"active":""}"
|
|
86
30
|
></div>
|
|
87
|
-
`)}return Y`<div class="wf-progress">${t}</div>`}Lt(){const t=1===this.xt,e=this.xt===this.$t,
|
|
31
|
+
`)}return Y`<div class="wf-progress">${t}</div>`}Lt(){const t=1===this.xt,e=this.xt===this.$t,i=!this.hideBack&&!t;return Y`
|
|
88
32
|
<div class="wf-navigation">
|
|
89
|
-
${
|
|
33
|
+
${i?Y`
|
|
90
34
|
<button
|
|
91
35
|
class="wf-btn wf-btn-back"
|
|
92
|
-
@click="${this.
|
|
93
|
-
?disabled="${this.
|
|
36
|
+
@click="${this.Wt}"
|
|
37
|
+
?disabled="${this.kt}"
|
|
94
38
|
data-testid="wf-back-btn"
|
|
95
39
|
>
|
|
96
40
|
<span class="wf-btn-shortcut"><wf-badge shortcut="Esc" variant="button-secondary"></wf-badge></span>
|
|
@@ -100,560 +44,59 @@
|
|
|
100
44
|
|
|
101
45
|
<button
|
|
102
46
|
class="wf-btn wf-btn-next"
|
|
103
|
-
@click="${this.
|
|
104
|
-
?disabled="${this.
|
|
47
|
+
@click="${this.Dt}"
|
|
48
|
+
?disabled="${this.kt}"
|
|
105
49
|
data-testid="wf-next-btn"
|
|
106
50
|
>
|
|
107
|
-
${this.
|
|
51
|
+
${this.kt?Y`<span class="wf-loading"></span>`:e?"Submit":"Continue"}
|
|
108
52
|
<span class="wf-btn-shortcut"><wf-badge shortcut="Enter ↵" variant="button"></wf-badge></span>
|
|
109
53
|
</button>
|
|
110
54
|
</div>
|
|
111
|
-
`}
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
--wf-color-surface: #f3f3f5;
|
|
118
|
-
--wf-color-surface-hover: #e9e9eb;
|
|
119
|
-
--wf-color-border: #d4d4d4;
|
|
120
|
-
--wf-color-text: #0a0a0a;
|
|
121
|
-
--wf-color-text-secondary: #404040;
|
|
122
|
-
--wf-color-text-muted: #646464;
|
|
123
|
-
--wf-color-error: #dc3545;
|
|
124
|
-
--wf-color-badge-bg: #fcfcfc;
|
|
125
|
-
--wf-color-badge-border: #d4d4d4;
|
|
126
|
-
--wf-color-badge-text: #5f5f5f;
|
|
127
|
-
--wf-color-progress-active: rgba(139, 139, 139, 0.6);
|
|
128
|
-
--wf-color-progress-inactive: rgba(217, 217, 217, 0.6);
|
|
129
|
-
--wf-spacing-1: 4px;
|
|
130
|
-
--wf-spacing-2: 8px;
|
|
131
|
-
--wf-spacing-3: 12px;
|
|
132
|
-
--wf-spacing-4: 16px;
|
|
133
|
-
--wf-spacing-5: 20px;
|
|
134
|
-
--wf-spacing-6: 24px;
|
|
135
|
-
--wf-spacing-8: 32px;
|
|
136
|
-
--wf-radius-sm: 4px;
|
|
137
|
-
--wf-radius-md: 8px;
|
|
138
|
-
--wf-radius-lg: 8px;
|
|
139
|
-
--wf-radius-full: 99px;
|
|
140
|
-
/* Typography Scale (Major Third based, 16px = 1rem) */
|
|
141
|
-
--wf-font-size-xs: 0.75rem; /* 12px - badges, captions */
|
|
142
|
-
--wf-font-size-sm: 0.875rem; /* 14px - labels, hints */
|
|
143
|
-
--wf-font-size-base: 1rem; /* 16px - body, inputs */
|
|
144
|
-
--wf-font-size-lg: 1.25rem; /* 20px - buttons */
|
|
145
|
-
--wf-font-size-xl: 1.5rem; /* 24px - subtitles */
|
|
146
|
-
--wf-font-size-2xl: 2rem; /* 32px - small headings */
|
|
147
|
-
--wf-font-size-3xl: 2.5rem; /* 40px - main headings */
|
|
148
|
-
--wf-input-min-height: 56px;
|
|
149
|
-
}
|
|
150
|
-
|
|
151
|
-
/* Dark theme */
|
|
152
|
-
:host([theme='dark']) {
|
|
153
|
-
--wf-color-surface: #2d2d2d;
|
|
154
|
-
--wf-color-surface-hover: #3d3d3d;
|
|
155
|
-
--wf-color-border: #4d4d4d;
|
|
156
|
-
--wf-color-text: #f8f9fa;
|
|
157
|
-
--wf-color-text-secondary: #d0d0d0;
|
|
158
|
-
--wf-color-text-muted: #adb5bd;
|
|
159
|
-
--wf-color-badge-bg: #3d3d3d;
|
|
160
|
-
--wf-color-badge-border: #4d4d4d;
|
|
161
|
-
--wf-color-badge-text: #adb5bd;
|
|
162
|
-
--wf-color-progress-active: rgba(200, 200, 200, 0.6);
|
|
163
|
-
--wf-color-progress-inactive: rgba(100, 100, 100, 0.6);
|
|
164
|
-
}
|
|
165
|
-
|
|
166
|
-
/* Auto theme (respects system preference) */
|
|
167
|
-
@media (prefers-color-scheme: dark) {
|
|
168
|
-
:host([theme='auto']) {
|
|
169
|
-
--wf-color-surface: #2d2d2d;
|
|
170
|
-
--wf-color-surface-hover: #3d3d3d;
|
|
171
|
-
--wf-color-border: #4d4d4d;
|
|
172
|
-
--wf-color-text: #f8f9fa;
|
|
173
|
-
--wf-color-text-secondary: #d0d0d0;
|
|
174
|
-
--wf-color-text-muted: #adb5bd;
|
|
175
|
-
--wf-color-badge-bg: #3d3d3d;
|
|
176
|
-
--wf-color-badge-border: #4d4d4d;
|
|
177
|
-
--wf-color-badge-text: #adb5bd;
|
|
178
|
-
--wf-color-progress-active: rgba(200, 200, 200, 0.6);
|
|
179
|
-
--wf-color-progress-inactive: rgba(100, 100, 100, 0.6);
|
|
180
|
-
}
|
|
181
|
-
}
|
|
182
|
-
|
|
183
|
-
.wf-container {
|
|
184
|
-
margin: 0 auto;
|
|
185
|
-
}
|
|
186
|
-
|
|
187
|
-
.wf-progress {
|
|
188
|
-
display: flex;
|
|
189
|
-
gap: var(--wf-spacing-4, 16px);
|
|
190
|
-
margin-top: var(--wf-spacing-6, 24px);
|
|
191
|
-
}
|
|
192
|
-
|
|
193
|
-
.wf-progress-segment {
|
|
194
|
-
width: 32px;
|
|
195
|
-
height: 8px;
|
|
196
|
-
background-color: var(--wf-color-progress-inactive, rgba(217, 217, 217, 0.6));
|
|
197
|
-
border-radius: var(--wf-radius-full, 99px);
|
|
198
|
-
transition: background-color 300ms ease;
|
|
199
|
-
}
|
|
200
|
-
|
|
201
|
-
.wf-progress-segment.completed {
|
|
202
|
-
background-color: var(--wf-color-progress-active, rgba(139, 139, 139, 0.6));
|
|
203
|
-
}
|
|
204
|
-
|
|
205
|
-
.wf-progress-segment.active {
|
|
206
|
-
background-color: var(--wf-color-progress-active, rgba(139, 139, 139, 0.6));
|
|
207
|
-
}
|
|
208
|
-
|
|
209
|
-
.wf-steps-container {
|
|
210
|
-
min-height: 200px;
|
|
211
|
-
}
|
|
212
|
-
|
|
213
|
-
.wf-navigation {
|
|
214
|
-
display: flex;
|
|
215
|
-
justify-content: space-between;
|
|
216
|
-
gap: var(--wf-spacing-4, 16px);
|
|
217
|
-
margin-top: var(--wf-spacing-6, 24px);
|
|
218
|
-
}
|
|
219
|
-
|
|
220
|
-
.wf-btn {
|
|
221
|
-
display: inline-flex;
|
|
222
|
-
align-items: center;
|
|
223
|
-
justify-content: center;
|
|
224
|
-
gap: var(--wf-spacing-2, 8px);
|
|
225
|
-
padding: var(--wf-spacing-3, 12px) var(--wf-spacing-4, 16px);
|
|
226
|
-
min-height: 48px;
|
|
227
|
-
font-size: var(--wf-font-size-base, 1rem);
|
|
228
|
-
font-weight: 600;
|
|
229
|
-
font-family: inherit;
|
|
230
|
-
border-radius: var(--wf-radius-md, 8px);
|
|
231
|
-
cursor: pointer;
|
|
232
|
-
transition: all 150ms ease;
|
|
233
|
-
border: 1px solid transparent;
|
|
234
|
-
outline: none;
|
|
235
|
-
}
|
|
236
|
-
|
|
237
|
-
.wf-btn:focus-visible {
|
|
238
|
-
box-shadow: 0 0 0 3px rgba(128, 64, 240, 0.3);
|
|
239
|
-
}
|
|
240
|
-
|
|
241
|
-
.wf-btn-back {
|
|
242
|
-
background-color: var(--wf-color-surface, #f3f3f5);
|
|
243
|
-
border: 1px solid var(--wf-color-border, #d4d4d4);
|
|
244
|
-
color: var(--wf-color-text, #0a0a0a);
|
|
245
|
-
}
|
|
246
|
-
|
|
247
|
-
.wf-btn-back:hover:not(:disabled) {
|
|
248
|
-
background-color: var(--wf-color-surface-hover, #e9e9eb);
|
|
249
|
-
}
|
|
250
|
-
|
|
251
|
-
.wf-btn-next {
|
|
252
|
-
flex: 1;
|
|
253
|
-
background-color: var(--wf-color-primary, #8040f0);
|
|
254
|
-
border: 1px solid var(--wf-color-primary-border, #602cbb);
|
|
255
|
-
color: white;
|
|
256
|
-
margin-left: auto;
|
|
257
|
-
position: relative;
|
|
258
|
-
}
|
|
259
|
-
|
|
260
|
-
.wf-btn-next:hover:not(:disabled) {
|
|
261
|
-
filter: brightness(1.1);
|
|
262
|
-
}
|
|
263
|
-
|
|
264
|
-
.wf-btn:disabled {
|
|
265
|
-
opacity: 0.5;
|
|
266
|
-
cursor: not-allowed;
|
|
267
|
-
}
|
|
268
|
-
|
|
269
|
-
.wf-btn-shortcut {
|
|
270
|
-
position: absolute;
|
|
271
|
-
right: var(--wf-spacing-4, 16px);
|
|
272
|
-
display: inline-flex;
|
|
273
|
-
align-items: center;
|
|
274
|
-
gap: 2px;
|
|
275
|
-
}
|
|
276
|
-
|
|
277
|
-
.wf-btn-back .wf-btn-shortcut {
|
|
278
|
-
position: static;
|
|
279
|
-
}
|
|
280
|
-
|
|
281
|
-
/* Success screen styles */
|
|
282
|
-
.wf-success-screen {
|
|
283
|
-
text-align: center;
|
|
284
|
-
padding: var(--wf-spacing-6, 24px);
|
|
285
|
-
}
|
|
286
|
-
|
|
287
|
-
/* Loading spinner */
|
|
288
|
-
.wf-loading {
|
|
289
|
-
display: inline-block;
|
|
290
|
-
width: 20px;
|
|
291
|
-
height: 20px;
|
|
292
|
-
border: 2px solid rgba(255, 255, 255, 0.3);
|
|
293
|
-
border-radius: 50%;
|
|
294
|
-
border-top-color: white;
|
|
295
|
-
animation: spin 0.8s linear infinite;
|
|
296
|
-
}
|
|
297
|
-
|
|
298
|
-
@keyframes spin {
|
|
299
|
-
to {
|
|
300
|
-
transform: rotate(360deg);
|
|
301
|
-
}
|
|
302
|
-
}
|
|
303
|
-
|
|
304
|
-
/* Error message */
|
|
305
|
-
.wf-form-error {
|
|
306
|
-
padding: var(--wf-spacing-4, 16px);
|
|
307
|
-
margin-bottom: var(--wf-spacing-4, 16px);
|
|
308
|
-
background-color: rgba(220, 53, 69, 0.1);
|
|
309
|
-
border: 1px solid var(--wf-color-error, #dc3545);
|
|
310
|
-
border-radius: var(--wf-radius-md, 8px);
|
|
311
|
-
color: var(--wf-color-error, #dc3545);
|
|
312
|
-
font-size: var(--wf-font-size-base, 1rem);
|
|
313
|
-
}
|
|
314
|
-
`,_t([mt({type:String,attribute:"hubspot-portal"})],t.WizardForm.prototype,"hubspotPortal",2),_t([mt({type:String,attribute:"hubspot-form"})],t.WizardForm.prototype,"hubspotForm",2),_t([mt({type:String,reflect:!0})],t.WizardForm.prototype,"theme",2),_t([mt({type:Boolean})],t.WizardForm.prototype,"mock",2),_t([mt({type:Boolean,attribute:"show-progress"})],t.WizardForm.prototype,"showProgress",2),_t([mt({type:Boolean,attribute:"auto-advance"})],t.WizardForm.prototype,"autoAdvance",2),_t([mt({type:Boolean,attribute:"hide-back"})],t.WizardForm.prototype,"hideBack",2),_t([bt()],t.WizardForm.prototype,"_steps",2),_t([bt()],t.WizardForm.prototype,"_currentStep",2),_t([bt()],t.WizardForm.prototype,"_totalSteps",2),_t([bt()],t.WizardForm.prototype,"_formData",2),_t([bt()],t.WizardForm.prototype,"_submitting",2),_t([bt()],t.WizardForm.prototype,"_submitted",2),_t([bt()],t.WizardForm.prototype,"_error",2),t.WizardForm=_t([ut("wizard-form")],t.WizardForm),t.WfSuccess=class extends dt{render(){return Y`<slot></slot>`}},t.WfSuccess.styles=d`
|
|
315
|
-
:host {
|
|
316
|
-
display: block;
|
|
317
|
-
}
|
|
318
|
-
|
|
319
|
-
::slotted(h1),
|
|
320
|
-
::slotted(h2),
|
|
321
|
-
::slotted(h3) {
|
|
322
|
-
margin: 0 0 var(--wf-spacing-4, 16px) 0;
|
|
323
|
-
font-weight: 600;
|
|
324
|
-
color: var(--wf-color-text, #212529);
|
|
325
|
-
}
|
|
326
|
-
|
|
327
|
-
::slotted(p) {
|
|
328
|
-
margin: 0;
|
|
329
|
-
color: var(--wf-color-text-muted, #6c757d);
|
|
330
|
-
}
|
|
331
|
-
`,t.WfSuccess=_t([ut("wf-success")],t.WfSuccess);var Et=Object.defineProperty,zt=Object.getOwnPropertyDescriptor,Ct=(t,e,s,i)=>{for(var r,o=i>1?void 0:i?zt(e,s):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(i?r(e,s,o):r(o))||o);return i&&o&&Et(e,s,o),o};t.WfStep=class extends dt{constructor(){super(...arguments),this.step=0,this.active=!1,this.direction="forward",this.leaving=!1,this.skipIf="",this.Zt=[]}render(){return Y`
|
|
332
|
-
<div class="wf-step-content">
|
|
333
|
-
<slot @slotchange="${this.Rt}"></slot>
|
|
334
|
-
</div>
|
|
335
|
-
`}Rt(){this.Gt()}firstUpdated(){this.Gt()}updated(t){t.has("active")&&this.active&&(this.leaving=!1,this.Qt())}Gt(){const t=this.shadowRoot?.querySelector("slot");if(!t)return;const e=t.assignedElements({flatten:!0}),s=[],i=t=>{if(["wf-options","wf-field","wf-email","wf-input","wf-textarea"].includes(t.tagName.toLowerCase())){const e=t.getAttribute("name");e&&s.push(e)}Array.from(t.children).forEach(i)};e.forEach(i),this.Zt=s}Qt(){requestAnimationFrame(()=>{const t=this.shadowRoot?.querySelector("slot");if(!t)return;const e=t.assignedElements({flatten:!0});for(const s of e){const t=this.te(s);if(t)return void t.focus()}})}te(t){if(t instanceof HTMLElement&&"function"==typeof t.focus&&["wf-field","wf-email","wf-input","wf-textarea"].includes(t.tagName.toLowerCase()))return t;for(const e of t.children){const t=this.te(e);if(t)return t}return null}get fields(){return[...this.Zt]}shouldSkip(t){if(!this.skipIf)return!1;try{const e=this.skipIf.trim();if(e.startsWith("!"))return!t[e.slice(1)];if(e.includes("===")){const[s,i]=e.split("===").map(t=>t.trim());return t[s]===i.replace(/['"]/g,"")}if(e.includes("!==")){const[s,i]=e.split("!==").map(t=>t.trim());return t[s]!==i.replace(/['"]/g,"")}return!!t[e]}catch(e){return!1}}show(t="forward"){this.direction=t,this.leaving=!1,this.active=!0}hide(){return new Promise(t=>{this.leaving=!0;const e=()=>{this.active=!1,this.leaving=!1,this.removeEventListener("animationend",e),t()};this.addEventListener("animationend",e),setTimeout(()=>{this.active=!1,this.leaving=!1,this.removeEventListener("animationend",e),t()},300)})}async validate(){const t=this.shadowRoot?.querySelector("slot");if(!t)return!0;const e=t.assignedElements({flatten:!0}),s=[];let i=!0;const r=async t=>{"validate"in t&&"function"==typeof t.validate&&(await t.validate()||(s.push(t),i=!1));for(const e of t.children)await r(e)};for(const o of e)await r(o);if(s.length>0){const t=s[0];t.scrollIntoView({behavior:"smooth",block:"center"}),setTimeout(()=>{"focus"in t&&"function"==typeof t.focus&&t.focus()},100)}return i}},t.WfStep.styles=d`
|
|
336
|
-
:host {
|
|
337
|
-
display: none;
|
|
338
|
-
width: 100%;
|
|
339
|
-
}
|
|
340
|
-
|
|
341
|
-
:host([active]) {
|
|
342
|
-
display: block;
|
|
343
|
-
animation: stepFadeIn 0.3s ease forwards;
|
|
344
|
-
}
|
|
345
|
-
|
|
346
|
-
:host([direction='forward'][active]) {
|
|
347
|
-
animation: stepSlideInRight 0.3s ease forwards;
|
|
348
|
-
}
|
|
349
|
-
|
|
350
|
-
:host([direction='backward'][active]) {
|
|
351
|
-
animation: stepSlideInLeft 0.3s ease forwards;
|
|
352
|
-
}
|
|
353
|
-
|
|
354
|
-
:host([leaving]) {
|
|
355
|
-
display: block;
|
|
356
|
-
animation: stepFadeOut 0.2s ease forwards;
|
|
357
|
-
}
|
|
358
|
-
|
|
359
|
-
@keyframes stepFadeIn {
|
|
360
|
-
from {
|
|
361
|
-
opacity: 0;
|
|
362
|
-
transform: translateY(10px);
|
|
363
|
-
}
|
|
364
|
-
to {
|
|
365
|
-
opacity: 1;
|
|
366
|
-
transform: translateY(0);
|
|
367
|
-
}
|
|
368
|
-
}
|
|
369
|
-
|
|
370
|
-
@keyframes stepFadeOut {
|
|
371
|
-
from {
|
|
372
|
-
opacity: 1;
|
|
373
|
-
transform: translateY(0);
|
|
374
|
-
}
|
|
375
|
-
to {
|
|
376
|
-
opacity: 0;
|
|
377
|
-
transform: translateY(-10px);
|
|
378
|
-
}
|
|
379
|
-
}
|
|
380
|
-
|
|
381
|
-
@keyframes stepSlideInRight {
|
|
382
|
-
from {
|
|
383
|
-
opacity: 0;
|
|
384
|
-
transform: translateX(30px);
|
|
385
|
-
}
|
|
386
|
-
to {
|
|
387
|
-
opacity: 1;
|
|
388
|
-
transform: translateX(0);
|
|
389
|
-
}
|
|
390
|
-
}
|
|
391
|
-
|
|
392
|
-
@keyframes stepSlideInLeft {
|
|
393
|
-
from {
|
|
394
|
-
opacity: 0;
|
|
395
|
-
transform: translateX(-30px);
|
|
396
|
-
}
|
|
397
|
-
to {
|
|
398
|
-
opacity: 1;
|
|
399
|
-
transform: translateX(0);
|
|
400
|
-
}
|
|
401
|
-
}
|
|
402
|
-
|
|
403
|
-
.wf-step-content {
|
|
404
|
-
display: flex;
|
|
405
|
-
flex-direction: column;
|
|
406
|
-
gap: var(--wf-spacing-4, 16px);
|
|
407
|
-
}
|
|
408
|
-
|
|
409
|
-
/* Slotted heading styles */
|
|
410
|
-
::slotted(h1),
|
|
411
|
-
::slotted(h2),
|
|
412
|
-
::slotted(h3) {
|
|
413
|
-
margin: 0;
|
|
414
|
-
font-weight: 600;
|
|
415
|
-
color: var(--wf-color-text, #212529);
|
|
416
|
-
}
|
|
417
|
-
|
|
418
|
-
::slotted(h2) {
|
|
419
|
-
font-size: var(--wf-font-size-3xl, 2rem);
|
|
420
|
-
}
|
|
421
|
-
|
|
422
|
-
::slotted(p) {
|
|
423
|
-
margin: 0;
|
|
424
|
-
color: var(--wf-color-text-muted, #6c757d);
|
|
425
|
-
font-size: var(--wf-font-size-xl, 1.375rem);
|
|
426
|
-
}
|
|
427
|
-
`,Ct([mt({type:Number,attribute:"data-step"})],t.WfStep.prototype,"step",2),Ct([mt({type:Boolean,reflect:!0})],t.WfStep.prototype,"active",2),Ct([mt({type:String,reflect:!0})],t.WfStep.prototype,"direction",2),Ct([mt({type:Boolean,reflect:!0})],t.WfStep.prototype,"leaving",2),Ct([mt({type:String,attribute:"data-skip-if"})],t.WfStep.prototype,"skipIf",2),Ct([bt()],t.WfStep.prototype,"_fields",2),t.WfStep=Ct([ut("wf-step")],t.WfStep);var Tt=Object.defineProperty,Ot=Object.getOwnPropertyDescriptor,jt=(t,e,s,i)=>{for(var r,o=i>1?void 0:i?Ot(e,s):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(i?r(e,s,o):r(o))||o);return i&&o&&Tt(e,s,o),o};t.WfOptions=class extends dt{constructor(){super(...arguments),this.name="",this.multi=!1,this.required=!1,this.min=0,this.max=0,this.columns=2,this.allowOther=!1,this.otherLabel="Other, please specify:",this.otherPlaceholder="Enter your answer",this.otherRequired=!1,this.otherName="",this.otherFieldValue="Others",this.ee=new Set,this.se="",this.ie="",this.re=!1,this.oe=[],this.ae=new Map,this.ne="",this.qt=t=>{t.stopPropagation();const{value:e}=t.detail;this.he(e)},this.At=t=>{const e=this.closest("wf-step");if(!e||!e.hasAttribute("active"))return;const s=t.composedPath()[0];if("INPUT"===s?.tagName||"TEXTAREA"===s?.tagName)return;const i=this.shadowRoot?.querySelector("#wf-other-input");if(i&&i===this.shadowRoot?.activeElement)return;const r=t.key.toUpperCase();if(1===r.length&&r>="A"&&r<="Z"){if(this.allowOther&&r===this.ne){t.preventDefault();const e=this.shadowRoot?.querySelector("#wf-other-input");return void(e&&e.focus())}const e=this.ae.get(r);e&&!e.disabled&&(t.preventDefault(),e.triggerSelect())}}}connectedCallback(){super.connectedCallback(),this.ie="",this.re=!1,this.addEventListener("wf-option-select",this.qt),document.addEventListener("keydown",this.At)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("wf-option-select",this.qt),document.removeEventListener("keydown",this.At)}firstUpdated(){this.le()}updated(t){(t.has("multi")||t.has("max"))&&this.ce()}render(){return Y`
|
|
428
|
-
<div
|
|
429
|
-
class="wf-options-container"
|
|
430
|
-
role="listbox"
|
|
431
|
-
aria-multiselectable="${this.multi}"
|
|
432
|
-
aria-required="${this.required}"
|
|
433
|
-
>
|
|
434
|
-
<slot @slotchange="${this.Rt}"></slot>
|
|
435
|
-
</div>
|
|
55
|
+
`}Bt(){this.Nt=Array.from(this.querySelectorAll(":scope > wf-step")),this.Nt.forEach((t,e)=>{t.step=e+1}),this.$t=this.Nt.length,this.Rt.setTotalSteps(this.$t),this.dispatchEvent(new CustomEvent("wf:steps-discovered",{detail:{totalSteps:this.$t,currentStep:this.xt},bubbles:!0,composed:!0}))}Ut(){this.Nt.forEach((t,e)=>{e+1===this.xt?t.show("forward"):t.active=!1})}Yt(t){const e=t-1;return this.Nt[e]}async Dt(){if(this.kt)return;const t=this.Yt(this.xt);t&&!(await t.validate())||(this.xt>=this.$t?await this.Jt():this.Kt(this.xt+1,"forward"))}Wt(){this.kt||this.xt<=1||this.Kt(this.xt-1,"backward")}async Kt(t,e){if(t<1||t>this.$t)return;const i=this.Yt(t);if(!i)return;if(i.shouldSkip(this.vt)){const i="forward"===e?t+1:t-1;return i>=1&&i<=this.$t?this.Kt(i,e):void 0}const s=this.xt;let r,o=!1;if(this.submitOnStep&&this.hubspotPortal&&this.hubspotForm)try{await this.Xt(),o=!0,r="hubspot"}catch(n){return void this.dispatchEvent(new CustomEvent("wf:error",{detail:{error:n instanceof Error?n.message:"Partial submission failed",formData:this.Zt(this.xt)},bubbles:!0,composed:!0}))}const a=this.Yt(this.xt);a&&await a.hide(),this.xt=t,this.Rt.goToStep(t),i.show(e),this.dispatchEvent(new CustomEvent("wf:step-change",{detail:{from:s,to:t,direction:e,submitted:o,adapter:r},bubbles:!0,composed:!0}))}async Ft(){await this.Dt()}Vt(){this.Wt()}async Jt(){if(this.kt)return;const t={...this.vt},e=new CustomEvent("wf:submit",{detail:{formData:t},bubbles:!0,composed:!0,cancelable:!0});if(this.dispatchEvent(e),e.defaultPrevented)return;this.kt=!0,this.Et="";let i=t;this.serialize&&(i=this.serialize(t));try{let t;this.mock?(await new Promise(t=>setTimeout(t,1e3)),t={success:!0}):t=this.hubspotPortal&&this.hubspotForm?await this.Gt(i):{success:!0},this.St=!0,this.dispatchEvent(new CustomEvent("wf:success",{detail:{formData:i,response:t},bubbles:!0,composed:!0}))}catch(s){const t=s instanceof Error?s.message:"Submission failed";this.Et=t,this.dispatchEvent(new CustomEvent("wf:error",{detail:{error:t,formData:i},bubbles:!0,composed:!0}))}finally{this.kt=!1}}async Gt(t){const e=`https://api.hsforms.com/submissions/v3/integration/submit/${this.hubspotPortal}/${this.hubspotForm}`,i={fields:Object.entries(t).map(([t,e])=>({name:t,value:Array.isArray(e)?e.join(";"):(e??"")+""})),context:{pageUri:window.location.href,pageName:document.title}},s=await fetch(e,{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify(i)});if(!s.ok){const t=await s.json().catch(()=>({}));throw Error(t.message||"HubSpot submission failed: "+s.status)}return s.json()}Zt(t){const e={};for(let i=0;i<t&&i<this.Nt.length;i++)this.Nt[i].querySelectorAll("[name]").forEach(t=>{t.name&&void 0!==this.vt[t.name]&&(e[t.name]=this.vt[t.name])});return e}async Xt(){let t={...this.Zt(this.xt)};this.serialize&&(t=this.serialize(t)),await this.Gt(t)}get formData(){return{...this.vt}}get currentStep(){return this.xt}get totalSteps(){return this.$t}get isSubmitting(){return this.kt}get isSubmitted(){return this.St}goToStep(t){const e=t>this.xt?"forward":"backward";this.Kt(t,e)}next(){return this.Dt()}back(){this.Wt()}submit(){return this.Jt()}reset(){this.vt={},this.xt=1,this.kt=!1,this.St=!1,this.Et="",this.Rt.reset(),this.Ut(),this.Nt.forEach(t=>{t.querySelectorAll("wf-options, wf-field, wf-email").forEach(t=>{"reset"in t&&"function"==typeof t.reset&&t.reset()})})}setFormData(t){this.vt={...this.vt,...t},Object.entries(t).forEach(([t,e])=>{this.Rt.setValue(t,e)})}},St([wt({type:String,attribute:"hubspot-portal"})],t.WizardForm.prototype,"hubspotPortal",2),St([wt({type:String,attribute:"hubspot-form"})],t.WizardForm.prototype,"hubspotForm",2),St([wt({type:String,reflect:!0})],t.WizardForm.prototype,"theme",2),St([wt({type:Boolean})],t.WizardForm.prototype,"mock",2),St([wt({type:Boolean,attribute:"show-progress"})],t.WizardForm.prototype,"showProgress",2),St([wt({type:Boolean,attribute:"auto-advance"})],t.WizardForm.prototype,"autoAdvance",2),St([wt({type:Boolean,attribute:"hide-back"})],t.WizardForm.prototype,"hideBack",2),St([wt({attribute:!1})],t.WizardForm.prototype,"serialize",2),St([wt({type:Boolean,attribute:"submit-on-step"})],t.WizardForm.prototype,"submitOnStep",2),St([bt()],t.WizardForm.prototype,"_steps",2),St([bt()],t.WizardForm.prototype,"_currentStep",2),St([bt()],t.WizardForm.prototype,"_totalSteps",2),St([bt()],t.WizardForm.prototype,"_formData",2),St([bt()],t.WizardForm.prototype,"_submitting",2),St([bt()],t.WizardForm.prototype,"_submitted",2),St([bt()],t.WizardForm.prototype,"_error",2),t.WizardForm=St([ft("wizard-form")],t.WizardForm),t.WfSuccess=class extends lt{createRenderRoot(){return this}render(){return Y``}},t.WfSuccess=St([ft("wf-success")],t.WfSuccess);var _t=Object.defineProperty,zt=Object.getOwnPropertyDescriptor,Et=(t,e,i,s)=>{for(var r,o=s>1?void 0:s?zt(e,i):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(s?r(e,i,o):r(o))||o);return s&&o&&_t(e,i,o),o};t.WfStep=class extends lt{constructor(){super(...arguments),this.step=0,this.active=!1,this.direction="forward",this.leaving=!1,this.skipIf="",this.Qt=[]}createRenderRoot(){return this}render(){return Y`
|
|
56
|
+
<div class="wf-step-content"></div>
|
|
57
|
+
`}firstUpdated(){this.te()}updated(t){t.has("active")&&this.active&&(this.leaving=!1,this.ee())}te(){const t=["wf-options","wf-field","wf-email","wf-input","wf-textarea","wf-number"],e=[],i=s=>{if(t.includes(s.tagName.toLowerCase())){const t=s.getAttribute("name");t&&e.push(t)}Array.from(s.children).forEach(i)};Array.from(this.children).forEach(i),this.Qt=e}ee(){requestAnimationFrame(()=>{for(const t of this.children){const e=this.ie(t);if(e)return void e.focus()}})}ie(t){if(t instanceof HTMLElement&&"function"==typeof t.focus&&["wf-field","wf-email","wf-input","wf-textarea"].includes(t.tagName.toLowerCase()))return t;for(const e of t.children){const t=this.ie(e);if(t)return t}return null}get fields(){return[...this.Qt]}shouldSkip(t){if(!this.skipIf)return!1;try{const e=this.skipIf.trim();if(e.startsWith("!"))return!t[e.slice(1)];if(e.includes("===")){const[i,s]=e.split("===").map(t=>t.trim());return t[i]===s.replace(/['"]/g,"")}if(e.includes("!==")){const[i,s]=e.split("!==").map(t=>t.trim());return t[i]!==s.replace(/['"]/g,"")}return!!t[e]}catch(e){return!1}}show(t="forward"){this.direction=t,this.leaving=!1,this.active=!0}hide(){return new Promise(t=>{this.leaving=!0;const e=()=>{this.active=!1,this.leaving=!1,this.removeEventListener("animationend",e),t()};this.addEventListener("animationend",e),setTimeout(()=>{this.active=!1,this.leaving=!1,this.removeEventListener("animationend",e),t()},300)})}async validate(){const t=[];let e=!0;const i=async s=>{"validate"in s&&"function"==typeof s.validate&&(await s.validate()||(t.push(s),e=!1));for(const t of s.children)await i(t)};for(const s of this.children)await i(s);if(t.length>0){const e=t[0];e.scrollIntoView({behavior:"smooth",block:"center"}),setTimeout(()=>{"focus"in e&&"function"==typeof e.focus&&e.focus()},100)}return e}},Et([wt({type:Number,attribute:"data-step"})],t.WfStep.prototype,"step",2),Et([wt({type:Boolean,reflect:!0})],t.WfStep.prototype,"active",2),Et([wt({type:String,reflect:!0})],t.WfStep.prototype,"direction",2),Et([wt({type:Boolean,reflect:!0})],t.WfStep.prototype,"leaving",2),Et([wt({type:String,attribute:"data-skip-if"})],t.WfStep.prototype,"skipIf",2),Et([bt()],t.WfStep.prototype,"_fields",2),t.WfStep=Et([ft("wf-step")],t.WfStep);var Ct=Object.defineProperty,Ot=Object.getOwnPropertyDescriptor,Tt=(t,e,i,s)=>{for(var r,o=s>1?void 0:s?Ot(e,i):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(s?r(e,i,o):r(o))||o);return s&&o&&Ct(e,i,o),o};const jt={none:0,xs:4,sm:8,md:16,lg:24,xl:32};t.WfLayout=class extends lt{constructor(){super(...arguments),this.mode="flex",this.direction="column",this.gap="none",this.gapX="",this.gapY="",this.align="stretch",this.justify="start",this.padding="none",this.paddingX="",this.paddingY="",this.wrap=!1,this.width="full",this.columns="auto",this.minItemWidth="200px"}createRenderRoot(){return this}se(t){if(!t||"none"===t)return"0";if(t in jt)return jt[t]+"px";const e=parseFloat(t);return isNaN(e)?t:e+"px"}re(){return this.se(this.gapX||this.gap)}oe(){return this.se(this.gapY||this.gap)}ae(){const t=this.se(this.padding),e=this.paddingX?this.se(this.paddingX):t;return`${this.paddingY?this.se(this.paddingY):t} ${e}`}ne(){const t=[];if("grid"===this.mode){t.push("display: grid");const e=parseInt(this.columns,10);!isNaN(e)&&e>0?t.push(`grid-template-columns: repeat(${e}, 1fr)`):t.push(`grid-template-columns: repeat(auto-fit, minmax(${this.minItemWidth}, 1fr))`),"stretch"!==this.align&&t.push("align-items: "+this.align),"start"!==this.justify&&t.push("justify-content: "+this.justify)}else t.push("display: flex"),t.push("flex-direction: "+this.direction),this.wrap&&t.push("flex-wrap: wrap"),"stretch"!==this.align&&t.push("align-items: "+this.align),"start"!==this.justify&&t.push("justify-content: "+this.justify);const e=this.re(),i=this.oe();"0"===e&&"0"===i||(t.push("column-gap: "+e),t.push("row-gap: "+i));const s=this.ae();return"0 0"!==s&&t.push("padding: "+s),t.join("; ")}updated(t){super.updated(t),this.style.cssText=this.ne(),this.classList.remove("wf-layout--width-full","wf-layout--width-auto","wf-layout--width-fit"),this.classList.add("wf-layout--width-"+this.width)}render(){return Y``}},Tt([wt({type:String})],t.WfLayout.prototype,"mode",2),Tt([wt({type:String})],t.WfLayout.prototype,"direction",2),Tt([wt({type:String})],t.WfLayout.prototype,"gap",2),Tt([wt({type:String,attribute:"gap-x"})],t.WfLayout.prototype,"gapX",2),Tt([wt({type:String,attribute:"gap-y"})],t.WfLayout.prototype,"gapY",2),Tt([wt({type:String})],t.WfLayout.prototype,"align",2),Tt([wt({type:String})],t.WfLayout.prototype,"justify",2),Tt([wt({type:String})],t.WfLayout.prototype,"padding",2),Tt([wt({type:String,attribute:"padding-x"})],t.WfLayout.prototype,"paddingX",2),Tt([wt({type:String,attribute:"padding-y"})],t.WfLayout.prototype,"paddingY",2),Tt([wt({type:Boolean})],t.WfLayout.prototype,"wrap",2),Tt([wt({type:String})],t.WfLayout.prototype,"width",2),Tt([wt({type:String})],t.WfLayout.prototype,"columns",2),Tt([wt({type:String,attribute:"min-item-width"})],t.WfLayout.prototype,"minItemWidth",2),t.WfLayout=Tt([ft("wf-layout")],t.WfLayout);var At=Object.defineProperty,Pt=Object.getOwnPropertyDescriptor,Nt=(t,e,i,s)=>{for(var r,o=s>1?void 0:s?Pt(e,i):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(s?r(e,i,o):r(o))||o);return s&&o&&At(e,i,o),o};t.WfOptions=class extends lt{constructor(){super(...arguments),this.name="",this.multi=!1,this.required=!1,this.min=0,this.max=0,this.columns=2,this.allowOther=!1,this.otherLabel="Other, please specify:",this.otherPlaceholder="Enter your answer",this.otherRequired=!1,this.otherName="",this.otherFieldValue="Others",this.he=new Set,this.ce="",this.le="",this.de=!1,this.fe=[],this.ue=new Map,this.pe="",this.qt=t=>{t.stopPropagation();const{value:e}=t.detail;this.we(e)},this.At=t=>{const e=this.closest("wf-step");if(!e||!e.hasAttribute("active"))return;const i=t.composedPath()[0];if("INPUT"===i?.tagName||"TEXTAREA"===i?.tagName)return;const s=this.querySelector(".wf-other-input");if(s&&document.activeElement===s)return;const r=t.key.toUpperCase();if(1===r.length&&r>="A"&&r<="Z"){if(this.allowOther&&r===this.pe){t.preventDefault();const e=this.querySelector(".wf-other-input");return void(e&&e.focus())}const e=this.ue.get(r);e&&!e.disabled&&(t.preventDefault(),e.triggerSelect())}}}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),this.le="",this.de=!1,this.addEventListener("wf-option-select",this.qt),document.addEventListener("keydown",this.At)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("wf-option-select",this.qt),document.removeEventListener("keydown",this.At)}firstUpdated(){const t=this.querySelector("wf-layout");Array.from(this.querySelectorAll(":scope > wf-option")).forEach(e=>t?.appendChild(e)),this.be(),this.requestUpdate()}updated(t){(t.has("multi")||t.has("max"))&&this.me()}render(){return this.setAttribute("role","listbox"),this.setAttribute("aria-multiselectable",this.multi+""),this.setAttribute("aria-required",this.required+""),Y`
|
|
58
|
+
<wf-layout mode="grid" columns="${this.columns}" gap="md">
|
|
59
|
+
<!-- wf-option children will be moved here in firstUpdated -->
|
|
60
|
+
</wf-layout>
|
|
436
61
|
${this.allowOther?Y`
|
|
437
62
|
<div class="wf-other-container">
|
|
438
63
|
<label class="wf-other-label">${this.otherLabel}</label>
|
|
439
64
|
<div class="wf-other-input-wrapper">
|
|
440
|
-
${this.
|
|
65
|
+
${this.pe?Y`<wf-badge shortcut="${this.pe}"></wf-badge>`:""}
|
|
441
66
|
<input
|
|
442
67
|
type="text"
|
|
443
|
-
id="wf-other-input"
|
|
444
68
|
class="wf-other-input"
|
|
445
|
-
.value="${this.
|
|
69
|
+
.value="${this.ce}"
|
|
446
70
|
placeholder="${this.otherPlaceholder}"
|
|
447
71
|
data-testid="wf-other-input"
|
|
448
|
-
@input="${this.
|
|
449
|
-
@keydown="${this.
|
|
450
|
-
@focus="${this.
|
|
72
|
+
@input="${this.ge}"
|
|
73
|
+
@keydown="${this.ve}"
|
|
74
|
+
@focus="${this.ye}"
|
|
451
75
|
/>
|
|
452
76
|
</div>
|
|
453
77
|
</div>
|
|
454
78
|
`:""}
|
|
455
79
|
<span class="wf-error-message" role="alert" aria-live="polite" data-testid="wf-error">
|
|
456
|
-
${this.
|
|
80
|
+
${this.le}
|
|
457
81
|
</span>
|
|
458
|
-
`}
|
|
459
|
-
:host {
|
|
460
|
-
display: block;
|
|
461
|
-
}
|
|
462
|
-
|
|
463
|
-
:host([hidden]) {
|
|
464
|
-
display: none;
|
|
465
|
-
}
|
|
466
|
-
|
|
467
|
-
/* Two columns (default) */
|
|
468
|
-
.wf-options-container {
|
|
469
|
-
display: grid;
|
|
470
|
-
grid-template-columns: repeat(2, 1fr);
|
|
471
|
-
gap: var(--wf-spacing-4, 16px);
|
|
472
|
-
}
|
|
473
|
-
|
|
474
|
-
/* Single column via attribute */
|
|
475
|
-
:host([columns='1']) .wf-options-container {
|
|
476
|
-
grid-template-columns: 1fr;
|
|
477
|
-
}
|
|
478
|
-
|
|
479
|
-
/* Single column on mobile */
|
|
480
|
-
@media (max-width: 600px) {
|
|
481
|
-
.wf-options-container {
|
|
482
|
-
grid-template-columns: 1fr;
|
|
483
|
-
}
|
|
484
|
-
}
|
|
485
|
-
|
|
486
|
-
.wf-error-message {
|
|
487
|
-
display: block;
|
|
488
|
-
margin-top: var(--wf-spacing-2, 8px);
|
|
489
|
-
font-size: var(--wf-font-size-sm, 0.875rem);
|
|
490
|
-
color: var(--wf-color-error, #dc3545);
|
|
491
|
-
min-height: 20px;
|
|
492
|
-
}
|
|
493
|
-
|
|
494
|
-
/* Other input styles */
|
|
495
|
-
.wf-other-container {
|
|
496
|
-
margin-top: var(--wf-spacing-4, 16px);
|
|
497
|
-
}
|
|
498
|
-
|
|
499
|
-
.wf-other-label {
|
|
500
|
-
display: block;
|
|
501
|
-
margin-bottom: var(--wf-spacing-2, 8px);
|
|
502
|
-
font-size: var(--wf-font-size-sm, 0.875rem);
|
|
503
|
-
font-weight: 500;
|
|
504
|
-
color: var(--wf-color-text, #0a0a0a);
|
|
505
|
-
}
|
|
506
|
-
|
|
507
|
-
.wf-other-label span {
|
|
508
|
-
font-weight: 400;
|
|
509
|
-
color: var(--wf-color-text-muted, #646464);
|
|
510
|
-
}
|
|
511
|
-
|
|
512
|
-
/* Wrapper puts badge inside the input */
|
|
513
|
-
.wf-other-input-wrapper {
|
|
514
|
-
display: flex;
|
|
515
|
-
align-items: center;
|
|
516
|
-
gap: var(--wf-spacing-3, 12px);
|
|
517
|
-
min-height: var(--wf-input-min-height, 56px);
|
|
518
|
-
background: var(--wf-color-surface, #f3f3f5);
|
|
519
|
-
border: 1px solid var(--wf-color-border, #d4d4d4);
|
|
520
|
-
border-radius: var(--wf-radius-md, 8px);
|
|
521
|
-
padding-left: var(--wf-spacing-4, 16px);
|
|
522
|
-
transition: border-color 150ms ease, box-shadow 150ms ease;
|
|
523
|
-
}
|
|
524
|
-
|
|
525
|
-
.wf-other-input-wrapper:focus-within {
|
|
526
|
-
border-color: var(--wf-color-primary, #8040f0);
|
|
527
|
-
box-shadow: 0 0 0 3px rgba(128, 64, 240, 0.1);
|
|
528
|
-
}
|
|
529
|
-
|
|
530
|
-
.wf-other-input {
|
|
531
|
-
flex: 1;
|
|
532
|
-
min-height: calc(var(--wf-input-min-height, 56px) - 2px);
|
|
533
|
-
padding: var(--wf-spacing-4, 16px);
|
|
534
|
-
padding-left: 0;
|
|
535
|
-
font-size: var(--wf-font-size-base, 1rem);
|
|
536
|
-
font-weight: 500;
|
|
537
|
-
color: var(--wf-color-text, #0a0a0a);
|
|
538
|
-
background: transparent;
|
|
539
|
-
border: none;
|
|
540
|
-
outline: none;
|
|
541
|
-
box-sizing: border-box;
|
|
542
|
-
}
|
|
543
|
-
|
|
544
|
-
.wf-other-input::placeholder {
|
|
545
|
-
color: var(--wf-color-text-muted, #646464);
|
|
546
|
-
font-weight: 500;
|
|
547
|
-
}
|
|
548
|
-
`,jt([mt({type:String})],t.WfOptions.prototype,"name",2),jt([mt({type:Boolean})],t.WfOptions.prototype,"multi",2),jt([mt({type:Boolean})],t.WfOptions.prototype,"required",2),jt([mt({type:Number})],t.WfOptions.prototype,"min",2),jt([mt({type:Number})],t.WfOptions.prototype,"max",2),jt([mt({type:Number,reflect:!0})],t.WfOptions.prototype,"columns",2),jt([mt({type:Boolean,attribute:"allow-other"})],t.WfOptions.prototype,"allowOther",2),jt([mt({type:String,attribute:"other-label"})],t.WfOptions.prototype,"otherLabel",2),jt([mt({type:String,attribute:"other-placeholder"})],t.WfOptions.prototype,"otherPlaceholder",2),jt([mt({type:Boolean,attribute:"other-required"})],t.WfOptions.prototype,"otherRequired",2),jt([mt({type:String,attribute:"other-name"})],t.WfOptions.prototype,"otherName",2),jt([mt({type:String,attribute:"other-value"})],t.WfOptions.prototype,"otherFieldValue",2),jt([bt()],t.WfOptions.prototype,"_selected",2),jt([bt()],t.WfOptions.prototype,"_otherValue",2),jt([bt()],t.WfOptions.prototype,"_errorMessage",2),jt([bt()],t.WfOptions.prototype,"_otherShortcut",2),t.WfOptions=jt([ut("wf-options")],t.WfOptions);var At=Object.defineProperty,Nt=Object.getOwnPropertyDescriptor,Mt=(t,e,s,i)=>{for(var r,o=i>1?void 0:i?Nt(e,s):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(i?r(e,s,o):r(o))||o);return i&&o&&At(e,s,o),o};t.WfOption=class extends dt{constructor(){super(...arguments),this.value="",this.selected=!1,this.disabled=!1,this.shortcut="",this.ve=!1}render(){return Y`
|
|
82
|
+
`}ge(t){const e=t.target;this.ce=e.value,this.ce.trim()&&this.he.size>0&&(this.he.clear(),this.me()),this.xe()}ye(){}ve(t){"Escape"===t.key&&(t.stopPropagation(),t.target.blur())}be(){const t=this.querySelector("wf-layout");this.fe=t?Array.from(t.querySelectorAll(":scope > wf-option")):[],this.ue.clear(),this.fe.forEach((t,e)=>{if(e<26){const i=String.fromCharCode(65+e);t.shortcut=i,this.ue.set(i,t)}t.setSelected(this.he.has(t.value))}),this.allowOther&&this.fe.length<26&&(this.pe=String.fromCharCode(65+this.fe.length))}we(t){this.multi?this.$e(t):this.ke(t),this.allowOther&&this.ce&&(this.ce=""),this.me(),this.Se(),this.xe()}ke(t){this.he.clear(),this.he.add(t)}$e(t){if(this.he.has(t))this.he.delete(t);else{if(this.max>0&&this.he.size>=this.max)return;this.he.add(t)}}me(){this.fe.forEach(t=>{t.setSelected(this.he.has(t.value))})}_e(){const t=this.allowOther&&this.ce.trim(),e=this.he.size>0||t;if(this.required&&!e)return!1;if(this.multi){if(this.min>0&&this.he.size<this.min&&!t)return!1;if(this.max>0&&this.he.size>this.max)return!1}return!0}Se(){if(!this.de)return this.le="",this._e();this.le="";const t=this.allowOther&&this.ce.trim(),e=this.he.size>0||t;if(this.required&&!e)return this.le=this.allowOther?"Please select an option or specify in the text field":"Please select an option",!1;if(this.multi){if(this.min>0&&this.he.size<this.min&&!t)return this.le=`Please select at least ${this.min} option${this.min>1?"s":""}`,!1;if(this.max>0&&this.he.size>this.max)return this.le=`Please select at most ${this.max} option${this.max>1?"s":""}`,!1}return!0}xe(){const t=Array.from(this.he),e=this.allowOther&&this.ce.trim()&&0===this.he.size;let i;i=this.otherName&&e?this.multi?[this.otherFieldValue]:this.otherFieldValue:this.value;const s={name:this.name,value:i,selected:t};this.otherName&&(s.extraFields={[this.otherName]:e?this.ce.trim():""}),this.dispatchEvent(new CustomEvent("wf-change",{detail:s,bubbles:!0,composed:!0}))}get value(){if(this.allowOther&&this.ce.trim()&&0===this.he.size)return this.multi?[this.ce]:this.ce;const t=Array.from(this.he);return this.multi?t:t[0]??""}set value(t){this.he.clear(),Array.isArray(t)?t.forEach(t=>this.he.add(t)):t&&this.he.add(t),this.me(),this.Se()}getSelected(){return Array.from(this.he)}isSelected(t){return this.he.has(t)}select(t){this.we(t)}deselect(t){this.he.has(t)&&(this.he.delete(t),this.me(),this.Se(),this.xe())}clear(){this.he.clear(),this.me(),this.Se(),this.xe()}validate(){return this.de=!0,this.Se()}get isValid(){return this._e()}showError(t){this.le=t}clearError(){this.le=""}focus(){this.fe[0]?.focus()}reset(){this.he.clear(),this.ce="",this.le="",this.de=!1,this.fe.forEach(t=>{t.hasAttribute("selected")&&this.he.add(t.value),t.setSelected(this.he.has(t.value))}),this.xe()}},Nt([wt({type:String})],t.WfOptions.prototype,"name",2),Nt([wt({type:Boolean})],t.WfOptions.prototype,"multi",2),Nt([wt({type:Boolean})],t.WfOptions.prototype,"required",2),Nt([wt({type:Number})],t.WfOptions.prototype,"min",2),Nt([wt({type:Number})],t.WfOptions.prototype,"max",2),Nt([wt({type:Number,reflect:!0})],t.WfOptions.prototype,"columns",2),Nt([wt({type:Boolean,attribute:"allow-other"})],t.WfOptions.prototype,"allowOther",2),Nt([wt({type:String,attribute:"other-label"})],t.WfOptions.prototype,"otherLabel",2),Nt([wt({type:String,attribute:"other-placeholder"})],t.WfOptions.prototype,"otherPlaceholder",2),Nt([wt({type:Boolean,attribute:"other-required"})],t.WfOptions.prototype,"otherRequired",2),Nt([wt({type:String,attribute:"other-name"})],t.WfOptions.prototype,"otherName",2),Nt([wt({type:String,attribute:"other-value"})],t.WfOptions.prototype,"otherFieldValue",2),Nt([bt()],t.WfOptions.prototype,"_selected",2),Nt([bt()],t.WfOptions.prototype,"_otherValue",2),Nt([bt()],t.WfOptions.prototype,"_errorMessage",2),Nt([bt()],t.WfOptions.prototype,"_otherShortcut",2),t.WfOptions=Nt([ft("wf-options")],t.WfOptions);var Mt=Object.defineProperty,Rt=Object.getOwnPropertyDescriptor,It=(t,e,i,s)=>{for(var r,o=s>1?void 0:s?Rt(e,i):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(s?r(e,i,o):r(o))||o);return s&&o&&Mt(e,i,o),o};t.WfOption=class extends lt{constructor(){super(...arguments),this.value="",this.selected=!1,this.disabled=!1,this.shortcut="",this.ze=!1,this.Ee=[]}createRenderRoot(){return this}connectedCallback(){0===this.Ee.length&&(this.Ee=Array.from(this.childNodes).map(t=>t.cloneNode(!0)),this.textContent=""),super.connectedCallback()}render(){return Y`
|
|
549
83
|
<button
|
|
550
|
-
class="wf-option-card ${this.
|
|
84
|
+
class="wf-option-card ${this.ze?"selecting":""}"
|
|
551
85
|
role="option"
|
|
552
86
|
aria-selected="${this.selected}"
|
|
553
87
|
?disabled="${this.disabled}"
|
|
554
88
|
data-testid="wf-option-btn"
|
|
555
|
-
@click="${this.
|
|
89
|
+
@click="${this.Ce}"
|
|
556
90
|
>
|
|
557
91
|
${this.shortcut?Y`<wf-badge
|
|
558
92
|
shortcut="${this.shortcut}"
|
|
559
93
|
variant="${this.selected?"selected":"default"}"
|
|
560
94
|
></wf-badge>`:K}
|
|
561
95
|
<div class="wf-option-content">
|
|
562
|
-
|
|
96
|
+
${this.Ee}
|
|
563
97
|
</div>
|
|
564
98
|
</button>
|
|
565
|
-
`}
|
|
566
|
-
:host {
|
|
567
|
-
display: block;
|
|
568
|
-
}
|
|
569
|
-
|
|
570
|
-
:host([hidden]) {
|
|
571
|
-
display: none;
|
|
572
|
-
}
|
|
573
|
-
|
|
574
|
-
.wf-option-card {
|
|
575
|
-
display: flex;
|
|
576
|
-
align-items: center;
|
|
577
|
-
gap: var(--wf-spacing-3, 12px);
|
|
578
|
-
width: 100%;
|
|
579
|
-
min-height: var(--wf-input-min-height, 56px);
|
|
580
|
-
padding: var(--wf-spacing-3, 12px);
|
|
581
|
-
background-color: var(--wf-color-surface, #f3f3f5);
|
|
582
|
-
border: 1px solid var(--wf-color-border, #d4d4d4);
|
|
583
|
-
border-radius: var(--wf-radius-md, 8px);
|
|
584
|
-
cursor: pointer;
|
|
585
|
-
text-align: left;
|
|
586
|
-
font-family: inherit;
|
|
587
|
-
font-size: var(--wf-font-size-base, 1rem);
|
|
588
|
-
font-weight: 500;
|
|
589
|
-
color: var(--wf-color-text, #0a0a0a);
|
|
590
|
-
transition: border-color 150ms ease, background-color 150ms ease,
|
|
591
|
-
transform 100ms ease;
|
|
592
|
-
outline: none;
|
|
593
|
-
box-sizing: border-box;
|
|
594
|
-
}
|
|
595
|
-
|
|
596
|
-
.wf-option-card:hover:not(:disabled) {
|
|
597
|
-
border-color: var(--wf-color-primary, #8040f0);
|
|
598
|
-
background-color: var(--wf-color-primary-light, rgba(128, 64, 240, 0.08));
|
|
599
|
-
}
|
|
600
|
-
|
|
601
|
-
.wf-option-card:focus-visible {
|
|
602
|
-
border-color: var(--wf-color-primary, #8040f0);
|
|
603
|
-
box-shadow: 0 0 0 3px rgba(128, 64, 240, 0.2);
|
|
604
|
-
}
|
|
605
|
-
|
|
606
|
-
.wf-option-card[aria-selected='true'] {
|
|
607
|
-
border-color: var(--wf-color-primary, #8040f0);
|
|
608
|
-
background-color: var(--wf-color-primary-light, rgba(128, 64, 240, 0.1));
|
|
609
|
-
}
|
|
610
|
-
|
|
611
|
-
.wf-option-card:disabled {
|
|
612
|
-
opacity: 0.5;
|
|
613
|
-
cursor: not-allowed;
|
|
614
|
-
}
|
|
615
|
-
|
|
616
|
-
.wf-option-card:active:not(:disabled) {
|
|
617
|
-
transform: scale(0.98);
|
|
618
|
-
}
|
|
619
|
-
|
|
620
|
-
/* Blink animation on selection */
|
|
621
|
-
.wf-option-card.selecting {
|
|
622
|
-
animation: blink 0.3s ease;
|
|
623
|
-
}
|
|
624
|
-
|
|
625
|
-
@keyframes blink {
|
|
626
|
-
0%,
|
|
627
|
-
100% {
|
|
628
|
-
opacity: 1;
|
|
629
|
-
}
|
|
630
|
-
50% {
|
|
631
|
-
opacity: 0.5;
|
|
632
|
-
}
|
|
633
|
-
}
|
|
634
|
-
|
|
635
|
-
.wf-option-content {
|
|
636
|
-
flex: 1;
|
|
637
|
-
min-width: 0;
|
|
638
|
-
}
|
|
639
|
-
|
|
640
|
-
/* Slotted content styling */
|
|
641
|
-
::slotted(strong),
|
|
642
|
-
::slotted(h3),
|
|
643
|
-
::slotted(h4) {
|
|
644
|
-
display: block;
|
|
645
|
-
font-weight: 600;
|
|
646
|
-
margin: 0;
|
|
647
|
-
}
|
|
648
|
-
|
|
649
|
-
::slotted(span),
|
|
650
|
-
::slotted(p) {
|
|
651
|
-
display: block;
|
|
652
|
-
font-size: var(--wf-font-size-sm, 0.875rem);
|
|
653
|
-
color: var(--wf-color-text-muted, #646464);
|
|
654
|
-
margin: 4px 0 0 0;
|
|
655
|
-
}
|
|
656
|
-
`,Mt([mt({type:String})],t.WfOption.prototype,"value",2),Mt([mt({type:Boolean,reflect:!0})],t.WfOption.prototype,"selected",2),Mt([mt({type:Boolean,reflect:!0})],t.WfOption.prototype,"disabled",2),Mt([mt({type:String})],t.WfOption.prototype,"shortcut",2),Mt([bt()],t.WfOption.prototype,"_selecting",2),t.WfOption=Mt([ut("wf-option")],t.WfOption);const Pt=["gmail.com","yahoo.com","hotmail.com","outlook.com","aol.com","icloud.com","mail.com","protonmail.com","zoho.com","yandex.com","live.com","msn.com","me.com","inbox.com","gmx.com"];class Vt{constructor(t){this.$e=new Map,this.host=t,t.addController(this)}hostConnected(){}hostDisconnected(){this.$e.clear()}addValidator(t,e){const s=this.$e.get(t)??[];this.$e.set(t,[...s,e])}addValidators(t,e){e.forEach(e=>this.addValidator(t,e))}removeValidator(t,e){const s=this.$e.get(t)??[];this.$e.set(t,s.filter(t=>t.name!==e))}clearValidators(t){this.$e.delete(t)}getValidators(t){return this.$e.get(t)??[]}async validate(t,e){const s=this.getValidators(t);for(const r of s)try{const t=await r.validate(e);if(!t.valid)return{valid:!1,error:t.error??r.message??"Validation failed"}}catch(i){return{valid:!1,error:"Validation error occurred"}}return{valid:!0}}validateSync(t,e){const s=this.getValidators(t);for(const i of s){const t=i.validate(e);if(!(t instanceof Promise||t.valid))return{valid:!1,error:t.error??i.message??"Validation failed"}}return{valid:!0}}static required(t="This field is required"){return{name:"required",message:t,validate:e=>null==e||"string"==typeof e&&""===e.trim()||Array.isArray(e)&&0===e.length?{valid:!1,error:t}:{valid:!0}}}static email(t="Please enter a valid email address"){const e=/^[^\s@]+@[^\s@]+\.[^\s@]+$/;return{name:"email",message:t,validate:s=>"string"!=typeof s||""===s.trim()||e.test(s)?{valid:!0}:{valid:!1,error:t}}}static workEmail(t=Pt,e="Please use your work email address"){return{name:"workEmail",message:e,validate:s=>{if("string"!=typeof s||""===s.trim())return{valid:!0};const i=s.split("@")[1]?.toLowerCase();return i&&t.includes(i)?{valid:!1,error:e}:{valid:!0}}}}static pattern(t,e="Invalid format"){return{name:"pattern",message:e,validate:s=>"string"!=typeof s||""===s.trim()||t.test(s)?{valid:!0}:{valid:!1,error:e}}}static minLength(t,e){const s=e??`Minimum ${t} characters required`;return{name:"minLength",message:s,validate:e=>"string"!=typeof e?{valid:!0}:e.length<t?{valid:!1,error:s}:{valid:!0}}}static maxLength(t,e){const s=e??`Maximum ${t} characters allowed`;return{name:"maxLength",message:s,validate:e=>"string"!=typeof e?{valid:!0}:e.length>t?{valid:!1,error:s}:{valid:!0}}}static minSelections(t,e){const s=e??`Select at least ${t} option${t>1?"s":""}`;return{name:"minSelections",message:s,validate:e=>Array.isArray(e)&&e.length<t?{valid:!1,error:s}:{valid:!0}}}static maxSelections(t,e){const s=e??`Select at most ${t} option${t>1?"s":""}`;return{name:"maxSelections",message:s,validate:e=>Array.isArray(e)&&e.length>t?{valid:!1,error:s}:{valid:!0}}}static custom(t,e,s){return{name:t,message:s,validate:e}}}var qt=Object.defineProperty,It=Object.getOwnPropertyDescriptor,Bt=(t,e,s,i)=>{for(var r,o=i>1?void 0:i?It(e,s):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(i?r(e,s,o):r(o))||o);return i&&o&&qt(e,s,o),o};t.WfField=class extends dt{constructor(){super(...arguments),this.name="",this.label="",this.required=!1,this.hint="",this.ie="",this.Se="",this.re=!1,this.ke=null,this.$e=[],this._e=null,this.Ee=t=>{const e=t.target;this.Se=e.value,this.re&&(this.ke&&clearTimeout(this.ke),this.ke=setTimeout(()=>{this.validate()},300)),this.dispatchEvent(new CustomEvent("wf-change",{detail:{name:this.name,value:this.Se},bubbles:!0,composed:!0}))},this.ze=()=>{this.dispatchEvent(new CustomEvent("wf-blur",{detail:{name:this.name,value:this.Se},bubbles:!0,composed:!0}))},this.Ce=()=>{this.dispatchEvent(new CustomEvent("wf-focus",{detail:{name:this.name},bubbles:!0,composed:!0}))}}connectedCallback(){super.connectedCallback(),this.addEventListener("input",this.Ee),this.addEventListener("blur",this.ze,!0),this.addEventListener("focus",this.Ce,!0)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("input",this.Ee),this.removeEventListener("blur",this.ze,!0),this.removeEventListener("focus",this.Ce,!0)}firstUpdated(){this.Te(),this.Oe()}render(){return Y`
|
|
99
|
+
`}Ce(t){this.disabled?t.preventDefault():this.Oe()}triggerSelect(){this.disabled||this.Oe()}Oe(){this.ze=!0;const t={value:this.value,selected:!this.selected};this.dispatchEvent(new CustomEvent("wf-option-select",{detail:t,bubbles:!0,composed:!0})),setTimeout(()=>{this.ze=!1},300)}focus(){const t=this.querySelector("button");t?.focus()}setSelected(t){this.selected=t}},It([wt({type:String})],t.WfOption.prototype,"value",2),It([wt({type:Boolean,reflect:!0})],t.WfOption.prototype,"selected",2),It([wt({type:Boolean,reflect:!0})],t.WfOption.prototype,"disabled",2),It([wt({type:String})],t.WfOption.prototype,"shortcut",2),It([bt()],t.WfOption.prototype,"_selecting",2),t.WfOption=It([ft("wf-option")],t.WfOption);var qt=Object.defineProperty,Dt=(t,e,i,s)=>{for(var r,o=void 0,a=t.length-1;a>=0;a--)(r=t[a])&&(o=r(e,i,o)||o);return o&&qt(e,i,o),o};class Ft extends lt{constructor(){super(...arguments),this.name="",this.label="",this.required=!1,this.hint="",this.le="",this.Te="",this.de=!1,this.je=null,this.Ae=[],this.Pe=t=>{const e=t.target;this.Te=e.value,this.de&&(this.je&&clearTimeout(this.je),this.je=setTimeout(()=>{this.validate()},this.Ne())),this.dispatchEvent(new CustomEvent("wf-change",{detail:{name:this.name,value:this.Te},bubbles:!0,composed:!0}))},this.Me=()=>{this.dispatchEvent(new CustomEvent("wf-blur",{detail:{name:this.name,value:this.Te},bubbles:!0,composed:!0}))},this.Re=()=>{this.dispatchEvent(new CustomEvent("wf-focus",{detail:{name:this.name},bubbles:!0,composed:!0}))}}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),this.Ie()}updated(t){this.qe().some(e=>t.has(e))&&this.Ie()}Ne(){return 600}De(){return"input"}get value(){return this.Te}set value(t){this.Te=t}addValidator(t){this.Ae.push(t)}async validate(){this.de=!0;const t=this.value;for(const i of this.Ae)try{const e=await i.validate(t);if(!e.valid)return this.le=e.error??i.message??"Validation failed",!1}catch(e){return this.le="Validation error occurred",!1}return this.le="",!0}get isValid(){const t=this.value;for(const e of this.Ae){const i=e.validate(t);if(!(i instanceof Promise||i.valid))return!1}return!0}showError(t){this.le=t}clearError(){this.le=""}focus(){const t=this.querySelector(this.De());t?.focus()}reset(){this.Te="",this.le="",this.de=!1,this.je&&(clearTimeout(this.je),this.je=null)}}Dt([wt({type:String})],Ft.prototype,"name"),Dt([wt({type:String})],Ft.prototype,"label"),Dt([wt({type:Boolean})],Ft.prototype,"required"),Dt([wt({type:String})],Ft.prototype,"hint"),Dt([bt()],Ft.prototype,"_errorMessage"),Dt([bt()],Ft.prototype,"_value");const Vt=["gmail.com","yahoo.com","hotmail.com","outlook.com","aol.com","icloud.com","mail.com","protonmail.com","zoho.com","yandex.com","live.com","msn.com","me.com","inbox.com","gmx.com"];class Bt{constructor(t){this.Ae=new Map,this.host=t,t.addController(this)}hostConnected(){}hostDisconnected(){this.Ae.clear()}addValidator(t,e){const i=this.Ae.get(t)??[];this.Ae.set(t,[...i,e])}addValidators(t,e){e.forEach(e=>this.addValidator(t,e))}removeValidator(t,e){const i=this.Ae.get(t)??[];this.Ae.set(t,i.filter(t=>t.name!==e))}clearValidators(t){this.Ae.delete(t)}getValidators(t){return this.Ae.get(t)??[]}async validate(t,e){const i=this.getValidators(t);for(const r of i)try{const t=await r.validate(e);if(!t.valid)return{valid:!1,error:t.error??r.message??"Validation failed"}}catch(s){return{valid:!1,error:"Validation error occurred"}}return{valid:!0}}validateSync(t,e){const i=this.getValidators(t);for(const s of i){const t=s.validate(e);if(!(t instanceof Promise||t.valid))return{valid:!1,error:t.error??s.message??"Validation failed"}}return{valid:!0}}static required(t="This field is required"){return{name:"required",message:t,validate:e=>null==e||"string"==typeof e&&""===e.trim()||Array.isArray(e)&&0===e.length?{valid:!1,error:t}:{valid:!0}}}static email(t="Please enter a valid email address"){const e=/^[^\s@]+@[^\s@]+\.[^\s@]+$/;return{name:"email",message:t,validate:i=>"string"!=typeof i||""===i.trim()||e.test(i)?{valid:!0}:{valid:!1,error:t}}}static workEmail(t=Vt,e="Please use your work email address"){return{name:"workEmail",message:e,validate:i=>{if("string"!=typeof i||""===i.trim())return{valid:!0};const s=i.split("@")[1]?.toLowerCase();return s&&t.includes(s)?{valid:!1,error:e}:{valid:!0}}}}static pattern(t,e="Invalid format"){return{name:"pattern",message:e,validate:i=>"string"!=typeof i||""===i.trim()||t.test(i)?{valid:!0}:{valid:!1,error:e}}}static minLength(t,e){const i=e??`Minimum ${t} characters required`;return{name:"minLength",message:i,validate:e=>"string"!=typeof e?{valid:!0}:e.length<t?{valid:!1,error:i}:{valid:!0}}}static maxLength(t,e){const i=e??`Maximum ${t} characters allowed`;return{name:"maxLength",message:i,validate:e=>"string"!=typeof e?{valid:!0}:e.length>t?{valid:!1,error:i}:{valid:!0}}}static minSelections(t,e){const i=e??`Select at least ${t} option${t>1?"s":""}`;return{name:"minSelections",message:i,validate:e=>Array.isArray(e)&&e.length<t?{valid:!1,error:i}:{valid:!0}}}static maxSelections(t,e){const i=e??`Select at most ${t} option${t>1?"s":""}`;return{name:"maxSelections",message:i,validate:e=>Array.isArray(e)&&e.length>t?{valid:!1,error:i}:{valid:!0}}}static custom(t,e,i){return{name:t,message:i,validate:e}}}var Ut=Object.defineProperty,Lt=Object.getOwnPropertyDescriptor,Ht=(t,e,i,s)=>{for(var r,o=s>1?void 0:s?Lt(e,i):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(s?r(e,i,o):r(o))||o);return s&&o&&Ut(e,i,o),o};t.WfField=class extends Ft{constructor(){super(...arguments),this.Fe=null}connectedCallback(){super.connectedCallback(),this.addEventListener("input",this.Pe),this.addEventListener("blur",this.Me,!0),this.addEventListener("focus",this.Re,!0)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("input",this.Pe),this.removeEventListener("blur",this.Me,!0),this.removeEventListener("focus",this.Re,!0)}firstUpdated(){this.Ve(),this.Ie()}qe(){return["required"]}Ne(){return 300}Ie(){if(!this.Fe)return;if(this.Ae=[],(this.required||this.Fe.hasAttribute("required"))&&this.Ae.push(Bt.required()),"email"===this.Fe.getAttribute("type")&&this.Ae.push(Bt.email()),this.Fe.hasAttribute("data-work-email")){const t=this.Fe.getAttribute("data-blocked-domains"),e=t?t.split(",").map(t=>t.trim()):void 0;this.Ae.push(Bt.workEmail(e))}const t=this.Fe.getAttribute("pattern");if(t){const e=this.Fe.getAttribute("data-pattern-message")||"Invalid format";this.Ae.push(Bt.pattern(RegExp(t),e))}const e=this.Fe.getAttribute("minlength");e&&this.Ae.push(Bt.minLength(parseInt(e,10)));const i=this.Fe.getAttribute("maxlength");i&&this.Ae.push(Bt.maxLength(parseInt(i,10)))}Be(){this.Ve(),this.Ie()}Ve(){const t=this.shadowRoot?.querySelector("slot");if(!t)return;const e=t.assignedElements({flatten:!0});for(const i of e)if(i instanceof HTMLInputElement||i instanceof HTMLTextAreaElement||i instanceof HTMLSelectElement){this.Fe=i,i.id||(i.id=this.name),i.name||(i.name=this.name),this.Te=i.value;break}}get value(){return this.Fe?.value??this.Te}set value(t){this.Te=t,this.Fe&&(this.Fe.value=(t??"")+"")}focus(){this.Fe?.focus()}reset(){super.reset(),this.Fe&&(this.Fe.value="")}render(){return Y`
|
|
657
100
|
<div class="wf-field-container">
|
|
658
101
|
${this.label?Y`<label
|
|
659
102
|
class="wf-label ${this.required?"wf-label-required":""}"
|
|
@@ -662,90 +105,14 @@
|
|
|
662
105
|
${this.label}
|
|
663
106
|
</label>`:""}
|
|
664
107
|
<div class="wf-input-wrapper">
|
|
665
|
-
<slot @slotchange="${this.
|
|
108
|
+
<slot @slotchange="${this.Be}"></slot>
|
|
666
109
|
</div>
|
|
667
|
-
${this.hint&&!this.
|
|
110
|
+
${this.hint&&!this.le?Y`<span class="wf-hint">${this.hint}</span>`:""}
|
|
668
111
|
<span class="wf-error-message" role="alert" aria-live="polite">
|
|
669
|
-
${this.
|
|
112
|
+
${this.le}
|
|
670
113
|
</span>
|
|
671
114
|
</div>
|
|
672
|
-
`}
|
|
673
|
-
:host {
|
|
674
|
-
display: block;
|
|
675
|
-
}
|
|
676
|
-
|
|
677
|
-
:host([hidden]) {
|
|
678
|
-
display: none;
|
|
679
|
-
}
|
|
680
|
-
|
|
681
|
-
.wf-field-container {
|
|
682
|
-
display: flex;
|
|
683
|
-
flex-direction: column;
|
|
684
|
-
gap: var(--wf-spacing-2, 8px);
|
|
685
|
-
}
|
|
686
|
-
|
|
687
|
-
.wf-label {
|
|
688
|
-
font-size: var(--wf-font-size-sm, 0.875rem);
|
|
689
|
-
font-weight: 500;
|
|
690
|
-
color: var(--wf-color-text, #212529);
|
|
691
|
-
}
|
|
692
|
-
|
|
693
|
-
.wf-label-required::after {
|
|
694
|
-
content: ' *';
|
|
695
|
-
color: var(--wf-color-error, #dc3545);
|
|
696
|
-
}
|
|
697
|
-
|
|
698
|
-
.wf-input-wrapper {
|
|
699
|
-
position: relative;
|
|
700
|
-
}
|
|
701
|
-
|
|
702
|
-
/* Style slotted inputs */
|
|
703
|
-
::slotted(input),
|
|
704
|
-
::slotted(textarea),
|
|
705
|
-
::slotted(select) {
|
|
706
|
-
width: 100%;
|
|
707
|
-
padding: var(--wf-spacing-4, 16px);
|
|
708
|
-
font-size: var(--wf-font-size-base, 1rem);
|
|
709
|
-
font-family: inherit;
|
|
710
|
-
background-color: var(--wf-color-surface, #f8f9fa);
|
|
711
|
-
border: 2px solid var(--wf-color-border, #dee2e6);
|
|
712
|
-
border-radius: var(--wf-radius-lg, 12px);
|
|
713
|
-
color: var(--wf-color-text, #212529);
|
|
714
|
-
transition: border-color 150ms ease, box-shadow 150ms ease;
|
|
715
|
-
outline: none;
|
|
716
|
-
box-sizing: border-box;
|
|
717
|
-
}
|
|
718
|
-
|
|
719
|
-
::slotted(input::placeholder),
|
|
720
|
-
::slotted(textarea::placeholder) {
|
|
721
|
-
color: var(--wf-color-text-muted, #6c757d);
|
|
722
|
-
}
|
|
723
|
-
|
|
724
|
-
::slotted(input:focus),
|
|
725
|
-
::slotted(textarea:focus),
|
|
726
|
-
::slotted(select:focus) {
|
|
727
|
-
border-color: var(--wf-color-primary, #8b5cf6);
|
|
728
|
-
box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.2);
|
|
729
|
-
}
|
|
730
|
-
|
|
731
|
-
::slotted(input:disabled),
|
|
732
|
-
::slotted(textarea:disabled),
|
|
733
|
-
::slotted(select:disabled) {
|
|
734
|
-
opacity: 0.5;
|
|
735
|
-
cursor: not-allowed;
|
|
736
|
-
}
|
|
737
|
-
|
|
738
|
-
.wf-error-message {
|
|
739
|
-
font-size: var(--wf-font-size-sm, 0.875rem);
|
|
740
|
-
color: var(--wf-color-error, #dc3545);
|
|
741
|
-
min-height: 20px;
|
|
742
|
-
}
|
|
743
|
-
|
|
744
|
-
.wf-hint {
|
|
745
|
-
font-size: var(--wf-font-size-sm, 0.875rem);
|
|
746
|
-
color: var(--wf-color-text-muted, #6c757d);
|
|
747
|
-
}
|
|
748
|
-
`,Bt([mt({type:String})],t.WfField.prototype,"name",2),Bt([mt({type:String})],t.WfField.prototype,"label",2),Bt([mt({type:Boolean})],t.WfField.prototype,"required",2),Bt([mt({type:String})],t.WfField.prototype,"hint",2),Bt([bt()],t.WfField.prototype,"_errorMessage",2),Bt([bt()],t.WfField.prototype,"_value",2),t.WfField=Bt([ut("wf-field")],t.WfField);var Dt=Object.defineProperty,Ft=Object.getOwnPropertyDescriptor,Ut=(t,e,s,i)=>{for(var r,o=i>1?void 0:i?Ft(e,s):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(i?r(e,s,o):r(o))||o);return i&&o&&Dt(e,s,o),o};t.WfEmail=class extends dt{constructor(){super(...arguments),this.name="",this.label="",this.placeholder="you@company.com",this.required=!1,this.workEmail=!1,this.blockedDomains="",this.workEmailMessage="Please use your work email address",this.disabled=!1,this.hint="",this.ie="",this.Se="",this.re=!1,this.ke=null,this.$e=[],this.Ee=t=>{const e=t.target;this.Se=e.value,this.re&&(this.ke&&clearTimeout(this.ke),this.ke=setTimeout(()=>{this.validate()},300)),this.dispatchEvent(new CustomEvent("wf-change",{detail:{name:this.name,value:this.Se},bubbles:!0,composed:!0}))},this.ze=()=>{this.dispatchEvent(new CustomEvent("wf-blur",{detail:{name:this.name,value:this.Se},bubbles:!0,composed:!0}))},this.Ce=()=>{this.dispatchEvent(new CustomEvent("wf-focus",{detail:{name:this.name},bubbles:!0,composed:!0}))}}connectedCallback(){super.connectedCallback(),this.je()}updated(t){(t.has("required")||t.has("workEmail")||t.has("blockedDomains"))&&this.je()}je(){if(this.$e=[],this.required&&this.$e.push(Vt.required()),this.$e.push(Vt.email()),this.workEmail){let t=Pt;this.blockedDomains&&(t=this.blockedDomains.split(",").map(t=>t.trim().toLowerCase())),this.$e.push(Vt.workEmail(t,this.workEmailMessage))}}render(){return Y`
|
|
115
|
+
`}},Ht([bt()],t.WfField.prototype,"_inputElement",2),t.WfField=Ht([ft("wf-field")],t.WfField);var Wt=Object.defineProperty,Yt=Object.getOwnPropertyDescriptor,Jt=(t,e,i,s)=>{for(var r,o=s>1?void 0:s?Yt(e,i):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(s?r(e,i,o):r(o))||o);return s&&o&&Wt(e,i,o),o};t.WfEmail=class extends Ft{constructor(){super(...arguments),this.placeholder="you@company.com",this.workEmail=!1,this.blockedDomains="",this.workEmailMessage="Please use your work email address",this.disabled=!1}qe(){return["required","workEmail","blockedDomains"]}Ne(){return 300}Ie(){if(this.Ae=[],this.required&&this.Ae.push(Bt.required()),this.Ae.push(Bt.email()),this.workEmail){let t=Vt;this.blockedDomains&&(t=this.blockedDomains.split(",").map(t=>t.trim().toLowerCase())),this.Ae.push(Bt.workEmail(t,this.workEmailMessage))}}render(){return Y`
|
|
749
116
|
<div class="wf-field-container">
|
|
750
117
|
${this.label?Y`<label
|
|
751
118
|
class="wf-label ${this.required?"wf-label-required":""}"
|
|
@@ -756,98 +123,24 @@
|
|
|
756
123
|
</label>`:""}
|
|
757
124
|
<input
|
|
758
125
|
type="email"
|
|
759
|
-
class="wf-input ${this.
|
|
126
|
+
class="wf-input ${this.le?"wf-input-error":""}"
|
|
760
127
|
id="${this.name}"
|
|
761
128
|
name="${this.name}"
|
|
762
129
|
placeholder="${this.placeholder}"
|
|
763
|
-
.value="${this.
|
|
130
|
+
.value="${this.Te}"
|
|
764
131
|
?disabled="${this.disabled}"
|
|
765
132
|
?required="${this.required}"
|
|
766
133
|
data-testid="wf-input"
|
|
767
|
-
@input="${this.
|
|
768
|
-
@blur="${this.
|
|
769
|
-
@focus="${this.
|
|
134
|
+
@input="${this.Pe}"
|
|
135
|
+
@blur="${this.Me}"
|
|
136
|
+
@focus="${this.Re}"
|
|
770
137
|
/>
|
|
771
|
-
${this.hint&&!this.
|
|
138
|
+
${this.hint&&!this.le?Y`<span class="wf-hint">${this.hint}</span>`:""}
|
|
772
139
|
<span class="wf-error-message" role="alert" aria-live="polite" data-testid="wf-error">
|
|
773
|
-
${this.
|
|
140
|
+
${this.le}
|
|
774
141
|
</span>
|
|
775
142
|
</div>
|
|
776
|
-
`}
|
|
777
|
-
:host {
|
|
778
|
-
display: block;
|
|
779
|
-
}
|
|
780
|
-
|
|
781
|
-
:host([hidden]) {
|
|
782
|
-
display: none;
|
|
783
|
-
}
|
|
784
|
-
|
|
785
|
-
.wf-field-container {
|
|
786
|
-
display: flex;
|
|
787
|
-
flex-direction: column;
|
|
788
|
-
gap: var(--wf-spacing-2, 8px);
|
|
789
|
-
}
|
|
790
|
-
|
|
791
|
-
.wf-label {
|
|
792
|
-
font-size: var(--wf-font-size-sm, 0.875rem);
|
|
793
|
-
font-weight: 500;
|
|
794
|
-
color: var(--wf-color-text, #0a0a0a);
|
|
795
|
-
}
|
|
796
|
-
|
|
797
|
-
.wf-label-required::after {
|
|
798
|
-
content: ' *';
|
|
799
|
-
color: var(--wf-color-error, #dc3545);
|
|
800
|
-
}
|
|
801
|
-
|
|
802
|
-
.wf-input {
|
|
803
|
-
width: 100%;
|
|
804
|
-
min-height: var(--wf-input-min-height, 56px);
|
|
805
|
-
padding: var(--wf-spacing-4, 16px);
|
|
806
|
-
font-size: var(--wf-font-size-base, 1rem);
|
|
807
|
-
font-weight: 500;
|
|
808
|
-
font-family: inherit;
|
|
809
|
-
background-color: var(--wf-color-surface, #f3f3f5);
|
|
810
|
-
border: 1px solid var(--wf-color-border, #d4d4d4);
|
|
811
|
-
border-radius: var(--wf-radius-md, 8px);
|
|
812
|
-
color: var(--wf-color-text, #0a0a0a);
|
|
813
|
-
transition: border-color 150ms ease, box-shadow 150ms ease;
|
|
814
|
-
outline: none;
|
|
815
|
-
box-sizing: border-box;
|
|
816
|
-
}
|
|
817
|
-
|
|
818
|
-
.wf-input::placeholder {
|
|
819
|
-
color: var(--wf-color-text-muted, #646464);
|
|
820
|
-
font-weight: 500;
|
|
821
|
-
}
|
|
822
|
-
|
|
823
|
-
.wf-input:focus {
|
|
824
|
-
border-color: var(--wf-color-primary, #8040f0);
|
|
825
|
-
box-shadow: 0 0 0 3px rgba(128, 64, 240, 0.2);
|
|
826
|
-
}
|
|
827
|
-
|
|
828
|
-
.wf-input:disabled {
|
|
829
|
-
opacity: 0.5;
|
|
830
|
-
cursor: not-allowed;
|
|
831
|
-
}
|
|
832
|
-
|
|
833
|
-
.wf-input.wf-input-error {
|
|
834
|
-
border-color: var(--wf-color-error, #dc3545);
|
|
835
|
-
}
|
|
836
|
-
|
|
837
|
-
.wf-input.wf-input-error:focus {
|
|
838
|
-
box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.2);
|
|
839
|
-
}
|
|
840
|
-
|
|
841
|
-
.wf-error-message {
|
|
842
|
-
font-size: var(--wf-font-size-sm, 0.875rem);
|
|
843
|
-
color: var(--wf-color-error, #dc3545);
|
|
844
|
-
}
|
|
845
|
-
|
|
846
|
-
.wf-hint {
|
|
847
|
-
font-size: var(--wf-font-size-sm, 0.875rem);
|
|
848
|
-
color: var(--wf-color-text-muted, #646464);
|
|
849
|
-
}
|
|
850
|
-
`,Ut([mt({type:String})],t.WfEmail.prototype,"name",2),Ut([mt({type:String})],t.WfEmail.prototype,"label",2),Ut([mt({type:String})],t.WfEmail.prototype,"placeholder",2),Ut([mt({type:Boolean})],t.WfEmail.prototype,"required",2),Ut([mt({type:Boolean,attribute:"work-email"})],t.WfEmail.prototype,"workEmail",2),Ut([mt({type:String,attribute:"blocked-domains"})],t.WfEmail.prototype,"blockedDomains",2),Ut([mt({type:String,attribute:"work-email-message"})],t.WfEmail.prototype,"workEmailMessage",2),Ut([mt({type:Boolean})],t.WfEmail.prototype,"disabled",2),Ut([mt({type:String})],t.WfEmail.prototype,"hint",2),Ut([bt()],t.WfEmail.prototype,"_errorMessage",2),Ut([bt()],t.WfEmail.prototype,"_value",2),t.WfEmail=Ut([ut("wf-email")],t.WfEmail);var Rt=Object.defineProperty,Lt=Object.getOwnPropertyDescriptor,Wt=(t,e,s,i)=>{for(var r,o=i>1?void 0:i?Lt(e,s):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(i?r(e,s,o):r(o))||o);return i&&o&&Rt(e,s,o),o};t.WfInput=class extends dt{constructor(){super(...arguments),this.name="",this.label="",this.placeholder="",this.type="text",this.required=!1,this.patternMessage="Invalid format",this.disabled=!1,this.autocomplete="",this.hint="",this.ie="",this.Se="",this.re=!1,this.ke=null,this.$e=[],this.Ee=t=>{const e=t.target;this.Se=e.value,this.re&&(this.ke&&clearTimeout(this.ke),this.ke=setTimeout(()=>{this.validate()},600)),this.dispatchEvent(new CustomEvent("wf-change",{detail:{name:this.name,value:this.Se},bubbles:!0,composed:!0}))},this.ze=()=>{this.dispatchEvent(new CustomEvent("wf-blur",{detail:{name:this.name,value:this.Se},bubbles:!0,composed:!0}))},this.Ce=()=>{this.dispatchEvent(new CustomEvent("wf-focus",{detail:{name:this.name},bubbles:!0,composed:!0}))}}connectedCallback(){super.connectedCallback(),this.je()}updated(t){(t.has("required")||t.has("minlength")||t.has("maxlength")||t.has("pattern"))&&this.je()}je(){this.$e=[],this.required&&this.$e.push(Vt.required()),void 0!==this.minlength&&this.$e.push(Vt.minLength(this.minlength)),void 0!==this.maxlength&&this.$e.push(Vt.maxLength(this.maxlength)),this.pattern&&this.$e.push(Vt.pattern(RegExp(this.pattern),this.patternMessage))}render(){return Y`
|
|
143
|
+
`}},Jt([wt({type:String})],t.WfEmail.prototype,"placeholder",2),Jt([wt({type:Boolean,attribute:"work-email"})],t.WfEmail.prototype,"workEmail",2),Jt([wt({type:String,attribute:"blocked-domains"})],t.WfEmail.prototype,"blockedDomains",2),Jt([wt({type:String,attribute:"work-email-message"})],t.WfEmail.prototype,"workEmailMessage",2),Jt([wt({type:Boolean})],t.WfEmail.prototype,"disabled",2),t.WfEmail=Jt([ft("wf-email")],t.WfEmail);var Kt=Object.defineProperty,Xt=Object.getOwnPropertyDescriptor,Zt=(t,e,i,s)=>{for(var r,o=s>1?void 0:s?Xt(e,i):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(s?r(e,i,o):r(o))||o);return s&&o&&Kt(e,i,o),o};t.WfInput=class extends Ft{constructor(){super(...arguments),this.placeholder="",this.type="text",this.patternMessage="Invalid format",this.disabled=!1,this.autocomplete=""}qe(){return["required","minlength","maxlength","pattern"]}Ie(){this.Ae=[],this.required&&this.Ae.push(Bt.required()),void 0!==this.minlength&&this.Ae.push(Bt.minLength(this.minlength)),void 0!==this.maxlength&&this.Ae.push(Bt.maxLength(this.maxlength)),this.pattern&&this.Ae.push(Bt.pattern(RegExp(this.pattern),this.patternMessage))}render(){return Y`
|
|
851
144
|
<div class="wf-field-container">
|
|
852
145
|
${this.label?Y`<label
|
|
853
146
|
class="wf-label ${this.required?"wf-label-required":""}"
|
|
@@ -858,99 +151,25 @@
|
|
|
858
151
|
</label>`:""}
|
|
859
152
|
<input
|
|
860
153
|
type="${this.type}"
|
|
861
|
-
class="wf-input ${this.
|
|
154
|
+
class="wf-input ${this.le?"wf-input-error":""}"
|
|
862
155
|
id="${this.name}"
|
|
863
156
|
name="${this.name}"
|
|
864
157
|
placeholder="${this.placeholder}"
|
|
865
|
-
.value="${this.
|
|
158
|
+
.value="${this.Te}"
|
|
866
159
|
?disabled="${this.disabled}"
|
|
867
160
|
?required="${this.required}"
|
|
868
161
|
autocomplete="${this.autocomplete||"off"}"
|
|
869
162
|
data-testid="wf-input"
|
|
870
|
-
@input="${this.
|
|
871
|
-
@blur="${this.
|
|
872
|
-
@focus="${this.
|
|
163
|
+
@input="${this.Pe}"
|
|
164
|
+
@blur="${this.Me}"
|
|
165
|
+
@focus="${this.Re}"
|
|
873
166
|
/>
|
|
874
|
-
${this.hint&&!this.
|
|
167
|
+
${this.hint&&!this.le?Y`<span class="wf-hint">${this.hint}</span>`:""}
|
|
875
168
|
<span class="wf-error-message" role="alert" aria-live="polite" data-testid="wf-error">
|
|
876
|
-
${this.
|
|
169
|
+
${this.le}
|
|
877
170
|
</span>
|
|
878
171
|
</div>
|
|
879
|
-
`}
|
|
880
|
-
:host {
|
|
881
|
-
display: block;
|
|
882
|
-
}
|
|
883
|
-
|
|
884
|
-
:host([hidden]) {
|
|
885
|
-
display: none;
|
|
886
|
-
}
|
|
887
|
-
|
|
888
|
-
.wf-field-container {
|
|
889
|
-
display: flex;
|
|
890
|
-
flex-direction: column;
|
|
891
|
-
gap: var(--wf-spacing-2, 8px);
|
|
892
|
-
}
|
|
893
|
-
|
|
894
|
-
.wf-label {
|
|
895
|
-
font-size: var(--wf-font-size-sm, 0.875rem);
|
|
896
|
-
font-weight: 500;
|
|
897
|
-
color: var(--wf-color-text, #0a0a0a);
|
|
898
|
-
}
|
|
899
|
-
|
|
900
|
-
.wf-label-required::after {
|
|
901
|
-
content: ' *';
|
|
902
|
-
color: var(--wf-color-error, #dc3545);
|
|
903
|
-
}
|
|
904
|
-
|
|
905
|
-
.wf-input {
|
|
906
|
-
width: 100%;
|
|
907
|
-
min-height: var(--wf-input-min-height, 56px);
|
|
908
|
-
padding: var(--wf-spacing-4, 16px);
|
|
909
|
-
font-size: var(--wf-font-size-base, 1rem);
|
|
910
|
-
font-weight: 400;
|
|
911
|
-
font-family: inherit;
|
|
912
|
-
background-color: var(--wf-color-surface, #f3f3f5);
|
|
913
|
-
border: 1px solid var(--wf-color-border, #d4d4d4);
|
|
914
|
-
border-radius: var(--wf-radius-md, 8px);
|
|
915
|
-
color: var(--wf-color-text, #0a0a0a);
|
|
916
|
-
transition: border-color 150ms ease, box-shadow 150ms ease;
|
|
917
|
-
outline: none;
|
|
918
|
-
box-sizing: border-box;
|
|
919
|
-
}
|
|
920
|
-
|
|
921
|
-
.wf-input::placeholder {
|
|
922
|
-
color: var(--wf-color-text-muted, #646464);
|
|
923
|
-
font-weight: 500;
|
|
924
|
-
}
|
|
925
|
-
|
|
926
|
-
.wf-input:focus {
|
|
927
|
-
border-color: var(--wf-color-primary, #8040f0);
|
|
928
|
-
box-shadow: 0 0 0 3px rgba(128, 64, 240, 0.2);
|
|
929
|
-
}
|
|
930
|
-
|
|
931
|
-
.wf-input:disabled {
|
|
932
|
-
opacity: 0.5;
|
|
933
|
-
cursor: not-allowed;
|
|
934
|
-
}
|
|
935
|
-
|
|
936
|
-
.wf-input.wf-input-error {
|
|
937
|
-
border-color: var(--wf-color-error, #dc3545);
|
|
938
|
-
}
|
|
939
|
-
|
|
940
|
-
.wf-input.wf-input-error:focus {
|
|
941
|
-
box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.2);
|
|
942
|
-
}
|
|
943
|
-
|
|
944
|
-
.wf-error-message {
|
|
945
|
-
font-size: var(--wf-font-size-sm, 0.875rem);
|
|
946
|
-
color: var(--wf-color-error, #dc3545);
|
|
947
|
-
}
|
|
948
|
-
|
|
949
|
-
.wf-hint {
|
|
950
|
-
font-size: var(--wf-font-size-sm, 0.875rem);
|
|
951
|
-
color: var(--wf-color-text-muted, #646464);
|
|
952
|
-
}
|
|
953
|
-
`,Wt([mt({type:String})],t.WfInput.prototype,"name",2),Wt([mt({type:String})],t.WfInput.prototype,"label",2),Wt([mt({type:String})],t.WfInput.prototype,"placeholder",2),Wt([mt({type:String})],t.WfInput.prototype,"type",2),Wt([mt({type:Boolean})],t.WfInput.prototype,"required",2),Wt([mt({type:Number})],t.WfInput.prototype,"minlength",2),Wt([mt({type:Number})],t.WfInput.prototype,"maxlength",2),Wt([mt({type:String})],t.WfInput.prototype,"pattern",2),Wt([mt({type:String,attribute:"pattern-message"})],t.WfInput.prototype,"patternMessage",2),Wt([mt({type:Boolean})],t.WfInput.prototype,"disabled",2),Wt([mt({type:String})],t.WfInput.prototype,"autocomplete",2),Wt([mt({type:String})],t.WfInput.prototype,"hint",2),Wt([bt()],t.WfInput.prototype,"_errorMessage",2),Wt([bt()],t.WfInput.prototype,"_value",2),t.WfInput=Wt([ut("wf-input")],t.WfInput);var Ht=Object.defineProperty,Xt=Object.getOwnPropertyDescriptor,Yt=(t,e,s,i)=>{for(var r,o=i>1?void 0:i?Xt(e,s):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(i?r(e,s,o):r(o))||o);return i&&o&&Ht(e,s,o),o};t.WfNumber=class extends t.WfInput{constructor(){super(...arguments),this.step=1}je(){this.$e=[],this.required&&this.$e.push(Vt.required()),void 0===this.min&&void 0===this.max||this.$e.push(Vt.custom("range",t=>{if(""===t||null==t)return{valid:!0};const e=Number(t);return isNaN(e)?{valid:!1,error:"Please enter a valid number"}:void 0!==this.min&&e<this.min?{valid:!1,error:"Value must be at least "+this.min}:void 0!==this.max&&e>this.max?{valid:!1,error:"Value must be at most "+this.max}:{valid:!0}},"Value out of range"))}render(){return Y`
|
|
172
|
+
`}},Zt([wt({type:String})],t.WfInput.prototype,"placeholder",2),Zt([wt({type:String})],t.WfInput.prototype,"type",2),Zt([wt({type:Number})],t.WfInput.prototype,"minlength",2),Zt([wt({type:Number})],t.WfInput.prototype,"maxlength",2),Zt([wt({type:String})],t.WfInput.prototype,"pattern",2),Zt([wt({type:String,attribute:"pattern-message"})],t.WfInput.prototype,"patternMessage",2),Zt([wt({type:Boolean})],t.WfInput.prototype,"disabled",2),Zt([wt({type:String})],t.WfInput.prototype,"autocomplete",2),t.WfInput=Zt([ft("wf-input")],t.WfInput);var Gt=Object.defineProperty,Qt=Object.getOwnPropertyDescriptor,te=(t,e,i,s)=>{for(var r,o=s>1?void 0:s?Qt(e,i):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(s?r(e,i,o):r(o))||o);return s&&o&&Gt(e,i,o),o};t.WfNumber=class extends t.WfInput{constructor(){super(...arguments),this.step=1}Ie(){this.Ae=[],this.required&&this.Ae.push(Bt.required()),void 0===this.min&&void 0===this.max||this.Ae.push(Bt.custom("range",t=>{if(""===t||null==t)return{valid:!0};const e=Number(t);return isNaN(e)?{valid:!1,error:"Please enter a valid number"}:void 0!==this.min&&e<this.min?{valid:!1,error:"Value must be at least "+this.min}:void 0!==this.max&&e>this.max?{valid:!1,error:"Value must be at most "+this.max}:{valid:!0}},"Value out of range"))}render(){return Y`
|
|
954
173
|
<div class="wf-field-container">
|
|
955
174
|
${this.label?Y`<label
|
|
956
175
|
class="wf-label ${this.required?"wf-label-required":""}"
|
|
@@ -961,11 +180,11 @@
|
|
|
961
180
|
</label>`:""}
|
|
962
181
|
<input
|
|
963
182
|
type="number"
|
|
964
|
-
class="wf-input ${this.
|
|
183
|
+
class="wf-input ${this.le?"wf-input-error":""}"
|
|
965
184
|
id="${this.name}"
|
|
966
185
|
name="${this.name}"
|
|
967
186
|
placeholder="${this.placeholder}"
|
|
968
|
-
.value="${this.
|
|
187
|
+
.value="${this.Te}"
|
|
969
188
|
?disabled="${this.disabled}"
|
|
970
189
|
?required="${this.required}"
|
|
971
190
|
min="${this.min??""}"
|
|
@@ -973,27 +192,16 @@
|
|
|
973
192
|
step="${this.step}"
|
|
974
193
|
autocomplete="${this.autocomplete||"off"}"
|
|
975
194
|
data-testid="wf-input"
|
|
976
|
-
@input="${this.
|
|
977
|
-
@blur="${this.
|
|
978
|
-
@focus="${this.
|
|
195
|
+
@input="${this.Pe}"
|
|
196
|
+
@blur="${this.Me}"
|
|
197
|
+
@focus="${this.Re}"
|
|
979
198
|
/>
|
|
980
|
-
${this.hint&&!this.
|
|
199
|
+
${this.hint&&!this.le?Y`<span class="wf-hint">${this.hint}</span>`:""}
|
|
981
200
|
<span class="wf-error-message" role="alert" aria-live="polite" data-testid="wf-error">
|
|
982
|
-
${this.
|
|
201
|
+
${this.le}
|
|
983
202
|
</span>
|
|
984
203
|
</div>
|
|
985
|
-
`}get valueAsNumber(){return Number(this.
|
|
986
|
-
/* Hide number input spinners */
|
|
987
|
-
.wf-input::-webkit-outer-spin-button,
|
|
988
|
-
.wf-input::-webkit-inner-spin-button {
|
|
989
|
-
-webkit-appearance: none;
|
|
990
|
-
margin: 0;
|
|
991
|
-
}
|
|
992
|
-
|
|
993
|
-
.wf-input[type='number'] {
|
|
994
|
-
-moz-appearance: textfield;
|
|
995
|
-
}
|
|
996
|
-
`],Yt([mt({type:Number})],t.WfNumber.prototype,"min",2),Yt([mt({type:Number})],t.WfNumber.prototype,"max",2),Yt([mt({type:Number})],t.WfNumber.prototype,"step",2),t.WfNumber=Yt([ut("wf-number")],t.WfNumber);var Jt=Object.defineProperty,Kt=Object.getOwnPropertyDescriptor,Zt=(t,e,s,i)=>{for(var r,o=i>1?void 0:i?Kt(e,s):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(i?r(e,s,o):r(o))||o);return i&&o&&Jt(e,s,o),o};function Gt(t){const e="string"==typeof t.container?document.querySelector(t.container):t.container;if(!e)throw Error("[WizardForm] Container not found: "+t.container);let r=e.querySelector("wizard-form");if(!r&&(r=e,"wizard-form"!==r.tagName.toLowerCase()))throw Error("[WizardForm] Container must be a <wizard-form> element or contain one");t.theme&&r.setAttribute("theme",t.theme),void 0!==t.showProgress&&(r.showProgress=t.showProgress),void 0!==t.autoAdvance&&(r.autoAdvance=t.autoAdvance),t.mock&&(r.mock=t.mock);let a=null;if("object"==typeof t.adapter)a=t.adapter;else switch(t.adapter||"json"){case"hubspot":if(!t.hubspot?.portalId||!t.hubspot?.formId)throw Error("[WizardForm] HubSpot config requires portalId and formId");a=s({portalId:t.hubspot.portalId,formId:t.hubspot.formId,fieldMapping:t.hubspot.fieldMapping,mock:t.mock}),r.setAttribute("hubspot-portal",t.hubspot.portalId),r.setAttribute("hubspot-form",t.hubspot.formId);break;case"webhook":if(!t.webhook?.url)throw Error("[WizardForm] Webhook config requires url");a=i({url:t.webhook.url,method:t.webhook.method,headers:t.webhook.headers,fieldMapping:t.webhook.fieldMapping,mock:t.mock});break;case"revenuehero":if(!t.revenuehero?.routerId)throw Error("[WizardForm] RevenueHero config requires routerId");a=o({routerId:t.revenuehero.routerId,fieldMapping:t.revenuehero.fieldMapping,mock:t.mock});break;case"json":a=null}const n=e=>{const s=e.detail.formData;let i={...s};if(t.serialize&&(i=t.serialize(i)),t.mock&&(window.__wizardFormData=i,window.__wizardFormRawData=s,window.__wizardFormInstance=f),t.onSubmit&&!1===t.onSubmit(i))e.preventDefault();else if(a){e.preventDefault();const o={pageUrl:window.location.href,pageTitle:document.title,referrer:document.referrer,timestamp:(new Date).toISOString()};a.submit(i,o).then(e=>{t.mock&&(window.__wizardFormResponse=e),e.success?(r.kt=!0,r.requestUpdate(),r.dispatchEvent(new CustomEvent("wf:success",{detail:{formData:s,response:e.data},bubbles:!0,composed:!0}))):(t.mock&&(window.__wizardFormError=e.error),t.onError&&t.onError(e.error||"Submission failed",s))})}},h=e=>{t.mock&&(window.__wizardFormResponse={success:!0,data:e.detail.response}),t.onSuccess&&t.onSuccess(e.detail.formData,e.detail.response)},l=e=>{t.mock&&(window.__wizardFormError=e.detail.error),t.onError&&t.onError(e.detail.error,e.detail.formData)},c=e=>{t.onStepChange&&t.onStepChange(e.detail.from,e.detail.to,e.detail.direction)},d=e=>{t.onFieldChange&&t.onFieldChange(e.detail.name,e.detail.value,e.detail.formData)};r.addEventListener("wf:submit",n),r.addEventListener("wf:success",h),r.addEventListener("wf:error",l),r.addEventListener("wf:step-change",c),r.addEventListener("wf:field-change",d);const f={element:r,get formData(){return r.formData},get currentStep(){return r.currentStep},get totalSteps(){return r.totalSteps},next:()=>r.next(),back(){r.back()},goToStep(t){r.goToStep(t)},submit:()=>r.submit(),reset(){r.reset()},setFormData(t){r.setFormData(t)},destroy(){r.removeEventListener("wf:submit",n),r.removeEventListener("wf:success",h),r.removeEventListener("wf:error",l),r.removeEventListener("wf:step-change",c),r.removeEventListener("wf:field-change",d)},serialize:t.serialize};return f}t.WfTextarea=class extends dt{constructor(){super(...arguments),this.name="",this.label="",this.placeholder="",this.rows=4,this.required=!1,this.disabled=!1,this.showCount=!1,this.hint="",this.ie="",this.Se="",this.re=!1,this.ke=null,this.$e=[],this.Ee=t=>{const e=t.target;this.Se=e.value,this.re&&(this.ke&&clearTimeout(this.ke),this.ke=setTimeout(()=>{this.validate()},600)),this.dispatchEvent(new CustomEvent("wf-change",{detail:{name:this.name,value:this.Se},bubbles:!0,composed:!0}))},this.ze=()=>{this.dispatchEvent(new CustomEvent("wf-blur",{detail:{name:this.name,value:this.Se},bubbles:!0,composed:!0}))},this.Ce=()=>{this.dispatchEvent(new CustomEvent("wf-focus",{detail:{name:this.name},bubbles:!0,composed:!0}))},this.At=t=>{"Enter"===t.key&&t.stopPropagation()}}connectedCallback(){super.connectedCallback(),this.je()}updated(t){(t.has("required")||t.has("minlength")||t.has("maxlength"))&&this.je()}je(){this.$e=[],this.required&&this.$e.push(Vt.required()),void 0!==this.minlength&&this.$e.push(Vt.minLength(this.minlength)),void 0!==this.maxlength&&this.$e.push(Vt.maxLength(this.maxlength))}render(){const t=this.Se.length,e=void 0!==this.maxlength&&t>=this.maxlength;return Y`
|
|
204
|
+
`}get valueAsNumber(){return Number(this.Te)||0}set valueAsNumber(t){this.Te=t+""}},te([wt({type:Number})],t.WfNumber.prototype,"min",2),te([wt({type:Number})],t.WfNumber.prototype,"max",2),te([wt({type:Number})],t.WfNumber.prototype,"step",2),t.WfNumber=te([ft("wf-number")],t.WfNumber);var ee=Object.defineProperty,ie=Object.getOwnPropertyDescriptor,se=(t,e,i,s)=>{for(var r,o=s>1?void 0:s?ie(e,i):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(s?r(e,i,o):r(o))||o);return s&&o&&ee(e,i,o),o};function re(t){const e="string"==typeof t.container?document.querySelector(t.container):t.container;if(!e)throw Error("[WizardForm] Container not found: "+t.container);let r=e.querySelector("wizard-form");if(!r&&(r=e,"wizard-form"!==r.tagName.toLowerCase()))throw Error("[WizardForm] Container must be a <wizard-form> element or contain one");t.theme&&r.setAttribute("theme",t.theme),void 0!==t.showProgress&&(r.showProgress=t.showProgress),void 0!==t.autoAdvance&&(r.autoAdvance=t.autoAdvance),t.mock&&(r.mock=t.mock);let a=null;if("object"==typeof t.adapter)a=t.adapter;else switch(t.adapter||"json"){case"hubspot":if(!t.hubspot?.portalId||!t.hubspot?.formId)throw Error("[WizardForm] HubSpot config requires portalId and formId");a=i({portalId:t.hubspot.portalId,formId:t.hubspot.formId,fieldMapping:t.hubspot.fieldMapping,mock:t.mock}),r.setAttribute("hubspot-portal",t.hubspot.portalId),r.setAttribute("hubspot-form",t.hubspot.formId);break;case"webhook":if(!t.webhook?.url)throw Error("[WizardForm] Webhook config requires url");a=s({url:t.webhook.url,method:t.webhook.method,headers:t.webhook.headers,fieldMapping:t.webhook.fieldMapping,mock:t.mock});break;case"revenuehero":if(!t.revenuehero?.routerId)throw Error("[WizardForm] RevenueHero config requires routerId");a=o({routerId:t.revenuehero.routerId,fieldMapping:t.revenuehero.fieldMapping,mock:t.mock});break;case"json":a=null}const n=e=>{const i=e.detail.formData;let s={...i};if(t.serialize&&(s=t.serialize(s)),t.mock&&(window.__wizardFormData=s,window.__wizardFormRawData=i,window.__wizardFormInstance=f),t.onSubmit&&!1===t.onSubmit(s))e.preventDefault();else if(a){e.preventDefault();const o={pageUrl:window.location.href,pageTitle:document.title,referrer:document.referrer,timestamp:(new Date).toISOString()};a.submit(s,o).then(e=>{t.mock&&(window.__wizardFormResponse=e),e.success?(r.St=!0,r.requestUpdate(),r.dispatchEvent(new CustomEvent("wf:success",{detail:{formData:i,response:e.data},bubbles:!0,composed:!0}))):(t.mock&&(window.__wizardFormError=e.error),t.onError&&t.onError(e.error||"Submission failed",i))})}},h=e=>{t.mock&&(window.__wizardFormResponse={success:!0,data:e.detail.response}),t.onSuccess&&t.onSuccess(e.detail.formData,e.detail.response)},c=e=>{t.mock&&(window.__wizardFormError=e.detail.error),t.onError&&t.onError(e.detail.error,e.detail.formData)},l=e=>{t.onStepChange&&t.onStepChange(e.detail.from,e.detail.to,e.detail.direction)},d=e=>{t.onFieldChange&&t.onFieldChange(e.detail.name,e.detail.value,e.detail.formData)};r.addEventListener("wf:submit",n),r.addEventListener("wf:success",h),r.addEventListener("wf:error",c),r.addEventListener("wf:step-change",l),r.addEventListener("wf:field-change",d);const f={element:r,get formData(){return r.formData},get currentStep(){return r.currentStep},get totalSteps(){return r.totalSteps},next:()=>r.next(),back(){r.back()},goToStep(t){r.goToStep(t)},submit:()=>r.submit(),reset(){r.reset()},setFormData(t){r.setFormData(t)},destroy(){r.removeEventListener("wf:submit",n),r.removeEventListener("wf:success",h),r.removeEventListener("wf:error",c),r.removeEventListener("wf:step-change",l),r.removeEventListener("wf:field-change",d)},serialize:t.serialize};return f}t.WfTextarea=class extends Ft{constructor(){super(...arguments),this.placeholder="",this.rows=4,this.disabled=!1,this.showCount=!1,this.At=t=>{"Enter"===t.key&&t.stopPropagation()}}qe(){return["required","minlength","maxlength"]}De(){return"textarea"}Ie(){this.Ae=[],this.required&&this.Ae.push(Bt.required()),void 0!==this.minlength&&this.Ae.push(Bt.minLength(this.minlength)),void 0!==this.maxlength&&this.Ae.push(Bt.maxLength(this.maxlength))}render(){const t=this.Te.length,e=void 0!==this.maxlength&&t>=this.maxlength;return Y`
|
|
997
205
|
<div class="wf-field-container">
|
|
998
206
|
${this.label?Y`<label
|
|
999
207
|
class="wf-label ${this.required?"wf-label-required":""}"
|
|
@@ -1003,183 +211,38 @@
|
|
|
1003
211
|
${this.label}
|
|
1004
212
|
</label>`:""}
|
|
1005
213
|
<textarea
|
|
1006
|
-
class="wf-textarea ${this.
|
|
214
|
+
class="wf-textarea ${this.le?"wf-textarea-error":""}"
|
|
1007
215
|
id="${this.name}"
|
|
1008
216
|
name="${this.name}"
|
|
1009
217
|
placeholder="${this.placeholder}"
|
|
1010
218
|
rows="${this.rows}"
|
|
1011
|
-
.value="${this.
|
|
219
|
+
.value="${this.Te}"
|
|
1012
220
|
?disabled="${this.disabled}"
|
|
1013
221
|
?required="${this.required}"
|
|
1014
222
|
maxlength="${this.maxlength??""}"
|
|
1015
223
|
data-testid="wf-textarea"
|
|
1016
|
-
@input="${this.
|
|
1017
|
-
@blur="${this.
|
|
1018
|
-
@focus="${this.
|
|
224
|
+
@input="${this.Pe}"
|
|
225
|
+
@blur="${this.Me}"
|
|
226
|
+
@focus="${this.Re}"
|
|
1019
227
|
@keydown="${this.At}"
|
|
1020
228
|
></textarea>
|
|
1021
229
|
${this.showCount&&this.maxlength?Y`<span class="wf-char-count ${e?"wf-char-limit":""}" data-testid="wf-counter">
|
|
1022
230
|
${t}/${this.maxlength}
|
|
1023
231
|
</span>`:""}
|
|
1024
|
-
${this.hint&&!this.
|
|
232
|
+
${this.hint&&!this.le?Y`<span class="wf-hint">${this.hint}</span>`:""}
|
|
1025
233
|
<span class="wf-error-message" role="alert" aria-live="polite" data-testid="wf-error">
|
|
1026
|
-
${this.
|
|
234
|
+
${this.le}
|
|
1027
235
|
</span>
|
|
1028
236
|
</div>
|
|
1029
|
-
`}
|
|
1030
|
-
:host {
|
|
1031
|
-
display: block;
|
|
1032
|
-
}
|
|
1033
|
-
|
|
1034
|
-
:host([hidden]) {
|
|
1035
|
-
display: none;
|
|
1036
|
-
}
|
|
1037
|
-
|
|
1038
|
-
.wf-field-container {
|
|
1039
|
-
display: flex;
|
|
1040
|
-
flex-direction: column;
|
|
1041
|
-
gap: var(--wf-spacing-2, 8px);
|
|
1042
|
-
}
|
|
1043
|
-
|
|
1044
|
-
.wf-label {
|
|
1045
|
-
font-size: var(--wf-font-size-sm, 0.875rem);
|
|
1046
|
-
font-weight: 500;
|
|
1047
|
-
color: var(--wf-color-text, #212529);
|
|
1048
|
-
}
|
|
1049
|
-
|
|
1050
|
-
.wf-label-required::after {
|
|
1051
|
-
content: ' *';
|
|
1052
|
-
color: var(--wf-color-error, #dc3545);
|
|
1053
|
-
}
|
|
1054
|
-
|
|
1055
|
-
.wf-textarea {
|
|
1056
|
-
width: 100%;
|
|
1057
|
-
padding: var(--wf-spacing-4, 16px);
|
|
1058
|
-
font-size: var(--wf-font-size-base, 1rem);
|
|
1059
|
-
font-family: inherit;
|
|
1060
|
-
background-color: var(--wf-color-surface, #f8f9fa);
|
|
1061
|
-
border: 1.5px solid var(--wf-color-border, #e5e7eb);
|
|
1062
|
-
border-radius: var(--wf-radius-lg, 12px);
|
|
1063
|
-
color: var(--wf-color-text, #212529);
|
|
1064
|
-
transition: border-color 150ms ease, box-shadow 150ms ease;
|
|
1065
|
-
outline: none;
|
|
1066
|
-
box-sizing: border-box;
|
|
1067
|
-
resize: vertical;
|
|
1068
|
-
min-height: 100px;
|
|
1069
|
-
}
|
|
1070
|
-
|
|
1071
|
-
.wf-textarea::placeholder {
|
|
1072
|
-
color: var(--wf-color-text-muted, #6c757d);
|
|
1073
|
-
}
|
|
1074
|
-
|
|
1075
|
-
.wf-textarea:focus {
|
|
1076
|
-
border-color: var(--wf-color-primary, #8b5cf6);
|
|
1077
|
-
box-shadow: 0 0 0 3px rgba(139, 92, 246, 0.2);
|
|
1078
|
-
}
|
|
1079
|
-
|
|
1080
|
-
.wf-textarea:disabled {
|
|
1081
|
-
opacity: 0.5;
|
|
1082
|
-
cursor: not-allowed;
|
|
1083
|
-
}
|
|
1084
|
-
|
|
1085
|
-
.wf-textarea.wf-textarea-error {
|
|
1086
|
-
border-color: var(--wf-color-error, #dc3545);
|
|
1087
|
-
}
|
|
1088
|
-
|
|
1089
|
-
.wf-textarea.wf-textarea-error:focus {
|
|
1090
|
-
box-shadow: 0 0 0 3px rgba(220, 53, 69, 0.2);
|
|
1091
|
-
}
|
|
1092
|
-
|
|
1093
|
-
.wf-error-message {
|
|
1094
|
-
font-size: var(--wf-font-size-sm, 0.875rem);
|
|
1095
|
-
color: var(--wf-color-error, #dc3545);
|
|
1096
|
-
min-height: 20px;
|
|
1097
|
-
}
|
|
1098
|
-
|
|
1099
|
-
.wf-hint {
|
|
1100
|
-
font-size: var(--wf-font-size-sm, 0.875rem);
|
|
1101
|
-
color: var(--wf-color-text-muted, #6c757d);
|
|
1102
|
-
}
|
|
1103
|
-
|
|
1104
|
-
.wf-char-count {
|
|
1105
|
-
font-size: var(--wf-font-size-sm, 0.875rem);
|
|
1106
|
-
color: var(--wf-color-text-muted, #6c757d);
|
|
1107
|
-
text-align: right;
|
|
1108
|
-
}
|
|
1109
|
-
|
|
1110
|
-
.wf-char-count.wf-char-limit {
|
|
1111
|
-
color: var(--wf-color-error, #dc3545);
|
|
1112
|
-
}
|
|
1113
|
-
`,Zt([mt({type:String})],t.WfTextarea.prototype,"name",2),Zt([mt({type:String})],t.WfTextarea.prototype,"label",2),Zt([mt({type:String})],t.WfTextarea.prototype,"placeholder",2),Zt([mt({type:Number})],t.WfTextarea.prototype,"rows",2),Zt([mt({type:Boolean})],t.WfTextarea.prototype,"required",2),Zt([mt({type:Number})],t.WfTextarea.prototype,"minlength",2),Zt([mt({type:Number})],t.WfTextarea.prototype,"maxlength",2),Zt([mt({type:Boolean})],t.WfTextarea.prototype,"disabled",2),Zt([mt({type:Boolean,attribute:"show-count"})],t.WfTextarea.prototype,"showCount",2),Zt([mt({type:String})],t.WfTextarea.prototype,"hint",2),Zt([bt()],t.WfTextarea.prototype,"_errorMessage",2),Zt([bt()],t.WfTextarea.prototype,"_value",2),t.WfTextarea=Zt([ut("wf-textarea")],t.WfTextarea);const Qt={init:Gt};var te=Object.defineProperty,ee=Object.getOwnPropertyDescriptor,se=(t,e,s,i)=>{for(var r,o=i>1?void 0:i?ee(e,s):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(i?r(e,s,o):r(o))||o);return i&&o&&te(e,s,o),o};const ie={none:0,xs:4,sm:8,md:16,lg:24,xl:32};t.WfLayout=class extends dt{constructor(){super(...arguments),this.mode="flex",this.direction="column",this.gap="none",this.gapX="",this.gapY="",this.align="stretch",this.justify="start",this.padding="none",this.paddingX="",this.paddingY="",this.wrap=!1,this.width="full",this.columns="auto",this.minItemWidth="200px"}Ae(t){if(!t||"none"===t)return"0";if(t in ie)return ie[t]+"px";const e=parseFloat(t);return isNaN(e)?t:e+"px"}Ne(){return this.Ae(this.gapX||this.gap)}Me(){return this.Ae(this.gapY||this.gap)}Pe(){const t=this.Ae(this.padding),e=this.paddingX?this.Ae(this.paddingX):t;return`${this.paddingY?this.Ae(this.paddingY):t} ${e}`}Ve(){const t=[];if("grid"===this.mode){t.push("display: grid");const e=parseInt(this.columns,10);!isNaN(e)&&e>0?t.push(`grid-template-columns: repeat(${e}, 1fr)`):t.push(`grid-template-columns: repeat(auto-fit, minmax(${this.minItemWidth}, 1fr))`),"stretch"!==this.align&&t.push("align-items: "+this.align),"start"!==this.justify&&t.push("justify-content: "+this.justify)}else t.push("display: flex"),t.push("flex-direction: "+this.direction),this.wrap&&t.push("flex-wrap: wrap"),"stretch"!==this.align&&t.push("align-items: "+this.align),"start"!==this.justify&&t.push("justify-content: "+this.justify);const e=this.Ne(),s=this.Me();"0"===e&&"0"===s||(t.push("column-gap: "+e),t.push("row-gap: "+s));const i=this.Pe();return"0 0"!==i&&t.push("padding: "+i),t.join("; ")}render(){return Y`
|
|
1114
|
-
<div
|
|
1115
|
-
class="wf-layout wf-layout--width-${this.width}"
|
|
1116
|
-
style="${this.Ve()}"
|
|
1117
|
-
>
|
|
1118
|
-
<slot></slot>
|
|
1119
|
-
</div>
|
|
1120
|
-
`}},t.WfLayout.styles=d`
|
|
1121
|
-
:host {
|
|
1122
|
-
display: block;
|
|
1123
|
-
}
|
|
1124
|
-
|
|
1125
|
-
:host([hidden]) {
|
|
1126
|
-
display: none;
|
|
1127
|
-
}
|
|
1128
|
-
|
|
1129
|
-
.wf-layout {
|
|
1130
|
-
box-sizing: border-box;
|
|
1131
|
-
}
|
|
1132
|
-
|
|
1133
|
-
/* Width behaviors */
|
|
1134
|
-
.wf-layout--width-full {
|
|
1135
|
-
width: 100%;
|
|
1136
|
-
}
|
|
1137
|
-
|
|
1138
|
-
.wf-layout--width-auto {
|
|
1139
|
-
width: auto;
|
|
1140
|
-
}
|
|
1141
|
-
|
|
1142
|
-
.wf-layout--width-fit {
|
|
1143
|
-
width: fit-content;
|
|
1144
|
-
}
|
|
1145
|
-
`,se([mt({type:String})],t.WfLayout.prototype,"mode",2),se([mt({type:String})],t.WfLayout.prototype,"direction",2),se([mt({type:String})],t.WfLayout.prototype,"gap",2),se([mt({type:String,attribute:"gap-x"})],t.WfLayout.prototype,"gapX",2),se([mt({type:String,attribute:"gap-y"})],t.WfLayout.prototype,"gapY",2),se([mt({type:String})],t.WfLayout.prototype,"align",2),se([mt({type:String})],t.WfLayout.prototype,"justify",2),se([mt({type:String})],t.WfLayout.prototype,"padding",2),se([mt({type:String,attribute:"padding-x"})],t.WfLayout.prototype,"paddingX",2),se([mt({type:String,attribute:"padding-y"})],t.WfLayout.prototype,"paddingY",2),se([mt({type:Boolean})],t.WfLayout.prototype,"wrap",2),se([mt({type:String})],t.WfLayout.prototype,"width",2),se([mt({type:String})],t.WfLayout.prototype,"columns",2),se([mt({type:String,attribute:"min-item-width"})],t.WfLayout.prototype,"minItemWidth",2),t.WfLayout=se([ut("wf-layout")],t.WfLayout);var re=Object.defineProperty,oe=Object.getOwnPropertyDescriptor,ae=(t,e,s,i)=>{for(var r,o=i>1?void 0:i?oe(e,s):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(i?r(e,s,o):r(o))||o);return i&&o&&re(e,s,o),o};t.WfProgress=class extends dt{constructor(){super(...arguments),this.for="",this.xt=1,this.$t=1,this.qe=!1,this.Ie=null,this.Be=this.De.bind(this),this.Fe=this.Ue.bind(this)}connectedCallback(){super.connectedCallback(),requestAnimationFrame(()=>{this.Re()})}disconnectedCallback(){super.disconnectedCallback(),this.Le()}Re(){this.for?this.Ie=document.getElementById(this.for):this.Ie=this.closest("wizard-form"),this.Ie&&(this.xt=this.Ie.currentStep||1,this.$t=this.Ie.totalSteps||1,this.qe=this.Ie.isSubmitted||!1,this.Ie.addEventListener("wf:step-change",this.Be),this.Ie.addEventListener("wf:success",this.Fe),this.Ie.addEventListener("wf:steps-discovered",this.We.bind(this)))}Le(){this.Ie&&(this.Ie.removeEventListener("wf:step-change",this.Be),this.Ie.removeEventListener("wf:success",this.Fe),this.Ie=null)}De(t){this.xt=t.detail.to,this.Ie&&(this.$t=this.Ie.totalSteps)}We(){this.Ie&&(this.$t=this.Ie.totalSteps,this.xt=this.Ie.currentStep)}Ue(){this.qe=!0}render(){if(this.qe)return null;const t=[];for(let e=1;e<=this.$t;e++){const s=e<this.xt,i=e===this.xt;t.push(Y`
|
|
237
|
+
`}},se([wt({type:String})],t.WfTextarea.prototype,"placeholder",2),se([wt({type:Number})],t.WfTextarea.prototype,"rows",2),se([wt({type:Number})],t.WfTextarea.prototype,"minlength",2),se([wt({type:Number})],t.WfTextarea.prototype,"maxlength",2),se([wt({type:Boolean})],t.WfTextarea.prototype,"disabled",2),se([wt({type:Boolean,attribute:"show-count"})],t.WfTextarea.prototype,"showCount",2),t.WfTextarea=se([ft("wf-textarea")],t.WfTextarea);const oe={init:re};var ae=Object.defineProperty,ne=Object.getOwnPropertyDescriptor,he=(t,e,i,s)=>{for(var r,o=s>1?void 0:s?ne(e,i):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(s?r(e,i,o):r(o))||o);return s&&o&&ae(e,i,o),o};t.WfProgress=class extends lt{constructor(){super(...arguments),this.for="",this.xt=1,this.$t=1,this.Ue=!1,this.Le=null,this.He=this.We.bind(this),this.Ye=this.Je.bind(this)}createRenderRoot(){return this}connectedCallback(){super.connectedCallback(),requestAnimationFrame(()=>{this.Ke(),this.Le&&this.$t<=1&&requestAnimationFrame(()=>{this.Le&&(this.$t=this.Le.totalSteps||this.$t,this.xt=this.Le.currentStep||this.xt)})})}disconnectedCallback(){super.disconnectedCallback(),this.Xe()}Ke(){this.for?this.Le=document.getElementById(this.for):this.Le=this.closest("wizard-form"),this.Le&&(this.xt=this.Le.currentStep||1,this.$t=this.Le.totalSteps||1,this.Ue=this.Le.isSubmitted||!1,this.Le.addEventListener("wf:step-change",this.He),this.Le.addEventListener("wf:success",this.Ye),this.Le.addEventListener("wf:steps-discovered",this.Ze.bind(this)))}Xe(){this.Le&&(this.Le.removeEventListener("wf:step-change",this.He),this.Le.removeEventListener("wf:success",this.Ye),this.Le=null)}We(t){this.xt=t.detail.to,this.Le&&(this.$t=this.Le.totalSteps)}Ze(){this.Le&&(this.$t=this.Le.totalSteps,this.xt=this.Le.currentStep)}Je(){this.Ue=!0}render(){if(this.Ue)return null;const t=[];for(let e=1;e<=this.$t;e++){const i=e<this.xt,s=e===this.xt;t.push(Y`
|
|
1146
238
|
<div
|
|
1147
|
-
class="wf-progress-segment ${
|
|
239
|
+
class="wf-progress-segment ${i?"completed":""} ${s?"active":""}"
|
|
1148
240
|
role="progressbar"
|
|
1149
241
|
aria-valuenow="${this.xt}"
|
|
1150
242
|
aria-valuemin="1"
|
|
1151
243
|
aria-valuemax="${this.$t}"
|
|
1152
244
|
></div>
|
|
1153
|
-
`)}return Y`<div class="wf-progress" role="group" aria-label="Form progress">${t}</div>`}},t.WfProgress.
|
|
1154
|
-
:host {
|
|
1155
|
-
display: block;
|
|
1156
|
-
}
|
|
1157
|
-
|
|
1158
|
-
:host([hidden]) {
|
|
1159
|
-
display: none;
|
|
1160
|
-
}
|
|
1161
|
-
|
|
1162
|
-
.wf-progress {
|
|
1163
|
-
display: flex;
|
|
1164
|
-
gap: var(--wf-spacing-4, 16px);
|
|
1165
|
-
}
|
|
1166
|
-
|
|
1167
|
-
.wf-progress-segment {
|
|
1168
|
-
width: 32px;
|
|
1169
|
-
height: 8px;
|
|
1170
|
-
background-color: var(--wf-color-progress-inactive, rgba(217, 217, 217, 0.6));
|
|
1171
|
-
border-radius: var(--wf-radius-full, 99px);
|
|
1172
|
-
transition: background-color 300ms ease;
|
|
1173
|
-
}
|
|
1174
|
-
|
|
1175
|
-
.wf-progress-segment.completed {
|
|
1176
|
-
background-color: var(--wf-color-progress-active, rgba(139, 139, 139, 0.6));
|
|
1177
|
-
}
|
|
1178
|
-
|
|
1179
|
-
.wf-progress-segment.active {
|
|
1180
|
-
background-color: var(--wf-color-progress-active, rgba(139, 139, 139, 0.6));
|
|
1181
|
-
}
|
|
1182
|
-
`,ae([mt({type:String})],t.WfProgress.prototype,"for",2),ae([bt()],t.WfProgress.prototype,"_currentStep",2),ae([bt()],t.WfProgress.prototype,"_totalSteps",2),ae([bt()],t.WfProgress.prototype,"_isComplete",2),t.WfProgress=ae([ut("wf-progress")],t.WfProgress);var ne=Object.defineProperty,he=Object.getOwnPropertyDescriptor,le=(t,e,s,i)=>{for(var r,o=i>1?void 0:i?he(e,s):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(i?r(e,s,o):r(o))||o);return i&&o&&ne(e,s,o),o};t.WfThankYou=class extends dt{constructor(){super(...arguments),this.title="Thank you!",this.subtitle="We've received your request.",this.hideIcon=!1}render(){return Y`
|
|
245
|
+
`)}return Y`<div class="wf-progress" role="group" aria-label="Form progress">${t}</div>`}},he([wt({type:String})],t.WfProgress.prototype,"for",2),he([bt()],t.WfProgress.prototype,"_currentStep",2),he([bt()],t.WfProgress.prototype,"_totalSteps",2),he([bt()],t.WfProgress.prototype,"_isComplete",2),t.WfProgress=he([ft("wf-progress")],t.WfProgress);var ce=Object.defineProperty,le=Object.getOwnPropertyDescriptor,de=(t,e,i,s)=>{for(var r,o=s>1?void 0:s?le(e,i):e,a=t.length-1;a>=0;a--)(r=t[a])&&(o=(s?r(e,i,o):r(o))||o);return s&&o&&ce(e,i,o),o};t.WfThankYou=class extends lt{constructor(){super(...arguments),this.title="Thank you!",this.subtitle="We've received your request.",this.hideIcon=!1}createRenderRoot(){return this}render(){return Y`
|
|
1183
246
|
${this.hideIcon?"":Y`
|
|
1184
247
|
<div class="wf-thank-you-icon">
|
|
1185
248
|
<slot name="icon">
|
|
@@ -1203,51 +266,5 @@
|
|
|
1203
266
|
<p class="wf-thank-you-subtitle">${this.subtitle}</p>
|
|
1204
267
|
<slot></slot>
|
|
1205
268
|
<slot name="footer"></slot>
|
|
1206
|
-
`}},t.WfThankYou.styles=d`
|
|
1207
|
-
:host {
|
|
1208
|
-
display: block;
|
|
1209
|
-
text-align: center;
|
|
1210
|
-
padding: var(--wf-spacing-8, 48px) var(--wf-spacing-4, 24px);
|
|
1211
|
-
}
|
|
1212
|
-
|
|
1213
|
-
:host([hidden]) {
|
|
1214
|
-
display: none;
|
|
1215
|
-
}
|
|
1216
|
-
|
|
1217
|
-
.wf-thank-you-icon {
|
|
1218
|
-
width: 72px;
|
|
1219
|
-
height: 72px;
|
|
1220
|
-
background: linear-gradient(135deg, #10b981 0%, #059669 100%);
|
|
1221
|
-
border-radius: 50%;
|
|
1222
|
-
display: flex;
|
|
1223
|
-
align-items: center;
|
|
1224
|
-
justify-content: center;
|
|
1225
|
-
margin: 0 auto var(--wf-spacing-4, 24px);
|
|
1226
|
-
box-shadow: 0 10px 25px -5px rgba(16, 185, 129, 0.4);
|
|
1227
|
-
}
|
|
1228
|
-
|
|
1229
|
-
.wf-thank-you-icon svg {
|
|
1230
|
-
width: 36px;
|
|
1231
|
-
height: 36px;
|
|
1232
|
-
color: white;
|
|
1233
|
-
}
|
|
1234
|
-
|
|
1235
|
-
.wf-thank-you-title {
|
|
1236
|
-
font-size: 28px;
|
|
1237
|
-
font-weight: 700;
|
|
1238
|
-
color: var(--wf-color-text, #1e293b);
|
|
1239
|
-
margin: 0 0 12px 0;
|
|
1240
|
-
}
|
|
1241
|
-
|
|
1242
|
-
.wf-thank-you-subtitle {
|
|
1243
|
-
font-size: 16px;
|
|
1244
|
-
color: var(--wf-color-text-muted, #64748b);
|
|
1245
|
-
margin: 0 0 24px 0;
|
|
1246
|
-
line-height: 1.6;
|
|
1247
|
-
}
|
|
1248
|
-
|
|
1249
|
-
::slotted([slot="footer"]) {
|
|
1250
|
-
margin-top: var(--wf-spacing-4, 24px);
|
|
1251
|
-
}
|
|
1252
|
-
`,le([mt({type:String})],t.WfThankYou.prototype,"title",2),le([mt({type:String})],t.WfThankYou.prototype,"subtitle",2),le([mt({type:Boolean,attribute:"hide-icon"})],t.WfThankYou.prototype,"hideIcon",2),t.WfThankYou=le([ut("wf-thank-you")],t.WfThankYou),t.DEFAULT_BLOCKED_DOMAINS=Pt,t.FormStateController=gt,t.KeyboardController=vt,t.ValidationController=Vt,t.createHubSpotAdapter=s,t.createRevenueHeroAdapter=o,t.createWebhookAdapter=i,t.default=Qt,t.getHubSpotCookie=e,t.init=Gt,t.isRevenueHeroLoaded=r,Object.defineProperties(t,{He:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
|
|
269
|
+
`}},de([wt({type:String})],t.WfThankYou.prototype,"title",2),de([wt({type:String})],t.WfThankYou.prototype,"subtitle",2),de([wt({type:Boolean,attribute:"hide-icon"})],t.WfThankYou.prototype,"hideIcon",2),t.WfThankYou=de([ft("wf-thank-you")],t.WfThankYou),function(){if("undefined"==typeof document)return;const t="wf-global-styles";if(document.getElementById(t))return;const e=document.createElement("style");e.id=t,e.textContent='wizard-form{--wf-color-primary:#8040f0;--wf-color-primary-border:#602cbb;--wf-color-primary-light:#8040f014;--wf-color-surface:#f3f3f5;--wf-color-surface-hover:#e9e9eb;--wf-color-border:#d4d4d4;--wf-color-text:#0a0a0a;--wf-color-text-secondary:#404040;--wf-color-text-muted:#646464;--wf-color-error:#dc3545;--wf-color-badge-bg:#fcfcfc;--wf-color-badge-border:#d4d4d4;--wf-color-badge-text:#5f5f5f;--wf-color-progress-active:#8b8b8b99;--wf-color-progress-inactive:#d9d9d999;--wf-spacing-1:4px;--wf-spacing-2:8px;--wf-spacing-3:12px;--wf-spacing-4:16px;--wf-spacing-5:20px;--wf-spacing-6:24px;--wf-spacing-8:32px;--wf-radius-sm:4px;--wf-radius-md:8px;--wf-radius-lg:8px;--wf-radius-full:99px;--wf-font-size-xs:.75rem;--wf-font-size-sm:.875rem;--wf-font-size-base:1rem;--wf-font-size-lg:1.25rem;--wf-font-size-xl:1.5rem;--wf-font-size-2xl:2rem;--wf-font-size-3xl:2.5rem;--wf-input-min-height:56px;--wf-glass-bg:#ffffffb3;--wf-glass-bg-hover:#ffffffd9;--wf-glass-border:#0000001a;--wf-glass-blur:20px;--wf-glass-shadow:0 4px 6px #0000000d;display:block}wizard-form[theme=dark]{--wf-color-surface:#2d2d2d;--wf-color-surface-hover:#3d3d3d;--wf-color-border:#4d4d4d;--wf-color-text:#f8f9fa;--wf-color-text-secondary:#d0d0d0;--wf-color-text-muted:#adb5bd;--wf-color-badge-bg:#3d3d3d;--wf-color-badge-border:#4d4d4d;--wf-color-badge-text:#adb5bd;--wf-color-progress-active:#c8c8c899;--wf-color-progress-inactive:#64646499;--wf-glass-bg:#2d2d2db3;--wf-glass-bg-hover:#3c3c3ccc;--wf-glass-border:#ffffff1a}@media (prefers-color-scheme:dark){wizard-form[theme=auto]{--wf-color-surface:#2d2d2d;--wf-color-surface-hover:#3d3d3d;--wf-color-border:#4d4d4d;--wf-color-text:#f8f9fa;--wf-color-text-secondary:#d0d0d0;--wf-color-text-muted:#adb5bd;--wf-color-badge-bg:#3d3d3d;--wf-color-badge-border:#4d4d4d;--wf-color-badge-text:#adb5bd;--wf-color-progress-active:#c8c8c899;--wf-color-progress-inactive:#64646499;--wf-glass-bg:#2d2d2db3;--wf-glass-bg-hover:#3c3c3ccc;--wf-glass-border:#ffffff1a}}wizard-form .wf-container{margin:0 auto}wizard-form .wf-progress{gap:var(--wf-spacing-4,16px);margin-top:var(--wf-spacing-6,24px);display:flex}wizard-form .wf-progress-segment{background-color:var(--wf-color-progress-inactive,#d9d9d999);border-radius:var(--wf-radius-full,99px);width:32px;height:8px;transition:background-color .3s}wizard-form .wf-progress-segment.completed,wizard-form .wf-progress-segment.active{background-color:var(--wf-color-progress-active,#8b8b8b99)}wizard-form .wf-steps-container{min-height:200px}wizard-form .wf-navigation{justify-content:space-between;gap:var(--wf-spacing-4,16px);margin-top:var(--wf-spacing-6,24px);display:flex}wizard-form .wf-btn{justify-content:center;align-items:center;gap:var(--wf-spacing-2,8px);padding:var(--wf-spacing-3,12px)var(--wf-spacing-4,16px);min-height:48px;font-size:var(--wf-font-size-base,1rem);border-radius:var(--wf-radius-md,8px);cursor:pointer;border:1px solid #0000;outline:none;font-family:inherit;font-weight:600;transition:all .15s;display:inline-flex}wizard-form .wf-btn:focus-visible{box-shadow:0 0 0 3px #8040f04d}wizard-form .wf-btn-back{background:var(--wf-glass-bg,#ffffffb3);-webkit-backdrop-filter:blur(var(--wf-glass-blur,20px));border:1px solid var(--wf-glass-border,#0000001a);box-shadow:var(--wf-glass-shadow,0 4px 6px #0000000d);color:var(--wf-color-text,#0a0a0a)}wizard-form .wf-btn-back:hover:not(:disabled){background:var(--wf-glass-bg-hover,#ffffffd9)}wizard-form .wf-btn-next{background-color:var(--wf-color-primary,#8040f0);border:1px solid var(--wf-color-primary-border,#602cbb);color:#fff;flex:1;margin-left:auto;position:relative}wizard-form .wf-btn-next:hover:not(:disabled){filter:brightness(1.1)}wizard-form .wf-btn:disabled{opacity:.5;cursor:not-allowed}wizard-form .wf-btn-shortcut{right:var(--wf-spacing-4,16px);align-items:center;gap:2px;display:inline-flex;position:absolute}wizard-form .wf-btn-back .wf-btn-shortcut{position:static}wizard-form .wf-success-screen{text-align:center;padding:var(--wf-spacing-6,24px)}wizard-form .wf-loading{border:2px solid #0000001a;border-top-color:#fff;border-radius:50%;width:20px;height:20px;animation:.8s linear infinite wf-spin;display:inline-block}@keyframes wf-spin{to{transform:rotate(360deg)}}wizard-form .wf-form-error{padding:var(--wf-spacing-4,16px);margin-bottom:var(--wf-spacing-4,16px);border:1px solid var(--wf-color-error,#dc3545);border-radius:var(--wf-radius-md,8px);color:var(--wf-color-error,#dc3545);font-size:var(--wf-font-size-base,1rem);background-color:#dc35451a}wf-success{display:block}wf-success h1,wf-success h2,wf-success h3{margin:0 0 var(--wf-spacing-4,16px)0;color:var(--wf-color-text,#212529);font-weight:600}wf-success p{color:var(--wf-color-text-muted,#6c757d);margin:0}wf-step{width:100%;display:none}wf-step[active]{animation:.3s forwards wf-stepFadeIn;display:block}wf-step[direction=forward][active]{animation:.3s forwards wf-stepSlideInRight}wf-step[direction=backward][active]{animation:.3s forwards wf-stepSlideInLeft}wf-step[leaving]{animation:.2s forwards wf-stepFadeOut;display:block}@keyframes wf-stepFadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes wf-stepFadeOut{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-10px)}}@keyframes wf-stepSlideInRight{0%{opacity:0;transform:translate(30px)}to{opacity:1;transform:translate(0)}}@keyframes wf-stepSlideInLeft{0%{opacity:0;transform:translate(-30px)}to{opacity:1;transform:translate(0)}}wf-step .wf-step-content{gap:var(--wf-spacing-4,16px);flex-direction:column;display:flex}wf-step h1,wf-step h2,wf-step h3{color:var(--wf-color-text,#212529);margin:0;font-weight:600}wf-step h2{font-size:var(--wf-font-size-3xl,2rem)}wf-step p{color:var(--wf-color-text-muted,#6c757d);font-size:var(--wf-font-size-xl,1.375rem);margin:0}wf-options{display:block}wf-options[hidden]{display:none}wf-options .wf-options-container{gap:var(--wf-spacing-4,16px);grid-template-columns:repeat(2,1fr);display:grid}wf-options[columns="1"] .wf-options-container{grid-template-columns:1fr}@media (width<=600px){wf-options .wf-options-container{grid-template-columns:1fr}}wf-options .wf-error-message{margin-top:var(--wf-spacing-2,8px);font-size:var(--wf-font-size-sm,.875rem);color:var(--wf-color-error,#dc3545);min-height:20px;display:block}wf-options .wf-other-container{margin-top:var(--wf-spacing-4,16px)}wf-options .wf-other-label{margin-bottom:var(--wf-spacing-2,8px);font-size:var(--wf-font-size-sm,.875rem);color:var(--wf-color-text,#0a0a0a);font-weight:500;display:block}wf-options .wf-other-label span{color:var(--wf-color-text-muted,#646464);font-weight:400}wf-options .wf-other-input-wrapper{align-items:center;gap:var(--wf-spacing-3,12px);min-height:var(--wf-input-min-height,56px);background:var(--wf-glass-bg,#ffffffb3);-webkit-backdrop-filter:blur(var(--wf-glass-blur,20px));border:1px solid var(--wf-glass-border,#0000001a);border-radius:var(--wf-radius-md,8px);box-shadow:var(--wf-glass-shadow,0 4px 6px #0000000d);padding-left:var(--wf-spacing-4,16px);transition:border-color .15s,box-shadow .15s,background .15s;display:flex}wf-options .wf-other-input-wrapper:focus-within{border-color:var(--wf-color-primary,#8040f0);box-shadow:0 0 0 3px #8040f01a}wf-options .wf-other-input{min-height:calc(var(--wf-input-min-height,56px) - 2px);padding:var(--wf-spacing-4,16px);font-size:var(--wf-font-size-base,1rem);color:var(--wf-color-text,#0a0a0a);box-sizing:border-box;background:0 0;border:none;outline:none;flex:1;padding-left:0;font-weight:500}wf-options .wf-other-input::placeholder{color:var(--wf-color-text-muted,#646464);font-weight:500}wf-option{display:block}wf-option[hidden]{display:none}wf-option .wf-option-card{align-items:center;gap:var(--wf-spacing-3,12px);width:100%;min-height:var(--wf-input-min-height,56px);padding:var(--wf-spacing-3,12px);background:var(--wf-glass-bg,#ffffffb3);-webkit-backdrop-filter:blur(var(--wf-glass-blur,20px));border:1px solid var(--wf-glass-border,#0000001a);border-radius:var(--wf-radius-md,8px);box-shadow:var(--wf-glass-shadow,0 4px 6px #0000000d);cursor:pointer;text-align:left;font-family:inherit;font-size:var(--wf-font-size-base,1rem);color:var(--wf-color-text,#0a0a0a);box-sizing:border-box;outline:none;font-weight:500;transition:border-color .15s,background .15s,transform .1s;display:flex}wf-option .wf-option-card:hover:not(:disabled){border-color:var(--wf-color-primary,#8040f0);background:var(--wf-glass-bg-hover,#ffffffd9)}wf-option .wf-option-card:focus-visible{border-color:var(--wf-color-primary,#8040f0);box-shadow:0 0 0 3px #8040f033}wf-option .wf-option-card[aria-selected=true]{border-color:var(--wf-color-primary,#8040f0);background-color:var(--wf-color-primary-light,#8040f01a)}wf-option .wf-option-card:disabled{opacity:.5;cursor:not-allowed}wf-option .wf-option-card:active:not(:disabled){transform:scale(.98)}wf-option .wf-option-card.selecting{animation:.3s wf-blink}@keyframes wf-blink{0%,to{opacity:1}50%{opacity:.5}}wf-option .wf-option-content{flex:1;min-width:0}wf-option .wf-option-content strong,wf-option .wf-option-content h3,wf-option .wf-option-content h4{margin:0;font-weight:600;display:block}wf-option .wf-option-content span,wf-option .wf-option-content p{font-size:var(--wf-font-size-sm,.875rem);color:var(--wf-color-text-muted,#646464);margin:4px 0 0;display:block}wf-progress{display:block}wf-progress[hidden]{display:none}wf-progress .wf-progress{gap:var(--wf-spacing-4,16px);display:flex}wf-progress .wf-progress-segment{background-color:var(--wf-color-progress-inactive,#d9d9d999);border-radius:var(--wf-radius-full,99px);width:32px;height:8px;transition:background-color .3s}wf-progress .wf-progress-segment.completed,wf-progress .wf-progress-segment.active{background-color:var(--wf-color-progress-active,#8b8b8b99)}wf-badge{display:inline-flex}wf-badge[hidden]{display:none}wf-badge .wf-badge{box-sizing:border-box;min-width:24px;height:24px;padding:var(--wf-spacing-1,4px)var(--wf-spacing-2,8px);font-size:var(--wf-font-size-xs,.75rem);text-transform:uppercase;flex-shrink:0;justify-content:center;align-items:center;font-family:inherit;font-weight:500;line-height:1;display:inline-flex}wf-badge .wf-badge--default{background-color:var(--wf-color-badge-bg,#fcfcfc);border:1px solid var(--wf-color-badge-border,#d4d4d4);border-radius:var(--wf-radius-sm,4px);color:var(--wf-color-badge-text,#5f5f5f)}wf-badge .wf-badge--selected{background-color:var(--wf-color-primary,#8040f0);border:1px solid var(--wf-color-primary,#8040f0);border-radius:var(--wf-radius-sm,4px);color:#fff}wf-badge .wf-badge--button{border-radius:var(--wf-radius-sm,4px);color:#ffffffa6;background-color:#0000;border:none}wf-badge .wf-badge--button-secondary{border-radius:var(--wf-radius-sm,4px);color:var(--wf-color-text-muted,#5f5f5f);background-color:#0000;border:none}wf-layout{box-sizing:border-box;display:block}wf-layout[hidden]{display:none}wf-layout.wf-layout--width-full{width:100%}wf-layout.wf-layout--width-auto{width:auto}wf-layout.wf-layout--width-fit{width:fit-content}wf-thank-you{text-align:center;padding:var(--wf-spacing-8,48px)var(--wf-spacing-4,24px);display:block}wf-thank-you[hidden]{display:none}wf-thank-you .wf-thank-you-icon{width:72px;height:72px;margin:0 auto var(--wf-spacing-4,24px);background:linear-gradient(135deg,#10b981 0%,#059669 100%);border-radius:50%;justify-content:center;align-items:center;display:flex;box-shadow:0 10px 25px -5px #10b98166}wf-thank-you .wf-thank-you-icon svg{color:#fff;width:36px;height:36px}wf-thank-you .wf-thank-you-title{color:var(--wf-color-text,#1e293b);margin:0 0 12px;font-size:28px;font-weight:700}wf-thank-you .wf-thank-you-subtitle{color:var(--wf-color-text-muted,#64748b);margin:0 0 24px;font-size:16px;line-height:1.6}wf-thank-you [slot=footer]{margin-top:var(--wf-spacing-4,24px)}wf-input,wf-email,wf-textarea,wf-field,wf-number{display:block}wf-input[hidden],wf-email[hidden],wf-textarea[hidden],wf-field[hidden],wf-number[hidden]{display:none}.wf-field-container{gap:var(--wf-spacing-2,8px);flex-direction:column;display:flex}.wf-label{font-size:var(--wf-font-size-sm,.875rem);color:var(--wf-color-text,#0a0a0a);font-weight:500}.wf-label-required:after{content:" *";color:var(--wf-color-error,#dc3545)}.wf-error-message{font-size:var(--wf-font-size-sm,.875rem);color:var(--wf-color-error,#dc3545)}.wf-hint{font-size:var(--wf-font-size-sm,.875rem);color:var(--wf-color-text-muted,#646464)}.wf-input{width:100%;min-height:var(--wf-input-min-height,56px);padding:var(--wf-spacing-4,16px);font-size:var(--wf-font-size-base,1rem);background:var(--wf-glass-bg,#ffffffb3);-webkit-backdrop-filter:blur(var(--wf-glass-blur,20px));border:1px solid var(--wf-glass-border,#0000001a);border-radius:var(--wf-radius-md,8px);box-shadow:var(--wf-glass-shadow,0 4px 6px #0000000d);color:var(--wf-color-text,#0a0a0a);box-sizing:border-box;outline:none;font-family:inherit;font-weight:400;transition:border-color .15s,box-shadow .15s,background .15s}.wf-input::placeholder{color:var(--wf-color-text-muted,#646464);font-weight:500}.wf-input:focus{border-color:var(--wf-color-primary,#8040f0);box-shadow:0 0 0 3px #8040f033}.wf-input:disabled{opacity:.5;cursor:not-allowed}.wf-input.wf-input-error{border-color:var(--wf-color-error,#dc3545)}.wf-input.wf-input-error:focus{box-shadow:0 0 0 3px #dc354533}.wf-textarea{width:100%;padding:var(--wf-spacing-4,16px);font-size:var(--wf-font-size-base,1rem);background:var(--wf-glass-bg,#ffffffb3);-webkit-backdrop-filter:blur(var(--wf-glass-blur,20px));border:1px solid var(--wf-glass-border,#0000001a);border-radius:var(--wf-radius-lg,12px);box-shadow:var(--wf-glass-shadow,0 4px 6px #0000000d);color:var(--wf-color-text,#212529);box-sizing:border-box;resize:vertical;outline:none;min-height:100px;font-family:inherit;transition:border-color .15s,box-shadow .15s,background .15s}.wf-textarea::placeholder{color:var(--wf-color-text-muted,#6c757d)}.wf-textarea:focus{border-color:var(--wf-color-primary,#8b5cf6);box-shadow:0 0 0 3px #8b5cf633}.wf-textarea:disabled{opacity:.5;cursor:not-allowed}.wf-textarea.wf-textarea-error{border-color:var(--wf-color-error,#dc3545)}.wf-textarea.wf-textarea-error:focus{box-shadow:0 0 0 3px #dc354533}.wf-char-count{font-size:var(--wf-font-size-sm,.875rem);color:var(--wf-color-text-muted,#6c757d);text-align:right}.wf-char-count.wf-char-limit{color:var(--wf-color-error,#dc3545)}wf-field .wf-input-wrapper{position:relative}wf-field .wf-input-wrapper input,wf-field .wf-input-wrapper textarea,wf-field .wf-input-wrapper select{width:100%;padding:var(--wf-spacing-4,16px);font-size:var(--wf-font-size-base,1rem);background-color:var(--wf-color-surface,#f8f9fa);border:2px solid var(--wf-color-border,#dee2e6);border-radius:var(--wf-radius-lg,12px);color:var(--wf-color-text,#212529);box-sizing:border-box;outline:none;font-family:inherit;transition:border-color .15s,box-shadow .15s}wf-field .wf-input-wrapper input::placeholder,wf-field .wf-input-wrapper textarea::placeholder{color:var(--wf-color-text-muted,#6c757d)}wf-field .wf-input-wrapper input:focus,wf-field .wf-input-wrapper textarea:focus,wf-field .wf-input-wrapper select:focus{border-color:var(--wf-color-primary,#8b5cf6);box-shadow:0 0 0 3px #8b5cf633}wf-field .wf-input-wrapper input:disabled,wf-field .wf-input-wrapper textarea:disabled,wf-field .wf-input-wrapper select:disabled{opacity:.5;cursor:not-allowed}wf-number .wf-input::-webkit-outer-spin-button,wf-number .wf-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}wf-number .wf-input[type=number]{-moz-appearance:textfield}',document.head.appendChild(e)}(),t.DEFAULT_BLOCKED_DOMAINS=Vt,t.FormStateController=mt,t.KeyboardController=gt,t.ValidationController=Bt,t.createHubSpotAdapter=i,t.createRevenueHeroAdapter=o,t.createWebhookAdapter=s,t.default=oe,t.getHubSpotCookie=e,t.init=re,t.isRevenueHeroLoaded=r,Object.defineProperties(t,{Ge:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
|
|
1253
270
|
//# sourceMappingURL=wizard-form.min.js.map
|