typo3-typescript-sources 13.4.26 → 13.4.29

package/.github/workflows/sync-and-publish.yml

@@ -2,111 +2,142 @@ name: Sync TYPO3 TypeScript Sources and Publish
 
 on:
   schedule:
-    # Prüfe täglich um 2 Uhr morgens auf neue Tags
+    # Check daily at 2 AM for new tags
     - cron: '0 2 * * *'
   workflow_dispatch:
     inputs:
       tag:
-        description: 'Spezifischer TYPO3 Tag (z.B. v13.4.0)'
+        description: 'Specific TYPO3 tag (e.g. v14.0.0 or v13.4.0)'
         required: false
         type: string
 
+permissions:
+  contents: read
+
 jobs:
-  check-and-sync:
+  setup:
     runs-on: ubuntu-latest
     outputs:
-      has_new_version: ${{ steps.check.outputs.has_new_version }}
-      typo3_version: ${{ steps.check.outputs.typo3_version }}
+      matrix: ${{ steps.set-matrix.outputs.matrix }}
+    steps:
+      - name: Build version matrix
+        id: set-matrix
+        run: |
+          if [[ "${{ github.event_name }}" == "schedule" ]]; then
+            # Schedule runs daily for both major versions
+            echo 'matrix={"include":[{"major_version":"14","target_branch":"main"},{"major_version":"13","target_branch":"v13.x"}]}' >> $GITHUB_OUTPUT
+          elif [[ "${{ github.ref_name }}" == "v13.x" ]]; then
+            echo 'matrix={"include":[{"major_version":"13","target_branch":"v13.x"}]}' >> $GITHUB_OUTPUT
+          else
+            echo 'matrix={"include":[{"major_version":"14","target_branch":"main"}]}' >> $GITHUB_OUTPUT
+          fi
+
+  check-and-sync:
+    needs: setup
+    runs-on: ubuntu-latest
+    strategy:
+      fail-fast: false
+      matrix: ${{ fromJson(needs.setup.outputs.matrix) }}
     steps:
       - name: Checkout split repository
         uses: actions/checkout@v4
         with:
+          ref: ${{ matrix.target_branch }}
           fetch-depth: 0
 
       - name: Check for new TYPO3 tags
         id: check
         run: |
-          # Hole alle Tags vom TYPO3 Repository
+          MAJOR="${{ matrix.major_version }}"
+
+          # Fetch all tags from TYPO3 repository for the target major version
           git ls-remote --tags https://github.com/TYPO3/typo3.git | \
-            grep -E 'refs/tags/v13\.[0-9]+\.[0-9]+$' | \
+            grep -E "refs/tags/v${MAJOR}\.[0-9]+\.[0-9]+$" | \
             sed 's/.*refs\/tags\///' | \
             sort -V > /tmp/typo3_tags.txt
-          
-          # Hole den letzten verarbeiteten Tag (falls vorhanden)
+
+          # Get last synced tag
           LAST_SYNCED=""
           if [ -f .last-synced-tag ]; then
             LAST_SYNCED=$(cat .last-synced-tag)
           fi
-          
-          # Manueller Tag-Input hat Priorität
+
+          # Manual tag input takes priority
           if [ -n "${{ github.event.inputs.tag }}" ]; then
             NEW_TAG="${{ github.event.inputs.tag }}"
-            echo "Manuell angegebener Tag: $NEW_TAG"
+            # Validate that the manual tag matches the expected major version
+            if ! echo "$NEW_TAG" | grep -qE "^v${MAJOR}\."; then
+              echo "Error: Tag $NEW_TAG does not match expected major version v${MAJOR}.x for this branch"
+              echo "has_new_version=false" >> $GITHUB_OUTPUT
+              exit 0
+            fi
+            echo "Manually specified tag: $NEW_TAG"
           else
-            # Finde neuesten Tag der noch nicht synced wurde
+            # Find newest tag that has not been synced yet
             NEW_TAG=$(tail -n1 /tmp/typo3_tags.txt)
           fi
