@ptcwebops/ptcw-design 3.0.2 → 3.0.3

package/dist/cjs/{embedded-form_9.cjs.entry.js → ptc-form-checkbox_3.cjs.entry.js}

@@ -4,686 +4,6 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-cd9a1b1a.js');
 
-const embeddedFormCss = ":host{display:block}.flex-adjustments{display:flex;justify-content:center}@media only screen and (min-width: 768px){.flex-adjustments{justify-content:flex-end}}.embedded-form-container{background-color:#142D48}.ptc-embedded-form.form-wrapper{width:433px;display:flex;border-radius:3px;background:#FFF;box-shadow:0px 2px 6px 0px rgba(0, 0, 0, 0.16);flex-direction:column;align-items:center;padding:24px 0px;justify-content:center}@keyframes rollUp{from{height:auto;opacity:1}to{height:0;opacity:0}}.ptc-form-roll-up{animation:rollUp 1s forwards;}";
-
-const EmbeddedForm = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.formData = {
-      email: '',
-      firstName: '',
-      lastName: '',
-      company: '',
-      country: '',
-      phone: '',
-      inquiryReason: '',
-      howhearselfreport: '',
-      policyChecked: false,
-    };
-    this.isSubmitted = false;
-  }
-  componentDidLoad() {
-    this.onDataLookup();
-    this.formButton = this.el.querySelector('.form-submit');
-    this.formButton.addEventListener('click', this.handleSubmit.bind(this));
-    //get Email
-    this.emailEle = this.el.querySelector('ptc-textfield[field-id="contact-email"]');
-    this.firstNameEle = this.el.querySelector('ptc-textfield[field-id="contact-firstname"]');
-    this.lastNameEle = this.el.querySelector('ptc-textfield[field-id="contact-lastname"]');
-    this.companyEle = this.el.querySelector('ptc-textfield[field-id="company"]');
-    this.phoneEle = this.el.querySelector('ptc-textfield[field-id="contact-phone"]');
-    this.countryEle = this.el.querySelector('ptc-select[field-id="contact-country"]');
-    this.inquiryreasonEle = this.el.querySelector('ptc-select[field-id="contact-inquiry"]');
-    this.howhearselfreport = this.el.querySelector('ptc-textfield[field-id="self-reporting"]');
-    this.policy1 = this.el.querySelector('ptc-form-checkbox[checkbox-id="policy1"]');
-  }
-  //handle dataLookup
-  onDataLookup() {
-    const dataLookupElement = this.el.closest('ptc-data-lookup');
-    if (dataLookupElement) {
-      console.log('Perform Data Lookup...');
-      dataLookupElement.performDataLookup();
-    }
-    else {
-      console.log('No Data Lookup...');
-    }
-  }
-  handleInputChange(field, value) {
-    this.formData = Object.assign(Object.assign({}, this.formData), { [field]: value });
-  }
-  handleSubmit(event) {
-    event.preventDefault();
-    this.formData.email = this.emailEle.inputValue;
-    this.formData.firstName = this.firstNameEle.inputValue;
-    this.formData.lastName = this.lastNameEle.inputValue;
-    this.formData.company = this.companyEle.inputValue;
-    this.formData.phone = this.phoneEle.inputValue;
-    this.formData.country = this.countryEle.selectedValue;
-    this.formData.inquiryReason = this.inquiryreasonEle.selectedValue;
-    this.formData.howhearselfreport = this.howhearselfreport.inputValue;
-    this.formData.policyChecked = this.policy1.isChecked;
-    //what if the checkbox is not required, I need to hide the checkbox in this case
-    if (this.formData.policyChecked) {
-      if (this.isValid()) {
-        const formSubmitEvent = new CustomEvent('formSubmit', {
-          detail: this.formData,
-          bubbles: true,
-        });
-        this.el.dispatchEvent(formSubmitEvent);
-        this.isSubmitted = true;
-        console.log('Form Submitted: ' + this.formData.email, this.formData.firstName, this.formData.lastName, this.formData.company, this.formData.phone, this.formData.country, this.formData.inquiryReason, this.formData.howhearselfreport, this.formData.policyChecked);
-      }
-      else {
-        console.log('Form validation failed');
-      }
-    }
-    else {
-      this.policy1.validateCheckbox();
-      console.log('Warning: Checkbox is not checked. This field is required');
-    }
-  }
-  isValid() {
-    const { email, firstName, lastName, company, country, phone, inquiryReason, howhearselfreport, policyChecked } = this.formData;
-    const invalidLength = document.querySelectorAll('.invalid-field').length;
-    // console.log('invalid fields length: ' + invalidLength), check the select field
-    return (email !== '' &&
-      phone !== '' &&
-      firstName !== '' &&
-      lastName !== '' &&
-      company !== '' &&
-      country !== '' &&
-      inquiryReason !== '' &&
-      howhearselfreport != '' &&
-      policyChecked &&
-      invalidLength === 0);
-  }
-  render() {
-    const formClass = this.isSubmitted ? "ptc-form-roll-up" : "";
-    return (index.h(index.Host, null, index.h("div", { class: "ptc-container ptc-section-standard flex-adjustments" }, index.h("div", { class: "form-wrapper ptc-embedded-form" }, index.h("max-width-container", { "max-width": "277", breakpoint: 480 }, index.h("ptc-title", { type: "h2", "text-align": "center", "title-size": "x-small", "title-color": "gray", upperline: "no-upperline", "title-display": "inline-block", "title-height": "densest", "title-margin": "margin-flush", "title-weight": "w-6", "is-plm-hub": "false" }, "Please fill out the form and a PTC sales representative will be in touch."), index.h("ptc-spacer", { breakpoint: "x-small", size: "medium" }), index.h("ptc-spacer", { breakpoint: "x-small", size: "medium" }), index.h("ptc-spacer", { breakpoint: "small", size: "small" }), index.h("ptc-spacer", { breakpoint: "small", size: "small" })), index.h("form", { onSubmit: event => this.handleSubmit(event), class: formClass }, index.h("div", { id: "not-me-link-id" }), index.h("div", { id: "not-me-additional-top", class: "not-me-additional-text" }), index.h("ptc-textfield", { "field-id": "contact-firstname", "label-text": "First Name*", type: "text", "ptc-data-eloqua-name": "C_FirstName", name: "firstname" }), index.h("ptc-textfield", { "field-id": "contact-lastname", "label-text": "Last Name*", type: "text", "ptc-data-eloqua-name": "C_LastName", name: "lastname" }), index.h("ptc-textfield", { "field-id": "company", "label-text": "Company*", type: "text", "ptc-data-eloqua-name": "C_Company", name: "company-field" }), index.h("ptc-textfield", { "field-id": "contact-email", "label-text": "Email*", type: "email", "ptc-data-eloqua-name": "C_EmailAddress", name: "email" }), index.h("ptc-select", { "field-id": "contact-country", label: "Country*", "ptc-data-eloqua-name": "C_Country", name: "country" }, index.h("ul", { class: "mdc-list" }, index.h("li", { class: "mdc-list-item", "data-value": "" }, index.h("span", { class: "mdc-list-item__ripple" })), index.h("li", { class: "mdc-list-item", "data-value": "USA" }, index.h("span", { class: "mdc-list-item__ripple" }), index.h("span", { class: "mdc-list-item__text" }, "USA")), index.h("li", { class: "mdc-list-item", "data-value": "Canada" }, index.h("span", { class: "mdc-list-item__ripple" }), index.h("span", { class: "mdc-list-item__text" }, "Canada")), index.h("li", { class: "mdc-list-item", "data-value": "China" }, index.h("span", { class: "mdc-list-item__ripple" }), index.h("span", { class: "mdc-list-item__text" }, "China")))), index.h("ptc-textfield", { "field-id": "contact-phone", "label-text": "Phone*", type: "tel", "ptc-data-eloqua-name": "C_BusPhone", name: "phone" }), index.h("ptc-select", { label: "What information are you interested in?*", "ptc-data-eloqua-name": "Inquiry_Reason", name: "inquiryreason", "field-id": "contact-inquiry" }, index.h("ul", { class: "mdc-list" }, index.h("li", { class: "mdc-list-item", "data-value": "" }, index.h("span", { class: "mdc-list-item__ripple" })), index.h("li", { class: "mdc-list-item", "data-value": "Augmented Reality (AR)" }, index.h("span", { class: "mdc-list-item__ripple" }), index.h("span", { class: "mdc-list-item__text" }, "Augmented Reality (AR)")), index.h("li", { class: "mdc-list-item", "data-value": "CAD" }, index.h("span", { class: "mdc-list-item__ripple" }), index.h("span", { class: "mdc-list-item__text" }, "Computer Aided Design")), index.h("li", { class: "mdc-list-item", "data-value": "Retail(FlexPLM)" }, index.h("span", { class: "mdc-list-item__ripple" }), index.h("span", { class: "mdc-list-item__text" }, "Fashion and Retail Product Lifecycle Management")))), index.h("ptc-textfield", { "field-id": "self-reporting", "label-text": "How can we help you?*", type: "text", "ptc-data-eloqua-name": "HowHearSelfReport", "ptc-max-length": "100", name: "howhearselfreport" }), index.h("ptc-textfield", { type: "hidden", "ptc-data-eloqua-name": "test", "input-value": "test" }), index.h("ptc-form-checkbox", { label: "I agree to the policy", "checkbox-id": "policy1" }), index.h("div", { id: "not-me-additional-bottom", class: "not-me-additional-text" }), index.h("ptc-button", { class: "form-submit", color: "ptc-quaternary", type: "submit", styles: ":host{align-self:flex-end; margin-top: 40px; display:block; text-align:right;}" }, "Submit"))))));
-  }
-  get el() { return index.getElement(this); }
-};
-EmbeddedForm.style = embeddedFormCss;
-
-const maxWidthContainerCss = ":host{display:block}:host(.left){margin:auto auto auto 0}:host(.right){margin:auto 0 auto auto}:host(.center){margin:0 auto}";
-
-const MaxWidthContainer = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.maxWidthP = undefined;
-    this.maxWidth = undefined;
-    this.breakpoint = 768;
-    this.contentAlign = 'center';
-    this.styles = undefined;
-  }
-  componentDidLoad() {
-    this.handleResize();
-    window.addEventListener('resize', this.handleResize.bind(this));
-  }
-  disconnectedCallback() {
-    window.removeEventListener('resize', this.handleResize);
-  }
-  render() {
-    const classMap = this.getCssClassMap();
-    return (index.h(index.Host, { class: classMap }, this.styles && index.h("style", null, this.styles), index.h("slot", null)));
-  }
-  getCssClassMap() {
-    return {
-      [this.contentAlign]: true,
-    };
-  }
-  handleResize() {
-    // const selectedContainer = this.el.querySelector('.max-width-container');
-    if (this.el) {
-      if (window.innerWidth >= this.breakpoint) {
-        if (this.maxWidthP) {
-          this.el.style.maxWidth = `${this.maxWidthP}%`;
-        }
-        else {
-          this.el.style.maxWidth = `${this.maxWidth}px`;
-        }
-      }
-      else {
-        this.el.style.maxWidth = 'initial';
-      }
-    }
-  }
-  get el() { return index.getElement(this); }
-};
-MaxWidthContainer.style = maxWidthContainerCss;
-
-const ptcButtonCss = "button.disabled{pointer-events:none;opacity:0.6}button{background-color:var(--color-gray-10);display:inline-block;border-style:solid;border-width:1px;white-space:normal;position:relative;text-decoration:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;cursor:pointer;padding:9.4px 17.5px;border-radius:var(--ptc-border-radius-standard)}button.reveal-down .content{transition:opacity var(--ptc-transition-medium) var(--ptc-ease-out);opacity:0;font-size:var(--ptc-font-size-xx-small)}button.reveal-down .icon-wrapper{position:relative;display:flex;align-items:center;justify-content:center;align-content:center;height:16px}button.reveal-down .icon-wrapper .icon{transition:top var(--ptc-transition-fast) var(--ptc-ease-out);position:absolute;display:inline-block;top:-12px}button:hover.reveal-down .content{opacity:1}button:hover.reveal-down .icon-wrapper .icon{top:4px}button.animation-right ::slotted([slot=slot-after-text]),button.animation-right ::slotted([slot=slot-before-text]),button.animation-down ::slotted([slot=slot-after-text]),button.animation-down ::slotted([slot=slot-before-text]){transition:transform var(--ptc-transition-medium) var(--ptc-ease-inout);position:relative;display:inline-block}button:hover.animation-right ::slotted([slot=slot-after-text]),button:hover.animation-right ::slotted([slot=slot-before-text]){transform:translateX(var(--ptc-element-spacing-02))}button:hover.animation-down ::slotted([slot=slot-after-text]),button:hover.animation-down ::slotted([slot=slot-before-text]){transform:translateY(var(--ptc-element-spacing-02))}button span{font-family:var(--ptc-font-latin);font-size:var(--ptc-font-size-small);font-weight:bold;line-height:var(--ptc-line-height-densest)}button.left{text-align:left}button.right{text-align:right}button.center{text-align:center}.icon-left ::slotted([slot=slot-before-text]){margin-right:var(--ptc-element-spacing-01)}.icon-right ::slotted([slot=slot-after-text]){margin-left:var(--ptc-element-spacing-01)}.blackgrey{box-shadow:var(--ptc-shadow-x-small);border:solid 1px var(--color-gray-10);background-image:linear-gradient(285deg, var(--color-gray-10) 155%, var(--color-gray-07) 62%)}.blackgrey:hover{box-shadow:var(--ptc-shadow-x-large)}.blackgrey span{color:var(--color-white)}.turtlegreen{box-shadow:var(--ptc-shadow-x-small);border:solid 1px var(--color-green-07);background-image:linear-gradient(285deg, var(--color-green-07) 155%, var(--color-green-07) 62%)}.turtlegreen:hover{box-shadow:var(--ptc-shadow-x-large)}.turtlegreen span{color:var(--color-white)}.offwhite{box-shadow:var(--ptc-shadow-x-small);border:solid 1px var(--color-gray-10);background-image:linear-gradient(to right, var(--color-white), var(--color-gray-02), var(--color-gray-01))}.offwhite:hover{box-shadow:var(--ptc-shadow-x-large)}.offwhite span{color:var(--color-gray-10)}.legacy-green{margin-left:10px;padding:10px 20px;margin-bottom:var(--ptc-element-spacing-01);margin-top:var(--ptc-element-spacing-01);box-shadow:var(--ptc-shadow-large);border:solid 2.5px var(--color-green-08);background-image:linear-gradient(to right, var(--color-green-06), var(--color-green-08))}.legacy-green:after{position:absolute;content:\"\";top:-1px;left:0;bottom:0;right:0;width:100%;height:103%;background-image:linear-gradient(to right, var(--color-green-08), var(--color-green-06));opacity:0;transition:opacity var(--ptc-transition-x-slow) var(--ptc-ease-inout);border-radius:2px}.legacy-green:hover{box-shadow:var(--ptc-shadow-x-large)}.legacy-green:hover span{color:var(--color-white)}.legacy-green:hover:after{opacity:1}.legacy-green span{font-family:var(--ptc-font-secondary-latin);color:var(--color-white);z-index:100;position:relative;text-transform:uppercase;font-weight:var(--ptc-font-weight-bold);letter-spacing:var(--ptc-letter-spacing-normal);font-size:var(--ptc-font-size-x-small)}@media only screen and (min-width: 768px){.legacy-green span{font-size:var(--ptc-font-size-small);letter-spacing:var(--ptc-letter-spacing-loose)}}.legacy-green icon-asset{display:inline}a{border-style:solid;border-width:1px;position:relative;text-decoration:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;padding:9.4px 17.5px;border-radius:var(--ptc-border-radius-standard);display:inline-block;position:relative}a.animation-right ::slotted([slot=slot-after-text]),a.animation-right ::slotted([slot=slot-before-text]),a.animation-down ::slotted([slot=slot-after-text]),a.animation-down ::slotted([slot=slot-before-text]){transition:all var(--ptc-ease-inout) var(--ptc-transition-medium);position:relative;display:inline-block;margin-left:5px}a:hover.animation-right ::slotted([slot=slot-after-text]),a:hover.animation-right ::slotted([slot=slot-before-text]){transform:translateX(var(--ptc-element-spacing-02))}a:hover.animation-down ::slotted([slot=slot-after-text]),a:hover.animation-down ::slotted([slot=slot-before-text]){transform:translateY(var(--ptc-element-spacing-02))}a.left{text-align:left}a.right{text-align:right}a.center{text-align:center}.nav{font-family:var(--ptc-font-latin);background-color:var(--color-gray-10);border-radius:var(--ptc-border-radius-standard);border:1px solid var(--color-white);border-bottom-style:solid;border-bottom-width:1px;box-sizing:border-box;color:var(--color-white);display:inline-block;font-size:var(--ptc-font-size-xx-small);font-stretch:100%;font-weight:var(--ptc-font-weight-bold);line-height:var(--ptc-line-height-loose);list-style:none;padding:3px var(--ptc-element-spacing-04);position:relative;text-align:center;text-decoration:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;transition:background-color var(--ptc-transition-medium) var(--ptc-ease-inout)}.nav:focus{outline:3px solid var(--color-blue-07);outline-offset:2px}.nav:hover{background-color:var(--color-gray-12)}.ptc-primary,.ptc-quaternary,.ptc-secondary,.ptc-tertiary,.icon-toggle{padding:var(--ptc-font-size-xx-small) var(--ptc-font-size-medium);transition:background-color var(--ptc-ease-inout) var(--ptc-transition-medium);line-height:20px}.ptc-primary.disabled,.ptc-quaternary.disabled,.ptc-secondary.disabled,.ptc-tertiary.disabled,.icon-toggle.disabled{pointer-events:none;border-color:var(--color-gray-03);background:var(--color-gray-02)}.ptc-primary.disabled span,.ptc-quaternary.disabled span,.ptc-secondary.disabled span,.ptc-tertiary.disabled span,.icon-toggle.disabled span{color:var(--color-gray-03)}.ptc-primary.disabled ::slotted([slot=slot-after-text]),.ptc-quaternary.disabled ::slotted([slot=slot-after-text]),.ptc-secondary.disabled ::slotted([slot=slot-after-text]),.ptc-tertiary.disabled ::slotted([slot=slot-after-text]),.icon-toggle.disabled ::slotted([slot=slot-after-text]){fill:var(--color-gray-03) !important}.ptc-primary:focus,.ptc-quaternary:focus,.ptc-secondary:focus,.ptc-tertiary:focus,.icon-toggle:focus{outline:3px solid var(--color-blue-07);outline-offset:2px}.ptc-primary span,.ptc-quaternary span,.ptc-secondary span,.ptc-tertiary span,.icon-toggle span{font-family:var(--ptc-font-latin);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-densest);letter-spacing:normal}.ptc-primary{background:var(--color-gray-12);border:2px solid var(--color-green-07);border-radius:var(--ptc-border-radius-standard)}.ptc-primary:hover{background-color:var(--color-gray-10)}.ptc-primary:active{background-color:var(--color-black)}.ptc-primary span{color:var(--color-white)}.ptc-primary ::slotted([slot=slot-after-text]){fill:var(--color-white) !important}.ptc-secondary{background:var(--color-gray-12);border:2px solid var(--color-gray-08);border-radius:var(--ptc-border-radius-standard)}.ptc-secondary:hover{background-color:var(--color-gray-10)}.ptc-secondary:active{background-color:var(--color-black)}.ptc-secondary span{color:var(--color-white)}.ptc-secondary ::slotted([slot=slot-after-text]){fill:var(--color-white) !important}.ptc-tertiary{background:var(--color-white);border:2px solid var(--color-gray-10);border-radius:var(--ptc-border-radius-standard)}.ptc-tertiary:hover{background-color:var(--color-gray-02)}.ptc-tertiary:active{background-color:var(--color-gray-03)}.ptc-tertiary span{color:var(--color-gray-10)}.ptc-tertiary ::slotted([slot=slot-after-text]){fill:var(--color-gray-10) !important}.ptc-quaternary{background:var(--color-green-07);border:2px solid var(--color-green-07);border-radius:var(--ptc-border-radius-standard)}.ptc-quaternary:hover{background-color:var(--color-green-08)}.ptc-quaternary:active{background-color:var(--color-green-09)}.ptc-quaternary span{color:var(--color-white)}.ptc-quaternary ::slotted([slot=slot-after-text]){fill:var(--color-white) !important}.icon-toggle{background:var(--color-white);border:1px solid var(--color-gray-10);border-radius:var(--ptc-border-radius-standard);padding:0;height:2.125rem;width:2.125rem;box-shadow:var(--ptc-shadow-medium)}.icon-toggle:hover{background-color:var(--color-gray-02)}.icon-toggle:active{background-color:var(--color-gray-03)}.icon-toggle.active{background-color:var(--color-gray-04)}.icon-toggle.active:hover{background-color:var(--color-gray-05)}.icon-toggle.active:active{background-color:var(--color-gray-03)}.icon-toggle:focus{outline:2px solid var(--color-blue-07);outline-offset:1px}.icon-toggle span{color:var(--color-gray-10);padding:0}.icon-toggle ::slotted([slot=slot-after-text]){fill:var(--color-gray-10) !important}.icon-toggle ::slotted(icon-asset){display:block;margin:auto;height:18px;width:18px}.clear-search{border:none;padding:0px;line-height:var(----ptc-line-height-densest);background-color:transparent}.clear-search:hover{text-decoration:underline;text-decoration-color:var(--color-white)}.clear-search span{color:var(--color-white);font-weight:var(--ptc-font-weight-semibold);font-size:var(--ptc-font-size-x-small);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}";
-
-const PtcButton = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.clickEvent = index.createEvent(this, "clickEvent", 7);
-    this.disabled = false;
-    this.active = false;
-    this.type = 'button';
-    this.color = 'ptc-primary';
-    this.iconAnimation = '';
-    this.iconPosition = 'icon-right';
-    this.linkHref = undefined;
-    this.linkTitle = undefined;
-    this.target = '_self';
-    this.rel = undefined;
-    this.tabNav = 0;
-    this.styles = undefined;
-    this.textAlign = undefined;
-  }
-  clickEventHandler() {
-    this.clickEvent.emit();
-  }
-  render() {
-    const classMap = this.getCssClassMap();
-    const Tag = !!this.linkHref ? 'a' : 'button';
-    return (index.h(index.Host, null, this.styles && index.h("style", null, this.styles), index.h(Tag, Object.assign({ class: classMap, onClick: this.clickEventHandler.bind(this) }, (!!this.linkHref ? { href: this.linkHref } : {}), (!this.linkHref ? { type: this.type } : {}), (!!this.target && !!this.linkHref ? { target: this.target } : {}), (!!this.rel && !!this.linkHref ? { rel: this.rel } : {}), (!!this.linkHref ? { title: this.linkTitle ? this.linkTitle : this.linkHref } : {}), (!!this.tabNav ? { tabindex: -1 } : { tabindex: 0 })), this.iconAnimation == 'reveal-down' ?
-      index.h("span", null, index.h("div", { class: "content" }, index.h("slot", null)), index.h("div", { class: "icon-wrapper" }, index.h("div", { class: "icon" }, index.h("slot", { name: "slot-after-text" })))) :
-      index.h("span", null, index.h("slot", { name: "slot-before-text" }), index.h("slot", null), index.h("slot", { name: "slot-after-text" })))));
-  }
-  getCssClassMap() {
-    return {
-      [this.color]: true,
-      [this.iconAnimation]: true,
-      [this.iconPosition]: true,
-      ['disabled']: this.disabled ? true : false,
-      ['active']: this.active ? true : false,
-      [this.textAlign]: true
-    };
-  }
-};
-PtcButton.style = ptcButtonCss;
-
-// Define the ElqLib class
-class ElqLib {
-  constructor(params) {
-    this.params = params;
-    this.url_vars = {};
-    this.visitor_elq_id = null;
-    this.field_mappings = [];
-    this.callback_queue = [];
-    this.fields_populated = false;
-    this.user_elq_email = '';
-    this.user_elq_firstname = '';
-    this.user_elq_lastname = '';
-    // Merge defaults with params
-    const defaults = {
-      elq_site_id: '',
-      elq_visitor_lookup_key: '',
-      elq_recipient_id_lookup_key: '',
-      elq_contact_lookup_key: '',
-      elq_field_email_rec_id: 'V_EmailRecipientID',
-      elq_field_contact_email: 'C_EmailAddress',
-      elq_field_visitor_email: 'V_Email_Address',
-      elq_field_visitor_firstname: 'V_First_Name',
-      elq_field_visitor_lastname: 'V_Last_Name',
-      notme_link_id: 'not-me-link-id',
-      notme_fields_class: null,
-      notme_message: 'Not {name}? Click here.',
-      notme_message_noname: 'Not your details below? Click here.',
-    };
-    this.params = Object.assign(Object.assign({}, defaults), this.params);
-    this.init();
-  }
-  init() {
-    // Merge defaults with user-provided params if not already done in the constructor
-    // ...
-    // Set Eloqua site ID
-    this.setEloquaSiteId();
-    // Load Eloqua scripts
-    this.async_load();
-    // Store URL variables
-    this.store_url_vars();
-    // Store visitor's Eloqua IDgit
-    this.store_visitor_elq_id();
-    // init noteme link;
-    this.init_notme();
-    // Set the global Eloqua callback function
-    window.SetElqContent = this.eloqua_callback.bind(this);
-  }
-  setEloquaSiteId() {
-    if (this.params.elq_site_id) {
-      ElqLib._elqQ.push(['elqSetSiteId', this.params.elq_site_id]);
-      ElqLib._elqQ.push(['elqUseFirstPartyCookie', 'tracking.ptc.com']);
-      ElqLib._elqQ.push(['elqTrackPageView', window.location.href]);
-    }
-  }
-  fire_pageview(url) {
-    try {
-      if (typeof url === 'undefined') {
-        ElqLib._elqQ.push(['elqTrackPageView']);
-      }
-      else {
-        ElqLib._elqQ.push(['elqTrackPageView', url]);
-      }
-      console.log('TRACKING: Eloqua pageview fired for URL: ' + (url || 'current page'));
-    }
-    catch (e) {
-      console.log('TRACKING: Could not fire Eloqua pageview: ', e);
-    }
-  }
-  find_eloqua_contact() {
-    console.log('CONTACT LOOKUP: Attempting to find Eloqua contact...');
-    // Queue callback action for the return of lookup
-    this.callback_queue.push(this.handle_visitor_lookup.bind(this));
-    // Start with a recipient lookup if ID was supplied in URL
-    if (this.visitor_elq_id !== null) {
-      this.lookup_visitor_by_recipient_id();
-    }
-    else {
-      // If no visitor ID, attempt to do a visitor lookup with an Eloqua cookie
-      this.lookup_visitor_by_cookie(); //preference center
-      this.lookup_contact_by_email();
-    }
-  }
-  add_field_mapping(mapping) {
-    this.field_mappings.push(mapping);
-  }
-  add_queue_action(action) {
-    this.callback_queue.push(action);
-  }
-  store_url_vars() {
-    // Clear the current url_vars
-    this.url_vars = {};
-    // Split the URL by the '?' to get the query string part
-    const queryString = window.location.search.substring(1);
-    // Split the query string by '&' to get each key-value pair
-    queryString.split('&').forEach(paramString => {
-      // Split the key-value pairs by '=' to separate keys and values
-      let [key, value] = paramString.split('=');
-      // Decode URI components to handle URL encoding
-      key = decodeURIComponent(key);
-      value = decodeURIComponent(value);
-      // Store the key-value pair in the url_vars object
-      this.url_vars[key] = value;
-    });
-    // Optionally, log the stored URL variables
-    console.log('URL variables stored:', this.url_vars);
-  }
-  store_visitor_elq_id() {
-    console.log("INIT: Looking for visitor's Eloqua ID in URL...");
-    const elqIdParam = this.url_vars['elq'];
-    if (elqIdParam) {
-      const elqId = elqIdParam.toUpperCase().replace(/(.{8})(.{4})(.{4})(.{4})(.{12})/, '$1-$2-$3-$4-$5');
-      this.visitor_elq_id = elqId;
-      console.log(`INIT: ...visitor Eloqua ID found in URL: ${elqId}`);
-    }
-    else {
-      this.visitor_elq_id = null;
-      console.log('INIT: ...no visitor Eloqua ID found in URL');
-    }
-  }
-  //   private merge(root: any, ...sources: any[]): any {
-  //     sources.forEach(source => {
-  //       for (const key in source) {
-  //         if (source.hasOwnProperty(key)) {
-  //           root[key] = source[key];
-  //         }
-  //       }
-  //     });
-  //     return root;
-  //   }
-  eloqua_callback() {
-    console.log('LOOKUP: Eloqua lookup finished');
-    // Process each action in the callback queue
-    let actionSucceeded = true;
-    while (actionSucceeded && this.callback_queue.length > 0) {
-      const action = this.callback_queue.shift();
-      if (action) {
-        console.log(`QUEUE: Executing action`);
-        actionSucceeded = action(); // Execute the action. It must return a boolean indicating success.
-        if (actionSucceeded) {
-          console.log('QUEUE: Action executed successfully, removed from queue');
-        }
-        else {
-          console.log('QUEUE: Action failed, re-adding to queue');
-          this.callback_queue.unshift(action); // Re-add the action to the front of the queue
-          break; // Break out of the loop if an action fails
-        }
-      }
-    }
-    // After processing the queue, update user details or perform other operations
-    if (actionSucceeded) {
-      this.update_user_details();
-      this.populate_mapped_fields();
-    }
-    // ...additional code to handle the aftermath of callback processing...
-  }
-  lookup_visitor_by_cookie() {
-    if (this.params.elq_visitor_lookup_key != '') {
-      ElqLib._elqQ.push(['elqDataLookup', escape(this.params.elq_visitor_lookup_key), '']);
-      console.log('LOOKUP: Visitor lookup sent using Eloqua cookie');
-    }
-    else {
-      console.log('LOOKUP: A visitor lookup cannot be performed as no lookup key was defined');
-    }
-  }
-  lookup_visitor_by_recipient_id() {
-    if (this.params.elq_recipient_id_lookup_key != '') {
-      ElqLib._elqQ.push([
-        'elqDataLookup',
-        escape(this.params.elq_recipient_id_lookup_key),
-        '<' + this.params.elq_field_email_rec_id + '>' + this.visitor_elq_id + '</' + this.params.elq_field_email_rec_id + '>',
-      ]);
-      console.log('LOOKUP: Visitor lookup sent using email recipient id: ' + this.visitor_elq_id);
-    }
-    else {
-      console.log('LOOKUP: A visitor lookup cannot be performed as no lookup key was defined');
-    }
-  }
-  lookup_contact_by_email() {
-    if (this.params.elq_contact_lookup_key != '') {
-      ElqLib._elqQ.push([
-        'elqDataLookup',
-        escape(this.params.elq_contact_lookup_key),
-        '<' + this.params.elq_field_contact_email + '>' + this.user_elq_email + '</' + this.params.elq_field_contact_email + '>',
-      ]);
-      console.log('LOOKUP: Contact lookup sent using email address: ' + this.user_elq_email);
-    }
-    else {
-      console.log('LOOKUP: A visitor lookup cannot be performed as no lookup key was defined');
-    }
-  }
-  handle_visitor_lookup() {
-    //console.log('Contact Email: ' + this.params.elq_field_contact_email)
-    const email = window.GetElqContentPersonalizationValue(this.params.elq_field_contact_email); //it was elq_field_visitor_email ( V_Email_Address)
-    if (email) {
-      console.log(`LOOKUP: Found contact email address: ${email}`);
-      this.user_elq_email = email.trim();
-      this.lookup_contact_by_email();
-      this.callback_queue.push(this.handle_contact_lookup.bind(this));
-      return true;
-    }
-    else {
-      return false;
-    }
-  }
-  handle_contact_lookup() {
-    if (window.GetElqContentPersonalizationValue(this.params.elq_field_contact_email) != '') {
-      console.log('LOOKUP: Found contact email address: ' + window.GetElqContentPersonalizationValue(this.params.elq_field_contact_email));
-      return true;
-    }
-    else {
-      return false;
-    }
-  }
-  populate_mapped_fields() {
-    console.log('MAPPING: Starting field mapping');
-    //debugger;
-    this.field_mappings.forEach(({ elementId, elqFieldName }) => {
-      const fieldValue = window.GetElqContentPersonalizationValue(elqFieldName);
-      if (elementId !== 'contact-country') {
-        const element = document.getElementById(elementId);
-        console.log('element ID of field mappings: ' + element);
-        console.log('fieldValue ID of field mappings: ' + fieldValue);
-        if (element && fieldValue) {
-          element.value = fieldValue;
-          //element.style.display = 'none'; // Hide the field.
-          if (element.closest('ptc-textfield')) {
-            element.closest('ptc-textfield').style.display = 'none';
-          }
-          else if (element.closest('ptc-select')) {
-            element.closest('ptc-select').style.display = 'none';
-          }
-          this.fields_populated = true;
-        }
-      }
-      else {
-        const countryEle = document.getElementById(elementId);
-        if (countryEle && fieldValue) {
-          countryEle.textContent = fieldValue;
-        }
-        // debugger;
-        if (countryEle.closest('ptc-select')) {
-          countryEle.closest('ptc-select').style.display = 'none';
-        }
-      }
-    });
-    console.log('MAPPING: Finished ');
-    if (this.fields_populated) {
-      this.update_notme_link();
-    }
-  }
-  update_user_details() {
-    console.log('displaying user info...');
-    if (window.GetElqContentPersonalizationValue(this.params.elq_field_contact_email) !== '') {
-      document
-        .querySelectorAll('input[type=text], input[type=tel], input[name="phonenumber"], input[name="phonenumbertwo"], input[type=email], select, textarea, span.mdc-select__selected-text')
-        .forEach((element) => {
-        if (element.tagName === 'SPAN') {
-          const spanText = element;
-          const spanEloquaName = spanText.getAttribute('data-eloqua-name');
-          if (spanEloquaName !== null) {
-            const spanElqValue = window.GetElqContentPersonalizationValue(spanEloquaName);
-            if (spanElqValue !== '' && spanElqValue.length > 0) {
-              spanText.textContent = spanElqValue;
-            }
-          }
-        }
-        else if (element.className.includes('intl-tel-input')) {
-          const telInput = element;
-          const eloquaName = telInput.getAttribute('data-eloqua-name');
-          if (eloquaName !== null) {
-            const elqValue = window.GetElqContentPersonalizationValue(eloquaName);
-            if (elqValue !== '' && elqValue.length > 0) {
-              setTimeout(() => {
-                telInput.placeholder = elqValue;
-              }, 1000);
-            }
-          }
-        }
-        else {
-          const input = element;
-          const eloquaName = input.getAttribute('data-eloqua-name');
-          if (eloquaName !== null) {
-            const elqValue = window.GetElqContentPersonalizationValue(eloquaName);
-            if (elqValue !== '' && elqValue.length > 0) {
-              input.value = elqValue;
-            }
-          }
-        }
-      });
-    }
-    if (this.user_elq_email == '' && window.GetElqContentPersonalizationValue(this.params.elq_field_visitor_email) != '') {
-      this.user_elq_email = window.GetElqContentPersonalizationValue(this.params.elq_field_visitor_email);
-    }
-    if (this.user_elq_firstname == '' && window.GetElqContentPersonalizationValue(this.params.elq_field_visitor_firstname) != '') {
-      this.user_elq_firstname = window.GetElqContentPersonalizationValue(this.params.elq_field_visitor_firstname);
-    }
-    if (this.user_elq_lastname == '' && window.GetElqContentPersonalizationValue(this.params.elq_field_visitor_lastname) != '') {
-      this.user_elq_lastname = window.GetElqContentPersonalizationValue(this.params.elq_field_visitor_lastname);
-    }
-  }
-  update_notme_link() {
-    // Assuming the user's first and last name are available from Eloqua fields
-    const firstName = window.GetElqContentPersonalizationValue(this.params.elq_field_visitor_firstname);
-    const lastName = window.GetElqContentPersonalizationValue(this.params.elq_field_visitor_lastname);
-    const notMeLinkElement = document.getElementById(this.params.notme_link_id);
-    const topAdditional = document.getElementById('not-me-additional-top');
-    const bottomAdditional = document.getElementById('not-me-additional-bottom');
-    if (notMeLinkElement) {
-      let message = this.params.notme_message;
-      console.log('first name: ' + firstName);
-      if (firstName && lastName) {
-        message = this.params.notme_message.replace('{name}', lastName + ' ' + firstName);
-      }
-      notMeLinkElement.innerHTML = `<a href="#">${message}</a>`;
-      topAdditional.innerHTML = "Please fill out additional information.";
-      bottomAdditional.innerHTML = "Click the button below to recieve email confirmation.";
-      topAdditional.style.display = 'block';
-      bottomAdditional.style.display = 'block';
-      notMeLinkElement.onclick = this.remove_user_details.bind(this);
-    }
-  }
-  init_notme() {
-    const topAdditional = document.getElementById('not-me-additional-top');
-    const bottomAdditional = document.getElementById('not-me-additional-bottom');
-    if (topAdditional)
-      topAdditional.style.display = 'none';
-    if (bottomAdditional)
-      bottomAdditional.style.display = 'none';
-  }
-  remove_user_details(e) {
-    e.preventDefault();
-    this.user_elq_email = '';
-    this.user_elq_firstname = '';
-    this.user_elq_lastname = '';
-    // $('.' + this.params.notme_fields_class).val('');
-    const linkDiv = document.getElementById(this.params.notme_link_id);
-    const topAdditional = document.getElementById('not-me-additional-top');
-    const bottomAdditional = document.getElementById('not-me-additional-bottom');
-    linkDiv.querySelector('a').remove();
-    topAdditional.style.display = 'none';
-    bottomAdditional.style.display = 'none';
-    this.refreshForm();
-    return false;
-  }
-  refreshForm() {
-    this.field_mappings.forEach(({ elementId }) => {
-      if (elementId !== 'contact-country') {
-        const element = document.getElementById(elementId);
-        if (element) {
-          console.log('element: ' + element);
-          element.value = ''; // Reset the value
-          if (element.closest('ptc-textfield')) {
-            element.closest('ptc-textfield').style.display = '';
-          }
-          else if (element.closest('ptc-select')) {
-            element.closest('ptc-select').style.display = '';
-          }
-        }
-      }
-      else {
-        const countryEle = document.getElementById(elementId);
-        if (countryEle) {
-          countryEle.textContent = '';
-        }
-        // debugger;
-        if (countryEle.closest('ptc-select')) {
-          countryEle.closest('ptc-select').style.display = '';
-        }
-      }
-    });
-    this.clearEloquaCookie('elq-uid'); // Optionally clear the Eloqua cookie
-    this.fields_populated = false;
-    //this.update_notme_link(); // Update the 'Not Me' link if necessary
-  }
-  clearEloquaCookie(name) {
-    document.cookie = name + '=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;';
-    console.log('cookie cleared');
-  }
-  // Private Method to load Eloqua Scripts
-  async_load() {
-    const scriptUrl = 'https://img.en25.com/i/elqCfg.min.js';
-    const scriptElement = document.createElement('script');
-    scriptElement.type = 'text/javascript';
-    scriptElement.async = true;
-    scriptElement.src = scriptUrl;
-    // Error handling for script loading
-    scriptElement.onerror = errorEvent => {
-      console.log(`Error loading script: ${errorEvent}`);
-    };
-    // Append the script element to the head of the document, or before the first script tag found
-    const firstScriptTag = document.getElementsByTagName('script')[0];
-    if (firstScriptTag && firstScriptTag.parentNode) {
-      firstScriptTag.parentNode.insertBefore(scriptElement, firstScriptTag);
-    }
-    else {
-      document.head.appendChild(scriptElement);
-    }
-    console.log(`Async loading of script ${scriptUrl} initiated.`);
-  }
-}
-ElqLib._elqQ = window['_elqQ'] || [];
-// Static member initialization
-//ElqLib._elqQ = window['_elqQ'] || [];
-
-const ptcDataLookupCss = ":host{display:block}#not-me-link-id{color:var(--color-gray-10);font-family:var(--ptc-font-latin);font-size:var(--ptc-font-size-medium);font-style:normal;font-weight:var(--ptc-font-weight-bold);line-height:normal;margin-bottom:var(--ptc-element-spacing-03);position:relative}#not-me-link-id a{color:var(--color-blue-07);font-family:var(--ptc-font-latin);font-size:var(--ptc-font-size-medium);font-style:normal;font-weight:var(--ptc-font-weight-bold);line-height:normal;text-decoration-line:underline}.not-me-additional-text{color:var(--color-gray-10);font-family:var(--ptc-font-latin);font-size:var(--ptc-font-size-medium);font-style:normal;font-weight:var(--ptc-font-weight-regular);line-height:normal;margin-bottom:var(--ptc-element-spacing-03)}.not-me-additional-text#not-me-additional-bottom{margin-bottom:unset;margin-top:var(--ptc-element-spacing-03)}.ptc-embedded-form>div{max-width:273px;overflow-wrap:break-word}.ptc-embedded-form .iti__country-name{color:var(--color-gray-12)}.ptc-embedded-form .iti--separate-dial-code.iti--show-flags .iti__selected-dial-code{color:var(--color-gray-12)}.ptc-embedded-form .mdc-menu-surface--open{z-index:99999}";
-
-const PtcDataLookup = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.elqSiteId = undefined;
-    this.elqVisitorLookupKey = undefined;
-    this.elqRecipientIdLookupKey = undefined;
-    this.elqContactLookupKey = undefined;
-    this.elqFieldEmailRecId = 'V_EmailRecipientID';
-    this.elqFieldContactEmail = 'C_EmailAddress';
-    this.elqFieldVisitorEmail = 'V_Email_Address';
-    this.elqFieldVisitorFirstname = 'C_FirstName';
-    this.elqFieldVisitorLastname = 'C_LastName';
-    this.notmeLinkId = undefined;
-    this.notmeFieldsClass = undefined;
-    this.notmeMessage = undefined;
-    this.notmeMessageNoname = undefined;
-    this.isBlindSubmit = true;
-    this.isInitialized = false;
-  }
-  componentWillLoad() {
-    this.initializeElqLib();
-    if (this.isBlindSubmit) {
-      this.populateBlindField();
-    }
-  }
-  initializeElqLib() {
-    this.elqLib = new ElqLib({
-      elq_site_id: this.elqSiteId,
-      elq_visitor_lookup_key: this.elqVisitorLookupKey,
-      elq_recipient_id_lookup_key: this.elqRecipientIdLookupKey,
-      elq_contact_lookup_key: this.elqContactLookupKey,
-      elq_field_email_rec_id: this.elqFieldEmailRecId,
-      elq_field_contact_email: this.elqFieldContactEmail,
-      elq_field_visitor_email: this.elqFieldVisitorEmail,
-      elq_field_visitor_firstname: this.elqFieldVisitorFirstname,
-      elq_field_visitor_lastname: this.elqFieldVisitorLastname,
-      notme_link_id: this.notmeLinkId,
-      notme_fields_class: this.notmeFieldsClass,
-      notme_message: this.notmeMessage,
-      notme_message_noname: this.notmeMessageNoname,
-    });
-    this.isInitialized = true;
-  }
-  populateBlindField() {
-    this.elqLib.add_field_mapping({ elementId: 'contact-phone', elqFieldName: 'C_BusPhone' });
-    this.elqLib.add_field_mapping({ elementId: 'contact-email', elqFieldName: 'C_EmailAddress' });
-    this.elqLib.add_field_mapping({ elementId: 'contact-firstname', elqFieldName: 'C_FirstName' });
-    this.elqLib.add_field_mapping({ elementId: 'contact-lastname', elqFieldName: 'C_LastName' });
-    this.elqLib.add_field_mapping({ elementId: 'contact-country', elqFieldName: 'C_Country' });
-    this.elqLib.add_field_mapping({ elementId: 'contact-phone', elqFieldName: 'C_BusPhone' });
-    this.elqLib.add_field_mapping({ elementId: 'company', elqFieldName: 'C_Company' });
-    this.elqLib.add_field_mapping({ elementId: 'contact-zipcode', elqFieldName: 'C_Zip_Postal' });
-    this.elqLib.add_field_mapping({ elementId: 'contact-job-category', elqFieldName: 'C_Job_Role1' });
-    this.elqLib.add_field_mapping({ elementId: 'contact-job-function', elqFieldName: 'C_Job_Function1' });
-    this.elqLib.add_field_mapping({ elementId: 'contact-jp-job-title', elqFieldName: 'C_Title' });
-  }
-  getCookie(name) {
-    let cookieValue = null;
-    if (document.cookie) {
-      const cookies = document.cookie.split(';');
-      for (let cookie of cookies) {
-        const [key, value] = cookie.trim().split('=');
-        if (key === name) {
-          cookieValue = decodeURIComponent(value);
-          break;
-        }
-      }
-    }
-    return cookieValue;
-  }
-  async performDataLookup() {
-    if (this.isInitialized) {
-      this.elqLib.user_elq_email = this.getCookie('elq-uid');
-      this.elqLib.find_eloqua_contact();
-    }
-  }
-  render() {
-    return index.h("slot", null);
-  }
-  get el() { return index.getElement(this); }
-};
-PtcDataLookup.style = ptcDataLookupCss;
-
 /******************************************************************************
 Copyright (c) Microsoft Corporation.
 
@@ -8079,7 +7399,7 @@ const PtcSelect = class {
     this.label = undefined;
     this.isRequired = true;
     this.helpertext = 'Please select a value!';
-    this.name = undefined;
+    this.fieldName = undefined;
     this.disabled = false;
     this.selectedValue = '';
     this.ptcDataEloquaName = undefined;
@@ -8108,43 +7428,12 @@ const PtcSelect = class {
     return className;
   }
   render() {
-    return (index.h(index.Host, { class: "ptc-select" }, index.h("label", { class: "ptc-label-select" }, this.label), index.h("div", { class: this.getSelectClassName() }, index.h("div", Object.assign({ class: "mdc-select__anchor", "aria-labelledby": "outlined-select-label" }, (this.isRequired ? { ariaRequired: true } : null)), index.h("span", { class: "mdc-notched-outline" }, index.h("span", { class: "mdc-notched-outline__leading" }), index.h("span", { class: "mdc-notched-outline__trailing" })), index.h("span", { class: "mdc-select__selected-text-container" }, index.h("span", { id: this.fieldId, class: "mdc-select__selected-text", "aria-controls": this.name, "aria-describedby": this.name, "data-eloqua-name": this.ptcDataEloquaName, "data-target-eloqua-name": this.ptcDataTargetEloquaName })), index.h("span", { class: "mdc-select__dropdown-icon" }, index.h("svg", { class: "", width: "20", height: "12", viewBox: "0 0 10 10", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { d: "M1.375 1.875L5 5.5L8.625 1.875L9.9375 3.1875L5 8.125L0.0625 3.1875L1.375 1.875Z" })))), index.h("div", { class: "mdc-select__menu mdc-menu mdc-menu-surface mdc-menu-surface--fullwidth" }, index.h("slot", null))), index.h("p", { id: this.name, class: "mdc-select-helper-text mdc-select-helper-text--validation-msg" }, index.h("svg", { class: "select-error-svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("g", { "clip-path": "url(#clip0_12_1424)" }, index.h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.3156 0L16 4.68444V11.3156L11.3156 16H4.68444L0 11.3156V4.68444L4.68444 0H11.3156ZM8 10.4C7.36 10.4 6.84444 10.9156 6.84444 11.5556C6.84444 12.1956 7.36 12.7111 8 12.7111C8.64 12.7111 9.15556 12.1956 9.15556 11.5556C9.15556 10.9156 8.64 10.4 8 10.4ZM8.88889 3.55556H7.11111V8.88889H8.88889V3.55556Z", fill: "#AF3231" })), index.h("defs", null, index.h("clipPath", { id: "clip0_12_1424" }, index.h("rect", { width: "16", height: "16", fill: "white" })))), this.helpertext)));
+    return (index.h(index.Host, { class: "ptc-select" }, index.h("label", { class: "ptc-label-select" }, this.label), index.h("div", { class: this.getSelectClassName() }, index.h("div", Object.assign({ class: "mdc-select__anchor", "aria-labelledby": "outlined-select-label" }, (this.isRequired ? { ariaRequired: true } : null)), index.h("span", { class: "mdc-notched-outline" }, index.h("span", { class: "mdc-notched-outline__leading" }), index.h("span", { class: "mdc-notched-outline__trailing" })), index.h("span", { class: "mdc-select__selected-text-container" }, index.h("span", { id: this.fieldId, class: "mdc-select__selected-text", "aria-controls": this.fieldName, "aria-describedby": this.fieldName, "data-eloqua-name": this.ptcDataEloquaName, "data-target-eloqua-name": this.ptcDataTargetEloquaName })), index.h("span", { class: "mdc-select__dropdown-icon" }, index.h("svg", { class: "", width: "20", height: "12", viewBox: "0 0 10 10", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { d: "M1.375 1.875L5 5.5L8.625 1.875L9.9375 3.1875L5 8.125L0.0625 3.1875L1.375 1.875Z" })))), index.h("div", { class: "mdc-select__menu mdc-menu mdc-menu-surface mdc-menu-surface--fullwidth" }, index.h("slot", null))), index.h("p", { id: this.fieldName, class: "mdc-select-helper-text mdc-select-helper-text--validation-msg" }, index.h("svg", { class: "select-error-svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("g", { "clip-path": "url(#clip0_12_1424)" }, index.h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.3156 0L16 4.68444V11.3156L11.3156 16H4.68444L0 11.3156V4.68444L4.68444 0H11.3156ZM8 10.4C7.36 10.4 6.84444 10.9156 6.84444 11.5556C6.84444 12.1956 7.36 12.7111 8 12.7111C8.64 12.7111 9.15556 12.1956 9.15556 11.5556C9.15556 10.9156 8.64 10.4 8 10.4ZM8.88889 3.55556H7.11111V8.88889H8.88889V3.55556Z", fill: "#AF3231" })), index.h("defs", null, index.h("clipPath", { id: "clip0_12_1424" }, index.h("rect", { width: "16", height: "16", fill: "white" })))), this.helpertext)));
   }
   get el() { return index.getElement(this); }
 };
 PtcSelect.style = ptcSelectCss;
 
-const ptcSpacerCss = ":host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:relative;display:block;width:12px;min-width:12px;height:12px}@media (min-width: 36em){:host{width:16px;min-width:16px;height:16px}}:host(.ptc-spacer-horizontal){display:inline-block;height:100% !important}:host(.ptc-spacer-horizontal.xx-small){width:4px;min-width:4px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.xx-small){width:4px;min-width:4px}}:host(.ptc-spacer-horizontal.x-small){width:4px;min-width:4px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.x-small){width:8px;min-width:8px}}:host(.ptc-spacer-horizontal.small){width:8px;min-width:8px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.small){width:12px;min-width:12px}}:host(.ptc-spacer-horizontal.medium){height:100%}:host(.ptc-spacer-horizontal.large){width:16px;min-width:16px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.large){width:20px;min-width:20px}}:host(.ptc-spacer-horizontal.x-large){width:20px;min-width:20px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.x-large){width:28px;min-width:28px}}:host(.ptc-spacer-horizontal.xx-large){width:28px;min-width:28px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.xx-large){width:36px;min-width:36px}}:host(.ptc-spacer-horizontal.xxx-large){width:36px;min-width:36px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.xxx-large){width:48px;min-width:48px}}:host(.ptc-spacer-horizontal.xxxx-large){width:48px;min-width:48px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.xxxx-large){width:72px;min-width:72px}}:host(.ptc-spacer-vertical.xx-small){width:100%;height:4px;min-height:4px}:host(.ptc-spacer-vertical.x-small){width:100%;height:4px;min-height:4px}@media (min-width: 36em){:host(.ptc-spacer-vertical.x-small){height:8px;min-height:8px}}:host(.ptc-spacer-vertical.small){width:100%;height:8px;min-height:8px}@media (min-width: 36em){:host(.ptc-spacer-vertical.small){height:12px;min-height:12px}}:host(.ptc-spacer-vertical.medium){width:100%}:host(.ptc-spacer-vertical.large){width:100%;height:16px;min-height:16px}@media (min-width: 36em){:host(.ptc-spacer-vertical.large){height:20px;min-height:20px}}:host(.ptc-spacer-vertical.x-large){width:100%;height:20px;min-height:20px}@media (min-width: 36em){:host(.ptc-spacer-vertical.x-large){height:28px;min-height:28px}}:host(.ptc-spacer-vertical.xx-large){width:100%;height:28px;min-height:28px}@media (min-width: 36em){:host(.ptc-spacer-vertical.xx-large){height:36px;min-height:36px}}:host(.ptc-spacer-vertical.xxx-large){width:100%;height:36px;min-height:36px}@media (min-width: 36em){:host(.ptc-spacer-vertical.xxx-large){height:48px;min-height:48px}}:host(.ptc-spacer-vertical.xxxx-large){width:100%;height:48px;min-height:48px}@media (min-width: 36em){:host(.ptc-spacer-vertical.xxxx-large){height:72px;min-height:72px}}:host(.ptc-spacer-vertical.space-144){width:100%;height:144px;min-height:144px}:host(.ptc-spacer-vertical.space-120){width:100%;height:120px;min-height:120px}:host(.ptc-spacer-vertical.space-128){width:100%;height:128px;min-height:128px}:host(.ptc-spacer-xx-small){display:none}@media (max-width: 22.5em){:host(.ptc-spacer-xx-small){display:block}}:host(.ptc-spacer-x-small){display:none}@media (max-width: 35.99em){:host(.ptc-spacer-x-small){display:block}}:host(.ptc-spacer-small){display:none}@media (min-width: 36em){:host(.ptc-spacer-small){display:block}}:host(.ptc-spacer-medium){display:none}@media (min-width: 48em){:host(.ptc-spacer-medium){display:block}}:host(.ptc-spacer-large){display:none}@media (min-width: 62em){:host(.ptc-spacer-large){display:block}}:host(.ptc-spacer-x-large){display:none}@media (min-width: 64.0625em){:host(.ptc-spacer-x-large){display:block}}:host(.ptc-spacer-xx-large){display:none}@media (min-width: 75em){:host(.ptc-spacer-xx-large){display:block}}:host(.ptc-spacer-xxx-large){display:none}@media (min-width: 90em){:host(.ptc-spacer-xxx-large){display:block}}";
-
-const PtcSpacer = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.breakpoint = '';
-    this.size = 'medium';
-    this.direction = 'vertical';
-  }
-  render() {
-    const classMap = this.getCssClassMap();
-    return (index.h(index.Host, { class: classMap }));
-  }
-  getCssClassMap() {
-    return {
-      [this.size]: true,
-      ['ptc-spacer-horizontal']: this.direction === 'horizontal',
-      ['ptc-spacer-vertical']: this.direction === 'vertical',
-      ['ptc-spacer-xx-small']: this.breakpoint === 'xx-small',
-      ['ptc-spacer-x-small']: this.breakpoint === 'x-small',
-      ['ptc-spacer-small']: this.breakpoint === 'small',
-      ['ptc-spacer-medium']: this.breakpoint === 'medium',
-      ['ptc-spacer-large']: this.breakpoint === 'large',
-      ['ptc-spacer-x-large']: this.breakpoint === 'x-large',
-      ['ptc-spacer-xx-large']: this.breakpoint === 'xx-large',
-      ['ptc-spacer-xxx-large']: this.breakpoint === 'xxx-large',
-    };
-  }
-};
-PtcSpacer.style = ptcSpacerCss;
-
 /**
  * @license
  * Copyright 2019 Google Inc.
@@ -11493,7 +10782,7 @@ const PtcTextfield = class {
     this.labelText = 'Email';
     this.helpertext = 'Please enter a value';
     this.disabled = false;
-    this.name = 'email';
+    this.fieldName = 'email';
     this.ptcDataEloquaName = undefined;
     this.ptcDataTargetEloquaName = undefined;
     this.inputValue = '';
@@ -11533,7 +10822,7 @@ const PtcTextfield = class {
     //   debugger;
     //   console.error('An error found here!', error.message);
     // }
-    if (this.fieldId === 'contact-phone' && this.name === 'phone') {
+    if (this.fieldId === 'contact-phone' && this.fieldName === 'phone') {
       this.iti = intlTelInput(this.customInput, {
         separateDialCode: true,
         initialCountry: 'auto',
@@ -11549,7 +10838,7 @@ const PtcTextfield = class {
     }
   }
   getPhoneValidation() {
-    if (this.fieldId === 'contact-phone' && this.name === 'phone') {
+    if (this.fieldId === 'contact-phone' && this.fieldName === 'phone') {
       if (this.iti.isValidNumber()) {
         if (this.mdcTextfield.classList.contains('mdc-text-field--invalid')) {
           this.mdcTextfield.classList.remove('mdc-text-field--invalid');
@@ -11557,7 +10846,6 @@ const PtcTextfield = class {
         if (this.el.classList.contains('invalid-field')) {
           this.el.classList.remove('invalid-field');
         }
-        // console.log("text field class list: " + this.mdcTextfield.className)
       }
       else if (!this.iti.isValidNumber()) {
         if (!this.mdcTextfield.classList.contains('mdc-text-field--invalid')) {
@@ -11566,10 +10854,7 @@ const PtcTextfield = class {
         if (!this.el.classList.contains('invalid-field')) {
           this.el.classList.add('invalid-field');
         }
-        // console.log("text field class list: " + this.mdcTextfield.className);
-        // console.log("this class list: " + this.el.className)
       }
-      // console.log('hello!');
     }
   }
   setErrorBackground() {
@@ -11586,7 +10871,7 @@ const PtcTextfield = class {
   }
   getInputClassName() {
     let className = 'mdc-text-field__input';
-    if (this.type === 'tel' && this.name === 'phone') {
+    if (this.type === 'tel' && this.fieldName === 'phone') {
       className = `${className}  intl-tel-input`;
     }
     else if (this.type === 'text' && this.ptcMaxLength) {
@@ -11599,13 +10884,13 @@ const PtcTextfield = class {
     // if (this.type === 'email' && this.name === 'email') {
     //   validationPattern = '[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+.[a-zA-Z]{2,}';
     // }
-    if (this.name === 'firstname' || this.name === 'lastname') {
+    if (this.fieldName === 'firstname' || this.fieldName === 'lastname') {
       validationPattern = '[A-Za-z ]+';
     }
     return validationPattern;
   }
   setHelperText() {
-    if (this.type === 'email' && this.name === 'email') {
+    if (this.type === 'email' && this.fieldName === 'email') {
       if (this.customInput.validity.valueMissing) {
         this.helpertext = 'Email is required.';
       }
@@ -11613,7 +10898,7 @@ const PtcTextfield = class {
         this.helpertext = 'Please enter a valid email.';
       }
     }
-    else if (this.name === 'firstname') {
+    else if (this.fieldName === 'firstname') {
       if (this.customInput.validity.valueMissing) {
         this.helpertext = 'Please enter your first name.';
       }
@@ -11621,7 +10906,7 @@ const PtcTextfield = class {
         this.helpertext = 'Please check your first name';
       }
     }
-    else if (this.name === 'lastname') {
+    else if (this.fieldName === 'lastname') {
       if (this.customInput.validity.valueMissing) {
         this.helpertext = 'Please enter your last name.';
       }
@@ -11649,92 +10934,15 @@ const PtcTextfield = class {
           this.mdcTextfield = mdcTextfield;
         } }, index.h("span", { class: "mdc-notched-outline ptc-textfield-outline" }, index.h("span", { class: "mdc-notched-outline__leading" }), index.h("span", { class: "mdc-notched-outline__trailing" })), index.h("input", Object.assign({ ref: customInput => {
           this.customInput = customInput;
-        }, id: this.fieldId }, (this.getInputClassName() ? { class: this.getInputClassName() } : null), { type: this.type }, (this.required ? { required: true } : null), (this.ptcMaxLength ? { maxlength: this.ptcMaxLength } : null), { "aria-controls": this.name, "aria-describedby": this.name, "data-eloqua-name": this.ptcDataEloquaName, "data-target-eloqua-name": this.ptcDataTargetEloquaName, value: this.inputValue }, (this.getValidationPattern() ? { pattern: this.getValidationPattern() } : null)))),
+        }, id: this.fieldId }, (this.getInputClassName() ? { class: this.getInputClassName() } : null), { type: this.type }, (this.required ? { required: true } : null), (this.ptcMaxLength ? { maxlength: this.ptcMaxLength } : null), { "aria-controls": this.fieldName, "aria-describedby": this.fieldName, "data-eloqua-name": this.ptcDataEloquaName, "data-target-eloqua-name": this.ptcDataTargetEloquaName, value: this.inputValue, name: this.fieldName }, (this.getValidationPattern() ? { pattern: this.getValidationPattern() } : null)))),
       index.h("div", { class: `mdc-text-field-helper-line
-                   ${!!this.ptcMaxLength ? 'field-with-counter' : ''}` }, index.h("div", { class: "mdc-text-field-helper-text mdc-text-field-helper-text--validation-msg", id: this.name }, index.h("svg", { class: "input-error-svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("g", { "clip-path": "url(#clip0_12_1424)" }, index.h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.3156 0L16 4.68444V11.3156L11.3156 16H4.68444L0 11.3156V4.68444L4.68444 0H11.3156ZM8 10.4C7.36 10.4 6.84444 10.9156 6.84444 11.5556C6.84444 12.1956 7.36 12.7111 8 12.7111C8.64 12.7111 9.15556 12.1956 9.15556 11.5556C9.15556 10.9156 8.64 10.4 8 10.4ZM8.88889 3.55556H7.11111V8.88889H8.88889V3.55556Z", fill: "#AF3231" })), index.h("defs", null, index.h("clipPath", { id: "clip0_12_1424" }, index.h("rect", { width: "16", height: "16", fill: "white" })))), this.helpertext), this.ptcMaxLength ? (index.h("div", { class: "mdc-text-field-character-counter" }, this.inputValue.length, " / ", this.ptcMaxLength)) : null),
+                   ${!!this.ptcMaxLength ? 'field-with-counter' : ''}` }, index.h("div", { class: "mdc-text-field-helper-text mdc-text-field-helper-text--validation-msg", id: this.fieldName }, index.h("svg", { class: "input-error-svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("g", { "clip-path": "url(#clip0_12_1424)" }, index.h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.3156 0L16 4.68444V11.3156L11.3156 16H4.68444L0 11.3156V4.68444L4.68444 0H11.3156ZM8 10.4C7.36 10.4 6.84444 10.9156 6.84444 11.5556C6.84444 12.1956 7.36 12.7111 8 12.7111C8.64 12.7111 9.15556 12.1956 9.15556 11.5556C9.15556 10.9156 8.64 10.4 8 10.4ZM8.88889 3.55556H7.11111V8.88889H8.88889V3.55556Z", fill: "#AF3231" })), index.h("defs", null, index.h("clipPath", { id: "clip0_12_1424" }, index.h("rect", { width: "16", height: "16", fill: "white" })))), this.helpertext), this.ptcMaxLength ? (index.h("div", { class: "mdc-text-field-character-counter" }, this.inputValue.length, " / ", this.ptcMaxLength)) : null),
     ]) : (index.h("input", { type: "hidden", "data-eloqua-name": this.ptcDataEloquaName, value: this.inputValue }))));
   }
   get el() { return index.getElement(this); }
 };
 PtcTextfield.style = ptcTextfieldCss;
 
-const ptcTitleCss = "div.center.sc-ptc-title{text-align:center}div.center.dotted.sc-ptc-title h1.sc-ptc-title::before,div.center.dotted.sc-ptc-title h2.sc-ptc-title::before,div.center.dotted.sc-ptc-title h3.sc-ptc-title::before,div.center.dotted.sc-ptc-title h4.sc-ptc-title::before,div.center.dotted.sc-ptc-title h5.sc-ptc-title::before,div.center.dotted.sc-ptc-title h6.sc-ptc-title::before{left:50%;transform:translateX(-50%)}div.left.sc-ptc-title{text-align:left}div.left.dotted.sc-ptc-title h1.sc-ptc-title::before,div.left.dotted.sc-ptc-title h2.sc-ptc-title::before,div.left.dotted.sc-ptc-title h3.sc-ptc-title::before,div.left.dotted.sc-ptc-title h4.sc-ptc-title::before,div.left.dotted.sc-ptc-title h5.sc-ptc-title::before,div.left.dotted.sc-ptc-title h6.sc-ptc-title::before{left:0%}div.right.sc-ptc-title{text-align:right}div.right.dotted.sc-ptc-title h1.sc-ptc-title::before,div.right.dotted.sc-ptc-title h2.sc-ptc-title::before,div.right.dotted.sc-ptc-title h3.sc-ptc-title::before,div.right.dotted.sc-ptc-title h4.sc-ptc-title::before,div.right.dotted.sc-ptc-title h5.sc-ptc-title::before,div.right.dotted.sc-ptc-title h6.sc-ptc-title::before{right:0%}div.inherit.sc-ptc-title{text-align:inherit}div.dotted.sc-ptc-title h1.sc-ptc-title::before,div.dotted.sc-ptc-title h2.sc-ptc-title::before,div.dotted.sc-ptc-title h3.sc-ptc-title::before,div.dotted.sc-ptc-title h4.sc-ptc-title::before,div.dotted.sc-ptc-title h5.sc-ptc-title::before,div.dotted.sc-ptc-title h6.sc-ptc-title::before{content:\"\";position:absolute;top:-6px;width:30%;display:block;border-top:3px dashed var(--color-green-07)}div.solid.sc-ptc-title h1.sc-ptc-title,div.solid.sc-ptc-title h2.sc-ptc-title,div.solid.sc-ptc-title h3.sc-ptc-title,div.solid.sc-ptc-title h4.sc-ptc-title,div.solid.sc-ptc-title h5.sc-ptc-title,div.solid.sc-ptc-title h6.sc-ptc-title{padding-top:12px}div.solid.sc-ptc-title h1.sc-ptc-title::before,div.solid.sc-ptc-title h2.sc-ptc-title::before,div.solid.sc-ptc-title h3.sc-ptc-title::before,div.solid.sc-ptc-title h4.sc-ptc-title::before,div.solid.sc-ptc-title h5.sc-ptc-title::before,div.solid.sc-ptc-title h6.sc-ptc-title::before{content:\"\";position:absolute;width:100%;height:0.7px;background-color:var(--color-gray-03);opacity:0.9;left:0px;top:0}div.solid.sc-ptc-title h1.sc-ptc-title::after,div.solid.sc-ptc-title h2.sc-ptc-title::after,div.solid.sc-ptc-title h3.sc-ptc-title::after,div.solid.sc-ptc-title h4.sc-ptc-title::after,div.solid.sc-ptc-title h5.sc-ptc-title::after,div.solid.sc-ptc-title h6.sc-ptc-title::after{content:\"\";position:absolute;width:56px;height:2px;background-color:var(--color-green-07);top:-2px;left:0px}div.is-standard.sc-ptc-title h1.sc-ptc-title,div.is-standard.sc-ptc-title h2.sc-ptc-title,div.is-standard.sc-ptc-title h3.sc-ptc-title,div.is-standard.sc-ptc-title h4.sc-ptc-title,div.is-standard.sc-ptc-title h5.sc-ptc-title,div.is-standard.sc-ptc-title h6.sc-ptc-title{display:inline-block;position:relative}div.is-standard.sc-ptc-title h1.sc-ptc-title{font-size:var(--ptc-font-size-xxx-large);line-height:var(--ptc-line-height-densest);font-weight:var(--ptc-font-weight-extrabold);letter-spacing:0px;color:var(--color-gray-10)}@media only screen and (min-width: 768px){div.is-standard.sc-ptc-title h1.sc-ptc-title{font-size:var(--ptc-font-size-xxxx-large)}}div.is-standard.sc-ptc-title h2.sc-ptc-title{font-size:var(--ptc-font-size-x-large);line-height:var(--ptc-line-height-densest);font-weight:var(--ptc-font-weight-extrabold);color:var(--color-gray-10)}@media only screen and (min-width: 768px){div.is-standard.sc-ptc-title h2.sc-ptc-title{font-size:var(--ptc-font-size-xx-large)}}div.is-plm-hub.sc-ptc-title h1.sc-ptc-title,div.is-plm-hub.sc-ptc-title h2.sc-ptc-title,div.is-plm-hub.sc-ptc-title h3.sc-ptc-title,div.is-plm-hub.sc-ptc-title h4.sc-ptc-title,div.is-plm-hub.sc-ptc-title h5.sc-ptc-title,div.is-plm-hub.sc-ptc-title h6.sc-ptc-title{display:inline-block;position:relative;margin-block-start:0em;margin-block-end:0em;margin-inline-start:0px;margin-inline-end:0px;color:var(--color-white) !important}div.margin-flush.sc-ptc-title{margin-top:0;margin-bottom:0}div.margin-flush.sc-ptc-title h1.sc-ptc-title,div.margin-flush.sc-ptc-title h2.sc-ptc-title,div.margin-flush.sc-ptc-title h3.sc-ptc-title,div.margin-flush.sc-ptc-title h4.sc-ptc-title,div.margin-flush.sc-ptc-title h5.sc-ptc-title{margin-top:0;margin-bottom:0}div.margin-top-2.sc-ptc-title{margin-top:var(--ptc-element-spacing-02);margin-bottom:0}div.margin-top-3.sc-ptc-title{margin-top:var(--ptc-element-spacing-03);margin-bottom:0}div.margin-top-4.sc-ptc-title{margin-top:var(--ptc-element-spacing-04);margin-bottom:0}div.margin-top-5.sc-ptc-title{margin-top:var(--ptc-element-spacing-05);margin-bottom:0}div.margin-top-6.sc-ptc-title{margin-top:var(--ptc-element-spacing-06);margin-bottom:0}div.margin-bottom-2.sc-ptc-title{margin-bottom:var(--ptc-element-spacing-02);margin-top:0}div.margin-bottom-3.sc-ptc-title{margin-bottom:var(--ptc-element-spacing-03);margin-top:0}div.margin-bottom-4.sc-ptc-title{margin-bottom:var(--ptc-element-spacing-04);margin-top:0}div.margin-bottom-5.sc-ptc-title{margin-bottom:var(--ptc-element-spacing-05);margin-top:0}div.margin-bottom-6.sc-ptc-title{margin-bottom:var(--ptc-element-spacing-06);margin-top:0}div.margin-2.sc-ptc-title{margin-top:var(--ptc-element-spacing-02);margin-bottom:var(--ptc-element-spacing-02)}div.margin-3.sc-ptc-title{margin-top:var(--ptc-element-spacing-03);margin-bottom:var(--ptc-element-spacing-03)}div.margin-4.sc-ptc-title{margin-top:var(--ptc-element-spacing-04);margin-bottom:var(--ptc-element-spacing-04)}div.margin-5.sc-ptc-title{margin-top:var(--ptc-element-spacing-05);margin-bottom:var(--ptc-element-spacing-05)}div.margin-5.sc-ptc-title h4.sc-ptc-title{margin-top:0;margin-bottom:0}div.margin-6.sc-ptc-title{margin-top:var(--ptc-element-spacing-06);margin-bottom:var(--ptc-element-spacing-06)}div.margin-9.sc-ptc-title{margin-top:var(--ptc-element-spacing-09);margin-bottom:var(--ptc-element-spacing-09)}div.green.sc-ptc-title h1.sc-ptc-title,div.green.sc-ptc-title h2.sc-ptc-title,div.green.sc-ptc-title h3.sc-ptc-title,div.green.sc-ptc-title h4.sc-ptc-title,div.green.sc-ptc-title h5.sc-ptc-title,div.green.sc-ptc-title h6.sc-ptc-title{text-shadow:0px 0px var(--ptc-element-spacing-03) var(--color-green-07)}div.blue.sc-ptc-title h1.sc-ptc-title,div.blue.sc-ptc-title h2.sc-ptc-title,div.blue.sc-ptc-title h3.sc-ptc-title,div.blue.sc-ptc-title h4.sc-ptc-title,div.blue.sc-ptc-title h5.sc-ptc-title,div.blue.sc-ptc-title h6.sc-ptc-title{text-shadow:0px 0px var(--ptc-element-spacing-03) var(--color-blue-07)}div.red.sc-ptc-title h1.sc-ptc-title,div.red.sc-ptc-title h2.sc-ptc-title,div.red.sc-ptc-title h3.sc-ptc-title,div.red.sc-ptc-title h4.sc-ptc-title,div.red.sc-ptc-title h5.sc-ptc-title,div.red.sc-ptc-title h6.sc-ptc-title{text-shadow:0px 0px var(--ptc-element-spacing-03) var(--color-red-07)}div.orange.sc-ptc-title h1.sc-ptc-title,div.orange.sc-ptc-title h2.sc-ptc-title,div.orange.sc-ptc-title h3.sc-ptc-title,div.orange.sc-ptc-title h4.sc-ptc-title,div.orange.sc-ptc-title h5.sc-ptc-title,div.orange.sc-ptc-title h6.sc-ptc-title{text-shadow:0px 0px var(--ptc-element-spacing-03) var(--color-orange-07)}div.slate-grey.sc-ptc-title h1.sc-ptc-title,div.slate-grey.sc-ptc-title h2.sc-ptc-title,div.slate-grey.sc-ptc-title h3.sc-ptc-title,div.slate-grey.sc-ptc-title h4.sc-ptc-title,div.slate-grey.sc-ptc-title h5.sc-ptc-title,div.slate-grey.sc-ptc-title h6.sc-ptc-title{text-shadow:0px 0px var(--ptc-element-spacing-03) var(--color-gray-07)}div.w-3.sc-ptc-title h1.sc-ptc-title,div.w-3.sc-ptc-title h2.sc-ptc-title,div.w-3.sc-ptc-title h3.sc-ptc-title,div.w-3.sc-ptc-title h4.sc-ptc-title,div.w-3.sc-ptc-title h5.sc-ptc-title,div.w-3.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-thin)}div.w-4.sc-ptc-title h1.sc-ptc-title,div.w-4.sc-ptc-title h2.sc-ptc-title,div.w-4.sc-ptc-title h3.sc-ptc-title,div.w-4.sc-ptc-title h4.sc-ptc-title,div.w-4.sc-ptc-title h5.sc-ptc-title,div.w-4.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-regular)}div.w-5.sc-ptc-title h1.sc-ptc-title,div.w-5.sc-ptc-title h2.sc-ptc-title,div.w-5.sc-ptc-title h3.sc-ptc-title,div.w-5.sc-ptc-title h4.sc-ptc-title,div.w-5.sc-ptc-title h5.sc-ptc-title,div.w-5.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-medium)}div.w-6.sc-ptc-title h1.sc-ptc-title,div.w-6.sc-ptc-title h2.sc-ptc-title,div.w-6.sc-ptc-title h3.sc-ptc-title,div.w-6.sc-ptc-title h4.sc-ptc-title,div.w-6.sc-ptc-title h5.sc-ptc-title,div.w-6.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-semibold)}div.w-7.sc-ptc-title h1.sc-ptc-title,div.w-7.sc-ptc-title h2.sc-ptc-title,div.w-7.sc-ptc-title h3.sc-ptc-title,div.w-7.sc-ptc-title h4.sc-ptc-title,div.w-7.sc-ptc-title h5.sc-ptc-title,div.w-7.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-bold)}div.w-8.sc-ptc-title h1.sc-ptc-title,div.w-8.sc-ptc-title h2.sc-ptc-title,div.w-8.sc-ptc-title h3.sc-ptc-title,div.w-8.sc-ptc-title h4.sc-ptc-title,div.w-8.sc-ptc-title h5.sc-ptc-title,div.w-8.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-extrabold)}div.w-9.sc-ptc-title h1.sc-ptc-title,div.w-9.sc-ptc-title h2.sc-ptc-title,div.w-9.sc-ptc-title h3.sc-ptc-title,div.w-9.sc-ptc-title h4.sc-ptc-title,div.w-9.sc-ptc-title h5.sc-ptc-title,div.w-9.sc-ptc-title h6.sc-ptc-title{font-weight:var(--ptc-font-weight-black)}div.xx-small.sc-ptc-title h1.sc-ptc-title,div.xx-small.sc-ptc-title h2.sc-ptc-title,div.xx-small.sc-ptc-title h3.sc-ptc-title,div.xx-small.sc-ptc-title h4.sc-ptc-title,div.xx-small.sc-ptc-title h5.sc-ptc-title,div.xx-small.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xx-small)}div.x-small.sc-ptc-title h1.sc-ptc-title,div.x-small.sc-ptc-title h2.sc-ptc-title,div.x-small.sc-ptc-title h3.sc-ptc-title,div.x-small.sc-ptc-title h4.sc-ptc-title,div.x-small.sc-ptc-title h5.sc-ptc-title,div.x-small.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-x-small)}div.small.sc-ptc-title h1.sc-ptc-title,div.small.sc-ptc-title h2.sc-ptc-title,div.small.sc-ptc-title h3.sc-ptc-title,div.small.sc-ptc-title h4.sc-ptc-title,div.small.sc-ptc-title h5.sc-ptc-title,div.small.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-small)}div.medium.sc-ptc-title h1.sc-ptc-title,div.medium.sc-ptc-title h2.sc-ptc-title,div.medium.sc-ptc-title h3.sc-ptc-title,div.medium.sc-ptc-title h4.sc-ptc-title,div.medium.sc-ptc-title h5.sc-ptc-title,div.medium.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-medium)}div.large.sc-ptc-title h1.sc-ptc-title,div.large.sc-ptc-title h2.sc-ptc-title,div.large.sc-ptc-title h3.sc-ptc-title,div.large.sc-ptc-title h4.sc-ptc-title,div.large.sc-ptc-title h5.sc-ptc-title,div.large.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-large)}div.large.sc-ptc-title h3.sc-ptc-title{font-size:var(--ptc-font-size-medium)}@media only screen and (min-width: 768px){div.large.sc-ptc-title h3.sc-ptc-title{font-size:var(--ptc-font-size-large)}}div.x-large.sc-ptc-title h1.sc-ptc-title,div.x-large.sc-ptc-title h2.sc-ptc-title,div.x-large.sc-ptc-title h3.sc-ptc-title,div.x-large.sc-ptc-title h4.sc-ptc-title,div.x-large.sc-ptc-title h5.sc-ptc-title,div.x-large.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-x-large)}div.xx-large.sc-ptc-title h1.sc-ptc-title,div.xx-large.sc-ptc-title h2.sc-ptc-title,div.xx-large.sc-ptc-title h3.sc-ptc-title,div.xx-large.sc-ptc-title h4.sc-ptc-title{font-size:var(--ptc-font-size-x-large)}@media only screen and (min-width: 768px){div.xx-large.sc-ptc-title h1.sc-ptc-title,div.xx-large.sc-ptc-title h2.sc-ptc-title,div.xx-large.sc-ptc-title h3.sc-ptc-title,div.xx-large.sc-ptc-title h4.sc-ptc-title{font-size:var(--ptc-font-size-xx-large)}}div.xxx-large.sc-ptc-title h1.sc-ptc-title,div.xxx-large.sc-ptc-title h2.sc-ptc-title,div.xxx-large.sc-ptc-title h3.sc-ptc-title,div.xxx-large.sc-ptc-title h4.sc-ptc-title,div.xxx-large.sc-ptc-title h5.sc-ptc-title,div.xxx-large.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xx-large)}@media only screen and (min-width: 768px){div.xxx-large.sc-ptc-title h1.sc-ptc-title,div.xxx-large.sc-ptc-title h2.sc-ptc-title,div.xxx-large.sc-ptc-title h3.sc-ptc-title,div.xxx-large.sc-ptc-title h4.sc-ptc-title,div.xxx-large.sc-ptc-title h5.sc-ptc-title,div.xxx-large.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xxx-large)}}div.xxxx-large.sc-ptc-title h1.sc-ptc-title,div.xxxx-large.sc-ptc-title h2.sc-ptc-title,div.xxxx-large.sc-ptc-title h3.sc-ptc-title,div.xxxx-large.sc-ptc-title h4.sc-ptc-title,div.xxxx-large.sc-ptc-title h5.sc-ptc-title,div.xxxx-large.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xxx-large)}@media screen and (min-width: 769px){div.xxxx-large.sc-ptc-title h1.sc-ptc-title,div.xxxx-large.sc-ptc-title h2.sc-ptc-title,div.xxxx-large.sc-ptc-title h3.sc-ptc-title,div.xxxx-large.sc-ptc-title h4.sc-ptc-title,div.xxxx-large.sc-ptc-title h5.sc-ptc-title,div.xxxx-large.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xxxx-large)}}div.xx-large-allbp.sc-ptc-title h1.sc-ptc-title,div.xx-large-allbp.sc-ptc-title h2.sc-ptc-title,div.xx-large-allbp.sc-ptc-title h3.sc-ptc-title,div.xx-large-allbp.sc-ptc-title h4.sc-ptc-title,div.xx-large-allbp.sc-ptc-title h5.sc-ptc-title,div.xx-large-allbp.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xx-large)}div.xxxx-large-allbp.sc-ptc-title h1.sc-ptc-title,div.xxxx-large-allbp.sc-ptc-title h2.sc-ptc-title,div.xxxx-large-allbp.sc-ptc-title h3.sc-ptc-title,div.xxxx-large-allbp.sc-ptc-title h4.sc-ptc-title,div.xxxx-large-allbp.sc-ptc-title h5.sc-ptc-title,div.xxxx-large-allbp.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xxxx-large)}div.xxxx-large-desktop.sc-ptc-title h1.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h2.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h3.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h4.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h5.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xxx-large)}@media only screen and (min-width: 992px){div.xxxx-large-desktop.sc-ptc-title h1.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h2.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h3.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h4.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h5.sc-ptc-title,div.xxxx-large-desktop.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xxxx-large)}}div.xxxx-large-store.sc-ptc-title h1.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h2.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h3.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h4.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h5.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xxx-large)}@media only screen and (min-width: 992px){div.xxxx-large-store.sc-ptc-title h1.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h2.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h3.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h4.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h5.sc-ptc-title,div.xxxx-large-store.sc-ptc-title h6.sc-ptc-title{font-size:var(--ptc-font-size-xxxx-large)}}div.densest.sc-ptc-title h1.sc-ptc-title,div.densest.sc-ptc-title h2.sc-ptc-title,div.densest.sc-ptc-title h3.sc-ptc-title,div.densest.sc-ptc-title h4.sc-ptc-title,div.densest.sc-ptc-title h5.sc-ptc-title,div.densest.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-densest)}div.denser.sc-ptc-title h1.sc-ptc-title,div.denser.sc-ptc-title h2.sc-ptc-title,div.denser.sc-ptc-title h3.sc-ptc-title,div.denser.sc-ptc-title h4.sc-ptc-title,div.denser.sc-ptc-title h5.sc-ptc-title,div.denser.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-denser)}div.dense.sc-ptc-title h1.sc-ptc-title,div.dense.sc-ptc-title h2.sc-ptc-title,div.dense.sc-ptc-title h3.sc-ptc-title,div.dense.sc-ptc-title h4.sc-ptc-title,div.dense.sc-ptc-title h5.sc-ptc-title,div.dense.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-dense)}div.normal.sc-ptc-title h1.sc-ptc-title,div.normal.sc-ptc-title h2.sc-ptc-title,div.normal.sc-ptc-title h3.sc-ptc-title,div.normal.sc-ptc-title h4.sc-ptc-title,div.normal.sc-ptc-title h5.sc-ptc-title,div.normal.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-normal)}div.loose.sc-ptc-title h1.sc-ptc-title,div.loose.sc-ptc-title h2.sc-ptc-title,div.loose.sc-ptc-title h3.sc-ptc-title,div.loose.sc-ptc-title h4.sc-ptc-title,div.loose.sc-ptc-title h5.sc-ptc-title,div.loose.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-loose)}div.looser.sc-ptc-title h1.sc-ptc-title,div.looser.sc-ptc-title h2.sc-ptc-title,div.looser.sc-ptc-title h3.sc-ptc-title,div.looser.sc-ptc-title h4.sc-ptc-title,div.looser.sc-ptc-title h5.sc-ptc-title,div.looser.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-looser)}div.paragraph.sc-ptc-title h1.sc-ptc-title,div.paragraph.sc-ptc-title h2.sc-ptc-title,div.paragraph.sc-ptc-title h3.sc-ptc-title,div.paragraph.sc-ptc-title h4.sc-ptc-title,div.paragraph.sc-ptc-title h5.sc-ptc-title,div.paragraph.sc-ptc-title h6.sc-ptc-title{line-height:var(--ptc-line-height-paragraph)}div.black.sc-ptc-title h1.sc-ptc-title,div.black.sc-ptc-title h2.sc-ptc-title,div.black.sc-ptc-title h3.sc-ptc-title,div.black.sc-ptc-title h4.sc-ptc-title,div.black.sc-ptc-title h5.sc-ptc-title,div.black.sc-ptc-title h6.sc-ptc-title{color:var(--color-black)}div.white.sc-ptc-title h1.sc-ptc-title,div.white.sc-ptc-title h2.sc-ptc-title,div.white.sc-ptc-title h3.sc-ptc-title,div.white.sc-ptc-title h4.sc-ptc-title,div.white.sc-ptc-title h5.sc-ptc-title,div.white.sc-ptc-title h6.sc-ptc-title{color:var(--color-white)}div.gray-1.sc-ptc-title h1.sc-ptc-title,div.gray-1.sc-ptc-title h2.sc-ptc-title,div.gray-1.sc-ptc-title h3.sc-ptc-title,div.gray-1.sc-ptc-title h4.sc-ptc-title,div.gray-1.sc-ptc-title h5.sc-ptc-title,div.gray-1.sc-ptc-title h6.sc-ptc-title{color:var(--color-gray-01)}div.gray.sc-ptc-title h1.sc-ptc-title,div.gray.sc-ptc-title h2.sc-ptc-title,div.gray.sc-ptc-title h3.sc-ptc-title,div.gray.sc-ptc-title h4.sc-ptc-title,div.gray.sc-ptc-title h5.sc-ptc-title,div.gray.sc-ptc-title h6.sc-ptc-title{color:var(--color-gray-10)}div.gray-darker.sc-ptc-title h1.sc-ptc-title,div.gray-darker.sc-ptc-title h2.sc-ptc-title,div.gray-darker.sc-ptc-title h3.sc-ptc-title,div.gray-darker.sc-ptc-title h4.sc-ptc-title,div.gray-darker.sc-ptc-title h5.sc-ptc-title,div.gray-darker.sc-ptc-title h6.sc-ptc-title{color:var(--color-gray-11)}div.ellipsis-boxing.sc-ptc-title h1.sc-ptc-title,div.ellipsis-boxing.sc-ptc-title h2.sc-ptc-title,div.ellipsis-boxing.sc-ptc-title h3.sc-ptc-title,div.ellipsis-boxing.sc-ptc-title h4.sc-ptc-title,div.ellipsis-boxing.sc-ptc-title h5.sc-ptc-title,div.ellipsis-boxing.sc-ptc-title h6.sc-ptc-title{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;overflow-wrap:break-word;padding-bottom:0}div.block.sc-ptc-title h1.sc-ptc-title,div.block.sc-ptc-title h2.sc-ptc-title,div.block.sc-ptc-title h3.sc-ptc-title,div.block.sc-ptc-title h4.sc-ptc-title,div.block.sc-ptc-title h5.sc-ptc-title,div.block.sc-ptc-title h6.sc-ptc-title{display:block}";
-
-const PtcTitle = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.isPlmHub = false;
-    this.type = 'h2';
-    this.textAlign = undefined;
-    this.upperline = 'dotted';
-    this.titleShadow = undefined;
-    this.titleColor = 'gray';
-    this.titleMargin = undefined;
-    this.titleWeight = undefined;
-    this.titleSize = undefined;
-    this.titleHeight = 'densest';
-    this.styles = undefined;
-    this.ellipsisLineCutoff = undefined;
-    this.titleDisplay = 'inline-block';
-  }
-  render() {
-    const classMap = this.getCssClassMap();
-    const cutOff = this.getLineCuttoff();
-    let TagType;
-    switch (this.type) {
-      case 'h1':
-        TagType = 'h1';
-        break;
-      case 'h3':
-        TagType = 'h3';
-        break;
-      case 'h4':
-        TagType = 'h4';
-        break;
-      case 'h5':
-        TagType = 'h5';
-        break;
-      case 'h6':
-        TagType = 'h6';
-        break;
-      default:
-        TagType = 'h2';
-    }
-    return (index.h(index.Host, null, this.styles && index.h("style", null, this.styles), index.h("div", { class: classMap }, index.h(TagType, { style: cutOff }, index.h("slot", null)))));
-  }
-  getCssClassMap() {
-    return {
-      [this.textAlign]: !!this.textAlign ? true : false,
-      [this.upperline]: true,
-      [this.isPlmHub ? 'is-plm-hub' : 'is-standard']: true,
-      [this.titleMargin]: !!this.titleMargin ? true : false,
-      [this.titleShadow]: !!this.titleShadow ? true : false,
-      [this.titleWeight]: !!this.titleWeight ? true : false,
-      [this.titleSize]: !!this.titleSize ? true : false,
-      [this.titleHeight]: !!this.titleHeight ? true : false,
-      [this.titleColor]: !!this.titleColor ? true : false,
-      ['ellipsis-boxing']: this.ellipsisLineCutoff && this.ellipsisLineCutoff > 0,
-      [this.titleDisplay]: !!this.titleDisplay ? true : false,
-    };
-  }
-  getLineCuttoff() {
-    let result;
-    if (this.ellipsisLineCutoff && this.ellipsisLineCutoff > 0) {
-      result = {
-        ['-webkit-line-clamp']: `${this.ellipsisLineCutoff}`,
-      };
-    }
-    return result;
-  }
-};
-PtcTitle.style = ptcTitleCss;
-
-exports.embedded_form = EmbeddedForm;
-exports.max_width_container = MaxWidthContainer;
-exports.ptc_button = PtcButton;
-exports.ptc_data_lookup = PtcDataLookup;
 exports.ptc_form_checkbox = PtcFormCheckbox;
 exports.ptc_select = PtcSelect;
-exports.ptc_spacer = PtcSpacer;
 exports.ptc_textfield = PtcTextfield;
-exports.ptc_title = PtcTitle;