1. 06 May, 2022 1 commit
    • Benjamin Kott's avatar
      [TASK] Polish SvgTree component styling · 5ecfceb4
      Benjamin Kott authored and Georg Ringer's avatar Georg Ringer committed
      This patch is cleaning up a lot of loose ends in the svg tree component.
      It aims to make the component look more clean and polished.
      
      - Unify focus styling with selected, hover and versioning
      - Ensure the whole node looks focused instead of only some text
      - Replace expand icon to match core icon styling
      - Hide expand icon if page tree is stopped
      - Move trigger to enter stopped pagetree to the front
      - Remove blurry lines for background borders
      - Make the edit input fields use as much space as is available
      - Load common icons always on setup to avoid node refresh on initial loads
      - Reposition the locked icon (another editor is editing)
      - Correct keyboard navigation behaviour and focus setting
      - Keep focus after leaving the edit mode without changes
      - Adjust positioning to rely on calculation instead of hardcoded values
      - Align drag delete target
      - Make drag positions more visible to the user when moving a page
      - Improve styling of tooltips when dragging elements
      - Add border to select tree component to make scroll boundaries visible
      
      Affected Areas:
      - PageTree
      - FileTree
      - SelectTree
      
      Releases: main
      Resolves: #97344
      Change-Id: I6034e0cbc1079b93b24c5c1a99e0299946874b2f
      Reviewed-on: https://review.typo3.org/c/Packages/TYPO3.CMS/+/74203
      
      Tested-by: Benjamin Franzke's avatarBenjamin Franzke <bfr@qbus.de>
      Tested-by: core-ci's avatarcore-ci <typo3@b13.com>
      Tested-by: Georg Ringer's avatarGeorg Ringer <georg.ringer@gmail.com>
      Reviewed-by: Benjamin Franzke's avatarBenjamin Franzke <bfr@qbus.de>
      Reviewed-by: Georg Ringer's avatarGeorg Ringer <georg.ringer@gmail.com>
      5ecfceb4
  2. 16 Feb, 2022 1 commit
    • Benjamin Franzke's avatar
      [TASK] Use @typo3/ as ES6 module namespace · 7a41f905
      Benjamin Franzke authored and Georg Ringer's avatar Georg Ringer committed
      Switch from TYPO3/CMS/ExtName/ to @typo3/ext-name/ module
      namespace in all TypoScript modules in order to
      use the common "scoped package" syntax as known from npmjs.
      
      This will allow TYPO3 TypeScript declarations to be
      published to @typo3/* packages on npmjs.com at some point,
      allowing extension authors to require these as npm/yarn
      dependencies to be able to use TypeScript type declarations
      when developing against the TYPO3 JavaScript API.
      
      While at it, the naming convention of JavaScript modules is
      also switched to use lowercase-dashed form. This is to adhere
      to the common used naming convention in the npm-world.
      Also @typo3/core/ajax/ajax-request.js simply looks better than
      a mixed form @typo3/core/Ajax/AjaxRequest.js would be.
      
      All existing RequireJS module identifiers are mapped
      to the new naming syntax in the requirejs-to-es6 bridge:
      For example a requirejs call to
        TYPO3/CMS/T3editor/Element/CodeMirrorElement
      will transparently be transformed to the new scheme:
        @typo3/t3editor/element/code-mirror-element.js
      
      Manual modifications in:
      
        Build/Gruntfile.js
        Build/util/map-import.js
        Build/JSUnit/karma.conf.js
        Build/Sources/TypeScript/backend/Resources/Public/TypeScript/viewport/navigation-container.ts
        typo3/sysext/core/Resources/Public/JavaScript/requirejs-loader.js
        typo3/sysext/core/Tests/Functional/Page/PageRendererTest.php
        typo3/sysext/core/Tests/Unit/Page/Fixtures/ImportMap/package2/Configuration/JavaScriptModules.php
        typo3/sysext/core/Tests/Unit/Page/Fixtures/ImportMap/package3/Configuration/JavaScriptModules.php
        typo3/sysext/core/Tests/Unit/Page/ImportMapTest.php
        typo3/sysext/t3editor/Configuration/JavaScriptModules.php
      
      All other changes have been automated with:
      
      find Build/Sources/TypeScript/ -type f | \
          grep -v index.d.ts | \
          sed \
              -e 's:Build/Sources/TypeScript/:typo3/sysext/:' \
              -e 's:/Tests/:/Tests/JavaScript/:' \
              -e 's:/TypeScript/:/JavaScript/:' \
              -e 's:\.ts$:.js:' | \
          xargs git rm
      
      find Build/Sources/TypeScript/ -type f | while read file
      do
          newFilename=$(echo $file | sed \
              -e :loop1 -e 's:\(/Public/TypeScript\|/Tests\)\([0-9a-zA-Z/.]*\)/\([A-Z][A-Z]*\)\([0-9a-zA-Z/-]*\)\.ts:\1\2/\L\3\E\4.ts:' -e 't loop1' \
              -e :loop2 -e 's:\(/Public/TypeScript\|/Tests\)\([0-9a-zA-Z/.]*[a-z]\)\([A-Z][A-Z]*\)\([0-9a-zA-Z/-]*\)\.ts:\1\2-\L\3\E\4.ts:' -e 't loop2' \
              -e s:/Resources/Public/TypeScript/:/: \
              -e s:/Tests/:/tests/:
          )
      
          mkdir -p $(dirname "${newFilename}")
          [[ "$file" != "$newFilename" ]] && git mv "${file}" "${newFilename}"
      done
      
      cat << EOF > convert_uppercase_to_lowercase.sed
      :loop1
      s:\(TYPO3/CMS[0-9a-zA-Z/]*\)/\([A-Z]\)\([0-9a-zA-Z/-]*\.js\):\1/\l\2\3:
      t loop1
      
      :loop2
      s:\(TYPO3/CMS[0-9a-zA-Z/]*[a-z]\)\([A-Z]\)\([0-9a-z/-]*\.js\):\1-\l\2\3:
      t loop2
      
      s:TYPO3/CMS/\([0-9a-z/-]*\.js\):@typo3/\1:g
      
      :loop3
      s:\(^import \|^import .* from \|import(\|declare module \)'\([0-9a-zA-Z/.]*\)/\([A-Z][A-Z]*\)\([0-9a-zA-Z/.-]*\)':\1'\2/\L\3\E\4':
      t loop3
      
      :loop4
      s:\(^import \|^import .* from \|import(\|declare module \)'\([0-9a-zA-Z/.]*[a-z]\)\([A-Z][A-Z]*\)\([0-9a-z/.-]*\)':\1'\2-\L\3\E\4':
      t loop4
      
      :loop5
      s:\(\* Module\:\{0,1\} \|\* @exports \|\* @module \)\([0-9a-zA-Z/.]*\)/\([A-Z][A-Z]*\)\([0-9a-zA-Z/.-]*\)$:\1\2/\L\3\E\4:
      t loop5
      
      :loop6
      s:\(\* Module\:\{0,1\} \|\* @exports \|\* @module \)\([0-9a-zA-Z/.]*[a-z]\)\([A-Z][A-Z]*\)\([0-9a-z/.-]*\)$:\1\2-\L\3\E\4:
      t loop6
      
      s:\(^import '\|^import .* from '\|import('\|declare module '\|\* Module\:\{0,1\} \|\* @exports \|\* @module \)TYPO3/cms/\([0-9a-z/.-]*\):\1@typo3/\2:g
      
      s:@typo3/rte_ckeditor:@typo3/rte-ckeditor:
      
      s:TYPO3/CMS/Backend/Module/Iframe:@typo3/backend/module/iframe:
      s:TYPO3/CMS/Backend/PageTree/PageTreeElement:@typo3/backend/page-tree/page-tree-element:
      s:TYPO3/CMS/Backend/Tree/FileStorageTreeContainer:@typo3/backend/tree/file-storage-tree-container:
      s:TYPO3/CMS/Impexp/ContextMenuActions:@typo3/impexp/context-menu-actions:
      s:TYPO3/CMS/Install/chosen.jquery.min.js:@typo3/install/chosen.jquery.min.js:
      
      s:Public/JavaScript/JavaScriptItemHandler.js:Public/JavaScript/java-script-item-handler.js:
      s:Public/JavaScript/RequireJSConfigHandler.js:Public/JavaScript/require-jsconfig-handler.js:
      s:Public/JavaScript/AdminPanel.js:Public/JavaScript/admin-panel.js:
      EOF
      
      git ls-tree --name-only -r HEAD | \
          grep -v dashboard/Documentation/ | \
          grep -v Documentation/Changelog/ | \
          grep -v Build/JSUnit/ | \
          xargs sed -i -f convert_uppercase_to_lowercase.sed
      
      rm convert_uppercase_to_lowercase.sed
      
      sed -i \
          -e 's:TYPO3/CMS/\([A-Z]\):@typo3/\l\1:' \
          -e 's:@typo3/rteCkeditor:@typo3/rte-ckeditor:' \
          typo3/sysext/*/Configuration/JavaScriptModules.php \
          typo3/sysext/core/Tests/Unit/Page/Fixtures/ImportMap/*/Configuration/JavaScriptModules.php
      
      sed -i \
          -e "s/: \\(@typo3\\/.*\\)/: '\1\'/" \
          typo3/sysext/form/Configuration/Yaml/FormSetup.yaml
      
      (cd Build; grunt build)
      
      git add typo3/sysext/
      
      Resolves: #96906
      Related: #96323
      Releases: main
      Change-Id: Ifed6ac373aa2bc0c36fe157fb3e9c220f520a9c4
      Reviewed-on: https://review.typo3.org/c/Packages/TYPO3.CMS/+/73522
      
      Tested-by: core-ci's avatarcore-ci <typo3@b13.com>
      Tested-by: Benni Mack's avatarBenni Mack <benni@typo3.org>
      Tested-by: Georg Ringer's avatarGeorg Ringer <georg.ringer@gmail.com>
      Reviewed-by: Benni Mack's avatarBenni Mack <benni@typo3.org>
      Reviewed-by: Georg Ringer's avatarGeorg Ringer <georg.ringer@gmail.com>
      7a41f905
  3. 30 Aug, 2021 1 commit
  4. 11 Aug, 2021 1 commit
  5. 23 Apr, 2021 1 commit
    • Benjamin Franzke's avatar
      [TASK] Update to Lit v2-rc1 · d0da616d
      Benjamin Franzke authored
      Lit is the umbrella term for the next major
      lit-html (v2) and lit-element (v3) versions.
      Therefore we will refer to these components as
      *Lit* in TYPO3 from now on as well.
      
      These two libraries also have been migrated into
      a single entry point module named `lit`.
      It is officially described as:
      > The main module exports the core pieces needed for component
      > development: LitElement, html, css, and the most
      
      lit-html v2 and lit-element v3 are mostly compatible
      to the previous major versions. Main changes are
      
       * Deprecation of the `lit-element` entry point in
         favor of the new `lit` module
       * @internalProperty changed to @state
       * shadow css declaration via static property
         instead of static getter method
       * The CSSResult type declaration is gone
       * Directive (currently unused in TYPO3) API has changed
      
      Related testing framework change is:
      https://github.com/TYPO3/testing-framework/pull/229
      
      Commands used:
      
        rm -rf typo3/sysext/core/Resources/Public/JavaScript/Contrib/{@lit,lit-element,lit-html,lit}/
        yarn add lit@^2.0.0-rc.1 lit-html@^2.0.0-rc.2 lit-element@^3.0.0-rc.1
        yarn add --dev rollup@^2.32.0 @rollup/plugin-replace
        grunt build
        git add typo3/sysext/core/Resources/Public/JavaScript/Contrib/{@lit,lit-element,lit-html,lit}/
      
        composer require --dev typo3/testing-framework:^6.8.1
        composer require --dev typo3/testing-framework:^6.8.1 \
          --no-update --working-dir=typo3/sysext/core
      
      Resolves: #93965
      Releases: master
      Change-Id: I9b659d851e6ad9dc3cc649bd40aab886b86fb0f8
      Reviewed-on: https://review.typo3.org/c/Packages/TYPO3.CMS/+/68104
      
      Tested-by: Oliver Hader's avatarOliver Hader <oliver.hader@typo3.org>
      Tested-by: default avatarTYPO3com <noreply@typo3.com>
      Tested-by: core-ci's avatarcore-ci <typo3@b13.com>
      Tested-by: Benni Mack's avatarBenni Mack <benni@typo3.org>
      Tested-by: Benjamin Franzke's avatarBenjamin Franzke <bfr@qbus.de>
      Reviewed-by: Oliver Hader's avatarOliver Hader <oliver.hader@typo3.org>
      Reviewed-by: Benni Mack's avatarBenni Mack <benni@typo3.org>
      Reviewed-by: Benjamin Franzke's avatarBenjamin Franzke <bfr@qbus.de>
      d0da616d
  6. 19 Mar, 2021 1 commit
  7. 18 Mar, 2021 1 commit
  8. 15 Mar, 2021 1 commit
  9. 11 Mar, 2021 1 commit
  10. 10 Mar, 2021 1 commit
  11. 10 Feb, 2021 1 commit
  12. 09 Feb, 2021 1 commit