'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

const index = require('./index-dd0345d7.js');
const index$1 = require('./index-53f5a5fc.js');
const statusNote = require('./status-note-b89242d6.js');

const tabPanelCss = ":host{--spacing-top:var(--telekom-spacing-unit-x6);--spacing-top-small:var(--telekom-spacing-unit-x4)}.tab-panel{margin-top:var(--spacing-top)}.tab-panel--small{margin-top:var(--spacing-top-small)}";

let i = 0;
const TabPanel = class {
  constructor(hostRef) {
    index.registerInstance(this, hostRef);
    this.generatedId = i++;
    /** True for smaller height and font size */
    // DEPRECATED - size should replace small
    this.small = false;
    /** (optional) size  */
    this.size = 'large';
  }
  componentDidRender() {
    if (this.small !== false) {
      statusNote.statusNote({
        tag: 'deprecated',
        message: 'Property "small" is deprecated. Please use the "size" property!',
        type: 'warn',
        source: this.el,
      });
    }
  }
  render() {
    return (index.h(index.Host, { id: `scale-tab-panel-${this.generatedId}`, role: "tabpanel" }, this.styles && index.h("style", null, this.styles), index.h("div", { part: this.getBasePartMap(), class: this.getCssClassMap() }, index.h("slot", null))));
  }
  getBasePartMap() {
    return this.getCssOrBasePartMap('basePart');
  }
  getCssClassMap() {
    return this.getCssOrBasePartMap('css');
  }
  getCssOrBasePartMap(mode) {
    const component = 'tab-panel';
    const prefix = mode === 'basePart' ? '' : `${component}--`;
    return index$1.classnames(component, (this.size === 'small' || this.small) && `${prefix}small`);
  }
  get el() { return index.getElement(this); }
};
TabPanel.style = tabPanelCss;

exports.scale_tab_panel = TabPanel;
