Skip to main content

Interface: ContentConfig

The properties that define the content of the current project.

Extended by​

Properties​

activeEditor​

activeEditor: undefined | EditorId

Selects the active editor to show.

Defaults to the last used editor for user, otherwise "markup"

Defined in​

models.ts:455

cssPreset​

cssPreset: CssPresetId

CSS Preset to use.

Defined in​

models.ts:502

customSettings​

customSettings: object

Defines custom settings for the current project.

adoc​

adoc: any

app.svelte​

svelte: any

app.vue​

vue: any

art​

art: any

art-template​

art-template: any

as​

as: any

asc​

asc: any

asciidoc​

asciidoc: any

assemblyscript​

assemblyscript: any

astro​

astro: any

autoprefixer​

autoprefixer: any

babel​

babel: any

bb​

bb: any

bbcode​

bbcode: any

Binary​

Binary: any

blockly​

blockly: any

blockly.xml​

xml: any

c​

c: any

C​

C: any

c++​

c++: any

civet​

civet: any

clang​

clang: any

clang.cpp​

cpp: any

clio​

clio: any

clj​

clj: any

cljc​

cljc: any

cljs​

cljs: any

clojure​

clojure: any

clojurescript​

clojurescript: any

coffee​

coffee: any

coffeescript​

coffeescript: any

common-lisp​

common-lisp: any

commonlisp​

commonlisp: any

convertCommonjs?​

optional convertCommonjs: boolean

cp​

cp: any

cpp​

cpp: any

cpp-wasm​

cpp-wasm: any

cppm​

cppm: any

cppwasm​

cppwasm: any

csharp​

csharp: any

css​

css: any

cssmodules​

cssmodules: any

cssnano​

cssnano: any

cwasm​

cwasm: any

cxx​

cxx: any

defaultCDN?​

optional defaultCDN: CDN

diagram​

diagram: any

diagrams​

diagrams: any

dot​

dot: any

edn​

edn: any

ejs​

ejs: any

es​

es: any

eta​

eta: any

fennel​

fennel: any

flow​

flow: any

fnl​

fnl: any

gleam​

gleam: any

go​

go: any

golang​

golang: any

graph​

graph: any

h​

h: any

haml​

haml: any

handlebars​

handlebars: any

hbs​

hbs: any

hpp​

hpp: any

htm​

htm: any

html​

html: any

ii​

ii: any

imba​

imba: any

imports?​

optional imports: Record<string, string>

ixx​

ixx: any

jade​

jade: any

javascript​

javascript: any

jl​

jl: any

js​

js: any

json​

json: any

jsx​

jsx: any

julia​

julia: any

less​

less: any

lightningcss​

lightningcss: any

liquid​

liquid: any

liquidjs​

liquidjs: any

lisp​

lisp: any

livescript​

livescript: any

ls​

ls: any

lua​

lua: any

lua-wasm​

lua-wasm: any

luawasm​

luawasm: any

malina​

malina: any

malinajs​

malinajs: any

mapImports?​

optional mapImports: boolean

markdown​

markdown: any

md​

md: any

mdown​

mdown: any

mdx​

mdx: any

mjml​

mjml: any

mkdn​

mkdn: any

ml​

ml: any

mli​

mli: any

mustache​

mustache: any

njk​

njk: any

nunjucks​

nunjucks: any

ocaml​

ocaml: any

perl​

perl: any

pg​

pg: any

pg.sql​

sql: any

pglite​

pglite: any

pglite.sql​

sql: any

pgsql​

pgsql: any

pgsql.sql​

sql: any

php​

php: any

php-wasm​

php-wasm: any

phpwasm​

phpwasm: any

pintora​

pintora: any

pl​

pl: any

plt​

plt: any

pm​

pm: any

postcss​

postcss: any

postcssImportUrl​

postcssImportUrl: any

postcssPresetEnv​

postcssPresetEnv: any

postgre.sql​

sql: any

postgres​

postgres: any

postgresql​

postgresql: any

postgresql.sql​

sql: any

prolog​

prolog: any

prolog.pl​

pl: any

pug​

pug: any

purgecss​

purgecss: any

py​

py: any

py-wasm​

py-wasm: any

py3​

py3: any

pyodide​

pyodide: any

python​

python: any

python-wasm​

python-wasm: any

pythonwasm​

pythonwasm: any

pywasm​

pywasm: any