-          
+
           if [ -z "$NEW_TAG" ]; then
-            echo "Kein TYPO3 13.x Tag gefunden"
+            echo "No TYPO3 v${MAJOR}.x tag found"
             echo "has_new_version=false" >> $GITHUB_OUTPUT
             exit 0
           fi
-          
+
           if [ "$NEW_TAG" = "$LAST_SYNCED" ]; then
-            echo "Keine neue Version verfügbar (aktuell: $LAST_SYNCED)"
+            echo "No new version available (current: $LAST_SYNCED)"
             echo "has_new_version=false" >> $GITHUB_OUTPUT
           else
-            echo "Neue Version gefunden: $NEW_TAG (alt: $LAST_SYNCED)"
+            echo "New version found: $NEW_TAG (previous: $LAST_SYNCED)"
             echo "has_new_version=true" >> $GITHUB_OUTPUT
             echo "typo3_version=$NEW_TAG" >> $GITHUB_OUTPUT
           fi
 
-  sync-and-publish:
-    needs: check-and-sync
-    if: needs.check-and-sync.outputs.has_new_version == 'true'
-    runs-on: ubuntu-latest
-    steps:
       - name: Setup Git
+        if: steps.check.outputs.has_new_version == 'true'
         run: |
           git config --global user.name "TYPO3 TypeScript Sync Bot"
           git config --global user.email "bot@maikschneider.de"
 
       - name: Clone TYPO3 repository at specific tag
+        if: steps.check.outputs.has_new_version == 'true'
         run: |
-          TYPO3_TAG="${{ needs.check-and-sync.outputs.typo3_version }}"
-          echo "Klone TYPO3 Repository bei Tag: $TYPO3_TAG"
-          
+          TYPO3_TAG="${{ steps.check.outputs.typo3_version }}"
+          echo "Cloning TYPO3 repository at tag: $TYPO3_TAG"
+
           git clone --depth 1 --branch "$TYPO3_TAG" \
             https://github.com/TYPO3/typo3.git typo3-source
 
       - name: Extract TypeScript sources
+        if: steps.check.outputs.has_new_version == 'true'
         run: |
           mkdir -p typescript-split
