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, Prop, h, Element, Event, State } from '@stencil/core';
import { sanitizeVegaComponent } from '../../utils/component';
import { InjectVegaGlobalSlimmer, InjectVegaSlimmer } from 'vega-slimmer/core';
import { VegaSelectionTileRenderer } from './slimmers/renderers/vega-selection-tile-renderer';
import { createEventEmitSlimmer, } from '../../helpers/event-manager/slimmers/event-emit-slimmer';
import { VegaChange } from '../../helpers/event-manager/event-id/vega-event-id';
import { VegaSelectionTileCheckedController } from './slimmers/controllers/vega-selection-tile-checked-cotroller';
import { VegaSelectionTileStateController } from './slimmers/controllers/vega-selection-tile-state-controller';
import { VegaSelectionTileShowErrorController } from './slimmers/controllers/vega-selection-tile-show-error-controller';
import { ChildNodesEventPreventSlimmer } from '../../helpers/event-manager/slimmers/child-nodes-event-prevent-slimmer';
import { CHECKBOX_VALUE_CHANGE, RADIO_VALUE_CHANGE, } from '../../helpers/change-manager/subject/static-subject/static-subject-title';
import { ChildNodesNotifyObserverSlimmer, } from '../../helpers/event-manager/slimmers/child-nodes-notify-observer-slimmer';
import { VegaComponentUsageRuntimeMetricsSlimmer } from '../../helpers/slimmers/component-usage-runtime-metrics';
/**
 * @vegaVersion 2.7.0
 */
