@phcdevworks/spectre-components 1.4.0 → 1.5.0

package/dist/index.js

@@ -1,4 +1,4 @@
-import { getButtonClasses, getInputLabelClasses, getInputClasses, getBadgeClasses, getCardClasses, getIconBoxClasses, getRatingClasses, getRatingStarClasses, getRatingStarsClasses, getRatingTextClasses, getTestimonialClasses } from '@phcdevworks/spectre-ui';
+import { getButtonClasses, getInputLabelClasses, getInputClasses, getBadgeClasses, getCardClasses, getIconBoxClasses, getRatingClasses, getRatingStarClasses, getRatingStarsClasses, getRatingTextClasses, getTestimonialClasses, getAlertClasses, getAvatarClasses, getSpinnerClasses, getTagClasses, getPricingCardClasses } from '@phcdevworks/spectre-ui';
 import { LitElement, html, nothing } from 'lit';
 import { ifDefined } from 'lit/directives/if-defined.js';
 import { live } from 'lit/directives/live.js';
@@ -57,7 +57,22 @@ var spectreBadgeVariants = [
 function isBadgeVariant(value) {
   return spectreBadgeVariants.includes(value);
 }
-var spectreCardVariants = ["elevated", "flat", "outline", "ghost"];
+var spectreAlertVariants = [
+  "info",
+  "success",
+  "warning",
+  "danger",
+  "neutral"
+];
+function isAlertVariant(value) {
+  return spectreAlertVariants.includes(value);
+}
+var spectreCardVariants = [
+  "elevated",
+  "flat",
+  "outline",
+  "ghost"
+];
 function isCardVariant(value) {
   return spectreCardVariants.includes(value);
 }
@@ -77,9 +92,55 @@ var spectreIconBoxVariants = [
 function isIconBoxVariant(value) {
   return spectreIconBoxVariants.includes(value);
 }
-var spectreTestimonialVariants = ["elevated", "flat", "outline", "ghost"];
+var spectreTestimonialVariants = [
+  "elevated",
+  "flat",
+  "outline",
+  "ghost"
+];
 function isTestimonialVariant(value) {
-  return spectreTestimonialVariants.includes(value);
+  return spectreTestimonialVariants.includes(
+    value
+  );
+}
+var spectreSpinnerVariants = [
+  "primary",
+  "secondary",
+  "success",
+  "warning",
+  "danger",
+  "info",
+  "neutral",
+  "accent",
+  "cta"
+];
+function isSpinnerVariant(value) {
+  return spectreSpinnerVariants.includes(value);
+}
+var spectreTagVariants = [
+  "default",
+  "primary",
+  "secondary",
+  "success",
+  "warning",
+  "danger",
+  "info",
+  "neutral",
+  "accent",
+  "cta",
+  "outline",
+  "ghost"
+];
+function isTagVariant(value) {
+  return spectreTagVariants.includes(value);
+}
+var spectreAvatarSizes = ["xs", "sm", "md", "lg", "xl"];
+function isAvatarSize(value) {
+  return spectreAvatarSizes.includes(value);
+}
+var spectreAvatarShapes = ["circle", "square"];
+function isAvatarShape(value) {
+  return spectreAvatarShapes.includes(value);
 }
 function normalizeInt(value, fallback, min = 0) {
   if (value == null || typeof value !== "number" || !Number.isInteger(value) || value < min) {
@@ -1646,15 +1707,19 @@ var SpectreBadgeElement = class extends SpectreProjectableElement {
   }
   get badgeClasses() {
     return getBadgeClasses({
-      disabled: this.disabled ?? false,
+      disabled: this.isDisabled,
       fullWidth: this.fullWidth ?? false,
       loading: this.loading ?? false,
       size: this.size,
       variant: this.variant
     });
   }
+  get isDisabled() {
+    return (this.disabled ?? false) || (this.loading ?? false);
+  }
   render() {
     return html`<span
+      aria-busy="${this.loading ? "true" : "false"}"
       aria-describedby="${ifDefined(this.forwardedAriaDescribedBy)}"
       aria-label="${ifDefined(this.forwardedAriaLabel)}"
       aria-labelledby="${ifDefined(this.forwardedAriaLabelledBy)}"
@@ -1736,7 +1801,7 @@ var SpectreCardElement = class extends SpectreProjectableElement {
   }
   get cardClasses() {
     return getCardClasses({
-      disabled: this.disabled ?? false,
+      disabled: this.isDisabled,
       fullHeight: this.fullHeight ?? false,
       interactive: this.interactive ?? false,
       loading: this.loading ?? false,
@@ -1744,8 +1809,12 @@ var SpectreCardElement = class extends SpectreProjectableElement {
       variant: this.variant
     });
   }
+  get isDisabled() {
+    return (this.disabled ?? false) || (this.loading ?? false);
+  }
   render() {
     return html`<div
+      aria-busy="${this.loading ? "true" : "false"}"
       aria-describedby="${ifDefined(this.forwardedAriaDescribedBy)}"
       aria-label="${ifDefined(this.forwardedAriaLabel)}"
       aria-labelledby="${ifDefined(this.forwardedAriaLabelledBy)}"
@@ -1832,7 +1901,7 @@ var SpectreIconBoxElement = class extends SpectreProjectableElement {
   }
   get iconBoxClasses() {
     return getIconBoxClasses({
-      disabled: this.disabled ?? false,
+      disabled: this.isDisabled,
       fullWidth: this.fullWidth ?? false,
       interactive: this.interactive ?? false,
       loading: this.loading ?? false,
@@ -1841,8 +1910,12 @@ var SpectreIconBoxElement = class extends SpectreProjectableElement {
       variant: this.variant
     });
   }
+  get isDisabled() {
+    return (this.disabled ?? false) || (this.loading ?? false);
+  }
   render() {
     return html`<div
+      aria-busy="${this.loading ? "true" : "false"}"
       aria-describedby="${ifDefined(this.forwardedAriaDescribedBy)}"
       aria-label="${ifDefined(this.forwardedAriaLabel)}"
       aria-labelledby="${ifDefined(this.forwardedAriaLabelledBy)}"
@@ -1914,11 +1987,14 @@ var SpectreRatingElement = class extends SpectreBaseElement {
   }
   get ratingClasses() {
     return getRatingClasses({
-      disabled: this.disabled ?? false,
+      disabled: this.isDisabled,
       loading: this.loading ?? false,
       size: this.size
     });
   }
+  get isDisabled() {
+    return (this.disabled ?? false) || (this.loading ?? false);
+  }
   get effectiveMax() {
     return this.max ?? 5;
   }
@@ -1940,6 +2016,7 @@ var SpectreRatingElement = class extends SpectreBaseElement {
   render() {
     const trimmedLabel = this.label?.trim();
     return html`<div
+      aria-busy="${this.loading ? "true" : "false"}"
       aria-describedby="${ifDefined(this.forwardedAriaDescribedBy)}"
       aria-label="${this.computedAriaLabel}"
       aria-labelledby="${ifDefined(this.forwardedAriaLabelledBy)}"
@@ -1950,7 +2027,7 @@ var SpectreRatingElement = class extends SpectreBaseElement {
       title="${ifDefined(this.title || void 0)}"
     >
       <div class="${getRatingStarsClasses()}">${this.renderStars()}</div>
-      ${trimmedLabel ? html`<span class="${getRatingTextClasses({ disabled: this.disabled ?? false })}">${trimmedLabel}</span>` : nothing}
+      ${trimmedLabel ? html`<span class="${getRatingTextClasses({ disabled: this.isDisabled })}">${trimmedLabel}</span>` : nothing}
     </div>`;
   }
 };
@@ -2020,15 +2097,19 @@ var SpectreTestimonialElement = class extends SpectreProjectableElement {
   }
   get testimonialClasses() {
     return getTestimonialClasses({
-      disabled: this.disabled ?? false,
+      disabled: this.isDisabled,
       fullHeight: this.fullHeight ?? false,
       interactive: this.interactive ?? false,
       loading: this.loading ?? false,
       variant: this.variant
     });
   }
+  get isDisabled() {
+    return (this.disabled ?? false) || (this.loading ?? false);
+  }
   render() {
     return html`<div
+      aria-busy="${this.loading ? "true" : "false"}"
       aria-describedby="${ifDefined(this.forwardedAriaDescribedBy)}"
       aria-label="${ifDefined(this.forwardedAriaLabel)}"
       aria-labelledby="${ifDefined(this.forwardedAriaLabelledBy)}"
@@ -2056,6 +2137,475 @@ function defineSpectreTestimonial(tagName = "sp-testimonial") {
   customElements.define(tagName, SpectreTestimonialElement);
   return SpectreTestimonialElement;
 }
+var SpectreAlertElement = class extends SpectreProjectableElement {
+  constructor() {
+    super(...arguments);
+    this.dismissed = false;
+    this.disabled = false;
+    this.fullWidth = false;
+    this.loading = false;
+    this.size = "md";
+    this.variant = "info";
+  }
+  get id() {
+    return super.id;
+  }
+  set id(value) {
+    super.id = value;
+  }
+  get title() {
+    return super.title;
+  }
+  set title(value) {
+    super.title = value;
+  }
+  getContentContainer() {
+    return this.querySelector("[data-sp-alert-native]");
+  }
+  isInternalNode(node) {
+    if (node.nodeType !== Node.ELEMENT_NODE) {
+      return false;
+    }
+    const el = node;
+    return el.hasAttribute("data-sp-alert-native");
+  }
+  willUpdate(changedProperties) {
+    if (changedProperties.has("dismissed") && this.dismissed == null) {
+      this.dismissed = false;
+    }
+    if (changedProperties.has("disabled") && this.disabled == null) {
+      this.disabled = false;
+    }
+    if (changedProperties.has("fullWidth") && this.fullWidth == null) {
+      this.fullWidth = false;
+    }
+    if (changedProperties.has("loading") && this.loading == null) {
+      this.loading = false;
+    }
+    if (changedProperties.has("variant") && (this.variant == null || !isAlertVariant(this.variant))) {
+      this.variant = "info";
+    }
+    if (changedProperties.has("size") && (this.size == null || !isInputSize(this.size))) {
+      this.size = "md";
+    }
+  }
+  get alertClasses() {
+    return getAlertClasses({
+      disabled: this.isDisabled,
+      dismissed: this.dismissed ?? false,
+      fullWidth: this.fullWidth ?? false,
+      loading: this.loading ?? false,
+      size: this.size,
+      variant: this.variant
+    });
+  }
+  get isDisabled() {
+    return (this.disabled ?? false) || (this.loading ?? false);
+  }
+  render() {
+    return html`<div
+      aria-busy="${this.loading ? "true" : "false"}"
+      aria-describedby="${ifDefined(this.forwardedAriaDescribedBy)}"
+      aria-label="${ifDefined(this.forwardedAriaLabel)}"
+      aria-labelledby="${ifDefined(this.forwardedAriaLabelledBy)}"
+      class="${this.alertClasses}"
+      data-sp-alert-native
+      id="${ifDefined(this.id || void 0)}"
+      role="alert"
+      title="${ifDefined(this.title || void 0)}"
+    >
+      ${this.hasProjectedContent ? this.projectedContent : nothing}
+    </div>`;
+  }
+};
+SpectreAlertElement.properties = {
+  dismissed: { type: Boolean, reflect: true },
+  disabled: { type: Boolean, reflect: true },
+  fullWidth: { attribute: "full-width", type: Boolean, reflect: true },
+  loading: { type: Boolean, reflect: true },
+  size: { type: String, reflect: true },
+  variant: { type: String, reflect: true }
+};
+function defineSpectreAlert(tagName = "sp-alert") {
+  const existingElement = customElements.get(tagName);
+  if (existingElement) {
+    return existingElement;
+  }
+  customElements.define(tagName, SpectreAlertElement);
+  return SpectreAlertElement;
+}
+var SpectreAvatarElement = class extends SpectreProjectableElement {
+  constructor() {
+    super(...arguments);
+    this.disabled = false;
+    this.fullWidth = false;
+    this.interactive = false;
+    this.loading = false;
+    this.placeholder = false;
+    this.shape = "circle";
+    this.size = "md";
+  }
+  get id() {
+    return super.id;
+  }
+  set id(value) {
+    super.id = value;
+  }
+  get title() {
+    return super.title;
+  }
+  set title(value) {
+    super.title = value;
+  }
+  getContentContainer() {
+    return this.querySelector("[data-sp-avatar-native]");
+  }
+  isInternalNode(node) {
+    if (node.nodeType !== Node.ELEMENT_NODE) {
+      return false;
+    }
+    const el = node;
+    return el.hasAttribute("data-sp-avatar-native");
+  }
+  willUpdate(changedProperties) {
+    if (changedProperties.has("disabled") && this.disabled == null) {
+      this.disabled = false;
+    }
+    if (changedProperties.has("fullWidth") && this.fullWidth == null) {
+      this.fullWidth = false;
+    }
+    if (changedProperties.has("interactive") && this.interactive == null) {
+      this.interactive = false;
+    }
+    if (changedProperties.has("loading") && this.loading == null) {
+      this.loading = false;
+    }
+    if (changedProperties.has("placeholder") && this.placeholder == null) {
+      this.placeholder = false;
+    }
+    if (changedProperties.has("shape") && (this.shape == null || !isAvatarShape(this.shape))) {
+      this.shape = "circle";
+    }
+    if (changedProperties.has("size") && (this.size == null || !isAvatarSize(this.size))) {
+      this.size = "md";
+    }
+  }
+  get avatarClasses() {
+    return getAvatarClasses({
+      disabled: this.isDisabled,
+      fullWidth: this.fullWidth ?? false,
+      interactive: this.interactive ?? false,
+      loading: this.loading ?? false,
+      placeholder: this.placeholder ?? false,
+      shape: this.shape,
+      size: this.size
+    });
+  }
+  get isDisabled() {
+    return (this.disabled ?? false) || (this.loading ?? false);
+  }
+  render() {
+    return html`<div
+      aria-busy="${this.loading ? "true" : "false"}"
+      aria-describedby="${ifDefined(this.forwardedAriaDescribedBy)}"
+      aria-label="${ifDefined(this.forwardedAriaLabel)}"
+      aria-labelledby="${ifDefined(this.forwardedAriaLabelledBy)}"
+      class="${this.avatarClasses}"
+      data-sp-avatar-native
+      id="${ifDefined(this.id || void 0)}"
+      title="${ifDefined(this.title || void 0)}"
+    >
+      ${this.hasProjectedContent ? this.projectedContent : nothing}
+    </div>`;
+  }
+};
+SpectreAvatarElement.properties = {
+  disabled: { type: Boolean, reflect: true },
+  fullWidth: { attribute: "full-width", type: Boolean, reflect: true },
+  interactive: { type: Boolean, reflect: true },
+  loading: { type: Boolean, reflect: true },
+  placeholder: { type: Boolean, reflect: true },
+  shape: { type: String, reflect: true },
+  size: { type: String, reflect: true }
+};
+function defineSpectreAvatar(tagName = "sp-avatar") {
+  const existingElement = customElements.get(tagName);
+  if (existingElement) {
+    return existingElement;
+  }
+  customElements.define(tagName, SpectreAvatarElement);
+  return SpectreAvatarElement;
+}
+var SpectreSpinnerElement = class extends SpectreBaseElement {
+  constructor() {
+    super(...arguments);
+    this.disabled = false;
+    this.loading = true;
+    this.size = "md";
+  }
+  get id() {
+    return super.id;
+  }
+  set id(value) {
+    super.id = value;
+  }
+  get title() {
+    return super.title;
+  }
+  set title(value) {
+    super.title = value;
+  }
+  willUpdate(changedProperties) {
+    if (changedProperties.has("disabled") && this.disabled == null) {
+      this.disabled = false;
+    }
+    if (changedProperties.has("loading") && this.loading == null) {
+      this.loading = true;
+    }
+    if (changedProperties.has("size") && (this.size == null || !isInputSize(this.size))) {
+      this.size = "md";
+    }
+    if (changedProperties.has("variant") && this.variant != null && !isSpinnerVariant(this.variant)) {
+      this.variant = void 0;
+    }
+  }
+  get spinnerClasses() {
+    return getSpinnerClasses({
+      disabled: this.disabled ?? false,
+      loading: this.loading ?? true,
+      size: this.size,
+      ...this.variant != null ? { variant: this.variant } : {}
+    });
+  }
+  get computedAriaLabel() {
+    return this.forwardedAriaLabel ?? "Loading";
+  }
+  render() {
+    return html`<div
+      aria-busy="${this.loading ? "true" : "false"}"
+      aria-describedby="${ifDefined(this.forwardedAriaDescribedBy)}"
+      aria-label="${this.computedAriaLabel}"
+      aria-labelledby="${ifDefined(this.forwardedAriaLabelledBy)}"
+      class="${this.spinnerClasses}"
+      data-sp-spinner-native
+      id="${ifDefined(this.id || void 0)}"
+      role="status"
+      title="${ifDefined(this.title || void 0)}"
+    ></div>`;
+  }
+};
+SpectreSpinnerElement.properties = {
+  disabled: { type: Boolean, reflect: true },
+  loading: { type: Boolean, reflect: true },
+  size: { type: String, reflect: true },
+  variant: { type: String, reflect: true }
+};
+function defineSpectreSpinner(tagName = "sp-spinner") {
+  const existingElement = customElements.get(tagName);
+  if (existingElement) {
+    return existingElement;
+  }
+  customElements.define(tagName, SpectreSpinnerElement);
+  return SpectreSpinnerElement;
+}
+var SpectreTagElement = class extends SpectreProjectableElement {
+  constructor() {
+    super(...arguments);
+    this.dismissible = false;
+    this.disabled = false;
+    this.fullWidth = false;
+    this.interactive = false;
+    this.loading = false;
+    this.selected = false;
+    this.size = "md";
+    this.variant = "default";
+  }
+  get id() {
+    return super.id;
+  }
+  set id(value) {
+    super.id = value;
+  }
+  get title() {
+    return super.title;
+  }
+  set title(value) {
+    super.title = value;
+  }
+  getContentContainer() {
+    return this.querySelector("[data-sp-tag-native]");
+  }
+  isInternalNode(node) {
+    if (node.nodeType !== Node.ELEMENT_NODE) {
+      return false;
+    }
+    const el = node;
+    return el.hasAttribute("data-sp-tag-native");
+  }
+  willUpdate(changedProperties) {
+    if (changedProperties.has("dismissible") && this.dismissible == null) {
+      this.dismissible = false;
+    }
+    if (changedProperties.has("disabled") && this.disabled == null) {
+      this.disabled = false;
+    }
+    if (changedProperties.has("fullWidth") && this.fullWidth == null) {
+      this.fullWidth = false;
+    }
+    if (changedProperties.has("interactive") && this.interactive == null) {
+      this.interactive = false;
+    }
+    if (changedProperties.has("loading") && this.loading == null) {
+      this.loading = false;
+    }
+    if (changedProperties.has("selected") && this.selected == null) {
+      this.selected = false;
+    }
+    if (changedProperties.has("size") && (this.size == null || !isInputSize(this.size))) {
+      this.size = "md";
+    }
+    if (changedProperties.has("variant") && (this.variant == null || !isTagVariant(this.variant))) {
+      this.variant = "default";
+    }
+  }
+  get tagClasses() {
+    return getTagClasses({
+      disabled: this.isDisabled,
+      dismissible: this.dismissible ?? false,
+      fullWidth: this.fullWidth ?? false,
+      interactive: this.interactive ?? false,
+      loading: this.loading ?? false,
+      selected: this.selected ?? false,
+      size: this.size,
+      variant: this.variant
+    });
+  }
+  get isDisabled() {
+    return (this.disabled ?? false) || (this.loading ?? false);
+  }
+  render() {
+    return html`<span
+      aria-busy="${this.loading ? "true" : "false"}"
+      aria-describedby="${ifDefined(this.forwardedAriaDescribedBy)}"
+      aria-label="${ifDefined(this.forwardedAriaLabel)}"
+      aria-labelledby="${ifDefined(this.forwardedAriaLabelledBy)}"
+      class="${this.tagClasses}"
+      data-sp-tag-native
+      id="${ifDefined(this.id || void 0)}"
+      title="${ifDefined(this.title || void 0)}"
+    >
+      ${this.hasProjectedContent ? this.projectedContent : nothing}
+    </span>`;
+  }
+};
+SpectreTagElement.properties = {
+  dismissible: { type: Boolean, reflect: true },
+  disabled: { type: Boolean, reflect: true },
+  fullWidth: { attribute: "full-width", type: Boolean, reflect: true },
+  interactive: { type: Boolean, reflect: true },
+  loading: { type: Boolean, reflect: true },
+  selected: { type: Boolean, reflect: true },
+  size: { type: String, reflect: true },
+  variant: { type: String, reflect: true }
+};
+function defineSpectreTag(tagName = "sp-tag") {
+  const existingElement = customElements.get(tagName);
+  if (existingElement) {
+    return existingElement;
+  }
+  customElements.define(tagName, SpectreTagElement);
+  return SpectreTagElement;
+}
+var SpectrePricingCardElement = class extends SpectreProjectableElement {
+  constructor() {
+    super(...arguments);
+    this.disabled = false;
+    this.featured = false;
+    this.fullHeight = false;
+    this.interactive = false;
+    this.loading = false;
+  }
+  get id() {
+    return super.id;
+  }
+  set id(value) {
+    super.id = value;
+  }
+  get title() {
+    return super.title;
+  }
+  set title(value) {
+    super.title = value;
+  }
+  getContentContainer() {
+    return this.querySelector("[data-sp-pricing-card-native]");
+  }
+  isInternalNode(node) {
+    if (node.nodeType !== Node.ELEMENT_NODE) {
+      return false;
+    }
+    const el = node;
+    return el.hasAttribute("data-sp-pricing-card-native");
+  }
+  willUpdate(changedProperties) {
+    if (changedProperties.has("disabled") && this.disabled == null) {
+      this.disabled = false;
+    }
+    if (changedProperties.has("featured") && this.featured == null) {
+      this.featured = false;
+    }
+    if (changedProperties.has("fullHeight") && this.fullHeight == null) {
+      this.fullHeight = false;
+    }
+    if (changedProperties.has("interactive") && this.interactive == null) {
+      this.interactive = false;
+    }
+    if (changedProperties.has("loading") && this.loading == null) {
+      this.loading = false;
+    }
+  }
+  get pricingCardClasses() {
+    return getPricingCardClasses({
+      disabled: this.isDisabled,
+      featured: this.featured ?? false,
+      fullHeight: this.fullHeight ?? false,
+      interactive: this.interactive ?? false,
+      loading: this.loading ?? false
+    });
+  }
+  get isDisabled() {
+    return (this.disabled ?? false) || (this.loading ?? false);
+  }
+  render() {
+    return html`<div
+      aria-busy="${this.loading ? "true" : "false"}"
+      aria-describedby="${ifDefined(this.forwardedAriaDescribedBy)}"
+      aria-label="${ifDefined(this.forwardedAriaLabel)}"
+      aria-labelledby="${ifDefined(this.forwardedAriaLabelledBy)}"
+      class="${this.pricingCardClasses}"
+      data-sp-pricing-card-native
+      id="${ifDefined(this.id || void 0)}"
+      title="${ifDefined(this.title || void 0)}"
+    >
+      ${this.hasProjectedContent ? this.projectedContent : nothing}
+    </div>`;
+  }
+};
+SpectrePricingCardElement.properties = {
+  disabled: { type: Boolean, reflect: true },
+  featured: { type: Boolean, reflect: true },
+  fullHeight: { attribute: "full-height", type: Boolean, reflect: true },
+  interactive: { type: Boolean, reflect: true },
+  loading: { type: Boolean, reflect: true }
+};
+function defineSpectrePricingCard(tagName = "sp-pricing-card") {
+  const existingElement = customElements.get(tagName);
+  if (existingElement) {
+    return existingElement;
+  }
+  customElements.define(tagName, SpectrePricingCardElement);
+  return SpectrePricingCardElement;
+}
 
 // src/index.ts
 function defineSpectreComponents() {
@@ -2072,8 +2622,13 @@ function defineSpectreComponents() {
   defineSpectreIconBox();
   defineSpectreRating();
   defineSpectreTestimonial();
+  defineSpectreAlert();
+  defineSpectreAvatar();
+  defineSpectreSpinner();
+  defineSpectreTag();
+  defineSpectrePricingCard();
 }
 
-export { SpectreBadgeElement, SpectreButtonElement, SpectreCardElement, SpectreCheckboxElement, SpectreFieldsetElement, SpectreIconBoxElement, SpectreInputElement, SpectreLabelElement, SpectreRadioElement, SpectreRatingElement, SpectreSelectElement, SpectreTestimonialElement, SpectreTextareaElement, defineSpectreBadge, defineSpectreButton, defineSpectreCard, defineSpectreCheckbox, defineSpectreComponents, defineSpectreFieldset, defineSpectreIconBox, defineSpectreInput, defineSpectreLabel, defineSpectreRadio, defineSpectreRating, defineSpectreSelect, defineSpectreTestimonial, defineSpectreTextarea, spectreInputSizes as spectreBadgeSizes, spectreBadgeVariants, spectreInputSizes as spectreButtonSizes, spectreButtonTypes, spectreButtonVariants, spectreCardVariants, spectreInputSizes as spectreIconBoxSizes, spectreIconBoxVariants, spectreInputSizes, spectreInputTypes, spectreInputSizes as spectreRatingSizes, spectreTestimonialVariants };
+export { SpectreAlertElement, SpectreAvatarElement, SpectreBadgeElement, SpectreButtonElement, SpectreCardElement, SpectreCheckboxElement, SpectreFieldsetElement, SpectreIconBoxElement, SpectreInputElement, SpectreLabelElement, SpectrePricingCardElement, SpectreRadioElement, SpectreRatingElement, SpectreSelectElement, SpectreSpinnerElement, SpectreTagElement, SpectreTestimonialElement, SpectreTextareaElement, defineSpectreAlert, defineSpectreAvatar, defineSpectreBadge, defineSpectreButton, defineSpectreCard, defineSpectreCheckbox, defineSpectreComponents, defineSpectreFieldset, defineSpectreIconBox, defineSpectreInput, defineSpectreLabel, defineSpectrePricingCard, defineSpectreRadio, defineSpectreRating, defineSpectreSelect, defineSpectreSpinner, defineSpectreTag, defineSpectreTestimonial, defineSpectreTextarea, spectreInputSizes as spectreAlertSizes, spectreAlertVariants, spectreAvatarShapes, spectreAvatarSizes, spectreInputSizes as spectreBadgeSizes, spectreBadgeVariants, spectreInputSizes as spectreButtonSizes, spectreButtonTypes, spectreButtonVariants, spectreCardVariants, spectreInputSizes as spectreIconBoxSizes, spectreIconBoxVariants, spectreInputSizes, spectreInputTypes, spectreInputSizes as spectreRatingSizes, spectreInputSizes as spectreSpinnerSizes, spectreSpinnerVariants, spectreInputSizes as spectreTagSizes, spectreTagVariants, spectreTestimonialVariants };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map