-          
-          # Kopiere TypeScript Quellen
+
+          # Copy TypeScript sources
           if [ -d "typo3-source/Build/Sources/TypeScript" ]; then
             cp -r typo3-source/Build/Sources/TypeScript/* typescript-split/
-            echo "✓ TypeScript Quellen extrahiert"
+            echo "✓ TypeScript sources extracted"
           else
-            echo "✗ Fehler: Build/Sources/TypeScript nicht gefunden"
+            echo "✗ Error: Build/Sources/TypeScript not found"
             exit 1
           fi
-          
-          # Kopiere relevante Root-Dateien
+
+          # Copy relevant root files
           [ -f "typo3-source/LICENSE.txt" ] && cp typo3-source/LICENSE.txt typescript-split/
           [ -f "typo3-source/README.md" ] && cp typo3-source/README.md typescript-split/README-TYPO3.md
 
-      - name: Checkout split repository
+      - name: Checkout split repository for sync
+        if: steps.check.outputs.has_new_version == 'true'
         uses: actions/checkout@v4
         with:
           path: split-repo
+          ref: ${{ matrix.target_branch }}
           token: ${{ secrets.PAT_TOKEN }}
           fetch-depth: 0
 
       - name: Sync content to split repository
+        if: steps.check.outputs.has_new_version == 'true'
         run: |
-          # Lösche alte Inhalte (außer .git, .github, package.json)
+          # Delete old contents (except .git, .github, package.json)
           cd split-repo
           find . -mindepth 1 -maxdepth 1 \
             ! -name '.git' \
@@ -117,20 +148,21 @@ jobs:
             ! -name 'README.md' \
             ! -name 'node_modules' \
             -exec rm -rf {} +
-          
-          # Kopiere neue Inhalte
+
+          # Copy new contents
           cp -r ../typescript-split/* .
-          
-          # Speichere synced Tag
-          echo "${{ needs.check-and-sync.outputs.typo3_version }}" > .last-synced-tag
+
+          # Save synced tag
+          echo "${{ steps.check.outputs.typo3_version }}" > .last-synced-tag
 
       - name: Create/Update package.json
+        if: steps.check.outputs.has_new_version == 'true'
         working-directory: split-repo
         run: |
-          TYPO3_VERSION="${{ needs.check-and-sync.outputs.typo3_version }}"
-          # Entferne 'v' Präfix für npm Version
+          TYPO3_VERSION="${{ steps.check.outputs.typo3_version }}"
+          # Remove 'v' prefix for npm version
           NPM_VERSION="${TYPO3_VERSION#v}"
-          
+
           cat > package.json << EOF
           {
             "name": "typo3-typescript-sources",
@@ -167,14 +199,15 @@ jobs:
             }
           }
           EOF
-          
-          echo "✓ package.json erstellt mit Version $NPM_VERSION"
+
+          echo "✓ package.json created with version $NPM_VERSION"
 
       - name: Create README
+        if: steps.check.outputs.has_new_version == 'true'
         working-directory: split-repo
         run: |
-          TYPO3_VERSION="${{ needs.check-and-sync.outputs.typo3_version }}"
-          
+          TYPO3_VERSION="${{ steps.check.outputs.typo3_version }}"
+
           cat > README.md << 'EOF'
           # TYPO3 TypeScript Sources
 
@@ -196,6 +229,13 @@ jobs:
           - **Source Path:** `Build/Sources/TypeScript/`
           - **Current TYPO3 Version:** `TYPO3_VERSION_PLACEHOLDER`
 
+          ## 🌿 Branches
+
+          | Branch   | TYPO3 Version | npm tag   |
+          |----------|---------------|-----------|
+          | `main`   | v14.x         | `latest`  |
+          | `v13.x`  | v13.x         | `v13-latest` |
+
           ## 📝 License
 
           This package maintains the same license as TYPO3 Core: **GPL-2.0-or-later**
@@ -209,61 +249,69 @@ jobs:
           This is an unofficial split package maintained by [@maikschneider](https://github.com/maikschneider).
           For official TYPO3 packages, please refer to the [TYPO3 Core repository](https://github.com/TYPO3/typo3).
           EOF
-          
-          # Ersetze Platzhalter
+
+          # Replace placeholder
           sed -i "s/TYPO3_VERSION_PLACEHOLDER/${TYPO3_VERSION}/" README.md
 
       - name: Commit changes
+        if: steps.check.outputs.has_new_version == 'true'
         working-directory: split-repo
         run: |
+          TARGET_BRANCH="${{ matrix.target_branch }}"
           git add .
-          
+
           if git diff --staged --quiet; then
-            echo "Keine Änderungen zu committen"
+            echo "No changes to commit"
             exit 0
           fi
-          
-          TYPO3_VERSION="${{ needs.check-and-sync.outputs.typo3_version }}"
+
+          TYPO3_VERSION="${{ steps.check.outputs.typo3_version }}"
           git commit -m "Sync with TYPO3 ${TYPO3_VERSION}
 
           Source: https://github.com/TYPO3/typo3/tree/${TYPO3_VERSION}
           Path: Build/Sources/TypeScript/"
-          
-          # Erstelle Tag (entferne v-Prefix falls vorhanden)
+
+          # Create tag (remove v-prefix)
           NPM_VERSION="${TYPO3_VERSION#v}"
           git tag -a "${NPM_VERSION}" -m "Release ${NPM_VERSION} from TYPO3 ${TYPO3_VERSION}"
-          
-          git push origin main
+
+          git push origin "${TARGET_BRANCH}"
           git push origin "${NPM_VERSION}"
 
       - name: Setup Node.js
+        if: steps.check.outputs.has_new_version == 'true'
         uses: actions/setup-node@v4
         with:
           node-version: '20'
           registry-url: 'https://registry.npmjs.org'
 
       - name: Publish to npm
+        if: steps.check.outputs.has_new_version == 'true'
         working-directory: split-repo
         run: |
-          # Stelle sicher, dass .npmrc korrekt konfiguriert ist
           echo "//registry.npmjs.org/:_authToken=${NODE_AUTH_TOKEN}" > ~/.npmrc
-          
-          # Publish ohne OTP (Automation Token)
-          npm publish --access public
+
+          MAJOR="${{ matrix.major_version }}"
+          if [ "$MAJOR" = "13" ]; then
+            npm publish --access public --tag v13-latest
+          else
+            npm publish --access public
+          fi
         env:
           NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}
 
       - name: Create GitHub Release
+        if: steps.check.outputs.has_new_version == 'true'
         uses: actions/create-release@v1
         env:
           GITHUB_TOKEN: ${{ secrets.PAT_TOKEN }}
         with:
-          tag_name: ${{ needs.check-and-sync.outputs.typo3_version }}
-          release_name: TYPO3 ${{ needs.check-and-sync.outputs.typo3_version }}
+          tag_name: ${{ steps.check.outputs.typo3_version }}
+          release_name: TYPO3 ${{ steps.check.outputs.typo3_version }}
           body: |
-            Synchronized with TYPO3 Core ${{ needs.check-and-sync.outputs.typo3_version }}
-            
-            **Source:** https://github.com/TYPO3/typo3/tree/${{ needs.check-and-sync.outputs.typo3_version }}
+            Synchronized with TYPO3 Core ${{ steps.check.outputs.typo3_version }}
+
+            **Source:** https://github.com/TYPO3/typo3/tree/${{ steps.check.outputs.typo3_version }}
             **Path:** `Build/Sources/TypeScript/`
           draft: false
-          prerelease: false
+          prerelease: false

package/.last-synced-tag

@@ -1 +1 @@
-v13.4.26
+v13.4.29

package/README.md

@@ -16,7 +16,14 @@ npm install typo3-typescript-sources
 
 - **Original Repository:** [TYPO3/typo3](https://github.com/TYPO3/typo3)
 - **Source Path:** `Build/Sources/TypeScript/`
-- **Current TYPO3 Version:** `v13.4.26`
+- **Current TYPO3 Version:** `v13.4.29`
+
+## 🌿 Branches
+
+| Branch   | TYPO3 Version | npm tag   |
+|----------|---------------|-----------|
+| `main`   | v14.x         | `latest`  |
+| `v13.x`  | v13.x         | `v13-latest` |
 
 ## 📝 License
 

package/backend/color-picker.ts

@@ -67,42 +67,50 @@ export class Typo3BackendColorPicker extends LitElement {
     await DocumentService.ready();
 
     const inputElement = this.getInputElement();
-    if (inputElement) {
-      if (!inputElement.value && this.color) {
-        inputElement.value = this.color;
-      } else {
-        this.color = inputElement.value;
-      }
+    if (!inputElement) {
+      return;
+    }
 
-      if (inputElement.disabled || inputElement.readOnly) {
-        return;
-      }
+    if (!inputElement.value && this.color) {
+      inputElement.value = this.color;
+    } else {
+      this.color = inputElement.value;
+    }
 
-      const alwan = new Alwan(inputElement, {
-        position: 'bottom-start',
-        format: 'hex',
-        opacity: this.opacity,
-        swatches: this.swatches,
-        preset: false,
-        color: this.color,
-      });
-
-      alwan.on('color', (e): void => {
-        this.color = e.hex;
-        inputElement.value = this.color;
-        inputElement.dispatchEvent(new Event('blur'));
-      });
-
-      // input: react on user input
-      // change: react on indirect changes, e.g. a value picker
-      ['input', 'change'].forEach((eventName: string): void => {
-        new RegularEvent(eventName, (e: Event): void => {
-          const input = (e.target as HTMLInputElement);
-          this.color = input.value;
-          alwan.setColor(this.color);
-        }).bindTo(inputElement);
-      });
+    if (inputElement.disabled || inputElement.readOnly) {
+      return;
     }
+
+    const alwan = new Alwan(inputElement, {
+      position: 'bottom-start',
+      format: 'hex',
+      opacity: this.opacity,
+      swatches: this.swatches,
+      preset: false,
+      color: this.color,
+    });
+
+    // When the color picker opens, the input loses focus, making value changes difficult.
+    // Restore focus to the input after the picker is opened.
+    alwan.on('open', (): void => {
+      inputElement.focus();
+    });
+
+    alwan.on('color', (e): void => {
+      this.color = e.hex;
+      inputElement.value = this.color;
+      inputElement.dispatchEvent(new Event('blur'));
+    });
+
+    // input: react on user input
+    // change: react on indirect changes, e.g. a value picker
+    ['input', 'change'].forEach((eventName: string): void => {
+      new RegularEvent(eventName, (e: Event): void => {
+        const input = (e.target as HTMLInputElement);
+        this.color = input.value;
+        alwan.setColor(this.color);
+      }).bindTo(inputElement);
+    });
   }
 
   protected override render(): TemplateResult {

package/backend/form-engine/container/files-control-container.ts

@@ -275,7 +275,8 @@ class FilesControlContainer extends HTMLElement {
 
       if (hiddenValueCheckBox !== null && hiddenValueInput !== null) {
         hiddenValueCheckBox.checked = !hiddenValueCheckBox.checked;
-        hiddenValueInput.value = hiddenValueCheckBox.checked ? '1' : '0';
+        const active = hiddenValueCheckBox.checked !== (hiddenValueCheckBox.dataset.invertStateDisplay === 'true');
+        hiddenValueInput.value = active ? '1' : '0';
         FormEngineValidation.markFieldAsChanged(hiddenValueCheckBox);
       }
 

package/backend/form-engine/container/inline-control-container.ts

@@ -430,7 +430,8 @@ class InlineControlContainer {
 
       if (hiddenValueCheckBox !== null && hiddenValueInput !== null) {
         hiddenValueCheckBox.checked = !hiddenValueCheckBox.checked;
-        hiddenValueInput.value = hiddenValueCheckBox.checked ? '1' : '0';
+        const active = hiddenValueCheckBox.checked !== (hiddenValueCheckBox.dataset.invertStateDisplay === 'true');
+        hiddenValueInput.value = active ? '1' : '0';
         FormEngineValidation.markFieldAsChanged(hiddenValueCheckBox);
       }
 

package/backend/layout-module/velocity-scroll.ts

@@ -0,0 +1,128 @@
+/*
+ * This file is part of the TYPO3 CMS project.
+ *
+ * It is free software; you can redistribute it and/or modify it under
+ * the terms of the GNU General Public License, either version 2
+ * of the License, or any later version.
+ *
+ * For the full copyright and license information, please read the
+ * LICENSE.txt file that was distributed with this source code.
+ *
+ * The TYPO3 project - inspiring people to share!
+ */
+
+/**
+ * Module: @typo3/backend/layout-module/velocity-scroll
+ *
+ * Enables auto-scrolling while dragging near the viewport edge.
+ *
+ * Self-binds a delegated `dragstart` listener for all `[draggable="true"]`
+ * elements on the page. May also be invoked directly:
+ *
+ * ```js
+ *    // inside a dragstart event handler:
+ *    initVelocityScroll(event);
+ * ```
+ */
+import DocumentService from '@typo3/core/document-service';
+import RegularEvent from '@typo3/core/event/regular-event';
+
+const EDGE_RATIO = 0.2;
+const MAX_STRENGTH_RATIO = 2.5;
+
+DocumentService.ready().then((): void => {
+  new RegularEvent('dragstart', (event: Event): void => {
+    initVelocityScroll(event as DragEvent);
+  }).delegateTo(document, '[draggable="true"]');
+});
+
+export function initVelocityScroll(event: DragEvent): void {
+  const scrollingElement = document.scrollingElement;
+  if (!(scrollingElement instanceof HTMLElement)) {
+    console.warn('Scrolling element is not an HTMLElement. Velocity scroll will not work.');
+    return;
+  }
+
+  // Scrolling may live on an inner container (e.g. the page module's
+  // .module-body with overflow: auto) rather than the document, so target
+  // the nearest scrollable ancestor of the drag source per axis if any exists.
+  const target = event.target as Element | null;
+  const verticalElement = findScrollAncestor(target, 'y') ?? scrollingElement;
+  const horizontalElement = findScrollAncestor(target, 'x') ?? scrollingElement;
+
+  let scrollSpeedVertical = 0;
+  let scrollSpeedHorizontal = 0;
+  let running = true;
+  let lastFrameTime = performance.now();
+
+  // Disable smooth scrolling for the duration of the drag and restore on dragend
+  const originalVerticalScrollBehavior = verticalElement.style.scrollBehavior;
+  const originalHorizontalScrollBehavior = horizontalElement.style.scrollBehavior;
+  verticalElement.style.scrollBehavior = 'auto';
+  horizontalElement.style.scrollBehavior = 'auto';
+
+  const tick = (now: number): void => {
+    const dt = (now - lastFrameTime) / 1000;
+    lastFrameTime = now;
+
+    const maxVertical = verticalElement.scrollHeight - verticalElement.clientHeight;
+    const maxHorizontal = horizontalElement.scrollWidth - horizontalElement.clientWidth;
+    verticalElement.scrollTop = Math.max(0, Math.min(verticalElement.scrollTop + scrollSpeedVertical * dt, maxVertical));
+    horizontalElement.scrollLeft = Math.max(0, Math.min(horizontalElement.scrollLeft + scrollSpeedHorizontal * dt, maxHorizontal));
+
+    if (running) {
+      requestAnimationFrame(tick);
+    }
+  };
+  requestAnimationFrame(tick);
+
+  // Progress within the edge zone goes from 0 (just entered) to 1 (at the edge).
+  // Squaring it makes scrolling accelerate noticeably near the edge.
+  const axisStrength = (distance: number, edge: number, max: number): number =>
+    distance < edge ? ((1 - distance / edge) ** 2) * max : 0;
+
+  const autoScroll = (event: DragEvent): void => {
+    const verticalEdge = window.innerHeight * EDGE_RATIO;
+    const horizontalEdge = window.innerWidth * EDGE_RATIO;
+    const maxVerticalStrength = window.innerHeight * MAX_STRENGTH_RATIO;
+    const maxHorizontalStrength = window.innerWidth * MAX_STRENGTH_RATIO;
+
+    scrollSpeedVertical =
+      axisStrength(window.innerHeight - event.clientY, verticalEdge, maxVerticalStrength) -
+      axisStrength(event.clientY, verticalEdge, maxVerticalStrength);
+    scrollSpeedHorizontal =
+      axisStrength(window.innerWidth - event.clientX, horizontalEdge, maxHorizontalStrength) -
+      axisStrength(event.clientX, horizontalEdge, maxHorizontalStrength);
+  };
+  autoScroll(event);
+  window.addEventListener('dragover', autoScroll);
+
+  // Bind teardown on window: the source element may be detached or replaced
+  // during the drop (drag-drop.ts re-renders content via AJAX), in which case
+  // a `dragend` listener on the source element would never fire.
+  window.addEventListener('dragend', (): void => {
+    window.removeEventListener('dragover', autoScroll);
+    scrollSpeedVertical = 0;
+    scrollSpeedHorizontal = 0;
+    running = false;
+    verticalElement.style.scrollBehavior = originalVerticalScrollBehavior;
+    horizontalElement.style.scrollBehavior = originalHorizontalScrollBehavior;
+  }, { once: true });
+}
+
+function findScrollAncestor(element: Element | null, axis: 'x' | 'y'): HTMLElement | null {
+  const sizeProp = axis === 'x' ? 'scrollWidth' : 'scrollHeight';
+  const clientProp = axis === 'x' ? 'clientWidth' : 'clientHeight';
+  const overflowProp = axis === 'x' ? 'overflowX' : 'overflowY';
+  let current = element;
+  while (current instanceof HTMLElement) {
+    if (current[sizeProp] > current[clientProp]) {
+      const overflow = window.getComputedStyle(current)[overflowProp];
+      if (overflow === 'auto' || overflow === 'scroll') {
+        return current;
+      }
+    }
+    current = current.parentElement;
+  }
+  return null;
+}

