var __decorate = (this && this.__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;
};
import { Component, Element, Host, h, Prop, State, Watch } from '@stencil/core';
import { sanitizeVegaComponent } from '../../utils/component';
import { InjectVegaGlobalSlimmer, InjectVegaSlimmer, methodPlaceholder, slotPlaceholder, } from 'vega-slimmer/core';
import { PageResizeObserverSlimmer } from '../../helpers/slimmers/page-resize-observer-slimmer';
import { getCurrentBreakpoint } from '../../utils/breakpoints';
import { ComponentLoadRequired } from '../../decorators/method-decorators/component-load-required';
import { VegaFontVariantController } from './slimmers/controllers/vega-font-variant-controller';
import { VegaFontAsController } from './slimmers/controllers/vega-font-as-controller';
import { VegaFontClassesController } from './slimmers/controllers/vega-font-classes-controller';
import { VegaFontRenderer } from './slimmers/renderers/vega-font-renderer';
import { VegaComponentUsageRuntimeMetricsSlimmer } from '../../helpers/slimmers/component-usage-runtime-metrics';
import { VegaFontRuntimeMetricsPayloadDefinition } from '../../constants/runtime-metrics-payload-definition/vega-font/runtime-metrics-payload-definition';
/**
 * @vegaVersion 1.46.0
 */