r​

r: any

r-wasm​

r-wasm: any

rb​

rb: any

re​

re: any

react​

react: any

react-jsx​

react-jsx: any

react-native​

react-native: any

react-native-tsx​

react-native-tsx: any

react-native.jsx​

jsx: any

react-native.tsx​

tsx: any

react-tsx​

react-tsx: any

react.jsx​

jsx: any

react.tsx​

tsx: any

reason​

reason: any

rei​

rei: any

res​

res: any

rescript​

rescript: any

resi​

resi: any

rich​

rich: any

richtext​

richtext: any

riot​

riot: any

riotjs​

riotjs: any

rlang​

rlang: any

rstats​

rstats: any

rte​

rte: any

rte.html​

html: any

ruby​

ruby: any

ruby-wasm​

ruby-wasm: any

rubywasm​

rubywasm: any

sass​

sass: any

scheme​

scheme: any

scm​

scm: any

scriptType?​

optional scriptType: "" | "module" | "text/liquid" | "text/python" | "text/r" | "text/ruby-wasm" | "text/x-uniter-php" | "text/php-wasm" | "text/cpp" | "text/perl" | "text/julia" | "text/biwascheme" | "text/commonlisp" | "text/tcl" | "text/prolog" | "application/json" | "application/lua" | "text/fennel" | "application/wasm-uint8" | "application/javascript" | "application/ecmascript" | "text/javascript" | "text/ecmascript"

scss​

scss: any

solid​

solid: any

solid.jsx​

jsx: any

solid.tsx​

tsx: any

sql​

sql: any

sqlite​

sqlite: any

sqlite3​

sqlite3: any

stencil​

stencil: any

stencil.tsx​

tsx: any

styl​

styl: any

stylis​

stylis: any

stylus​

stylus: any

sucrase​

sucrase: any

svelte​

svelte: any

svelte-app​

svelte-app: any

tailwindcss​

tailwindcss: any

tcl​

tcl: any

teal​

teal: any

template?​

optional template: object

template.data?​

optional data: any

template.prerender?​

optional prerender: boolean

tl​

tl: any

tokencss​

tokencss: any

ts​

ts: any

tsx​

tsx: any

twig​

twig: any

types?​

optional types: Types

typescript​

typescript: any

unocss​

unocss: any

vento​

vento: any

vto​

vto: any

vue​

vue: any

vue-app​

vue-app: any

vue2​

vue2: any

vue3​

vue3: any

wasm​

wasm: any

wasm.cpp​

cpp: any

wasm.lua​

lua: any

wasm.php​

php: any

wasm.py​

py: any

wasm.rb​

rb: any

wast​

wast: any

wat​

wat: any

webassembly​

webassembly: any

windicss​

windicss: any

xht​

xht: any

xml​

xml: any

Defined in​

models.ts:514

description​

description: string

Project description. Used in project search and result page description meta tag.

Default​

""

Defined in​

models.ts:425

head: string

Content added to the result page <head> element.

Default​

'<meta charset="UTF-8" />\n<meta name="viewport" content="width=device-width, initial-scale=1.0" />'

Defined in​

models.ts:431

htmlAttrs​

htmlAttrs: string | Record<string, string>

Attributes added to the result page <html> element. It can be an object or a string.

Example​

{ lang: "en", class: "dark" }
'lang="en" class="dark"'

Defined in​

models.ts:440

imports​

imports: object

Allows specifying custom import maps for module imports.

Example

Setting imports like this:

"imports": {
  "moment": "https://cdn.jsdelivr.net/npm/[email protected]/dist/moment.js"
}

results in the following import map:

<script type="importmap">
  {
    "imports": {
      "moment": "https://cdn.jsdelivr.net/npm/[email protected]/dist/moment.js"
    }
  }
</script>

See docs for Imports and Custom Module Resolution

Index Signature​

[key: string]: string

Defined in​

models.ts:540

languages​

