@nocobase/cli 2.1.0-beta.17 → 2.1.0-beta.19

package/dist/commands/test.js

@@ -0,0 +1,466 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+import { Args, Command, Flags } from '@oclif/core';
+import { spawn } from 'node:child_process';
+import fsp from 'node:fs/promises';
+import path from 'node:path';
+import Install from './install.js';
+import { defaultWorkspaceName } from '../lib/app-runtime.js';
+import { findAvailableTcpPort, validateAvailableTcpPort } from '../lib/prompt-validators.js';
+import { commandSucceeds, resolveProjectCwd, run, runNocoBaseCommand } from '../lib/run-npm.js';
+import { failTask, printInfo, setVerboseMode, startTask, succeedTask } from '../lib/ui.js';
+const DEFAULT_DB_HOST = '127.0.0.1';
+const DEFAULT_DB_DATABASE = 'nocobase-test';
+const DEFAULT_DB_USER = 'nocobase';
+const DEFAULT_DB_PASSWORD = 'nocobase';
+const DEFAULT_DB_DIALECT = 'postgres';
+const DEFAULT_TEST_TIMEZONE = 'UTC';
+const DEFAULT_TEST_DB_IMAGES = {
+    postgres: 'postgres:16',
+    mysql: 'mysql:8',
+    mariadb: 'mariadb:11',
+    kingbase: 'registry.cn-shanghai.aliyuncs.com/nocobase/kingbase:v009r001c001b0030_single_x86',
+};
+const DEFAULT_TEST_DB_DISTRIBUTOR_PORT = '23450';
+const DEFAULT_TEST_DB_DISTRIBUTOR_PREFIX = {
+    postgres: 'test',
+    mysql: 'test_',
+    mariadb: 'test_',
+};
+const DEFAULT_DB_PORTS = {
+    postgres: 5433,
+    mysql: 3307,
+    mariadb: 3307,
+    kingbase: 54322,
+};
+const TCP_PORT_READY_SCRIPT = [
+    "const net = require('node:net');",
+    "const port = Number(process.argv.at(-1));",
+    "const socket = net.createConnection({ host: '127.0.0.1', port });",
+    "socket.once('connect', () => { socket.end(); process.exit(0); });",
+    "socket.once('error', () => process.exit(1));",
+    "setTimeout(() => { socket.destroy(); process.exit(1); }, 200).unref();",
+].join('\n');
+function inferTestEnv(paths) {
+    const first = String(paths[0] ?? '').trim();
+    if (!first) {
+        return undefined;
+    }
+    const normalized = first.split('\\').join('/');
+    if (normalized.includes('/client/')
+        || normalized.includes('/client-v2/')
+        || normalized.includes('/flow-engine/')) {
+        return 'client-side';
+    }
+    return 'server-side';
+}
+function trimValue(value) {
+    return String(value ?? '').trim();
+}
+function resolveWorkspaceName(cwd) {
+    return defaultWorkspaceName(cwd);
+}
+function defaultTestDbPort(dbDialect) {
+    return String(DEFAULT_DB_PORTS[dbDialect] ?? DEFAULT_DB_PORTS.postgres);
+}
+function defaultTestDbImage(dbDialect) {
+    return DEFAULT_TEST_DB_IMAGES[dbDialect] ?? DEFAULT_TEST_DB_IMAGES.postgres;
+}
+function delay(ms) {
+    return new Promise((resolve) => {
+        setTimeout(resolve, ms);
+    });
+}
+function shouldRunServerTests(params) {
+    if (params.server) {
+        return true;
+    }
+    if (params.client) {
+        return false;
+    }
+    return inferTestEnv(params.paths) !== 'client-side';
+}
+function defaultTestDbDistributorPrefix(dbDialect) {
+    return DEFAULT_TEST_DB_DISTRIBUTOR_PREFIX[dbDialect];
+}
+function supportsTestDbDistributor(dbDialect) {
+    return Boolean(defaultTestDbDistributorPrefix(dbDialect));
+}
+function buildTestDbDistributorEnv(env) {
+    if (env.DB_DIALECT === 'mysql' || env.DB_DIALECT === 'mariadb') {
+        return {
+            ...env,
+            DB_APP_USER: env.DB_USER,
+            DB_USER: 'root',
+        };
+    }
+    return env;
+}
+async function waitForTcpPortReady(port, timeoutMs = 5000) {
+    const deadline = Date.now() + timeoutMs;
+    while (Date.now() < deadline) {
+        if (await commandSucceeds(process.execPath, ['-e', TCP_PORT_READY_SCRIPT, port])) {
+            return;
+        }
+        await delay(100);
+    }
+    throw new Error(`Timed out while waiting for the test DB distributor on 127.0.0.1:${port}.`);
+}
+async function stopBackgroundProcess(child) {
+    if (child.exitCode !== null || child.killed) {
+        return;
+    }
+    await new Promise((resolve) => {
+        const finish = () => {
+            clearTimeout(timeout);
+            resolve();
+        };
+        const timeout = setTimeout(finish, 1000);
+        child.once('close', finish);
+        try {
+            child.kill();
+        }
+        catch {
+            finish();
+        }
+    });
+}
+async function startTestDbDistributor(params) {
+    const port = DEFAULT_TEST_DB_DISTRIBUTOR_PORT;
+    const prefix = defaultTestDbDistributorPrefix(params.env.DB_DIALECT);
+    if (!prefix) {
+        throw new Error(`The ${params.env.DB_DIALECT} test DB distributor is not supported.`);
+    }
+    const portError = await validateAvailableTcpPort(port);
+    if (portError) {
+        throw new Error(`Host port ${port} is unavailable for the test DB distributor. ${portError}`);
+    }
+    const distributorEnv = buildTestDbDistributorEnv(params.env);
+    const child = spawn(process.execPath, [
+        path.resolve(params.cwd, 'node_modules', 'tsx', 'dist', 'cli.mjs'),
+        path.resolve(params.cwd, 'packages', 'core', 'test', 'src', 'scripts', 'test-db-creator.ts'),
+    ], {
+        cwd: params.cwd,
+        env: {
+            ...process.env,
+            ...distributorEnv,
+            DB_TEST_DISTRIBUTOR_PORT: port,
+            DB_TEST_PREFIX: prefix,
+        },
+        stdio: params.stdio,
+        windowsHide: process.platform === 'win32',
+    });
+    let childError;
+    child.once('error', (error) => {
+        childError = error;
+    });
+    child.once('close', (code, signal) => {
+        if (code === 0) {
+            return;
+        }
+        childError = childError ?? new Error(signal
+            ? `test DB distributor exited due to signal ${signal}`
+            : `test DB distributor exited with code ${code ?? 'unknown'}`);
+    });
+    try {
+        await waitForTcpPortReady(port);
+    }
+    catch (error) {
+        await stopBackgroundProcess(child);
+        throw childError ?? error;
+    }
+    return {
+        port,
+        prefix,
+        stop: async () => {
+            await stopBackgroundProcess(child);
+        },
+    };
+}
+async function ensureDockerNetwork(networkName, options) {
+    if (await commandSucceeds('docker', ['network', 'inspect', networkName])) {
+        return;
+    }
+    await run('docker', ['network', 'create', networkName], {
+        errorName: 'docker network create',
+        stdio: options?.stdio ?? 'ignore',
+    });
+}
+async function removeDockerContainerIfExists(containerName, options) {
+    if (!(await commandSucceeds('docker', ['container', 'inspect', containerName]))) {
+        return 'missing';
+    }
+    await run('docker', ['rm', '-f', containerName], {
+        errorName: 'docker rm',
+        stdio: options?.stdio ?? 'ignore',
+    });
+    return 'removed';
+}
+function formatDbBootstrapFailure(message) {
+    return [
+        'Could not prepare the built-in test database.',
+        'The CLI was not able to recreate a clean Docker database for this test run.',
+        'Check Docker status, the selected port, and local storage permissions, then try again.',
+        `Details: ${message}`,
+    ].join('\n');
+}
+function buildTestDbConfig(params) {
+    const dbDialect = trimValue(params.dbDialect) || DEFAULT_DB_DIALECT;
+    const workspaceName = resolveWorkspaceName(params.cwd);
+    const storagePath = path.join(params.cwd, 'storage', 'test');
+    const plan = Install.buildBuiltinDbPlan({
+        envName: 'test',
+        workspaceName,
+        storagePath,
+        source: 'test',
+        dbDialect,
+        dbHost: DEFAULT_DB_HOST,
+        dbPort: trimValue(params.dbPort) || defaultTestDbPort(dbDialect),
+        dbDatabase: trimValue(params.dbDatabase) || DEFAULT_DB_DATABASE,
+        dbUser: trimValue(params.dbUser) || DEFAULT_DB_USER,
+        dbPassword: trimValue(params.dbPassword) || DEFAULT_DB_PASSWORD,
+        builtinDbImage: trimValue(params.builtinDbImage) || defaultTestDbImage(dbDialect),
+    });
+    return {
+        storagePath,
+        containerName: plan.containerName,
+        networkName: plan.networkName,
+        dataDir: plan.dataDir,
+        args: plan.args,
+        env: {
+            APP_ENV_PATH: '.env',
+            STORAGE_PATH: storagePath,
+            TZ: DEFAULT_TEST_TIMEZONE,
+            DB_DIALECT: plan.dbDialect,
+            DB_HOST: plan.dbHost,
+            DB_PORT: plan.dbPort,
+            DB_DATABASE: plan.dbDatabase,
+            DB_USER: plan.dbUser,
+            DB_PASSWORD: plan.dbPassword,
+        },
+    };
+}
+async function prepareTestDatabase(config, options) {
+    let nextConfig = config;
+    await ensureDockerNetwork(nextConfig.networkName, {
+        stdio: options?.stdio,
+    });
+    await removeDockerContainerIfExists(nextConfig.containerName, {
+        stdio: options?.stdio,
+    });
+    await fsp.rm(nextConfig.storagePath, { recursive: true, force: true });
+    const portError = await validateAvailableTcpPort(nextConfig.env.DB_PORT);
+    if (portError) {
+        if (options?.dbPortExplicit) {
+            throw new Error(`Host port ${nextConfig.env.DB_PORT} is unavailable. ${portError}`);
+        }
+        const fallbackPort = await findAvailableTcpPort();
+        printInfo(`Host port ${nextConfig.env.DB_PORT} is unavailable for the test database, so the CLI will use ${fallbackPort} instead.`);
+        nextConfig = buildTestDbConfig({
+            cwd: path.dirname(path.dirname(nextConfig.storagePath)),
+            dbDialect: nextConfig.env.DB_DIALECT,
+            dbPort: fallbackPort,
+            dbDatabase: nextConfig.env.DB_DATABASE,
+            dbUser: nextConfig.env.DB_USER,
+            dbPassword: nextConfig.env.DB_PASSWORD,
+            builtinDbImage: undefined,
+        });
+    }
+    await fsp.mkdir(nextConfig.dataDir, { recursive: true });
+    await run('docker', nextConfig.args, {
+        errorName: 'docker run',
+        stdio: options?.stdio ?? 'ignore',
+    });
+    await waitForTcpPortReady(nextConfig.env.DB_PORT, 30_000);
+    return nextConfig;
+}
+export default class Test extends Command {
+    static args = {
+        paths: Args.string({
+            description: 'test file paths or globs to pass through',
+            multiple: true,
+            required: false,
+        }),
+    };
+    static description = 'Run project tests from the selected app directory. Before running tests, the CLI recreates a built-in Docker test database and injects `DB_*` values internally.';
+    static examples = [
+        '<%= config.bin %> <%= command.id %>',
+        '<%= config.bin %> <%= command.id %> --cwd /path/to/app',
+        '<%= config.bin %> <%= command.id %> packages/core/server/src/__tests__/foo.test.ts',
+        '<%= config.bin %> <%= command.id %> --server --coverage',
+        '<%= config.bin %> <%= command.id %> --db-port 5433',
+    ];
+    static flags = {
+        cwd: Flags.string({
+            char: 'c',
+            description: 'App directory to run tests from. Defaults to the current working directory',
+            required: false,
+        }),
+        watch: Flags.boolean({
+            char: 'w',
+            description: 'Run Vitest in watch mode',
+            default: false,
+        }),
+        run: Flags.boolean({
+            description: 'Run once without watch mode',
+            default: false,
+        }),
+        allowOnly: Flags.boolean({
+            description: 'Allow `.only` tests',
+            default: false,
+        }),
+        bail: Flags.boolean({
+            description: 'Stop after the first failure',
+            default: false,
+        }),
+        coverage: Flags.boolean({
+            description: 'Enable coverage reporting',
+            default: false,
+        }),
+        'single-thread': Flags.string({
+            description: 'Forward single-thread mode to the underlying test runner',
+            required: false,
+        }),
+        server: Flags.boolean({
+            description: 'Force server-side test mode',
+            default: false,
+        }),
+        client: Flags.boolean({
+            description: 'Force client-side test mode',
+            default: false,
+        }),
+        'db-clean': Flags.boolean({
+            char: 'd',
+            description: 'Clean the database before tests when supported by the underlying app command',
+            default: false,
+        }),
+        'db-dialect': Flags.string({
+            description: 'Built-in test database dialect to start',
+            options: ['postgres', 'mysql', 'mariadb', 'kingbase'],
+            required: false,
+        }),
+        'db-image': Flags.string({
+            description: 'Built-in test database Docker image to start',
+            aliases: ['builtin-db-image'],
+            required: false,
+        }),
+        'db-port': Flags.string({
+            description: 'Host TCP port to publish for the built-in test database',
+            required: false,
+        }),
+        'db-database': Flags.string({
+            description: 'Database name to inject for tests',
+            required: false,
+        }),
+        'db-user': Flags.string({
+            description: 'Database user to inject for tests',
+            required: false,
+        }),
+        'db-password': Flags.string({
+            description: 'Database password to inject for tests',
+            required: false,
+        }),
+        verbose: Flags.boolean({
+            description: 'Show raw Docker and test runner output',
+            default: false,
+        }),
+    };
+    async run() {
+        const { args, flags } = await this.parse(Test);
+        setVerboseMode(flags.verbose);
+        if (flags.server && flags.client) {
+            this.error('Cannot use `--server` and `--client` together.');
+        }
+        const cwd = resolveProjectCwd(flags.cwd);
+        const commandArgs = ['test', ...(args.paths ?? [])];
+        if (flags.watch) {
+            commandArgs.push('--watch');
+        }
+        if (flags.run || !flags.watch) {
+            commandArgs.push('--run');
+        }
+        if (flags.allowOnly) {
+            commandArgs.push('--allowOnly');
+        }
+        if (flags.bail) {
+            commandArgs.push('--bail');
+        }
+        if (flags.coverage) {
+            commandArgs.push('--coverage');
+        }
+        if (flags.server) {
+            commandArgs.push('--server');
+        }
+        else if (flags.client) {
+            commandArgs.push('--client');
+        }
+        if (flags['db-clean']) {
+            commandArgs.push('--db-clean');
+        }
+        if (flags['single-thread'] !== undefined) {
+            commandArgs.push(`--single-thread=${flags['single-thread']}`);
+        }
+        else if (!flags.client && !flags.server && inferTestEnv(args.paths ?? []) === 'server-side') {
+            commandArgs.push('--single-thread=true');
+        }
+        startTask('Recreating the built-in test database...');
+        let testDbConfig;
+        let testDbDistributor;
+        try {
+            testDbConfig = await prepareTestDatabase(buildTestDbConfig({
+                cwd,
+                dbDialect: flags['db-dialect'],
+                builtinDbImage: flags['db-image'],
+                dbPort: flags['db-port'],
+                dbDatabase: flags['db-database'],
+                dbUser: flags['db-user'],
+                dbPassword: flags['db-password'],
+            }), {
+                stdio: flags.verbose ? 'inherit' : 'ignore',
+                dbPortExplicit: Boolean(flags['db-port']),
+            });
+            if (shouldRunServerTests({
+                server: flags.server,
+                client: flags.client,
+                paths: args.paths ?? [],
+            })
+                && supportsTestDbDistributor(testDbConfig.env.DB_DIALECT)) {
+                testDbDistributor = await startTestDbDistributor({
+                    cwd,
+                    env: testDbConfig.env,
+                    stdio: flags.verbose ? 'inherit' : 'ignore',
+                });
+                testDbConfig.env.DB_TEST_DISTRIBUTOR_PORT = testDbDistributor.port;
+                testDbConfig.env.DB_TEST_PREFIX = testDbDistributor.prefix;
+            }
+            succeedTask(`The built-in test database is ready at ${testDbConfig.env.DB_HOST}:${testDbConfig.env.DB_PORT}.`);
+            printInfo(`Test DB settings: DB_DIALECT=${testDbConfig.env.DB_DIALECT} DB_HOST=${testDbConfig.env.DB_HOST} DB_PORT=${testDbConfig.env.DB_PORT} DB_DATABASE=${testDbConfig.env.DB_DATABASE} DB_USER=${testDbConfig.env.DB_USER}`);
+        }
+        catch (error) {
+            const message = error instanceof Error ? error.message : String(error);
+            failTask('Failed to recreate the built-in test database.');
+            this.error(formatDbBootstrapFailure(message));
+            return;
+        }
+        try {
+            await runNocoBaseCommand(commandArgs, {
+                cwd,
+                stdio: flags.verbose ? 'inherit' : 'ignore',
+                env: testDbConfig.env,
+            });
+        }
+        catch (error) {
+            const message = error instanceof Error ? error.message : String(error);
+            this.error(message);
+        }
+        finally {
+            await testDbDistributor?.stop();
+        }
+    }
+}

