kemet-ui 5.0.2 → 5.0.3

package/dist/{constants-CHvA2ed5.d.ts → constants-Dj9X-JwG.d.ts}

@@ -573,4 +573,4 @@ interface InterfaceInputDetails {
     value?: string;
 }
 
-export { EnumAppearances as E, HTMLKemetFieldElement as H, type InterfaceKemetSelectionEvent as I, KemetCombo as K, type TypeAppearance as T, KemetCount as a, type InterfaceInputDetails as b, HTMLKemetInputElement as c, type TypeRoundedSizes as d, EnumRoundedSizes as e, HTMLKemetTextareaElement as f, EnumAxis as g, EnumDirections as h, EnumAriaAutoComplete as i, EnumAutoComplete as j, EnumInputModes as k, EnumInputTypes as l, type InterfaceAppearanceChangeEvent as m };
+export { EnumRoundedSizes as E, HTMLKemetFieldElement as H, type InterfaceKemetSelectionEvent as I, KemetCombo as K, type TypeAppearance as T, KemetCount as a, type InterfaceInputDetails as b, HTMLKemetInputElement as c, type TypeRoundedSizes as d, EnumAppearances as e, HTMLKemetTextareaElement as f, EnumAxis as g, EnumDirections as h, EnumAriaAutoComplete as i, EnumAutoComplete as j, EnumInputModes as k, EnumInputTypes as l, type InterfaceAppearanceChangeEvent as m };

package/dist/elements/alert/index.d.ts

@@ -1,7 +1,7 @@
 import * as lit_html from 'lit-html';
 import * as lit from 'lit';
 import { LitElement } from 'lit';