languages: undefined | ("reason" | "stylus" | "r" | "html" | "ruby" | "rb" | "json" | "teal" | "solid" | "flow" | "dot" | "as" | "go" | "htm" | "markdown" | "md" | "mdown" | "mkdn" | "mdx" | "astro" | "pug" | "jade" | "haml" | "asciidoc" | "adoc" | "asc" | "mustache" | "handlebars" | "hbs" | "ejs" | "eta" | "nunjucks" | "njk" | "liquid" | "liquidjs" | "twig" | "vento" | "vto" | "art-template" | "art" | "bbcode" | "bb" | "mjml" | "diagrams" | "diagram" | "graph" | "plt" | "richtext" | "rte" | "rich" | "rte.html" | "css" | "scss" | "sass" | "less" | "styl" | "stylis" | "postcss" | "javascript" | "js" | "babel" | "es" | "sucrase" | "typescript" | "ts" | "jsx" | "tsx" | "react" | "react-jsx" | "react.jsx" | "react-tsx" | "react.tsx" | "react-native" | "react-native.jsx" | "react-native-tsx" | "react-native.tsx" | "vue" | "vue3" | "vue2" | "vue-app" | "app.vue" | "svelte" | "svelte-app" | "app.svelte" | "stencil" | "stencil.tsx" | "solid.jsx" | "solid.tsx" | "riot" | "riotjs" | "malina" | "malinajs" | "xht" | "coffeescript" | "coffee" | "livescript" | "ls" | "civet" | "clio" | "imba" | "assemblyscript" | "python" | "py" | "pyodide" | "python-wasm" | "py-wasm" | "pythonwasm" | "pywasm" | "py3" | "wasm.py" | "rlang" | "rstats" | "r-wasm" | "ruby-wasm" | "wasm.rb" | "rubywasm" | "golang" | "php" | "php-wasm" | "phpwasm" | "wasm.php" | "cpp" | "c" | "C" | "cp" | "cxx" | "c++" | "cppm" | "ixx" | "ii" | "hpp" | "h" | "cpp-wasm" | "cppwasm" | "cwasm" | "wasm.cpp" | "clang" | "clang.cpp" | "perl" | "pl" | "pm" | "lua" | "lua-wasm" | "luawasm" | "wasm.lua" | "tl" | "fennel" | "fnl" | "julia" | "jl" | "scheme" | "scm" | "commonlisp" | "common-lisp" | "lisp" | "clojurescript" | "clojure" | "cljs" | "clj" | "cljc" | "edn" | "gleam" | "rescript" | "res" | "resi" | "re" | "rei" | "ocaml" | "ml" | "mli" | "tcl" | "wat" | "wast" | "webassembly" | "wasm" | "Binary" | "csharp" | "sql" | "sqlite" | "sqlite3" | "pg.sql" | "pgsql.sql" | "pgsql" | "pg" | "pglite" | "pglite.sql" | "postgresql" | "postgres" | "postgre.sql" | "postgresql.sql" | "prolog.pl" | "prolog" | "blockly" | "blockly.xml" | "xml" | "pintora" | "tailwindcss" | "postcssImportUrl" | "windicss" | "unocss" | "tokencss" | "lightningcss" | "autoprefixer" | "postcssPresetEnv" | "cssmodules" | "purgecss" | "cssnano")[]

List of enabled languages.

Defaults to all supported languages in full app and only current editor languages in embeds.

Defined in​

models.ts:462

markup​

markup: object

An object that configures the language and content of the markup editor.

See docs for details.

content?​

optional content: string

The initial content of the code editor.

Default​
""

contentUrl?​

optional contentUrl: string

A URL to load content from. It has to be a valid URL that is CORS-enabled.

The URL is only fetched if content property had no value.

hiddenContent?​

optional hiddenContent: string

Hidden content that gets evaluated without being visible in the code editor.

This can be useful in embedded playgrounds (e.g. for adding helper functions, utilities or tests)

hiddenContentUrl?​

optional hiddenContentUrl: string

A URL to load hiddenContent from. It has to be a valid URL that is CORS-enabled.

The URL is only fetched if hiddenContent property had no value.

hideTitle?​

optional hideTitle: boolean

If true, the title of the code editor is hidden, however its code is still evaluated.

This can be useful in embedded playgrounds (e.g. for hiding unnecessary code).

language​

language: Language

A language name, extension or alias (as defined in language documentations).

For the list of supported values, see Language

position?​

optional position: EditorPosition

The initial position of the cursor in the code editor.

Example​
{lineNumber: 5, column: 10}

selector?​

optional selector: string

A CSS selector to load content from DOM import.

title?​

optional title: string

If set, this is used as the title of the editor in the UI, overriding the default title set to the language name (e.g. "Python" can be used instead of "Py (Wasm)").

Default​

