@vonage/vivid 3.27.0 → 3.28.2

package/shared/form-elements.js

@@ -1,13 +1,9 @@
-import { _ as __decorate, a as attr, b as __metadata, o as observable, S as volatile, h as html, V as __classPrivateFieldGet, W as __classPrivateFieldSet } from './index.js';
+import { _ as __decorate, a as attr, b as __metadata, o as observable, v as volatile, h as html, d as __classPrivateFieldGet, f as __classPrivateFieldSet } from './index.js';
 import { I as Icon } from './icon.js';
 import { w as when } from './when.js';
 
-var css_248z = "/**\n * Do not edit directly\n * Generated on Thu, 03 Aug 2023 09:40:18 GMT\n */\n.message {\n  display: flex;\n  contain: inline-size;\n  font: var(--vvd-typography-base-condensed);\n  gap: 4px;\n  grid-column: 1/-1;\n}\n.message-text {\n  color: var(--vvd-color-canvas-text);\n}\n.helper-message .message-text {\n  color: var(--_low-ink-color);\n}\n.message-icon {\n  font-size: 16px;\n}\n.success-message .message-icon {\n  color: var(--vvd-color-success-500);\n}\n.error-message .message-icon {\n  color: var(--vvd-color-alert-500);\n}";
+var css_248z = "/**\n * Do not edit directly\n * Generated on Mon, 07 Aug 2023 18:00:27 GMT\n */\n.message {\n  display: flex;\n  contain: inline-size;\n  font: var(--vvd-typography-base-condensed);\n  gap: 4px;\n  grid-column: 1/-1;\n}\n.message-text {\n  color: var(--vvd-color-canvas-text);\n}\n.helper-message .message-text {\n  color: var(--_low-ink-color);\n}\n.message-icon {\n  font-size: 16px;\n}\n.success-message .message-icon {\n  color: var(--vvd-color-success-500);\n}\n.error-message .message-icon {\n  color: var(--vvd-color-alert-500);\n}";
 
-let _2 = t => t,
-  _t,
-  _t2,
-  _t3;
 const ElementInternalsKey = 'ElementInternals';
 const supportsElementInternals = () => ElementInternalsKey in window && 'setFormValue' in window[ElementInternalsKey].prototype;
 class FormElementHelperText {}
@@ -30,6 +26,9 @@ __decorate([attr({
 function formElements(constructor) {
   var _Decorated_blurred, _Decorated_handleInvalidEvent;
   class Decorated extends constructor {
+    get errorValidationMessage() {
+      return this.userValid ? '' : this.validationMessage;
+    }
     constructor(...args) {
       super(...args);
       this.userValid = true;
@@ -62,9 +61,6 @@ function formElements(constructor) {
         this.proxy.dispatchEvent(new Event('invalid'));
       });
     }
-    get errorValidationMessage() {
-      return this.userValid ? '' : this.validationMessage;
-    }
     connectedCallback() {
       var _a;
       (_a = super.connectedCallback) === null || _a === void 0 ? void 0 : _a.call(this);
@@ -103,25 +99,25 @@ function getFeedbackTemplate(messageType, context) {
   const iconTag = context.tagFor(Icon);
   const messageTypeConfig = MessageTypeMap[messageType];
   const iconType = messageTypeConfig.iconType;
-  return html(_t || (_t = _2`
+  return html`
 			<style>
-				${0}
+				${css_248z}
 
 			</style>
-			<div class="message ${0}-message">
-		  	${0}
-				${0}
-			</div>`), css_248z, MessageTypeMap[messageType].className, when(() => iconType, html(_t2 || (_t2 = _2`
-					  <${0} class="message-icon" name="${0}"></${0}>`), iconTag, iconType, iconTag)), feedbackMessage({
+			<div class="message ${MessageTypeMap[messageType].className}-message">
+		  	${when(() => iconType, html`
+					  <${iconTag} class="message-icon" name="${iconType}"></${iconTag}>`)}
+				${feedbackMessage({
     messageProperty: MessageTypeMap[messageType].messageProperty
-  }));
+  })}
+			</div>`;
 }
 function feedbackMessage({
   messageProperty
 }) {
-  return html(_t3 || (_t3 = _2`
-	  <span class="message-text">${0}</span>
-	`), x => x[messageProperty]);
+  return html`
+	  <span class="message-text">${x => x[messageProperty]}</span>
+	`;
 }
 function errorText(constructor) {
   var _Decorated_shouldValidate, _Decorated_prevSuccessText;