export class VegaFont {
  constructor() {
    this.globalSlimmers = {};
    this.pageResizeSlimmer = new PageResizeObserverSlimmer();
    this.variantController = new VegaFontVariantController();
    this.asController = new VegaFontAsController();
    this.classesController = new VegaFontClassesController();
    this.renderer = new VegaFontRenderer();
    this.vegaComponentUsageRuntimeMetricsSlimmer = new VegaComponentUsageRuntimeMetricsSlimmer(VegaFontRuntimeMetricsPayloadDefinition);
    this.currentBreakpoint = getCurrentBreakpoint();
    /**
     * Specifies the typography token used for styling the text within this component. A typography token includes values for font size and line height.
     *
     * @vegaVersion 1.46.0
     */
    this.variant = 'font-field-label';
    /**
     * Specifies the font color represented by a valid text color token.
     *
     * @vegaVersion 1.46.0
     */
    this.color = 'text-primary';
    /**
     * Specifies the capability to enable or disable the font's
     *      responsiveness from native code.
     *
     * @vegaVersion 1.46.0
     */
    this.disableResponsive = false;
    /**
     * Indicates the rendering of an additional node with a
     *     value that is an HTML tag name. It can be set as `ResponsiveType`.
     *
     * @vegaVersion 1.46.0
     */
    this.as = '';
  }
  watchAsChange(newValue) {
    methodPlaceholder(newValue);
  }
  componentDidLoad() {
    methodPlaceholder();
  }
  componentDidUpdate() {
    methodPlaceholder();
  }
  render() {
    const hostClasses = this.classesController.getClassName();
    slotPlaceholder(h("slot", null));
    return sanitizeVegaComponent(h(Host, { class: hostClasses }, this.renderer.render(hostClasses)), this.host);
  }
  static get is() { return "vega-font"; }
  static get encapsulation() { return "shadow"; }
  static get originalStyleUrls() { return {
    "$": ["vega-font.scss"]
  }; }
  static get styleUrls() { return {
    "$": ["vega-font.css"]
  }; }
  static get properties() { return {
    "variant": {
      "type": "string",
      "mutable": false,
      "complexType": {
        "original": "ResponsiveType<TypographyTokenType>",
        "resolved": "\"font-h1\" | \"font-h2\" | \"font-h3\" | \"font-h4\" | \"font-h5\" | \"font-h6\" | \"font-p1-short\" | \"font-p1-long\" | \"font-p2-short\" | \"font-p2-long\" | \"font-btn-label\" | \"font-btn-label-lg\" | \"font-btn-label-sm\" | \"font-btn-link-label\" | \"font-btn-link-label-lg\" | \"font-btn-link-label-sm\" | \"font-field-label\" | \"font-field-label-sm\" | \"font-field-label-xs\" | \"font-field-label-lg\" | \"font-field-label-em\" | \"font-field-label-sm-em\" | \"font-field-label-xs-em\" | \"font-field-label-lg-em\" | \"font-field-value\" | \"font-field-value-sm\" | \"font-field-value-em\" | \"font-field-value-disabled\" | \"font-sidebar-link\" | \"font-sidebar-link-em\" | \"font-footnote1-short\" | \"font-footnote1-long\" | \"font-footnote2-short\" | \"font-footnote2-long\" | \"font-h-modal\" | \"font-keypad-label\" | \"font-keypad-label-large\" | \"font-notification-content\" | \"font-counter-badge-label\" | { S?: \"font-h1\" | \"font-h2\" | \"font-h3\" | \"font-h4\" | \"font-h5\" | \"font-h6\" | \"font-p1-short\" | \"font-p1-long\" | \"font-p2-short\" | \"font-p2-long\" | \"font-btn-label\" | \"font-btn-label-lg\" | \"font-btn-label-sm\" | \"font-btn-link-label\" | \"font-btn-link-label-lg\" | \"font-btn-link-label-sm\" | \"font-field-label\" | \"font-field-label-sm\" | \"font-field-label-xs\" | \"font-field-label-lg\" | \"font-field-label-em\" | \"font-field-label-sm-em\" | \"font-field-label-xs-em\" | \"font-field-label-lg-em\" | \"font-field-value\" | \"font-field-value-sm\" | \"font-field-value-em\" | \"font-field-value-disabled\" | \"font-sidebar-link\" | \"font-sidebar-link-em\" | \"font-footnote1-short\" | \"font-footnote1-long\" | \"font-footnote2-short\" | \"font-footnote2-long\" | \"font-h-modal\" | \"font-keypad-label\" | \"font-keypad-label-large\" | \"font-notification-content\" | \"font-counter-badge-label\"; M?: \"font-h1\" | \"font-h2\" | \"font-h3\" | \"font-h4\" | \"font-h5\" | \"font-h6\" | \"font-p1-short\" | \"font-p1-long\" | \"font-p2-short\" | \"font-p2-long\" | \"font-btn-label\" | \"font-btn-label-lg\" | \"font-btn-label-sm\" | \"font-btn-link-label\" | \"font-btn-link-label-lg\" | \"font-btn-link-label-sm\" | \"font-field-label\" | \"font-field-label-sm\" | \"font-field-label-xs\" | \"font-field-label-lg\" | \"font-field-label-em\" | \"font-field-label-sm-em\" | \"font-field-label-xs-em\" | \"font-field-label-lg-em\" | \"font-field-value\" | \"font-field-value-sm\" | \"font-field-value-em\" | \"font-field-value-disabled\" | \"font-sidebar-link\" | \"font-sidebar-link-em\" | \"font-footnote1-short\" | \"font-footnote1-long\" | \"font-footnote2-short\" | \"font-footnote2-long\" | \"font-h-modal\" | \"font-keypad-label\" | \"font-keypad-label-large\" | \"font-notification-content\" | \"font-counter-badge-label\"; L?: \"font-h1\" | \"font-h2\" | \"font-h3\" | \"font-h4\" | \"font-h5\" | \"font-h6\" | \"font-p1-short\" | \"font-p1-long\" | \"font-p2-short\" | \"font-p2-long\" | \"font-btn-label\" | \"font-btn-label-lg\" | \"font-btn-label-sm\" | \"font-btn-link-label\" | \"font-btn-link-label-lg\" | \"font-btn-link-label-sm\" | \"font-field-label\" | \"font-field-label-sm\" | \"font-field-label-xs\" | \"font-field-label-lg\" | \"font-field-label-em\" | \"font-field-label-sm-em\" | \"font-field-label-xs-em\" | \"font-field-label-lg-em\" | \"font-field-value\" | \"font-field-value-sm\" | \"font-field-value-em\" | \"font-field-value-disabled\" | \"font-sidebar-link\" | \"font-sidebar-link-em\" | \"font-footnote1-short\" | \"font-footnote1-long\" | \"font-footnote2-short\" | \"font-footnote2-long\" | \"font-h-modal\" | \"font-keypad-label\" | \"font-keypad-label-large\" | \"font-notification-content\" | \"font-counter-badge-label\"; XL?: \"font-h1\" | \"font-h2\" | \"font-h3\" | \"font-h4\" | \"font-h5\" | \"font-h6\" | \"font-p1-short\" | \"font-p1-long\" | \"font-p2-short\" | \"font-p2-long\" | \"font-btn-label\" | \"font-btn-label-lg\" | \"font-btn-label-sm\" | \"font-btn-link-label\" | \"font-btn-link-label-lg\" | \"font-btn-link-label-sm\" | \"font-field-label\" | \"font-field-label-sm\" | \"font-field-label-xs\" | \"font-field-label-lg\" | \"font-field-label-em\" | \"font-field-label-sm-em\" | \"font-field-label-xs-em\" | \"font-field-label-lg-em\" | \"font-field-value\" | \"font-field-value-sm\" | \"font-field-value-em\" | \"font-field-value-disabled\" | \"font-sidebar-link\" | \"font-sidebar-link-em\" | \"font-footnote1-short\" | \"font-footnote1-long\" | \"font-footnote2-short\" | \"font-footnote2-long\" | \"font-h-modal\" | \"font-keypad-label\" | \"font-keypad-label-large\" | \"font-notification-content\" | \"font-counter-badge-label\"; default?: \"font-h1\" | \"font-h2\" | \"font-h3\" | \"font-h4\" | \"font-h5\" | \"font-h6\" | \"font-p1-short\" | \"font-p1-long\" | \"font-p2-short\" | \"font-p2-long\" | \"font-btn-label\" | \"font-btn-label-lg\" | \"font-btn-label-sm\" | \"font-btn-link-label\" | \"font-btn-link-label-lg\" | \"font-btn-link-label-sm\" | \"font-field-label\" | \"font-field-label-sm\" | \"font-field-label-xs\" | \"font-field-label-lg\" | \"font-field-label-em\" | \"font-field-label-sm-em\" | \"font-field-label-xs-em\" | \"font-field-label-lg-em\" | \"font-field-value\" | \"font-field-value-sm\" | \"font-field-value-em\" | \"font-field-value-disabled\" | \"font-sidebar-link\" | \"font-sidebar-link-em\" | \"font-footnote1-short\" | \"font-footnote1-long\" | \"font-footnote2-short\" | \"font-footnote2-long\" | \"font-h-modal\" | \"font-keypad-label\" | \"font-keypad-label-large\" | \"font-notification-content\" | \"font-counter-badge-label\"; }",
        "references": {
          "ResponsiveType": {
            "location": "import",
            "path": "../../types/ui.type"
          },
          "TypographyTokenType": {
            "location": "import",
            "path": "../../types/design-token.type"
          }
        }
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [{
            "name": "vegaVersion",
            "text": "1.46.0"
          }],
        "text": "Specifies the typography token used for styling the text within this component. A typography token includes values for font size and line height."
      },
      "attribute": "variant",
      "reflect": false,
      "defaultValue": "'font-field-label'"
    },
    "color": {
      "type": "string",
      "mutable": false,
      "complexType": {
        "original": "TextColorsTokenType",
        "resolved": "\"text-primary\" | \"text-secondary\" | \"text-inverted-primary\" | \"text-inverted-secondary\" | \"text-black\" | \"text-white\" | \"text-brand\" | \"text-danger-link\" | \"text-danger-link-hover\" | \"text-danger-link-active\" | \"text-danger-link-focus\" | \"text-danger-link-visited\" | \"text-disabled\" | \"text-error\" | \"text-input-disabled\" | \"text-input-placeholder\" | \"text-link\" | \"text-link-hover\" | \"text-link-active\" | \"text-link-focus\" | \"text-link-visited\" | \"text-on-action\" | \"text-on-danger\" | \"text-on-disabled\" | \"text-sidebar-link\" | \"text-sidebar-link-hover\" | \"text-sidebar-link-selected\" | \"text-site-footer-link\" | \"text-site-footer-link-hover\" | \"text-site-footer-link-active\" | \"text-success\" | \"text-inverted-success\" | \"text-accent1-primary\" | \"text-accent2-primary\" | \"text-accent3-primary\" | \"text-accent4-primary\" | \"text-accent5-primary\" | \"text-accent6-primary\" | \"text-accent7-primary\" | \"text-accent8-primary\" | \"text-accent9-primary\" | \"text-accent10-primary\"",
        "references": {
          "TextColorsTokenType": {
            "location": "import",
            "path": "../../types/design-token.type"
          }
        }
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [{
            "name": "vegaVersion",
            "text": "1.46.0"
          }],
        "text": "Specifies the font color represented by a valid text color token."
      },
      "attribute": "color",
      "reflect": false,
      "defaultValue": "'text-primary'"
    },
    "disableResponsive": {
      "type": "boolean",
      "mutable": false,
      "complexType": {
        "original": "boolean",
        "resolved": "boolean",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [{
            "name": "vegaVersion",
            "text": "1.46.0"
          }],
        "text": "Specifies the capability to enable or disable the font's\n     responsiveness from native code."
      },
      "attribute": "disable-responsive",
      "reflect": false,
      "defaultValue": "false"
    },
    "textAlign": {
      "type": "string",
      "mutable": false,
      "complexType": {
        "original": "ResponsiveType<TextAlignType>",
        "resolved": "\"center\" | \"end\" | \"justify\" | \"left\" | \"right\" | \"start\" | { S?: TextAlignType; M?: TextAlignType; L?: TextAlignType; XL?: TextAlignType; default?: TextAlignType; }",
        "references": {
          "ResponsiveType": {
            "location": "import",
            "path": "../../types/ui.type"
          },
          "TextAlignType": {
            "location": "import",
            "path": "../../types/ui.type"
          }
        }
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [{
            "name": "vegaVersion",
            "text": "2.9.0"
          }],
        "text": "Specifies the horizontal alignment of the vega-font content.\n\nThis property determines how the text is aligned\n  \twithin its container, and it is effective only when\n  \tthe vega-font is styled as a block-level element."
      },
      "attribute": "text-align",
      "reflect": false
    },
    "as": {
      "type": "string",
      "mutable": false,
      "complexType": {
        "original": "ResponsiveType<VegaFontAs>",
        "resolved": "\"\" | \"abbr\" | \"b\" | \"cite\" | \"del\" | \"em\" | \"h1\" | \"h2\" | \"h3\" | \"h4\" | \"h5\" | \"h6\" | \"i\" | \"p\" | \"q\" | \"s\" | \"span\" | { S?: VegaFontAs; M?: VegaFontAs; L?: VegaFontAs; XL?: VegaFontAs; default?: VegaFontAs; }",
        "references": {
          "ResponsiveType": {
            "location": "import",
            "path": "../../types/ui.type"
          },
          "VegaFontAs": {
            "location": "import",
            "path": "./types"
          }
        }
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [{
            "name": "vegaVersion",
            "text": "1.46.0"
          }],
        "text": "Indicates the rendering of an additional node with a\n    value that is an HTML tag name. It can be set as `ResponsiveType`."
      },
      "attribute": "as",
      "reflect": false,
      "defaultValue": "''"
    }
  }; }
  static get states() { return {
    "currentBreakpoint": {}
  }; }
  static get elementRef() { return "host"; }
  static get watchers() { return [{
      "propName": "as",
      "methodName": "watchAsChange"
    }]; }
}
__decorate([
  InjectVegaGlobalSlimmer()
], VegaFont.prototype, "globalSlimmers", void 0);
__decorate([
  InjectVegaSlimmer()
], VegaFont.prototype, "pageResizeSlimmer", void 0);
__decorate([
  InjectVegaSlimmer()
], VegaFont.prototype, "variantController", void 0);
__decorate([
  InjectVegaSlimmer()
], VegaFont.prototype, "asController", void 0);
__decorate([
  InjectVegaSlimmer()
], VegaFont.prototype, "classesController", void 0);
__decorate([
  InjectVegaSlimmer()
], VegaFont.prototype, "renderer", void 0);
__decorate([
  InjectVegaSlimmer()
], VegaFont.prototype, "vegaComponentUsageRuntimeMetricsSlimmer", void 0);
__decorate([
  ComponentLoadRequired()
], VegaFont.prototype, "watchAsChange", null);
