import { LitElement, html, css } from "lit";
import { property } from "lit/decorators.js";
import { styleMap } from "lit/directives/style-map.js";
import { ObcPoiObjectStyle, ObcPoiObjectState, ObcPoiObjectType } from "./poi-object.js";
var __defProp = Object.defineProperty;
var __decorateClass = (decorators, target, key, kind) => {
  var result = void 0;
  for (var i = decorators.length - 1, decorator; i >= 0; i--)
    if (decorator = decorators[i])
      result = decorator(target, key, result) || result;
  if (result) __defProp(target, key, result);
  return result;
};
const CATEGORICAL_STYLE_VARS = {
  "--overlay-container-background-color": "var(--base-blue-100)",
  "--overlay-border-outline-color": "var(--base-blue-200)",
  "--normal-enabled-background-color": "var(--base-blue-100)",
  "--normal-enabled-border-color": "var(--base-blue-200)",
  "--flat-enabled-background-color": "var(--base-blue-100)",
  "--flat-enabled-border-color": "var(--base-blue-200)",
  "--flat-hover-background-color": "color-mix(in srgb, var(--base-blue-100) 85%, white)",
  "--flat-pressed-background-color": "color-mix(in srgb, var(--base-blue-100) 75%, white)"
};
const _ObcAbstractPoiObject = class _ObcAbstractPoiObject extends LitElement {
  constructor() {
    super(...arguments);
    this.objectStyle = ObcPoiObjectStyle.Regular;
    this.state = ObcPoiObjectState.Unchecked;
    this.interactive = false;
  }
  /** Icon template to render inside the POI object. Override in subclasses. */
  get icon() {
    return html`<slot></slot>`;
  }
  /** Maps subclass-specific type enum to base `ObcPoiObjectType`. Override in subclasses. */
  get baseType() {
    return ObcPoiObjectType.Regular;
  }
  /** CSS custom property overrides for the inner `<obc-poi-object>`. Override in subclasses for custom color schemes. */
  get colorStyleVars() {
    if (this.objectStyle === ObcPoiObjectStyle.Categorical) {
      return CATEGORICAL_STYLE_VARS;
    }
    return {};
  }
  render() {
    return html`<obc-poi-object
      exportparts="background-frame"
      style=${styleMap(this.colorStyleVars)}
      .type=${this.baseType}
      .objectStyle=${this.objectStyle}
      .state=${this.state}
      ?interactive=${this.interactive}
    >
      ${this.icon}
    </obc-poi-object>`;
  }
};
_ObcAbstractPoiObject.styles = [
  css`
      :host {
        display: contents;
      }

      slot {
        display: flex;
        width: 100%;
        height: 100%;
        align-items: center;
        justify-content: center;
      }
    `
];
let ObcAbstractPoiObject = _ObcAbstractPoiObject;
__decorateClass([
  property({ type: String })
], ObcAbstractPoiObject.prototype, "objectStyle");
__decorateClass([
  property({ type: String })
], ObcAbstractPoiObject.prototype, "state");
__decorateClass([
  property({ type: Boolean })
], ObcAbstractPoiObject.prototype, "interactive");
export {
  ObcAbstractPoiObject,
  ObcPoiObjectState,
  ObcPoiObjectStyle,
  ObcPoiObjectType
};
//# sourceMappingURL=abstract-poi-object.js.map
