@heartlandone/vega 2.0.0-temp-test-0.2 → 2.0.0

package/dist/esm/vega-form.entry.js

@@ -1,20 +1,24 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-fe904372.js';
-import { F as FormFieldControllerSlimmer } from './formFieldControllerSlimmer-271ec868.js';
-import { C as ChangeManager, g as FORM_FIELD_ELEMENT_DISCONNECTED, f as FORM_FIELD_PENDING_VALID_CHANGE, h as FORM_RESET_OPERATION_TRIGGERED, F as FORM_SUBMIT, a as FORM_RESET } from './changeManager-db36e47a.js';
-import { O as Observer } from './observer-8ff2bb65.js';
-import { e as isObjectArrayLike } from './array-195d7d64.js';
-import { s as sanitizeVegaComponent } from './component-f8ef7dc9.js';
-import { f as findParent, c as isElementVisible, d as isParent } from './ui-8bf12791.js';
-import './vega-slimmer-c8580d54.js';
-import './map-to-component-method-56335038.js';
-import './featureFlagController-1a4a4ffc.js';
-import './log-a824be80.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-c3505689.js';
+import { F as FormFieldControllerSlimmer, V as VegaInternalValid } from './formFieldControllerSlimmer-862c5c79.js';
+import { C as ChangeManager } from './changeManager-935d420b.js';
+import { c as createEventEmitSlimmer, O as Observer, d as domNodeSubjectFactory } from './eventEmitSlimmer-d605ac81.js';
+import { g as FORM_ELEMENT_VALIDATE, b as FORM_ELEMENT_VALUE_CHANGE, d as FORM_FIELD_ELEMENT_DISCONNECTED, c as FORM_FIELD_PENDING_VALID_CHANGE, e as FORM_RESET_OPERATION_TRIGGERED, F as FORM_SUBMIT, a as FORM_RESET } from './staticSubjectTitle-bb1e9570.js';
+import { i as isObjectArrayLike } from './array-e1522673.js';
+import { s as sanitizeVegaComponent } from './component-e4eb3f14.js';
+import { f as findParent, i as isElementVisible, c as isParent } from './ui-6e5294cb.js';
+import { I as InjectVegaSlimmer } from './global-slimmer-registry-b91c742d.js';
+import { I as InjectVegaGlobalSlimmer } from './inject-vega-global-slimmer-c3f84156.js';
+import { C as ChildNodesEventPreventSlimmer } from './childNodesEventPreventSlimmer-65a53b20.js';
+import { k as VegaFormSubmit, l as VegaFormReset, m as VegaValidate } from './internalVegaEventManager-efa77ebb.js';
+import { C as ChildNodesNotifyObserverSlimmer } from './childNodesNotifyObserverSlimmer-0d2eac09.js';
+import './vega-slimmer-ce2e45d1.js';
 import './string-be824360.js';
-import './misc-9fdbcfbb.js';
-import './dynamic-slimmer-4388f10d.js';
-import './pageResizeObserverSlimmer-99474370.js';
-import './breakpoints-3911666a.js';
-import './breakpoints-0aae54ba.js';
+import './misc-c21a85c9.js';
+import './dynamic-slimmer-c8ad78de.js';
+import './pageResizeObserverSlimmer-b476bb1f.js';
+import './breakpoints-900a4c99.js';
+import './ui-535c5fb3.js';
+import './log-a824be80.js';
 import './number-400b3bf2.js';
 
 /** The `ImmutableMap` class is a TypeScript implementation of an immutable map data structure that allows for mutation through a `withMutation` method. */
