/// <reference path="../../index.d.ts" />
import type { PublicLitElement as LitElement } from "@arcgis/lumina";

/**
 * A code viewer component for displaying code snippets.
 * Supports syntax highlighting for various programming languages, include arcade and arcgis-sql-expression.
 *
 * @example
 * ```tsx
 * <arcgis-code-viewer language="javascript">
 * function greet() {
 *   console.log("Hello, World!");
 * }
 * </arcgis-code-viewer>
 * ```
 * @example
 * HTML snippets (preserve markup)
 * ```tsx
 * <arcgis-code-viewer language="html">
 *   <template>
 *     <div class="greeting"><span>Hello</span> World!</div>
 *   </template>
 * </arcgis-code-viewer>
 * ```
 * When `language="html"`, the component will attempt to preserve your original markup instead of reducing it
 * to plain text. For safety and to prevent the markup from rendering in-page, wrap the snippet in a `<template>`.
 * If no `<template>` is provided, the component falls back to concatenating the `outerHTML` of element nodes and the
 * raw text of text nodes. Script contents are treated as inert string data; they are never executed.
 * @internal
 */
export abstract class ArcgisCodeViewer extends LitElement {
  /**
   * The language for the component.
   * Currently supported language: arcade, arcgis-sql-expression, plus all the following languages found in monaco-editor's repo:
   * https://github.com/microsoft/monaco-editor/tree/main/src/basic-languages.
   *
   * Note: The number of supported languages is limited in cdn builds to reduce package size. In cdn builds,
   * only the following languages are supported: css, html, javascript, typescript, and arcade, arcgis-sql-expression.
   *
   * @default "arcade"
   */
  accessor language: string;
  /**
   * When `true`, adds a round style to the component.
   *
   * @default false
   */
  accessor round: boolean;
}