pr360-questionnaire 2.1.3 → 2.1.5

package/build/questionnaire-test.js

@@ -16910,6 +16910,37 @@ a:hover {
   transition: all 0.3s ease;
   margin-left: 0px;
 }
+.questionnaire .form__container .form select {
+  display: block;
+  font-family: "lato", Helvetica, sans-serif;
+  padding: 5px 15px;
+  width: 222.23px !important;
+  margin: 0 auto;
+  text-align: left;
+  height: 47px;
+  border: 1px solid #8c8c8c;
+  border-radius: 5px;
+  background-color: #fff;
+  margin-bottom: 20px;
+  margin-top: 3px;
+  font-size: 1rem;
+  font-weight: 300;
+  transition: all 0.3s ease;
+  margin-left: 0px;
+  appearance: none;
+  background-image: url('data:image/svg+xml;utf8,<svg fill="%238c8c8c" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/></svg>');
+  background-repeat: no-repeat;
+  background-position: right 10px top 50%;
+  background-size: 12px;
+}
+.questionnaire .form__container .form option {
+  font-family: "lato", Helvetica, sans-serif;
+  font-size: 1rem;
+  font-weight: 300;
+  color: #3B6A8B;
+  background-color: #fff;
+  padding: 5px 15px;
+}
 
 meter {
   width: 400px;
@@ -17280,6 +17311,14 @@ meter::-webkit-meter-optimum-value {
       this.visitedNodes = [];
       this.hubspotId = "40834387";
     }
+    get providers() {
+      return this.getAttribute("providers")?.split(",") || [];
+    }
+    set providers(value) {
+      if (value !== null && value !== void 0) {
+        this.setAttribute("providers", value.join(","));
+      }
+    }
     get topic() {
       return `questionnaires:${this.siteId}`;
     }
@@ -17455,7 +17494,7 @@ meter::-webkit-meter-optimum-value {
             email,
             zip_code: this.zipCodeInput.value,
             phone_number: this.phoneInput.value,
-            insurance_provider: this.insuranceProviderInput.value
+            insurance_provider: this.insuranceProviderSelect.value
           }
         }));
       }
@@ -17506,6 +17545,10 @@ meter::-webkit-meter-optimum-value {
   __decorateClass([
     n5({ type: Boolean })
   ], QuestionnaireElement.prototype, "open", 2);
+  __decorateClass([
+    n5({ type: Array }),
+    liveStateConfig("providers")
+  ], QuestionnaireElement.prototype, "providers", 1);
   __decorateClass([
     i4("#question-modal")
   ], QuestionnaireElement.prototype, "modal", 2);
@@ -17526,7 +17569,7 @@ meter::-webkit-meter-optimum-value {
   ], QuestionnaireElement.prototype, "zipCodeInput", 2);
   __decorateClass([
     i4("#insurance_provider")
-  ], QuestionnaireElement.prototype, "insuranceProviderInput", 2);
+  ], QuestionnaireElement.prototype, "insuranceProviderSelect", 2);
   __decorateClass([
     i4("form")
   ], QuestionnaireElement.prototype, "contactInfoForm", 2);

package/dist/index.js

@@ -7105,6 +7105,37 @@ a:hover {
   transition: all 0.3s ease;
   margin-left: 0px;
 }
+.questionnaire .form__container .form select {
+  display: block;
+  font-family: "lato", Helvetica, sans-serif;
+  padding: 5px 15px;
+  width: 222.23px !important;
+  margin: 0 auto;
+  text-align: left;
+  height: 47px;
+  border: 1px solid #8c8c8c;
+  border-radius: 5px;
+  background-color: #fff;
+  margin-bottom: 20px;
+  margin-top: 3px;
+  font-size: 1rem;
+  font-weight: 300;
+  transition: all 0.3s ease;
+  margin-left: 0px;
+  appearance: none;
+  background-image: url('data:image/svg+xml;utf8,<svg fill="%238c8c8c" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/></svg>');
+  background-repeat: no-repeat;
+  background-position: right 10px top 50%;
+  background-size: 12px;
+}
+.questionnaire .form__container .form option {
+  font-family: "lato", Helvetica, sans-serif;
+  font-size: 1rem;
+  font-weight: 300;
+  color: #3B6A8B;
+  background-color: #fff;
+  padding: 5px 15px;
+}
 
 meter {
   width: 400px;
@@ -7469,6 +7500,14 @@ meter::-webkit-meter-optimum-value {
       this.visitedNodes = [];
       this.hubspotId = "40834387";
     }
+    get providers() {
+      return this.getAttribute("providers")?.split(",") || [];
+    }
+    set providers(value) {
+      if (value !== null && value !== void 0) {
+        this.setAttribute("providers", value.join(","));
+      }
+    }
     get topic() {
       return `questionnaires:${this.siteId}`;
     }
@@ -7644,7 +7683,7 @@ meter::-webkit-meter-optimum-value {
             email,
             zip_code: this.zipCodeInput.value,
             phone_number: this.phoneInput.value,
-            insurance_provider: this.insuranceProviderInput.value
+            insurance_provider: this.insuranceProviderSelect.value
           }
         }));
       }
@@ -7695,6 +7734,10 @@ meter::-webkit-meter-optimum-value {
   __decorateClass([
     n5({ type: Boolean })
   ], QuestionnaireElement.prototype, "open", 2);
+  __decorateClass([
+    n5({ type: Array }),
+    liveStateConfig("providers")
+  ], QuestionnaireElement.prototype, "providers", 1);
   __decorateClass([
     i4("#question-modal")
   ], QuestionnaireElement.prototype, "modal", 2);
@@ -7715,7 +7758,7 @@ meter::-webkit-meter-optimum-value {
   ], QuestionnaireElement.prototype, "zipCodeInput", 2);
   __decorateClass([
     i4("#insurance_provider")
-  ], QuestionnaireElement.prototype, "insuranceProviderInput", 2);
+  ], QuestionnaireElement.prototype, "insuranceProviderSelect", 2);
   __decorateClass([
     i4("form")
   ], QuestionnaireElement.prototype, "contactInfoForm", 2);

package/js/questionnaire.ts

@@ -202,11 +202,7 @@ export class QuestionnaireElement extends LitElement {
             </div>
             <div>
               <label for="insurance_provider">Insurance Provider</label>
-              <select id="insurance_provider" name="insurance_provider">
-                ${this.providers.map(provider => html`
-                  <option value="${provider}">${provider}</option>
-                `)}
-              </select>
+              <input type="text" id="insurance_provider" name="insurance_provider"/>
             </div>
           </div>
           <div class="footer u-text-center">

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "pr360-questionnaire",
   "description": "An element to render a questionnaire for PatientReach 360.",
-  "version": "2.1.3",
+  "version": "2.1.5",
   "main": "dist/index.js",
   "author": {
     "email": "chris@launchscout.com",