vite-vanjs-svg/src/types.d.ts

Vite plugin to transform SVGs into VanJS components

/// <reference path="global.d.ts" />

import type {
  ChildLike,
  DOMNode,
  NodeLike,
  ParseResult,
  RootNode,
} from "@thednp/domparser";
import type { FilterPattern } from "@rollup/pluginutils";
import type { DomParserOptions } from "@thednp/domparser";
import { type Plugin, type ResolvedConfig, transformWithEsbuild } from "vite";
import type {
  PropsWithKnownKeys,
  PropValueOrDerived,
  State,
  TagFunc,
} from "vanjs-core";

export type VitePluginSvgVanOptions = Partial<ResolvedConfig> & {
  esbuildOptions?: Parameters<typeof transformWithEsbuild>[2];
  exclude?: FilterPattern;
  include?: FilterPattern;
};

export declare const VitePluginVanSVG: (
  config?: VitePluginSvgVanOptions,
) => Plugin<VitePluginSvgVanOptions>;
export default VitePluginVanSVG;

export type Load = (
  id: string,
  ops?: { ssr: boolean },
) => Promise<({ code: string; map: null } | null)>;

export type VanJSCode = {
  code: string;
  tags: string[];
  components: string[];
  attributes?: Record<string, string>;
};

type ChildEl = ChildLike & Omit<NodeLike, "attributes"> & {
  attributes: string | Record<string, string>;
} & {
  children: ChildLike[];
};

/**
 * Converts a `ChildLike` to a VanJS code string
 * @param input
 * @param depth
 */
export const DOMToVan: (input: ChildEl, depth?: number) => string;

/**
 * Converts HTML to VanJS code.
 */
export const htmlToVanCode: (
  input?: string,
) => VanJSCode;

/** Converts HTML to DOMLike */
export const htmlToDOM: (
  input?: string,
) => ParseResult;

/**
 * Returns a quoted string if the key is a valid identifier,
 * otherwise returns the original key.
 */
export const quoteText: (key: string) => string;