docs(playground): add version information in playground

Co-authored-by: Will Lillis <will.lillis24@gmail.com>
This commit is contained in:
Amaan Qureshi 2025-09-09 01:41:18 -04:00 committed by Amaan Qureshi
parent 40a8678989
commit 907c7bc80b
4 changed files with 102 additions and 41 deletions

View file

@ -54,6 +54,23 @@
display: inline-block;
}
.language-container {
display: flex;
align-items: center;
gap: 16px;
margin-bottom: 16px;
}
#language-version {
color: var(--light-text);
font-size: 14px;
font-weight: 500;
padding: 4px 8px;
background: var(--light-bg);
border-radius: 4px;
border: 1px solid var(--light-border);
}
#language-select {
background-color: var(--light-bg);
border: 1px solid var(--light-border);
@ -264,6 +281,7 @@ input[type="checkbox"]:focus {
.coal,
.navy {
& #language-version,
& #language-select,
& .select-button {
background-color: var(--dark-bg);

View file

@ -106,6 +106,7 @@ window.initializePlayground = async (opts) => {
const codeInput = document.getElementById("code-input");
const languageSelect = document.getElementById("language-select");
const languageVersion = document.getElementById('language-version');
const loggingCheckbox = document.getElementById("logging-checkbox");
const anonymousNodes = document.getElementById('anonymous-nodes-checkbox');
const outputContainer = document.getElementById("output-container");
@ -205,6 +206,15 @@ window.initializePlayground = async (opts) => {
tree = null;
languageName = newLanguageName;
const metadata = languagesByName[languageName].metadata;
if (metadata) {
languageVersion.textContent = `v${metadata.major_version}.${metadata.minor_version}.${metadata.patch_version}`;
languageVersion.style.visibility = 'visible';
} else {
languageVersion.style.visibility = 'hidden';
}
parser.setLanguage(languagesByName[newLanguageName]);
handleCodeChange();
handleQueryChange();