package/backend/tree/page-browser.ts

@@ -85,7 +85,7 @@ export class PageBrowserTree extends PageTree {
    */
   private isLinkable(node: TreeNodeInterface): boolean {
     const nonLinkableDoktypes = ['199', '254', '255'];
-    return nonLinkableDoktypes.includes(String(node.recordType)) === false;
+    return nonLinkableDoktypes.includes(String(node.doktype)) === false;
   }
 
   /**
@@ -169,8 +169,6 @@ export class PageBrowser extends LitElement {
     return this.getConfiguration()
       .then((configuration: Configuration): TemplateResult => {
         const initialized = () => {
-          this.tree.addEventListener('typo3:tree:node-selected', this.loadRecordsOfPage);
-          this.tree.addEventListener('typo3:tree:nodes-prepared', this.selectActivePageInTree);
           // set up toolbar now with updated properties
           const toolbar = this.querySelector('typo3-backend-tree-toolbar') as TreeToolbar;
           toolbar.tree = this.tree;
@@ -180,7 +178,14 @@ export class PageBrowser extends LitElement {
           <typo3-backend-tree-toolbar .tree="${this.tree}"></typo3-backend-tree-toolbar>
           <div class="navigation-tree-container">
             ${this.renderMountPoint()}
-            <typo3-backend-component-page-browser-tree id="typo3-pagetree-tree" class="tree-wrapper" .setup=${configuration} @tree:initialized=${initialized}></typo3-backend-component-page-browser-tree>
+            <typo3-backend-component-page-browser-tree
+              id="typo3-pagetree-tree"
+              class="tree-wrapper"
+              .setup=${configuration}
+              @tree:initialized=${initialized}
+              @typo3:tree:node-selected=${this.loadRecordsOfPage}
+              @typo3:tree:nodes-prepared=${this.selectActivePageInTree}
+            ></typo3-backend-component-page-browser-tree>
           </div>
         `;
       });

package/dashboard/dashboard.ts

@@ -1481,7 +1481,4 @@ declare global {
 
     [newRecordWizardEventName]: CustomEvent<NewRecordWizardItemSelectedEventInterface>;
   }
-  interface FocusOptions {
-    focusVisible: boolean;
-  }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "typo3-typescript-sources",
-  "version": "13.4.26",
+  "version": "13.4.29",
   "description": "TYPO3 Core TypeScript Sources - Extracted from TYPO3/typo3 repository",
   "main": "index.js",
   "types": "index.d.ts",
@@ -28,7 +28,7 @@
   },
   "typo3": {
     "sourceRepository": "https://github.com/TYPO3/typo3",
-    "sourceTag": "v13.4.26",
+    "sourceTag": "v13.4.29",
     "sourcePath": "Build/Sources/TypeScript"
   }
 }

package/recycler/recycler.ts

@@ -235,6 +235,7 @@ class Recycler {
   private async loadAvailableTables(): Promise<AjaxResponse> {
     const tableSelector = document.querySelector(Identifiers.tableSelector) as HTMLSelectElement;
     const depthSelector = document.querySelector(Identifiers.depthSelector) as HTMLSelectElement;
+    const currentTableSelection = tableSelector.options.length > 0 ? tableSelector.value : TYPO3.settings.Recycler.tableSelection;
 
     NProgress.start();
     tableSelector.value = '';
@@ -264,8 +265,8 @@ class Recycler {
 
       if (tables.length > 0) {
         tableSelector.append(...tables);
-        if (TYPO3.settings.Recycler.tableSelection !== '') {
-          tableSelector.value = TYPO3.settings.Recycler.tableSelection;
+        if (currentTableSelection !== '') {
+          tableSelector.value = currentTableSelection;
         }
       }