@ptcwebops/ptcw-design 6.4.18 → 6.4.19

package/dist/esm/academic-form-test.entry.js

@@ -1,78 +0,0 @@
-import { r as registerInstance, h, H as Host, a as getElement } from './index-0bf594c4.js';
-
-const academicFormTestCss = "h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}:host{display:block}.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}.form-wrapper>form{max-width:277px}.form-wrapper>ptc-button{align-items:center}.form-wrapper .ptc-label{display:block;font-size:var(--ptc-font-size-x-small);font-weight:var(--ptc-font-weight-bold);line-height:normal;margin-bottom:var(--ptc-element-spacing-04);position:relative;z-index:1;color:var(--color-gray-13)}";
-
-const AcademicForm = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.formData = {
-      email: "",
-      firstName: "",
-      lastName: "",
-      company: "",
-      country: "",
-      phone: "",
-      inquiryReason: "",
-      howhearselfreport: "",
-      policyChecked: false,
-    };
-  }
-  // private countryEle: HTMLPtcSelectElement;
-  // private inquiryreasonEle: HTMLPtcTextfieldElement;
-  // private howhearselfreport: HTMLPtcTextfieldElement;
-  componentDidLoad() {
-    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-textfield[field-id="contact-inquiry"]')
-    // this.howhearselfreport = this.el.querySelector('ptc-textfield[field-id="self-reporting"]')
-  }
-  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;
-    if (this.isValid()) {
-      const formSubmitEvent = new CustomEvent("formSubmit", {
-        detail: this.formData,
-        bubbles: true,
-      });
-      this.el.dispatchEvent(formSubmitEvent);
-    }
-    else {
-      console.log("Form validation failed");
-    }
-  }
-  isValid() {
-    const { email, firstName, lastName, company, country, phone, inquiryReason, howhearselfreport, policyChecked, } = this.formData;
-    const invalidLength = document.querySelectorAll(".invalid-field").length;
-    return (email !== "" &&
-      phone !== "" &&
-      firstName !== "" &&
-      lastName !== "" &&
-      company !== "" &&
-      country !== "" &&
-      inquiryReason !== "" &&
-      howhearselfreport != "" &&
-      policyChecked &&
-      invalidLength === 0);
-  }
-  render() {
-    return (h(Host, null, h("div", { class: "ptc-container ptc-section-standard u-flex u-flex-justify-center" }, h("div", { class: "form-wrapper" }, h("max-width-container", { "max-width": "277", breakpoint: 480 }, 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."), h("ptc-spacer", { breakpoint: "x-small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "medium" }), h("ptc-spacer", { breakpoint: "small", size: "small" }), h("ptc-spacer", { breakpoint: "small", size: "small" })), h("form", { onSubmit: (event) => this.handleSubmit(event) }, h("ptc-label", { class: "ptc-label" }, "Your Information"), h("ptc-textfield", { "field-id": "contact-firstname", "label-text": "First Name*", type: "text", "ptc-data-eloqua-name": "C_FirstName", "field-name": "firstname" }), h("ptc-textfield", { "field-id": "contact-lastname", "label-text": "Last Name*", type: "text", "ptc-data-eloqua-name": "C_LastName", "field-name": "lastname" }), h("ptc-textfield", { "field-id": "contact-email", "label-text": "Email*", type: "email", "alert-text": "Minimum Age Required", "alert-text-content": "If you are under the age of 14 years old, you must use your parent/guardian email address.", "ptc-data-eloqua-name": "C_EmailAddress", "field-name": "email" }), h("ptc-textfield", { "field-id": "confirm-email", "label-text": "Confirm your Email*", type: "email", "ptc-data-eloqua-name": "emailconfirmation", "field-name": "confirm-email", "custom-validation": "Email addresses must match." }), h("ptc-textfield", { "field-id": "contact-phone", "label-text": "Phone*", type: "tel", "ptc-data-eloqua-name": "C_BusPhone", "field-name": "phone" }), h("ptc-textfield", { "field-id": "contact-city", "label-text": "City*", type: "text", "ptc-data-eloqua-name": "C_City", "field-name": "contact-city" }), h("ptc-textfield", { "field-id": "contact-zipcode", "label-text": "Zip Code*", type: "text", "ptc-data-eloqua-name": "C_Zip_Postal", "field-name": "zipcode-field" }), h("ptc-select", { "field-id": "contact-country", label: "Country*", "ptc-data-eloqua-name": "C_Country", "field-name": "country" }, h("ul", { class: "mdc-list" }, h("li", { class: "mdc-list-item", "data-value": "" }, h("span", { class: "mdc-list-item__ripple" })), h("li", { class: "mdc-list-item", "data-value": "USA" }, h("span", { class: "mdc-list-item__ripple" }), h("span", { class: "mdc-list-item__text" }, "USA")), h("li", { class: "mdc-list-item", "data-value": "Canada" }, h("span", { class: "mdc-list-item__ripple" }), h("span", { class: "mdc-list-item__text" }, "Canada")), h("li", { class: "mdc-list-item", "data-value": "China" }, h("span", { class: "mdc-list-item__ripple" }), h("span", { class: "mdc-list-item__text" }, "China")))), h("ptc-label", { class: "ptc-label" }, "School Information"), h("ptc-textfield", { "field-id": "institution", "label-text": "School/Institution Name*", type: "text", "ptc-data-eloqua-name": "C_Company", "field-name": "institution" }), h("ptc-textfield", { "field-id": "contact-email", "label-text": "School Level*", type: "email", "ptc-data-eloqua-name": "C_EmailAddress", "field-name": "email" }), h("ptc-textfield", { "field-id": "contact-email", "label-text": "Student Level*", type: "email", "ptc-data-eloqua-name": "gradeLevel1", "field-name": "email" }), h("ptc-select", { "field-id": "academic-description", label: "Role of User*", "ptc-data-eloqua-name": "description1", "field-name": "academic-description" }, h("ul", { class: "mdc-list" }, h("li", { class: "mdc-list-item", "data-value": "" }, h("span", { class: "mdc-list-item__ripple" })), h("li", { class: "mdc-list-item", "data-value": "USA" }, h("span", { class: "mdc-list-item__ripple" }), h("span", { class: "mdc-list-item__text" }, "K-12 educator")), h("li", { class: "mdc-list-item", "data-value": "Canada" }, h("span", { class: "mdc-list-item__ripple" }), h("span", { class: "mdc-list-item__text" }, "Professor")), h("li", { class: "mdc-list-item", "data-value": "China" }, h("span", { class: "mdc-list-item__ripple" }), h("span", { class: "mdc-list-item__text" }, "K-12 student")))), h("ptc-textfield", { "field-id": "contact-city", "label-text": "Purpose of use*", type: "text", "ptc-data-eloqua-name": "C_City", "field-name": "contact-city" }), h("ptc-textfield", { "field-id": "academic-ofComputers", "label-text": "How many computers are you planning to install this software on?*", type: "text", "ptc-data-eloqua-name": "ofComputers1", "field-name": "academic-ofComputers" }), h("ptc-form-checkbox", { label: "I acknowledge that my personal details will be processed in accordance with PTC\u2019s privacy policy and that they may be shared with PTC Inc\u2019s subsidiaries for\r\n               the promotion of PTC\u2019s products and associated services. ", "checkbox-id": "test" }), h("ptc-button", { class: "form-submit", color: "ptc-quaternary", type: "submit", styles: ":host{align-self:flex-end; margin-top: 48px; display:block; float: right; width: fit-content;}" }, "Submit"))))));
-  }
-  get el() { return getElement(this); }
-};
-AcademicForm.style = academicFormTestCss;
-
-export { AcademicForm as academic_form_test };