export class VegaSelectionTile {
  constructor() {
    this.globalSlimmers = {};
    this.renderer = new VegaSelectionTileRenderer();
    this.checkedController = new VegaSelectionTileCheckedController();
    this.stateController = new VegaSelectionTileStateController();
    this.showErrorController = new VegaSelectionTileShowErrorController();
    this.changeEventEmitter = createEventEmitSlimmer(VegaSelectionTile, VegaChange);
    this.checkboxEventPrevent = new ChildNodesEventPreventSlimmer([VegaChange], () => this.renderer.getSelectorContainerRef());
    this.checkboxValueChangeObserver = new ChildNodesNotifyObserverSlimmer(CHECKBOX_VALUE_CHANGE, (payload) => this.checkedController.onCheck(payload.detail));
    this.radioValueChangeObserver = new ChildNodesNotifyObserverSlimmer(RADIO_VALUE_CHANGE, (payload) => {
      if (payload.detail) {
        this.checkedController.onCheck(payload.detail);
      }
    });
    this.vegaComponentUsageRuntimeMetricsSlimmer = new VegaComponentUsageRuntimeMetricsSlimmer();
    /**
     * Indicates whether the parent selection tile group shows error message.
     */
    this.showError = false;
    /**
     * Distribute vega-selection-tile components evenly to always cover the entire available width of the parent
     */
    this.distributeEvenly = false;
    /**
     * Specifies the text content of the title displayed
     *    within the selection tile.
     *
     * @vegaVersion 2.7.0
     */
    this.titleText = '';
    /**
     * Determines if the selection tile is disabled.
     *
     * @vegaVersion 2.7.0
     */
    /* eslint-disable-next-line @stencil/strict-mutable */
    this.disabled = false;
    /**
     * Determines the selection method for the tile. Options are:
     *
     * - `radio`:
     *      Displays a radio button for selection.
     * - `checkbox`:
     *      Displays a checkbox for selection.
     *
     * @vegaVersion 2.7.0
     */
    /* eslint-disable-next-line @stencil/strict-mutable */
    this.selectType = 'radio';
    // Host-level activation listeners are attached via vDOM listeners
    // (`onClick` / `onKeyDown` on the `<Host>` element below). Stencil's
    // vDOM listeners use `addEventListener` under the hood, NOT the
    // `onclick`/`onkeydown` IDL properties, so:
    //   1. A consumer doing `tileEl.onclick = fn` cannot overwrite or
    //      remove our listener.
    //   2. A consumer attaching their own `addEventListener('click', ...)`
    //      coexists with ours and fires alongside it (DOM event spec).
    // So consumer code can observe / augment activation but cannot silently
    // break it. Only `event.stopImmediatePropagation()` in a handler that
    // runs before ours would suppress it -- an explicit opt-out, not a
    // surprise override.
    this.onHostClick = () => {
      this.renderer.activate();
    };
    this.onHostKeyDown = (event) => {
      this.renderer.handleTileKeydown(event);
    };
  }
  render() {
    // ARIA semantics, focus, and activation handlers ALL live on the host.
    //
    // Why not `role="presentation"` on the host + role on an inner shadow
    // element? Per ARIA 1.2, `role="presentation"`/`role="none"` is dropped
    // ("presentation conflict resolution") whenever the element has any
    // focusable descendants in the flat tree. Putting `tabindex="0"` on an
    // inner shadow element therefore demotes the host's presentation role,
    // and Firefox -- which enforces this rule strictly -- exposes the host
    // as a generic/group wrapper around the inner radio. VoiceOver then
    // triple-announces each tile:
    //   1. "<title>, group"               (host wrapper)
    //   2. "<title>, <note>, radio button" (inner role=radio)
    //   3. "end of <title>, group"        (host wrapper close)
    // Safari/Chrome happen to flatten the host out, masking the bug.
    // Collapsing role + tabindex + aria-* onto the host eliminates the
    // wrapper entirely -- the host *is* the radio/checkbox.
    //
    // NOTE on the `title` HTML attribute: `@Prop({ attribute: 'title' })
    // titleText` observes the `title` attribute, so we deliberately do
    // NOT pass `title={null}` to the Host -- doing so would strip the
    // attribute at render time, which would then trigger Stencil's
    // attribute observer and wipe `titleText` itself. The HTML `title`
    // attribute stays on the host as a harmless tooltip; the explicit
    // `aria-label` we emit takes precedence as the accessible name per
    // the W3C accessible name computation, so VoiceOver/NVDA announce
    // `aria-label` (which folds in the note line), not the tooltip text.
    return sanitizeVegaComponent(h(Host, { role: this.selectType === 'checkbox' ? 'checkbox' : 'radio', "aria-checked": this.checked ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false', "aria-label": this.renderer.getAccessibleName() || undefined, tabindex: this.disabled ? -1 : 0, class: { 'distribute-evenly': this.distributeEvenly }, onClick: this.onHostClick, onKeyDown: this.onHostKeyDown }, this.renderer.render()), this.host);
  }
  static get is() { return "vega-selection-tile"; }
  static get encapsulation() { return "shadow"; }
  static get originalStyleUrls() { return {
    "$": ["vega-selection-tile.scss"]
  }; }
  static get styleUrls() { return {
    "$": ["vega-selection-tile.css"]
  }; }
  static get properties() { return {
    "titleText": {
      "type": "string",
      "mutable": false,
      "complexType": {
        "original": "string",
        "resolved": "string",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [{
            "name": "vegaVersion",
            "text": "2.7.0"
          }],
        "text": "Specifies the text content of the title displayed\n   within the selection tile."
      },
      "attribute": "title",
      "reflect": false,
      "defaultValue": "''"
    },
    "note": {
      "type": "string",
      "mutable": false,
      "complexType": {
        "original": "string",
        "resolved": "string",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [{
            "name": "vegaVersion",
            "text": "2.7.0"
          }],
        "text": "Specifies the text content of the note displayed\n   within the selection tile."
      },
      "attribute": "note",
      "reflect": false
    },
    "prefixIcon": {
      "type": "string",
      "mutable": false,
      "complexType": {
        "original": "string",
        "resolved": "string",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [{
            "name": "vegaVersion",
            "text": "2.7.0"
          }],
        "text": "Specifies the prefix icon displayed within the selection tile."
      },
      "attribute": "prefix-icon",
      "reflect": false
    },
    "disabled": {
      "type": "boolean",
      "mutable": true,
      "complexType": {
        "original": "boolean",
        "resolved": "boolean",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [{
            "name": "vegaVersion",
            "text": "2.7.0"
          }],
        "text": "Determines if the selection tile is disabled."
      },
      "attribute": "disabled",
      "reflect": false,
      "defaultValue": "false"
    },
    "checked": {
      "type": "boolean",
      "mutable": true,
      "complexType": {
        "original": "boolean",
        "resolved": "boolean",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [{
            "name": "vegaVersion",
            "text": "2.7.0"
          }],
        "text": "Determines if the selection tile is checked."
      },
      "attribute": "checked",
      "reflect": false
    },
    "selectType": {
      "type": "string",
      "mutable": true,
      "complexType": {
        "original": "'radio' | 'checkbox'",
        "resolved": "\"checkbox\" | \"radio\"",
        "references": {}
      },
      "required": false,
      "optional": false,
      "docs": {
        "tags": [{
            "name": "vegaVersion",
            "text": "2.7.0"
          }],
        "text": "Determines the selection method for the tile. Options are:\n\n- `radio`:\n     Displays a radio button for selection.\n- `checkbox`:\n     Displays a checkbox for selection."
      },
      "attribute": "select-type",
      "reflect": false,
      "defaultValue": "'radio'"
    },
    "value": {
      "type": "string",
      "mutable": false,
      "complexType": {
        "original": "string",
        "resolved": "string",
        "references": {}
      },
      "required": true,
      "optional": false,
      "docs": {
        "tags": [{
            "name": "vegaVersion",
            "text": "2.7.0"
          }],
        "text": "Determines the value that is associated with the selection-tile\n   when it is checked or unchecked."
      },
      "attribute": "value",
      "reflect": false
    }
  }; }
  static get states() { return {
    "showError": {},
    "distributeEvenly": {}
  }; }
  static get events() { return [{
      "method": "vegaChange",
      "name": "vegaChange",
      "bubbles": true,
      "cancelable": true,
      "composed": true,
      "docs": {
        "tags": [{
            "name": "vegaVersion",
            "text": "2.7.0"
          }],
        "text": "An event emitter notifying changes in the value of the selection tile,\n   whether triggered programmatically or through user interaction."
      },
      "complexType": {
        "original": "string",
        "resolved": "string",
        "references": {}
      }
    }, {
      "method": "change",
      "name": "change",
      "bubbles": true,
      "cancelable": true,
      "composed": true,
      "docs": {
        "tags": [{
            "name": "eventSemantics",
            "text": "namespace:native"
          }, {
            "name": "vegaVersion",
            "text": "2.7.0"
          }],
        "text": "An event emitter notifying changes in the value of the selection tile,\n   whether triggered programmatically or through user interaction."
      },
      "complexType": {
        "original": "string",
        "resolved": "string",
        "references": {}
      }
    }]; }
  static get elementRef() { return "host"; }
}
__decorate([
  InjectVegaGlobalSlimmer()
], VegaSelectionTile.prototype, "globalSlimmers", void 0);
__decorate([
  InjectVegaSlimmer()
], VegaSelectionTile.prototype, "renderer", void 0);
__decorate([
  InjectVegaSlimmer()
], VegaSelectionTile.prototype, "checkedController", void 0);
__decorate([
  InjectVegaSlimmer()
], VegaSelectionTile.prototype, "stateController", void 0);
__decorate([
  InjectVegaSlimmer()
], VegaSelectionTile.prototype, "showErrorController", void 0);
__decorate([
  InjectVegaSlimmer()
], VegaSelectionTile.prototype, "changeEventEmitter", void 0);
__decorate([
  InjectVegaSlimmer()
], VegaSelectionTile.prototype, "checkboxEventPrevent", void 0);
__decorate([
  InjectVegaSlimmer()
], VegaSelectionTile.prototype, "checkboxValueChangeObserver", void 0);
__decorate([
  InjectVegaSlimmer()
], VegaSelectionTile.prototype, "radioValueChangeObserver", void 0);
__decorate([
  InjectVegaSlimmer()
], VegaSelectionTile.prototype, "vegaComponentUsageRuntimeMetricsSlimmer", void 0);
