From 2dcfab57b73e0ddbaa8851cb2e36d51ec9245845 Mon Sep 17 00:00:00 2001
From: yacchin1205 <968739+yacchin1205@users.noreply.github.com>
Date: Fri, 27 Feb 2026 07:12:56 +0900
Subject: [PATCH 1/7] Add FileSelector/ExportTarget components and generalize
 WEKO item display

---
 .../flowable-form/export-target/component.ts  | 55 ++++++++++++
 .../flowable-form/export-target/template.hbs  | 20 +++++
 .../flowable-form/field/component.ts          | 25 +++++-
 .../flowable-form/field/template.hbs          | 14 ++++
 .../flowable-form/file-selector/component.ts  | 84 +++++++++++++++++++
 .../flowable-form/file-selector/template.hbs  | 12 +++
 .../-components/flowable-form/utils.ts        | 14 ++++
 app/utils/weko-item.ts                        | 40 +++++++++
 .../draft-registration-card/component.ts      | 34 ++++----
 .../draft-registration-card/template.hbs      |  9 +-
 .../draft/-components/register/component.ts   | 22 ++---
 .../draft/-components/register/template.hbs   |  2 +-
 translations/en-us.yml                        | 11 ++-
 translations/ja.yml                           | 11 ++-
 14 files changed, 315 insertions(+), 38 deletions(-)
 create mode 100644 app/guid-node/workflow/-components/flowable-form/export-target/component.ts
 create mode 100644 app/guid-node/workflow/-components/flowable-form/export-target/template.hbs
 create mode 100644 app/guid-node/workflow/-components/flowable-form/file-selector/component.ts
 create mode 100644 app/guid-node/workflow/-components/flowable-form/file-selector/template.hbs
 create mode 100644 app/utils/weko-item.ts