-import { T as TypeAppearance, d as TypeRoundedSizes } from '../../constants-CHvA2ed5.js';
+import { T as TypeAppearance, d as TypeRoundedSizes } from '../../constants-Dj9X-JwG.js';
 import '../../form-controller-3q581XcZ.js';
 
 declare enum EnumOverlayPositions {

package/dist/elements/avatar/index.d.ts

@@ -1,7 +1,7 @@
 import * as lit_html from 'lit-html';
 import * as lit from 'lit';
 import { LitElement } from 'lit';
-import { d as TypeRoundedSizes } from '../../constants-CHvA2ed5.js';
+import { d as TypeRoundedSizes } from '../../constants-Dj9X-JwG.js';
 import '../../form-controller-3q581XcZ.js';
 
 /**

package/dist/elements/badge/index.d.ts

@@ -1,7 +1,7 @@
 import * as lit_html from 'lit-html';
 import * as lit from 'lit';
 import { LitElement } from 'lit';
-import { E as EnumAppearances, e as EnumRoundedSizes } from '../../constants-CHvA2ed5.js';
+import { e as EnumAppearances, E as EnumRoundedSizes } from '../../constants-Dj9X-JwG.js';
 import '../../form-controller-3q581XcZ.js';
 
 /**

package/dist/elements/button/index.d.ts

@@ -1,7 +1,7 @@
 import * as lit_html from 'lit-html';
 import * as lit from 'lit';
 import { LitElement } from 'lit';
-import { d as TypeRoundedSizes, T as TypeAppearance } from '../../constants-CHvA2ed5.js';
+import { d as TypeRoundedSizes, T as TypeAppearance } from '../../constants-Dj9X-JwG.js';
 import '../../form-controller-3q581XcZ.js';
 
 declare enum EnumVariants {

package/dist/elements/card/index.d.ts

@@ -1,7 +1,7 @@
 import * as lit_html from 'lit-html';
 import * as lit from 'lit';
 import { LitElement } from 'lit';
-import { e as EnumRoundedSizes } from '../../constants-CHvA2ed5.js';
+import { E as EnumRoundedSizes } from '../../constants-Dj9X-JwG.js';
 import '../../form-controller-3q581XcZ.js';
 
 declare enum EnumElevation {

package/dist/elements/checkbox/index.d.ts

@@ -2,7 +2,7 @@ import * as lit_html from 'lit-html';
 import * as lit from 'lit';
 import { LitElement } from 'lit';
 import { F as FormSubmitController } from '../../form-controller-3q581XcZ.js';
-import { E as EnumAppearances } from '../../constants-CHvA2ed5.js';
+import { e as EnumAppearances } from '../../constants-Dj9X-JwG.js';
 
 /**
  * @since 1.0.0

package/dist/elements/combo/index.d.ts

@@ -1,4 +1,4 @@
 import 'lit-html';
 import 'lit';
-export { I as InterfaceKemetSelectionEvent, K as default } from '../../constants-CHvA2ed5.js';
+export { I as InterfaceKemetSelectionEvent, K as default } from '../../constants-Dj9X-JwG.js';
 import '../../form-controller-3q581XcZ.js';

package/dist/elements/count/index.d.ts

@@ -1,4 +1,4 @@
 import 'lit-html';
 import 'lit';
-export { m as InterfaceAppearanceChangeEvent, a as default } from '../../constants-CHvA2ed5.js';
+export { m as InterfaceAppearanceChangeEvent, a as default } from '../../constants-Dj9X-JwG.js';
 import '../../form-controller-3q581XcZ.js';

package/dist/elements/dialog/index.d.ts

@@ -1,7 +1,7 @@
 import * as lit_html from 'lit-html';
 import * as lit from 'lit';
 import { LitElement } from 'lit';
-import { e as EnumRoundedSizes } from '../../constants-CHvA2ed5.js';
+import { E as EnumRoundedSizes } from '../../constants-Dj9X-JwG.js';
 import '../../form-controller-3q581XcZ.js';
 
 declare enum EnumEffects {

package/dist/elements/fab/index.d.ts

@@ -1,7 +1,7 @@
 import * as lit_html from 'lit-html';
 import * as lit from 'lit';
 import { LitElement } from 'lit';
-import { e as EnumRoundedSizes, E as EnumAppearances } from '../../constants-CHvA2ed5.js';
+import { E as EnumRoundedSizes, e as EnumAppearances } from '../../constants-Dj9X-JwG.js';
 import '../../form-controller-3q581XcZ.js';
 
 /**

package/dist/elements/field/index.d.ts

@@ -1,4 +1,4 @@
 import 'lit-html';
 import 'lit';
-export { H as default } from '../../constants-CHvA2ed5.js';
+export { H as default } from '../../constants-Dj9X-JwG.js';
 import '../../form-controller-3q581XcZ.js';

package/dist/elements/flipcard/index.d.ts

@@ -1,7 +1,7 @@
 import * as lit_html from 'lit-html';
 import * as lit from 'lit';
 import { LitElement } from 'lit';
-import { e as EnumRoundedSizes } from '../../constants-CHvA2ed5.js';
+import { E as EnumRoundedSizes } from '../../constants-Dj9X-JwG.js';
 import '../../form-controller-3q581XcZ.js';
 
 /**

package/dist/elements/input/index.d.ts

@@ -1,4 +1,4 @@
 import 'lit-html';
 import 'lit';
 import '../../form-controller-3q581XcZ.js';
-export { i as EnumAriaAutoComplete, j as EnumAutoComplete, k as EnumInputModes, l as EnumInputTypes, c as default } from '../../constants-CHvA2ed5.js';
+export { i as EnumAriaAutoComplete, j as EnumAutoComplete, k as EnumInputModes, l as EnumInputTypes, c as default } from '../../constants-Dj9X-JwG.js';

package/dist/elements/input-combo/index.d.ts

@@ -1,7 +1,7 @@
 import * as lit_html from 'lit-html';
 import * as lit from 'lit';
 import { LitElement } from 'lit';
-import { e as EnumRoundedSizes, E as EnumAppearances, H as HTMLKemetFieldElement, K as KemetCombo } from '../../constants-CHvA2ed5.js';
+import { E as EnumRoundedSizes, e as EnumAppearances, H as HTMLKemetFieldElement, K as KemetCombo } from '../../constants-Dj9X-JwG.js';
 import '../../form-controller-3q581XcZ.js';
 
 interface InterfaceSelections {

package/dist/elements/loader/index.d.ts

@@ -42,4 +42,4 @@ declare class KemetLoader extends LitElement {
     makeLoader(): lit_html.TemplateResult<1>;
 }
 
-export { EnumVariants, KemetLoader };
+export { EnumVariants, KemetLoader as default };

package/dist/elements/loader/index.js

@@ -581,6 +581,6 @@ KemetLoader = __decorateClass([
 ], KemetLoader);
 export {
   EnumVariants,
-  KemetLoader
+  KemetLoader as default
 };
 //# sourceMappingURL=index.js.map

package/dist/elements/loader/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/elements/loader/index.ts","../../../src/utilities/decorators.ts","../../../src/elements/loader/styles.css.ts","../../../src/utilities/events.ts"],"sourcesContent":["import { html, LitElement, unsafeCSS } from 'lit';\nimport { customElement, property } from '../../utilities/decorators';\nimport styles from './styles.css.ts';\nimport { emitEvent } from '../../utilities/events';\n\nexport enum EnumVariants {\n  NO_BORDER = 'no-border',\n  BORDER_TOP = 'border-top',\n  DOUBLE_BORDER = 'double-border',\n  DOUBLE_SPINNERS = 'double-spinners',\n  THREE_DOTS = 'three-dots',\n  FULL_CIRCLE = 'full-circle',\n  SPINNER = 'spinner',\n  MESH = 'mesh',\n}\n\n/**\n * @since 5.0.0\n * @status stable\n *\n * @tagname kemet-loader\n * @summary Displays animations for a loading state.\n *\n * @prop {string} variant - The style of loader to display\n * @prop {number} size - How large to make the loader.\n * @ssrsafe yes\n *\n * @csspart loader - The main loader container\n *\n * @cssproperty --kemet-loader-color - The color of the loader.\n * @cssproperty --kemet-loader-thickness - The thickness of the loader.\n * @cssproperty --kemet-loader-dot-size - The size of the dots in the loader.\n * @cssproperty --kemet-loader-size - The size of the loader.\n *\n * @fires kemet-loader-mounted - Fired when the loader is mounted to the DOM\n * @detail {HTMLElement} element - The loader element\n */\n@customElement('kemet-loader')\nexport class KemetLoader extends LitElement {\n  static styles = [styles];\n\n  @property({ type: String, reflect: true })\n  variant: EnumVariants = EnumVariants.NO_BORDER;\n\n  @property({ type: Number })\n  size: number = 48;\n\n  firstUpdated() {\n    emitEvent(this, 'kemet-loader-mounted', {\n      bubbles: true,\n      composed: true,\n      detail: {\n        element: this,\n      },\n    });\n  }\n\n  render() {\n    if (\n      this.variant === EnumVariants.THREE_DOTS ||\n      this.variant === EnumVariants.FULL_CIRCLE ||\n      this.variant === EnumVariants.MESH\n    ) {\n      this.style.setProperty('--kemet-loader-dot-size', `${this.size}px`);\n      return html`\n        <div part=\"loader\">\n          ${this.makeLoader()}\n        </div>\n      `;\n    }\n\n    if (this.variant === EnumVariants.SPINNER) {\n      this.style.setProperty('--kemet-loader-size', `${this.size}px`);\n      return html`\n        <div part=\"loader\">\n          ${this.makeLoader()}\n        </div>\n      `;\n    }\n\n    return html`\n      <div style=\"width: ${this.size}px; height: ${this.size}px;\" part=\"loader\">\n        ${this.makeLoader()}\n      </div>\n    `;\n  }\n\n  makeLoader() {\n    switch (this.variant) {\n      case EnumVariants.NO_BORDER:\n        return html`\n          <div class=\"nb-spinner\"></div>\n        `;\n      case EnumVariants.BORDER_TOP:\n        return html`\n          <div class=\"bt-spinner\"></div>\n        `;\n      case EnumVariants.DOUBLE_BORDER:\n        return html`\n          <div class=\"db-spinner\"></div>\n        `;\n      case EnumVariants.DOUBLE_SPINNERS:\n        return html`\n          <div class=\"dbl-spinner\" style=\"width: ${this.size}px; height: ${this.size}px;\"></div>\n          <div class=\"dbl-spinner dbl-spinner--2\" style=\"width: ${this.size}px; height: ${this.size}px;\"></div>\n        `;\n      case EnumVariants.THREE_DOTS:\n        return html`\n          <div class=\"dot-loader\"></div>\n          <div class=\"dot-loader dot-loader--2\"></div>\n          <div class=\"dot-loader dot-loader--3\"></div>\n        `;\n      case EnumVariants.FULL_CIRCLE:\n        return html`\n          <div class=\"circle-loader\">\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n          </div>\n        `;\n      case EnumVariants.SPINNER:\n        return html`\n          <div class=\"ml-loader\">\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n          </div>\n        `;\n      case EnumVariants.MESH:\n        return html`\n          <div class=\"mesh-loader\">\n            <div class=\"set-one\">\n              <div class=\"circle\"></div>\n              <div class=\"circle\"></div>\n            </div>\n            <div class=\"set-two\">\n              <div class=\"circle\"></div>\n              <div class=\"circle\"></div>\n            </div>\n          </div>\n        `;\n    }\n  }\n}\n","export { property, state, query, queryAll } from 'lit/decorators.js';\nimport { customElement as litCustomElement } from 'lit/decorators.js';\n\n/**\n * A drop-in replacement for lit's `customElement` decorator that is safe under\n * hot-module-replacement / live-reload environments where the module may be\n * re-evaluated.\n */\nexport const customElement = (tagName: string) => (classOrDescriptor: any) =>\n  typeof customElements !== 'undefined' && !customElements.get(tagName)\n    ? litCustomElement(tagName)(classOrDescriptor)\n    : classOrDescriptor;\n","import { css } from 'lit';\n\nexport default css`:host {\n  --kemet-loader-color: var(--kemet-color-brand-primary-base);\n  --kemet-loader-thickness: 4px;\n  --kemet-loader-dot-size: 24px;\n  --kemet-loader-size: 48px;\n\n  /* private variables */\n  --_kemet-loader-three-dot-gap: calc(var(--kemet-loader-dot-size) * 0.5);\n  --_kemet-loader-circle-radius: calc(var(--kemet-loader-dot-size) * 2.04);\n  --_kemet-loader-spinner-radius: calc(var(--kemet-loader-size) * 0.43);\n  --_kemet-loader-spinner-bar-width: calc(var(--kemet-loader-size) * 0.07);\n  --_kemet-loader-spinner-bar-height: calc(var(--kemet-loader-size) * 0.26);\n\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  position: relative;\n}\n\n:host([variant=three-dots]) > div {\n  display: inline-flex;\n  gap: var(--_kemet-loader-three-dot-gap);\n  align-items: center;\n  justify-content: center;\n}\n\n/* NO BORDER SPINNER */\n.nb-spinner {\n  width: 100%;\n  height: 100%;\n  margin: 0;\n  background: transparent;\n  border-top: var(--kemet-loader-thickness) solid;\n  border-right: var(--kemet-loader-thickness) solid transparent;\n  border-radius: 50%;\n  animation: 1s spin linear infinite;\n}\n\n/* BORDER TOP SPINNER */\n.bt-spinner {\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n  background-color: transparent;\n  border: var(--kemet-loader-thickness) solid;\n  border-top-color: var(--kemet-loader-color);\n  animation: 1s spin linear infinite;\n}\n\n/* DOUBLE BORDER SPINNER */\n.db-spinner {\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n  background-color: transparent;\n  border: var(--kemet-loader-thickness) solid #222;\n  border-top-color: var(--kemet-loader-color);\n  border-bottom-color: var(--kemet-loader-color);\n  animation: 1s spin linear infinite;\n}\n\n/* DOUBLE SPINNER */\n.double-spinner {\n  position: relative;\n}\n\n.dbl-spinner {\n  position: absolute;\n  border-radius: 50%;\n  background-color: transparent;\n  border: var(--kemet-loader-thickness) solid transparent;\n  border-top: var(--kemet-loader-thickness) solid;\n  border-left: var(--kemet-loader-thickness) solid;\n  animation: 2s spin linear infinite;\n}\n\n.dbl-spinner--2 {\n  border: var(--kemet-loader-thickness) solid transparent;\n  border-right: var(--kemet-loader-thickness) solid var(--kemet-loader-color);\n  border-bottom: var(--kemet-loader-thickness) solid var(--kemet-loader-color);\n  animation: 1s spin linear infinite;\n}\n\n\n/* 3 DOT LOADER */\n.dot-loader {\n  width: var(--kemet-loader-dot-size);\n  height: var(--kemet-loader-dot-size);\n  border-radius: 50%;\n  background-color: var(--kemet-loader-color);\n  position: relative;\n  animation: 1.2s grow ease-in-out infinite;\n}\n\n.dot-loader--2 {\n  animation: 1.2s grow ease-in-out infinite 0.15555s;\n}\n\n.dot-loader--3 {\n  animation: 1.2s grow ease-in-out infinite 0.3s;\n}\n\n\n/* CIRCLE DOT LOADER */\n.circle-loader {\n  position: relative;\n  display: flex;\n  align-self: center;\n  justify-self: center;\n  width: calc(var(--_kemet-loader-circle-radius) * 2 + var(--kemet-loader-dot-size));\n  height: calc(var(--_kemet-loader-circle-radius) * 2 + var(--kemet-loader-dot-size));\n}\n\n.circle-loader div {\n  height: var(--kemet-loader-dot-size);\n  width: var(--kemet-loader-dot-size);\n  background-color: var(--kemet-loader-color);\n  border-radius: 50%;\n  position: absolute;\n  animation: 0.8s opaque ease-in-out infinite both;\n  transform: translate(-50%, -50%);\n}\n\n.circle-loader > div:nth-child(1) {\n  top: calc(50% + var(--_kemet-loader-circle-radius) * -1);\n  left: 50%;\n}\n\n.circle-loader > div:nth-child(2) {\n  top: calc(50% + var(--_kemet-loader-circle-radius) * -0.707);\n  left: calc(50% + var(--_kemet-loader-circle-radius) * 0.707);\n  animation-delay: 0.1s;\n}\n\n.circle-loader > div:nth-child(3) {\n  top: 50%;\n  left: calc(50% + var(--_kemet-loader-circle-radius));\n  animation-delay: 0.2s;\n}\n\n.circle-loader > div:nth-child(4) {\n  top: calc(50% + var(--_kemet-loader-circle-radius) * 0.707);\n  left: calc(50% + var(--_kemet-loader-circle-radius) * 0.707);\n  animation-delay: 0.3s;\n}\n\n.circle-loader > div:nth-child(5) {\n  top: calc(50% + var(--_kemet-loader-circle-radius));\n  left: 50%;\n  animation-delay: 0.4s;\n}\n\n.circle-loader > div:nth-child(6) {\n  top: calc(50% + var(--_kemet-loader-circle-radius) * 0.707);\n  left: calc(50% + var(--_kemet-loader-circle-radius) * -0.707);\n  animation-delay: 0.5s;\n}\n\n.circle-loader > div:nth-child(7) {\n  top: 50%;\n  left: calc(50% + var(--_kemet-loader-circle-radius) * -1);\n  animation-delay: 0.6s;\n}\n\n.circle-loader > div:nth-child(8) {\n  top: calc(50% + var(--_kemet-loader-circle-radius) * -0.707);\n  left: calc(50% + var(--_kemet-loader-circle-radius) * -0.707);\n  animation-delay: 0.7s;\n}\n\n\n/* MESH LOADER */\n.mesh-loader {\n  overflow: hidden;\n  height: inherit;\n  width: inherit;\n}\n\n.mesh-loader .circle {\n  width: var(--kemet-loader-dot-size);\n  height: var(--kemet-loader-dot-size);\n  position: absolute;\n  background: var(--kemet-loader-color);\n  border-radius: 50%;\n  margin: calc(var(--kemet-loader-dot-size) / -2);\n  animation: mesh 3s ease-in-out infinite -1.5s;\n}\n\n.mesh-loader > div .circle:last-child {\n  animation-delay: 0s;\n}\n\n.mesh-loader > div {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n}\n\n.mesh-loader > div:last-child {\n  transform: rotate(90deg);\n}\n\n\n/* SPINNER 13 */\n.ml-loader {\n  position: relative;\n  width: calc(var(--_kemet-loader-spinner-radius) * 2);\n  height: calc(var(--_kemet-loader-spinner-radius) * 2);\n}\n\n.ml-loader div {\n  transform-origin: var(--_kemet-loader-spinner-radius) var(--_kemet-loader-spinner-radius);\n  animation: 1.2s opaque ease-in-out infinite both;\n}\n\n.ml-loader div::after {\n  content: \"\";\n  display: block;\n  position: absolute;\n  top: 0;\n  left: calc(var(--_kemet-loader-spinner-radius) - var(--_kemet-loader-spinner-bar-width) / 2);\n  width: var(--_kemet-loader-spinner-bar-width);\n  height: var(--_kemet-loader-spinner-bar-height);\n  border-radius: 10px;\n  background-color: var(--kemet-loader-color);\n}\n\n.ml-loader div:nth-child(1) {\n  transform: rotate(0);\n}\n\n.ml-loader div:nth-child(2) {\n  transform: rotate(30deg);\n  animation-delay: 0.1s;\n}\n\n.ml-loader div:nth-child(3) {\n  transform: rotate(60deg);\n  animation-delay: 0.2s;\n}\n\n.ml-loader div:nth-child(4) {\n  transform: rotate(90deg);\n  animation-delay: 0.3s;\n}\n\n.ml-loader div:nth-child(5) {\n  transform: rotate(120deg);\n  animation-delay: 0.4s;\n}\n\n.ml-loader div:nth-child(6) {\n  transform: rotate(150deg);\n  animation-delay: 0.5s;\n}\n\n.ml-loader div:nth-child(7) {\n  transform: rotate(180deg);\n  animation-delay: 0.6s;\n}\n\n.ml-loader div:nth-child(8) {\n  transform: rotate(210deg);\n  animation-delay: 0.7s;\n}\n\n.ml-loader div:nth-child(9) {\n  transform: rotate(240deg);\n  animation-delay: 0.8s;\n}\n\n.ml-loader div:nth-child(10) {\n  transform: rotate(270deg);\n  animation-delay: 0.9s;\n}\n\n.ml-loader div:nth-child(11) {\n  transform: rotate(300deg);\n  animation-delay: 1s;\n}\n\n.ml-loader div:nth-child(12) {\n  transform: rotate(330deg);\n  animation-delay: 1.1s;\n}\n\n.ml-loader div:nth-child(13) {\n  transform: rotate(360deg);\n  animation-delay: 1.2s;\n}\n\n\n\n@keyframes rotate {\n  100% {\n    -webkit-transform: rotate(360deg);\n    transform: rotate(360deg);\n  }\n}\n\n@keyframes spin {\n  from {\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n  }\n  to {\n    -webkit-transform: rotate(360deg);\n    transform: rotate(360deg);\n  }\n}\n\n@keyframes spinBack {\n  from {\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n  }\n  to {\n    -webkit-transform: rotate(-720deg);\n    transform: rotate(-720deg);\n  }\n}\n\n@keyframes spinBorder {\n  0% {\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    border-width: 15px;\n  }\n  50% {\n    -webkit-transform: rotate(180deg);\n    transform: rotate(180deg);\n    border-width: 3px;\n  }\n  100% {\n    -webkit-transform: rotate(360deg);\n    transform: rotate(360deg);\n    border-width: 15px;\n  }\n}\n\n@keyframes grow {\n  0%, 40%, 100% {\n    -webkit-transform: scale(0);\n            transform: scale(0);\n  }\n  40% {\n    -webkit-transform: scale(1);\n            transform: scale(1);\n  }\n}\n\n@keyframes pulsate {\n  0% {\n    -webkit-transform: rotate(45deg) scale(0.8);\n    transform: rotate(45deg) scale(0.8);\n    transform: rotate(45deg) scale(0.8);\n  }\n  5% {\n    -webkit-transform: rotate(45deg) scale(0.9);\n    transform: rotate(45deg) scale(0.9);\n  }\n  10% {\n    -webkit-transform: rotate(45deg) scale(0.8);\n    transform: rotate(45deg) scale(0.8);\n  }\n  15% {\n    -webkit-transform: rotate(45deg) scale(1);\n    transform: rotate(45deg) scale(1);\n  }\n  50% {\n    -webkit-transform: rotate(45deg) scale(0.8);\n    transform: rotate(45deg) scale(0.8);\n  }\n  100% {\n    -webkit-transform: rotate(45deg) scale(0.8);\n    transform: rotate(45deg) scale(0.8);\n  }\n}\n\n@keyframes opaque {\n  0% {\n    opacity: 0.1;\n  }\n  40% {\n    opacity: 1;\n  }\n  80% {\n    opacity: 0.1;\n  }\n  100% {\n    opacity: 0.1;\n  }\n}\n\n@keyframes mesh {\n  0% {\n    -webkit-transform-origin: 50% -100%;\n    transform-origin: 50% -100%;\n    -webkit-transform: rotate(0);\n    transform: rotate(0);\n  }\n  50% {\n    -webkit-transform-origin: 50% -100%;\n    transform-origin: 50% -100%;\n    -webkit-transform: rotate(360deg);\n    transform: rotate(360deg);\n  }\n  50.1% {\n    -webkit-transform-origin: 50% 200%;\n    transform-origin: 50% 200%;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n  }\n  100% {\n    -webkit-transform-origin: 50% 200%;\n    transform-origin: 50% 200%;\n    -webkit-transform: rotate(360deg);\n    transform: rotate(360deg);\n  }\n}\n`;\n","export const emitEvent = (element, name, detail, bubbles = true, composed = true) => {\n  element.dispatchEvent(\n    new CustomEvent(name, { bubbles, composed, detail }),\n  );\n};\n"],"mappings":";;;;;;;;;;;;AAAA,SAAS,MAAM,kBAA6B;;;ACA5C,SAAS,UAAU,OAAO,OAAO,gBAAgB;AACjD,SAAS,iBAAiB,wBAAwB;AAO3C,IAAM,gBAAgB,CAAC,YAAoB,CAAC,sBACjD,OAAO,mBAAmB,eAAe,CAAC,eAAe,IAAI,OAAO,IAChE,iBAAiB,OAAO,EAAE,iBAAiB,IAC3C;;;ACXN,SAAS,WAAW;AAEpB,IAAO,qBAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACFR,IAAM,YAAY,CAAC,SAAS,MAAM,QAAQ,UAAU,MAAM,WAAW,SAAS;AACnF,UAAQ;AAAA,IACN,IAAI,YAAY,MAAM,EAAE,SAAS,UAAU,OAAO,CAAC;AAAA,EACrD;AACF;;;AHCO,IAAK,eAAL,kBAAKA,kBAAL;AACL,EAAAA,cAAA,eAAY;AACZ,EAAAA,cAAA,gBAAa;AACb,EAAAA,cAAA,mBAAgB;AAChB,EAAAA,cAAA,qBAAkB;AAClB,EAAAA,cAAA,gBAAa;AACb,EAAAA,cAAA,iBAAc;AACd,EAAAA,cAAA,aAAU;AACV,EAAAA,cAAA,UAAO;AARG,SAAAA;AAAA,GAAA;AAiCL,IAAM,cAAN,cAA0B,WAAW;AAAA,EAArC;AAAA;AAIL,mBAAwB;AAGxB,gBAAe;AAAA;AAAA,EAEf,eAAe;AACb,cAAU,MAAM,wBAAwB;AAAA,MACtC,SAAS;AAAA,MACT,UAAU;AAAA,MACV,QAAQ;AAAA,QACN,SAAS;AAAA,MACX;AAAA,IACF,CAAC;AAAA,EACH;AAAA,EAEA,SAAS;AACP,QACE,KAAK,YAAY,iCACjB,KAAK,YAAY,mCACjB,KAAK,YAAY,mBACjB;AACA,WAAK,MAAM,YAAY,2BAA2B,GAAG,KAAK,IAAI,IAAI;AAClE,aAAO;AAAA;AAAA,YAED,KAAK,WAAW,CAAC;AAAA;AAAA;AAAA,IAGzB;AAEA,QAAI,KAAK,YAAY,yBAAsB;AACzC,WAAK,MAAM,YAAY,uBAAuB,GAAG,KAAK,IAAI,IAAI;AAC9D,aAAO;AAAA;AAAA,YAED,KAAK,WAAW,CAAC;AAAA;AAAA;AAAA,IAGzB;AAEA,WAAO;AAAA,2BACgB,KAAK,IAAI,eAAe,KAAK,IAAI;AAAA,UAClD,KAAK,WAAW,CAAC;AAAA;AAAA;AAAA,EAGzB;AAAA,EAEA,aAAa;AACX,YAAQ,KAAK,SAAS;AAAA,MACpB,KAAK;AACH,eAAO;AAAA;AAAA;AAAA,MAGT,KAAK;AACH,eAAO;AAAA;AAAA;AAAA,MAGT,KAAK;AACH,eAAO;AAAA;AAAA;AAAA,MAGT,KAAK;AACH,eAAO;AAAA,mDACoC,KAAK,IAAI,eAAe,KAAK,IAAI;AAAA,kEAClB,KAAK,IAAI,eAAe,KAAK,IAAI;AAAA;AAAA,MAE7F,KAAK;AACH,eAAO;AAAA;AAAA;AAAA;AAAA;AAAA,MAKT,KAAK;AACH,eAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAYT,KAAK;AACH,eAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAgBT,KAAK;AACH,eAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAYX;AAAA,EACF;AACF;AAvHa,YACJ,SAAS,CAAC,kBAAM;AAGvB;AAAA,EADC,SAAS,EAAE,MAAM,QAAQ,SAAS,KAAK,CAAC;AAAA,GAH9B,YAIX;AAGA;AAAA,EADC,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GANf,YAOX;AAPW,cAAN;AAAA,EADN,cAAc,cAAc;AAAA,GAChB;","names":["EnumVariants"]}
+{"version":3,"sources":["../../../src/elements/loader/index.ts","../../../src/utilities/decorators.ts","../../../src/elements/loader/styles.css.ts","../../../src/utilities/events.ts"],"sourcesContent":["import { html, LitElement, unsafeCSS } from 'lit';\nimport { customElement, property } from '../../utilities/decorators';\nimport styles from './styles.css.ts';\nimport { emitEvent } from '../../utilities/events';\n\nexport enum EnumVariants {\n  NO_BORDER = 'no-border',\n  BORDER_TOP = 'border-top',\n  DOUBLE_BORDER = 'double-border',\n  DOUBLE_SPINNERS = 'double-spinners',\n  THREE_DOTS = 'three-dots',\n  FULL_CIRCLE = 'full-circle',\n  SPINNER = 'spinner',\n  MESH = 'mesh',\n}\n\n/**\n * @since 5.0.0\n * @status stable\n *\n * @tagname kemet-loader\n * @summary Displays animations for a loading state.\n *\n * @prop {string} variant - The style of loader to display\n * @prop {number} size - How large to make the loader.\n * @ssrsafe yes\n *\n * @csspart loader - The main loader container\n *\n * @cssproperty --kemet-loader-color - The color of the loader.\n * @cssproperty --kemet-loader-thickness - The thickness of the loader.\n * @cssproperty --kemet-loader-dot-size - The size of the dots in the loader.\n * @cssproperty --kemet-loader-size - The size of the loader.\n *\n * @fires kemet-loader-mounted - Fired when the loader is mounted to the DOM\n * @detail {HTMLElement} element - The loader element\n */\n@customElement('kemet-loader')\nexport default class KemetLoader extends LitElement {\n  static styles = [styles];\n\n  @property({ type: String, reflect: true })\n  variant: EnumVariants = EnumVariants.NO_BORDER;\n\n  @property({ type: Number })\n  size: number = 48;\n\n  firstUpdated() {\n    emitEvent(this, 'kemet-loader-mounted', {\n      bubbles: true,\n      composed: true,\n      detail: {\n        element: this,\n      },\n    });\n  }\n\n  render() {\n    if (\n      this.variant === EnumVariants.THREE_DOTS ||\n      this.variant === EnumVariants.FULL_CIRCLE ||\n      this.variant === EnumVariants.MESH\n    ) {\n      this.style.setProperty('--kemet-loader-dot-size', `${this.size}px`);\n      return html`\n        <div part=\"loader\">\n          ${this.makeLoader()}\n        </div>\n      `;\n    }\n\n    if (this.variant === EnumVariants.SPINNER) {\n      this.style.setProperty('--kemet-loader-size', `${this.size}px`);\n      return html`\n        <div part=\"loader\">\n          ${this.makeLoader()}\n        </div>\n      `;\n    }\n\n    return html`\n      <div style=\"width: ${this.size}px; height: ${this.size}px;\" part=\"loader\">\n        ${this.makeLoader()}\n      </div>\n    `;\n  }\n\n  makeLoader() {\n    switch (this.variant) {\n      case EnumVariants.NO_BORDER:\n        return html`\n          <div class=\"nb-spinner\"></div>\n        `;\n      case EnumVariants.BORDER_TOP:\n        return html`\n          <div class=\"bt-spinner\"></div>\n        `;\n      case EnumVariants.DOUBLE_BORDER:\n        return html`\n          <div class=\"db-spinner\"></div>\n        `;\n      case EnumVariants.DOUBLE_SPINNERS:\n        return html`\n          <div class=\"dbl-spinner\" style=\"width: ${this.size}px; height: ${this.size}px;\"></div>\n          <div class=\"dbl-spinner dbl-spinner--2\" style=\"width: ${this.size}px; height: ${this.size}px;\"></div>\n        `;\n      case EnumVariants.THREE_DOTS:\n        return html`\n          <div class=\"dot-loader\"></div>\n          <div class=\"dot-loader dot-loader--2\"></div>\n          <div class=\"dot-loader dot-loader--3\"></div>\n        `;\n      case EnumVariants.FULL_CIRCLE:\n        return html`\n          <div class=\"circle-loader\">\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n          </div>\n        `;\n      case EnumVariants.SPINNER:\n        return html`\n          <div class=\"ml-loader\">\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n            <div></div>\n          </div>\n        `;\n      case EnumVariants.MESH:\n        return html`\n          <div class=\"mesh-loader\">\n            <div class=\"set-one\">\n              <div class=\"circle\"></div>\n              <div class=\"circle\"></div>\n            </div>\n            <div class=\"set-two\">\n              <div class=\"circle\"></div>\n              <div class=\"circle\"></div>\n            </div>\n          </div>\n        `;\n    }\n  }\n}\n","export { property, state, query, queryAll } from 'lit/decorators.js';\nimport { customElement as litCustomElement } from 'lit/decorators.js';\n\n/**\n * A drop-in replacement for lit's `customElement` decorator that is safe under\n * hot-module-replacement / live-reload environments where the module may be\n * re-evaluated.\n */\nexport const customElement = (tagName: string) => (classOrDescriptor: any) =>\n  typeof customElements !== 'undefined' && !customElements.get(tagName)\n    ? litCustomElement(tagName)(classOrDescriptor)\n    : classOrDescriptor;\n","import { css } from 'lit';\n\nexport default css`:host {\n  --kemet-loader-color: var(--kemet-color-brand-primary-base);\n  --kemet-loader-thickness: 4px;\n  --kemet-loader-dot-size: 24px;\n  --kemet-loader-size: 48px;\n\n  /* private variables */\n  --_kemet-loader-three-dot-gap: calc(var(--kemet-loader-dot-size) * 0.5);\n  --_kemet-loader-circle-radius: calc(var(--kemet-loader-dot-size) * 2.04);\n  --_kemet-loader-spinner-radius: calc(var(--kemet-loader-size) * 0.43);\n  --_kemet-loader-spinner-bar-width: calc(var(--kemet-loader-size) * 0.07);\n  --_kemet-loader-spinner-bar-height: calc(var(--kemet-loader-size) * 0.26);\n\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  position: relative;\n}\n\n:host([variant=three-dots]) > div {\n  display: inline-flex;\n  gap: var(--_kemet-loader-three-dot-gap);\n  align-items: center;\n  justify-content: center;\n}\n\n/* NO BORDER SPINNER */\n.nb-spinner {\n  width: 100%;\n  height: 100%;\n  margin: 0;\n  background: transparent;\n  border-top: var(--kemet-loader-thickness) solid;\n  border-right: var(--kemet-loader-thickness) solid transparent;\n  border-radius: 50%;\n  animation: 1s spin linear infinite;\n}\n\n/* BORDER TOP SPINNER */\n.bt-spinner {\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n  background-color: transparent;\n  border: var(--kemet-loader-thickness) solid;\n  border-top-color: var(--kemet-loader-color);\n  animation: 1s spin linear infinite;\n}\n\n/* DOUBLE BORDER SPINNER */\n.db-spinner {\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n  background-color: transparent;\n  border: var(--kemet-loader-thickness) solid #222;\n  border-top-color: var(--kemet-loader-color);\n  border-bottom-color: var(--kemet-loader-color);\n  animation: 1s spin linear infinite;\n}\n\n/* DOUBLE SPINNER */\n.double-spinner {\n  position: relative;\n}\n\n.dbl-spinner {\n  position: absolute;\n  border-radius: 50%;\n  background-color: transparent;\n  border: var(--kemet-loader-thickness) solid transparent;\n  border-top: var(--kemet-loader-thickness) solid;\n  border-left: var(--kemet-loader-thickness) solid;\n  animation: 2s spin linear infinite;\n}\n\n.dbl-spinner--2 {\n  border: var(--kemet-loader-thickness) solid transparent;\n  border-right: var(--kemet-loader-thickness) solid var(--kemet-loader-color);\n  border-bottom: var(--kemet-loader-thickness) solid var(--kemet-loader-color);\n  animation: 1s spin linear infinite;\n}\n\n\n/* 3 DOT LOADER */\n.dot-loader {\n  width: var(--kemet-loader-dot-size);\n  height: var(--kemet-loader-dot-size);\n  border-radius: 50%;\n  background-color: var(--kemet-loader-color);\n  position: relative;\n  animation: 1.2s grow ease-in-out infinite;\n}\n\n.dot-loader--2 {\n  animation: 1.2s grow ease-in-out infinite 0.15555s;\n}\n\n.dot-loader--3 {\n  animation: 1.2s grow ease-in-out infinite 0.3s;\n}\n\n\n/* CIRCLE DOT LOADER */\n.circle-loader {\n  position: relative;\n  display: flex;\n  align-self: center;\n  justify-self: center;\n  width: calc(var(--_kemet-loader-circle-radius) * 2 + var(--kemet-loader-dot-size));\n  height: calc(var(--_kemet-loader-circle-radius) * 2 + var(--kemet-loader-dot-size));\n}\n\n.circle-loader div {\n  height: var(--kemet-loader-dot-size);\n  width: var(--kemet-loader-dot-size);\n  background-color: var(--kemet-loader-color);\n  border-radius: 50%;\n  position: absolute;\n  animation: 0.8s opaque ease-in-out infinite both;\n  transform: translate(-50%, -50%);\n}\n\n.circle-loader > div:nth-child(1) {\n  top: calc(50% + var(--_kemet-loader-circle-radius) * -1);\n  left: 50%;\n}\n\n.circle-loader > div:nth-child(2) {\n  top: calc(50% + var(--_kemet-loader-circle-radius) * -0.707);\n  left: calc(50% + var(--_kemet-loader-circle-radius) * 0.707);\n  animation-delay: 0.1s;\n}\n\n.circle-loader > div:nth-child(3) {\n  top: 50%;\n  left: calc(50% + var(--_kemet-loader-circle-radius));\n  animation-delay: 0.2s;\n}\n\n.circle-loader > div:nth-child(4) {\n  top: calc(50% + var(--_kemet-loader-circle-radius) * 0.707);\n  left: calc(50% + var(--_kemet-loader-circle-radius) * 0.707);\n  animation-delay: 0.3s;\n}\n\n.circle-loader > div:nth-child(5) {\n  top: calc(50% + var(--_kemet-loader-circle-radius));\n  left: 50%;\n  animation-delay: 0.4s;\n}\n\n.circle-loader > div:nth-child(6) {\n  top: calc(50% + var(--_kemet-loader-circle-radius) * 0.707);\n  left: calc(50% + var(--_kemet-loader-circle-radius) * -0.707);\n  animation-delay: 0.5s;\n}\n\n.circle-loader > div:nth-child(7) {\n  top: 50%;\n  left: calc(50% + var(--_kemet-loader-circle-radius) * -1);\n  animation-delay: 0.6s;\n}\n\n.circle-loader > div:nth-child(8) {\n  top: calc(50% + var(--_kemet-loader-circle-radius) * -0.707);\n  left: calc(50% + var(--_kemet-loader-circle-radius) * -0.707);\n  animation-delay: 0.7s;\n}\n\n\n/* MESH LOADER */\n.mesh-loader {\n  overflow: hidden;\n  height: inherit;\n  width: inherit;\n}\n\n.mesh-loader .circle {\n  width: var(--kemet-loader-dot-size);\n  height: var(--kemet-loader-dot-size);\n  position: absolute;\n  background: var(--kemet-loader-color);\n  border-radius: 50%;\n  margin: calc(var(--kemet-loader-dot-size) / -2);\n  animation: mesh 3s ease-in-out infinite -1.5s;\n}\n\n.mesh-loader > div .circle:last-child {\n  animation-delay: 0s;\n}\n\n.mesh-loader > div {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n}\n\n.mesh-loader > div:last-child {\n  transform: rotate(90deg);\n}\n\n\n/* SPINNER 13 */\n.ml-loader {\n  position: relative;\n  width: calc(var(--_kemet-loader-spinner-radius) * 2);\n  height: calc(var(--_kemet-loader-spinner-radius) * 2);\n}\n\n.ml-loader div {\n  transform-origin: var(--_kemet-loader-spinner-radius) var(--_kemet-loader-spinner-radius);\n  animation: 1.2s opaque ease-in-out infinite both;\n}\n\n.ml-loader div::after {\n  content: \"\";\n  display: block;\n  position: absolute;\n  top: 0;\n  left: calc(var(--_kemet-loader-spinner-radius) - var(--_kemet-loader-spinner-bar-width) / 2);\n  width: var(--_kemet-loader-spinner-bar-width);\n  height: var(--_kemet-loader-spinner-bar-height);\n  border-radius: 10px;\n  background-color: var(--kemet-loader-color);\n}\n\n.ml-loader div:nth-child(1) {\n  transform: rotate(0);\n}\n\n.ml-loader div:nth-child(2) {\n  transform: rotate(30deg);\n  animation-delay: 0.1s;\n}\n\n.ml-loader div:nth-child(3) {\n  transform: rotate(60deg);\n  animation-delay: 0.2s;\n}\n\n.ml-loader div:nth-child(4) {\n  transform: rotate(90deg);\n  animation-delay: 0.3s;\n}\n\n.ml-loader div:nth-child(5) {\n  transform: rotate(120deg);\n  animation-delay: 0.4s;\n}\n\n.ml-loader div:nth-child(6) {\n  transform: rotate(150deg);\n  animation-delay: 0.5s;\n}\n\n.ml-loader div:nth-child(7) {\n  transform: rotate(180deg);\n  animation-delay: 0.6s;\n}\n\n.ml-loader div:nth-child(8) {\n  transform: rotate(210deg);\n  animation-delay: 0.7s;\n}\n\n.ml-loader div:nth-child(9) {\n  transform: rotate(240deg);\n  animation-delay: 0.8s;\n}\n\n.ml-loader div:nth-child(10) {\n  transform: rotate(270deg);\n  animation-delay: 0.9s;\n}\n\n.ml-loader div:nth-child(11) {\n  transform: rotate(300deg);\n  animation-delay: 1s;\n}\n\n.ml-loader div:nth-child(12) {\n  transform: rotate(330deg);\n  animation-delay: 1.1s;\n}\n\n.ml-loader div:nth-child(13) {\n  transform: rotate(360deg);\n  animation-delay: 1.2s;\n}\n\n\n\n@keyframes rotate {\n  100% {\n    -webkit-transform: rotate(360deg);\n    transform: rotate(360deg);\n  }\n}\n\n@keyframes spin {\n  from {\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n  }\n  to {\n    -webkit-transform: rotate(360deg);\n    transform: rotate(360deg);\n  }\n}\n\n@keyframes spinBack {\n  from {\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n  }\n  to {\n    -webkit-transform: rotate(-720deg);\n    transform: rotate(-720deg);\n  }\n}\n\n@keyframes spinBorder {\n  0% {\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n    border-width: 15px;\n  }\n  50% {\n    -webkit-transform: rotate(180deg);\n    transform: rotate(180deg);\n    border-width: 3px;\n  }\n  100% {\n    -webkit-transform: rotate(360deg);\n    transform: rotate(360deg);\n    border-width: 15px;\n  }\n}\n\n@keyframes grow {\n  0%, 40%, 100% {\n    -webkit-transform: scale(0);\n            transform: scale(0);\n  }\n  40% {\n    -webkit-transform: scale(1);\n            transform: scale(1);\n  }\n}\n\n@keyframes pulsate {\n  0% {\n    -webkit-transform: rotate(45deg) scale(0.8);\n    transform: rotate(45deg) scale(0.8);\n    transform: rotate(45deg) scale(0.8);\n  }\n  5% {\n    -webkit-transform: rotate(45deg) scale(0.9);\n    transform: rotate(45deg) scale(0.9);\n  }\n  10% {\n    -webkit-transform: rotate(45deg) scale(0.8);\n    transform: rotate(45deg) scale(0.8);\n  }\n  15% {\n    -webkit-transform: rotate(45deg) scale(1);\n    transform: rotate(45deg) scale(1);\n  }\n  50% {\n    -webkit-transform: rotate(45deg) scale(0.8);\n    transform: rotate(45deg) scale(0.8);\n  }\n  100% {\n    -webkit-transform: rotate(45deg) scale(0.8);\n    transform: rotate(45deg) scale(0.8);\n  }\n}\n\n@keyframes opaque {\n  0% {\n    opacity: 0.1;\n  }\n  40% {\n    opacity: 1;\n  }\n  80% {\n    opacity: 0.1;\n  }\n  100% {\n    opacity: 0.1;\n  }\n}\n\n@keyframes mesh {\n  0% {\n    -webkit-transform-origin: 50% -100%;\n    transform-origin: 50% -100%;\n    -webkit-transform: rotate(0);\n    transform: rotate(0);\n  }\n  50% {\n    -webkit-transform-origin: 50% -100%;\n    transform-origin: 50% -100%;\n    -webkit-transform: rotate(360deg);\n    transform: rotate(360deg);\n  }\n  50.1% {\n    -webkit-transform-origin: 50% 200%;\n    transform-origin: 50% 200%;\n    -webkit-transform: rotate(0deg);\n    transform: rotate(0deg);\n  }\n  100% {\n    -webkit-transform-origin: 50% 200%;\n    transform-origin: 50% 200%;\n    -webkit-transform: rotate(360deg);\n    transform: rotate(360deg);\n  }\n}\n`;\n","export const emitEvent = (element, name, detail, bubbles = true, composed = true) => {\n  element.dispatchEvent(\n    new CustomEvent(name, { bubbles, composed, detail }),\n  );\n};\n"],"mappings":";;;;;;;;;;;;AAAA,SAAS,MAAM,kBAA6B;;;ACA5C,SAAS,UAAU,OAAO,OAAO,gBAAgB;AACjD,SAAS,iBAAiB,wBAAwB;AAO3C,IAAM,gBAAgB,CAAC,YAAoB,CAAC,sBACjD,OAAO,mBAAmB,eAAe,CAAC,eAAe,IAAI,OAAO,IAChE,iBAAiB,OAAO,EAAE,iBAAiB,IAC3C;;;ACXN,SAAS,WAAW;AAEpB,IAAO,qBAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACFR,IAAM,YAAY,CAAC,SAAS,MAAM,QAAQ,UAAU,MAAM,WAAW,SAAS;AACnF,UAAQ;AAAA,IACN,IAAI,YAAY,MAAM,EAAE,SAAS,UAAU,OAAO,CAAC;AAAA,EACrD;AACF;;;AHCO,IAAK,eAAL,kBAAKA,kBAAL;AACL,EAAAA,cAAA,eAAY;AACZ,EAAAA,cAAA,gBAAa;AACb,EAAAA,cAAA,mBAAgB;AAChB,EAAAA,cAAA,qBAAkB;AAClB,EAAAA,cAAA,gBAAa;AACb,EAAAA,cAAA,iBAAc;AACd,EAAAA,cAAA,aAAU;AACV,EAAAA,cAAA,UAAO;AARG,SAAAA;AAAA,GAAA;AAiCZ,IAAqB,cAArB,cAAyC,WAAW;AAAA,EAApD;AAAA;AAIE,mBAAwB;AAGxB,gBAAe;AAAA;AAAA,EAEf,eAAe;AACb,cAAU,MAAM,wBAAwB;AAAA,MACtC,SAAS;AAAA,MACT,UAAU;AAAA,MACV,QAAQ;AAAA,QACN,SAAS;AAAA,MACX;AAAA,IACF,CAAC;AAAA,EACH;AAAA,EAEA,SAAS;AACP,QACE,KAAK,YAAY,iCACjB,KAAK,YAAY,mCACjB,KAAK,YAAY,mBACjB;AACA,WAAK,MAAM,YAAY,2BAA2B,GAAG,KAAK,IAAI,IAAI;AAClE,aAAO;AAAA;AAAA,YAED,KAAK,WAAW,CAAC;AAAA;AAAA;AAAA,IAGzB;AAEA,QAAI,KAAK,YAAY,yBAAsB;AACzC,WAAK,MAAM,YAAY,uBAAuB,GAAG,KAAK,IAAI,IAAI;AAC9D,aAAO;AAAA;AAAA,YAED,KAAK,WAAW,CAAC;AAAA;AAAA;AAAA,IAGzB;AAEA,WAAO;AAAA,2BACgB,KAAK,IAAI,eAAe,KAAK,IAAI;AAAA,UAClD,KAAK,WAAW,CAAC;AAAA;AAAA;AAAA,EAGzB;AAAA,EAEA,aAAa;AACX,YAAQ,KAAK,SAAS;AAAA,MACpB,KAAK;AACH,eAAO;AAAA;AAAA;AAAA,MAGT,KAAK;AACH,eAAO;AAAA;AAAA;AAAA,MAGT,KAAK;AACH,eAAO;AAAA;AAAA;AAAA,MAGT,KAAK;AACH,eAAO;AAAA,mDACoC,KAAK,IAAI,eAAe,KAAK,IAAI;AAAA,kEAClB,KAAK,IAAI,eAAe,KAAK,IAAI;AAAA;AAAA,MAE7F,KAAK;AACH,eAAO;AAAA;AAAA;AAAA;AAAA;AAAA,MAKT,KAAK;AACH,eAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAYT,KAAK;AACH,eAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,MAgBT,KAAK;AACH,eAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAYX;AAAA,EACF;AACF;AAvHqB,YACZ,SAAS,CAAC,kBAAM;AAGvB;AAAA,EADC,SAAS,EAAE,MAAM,QAAQ,SAAS,KAAK,CAAC;AAAA,GAHtB,YAInB;AAGA;AAAA,EADC,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GANP,YAOnB;AAPmB,cAArB;AAAA,EADC,cAAc,cAAc;AAAA,GACR;","names":["EnumVariants"]}

package/dist/elements/password/index.d.ts

@@ -1,6 +1,6 @@
 import * as lit from 'lit';
 import { LitElement, TemplateResult } from 'lit';
-import { E as EnumAppearances, H as HTMLKemetFieldElement, c as HTMLKemetInputElement, f as HTMLKemetTextareaElement } from '../../constants-CHvA2ed5.js';
+import { e as EnumAppearances, H as HTMLKemetFieldElement, c as HTMLKemetInputElement, f as HTMLKemetTextareaElement } from '../../constants-Dj9X-JwG.js';
 import 'lit-html';
 import '../../form-controller-3q581XcZ.js';
 

package/dist/elements/radios/index.d.ts

@@ -2,7 +2,7 @@ import * as lit_html from 'lit-html';
 import * as lit from 'lit';
 import { LitElement } from 'lit';
 import { F as FormSubmitController } from '../../form-controller-3q581XcZ.js';
-import { g as EnumAxis, E as EnumAppearances } from '../../constants-CHvA2ed5.js';
+import { g as EnumAxis, e as EnumAppearances } from '../../constants-Dj9X-JwG.js';
 import KemetRadio from '../radio/index.js';
 
 /**

package/dist/elements/select/index.d.ts

@@ -1,7 +1,7 @@
 import * as lit from 'lit';
 import { LitElement, TemplateResult } from 'lit';
 import { F as FormSubmitController } from '../../form-controller-3q581XcZ.js';
-import { e as EnumRoundedSizes, H as HTMLKemetFieldElement } from '../../constants-CHvA2ed5.js';
+import { E as EnumRoundedSizes, H as HTMLKemetFieldElement } from '../../constants-Dj9X-JwG.js';
 import KemetSelectOption from '../select-option/index.js';
 import '../icon/index.js';
 import 'lit-html';

package/dist/elements/tabs/index.d.ts

@@ -1,7 +1,7 @@
 import * as lit_html from 'lit-html';
 import * as lit from 'lit';
 import { LitElement } from 'lit';
-import { h as EnumDirections } from '../../constants-CHvA2ed5.js';
+import { h as EnumDirections } from '../../constants-Dj9X-JwG.js';
 import KemetTab from '../tab/index.js';
 import KemetTabPanel from '../tab-panel/index.js';
 import '../../form-controller-3q581XcZ.js';

package/dist/elements/textarea/index.d.ts

@@ -1,4 +1,4 @@
 import 'lit-html';
 import 'lit';
 import '../../form-controller-3q581XcZ.js';
-export { f as default } from '../../constants-CHvA2ed5.js';
+export { f as default } from '../../constants-Dj9X-JwG.js';

package/dist/wrappers/react.d.ts

@@ -9,7 +9,7 @@ import KemetAvatars$1 from '../elements/avatars/index.js';
 import KemetBadge$1 from '../elements/badge/index.js';
 import KemetCard$1 from '../elements/card/index.js';
 import KemetCheckbox$1 from '../elements/checkbox/index.js';
-import { K as KemetCombo$1, I as InterfaceKemetSelectionEvent, a as KemetCount$1, b as InterfaceInputDetails, H as HTMLKemetFieldElement, c as HTMLKemetInputElement } from '../constants-CHvA2ed5.js';
+import { K as KemetCombo$1, I as InterfaceKemetSelectionEvent, a as KemetCount$1, b as InterfaceInputDetails, H as HTMLKemetFieldElement, c as HTMLKemetInputElement } from '../constants-Dj9X-JwG.js';
 import KemetDrawer$1 from '../elements/drawer/index.js';
 import KemetFAB from '../elements/fab/index.js';
 import KemetFlipcard$1 from '../elements/flipcard/index.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "kemet-ui",
-  "version": "5.0.2",
+  "version": "5.0.3",
   "description": "A framework agnostic design system that's blessed by the gods.",
   "type": "module",
   "scripts": {