@@ -125,12 +129,41 @@ class ImmutableMap {
 
 const vegaFormCss = ":host{display:block}";
 
+var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
+    r = Reflect.decorate(decorators, target, key, desc);
+  else
+    for (var i = decorators.length - 1; i >= 0; i--)
+      if (d = decorators[i])
+        r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
 const VegaForm = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.vegaValidate = createEvent(this, "vegaValidate", 7);
+    this.validate = createEvent(this, "validate", 7);
     this.vegaFormSubmit = createEvent(this, "vegaFormSubmit", 7);
+    this.formSubmit = createEvent(this, "formSubmit", 7);
     this.vegaFormReset = createEvent(this, "vegaFormReset", 7);
+    this.formReset = createEvent(this, "formReset", 7);
+    this.globalSlimmers = {};
+    this.submitEventEmitter = createEventEmitSlimmer(VegaForm, VegaFormSubmit);
+    this.resetEventEmitter = createEventEmitSlimmer(VegaForm, VegaFormReset);
+    this.validateEventEmitter = createEventEmitSlimmer(VegaForm, VegaValidate);
+    this.childEventPrevent = new ChildNodesEventPreventSlimmer([VegaFormSubmit, VegaFormReset], () => this.host.querySelector('vega-form'), {
+      customPreventHandle: (e) => {
+        e.stopPropagation();
+      },
+    });
+    this.childFormValidateEventPrevent = new ChildNodesEventPreventSlimmer([VegaValidate], () => this.host, {
+      customPreventHandle: (e) => {
+        e.stopPropagation();
+      },
+    });
+    this.childNotifyObserver = new ChildNodesNotifyObserverSlimmer(FORM_ELEMENT_VALIDATE, (input) => this.updateInternalValidStatus(input));
+    this.childNodeValueChangeObserver = new ChildNodesNotifyObserverSlimmer(FORM_ELEMENT_VALUE_CHANGE, () => this.updateInternalTouchedStatus());
     this.invalidFieldPathMap = new ImmutableMap(new Map(), (newMap) => {
       this.invalidFieldPathMap = newMap;
       this.updateIsValidFlag();
@@ -173,13 +206,36 @@ const VegaForm = class {
      *   3. When invoking the `setValue` method, this parameter is set to `false`.
      */
     this.isTouched = false;
+    /**
+     * If the element is valid, remove it from the set of
+     *    invalid elements. If the element is invalid,
+     *    add it to the set of invalid elements.
+     *
+     * @param {NotifyObserverPayload<boolean>} payload - CustomEvent<boolean> the vegaValidate subject notify from child elements
+     */
+    this.updateInternalValidStatus = (payload) => {
+      if (payload.host !== this.host) {
+        const target = payload.host;
+        const isElementValid = payload.detail;
+        if (FormFieldControllerSlimmer.isValidFormField(target) &&
+          this.shouldVisitElement(target, false, false)) {
+          if (isElementValid) {
+            this.invalidFieldPathMap.delete(target);
+          }
+          else {
+            this.invalidFieldPathMap.set(target, target.dataset['vegaForm']);
+          }
+        }
+      }
+    };
   }
   watchIsValid() {
-    this.vegaValidate.emit(this.isValid);
+    this.validateEventEmitter.emit(this.isValid);
+    ChangeManager.notify(FORM_ELEMENT_VALIDATE, { host: this.host, detail: this.isValid });
   }
   /**
    * When the vegaForm is deleted, it is necessary to notify
-   *    the parent's vegaForm update isValid.
+   *    the parent's vegaForm to update its isValid status.
    */
   async disconnectedCallback() {
     ChangeManager.notify(FORM_FIELD_ELEMENT_DISCONNECTED, {
@@ -198,46 +254,6 @@ const VegaForm = class {
     this.registerFormSubmitChangeManager();
     this.registerFormResetChangeManager();
     this.registerFormFieldPendingValidChangeManager();
-    this.preventNestFormEvent();
-  }
-  vegaValidateEvent(event) {
-    if (event.target === this.host) {
-      event.stopPropagation();
-    }
-  }
-  /**
-   * If the element is valid, remove it from the set of
-   *    invalid elements. If the element is invalid,
-   *    add it to the set of invalid elements.
-   *
-   * @param event - CustomEvent<boolean> the vegaValidate event emitted from child elements
-   */
-  updateInternalValidStatus(event) {
-    if (event.target === this.host) {
-      return;
-    }
-    if (event.target['tagName'] !== 'VEGA-FORM' &&
-      findParent(event.target, 'vega-form') === this.host) {
-      event.stopPropagation();
-    }
-    const target = event.target;
-    const isElementValid = event.detail;
-    if (FormFieldControllerSlimmer.isValidFormField(target) &&
-      this.shouldVisitElement(target, false, false)) {
-      if (isElementValid) {
-        this.invalidFieldPathMap.delete(target);
-      }
-      else {
-        this.invalidFieldPathMap.set(target, target.dataset['vegaForm']);
-      }
-    }
-  }
-  /**
-   * If the value of any child elements have changed,
-   *    make 'isTouched' prop as false.
-   */
-  updateInternalTouchedStatus() {
-    this.isTouched = true;
   }
   /**
    * Invoke this method asynchronously to retrieve the validation result for
@@ -252,15 +268,16 @@ const VegaForm = class {
   async valid(showError = true) {
     const result = { isValid: true, invalidFields: [] };
     await this.navigateVegaFormChildren(async (element, isForm) => {
-      if (typeof element['valid'] === 'function') {
-        if (isForm) {
-          const nestedFormValidationResult = await element.valid(showError);
-          if (!nestedFormValidationResult.isValid) {
-            result.isValid = false;
-            result.invalidFields.push(...nestedFormValidationResult.invalidFields);
-          }
+      if (typeof element['valid'] === 'function' && isForm) {
+        const nestedFormValidationResult = await element.valid(showError);
+        if (!nestedFormValidationResult.isValid) {
+          result.isValid = false;
+          result.invalidFields.push(...nestedFormValidationResult.invalidFields);
         }
-        else if (!(await element['valid'](showError))) {
+      }
+      else {
+        const isValid = await this.handleChildFormFieldElementValid(element, showError);
+        if (!isValid) {
           result.isValid = false;
           result.invalidFields.push(this.getFormFieldName(element));
         }
@@ -347,6 +364,13 @@ const VegaForm = class {
   render() {
     return sanitizeVegaComponent(h(Host, null, h("slot", null)), this.host);
   }
+  /**
+   * If the value of any child elements have changed,
+   *    make 'isTouched' prop as false.
+   */
+  updateInternalTouchedStatus() {
+    this.isTouched = true;
+  }
   /**
    * Navigate the immediate child node under current vega form element with the following strategy
    *  - if a matched vega field element found, will pass it to the visitor method passed in
@@ -457,7 +481,8 @@ const VegaForm = class {
   async handleSubmitEvents() {
     const valid = await this.valid();
     if (valid.isValid) {
-      this.vegaFormSubmit.emit(await this.getValue());
+      const formValue = await this.getValue();
+      this.submitEventEmitter.emit(formValue);
     }
   }
   registerFormResetChangeManager() {
@@ -469,7 +494,7 @@ const VegaForm = class {
   }
   async handleResetEvents() {
     await this.reset();
-    this.vegaFormReset.emit();
+    this.resetEventEmitter.emit();
   }
   registerFormFieldPendingValidChangeManager() {
     this.formFieldPendingValidObserver = new Observer(this.canAcceptFormFieldPendingValid.bind(this), this.handleFieldPendingValid.bind(this));
@@ -489,22 +514,51 @@ const VegaForm = class {
   isElementInCurrentForm(element) {
     return this.invalidFieldPathMap.has(element) || isParent(element, this.host);
   }
-  preventNestFormEvent() {
-    const nestForm = this.host.querySelector('vega-form');
-    if (nestForm) {
-      nestForm.addEventListener('vegaFormSubmit', (e) => {
-        e.stopPropagation();
-      });
-      nestForm.addEventListener('vegaFormReset', (e) => {
-        e.stopPropagation();
+  async handleChildFormFieldElementValid(element, showError) {
+    const subject = domNodeSubjectFactory.getSubject(element, VegaInternalValid);
+    const isValid = await new Promise((resolve) => {
+      //This setTimeout method here to avoid the dom node subject observer not existing and blocks the promise status
+      const timerId = setTimeout(() => {
+        resolve(true);
+      }, 2000);
+      ChangeManager.notify(subject, {
+        host: element,
+        message: showError,
+        promiseResolve: resolve,
+        timerId,
       });
-    }
+    });
+    return isValid;
   }
   get host() { return getElement(this); }
   static get watchers() { return {
     "isValid": ["watchIsValid"]
   }; }
 };
+__decorate([
+  InjectVegaGlobalSlimmer()
+], VegaForm.prototype, "globalSlimmers", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaForm.prototype, "submitEventEmitter", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaForm.prototype, "resetEventEmitter", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaForm.prototype, "validateEventEmitter", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaForm.prototype, "childEventPrevent", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaForm.prototype, "childFormValidateEventPrevent", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaForm.prototype, "childNotifyObserver", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaForm.prototype, "childNodeValueChangeObserver", void 0);
 VegaForm.style = vegaFormCss;
 
 export { VegaForm as vega_form };

package/dist/esm/vega-grid.entry.js

@@ -0,0 +1,85 @@
+import { r as registerInstance, h, H as Host, g as getElement } from './index-c3505689.js';
+import { f as formatAndValidResponsiveToken } from './designToken-9b27a244.js';
+import { s as sanitizeVegaComponent } from './component-e4eb3f14.js';
+import { a as arrayToClassString } from './ui-6e5294cb.js';
+import './global-slimmer-registry-b91c742d.js';
+import { I as InjectVegaGlobalSlimmer } from './inject-vega-global-slimmer-c3f84156.js';
+import './typeGuard-5e282437.js';
+import './breakpoints-900a4c99.js';
+import './ui-535c5fb3.js';
+import './typography-03d285b4.js';
+import './log-a824be80.js';
+import './responsiveFormatFacade-e91e14ac.js';
+import './number-400b3bf2.js';
+
+const vegaGridCss = ":host(.v-gap-0),.v-gap-0{gap:0px}:host(.v-gap-size-0),.v-gap-size-0{gap:0px}:host(.v-gap-size-4),.v-gap-size-4{gap:4px}:host(.v-gap-size-8),.v-gap-size-8{gap:8px}:host(.v-gap-size-12),.v-gap-size-12{gap:12px}:host(.v-gap-size-16),.v-gap-size-16{gap:16px}:host(.v-gap-size-20),.v-gap-size-20{gap:20px}:host(.v-gap-size-24),.v-gap-size-24{gap:24px}:host(.v-gap-size-32),.v-gap-size-32{gap:32px}:host(.v-gap-size-40),.v-gap-size-40{gap:40px}:host(.v-gap-size-48),.v-gap-size-48{gap:48px}:host(.v-gap-size-64),.v-gap-size-64{gap:64px}:host(.v-gap-size-72),.v-gap-size-72{gap:72px}:host(.v-gap-size-80),.v-gap-size-80{gap:80px}:host(.v-gap-size-112),.v-gap-size-112{gap:112px}:host(.v-gap-size-2),.v-gap-size-2{gap:2px}@media (min-width: 320px){:host(.S\\:v-gap-0),.S\\:v-gap-0{gap:0px}:host(.S\\:v-gap-size-0),.S\\:v-gap-size-0{gap:0px}:host(.S\\:v-gap-size-4),.S\\:v-gap-size-4{gap:4px}:host(.S\\:v-gap-size-8),.S\\:v-gap-size-8{gap:8px}:host(.S\\:v-gap-size-12),.S\\:v-gap-size-12{gap:12px}:host(.S\\:v-gap-size-16),.S\\:v-gap-size-16{gap:16px}:host(.S\\:v-gap-size-20),.S\\:v-gap-size-20{gap:20px}:host(.S\\:v-gap-size-24),.S\\:v-gap-size-24{gap:24px}:host(.S\\:v-gap-size-32),.S\\:v-gap-size-32{gap:32px}:host(.S\\:v-gap-size-40),.S\\:v-gap-size-40{gap:40px}:host(.S\\:v-gap-size-48),.S\\:v-gap-size-48{gap:48px}:host(.S\\:v-gap-size-64),.S\\:v-gap-size-64{gap:64px}:host(.S\\:v-gap-size-72),.S\\:v-gap-size-72{gap:72px}:host(.S\\:v-gap-size-80),.S\\:v-gap-size-80{gap:80px}:host(.S\\:v-gap-size-112),.S\\:v-gap-size-112{gap:112px}:host(.S\\:v-gap-size-2),.S\\:v-gap-size-2{gap:2px}}@media (min-width: 768px){:host(.M\\:v-gap-0),.M\\:v-gap-0{gap:0px}:host(.M\\:v-gap-size-0),.M\\:v-gap-size-0{gap:0px}:host(.M\\:v-gap-size-4),.M\\:v-gap-size-4{gap:4px}:host(.M\\:v-gap-size-8),.M\\:v-gap-size-8{gap:8px}:host(.M\\:v-gap-size-12),.M\\:v-gap-size-12{gap:12px}:host(.M\\:v-gap-size-16),.M\\:v-gap-size-16{gap:16px}:host(.M\\:v-gap-size-20),.M\\:v-gap-size-20{gap:20px}:host(.M\\:v-gap-size-24),.M\\:v-gap-size-24{gap:24px}:host(.M\\:v-gap-size-32),.M\\:v-gap-size-32{gap:32px}:host(.M\\:v-gap-size-40),.M\\:v-gap-size-40{gap:40px}:host(.M\\:v-gap-size-48),.M\\:v-gap-size-48{gap:48px}:host(.M\\:v-gap-size-64),.M\\:v-gap-size-64{gap:64px}:host(.M\\:v-gap-size-72),.M\\:v-gap-size-72{gap:72px}:host(.M\\:v-gap-size-80),.M\\:v-gap-size-80{gap:80px}:host(.M\\:v-gap-size-112),.M\\:v-gap-size-112{gap:112px}:host(.M\\:v-gap-size-2),.M\\:v-gap-size-2{gap:2px}}@media (min-width: 1024px){:host(.L\\:v-gap-0),.L\\:v-gap-0{gap:0px}:host(.L\\:v-gap-size-0),.L\\:v-gap-size-0{gap:0px}:host(.L\\:v-gap-size-4),.L\\:v-gap-size-4{gap:4px}:host(.L\\:v-gap-size-8),.L\\:v-gap-size-8{gap:8px}:host(.L\\:v-gap-size-12),.L\\:v-gap-size-12{gap:12px}:host(.L\\:v-gap-size-16),.L\\:v-gap-size-16{gap:16px}:host(.L\\:v-gap-size-20),.L\\:v-gap-size-20{gap:20px}:host(.L\\:v-gap-size-24),.L\\:v-gap-size-24{gap:24px}:host(.L\\:v-gap-size-32),.L\\:v-gap-size-32{gap:32px}:host(.L\\:v-gap-size-40),.L\\:v-gap-size-40{gap:40px}:host(.L\\:v-gap-size-48),.L\\:v-gap-size-48{gap:48px}:host(.L\\:v-gap-size-64),.L\\:v-gap-size-64{gap:64px}:host(.L\\:v-gap-size-72),.L\\:v-gap-size-72{gap:72px}:host(.L\\:v-gap-size-80),.L\\:v-gap-size-80{gap:80px}:host(.L\\:v-gap-size-112),.L\\:v-gap-size-112{gap:112px}:host(.L\\:v-gap-size-2),.L\\:v-gap-size-2{gap:2px}}@media (min-width: 1440px){:host(.XL\\:v-gap-0),.XL\\:v-gap-0{gap:0px}:host(.XL\\:v-gap-size-0),.XL\\:v-gap-size-0{gap:0px}:host(.XL\\:v-gap-size-4),.XL\\:v-gap-size-4{gap:4px}:host(.XL\\:v-gap-size-8),.XL\\:v-gap-size-8{gap:8px}:host(.XL\\:v-gap-size-12),.XL\\:v-gap-size-12{gap:12px}:host(.XL\\:v-gap-size-16),.XL\\:v-gap-size-16{gap:16px}:host(.XL\\:v-gap-size-20),.XL\\:v-gap-size-20{gap:20px}:host(.XL\\:v-gap-size-24),.XL\\:v-gap-size-24{gap:24px}:host(.XL\\:v-gap-size-32),.XL\\:v-gap-size-32{gap:32px}:host(.XL\\:v-gap-size-40),.XL\\:v-gap-size-40{gap:40px}:host(.XL\\:v-gap-size-48),.XL\\:v-gap-size-48{gap:48px}:host(.XL\\:v-gap-size-64),.XL\\:v-gap-size-64{gap:64px}:host(.XL\\:v-gap-size-72),.XL\\:v-gap-size-72{gap:72px}:host(.XL\\:v-gap-size-80),.XL\\:v-gap-size-80{gap:80px}:host(.XL\\:v-gap-size-112),.XL\\:v-gap-size-112{gap:112px}:host(.XL\\:v-gap-size-2),.XL\\:v-gap-size-2{gap:2px}}:host{display:grid}:host(.v-grid-rows-1){grid-template-rows:repeat(1, minmax(0, 1fr))}:host(.v-grid-rows-2){grid-template-rows:repeat(2, minmax(0, 1fr))}:host(.v-grid-rows-3){grid-template-rows:repeat(3, minmax(0, 1fr))}:host(.v-grid-rows-4){grid-template-rows:repeat(4, minmax(0, 1fr))}:host(.v-grid-rows-5){grid-template-rows:repeat(5, minmax(0, 1fr))}:host(.v-grid-rows-6){grid-template-rows:repeat(6, minmax(0, 1fr))}:host(.v-grid-rows-7){grid-template-rows:repeat(7, minmax(0, 1fr))}:host(.v-grid-rows-8){grid-template-rows:repeat(8, minmax(0, 1fr))}:host(.v-grid-rows-9){grid-template-rows:repeat(9, minmax(0, 1fr))}:host(.v-grid-rows-10){grid-template-rows:repeat(10, minmax(0, 1fr))}:host(.v-grid-rows-11){grid-template-rows:repeat(11, minmax(0, 1fr))}:host(.v-grid-rows-12){grid-template-rows:repeat(12, minmax(0, 1fr))}:host(.v-grid-rows-1-auto){grid-template-rows:repeat(1, auto)}:host(.v-grid-rows-2-auto){grid-template-rows:repeat(2, auto)}:host(.v-grid-rows-3-auto){grid-template-rows:repeat(3, auto)}:host(.v-grid-rows-4-auto){grid-template-rows:repeat(4, auto)}:host(.v-grid-rows-5-auto){grid-template-rows:repeat(5, auto)}:host(.v-grid-rows-6-auto){grid-template-rows:repeat(6, auto)}:host(.v-grid-rows-7-auto){grid-template-rows:repeat(7, auto)}:host(.v-grid-rows-8-auto){grid-template-rows:repeat(8, auto)}:host(.v-grid-rows-9-auto){grid-template-rows:repeat(9, auto)}:host(.v-grid-rows-10-auto){grid-template-rows:repeat(1, auto)}:host(.v-grid-rows-11-auto){grid-template-rows:repeat(1, auto)}:host(.v-grid-rows-12-auto){grid-template-rows:repeat(1, auto)}:host(.v-grid-cols-1){grid-template-columns:repeat(1, minmax(0, 1fr))}:host(.v-grid-cols-2){grid-template-columns:repeat(2, minmax(0, 1fr))}:host(.v-grid-cols-3){grid-template-columns:repeat(3, minmax(0, 1fr))}:host(.v-grid-cols-4){grid-template-columns:repeat(4, minmax(0, 1fr))}:host(.v-grid-cols-5){grid-template-columns:repeat(5, minmax(0, 1fr))}:host(.v-grid-cols-6){grid-template-columns:repeat(6, minmax(0, 1fr))}:host(.v-grid-cols-7){grid-template-columns:repeat(7, minmax(0, 1fr))}:host(.v-grid-cols-8){grid-template-columns:repeat(8, minmax(0, 1fr))}:host(.v-grid-cols-9){grid-template-columns:repeat(9, minmax(0, 1fr))}:host(.v-grid-cols-10){grid-template-columns:repeat(10, minmax(0, 1fr))}:host(.v-grid-cols-11){grid-template-columns:repeat(11, minmax(0, 1fr))}:host(.v-grid-cols-12){grid-template-columns:repeat(12, minmax(0, 1fr))}:host(.v-grid-cols-1-auto){grid-template-columns:repeat(1, auto)}:host(.v-grid-cols-2-auto){grid-template-columns:repeat(2, auto)}:host(.v-grid-cols-3-auto){grid-template-columns:repeat(3, auto)}:host(.v-grid-cols-4-auto){grid-template-columns:repeat(4, auto)}:host(.v-grid-cols-5-auto){grid-template-columns:repeat(5, auto)}:host(.v-grid-cols-6-auto){grid-template-columns:repeat(6, auto)}:host(.v-grid-cols-7-auto){grid-template-columns:repeat(7, auto)}:host(.v-grid-cols-8-auto){grid-template-columns:repeat(8, auto)}:host(.v-grid-cols-9-auto){grid-template-columns:repeat(9, auto)}:host(.v-grid-cols-10-auto){grid-template-columns:repeat(1, auto)}:host(.v-grid-cols-11-auto){grid-template-columns:repeat(1, auto)}:host(.v-grid-cols-12-auto){grid-template-columns:repeat(1, auto)}@media (min-width: 320px){:host(.S\\:v-grid-rows-1){grid-template-rows:repeat(1, minmax(0, 1fr))}:host(.S\\:v-grid-rows-2){grid-template-rows:repeat(2, minmax(0, 1fr))}:host(.S\\:v-grid-rows-3){grid-template-rows:repeat(3, minmax(0, 1fr))}:host(.S\\:v-grid-rows-4){grid-template-rows:repeat(4, minmax(0, 1fr))}:host(.S\\:v-grid-rows-5){grid-template-rows:repeat(5, minmax(0, 1fr))}:host(.S\\:v-grid-rows-6){grid-template-rows:repeat(6, minmax(0, 1fr))}:host(.S\\:v-grid-rows-7){grid-template-rows:repeat(7, minmax(0, 1fr))}:host(.S\\:v-grid-rows-8){grid-template-rows:repeat(8, minmax(0, 1fr))}:host(.S\\:v-grid-rows-9){grid-template-rows:repeat(9, minmax(0, 1fr))}:host(.S\\:v-grid-rows-10){grid-template-rows:repeat(10, minmax(0, 1fr))}:host(.S\\:v-grid-rows-11){grid-template-rows:repeat(11, minmax(0, 1fr))}:host(.S\\:v-grid-rows-12){grid-template-rows:repeat(12, minmax(0, 1fr))}:host(.S\\:v-grid-rows-1-auto){grid-template-rows:repeat(1, auto)}:host(.S\\:v-grid-rows-2-auto){grid-template-rows:repeat(2, auto)}:host(.S\\:v-grid-rows-3-auto){grid-template-rows:repeat(3, auto)}:host(.S\\:v-grid-rows-4-auto){grid-template-rows:repeat(4, auto)}:host(.S\\:v-grid-rows-5-auto){grid-template-rows:repeat(5, auto)}:host(.S\\:v-grid-rows-6-auto){grid-template-rows:repeat(6, auto)}:host(.S\\:v-grid-rows-7-auto){grid-template-rows:repeat(7, auto)}:host(.S\\:v-grid-rows-8-auto){grid-template-rows:repeat(8, auto)}:host(.S\\:v-grid-rows-9-auto){grid-template-rows:repeat(9, auto)}:host(.S\\:v-grid-rows-10-auto){grid-template-rows:repeat(1, auto)}:host(.S\\:v-grid-rows-11-auto){grid-template-rows:repeat(1, auto)}:host(.S\\:v-grid-rows-12-auto){grid-template-rows:repeat(1, auto)}}@media (min-width: 768px){:host(.M\\:v-grid-rows-1){grid-template-rows:repeat(1, minmax(0, 1fr))}:host(.M\\:v-grid-rows-2){grid-template-rows:repeat(2, minmax(0, 1fr))}:host(.M\\:v-grid-rows-3){grid-template-rows:repeat(3, minmax(0, 1fr))}:host(.M\\:v-grid-rows-4){grid-template-rows:repeat(4, minmax(0, 1fr))}:host(.M\\:v-grid-rows-5){grid-template-rows:repeat(5, minmax(0, 1fr))}:host(.M\\:v-grid-rows-6){grid-template-rows:repeat(6, minmax(0, 1fr))}:host(.M\\:v-grid-rows-7){grid-template-rows:repeat(7, minmax(0, 1fr))}:host(.M\\:v-grid-rows-8){grid-template-rows:repeat(8, minmax(0, 1fr))}:host(.M\\:v-grid-rows-9){grid-template-rows:repeat(9, minmax(0, 1fr))}:host(.M\\:v-grid-rows-10){grid-template-rows:repeat(10, minmax(0, 1fr))}:host(.M\\:v-grid-rows-11){grid-template-rows:repeat(11, minmax(0, 1fr))}:host(.M\\:v-grid-rows-12){grid-template-rows:repeat(12, minmax(0, 1fr))}:host(.M\\:v-grid-rows-1-auto){grid-template-rows:repeat(1, auto)}:host(.M\\:v-grid-rows-2-auto){grid-template-rows:repeat(2, auto)}:host(.M\\:v-grid-rows-3-auto){grid-template-rows:repeat(3, auto)}:host(.M\\:v-grid-rows-4-auto){grid-template-rows:repeat(4, auto)}:host(.M\\:v-grid-rows-5-auto){grid-template-rows:repeat(5, auto)}:host(.M\\:v-grid-rows-6-auto){grid-template-rows:repeat(6, auto)}:host(.M\\:v-grid-rows-7-auto){grid-template-rows:repeat(7, auto)}:host(.M\\:v-grid-rows-8-auto){grid-template-rows:repeat(8, auto)}:host(.M\\:v-grid-rows-9-auto){grid-template-rows:repeat(9, auto)}:host(.M\\:v-grid-rows-10-auto){grid-template-rows:repeat(1, auto)}:host(.M\\:v-grid-rows-11-auto){grid-template-rows:repeat(1, auto)}:host(.M\\:v-grid-rows-12-auto){grid-template-rows:repeat(1, auto)}}@media (min-width: 1024px){:host(.L\\:v-grid-rows-1){grid-template-rows:repeat(1, minmax(0, 1fr))}:host(.L\\:v-grid-rows-2){grid-template-rows:repeat(2, minmax(0, 1fr))}:host(.L\\:v-grid-rows-3){grid-template-rows:repeat(3, minmax(0, 1fr))}:host(.L\\:v-grid-rows-4){grid-template-rows:repeat(4, minmax(0, 1fr))}:host(.L\\:v-grid-rows-5){grid-template-rows:repeat(5, minmax(0, 1fr))}:host(.L\\:v-grid-rows-6){grid-template-rows:repeat(6, minmax(0, 1fr))}:host(.L\\:v-grid-rows-7){grid-template-rows:repeat(7, minmax(0, 1fr))}:host(.L\\:v-grid-rows-8){grid-template-rows:repeat(8, minmax(0, 1fr))}:host(.L\\:v-grid-rows-9){grid-template-rows:repeat(9, minmax(0, 1fr))}:host(.L\\:v-grid-rows-10){grid-template-rows:repeat(10, minmax(0, 1fr))}:host(.L\\:v-grid-rows-11){grid-template-rows:repeat(11, minmax(0, 1fr))}:host(.L\\:v-grid-rows-12){grid-template-rows:repeat(12, minmax(0, 1fr))}:host(.L\\:v-grid-rows-1-auto){grid-template-rows:repeat(1, auto)}:host(.L\\:v-grid-rows-2-auto){grid-template-rows:repeat(2, auto)}:host(.L\\:v-grid-rows-3-auto){grid-template-rows:repeat(3, auto)}:host(.L\\:v-grid-rows-4-auto){grid-template-rows:repeat(4, auto)}:host(.L\\:v-grid-rows-5-auto){grid-template-rows:repeat(5, auto)}:host(.L\\:v-grid-rows-6-auto){grid-template-rows:repeat(6, auto)}:host(.L\\:v-grid-rows-7-auto){grid-template-rows:repeat(7, auto)}:host(.L\\:v-grid-rows-8-auto){grid-template-rows:repeat(8, auto)}:host(.L\\:v-grid-rows-9-auto){grid-template-rows:repeat(9, auto)}:host(.L\\:v-grid-rows-10-auto){grid-template-rows:repeat(1, auto)}:host(.L\\:v-grid-rows-11-auto){grid-template-rows:repeat(1, auto)}:host(.L\\:v-grid-rows-12-auto){grid-template-rows:repeat(1, auto)}}@media (min-width: 1440px){:host(.XL\\:v-grid-rows-1){grid-template-rows:repeat(1, minmax(0, 1fr))}:host(.XL\\:v-grid-rows-2){grid-template-rows:repeat(2, minmax(0, 1fr))}:host(.XL\\:v-grid-rows-3){grid-template-rows:repeat(3, minmax(0, 1fr))}:host(.XL\\:v-grid-rows-4){grid-template-rows:repeat(4, minmax(0, 1fr))}:host(.XL\\:v-grid-rows-5){grid-template-rows:repeat(5, minmax(0, 1fr))}:host(.XL\\:v-grid-rows-6){grid-template-rows:repeat(6, minmax(0, 1fr))}:host(.XL\\:v-grid-rows-7){grid-template-rows:repeat(7, minmax(0, 1fr))}:host(.XL\\:v-grid-rows-8){grid-template-rows:repeat(8, minmax(0, 1fr))}:host(.XL\\:v-grid-rows-9){grid-template-rows:repeat(9, minmax(0, 1fr))}:host(.XL\\:v-grid-rows-10){grid-template-rows:repeat(10, minmax(0, 1fr))}:host(.XL\\:v-grid-rows-11){grid-template-rows:repeat(11, minmax(0, 1fr))}:host(.XL\\:v-grid-rows-12){grid-template-rows:repeat(12, minmax(0, 1fr))}:host(.XL\\:v-grid-rows-1-auto){grid-template-rows:repeat(1, auto)}:host(.XL\\:v-grid-rows-2-auto){grid-template-rows:repeat(2, auto)}:host(.XL\\:v-grid-rows-3-auto){grid-template-rows:repeat(3, auto)}:host(.XL\\:v-grid-rows-4-auto){grid-template-rows:repeat(4, auto)}:host(.XL\\:v-grid-rows-5-auto){grid-template-rows:repeat(5, auto)}:host(.XL\\:v-grid-rows-6-auto){grid-template-rows:repeat(6, auto)}:host(.XL\\:v-grid-rows-7-auto){grid-template-rows:repeat(7, auto)}:host(.XL\\:v-grid-rows-8-auto){grid-template-rows:repeat(8, auto)}:host(.XL\\:v-grid-rows-9-auto){grid-template-rows:repeat(9, auto)}:host(.XL\\:v-grid-rows-10-auto){grid-template-rows:repeat(1, auto)}:host(.XL\\:v-grid-rows-11-auto){grid-template-rows:repeat(1, auto)}:host(.XL\\:v-grid-rows-12-auto){grid-template-rows:repeat(1, auto)}}@media (min-width: 320px){:host(.S\\:v-grid-cols-1){grid-template-columns:repeat(1, minmax(0, 1fr))}:host(.S\\:v-grid-cols-2){grid-template-columns:repeat(2, minmax(0, 1fr))}:host(.S\\:v-grid-cols-3){grid-template-columns:repeat(3, minmax(0, 1fr))}:host(.S\\:v-grid-cols-4){grid-template-columns:repeat(4, minmax(0, 1fr))}:host(.S\\:v-grid-cols-5){grid-template-columns:repeat(5, minmax(0, 1fr))}:host(.S\\:v-grid-cols-6){grid-template-columns:repeat(6, minmax(0, 1fr))}:host(.S\\:v-grid-cols-7){grid-template-columns:repeat(7, minmax(0, 1fr))}:host(.S\\:v-grid-cols-8){grid-template-columns:repeat(8, minmax(0, 1fr))}:host(.S\\:v-grid-cols-9){grid-template-columns:repeat(9, minmax(0, 1fr))}:host(.S\\:v-grid-cols-10){grid-template-columns:repeat(10, minmax(0, 1fr))}:host(.S\\:v-grid-cols-11){grid-template-columns:repeat(11, minmax(0, 1fr))}:host(.S\\:v-grid-cols-12){grid-template-columns:repeat(12, minmax(0, 1fr))}:host(.S\\:v-grid-cols-1-auto){grid-template-columns:repeat(1, auto)}:host(.S\\:v-grid-cols-2-auto){grid-template-columns:repeat(2, auto)}:host(.S\\:v-grid-cols-3-auto){grid-template-columns:repeat(3, auto)}:host(.S\\:v-grid-cols-4-auto){grid-template-columns:repeat(4, auto)}:host(.S\\:v-grid-cols-5-auto){grid-template-columns:repeat(5, auto)}:host(.S\\:v-grid-cols-6-auto){grid-template-columns:repeat(6, auto)}:host(.S\\:v-grid-cols-7-auto){grid-template-columns:repeat(7, auto)}:host(.S\\:v-grid-cols-8-auto){grid-template-columns:repeat(8, auto)}:host(.S\\:v-grid-cols-9-auto){grid-template-columns:repeat(9, auto)}:host(.S\\:v-grid-cols-10-auto){grid-template-columns:repeat(1, auto)}:host(.S\\:v-grid-cols-11-auto){grid-template-columns:repeat(1, auto)}:host(.S\\:v-grid-cols-12-auto){grid-template-columns:repeat(1, auto)}}@media (min-width: 768px){:host(.M\\:v-grid-cols-1){grid-template-columns:repeat(1, minmax(0, 1fr))}:host(.M\\:v-grid-cols-2){grid-template-columns:repeat(2, minmax(0, 1fr))}:host(.M\\:v-grid-cols-3){grid-template-columns:repeat(3, minmax(0, 1fr))}:host(.M\\:v-grid-cols-4){grid-template-columns:repeat(4, minmax(0, 1fr))}:host(.M\\:v-grid-cols-5){grid-template-columns:repeat(5, minmax(0, 1fr))}:host(.M\\:v-grid-cols-6){grid-template-columns:repeat(6, minmax(0, 1fr))}:host(.M\\:v-grid-cols-7){grid-template-columns:repeat(7, minmax(0, 1fr))}:host(.M\\:v-grid-cols-8){grid-template-columns:repeat(8, minmax(0, 1fr))}:host(.M\\:v-grid-cols-9){grid-template-columns:repeat(9, minmax(0, 1fr))}:host(.M\\:v-grid-cols-10){grid-template-columns:repeat(10, minmax(0, 1fr))}:host(.M\\:v-grid-cols-11){grid-template-columns:repeat(11, minmax(0, 1fr))}:host(.M\\:v-grid-cols-12){grid-template-columns:repeat(12, minmax(0, 1fr))}:host(.M\\:v-grid-cols-1-auto){grid-template-columns:repeat(1, auto)}:host(.M\\:v-grid-cols-2-auto){grid-template-columns:repeat(2, auto)}:host(.M\\:v-grid-cols-3-auto){grid-template-columns:repeat(3, auto)}:host(.M\\:v-grid-cols-4-auto){grid-template-columns:repeat(4, auto)}:host(.M\\:v-grid-cols-5-auto){grid-template-columns:repeat(5, auto)}:host(.M\\:v-grid-cols-6-auto){grid-template-columns:repeat(6, auto)}:host(.M\\:v-grid-cols-7-auto){grid-template-columns:repeat(7, auto)}:host(.M\\:v-grid-cols-8-auto){grid-template-columns:repeat(8, auto)}:host(.M\\:v-grid-cols-9-auto){grid-template-columns:repeat(9, auto)}:host(.M\\:v-grid-cols-10-auto){grid-template-columns:repeat(1, auto)}:host(.M\\:v-grid-cols-11-auto){grid-template-columns:repeat(1, auto)}:host(.M\\:v-grid-cols-12-auto){grid-template-columns:repeat(1, auto)}}@media (min-width: 1024px){:host(.L\\:v-grid-cols-1){grid-template-columns:repeat(1, minmax(0, 1fr))}:host(.L\\:v-grid-cols-2){grid-template-columns:repeat(2, minmax(0, 1fr))}:host(.L\\:v-grid-cols-3){grid-template-columns:repeat(3, minmax(0, 1fr))}:host(.L\\:v-grid-cols-4){grid-template-columns:repeat(4, minmax(0, 1fr))}:host(.L\\:v-grid-cols-5){grid-template-columns:repeat(5, minmax(0, 1fr))}:host(.L\\:v-grid-cols-6){grid-template-columns:repeat(6, minmax(0, 1fr))}:host(.L\\:v-grid-cols-7){grid-template-columns:repeat(7, minmax(0, 1fr))}:host(.L\\:v-grid-cols-8){grid-template-columns:repeat(8, minmax(0, 1fr))}:host(.L\\:v-grid-cols-9){grid-template-columns:repeat(9, minmax(0, 1fr))}:host(.L\\:v-grid-cols-10){grid-template-columns:repeat(10, minmax(0, 1fr))}:host(.L\\:v-grid-cols-11){grid-template-columns:repeat(11, minmax(0, 1fr))}:host(.L\\:v-grid-cols-12){grid-template-columns:repeat(12, minmax(0, 1fr))}:host(.L\\:v-grid-cols-1-auto){grid-template-columns:repeat(1, auto)}:host(.L\\:v-grid-cols-2-auto){grid-template-columns:repeat(2, auto)}:host(.L\\:v-grid-cols-3-auto){grid-template-columns:repeat(3, auto)}:host(.L\\:v-grid-cols-4-auto){grid-template-columns:repeat(4, auto)}:host(.L\\:v-grid-cols-5-auto){grid-template-columns:repeat(5, auto)}:host(.L\\:v-grid-cols-6-auto){grid-template-columns:repeat(6, auto)}:host(.L\\:v-grid-cols-7-auto){grid-template-columns:repeat(7, auto)}:host(.L\\:v-grid-cols-8-auto){grid-template-columns:repeat(8, auto)}:host(.L\\:v-grid-cols-9-auto){grid-template-columns:repeat(9, auto)}:host(.L\\:v-grid-cols-10-auto){grid-template-columns:repeat(1, auto)}:host(.L\\:v-grid-cols-11-auto){grid-template-columns:repeat(1, auto)}:host(.L\\:v-grid-cols-12-auto){grid-template-columns:repeat(1, auto)}}@media (min-width: 1440px){:host(.XL\\:v-grid-cols-1){grid-template-columns:repeat(1, minmax(0, 1fr))}:host(.XL\\:v-grid-cols-2){grid-template-columns:repeat(2, minmax(0, 1fr))}:host(.XL\\:v-grid-cols-3){grid-template-columns:repeat(3, minmax(0, 1fr))}:host(.XL\\:v-grid-cols-4){grid-template-columns:repeat(4, minmax(0, 1fr))}:host(.XL\\:v-grid-cols-5){grid-template-columns:repeat(5, minmax(0, 1fr))}:host(.XL\\:v-grid-cols-6){grid-template-columns:repeat(6, minmax(0, 1fr))}:host(.XL\\:v-grid-cols-7){grid-template-columns:repeat(7, minmax(0, 1fr))}:host(.XL\\:v-grid-cols-8){grid-template-columns:repeat(8, minmax(0, 1fr))}:host(.XL\\:v-grid-cols-9){grid-template-columns:repeat(9, minmax(0, 1fr))}:host(.XL\\:v-grid-cols-10){grid-template-columns:repeat(10, minmax(0, 1fr))}:host(.XL\\:v-grid-cols-11){grid-template-columns:repeat(11, minmax(0, 1fr))}:host(.XL\\:v-grid-cols-12){grid-template-columns:repeat(12, minmax(0, 1fr))}:host(.XL\\:v-grid-cols-1-auto){grid-template-columns:repeat(1, auto)}:host(.XL\\:v-grid-cols-2-auto){grid-template-columns:repeat(2, auto)}:host(.XL\\:v-grid-cols-3-auto){grid-template-columns:repeat(3, auto)}:host(.XL\\:v-grid-cols-4-auto){grid-template-columns:repeat(4, auto)}:host(.XL\\:v-grid-cols-5-auto){grid-template-columns:repeat(5, auto)}:host(.XL\\:v-grid-cols-6-auto){grid-template-columns:repeat(6, auto)}:host(.XL\\:v-grid-cols-7-auto){grid-template-columns:repeat(7, auto)}:host(.XL\\:v-grid-cols-8-auto){grid-template-columns:repeat(8, auto)}:host(.XL\\:v-grid-cols-9-auto){grid-template-columns:repeat(9, auto)}:host(.XL\\:v-grid-cols-10-auto){grid-template-columns:repeat(1, auto)}:host(.XL\\:v-grid-cols-11-auto){grid-template-columns:repeat(1, auto)}:host(.XL\\:v-grid-cols-12-auto){grid-template-columns:repeat(1, auto)}}";
+
+var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
+    r = Reflect.decorate(decorators, target, key, desc);
+  else
+    for (var i = decorators.length - 1; i >= 0; i--)
+      if (d = decorators[i])
+        r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+const VegaGrid = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.globalSlimmers = {};
+    /**
+     * Determines the configuration of the grid columns.
+     *    It can be provided as an integer, string, or a responsive map
+     *    using key-value pairs.
+     *
+     * If provided as an integer from 1 to 12, each column will have the same width.
+     *    The CSS for this configuration is `grid-template-columns: repeat(number, minmax(0, 1fr))`.
+     *
+     * If provided as a string in the format of n-auto
+     *    (e.g., `1-auto`, `2-auto`, ..., `12-auto`),
+     *    each column will have auto width. The CSS for this configuration is
+     *    `grid-template-columns: repeat(number, auto)`.
+     *
+     * Alternatively, you can use a responsive map to define different column configurations
+     *    for various breakpoints. The keys in the map should represent the breakpoints,
+     *    such as `default` or `L`, and the values can be integers or strings following the
+     *    same patterns mentioned above.
+     */
+    this.column = 1;
+    /**
+     * Determines the configuration of the grid rows.
+     *    It can be provided as an integer, string, or a responsive map
+     *    using key-value pairs.
+     *
+     * If provided as an integer from 1 to 6, each row will have the same height.
+     *    The CSS for this configuration is `grid-template-rows: repeat(number, minmax(0, 1fr))`.
+     *
+     * If provided as a string in the format of n-auto
+     *    (e.g., `1-auto`, `2-auto`, ..., `6-auto`),
+     *    each row will have auto height. The CSS for this configuration is
+     *    `grid-template-rows: repeat(number, auto)`.
+     *
+     * Alternatively, you can use a responsive map to define different row configurations
+     *    for various breakpoints. The keys in the map should represent the breakpoints,
+     *    such as `default` or `L`, and the values can be integers or strings following the
+     *    same patterns mentioned above.
+     */
+    this.row = 1;
+  }
+  render() {
+    const classNames = [
+      formatAndValidResponsiveToken(this.column, 'gridColumn'),
+      formatAndValidResponsiveToken(this.row, 'gridRow'),
+      formatAndValidResponsiveToken(this.gap, 'gap'),
+    ];
+    return sanitizeVegaComponent(h(Host, { class: arrayToClassString(classNames) }, h("slot", null)), this.host);
+  }
+  get host() { return getElement(this); }
+};
+__decorate([
+  InjectVegaGlobalSlimmer()
+], VegaGrid.prototype, "globalSlimmers", void 0);
+VegaGrid.style = vegaGridCss;
+
+export { VegaGrid as vega_grid };

package/dist/esm/vega-icon.entry.js

@@ -0,0 +1,206 @@
+import { r as registerInstance, h, H as Host, g as getElement } from './index-c3505689.js';
+import { g as getIconFromToken, I as Icons } from './icons-42174059.js';
+import { h as Spacing } from './typeGuard-5e282437.js';
+import { s as sanitizeVegaComponent } from './component-e4eb3f14.js';
+import { i as formatAndValidTextColor } from './designToken-9b27a244.js';
+import { a as arrayToClassString } from './ui-6e5294cb.js';
+import { V as VegaIconManager } from './iconManager-48bebc43.js';
+import './global-slimmer-registry-b91c742d.js';
+import { I as InjectVegaGlobalSlimmer } from './inject-vega-global-slimmer-c3f84156.js';
+import './breakpoints-900a4c99.js';
+import './ui-535c5fb3.js';
+import './typography-03d285b4.js';
+import './log-a824be80.js';
+import './responsiveFormatFacade-e91e14ac.js';
+import './number-400b3bf2.js';
+
+const vegaIconCss = ":host(.v-text-primary),.v-text-primary{color:rgba(var(--v-text-primary, 32, 54, 69, 1))}:host(.v-text-secondary),.v-text-secondary{color:rgba(var(--v-text-secondary, 107, 116, 125, 1))}:host(.v-text-inverted-primary),.v-text-inverted-primary{color:rgba(var(--v-text-inverted-primary, 252, 252, 252, 1))}:host(.v-text-inverted-secondary),.v-text-inverted-secondary{color:rgba(var(--v-text-inverted-secondary, 188, 186, 213, 1))}:host(.v-text-link),.v-text-link{color:rgba(var(--v-text-link, 19, 98, 226, 1))}:host(.v-text-link-hover),.v-text-link-hover{color:rgba(var(--v-text-link-hover, 4, 112, 236, 1))}:host(.v-text-link-active),.v-text-link-active{color:rgba(var(--v-text-link-active, 29, 65, 195, 1))}:host(.v-text-link-focus),.v-text-link-focus{color:rgba(var(--v-text-link-focus, 4, 112, 236, 1))}:host(.v-text-link-visited),.v-text-link-visited{color:rgba(var(--v-text-link-visited, 95, 56, 206, 1))}:host(.v-text-danger-link),.v-text-danger-link{color:rgba(var(--v-text-danger-link, 230, 50, 87, 1))}:host(.v-text-danger-link-hover),.v-text-danger-link-hover{color:rgba(var(--v-text-danger-link-hover, 233, 71, 104, 1))}:host(.v-text-danger-link-active),.v-text-danger-link-active{color:rgba(var(--v-text-danger-link-active, 189, 41, 71, 1))}:host(.v-text-danger-link-focus),.v-text-danger-link-focus{color:rgba(var(--v-text-danger-link-focus, 240, 52, 91, 1))}:host(.v-text-danger-link-visited),.v-text-danger-link-visited{color:rgba(var(--v-text-danger-link-visited, 230, 50, 87, 1))}:host(.v-text-success),.v-text-success{color:rgba(var(--v-text-success, 1, 128, 31, 1))}:host(.v-text-error),.v-text-error{color:rgba(var(--v-text-error, 189, 41, 71, 1))}:host(.v-text-black),.v-text-black{color:rgba(var(--v-text-black, 32, 54, 69, 1))}:host(.v-text-white),.v-text-white{color:rgba(var(--v-text-white, 252, 252, 252, 1))}:host(.v-text-disabled),.v-text-disabled{color:rgba(var(--v-text-disabled, 176, 180, 181, 1))}:host(.v-text-input-disabled),.v-text-input-disabled{color:rgba(var(--v-text-input-disabled, 107, 116, 125, 1))}:host(.v-text-sidebar-link),.v-text-sidebar-link{color:rgba(var(--v-text-sidebar-link, 188, 186, 213, 1))}:host(.v-text-sidebar-link-hover),.v-text-sidebar-link-hover{color:rgba(var(--v-text-sidebar-link-hover, 18, 18, 39, 1))}:host(.v-text-sidebar-link-selected),.v-text-sidebar-link-selected{color:rgba(var(--v-text-sidebar-link-selected, 252, 252, 252, 1))}:host(.v-text-input-placeholder),.v-text-input-placeholder{color:rgba(var(--v-text-input-placeholder, 176, 180, 181, 1))}:host(.v-text-accent1-primary),.v-text-accent1-primary{color:rgba(var(--v-text-accent1-primary, 115, 230, 220, 1))}:host(.v-text-accent2-primary),.v-text-accent2-primary{color:rgba(var(--v-text-accent2-primary, 128, 107, 255, 1))}:host(.v-text-accent3-primary),.v-text-accent3-primary{color:rgba(var(--v-text-accent3-primary, 255, 220, 131, 1))}:host(.v-text-accent4-primary),.v-text-accent4-primary{color:rgba(var(--v-text-accent4-primary, 255, 149, 113, 1))}:host(.v-text-accent5-primary),.v-text-accent5-primary{color:rgba(var(--v-text-accent5-primary, 0, 187, 255, 1))}:host(.v-text-accent6-primary),.v-text-accent6-primary{color:rgba(var(--v-text-accent6-primary, 240, 52, 91, 1))}:host(.v-text-accent7-primary),.v-text-accent7-primary{color:rgba(var(--v-text-accent7-primary, 37, 159, 159, 1))}:host(.v-text-accent8-primary),.v-text-accent8-primary{color:rgba(var(--v-text-accent8-primary, 86, 61, 130, 1))}:host(.v-text-accent9-primary),.v-text-accent9-primary{color:rgba(var(--v-text-accent9-primary, 255, 191, 63, 1))}:host(.v-text-accent10-primary),.v-text-accent10-primary{color:rgba(var(--v-text-accent10-primary, 237, 122, 35, 1))}:host(.v-text-site-footer-link),.v-text-site-footer-link{color:rgba(var(--v-text-site-footer-link, 171, 198, 216, 1))}:host(.v-text-site-footer-link-hover),.v-text-site-footer-link-hover{color:rgba(var(--v-text-site-footer-link-hover, 199, 217, 229, 1))}:host(.v-text-site-footer-link-active),.v-text-site-footer-link-active{color:rgba(var(--v-text-site-footer-link-active, 143, 179, 203, 1))}:host(.v-text-brand),.v-text-brand{color:rgba(var(--v-text-brand, 89, 96, 99, 1))}:host(.v-text-on-action),.v-text-on-action{color:rgba(var(--v-text-on-action, 252, 252, 252, 1))}:host(.v-text-on-danger),.v-text-on-danger{color:rgba(var(--v-text-on-danger, 252, 252, 252, 1))}:host(.v-text-on-disabled),.v-text-on-disabled{color:rgba(var(--v-text-on-disabled, 252, 252, 252, 1))}:host(.v-w-0),.v-w-0{width:0px}:host(.v-w-size-0),.v-w-size-0{width:0px}:host(.v-w-size-4),.v-w-size-4{width:4px}:host(.v-w-size-8),.v-w-size-8{width:8px}:host(.v-w-size-12),.v-w-size-12{width:12px}:host(.v-w-size-16),.v-w-size-16{width:16px}:host(.v-w-size-20),.v-w-size-20{width:20px}:host(.v-w-size-24),.v-w-size-24{width:24px}:host(.v-w-size-32),.v-w-size-32{width:32px}:host(.v-w-size-40),.v-w-size-40{width:40px}:host(.v-w-size-48),.v-w-size-48{width:48px}:host(.v-w-size-64),.v-w-size-64{width:64px}:host(.v-w-size-72),.v-w-size-72{width:72px}:host(.v-w-size-80),.v-w-size-80{width:80px}:host(.v-w-size-112),.v-w-size-112{width:112px}:host(.v-w-size-2),.v-w-size-2{width:2px}:host(.v-h-0),.v-h-0{height:0px}:host(.v-h-size-0),.v-h-size-0{height:0px}:host(.v-h-size-4),.v-h-size-4{height:4px}:host(.v-h-size-8),.v-h-size-8{height:8px}:host(.v-h-size-12),.v-h-size-12{height:12px}:host(.v-h-size-16),.v-h-size-16{height:16px}:host(.v-h-size-20),.v-h-size-20{height:20px}:host(.v-h-size-24),.v-h-size-24{height:24px}:host(.v-h-size-32),.v-h-size-32{height:32px}:host(.v-h-size-40),.v-h-size-40{height:40px}:host(.v-h-size-48),.v-h-size-48{height:48px}:host(.v-h-size-64),.v-h-size-64{height:64px}:host(.v-h-size-72),.v-h-size-72{height:72px}:host(.v-h-size-80),.v-h-size-80{height:80px}:host(.v-h-size-112),.v-h-size-112{height:112px}:host(.v-h-size-2),.v-h-size-2{height:2px}:host{display:inline-flex;user-select:none}i{line-height:1}:host(:not(.vega-auto-size)) ::slotted(svg){width:100%;height:100%}";
+
+var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
+    r = Reflect.decorate(decorators, target, key, desc);
+  else
+    for (var i = decorators.length - 1; i >= 0; i--)
+      if (d = decorators[i])
+        r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+const VegaIcon = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.globalSlimmers = {};
+    /**
+     * Specifies the width and height of the icon.
+     *    For Third Party Icons (e.g., Font Awesome),
+     *    it sets the icon's font-size.
+     */
+    this.size = 'size-16';
+    /**
+     * The below method is e2e-test covered in
+     * @see {module:console-warn-when-load-fa-lib-timeout}
+     */
+    /* istanbul ignore next */
+    this.cloneFAIconStyles = () => {
+      const isFAIcon = !Icons.find((icon) => icon === this.icon);
+      if (isFAIcon) {
+        const iconStyleHTML = this.getIconStyleHTML();
+        if (iconStyleHTML) {
+          this.appendStyles(iconStyleHTML);
+        }
+        let count = 0;
+        const timerId = window.setInterval(() => {
+          if (count < 10) {
+            count++;
+            const iconStyleHTML = this.getIconStyleHTML();
+            if (iconStyleHTML) {
+              this.appendStyles(iconStyleHTML);
+              clearInterval(timerId);
+              return;
+            }
+          }
+          else {
+            console.warn('[Vega] Loading Font Awesome timeout.');
+            clearInterval(timerId);
+            return;
+          }
+        }, 300);
+      }
+    };
+  }
+  /**
+   * The below method is e2e-test covered in
+   * @see {module:icon-changed-from-vega-icon-to-fa-icon-class}
+   */
+  /* istanbul ignore next */
+  watchIcon() {
+    this.cloneFAIconStyles();
+  }
+  componentWillLoad() {
+    this.cloneFAIconStyles();
+  }
+  render() {
+    const iconFromTokenIndex = Icons.findIndex((icon) => {
+      return icon === this.icon;
+    });
+    if (VegaIconManager.hasIcon(this.icon)) {
+      const { icon, autoSize } = VegaIconManager.getIcon(this.icon);
+      const iconSize = autoSize ? null : this.size;
+      return this.renderForVegaIconToken(icon, iconSize, autoSize);
+    }
+    else if (iconFromTokenIndex > -1) {
+      return this.renderForVegaIconToken(getIconFromToken(this.icon), this.size);
+    }
+    else {
+      /**
+       * The below method is e2e-test covered in
+       * @see {module:render-correct-size-with-fa-icon}
+       * @see {module:append-fa-icon-styles-to-shadow-dom}
+       */
+      /* istanbul ignore next */
+      return this.renderForThirdPartyIcon();
+    }
+  }
+  renderForVegaIconToken(icon, size, isAutoSize = false) {
+    const sizeClassName = size ? this.formatAndValidSize(this.size) : null;
+    return sanitizeVegaComponent(h(Host, { class: arrayToClassString([
+        sizeClassName,
+        this.color && formatAndValidTextColor(this.color),
+        isAutoSize && 'vega-auto-size',
+      ]), innerHTML: icon }, h("slot", null)), this.host);
+  }
+  /**
+   * The below method is e2e-test covered in
+   * @see {module:render-correct-size-with-fa-icon}
+   * @see {module:append-fa-icon-styles-to-shadow-dom}
+   */
+  /* istanbul ignore next */
+  renderForThirdPartyIcon() {
+    return sanitizeVegaComponent(h(Host, { class: arrayToClassString([this.color && formatAndValidTextColor(this.color)]), style: this.formatThirdPartyIconSize(this.size) }, h("i", { part: "icon", class: this.icon })), this.host);
+  }
+  formatAndValidSize(size) {
+    return `v-w-${size} v-h-${size}`;
+  }
+  /**
+   * The below method is e2e-test covered in
+   * @see {module:render-correct-size-with-fa-icon}
+   */
+  /* istanbul ignore next */
+  formatThirdPartyIconSize(size) {
+    return { 'font-size': `${Spacing[size]}px` };
+  }
+  /**
+   * The below method is e2e-test covered in
+   * @see {module:append-fa-icon-styles-to-shadow-dom}
+   */
+  /* istanbul ignore next */
+  appendStyles(iconStyles) {
+    var _a;
+    if (iconStyles) {
+      const styleElement = (_a = this.host.shadowRoot.querySelector('#fa-icon-styles')) !== null && _a !== void 0 ? _a : document.createElement('style');
+      styleElement.id = 'fa-icon-styles';
+      styleElement.innerHTML = iconStyles;
+      this.host.shadowRoot.appendChild(styleElement);
+    }
+  }
+  /**
+   * The below method is e2e-test covered in
+   * @see {module:append-fa-icon-styles-to-shadow-dom}
+   */
+  /* istanbul ignore next */
+  getIconStyleHTML() {
+    var _a;
+    if (VegaIcon.iconStyleCache.has(this.icon)) {
+      return VegaIcon.iconStyleCache.get(this.icon);
+    }
+    else {
+      const iconElement = document.createElement('i');
+      iconElement.className = this.icon;
+      iconElement.style.display = 'none';
+      document.body.appendChild(iconElement);
+      const computedStyle = getComputedStyle(iconElement);
+      // `fontFamily` is null in spec test. Skip it by using '?'
+      if ((_a = computedStyle.fontFamily) === null || _a === void 0 ? void 0 : _a.includes('Font Awesome')) {
+        const pseudoBeforeElementStyle = getComputedStyle(iconElement, '::before');
+        const pseudoAfterElementStyle = getComputedStyle(iconElement, '::after');
+        const styleHTML = `
+				i {
+					font-weight: ${computedStyle.fontWeight};
+					font-family: ${computedStyle.fontFamily};
+					font-style: ${computedStyle.fontStyle};
+					position: ${computedStyle.position};
+					letter-spacing: ${computedStyle.letterSpacing};
+				}
+				i::before {
+					content: ${pseudoBeforeElementStyle.content};
+					position: ${pseudoBeforeElementStyle.position};
+					opacity: ${pseudoBeforeElementStyle.opacity};
+				}
+				i::after {
+					content: ${pseudoAfterElementStyle.content};
+					position: ${pseudoAfterElementStyle.position};
+					opacity: ${pseudoAfterElementStyle.opacity};
+				}
+			`.replace(/[\n\t]/gi, '');
+        VegaIcon.iconStyleCache.set(this.icon, styleHTML);
+        document.body.removeChild(iconElement);
+        return styleHTML;
+      }
+      else {
+        document.body.removeChild(iconElement);
+        return null;
+      }
+    }
+  }
+  get host() { return getElement(this); }
+  static get watchers() { return {
+    "icon": ["watchIcon"]
+  }; }
+};
+VegaIcon.iconStyleCache = new Map();
+__decorate([
+  InjectVegaGlobalSlimmer()
+], VegaIcon.prototype, "globalSlimmers", void 0);
+VegaIcon.style = vegaIconCss;
+
+export { VegaIcon as vega_icon };