package/dist/lib/prompt-catalog.js

@@ -22,8 +22,14 @@ function clackSelectOptions(options, locale) {
             value: o.value,
             label: resolvePromptText(o.label, locale, o.value),
             ...(o.hint !== undefined ? { hint: resolvePromptText(o.hint, locale) } : {}),
+            ...(o.disabled !== undefined ? { disabled: o.disabled } : {}),
         });
 }
+function enabledSelectOptionValues(options) {
+    return options
+        .filter((o) => typeof o === 'string' || o.disabled !== true)
+        .map((o) => (typeof o === 'string' ? o : o.value));
+}
 function defaultOnCancel(locale) {
     p.cancel(createCliTranslate(locale)('promptCatalog.common.cancelled'));
     exit(0);
@@ -63,21 +69,22 @@ function mergedBoolean(key, def, iv, useYesInitial) {
 }
 function mergedSelect(key, def, iv, useYesInitial) {
     const valueList = selectOptionValues(def.options);
+    const enabledValueList = enabledSelectOptionValues(def.options);
     if (hasIvKey(iv, key)) {
         const s = String(iv[key]);
-        if (valueList.includes(s)) {
+        if (enabledValueList.includes(s)) {
             return s;
         }
         return undefined;
     }
-    if (useYesInitial && def.yesInitialValue !== undefined && valueList.includes(def.yesInitialValue)) {
+    if (useYesInitial && def.yesInitialValue !== undefined && enabledValueList.includes(def.yesInitialValue)) {
         return def.yesInitialValue;
     }
     const d = def.initialValue;
-    if (d !== undefined && valueList.includes(d)) {
+    if (d !== undefined && enabledValueList.includes(d)) {
         return d;
     }
-    return valueList[0];
+    return enabledValueList[0];
 }
 function mergedInteger(key, def, iv, useYesInitial) {
     if (hasIvKey(iv, key)) {

package/dist/lib/prompt-web-ui.js

@@ -9,7 +9,7 @@
 import { spawn } from 'node:child_process';
 import { createServer } from 'node:http';
 import { createCliTranslate, resolveCliLocale, resolveLocalizedText, } from "./cli-locale.js";
-import { isPromptBlockSkipped, runPromptFieldValidate, selectOptionValues, } from "./prompt-catalog.js";
+import { isPromptBlockSkipped, runPromptFieldValidate, } from "./prompt-catalog.js";
 const DEFAULT_SUBMIT = '/__pwc_ui_submit';
 const DEFAULT_REFLOW = '/__pwc_ui_reflow';
 const DEFAULT_VALIDATE_STEP = '/__pwc_ui_validate_step';
@@ -76,12 +76,17 @@ function defaultValueForInput(key, def, out) {
         case 'boolean':
             return def.initialValue !== undefined ? Boolean(def.initialValue) : true;
         case 'select': {
-            const first = selectOptionValues(def.options)[0];
+            const first = def.options
+                .find((o) => typeof o === 'string' || o.disabled !== true);
+            const firstValue = typeof first === 'string' ? first : first?.value;
             const i = def.initialValue;
-            if (i !== undefined && selectOptionValues(def.options).includes(i)) {
+            const enabledValues = def.options
+                .filter((o) => typeof o === 'string' || o.disabled !== true)
+                .map((o) => (typeof o === 'string' ? o : o.value));
+            if (i !== undefined && enabledValues.includes(i)) {
                 return i;
             }
-            return first ?? '';
+            return firstValue ?? '';
         }
         case 'password':
             return def.initialValue ?? '';
@@ -147,7 +152,9 @@ function normalizeWebRawForBlock(def, raw, key) {
         }
         case 'select': {
             const s = String(raw ?? '');
-            const list = selectOptionValues(def.options);
+            const list = def.options
+                .filter((o) => typeof o === 'string' || o.disabled !== true)
+                .map((o) => (typeof o === 'string' ? o : o.value));
             if (list.includes(s)) {
                 return s;
             }
@@ -298,11 +305,15 @@ function renderPwcRadioOptions(key, def, defaults, hidden, locale) {
             : o.hint
                 ? `<div class="pwc-radio-option-hint">${escapeHtml(resolveUiText(o.hint, locale))}</div>`
                 : '';
+        const optionDisabled = typeof o !== 'string' && o.disabled === true;
         const checked = String(defaults[key] ?? '') === val ? ' checked' : '';
         const required = def.required && index === 0 ? ' required' : '';
-        const disabled = hidden ? ' disabled' : '';
-        return (`<label class="pwc-radio-option">` +
-            `<input class="pwc-radio-input" name="${escapeHtml(key)}" type="radio" value="${escapeHtml(String(val))}"${checked}${required}${disabled} />` +
+        const disabled = hidden || optionDisabled ? ' disabled' : '';
+        const optionClass = optionDisabled ? 'pwc-radio-option pwc-radio-option--disabled' : 'pwc-radio-option';
+        const ariaDisabled = optionDisabled ? ' aria-disabled="true"' : '';
+        const staticDisabled = optionDisabled ? ' data-pwc-static-disabled="1"' : '';
+        return (`<label class="${optionClass}"${ariaDisabled}>` +
+            `<input class="pwc-radio-input" name="${escapeHtml(key)}" type="radio" value="${escapeHtml(String(val))}"${checked}${required}${disabled}${staticDisabled} />` +
             `<span class="pwc-radio-option-body">` +
             `<span class="pwc-radio-option-label">${escapeHtml(String(lab))}</span>` +
             hint +
@@ -361,7 +372,8 @@ function renderPwcFieldRow(key, def, defaults, show, locale) {
             const val = typeof o === 'string' ? o : o.value;
             const lab = typeof o === 'string' ? o : resolveUiText(o.label, locale, o.value);
             const sel = String(defaults[key] ?? '') === val ? ' selected' : '';
-            return `<option value="${escapeHtml(String(val))}"${sel}>${escapeHtml(String(lab))}</option>`;
+            const disabledOpt = typeof o !== 'string' && o.disabled === true ? ' disabled' : '';
+            return `<option value="${escapeHtml(String(val))}"${sel}${disabledOpt}>${escapeHtml(String(lab))}</option>`;
         })
             .join('');
         const req = def.required ? ' required' : '';
@@ -1132,6 +1144,15 @@ function runPromptCatalogWebUIImpl(options) {
       box-shadow: 0 0 0 2px color-mix(in srgb, var(--pwc-ad-color-primary) 8%, transparent);
       background: color-mix(in srgb, var(--pwc-ad-color-primary) 2%, var(--pwc-ad-color-container));
     }
+    .pwc-radio-option--disabled {
+      cursor: not-allowed;
+      background: var(--pwc-ad-color-fill-alter);
+    }
+    .pwc-radio-option--disabled:hover {
+      border-color: var(--pwc-ad-color-border);
+      box-shadow: none;
+      background: var(--pwc-ad-color-fill-alter);
+    }
     .pwc-radio-input {
       margin: 3px 0 0;
       width: 16px;
@@ -1140,6 +1161,9 @@ function runPromptCatalogWebUIImpl(options) {
       accent-color: var(--pwc-ad-color-primary);
       cursor: pointer;
     }
+    .pwc-radio-option--disabled .pwc-radio-input {
+      cursor: not-allowed;
+    }
     .pwc-radio-option-body { min-width: 0; }
     .pwc-radio-option-label {
       display: block;
@@ -1147,12 +1171,18 @@ function runPromptCatalogWebUIImpl(options) {
       line-height: 1.5715;
       color: var(--pwc-ad-color-text);
     }
+    .pwc-radio-option--disabled .pwc-radio-option-label {
+      color: color-mix(in srgb, var(--pwc-ad-color-text) 55%, transparent);
+    }
     .pwc-radio-option-hint {
       margin-top: 2px;
       font-size: 12px;
       line-height: 1.5;
       color: var(--pwc-ad-color-text-description);
     }
+    .pwc-radio-option--disabled .pwc-radio-option-hint {
+      color: color-mix(in srgb, var(--pwc-ad-color-text-description) 70%, transparent);
+    }
     .pwc-radio-input:focus-visible {
       outline: none;
       box-shadow: 0 0 0 2px color-mix(in srgb, var(--pwc-ad-color-primary) 20%, transparent);
@@ -1163,6 +1193,11 @@ function runPromptCatalogWebUIImpl(options) {
       box-shadow: 0 0 0 2px color-mix(in srgb, var(--pwc-ad-color-primary) 12%, transparent);
       background: color-mix(in srgb, var(--pwc-ad-color-primary) 5%, var(--pwc-ad-color-container));
     }
+    .pwc-radio-option--disabled:has(.pwc-radio-input:checked) {
+      border-color: var(--pwc-ad-color-border);
+      box-shadow: none;
+      background: var(--pwc-ad-color-fill-alter);
+    }
     .pwc-form-item-has-error .pwc-radio-option {
       border-color: var(--pwc-form-color-error);
     }
@@ -1570,7 +1605,7 @@ function runPromptCatalogWebUIImpl(options) {
             w.style.display = hidden ? 'none' : 'block';
             var ctrls = w.querySelectorAll('input, select, textarea');
             for (var i = 0; i < ctrls.length; i++) {
-              ctrls[i].disabled = hidden;
+              ctrls[i].disabled = hidden || ctrls[i].getAttribute('data-pwc-static-disabled') === '1';
             }
             if (!hidden && k && !pwcIsFieldDirty(k) && Object.prototype.hasOwnProperty.call(vals, k)) {
               setControlValue(form, k, vals[k]);