/// <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.
 * @example
 * Monaco-style line numbers
 * ```tsx
 * <arcgis-code-viewer language="typescript" lineNumbers="on">
 * const answer = 42;
 * console.log(answer);
 * </arcgis-code-viewer>
 * ```
 * @example
 * Custom line numbers using Monaco's formatter pattern
 * ```ts
 * const viewer = document.querySelector("arcgis-code-viewer");
 * viewer.lineNumbers = (lineNumber) => String(lineNumber + 40);
 * ```
 * @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;
  /**
   * Controls line number rendering using Monaco's `lineNumbers` paradigm.
   *
   * - `"off"`: hide the gutter
   * - `"on"`: render 1-based line numbers
   * - `(lineNumber) => string`: render custom labels, such as offset line numbers
   *
   * @default "off"
   */
  accessor lineNumbers: ArcgisCodeViewerLineNumbers;
  /**
   * When `true`, adds a round style to the component.
   *
   * @default false
   */
  accessor round: boolean;
}

/** @internal */
export type ArcgisCodeViewerLineNumbers = "off" | "on" | ((lineNumber: number) => string);