diff --git a/app/guid-node/workflow/-components/flowable-form/export-target/component.ts b/app/guid-node/workflow/-components/flowable-form/export-target/component.ts
new file mode 100644
index 000000000..487085353
--- /dev/null
+++ b/app/guid-node/workflow/-components/flowable-form/export-target/component.ts
@@ -0,0 +1,55 @@
+import { action } from '@ember/object';
+import Component from '@glimmer/component';
+import { tracked } from '@glimmer/tracking';
+import { task } from 'ember-concurrency-decorators';
+
+import FileProviderModel from 'ember-osf-web/models/file-provider';
+import Node from 'ember-osf-web/models/node';
+
+import { FieldValueWithType } from '../types';
+
+interface ExportTargetArgs {
+    node: Node;
+    value: FieldValueWithType | undefined;
+    onChange: (valueWithType: FieldValueWithType) => void;
+    disabled: boolean;
+}
+
+export default class ExportTarget extends Component<ExportTargetArgs> {
+    @tracked providers: FileProviderModel[] = [];
+    @tracked selectedProvider: string = '';
+
+    @task
+    loadProviders = task(function *(this: ExportTarget) {
+        const providers: FileProviderModel[] = (yield this.args.node.loadAll('files')).toArray();
+        this.providers = providers;
+
+        // Restore from value or pick default
+        if (this.args.value && this.args.value.type === 'string' && this.args.value.value) {
+            this.selectedProvider = this.args.value.value as string;
+        } else if (providers.length > 0) {
+            const osf = providers.find(p => p.name === 'osfstorage');
+            this.selectedProvider = osf ? osf.name : providers[0].name;
+            this.notifyChange(this.selectedProvider);
+        }
+    });
+
+    @action
+    initialize() {
+        this.loadProviders.perform();
+    }
+
+    @action
+    destinationChanged(event: Event) {
+        const value = (event.target as HTMLSelectElement).value;
+        this.selectedProvider = value;
+        this.notifyChange(value);
+    }
+
+    private notifyChange(providerName: string): void {
+        this.args.onChange({
+            value: providerName,
+            type: 'string',
+        });
+    }
+}
diff --git a/app/guid-node/workflow/-components/flowable-form/export-target/template.hbs b/app/guid-node/workflow/-components/flowable-form/export-target/template.hbs
new file mode 100644
index 000000000..f030e5467
--- /dev/null
+++ b/app/guid-node/workflow/-components/flowable-form/export-target/template.hbs
@@ -0,0 +1,20 @@
+<div {{did-insert this.initialize}}>
+    {{#if this.loadProviders.isRunning}}
+        <div class="text-muted">
+            <i class="fa fa-spinner fa-spin"></i>
+            {{t 'workflow.console.tasks.dialog.exportTarget.loading'}}
+        </div>
+    {{else}}
+        <select
+            class="form-control"
+            disabled={{@disabled}}
+            {{on "change" this.destinationChanged}}
+        >
+            {{#each this.providers as |provider|}}
+                <option value={{provider.name}} selected={{eq this.selectedProvider provider.name}}>
+                    {{provider.name}}
+                </option>
+            {{/each}}
+        </select>
+    {{/if}}
+</div>
diff --git a/app/guid-node/workflow/-components/flowable-form/field/component.ts b/app/guid-node/workflow/-components/flowable-form/field/component.ts
index 2e39bb331..f0f41c2e7 100644
--- a/app/guid-node/workflow/-components/flowable-form/field/component.ts
+++ b/app/guid-node/workflow/-components/flowable-form/field/component.ts
@@ -6,7 +6,7 @@ import { WorkflowVariable } from '../../../types';
 import { parseProgressSteps, ProgressStep } from '../../progress-sidebar/utils';
 import { resolveFlowableType } from '../component';
 import { FieldValueWithType, WorkflowTaskField, WorkflowTaskFieldOption } from '../types';
-import { extractFileMetadata, extractProjectMetadata } from '../utils';
+import { extractExportTarget, extractFileMetadata, extractFileSelector, extractProjectMetadata } from '../utils';
 
 function getOptionValue(option: WorkflowTaskFieldOption): string | undefined {
     return (option.id !== undefined && option.id !== null) ? option.id : option.name;
@@ -118,6 +118,18 @@ export default class TaskFormField extends Component<TaskFormFieldArgs> {
         this.args.onChange(this.args.field.id, valueWithType);
     }
 
+    @action
+    handleFileSelectorChange(valueWithType: FieldValueWithType): void {
+        this.updatedValue = valueWithType;
+        this.args.onChange(this.args.field.id, valueWithType);
+    }
+
+    @action
+    handleExportTargetChange(valueWithType: FieldValueWithType): void {
+        this.updatedValue = valueWithType;
+        this.args.onChange(this.args.field.id, valueWithType);
+    }
+
     get displayValue(): unknown {
         return this.updatedValue !== null ? this.updatedValue.value : this.currentValue;
     }
@@ -201,9 +213,20 @@ export default class TaskFormField extends Component<TaskFormFieldArgs> {
         if (this.isProjectMetadataSelector) {
             return false;
         }
+        if (this.isFileSelector || this.isExportTarget) {
+            return false;
+        }
         return this.type === 'multi-line-text' || this.type === 'textarea';
     }
 
+    get isFileSelector(): boolean {
+        return extractFileSelector(this.args.field);
+    }
+
+    get isExportTarget(): boolean {
+        return extractExportTarget(this.args.field);
+    }
+
     get projectMetadataPlaceholder() {
         return extractProjectMetadata(this.args.field);
     }
diff --git a/app/guid-node/workflow/-components/flowable-form/field/template.hbs b/app/guid-node/workflow/-components/flowable-form/field/template.hbs
index bce990322..1813f6b58 100644
--- a/app/guid-node/workflow/-components/flowable-form/field/template.hbs
+++ b/app/guid-node/workflow/-components/flowable-form/field/template.hbs
@@ -129,6 +129,20 @@
                 @onChange={{this.handleFileMetadataSelection}}
                 @disabled={{this.isReadOnly}}
             />
+        {{else if this.isFileSelector}}
+            <GuidNode::Workflow::-Components::FlowableForm::FileSelector
+                @node={{@node}}
+                @value={{this.currentValue}}
+                @onChange={{this.handleFileSelectorChange}}
+                @disabled={{this.isReadOnly}}
+            />
+        {{else if this.isExportTarget}}
+            <GuidNode::Workflow::-Components::FlowableForm::ExportTarget
+                @node={{@node}}
+                @value={{this.currentValue}}
+                @onChange={{this.handleExportTargetChange}}
+                @disabled={{this.isReadOnly}}
+            />
         {{else if this.isTextarea}}
             <textarea
                 id={{this.fieldId}}
diff --git a/app/guid-node/workflow/-components/flowable-form/file-selector/component.ts b/app/guid-node/workflow/-components/flowable-form/file-selector/component.ts
new file mode 100644
index 000000000..873563337
--- /dev/null
+++ b/app/guid-node/workflow/-components/flowable-form/file-selector/component.ts
@@ -0,0 +1,84 @@
+import { action } from '@ember/object';
+import Component from '@glimmer/component';
+import { tracked } from '@glimmer/tracking';
+import { task } from 'ember-concurrency-decorators';
+
+import FileProviderModel from 'ember-osf-web/models/file-provider';
+import Node from 'ember-osf-web/models/node';
+import { SelectionManager } from 'ember-osf-web/guid-node/package/selection';
+import { WaterButlerFile } from 'ember-osf-web/utils/waterbutler/base';
+
+import { FieldValueWithType } from '../types';
+
+interface FileSelectorValue {
+    provider: string;
+    files: Array<{ materialized: string; enable: boolean }>;
+}
+
+interface FileSelectorArgs {
+    node: Node;
+    value: FieldValueWithType | undefined;
+    onChange: (valueWithType: FieldValueWithType) => void;
+    disabled: boolean;
+}
+
+class NotifyingSelectionManager extends SelectionManager {
+    private onUpdate: () => void;
+
+    constructor(onUpdate: () => void) {
+        super();
+        this.onUpdate = onUpdate;
+    }
+
+    setChecked(item: WaterButlerFile, value: boolean) {
+        super.setChecked(item, value);
+        this.onUpdate();
+    }
+}
+
+export default class FileSelector extends Component<FileSelectorArgs> {
+    selectionManager: NotifyingSelectionManager;
+    @tracked providerName: string = '';
+
+    constructor(owner: unknown, args: FileSelectorArgs) {
+        super(owner, args);
+        this.selectionManager = new NotifyingSelectionManager(() => this.emitValue());
+    }
+
+    @task
+    loadProvider = task(function *(this: FileSelector) {
+        const providers: FileProviderModel[] = (yield this.args.node.loadAll('files')).toArray();
+        const osf = providers.find((p: FileProviderModel) => p.name === 'osfstorage');
+        if (osf) {
+            this.providerName = osf.name;
+        } else {
+            const inst = providers.filter((p: FileProviderModel) => p.forInstitutions);
+            inst.sort((a: FileProviderModel, b: FileProviderModel) => a.name.localeCompare(b.name));
+            this.providerName = inst.length > 0 ? inst[0].name : providers[0].name;
+        }
+        this.emitValue();
+    });
+
+    @action
+    initialize() {
+        this.loadProvider.perform();
+    }
+
+    private emitValue(): void {
+        if (!this.providerName) {
+            return;
+        }
+        const files = Object.keys(this.selectionManager.checked).map(materialized => ({
+            materialized,
+            enable: this.selectionManager.checked[materialized],
+        }));
+        const value: FileSelectorValue = {
+            provider: this.providerName,
+            files,
+        };
+        this.args.onChange({
+            value,
+            type: 'json',
+        });
+    }
+}
diff --git a/app/guid-node/workflow/-components/flowable-form/file-selector/template.hbs b/app/guid-node/workflow/-components/flowable-form/file-selector/template.hbs
new file mode 100644
index 000000000..428a29275
--- /dev/null
+++ b/app/guid-node/workflow/-components/flowable-form/file-selector/template.hbs
@@ -0,0 +1,12 @@
+<div {{did-insert this.initialize}}>
+    <GuidNode::Package::-Components::Files::Manager
+        @node={{@node}}
+        @canEdit={{false}}
+        as |filesManager|
+    >
+        <GuidNode::Package::-Components::Files::Browse
+            @filesManager={{filesManager}}
+            @selectionManager={{this.selectionManager}}
+        />
+    </GuidNode::Package::-Components::Files::Manager>
+</div>
diff --git a/app/guid-node/workflow/-components/flowable-form/utils.ts b/app/guid-node/workflow/-components/flowable-form/utils.ts
index e9c206591..d47c6b33c 100644
--- a/app/guid-node/workflow/-components/flowable-form/utils.ts
+++ b/app/guid-node/workflow/-components/flowable-form/utils.ts
@@ -45,3 +45,17 @@ export function extractProjectMetadata(field: WorkflowTaskField): ProjectMetadat
 export function extractFileMetadata(field: WorkflowTaskField): FileMetadataPlaceholder | null {
     return extractMetadataPlaceholder(field, '_FILE_METADATA');
 }
+
+export function extractFileSelector(field: WorkflowTaskField): boolean {
+    if (field.type !== 'multi-line-text') {
+        return false;
+    }
+    return field.placeholder === '_FILE_SELECTOR()';
+}
+
+export function extractExportTarget(field: WorkflowTaskField): boolean {
+    if (field.type !== 'multi-line-text') {
+        return false;
+    }
+    return field.placeholder === '_EXPORT_TARGET()';
+}
diff --git a/app/utils/weko-item.ts b/app/utils/weko-item.ts
new file mode 100644
index 000000000..b464a4d58
--- /dev/null
+++ b/app/utils/weko-item.ts
@@ -0,0 +1,40 @@
+const WEKO_ITEM_ID_KEY = 'internal:weko-item-id';
+const WORKFLOW_RUN_ID_KEY = 'internal:workflow-run-id';
+
+const MEBYO_SCHEMA_NAME = 'ムーンショット目標2データベース（未病DB）のメタデータ登録';
+
+const WEKO_LABEL_KEYS: Record<string, string> = {
+    [MEBYO_SCHEMA_NAME]: 'mebyo',
+};
+
+export function getWekoItemId(
+    responses: { [key: string]: unknown } | undefined,
+): string | null {
+    if (!responses) {
+        return null;
+    }
+    const value = responses[WEKO_ITEM_ID_KEY]
+        || responses[`__responseKey_${WEKO_ITEM_ID_KEY}`];
+    if (typeof value === 'string' && value.trim()) {
+        return value.trim();
+    }
+    return null;
+}
+
+export function getWorkflowRunId(
+    responses: { [key: string]: unknown } | undefined,
+): string | null {
+    if (!responses) {
+        return null;
+    }
+    const value = responses[WORKFLOW_RUN_ID_KEY]
+        || responses[`__responseKey_${WORKFLOW_RUN_ID_KEY}`];
+    if (typeof value === 'string' && value.trim()) {
+        return value.trim();
+    }
+    return null;
+}
+
+export function getWekoLabelKey(schemaName: string): string {
+    return WEKO_LABEL_KEYS[schemaName] || 'default';
+}
diff --git a/lib/osf-components/addon/components/draft-registration-card/component.ts b/lib/osf-components/addon/components/draft-registration-card/component.ts
index 123aa63c8..27a8bf772 100644
--- a/lib/osf-components/addon/components/draft-registration-card/component.ts
+++ b/lib/osf-components/addon/components/draft-registration-card/component.ts
@@ -10,6 +10,7 @@ import MetadataNodeSchemaModel from 'ember-osf-web/models/metadata-node-schema';
 import Analytics from 'ember-osf-web/services/analytics';
 import { getMetadataDisplayTitle } from 'ember-osf-web/utils/metadata-title-field-priority';
 import pathJoin from 'ember-osf-web/utils/path-join';
+import { getWekoItemId, getWekoLabelKey, getWorkflowRunId } from 'ember-osf-web/utils/weko-item';
 
 import styles from './styles';
 import template from './template';
@@ -64,23 +65,26 @@ export default class DraftRegistrationCard extends Component {
 
     @computed('draftRegistration.registrationResponses')
     get wekoItemId(): string | null {
-        const { draftRegistration } = this;
-        if (!draftRegistration) {
-            return null;
-        }
-        const { registrationResponses: responses } = draftRegistration;
-        if (!responses || typeof responses !== 'object') {
-            return null;
-        }
-        const wekoIdKey = 'internal:weko-item-id';
-        const prefixedWekoIdKey = `__responseKey_${wekoIdKey}`;
-        const wekoIdValue = responses[wekoIdKey] || responses[prefixedWekoIdKey];
+        return getWekoItemId(this.draftRegistration?.registrationResponses);
+    }
 
-        if (wekoIdValue && typeof wekoIdValue === 'string' && wekoIdValue.trim()) {
-            return wekoIdValue.trim();
-        }
+    @computed('draftRegistration.registrationSchema.name')
+    get wekoLabelKey(): string {
+        return getWekoLabelKey(this.draftRegistration.registrationSchema.get('name'));
+    }
+
+    @computed('draftRegistration.registrationResponses')
+    get workflowRunId(): string | null {
+        return getWorkflowRunId(this.draftRegistration?.registrationResponses);
+    }
 
-        return null;
+    @computed('draftRegistration.branchedFrom')
+    get workflowUrl(): string | null {
+        if (!this.workflowRunId) {
+            return null;
+        }
+        const node = this.draftRegistration.get('branchedFrom');
+        return pathJoin(baseURL, node.get('id'), 'workflow');
     }
 
     @action
diff --git a/lib/osf-components/addon/components/draft-registration-card/template.hbs b/lib/osf-components/addon/components/draft-registration-card/template.hbs
index 06c34ff44..f64e6b00f 100644
--- a/lib/osf-components/addon/components/draft-registration-card/template.hbs
+++ b/lib/osf-components/addon/components/draft-registration-card/template.hbs
@@ -24,9 +24,16 @@
     <section local-class='DraftRegistrationCard__body' data-test-draft-registration-card-body>
         {{#if this.draftRegistration}}
             <small>
+                {{#if this.workflowRunId}}
+                    <p data-test-workflow-run-id>
+                        <a href={{this.workflowUrl}}>
+                            <strong>{{t 'osf-components.draft-registration-card.workflow_submitted'}}</strong>
+                        </a>
+                    </p>
+                {{/if}}
                 {{#if this.wekoItemId}}
                     <p data-test-weko-item-id>
-                        <strong>{{t 'osf-components.draft-registration-card.weko_id' weko_id=this.wekoItemId}}</strong>
+                        <strong>{{t (concat 'osf-components.draft-registration-card.weko_id.' this.wekoLabelKey) weko_id=this.wekoItemId}}</strong>
                     </p>
                 {{/if}}
                 <p data-test-initiated-by>
diff --git a/lib/registries/addon/drafts/draft/-components/register/component.ts b/lib/registries/addon/drafts/draft/-components/register/component.ts
index 2df4b3a23..803d8bf73 100644
--- a/lib/registries/addon/drafts/draft/-components/register/component.ts
+++ b/lib/registries/addon/drafts/draft/-components/register/component.ts
@@ -14,6 +14,7 @@ import MetadataNodeSchemaModel from 'ember-osf-web/models/metadata-node-schema';
 import NodeModel from 'ember-osf-web/models/node';
 import Registration from 'ember-osf-web/models/registration';
 import pathJoin from 'ember-osf-web/utils/path-join';
+import { getWekoItemId, getWekoLabelKey } from 'ember-osf-web/utils/weko-item';
 import DraftRegistrationManager from 'registries/drafts/draft/draft-registration-manager';
 
 const { OSF: { url: baseURL } } = config;
@@ -84,23 +85,12 @@ export default class Register extends Component.extend({
 
     @computed('draftRegistration.registrationResponses')
     get wekoItemId(): string | null {
-        const { draftRegistration } = this;
-        if (!draftRegistration) {
-            return null;
-        }
-        const { registrationResponses: responses } = draftRegistration;
-        if (!responses || typeof responses !== 'object') {
-            return null;
-        }
-        const wekoIdKey = 'internal:weko-item-id';
-        const prefixedWekoIdKey = `__responseKey_${wekoIdKey}`;
-        const wekoIdValue = responses[wekoIdKey] || responses[prefixedWekoIdKey];
-
-        if (wekoIdValue && typeof wekoIdValue === 'string' && wekoIdValue.trim()) {
-            return wekoIdValue.trim();
-        }
+        return getWekoItemId(this.draftRegistration?.registrationResponses);
+    }
 
-        return null;
+    @computed('draftRegistration.registrationSchema.name')
+    get wekoLabelKey(): string {
+        return getWekoLabelKey(this.draftRegistration.registrationSchema.get('name'));
     }
 
     @computed('showMobileView')
diff --git a/lib/registries/addon/drafts/draft/-components/register/template.hbs b/lib/registries/addon/drafts/draft/-components/register/template.hbs
index ba72dbce5..9341e186b 100644
--- a/lib/registries/addon/drafts/draft/-components/register/template.hbs
+++ b/lib/registries/addon/drafts/draft/-components/register/template.hbs
@@ -13,7 +13,7 @@
     />
     {{#if this.wekoItemId}}
         <p data-test-weko-item-id local-class='WekoIdLabel'>
-            {{t 'registries.drafts.draft.weko_id' weko_id=this.wekoItemId htmlSafe=true}}
+            {{t (concat 'registries.drafts.draft.weko_id.' this.wekoLabelKey) weko_id=this.wekoItemId htmlSafe=true}}
         </p>
     {{/if}}
     <a
diff --git a/translations/en-us.yml b/translations/en-us.yml
index a70829bd0..089ceb330 100644
--- a/translations/en-us.yml
+++ b/translations/en-us.yml
@@ -1046,7 +1046,9 @@ registries:
                 toggle_dropdown: 'Toggle navigation dropdown'
             register: Register
             submit_error: 'Unable to create a registration.'
-            weko_id: '<strong>Registered</strong>: Mebyo DB Catalog<br>ID:{weko_id}'
+            weko_id:
+                mebyo: '<strong>Registered</strong>: Mebyo DB Catalog<br>ID:{weko_id}'
+                default: '<strong>Registered</strong>: JAIRO Cloud<br>ID:{weko_id}'
     index:
         lead: 'The <span class="f-w-lg">open</span> registries network'
         see_example: 'See an example'
@@ -1388,7 +1390,10 @@ osf-components:
         form_type: 'Form:'
         started: 'Started:'
         last_updated: 'Last updated:'
-        weko_id: 'Registered: Mebyo DB Catalog (ID:{weko_id})'
+        workflow_submitted: 'Submitted'
+        weko_id:
+            mebyo: 'Registered: Mebyo DB Catalog (ID:{weko_id})'
+            default: 'Registered: JAIRO Cloud (ID:{weko_id})'
         review: Review
         delete_draft_confirm: 'Are you sure you want to delete this project metadata?'
     copyable-text:
@@ -2089,3 +2094,5 @@ workflow:
                     noRecordsPrefix: 'No file metadata has been registered. You can edit file metadata on the project page and register it in this form'
                     path: 'Path'
                     manager: 'Manager'
+                exportTarget:
+                    loading: 'Loading export targets...'
diff --git a/translations/ja.yml b/translations/ja.yml
index 80c71ff7d..b22f4f81b 100644
--- a/translations/ja.yml
+++ b/translations/ja.yml
@@ -1046,7 +1046,9 @@ registries:
                 toggle_dropdown: 'Toggle navigation dropdown'
             register: 登録
             submit_error: 'Unable to create a registration.'
-            weko_id: '<strong>登録済</strong>:未病DBカタログ<br>ID:{weko_id}'
+            weko_id:
+                mebyo: '<strong>登録済</strong>:未病DBカタログ<br>ID:{weko_id}'
+                default: '<strong>登録済</strong>:JAIRO Cloud<br>ID:{weko_id}'
     index:
         lead: '<span class="f-w-lg">オープン</span> レジストリネットワーク'
         see_example: 例を見る
@@ -1388,7 +1390,10 @@ osf-components:
         form_type: '様式:'
         started: '開始日:'
         last_updated: '最終更新日:'
-        weko_id : '登録済：未病DBカタログ (ID:{weko_id})'
+        workflow_submitted: 申請済み
+        weko_id:
+            mebyo: '登録済：未病DBカタログ (ID:{weko_id})'
+            default: '登録済：JAIRO Cloud (ID:{weko_id})'
         review: 内容確認
         delete_draft_confirm: このプロジェクトメタデータを削除してもよろしいですか？
     copyable-text:
@@ -2089,3 +2094,5 @@ workflow:
                     noRecordsPrefix: ファイルメタデータは登録されていません。プロジェクトページでファイルのメタデータを編集し、このフォームに登録することができます
                     path: パス
                     manager: 管理者
+                exportTarget:
+                    loading: エクスポート先を読み込み中...

From 7e40e53d2a35dc2eb1212400faf2f569090c6c7b Mon Sep 17 00:00:00 2001
From: yacchin1205 <968739+yacchin1205@users.noreply.github.com>
Date: Mon, 9 Mar 2026 14:05:21 +0900
Subject: [PATCH 2/7] Add metadata UI enhancements: schema ui hints, width
 support, and suggestion typeahead

---
 app/guid-node/metadata/template.hbs           |   4 +-
 app/guid-node/registrations/template.hbs      |   4 +-
 app/models/registration-schema.ts             |  32 ++++
 app/models/schema-block.ts                    |   2 +
 .../registration-schema/schema-block.ts       |   6 +
 app/packages/registration-schema/ui-group.ts  | 103 +++++++++++++
 app/utils/suggestion-api.ts                   | 135 +++++++++++++++++
 .../draft-registration-card/template.hbs      |   2 +-
 .../addon/components/node-card/template.hbs   |   2 +-
 .../registries/page-renderer/component.ts     |  23 +++
 .../registries/page-renderer/styles.scss      |   1 +
 .../registries/page-renderer/template.hbs     |  30 ++--
 .../schema-block-group-renderer/component.ts  |   7 +
 .../schema-block-group-renderer/template.hbs  |   2 +
 .../schema-block-renderer/component.ts        |  32 ++++
 .../editable/base/styles.scss                 |  15 ++
 .../editable/rdm/array-input/component.ts     |  12 +-
 .../editable/rdm/array-input/styles.scss      |   4 +
 .../editable/rdm/array-input/template.hbs     |  33 ++---
 .../singleselect-pulldown-input/component.ts  |  21 ++-
 .../singleselect-pulldown-input/styles.scss   |   4 +
 .../editable/text/component.ts                | 137 +++++++++++++++++-
 .../editable/text/styles.scss                 |  36 +++++
 .../editable/text/template.hbs                |  65 ++++++---
 .../editable/textarea/styles.scss             |   2 +-
 .../label/label-content/component.ts          |   7 +-
 .../label/label-content/styles.scss           |   4 +
 .../label/label-content/template.hbs          |   2 +-
 .../schema-block-renderer/label/template.hbs  |   2 +
 .../section-heading/template.hbs              |   7 +-
 .../schema-block-renderer/styles.scss         |   2 +-
 .../schema-block-renderer/template.hbs        |  16 +-
 .../registries/ui-visual-items/component.ts   |  15 ++
 .../registries/ui-visual-items/styles.scss    |  13 ++
 .../registries/ui-visual-items/template.hbs   |  18 +++
 .../registries/ui-visual-items/component.js   |   1 +
 .../registries-metadata/template.hbs          |   2 +-
 translations/en-us.yml                        |   4 +-
 translations/ja.yml                           |   4 +-
 39 files changed, 720 insertions(+), 91 deletions(-)
 create mode 100644 app/packages/registration-schema/ui-group.ts
 create mode 100644 app/utils/suggestion-api.ts
 create mode 100644 lib/osf-components/addon/components/registries/ui-visual-items/component.ts
 create mode 100644 lib/osf-components/addon/components/registries/ui-visual-items/styles.scss
 create mode 100644 lib/osf-components/addon/components/registries/ui-visual-items/template.hbs
 create mode 100644 lib/osf-components/app/components/registries/ui-visual-items/component.js

diff --git a/app/guid-node/metadata/template.hbs b/app/guid-node/metadata/template.hbs
index 1d9f3eaf4..515356713 100644
--- a/app/guid-node/metadata/template.hbs
+++ b/app/guid-node/metadata/template.hbs
@@ -91,11 +91,11 @@
                                                 @changed={{action this.schemaChanged}}
                                             >
                                                 <div>
-                                                    {{schema.name}}
+                                                    {{schema.localizedName}}
                                                     <span>
                                                         {{fa-icon 'info-circle'}}
                                                         <BsTooltip>
-                                                            {{schema.schema.description}}
+                                                            {{schema.localizedDescription}}
                                                         </BsTooltip>
                                                     </span>
                                                 </div>
diff --git a/app/guid-node/registrations/template.hbs b/app/guid-node/registrations/template.hbs
index 906d3459c..0c8a88c06 100644
--- a/app/guid-node/registrations/template.hbs
+++ b/app/guid-node/registrations/template.hbs
@@ -121,11 +121,11 @@
                                                 @changed={{action this.schemaChanged}}
                                             >
                                                 <div>
-                                                    {{schema.name}}
+                                                    {{schema.localizedName}}
                                                     <span>
                                                         {{fa-icon 'info-circle'}}
                                                         <BsTooltip>
-                                                            {{schema.schema.description}}
+                                                            {{schema.localizedDescription}}
                                                         </BsTooltip>
                                                     </span>
                                                 </div>
diff --git a/app/models/registration-schema.ts b/app/models/registration-schema.ts
index c264e3c09..d57ec688f 100644
--- a/app/models/registration-schema.ts
+++ b/app/models/registration-schema.ts
@@ -1,4 +1,7 @@
+import { computed } from '@ember/object';
+import { inject as service } from '@ember/service';
 import DS from 'ember-data';
+import Intl from 'ember-intl/services/intl';
 
 import OsfModel from './osf-model';
 import SchemaBlock from './schema-block';
@@ -34,6 +37,11 @@ export interface Page {
     clipboardCopyPaste: boolean;
 }
 
+export interface SchemaUI {
+    label?: string;
+    description?: string;
+}
+
 export interface Schema {
     name: string;
     title: string;
@@ -42,6 +50,7 @@ export interface Schema {
     config: {
         hasFiles: boolean;
     };
+    ui?: SchemaUI;
     pages: Page[];
     description: string;
 }
@@ -57,6 +66,8 @@ export interface RegistrationMetadata {
 }
 
 export default class RegistrationSchemaModel extends OsfModel {
+    @service intl!: Intl;
+
     @attr('boolean') active!: boolean;
     @attr('fixstring') name!: string;
     @attr('number') schemaVersion!: number;
@@ -64,6 +75,27 @@ export default class RegistrationSchemaModel extends OsfModel {
 
     @hasMany('schema-block', { inverse: 'schema', async: false })
     schemaBlocks?: SchemaBlock[];
+
+    @computed('schema.ui.label', 'name')
+    get localizedName(): string {
+        return this.localizeText(this.schema.ui && this.schema.ui.label) || this.name;
+    }
+
+    @computed('schema.ui.description', 'schema.description')
+    get localizedDescription(): string {
+        return this.localizeText(this.schema.ui && this.schema.ui.description) || this.schema.description;
+    }
+
+    private localizeText(text?: string): string | undefined {
+        if (!text) {
+            return undefined;
+        }
+        if (!text.includes('|')) {
+            return text;
+        }
+        const texts = text.split('|');
+        return this.intl.locale.includes('ja') ? texts[0] : texts[1];
+    }
 }
 
 declare module 'ember-data/types/registries/model' {
diff --git a/app/models/schema-block.ts b/app/models/schema-block.ts
index 345760919..ee910f5e5 100644
--- a/app/models/schema-block.ts
+++ b/app/models/schema-block.ts
@@ -32,6 +32,8 @@ export default class SchemaBlockModel extends OsfModel implements SchemaBlock {
     @attr('boolean') readonly?: boolean;
     @attr('boolean') sentence?: boolean;
     @attr('string') rowAdditionCaption?: string;
+    @attr('string') suggestion?: string;
+    @attr() ui?: SchemaBlock['ui'];
 
     @belongsTo('registration-schema', { inverse: 'schemaBlocks', async: false })
     schema?: RegistrationSchemaModel;
diff --git a/app/packages/registration-schema/schema-block.ts b/app/packages/registration-schema/schema-block.ts
index bc872547c..60e22b1a0 100644
--- a/app/packages/registration-schema/schema-block.ts
+++ b/app/packages/registration-schema/schema-block.ts
@@ -55,4 +55,10 @@ export interface SchemaBlock {
     retrievalVersion?: string;
     readonly?: boolean;
     rowAdditionCaption?: string;
+    suggestion?: string;
+    ui?: {
+        group?: string | { id: string; title?: string; bar?: boolean; tags?: string[]; help?: string; info?: string; parent?: string | { id: string; title?: string } };
+        sub_label?: string;
+        item?: { placeholder?: string; width?: string; widget?: string; enabled_if?: object; info?: string; tags?: string[]; freetext?: boolean };
+    };
 }
diff --git a/app/packages/registration-schema/ui-group.ts b/app/packages/registration-schema/ui-group.ts
new file mode 100644
index 000000000..45547f57f
--- /dev/null
+++ b/app/packages/registration-schema/ui-group.ts
@@ -0,0 +1,103 @@
+import { SchemaBlock, SchemaBlockGroup } from 'ember-osf-web/packages/registration-schema';
+
+// TODO: condition evaluation is not implemented on the Ember side.
+// This only returns the unconditional entry; conditional UI switching
+// (e.g. based on grdm-file:file-type) requires sift or equivalent.
+// See metadata-fields.js resolveUI() for the full implementation.
+function resolveUI(ui: SchemaBlock['ui']): Record<string, any> | undefined {
+    if (!ui) {
+        return undefined;
+    }
+    if (!Array.isArray(ui)) {
+        return ui;
+    }
+    return ui.find((entry: any) => !entry.condition);
+}
+
+export interface UiGroupDef {
+    id: string;
+    title?: string;
+    bar?: boolean;
+    tags?: string[];
+    help?: string;
+    info?: string;
+    parent?: string;
+}
+
+export interface VisualItem {
+    schemaBlockGroup?: SchemaBlockGroup;
+    uiGroup?: UiGroupDef & { localizedTitle?: string };
+    children?: VisualItem[];
+}
+
+export function buildVisualItems(
+    groups: SchemaBlockGroup[],
+    localizeText: (text: string) => string,
+): VisualItem[] {
+    const root: VisualItem[] = [];
+    const groupDefs: { [id: string]: UiGroupDef } = {};
+    const groupItems: { [id: string]: VisualItem } = {};
+
+    function ensureGroup(id: string): VisualItem {
+        if (groupItems[id]) {
+            return groupItems[id];
+        }
+        const def = groupDefs[id];
+        const item: VisualItem = {
+            uiGroup: {
+                ...def,
+                localizedTitle: def.title ? localizeText(def.title) : undefined,
+            },
+            children: [],
+        };
+        groupItems[id] = item;
+        if (def.parent) {
+            ensureGroup(def.parent).children!.push(item);
+        } else {
+            root.push(item);
+        }
+        return item;
+    }
+
+    for (const group of groups) {
+        const inputBlock = group.inputBlock;
+        if (group.registrationResponseKey && group.registrationResponseKey.match(/^__responseKey_grdm-file:.+$/)) {
+            root.push({ schemaBlockGroup: group });
+            continue;
+        }
+        const ui = resolveUI(inputBlock && inputBlock.ui);
+        if (!ui || !ui.group) {
+            root.push({ schemaBlockGroup: group });
+            continue;
+        }
+        const groupRef = ui.group;
+        const groupDef = typeof groupRef === 'object' ? groupRef : null;
+        const groupId = groupDef ? groupDef.id : groupRef as string;
+
+        if (groupDef) {
+            let parentId: string | undefined;
+            if (groupDef.parent) {
+                if (typeof groupDef.parent === 'object') {
+                    const parentObj = groupDef.parent as UiGroupDef;
+                    groupDefs[parentObj.id] = parentObj;
+                    parentId = parentObj.id;
+                } else {
+                    parentId = groupDef.parent as string;
+                }
+            }
+            groupDefs[groupId] = {
+                id: groupDef.id,
+                title: groupDef.title,
+                bar: groupDef.bar,
+                tags: groupDef.tags,
+                help: groupDef.help,
+                info: groupDef.info,
+                parent: parentId,
+            };
+        }
+
+        ensureGroup(groupId).children!.push({ schemaBlockGroup: group });
+    }
+
+    return root;
+}
diff --git a/app/utils/suggestion-api.ts b/app/utils/suggestion-api.ts
new file mode 100644
index 000000000..ddd4b2f13
--- /dev/null
+++ b/app/utils/suggestion-api.ts
@@ -0,0 +1,135 @@
+import config from 'ember-get-config';
+import { ChangesetDef } from 'ember-changeset/types';
+import { SchemaBlock } from 'ember-osf-web/packages/registration-schema';
+import { PageManager } from 'ember-osf-web/packages/registration-schema/page-manager';
+
+const {
+    OSF: {
+        url: host,
+        webApiNamespace: namespace,
+    },
+} = config;
+
+export interface SuggestionConfig {
+    key: string;
+    template?: string;
+    button?: string;
+    valueField?: string;
+    autofill?: { [fieldId: string]: string };
+}
+
+export interface SuggestionResult {
+    key: string;
+    value: { [field: string]: any };
+}
+
+export async function fetchSuggestions(
+    nodeId: string,
+    keys: string[],
+    keyword: string,
+): Promise<SuggestionResult[]> {
+    const baseUrl = `${host.replace(/\/+$/, '')}/${namespace}/project/${nodeId}/metadata/suggestions`;
+    const params = new URLSearchParams();
+    for (const key of keys) {
+        params.append('key[]', key);
+    }
+    params.append('keyword', keyword);
+    const response = await fetch(`${baseUrl}?${params.toString()}`, {
+        credentials: 'same-origin',
+    });
+    if (!response.ok) {
+        throw new Error(`Suggestion API error: ${response.status}`);
+    }
+    const json = await response.json();
+    return json.data.attributes.suggestions;
+}
+
+/**
+ * Resolve the changeset key for a sibling field given the current field's key.
+ *
+ * Page level:  __responseKey_japan-grant-number → __responseKey_funder
+ * Array row:   __responseKey_additional-funding|japan-grant-number → __responseKey_additional-funding|funder
+ */
+export function resolveAutofillKey(currentResponseKey: string, targetFieldId: string): string {
+    const pipeIndex = currentResponseKey.lastIndexOf('|');
+    if (pipeIndex >= 0) {
+        return currentResponseKey.substring(0, pipeIndex + 1) + targetFieldId;
+    }
+    return '__responseKey_' + targetFieldId;
+}
+
+/**
+ * Extract the code from a tooltip string (3rd pipe-delimited segment).
+ * e.g. "日本語名|English name|1020" → "1020"
+ */
+function getTooltipCode(helpText: string): string | undefined {
+    const parts = helpText.split('|');
+    if (parts.length < 3) {
+        return undefined;
+    }
+    return parts[2].trim();
+}
+
+/**
+ * Find optionBlocks for a given field ID by searching all schemaBlockGroups.
+ * Options are shared across page-level and array-level for the same field,
+ * so finding any match is sufficient.
+ */
+function findOptionBlocks(pageManagers: PageManager[], fieldId: string): SchemaBlock[] | undefined {
+    const targetSuffix = `_${fieldId}`;
+    for (const pm of pageManagers) {
+        for (const group of pm.schemaBlockGroups || []) {
+            if (group.registrationResponseKey?.endsWith(targetSuffix) && group.optionBlocks && group.optionBlocks.length) {
+                return group.optionBlocks;
+            }
+            for (const child of group.children || []) {
+                if (child.registrationResponseKey?.endsWith(targetSuffix) && child.optionBlocks && child.optionBlocks.length) {
+                    return child.optionBlocks;
+                }
+            }
+        }
+    }
+    return undefined;
+}
+
+/**
+ * Resolve a value for a target field: if the field has options, match the value
+ * against option tooltip codes and return the option text. Otherwise return as-is.
+ */
+function resolveValueForField(pageManagers: PageManager[], fieldId: string, value: string): string {
+    const optionBlocks = findOptionBlocks(pageManagers, fieldId);
+    if (!optionBlocks || !optionBlocks.length) {
+        return value;
+    }
+    for (const opt of optionBlocks) {
+        if (opt.helpText && getTooltipCode(opt.helpText) === value) {
+            return opt.displayText!;
+        }
+    }
+    // No tooltip match — use value directly (option text may equal the code, or free text)
+    return value;
+}
+
+/**
+ * Apply autofill mappings from a selected suggestion to sibling fields.
+ * For select fields, resolves codes to option text via tooltip matching.
+ */
+export function applyAutofill(
+    changeset: ChangesetDef,
+    currentResponseKey: string,
+    autofillMap: { [fieldId: string]: string },
+    selectedValue: { [field: string]: any },
+    pageManagers: PageManager[],
+    onInput: () => void,
+): void {
+    for (const [fieldId, responseField] of Object.entries(autofillMap)) {
+        const rawValue = selectedValue[responseField];
+        if (rawValue == null) {
+            continue;
+        }
+        const value = resolveValueForField(pageManagers, fieldId, String(rawValue));
+        const targetKey = resolveAutofillKey(currentResponseKey, fieldId);
+        changeset.set(targetKey, value);
+    }
+    onInput();
+}
diff --git a/lib/osf-components/addon/components/draft-registration-card/template.hbs b/lib/osf-components/addon/components/draft-registration-card/template.hbs
index f64e6b00f..21878856c 100644
--- a/lib/osf-components/addon/components/draft-registration-card/template.hbs
+++ b/lib/osf-components/addon/components/draft-registration-card/template.hbs
@@ -42,7 +42,7 @@
                 </p>
                 <p data-test-form-type>
                     {{t 'osf-components.draft-registration-card.form_type'}}
-                    {{this.draftRegistration.registrationSchema.name}}
+                    {{this.draftRegistration.registrationSchema.localizedName}}
                 </p>
                 <p data-test-time-initiated>
                     {{t 'osf-components.draft-registration-card.started'}}
diff --git a/lib/osf-components/addon/components/node-card/template.hbs b/lib/osf-components/addon/components/node-card/template.hbs
index eef68cfe6..27025efa4 100644
--- a/lib/osf-components/addon/components/node-card/template.hbs
+++ b/lib/osf-components/addon/components/node-card/template.hbs
@@ -113,7 +113,7 @@
                     </div>
                 {{/if}}
                 <div local-class='NodeCard__schema-name'>
-                    {{@node.registrationSchema.name}}
+                    {{@node.registrationSchema.localizedName}}
                 </div>
             {{/if}}
             <div local-class='NodeCard__authors'>
diff --git a/lib/osf-components/addon/components/registries/page-renderer/component.ts b/lib/osf-components/addon/components/registries/page-renderer/component.ts
index 004d23717..c20d3b70b 100644
--- a/lib/osf-components/addon/components/registries/page-renderer/component.ts
+++ b/lib/osf-components/addon/components/registries/page-renderer/component.ts
@@ -4,8 +4,12 @@ import { tagName } from '@ember-decorators/component';
 import { layout } from 'ember-osf-web/decorators/component';
 
 import { assert } from '@ember/debug';
+import { computed } from '@ember/object';
+import { inject as service } from '@ember/service';
+import Intl from 'ember-intl/services/intl';
 import NodeModel from 'ember-osf-web/models/node';
 import { PageManager } from 'ember-osf-web/packages/registration-schema/page-manager';
+import { buildVisualItems, VisualItem } from 'ember-osf-web/packages/registration-schema/ui-group';
 import DraftRegistrationManager from 'registries/drafts/draft/draft-registration-manager';
 import styles from './styles';
 import template from './template';
@@ -13,6 +17,8 @@ import template from './template';
 @layout(template, styles)
 @tagName('')
 export default class PageRenderer extends Component {
+    @service intl!: Intl;
+
     // Required param
     pageManager!: PageManager;
     draftManager!: DraftRegistrationManager;
@@ -23,4 +29,21 @@ export default class PageRenderer extends Component {
         assert('A pageManger is needed for page-renderer', Boolean(this.pageManager));
         assert('A draftManager is needed for page-renderer', Boolean(this.draftManager));
     }
+
+    @computed('pageManager.schemaBlockGroups')
+    get visualItems(): VisualItem[] {
+        const groups = this.pageManager.schemaBlockGroups;
+        if (!groups) {
+            return [];
+        }
+        return buildVisualItems(groups, text => this.localizeText(text));
+    }
+
+    localizeText(text: string): string {
+        if (!text.includes('|')) {
+            return text;
+        }
+        const parts = text.split('|');
+        return this.intl.locale.includes('ja') ? parts[0] : parts[1];
+    }
 }
diff --git a/lib/osf-components/addon/components/registries/page-renderer/styles.scss b/lib/osf-components/addon/components/registries/page-renderer/styles.scss
index e69de29bb..8b1378917 100644
--- a/lib/osf-components/addon/components/registries/page-renderer/styles.scss
+++ b/lib/osf-components/addon/components/registries/page-renderer/styles.scss
@@ -0,0 +1 @@
+
diff --git a/lib/osf-components/addon/components/registries/page-renderer/template.hbs b/lib/osf-components/addon/components/registries/page-renderer/template.hbs
index d4cb78540..e6a95e134 100644
--- a/lib/osf-components/addon/components/registries/page-renderer/template.hbs
+++ b/lib/osf-components/addon/components/registries/page-renderer/template.hbs
@@ -1,17 +1,15 @@
-{{#each @pageManager.schemaBlockGroups as |group|}}
-    <Registries::SchemaBlockGroupRenderer
-        @schemaBlockGroup={{group}}
-        @renderStrategy={{
-            component 'registries/schema-block-renderer/editable/mapper'
-                changeset=this.pageManager.changeset
-                node=@node
-                onInput=@onInput
-                metadataChangeset=this.draftManager.metadataChangeset
-                metadataNodeErad=this.draftManager.metadataNodeErad
-                metadataNodeProject=this.draftManager.metadataNodeProject
-                onMetadataInput=@onMetadataInput
-                draftManager=this.draftManager
-                schemaBlockGroup=group
-        }}
+{{#let (component 'registries/schema-block-renderer/editable/mapper'
+    changeset=this.pageManager.changeset
+    node=@node
+    onInput=@onInput
+    metadataChangeset=this.draftManager.metadataChangeset
+    metadataNodeErad=this.draftManager.metadataNodeErad
+    metadataNodeProject=this.draftManager.metadataNodeProject
+    onMetadataInput=@onMetadataInput
+    draftManager=this.draftManager
+) as |baseStrategy|}}
+    <Registries::UiVisualItems
+        @items={{this.visualItems}}
+        @baseStrategy={{baseStrategy}}
     />
-{{/each}}
+{{/let}}
diff --git a/lib/osf-components/addon/components/registries/schema-block-group-renderer/component.ts b/lib/osf-components/addon/components/registries/schema-block-group-renderer/component.ts
index 09d76ef3c..656d88db3 100644
--- a/lib/osf-components/addon/components/registries/schema-block-group-renderer/component.ts
+++ b/lib/osf-components/addon/components/registries/schema-block-group-renderer/component.ts
@@ -54,6 +54,13 @@ export default class SchemaBlockGroupRenderer extends Component {
             );
     }
 
+    @computed('schemaBlockGroup.inputBlock.ui')
+    get uiSubLabel(): string | undefined {
+        const inputBlock = this.schemaBlockGroup.inputBlock;
+        const ui = inputBlock && inputBlock.ui;
+        return ui && ui.sub_label;
+    }
+
     @computed('schemaBlockGroup.groupType')
     get isFieldsetGroup(): boolean {
         return (
diff --git a/lib/osf-components/addon/components/registries/schema-block-group-renderer/template.hbs b/lib/osf-components/addon/components/registries/schema-block-group-renderer/template.hbs
index ab80ce063..6af4583b0 100644
--- a/lib/osf-components/addon/components/registries/schema-block-group-renderer/template.hbs
+++ b/lib/osf-components/addon/components/registries/schema-block-group-renderer/template.hbs
@@ -8,6 +8,7 @@
                 @renderStrategy={{@renderStrategy}}
                 @isRequired={{this.isRequired}}
                 @isFieldsetGroup={{true}}
+                @uiSubLabel={{this.uiSubLabel}}
             />
         {{/each}}
     </fieldset>
@@ -20,6 +21,7 @@
             @renderStrategy={{@renderStrategy}}
             @isRequired={{this.isRequired}}
             @isFieldsetGroup={{false}}
+            @uiSubLabel={{this.uiSubLabel}}
         />
     {{/each}}
 {{/if}}
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/component.ts b/lib/osf-components/addon/components/registries/schema-block-renderer/component.ts
index ea559143d..40a7ae11a 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/component.ts
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/component.ts
@@ -1,6 +1,8 @@
 import { tagName } from '@ember-decorators/component';
 import Component from '@ember/component';
 import { assert } from '@ember/debug';
+import { computed } from '@ember/object';
+import { htmlSafe } from '@ember/string';
 
 import { layout } from 'ember-osf-web/decorators/component';
 import SchemaBlock from 'ember-osf-web/models/schema-block';
@@ -8,6 +10,19 @@ import defaultTo from 'ember-osf-web/utils/default-to';
 
 import template from './template';
 
+const widthMap: Record<string, string> = {
+    narrow: '200px',
+    half: '50%',
+};
+
+const labelBlockTypes = new Set([
+    'page-heading',
+    'section-heading',
+    'subsection-heading',
+    'paragraph',
+    'question-label',
+]);
+
 @layout(template)
 @tagName('')
 export default class SchemaBlockRenderer extends Component {
@@ -19,6 +34,23 @@ export default class SchemaBlockRenderer extends Component {
     disabled: boolean = defaultTo(this.disabled, false);
     shouldShowMessages: boolean = defaultTo(this.shouldShowMessages, true);
 
+    @computed('schemaBlock.blockType')
+    get isLabelBlock(): boolean {
+        return labelBlockTypes.has(this.schemaBlock.blockType!);
+    }
+
+    @computed('schemaBlock.ui')
+    get uiItemStyle(): ReturnType<typeof htmlSafe> | undefined {
+        const ui = this.schemaBlock.ui;
+        if (!ui || !ui.item || !ui.item.width) {
+            return undefined;
+        }
+        const maxW = widthMap[ui.item.width];
+        assert(`Unknown ui.item.width: "${ui.item.width}"`, Boolean(maxW));
+        const minW = ui.item.width === 'half' ? ';min-width:300px' : '';
+        return htmlSafe(`max-width:${maxW}${minW}`);
+    }
+
     didReceiveAttrs() {
         assert('schema-block-renderer requires a schemaBlock to render', Boolean(this.schemaBlock));
         assert('schema-block-renderer requires a renderStrategy to render', Boolean(this.renderStrategy));
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/base/styles.scss b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/base/styles.scss
index 58f0cd648..a5da584d8 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/base/styles.scss
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/base/styles.scss
@@ -18,4 +18,19 @@
 
 .input-box {
     flex: auto;
+
+    :global(.form-control) {
+        background-color: #f2f6fa;
+        border-color: #cad9e6;
+    }
+
+    :global(.ember-power-select-trigger) {
+        background-color: #f2f6fa;
+        border-color: #cad9e6;
+        padding: 6px;
+    }
+
+    :global(input[type='radio']) {
+        accent-color: #3779b3;
+    }
 }
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/component.ts b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/component.ts
index e151ca58b..ce7c39d8a 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/component.ts
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/component.ts
@@ -2,7 +2,7 @@ import { tagName } from '@ember-decorators/component';
 import Component from '@ember/component';
 
 import { assert } from '@ember/debug';
-import { action } from '@ember/object';
+import { action, computed } from '@ember/object';
 import { alias } from '@ember/object/computed';
 import { inject as service } from '@ember/service';
 
@@ -13,6 +13,7 @@ import Intl from 'ember-intl/services/intl';
 import { layout } from 'ember-osf-web/decorators/component';
 import NodeModel from 'ember-osf-web/models/node';
 import { buildValidation, SchemaBlock, SchemaBlockGroup } from 'ember-osf-web/packages/registration-schema';
+import { buildVisualItems, VisualItem } from 'ember-osf-web/packages/registration-schema/ui-group';
 import DraftRegistrationManager from 'registries/drafts/draft/draft-registration-manager';
 
 import styles from './styles';
@@ -109,6 +110,15 @@ export default class ArrayInput extends Component {
         this.save(newSubChangesets);
     }
 
+    @computed('schemaBlockGroup.children')
+    get visualItems(): VisualItem[] {
+        const children = this.schemaBlockGroup.children;
+        if (!children) {
+            return [];
+        }
+        return buildVisualItems(children, text => this.getLocalizedText(text));
+    }
+
     getLocalizedText(text: string) {
         if (!text.includes('|')) {
             return text;
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/styles.scss b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/styles.scss
index 262647a3d..d7496b2ed 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/styles.scss
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/styles.scss
@@ -8,3 +8,7 @@
 .array-input-remove-button {
     margin-top: 20px;
 }
+
+.array-input-add-button:first-child {
+    margin-top: 10px;
+}
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/template.hbs b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/template.hbs
index 6c41fd193..50dc73293 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/template.hbs
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/template.hbs
@@ -2,24 +2,21 @@
 
     {{#each this.subChangesets as |subChangeset|}}
         <div local-class='array-input-item-container'>
-            {{#each @schemaBlockGroup.children as |group|}}
-                <Registries::SchemaBlockGroupRenderer
-                    @schemaBlockGroup={{group}}
-                    @renderStrategy={{
-                        component
-                        'registries/schema-block-renderer/editable/mapper'
-                        changeset=subChangeset
-                        node=@node
-                        onInput=@onInput
-                        metadataChangeset=this.draftManager.metadataChangeset
-                        metadataNodeErad=this.draftManager.metadataNodeErad
-                        metadataNodeProject=this.draftManager.metadataNodeProject
-                        onMetadataInput=@onMetadataInput
-                        draftManager=this.draftManager
-                        schemaBlockGroup=group
-                    }}
+            {{#let (component 'registries/schema-block-renderer/editable/mapper'
+                changeset=subChangeset
+                node=@node
+                onInput=@onInput
+                metadataChangeset=this.draftManager.metadataChangeset
+                metadataNodeErad=this.draftManager.metadataNodeErad
+                metadataNodeProject=this.draftManager.metadataNodeProject
+                onMetadataInput=@onMetadataInput
+                draftManager=this.draftManager
+            ) as |baseStrategy|}}
+                <Registries::UiVisualItems
+                    @items={{this.visualItems}}
+                    @baseStrategy={{baseStrategy}}
                 />
-            {{/each}}
+            {{/let}}
             <OsfButton local-class='array-input-remove-button'
               @onClick={{action this.onRemove subChangeset}}
             >
@@ -35,4 +32,4 @@
         {{this.schemaBlock.rowAdditionCaption}}{{t 'metadata.array-input.add-item'}}
     </OsfButton>
 
-</Registries::SchemaBlockRenderer::Editable::Base>
\ No newline at end of file
+</Registries::SchemaBlockRenderer::Editable::Base>
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/singleselect-pulldown-input/component.ts b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/singleselect-pulldown-input/component.ts
index 6562416a5..ce64aa5de 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/singleselect-pulldown-input/component.ts
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/singleselect-pulldown-input/component.ts
@@ -20,6 +20,7 @@ export default class SingleSelectPulldownInput extends Component {
     // Required param
     optionBlocks!: SchemaBlock[];
     changeset!: ChangesetDef;
+    schemaBlock!: SchemaBlock;
 
     @alias('schemaBlock.registrationResponseKey')
     valuePath!: string;
@@ -35,6 +36,12 @@ export default class SingleSelectPulldownInput extends Component {
         );
     }
 
+    @computed('schemaBlock.ui')
+    get allowFreetext(): boolean {
+        const ui = this.schemaBlock.ui;
+        return Boolean(ui && ui.item && ui.item.freetext);
+    }
+
     @computed('optionBlocks.[]', 'anotherOption')
     get optionBlockValues() {
         const options = this.optionBlocks
@@ -47,8 +54,7 @@ export default class SingleSelectPulldownInput extends Component {
 
     @action
     onChange(option: string) {
-        const code = (option || '').trim();
-        const item = this.optionBlocks.find(b => code === b.displayText);
+        const item = this.optionBlocks.find(b => this.getLocalizedItemText(b) === option);
         const result = item ? item.displayText : option;
         this.changeset.set(this.valuePath, result);
         this.onMetadataInput();
@@ -58,18 +64,19 @@ export default class SingleSelectPulldownInput extends Component {
 
     @action
     onInputSearch(text: string) {
-        if (!this.optionBlocks.find(item => item.displayText === text || this.getLocalizedItemText(item) === text)) {
+        if (this.allowFreetext
+            && !this.optionBlocks.find(item => item.displayText === text || this.getLocalizedItemText(item) === text)) {
             this.set('anotherOption', text);
         }
         return true;
     }
 
     getLocalizedItemText(item: SchemaBlock) {
-        const text = item.helpText || item.displayText;
-        if (text === undefined) {
-            return item.displayText;
+        if (!item.helpText) {
+            return `${item.displayText}`;
         }
-        return `${item.displayText}`;
+        const label = this.getLocalizedText(item.helpText);
+        return `${label} | ${item.displayText}`;
     }
 
     getLocalizedText(text: string) {
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/singleselect-pulldown-input/styles.scss b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/singleselect-pulldown-input/styles.scss
index 462216f6a..971081c74 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/singleselect-pulldown-input/styles.scss
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/singleselect-pulldown-input/styles.scss
@@ -7,3 +7,7 @@
         box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
     }
 }
+
+:global(.ember-power-select-trigger) {
+    min-height: 40px !important;
+}
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/component.ts b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/component.ts
index b0e14d828..78beebbd2 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/component.ts
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/component.ts
@@ -1,11 +1,146 @@
 import { tagName } from '@ember-decorators/component';
 import Component from '@ember/component';
-
+import { action, computed } from '@ember/object';
+import { alias } from '@ember/object/computed';
+import { ChangesetDef } from 'ember-changeset/types';
 import { layout } from 'ember-osf-web/decorators/component';
+import NodeModel from 'ember-osf-web/models/node';
+import { SchemaBlock } from 'ember-osf-web/packages/registration-schema';
+import DraftRegistrationManager from 'registries/drafts/draft/draft-registration-manager';
+import {
+    applyAutofill,
+    fetchSuggestions,
+    SuggestionConfig,
+    SuggestionResult,
+} from 'ember-osf-web/utils/suggestion-api';
+import { htmlSafe } from '@ember/template';
+import { run } from '@ember/runloop';
+
 import styles from './styles';
 import template from './template';
 
+/**
+ * Render a suggestion template with variable substitution and strip HTML for plain text display.
+ */
+function renderTemplateAsText(tmpl: string, value: { [field: string]: any }): string {
+    const substituted = tmpl.replace(/\{\{(\w+)\}\}/g, (_match: string, field: string) => {
+        const v = value[field];
+        return v != null ? String(v) : '';
+    });
+    return substituted.replace(/<[^>]*>/g, ' ').replace(/\s+/g, ' ').trim();
+}
+
+function renderTemplateAsHtml(tmpl: string, value: { [field: string]: any }): any {
+    const rendered = tmpl.replace(/\{\{(\w+)\}\}/g, (_match: string, field: string) => {
+        const v = value[field];
+        return v != null ? String(v) : '';
+    });
+    return htmlSafe(rendered);
+}
+
 @layout(template, styles)
 @tagName('')
 export default class Text extends Component {
+    changeset!: ChangesetDef;
+    schemaBlock!: SchemaBlock;
+    node!: NodeModel;
+    draftManager!: DraftRegistrationManager;
+    onInput!: () => void;
+
+    @alias('schemaBlock.registrationResponseKey')
+    valuePath!: string;
+
+    suggestionResults: SuggestionResult[] = [];
+    showSuggestions: boolean = false;
+
+    @computed('schemaBlock.suggestion')
+    get suggestionConfig(): SuggestionConfig[] | null {
+        const raw = this.schemaBlock.suggestion;
+        if (!raw) {
+            return null;
+        }
+        return JSON.parse(raw);
+    }
+
+    @computed('schemaBlock.suggestion')
+    get hasSuggestion(): boolean {
+        const config = this.suggestionConfig;
+        return config !== null && config.some(s => Boolean(s.template));
+    }
+
+    /**
+     * Map from key string → { result, config } for selection lookup.
+     */
+    @computed('suggestionResults.[]')
+    get suggestionMap(): Map<string, { result: SuggestionResult; config: SuggestionConfig }> {
+        const configs = this.suggestionConfig!;
+        const map = new Map<string, { result: SuggestionResult; config: SuggestionConfig }>();
+        let idx = 0;
+        for (const result of this.suggestionResults) {
+            const config = configs.find(c => c.key === result.key)!;
+            map.set(String(idx++), { result, config });
+        }
+        return map;
+    }
+
+    @computed('suggestionResults.[]')
+    get suggestionItems(): Array<{ key: string; text: string; html: any }> {
+        const configs = this.suggestionConfig!;
+        let idx = 0;
+        return this.suggestionResults.map(result => {
+            const config = configs.find(c => c.key === result.key)!;
+            const key = String(idx++);
+            const text = renderTemplateAsText(config.template!, result.value);
+            const html = renderTemplateAsHtml(config.template!, result.value);
+            return { key, text, html };
+        });
+    }
+
+    @action
+    onTypeaheadInput(event: Event) {
+        const input = event.target as HTMLInputElement;
+        const text = input.value;
+        this.changeset.set(this.valuePath, text);
+        if (text) {
+            run.debounce(this, this._doSearch, text, 300);
+        } else {
+            this.set('suggestionResults', []);
+            this.set('showSuggestions', false);
+        }
+        this.onInput();
+    }
+
+    @action
+    onTypeaheadBlur() {
+        // Delay to allow mousedown on suggestion item to fire first
+        run.later(this, () => this.set('showSuggestions', false), 200);
+    }
+
+    @action
+    onSuggestionSelect(key: string) {
+        const entry = this.suggestionMap.get(key)!;
+        const valueField = entry.config.valueField || entry.config.key.split(':')[1];
+        this.changeset.set(this.valuePath, String(entry.result.value[valueField]));
+        this.set('showSuggestions', false);
+        if (entry.config.autofill) {
+            applyAutofill(
+                this.changeset,
+                this.valuePath,
+                entry.config.autofill,
+                entry.result.value,
+                this.draftManager.pageManagers,
+                this.onInput,
+            );
+        } else {
+            this.onInput();
+        }
+    }
+
+    async _doSearch(keyword: string) {
+        const configs = this.suggestionConfig!;
+        const keys = configs.filter(c => c.template).map(c => c.key);
+        const results = await fetchSuggestions(this.node.id, keys, keyword);
+        this.set('suggestionResults', results);
+        this.set('showSuggestions', results.length > 0);
+    }
 }
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/styles.scss b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/styles.scss
index 32f539d74..65b1fee30 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/styles.scss
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/styles.scss
@@ -6,3 +6,39 @@
         box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
     }
 }
+
+.typeahead-container {
+    position: relative;
+
+    :global(input) {
+        height: 40px;
+        color: $color-text-gray-blue;
+        border-radius: 2px;
+        box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
+    }
+}
+
+.typeahead-dropdown {
+    position: absolute;
+    z-index: 1000;
+    width: 100%;
+    max-height: 300px;
+    overflow-y: auto;
+    margin: 0;
+    padding: 0;
+    list-style: none;
+    background: white;
+    border: 1px solid #ccc;
+    border-top: none;
+    border-radius: 0 0 4px 4px;
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
+}
+
+.typeahead-item {
+    padding: 6px 10px;
+    cursor: pointer;
+
+    &:hover {
+        background-color: #f5f5f5;
+    }
+}
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/template.hbs b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/template.hbs
index 1718d0582..4f9ddf254 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/template.hbs
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/template.hbs
@@ -5,21 +5,52 @@
         @shouldShowMessages={{@shouldShowMessages}}
         ...attributes as |form|
     >
-        <form.text
-            data-test-text-input
-            local-class='schema-block-input'
-            @uniqueID={{@uniqueID}}
-            @valuePath={{@schemaBlock.registrationResponseKey}}
-            @onKeyUp={{@onInput}}
-            @retrievalTitle={{@schemaBlock.retrievalTitle}}
-            @retrievalDate={{@schemaBlock.retrievalDate}}
-            @retrievalVersion={{@schemaBlock.retrievalVersion}}
-            @readonly={{@schemaBlock.readonly}}
-            @title={{@draftManager.node.title}}
-            @nodeId={{@node.id}}
-            @datetimeInitiated={{@draftManager.draftRegistration.datetimeInitiated}}
-            @datetimeUpdated={{@draftManager.draftRegistration.datetimeUpdated}}
-            @placeholder=' '
-        />
+        {{#if this.hasSuggestion}}
+            <div local-class='typeahead-container'>
+                <input
+                    data-test-text-input
+                    type="text"
+                    class="form-control"
+                    value={{or (get @changeset this.valuePath) ''}}
+                    oninput={{action this.onTypeaheadInput}}
+                    onblur={{action this.onTypeaheadBlur}}
+                    placeholder=' '
+                />
+                {{#if this.showSuggestions}}
+                    <ul local-class='typeahead-dropdown'>
+                        {{#each this.suggestionItems as |item|}}
+                            <li
+                                local-class='typeahead-item'
+                                onmousedown={{action this.onSuggestionSelect item.key}}
+                            >
+                                {{{item.html}}}
+                            </li>
+                        {{/each}}
+                    </ul>
+                {{/if}}
+            </div>
+            <ValidationErrors
+                local-class='ValidationErrors'
+                @changeset={{@changeset}}
+                @key={{@schemaBlock.registrationResponseKey}}
+            />
+        {{else}}
+            <form.text
+                data-test-text-input
+                local-class='schema-block-input'
+                @uniqueID={{@uniqueID}}
+                @valuePath={{@schemaBlock.registrationResponseKey}}
+                @onKeyUp={{@onInput}}
+                @retrievalTitle={{@schemaBlock.retrievalTitle}}
+                @retrievalDate={{@schemaBlock.retrievalDate}}
+                @retrievalVersion={{@schemaBlock.retrievalVersion}}
+                @readonly={{@schemaBlock.readonly}}
+                @title={{@draftManager.node.title}}
+                @nodeId={{@node.id}}
+                @datetimeInitiated={{@draftManager.draftRegistration.datetimeInitiated}}
+                @datetimeUpdated={{@draftManager.draftRegistration.datetimeUpdated}}
+                @placeholder=' '
+            />
+        {{/if}}
     </FormControls>
-</Registries::SchemaBlockRenderer::Editable::Base>
\ No newline at end of file
+</Registries::SchemaBlockRenderer::Editable::Base>
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/textarea/styles.scss b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/textarea/styles.scss
index 72d961c3b..c3a2f0bef 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/textarea/styles.scss
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/textarea/styles.scss
@@ -2,7 +2,7 @@
     :global(.form-control) {
         min-height: 100px;
         color: $color-text-gray-blue;
-        border: 1px solid $color-border-gray;
+        border: 1px solid #cad9e6;
         border-radius: 2px;
         font-size: 14px;
         box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2);
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/component.ts b/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/component.ts
index 6ae178992..47ff1eed2 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/component.ts
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/component.ts
@@ -16,6 +16,9 @@ export default class LabelContent extends Component {
     // Required params
     schemaBlock!: SchemaBlock;
 
+    // Optional params
+    displayTextOverride?: string;
+
     // Private property
     shouldShowExample = false;
 
@@ -24,9 +27,9 @@ export default class LabelContent extends Component {
         this.toggleProperty('shouldShowExample');
     }
 
-    @computed('schemaBlock')
+    @computed('schemaBlock', 'displayTextOverride')
     get localizedDisplayText() {
-        const text = this.schemaBlock.displayText;
+        const text = this.displayTextOverride || this.schemaBlock.displayText;
         if (!text) {
             return text;
         }
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/styles.scss b/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/styles.scss
index 30c9d8563..bbe22699e 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/styles.scss
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/styles.scss
@@ -3,6 +3,10 @@
     display: inline-block;
 }
 
+.SubLabel {
+    font-weight: normal;
+}
+
 .Required {
     color: $brand-danger;
     margin-left: 0.25em;
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/template.hbs b/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/template.hbs
index 1b3ab3681..b7cf72db8 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/template.hbs
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/template.hbs
@@ -1,7 +1,7 @@
 {{assert 'Registries::SchemaBlockRenderer::Label::LabelContent requires a @schemaBlock' @schemaBlock}}
 <p
     ...attributes
-    local-class='DisplayText'>
+    local-class='DisplayText {{if @displayTextOverride "SubLabel"}}'>
     {{~this.localizedDisplayText~}}
     {{~#if (and @isRequired (not @readonly))~}}
         <span local-class='Required'>*</span>
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/label/template.hbs b/lib/osf-components/addon/components/registries/schema-block-renderer/label/template.hbs
index 5529423ce..f1f80feb1 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/label/template.hbs
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/label/template.hbs
@@ -12,6 +12,7 @@
                 @readonly={{@readonly}}
                 @isEditableForm={{@isEditableForm}}
                 @draftManager={{@draftManager}}
+                @displayTextOverride={{@uiSubLabel}}
             />
         </legend>
     {{else}}
@@ -28,6 +29,7 @@
                 @readonly={{@readonly}}
                 @isEditableForm={{@isEditableForm}}
                 @draftManager={{@draftManager}}
+                @displayTextOverride={{@uiSubLabel}}
             />
         </label>
     {{/if}}
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/section-heading/template.hbs b/lib/osf-components/addon/components/registries/schema-block-renderer/section-heading/template.hbs
index 58636f61b..d28d3b07b 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/section-heading/template.hbs
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/section-heading/template.hbs
@@ -5,11 +5,6 @@
 >
     {{this.localizedDisplayText}}
     <div local-class='HelpText'>
-        <p local-class='HelpTextLine'>{{this.schemaBlock.helpText}}</p>
+        <p local-class='HelpTextLine'>{{this.localizedHelpText}}</p>
     </div>
-    <span>
-        {{#if this.isEditableForm}}
-            <Registries::SchemaBlockRenderer::HelperTextIcon @helpText={{this.localizedHelpText}} />
-        {{/if}}
-    </span>
 </h3>
\ No newline at end of file
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/styles.scss b/lib/osf-components/addon/components/registries/schema-block-renderer/styles.scss
index fac6271b9..15a39e637 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/styles.scss
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/styles.scss
@@ -9,4 +9,4 @@
 
 .Element {
     margin: 10px 0 0;
-}
+}
\ No newline at end of file
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/template.hbs b/lib/osf-components/addon/components/registries/schema-block-renderer/template.hbs
index 7d52d2516..82ca7dd5f 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/template.hbs
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/template.hbs
@@ -1,15 +1,13 @@
 {{#let @renderStrategy as |Mapper|}}
     <Mapper as |renderers|>
         {{#let (get renderers @schemaBlock.blockType) as |Renderer|}}
-            <Renderer
-                @schemaBlock={{@schemaBlock}}
-                @optionBlocks={{@optionBlocks}}
-                @disabled={{this.disabled}}
-                @shouldShowMessages={{this.shouldShowMessages}}
-                @uniqueID={{@uniqueID}}
-                @isRequired={{@isRequired}}
-                @isFieldsetGroup={{@isFieldsetGroup}}
-            />
+            {{#if this.isLabelBlock}}
+            <Renderer @schemaBlock={{@schemaBlock}} @optionBlocks={{@optionBlocks}} @disabled={{this.disabled}} @shouldShowMessages={{this.shouldShowMessages}} @uniqueID={{@uniqueID}} @isRequired={{@isRequired}} @isFieldsetGroup={{@isFieldsetGroup}} @uiSubLabel={{@uiSubLabel}} />
+            {{else}}
+            <div style={{this.uiItemStyle}}>
+                <Renderer @schemaBlock={{@schemaBlock}} @optionBlocks={{@optionBlocks}} @disabled={{this.disabled}} @shouldShowMessages={{this.shouldShowMessages}} @uniqueID={{@uniqueID}} @isRequired={{@isRequired}} @isFieldsetGroup={{@isFieldsetGroup}} @uiSubLabel={{@uiSubLabel}} />
+            </div>
+            {{/if}}
         {{/let}}
     </Mapper>
 {{/let}}
\ No newline at end of file
diff --git a/lib/osf-components/addon/components/registries/ui-visual-items/component.ts b/lib/osf-components/addon/components/registries/ui-visual-items/component.ts
new file mode 100644
index 000000000..15357a779
--- /dev/null
+++ b/lib/osf-components/addon/components/registries/ui-visual-items/component.ts
@@ -0,0 +1,15 @@
+import { tagName } from '@ember-decorators/component';
+import Component from '@ember/component';
+
+import { layout } from 'ember-osf-web/decorators/component';
+import { VisualItem } from 'ember-osf-web/packages/registration-schema/ui-group';
+
+import styles from './styles';
+import template from './template';
+
+@layout(template, styles)
+@tagName('')
+export default class UiVisualItems extends Component {
+    items!: VisualItem[];
+    baseStrategy!: Component;
+}
diff --git a/lib/osf-components/addon/components/registries/ui-visual-items/styles.scss b/lib/osf-components/addon/components/registries/ui-visual-items/styles.scss
new file mode 100644
index 000000000..e748b9918
--- /dev/null
+++ b/lib/osf-components/addon/components/registries/ui-visual-items/styles.scss
@@ -0,0 +1,13 @@
+.UiGroup {
+    margin: 20px 0 0;
+
+    &:first-child {
+        margin: 0;
+    }
+}
+
+.UiGroupHeading {
+    font-weight: bold;
+    font-size: 1.1em;
+    margin: 0 0 5px;
+}
diff --git a/lib/osf-components/addon/components/registries/ui-visual-items/template.hbs b/lib/osf-components/addon/components/registries/ui-visual-items/template.hbs
new file mode 100644
index 000000000..5b0eae423
--- /dev/null
+++ b/lib/osf-components/addon/components/registries/ui-visual-items/template.hbs
@@ -0,0 +1,18 @@
+{{#each @items as |item|}}
+    {{#if item.uiGroup}}
+        <div local-class='UiGroup'>
+            {{#if item.uiGroup.localizedTitle}}
+                <p local-class='UiGroupHeading'>{{item.uiGroup.localizedTitle}}</p>
+            {{/if}}
+            <Registries::UiVisualItems
+                @items={{item.children}}
+                @baseStrategy={{@baseStrategy}}
+            />
+        </div>
+    {{else}}
+        <Registries::SchemaBlockGroupRenderer
+            @schemaBlockGroup={{item.schemaBlockGroup}}
+            @renderStrategy={{component @baseStrategy schemaBlockGroup=item.schemaBlockGroup}}
+        />
+    {{/if}}
+{{/each}}
diff --git a/lib/osf-components/app/components/registries/ui-visual-items/component.js b/lib/osf-components/app/components/registries/ui-visual-items/component.js
new file mode 100644
index 000000000..130a244f9
--- /dev/null
+++ b/lib/osf-components/app/components/registries/ui-visual-items/component.js
@@ -0,0 +1 @@
+export { default } from 'osf-components/components/registries/ui-visual-items/component';
diff --git a/lib/registries/addon/components/registries-metadata/template.hbs b/lib/registries/addon/components/registries-metadata/template.hbs
index e0286673e..0f4d1bd3f 100644
--- a/lib/registries/addon/components/registries-metadata/template.hbs
+++ b/lib/registries/addon/components/registries-metadata/template.hbs
@@ -45,7 +45,7 @@
     <div local-class='Field'>
         <h4>{{t 'registries.registration_metadata.registration_type'}}</h4>
         <div data-test-registries-metadata='registration type'>
-            {{this.registration.registrationSchema.name}}
+            {{this.registration.registrationSchema.localizedName}}
         </div>
     </div>
 
diff --git a/translations/en-us.yml b/translations/en-us.yml
index 089ceb330..70c983ba6 100644
--- a/translations/en-us.yml
+++ b/translations/en-us.yml
@@ -645,7 +645,7 @@ node:
     metadata:
         new_report_modal:
             title: Select metadata schema
-            info: 'The default is 「Metadata registration of publicly funded research data」.<ul><li>Please select only those who apply to 「Moonshot2 Mibyo Database - Metadata」</li></ul>Select the schema of the project metadata you wish to create from the following:<ul><li>Metadata can be filled in with items defined in the schema.</li><li>You can register metadata for files included in this project in the metadata.</li><li>Files compliant with the report format can be downloaded from the metadata and used for the application.</li></ul>'
+            info: 'The default is "Metadata Registration for Research Outputs (Public Funding)".<ul><li>Please select only those who apply to "Moonshot2 Mibyo Database - Metadata"</li></ul>Select the schema of the project metadata you wish to create from the following:<ul><li>Metadata can be filled in with items defined in the schema.</li><li>You can register metadata for files included in this project in the metadata.</li><li>Files compliant with the report format can be downloaded from the metadata and used for the application.</li></ul>'
             note: '*Metadata forms will be constantly added as the number of corresponding projects and institutions grows in the future.'
             create: 'Create Metadata'
         page_title: '{nodeTitle} Metadata'
@@ -1920,7 +1920,7 @@ binderhub:
 metadata:
     file-metadata-input:
         no_metadata: 'No files'
-        no_metadata_editable: 'File metadata is not registered. You can edit the file metadata on the project page and register it in this draft:'
+        no_metadata_editable: 'File metadata is not registered. You can edit the file metadata on the project page and register it in this metadata:'
         columns:
             title: 'Title'
             path: 'Path'
diff --git a/translations/ja.yml b/translations/ja.yml
index b22f4f81b..a5f0d0270 100644
--- a/translations/ja.yml
+++ b/translations/ja.yml
@@ -645,7 +645,7 @@ node:
     metadata:
         new_report_modal:
             title: メタデータ様式を選択
-            info: 'デフォルトは「公的資金による研究データのメタデータ登録」です。<ul><li>「ムーンショット目標２未病データベース-メタデータ」は該当する人のみ選択してください</li></ul>新規に作成したいプロジェクトメタデータの様式を以下から選択してください。<ul><li>メタデータ作成では、様式で定義された各項目を入力することができます。</li><li>メタデータ作成では、このプロジェクトに含まれるファイルのメタデータを登録することができます。</li><li>メタデータ作成から報告書様式に準拠したファイルをダウンロードし、報告書等の提出に利用することができます。</li></ul>'
+            info: 'デフォルトは「研究成果（公的資金対応）のメタデータ登録」です。<ul><li>「ムーンショット目標２未病データベース-メタデータ」は該当する人のみ選択してください</li></ul>新規に作成したいプロジェクトメタデータの様式を以下から選択してください。<ul><li>メタデータ作成では、様式で定義された各項目を入力することができます。</li><li>メタデータ作成では、このプロジェクトに含まれるファイルのメタデータを登録することができます。</li><li>メタデータ作成から報告書様式に準拠したファイルをダウンロードし、報告書等の提出に利用することができます。</li></ul>'
             note: ＊今後、対応する事業や機関の増加に合わせて、メタデータの様式は随時追加されていきます。
             create: メタデータを作成
         page_title: '{nodeTitle} メタデータ'
@@ -1920,7 +1920,7 @@ binderhub:
 metadata:
     file-metadata-input:
         no_metadata: 'ファイルはありません'
-        no_metadata_editable: 'ファイルメタデータは登録されていません。プロジェクトページでファイルのメタデータを編集し、この下書きに登録することができます:'
+        no_metadata_editable: 'ファイルメタデータは登録されていません。プロジェクトページでファイルのメタデータを編集し、このメタデータに登録することができます:'
         columns:
             title: 'タイトル'
             path: 'パス'

From 3993e235a2119cac08f95f4e670d63ac391e02a3 Mon Sep 17 00:00:00 2001
From: yacchin1205 <968739+yacchin1205@users.noreply.github.com>
Date: Thu, 12 Mar 2026 21:24:39 +0900
Subject: [PATCH 3/7] Improve workflow console: task filtering, pending
 template banner, and UI fixes

---
 app/guid-node/workflow/controller.ts |  98 +++++++++++++++++++++----
 app/guid-node/workflow/route.ts      |  38 ++++++++--
 app/guid-node/workflow/template.hbs  | 105 ++++++++++++++++++++-------
 app/guid-node/workflow/types.ts      |   9 +++
 translations/en-us.yml               |   5 ++
 translations/ja.yml                  |   5 ++
 6 files changed, 210 insertions(+), 50 deletions(-)

diff --git a/app/guid-node/workflow/controller.ts b/app/guid-node/workflow/controller.ts
index ebba0982c..0d480aa70 100644
--- a/app/guid-node/workflow/controller.ts
+++ b/app/guid-node/workflow/controller.ts
@@ -6,10 +6,12 @@ import config from 'ember-get-config';
 
 import Intl from 'ember-intl/services/intl';
 import Node from 'ember-osf-web/models/node';
+import { Permission } from 'ember-osf-web/models/osf-model';
 import CurrentUser from 'ember-osf-web/services/current-user';
 import pathJoin from 'ember-osf-web/utils/path-join';
 
 import {
+    PendingTemplate,
     TaskDialogSubmission,
     WorkflowActivationApiResponse,
     WorkflowRouteModel,
@@ -116,6 +118,7 @@ export default class GuidNodeWorkflowController extends Controller {
     @service intl!: Intl;
 
     @tracked templates: WorkflowTemplate[] = [];
+    @tracked pendingTemplates: PendingTemplate[] = [];
     @tracked templatesError: string | null = null;
     @tracked isRefreshing = false;
 
@@ -133,6 +136,8 @@ export default class GuidNodeWorkflowController extends Controller {
     @tracked isRefreshingRuns = false;
     @tracked runsLoaded = false;
     @tracked hideCompletedRuns = true;
+    @tracked runsLimit = 25;
+    runsLimitOptions = [25, 50, 100];
 
     @tracked isCancelDialogOpen = false;
     @tracked cancellingRun: WorkflowRunSummary | null = null;
@@ -140,10 +145,7 @@ export default class GuidNodeWorkflowController extends Controller {
     @tracked cancelRunError: string | null = null;
 
     get visibleRuns(): WorkflowRunSummary[] {
-        if (!this.hideCompletedRuns) {
-            return this.runs;
-        }
-        return this.runs.filter(run => run.status === 'running');
+        return this.runs;
     }
 
     get runsWithActions(): Array<
@@ -153,7 +155,7 @@ export default class GuidNodeWorkflowController extends Controller {
             return [];
         }
         const currentNodeId = this.node.id;
-        const hasAdminPermission = Boolean(this.node && this.node.userHasAdminPermission);
+        const hasAdminPermission = this.node.currentUserPermissions?.includes(Permission.Admin) ?? false;
         const filtered = this.hideCompletedRuns
             ? this.runs.filter(run => run.status === 'running')
             : this.runs;
@@ -162,6 +164,9 @@ export default class GuidNodeWorkflowController extends Controller {
             const canCancel = hasAdminPermission && !isCompleted && run.node_id === currentNodeId;
             return {
                 ...run,
+                started_at: this.formatDate(run.started_at),
+                created: this.formatDate(run.created),
+                completed_at: this.formatDate(run.completed_at),
                 projectUrl: pathJoin(config.OSF.url, run.node_id),
                 isCurrentProject: run.node_id === currentNodeId,
                 canCancel,
@@ -174,6 +179,8 @@ export default class GuidNodeWorkflowController extends Controller {
     @tracked isRefreshingTasks = false;
     @tracked tasksLoaded = false;
     @tracked hideCompletedTasks = true;
+    @tracked tasksLimit = 25;
+    tasksLimitOptions = [25, 50, 100];
 
     get tasksWithActions(): Array<
         WorkflowTaskSummary & {
@@ -184,11 +191,10 @@ export default class GuidNodeWorkflowController extends Controller {
             return [];
         }
         const currentNodeId = this.node.id;
-        const filtered = this.hideCompletedTasks
-            ? this.tasks.filter(task => task.task_status === 'running')
-            : this.tasks;
-        return filtered.map(task => ({
+        return this.tasks.map(task => ({
             ...task,
+            created: this.formatDate(task.created),
+            due: this.formatDate(task.due),
             canComplete: task.can_complete !== false,
             assigneeDisplay: this.assigneeLabel(task.assignee),
             projectUrl: pathJoin(config.OSF.url, task.node_id),
@@ -220,7 +226,7 @@ export default class GuidNodeWorkflowController extends Controller {
     }
 
     get canStartWorkflow(): boolean {
-        return Boolean(this.node && this.node.userHasWritePermission);
+        return this.node?.currentUserPermissions?.includes(Permission.Write) ?? false;
     }
 
     get selectedTemplate(): WorkflowTemplate | undefined {
@@ -235,10 +241,38 @@ export default class GuidNodeWorkflowController extends Controller {
         return (this.node && this.node.title) || this.intl.t('workflow.console.heading') as string;
     }
 
+    @action
+    async acceptPending(entry: PendingTemplate): Promise<void> {
+        await this.currentUser.authenticatedAJAX({
+            url: `${this.apiBaseUrl}templates/${entry.id}/activation/`,
+            type: 'PUT',
+            data: JSON.stringify({ is_enabled: true }),
+            contentType: 'application/json',
+        });
+        this.pendingTemplates = this.pendingTemplates.filter(t => t.id !== entry.id);
+        const response: { data: WorkflowActivationApiResponse[] } = await this.currentUser.authenticatedAJAX({
+            url: `${this.apiBaseUrl}activations/`,
+            type: 'GET',
+        });
+        this.templates = normalizeTemplates(response.data);
+    }
+
+    @action
+    async dismissPending(entry: PendingTemplate): Promise<void> {
+        await this.currentUser.authenticatedAJAX({
+            url: `${this.apiBaseUrl}templates/${entry.id}/activation/`,
+            type: 'PUT',
+            data: JSON.stringify({ is_dismissed: true }),
+            contentType: 'application/json',
+        });
+        this.pendingTemplates = this.pendingTemplates.filter(t => t.id !== entry.id);
+    }
+
     initialize(model: WorkflowRouteModel, hash: string): void {
         this.node = model.node;
         this.apiBaseUrl = ensureTrailingSlash(model.apiBaseUrl);
         this.templates = model.templates;
+        this.pendingTemplates = model.pendingTemplates;
         this.templatesError = model.templatesError || null;
 
         this.runStatusLabels = {
@@ -379,12 +413,37 @@ export default class GuidNodeWorkflowController extends Controller {
     toggleHideCompletedRuns(event: Event): void {
         const target = event.target as HTMLInputElement | null;
         this.hideCompletedRuns = Boolean(target && target.checked);
+        this.refreshAll();
+    }
+
+    @action
+    changeRunsLimit(event: Event): void {
+        const target = event.target as HTMLSelectElement | null;
+        if (target) {
+            this.runsLimit = parseInt(target.value, 10);
+            this.refreshAll();
+        }
     }
 
     @action
     toggleHideCompletedTasks(event: Event): void {
         const target = event.target as HTMLInputElement | null;
         this.hideCompletedTasks = Boolean(target && target.checked);
+        this.refreshAll();
+    }
+
+    @action
+    changeTasksLimit(event: Event): void {
+        const target = event.target as HTMLSelectElement | null;
+        if (target) {
+            this.tasksLimit = parseInt(target.value, 10);
+            this.refreshAll();
+        }
+    }
+
+    @action
+    async refreshAll(): Promise<void> {
+        await Promise.all([this.refreshRuns(), this.refreshTasks()]);
     }
 
     @action
@@ -398,7 +457,10 @@ export default class GuidNodeWorkflowController extends Controller {
             const response = await this.currentUser.authenticatedAJAX({
                 url: `${this.apiBaseUrl}runs/`,
                 type: 'GET',
-                data: { limit: 25 },
+                data: {
+                    limit: this.runsLimit,
+                    ...(this.hideCompletedRuns ? { status: 'running' } : {}),
+                },
             });
             const data = (response && (response as any).data) || [];
             this.runs = data.map((entry: any) => {
@@ -461,7 +523,7 @@ export default class GuidNodeWorkflowController extends Controller {
             });
 
             this.closeCancelDialog();
-            await this.refreshRuns();
+            await this.refreshAll();
         } catch (error) {
             this.cancelRunError = extractMessage(
                 error,
@@ -486,7 +548,10 @@ export default class GuidNodeWorkflowController extends Controller {
             const response = await this.currentUser.authenticatedAJAX({
                 url: `${this.apiBaseUrl}tasks/`,
                 type: 'GET',
-                data: { limit: 25 },
+                data: {
+                    limit: this.tasksLimit,
+                    ...(this.hideCompletedTasks ? { status: 'active' } : {}),
+                },
             });
             this.tasks = (response as any).data;
             this.tasksLoaded = true;
@@ -525,6 +590,8 @@ export default class GuidNodeWorkflowController extends Controller {
             if (!data) {
                 throw new Error('Task payload not found.');
             }
+            data.created = this.formatDate(data.created);
+            data.due = this.formatDate(data.due);
             this.selectedTask = data;
         } catch (error) {
             if (isAjaxError(error)) {
@@ -578,7 +645,7 @@ export default class GuidNodeWorkflowController extends Controller {
             await this.pollJobStatus(response.data.status_url);
 
             this.taskActionSuccess = this.intl.t('workflow.console.tasks.submitSuccess') as string;
-            await this.refreshTasks();
+            await this.refreshAll();
 
             const nextTask = this.tasksWithActions.find(
                 task => task.process_instance_id === processInstanceId && task.canComplete,
@@ -669,8 +736,7 @@ export default class GuidNodeWorkflowController extends Controller {
             await this.pollJobStatus(response.data.status_url);
 
             this.submitSuccess = this.intl.t('workflow.console.startSuccess') as string;
-            this.startFormVariables = [];
-            await this.refreshTasks();
+            await this.refreshAll();
             const hasAssignedTasks = this.tasksWithActions.some(task => task.canComplete);
             if (hasAssignedTasks) {
                 this.activeTab = 'tasks';
diff --git a/app/guid-node/workflow/route.ts b/app/guid-node/workflow/route.ts
index 0d3a3e217..71b8a4069 100644
--- a/app/guid-node/workflow/route.ts
+++ b/app/guid-node/workflow/route.ts
@@ -8,7 +8,11 @@ import GuidNodeWorkflowController, {
     normalizeTemplates,
     WorkflowTemplate,
 } from 'ember-osf-web/guid-node/workflow/controller';
-import { WorkflowActivationApiResponse } from 'ember-osf-web/guid-node/workflow/types';
+import {
+    PendingTemplate,
+    WorkflowActivationApiResponse,
+    WorkflowTemplateApiResponse,
+} from 'ember-osf-web/guid-node/workflow/types';
 import Node from 'ember-osf-web/models/node';
 import { GuidRouteModel } from 'ember-osf-web/resolve-guid/guid-route';
 import CurrentUser from 'ember-osf-web/services/current-user';
@@ -44,10 +48,22 @@ function extractErrorMessage(error: unknown): string {
 interface RouteModel {
     node: Node;
     templates: WorkflowTemplate[];
+    pendingTemplates: PendingTemplate[];
     apiBaseUrl: string;
     templatesError?: string | null;
 }
 
+function buildDisplayLabel(t: WorkflowTemplateApiResponse): string {
+    const short = t.label || t.definition_name || t.definition_key || t.definition_id || t.id;
+    return !t.is_local && t.node_title ? `${short} [${t.node_title}]` : short;
+}
+
+function extractPendingTemplates(templates: WorkflowTemplateApiResponse[]): PendingTemplate[] {
+    return templates
+        .filter(t => t.auto_activate && !t.activation_id && t.is_effectively_active)
+        .map(t => ({ id: String(t.id), displayLabel: buildDisplayLabel(t) }));
+}
+
 export default class GuidNodeWorkflowRoute extends Route {
     @service currentUser!: CurrentUser;
 
@@ -73,14 +89,22 @@ export default class GuidNodeWorkflowRoute extends Route {
         const apiBaseUrl = buildProjectWorkflowBase(guid);
 
         let templates: WorkflowTemplate[] = [];
+        let pendingTemplates: PendingTemplate[] = [];
         let templatesError: string | null = null;
 
         try {
-            const response: { data: WorkflowActivationApiResponse[] } = await this.currentUser.authenticatedAJAX({
-                url: `${apiBaseUrl}activations/`,
-                type: 'GET',
-            });
-            templates = normalizeTemplates(response.data);
+            const [activationsResponse, templatesResponse] = await Promise.all([
+                this.currentUser.authenticatedAJAX({
+                    url: `${apiBaseUrl}activations/`,
+                    type: 'GET',
+                }) as Promise<{ data: WorkflowActivationApiResponse[] }>,
+                this.currentUser.authenticatedAJAX({
+                    url: `${apiBaseUrl}templates/`,
+                    type: 'GET',
+                }) as Promise<{ data: WorkflowTemplateApiResponse[] }>,
+            ]);
+            templates = normalizeTemplates(activationsResponse.data);
+            pendingTemplates = extractPendingTemplates(templatesResponse.data);
         } catch (error) {
             templatesError = extractErrorMessage(error);
         }
@@ -88,6 +112,7 @@ export default class GuidNodeWorkflowRoute extends Route {
         return {
             node,
             templates,
+            pendingTemplates,
             apiBaseUrl,
             templatesError,
         };
@@ -100,6 +125,7 @@ export default class GuidNodeWorkflowRoute extends Route {
             {
                 node: model.node,
                 templates: model.templates,
+                pendingTemplates: model.pendingTemplates,
                 apiBaseUrl: model.apiBaseUrl,
                 templatesError: model.templatesError,
             },
diff --git a/app/guid-node/workflow/template.hbs b/app/guid-node/workflow/template.hbs
index d7ee230c4..55002e30b 100644
--- a/app/guid-node/workflow/template.hbs
+++ b/app/guid-node/workflow/template.hbs
@@ -47,6 +47,31 @@
         </li>
     </ul>
 
+    {{#if (and this.pendingTemplates.length this.canStartWorkflow)}}
+        <div class="alert alert-info" data-test-workflow-pending-banner>
+            <strong>{{t 'workflow.console.pendingTemplates.heading'}}</strong>
+            {{#each this.pendingTemplates as |entry|}}
+                <div style="margin-top: 6px;">
+                    <span>{{entry.displayLabel}}</span>
+                    <button
+                        type="button"
+                        class="btn btn-xs btn-primary"
+                        {{on "click" (fn this.acceptPending entry)}}
+                    >
+                        {{t 'workflow.console.pendingTemplates.activate'}}
+                    </button>
+                    <button
+                        type="button"
+                        class="btn btn-xs btn-default"
+                        {{on "click" (fn this.dismissPending entry)}}
+                    >
+                        {{t 'workflow.console.pendingTemplates.dismiss'}}
+                    </button>
+                </div>
+            {{/each}}
+        </div>
+    {{/if}}
+
     {{#if (eq this.activeTab 'start')}}
         <div class="panel panel-default" data-test-workflow-start-panel>
             <div class="panel-heading clearfix">
@@ -169,28 +194,40 @@
 
     {{#if (eq this.activeTab 'runs')}}
         <div class="panel panel-default" data-test-workflow-runs-panel>
-            <div class="panel-heading clearfix">
+            <div class="panel-heading" style="display: flex; align-items: center; gap: 8px;">
                 <strong>{{t 'workflow.console.runs.heading'}}</strong>
-                <div class="pull-right m-r-sm">
-                    <label class="checkbox-inline m-b-0">
-                        <input
-                            type="checkbox"
-                            checked={{this.hideCompletedRuns}}
-                            {{on "change" this.toggleHideCompletedRuns}}
-                            data-test-workflow-hide-completed-runs
-                        >
-                        {{t 'workflow.console.runs.hideCompleted'}}
-                    </label>
-                </div>
+                <span style="flex: 1;"></span>
                 <button
                     type="button"
-                    class="btn btn-default btn-xs pull-right"
-                    {{on "click" this.refreshRuns}}
+                    class="btn btn-default btn-xs"
+                    {{on "click" this.refreshAll}}
                     disabled={{this.isRefreshingRuns}}
                 >
                     <i class="fa fa-refresh {{if this.isRefreshingRuns 'fa-spin'}}"></i>
                     {{t 'workflow.console.refresh'}}
                 </button>
+                <label style="font-weight: normal; font-size: 12px; margin: 0;">
+                    {{t 'workflow.console.displayCount'}}
+                    <select
+                        style="height: 22px; padding: 0 2px; font-size: 12px;"
+                        {{on "change" this.changeRunsLimit}}
+                        data-test-workflow-runs-limit
+                    >
+                        {{#each this.runsLimitOptions as |opt|}}
+                            <option value={{opt}} selected={{eq opt this.runsLimit}}>{{opt}}</option>
+                        {{/each}}
+                    </select>
+                </label>
+                <label style="font-weight: normal; font-size: 12px; margin: 0; display: flex; align-items: center; gap: 4px;">
+                    <input
+                        type="checkbox"
+                        style="margin: 0;"
+                        checked={{this.hideCompletedRuns}}
+                        {{on "change" this.toggleHideCompletedRuns}}
+                        data-test-workflow-hide-completed-runs
+                    >
+                    {{t 'workflow.console.runs.hideCompleted'}}
+                </label>
             </div>
             <div class="panel-body">
                 {{#if this.runsError}}
@@ -287,28 +324,40 @@
 
     {{#if (eq this.activeTab 'tasks')}}
         <div class="panel panel-default" data-test-workflow-tasks-panel>
-            <div class="panel-heading clearfix">
+            <div class="panel-heading" style="display: flex; align-items: center; gap: 8px;">
                 <strong>{{t 'workflow.console.tasks.heading'}}</strong>
-                <div class="pull-right m-r-sm">
-                    <label class="checkbox-inline m-b-0">
-                        <input
-                            type="checkbox"
-                            checked={{this.hideCompletedTasks}}
-                            {{on "change" this.toggleHideCompletedTasks}}
-                            data-test-workflow-hide-completed-tasks
-                        >
-                        {{t 'workflow.console.tasks.hideCompleted'}}
-                    </label>
-                </div>
+                <span style="flex: 1;"></span>
                 <button
                     type="button"
-                    class="btn btn-default btn-xs pull-right"
-                    {{on "click" this.refreshTasks}}
+                    class="btn btn-default btn-xs"
+                    {{on "click" this.refreshAll}}
                     disabled={{this.isRefreshingTasks}}
                 >
                     <i class="fa fa-refresh {{if this.isRefreshingTasks 'fa-spin'}}"></i>
                     {{t 'workflow.console.refresh'}}
                 </button>
+                <label style="font-weight: normal; font-size: 12px; margin: 0;">
+                    {{t 'workflow.console.displayCount'}}
+                    <select
+                        style="height: 22px; padding: 0 2px; font-size: 12px;"
+                        {{on "change" this.changeTasksLimit}}
+                        data-test-workflow-tasks-limit
+                    >
+                        {{#each this.tasksLimitOptions as |opt|}}
+                            <option value={{opt}} selected={{eq opt this.tasksLimit}}>{{opt}}</option>
+                        {{/each}}
+                    </select>
+                </label>
+                <label style="font-weight: normal; font-size: 12px; margin: 0; display: flex; align-items: center; gap: 4px;">
+                    <input
+                        type="checkbox"
+                        style="margin: 0;"
+                        checked={{this.hideCompletedTasks}}
+                        {{on "change" this.toggleHideCompletedTasks}}
+                        data-test-workflow-hide-completed-tasks
+                    >
+                    {{t 'workflow.console.tasks.hideCompleted'}}
+                </label>
             </div>
             <div class="panel-body">
                 {{#if this.tasksError}}
diff --git a/app/guid-node/workflow/types.ts b/app/guid-node/workflow/types.ts
index a8c4047cc..c63a2fd35 100644
--- a/app/guid-node/workflow/types.ts
+++ b/app/guid-node/workflow/types.ts
@@ -25,6 +25,9 @@ export interface WorkflowTemplateApiResponse {
     node_title?: string;
     is_local: boolean;
     is_active: boolean;
+    is_effectively_active?: boolean;
+    auto_activate?: boolean;
+    activation_id?: string | null;
     definition_form_schema: {
         fields: WorkflowTaskField[];
         data?: unknown;
@@ -50,9 +53,15 @@ export interface WorkflowTemplate {
     };
 }
 
+export interface PendingTemplate {
+    id: string;
+    displayLabel: string;
+}
+
 export interface WorkflowRouteModel {
     node: Node;
     templates: WorkflowTemplate[];
+    pendingTemplates: PendingTemplate[];
     apiBaseUrl: string;
     templatesError?: string | null;
 }
diff --git a/translations/en-us.yml b/translations/en-us.yml
index 70c983ba6..d1985e0c4 100644
--- a/translations/en-us.yml
+++ b/translations/en-us.yml
@@ -1972,6 +1972,10 @@ workflow:
     console:
         heading: 'Workflow console'
         description: 'Start workflows registered for this project and manage their runs.'
+        pendingTemplates:
+            heading: 'Available workflows'
+            activate: 'Activate'
+            dismiss: 'Dismiss'
         startSectionTitle: 'Start a workflow'
         workflowLabel: 'Workflow'
         selectPrompt: 'Select a workflow...'
@@ -1993,6 +1997,7 @@ workflow:
         startSuccess: 'Workflow started.'
         startFailed: 'Could not start the workflow.'
         refresh: 'Refresh'
+        displayCount: 'Show:'
         close: 'Close'
         tab:
             start: 'Start'
diff --git a/translations/ja.yml b/translations/ja.yml
index a5f0d0270..bb37efed0 100644
--- a/translations/ja.yml
+++ b/translations/ja.yml
@@ -1972,6 +1972,10 @@ workflow:
     console:
         heading: ワークフローコンソール
         description: このプロジェクトに登録されたワークフローを起動し、実行を管理します。
+        pendingTemplates:
+            heading: 利用可能なワークフロー
+            activate: 有効化
+            dismiss: 非表示にする
         startSectionTitle: ワークフローを開始
         workflowLabel: ワークフロー
         selectPrompt: ワークフローを選択してください…
@@ -1993,6 +1997,7 @@ workflow:
         startSuccess: ワークフローを開始しました。
         startFailed: ワークフローを開始できませんでした。
         refresh: 更新
+        displayCount: '表示件数:'
         close: 閉じる
         tab:
             start: 実行

From 8c268be163284486cd9f26b283dc985de684ff65 Mon Sep 17 00:00:00 2001
From: yacchin1205 <968739+yacchin1205@users.noreply.github.com>
Date: Thu, 26 Mar 2026 22:31:22 +0900
Subject: [PATCH 4/7] Add wizard form, placeholders, field hints, and template
 expression engine

---
 .../flowable-form/array-input/component.ts    | 119 ++++
 .../flowable-form/array-input/styles.scss     |  33 +
 .../flowable-form/array-input/template.hbs    |  37 +
 .../-components/flowable-form/component.ts    |  83 ++-
 .../flowable-form/export-target/component.ts  |   6 +-
 .../flowable-form/field/component.ts          | 260 ++++++-
 .../flowable-form/field/styles.scss           |  28 +
 .../flowable-form/field/template.hbs          | 105 ++-
 .../file-metadata-selector/component.ts       |  21 +-
 .../file-metadata-selector/template.hbs       |   3 -
 .../flowable-form/file-selector/component.ts  |   6 +-
 .../flowable-form/file-uploader/component.ts  | 227 +++++++
 .../flowable-form/file-uploader/styles.scss   |   7 +
 .../flowable-form/file-uploader/template.hbs  |  29 +
 .../project-metadata-selector/component.ts    |  24 +-
 .../-components/flowable-form/template.hbs    |   8 +-
 .../-components/flowable-form/types.ts        |   1 +
 .../-components/flowable-form/utils.ts        |  52 ++
 .../-components/progress-sidebar/component.ts |   7 +
 .../-components/task-dialog/component.ts      |  12 +
 .../-components/task-dialog/template.hbs      |  45 +-
 .../-components/task-form/component.ts        |  10 +-
 .../-components/task-form/template.hbs        |  12 +-
 .../-components/wizard-form/component.ts      | 315 +++++++++
 .../-components/wizard-form/draft-utils.ts    |  91 +++
 .../wizard-form/expression-evaluator.ts       | 185 +++++
 .../-components/wizard-form/page-utils.ts     | 133 ++++
 .../wizard-form/template-evaluator.ts         | 634 ++++++++++++++++++
 .../-components/wizard-form/template.hbs      |  12 +
 .../workflow/-components/wizard-form/types.ts |  77 +++
 .../editable/text/component.ts                |   7 +-
 translations/en-us.yml                        |   7 +-
 translations/ja.yml                           |   7 +-
 33 files changed, 2528 insertions(+), 75 deletions(-)
 create mode 100644 app/guid-node/workflow/-components/flowable-form/array-input/component.ts
 create mode 100644 app/guid-node/workflow/-components/flowable-form/array-input/styles.scss
 create mode 100644 app/guid-node/workflow/-components/flowable-form/array-input/template.hbs
 create mode 100644 app/guid-node/workflow/-components/flowable-form/field/styles.scss
 create mode 100644 app/guid-node/workflow/-components/flowable-form/file-uploader/component.ts
 create mode 100644 app/guid-node/workflow/-components/flowable-form/file-uploader/styles.scss
 create mode 100644 app/guid-node/workflow/-components/flowable-form/file-uploader/template.hbs
 create mode 100644 app/guid-node/workflow/-components/wizard-form/component.ts
 create mode 100644 app/guid-node/workflow/-components/wizard-form/draft-utils.ts
 create mode 100644 app/guid-node/workflow/-components/wizard-form/expression-evaluator.ts
 create mode 100644 app/guid-node/workflow/-components/wizard-form/page-utils.ts
 create mode 100644 app/guid-node/workflow/-components/wizard-form/template-evaluator.ts
 create mode 100644 app/guid-node/workflow/-components/wizard-form/template.hbs
 create mode 100644 app/guid-node/workflow/-components/wizard-form/types.ts

diff --git a/app/guid-node/workflow/-components/flowable-form/array-input/component.ts b/app/guid-node/workflow/-components/flowable-form/array-input/component.ts
new file mode 100644
index 000000000..ac8e0509c
--- /dev/null
+++ b/app/guid-node/workflow/-components/flowable-form/array-input/component.ts
@@ -0,0 +1,119 @@
+import { action } from '@ember/object';
+import Component from '@glimmer/component';
+import { tracked } from '@glimmer/tracking';
+
+import Node from 'ember-osf-web/models/node';
+
+import { WorkflowVariable } from '../../../types';
+import { FieldHint } from '../../wizard-form/types';
+import { resolveFlowableType } from '../component';
+import { FieldValueWithType, WorkflowTaskField } from '../types';
+
+interface ArrayInputRow {
+    key: number;
+    values: Record<string, unknown>;
+}
+
+interface ArrayInputArgs {
+    fields: WorkflowTaskField[];
+    value: FieldValueWithType | undefined;
+    node?: Node;
+    fieldHints?: Record<string, FieldHint>;
+    disabled: boolean;
+    onChange: (valueWithType: FieldValueWithType) => void;
+}
+
+export default class ArrayInput extends Component<ArrayInputArgs> {
+    @tracked rows: ArrayInputRow[] = [];
+    @tracked isInitialized = false;
+
+    private nextKey = 0;
+
+    private allocateKey(): number {
+        return this.nextKey++;
+    }
+
+    get rowForms(): Array<{
+        row: ArrayInputRow;
+        label: string;
+        form: { fields: WorkflowTaskField[] };
+        variables: WorkflowVariable[];
+    }> {
+        return this.rows.map((row, index) => ({
+            row,
+            label: `#${index + 1}`,
+            form: { fields: this.args.fields },
+            variables: this.buildVariablesForRow(row),
+        }));
+    }
+
+    @action
+    initialize(): void {
+        if (this.isInitialized) {
+            return;
+        }
+        this.isInitialized = true;
+
+        const existing = this.args.value;
+        if (existing && Array.isArray(existing.value)) {
+            const items = existing.value as Array<Record<string, unknown>>;
+            this.rows = items.map(item => ({
+                key: this.allocateKey(),
+                values: { ...item },
+            }));
+        }
+    }
+
+    @action
+    addRow(): void {
+        this.rows = [
+            ...this.rows,
+            { key: this.allocateKey(), values: {} },
+        ];
+        this.notifyChange();
+    }
+
+    @action
+    removeRow(key: number): void {
+        this.rows = this.rows.filter(row => row.key !== key);
+        this.notifyChange();
+    }
+
+    @action
+    handleRowChange(key: number, variables: WorkflowVariable[]): void {
+        const row = this.rows.find(r => r.key === key);
+        if (!row) {
+            return;
+        }
+        const values: Record<string, unknown> = {};
+        for (const v of variables) {
+            values[v.name] = v.value;
+        }
+        row.values = values;
+        this.notifyChange();
+    }
+
+    private buildVariablesForRow(row: ArrayInputRow): WorkflowVariable[] {
+        return this.args.fields
+            .filter(field => !this.isDisplayField(field))
+            .map(field => ({
+                name: field.id,
+                value: row.values[field.id] !== undefined ? row.values[field.id] : null,
+                type: resolveFlowableType(field.type),
+            }));
+    }
+
+    private isDisplayField(field: WorkflowTaskField): boolean {
+        const type = field.type.toLowerCase();
+        return ['expression', 'hyperlink', 'link', 'headline', 'headline-with-line', 'spacer', 'horizontal-line']
+            .includes(type);
+    }
+
+    private notifyChange(): void {
+        const value = this.rows.map(row => row.values);
+        this.args.onChange({
+            value,
+            type: 'json',
+        });
+    }
+}
diff --git a/app/guid-node/workflow/-components/flowable-form/array-input/styles.scss b/app/guid-node/workflow/-components/flowable-form/array-input/styles.scss
new file mode 100644
index 000000000..aa5fd2515
--- /dev/null
+++ b/app/guid-node/workflow/-components/flowable-form/array-input/styles.scss
@@ -0,0 +1,33 @@
+.ArrayInput {
+    border: 1px solid #ddd;
+    border-radius: 4px;
+    padding: 12px;
+    background: #fafafa;
+}
+
+.ArrayInput__row {
+    border: 1px solid #e0e0e0;
+    border-radius: 4px;
+    padding: 12px;
+    margin-bottom: 12px;
+    background: #fff;
+}
+
+.ArrayInput__rowHeader {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    margin-bottom: 8px;
+    padding-bottom: 6px;
+    border-bottom: 1px solid #eee;
+}
+
+.ArrayInput__rowIndex {
+    font-weight: 600;
+    color: #666;
+    font-size: 0.9em;
+}
+
+.ArrayInput__addButton {
+    margin-top: 4px;
+}
diff --git a/app/guid-node/workflow/-components/flowable-form/array-input/template.hbs b/app/guid-node/workflow/-components/flowable-form/array-input/template.hbs
new file mode 100644
index 000000000..a3f00a10b
--- /dev/null
+++ b/app/guid-node/workflow/-components/flowable-form/array-input/template.hbs
@@ -0,0 +1,37 @@
+<div local-class="ArrayInput" {{did-insert this.initialize}}>
+    {{#each this.rowForms as |entry|}}
+        <div local-class="ArrayInput__row">
+            <div local-class="ArrayInput__rowHeader">
+                <span local-class="ArrayInput__rowIndex">{{entry.label}}</span>
+                {{#unless @disabled}}
+                    <button
+                        type="button"
+                        class="btn btn-xs btn-danger"
+                        {{on "click" (fn this.removeRow entry.row.key)}}
+                    >
+                        <i class="fa fa-trash"></i>
+                    </button>
+                {{/unless}}
+            </div>
+            <GuidNode::Workflow::-Components::FlowableForm
+                @form={{entry.form}}
+                @variables={{entry.variables}}
+                @node={{@node}}
+                @fieldHints={{@fieldHints}}
+                @onChange={{fn this.handleRowChange entry.row.key}}
+            />
+        </div>
+    {{/each}}
+
+    {{#unless @disabled}}
+        <button
+            type="button"
+            class="btn btn-sm btn-default"
+            local-class="ArrayInput__addButton"
+            {{on "click" this.addRow}}
+        >
+            <i class="fa fa-plus"></i>
+            {{t 'workflow.console.tasks.dialog.arrayInput.add'}}
+        </button>
+    {{/unless}}
+</div>
diff --git a/app/guid-node/workflow/-components/flowable-form/component.ts b/app/guid-node/workflow/-components/flowable-form/component.ts
index c2c24fb50..f084be997 100644
--- a/app/guid-node/workflow/-components/flowable-form/component.ts
+++ b/app/guid-node/workflow/-components/flowable-form/component.ts
@@ -8,14 +8,26 @@ import {
     WorkflowTaskForm,
     WorkflowVariable,
 } from '../../types';
+import { evaluateExpression } from '../wizard-form/expression-evaluator';
+import { FieldHint } from '../wizard-form/types';
 import { isValidFieldValue } from './field/component';
 import { FieldValueWithType } from './types';
 
+/**
+ * Interface for Field components to call back into their parent form.
+ * Provides setValue() for autofill: always goes through the view layer (View → Model).
+ */
+export interface FlowableFormContext {
+    setFieldValue(fieldId: string, valueWithType: FieldValueWithType): void;
+}
+
 interface FlowableFormArgs {
     form: WorkflowTaskForm;
     variables?: WorkflowVariable[];
     node?: Node;
-    onChange: (variables: WorkflowVariable[], isValid: boolean) => void;
+    fieldHints?: Record<string, FieldHint>;
+    fieldContext?: Record<string, unknown>;
+    onChange: (variables: WorkflowVariable[], isValid: boolean, isLoading: boolean) => void;
 }
 
 export function resolveFlowableType(fieldType: string | undefined): string {
@@ -38,26 +50,67 @@ export function resolveFlowableType(fieldType: string | undefined): string {
     return 'string';
 }
 
+interface FieldHandle {
+    setValue(valueWithType: FieldValueWithType): void;
+}
+
 export default class FlowableForm extends Component<FlowableFormArgs> {
     @tracked fieldValues: Record<string, FieldValueWithType> = {};
     @tracked updatedFieldValues: Record<string, FieldValueWithType> = {};
+    @tracked loadingFieldIds: Set<string> = new Set();
+
+    private fieldRegistry = new Map<string, FieldHandle>();
+
+    get formContext(): FlowableFormContext {
+        return {
+            setFieldValue: (fieldId: string, valueWithType: FieldValueWithType) => {
+                this.fieldRegistry.get(fieldId)!.setValue(valueWithType);
+            },
+        };
+    }
 
     get fields(): WorkflowTaskField[] {
         return this.args.form.fields || [];
     }
 
+    get visibleFields(): WorkflowTaskField[] {
+        return this.fields.filter(field => this.isFieldVisible(field));
+    }
+
     get hasFields(): boolean {
         return this.fields.length > 0;
     }
 
+    isFieldVisible(field: WorkflowTaskField): boolean {
+        const hints = this.args.fieldHints;
+        if (!hints) {
+            return true;
+        }
+        const hint = hints[field.id];
+        if (!hint || hint.visible === undefined || hint.visible === true) {
+            return true;
+        }
+        if (hint.visible === false) {
+            return false;
+        }
+        const ctx = this.args.fieldContext;
+        if (!ctx) {
+            return true;
+        }
+        return evaluateExpression(hint.visible, ctx);
+    }
+
     get isValid(): boolean {
         return this.fields
-            .filter(field => this.isSubmittableField(field))
+            .filter(field => this.isSubmittableField(field) && this.isFieldVisible(field))
             .every(field => {
+                const fieldValue = this.updatedFieldValues[field.id];
+                if (fieldValue && fieldValue.valid === false) {
+                    return false;
+                }
                 if (!field.required) {
                     return true;
                 }
-                const fieldValue = this.updatedFieldValues[field.id];
                 const value = fieldValue && fieldValue.value;
                 return isValidFieldValue(field, value);
             });
@@ -97,6 +150,16 @@ export default class FlowableForm extends Component<FlowableFormArgs> {
         this.notifyChange();
     }
 
+    @action
+    registerField(fieldId: string, handle: FieldHandle): void {
+        this.fieldRegistry.set(fieldId, handle);
+    }
+
+    @action
+    unregisterField(fieldId: string): void {
+        this.fieldRegistry.delete(fieldId);
+    }
+
     @action
     handleFieldChange(fieldId: string, valueWithType: FieldValueWithType): void {
         this.updatedFieldValues = {
@@ -106,6 +169,18 @@ export default class FlowableForm extends Component<FlowableFormArgs> {
         this.notifyChange();
     }
 
+    @action
+    handleFieldLoadingChange(fieldId: string, isLoading: boolean): void {
+        const next = new Set(this.loadingFieldIds);
+        if (isLoading) {
+            next.add(fieldId);
+        } else {
+            next.delete(fieldId);
+        }
+        this.loadingFieldIds = next;
+        this.notifyChange();
+    }
+
     private isSubmittableField(field: WorkflowTaskField): boolean {
         const type = field.type.toLowerCase();
         const displayOnlyTypes = [
@@ -131,6 +206,6 @@ export default class FlowableForm extends Component<FlowableFormArgs> {
                 };
             });
 
-        this.args.onChange(variables, this.isValid);
+        this.args.onChange(variables, this.isValid, this.loadingFieldIds.size > 0);
     }
 }
diff --git a/app/guid-node/workflow/-components/flowable-form/export-target/component.ts b/app/guid-node/workflow/-components/flowable-form/export-target/component.ts
index 487085353..859b12952 100644
--- a/app/guid-node/workflow/-components/flowable-form/export-target/component.ts
+++ b/app/guid-node/workflow/-components/flowable-form/export-target/component.ts
@@ -12,6 +12,7 @@ interface ExportTargetArgs {
     node: Node;
     value: FieldValueWithType | undefined;
     onChange: (valueWithType: FieldValueWithType) => void;
+    onLoadingChange?: (isLoading: boolean) => void;
     disabled: boolean;
 }
 
@@ -36,7 +37,10 @@ export default class ExportTarget extends Component<ExportTargetArgs> {
 
     @action
     initialize() {
-        this.loadProviders.perform();
+        this.args.onLoadingChange?.(true);
+        this.loadProviders.perform().finally(() => {
+            this.args.onLoadingChange?.(false);
+        });
     }
 
     @action
diff --git a/app/guid-node/workflow/-components/flowable-form/field/component.ts b/app/guid-node/workflow/-components/flowable-form/field/component.ts
index f0f41c2e7..8bbac0862 100644
--- a/app/guid-node/workflow/-components/flowable-form/field/component.ts
+++ b/app/guid-node/workflow/-components/flowable-form/field/component.ts
@@ -2,11 +2,27 @@ import { action } from '@ember/object';
 import Component from '@glimmer/component';
 import { tracked } from '@glimmer/tracking';
 
+import { fetchSuggestions, SuggestionResult } from 'ember-osf-web/utils/suggestion-api';
+import { htmlSafe } from '@ember/template';
+
 import { WorkflowVariable } from '../../../types';
+import { FieldHint, SuggestionConfig } from '../../wizard-form/types';
+import { evaluateTemplate, hasTemplateDirectives } from '../../wizard-form/template-evaluator';
 import { parseProgressSteps, ProgressStep } from '../../progress-sidebar/utils';
-import { resolveFlowableType } from '../component';
+import { FlowableFormContext, resolveFlowableType } from '../component';
 import { FieldValueWithType, WorkflowTaskField, WorkflowTaskFieldOption } from '../types';
-import { extractExportTarget, extractFileMetadata, extractFileSelector, extractProjectMetadata } from '../utils';
+import {
+    extractArrayInput, extractExportTarget, extractFileMetadata, extractFileSelector, extractFileUploader,
+    extractProjectMetadata,
+} from '../utils';
+
+function renderTemplateAsHtml(tmpl: string, value: Record<string, any>): ReturnType<typeof htmlSafe> {
+    const rendered = tmpl.replace(/\{\{(\w+)\}\}/g, (_match: string, field: string) => {
+        const v = value[field];
+        return v != null ? String(v) : '';
+    });
+    return htmlSafe(rendered);
+}
 
 function getOptionValue(option: WorkflowTaskFieldOption): string | undefined {
     return (option.id !== undefined && option.id !== null) ? option.id : option.name;
@@ -62,11 +78,152 @@ interface TaskFormFieldArgs {
     fieldValues: Record<string, FieldValueWithType>;
     variables: WorkflowVariable[];
     node?: any;
+    fieldHints?: Record<string, FieldHint>;
+    formContext?: FlowableFormContext;
+    fieldContext?: Record<string, unknown>;
     onChange: (fieldId: string, valueWithType: FieldValueWithType) => void;
+    onLoadingChange?: (fieldId: string, isLoading: boolean) => void;
+    onRegister?: (fieldId: string, handle: { setValue(v: FieldValueWithType): void }) => void;
+    onUnregister?: (fieldId: string) => void;
 }
 
 export default class TaskFormField extends Component<TaskFormFieldArgs> {
     @tracked updatedValue: FieldValueWithType | null = null;
+    @tracked suggestionResults: SuggestionResult[] = [];
+    @tracked showSuggestions = false;
+
+    private searchTimer: ReturnType<typeof setTimeout> | null = null;
+
+    // --- Field registry (for autofill via view layer) ---
+
+    setValue(valueWithType: FieldValueWithType): void {
+        this.updatedValue = valueWithType;
+        this.args.onChange(this.args.field.id, valueWithType);
+    }
+
+    @action
+    onFieldInsert(): void {
+        this.args.onRegister?.(this.args.field.id, this);
+    }
+
+    @action
+    onFieldDestroy(): void {
+        this.args.onUnregister?.(this.args.field.id);
+    }
+
+    // --- Hint accessors ---
+
+    get hint(): FieldHint | undefined {
+        return this.args.fieldHints?.[this.args.field.id];
+    }
+
+    get suggestionConfigs(): SuggestionConfig[] | null {
+        const configs = this.hint?.suggestion;
+        if (!configs?.length) {
+            return null;
+        }
+        return configs.filter((s: SuggestionConfig) => Boolean(s.template));
+    }
+
+    get hasSuggestion(): boolean {
+        return this.suggestionConfigs !== null && this.suggestionConfigs.length > 0;
+    }
+
+    get widthStyle(): string | undefined {
+        const width = this.hint?.ui?.width;
+        if (width === 'narrow') {
+            return 'max-width: 25%;';
+        }
+        if (width === 'half') {
+            return 'max-width: 50%;';
+        }
+        return undefined;
+    }
+
+    get isFreetext(): boolean {
+        return this.hint?.ui?.freetext === true;
+    }
+
+    // --- Suggestion / typeahead ---
+
+    get suggestionItems(): Array<{ key: string; html: ReturnType<typeof htmlSafe> }> {
+        const configs = this.suggestionConfigs!;
+        return this.suggestionResults.map((result, idx) => {
+            const config = configs.find(c => c.key === result.key)!;
+            return {
+                key: String(idx),
+                html: renderTemplateAsHtml(config.template!, result.value),
+            };
+        });
+    }
+
+    @action
+    onTypeaheadInput(event: Event): void {
+        const text = (event.target as HTMLInputElement).value;
+        this.setValue({
+            value: text === '' ? null : text,
+            type: 'string',
+        });
+        if (this.searchTimer) {
+            clearTimeout(this.searchTimer);
+        }
+        this.searchTimer = setTimeout(() => this.doSearch(text), 300);
+    }
+
+    @action
+    onTypeaheadBlur(): void {
+        setTimeout(() => { this.showSuggestions = false; }, 200);
+    }
+
+    @action
+    onSuggestionSelect(key: string): void {
+        const idx = parseInt(key, 10);
+        const result = this.suggestionResults[idx];
+        const configs = this.suggestionConfigs!;
+        const config = configs.find(c => c.key === result.key)!;
+
+        const valueField = config.valueField || config.key.split(':')[1];
+        this.setValue({
+            value: String(result.value[valueField]),
+            type: 'string',
+        });
+        this.showSuggestions = false;
+
+        if (config.autofill) {
+            this.applyAutofill(config.autofill, result.value);
+        }
+    }
+
+    private applyAutofill(autofillMap: Record<string, string>, responseValue: Record<string, any>): void {
+        const formContext = this.args.formContext!;
+        const allHints = this.args.fieldHints || {};
+
+        for (const [targetFieldId, responseField] of Object.entries(autofillMap)) {
+            const rawValue = responseValue[responseField];
+            if (rawValue == null) {
+                continue;
+            }
+            let resolved = String(rawValue);
+            const targetOptionMap = allHints[targetFieldId]?.ui?.optionMap;
+            if (targetOptionMap?.[resolved]) {
+                resolved = targetOptionMap[resolved];
+            }
+            formContext.setFieldValue(targetFieldId, { value: resolved, type: 'string' });
+        }
+    }
+
+    private async doSearch(keyword: string): Promise<void> {
+        const node = this.args.node;
+        if (!node) {
+            return;
+        }
+        const keys = this.suggestionConfigs!.map(c => c.key);
+        const results = await fetchSuggestions(node.id, keys, keyword);
+        this.suggestionResults = results;
+        this.showSuggestions = results.length > 0;
+    }
+
+    // --- Standard field handlers ---
 
     @action
     handleChange(event: Event): void {
@@ -124,23 +281,52 @@ export default class TaskFormField extends Component<TaskFormFieldArgs> {
         this.args.onChange(this.args.field.id, valueWithType);
     }
 
+    @action
+    handleFileUploaderChange(valueWithType: FieldValueWithType): void {
+        this.updatedValue = valueWithType;
+        this.args.onChange(this.args.field.id, valueWithType);
+    }
+
     @action
     handleExportTargetChange(valueWithType: FieldValueWithType): void {
         this.updatedValue = valueWithType;
         this.args.onChange(this.args.field.id, valueWithType);
     }
 
+    @action
+    handleLoadingChange(isLoading: boolean): void {
+        this.args.onLoadingChange?.(this.args.field.id, isLoading);
+    }
+
+    @action
+    handleArrayInputChange(valueWithType: FieldValueWithType): void {
+        this.updatedValue = valueWithType;
+        this.args.onChange(this.args.field.id, valueWithType);
+    }
+
     get displayValue(): unknown {
-        return this.updatedValue !== null ? this.updatedValue.value : this.currentValue;
+        if (this.updatedValue !== null) {
+            return this.updatedValue.value;
+        }
+        const current = this.currentValue;
+        return current ? current.value : null;
     }
 
-    get hasError(): boolean {
+    get hasRequiredError(): boolean {
         if (!this.isRequired) {
             return false;
         }
         const val = this.displayValue;
-        const isValid = isValidFieldValue(this.args.field, val);
-        return !isValid;
+        return !isValidFieldValue(this.args.field, val);
+    }
+
+    get hasCustomError(): boolean {
+        const current = this.updatedValue || this.currentValue;
+        return current !== undefined && current !== null && current.valid === false;
+    }
+
+    get hasError(): boolean {
+        return this.hasRequiredError || this.hasCustomError;
     }
     get type(): string {
         return this.args.field.type;
@@ -171,6 +357,9 @@ export default class TaskFormField extends Component<TaskFormFieldArgs> {
     }
 
     get stringValue(): string {
+        if (this.updatedValue !== null) {
+            return toStringValue(this.updatedValue);
+        }
         const current = this.currentValue;
         if (!current) {
             return '';
@@ -179,6 +368,9 @@ export default class TaskFormField extends Component<TaskFormFieldArgs> {
     }
 
     get booleanValue(): boolean {
+        if (this.updatedValue !== null) {
+            return toBooleanValue(this.updatedValue);
+        }
         const current = this.currentValue;
         if (!current) {
             return false;
@@ -210,10 +402,10 @@ export default class TaskFormField extends Component<TaskFormFieldArgs> {
     }
 
     get isTextarea(): boolean {
-        if (this.isProjectMetadataSelector) {
+        if (this.isProjectMetadataSelector || this.isArrayInput) {
             return false;
         }
-        if (this.isFileSelector || this.isExportTarget) {
+        if (this.isFileSelector || this.isFileUploader || this.isExportTarget) {
             return false;
         }
         return this.type === 'multi-line-text' || this.type === 'textarea';
@@ -223,10 +415,47 @@ export default class TaskFormField extends Component<TaskFormFieldArgs> {
         return extractFileSelector(this.args.field);
     }
 
+    get fileUploaderPlaceholder() {
+        return extractFileUploader(this.args.field);
+    }
+
+    get isFileUploader(): boolean {
+        return this.fileUploaderPlaceholder !== null;
+    }
+
     get isExportTarget(): boolean {
         return extractExportTarget(this.args.field);
     }
 
+    get arrayInputPlaceholder() {
+        return extractArrayInput(this.args.field);
+    }
+
+    get isArrayInput(): boolean {
+        return this.arrayInputPlaceholder !== null;
+    }
+
+    get arrayInputFields() {
+        return this.arrayInputPlaceholder ? this.arrayInputPlaceholder.fields : [];
+    }
+
+    get arrayFieldHints(): Record<string, FieldHint> | undefined {
+        const allHints = this.args.fieldHints;
+        if (!allHints) {
+            return undefined;
+        }
+        const prefix = this.args.field.id + '.';
+        const subHints: Record<string, FieldHint> = {};
+        let found = false;
+        for (const [key, hint] of Object.entries(allHints)) {
+            if (key.startsWith(prefix)) {
+                subHints[key.substring(prefix.length)] = hint;
+                found = true;
+            }
+        }
+        return found ? subHints : undefined;
+    }
+
     get projectMetadataPlaceholder() {
         return extractProjectMetadata(this.args.field);
     }
@@ -322,7 +551,8 @@ export default class TaskFormField extends Component<TaskFormFieldArgs> {
         const field = this.args.field as unknown as { expression?: string };
         const expression = field.expression || '';
 
-        return expression.replace(/\$\{([^}]+)\}/g, (_match, varName) => { // tslint:disable-line:variable-name
+        // Step 1: ${...} (Flowable UEL) resolution
+        const uelResolved = expression.replace(/\$\{([^}]+)\}/g, (_match, varName) => {
             const trimmed = varName.trim();
             const variable = this.args.variables.find(v => v.name === trimmed);
             if (variable) {
@@ -334,6 +564,18 @@ export default class TaskFormField extends Component<TaskFormFieldArgs> {
             }
             return '';
         });
+
+        // Step 2: {{ }} / {% %} template directives (client-side)
+        if (!hasTemplateDirectives(uelResolved)) {
+            return uelResolved;
+        }
+        // Build context from variables (tracked via currentPageVariables)
+        // rather than fieldContext (not tracked by Glimmer).
+        const ctx: Record<string, unknown> = {};
+        for (const v of this.args.variables) {
+            ctx[v.name] = v.value;
+        }
+        return evaluateTemplate(uelResolved, ctx);
     }
 
     get hyperlinkUrl(): string {
diff --git a/app/guid-node/workflow/-components/flowable-form/field/styles.scss b/app/guid-node/workflow/-components/flowable-form/field/styles.scss
new file mode 100644
index 000000000..a40c96cb9
--- /dev/null
+++ b/app/guid-node/workflow/-components/flowable-form/field/styles.scss
@@ -0,0 +1,28 @@
+.typeahead-container {
+    position: relative;
+}
+
+.typeahead-dropdown {
+    position: absolute;
+    z-index: 1000;
+    width: 100%;
+    max-height: 300px;
+    overflow-y: auto;
+    margin: 0;
+    padding: 0;
+    list-style: none;
+    background: #fff;
+    border: 1px solid #ccc;
+    border-top: 0;
+    border-radius: 0 0 4px 4px;
+    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
+}
+
+.typeahead-item {
+    padding: 6px 10px;
+    cursor: pointer;
+
+    &:hover {
+        background-color: #f5f5f5;
+    }
+}
diff --git a/app/guid-node/workflow/-components/flowable-form/field/template.hbs b/app/guid-node/workflow/-components/flowable-form/field/template.hbs
index 1813f6b58..4888b68df 100644
--- a/app/guid-node/workflow/-components/flowable-form/field/template.hbs
+++ b/app/guid-node/workflow/-components/flowable-form/field/template.hbs
@@ -1,4 +1,10 @@
-<div class="form-group {{if this.hasError 'has-error'}}" ...attributes>
+<div
+    class="form-group {{if this.hasError 'has-error'}}"
+    style={{this.widthStyle}}
+    {{did-insert this.onFieldInsert}}
+    {{will-destroy this.onFieldDestroy}}
+    ...attributes
+>
     {{#if this.isExpression}}
         {{#if this.hasProgressSteps}}
             {{#if this.remainingExpressionText}}
@@ -45,22 +51,40 @@
                 </label>
             </div>
         {{else if this.isSelect}}
-            <select
-                id={{this.fieldId}}
-                class="form-control"
-                disabled={{this.isReadOnly}}
-                required={{this.isRequired}}
-                {{on "change" this.handleChange}}
-            >
-                <option value="">{{t 'workflow.console.tasks.dialog.selectPlaceholder'}}</option>
-                {{#if this.hasOptions}}
+            {{#if this.isFreetext}}
+                <input
+                    id={{this.fieldId}}
+                    type="text"
+                    class="form-control"
+                    list="{{this.fieldId}}-options"
+                    value={{this.stringValue}}
+                    disabled={{this.isReadOnly}}
+                    required={{this.isRequired}}
+                    {{on "input" this.handleChange}}
+                />
+                <datalist id="{{this.fieldId}}-options">
                     {{#each this.optionsWithValue as |item|}}
-                        <option value={{item.value}} selected={{eq item.value this.stringValue}}>
-                            {{or item.option.name item.value}}
-                        </option>
+                        <option value={{or item.option.name item.value}} />
                     {{/each}}
-                {{/if}}
-            </select>
+                </datalist>
+            {{else}}
+                <select
+                    id={{this.fieldId}}
+                    class="form-control"
+                    disabled={{this.isReadOnly}}
+                    required={{this.isRequired}}
+                    {{on "change" this.handleChange}}
+                >
+                    <option value="">{{t 'workflow.console.tasks.dialog.selectPlaceholder'}}</option>
+                    {{#if this.hasOptions}}
+                        {{#each this.optionsWithValue as |item|}}
+                            <option value={{item.value}} selected={{eq item.value this.stringValue}}>
+                                {{or item.option.name item.value}}
+                            </option>
+                        {{/each}}
+                    {{/if}}
+                </select>
+            {{/if}}
         {{else if this.isRadio}}
             {{#each this.optionsWithValue as |item|}}
                 <div class="radio">
@@ -118,6 +142,7 @@
                 @multiSelect={{this.projectMetadataMultiSelect}}
                 @value={{this.currentValue}}
                 @onChange={{this.handleProjectMetadataSelection}}
+                @onLoadingChange={{this.handleLoadingChange}}
                 @disabled={{this.isReadOnly}}
             />
         {{else if this.isFileMetadataSelector}}
@@ -127,6 +152,7 @@
                 @multiSelect={{this.fileMetadataMultiSelect}}
                 @value={{this.currentValue}}
                 @onChange={{this.handleFileMetadataSelection}}
+                @onLoadingChange={{this.handleLoadingChange}}
                 @disabled={{this.isReadOnly}}
             />
         {{else if this.isFileSelector}}
@@ -134,6 +160,18 @@
                 @node={{@node}}
                 @value={{this.currentValue}}
                 @onChange={{this.handleFileSelectorChange}}
+                @onLoadingChange={{this.handleLoadingChange}}
+                @disabled={{this.isReadOnly}}
+            />
+        {{else if this.isFileUploader}}
+            <GuidNode::Workflow::-Components::FlowableForm::FileUploader
+                @node={{@node}}
+                @fieldId={{this.args.field.id}}
+                @path={{this.fileUploaderPlaceholder.path}}
+                @acceptExtensions={{this.fileUploaderPlaceholder.acceptExtensions}}
+                @value={{this.currentValue}}
+                @onChange={{this.handleFileUploaderChange}}
+                @onLoadingChange={{this.handleLoadingChange}}
                 @disabled={{this.isReadOnly}}
             />
         {{else if this.isExportTarget}}
@@ -141,6 +179,16 @@
                 @node={{@node}}
                 @value={{this.currentValue}}
                 @onChange={{this.handleExportTargetChange}}
+                @onLoadingChange={{this.handleLoadingChange}}
+                @disabled={{this.isReadOnly}}
+            />
+        {{else if this.isArrayInput}}
+            <GuidNode::Workflow::-Components::FlowableForm::ArrayInput
+                @fields={{this.arrayInputFields}}
+                @value={{this.currentValue}}
+                @node={{@node}}
+                @fieldHints={{this.arrayFieldHints}}
+                @onChange={{this.handleArrayInputChange}}
                 @disabled={{this.isReadOnly}}
             />
         {{else if this.isTextarea}}
@@ -162,6 +210,31 @@
                 required={{this.isRequired}}
                 {{on "change" this.handleChange}}
             />
+        {{else if this.hasSuggestion}}
+            <div local-class="typeahead-container">
+                <input
+                    id={{this.fieldId}}
+                    type="text"
+                    class="form-control"
+                    value={{this.stringValue}}
+                    disabled={{this.isReadOnly}}
+                    required={{this.isRequired}}
+                    {{on "input" this.onTypeaheadInput}}
+                    {{on "blur" this.onTypeaheadBlur}}
+                />
+                {{#if this.showSuggestions}}
+                    <ul local-class="typeahead-dropdown">
+                        {{#each this.suggestionItems as |item|}}
+                            <li
+                                local-class="typeahead-item"
+                                {{on "mousedown" (fn this.onSuggestionSelect item.key)}}
+                            >
+                                {{{item.html}}}
+                            </li>
+                        {{/each}}
+                    </ul>
+                {{/if}}
+            </div>
         {{else}}
             <input
                 id={{this.fieldId}}
@@ -175,7 +248,7 @@
             />
         {{/if}}
 
-        {{#if this.hasError}}
+        {{#if this.hasRequiredError}}
             <span class="help-block">{{t 'workflow.console.tasks.dialog.fieldRequired'}}</span>
         {{/if}}
     {{/if}}
diff --git a/app/guid-node/workflow/-components/flowable-form/file-metadata-selector/component.ts b/app/guid-node/workflow/-components/flowable-form/file-metadata-selector/component.ts
index 6a7f944c9..5c1e2e156 100644
--- a/app/guid-node/workflow/-components/flowable-form/file-metadata-selector/component.ts
+++ b/app/guid-node/workflow/-components/flowable-form/file-metadata-selector/component.ts
@@ -39,7 +39,6 @@ interface FileMetadataEntry {
     lastPartDepth: number;
     folder: boolean;
     title: string | null;
-    manager: string | null;
     url: string;
     style: string;
     visible: boolean;
@@ -53,6 +52,7 @@ interface FileMetadataSelectorArgs {
     multiSelect: boolean;
     value: FieldValueWithType | undefined;
     onChange: (valueWithType: FieldValueWithType) => void;
+    onLoadingChange?: (isLoading: boolean) => void;
     disabled: boolean;
 }
 
@@ -132,14 +132,12 @@ export default class FileMetadataSelector extends Component<FileMetadataSelector
         }
 
         // Create a map of file metadata by path
-        const metadataMap: {[key: string]: { title: string | null; manager: string | null; urlpath: string }} = {};
+        const metadataMap: {[key: string]: { title: string | null; urlpath: string }} = {};
         this.metadataNodeProject.files.forEach((entry: FileEntry) => {
             const item = entry.items.find(it => it.schema === this.schemaId);
             if (item) {
                 const titleJa = item.data['grdm-file:title-ja'];
                 const titleEn = item.data['grdm-file:title-en'];
-                const managerJa = item.data['grdm-file:data-man-name-ja'];
-                const managerEn = item.data['grdm-file:data-man-name-en'];
 
                 let title = null;
                 if (titleJa && titleJa.value) {
@@ -148,14 +146,7 @@ export default class FileMetadataSelector extends Component<FileMetadataSelector
                     title = titleEn.value;
                 }
 
-                let manager = null;
-                if (managerJa && managerJa.value) {
-                    manager = managerJa.value;
-                } else if (managerEn && managerEn.value) {
-                    manager = managerEn.value;
-                }
-
-                metadataMap[entry.path] = { title, manager, urlpath: entry.urlpath };
+                metadataMap[entry.path] = { title, urlpath: entry.urlpath };
             }
         });
 
@@ -181,7 +172,6 @@ export default class FileMetadataSelector extends Component<FileMetadataSelector
                 lastPartDepth: parts.length,
                 folder,
                 title: metadata ? metadata.title : null,
-                manager: metadata ? metadata.manager : null,
                 url: metadata ? `${pathJoin(baseURL, metadata.urlpath)}#edit-metadata` : '',
                 style: `margin: 0 0 0 ${parts.length * 20 + (folder ? 0 : 24)}px`,
                 visible: [...parts.slice(0, parts.length - 1).keys()]
@@ -201,7 +191,10 @@ export default class FileMetadataSelector extends Component<FileMetadataSelector
     initialize() {
         if (!this.isInitialized) {
             this.isInitialized = true;
-            this.loadFileMetadata.perform();
+            this.args.onLoadingChange?.(true);
+            this.loadFileMetadata.perform().finally(() => {
+                this.args.onLoadingChange?.(false);
+            });
         }
     }
 
diff --git a/app/guid-node/workflow/-components/flowable-form/file-metadata-selector/template.hbs b/app/guid-node/workflow/-components/flowable-form/file-metadata-selector/template.hbs
index 4aec2dc85..56c2727a6 100644
--- a/app/guid-node/workflow/-components/flowable-form/file-metadata-selector/template.hbs
+++ b/app/guid-node/workflow/-components/flowable-form/file-metadata-selector/template.hbs
@@ -85,9 +85,6 @@
                                 <div local-class="FileMetadataSelector__details" class="text-muted" style={{entry.style}}>
                                     <small>
                                         {{t 'workflow.console.tasks.dialog.fileMetadataSelector.path'}}: {{entry.path}}
-                                        {{#if entry.manager}}
-                                            | {{t 'workflow.console.tasks.dialog.fileMetadataSelector.manager'}}: {{entry.manager}}
-                                        {{/if}}
                                     </small>
                                 </div>
                             {{/unless}}
diff --git a/app/guid-node/workflow/-components/flowable-form/file-selector/component.ts b/app/guid-node/workflow/-components/flowable-form/file-selector/component.ts
index 873563337..147263047 100644
--- a/app/guid-node/workflow/-components/flowable-form/file-selector/component.ts
+++ b/app/guid-node/workflow/-components/flowable-form/file-selector/component.ts
@@ -19,6 +19,7 @@ interface FileSelectorArgs {
     node: Node;
     value: FieldValueWithType | undefined;
     onChange: (valueWithType: FieldValueWithType) => void;
+    onLoadingChange?: (isLoading: boolean) => void;
     disabled: boolean;
 }
 
@@ -61,7 +62,10 @@ export default class FileSelector extends Component<FileSelectorArgs> {
 
     @action
     initialize() {
-        this.loadProvider.perform();
+        this.args.onLoadingChange?.(true);
+        this.loadProvider.perform().finally(() => {
+            this.args.onLoadingChange?.(false);
+        });
     }
 
     private emitValue(): void {
diff --git a/app/guid-node/workflow/-components/flowable-form/file-uploader/component.ts b/app/guid-node/workflow/-components/flowable-form/file-uploader/component.ts
new file mode 100644
index 000000000..5544e3a78
--- /dev/null
+++ b/app/guid-node/workflow/-components/flowable-form/file-uploader/component.ts
@@ -0,0 +1,227 @@
+import { action } from '@ember/object';
+import Component from '@glimmer/component';
+import { tracked } from '@glimmer/tracking';
+import { inject as service } from '@ember/service';
+import { task } from 'ember-concurrency-decorators';
+import { all } from 'ember-concurrency';
+import DS from 'ember-data';
+import Toast from 'ember-toastr/services/toast';
+import $ from 'jquery';
+
+import File from 'ember-osf-web/models/file';
+import FileProviderModel from 'ember-osf-web/models/file-provider';
+import Node from 'ember-osf-web/models/node';
+import CurrentUser from 'ember-osf-web/services/current-user';
+
+import { FieldValueWithType } from '../types';
+
+interface FileUploaderArgs {
+    node: Node;
+    fieldId: string;
+    path: string;
+    acceptExtensions: string[];
+    value: FieldValueWithType | undefined;
+    onChange: (valueWithType: FieldValueWithType) => void;
+    onLoadingChange?: (isLoading: boolean) => void;
+    disabled: boolean;
+}
+
+export default class FileUploader extends Component<FileUploaderArgs> {
+    @service currentUser!: CurrentUser;
+    @service store!: DS.Store;
+    @service toast!: Toast;
+
+    @tracked allFiles: File[] = [];
+    @tracked targetDirectory: File | null = null;
+    @tracked loading = true;
+    @tracked filter = '';
+    @tracked sort = 'name';
+
+    dropzoneOptions = {
+        createImageThumbnails: false,
+        method: 'PUT',
+        withCredentials: true,
+        preventMultipleFiles: false,
+        acceptDirectories: false,
+        timeout: 1000 * 60 * 60 * 48,
+        maxFilesize: null,
+    };
+
+    get dropZoneId(): string {
+        return `file-uploader-${this.args.fieldId}`;
+    }
+
+    get files(): File[] {
+        let results = this.allFiles;
+        if (this.filter) {
+            const filterLower = this.filter.toLowerCase();
+            results = results.filter(f => f.name.toLowerCase().includes(filterLower));
+        }
+        if (this.sort) {
+            const reverse = this.sort.startsWith('-');
+            const key = reverse ? this.sort.slice(1) : this.sort;
+            results = results.slice().sort((a, b) => {
+                const av = (a as any)[key] || '';
+                const bv = (b as any)[key] || '';
+                return reverse ? String(bv).localeCompare(String(av)) : String(av).localeCompare(String(bv));
+            });
+        }
+        return results;
+    }
+
+    get hasRejectedFiles(): boolean {
+        if (this.args.acceptExtensions.length === 0) {
+            return false;
+        }
+        return this.allFiles.some(f => !this.isAcceptedExtension(f.name));
+    }
+
+    get rejectedFileNames(): string {
+        if (this.args.acceptExtensions.length === 0) {
+            return '';
+        }
+        return this.allFiles
+            .filter(f => !this.isAcceptedExtension(f.name))
+            .map(f => f.name)
+            .join(', ');
+    }
+
+    private isAcceptedExtension(filename: string): boolean {
+        if (this.args.acceptExtensions.length === 0) {
+            return true;
+        }
+        const pos = filename.lastIndexOf('.');
+        if (pos <= 0) {
+            return false;
+        }
+        const ext = filename.substring(pos).toLowerCase();
+        return this.args.acceptExtensions.includes(ext);
+    }
+
+    // --- Lifecycle ---
+
+    @action
+    initialize() {
+        this.args.onLoadingChange?.(true);
+        this.setupFolder.perform().finally(() => {
+            this.args.onLoadingChange?.(false);
+        });
+    }
+
+    // --- Folder setup ---
+
+    @task
+    setupFolder = task(function *(this: FileUploader) {
+        const providers: FileProviderModel[] = yield this.args.node.get('files');
+        const osf = providers.find((p: FileProviderModel) => p.name === 'osfstorage');
+        if (!osf) {
+            throw new Error('osfstorage provider not found');
+        }
+
+        let currentDir: File = yield osf.get('rootFolder');
+        const segments = this.args.path.split('/').filter(s => s.length > 0);
+
+        for (const segment of segments) {
+            let children: File[] = yield currentDir.loadAll('files');
+            let found = children.find(f => f.name === segment);
+            if (!found) {
+                const newFolderUrl = currentDir.get('links').new_folder;
+                yield this.currentUser.authenticatedAJAX({
+                    url: `${newFolderUrl}&name=${encodeURIComponent(segment)}`,
+                    type: 'PUT',
+                });
+                children = yield currentDir.loadAll('files');
+                found = children.find(f => f.name === segment);
+            }
+            currentDir = found!;
+        }
+
+        this.targetDirectory = currentDir;
+        const fileList: File[] = yield currentDir.loadAll('files');
+        this.allFiles = fileList;
+        this.loading = false;
+        this.emitValue();
+    });
+
+    // --- File operations ---
+
+    @task
+    addFile = task(function *(this: FileUploader, id: string) {
+        const duplicate = this.allFiles.find(f => f.id === id);
+        const file: File = yield this.store.findRecord(
+            'file', id,
+            duplicate ? {} : { adapterOptions: { query: { create_guid: 1 } } },
+        );
+        if (duplicate) {
+            this.allFiles = this.allFiles.filter(f => f.id !== id);
+        }
+        this.allFiles = [...this.allFiles, file];
+        this.emitValue();
+    });
+
+    @task
+    deleteFiles = task(function *(this: FileUploader, files: File[]) {
+        yield all(files.map(async (file: File) => {
+            await file.destroyRecord();
+        }));
+        const deletedIds = new Set(files.map(f => f.id));
+        this.allFiles = this.allFiles.filter(f => !deletedIds.has(f.id));
+        this.emitValue();
+    });
+
+    @task
+    renameFile = task(function *(
+        this: FileUploader,
+        file: File,
+        name: string,
+        conflict?: string,
+        conflictingFile?: File,
+    ) {
+        yield file.rename(name, conflict);
+        if (conflictingFile) {
+            this.allFiles = this.allFiles.filter(f => f.id !== conflictingFile.id);
+        }
+        this.emitValue();
+    });
+
+    @action
+    buildUrl(files: File[]): string | undefined {
+        if (!this.targetDirectory) {
+            return undefined;
+        }
+        return `${this.targetDirectory.links.upload}?${$.param({ name: files[0].name })}`;
+    }
+
+    @action
+    openFile(): void {
+        // no-op: file viewing not needed in workflow uploader
+    }
+
+    @action
+    moveFile(): void {
+        // no-op: file moving handled by ScriptTask
+    }
+
+    @action
+    handleUpdateFilter(filter: string): void {
+        this.filter = filter;
+    }
+
+    // --- Value emission ---
+
+    private emitValue(): void {
+        const files = this.allFiles.map(f => ({
+            path: f.path,
+            materialized: f.get('materializedPath') || `/${f.name}`,
+            enable: true,
+        }));
+        const result: { value: unknown; type: string; valid?: boolean } = {
+            value: { provider: 'osfstorage', files },
+            type: 'json',
+        };
+        if (this.hasRejectedFiles) {
+            result.valid = false;
+        }
+        this.args.onChange(result);
+    }
+}
diff --git a/app/guid-node/workflow/-components/flowable-form/file-uploader/styles.scss b/app/guid-node/workflow/-components/flowable-form/file-uploader/styles.scss
new file mode 100644
index 000000000..90a7ed0d6
--- /dev/null
+++ b/app/guid-node/workflow/-components/flowable-form/file-uploader/styles.scss
@@ -0,0 +1,7 @@
+.file-uploader {
+    :global([data-test-share-dialog-button]),
+    :global([data-test-view-button]),
+    :global([data-test-move-button]) {
+        display: none;
+    }
+}
diff --git a/app/guid-node/workflow/-components/flowable-form/file-uploader/template.hbs b/app/guid-node/workflow/-components/flowable-form/file-uploader/template.hbs
new file mode 100644
index 000000000..94cc1c5d3
--- /dev/null
+++ b/app/guid-node/workflow/-components/flowable-form/file-uploader/template.hbs
@@ -0,0 +1,29 @@
+<div local-class="file-uploader" {{did-insert this.initialize}}>
+    {{#if this.loading}}
+        <div class="text-center" style="padding: 20px;">
+            <LoadingIndicator @dark={{true}} />
+        </div>
+    {{else}}
+        <FileBrowser
+            @user={{this.currentUser.user}}
+            @items={{this.files}}
+            @filter={{this.filter}}
+            @sort={{this.sort}}
+            @canEdit={{not @disabled}}
+            @dropZoneId={{this.dropZoneId}}
+            @openFile={{this.openFile}}
+            @updateFilter={{this.handleUpdateFilter}}
+            @deleteFiles={{perform this.deleteFiles}}
+            @moveFile={{this.moveFile}}
+            @renameFile={{perform this.renameFile}}
+            @addFile={{perform this.addFile}}
+            @customBuildUrl={{this.buildUrl}}
+            @dropzoneOptions={{this.dropzoneOptions}}
+        />
+        {{#if this.hasRejectedFiles}}
+            <div class="alert alert-warning" style="margin-top: 8px;">
+                Extension not allowed: {{this.rejectedFileNames}}
+            </div>
+        {{/if}}
+    {{/if}}
+</div>
diff --git a/app/guid-node/workflow/-components/flowable-form/project-metadata-selector/component.ts b/app/guid-node/workflow/-components/flowable-form/project-metadata-selector/component.ts
index 726cc626a..1ecd1eb9f 100644
--- a/app/guid-node/workflow/-components/flowable-form/project-metadata-selector/component.ts
+++ b/app/guid-node/workflow/-components/flowable-form/project-metadata-selector/component.ts
@@ -37,6 +37,7 @@ interface ProjectMetadataSelectorArgs {
     multiSelect: boolean;
     value: FieldValueWithType | undefined;
     onChange: (valueWithType: FieldValueWithType) => void;
+    onLoadingChange?: (isLoading: boolean) => void;
     disabled: boolean;
 }
 
@@ -113,7 +114,10 @@ export default class ProjectMetadataSelector extends Component<ProjectMetadataSe
     initialize() {
         if (!this.isInitialized) {
             this.isInitialized = true;
-            this.loadMetadataRecords.perform();
+            this.args.onLoadingChange?.(true);
+            this.loadMetadataRecords.perform().finally(() => {
+                this.args.onLoadingChange?.(false);
+            });
         }
     }
 
@@ -122,21 +126,15 @@ export default class ProjectMetadataSelector extends Component<ProjectMetadataSe
         if (!this.args.value) {
             return;
         }
+        // Restore UI selection state from parent value.
+        // No need to notify back — parent already holds the value.
+        const guids = this.extractGuidsFromValue(this.args.value);
         if (this.isMultiSelect) {
-            if (this.selectedGuids.length > 0) {
-                return;
-            }
-            const guids = this.extractGuidsFromValue(this.args.value);
-            if (guids.length > 0) {
+            if (this.selectedGuids.length === 0 && guids.length > 0) {
                 this.selectedGuids = guids;
-                this.notifyRecordsSelected(guids);
-            }
-        } else if (!this.selectedGuid) {
-            const guid = this.extractGuidsFromValue(this.args.value)[0];
-            if (guid) {
-                this.selectedGuid = guid;
-                this.notifyRecordSelected(guid);
             }
+        } else if (!this.selectedGuid && guids[0]) {
+            this.selectedGuid = guids[0];
         }
     }
 
diff --git a/app/guid-node/workflow/-components/flowable-form/template.hbs b/app/guid-node/workflow/-components/flowable-form/template.hbs
index 29d62cc00..c4e9e4a86 100644
--- a/app/guid-node/workflow/-components/flowable-form/template.hbs
+++ b/app/guid-node/workflow/-components/flowable-form/template.hbs
@@ -1,13 +1,19 @@
 <div hidden {{did-insert this.initialize}} {{did-update this.initialize @form}}></div>
 
 {{#if this.hasFields}}
-    {{#each this.fields as |field|}}
+    {{#each this.visibleFields as |field|}}
         <GuidNode::Workflow::-Components::FlowableForm::Field
             @field={{field}}
             @fieldValues={{this.fieldValues}}
             @variables={{@variables}}
             @node={{@node}}
+            @fieldHints={{@fieldHints}}
+            @formContext={{this.formContext}}
+            @fieldContext={{@fieldContext}}
             @onChange={{this.handleFieldChange}}
+            @onLoadingChange={{this.handleFieldLoadingChange}}
+            @onRegister={{this.registerField}}
+            @onUnregister={{this.unregisterField}}
         />
     {{/each}}
 {{/if}}
diff --git a/app/guid-node/workflow/-components/flowable-form/types.ts b/app/guid-node/workflow/-components/flowable-form/types.ts
index c9f5f57c7..2dff03b8e 100644
--- a/app/guid-node/workflow/-components/flowable-form/types.ts
+++ b/app/guid-node/workflow/-components/flowable-form/types.ts
@@ -25,6 +25,7 @@ interface WorkflowTaskField {
 interface FieldValueWithType {
     value: unknown;
     type: string;
+    valid?: boolean;
 }
 
 export {
diff --git a/app/guid-node/workflow/-components/flowable-form/utils.ts b/app/guid-node/workflow/-components/flowable-form/utils.ts
index d47c6b33c..e02091a13 100644
--- a/app/guid-node/workflow/-components/flowable-form/utils.ts
+++ b/app/guid-node/workflow/-components/flowable-form/utils.ts
@@ -59,3 +59,55 @@ export function extractExportTarget(field: WorkflowTaskField): boolean {
     }
     return field.placeholder === '_EXPORT_TARGET()';
 }
+
+export interface ArrayInputPlaceholder {
+    fields: WorkflowTaskField[];
+}
+
+export interface FileUploaderPlaceholder {
+    path: string;
+    acceptExtensions: string[];
+}
+
+export function extractFileUploader(field: WorkflowTaskField): FileUploaderPlaceholder | null {
+    if (field.type !== 'multi-line-text') {
+        return null;
+    }
+    const { placeholder } = field;
+    if (!placeholder) {
+        return null;
+    }
+    const match = placeholder.match(/^_FILE_UPLOADER\((.+)\)$/);
+    if (!match) {
+        return null;
+    }
+    const raw = match[1];
+    const segments = raw.split(',').map(s => s.trim());
+    const extStart = segments.findIndex(s => s.startsWith('.'));
+    let path: string;
+    let acceptExtensions: string[];
+    if (extStart === -1) {
+        path = raw.trim();
+        acceptExtensions = [];
+    } else {
+        path = segments.slice(0, extStart).join(',').trim();
+        acceptExtensions = segments.slice(extStart).map(e => e.toLowerCase());
+    }
+    return { path, acceptExtensions };
+}
+
+export function extractArrayInput(field: WorkflowTaskField): ArrayInputPlaceholder | null {
+    if (field.type !== 'multi-line-text') {
+        return null;
+    }
+    const { placeholder } = field;
+    if (!placeholder) {
+        return null;
+    }
+    const match = placeholder.match(/^_ARRAY_INPUT\((.+)\)$/s);
+    if (!match) {
+        return null;
+    }
+    const fields: WorkflowTaskField[] = JSON.parse(match[1]);
+    return { fields };
+}
diff --git a/app/guid-node/workflow/-components/progress-sidebar/component.ts b/app/guid-node/workflow/-components/progress-sidebar/component.ts
index 356749727..b56532925 100644
--- a/app/guid-node/workflow/-components/progress-sidebar/component.ts
+++ b/app/guid-node/workflow/-components/progress-sidebar/component.ts
@@ -12,6 +12,7 @@ import {
 interface ProgressSidebarArgs {
     form?: WorkflowTaskForm;
     variables?: WorkflowVariable[];
+    wizardSteps?: ProgressStep[];
 }
 
 export default class ProgressSidebar extends Component<ProgressSidebarArgs> {
@@ -26,10 +27,16 @@ export default class ProgressSidebar extends Component<ProgressSidebarArgs> {
     }
 
     get hasProgressSteps(): boolean {
+        if (this.args.wizardSteps) {
+            return this.args.wizardSteps.length > 0;
+        }
         return this.parsedExpression.steps.length > 0;
     }
 
     get progressSteps(): ProgressStep[] {
+        if (this.args.wizardSteps) {
+            return this.args.wizardSteps;
+        }
         return this.parsedExpression.steps;
     }
 }
diff --git a/app/guid-node/workflow/-components/task-dialog/component.ts b/app/guid-node/workflow/-components/task-dialog/component.ts
index 699f90be1..80b0f6664 100644
--- a/app/guid-node/workflow/-components/task-dialog/component.ts
+++ b/app/guid-node/workflow/-components/task-dialog/component.ts
@@ -6,6 +6,7 @@ import { tracked } from '@glimmer/tracking';
 import Intl from 'ember-intl/services/intl';
 import Node from 'ember-osf-web/models/node';
 
+import { extractWizardConfig, WizardNavigation } from '../wizard-form/types';
 import {
     TaskDialogSubmission,
     WorkflowTaskDetail,
@@ -29,6 +30,7 @@ export default class WorkflowTaskDialog extends Component<WorkflowTaskDialogArgs
     @service intl!: Intl;
     @tracked formVariables: WorkflowVariable[] = [];
     @tracked isFormValid = true;
+    @tracked wizardNav: WizardNavigation | null = null;
 
     get hasTask(): boolean {
         return Boolean(this.args.task);
@@ -64,6 +66,11 @@ export default class WorkflowTaskDialog extends Component<WorkflowTaskDialogArgs
         return assignee;
     }
 
+    get isWizardMode(): boolean {
+        const { task } = this.args;
+        return Boolean(task && task.form && extractWizardConfig(task.form.fields));
+    }
+
     get canComplete(): boolean {
         const { task } = this.args;
         return !task || task.can_complete !== false;
@@ -83,6 +90,11 @@ export default class WorkflowTaskDialog extends Component<WorkflowTaskDialogArgs
         this.isFormValid = isValid;
     }
 
+    @action
+    handleWizardNavigationChange(nav: WizardNavigation): void {
+        this.wizardNav = nav;
+    }
+
     @action
     handleSubmit(): void {
         if (!this.args.task) {
diff --git a/app/guid-node/workflow/-components/task-dialog/template.hbs b/app/guid-node/workflow/-components/task-dialog/template.hbs
index ccb591051..3f0ec27d3 100644
--- a/app/guid-node/workflow/-components/task-dialog/template.hbs
+++ b/app/guid-node/workflow/-components/task-dialog/template.hbs
@@ -1,5 +1,5 @@
 {{#if @open}}
-    <div class="modal fade in workflow-task-dialog" tabindex="-1" role="dialog" aria-modal="true" style="display: block;">
+    <div class="modal fade in workflow-task-dialog" tabindex="-1" role="dialog" aria-modal="true" style="display: block; z-index: 1030;">
         <div class="modal-dialog modal-lg" role="document">
             <div class="modal-content">
                 <div class="modal-header">
@@ -29,6 +29,7 @@
                             <GuidNode::Workflow::-Components::ProgressSidebar
                                 @form={{@task.form}}
                                 @variables={{@task.variables}}
+                                @wizardSteps={{if this.wizardNav this.wizardNav.progressSteps}}
                             />
                             <div class="task-dialog__content">
                                 <dl class="dl-horizontal">
@@ -56,7 +57,10 @@
                                     @form={{@task.form}}
                                     @variables={{@task.variables}}
                                     @node={{@node}}
+                                    @taskId={{@task.id}}
                                     @onChange={{this.handleFormChange}}
+                                    @onSubmit={{this.handleSubmit}}
+                                    @onWizardNavigationChange={{this.handleWizardNavigationChange}}
                                 />
                             </div>
                         </div>
@@ -65,7 +69,42 @@
                     {{/if}}
                 </div>
                 <div class="modal-footer">
-                    {{#if this.hasTask}}
+                    {{#if (and this.hasTask this.isWizardMode this.wizardNav)}}
+                        {{#if (and this.wizardNav.allowBack (not this.wizardNav.isFirstPage))}}
+                            <button
+                                type="button"
+                                class="btn btn-default"
+                                disabled={{@isSubmitting}}
+                                {{on "click" this.wizardNav.goBack}}
+                            >
+                                {{t 'workflow.console.tasks.dialog.wizard.back'}}
+                            </button>
+                        {{/if}}
+                        {{#if this.wizardNav.isLastPage}}
+                            <button
+                                type="button"
+                                class="btn btn-primary"
+                                disabled={{or (not this.canComplete) (not this.wizardNav.canGoNext) @isSubmitting}}
+                                {{on "click" this.wizardNav.submit}}
+                            >
+                                {{#if @isSubmitting}}
+                                    <i class="fa fa-spinner fa-spin"></i>
+                                    {{t 'workflow.console.tasks.dialog.submitting'}}
+                                {{else}}
+                                    {{t 'workflow.console.tasks.dialog.submit'}}
+                                {{/if}}
+                            </button>
+                        {{else}}
+                            <button
+                                type="button"
+                                class="btn btn-primary"
+                                disabled={{not this.wizardNav.canGoNext}}
+                                {{on "click" this.wizardNav.goNext}}
+                            >
+                                {{t 'workflow.console.tasks.dialog.wizard.next'}}
+                            </button>
+                        {{/if}}
+                    {{else if (and this.hasTask (not this.isWizardMode))}}
                         <button
                             type="button"
                             class="btn btn-primary"
@@ -88,5 +127,5 @@
             </div>
         </div>
     </div>
-    <div class="modal-backdrop fade in"></div>
+    <div class="modal-backdrop fade in" style="z-index: 1020;"></div>
 {{/if}}
diff --git a/app/guid-node/workflow/-components/task-form/component.ts b/app/guid-node/workflow/-components/task-form/component.ts
index f40b2fdd2..5b7e4e68c 100644
--- a/app/guid-node/workflow/-components/task-form/component.ts
+++ b/app/guid-node/workflow/-components/task-form/component.ts
@@ -6,15 +6,23 @@ import {
     WorkflowVariable,
 } from '../../types';
 import { isCedarForm, isFlowableForm } from '../../utils';
+import { extractWizardConfig, WizardNavigation } from '../wizard-form/types';
 
 interface TaskFormArgs {
     form: WorkflowTaskForm;
     variables: WorkflowVariable[];
     node?: Node;
+    taskId?: string;
     onChange: (variables: WorkflowVariable[], isValid: boolean) => void;
+    onSubmit?: () => void;
+    onWizardNavigationChange?: (nav: WizardNavigation) => void;
 }
 
 export default class TaskForm extends Component<TaskFormArgs> {
+    get hasWizardForm(): boolean {
+        return isFlowableForm(this.args.form) && extractWizardConfig(this.args.form.fields) !== null;
+    }
+
     get hasFlowableForm(): boolean {
         return isFlowableForm(this.args.form);
     }
@@ -24,6 +32,6 @@ export default class TaskForm extends Component<TaskFormArgs> {
     }
 
     get noFormAvailable(): boolean {
-        return !this.hasFlowableForm && !this.hasCedarForm;
+        return !this.hasWizardForm && !this.hasFlowableForm && !this.hasCedarForm;
     }
 }
diff --git a/app/guid-node/workflow/-components/task-form/template.hbs b/app/guid-node/workflow/-components/task-form/template.hbs
index eaac592c9..d4a38c8ef 100644
--- a/app/guid-node/workflow/-components/task-form/template.hbs
+++ b/app/guid-node/workflow/-components/task-form/template.hbs
@@ -1,4 +1,14 @@
-{{#if this.hasFlowableForm}}
+{{#if this.hasWizardForm}}
+    <GuidNode::Workflow::-Components::WizardForm
+        @form={{@form}}
+        @variables={{@variables}}
+        @node={{@node}}
+        @taskId={{@taskId}}
+        @onChange={{@onChange}}
+        @onSubmit={{@onSubmit}}
+        @onNavigationChange={{@onWizardNavigationChange}}
+    />
+{{else if this.hasFlowableForm}}
     <GuidNode::Workflow::-Components::FlowableForm
         @form={{@form}}
         @variables={{@variables}}
diff --git a/app/guid-node/workflow/-components/wizard-form/component.ts b/app/guid-node/workflow/-components/wizard-form/component.ts
new file mode 100644
index 000000000..7115112e9
--- /dev/null
+++ b/app/guid-node/workflow/-components/wizard-form/component.ts
@@ -0,0 +1,315 @@
+import { action } from '@ember/object';
+import Component from '@glimmer/component';
+import { tracked } from '@glimmer/tracking';
+
+import Node from 'ember-osf-web/models/node';
+import {
+    WorkflowTaskForm,
+    WorkflowVariable,
+} from '../../types';
+import { resolveFlowableType } from '../flowable-form/component';
+import { FieldValueWithType } from '../flowable-form/types';
+import { clearDraft, collectExpiredDrafts, loadDraft, saveDraft } from './draft-utils';
+import { buildProgressTree, flattenPages, getVisiblePages } from './page-utils';
+import { extractWizardConfig, RdmWizard, WizardNavigation } from './types';
+
+interface WizardFormArgs {
+    form: WorkflowTaskForm;
+    variables?: WorkflowVariable[];
+    node?: Node;
+    taskId?: string;
+    onChange: (variables: WorkflowVariable[], isValid: boolean) => void;
+    onSubmit: () => void;
+    onNavigationChange?: (nav: WizardNavigation) => void;
+}
+
+const DISPLAY_ONLY_TYPES = new Set([
+    'expression', 'hyperlink', 'link', 'headline', 'headline-with-line', 'spacer', 'horizontal-line',
+]);
+
+export default class WizardForm extends Component<WizardFormArgs> {
+    @tracked currentPageId = '';
+    @tracked currentPageForm: WorkflowTaskForm = { fields: [] };
+    @tracked currentPageVariables: WorkflowVariable[] = [];
+    @tracked visitedPageIds: Set<string> = new Set();
+    @tracked pageTitle = '';
+    @tracked currentPageValid = true;
+    @tracked currentPageLoading = false;
+
+    private allFieldValues: Record<string, FieldValueWithType> = {};
+    private draftDebounceTimer: ReturnType<typeof setTimeout> | null = null;
+
+    get wizard(): RdmWizard {
+        return extractWizardConfig(this.args.form.fields)!;
+    }
+
+    get fieldHints() {
+        return this.wizard.fieldHints;
+    }
+
+    get fieldContext(): Record<string, unknown> {
+        return this.getFieldContext();
+    }
+
+    get allowBack(): boolean {
+        const nav = this.wizard.navigation;
+        return nav ? nav.allowBack !== false : true;
+    }
+
+    @action
+    initialize(): void {
+        collectExpiredDrafts();
+
+        const variables = this.args.variables || [];
+        const allFields = this.args.form.fields || [];
+        const nextValues: Record<string, FieldValueWithType> = {};
+
+        for (const field of allFields) {
+            const variable = variables.find(v => v.name === field.id);
+            if (variable) {
+                nextValues[field.id] = { value: variable.value, type: variable.type };
+            } else {
+                let initial = null;
+                if (field.value !== undefined) {
+                    initial = field.value;
+                } else if (field.defaultValue !== undefined) {
+                    initial = field.defaultValue;
+                }
+                nextValues[field.id] = { value: initial, type: resolveFlowableType(field.type) };
+            }
+        }
+
+        // Restore draft if available
+        const taskId = this.args.taskId;
+        const formKey = this.args.form.key || '';
+        let restoredPageId = '';
+        if (taskId) {
+            const draft = loadDraft(taskId, formKey);
+            if (draft) {
+                for (const [id, fv] of Object.entries(draft.fieldValues)) {
+                    if (id in nextValues) {
+                        nextValues[id] = { value: fv.value, type: fv.type };
+                    }
+                }
+                restoredPageId = draft.currentPageId;
+            }
+        }
+
+        this.allFieldValues = nextValues;
+
+        // Set initial page
+        const pages = this.getVisiblePages();
+        if (restoredPageId && pages.some(p => p.id === restoredPageId)) {
+            this.currentPageId = restoredPageId;
+            const visited = new Set<string>();
+            for (const p of pages) {
+                if (p.id === restoredPageId) {
+                    break;
+                }
+                visited.add(p.id);
+            }
+            this.visitedPageIds = visited;
+        } else if (pages.length > 0) {
+            this.currentPageId = pages[0].id;
+            this.visitedPageIds = new Set();
+        }
+
+        this.updatePageForm();
+        this.emitNavigation();
+        this.emitAllVariables();
+    }
+
+    @action
+    handlePageFieldChange(pageVariables: WorkflowVariable[], isValid: boolean, isLoading: boolean): void {
+        for (const v of pageVariables) {
+            this.allFieldValues[v.name] = { value: v.value, type: v.type };
+        }
+        this.currentPageValid = isValid;
+        this.currentPageLoading = isLoading;
+        this.emitNavigation();
+        this.scheduleDraftSave();
+        this.emitAllVariables();
+    }
+
+    @action
+    goNext(): void {
+        const pages = this.getVisiblePages();
+        const idx = pages.findIndex(p => p.id === this.currentPageId);
+        if (idx < pages.length - 1) {
+            const visited = new Set(this.visitedPageIds);
+            visited.add(this.currentPageId);
+            this.visitedPageIds = visited;
+            this.currentPageId = pages[idx + 1].id;
+            this.updatePageForm();
+            this.scrollToTop();
+
+            this.emitNavigation();
+            this.saveDraftNow();
+        }
+    }
+
+    @action
+    goBack(): void {
+        const pages = this.getVisiblePages();
+        const idx = pages.findIndex(p => p.id === this.currentPageId);
+        if (idx > 0) {
+            this.currentPageId = pages[idx - 1].id;
+            this.updatePageForm();
+            this.scrollToTop();
+
+            this.emitNavigation();
+            this.saveDraftNow();
+        }
+    }
+
+    @action
+    goToPage(pageId: string): void {
+        const pages = this.getVisiblePages();
+        if (pages.some(p => p.id === pageId)) {
+            this.currentPageId = pageId;
+            this.updatePageForm();
+            this.scrollToTop();
+
+            this.emitNavigation();
+        }
+    }
+
+    @action
+    handleFinalSubmit(): void {
+        const taskId = this.args.taskId;
+        if (taskId) {
+            clearDraft(taskId);
+        }
+        this.emitAllVariables();
+        this.args.onSubmit();
+    }
+
+    private emitNavigation(): void {
+        if (!this.args.onNavigationChange) {
+            return;
+        }
+        const pages = this.getVisiblePages();
+        const idx = pages.findIndex(p => p.id === this.currentPageId);
+        this.args.onNavigationChange({
+            isFirstPage: idx <= 0,
+            isLastPage: idx >= pages.length - 1,
+            allowBack: this.allowBack,
+            canGoNext: this.currentPageValid && !this.currentPageLoading,
+            progressSteps: buildProgressTree(
+                this.wizard.pages,
+                this.currentPageId,
+                this.visitedPageIds,
+                this.getFieldContext(),
+            ),
+            goNext: () => this.goNext(),
+            goBack: () => this.goBack(),
+            submit: () => this.handleFinalSubmit(),
+        });
+    }
+
+    private getFieldContext(): Record<string, unknown> {
+        const ctx: Record<string, unknown> = {};
+        for (const v of this.args.variables || []) {
+            ctx[v.name] = v.value;
+        }
+        for (const [id, fv] of Object.entries(this.allFieldValues)) {
+            ctx[id] = fv.value;
+        }
+        return ctx;
+    }
+
+    private getVisiblePages() {
+        return getVisiblePages(this.wizard.pages, this.getFieldContext());
+    }
+
+    private updatePageForm(): void {
+        const allPages = flattenPages(this.wizard.pages);
+        const page = allPages.find(p => p.id === this.currentPageId);
+        if (!page) {
+            this.currentPageForm = { fields: [] };
+            return;
+        }
+        const fieldIdSet = new Set(page.fieldIds);
+        const fields = (this.args.form.fields || []).filter(f => fieldIdSet.has(f.id));
+        this.currentPageForm = { fields };
+        this.pageTitle = page.title;
+
+        // Resolve alias: for alias fields on this page, use source field's value
+        const alias = this.wizard.alias || {};
+        for (const field of fields) {
+            const sourceId = alias[field.id];
+            if (!sourceId) {
+                continue;
+            }
+            const source = this.allFieldValues[sourceId];
+            if (source) {
+                this.allFieldValues[field.id] = { ...this.allFieldValues[field.id], value: source.value };
+            }
+        }
+
+        // Build variables: task variables first, then all field values (field values take precedence)
+        const vars: WorkflowVariable[] = [];
+        const emitted = new Set<string>();
+        for (const [id, fv] of Object.entries(this.allFieldValues)) {
+            vars.push({ name: id, value: fv.value, type: fv.type });
+            emitted.add(id);
+        }
+        for (const v of this.args.variables || []) {
+            if (!emitted.has(v.name)) {
+                vars.push(v);
+            }
+        }
+        this.currentPageVariables = vars;
+    }
+
+    private emitAllVariables(): void {
+        const allFields = this.args.form.fields || [];
+        const alias = this.wizard.alias || {};
+        const variables: WorkflowVariable[] = [];
+        for (const field of allFields) {
+            if (DISPLAY_ONLY_TYPES.has(field.type.toLowerCase())) {
+                continue;
+            }
+            if (field.readOnly) {
+                // readOnly alias: resolve from source field's current value
+                const sourceId = alias[field.id];
+                if (sourceId) {
+                    const source = this.allFieldValues[sourceId];
+                    const fv = this.allFieldValues[field.id];
+                    if (source && fv) {
+                        variables.push({ name: field.id, value: source.value, type: fv.type });
+                    }
+                }
+                continue;
+            }
+            const fv = this.allFieldValues[field.id];
+            if (fv) {
+                variables.push({ name: field.id, value: fv.value, type: fv.type });
+            }
+        }
+        this.args.onChange(variables, true);
+    }
+
+    private scrollToTop(): void {
+        document.querySelector('.task-dialog__body')!.scrollTop = 0;
+    }
+
+    private scheduleDraftSave(): void {
+        if (this.draftDebounceTimer) {
+            clearTimeout(this.draftDebounceTimer);
+        }
+        this.draftDebounceTimer = setTimeout(() => this.saveDraftNow(), 1000);
+    }
+
+    private saveDraftNow(): void {
+        const taskId = this.args.taskId;
+        if (!taskId) {
+            return;
+        }
+        const values: Record<string, { value: unknown; type: string }> = {};
+        for (const [id, fv] of Object.entries(this.allFieldValues)) {
+            values[id] = { value: fv.value, type: fv.type };
+        }
+        saveDraft(taskId, this.args.form.key || '', this.currentPageId, values);
+    }
+}
diff --git a/app/guid-node/workflow/-components/wizard-form/draft-utils.ts b/app/guid-node/workflow/-components/wizard-form/draft-utils.ts
new file mode 100644
index 000000000..ccbb42710
--- /dev/null
+++ b/app/guid-node/workflow/-components/wizard-form/draft-utils.ts
@@ -0,0 +1,91 @@
+const PREFIX = 'rdm-wizard:';
+const TTL_MS = 7 * 24 * 60 * 60 * 1000; // 7 days
+
+interface DraftFieldValue {
+    value: unknown;
+    type: string;
+}
+
+interface WizardDraft {
+    formKey: string;
+    currentPageId: string;
+    fieldValues: Record<string, DraftFieldValue>;
+    savedAt: number;
+}
+
+function storageKey(taskId: string): string {
+    return `${PREFIX}${taskId}`;
+}
+
+export function saveDraft(
+    taskId: string,
+    formKey: string,
+    currentPageId: string,
+    fieldValues: Record<string, DraftFieldValue>,
+): void {
+    try {
+        const draft: WizardDraft = {
+            formKey,
+            currentPageId,
+            fieldValues,
+            savedAt: Date.now(),
+        };
+        localStorage.setItem(storageKey(taskId), JSON.stringify(draft));
+    } catch {
+        // localStorage unavailable or full — silently skip
+    }
+}
+
+export function loadDraft(taskId: string, formKey: string): WizardDraft | null {
+    try {
+        const raw = localStorage.getItem(storageKey(taskId));
+        if (!raw) {
+            return null;
+        }
+        const draft = JSON.parse(raw) as WizardDraft;
+        if (draft.formKey !== formKey) {
+            localStorage.removeItem(storageKey(taskId));
+            return null;
+        }
+        if (Date.now() - draft.savedAt > TTL_MS) {
+            localStorage.removeItem(storageKey(taskId));
+            return null;
+        }
+        return draft;
+    } catch {
+        return null;
+    }
+}
+
+export function clearDraft(taskId: string): void {
+    try {
+        localStorage.removeItem(storageKey(taskId));
+    } catch {
+        // silently skip
+    }
+}
+
+export function collectExpiredDrafts(): void {
+    try {
+        const now = Date.now();
+        for (let i = localStorage.length - 1; i >= 0; i--) {
+            const key = localStorage.key(i);
+            if (!key || !key.startsWith(PREFIX)) {
+                continue;
+            }
+            try {
+                const raw = localStorage.getItem(key);
+                if (raw) {
+                    const draft = JSON.parse(raw) as WizardDraft;
+                    if (now - draft.savedAt > TTL_MS) {
+                        localStorage.removeItem(key);
+                    }
+                }
+            } catch {
+                localStorage.removeItem(key!);
+            }
+        }
+    } catch {
+        // silently skip
+    }
+}
diff --git a/app/guid-node/workflow/-components/wizard-form/expression-evaluator.ts b/app/guid-node/workflow/-components/wizard-form/expression-evaluator.ts
new file mode 100644
index 000000000..b8022c5b3
--- /dev/null
+++ b/app/guid-node/workflow/-components/wizard-form/expression-evaluator.ts
@@ -0,0 +1,185 @@
+/**
+ * RDM Wizard visibility expression evaluator.
+ *
+ * Grammar (recursive descent):
+ *   expression  = or_expr
+ *   or_expr     = and_expr ( "||" and_expr )*
+ *   and_expr    = not_expr ( "&&" not_expr )*
+ *   not_expr    = "!" not_expr | compare
+ *   compare     = primary ( ( "==" | "!=" ) primary )?
+ *   primary     = "(" expression ")" | "true" | "false" | string_literal | field_ref
+ *   string_literal = "'" [^']* "'"
+ *   field_ref      = [^&|!=()' \t]+
+ */
+
+const STOP_CHARS = new Set(['&', '|', '!', '=', '(', ')', "'", ' ', '\t']);
+
+class Parser {
+    private pos = 0;
+    constructor(private source: string) {}
+
+    parse(context: Record<string, unknown>): boolean {
+        this.skipWs();
+        if (this.pos >= this.source.length) {
+            throw new Error('empty expression');
+        }
+        const result = this.orExpr(context);
+        this.skipWs();
+        if (this.pos < this.source.length) {
+            throw new Error(`unexpected character '${this.source[this.pos]}' at position ${this.pos}`);
+        }
+        return result;
+    }
+
+    private skipWs(): void {
+        while (this.pos < this.source.length && (this.source[this.pos] === ' ' || this.source[this.pos] === '\t')) {
+            this.pos++;
+        }
+    }
+
+    private peek(s: string): boolean {
+        return this.source.substr(this.pos, s.length) === s;
+    }
+
+    private consume(s: string): void {
+        if (!this.peek(s)) {
+            throw new Error(`expected '${s}' at position ${this.pos}`);
+        }
+        this.pos += s.length;
+    }
+
+    private orExpr(ctx: Record<string, unknown>): boolean {
+        let result = this.andExpr(ctx);
+        while (this.pos < this.source.length) {
+            this.skipWs();
+            if (this.peek('||')) {
+                this.consume('||');
+                this.skipWs();
+                const right = this.andExpr(ctx);
+                result = result || right;
+            } else {
+                break;
+            }
+        }
+        return result;
+    }
+
+    private andExpr(ctx: Record<string, unknown>): boolean {
+        let result = this.notExpr(ctx);
+        while (this.pos < this.source.length) {
+            this.skipWs();
+            if (this.peek('&&')) {
+                this.consume('&&');
+                this.skipWs();
+                const right = this.notExpr(ctx);
+                result = result && right;
+            } else {
+                break;
+            }
+        }
+        return result;
+    }
+
+    private notExpr(ctx: Record<string, unknown>): boolean {
+        this.skipWs();
+        if (this.pos < this.source.length && this.source[this.pos] === '!' && !this.peek('!=')) {
+            this.pos++;
+            this.skipWs();
+            return !this.notExpr(ctx);
+        }
+        return this.compare(ctx);
+    }
+
+    private compare(ctx: Record<string, unknown>): boolean {
+        const left = this.primary(ctx);
+        this.skipWs();
+        if (this.pos < this.source.length) {
+            if (this.peek('==')) {
+                this.consume('==');
+                this.skipWs();
+                const right = this.primary(ctx);
+                return left === right;
+            }
+            if (this.peek('!=')) {
+                this.consume('!=');
+                this.skipWs();
+                const right = this.primary(ctx);
+                return left !== right;
+            }
+        }
+        return toBool(left);
+    }
+
+    private primary(ctx: Record<string, unknown>): unknown {
+        this.skipWs();
+        if (this.pos >= this.source.length) {
+            throw new Error('unexpected end of expression');
+        }
+
+        const ch = this.source[this.pos];
+
+        if (ch === '(') {
+            this.pos++;
+            this.skipWs();
+            const result = this.orExpr(ctx);
+            this.skipWs();
+            this.consume(')');
+            return result;
+        }
+
+        if (ch === "'") {
+            return this.stringLiteral();
+        }
+
+        if (this.peek('true') && (this.pos + 4 >= this.source.length || STOP_CHARS.has(this.source[this.pos + 4]))) {
+            this.pos += 4;
+            return true;
+        }
+
+        if (this.peek('false') && (this.pos + 5 >= this.source.length || STOP_CHARS.has(this.source[this.pos + 5]))) {
+            this.pos += 5;
+            return false;
+        }
+
+        return this.fieldRef(ctx);
+    }
+
+    private stringLiteral(): string {
+        this.consume("'");
+        const start = this.pos;
+        const end = this.source.indexOf("'", start);
+        if (end === -1) {
+            throw new Error('unterminated string literal');
+        }
+        this.pos = end + 1;
+        return this.source.substring(start, end);
+    }
+
+    private fieldRef(ctx: Record<string, unknown>): unknown {
+        const start = this.pos;
+        while (this.pos < this.source.length && !STOP_CHARS.has(this.source[this.pos])) {
+            this.pos++;
+        }
+        const ref = this.source.substring(start, this.pos);
+        if (!ref) {
+            throw new Error(`expected field reference at position ${start}`);
+        }
+        const val = ctx[ref];
+        if (val === undefined || val === null) {
+            return false;
+        }
+        return val;
+    }
+}
+
+function toBool(value: unknown): boolean {
+    if (value === false || value === null || value === undefined || value === '') {
+        return false;
+    }
+    return true;
+}
+
+export function evaluateExpression(expr: string, context: Record<string, unknown>): boolean {
+    const result = new Parser(expr).parse(context);
+    return toBool(result);
+}
diff --git a/app/guid-node/workflow/-components/wizard-form/page-utils.ts b/app/guid-node/workflow/-components/wizard-form/page-utils.ts
new file mode 100644
index 000000000..42db8c4ca
--- /dev/null
+++ b/app/guid-node/workflow/-components/wizard-form/page-utils.ts
@@ -0,0 +1,133 @@
+import { ProgressStep, StepStatus } from '../progress-sidebar/utils';
+import { evaluateExpression } from './expression-evaluator';
+import { RdmWizardPage } from './types';
+
+export interface FlatPage {
+    id: string;
+    title: string;
+    fieldIds: string[];
+}
+
+function isPageVisible(page: RdmWizardPage, context: Record<string, unknown>): boolean {
+    if (page.visible === undefined || page.visible === true) {
+        return true;
+    }
+    if (page.visible === false) {
+        return false;
+    }
+    return evaluateExpression(page.visible, context);
+}
+
+export function flattenPages(pages: RdmWizardPage[]): FlatPage[] {
+    const result: FlatPage[] = [];
+    for (const page of pages) {
+        if (page.type === 'group') {
+            if (page.pages) {
+                result.push(...flattenPages(page.pages));
+            }
+        } else {
+            result.push({
+                id: page.id,
+                title: page.title,
+                fieldIds: page.fields || [],
+            });
+        }
+    }
+    return result;
+}
+
+export function getVisiblePages(
+    pages: RdmWizardPage[],
+    context: Record<string, unknown>,
+    parentVisible = true,
+): FlatPage[] {
+    const result: FlatPage[] = [];
+    for (const page of pages) {
+        const visible = parentVisible && isPageVisible(page, context);
+        if (!visible) {
+            continue;
+        }
+        if (page.type === 'group') {
+            if (page.pages) {
+                result.push(...getVisiblePages(page.pages, context, visible));
+            }
+        } else {
+            result.push({
+                id: page.id,
+                title: page.title,
+                fieldIds: page.fields || [],
+            });
+        }
+    }
+    return result;
+}
+
+function resolveStatus(
+    pageId: string,
+    currentPageId: string,
+    visitedPageIds: Set<string>,
+): StepStatus {
+    if (pageId === currentPageId) {
+        return 'current';
+    }
+    if (visitedPageIds.has(pageId)) {
+        return 'completed';
+    }
+    return 'pending';
+}
+
+function hasCurrentInTree(steps: ProgressStep[]): boolean {
+    for (const step of steps) {
+        if (step.status === 'current' || hasCurrentInTree(step.children)) {
+            return true;
+        }
+    }
+    return false;
+}
+
+export function buildProgressTree(
+    pages: RdmWizardPage[],
+    currentPageId: string,
+    visitedPageIds: Set<string>,
+    context: Record<string, unknown>,
+    level = 0,
+    parentVisible = true,
+): ProgressStep[] {
+    const result: ProgressStep[] = [];
+    for (const page of pages) {
+        const visible = parentVisible && isPageVisible(page, context);
+        if (!visible) {
+            continue;
+        }
+        if (page.type === 'group') {
+            const children = page.pages
+                ? buildProgressTree(page.pages, currentPageId, visitedPageIds, context, level + 1, visible)
+                : [];
+            const isActive = hasCurrentInTree(children);
+            // Determine group status from children
+            let status: StepStatus = 'pending';
+            if (isActive) {
+                status = 'current';
+            } else if (children.length > 0 && children.every(c => c.status === 'completed')) {
+                status = 'completed';
+            }
+            result.push({
+                name: page.title,
+                status,
+                level,
+                children,
+                isActive,
+            });
+        } else {
+            const status = resolveStatus(page.id, currentPageId, visitedPageIds);
+            result.push({
+                name: page.title,
+                status,
+                level,
+                children: [],
+                isActive: status === 'current',
+            });
+        }
+    }
+    return result;
+}
diff --git a/app/guid-node/workflow/-components/wizard-form/template-evaluator.ts b/app/guid-node/workflow/-components/wizard-form/template-evaluator.ts
new file mode 100644
index 000000000..1cc0fb2e3
--- /dev/null
+++ b/app/guid-node/workflow/-components/wizard-form/template-evaluator.ts
@@ -0,0 +1,634 @@
+/**
+ * Jinja2-subset template evaluator for ExpressionFormField.
+ *
+ * Coexists with Flowable UEL (${...}): UEL is resolved first, then this
+ * evaluator processes {{ }} / {% %} directives client-side.
+ * Output is Markdown text fed into MarkdownToHtml.
+ *
+ * Supported syntax:
+ *   {{ expr }}                  value interpolation
+ *   {{ expr | filter(args) }}   filter pipe
+ *   {% if expr %}...{% elif expr %}...{% else %}...{% endif %}
+ *   {% for x in expr %}...{% endfor %}
+ *   {%- / -%} / {{- / -}}      whitespace trimming
+ *
+ * Expression grammar (recursive descent):
+ *   expression  = or_expr
+ *   or_expr     = and_expr ( "or" and_expr )*
+ *   and_expr    = not_expr ( "and" not_expr )*
+ *   not_expr    = "not" not_expr | compare
+ *   compare     = access ( ( "==" | "!=" ) access )?
+ *   access      = primary ( "." ident | "[" expression "]" )*
+ *   primary     = "(" expression ")" | "true" | "false" | string_literal | ident
+ *   ident       = [a-zA-Z_\u3000-\u9FFF][a-zA-Z0-9_\u3000-\u9FFF-]*
+ */
+
+// ---------------------------------------------------------------------------
+// Types
+// ---------------------------------------------------------------------------
+
+interface Segment {
+    type: 'text' | 'expr' | 'tag';
+    value: string;
+    trimBefore: boolean;
+    trimAfter: boolean;
+}
+
+type AstNode = TextNode | InterpolationNode | ForNode | IfNode;
+
+interface TextNode {
+    type: 'text';
+    value: string;
+}
+
+interface InterpolationNode {
+    type: 'interpolation';
+    expr: Expr;
+}
+
+interface ForNode {
+    type: 'for';
+    itemName: string;
+    iterable: Expr;
+    body: AstNode[];
+}
+
+interface IfNode {
+    type: 'if';
+    branches: IfBranch[];
+}
+
+interface IfBranch {
+    condition: Expr | null; // null = else
+    body: AstNode[];
+}
+
+
+type Expr =
+    | { type: 'ident'; name: string }
+    | { type: 'string'; value: string }
+    | { type: 'boolean'; value: boolean }
+    | { type: 'dot'; object: Expr; property: string }
+    | { type: 'bracket'; object: Expr; key: Expr }
+    | { type: 'compare'; op: '==' | '!='; left: Expr; right: Expr }
+    | { type: 'not'; operand: Expr }
+    | { type: 'and'; left: Expr; right: Expr }
+    | { type: 'or'; left: Expr; right: Expr }
+    | { type: 'filter'; operand: Expr; name: string; args: Expr[] };
+
+// ---------------------------------------------------------------------------
+// Error
+// ---------------------------------------------------------------------------
+
+class TemplateParseError extends Error {
+    constructor(message: string, public pos: number) {
+        super(`Template parse error at ${pos}: ${message}`);
+    }
+}
+
+// ---------------------------------------------------------------------------
+// Tokenizer — split template into text / expr / tag segments
+// ---------------------------------------------------------------------------
+
+function tokenize(source: string): Segment[] {
+    const segments: Segment[] = [];
+    let pos = 0;
+
+    while (pos < source.length) {
+        const exprStart = source.indexOf('{{', pos);
+        const tagStart = source.indexOf('{%', pos);
+
+        let nearest = -1;
+        let kind: 'expr' | 'tag' = 'expr';
+        if (exprStart !== -1 && (tagStart === -1 || exprStart <= tagStart)) {
+            nearest = exprStart;
+            kind = 'expr';
+        } else if (tagStart !== -1) {
+            nearest = tagStart;
+            kind = 'tag';
+        }
+
+        if (nearest === -1) {
+            segments.push({ type: 'text', value: source.slice(pos), trimBefore: false, trimAfter: false });
+            break;
+        }
+
+        if (nearest > pos) {
+            segments.push({ type: 'text', value: source.slice(pos, nearest), trimBefore: false, trimAfter: false });
+        }
+
+        const trimBefore = source[nearest + 2] === '-';
+        const contentStart = nearest + 2 + (trimBefore ? 1 : 0);
+
+        const closeTag = kind === 'expr' ? '}}' : '%}';
+        // Look for close with optional trim dash
+        let closePos = -1;
+        let trimAfter = false;
+        let searchFrom = contentStart;
+        while (searchFrom < source.length) {
+            const ci = source.indexOf(closeTag, searchFrom);
+            if (ci === -1) {
+                throw new TemplateParseError(`unclosed ${kind === 'expr' ? '{{' : '{%'}`, nearest);
+            }
+            if (ci > contentStart && source[ci - 1] === '-') {
+                closePos = ci;
+                trimAfter = true;
+                break;
+            }
+            closePos = ci;
+            trimAfter = false;
+            break;
+        }
+
+        const contentEnd = trimAfter ? closePos - 1 : closePos;
+        const content = source.slice(contentStart, contentEnd).trim();
+        segments.push({ type: kind, value: content, trimBefore, trimAfter });
+        pos = closePos + 2;
+    }
+
+    // Apply whitespace trimming to adjacent text segments
+    for (let i = 0; i < segments.length; i++) {
+        const seg = segments[i];
+        if (seg.type === 'text') {
+            continue;
+        }
+        if (seg.trimBefore && i > 0 && segments[i - 1].type === 'text') {
+            segments[i - 1].value = segments[i - 1].value.replace(/\s+$/, '');
+        }
+        if (seg.trimAfter && i + 1 < segments.length && segments[i + 1].type === 'text') {
+            segments[i + 1].value = segments[i + 1].value.replace(/^\s+/, '');
+        }
+    }
+
+    return segments;
+}
+
+// ---------------------------------------------------------------------------
+// Expression parser
+// ---------------------------------------------------------------------------
+
+function isIdentStart(ch: string): boolean {
+    return /[a-zA-Z_\u3000-\u9FFF]/.test(ch);
+}
+
+function isIdentChar(ch: string): boolean {
+    return /[a-zA-Z0-9_\u3000-\u9FFF\-]/.test(ch);
+}
+
+class ExprParser {
+    pos = 0;
+    readonly source: string;
+    constructor(source: string) { this.source = source; }
+
+    skipWs(): void {
+        while (this.pos < this.source.length && /\s/.test(this.source[this.pos])) {
+            this.pos++;
+        }
+    }
+
+    peek(s: string): boolean {
+        return this.source.substr(this.pos, s.length) === s;
+    }
+
+    private peekKeyword(kw: string): boolean {
+        if (!this.peek(kw)) {
+            return false;
+        }
+        const after = this.pos + kw.length;
+        return after >= this.source.length || !isIdentChar(this.source[after]);
+    }
+
+    parseExpression(): Expr {
+        this.skipWs();
+        return this.orExpr();
+    }
+
+    private orExpr(): Expr {
+        let left = this.andExpr();
+        while (this.peekKeyword('or')) {
+            this.pos += 2;
+            this.skipWs();
+            left = { type: 'or', left, right: this.andExpr() };
+        }
+        return left;
+    }
+
+    private andExpr(): Expr {
+        let left = this.notExpr();
+        while (this.peekKeyword('and')) {
+            this.pos += 3;
+            this.skipWs();
+            left = { type: 'and', left, right: this.notExpr() };
+        }
+        return left;
+    }
+
+    private notExpr(): Expr {
+        this.skipWs();
+        if (this.peekKeyword('not')) {
+            this.pos += 3;
+            this.skipWs();
+            return { type: 'not', operand: this.notExpr() };
+        }
+        return this.compare();
+    }
+
+    private compare(): Expr {
+        const left = this.access();
+        this.skipWs();
+        if (this.peek('==')) {
+            this.pos += 2;
+            this.skipWs();
+            return { type: 'compare', op: '==', left, right: this.access() };
+        }
+        if (this.peek('!=')) {
+            this.pos += 2;
+            this.skipWs();
+            return { type: 'compare', op: '!=', left, right: this.access() };
+        }
+        return left;
+    }
+
+    private access(): Expr {
+        let node = this.primary();
+        while (this.pos < this.source.length) {
+            this.skipWs();
+            if (this.source[this.pos] === '.') {
+                this.pos++;
+                const prop = this.readIdent();
+                node = { type: 'dot', object: node, property: prop };
+            } else if (this.source[this.pos] === '[') {
+                this.pos++;
+                this.skipWs();
+                const key = this.parseExpression();
+                this.skipWs();
+                if (this.source[this.pos] !== ']') {
+                    throw new TemplateParseError("expected ']'", this.pos);
+                }
+                this.pos++;
+                node = { type: 'bracket', object: node, key };
+            } else if (this.source[this.pos] === '|') {
+                this.pos++;
+                this.skipWs();
+                const name = this.readIdent();
+                const args: Expr[] = [];
+                this.skipWs();
+                if (this.pos < this.source.length && this.source[this.pos] === '(') {
+                    this.pos++;
+                    this.skipWs();
+                    if (this.source[this.pos] !== ')') {
+                        args.push(this.parseExpression());
+                        this.skipWs();
+                        while (this.source[this.pos] === ',') {
+                            this.pos++;
+                            this.skipWs();
+                            args.push(this.parseExpression());
+                            this.skipWs();
+                        }
+                    }
+                    if (this.source[this.pos] !== ')') {
+                        throw new TemplateParseError("expected ')'", this.pos);
+                    }
+                    this.pos++;
+                }
+                node = { type: 'filter', operand: node, name, args };
+            } else {
+                break;
+            }
+        }
+        return node;
+    }
+
+    private primary(): Expr {
+        this.skipWs();
+        if (this.pos >= this.source.length) {
+            throw new TemplateParseError('unexpected end of expression', this.pos);
+        }
+
+        const ch = this.source[this.pos];
+
+        if (ch === '(') {
+            this.pos++;
+            this.skipWs();
+            const expr = this.parseExpression();
+            this.skipWs();
+            if (this.source[this.pos] !== ')') {
+                throw new TemplateParseError("expected ')'", this.pos);
+            }
+            this.pos++;
+            return expr;
+        }
+
+        if (ch === "'") {
+            return { type: 'string', value: this.readString("'") };
+        }
+        if (ch === '"') {
+            return { type: 'string', value: this.readString('"') };
+        }
+
+        if (this.peekKeyword('true')) {
+            this.pos += 4;
+            return { type: 'boolean', value: true };
+        }
+        if (this.peekKeyword('false')) {
+            this.pos += 5;
+            return { type: 'boolean', value: false };
+        }
+
+        if (isIdentStart(ch)) {
+            return { type: 'ident', name: this.readIdent() };
+        }
+
+        throw new TemplateParseError(`unexpected character '${ch}'`, this.pos);
+    }
+
+    private readString(quote: string): string {
+        this.pos++; // skip opening quote
+        const start = this.pos;
+        const end = this.source.indexOf(quote, start);
+        if (end === -1) {
+            throw new TemplateParseError('unterminated string literal', start);
+        }
+        this.pos = end + 1;
+        return this.source.substring(start, end);
+    }
+
+    readIdent(): string {
+        const start = this.pos;
+        if (!isIdentStart(this.source[this.pos])) {
+            throw new TemplateParseError('expected identifier', this.pos);
+        }
+        this.pos++;
+        while (this.pos < this.source.length && isIdentChar(this.source[this.pos])) {
+            this.pos++;
+        }
+        // Trim trailing hyphens (e.g. prevent matching the dash in "-%}")
+        while (this.pos > start + 1 && this.source[this.pos - 1] === '-') {
+            this.pos--;
+        }
+        return this.source.substring(start, this.pos);
+    }
+
+}
+
+// ---------------------------------------------------------------------------
+// Template parser — segments → AST
+// ---------------------------------------------------------------------------
+
+function parseTemplate(segments: Segment[]): AstNode[] {
+    let pos = 0;
+
+    function parseNodes(until?: string): AstNode[] {
+        const nodes: AstNode[] = [];
+        while (pos < segments.length) {
+            const seg = segments[pos];
+
+            if (seg.type === 'text') {
+                if (seg.value) {
+                    nodes.push({ type: 'text', value: seg.value });
+                }
+                pos++;
+                continue;
+            }
+
+            if (seg.type === 'expr') {
+                const ep = new ExprParser(seg.value);
+                const expr = ep.parseExpression();
+                assertFullyConsumed(ep, '{{ }}');
+                nodes.push({ type: 'interpolation', expr });
+                pos++;
+                continue;
+            }
+
+            // seg.type === 'tag'
+            const tagContent = seg.value;
+
+            // Check for closing tags first
+            if (until && tagContent === until) {
+                return nodes;
+            }
+            if (tagContent === 'endfor' || tagContent === 'endif' || tagContent.startsWith('elif ') || tagContent === 'else') {
+                // Reached a boundary tag — return to caller
+                return nodes;
+            }
+
+            if (tagContent.startsWith('for ')) {
+                nodes.push(parseFor(tagContent));
+                continue;
+            }
+
+            if (tagContent.startsWith('if ')) {
+                nodes.push(parseIf(tagContent));
+                continue;
+            }
+
+            throw new TemplateParseError(`unknown tag: ${tagContent}`, 0);
+        }
+        return nodes;
+    }
+
+    function assertFullyConsumed(ep: ExprParser, context: string): void {
+        ep.skipWs();
+        if (ep.pos < ep.source.length) {
+            throw new TemplateParseError(
+                `unexpected '${ep.source.slice(ep.pos)}' in ${context}`,
+                ep.pos,
+            );
+        }
+    }
+
+    function parseFor(tagContent: string): ForNode {
+        // "for item in expr"
+        const ep = new ExprParser(tagContent.slice(4));
+        const itemName = ep.readIdent();
+        ep.skipWs();
+        if (!ep.peek('in') || isIdentChar(ep.source[ep.pos + 2] || '')) {
+            throw new TemplateParseError("expected 'in' in for tag", ep.pos);
+        }
+        ep.pos += 2;
+        const iterable = ep.parseExpression();
+        assertFullyConsumed(ep, '{% for %}');
+        pos++; // skip for tag segment
+        const body = parseNodes('endfor');
+        if (pos >= segments.length || segments[pos].value !== 'endfor') {
+            throw new TemplateParseError('unclosed {% for %}', 0);
+        }
+        pos++; // skip endfor
+        return { type: 'for', itemName, iterable, body };
+    }
+
+    function parseIf(tagContent: string): IfNode {
+        const branches: IfBranch[] = [];
+
+        // First branch: if
+        const ep = new ExprParser(tagContent.slice(3));
+        const condition = ep.parseExpression();
+        assertFullyConsumed(ep, '{% if %}');
+        branches.push({ condition, body: [] });
+        pos++; // skip if tag segment
+        branches[0].body = parseNodes();
+
+        // elif / else branches
+        while (pos < segments.length) {
+            const seg = segments[pos];
+            if (seg.type !== 'tag') {
+                break;
+            }
+            if (seg.value.startsWith('elif ')) {
+                const elifParser = new ExprParser(seg.value.slice(5));
+                const elifCond = elifParser.parseExpression();
+                assertFullyConsumed(elifParser, '{% elif %}');
+                pos++;
+                const body = parseNodes();
+                branches.push({ condition: elifCond, body });
+            } else if (seg.value === 'else') {
+                pos++;
+                const body = parseNodes();
+                branches.push({ condition: null, body });
+            } else if (seg.value === 'endif') {
+                pos++; // skip endif
+                return { type: 'if', branches };
+            } else {
+                break;
+            }
+        }
+        throw new TemplateParseError('unclosed {% if %}', 0);
+    }
+
+    return parseNodes();
+}
+
+// ---------------------------------------------------------------------------
+// Evaluator
+// ---------------------------------------------------------------------------
+
+type FilterFn = (value: unknown, ...args: unknown[]) => unknown;
+
+const BUILTIN_FILTERS: Record<string, FilterFn> = {
+    default(value: unknown, fallback: unknown = '') {
+        if (value === null || value === undefined || value === '') {
+            return fallback;
+        }
+        return value;
+    },
+    length(value: unknown) {
+        if (Array.isArray(value)) {
+            return value.length;
+        }
+        if (typeof value === 'string') {
+            return value.length;
+        }
+        return 0;
+    },
+};
+
+function isTruthy(value: unknown): boolean {
+    if (value === false || value === null || value === undefined || value === '' || value === 0) {
+        return false;
+    }
+    if (Array.isArray(value) && value.length === 0) {
+        return false;
+    }
+    return true;
+}
+
+function evalExpr(expr: Expr, ctx: Record<string, unknown>): unknown {
+    switch (expr.type) {
+    case 'ident':
+        return ctx[expr.name];
+    case 'string':
+        return expr.value;
+    case 'boolean':
+        return expr.value;
+    case 'dot': {
+        const obj = evalExpr(expr.object, ctx);
+        if (obj == null) {
+            return undefined;
+        }
+        return (obj as Record<string, unknown>)[expr.property];
+    }
+    case 'bracket': {
+        const obj = evalExpr(expr.object, ctx);
+        const key = evalExpr(expr.key, ctx);
+        if (obj == null) {
+            return undefined;
+        }
+        return (obj as Record<string, unknown>)[String(key)];
+    }
+    case 'compare': {
+        const left = evalExpr(expr.left, ctx);
+        const right = evalExpr(expr.right, ctx);
+        return expr.op === '==' ? left === right : left !== right;
+    }
+    case 'not':
+        return !isTruthy(evalExpr(expr.operand, ctx));
+    case 'and':
+        return isTruthy(evalExpr(expr.left, ctx)) ? evalExpr(expr.right, ctx) : evalExpr(expr.left, ctx);
+    case 'or':
+        return isTruthy(evalExpr(expr.left, ctx)) ? evalExpr(expr.left, ctx) : evalExpr(expr.right, ctx);
+    case 'filter': {
+        const value = evalExpr(expr.operand, ctx);
+        const fn = BUILTIN_FILTERS[expr.name];
+        if (!fn) {
+            throw new Error(`unknown filter: ${expr.name}`);
+        }
+        const args = expr.args.map(a => evalExpr(a, ctx));
+        return fn(value, ...args);
+    }
+    }
+}
+
+function stringify(value: unknown): string {
+    if (value === null || value === undefined) {
+        return '';
+    }
+    return String(value);
+}
+
+function evaluate(nodes: AstNode[], ctx: Record<string, unknown>): string {
+    let out = '';
+    for (const node of nodes) {
+        switch (node.type) {
+        case 'text':
+            out += node.value;
+            break;
+        case 'interpolation':
+            out += stringify(evalExpr(node.expr, ctx));
+            break;
+        case 'for': {
+            const iterable = evalExpr(node.iterable, ctx);
+            if (Array.isArray(iterable)) {
+                for (const item of iterable) {
+                    const scope = Object.create(ctx) as Record<string, unknown>;
+                    scope[node.itemName] = item;
+                    out += evaluate(node.body, scope);
+                }
+            }
+            break;
+        }
+        case 'if':
+            for (const branch of node.branches) {
+                if (branch.condition === null || isTruthy(evalExpr(branch.condition, ctx))) {
+                    out += evaluate(branch.body, ctx);
+                    break;
+                }
+            }
+            break;
+        }
+    }
+    return out;
+}
+
+// ---------------------------------------------------------------------------
+// Public API
+// ---------------------------------------------------------------------------
+
+export function hasTemplateDirectives(text: string): boolean {
+    return text.includes('{{') || text.includes('{%');
+}
+
+export function evaluateTemplate(template: string, context: Record<string, unknown>): string {
+    const segments = tokenize(template);
+    const ast = parseTemplate(segments);
+    return evaluate(ast, context);
+}
diff --git a/app/guid-node/workflow/-components/wizard-form/template.hbs b/app/guid-node/workflow/-components/wizard-form/template.hbs
new file mode 100644
index 000000000..90b479ddb
--- /dev/null
+++ b/app/guid-node/workflow/-components/wizard-form/template.hbs
@@ -0,0 +1,12 @@
+<div {{did-insert this.initialize}} {{did-update this.initialize @form}}>
+    <h4>{{this.pageTitle}}</h4>
+
+    <GuidNode::Workflow::-Components::FlowableForm
+        @form={{this.currentPageForm}}
+        @variables={{this.currentPageVariables}}
+        @node={{@node}}
+        @fieldHints={{this.fieldHints}}
+        @fieldContext={{this.fieldContext}}
+        @onChange={{this.handlePageFieldChange}}
+    />
+</div>
diff --git a/app/guid-node/workflow/-components/wizard-form/types.ts b/app/guid-node/workflow/-components/wizard-form/types.ts
new file mode 100644
index 000000000..c9924a4a3
--- /dev/null
+++ b/app/guid-node/workflow/-components/wizard-form/types.ts
@@ -0,0 +1,77 @@
+export interface RdmWizardPage {
+    id: string;
+    title: string;
+    type?: 'group';
+    fields?: string[];
+    pages?: RdmWizardPage[];
+    visible?: string | boolean;
+}
+
+export interface RdmWizardNavigation {
+    allowBack?: boolean;
+    allowHeaderNavigation?: boolean;
+}
+
+export interface RdmWizardProgress {
+    style?: 'sidebar' | 'steps';
+}
+
+export interface SuggestionConfig {
+    key: string;
+    template?: string;
+    valueField?: string;
+    autofill?: Record<string, string>;
+}
+
+export interface FieldHintUI {
+    width?: 'narrow' | 'half' | 'full';
+    freetext?: boolean;
+    optionMap?: Record<string, string>;
+}
+
+export interface FieldHint {
+    visible?: string | boolean;
+    ui?: FieldHintUI;
+    suggestion?: SuggestionConfig[];
+}
+
+export interface RdmWizard {
+    pages: RdmWizardPage[];
+    alias?: Record<string, string>;
+    navigation?: RdmWizardNavigation;
+    progress?: RdmWizardProgress;
+    fieldHints?: Record<string, FieldHint>;
+}
+
+import { ProgressStep } from '../progress-sidebar/utils';
+
+export interface WizardNavigation {
+    isFirstPage: boolean;
+    isLastPage: boolean;
+    allowBack: boolean;
+    canGoNext: boolean;
+    progressSteps: ProgressStep[];
+    goNext: () => void;
+    goBack: () => void;
+    submit: () => void;
+}
+
+const WIZARD_FIELD_ID = '_rdmWizard';
+
+/**
+ * Extract RdmWizard config from a _rdmWizard ExpressionFormField in the fields array.
+ * Returns null if the field is not present.
+ */
+export function extractWizardConfig(fields?: Array<{ id: string; expression?: string }>): RdmWizard | null {
+    if (!fields) {
+        return null;
+    }
+    const field = fields.find(f => f.id === WIZARD_FIELD_ID);
+    if (!field) {
+        return null;
+    }
+    if (!field.expression) {
+        throw new Error(`_rdmWizard field found but expression is empty`);
+    }
+    return JSON.parse(field.expression) as RdmWizard;
+}
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/component.ts b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/component.ts
index 78beebbd2..fe8b3a53e 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/component.ts
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/component.ts
@@ -101,12 +101,7 @@ export default class Text extends Component {
         const input = event.target as HTMLInputElement;
         const text = input.value;
         this.changeset.set(this.valuePath, text);
-        if (text) {
-            run.debounce(this, this._doSearch, text, 300);
-        } else {
-            this.set('suggestionResults', []);
-            this.set('showSuggestions', false);
-        }
+        run.debounce(this, this._doSearch, text, 300);
         this.onInput();
     }
 
diff --git a/translations/en-us.yml b/translations/en-us.yml
index d1985e0c4..a3865b3e4 100644
--- a/translations/en-us.yml
+++ b/translations/en-us.yml
@@ -2085,6 +2085,10 @@ workflow:
                 next: 'Next'
                 progressTitle: 'Progress'
                 submitting: 'Submitting...'
+                wizard:
+                    back: 'Back'
+                    next: 'Next'
+
                 projectMetadataSelector:
                     loading: 'Loading metadata records...'
                     refresh: 'Refresh'
@@ -2098,6 +2102,7 @@ workflow:
                     refresh: 'Refresh'
                     noRecordsPrefix: 'No file metadata has been registered. You can edit file metadata on the project page and register it in this form'
                     path: 'Path'
-                    manager: 'Manager'
                 exportTarget:
                     loading: 'Loading export targets...'
+                arrayInput:
+                    add: 'Add'
diff --git a/translations/ja.yml b/translations/ja.yml
index bb37efed0..3803341dd 100644
--- a/translations/ja.yml
+++ b/translations/ja.yml
@@ -2085,6 +2085,10 @@ workflow:
                 next: 次へ
                 progressTitle: 進捗状況
                 submitting: 送信中...
+                wizard:
+                    back: 戻る
+                    next: 次へ
+
                 projectMetadataSelector:
                     loading: メタデータレコードを読み込み中...
                     refresh: 更新
@@ -2098,6 +2102,7 @@ workflow:
                     refresh: 更新
                     noRecordsPrefix: ファイルメタデータは登録されていません。プロジェクトページでファイルのメタデータを編集し、このフォームに登録することができます
                     path: パス
-                    manager: 管理者
                 exportTarget:
                     loading: エクスポート先を読み込み中...
+                arrayInput:
+                    add: 追加

From 02c3e663b27dc8d8184624e29bc4066aec553830 Mon Sep 17 00:00:00 2001
From: yacchin1205 <968739+yacchin1205@users.noreply.github.com>
Date: Tue, 31 Mar 2026 17:49:11 +0900
Subject: [PATCH 5/7] Add value checkmark, popover focus fix, input colors, and
 array-input delete button

---
 .../registration-schema/schema-block.ts       |  4 +-
 app/packages/registration-schema/ui-group.ts  | 90 ++++++++++++++++++-
 .../registries/page-renderer/component.ts     | 16 +++-
 .../registries/page-renderer/template.hbs     |  3 +
 .../schema-block-group-renderer/component.ts  |  5 +-
 .../schema-block-group-renderer/template.hbs  | 10 ++-
 .../editable/base/styles.scss                 |  9 +-
 .../editable/rdm/array-input/component.ts     |  2 +-
 .../editable/rdm/array-input/styles.scss      |  5 ++
 .../editable/rdm/array-input/template.hbs     |  1 +
 .../label/label-content/component.ts          | 40 ++++++++-
 .../label/label-content/styles.scss           | 19 ++++
 .../label/label-content/template.hbs          | 27 +++++-
 .../schema-block-renderer/label/template.hbs  |  6 +-
 .../page-heading/styles.scss                  |  2 +
 .../schema-block-renderer/styles.scss         |  2 +-
 .../schema-block-renderer/template.hbs        |  4 +-
 .../registries/ui-visual-items/component.ts   | 11 ++-
 .../registries/ui-visual-items/styles.scss    | 24 +++++
 .../registries/ui-visual-items/template.hbs   | 33 ++++++-
 .../registries/value-check-mark/component.ts  | 25 ++++++
 .../registries/value-check-mark/styles.scss   |  4 +
 .../registries/value-check-mark/template.hbs  |  3 +
 .../registries/value-check-mark/component.js  |  1 +
 .../registries/value-check-mark/template.js   |  1 +
 25 files changed, 322 insertions(+), 25 deletions(-)
 create mode 100644 lib/osf-components/addon/components/registries/value-check-mark/component.ts
 create mode 100644 lib/osf-components/addon/components/registries/value-check-mark/styles.scss
 create mode 100644 lib/osf-components/addon/components/registries/value-check-mark/template.hbs
 create mode 100644 lib/osf-components/app/components/registries/value-check-mark/component.js
 create mode 100644 lib/osf-components/app/components/registries/value-check-mark/template.js

diff --git a/app/packages/registration-schema/schema-block.ts b/app/packages/registration-schema/schema-block.ts
index 60e22b1a0..5ae4f16b6 100644
--- a/app/packages/registration-schema/schema-block.ts
+++ b/app/packages/registration-schema/schema-block.ts
@@ -57,8 +57,8 @@ export interface SchemaBlock {
     rowAdditionCaption?: string;
     suggestion?: string;
     ui?: {
-        group?: string | { id: string; title?: string; bar?: boolean; tags?: string[]; help?: string; info?: string; parent?: string | { id: string; title?: string } };
+        group?: string | { id: string; title?: string; marker?: string; bar?: boolean; tags?: (string | { id: string; info?: string })[]; help?: string; info?: string; parent?: string | { id: string; title?: string } };
         sub_label?: string;
-        item?: { placeholder?: string; width?: string; widget?: string; enabled_if?: object; info?: string; tags?: string[]; freetext?: boolean };
+        item?: { marker?: string; placeholder?: string; width?: string; widget?: string; enabled_if?: object; info?: string; tags?: (string | { id: string; info?: string })[]; freetext?: boolean };
     };
 }
diff --git a/app/packages/registration-schema/ui-group.ts b/app/packages/registration-schema/ui-group.ts
index 45547f57f..39eb34525 100644
--- a/app/packages/registration-schema/ui-group.ts
+++ b/app/packages/registration-schema/ui-group.ts
@@ -14,9 +14,16 @@ function resolveUI(ui: SchemaBlock['ui']): Record<string, any> | undefined {
     return ui.find((entry: any) => !entry.condition);
 }
 
+export interface ResolvedTag {
+    id: string;
+    localizedText: string;
+    info?: string;
+}
+
 export interface UiGroupDef {
     id: string;
     title?: string;
+    marker?: string;
     bar?: boolean;
     tags?: string[];
     help?: string;
@@ -26,17 +33,74 @@ export interface UiGroupDef {
 
 export interface VisualItem {
     schemaBlockGroup?: SchemaBlockGroup;
-    uiGroup?: UiGroupDef & { localizedTitle?: string };
+    uiGroup?: UiGroupDef & { localizedTitle?: string; localizedInfo?: string; resolvedTags?: ResolvedTag[] };
     children?: VisualItem[];
+    responseKeys?: string[];
+}
+
+function collectTagDefs(tags: any[] | undefined, tagDefs: { [id: string]: { info?: string } }) {
+    if (!tags) {
+        return;
+    }
+    for (const tag of tags) {
+        if (typeof tag === 'object' && tag.id) {
+            tagDefs[tag.id] = { info: tag.info };
+        }
+    }
 }
 
+export function resolveTags(
+    tags: any[] | undefined,
+    tagDefs: { [id: string]: { info?: string } },
+    localizeText: (text: string) => string,
+): ResolvedTag[] | undefined {
+    if (!tags) {
+        return undefined;
+    }
+    return tags.map(tag => {
+        if (typeof tag === 'object') {
+            return {
+                id: tag.id,
+                localizedText: localizeText(tag.id),
+                info: tag.info ? localizeText(tag.info) : undefined,
+            };
+        }
+        const def = tagDefs[tag];
+        if (!def) {
+            throw new Error(`Tag definition not found: ${tag}`);
+        }
+        return {
+            id: tag,
+            localizedText: localizeText(tag),
+            info: def.info ? localizeText(def.info) : undefined,
+        };
+    });
+}
+
+export type TagDefs = { [id: string]: { info?: string } };
+
 export function buildVisualItems(
     groups: SchemaBlockGroup[],
     localizeText: (text: string) => string,
-): VisualItem[] {
+): { items: VisualItem[]; tagDefs: TagDefs } {
     const root: VisualItem[] = [];
     const groupDefs: { [id: string]: UiGroupDef } = {};
     const groupItems: { [id: string]: VisualItem } = {};
+    const tagDefs: { [id: string]: { info?: string } } = {};
+
+    // First pass: collect all tag definitions
+    for (const group of groups) {
+        const ui = resolveUI(group.inputBlock && group.inputBlock.ui);
+        if (!ui) {
+            continue;
+        }
+        if (ui.group && typeof ui.group === 'object') {
+            collectTagDefs(ui.group.tags, tagDefs);
+        }
+        if (ui.item) {
+            collectTagDefs(ui.item.tags, tagDefs);
+        }
+    }
 
     function ensureGroup(id: string): VisualItem {
         if (groupItems[id]) {
@@ -47,6 +111,8 @@ export function buildVisualItems(
             uiGroup: {
                 ...def,
                 localizedTitle: def.title ? localizeText(def.title) : undefined,
+                localizedInfo: def.info ? localizeText(def.info) : undefined,
+                resolvedTags: resolveTags(def.tags, tagDefs, localizeText),
             },
             children: [],
         };
@@ -88,6 +154,7 @@ export function buildVisualItems(
             groupDefs[groupId] = {
                 id: groupDef.id,
                 title: groupDef.title,
+                marker: groupDef.marker,
                 bar: groupDef.bar,
                 tags: groupDef.tags,
                 help: groupDef.help,
@@ -99,5 +166,22 @@ export function buildVisualItems(
         ensureGroup(groupId).children!.push({ schemaBlockGroup: group });
     }
 
-    return root;
+    function collectResponseKeys(items: VisualItem[]): void {
+        for (const item of items) {
+            if (item.children) {
+                collectResponseKeys(item.children);
+            }
+            if (item.schemaBlockGroup && item.schemaBlockGroup.registrationResponseKey) {
+                item.responseKeys = [item.schemaBlockGroup.registrationResponseKey];
+            } else if (item.children) {
+                item.responseKeys = item.children.reduce(
+                    (keys: string[], child) => keys.concat(child.responseKeys || []),
+                    [],
+                );
+            }
+        }
+    }
+    collectResponseKeys(root);
+
+    return { items: root, tagDefs };
 }
diff --git a/lib/osf-components/addon/components/registries/page-renderer/component.ts b/lib/osf-components/addon/components/registries/page-renderer/component.ts
index c20d3b70b..791864670 100644
--- a/lib/osf-components/addon/components/registries/page-renderer/component.ts
+++ b/lib/osf-components/addon/components/registries/page-renderer/component.ts
@@ -9,7 +9,7 @@ import { inject as service } from '@ember/service';
 import Intl from 'ember-intl/services/intl';
 import NodeModel from 'ember-osf-web/models/node';
 import { PageManager } from 'ember-osf-web/packages/registration-schema/page-manager';
-import { buildVisualItems, VisualItem } from 'ember-osf-web/packages/registration-schema/ui-group';
+import { buildVisualItems, TagDefs, VisualItem } from 'ember-osf-web/packages/registration-schema/ui-group';
 import DraftRegistrationManager from 'registries/drafts/draft/draft-registration-manager';
 import styles from './styles';
 import template from './template';
@@ -31,14 +31,24 @@ export default class PageRenderer extends Component {
     }
 
     @computed('pageManager.schemaBlockGroups')
-    get visualItems(): VisualItem[] {
+    get _built(): { items: VisualItem[]; tagDefs: TagDefs } {
         const groups = this.pageManager.schemaBlockGroups;
         if (!groups) {
-            return [];
+            return { items: [], tagDefs: {} };
         }
         return buildVisualItems(groups, text => this.localizeText(text));
     }
 
+    @computed('_built')
+    get visualItems(): VisualItem[] {
+        return this._built.items;
+    }
+
+    @computed('_built')
+    get tagDefs(): TagDefs {
+        return this._built.tagDefs;
+    }
+
     localizeText(text: string): string {
         if (!text.includes('|')) {
             return text;
diff --git a/lib/osf-components/addon/components/registries/page-renderer/template.hbs b/lib/osf-components/addon/components/registries/page-renderer/template.hbs
index e6a95e134..961052066 100644
--- a/lib/osf-components/addon/components/registries/page-renderer/template.hbs
+++ b/lib/osf-components/addon/components/registries/page-renderer/template.hbs
@@ -11,5 +11,8 @@
     <Registries::UiVisualItems
         @items={{this.visualItems}}
         @baseStrategy={{baseStrategy}}
+        @tagDefs={{this.tagDefs}}
+        @changeset={{this.pageManager.changeset}}
+        @isTopLevel={{true}}
     />
 {{/let}}
diff --git a/lib/osf-components/addon/components/registries/schema-block-group-renderer/component.ts b/lib/osf-components/addon/components/registries/schema-block-group-renderer/component.ts
index 656d88db3..a8dceb8a2 100644
--- a/lib/osf-components/addon/components/registries/schema-block-group-renderer/component.ts
+++ b/lib/osf-components/addon/components/registries/schema-block-group-renderer/component.ts
@@ -55,10 +55,9 @@ export default class SchemaBlockGroupRenderer extends Component {
     }
 
     @computed('schemaBlockGroup.inputBlock.ui')
-    get uiSubLabel(): string | undefined {
+    get inputBlockUI() {
         const inputBlock = this.schemaBlockGroup.inputBlock;
-        const ui = inputBlock && inputBlock.ui;
-        return ui && ui.sub_label;
+        return inputBlock && inputBlock.ui;
     }
 
     @computed('schemaBlockGroup.groupType')
diff --git a/lib/osf-components/addon/components/registries/schema-block-group-renderer/template.hbs b/lib/osf-components/addon/components/registries/schema-block-group-renderer/template.hbs
index 6af4583b0..434103d2e 100644
--- a/lib/osf-components/addon/components/registries/schema-block-group-renderer/template.hbs
+++ b/lib/osf-components/addon/components/registries/schema-block-group-renderer/template.hbs
@@ -8,7 +8,10 @@
                 @renderStrategy={{@renderStrategy}}
                 @isRequired={{this.isRequired}}
                 @isFieldsetGroup={{true}}
-                @uiSubLabel={{this.uiSubLabel}}
+                @inputBlockUI={{this.inputBlockUI}}
+                @tagDefs={{@tagDefs}}
+                @changeset={{@changeset}}
+                @checkMarkKeys={{@checkMarkKeys}}
             />
         {{/each}}
     </fieldset>
@@ -21,7 +24,10 @@
             @renderStrategy={{@renderStrategy}}
             @isRequired={{this.isRequired}}
             @isFieldsetGroup={{false}}
-            @uiSubLabel={{this.uiSubLabel}}
+            @inputBlockUI={{this.inputBlockUI}}
+            @tagDefs={{@tagDefs}}
+            @changeset={{@changeset}}
+            @checkMarkKeys={{@checkMarkKeys}}
         />
     {{/each}}
 {{/if}}
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/base/styles.scss b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/base/styles.scss
index a5da584d8..f9746efb5 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/base/styles.scss
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/base/styles.scss
@@ -20,12 +20,17 @@
     flex: auto;
 
     :global(.form-control) {
-        background-color: #f2f6fa;
+        background-color: #f9fbfd;
         border-color: #cad9e6;
+
+        &::placeholder {
+            color: #a6a6a6;
+            opacity: 1;
+        }
     }
 
     :global(.ember-power-select-trigger) {
-        background-color: #f2f6fa;
+        background-color: #f9fbfd;
         border-color: #cad9e6;
         padding: 6px;
     }
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/component.ts b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/component.ts
index ce7c39d8a..09c1831f0 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/component.ts
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/component.ts
@@ -116,7 +116,7 @@ export default class ArrayInput extends Component {
         if (!children) {
             return [];
         }
-        return buildVisualItems(children, text => this.getLocalizedText(text));
+        return buildVisualItems(children, text => this.getLocalizedText(text)).items;
     }
 
     getLocalizedText(text: string) {
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/styles.scss b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/styles.scss
index d7496b2ed..5a892104e 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/styles.scss
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/styles.scss
@@ -7,6 +7,11 @@
 
 .array-input-remove-button {
     margin-top: 20px;
+
+    &:global(.btn) {
+        display: block;
+        margin-left: auto;
+    }
 }
 
 .array-input-add-button:first-child {
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/template.hbs b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/template.hbs
index 50dc73293..f0fe3dc1a 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/template.hbs
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/template.hbs
@@ -18,6 +18,7 @@
                 />
             {{/let}}
             <OsfButton local-class='array-input-remove-button'
+              @type='danger'
               @onClick={{action this.onRemove subChangeset}}
             >
                 {{this.schemaBlock.rowAdditionCaption}}{{t 'metadata.array-input.remove-item'}}
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/component.ts b/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/component.ts
index 47ff1eed2..664d0899e 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/component.ts
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/component.ts
@@ -6,6 +6,7 @@ import { inject as service } from '@ember/service';
 import Intl from 'ember-intl/services/intl';
 import { layout } from 'ember-osf-web/decorators/component';
 import { SchemaBlock } from 'ember-osf-web/packages/registration-schema';
+import { resolveTags, TagDefs } from 'ember-osf-web/packages/registration-schema/ui-group';
 import styles from './styles';
 import template from './template';
 
@@ -17,11 +18,48 @@ export default class LabelContent extends Component {
     schemaBlock!: SchemaBlock;
 
     // Optional params
-    displayTextOverride?: string;
+    inputBlockUI?: SchemaBlock['ui'];
+    tagDefs?: TagDefs;
+    changeset?: any;
+    checkMarkKeys?: string[];
 
     // Private property
     shouldShowExample = false;
 
+    @computed('inputBlockUI')
+    get displayTextOverride(): string | undefined {
+        return this.inputBlockUI && this.inputBlockUI.sub_label;
+    }
+
+    @computed('inputBlockUI')
+    get itemMarker(): string | undefined {
+        return this.inputBlockUI && this.inputBlockUI.item && this.inputBlockUI.item.marker;
+    }
+
+    @computed('inputBlockUI')
+    get itemInfo(): string | undefined {
+        const info = this.inputBlockUI && this.inputBlockUI.item && this.inputBlockUI.item.info;
+        return info ? this.getLocalizedText(info) : undefined;
+    }
+
+    @computed('inputBlockUI', 'tagDefs')
+    get itemTags() {
+        const tags = this.inputBlockUI && this.inputBlockUI.item && this.inputBlockUI.item.tags;
+        if (!tags) {
+            return undefined;
+        }
+        if (!this.tagDefs) {
+            console.warn(`[metadata] tagDefs not provided for block with ui.item.tags: ${this.schemaBlock.displayText}`);
+            return undefined;
+        }
+        return resolveTags(tags, this.tagDefs, text => this.getLocalizedText(text));
+    }
+
+    @action
+    preventLabelFocus(event: Event) {
+        event.preventDefault();
+    }
+
     @action
     toggleShouldShowExample() {
         this.toggleProperty('shouldShowExample');
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/styles.scss b/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/styles.scss
index bbe22699e..56d00da99 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/styles.scss
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/styles.scss
@@ -46,3 +46,22 @@
     font-weight: normal !important;
     margin-bottom: 0;
 }
+
+.InfoMark {
+    cursor: pointer;
+    margin-left: 6px;
+    color: #5bc0de;
+}
+
+.TagBadge {
+    display: inline-block;
+    padding: 2px 6px;
+    margin-left: 6px;
+    font-size: 75%;
+    font-weight: bold;
+    color: #fff;
+    background-color: #777;
+    border-radius: 3px;
+    cursor: pointer;
+    vertical-align: middle;
+}
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/template.hbs b/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/template.hbs
index b7cf72db8..c45fe8217 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/template.hbs
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/template.hbs
@@ -1,12 +1,37 @@
 {{assert 'Registries::SchemaBlockRenderer::Label::LabelContent requires a @schemaBlock' @schemaBlock}}
 <p
     ...attributes
-    local-class='DisplayText {{if @displayTextOverride "SubLabel"}}'>
+    local-class='DisplayText {{if this.displayTextOverride "SubLabel"}}'>
+    {{~#if (eq this.itemMarker "circle")~}}◯ {{~/if~}}
     {{~this.localizedDisplayText~}}
     {{~#if (and @isRequired (not @readonly))~}}
         <span local-class='Required'>*</span>
     {{~/if~}}
 </p>
+{{~#each this.itemTags as |tag|~}}
+    <span tabindex='-1' {{on 'click' this.preventLabelFocus}}>
+        <span local-class='TagBadge'>{{~tag.localizedText~}}</span>
+        {{~#if tag.info~}}
+            <BsPopover @triggerEvents={{array 'focus'}}>
+                {{tag.info}}
+            </BsPopover>
+        {{~/if~}}
+    </span>
+{{~/each~}}
+{{~#if this.itemInfo~}}
+    <span local-class='InfoMark' tabindex='-1' {{on 'click' this.preventLabelFocus}}>
+        ⓘ
+        <BsPopover @triggerEvents={{array 'focus'}}>
+            {{this.itemInfo}}
+        </BsPopover>
+    </span>
+{{~/if~}}
+{{~#if (and @changeset @checkMarkKeys)~}}
+    <Registries::ValueCheckMark
+        @changeset={{@changeset}}
+        @keys={{@checkMarkKeys}}
+    />
+{{~/if~}}
 {{#if @isEditableForm}}
     <div local-class='HelpText'>
         {{#each this.localizedHelpTextLines as |lineParts|}}
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/label/template.hbs b/lib/osf-components/addon/components/registries/schema-block-renderer/label/template.hbs
index f1f80feb1..a00486012 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/label/template.hbs
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/label/template.hbs
@@ -12,7 +12,8 @@
                 @readonly={{@readonly}}
                 @isEditableForm={{@isEditableForm}}
                 @draftManager={{@draftManager}}
-                @displayTextOverride={{@uiSubLabel}}
+                @inputBlockUI={{@inputBlockUI}}
+                @tagDefs={{@tagDefs}} @changeset={{@changeset}} @checkMarkKeys={{@checkMarkKeys}}
             />
         </legend>
     {{else}}
@@ -29,7 +30,8 @@
                 @readonly={{@readonly}}
                 @isEditableForm={{@isEditableForm}}
                 @draftManager={{@draftManager}}
-                @displayTextOverride={{@uiSubLabel}}
+                @inputBlockUI={{@inputBlockUI}}
+                @tagDefs={{@tagDefs}} @changeset={{@changeset}} @checkMarkKeys={{@checkMarkKeys}}
             />
         </label>
     {{/if}}
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/page-heading/styles.scss b/lib/osf-components/addon/components/registries/schema-block-renderer/page-heading/styles.scss
index 907b577b0..2946681be 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/page-heading/styles.scss
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/page-heading/styles.scss
@@ -2,8 +2,10 @@
     composes: Heading from '../styles';
 
     color: $color-text-gray-blue;
+    margin-bottom: 16px;
 }
 
+
 .PageHeading_helper {
     margin-bottom: 0;
 }
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/styles.scss b/lib/osf-components/addon/components/registries/schema-block-renderer/styles.scss
index 15a39e637..a390a48f2 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/styles.scss
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/styles.scss
@@ -3,7 +3,7 @@
     padding: 0;
 
     &:first-child {
-        margin: 0;
+        margin-top: 0;
     }
 }
 
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/template.hbs b/lib/osf-components/addon/components/registries/schema-block-renderer/template.hbs
index 82ca7dd5f..77c2c12bc 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/template.hbs
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/template.hbs
@@ -2,10 +2,10 @@
     <Mapper as |renderers|>
         {{#let (get renderers @schemaBlock.blockType) as |Renderer|}}
             {{#if this.isLabelBlock}}
-            <Renderer @schemaBlock={{@schemaBlock}} @optionBlocks={{@optionBlocks}} @disabled={{this.disabled}} @shouldShowMessages={{this.shouldShowMessages}} @uniqueID={{@uniqueID}} @isRequired={{@isRequired}} @isFieldsetGroup={{@isFieldsetGroup}} @uiSubLabel={{@uiSubLabel}} />
+            <Renderer @schemaBlock={{@schemaBlock}} @optionBlocks={{@optionBlocks}} @disabled={{this.disabled}} @shouldShowMessages={{this.shouldShowMessages}} @uniqueID={{@uniqueID}} @isRequired={{@isRequired}} @isFieldsetGroup={{@isFieldsetGroup}} @inputBlockUI={{@inputBlockUI}} @tagDefs={{@tagDefs}} @changeset={{@changeset}} @checkMarkKeys={{@checkMarkKeys}} />
             {{else}}
             <div style={{this.uiItemStyle}}>
-                <Renderer @schemaBlock={{@schemaBlock}} @optionBlocks={{@optionBlocks}} @disabled={{this.disabled}} @shouldShowMessages={{this.shouldShowMessages}} @uniqueID={{@uniqueID}} @isRequired={{@isRequired}} @isFieldsetGroup={{@isFieldsetGroup}} @uiSubLabel={{@uiSubLabel}} />
+                <Renderer @schemaBlock={{@schemaBlock}} @optionBlocks={{@optionBlocks}} @disabled={{this.disabled}} @shouldShowMessages={{this.shouldShowMessages}} @uniqueID={{@uniqueID}} @isRequired={{@isRequired}} @isFieldsetGroup={{@isFieldsetGroup}} @inputBlockUI={{@inputBlockUI}} @tagDefs={{@tagDefs}} />
             </div>
             {{/if}}
         {{/let}}
diff --git a/lib/osf-components/addon/components/registries/ui-visual-items/component.ts b/lib/osf-components/addon/components/registries/ui-visual-items/component.ts
index 15357a779..9706587e0 100644
--- a/lib/osf-components/addon/components/registries/ui-visual-items/component.ts
+++ b/lib/osf-components/addon/components/registries/ui-visual-items/component.ts
@@ -1,8 +1,9 @@
 import { tagName } from '@ember-decorators/component';
 import Component from '@ember/component';
+import { action } from '@ember/object';
 
 import { layout } from 'ember-osf-web/decorators/component';
-import { VisualItem } from 'ember-osf-web/packages/registration-schema/ui-group';
+import { TagDefs, VisualItem } from 'ember-osf-web/packages/registration-schema/ui-group';
 
 import styles from './styles';
 import template from './template';
@@ -12,4 +13,12 @@ import template from './template';
 export default class UiVisualItems extends Component {
     items!: VisualItem[];
     baseStrategy!: Component;
+    tagDefs?: TagDefs;
+    changeset?: any;
+    isTopLevel: boolean = false;
+
+    @action
+    preventLabelFocus(event: Event) {
+        event.preventDefault();
+    }
 }
diff --git a/lib/osf-components/addon/components/registries/ui-visual-items/styles.scss b/lib/osf-components/addon/components/registries/ui-visual-items/styles.scss
index e748b9918..dcbde1665 100644
--- a/lib/osf-components/addon/components/registries/ui-visual-items/styles.scss
+++ b/lib/osf-components/addon/components/registries/ui-visual-items/styles.scss
@@ -10,4 +10,28 @@
     font-weight: bold;
     font-size: 1.1em;
     margin: 0 0 5px;
+
+    + :global(label),
+    + :global(fieldset) {
+        margin-top: 0;
+    }
+}
+
+.InfoMark {
+    cursor: pointer;
+    margin-left: 6px;
+    color: #5bc0de;
+}
+
+.TagBadge {
+    display: inline-block;
+    padding: 2px 6px;
+    margin-left: 6px;
+    font-size: 75%;
+    font-weight: bold;
+    color: #fff;
+    background-color: #777;
+    border-radius: 3px;
+    cursor: pointer;
+    vertical-align: middle;
 }
diff --git a/lib/osf-components/addon/components/registries/ui-visual-items/template.hbs b/lib/osf-components/addon/components/registries/ui-visual-items/template.hbs
index 5b0eae423..df6a088f2 100644
--- a/lib/osf-components/addon/components/registries/ui-visual-items/template.hbs
+++ b/lib/osf-components/addon/components/registries/ui-visual-items/template.hbs
@@ -2,17 +2,48 @@
     {{#if item.uiGroup}}
         <div local-class='UiGroup'>
             {{#if item.uiGroup.localizedTitle}}
-                <p local-class='UiGroupHeading'>{{item.uiGroup.localizedTitle}}</p>
+                <div local-class='UiGroupHeading'>
+                    <strong>{{#if (eq item.uiGroup.marker "circle")}}◯ {{/if}}{{item.uiGroup.localizedTitle}}</strong>
+                    {{#each item.uiGroup.resolvedTags as |tag|}}
+                        <span tabindex='-1' {{on 'click' this.preventLabelFocus}}>
+                            <span local-class='TagBadge'>{{tag.localizedText}}</span>
+                            {{#if tag.info}}
+                                <BsPopover @triggerEvents={{array 'focus'}}>
+                                    {{tag.info}}
+                                </BsPopover>
+                            {{/if}}
+                        </span>
+                    {{/each}}
+                    {{#if item.uiGroup.localizedInfo}}
+                        <span local-class='InfoMark' tabindex='-1' {{on 'click' this.preventLabelFocus}}>
+                            ⓘ
+                            <BsPopover @triggerEvents={{array 'focus'}}>
+                                {{item.uiGroup.localizedInfo}}
+                            </BsPopover>
+                        </span>
+                    {{/if}}
+                    {{#if (and @isTopLevel @changeset item.responseKeys)}}
+                        <Registries::ValueCheckMark
+                            @changeset={{@changeset}}
+                            @keys={{item.responseKeys}}
+                        />
+                    {{/if}}
+                </div>
             {{/if}}
             <Registries::UiVisualItems
                 @items={{item.children}}
                 @baseStrategy={{@baseStrategy}}
+                @tagDefs={{@tagDefs}}
+                @changeset={{@changeset}}
             />
         </div>
     {{else}}
         <Registries::SchemaBlockGroupRenderer
             @schemaBlockGroup={{item.schemaBlockGroup}}
             @renderStrategy={{component @baseStrategy schemaBlockGroup=item.schemaBlockGroup}}
+            @tagDefs={{@tagDefs}}
+            @changeset={{if @isTopLevel @changeset}}
+            @checkMarkKeys={{if @isTopLevel item.responseKeys}}
         />
     {{/if}}
 {{/each}}
diff --git a/lib/osf-components/addon/components/registries/value-check-mark/component.ts b/lib/osf-components/addon/components/registries/value-check-mark/component.ts
new file mode 100644
index 000000000..b96ba22da
--- /dev/null
+++ b/lib/osf-components/addon/components/registries/value-check-mark/component.ts
@@ -0,0 +1,25 @@
+import Component from '@glimmer/component';
+import { ChangesetDef } from 'ember-changeset/types';
+
+interface Args {
+    changeset: ChangesetDef;
+    keys: string[];
+}
+
+export default class ValueCheckMark extends Component<Args> {
+    get hasValue(): boolean {
+        const { changeset, keys } = this.args;
+        return keys.some(key => {
+            const value = changeset.get(key);
+            if (value === null || value === undefined || value === '') {
+                return false;
+            }
+            if (Array.isArray(value)) {
+                return value.some((row: any) =>
+                    Object.values(row).some((v: any) => v !== null && v !== undefined && v !== ''),
+                );
+            }
+            return true;
+        });
+    }
+}
diff --git a/lib/osf-components/addon/components/registries/value-check-mark/styles.scss b/lib/osf-components/addon/components/registries/value-check-mark/styles.scss
new file mode 100644
index 000000000..256d6739b
--- /dev/null
+++ b/lib/osf-components/addon/components/registries/value-check-mark/styles.scss
@@ -0,0 +1,4 @@
+.CheckMark {
+    color: #5cb85c;
+    margin-left: 8px;
+}
diff --git a/lib/osf-components/addon/components/registries/value-check-mark/template.hbs b/lib/osf-components/addon/components/registries/value-check-mark/template.hbs
new file mode 100644
index 000000000..1ede76d96
--- /dev/null
+++ b/lib/osf-components/addon/components/registries/value-check-mark/template.hbs
@@ -0,0 +1,3 @@
+{{#if this.hasValue}}
+    <FaIcon @icon='check' local-class='CheckMark' />
+{{/if}}
diff --git a/lib/osf-components/app/components/registries/value-check-mark/component.js b/lib/osf-components/app/components/registries/value-check-mark/component.js
new file mode 100644
index 000000000..a1eeaf0b0
--- /dev/null
+++ b/lib/osf-components/app/components/registries/value-check-mark/component.js
@@ -0,0 +1 @@
+export { default } from 'osf-components/components/registries/value-check-mark/component';
diff --git a/lib/osf-components/app/components/registries/value-check-mark/template.js b/lib/osf-components/app/components/registries/value-check-mark/template.js
new file mode 100644
index 000000000..8ab50450a
--- /dev/null
+++ b/lib/osf-components/app/components/registries/value-check-mark/template.js
@@ -0,0 +1 @@
+export { default } from 'osf-components/components/registries/value-check-mark/template';

From 1f3050f2b7c1b19367b6873de2a6de8a8172427a Mon Sep 17 00:00:00 2001
From: yacchin1205 <968739+yacchin1205@users.noreply.github.com>
Date: Tue, 31 Mar 2026 18:52:35 +0900
Subject: [PATCH 6/7] Fix lint errors: remove optional chaining, fix member
 ordering, alphabetize imports

---
 .../flowable-form/array-input/component.ts    |  8 +-
 .../flowable-form/export-target/component.ts  |  6 +-
 .../flowable-form/field/component.ts          | 87 ++++++++++---------
 .../file-metadata-selector/component.ts       |  4 +-
 .../flowable-form/file-selector/component.ts  | 31 ++-----
 .../notifying-selection-manager.ts            | 16 ++++
 .../flowable-form/file-uploader/component.ts  | 48 +++++-----
 .../project-metadata-selector/component.ts    |  6 +-
 .../-components/task-dialog/component.ts      |  2 +-
 .../-components/wizard-form/component.ts      | 12 +--
 .../wizard-form/expression-evaluator.ts       |  3 +-
 .../wizard-form/template-evaluator.ts         | 69 ++++++++-------
 .../wizard-form/template-parse-error.ts       |  5 ++
 .../workflow/-components/wizard-form/types.ts |  6 +-
 app/guid-node/workflow/controller.ts          |  6 +-
 app/models/registration-schema.ts             |  2 +-
 .../registration-schema/schema-block.ts       | 16 +++-
 app/packages/registration-schema/ui-group.ts  |  6 +-
 app/utils/suggestion-api.ts                   | 10 ++-
 .../draft-registration-card/component.ts      |  4 +-
 .../schema-block-group-renderer/component.ts  |  2 +-
 .../schema-block-renderer/component.ts        |  2 +-
 .../editable/base/styles.scss                 |  3 +-
 .../editable/rdm/array-input/component.ts     |  2 +-
 .../singleselect-pulldown-input/component.ts  |  2 +-
 .../editable/text/component.ts                | 10 +--
 .../editable/text/styles.scss                 |  4 +-
 .../editable/text/template.hbs                |  8 +-
 .../label/label-content/component.ts          |  3 +-
 .../label/label-content/template.hbs          |  6 +-
 .../schema-block-renderer/styles.scss         |  2 +-
 .../schema-block-renderer/template.hbs        |  8 +-
 .../registries/ui-visual-items/component.ts   |  2 +
 .../registries/ui-visual-items/template.hbs   |  4 +-
 .../registries/value-check-mark/component.ts  |  6 +-
 .../draft/-components/register/component.ts   |  2 +-
 36 files changed, 219 insertions(+), 194 deletions(-)
 create mode 100644 app/guid-node/workflow/-components/flowable-form/file-selector/notifying-selection-manager.ts
 create mode 100644 app/guid-node/workflow/-components/wizard-form/template-parse-error.ts

diff --git a/app/guid-node/workflow/-components/flowable-form/array-input/component.ts b/app/guid-node/workflow/-components/flowable-form/array-input/component.ts
index ac8e0509c..1c261c4cc 100644
--- a/app/guid-node/workflow/-components/flowable-form/array-input/component.ts
+++ b/app/guid-node/workflow/-components/flowable-form/array-input/component.ts
@@ -29,10 +29,6 @@ export default class ArrayInput extends Component<ArrayInputArgs> {
 
     private nextKey = 0;
 
-    private allocateKey(): number {
-        return this.nextKey++;
-    }
-
     get rowForms(): Array<{
         row: ArrayInputRow;
         label: string;
@@ -93,6 +89,10 @@ export default class ArrayInput extends Component<ArrayInputArgs> {
         this.notifyChange();
     }
 
+    private allocateKey(): number {
+        return this.nextKey++;
+    }
+
     private buildVariablesForRow(row: ArrayInputRow): WorkflowVariable[] {
         return this.args.fields
             .filter(field => !this.isDisplayField(field))
diff --git a/app/guid-node/workflow/-components/flowable-form/export-target/component.ts b/app/guid-node/workflow/-components/flowable-form/export-target/component.ts
index 859b12952..95dbc92bc 100644
--- a/app/guid-node/workflow/-components/flowable-form/export-target/component.ts
+++ b/app/guid-node/workflow/-components/flowable-form/export-target/component.ts
@@ -37,15 +37,15 @@ export default class ExportTarget extends Component<ExportTargetArgs> {
 
     @action
     initialize() {
-        this.args.onLoadingChange?.(true);
+        if (this.args.onLoadingChange) { this.args.onLoadingChange(true); }
         this.loadProviders.perform().finally(() => {
-            this.args.onLoadingChange?.(false);
+            if (this.args.onLoadingChange) { this.args.onLoadingChange(false); }
         });
     }
 
     @action
     destinationChanged(event: Event) {
-        const value = (event.target as HTMLSelectElement).value;
+        const { value } = (event.target as HTMLSelectElement);
         this.selectedProvider = value;
         this.notifyChange(value);
     }
diff --git a/app/guid-node/workflow/-components/flowable-form/field/component.ts b/app/guid-node/workflow/-components/flowable-form/field/component.ts
index 8bbac0862..3abff8a4e 100644
--- a/app/guid-node/workflow/-components/flowable-form/field/component.ts
+++ b/app/guid-node/workflow/-components/flowable-form/field/component.ts
@@ -2,13 +2,13 @@ import { action } from '@ember/object';
 import Component from '@glimmer/component';
 import { tracked } from '@glimmer/tracking';
 
-import { fetchSuggestions, SuggestionResult } from 'ember-osf-web/utils/suggestion-api';
 import { htmlSafe } from '@ember/template';
+import { fetchSuggestions, SuggestionResult } from 'ember-osf-web/utils/suggestion-api';
 
 import { WorkflowVariable } from '../../../types';
-import { FieldHint, SuggestionConfig } from '../../wizard-form/types';
-import { evaluateTemplate, hasTemplateDirectives } from '../../wizard-form/template-evaluator';
 import { parseProgressSteps, ProgressStep } from '../../progress-sidebar/utils';
+import { evaluateTemplate, hasTemplateDirectives } from '../../wizard-form/template-evaluator';
+import { FieldHint, SuggestionConfig } from '../../wizard-form/types';
 import { FlowableFormContext, resolveFlowableType } from '../component';
 import { FieldValueWithType, WorkflowTaskField, WorkflowTaskFieldOption } from '../types';
 import {
@@ -17,7 +17,7 @@ import {
 } from '../utils';
 
 function renderTemplateAsHtml(tmpl: string, value: Record<string, any>): ReturnType<typeof htmlSafe> {
-    const rendered = tmpl.replace(/\{\{(\w+)\}\}/g, (_match: string, field: string) => {
+    const rendered = tmpl.replace(/\{\{(\w+)\}\}/g, (_: string, field: string) => {
         const v = value[field];
         return v != null ? String(v) : '';
     });
@@ -103,23 +103,23 @@ export default class TaskFormField extends Component<TaskFormFieldArgs> {
 
     @action
     onFieldInsert(): void {
-        this.args.onRegister?.(this.args.field.id, this);
+        if (this.args.onRegister) { this.args.onRegister(this.args.field.id, this); }
     }
 
     @action
     onFieldDestroy(): void {
-        this.args.onUnregister?.(this.args.field.id);
+        if (this.args.onUnregister) { this.args.onUnregister(this.args.field.id); }
     }
 
     // --- Hint accessors ---
 
     get hint(): FieldHint | undefined {
-        return this.args.fieldHints?.[this.args.field.id];
+        return this.args.fieldHints && this.args.fieldHints[this.args.field.id];
     }
 
     get suggestionConfigs(): SuggestionConfig[] | null {
-        const configs = this.hint?.suggestion;
-        if (!configs?.length) {
+        const configs = this.hint && this.hint.suggestion;
+        if (!configs || !configs.length) {
             return null;
         }
         return configs.filter((s: SuggestionConfig) => Boolean(s.template));
@@ -130,7 +130,7 @@ export default class TaskFormField extends Component<TaskFormFieldArgs> {
     }
 
     get widthStyle(): string | undefined {
-        const width = this.hint?.ui?.width;
+        const width = this.hint && this.hint.ui && this.hint.ui.width;
         if (width === 'narrow') {
             return 'max-width: 25%;';
         }
@@ -141,7 +141,7 @@ export default class TaskFormField extends Component<TaskFormFieldArgs> {
     }
 
     get isFreetext(): boolean {
-        return this.hint?.ui?.freetext === true;
+        return Boolean(this.hint && this.hint.ui && this.hint.ui.freetext);
     }
 
     // --- Suggestion / typeahead ---
@@ -194,35 +194,6 @@ export default class TaskFormField extends Component<TaskFormFieldArgs> {
         }
     }
 
-    private applyAutofill(autofillMap: Record<string, string>, responseValue: Record<string, any>): void {
-        const formContext = this.args.formContext!;
-        const allHints = this.args.fieldHints || {};
-
-        for (const [targetFieldId, responseField] of Object.entries(autofillMap)) {
-            const rawValue = responseValue[responseField];
-            if (rawValue == null) {
-                continue;
-            }
-            let resolved = String(rawValue);
-            const targetOptionMap = allHints[targetFieldId]?.ui?.optionMap;
-            if (targetOptionMap?.[resolved]) {
-                resolved = targetOptionMap[resolved];
-            }
-            formContext.setFieldValue(targetFieldId, { value: resolved, type: 'string' });
-        }
-    }
-
-    private async doSearch(keyword: string): Promise<void> {
-        const node = this.args.node;
-        if (!node) {
-            return;
-        }
-        const keys = this.suggestionConfigs!.map(c => c.key);
-        const results = await fetchSuggestions(node.id, keys, keyword);
-        this.suggestionResults = results;
-        this.showSuggestions = results.length > 0;
-    }
-
     // --- Standard field handlers ---
 
     @action
@@ -295,7 +266,7 @@ export default class TaskFormField extends Component<TaskFormFieldArgs> {
 
     @action
     handleLoadingChange(isLoading: boolean): void {
-        this.args.onLoadingChange?.(this.args.field.id, isLoading);
+        if (this.args.onLoadingChange) { this.args.onLoadingChange(this.args.field.id, isLoading); }
     }
 
     @action
@@ -444,7 +415,7 @@ export default class TaskFormField extends Component<TaskFormFieldArgs> {
         if (!allHints) {
             return undefined;
         }
-        const prefix = this.args.field.id + '.';
+        const prefix = `${this.args.field.id}.`;
         const subHints: Record<string, FieldHint> = {};
         let found = false;
         for (const [key, hint] of Object.entries(allHints)) {
@@ -552,7 +523,7 @@ export default class TaskFormField extends Component<TaskFormFieldArgs> {
         const expression = field.expression || '';
 
         // Step 1: ${...} (Flowable UEL) resolution
-        const uelResolved = expression.replace(/\$\{([^}]+)\}/g, (_match, varName) => {
+        const uelResolved = expression.replace(/\$\{([^}]+)\}/g, (_, varName) => {
             const trimmed = varName.trim();
             const variable = this.args.variables.find(v => v.name === trimmed);
             if (variable) {
@@ -594,4 +565,34 @@ export default class TaskFormField extends Component<TaskFormFieldArgs> {
     get remainingExpressionText(): string {
         return this.parsedExpression.remainingText;
     }
+
+    private applyAutofill(autofillMap: Record<string, string>, responseValue: Record<string, any>): void {
+        const formContext = this.args.formContext!;
+        const allHints = this.args.fieldHints || {};
+
+        for (const [targetFieldId, responseField] of Object.entries(autofillMap)) {
+            const rawValue = responseValue[responseField];
+            if (rawValue == null) {
+                continue;
+            }
+            let resolved = String(rawValue);
+            const targetHint = allHints[targetFieldId];
+            const targetOptionMap = targetHint && targetHint.ui && targetHint.ui.optionMap;
+            if (targetOptionMap && targetOptionMap[resolved]) {
+                resolved = targetOptionMap[resolved];
+            }
+            formContext.setFieldValue(targetFieldId, { value: resolved, type: 'string' });
+        }
+    }
+
+    private async doSearch(keyword: string): Promise<void> {
+        const { node } = this.args;
+        if (!node) {
+            return;
+        }
+        const keys = this.suggestionConfigs!.map(c => c.key);
+        const results = await fetchSuggestions(node.id, keys, keyword);
+        this.suggestionResults = results;
+        this.showSuggestions = results.length > 0;
+    }
 }
diff --git a/app/guid-node/workflow/-components/flowable-form/file-metadata-selector/component.ts b/app/guid-node/workflow/-components/flowable-form/file-metadata-selector/component.ts
index 5c1e2e156..7c194b4f0 100644
--- a/app/guid-node/workflow/-components/flowable-form/file-metadata-selector/component.ts
+++ b/app/guid-node/workflow/-components/flowable-form/file-metadata-selector/component.ts
@@ -191,9 +191,9 @@ export default class FileMetadataSelector extends Component<FileMetadataSelector
     initialize() {
         if (!this.isInitialized) {
             this.isInitialized = true;
-            this.args.onLoadingChange?.(true);
+            if (this.args.onLoadingChange) { this.args.onLoadingChange(true); }
             this.loadFileMetadata.perform().finally(() => {
-                this.args.onLoadingChange?.(false);
+                if (this.args.onLoadingChange) { this.args.onLoadingChange(false); }
             });
         }
     }
diff --git a/app/guid-node/workflow/-components/flowable-form/file-selector/component.ts b/app/guid-node/workflow/-components/flowable-form/file-selector/component.ts
index 147263047..d642e7b94 100644
--- a/app/guid-node/workflow/-components/flowable-form/file-selector/component.ts
+++ b/app/guid-node/workflow/-components/flowable-form/file-selector/component.ts
@@ -5,10 +5,9 @@ import { task } from 'ember-concurrency-decorators';
 
 import FileProviderModel from 'ember-osf-web/models/file-provider';
 import Node from 'ember-osf-web/models/node';
-import { SelectionManager } from 'ember-osf-web/guid-node/package/selection';
-import { WaterButlerFile } from 'ember-osf-web/utils/waterbutler/base';
 
 import { FieldValueWithType } from '../types';
+import NotifyingSelectionManager from './notifying-selection-manager';
 
 interface FileSelectorValue {
     provider: string;
@@ -23,29 +22,10 @@ interface FileSelectorArgs {
     disabled: boolean;
 }
 
-class NotifyingSelectionManager extends SelectionManager {
-    private onUpdate: () => void;
-
-    constructor(onUpdate: () => void) {
-        super();
-        this.onUpdate = onUpdate;
-    }
-
-    setChecked(item: WaterButlerFile, value: boolean) {
-        super.setChecked(item, value);
-        this.onUpdate();
-    }
-}
-
 export default class FileSelector extends Component<FileSelectorArgs> {
     selectionManager: NotifyingSelectionManager;
     @tracked providerName: string = '';
 
-    constructor(owner: unknown, args: FileSelectorArgs) {
-        super(owner, args);
-        this.selectionManager = new NotifyingSelectionManager(() => this.emitValue());
-    }
-
     @task
     loadProvider = task(function *(this: FileSelector) {
         const providers: FileProviderModel[] = (yield this.args.node.loadAll('files')).toArray();
@@ -60,11 +40,16 @@ export default class FileSelector extends Component<FileSelectorArgs> {
         this.emitValue();
     });
 
+    constructor(owner: unknown, args: FileSelectorArgs) {
+        super(owner, args);
+        this.selectionManager = new NotifyingSelectionManager(() => this.emitValue());
+    }
+
     @action
     initialize() {
-        this.args.onLoadingChange?.(true);
+        if (this.args.onLoadingChange) { this.args.onLoadingChange(true); }
         this.loadProvider.perform().finally(() => {
-            this.args.onLoadingChange?.(false);
+            if (this.args.onLoadingChange) { this.args.onLoadingChange(false); }
         });
     }
 
diff --git a/app/guid-node/workflow/-components/flowable-form/file-selector/notifying-selection-manager.ts b/app/guid-node/workflow/-components/flowable-form/file-selector/notifying-selection-manager.ts
new file mode 100644
index 000000000..08bfb789d
--- /dev/null
+++ b/app/guid-node/workflow/-components/flowable-form/file-selector/notifying-selection-manager.ts
@@ -0,0 +1,16 @@
+import { SelectionManager } from 'ember-osf-web/guid-node/package/selection';
+import { WaterButlerFile } from 'ember-osf-web/utils/waterbutler/base';
+
+export default class NotifyingSelectionManager extends SelectionManager {
+    private onUpdate: () => void;
+
+    constructor(onUpdate: () => void) {
+        super();
+        this.onUpdate = onUpdate;
+    }
+
+    setChecked(item: WaterButlerFile, value: boolean) {
+        super.setChecked(item, value);
+        this.onUpdate();
+    }
+}
diff --git a/app/guid-node/workflow/-components/flowable-form/file-uploader/component.ts b/app/guid-node/workflow/-components/flowable-form/file-uploader/component.ts
index 5544e3a78..497a2a738 100644
--- a/app/guid-node/workflow/-components/flowable-form/file-uploader/component.ts
+++ b/app/guid-node/workflow/-components/flowable-form/file-uploader/component.ts
@@ -1,9 +1,9 @@
 import { action } from '@ember/object';
+import { inject as service } from '@ember/service';
 import Component from '@glimmer/component';
 import { tracked } from '@glimmer/tracking';
-import { inject as service } from '@ember/service';
-import { task } from 'ember-concurrency-decorators';
 import { all } from 'ember-concurrency';
+import { task } from 'ember-concurrency-decorators';
 import DS from 'ember-data';
 import Toast from 'ember-toastr/services/toast';
 import $ from 'jquery';
@@ -86,28 +86,6 @@ export default class FileUploader extends Component<FileUploaderArgs> {
             .join(', ');
     }
 
-    private isAcceptedExtension(filename: string): boolean {
-        if (this.args.acceptExtensions.length === 0) {
-            return true;
-        }
-        const pos = filename.lastIndexOf('.');
-        if (pos <= 0) {
-            return false;
-        }
-        const ext = filename.substring(pos).toLowerCase();
-        return this.args.acceptExtensions.includes(ext);
-    }
-
-    // --- Lifecycle ---
-
-    @action
-    initialize() {
-        this.args.onLoadingChange?.(true);
-        this.setupFolder.perform().finally(() => {
-            this.args.onLoadingChange?.(false);
-        });
-    }
-
     // --- Folder setup ---
 
     @task
@@ -184,6 +162,16 @@ export default class FileUploader extends Component<FileUploaderArgs> {
         this.emitValue();
     });
 
+    // --- Lifecycle ---
+
+    @action
+    initialize() {
+        if (this.args.onLoadingChange) { this.args.onLoadingChange(true); }
+        this.setupFolder.perform().finally(() => {
+            if (this.args.onLoadingChange) { this.args.onLoadingChange(false); }
+        });
+    }
+
     @action
     buildUrl(files: File[]): string | undefined {
         if (!this.targetDirectory) {
@@ -207,7 +195,17 @@ export default class FileUploader extends Component<FileUploaderArgs> {
         this.filter = filter;
     }
 
-    // --- Value emission ---
+    private isAcceptedExtension(filename: string): boolean {
+        if (this.args.acceptExtensions.length === 0) {
+            return true;
+        }
+        const pos = filename.lastIndexOf('.');
+        if (pos <= 0) {
+            return false;
+        }
+        const ext = filename.substring(pos).toLowerCase();
+        return this.args.acceptExtensions.includes(ext);
+    }
 
     private emitValue(): void {
         const files = this.allFiles.map(f => ({
diff --git a/app/guid-node/workflow/-components/flowable-form/project-metadata-selector/component.ts b/app/guid-node/workflow/-components/flowable-form/project-metadata-selector/component.ts
index 1ecd1eb9f..f9c684f83 100644
--- a/app/guid-node/workflow/-components/flowable-form/project-metadata-selector/component.ts
+++ b/app/guid-node/workflow/-components/flowable-form/project-metadata-selector/component.ts
@@ -114,9 +114,9 @@ export default class ProjectMetadataSelector extends Component<ProjectMetadataSe
     initialize() {
         if (!this.isInitialized) {
             this.isInitialized = true;
-            this.args.onLoadingChange?.(true);
+            if (this.args.onLoadingChange) { this.args.onLoadingChange(true); }
             this.loadMetadataRecords.perform().finally(() => {
-                this.args.onLoadingChange?.(false);
+                if (this.args.onLoadingChange) { this.args.onLoadingChange(false); }
             });
         }
     }
@@ -134,7 +134,7 @@ export default class ProjectMetadataSelector extends Component<ProjectMetadataSe
                 this.selectedGuids = guids;
             }
         } else if (!this.selectedGuid && guids[0]) {
-            this.selectedGuid = guids[0];
+            [this.selectedGuid] = guids;
         }
     }
 
diff --git a/app/guid-node/workflow/-components/task-dialog/component.ts b/app/guid-node/workflow/-components/task-dialog/component.ts
index 80b0f6664..aeaf59a37 100644
--- a/app/guid-node/workflow/-components/task-dialog/component.ts
+++ b/app/guid-node/workflow/-components/task-dialog/component.ts
@@ -6,13 +6,13 @@ import { tracked } from '@glimmer/tracking';
 import Intl from 'ember-intl/services/intl';
 import Node from 'ember-osf-web/models/node';
 
-import { extractWizardConfig, WizardNavigation } from '../wizard-form/types';
 import {
     TaskDialogSubmission,
     WorkflowTaskDetail,
     WorkflowVariable,
 } from '../../types';
 import { isFinalStep } from '../progress-sidebar/utils';
+import { extractWizardConfig, WizardNavigation } from '../wizard-form/types';
 
 interface WorkflowTaskDialogArgs {
     open: boolean;
diff --git a/app/guid-node/workflow/-components/wizard-form/component.ts b/app/guid-node/workflow/-components/wizard-form/component.ts
index 7115112e9..6212099a5 100644
--- a/app/guid-node/workflow/-components/wizard-form/component.ts
+++ b/app/guid-node/workflow/-components/wizard-form/component.ts
@@ -80,7 +80,7 @@ export default class WizardForm extends Component<WizardFormArgs> {
         }
 
         // Restore draft if available
-        const taskId = this.args.taskId;
+        const { taskId } = this.args;
         const formKey = this.args.form.key || '';
         let restoredPageId = '';
         if (taskId) {
@@ -176,7 +176,7 @@ export default class WizardForm extends Component<WizardFormArgs> {
 
     @action
     handleFinalSubmit(): void {
-        const taskId = this.args.taskId;
+        const { taskId } = this.args;
         if (taskId) {
             clearDraft(taskId);
         }
@@ -275,9 +275,9 @@ export default class WizardForm extends Component<WizardFormArgs> {
                 const sourceId = alias[field.id];
                 if (sourceId) {
                     const source = this.allFieldValues[sourceId];
-                    const fv = this.allFieldValues[field.id];
-                    if (source && fv) {
-                        variables.push({ name: field.id, value: source.value, type: fv.type });
+                    const aliasFv = this.allFieldValues[field.id];
+                    if (source && aliasFv) {
+                        variables.push({ name: field.id, value: source.value, type: aliasFv.type });
                     }
                 }
                 continue;
@@ -302,7 +302,7 @@ export default class WizardForm extends Component<WizardFormArgs> {
     }
 
     private saveDraftNow(): void {
-        const taskId = this.args.taskId;
+        const { taskId } = this.args;
         if (!taskId) {
             return;
         }
diff --git a/app/guid-node/workflow/-components/wizard-form/expression-evaluator.ts b/app/guid-node/workflow/-components/wizard-form/expression-evaluator.ts
index b8022c5b3..9c3c9a3d6 100644
--- a/app/guid-node/workflow/-components/wizard-form/expression-evaluator.ts
+++ b/app/guid-node/workflow/-components/wizard-form/expression-evaluator.ts
@@ -16,6 +16,7 @@ const STOP_CHARS = new Set(['&', '|', '!', '=', '(', ')', "'", ' ', '\t']);
 
 class Parser {
     private pos = 0;
+    // eslint-disable-next-line no-useless-constructor, no-empty-function
     constructor(private source: string) {}
 
     parse(context: Record<string, unknown>): boolean {
@@ -107,7 +108,7 @@ class Parser {
                 return left !== right;
             }
         }
-        return toBool(left);
+        return toBool(left); // eslint-disable-line no-use-before-define
     }
 
     private primary(ctx: Record<string, unknown>): unknown {
diff --git a/app/guid-node/workflow/-components/wizard-form/template-evaluator.ts b/app/guid-node/workflow/-components/wizard-form/template-evaluator.ts
index 1cc0fb2e3..6e0a2562a 100644
--- a/app/guid-node/workflow/-components/wizard-form/template-evaluator.ts
+++ b/app/guid-node/workflow/-components/wizard-form/template-evaluator.ts
@@ -23,6 +23,8 @@
  *   ident       = [a-zA-Z_\u3000-\u9FFF][a-zA-Z0-9_\u3000-\u9FFF-]*
  */
 
+import TemplateParseError from './template-parse-error';
+
 // ---------------------------------------------------------------------------
 // Types
 // ---------------------------------------------------------------------------
@@ -63,7 +65,6 @@ interface IfBranch {
     body: AstNode[];
 }
 
-
 type Expr =
     | { type: 'ident'; name: string }
     | { type: 'string'; value: string }
@@ -80,12 +81,6 @@ type Expr =
 // Error
 // ---------------------------------------------------------------------------
 
-class TemplateParseError extends Error {
-    constructor(message: string, public pos: number) {
-        super(`Template parse error at ${pos}: ${message}`);
-    }
-}
-
 // ---------------------------------------------------------------------------
 // Tokenizer — split template into text / expr / tag segments
 // ---------------------------------------------------------------------------
@@ -124,7 +119,7 @@ function tokenize(source: string): Segment[] {
         // Look for close with optional trim dash
         let closePos = -1;
         let trimAfter = false;
-        let searchFrom = contentStart;
+        const searchFrom = contentStart;
         while (searchFrom < source.length) {
             const ci = source.indexOf(closeTag, searchFrom);
             if (ci === -1) {
@@ -172,7 +167,7 @@ function isIdentStart(ch: string): boolean {
 }
 
 function isIdentChar(ch: string): boolean {
-    return /[a-zA-Z0-9_\u3000-\u9FFF\-]/.test(ch);
+    return /[a-zA-Z0-9_\u3000-\u9FFF-]/.test(ch);
 }
 
 class ExprParser {
@@ -190,6 +185,27 @@ class ExprParser {
         return this.source.substr(this.pos, s.length) === s;
     }
 
+    parseExpression(): Expr {
+        this.skipWs();
+        return this.orExpr();
+    }
+
+    readIdent(): string {
+        const start = this.pos;
+        if (!isIdentStart(this.source[this.pos])) {
+            throw new TemplateParseError('expected identifier', this.pos);
+        }
+        this.pos++;
+        while (this.pos < this.source.length && isIdentChar(this.source[this.pos])) {
+            this.pos++;
+        }
+        // Trim trailing hyphens (e.g. prevent matching the dash in "-%}")
+        while (this.pos > start + 1 && this.source[this.pos - 1] === '-') {
+            this.pos--;
+        }
+        return this.source.substring(start, this.pos);
+    }
+
     private peekKeyword(kw: string): boolean {
         if (!this.peek(kw)) {
             return false;
@@ -198,11 +214,6 @@ class ExprParser {
         return after >= this.source.length || !isIdentChar(this.source[after]);
     }
 
-    parseExpression(): Expr {
-        this.skipWs();
-        return this.orExpr();
-    }
-
     private orExpr(): Expr {
         let left = this.andExpr();
         while (this.peekKeyword('or')) {
@@ -352,23 +363,6 @@ class ExprParser {
         this.pos = end + 1;
         return this.source.substring(start, end);
     }
-
-    readIdent(): string {
-        const start = this.pos;
-        if (!isIdentStart(this.source[this.pos])) {
-            throw new TemplateParseError('expected identifier', this.pos);
-        }
-        this.pos++;
-        while (this.pos < this.source.length && isIdentChar(this.source[this.pos])) {
-            this.pos++;
-        }
-        // Trim trailing hyphens (e.g. prevent matching the dash in "-%}")
-        while (this.pos > start + 1 && this.source[this.pos - 1] === '-') {
-            this.pos--;
-        }
-        return this.source.substring(start, this.pos);
-    }
-
 }
 
 // ---------------------------------------------------------------------------
@@ -394,7 +388,7 @@ function parseTemplate(segments: Segment[]): AstNode[] {
             if (seg.type === 'expr') {
                 const ep = new ExprParser(seg.value);
                 const expr = ep.parseExpression();
-                assertFullyConsumed(ep, '{{ }}');
+                assertFullyConsumed(ep, '{{ }}'); // eslint-disable-line no-use-before-define
                 nodes.push({ type: 'interpolation', expr });
                 pos++;
                 continue;
@@ -407,18 +401,19 @@ function parseTemplate(segments: Segment[]): AstNode[] {
             if (until && tagContent === until) {
                 return nodes;
             }
-            if (tagContent === 'endfor' || tagContent === 'endif' || tagContent.startsWith('elif ') || tagContent === 'else') {
+            if (tagContent === 'endfor' || tagContent === 'endif'
+                || tagContent.startsWith('elif ') || tagContent === 'else') {
                 // Reached a boundary tag — return to caller
                 return nodes;
             }
 
             if (tagContent.startsWith('for ')) {
-                nodes.push(parseFor(tagContent));
+                nodes.push(parseFor(tagContent)); // eslint-disable-line no-use-before-define
                 continue;
             }
 
             if (tagContent.startsWith('if ')) {
-                nodes.push(parseIf(tagContent));
+                nodes.push(parseIf(tagContent)); // eslint-disable-line no-use-before-define
                 continue;
             }
 
@@ -575,6 +570,8 @@ function evalExpr(expr: Expr, ctx: Record<string, unknown>): unknown {
         const args = expr.args.map(a => evalExpr(a, ctx));
         return fn(value, ...args);
     }
+    default:
+        throw new Error(`unknown expr type: ${(expr as any).type}`);
     }
 }
 
@@ -614,6 +611,8 @@ function evaluate(nodes: AstNode[], ctx: Record<string, unknown>): string {
                 }
             }
             break;
+        default:
+            break;
         }
     }
     return out;
diff --git a/app/guid-node/workflow/-components/wizard-form/template-parse-error.ts b/app/guid-node/workflow/-components/wizard-form/template-parse-error.ts
new file mode 100644
index 000000000..8813b31c1
--- /dev/null
+++ b/app/guid-node/workflow/-components/wizard-form/template-parse-error.ts
@@ -0,0 +1,5 @@
+export default class TemplateParseError extends Error {
+    constructor(message: string, public pos: number) {
+        super(`Template parse error at ${pos}: ${message}`);
+    }
+}
diff --git a/app/guid-node/workflow/-components/wizard-form/types.ts b/app/guid-node/workflow/-components/wizard-form/types.ts
index c9924a4a3..271cd5b5d 100644
--- a/app/guid-node/workflow/-components/wizard-form/types.ts
+++ b/app/guid-node/workflow/-components/wizard-form/types.ts
@@ -1,3 +1,5 @@
+import { ProgressStep } from '../progress-sidebar/utils';
+
 export interface RdmWizardPage {
     id: string;
     title: string;
@@ -43,8 +45,6 @@ export interface RdmWizard {
     fieldHints?: Record<string, FieldHint>;
 }
 
-import { ProgressStep } from '../progress-sidebar/utils';
-
 export interface WizardNavigation {
     isFirstPage: boolean;
     isLastPage: boolean;
@@ -71,7 +71,7 @@ export function extractWizardConfig(fields?: Array<{ id: string; expression?: st
         return null;
     }
     if (!field.expression) {
-        throw new Error(`_rdmWizard field found but expression is empty`);
+        throw new Error('_rdmWizard field found but expression is empty');
     }
     return JSON.parse(field.expression) as RdmWizard;
 }
diff --git a/app/guid-node/workflow/controller.ts b/app/guid-node/workflow/controller.ts
index 0d480aa70..befb38474 100644
--- a/app/guid-node/workflow/controller.ts
+++ b/app/guid-node/workflow/controller.ts
@@ -155,7 +155,8 @@ export default class GuidNodeWorkflowController extends Controller {
             return [];
         }
         const currentNodeId = this.node.id;
-        const hasAdminPermission = this.node.currentUserPermissions?.includes(Permission.Admin) ?? false;
+        const hasAdminPermission = (this.node.currentUserPermissions
+            && this.node.currentUserPermissions.includes(Permission.Admin)) || false;
         const filtered = this.hideCompletedRuns
             ? this.runs.filter(run => run.status === 'running')
             : this.runs;
@@ -226,7 +227,8 @@ export default class GuidNodeWorkflowController extends Controller {
     }
 
     get canStartWorkflow(): boolean {
-        return this.node?.currentUserPermissions?.includes(Permission.Write) ?? false;
+        return (this.node && this.node.currentUserPermissions
+            && this.node.currentUserPermissions.includes(Permission.Write)) || false;
     }
 
     get selectedTemplate(): WorkflowTemplate | undefined {
diff --git a/app/models/registration-schema.ts b/app/models/registration-schema.ts
index d57ec688f..402ed6d08 100644
--- a/app/models/registration-schema.ts
+++ b/app/models/registration-schema.ts
@@ -81,7 +81,7 @@ export default class RegistrationSchemaModel extends OsfModel {
         return this.localizeText(this.schema.ui && this.schema.ui.label) || this.name;
     }
 
-    @computed('schema.ui.description', 'schema.description')
+    @computed('schema.{ui.description,description}')
     get localizedDescription(): string {
         return this.localizeText(this.schema.ui && this.schema.ui.description) || this.schema.description;
     }
diff --git a/app/packages/registration-schema/schema-block.ts b/app/packages/registration-schema/schema-block.ts
index 5ae4f16b6..b95133ec8 100644
--- a/app/packages/registration-schema/schema-block.ts
+++ b/app/packages/registration-schema/schema-block.ts
@@ -57,8 +57,18 @@ export interface SchemaBlock {
     rowAdditionCaption?: string;
     suggestion?: string;
     ui?: {
-        group?: string | { id: string; title?: string; marker?: string; bar?: boolean; tags?: (string | { id: string; info?: string })[]; help?: string; info?: string; parent?: string | { id: string; title?: string } };
-        sub_label?: string;
-        item?: { marker?: string; placeholder?: string; width?: string; widget?: string; enabled_if?: object; info?: string; tags?: (string | { id: string; info?: string })[]; freetext?: boolean };
+        group?: string | {
+            id: string; title?: string; marker?: string; bar?: boolean;
+            tags?: Array<string | { id: string; info?: string }>;
+            help?: string; info?: string;
+            parent?: string | { id: string; title?: string };
+        };
+        sub_label?: string; // eslint-disable-line camelcase
+        item?: {
+            marker?: string; placeholder?: string; width?: string;
+            widget?: string; enabled_if?: object; // eslint-disable-line camelcase
+            info?: string; tags?: Array<string | { id: string; info?: string }>;
+            freetext?: boolean;
+        };
     };
 }
diff --git a/app/packages/registration-schema/ui-group.ts b/app/packages/registration-schema/ui-group.ts
index 39eb34525..3fb2b61e0 100644
--- a/app/packages/registration-schema/ui-group.ts
+++ b/app/packages/registration-schema/ui-group.ts
@@ -44,7 +44,7 @@ function collectTagDefs(tags: any[] | undefined, tagDefs: { [id: string]: { info
     }
     for (const tag of tags) {
         if (typeof tag === 'object' && tag.id) {
-            tagDefs[tag.id] = { info: tag.info };
+            tagDefs[tag.id] = { info: tag.info }; // eslint-disable-line no-param-reassign
         }
     }
 }
@@ -77,7 +77,7 @@ export function resolveTags(
     });
 }
 
-export type TagDefs = { [id: string]: { info?: string } };
+export interface TagDefs { [id: string]: { info?: string }; }
 
 export function buildVisualItems(
     groups: SchemaBlockGroup[],
@@ -126,7 +126,7 @@ export function buildVisualItems(
     }
 
     for (const group of groups) {
-        const inputBlock = group.inputBlock;
+        const { inputBlock } = group;
         if (group.registrationResponseKey && group.registrationResponseKey.match(/^__responseKey_grdm-file:.+$/)) {
             root.push({ schemaBlockGroup: group });
             continue;
diff --git a/app/utils/suggestion-api.ts b/app/utils/suggestion-api.ts
index ddd4b2f13..71e6fbbc6 100644
--- a/app/utils/suggestion-api.ts
+++ b/app/utils/suggestion-api.ts
@@ -1,5 +1,5 @@
-import config from 'ember-get-config';
 import { ChangesetDef } from 'ember-changeset/types';
+import config from 'ember-get-config';
 import { SchemaBlock } from 'ember-osf-web/packages/registration-schema';
 import { PageManager } from 'ember-osf-web/packages/registration-schema/page-manager';
 
@@ -55,7 +55,7 @@ export function resolveAutofillKey(currentResponseKey: string, targetFieldId: st
     if (pipeIndex >= 0) {
         return currentResponseKey.substring(0, pipeIndex + 1) + targetFieldId;
     }
-    return '__responseKey_' + targetFieldId;
+    return `__responseKey_${targetFieldId}`;
 }
 
 /**
@@ -79,11 +79,13 @@ function findOptionBlocks(pageManagers: PageManager[], fieldId: string): SchemaB
     const targetSuffix = `_${fieldId}`;
     for (const pm of pageManagers) {
         for (const group of pm.schemaBlockGroups || []) {
-            if (group.registrationResponseKey?.endsWith(targetSuffix) && group.optionBlocks && group.optionBlocks.length) {
+            if (group.registrationResponseKey && group.registrationResponseKey.endsWith(targetSuffix)
+                && group.optionBlocks && group.optionBlocks.length) {
                 return group.optionBlocks;
             }
             for (const child of group.children || []) {
-                if (child.registrationResponseKey?.endsWith(targetSuffix) && child.optionBlocks && child.optionBlocks.length) {
+                if (child.registrationResponseKey && child.registrationResponseKey.endsWith(targetSuffix)
+                    && child.optionBlocks && child.optionBlocks.length) {
                     return child.optionBlocks;
                 }
             }
diff --git a/lib/osf-components/addon/components/draft-registration-card/component.ts b/lib/osf-components/addon/components/draft-registration-card/component.ts
index 27a8bf772..98742d5a1 100644
--- a/lib/osf-components/addon/components/draft-registration-card/component.ts
+++ b/lib/osf-components/addon/components/draft-registration-card/component.ts
@@ -65,7 +65,7 @@ export default class DraftRegistrationCard extends Component {
 
     @computed('draftRegistration.registrationResponses')
     get wekoItemId(): string | null {
-        return getWekoItemId(this.draftRegistration?.registrationResponses);
+        return getWekoItemId(this.draftRegistration && this.draftRegistration.registrationResponses);
     }
 
     @computed('draftRegistration.registrationSchema.name')
@@ -75,7 +75,7 @@ export default class DraftRegistrationCard extends Component {
 
     @computed('draftRegistration.registrationResponses')
     get workflowRunId(): string | null {
-        return getWorkflowRunId(this.draftRegistration?.registrationResponses);
+        return getWorkflowRunId(this.draftRegistration && this.draftRegistration.registrationResponses);
     }
 
     @computed('draftRegistration.branchedFrom')
diff --git a/lib/osf-components/addon/components/registries/schema-block-group-renderer/component.ts b/lib/osf-components/addon/components/registries/schema-block-group-renderer/component.ts
index a8dceb8a2..0ba83821e 100644
--- a/lib/osf-components/addon/components/registries/schema-block-group-renderer/component.ts
+++ b/lib/osf-components/addon/components/registries/schema-block-group-renderer/component.ts
@@ -56,7 +56,7 @@ export default class SchemaBlockGroupRenderer extends Component {
 
     @computed('schemaBlockGroup.inputBlock.ui')
     get inputBlockUI() {
-        const inputBlock = this.schemaBlockGroup.inputBlock;
+        const { inputBlock } = this.schemaBlockGroup;
         return inputBlock && inputBlock.ui;
     }
 
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/component.ts b/lib/osf-components/addon/components/registries/schema-block-renderer/component.ts
index 40a7ae11a..ab11a4329 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/component.ts
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/component.ts
@@ -41,7 +41,7 @@ export default class SchemaBlockRenderer extends Component {
 
     @computed('schemaBlock.ui')
     get uiItemStyle(): ReturnType<typeof htmlSafe> | undefined {
-        const ui = this.schemaBlock.ui;
+        const { ui } = this.schemaBlock;
         if (!ui || !ui.item || !ui.item.width) {
             return undefined;
         }
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/base/styles.scss b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/base/styles.scss
index f9746efb5..9885f52bc 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/base/styles.scss
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/base/styles.scss
@@ -35,7 +35,8 @@
         padding: 6px;
     }
 
-    :global(input[type='radio']) {
+    :global([type='radio']) {
+        /* stylelint-disable-next-line property-no-unknown */
         accent-color: #3779b3;
     }
 }
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/component.ts b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/component.ts
index 09c1831f0..a1077c454 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/component.ts
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/array-input/component.ts
@@ -112,7 +112,7 @@ export default class ArrayInput extends Component {
 
     @computed('schemaBlockGroup.children')
     get visualItems(): VisualItem[] {
-        const children = this.schemaBlockGroup.children;
+        const { children } = this.schemaBlockGroup;
         if (!children) {
             return [];
         }
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/singleselect-pulldown-input/component.ts b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/singleselect-pulldown-input/component.ts
index ce64aa5de..2e3b15805 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/singleselect-pulldown-input/component.ts
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/rdm/singleselect-pulldown-input/component.ts
@@ -38,7 +38,7 @@ export default class SingleSelectPulldownInput extends Component {
 
     @computed('schemaBlock.ui')
     get allowFreetext(): boolean {
-        const ui = this.schemaBlock.ui;
+        const { ui } = this.schemaBlock;
         return Boolean(ui && ui.item && ui.item.freetext);
     }
 
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/component.ts b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/component.ts
index fe8b3a53e..027acd484 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/component.ts
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/component.ts
@@ -2,19 +2,19 @@ import { tagName } from '@ember-decorators/component';
 import Component from '@ember/component';
 import { action, computed } from '@ember/object';
 import { alias } from '@ember/object/computed';
+import { run } from '@ember/runloop';
+import { htmlSafe } from '@ember/template';
 import { ChangesetDef } from 'ember-changeset/types';
 import { layout } from 'ember-osf-web/decorators/component';
 import NodeModel from 'ember-osf-web/models/node';
 import { SchemaBlock } from 'ember-osf-web/packages/registration-schema';
-import DraftRegistrationManager from 'registries/drafts/draft/draft-registration-manager';
 import {
     applyAutofill,
     fetchSuggestions,
     SuggestionConfig,
     SuggestionResult,
 } from 'ember-osf-web/utils/suggestion-api';
-import { htmlSafe } from '@ember/template';
-import { run } from '@ember/runloop';
+import DraftRegistrationManager from 'registries/drafts/draft/draft-registration-manager';
 
 import styles from './styles';
 import template from './template';
@@ -23,7 +23,7 @@ import template from './template';
  * Render a suggestion template with variable substitution and strip HTML for plain text display.
  */
 function renderTemplateAsText(tmpl: string, value: { [field: string]: any }): string {
-    const substituted = tmpl.replace(/\{\{(\w+)\}\}/g, (_match: string, field: string) => {
+    const substituted = tmpl.replace(/\{\{(\w+)\}\}/g, (_: string, field: string) => {
         const v = value[field];
         return v != null ? String(v) : '';
     });
@@ -31,7 +31,7 @@ function renderTemplateAsText(tmpl: string, value: { [field: string]: any }): st
 }
 
 function renderTemplateAsHtml(tmpl: string, value: { [field: string]: any }): any {
-    const rendered = tmpl.replace(/\{\{(\w+)\}\}/g, (_match: string, field: string) => {
+    const rendered = tmpl.replace(/\{\{(\w+)\}\}/g, (_: string, field: string) => {
         const v = value[field];
         return v != null ? String(v) : '';
     });
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/styles.scss b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/styles.scss
index 65b1fee30..11b187916 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/styles.scss
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/styles.scss
@@ -27,9 +27,9 @@
     margin: 0;
     padding: 0;
     list-style: none;
-    background: white;
+    background: #fff;
     border: 1px solid #ccc;
-    border-top: none;
+    border-top: 0;
     border-radius: 0 0 4px 4px;
     box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
 }
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/template.hbs b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/template.hbs
index 4f9ddf254..f01730f93 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/template.hbs
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/editable/text/template.hbs
@@ -9,20 +9,22 @@
             <div local-class='typeahead-container'>
                 <input
                     data-test-text-input
-                    type="text"
-                    class="form-control"
+                    type='text'
+                    class='form-control'
                     value={{or (get @changeset this.valuePath) ''}}
                     oninput={{action this.onTypeaheadInput}}
                     onblur={{action this.onTypeaheadBlur}}
                     placeholder=' '
-                />
+                >
                 {{#if this.showSuggestions}}
                     <ul local-class='typeahead-dropdown'>
                         {{#each this.suggestionItems as |item|}}
+                            {{!-- template-lint-disable no-invalid-interactive --}}
                             <li
                                 local-class='typeahead-item'
                                 onmousedown={{action this.onSuggestionSelect item.key}}
                             >
+                                {{!-- template-lint-disable no-triple-curlies --}}
                                 {{{item.html}}}
                             </li>
                         {{/each}}
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/component.ts b/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/component.ts
index 664d0899e..b9b9dc1f8 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/component.ts
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/component.ts
@@ -25,6 +25,8 @@ export default class LabelContent extends Component {
 
     // Private property
     shouldShowExample = false;
+    circleMarker = '\u25CB';
+    infoMark = '\u24D8';
 
     @computed('inputBlockUI')
     get displayTextOverride(): string | undefined {
@@ -49,7 +51,6 @@ export default class LabelContent extends Component {
             return undefined;
         }
         if (!this.tagDefs) {
-            console.warn(`[metadata] tagDefs not provided for block with ui.item.tags: ${this.schemaBlock.displayText}`);
             return undefined;
         }
         return resolveTags(tags, this.tagDefs, text => this.getLocalizedText(text));
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/template.hbs b/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/template.hbs
index c45fe8217..5490b81cd 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/template.hbs
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/label/label-content/template.hbs
@@ -1,8 +1,8 @@
 {{assert 'Registries::SchemaBlockRenderer::Label::LabelContent requires a @schemaBlock' @schemaBlock}}
 <p
     ...attributes
-    local-class='DisplayText {{if this.displayTextOverride "SubLabel"}}'>
-    {{~#if (eq this.itemMarker "circle")~}}◯ {{~/if~}}
+    local-class='DisplayText {{if this.displayTextOverride 'SubLabel'}}'>
+    {{~#if (eq this.itemMarker 'circle')~}}{{this.circleMarker}} {{~/if~}}
     {{~this.localizedDisplayText~}}
     {{~#if (and @isRequired (not @readonly))~}}
         <span local-class='Required'>*</span>
@@ -20,7 +20,7 @@
 {{~/each~}}
 {{~#if this.itemInfo~}}
     <span local-class='InfoMark' tabindex='-1' {{on 'click' this.preventLabelFocus}}>
-        ⓘ
+        {{this.infoMark}}
         <BsPopover @triggerEvents={{array 'focus'}}>
             {{this.itemInfo}}
         </BsPopover>
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/styles.scss b/lib/osf-components/addon/components/registries/schema-block-renderer/styles.scss
index a390a48f2..3057f4af8 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/styles.scss
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/styles.scss
@@ -9,4 +9,4 @@
 
 .Element {
     margin: 10px 0 0;
-}
\ No newline at end of file
+}
diff --git a/lib/osf-components/addon/components/registries/schema-block-renderer/template.hbs b/lib/osf-components/addon/components/registries/schema-block-renderer/template.hbs
index 77c2c12bc..838c5bc47 100644
--- a/lib/osf-components/addon/components/registries/schema-block-renderer/template.hbs
+++ b/lib/osf-components/addon/components/registries/schema-block-renderer/template.hbs
@@ -2,11 +2,11 @@
     <Mapper as |renderers|>
         {{#let (get renderers @schemaBlock.blockType) as |Renderer|}}
             {{#if this.isLabelBlock}}
-            <Renderer @schemaBlock={{@schemaBlock}} @optionBlocks={{@optionBlocks}} @disabled={{this.disabled}} @shouldShowMessages={{this.shouldShowMessages}} @uniqueID={{@uniqueID}} @isRequired={{@isRequired}} @isFieldsetGroup={{@isFieldsetGroup}} @inputBlockUI={{@inputBlockUI}} @tagDefs={{@tagDefs}} @changeset={{@changeset}} @checkMarkKeys={{@checkMarkKeys}} />
+                <Renderer @schemaBlock={{@schemaBlock}} @optionBlocks={{@optionBlocks}} @disabled={{this.disabled}} @shouldShowMessages={{this.shouldShowMessages}} @uniqueID={{@uniqueID}} @isRequired={{@isRequired}} @isFieldsetGroup={{@isFieldsetGroup}} @inputBlockUI={{@inputBlockUI}} @tagDefs={{@tagDefs}} @changeset={{@changeset}} @checkMarkKeys={{@checkMarkKeys}} />
             {{else}}
-            <div style={{this.uiItemStyle}}>
-                <Renderer @schemaBlock={{@schemaBlock}} @optionBlocks={{@optionBlocks}} @disabled={{this.disabled}} @shouldShowMessages={{this.shouldShowMessages}} @uniqueID={{@uniqueID}} @isRequired={{@isRequired}} @isFieldsetGroup={{@isFieldsetGroup}} @inputBlockUI={{@inputBlockUI}} @tagDefs={{@tagDefs}} />
-            </div>
+                <div style={{this.uiItemStyle}}>
+                    <Renderer @schemaBlock={{@schemaBlock}} @optionBlocks={{@optionBlocks}} @disabled={{this.disabled}} @shouldShowMessages={{this.shouldShowMessages}} @uniqueID={{@uniqueID}} @isRequired={{@isRequired}} @isFieldsetGroup={{@isFieldsetGroup}} @inputBlockUI={{@inputBlockUI}} @tagDefs={{@tagDefs}} />
+                </div>
             {{/if}}
         {{/let}}
     </Mapper>
diff --git a/lib/osf-components/addon/components/registries/ui-visual-items/component.ts b/lib/osf-components/addon/components/registries/ui-visual-items/component.ts
index 9706587e0..a0af2b784 100644
--- a/lib/osf-components/addon/components/registries/ui-visual-items/component.ts
+++ b/lib/osf-components/addon/components/registries/ui-visual-items/component.ts
@@ -16,6 +16,8 @@ export default class UiVisualItems extends Component {
     tagDefs?: TagDefs;
     changeset?: any;
     isTopLevel: boolean = false;
+    circleMarker = '\u25CB';
+    infoMark = '\u24D8';
 
     @action
     preventLabelFocus(event: Event) {
diff --git a/lib/osf-components/addon/components/registries/ui-visual-items/template.hbs b/lib/osf-components/addon/components/registries/ui-visual-items/template.hbs
index df6a088f2..3a8472b65 100644
--- a/lib/osf-components/addon/components/registries/ui-visual-items/template.hbs
+++ b/lib/osf-components/addon/components/registries/ui-visual-items/template.hbs
@@ -3,7 +3,7 @@
         <div local-class='UiGroup'>
             {{#if item.uiGroup.localizedTitle}}
                 <div local-class='UiGroupHeading'>
-                    <strong>{{#if (eq item.uiGroup.marker "circle")}}◯ {{/if}}{{item.uiGroup.localizedTitle}}</strong>
+                    <strong>{{#if (eq item.uiGroup.marker 'circle')}}{{this.circleMarker}} {{/if}}{{item.uiGroup.localizedTitle}}</strong>
                     {{#each item.uiGroup.resolvedTags as |tag|}}
                         <span tabindex='-1' {{on 'click' this.preventLabelFocus}}>
                             <span local-class='TagBadge'>{{tag.localizedText}}</span>
@@ -16,7 +16,7 @@
                     {{/each}}
                     {{#if item.uiGroup.localizedInfo}}
                         <span local-class='InfoMark' tabindex='-1' {{on 'click' this.preventLabelFocus}}>
-                            ⓘ
+                            {{this.infoMark}}
                             <BsPopover @triggerEvents={{array 'focus'}}>
                                 {{item.uiGroup.localizedInfo}}
                             </BsPopover>
diff --git a/lib/osf-components/addon/components/registries/value-check-mark/component.ts b/lib/osf-components/addon/components/registries/value-check-mark/component.ts
index b96ba22da..4fa766112 100644
--- a/lib/osf-components/addon/components/registries/value-check-mark/component.ts
+++ b/lib/osf-components/addon/components/registries/value-check-mark/component.ts
@@ -15,9 +15,9 @@ export default class ValueCheckMark extends Component<Args> {
                 return false;
             }
             if (Array.isArray(value)) {
-                return value.some((row: any) =>
-                    Object.values(row).some((v: any) => v !== null && v !== undefined && v !== ''),
-                );
+                return value.some((row: any) => Object.values(row).some(
+                    (v: any) => v !== null && v !== undefined && v !== '',
+                ));
             }
             return true;
         });
diff --git a/lib/registries/addon/drafts/draft/-components/register/component.ts b/lib/registries/addon/drafts/draft/-components/register/component.ts
index 803d8bf73..570c2f55e 100644
--- a/lib/registries/addon/drafts/draft/-components/register/component.ts
+++ b/lib/registries/addon/drafts/draft/-components/register/component.ts
@@ -85,7 +85,7 @@ export default class Register extends Component.extend({
 
     @computed('draftRegistration.registrationResponses')
     get wekoItemId(): string | null {
-        return getWekoItemId(this.draftRegistration?.registrationResponses);
+        return getWekoItemId(this.draftRegistration && this.draftRegistration.registrationResponses);
     }
 
     @computed('draftRegistration.registrationSchema.name')

From a7a434a24b4c01733f122eaa7e797da98bbf0b3c Mon Sep 17 00:00:00 2001
From: yacchin1205 <968739+yacchin1205@users.noreply.github.com>
Date: Tue, 31 Mar 2026 21:47:20 +0900
Subject: [PATCH 7/7] Add workflow unit tests and fix acceptance test stub

---
 tests/acceptance/guid-node/workflow-test.ts   |   4 +
 .../workflow/expression-evaluator-test.ts     | 114 ++++++++
 .../workflow/template-evaluator-test.ts       | 258 ++++++++++++++++++
 3 files changed, 376 insertions(+)
 create mode 100644 tests/unit/guid-node/workflow/expression-evaluator-test.ts
 create mode 100644 tests/unit/guid-node/workflow/template-evaluator-test.ts

diff --git a/tests/acceptance/guid-node/workflow-test.ts b/tests/acceptance/guid-node/workflow-test.ts
index dff3af131..b560280b2 100644
--- a/tests/acceptance/guid-node/workflow-test.ts
+++ b/tests/acceptance/guid-node/workflow-test.ts
@@ -53,6 +53,10 @@ function stubWorkflowRequests(
             return Promise.resolve({ data: config.tasks || [] });
         }
 
+        if (url.includes('/workflow/templates/') && method === 'GET') {
+            return Promise.resolve({ data: [] });
+        }
+
         if (url.includes('/workflow/templates/') && method === 'POST') {
             return Promise.resolve({
                 data: {
diff --git a/tests/unit/guid-node/workflow/expression-evaluator-test.ts b/tests/unit/guid-node/workflow/expression-evaluator-test.ts
new file mode 100644
index 000000000..1530f542a
--- /dev/null
+++ b/tests/unit/guid-node/workflow/expression-evaluator-test.ts
@@ -0,0 +1,114 @@
+import { evaluateExpression } from 'ember-osf-web/guid-node/workflow/-components/wizard-form/expression-evaluator';
+import { module, test } from 'qunit';
+
+module('Unit | Workflow | expression-evaluator', () => {
+    test('truthy field returns true', assert => {
+        assert.ok(evaluateExpression('name', { name: 'Alice' }));
+    });
+
+    test('missing field returns false', assert => {
+        assert.notOk(evaluateExpression('name', {}));
+    });
+
+    test('null field returns false', assert => {
+        assert.notOk(evaluateExpression('name', { name: null }));
+    });
+
+    test('empty string field returns false', assert => {
+        assert.notOk(evaluateExpression('name', { name: '' }));
+    });
+
+    test('true literal', assert => {
+        assert.ok(evaluateExpression('true', {}));
+    });
+
+    test('false literal', assert => {
+        assert.notOk(evaluateExpression('false', {}));
+    });
+
+    test('field prefixed with true is not confused', assert => {
+        assert.ok(evaluateExpression('trueness', { trueness: 'yes' }));
+    });
+
+    test('string equality', assert => {
+        assert.ok(evaluateExpression("status == 'active'", { status: 'active' }));
+    });
+
+    test('string inequality', assert => {
+        assert.ok(evaluateExpression("status != 'active'", { status: 'inactive' }));
+    });
+
+    test('OR left true', assert => {
+        assert.ok(evaluateExpression('a || b', { a: 'x', b: '' }));
+    });
+
+    test('OR right true', assert => {
+        assert.ok(evaluateExpression('a || b', { a: '', b: 'x' }));
+    });
+
+    test('OR both false', assert => {
+        assert.notOk(evaluateExpression('a || b', { a: '', b: '' }));
+    });
+
+    test('AND both true', assert => {
+        assert.ok(evaluateExpression('a && b', { a: 'x', b: 'y' }));
+    });
+
+    test('AND left false', assert => {
+        assert.notOk(evaluateExpression('a && b', { a: '', b: 'y' }));
+    });
+
+    test('NOT truthy', assert => {
+        assert.notOk(evaluateExpression('!a', { a: 'x' }));
+    });
+
+    test('NOT falsy', assert => {
+        assert.ok(evaluateExpression('!a', { a: '' }));
+    });
+
+    test('double NOT', assert => {
+        assert.ok(evaluateExpression('!!a', { a: 'x' }));
+    });
+
+    test('AND binds tighter than OR', assert => {
+        // false || (true && true) => true
+        assert.ok(evaluateExpression('a || b && c', { a: '', b: 'x', c: 'y' }));
+    });
+
+    test('NOT binds tighter than AND', assert => {
+        // (!false) && true => true
+        assert.ok(evaluateExpression('!a && b', { a: '', b: 'x' }));
+    });
+
+    test('parentheses override precedence', assert => {
+        // !(false && true) => true
+        assert.ok(evaluateExpression('!(a && b)', { a: '', b: 'x' }));
+    });
+
+    test('chained OR parses all operands', assert => {
+        assert.ok(evaluateExpression('a || b || c', { a: '', b: '', c: 'x' }));
+    });
+
+    test('chained OR all empty', assert => {
+        assert.notOk(evaluateExpression('a || b || c', { a: '', b: '', c: '' }));
+    });
+
+    test('display_template style: last || first || middle', assert => {
+        assert.ok(evaluateExpression(
+            'last || first || middle',
+            { last: '', first: 'Taro', middle: '' },
+        ));
+    });
+
+    test('throws on empty expression', assert => {
+        assert.throws(() => evaluateExpression('', {}), /empty expression/);
+    });
+
+    test('throws on trailing garbage', assert => {
+        assert.throws(() => evaluateExpression('a b', { a: 'x' }), /unexpected/);
+    });
+
+    test('throws on unterminated string', assert => {
+        assert.throws(() => evaluateExpression("a == 'open", {}), /unterminated/);
+    });
+});
diff --git a/tests/unit/guid-node/workflow/template-evaluator-test.ts b/tests/unit/guid-node/workflow/template-evaluator-test.ts
new file mode 100644
index 000000000..a4c49ffa5
--- /dev/null
+++ b/tests/unit/guid-node/workflow/template-evaluator-test.ts
@@ -0,0 +1,258 @@
+import {
+    evaluateTemplate,
+    hasTemplateDirectives,
+} from 'ember-osf-web/guid-node/workflow/-components/wizard-form/template-evaluator';
+import { module, test } from 'qunit';
+
+module('Unit | Workflow | template-evaluator', () => {
+    // -- hasTemplateDirectives ------------------------------------------------
+
+    test('detects {{ }}', assert => {
+        assert.ok(hasTemplateDirectives('Hello {{ name }}'));
+    });
+
+    test('detects {% %}', assert => {
+        assert.ok(hasTemplateDirectives('{% if x %}yes{% endif %}'));
+    });
+
+    test('plain text has no directives', assert => {
+        assert.notOk(hasTemplateDirectives('no directives here'));
+    });
+
+    // -- variable interpolation -----------------------------------------------
+
+    test('interpolates variable', assert => {
+        assert.equal(evaluateTemplate('Hello {{ name }}!', { name: 'Alice' }), 'Hello Alice!');
+    });
+
+    test('missing variable renders empty', assert => {
+        assert.equal(evaluateTemplate('Hello {{ name }}!', {}), 'Hello !');
+    });
+
+    test('multiple variables', assert => {
+        assert.equal(
+            evaluateTemplate('{{ first }} {{ last }}', { first: 'A', last: 'B' }),
+            'A B',
+        );
+    });
+
+    // -- if/else/endif --------------------------------------------------------
+
+    test('if truthy renders body', assert => {
+        assert.equal(
+            evaluateTemplate('{% if show %}visible{% endif %}', { show: 'yes' }),
+            'visible',
+        );
+    });
+
+    test('if falsy skips body', assert => {
+        assert.equal(
+            evaluateTemplate('{% if show %}visible{% endif %}', { show: '' }),
+            '',
+        );
+    });
+
+    test('if/else renders else branch when falsy', assert => {
+        assert.equal(
+            evaluateTemplate('{% if show %}yes{% else %}no{% endif %}', { show: '' }),
+            'no',
+        );
+    });
+
+    test('if/elif/else chain', assert => {
+        assert.equal(
+            evaluateTemplate(
+                '{% if a %}A{% elif b %}B{% else %}C{% endif %}',
+                { a: '', b: 'x' },
+            ),
+            'B',
+        );
+    });
+
+    test('nested if', assert => {
+        assert.equal(
+            evaluateTemplate(
+                '{% if a %}{% if b %}AB{% endif %}{% endif %}',
+                { a: 'x', b: 'y' },
+            ),
+            'AB',
+        );
+    });
+
+    test('nested if with outer false', assert => {
+        assert.equal(
+            evaluateTemplate(
+                '{% if a %}{% if b %}AB{% endif %}{% endif %}',
+                { a: '', b: 'y' },
+            ),
+            '',
+        );
+    });
+
+    // -- expressions in if ----------------------------------------------------
+
+    test('if with or expression', assert => {
+        assert.equal(
+            evaluateTemplate('{% if a or b %}yes{% endif %}', { a: '', b: 'x' }),
+            'yes',
+        );
+    });
+
+    test('if with and expression', assert => {
+        assert.equal(
+            evaluateTemplate('{% if a and b %}yes{% endif %}', { a: 'x', b: '' }),
+            '',
+        );
+    });
+
+    test('if with not expression', assert => {
+        assert.equal(
+            evaluateTemplate('{% if not a %}empty{% endif %}', { a: '' }),
+            'empty',
+        );
+    });
+
+    test('if with comparison', assert => {
+        assert.equal(
+            evaluateTemplate("{% if status == 'done' %}ok{% endif %}", { status: 'done' }),
+            'ok',
+        );
+    });
+
+    // -- for loop -------------------------------------------------------------
+
+    test('for loop iterates', assert => {
+        assert.equal(
+            evaluateTemplate('{% for x in items %}[{{ x }}]{% endfor %}', { items: ['a', 'b'] }),
+            '[a][b]',
+        );
+    });
+
+    test('for loop with empty array', assert => {
+        assert.equal(
+            evaluateTemplate('{% for x in items %}[{{ x }}]{% endfor %}', { items: [] }),
+            '',
+        );
+    });
+
+    test('for loop with object access', assert => {
+        assert.equal(
+            evaluateTemplate(
+                '{% for p in people %}{{ p.name }} {% endfor %}',
+                { people: [{ name: 'A' }, { name: 'B' }] },
+            ),
+            'A B ',
+        );
+    });
+
+    // -- filters --------------------------------------------------------------
+
+    test('default filter on missing value', assert => {
+        assert.equal(
+            evaluateTemplate("{{ name | default('N/A') }}", {}),
+            'N/A',
+        );
+    });
+
+    test('default filter on present value', assert => {
+        assert.equal(
+            evaluateTemplate("{{ name | default('N/A') }}", { name: 'Alice' }),
+            'Alice',
+        );
+    });
+
+    test('length filter', assert => {
+        assert.equal(
+            evaluateTemplate('{{ items | length }}', { items: [1, 2, 3] }),
+            '3',
+        );
+    });
+
+    // -- whitespace trimming --------------------------------------------------
+
+    test('trim before with {%-', assert => {
+        assert.equal(
+            evaluateTemplate('hello  {%- if true %} world{% endif %}', {}),
+            'hello world',
+        );
+    });
+
+    test('trim after with -%}', assert => {
+        assert.equal(
+            evaluateTemplate('{% if true -%}  hello{% endif %}', {}),
+            'hello',
+        );
+    });
+
+    // -- dot access and bracket access ----------------------------------------
+
+    test('dot access', assert => {
+        assert.equal(
+            evaluateTemplate('{{ user.name }}', { user: { name: 'Bob' } }),
+            'Bob',
+        );
+    });
+
+    test('bracket access', assert => {
+        assert.equal(
+            evaluateTemplate("{{ data['key'] }}", { data: { key: 'val' } }),
+            'val',
+        );
+    });
+
+    // -- display_template real-world pattern -----------------------------------
+
+    test('display_template name pattern with all fields', assert => {
+        const tpl = '{% if last or first %}{% if last %}{{ last }}, {% endif %}{{ first }} {{ middle }}{% endif %}';
+        assert.equal(
+            evaluateTemplate(tpl, { last: 'Smith', first: 'John', middle: 'A' }),
+            'Smith, John A',
+        );
+    });
+
+    test('display_template name pattern with only first', assert => {
+        const tpl = '{% if last or first %}{% if last %}{{ last }}, {% endif %}{{ first }} {{ middle }}{% endif %}';
+        assert.equal(
+            evaluateTemplate(tpl, { last: '', first: 'Taro', middle: '' }),
+            'Taro ',
+        );
+    });
+
+    test('display_template name pattern with all empty', assert => {
+        const tpl = '{% if last or first %}{% if last %}{{ last }}, {% endif %}{{ first }} {{ middle }}{% endif %}';
+        assert.equal(
+            evaluateTemplate(tpl, { last: '', first: '', middle: '' }),
+            '',
+        );
+    });
+
+    // -- error handling -------------------------------------------------------
+
+    test('throws on unclosed if', assert => {
+        assert.throws(
+            () => evaluateTemplate('{% if x %}hello', { x: 'y' }),
+            /unclosed/i,
+        );
+    });
+
+    test('throws on unclosed {{', assert => {
+        assert.throws(
+            () => evaluateTemplate('{{ name', {}),
+            /unclosed/i,
+        );
+    });
+
+    test('throws on unknown tag', assert => {
+        assert.throws(
+            () => evaluateTemplate('{% while true %}{% endwhile %}', {}),
+            /unknown tag/i,
+        );
+    });
+
+    test('throws on unknown filter', assert => {
+        assert.throws(
+            () => evaluateTemplate('{{ x | bogus }}', { x: 'v' }),
+            /unknown filter/i,
+        );
+    });
+});