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, Host, h, Element, Prop, Event } from '@stencil/core';
import { VegaComponentUsageRuntimeMetricsSlimmer } from '../../helpers/slimmers/component-usage-runtime-metrics';
import { InjectVegaGlobalSlimmer, InjectVegaSlimmer } from 'vega-slimmer/core';
import { sanitizeVegaComponent } from '../../utils/component';
import { VegaColorSwatchRenderer } from './slimmers/renderers/vega-color-swatch-renderer';
import { createEventEmitSlimmer, } from '../../helpers/event-manager/slimmers/event-emit-slimmer';
import { VegaClick } from '../../helpers/event-manager/event-id/vega-event-id';
import { TranslationSlimmer } from '../../helpers/slimmers/translation';
/**
 * A color input that allows users to select a color from a predefined list.
 * It can be used with multiple swatches to create a color grid,
 * or paired with an input field to support custom color values.
 *
 * @vegaVersion 2.82.0
 */
export class VegaColorSwatch {
  constructor() {
    this.globalSlimmers = {};
    this.vegaComponentUsageRuntimeMetricsSlimmer = new VegaComponentUsageRuntimeMetricsSlimmer();
    this.translationSlimmer = new TranslationSlimmer();
    this.vegaColorSwatchRenderer = new VegaColorSwatchRenderer();
    this.clickEventEmitter = createEventEmitSlimmer(VegaColorSwatch, VegaClick);
    /**
     * Specifies the CSS color value for the swatch (e.g. '#841AC1', 'rgb(15, 137, 82)', 'rgba(15, 137, 82, 0.5)').
     * Applies only when `variant` is set to 'swatch'.
     *
     * @vegaVersion 2.82.0
     */
    this.color = '';
    /**
     * Indicates whether the swatch is currently selected. When selected, a check mark is shown, and its color automatically adjusts to maintain contrast against the swatch color.
     *
     * @vegaVersion 2.82.0
     */
    // eslint-disable-next-line @stencil/strict-mutable
    this.selected = false;
    /**
     * Specifies the label or title for the swatch.
     *    It provides descriptive text that helps identify the purpose or content expected in the swatch.
     
     *
     * @vegaVersion 2.82.0
     */
    this.label = '';
    /**
     * Specifies the size of the swatch.
     *
     * @vegaVersion 2.82.0
     */
    this.size = 'small';
    /**
     * Specifies whether the swatch is disabled.
     *
     * @vegaVersion 2.82.0
     */
    this.disabled = false;
    /**
     * Specifies the visual style and prominence of the swatch.
     *    It determines how the swatch will be presented to the user.
     * - `swatch`: Displays the color fill.
     * - `clear`: Displays a diagonal line to indicate no color (clear selection).
     *
     * @vegaVersion 2.82.0
     */
    this.variant = 'swatch';
    /**
     * Controls the outer shape of the swatch.
     * - `basket`: Rounded corners for spaced layouts.
     * - `block`: Square corners for dense or flush layouts.
     *
     * @vegaVersion 2.82.0
     */
    this.shape = 'basket';
  }
  render() {
    return sanitizeVegaComponent(h(Host, { class: {
        disabled: this.disabled,
      } }, this.vegaColorSwatchRenderer.render()), this.host);
  }
  static get is() { return "vega-color-swatch"; }
  static get encapsulation() { return "shadow"; }
  static get originalStyleUrls() { return {
    "$": ["vega-color-swatch.scss"]
  }; }
  static get styleUrls() { return {
    "$": ["vega-color-swatch.css"]
  }; }
  static get properties() { return {
    "color": {
      "type": "string",
      "mutable": false,
      "complexType": {
        "original": "string",
        "resolved": "string",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [{
            "name": "vegaVersion",
            "text": "2.82.0"
          }],
        "text": "Specifies the CSS color value for the swatch (e.g. '#841AC1', 'rgb(15, 137, 82)', 'rgba(15, 137, 82, 0.5)').\nApplies only when `variant` is set to 'swatch'."
      },
      "attribute": "color",
      "reflect": false,
      "defaultValue": "''"
    },
    "selected": {
      "type": "boolean",
      "mutable": true,
      "complexType": {
        "original": "boolean",
        "resolved": "boolean",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [{
            "name": "vegaVersion",
            "text": "2.82.0"
          }],
        "text": "Indicates whether the swatch is currently selected. When selected, a check mark is shown, and its color automatically adjusts to maintain contrast against the swatch color."
      },
      "attribute": "selected",
      "reflect": true,
      "defaultValue": "false"
    },
    "label": {
      "type": "string",
      "mutable": false,
      "complexType": {
        "original": "string",
        "resolved": "string",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [{
            "name": "vegaVersion",
            "text": "2.82.0"
          }],
        "text": "Specifies the label or title for the swatch.\n   It provides descriptive text that helps identify the purpose or content expected in the swatch."
      },
      "attribute": "label",
      "reflect": false,
      "defaultValue": "''"
    },
    "size": {
      "type": "string",
      "mutable": false,
      "complexType": {
        "original": "VegaColorSwatchSize",
        "resolved": "\"extra-small\" | \"medium\" | \"small\"",
        "references": {
          "VegaColorSwatchSize": {
            "location": "import",
            "path": "./types"
          }
        }
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [{
            "name": "vegaVersion",
            "text": "2.82.0"
          }],
        "text": "Specifies the size of the swatch."
      },
      "attribute": "size",
      "reflect": false,
      "defaultValue": "'small'"
    },
    "disabled": {
      "type": "boolean",
      "mutable": false,
      "complexType": {
        "original": "boolean",
        "resolved": "boolean",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [{
            "name": "vegaVersion",
            "text": "2.82.0"
          }],
        "text": "Specifies whether the swatch is disabled."
      },
      "attribute": "disabled",
      "reflect": true,
      "defaultValue": "false"
    },
    "variant": {
      "type": "string",
      "mutable": false,
      "complexType": {
        "original": "VegaColorSwatchVariant",
        "resolved": "\"clear\" | \"swatch\"",
        "references": {
          "VegaColorSwatchVariant": {
            "location": "import",
            "path": "./types"
          }
        }
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [{
            "name": "vegaVersion",
            "text": "2.82.0"
          }],
        "text": "Specifies the visual style and prominence of the swatch.\n   It determines how the swatch will be presented to the user.\n- `swatch`: Displays the color fill.\n- `clear`: Displays a diagonal line to indicate no color (clear selection)."
      },
      "attribute": "variant",
      "reflect": false,
      "defaultValue": "'swatch'"
    },
    "shape": {
      "type": "string",
      "mutable": false,
      "complexType": {
        "original": "VegaColorSwatchShape",
        "resolved": "\"basket\" | \"block\"",
        "references": {
          "VegaColorSwatchShape": {
            "location": "import",
            "path": "./types"
          }
        }
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [{
            "name": "vegaVersion",
            "text": "2.82.0"
          }],
        "text": "Controls the outer shape of the swatch.\n- `basket`: Rounded corners for spaced layouts.\n- `block`: Square corners for dense or flush layouts."
      },
      "attribute": "shape",
      "reflect": false,
      "defaultValue": "'basket'"
    }
  }; }
  static get events() { return [{
      "method": "vegaClick",
      "name": "vegaClick",
      "bubbles": true,
      "cancelable": true,
      "composed": true,
      "docs": {
        "tags": [{
            "name": "vegaVersion",
            "text": "2.82.0"
          }],
        "text": "An event emitter notifying the click event of the swatch."
      },
      "complexType": {
        "original": "void",
        "resolved": "void",
        "references": {}
      }
    }, {
      "method": "click",
      "name": "click",
      "bubbles": true,
      "cancelable": true,
      "composed": true,
      "docs": {
        "tags": [{
            "name": "vegaVersion",
            "text": "2.82.0"
          }, {
            "name": "eventSemantics",
            "text": "namespace:native"
          }],
        "text": "An event emitter notifying the click event of the swatch."
      },
      "complexType": {
        "original": "void",
        "resolved": "void",
        "references": {}
      }
    }]; }
  static get elementRef() { return "host"; }
}
__decorate([
  InjectVegaGlobalSlimmer()
], VegaColorSwatch.prototype, "globalSlimmers", void 0);
__decorate([
  InjectVegaSlimmer()
], VegaColorSwatch.prototype, "vegaComponentUsageRuntimeMetricsSlimmer", void 0);
__decorate([
  InjectVegaSlimmer()
], VegaColorSwatch.prototype, "translationSlimmer", void 0);
__decorate([
  InjectVegaSlimmer()
], VegaColorSwatch.prototype, "vegaColorSwatchRenderer", void 0);
__decorate([
  InjectVegaSlimmer()
], VegaColorSwatch.prototype, "clickEventEmitter", void 0);
