import { customElement } from 'lit/decorators.js'
import Element from './internals/ApiModelingActionsScreen.js'
import common from './internals/styles/api.styles.js'
import form from './internals/styles/form_styles.js'
import actions from './internals/styles/ApiModelingActionsScreen.styles.js'
import typography from '../styles/m3/typography.module.js'

// Required UI elements used by the screen
import '../md/icons/ui-icon.js'
import '../md/button/ui-button.js'
import '../md/icon-button/ui-icon-button.js'
import '../md/chip/ui-chip.js'
import './api-modeling-entity-card.js'

/**
 * A component that renders the API Actions section screen in the API modeling tool.
 * It consists of authentication, authorization, and access configuration.
 */
@customElement('api-modeling-actions')
export class ApiModelingActionsElement extends Element {
  static override styles = [form, typography, common, actions]
}

declare global {
  interface HTMLElementTagNameMap {
    'api-modeling-actions': ApiModelingActionsElement
  }
}

export type { EditActionEventDetail, EditExposedEntityEventDetail } from './internals/ApiModelingActionsScreen.js'