{ language: "html", content: "" }

Defined in​

models.ts:470

processors​

processors: Processor[]

List of enabled CSS processors.

For the list of available processors, see Processor

Defined in​

models.ts:509

script​

script: object

An object that configures the language and content of the script editor.

See docs for details.

content?​

optional content: string

The initial content of the code editor.

Default​
""

contentUrl?​

optional contentUrl: string

A URL to load content from. It has to be a valid URL that is CORS-enabled.

The URL is only fetched if content property had no value.

hiddenContent?​

optional hiddenContent: string

Hidden content that gets evaluated without being visible in the code editor.

This can be useful in embedded playgrounds (e.g. for adding helper functions, utilities or tests)

hiddenContentUrl?​

optional hiddenContentUrl: string

A URL to load hiddenContent from. It has to be a valid URL that is CORS-enabled.

The URL is only fetched if hiddenContent property had no value.

hideTitle?​

optional hideTitle: boolean

If true, the title of the code editor is hidden, however its code is still evaluated.

This can be useful in embedded playgrounds (e.g. for hiding unnecessary code).

language​

language: Language

A language name, extension or alias (as defined in language documentations).

For the list of supported values, see Language

position?​

optional position: EditorPosition

The initial position of the cursor in the code editor.

Example​
{lineNumber: 5, column: 10}

selector?​

optional selector: string

A CSS selector to load content from DOM import.

title?​

optional title: string

If set, this is used as the title of the editor in the UI, overriding the default title set to the language name (e.g. "Python" can be used instead of "Py (Wasm)").

Default​

{ language: "javascript", content: "" }

Defined in​

models.ts:486

scripts​

scripts: string[]

List of URLs for external scripts to add to the result page.

Defined in​

models.ts:496

style​

style: object

An object that configures the language and content of the style editor.

See docs for details.

content?​

optional content: string

The initial content of the code editor.

Default​
""

contentUrl?​

optional contentUrl: string

A URL to load content from. It has to be a valid URL that is CORS-enabled.

The URL is only fetched if content property had no value.

hiddenContent?​

optional hiddenContent: string

Hidden content that gets evaluated without being visible in the code editor.

This can be useful in embedded playgrounds (e.g. for adding helper functions, utilities or tests)

hiddenContentUrl?​

optional hiddenContentUrl: string

A URL to load hiddenContent from. It has to be a valid URL that is CORS-enabled.

The URL is only fetched if hiddenContent property had no value.

hideTitle?​

optional hideTitle: boolean

If true, the title of the code editor is hidden, however its code is still evaluated.

This can be useful in embedded playgrounds (e.g. for hiding unnecessary code).

language​

language: Language

A language name, extension or alias (as defined in language documentations).

For the list of supported values, see Language

position?​

optional position: EditorPosition

The initial position of the cursor in the code editor.

Example​
{lineNumber: 5, column: 10}

selector?​

optional selector: string

A CSS selector to load content from DOM import.

title?​

optional title: string

If set, this is used as the title of the editor in the UI, overriding the default title set to the language name (e.g. "Python" can be used instead of "Py (Wasm)").

Default​

{ language: "css", content: "" }

Defined in​

models.ts:478

stylesheets​

stylesheets: string[]

List of URLs for external stylesheets to add to the result page.

Defined in​

models.ts:491

tags​

tags: string[]

Project tags. Used in project filter and search.

Default​

[]

Defined in​

models.ts:447

tests​

tests: undefined | object

Configures the language and content of tests.

Defined in​

models.ts:576

title​

title: string

Project title. This is used as result page title and title meta tag. Also used in project search.

Default​

"Untitled Project"

Defined in​

models.ts:418

types​

types: object

Allows providing custom TypeScript type declarations for better editor intellisense.

It is an object where each key represents module name and value represents the types.

See docs for Types and Custom Types

Examples​

{
  "types": {
    "my-demo-lib": "https://my-custom-domain/my-type-declarations.d.ts"
  }
}
{
  "types": {
    "my-demo-lib": {
      "url": "https://my-custom-domain/types.d.ts",
      "autoload": true,
      "declareAsModule": true
    }
}

Defined in​

models.ts:570

version​

readonly version: string

This is a read-only property which specifies the current LiveCodes version.

Version specified in exported projects allows automatically upgrading the project configuration when imported by an app with a newer version.

Defined in​

models.ts:583

Sponsors