@sveltia/cms 0.29.2 → 0.30.0

package/README.md

@@ -22,12 +22,14 @@ Our goal is to make it a viable successor to Netlify CMS, expand the Git-based h
 
 ## Development status
 
-**Sveltia CMS is still in beta**, so please be careful when trying it out.
+Sveltia CMS is **still in beta**, so please be careful when trying it out.
 
 While we are fixing reported bugs as fast as we can, usually within 24 hours, the overall progress may be slower than you think. The thing is, it’s not just a personal project of [@kyoshino](https://github.com/kyoshino), but also involves different kinds of activities:
 
 - Ensuring maximum compatibility with existing versions of Netlify/Decap CMS
-- Tackling as many [issues reported to Netlify/Decap CMS](https://github.com/decaporg/decap-cms/issues) as possible (so far 90+ of them have been effectively solved in Sveltia CMS, with the goal of reaching 100 by GA)
+- Tackling as many [issues reported to Netlify/Decap CMS](https://github.com/decaporg/decap-cms/issues) as possible
+  - So far, 95+ of them have been effectively solved in Sveltia CMS, with the goal of solving 125 by GA and 200 in later releases.
+  - [Let us know](https://github.com/sveltia/sveltia-cms/issues/new) if you have a specific issue you’d like us to fix!
 - Responding to user feedback
 - Implementing our own enhancement ideas
 
@@ -39,7 +41,7 @@ We are working hard to create a **significantly better alternative to Netlify CM
 
 ### Compatible with Netlify/Decap CMS
 
-- Ready to replace Netlify/Decap CMS _in some casual use case scenarios_ by updating a single line of code.
+- Ready to be used as a drop-in replacement for Netlify/Decap CMS _in some casual use case scenarios_ with a single line of code update.
 - Your existing [configuration file](https://decapcms.org/docs/configuration-options/) can be reused as is.
 - Various features are still missing though — look at the [compatibility info](#compatibility) below to see if you can migrate now or soon.
 
@@ -48,7 +50,7 @@ We are working hard to create a **significantly better alternative to Netlify CM
 - Created and maintained by an [experienced UX engineer](https://github.com/kyoshino) who loves code, design and marketing. You can expect constant UX improvements across the platform.
 - Offers a modern, intuitive user interface, including an immersive dark mode[^2], inspired in part by the Netlify CMS v3 prototype[^1].
 - Comes with touch device support. While the UI is not yet optimized for small screens, large tablets like iPad Pro or Pixel Tablet should work well. Mobile support is planned after the 1.0 release.
-- Made with Svelte, not React, means we can spend more time on UX rather than tedious state management. It also allows us to avoid fatal React app crashes[^100]. Best of all, Svelte offers great performance!
+- Made with Svelte, not React, means we can spend more time on UX rather than tedious state management. It also allows us to avoid fatal React app crashes[^999]. Best of all, Svelte offers great performance!
 - The screenshots above are worth a thousand words, but read on to learn about many other improvements in detail.
 
 ### Better performance
@@ -73,13 +75,7 @@ We are working hard to create a **significantly better alternative to Netlify CM
   - The editor closes automatically when an entry is saved.
 - You can upload multiple assets at once[^5].
 - You can delete multiple entries and assets at once.
-- Some keyboard shortcuts are available for faster editing. More to come!
-  - View the Content Library: `Alt+1`
-  - View the Asset Library: `Alt+2`
-  - Search for entries and assets: `Ctrl+F` (Windows/Linux) or `Command+F` (macOS)
-  - Create a new entry: `Ctrl+E` (Windows/Linux) or `Command+E` (macOS)
-  - Save an entry: `Ctrl+S` (Windows/Linux) or `Command+S` (macOS)
-  - Cancel entry editing: `Escape`
+- Some [keyboard shortcuts](#using-keyboard-shortcuts) are available for faster editing.
 - Never miss out on the latest features and bug fixes by being notified when an update to the CMS is available[^31]. Then update to the latest version with a single click[^66].
 
 ### Better accessibility
@@ -100,7 +96,7 @@ We are working hard to create a **significantly better alternative to Netlify CM
 ### Better backend support
 
 - Uses the GraphQL API where possible for better performance, as mentioned above. You don’t need to set the `use_graphql` option to enable it for GitHub and GitLab.
-- The Git branch name is automatically set to the repository’s default branch (`main`, `master` or whatever) if not specified in the configuration file, preventing data loading errors due to a hardcoded fallback to `master`[^27].
+- The Git branch name is automatically set to the repository’s default branch (`main`, `master` or whatever) if not specified in the configuration file, preventing data loading errors due to a hardcoded fallback to `master`[^95][^27].
 - You can [disable automatic deployments](#disabling-automatic-deployments) by default or on demand to save costs and resources associated with CI/CD and to publish multiple changes at once[^24].
 - The GitLab backend support comes with background [service status](https://status.gitlab.com/) checking, just like GitHub. Checks are performed frequently and an incident notification is displayed prominently for both services.
 - You can quickly open the source file of an entry or asset in your repository using View on GitHub (or GitLab) under the 3-dot menu.
@@ -125,6 +121,9 @@ We are working hard to create a **significantly better alternative to Netlify CM
 - Solves problems with Chinese, Japanese and Korean (CJK) [IME](https://en.wikipedia.org/wiki/Input_method) text input in the rich text editor for the Markdown widget[^54].
 - You can use the `{{locale}}` template tag in the [`preview_path`](https://decapcms.org/docs/configuration-options/#preview_path) collection option to provide site preview links for each language[^63].
 - You can [localize entry slugs](#localizing-entry-slugs) while linking the localized files[^80], thanks to the support for Hugo’s `translationKey`[^81].
+- The List widget’s `label` and `label_singular` are not converted to lowercase, which is especially problematic in German, where all nouns are capitalized[^98].
+- When the `clean_accents` option is enabled for entry slugs, the certain characters, such as German umlauts, will be [transliterated](https://www.npmjs.com/package/@sindresorhus/transliterate)[^99].
+- You can embed the locale code in an entry by using `widget: hidden` along with `default: '{{locale}}'`[^101].
 
 ### Better collections
 
@@ -138,7 +137,7 @@ We are working hard to create a **significantly better alternative to Netlify CM
 - You can use nested fields (dot notation) in the `path` option for a folder collection, e.g. `{{fields.state.name}}/{{slug}}`[^62].
 - You can use Markdown in collection descriptions[^79]. Bold, italic, strikethrough, code and links are allowed.
 - The New Entry button won’t appear when a developer accidentally sets the `create: true` option on a file collection because it’s useless[^89].
-- The Delete Entry button won’t appear when a developer accidentally sets the `delete: true` option on a file collection because these preset files should not be deleted.
+- The Delete Entry button won’t appear when a developer accidentally sets the `delete: true` option on a file collection because the preconfigured files should not be deleted.
 - A folder collection filter with a boolean value works as expected[^93].
 
 ### Better content editing
@@ -152,6 +151,7 @@ We are working hard to create a **significantly better alternative to Netlify CM
 - Provides better scroll synchronization between the panes when editing or previewing an entry[^92].
 - You can use a full regular expression, including flags, for the widget `pattern` option[^82]. For example, if you want to allow 280 characters or less in a multiline text field, you could write `/^.{0,280}$/s` (but you can now use the `maxlength` option instead).
 - A long validation error message is displayed in full, without being hidden behind the field label[^59].
+- Any links to other entries will work as expected, with the Content Editor being updated for the other[^100].
 
 ### Better data output
 
@@ -170,7 +170,10 @@ We are working hard to create a **significantly better alternative to Netlify CM
   - A DateTime field doesn’t trigger a change in the content draft status when you’ve just started editing a new entry[^90].
 - Hidden
   - The `default` value is saved when you create a file collection item, not just a folder collection item[^78].
+  - The `default` value supports the `{{locale}}` and `{{datetime}}` template tags, which will be replaced by the locale code and the current date/time in [ISO 8601 format](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date#date_time_string_format), respectively[^101][^102].
 - List
+  - The Add Item button appears at the bottom of the list when the `add_to_top` option is not `true`, so you don’t have to scroll up each time to add new items.
+  - You can expand or collapse the entire list, while the Expand All and Collapse All buttons allow you to expand or collapse all items in the list at once.
   - A required List field with no subfield or value is marked as invalid[^43].
   - An optional List field with no subfield or value is saved as an empty array, rather than nothing[^44].
   - You can enter spaces in a simple text-based List field[^50].
@@ -187,11 +190,11 @@ We are working hard to create a **significantly better alternative to Netlify CM
   - Field options are displayed with no additional API requests[^14]. The confusing `options_length` option, which defaults to 20, is therefore ignored[^76].
   - `slug` can be used for `value_field` to show all available options instead of just one in some situations[^91].
   - Template strings with a wildcard like `{{cities.*.name}}` can also be used for `value_field`[^94].
-  - `display_fields` is displayed in the Preview page instead of `value_field`.
+  - `display_fields` is displayed in the Preview pane instead of `value_field`.
   - The redundant `search_fields` option is not required in Sveltia CMS, as it defaults to `display_fields` (and `value_field`).
 - Select
   - It’s possible to select an option with value `0`[^56].
-  - `label` is displayed in the Preview page instead of `value`.
+  - `label` is displayed in the Preview pane instead of `value`.
 - String
   - When a YouTube video URL is entered in a String field, it appears as an embedded video in the Preview pane.
     - Check your site’s [CSP](#setting-up-content-security-policy) if the preview doesn’t work.
@@ -229,7 +232,7 @@ We are working hard to create a **significantly better alternative to Netlify CM
 
 ### Better asset management
 
-- A completely new Asset Library, built separately from the image selection dialog, makes it easy to manage all of your files, including images, videos and documents.
+- A completely new Asset Library, built separately from the image selection dialog, makes it easy to manage all of your files, including images, videos and documents[^96].
   - Navigate between the global media folder and per-collection media folders[^6].
   - Preview image, audio, video, text and PDF files.
     - Check your site’s [CSP](#setting-up-content-security-policy) if the preview doesn’t work.
@@ -247,6 +250,7 @@ We are working hard to create a **significantly better alternative to Netlify CM
 - Assets stored in an entry-relative media folder are automatically deleted when the associated entry is deleted because these assets are not available for other entries[^22].
 - Hidden files (dot files) don’t appear in the Asset Library[^47].
 - You can add assets using the Quick Add button in the upper right corner of the application.
+- Files are uploaded with their original names, without converting uppercase letters and spaces to lowercase letters and hyphens[^97].
 
 ## Compatibility
 
@@ -274,12 +278,12 @@ These limitations are expected to be resolved before GA:
 | Map | Not yet supported. |
 | Markdown | Editor components, including built-in `image` and `code-block` as well as custom components, are not yet supported. |
 
-If we have missed any other features, let us know by [filing an issue](https://github.com/sveltia/sveltia-cms/issues).
+Missing other features? Let us know by [filing an issue](https://github.com/sveltia/sveltia-cms/issues/new).
 
 ### Features not to be implemented
 
 - The deprecated client-side implicit grant for the GitLab backend will not be supported, as it has already been [removed from GitLab 15.0](https://gitlab.com/gitlab-org/gitlab/-/issues/344609). Use the client-side PKCE authorization instead.
-- The Bitbucket, Gitea/Forgejo and Git Gateway backends will not be supported due to performance limitations. We may implement a performant Git Gateway alternative in the future.
+- **The Bitbucket, Gitea/Forgejo and Git Gateway backends will not be supported** due to performance limitations. We may implement a performant Git Gateway alternative in the future.
 - The Netlify Identity Widget will not be supported, as it’s not useful without Git Gateway. We may be able to support it in the future if/when a Git Gateway alternative is created.
 - The deprecated Netlify Large Media service will not be supported. Consider other storage providers.
 - Sveltia CMS has dropped the support for the deprecated Date widget following Decap CMS 3.0. Use the DateTime widget instead.
@@ -369,7 +373,7 @@ Depending on your server or framework’s configuration, when you access the CMS
 - Rename `/admin/index.html` to `/admin/cms.html`, and access `/admin/cms`
 - [Specify the configuration file path](https://decapcms.org/docs/configuration-options/#configuration-file) with a `<link>` tag in `/admin/index.html`:
   ```html
-  <link href="/admin/config.yml" type="text/yaml" rel="cms-config-url" />
+  <link href="/admin/config.yml" type="application/yaml" rel="cms-config-url" />
   ```
 
 ### Providing a JSON configuration file
@@ -409,7 +413,9 @@ You can use Sveltia CMS with a local Git repository like [Netlify/Decap CMS](htt
 1. Open the dev site at `http://localhost:[port]/` to check the rendered pages.
 1. Commit and push the changes if satisfied, or discard them if you’re just testing.
 
-Remember that the local repository support doesn’t do any Git operation. You have to fetch, pull, commit and push all changes manually with a Git client. Also, at this point, you have to reload the CMS to see the latest content after retrieving remote updates (this will be unnecessary once browsers support the proposed `FileSystemObserver` API).
+Keep in mind that the local repository support doesn’t perform any Git operations. You’ll have to manually fetch, pull, commit and push all changes using a Git client. In the near future, we’ll figure out if there’s a way to do this in a browser (because `netlify-cms-proxy-server` actually has undocumented `git` mode that allows developers to create commits to a local repository).
+
+Also, at this point, you have to reload the CMS to see the latest content after retrieving remote updates. This will be unnecessary once browsers support the proposed `FileSystemObserver` API.
 
 ### Using a custom icon for a collection
 
@@ -466,16 +472,32 @@ Rather, if you’d like to add all the media files for a collection in one singl
 
 In Sveltia CMS, those per-collection media folders are displayed prominently for easier asset management.
 
+### Using keyboard shortcuts
+
+- View the Content Library: `Alt+1`
+- View the Asset Library: `Alt+2`
+- Search for entries and assets: `Ctrl+F` (Windows/Linux) or `Command+F` (macOS)
+- Create a new entry: `Ctrl+E` (Windows/Linux) or `Command+E` (macOS)
+- Save an entry: `Ctrl+S` (Windows/Linux) or `Command+S` (macOS)
+- Cancel entry editing: `Escape`
+
 ### Using DeepL to translate entry fields
 
 Sveltia CMS comes with a handy DeepL integration so that you can translate any text field from another locale without leaving the content editor. To enable the high-quality, quick translation feature:
 
 1. Update your configuration file to enable the [i18n support](https://decapcms.org/docs/i18n/) with multiple locales.
 1. Sign up for [DeepL API](https://www.deepl.com/pro-api/) and copy your Authentication Key from DeepL’s Account page.
-1. Go back to Sveltia CMS, click on the Account button in the top right corner, then click Settings.
-1. Paste your key to the DeepL API Authentication Key field, and close the Settings dialog.
-1. Open any entry, and you can now translate all fields or individual fields by selecting Translate from the three-dot menu.
-1. If you have upgraded to DeepL API Pro, provide your new Authentication Key in the same way.
+1. Open an entry in Sveltia CMS.
+1. Click on the Translation button on the header or each field, right next to the 3-dot menu.
+1. Paste your key when prompted.
+1. The field(s) will be automatically translated.
+
+If you have upgraded to DeepL API Pro, provide your new Authentication Key:
+
+1. Click the Account button in the upper right corner, then click Settings.
+1. Select the Language tab.
+1. Paste your key to the DeepL API Authentication Key field.
+1. Close the Settings dialog.
 
 ### Localizing entry slugs
 
@@ -694,7 +716,7 @@ img-src 'self' blob: data: https://*;
 
 Visit the [Discussions](https://github.com/sveltia/sveltia-cms/discussions) page on this GitHub repository and start a new discussion. Tell us about your use cases!
 
-Want to build a website with Sveltia CMS? Maintainer [@kyoshino](https://github.com/kyoshino) is available for hire depending on your requirements.
+Looking to build a website with Sveltia CMS? Maintainer [@kyoshino](https://github.com/kyoshino) is available for hire depending on your requirements. Feel free to reach out!
 
 ## Contributions
 
@@ -702,7 +724,7 @@ Since Sveltia CMS is still in beta, we expect various problems. Please [report a
 
 Tips are always welcome! The project hasn’t set up a sponsorship program, but maintainer [@kyoshino](https://github.com/kyoshino) has a [PayPal account](https://paypal.me/kohei).
 
-Last but not least, don’t forget to star this project and spread the word so more users can benefit from the app!
+Last but not least, don’t forget to star this project and spread the word so more users can benefit from a better CMS experience!
 
 ## Related links
 
@@ -725,7 +747,7 @@ This software is provided “as is” without any express or implied warranty. W
 [^6]: Netlify/Decap CMS [#3240](https://github.com/decaporg/decap-cms/issues/3240)
 [^7]: Netlify/Decap CMS [#4386](https://github.com/decaporg/decap-cms/issues/4386)
 [^8]: Netlify/Decap CMS [#2579](https://github.com/decaporg/decap-cms/issues/2579)
-[^9]: Netlify/Decap CMS [#3505](https://github.com/decaporg/decap-cms/issues/3505)
+[^9]: Netlify/Decap CMS [#3505](https://github.com/decaporg/decap-cms/issues/3505), [#4211](https://github.com/decaporg/decap-cms/issues/4211)
 [^10]: Netlify/Decap CMS [#341](https://github.com/decaporg/decap-cms/issues/341), [#1167](https://github.com/decaporg/decap-cms/issues/1167)
 [^11]: Netlify/Decap CMS [#1382](https://github.com/decaporg/decap-cms/issues/1382)
 [^12]: Netlify/Decap CMS [#1975](https://github.com/decaporg/decap-cms/issues/1975), [#3712](https://github.com/decaporg/decap-cms/issues/3712)
@@ -744,7 +766,7 @@ This software is provided “as is” without any express or implied warranty. W
 [^25]: Netlify/Decap CMS [#526](https://github.com/decaporg/decap-cms/issues/526), [#6987](https://github.com/decaporg/decap-cms/issues/6987)
 [^26]: Netlify/Decap CMS [#3285](https://github.com/decaporg/decap-cms/issues/3285)
 [^27]: Netlify/Decap CMS [#3285](https://github.com/decaporg/decap-cms/issues/5617)
-[^28]: Netlify/Decap CMS [#6836](https://github.com/decaporg/decap-cms/pull/6836)
+[^28]: Netlify/Decap CMS [#2677](https://github.com/decaporg/decap-cms/pull/2677), [#6836](https://github.com/decaporg/decap-cms/pull/6836)
 [^29]: Netlify/Decap CMS [#4783](https://github.com/decaporg/decap-cms/issues/4783)
 [^30]: Netlify/Decap CMS [#565](https://github.com/decaporg/decap-cms/issues/565)
 [^31]: Netlify/Decap CMS [#1045](https://github.com/decaporg/decap-cms/issues/1045)
@@ -759,7 +781,7 @@ This software is provided “as is” without any express or implied warranty. W
 [^40]: Netlify/Decap CMS [#5630](https://github.com/decaporg/decap-cms/issues/5630)
 [^41]: Netlify/Decap CMS [#7011](https://github.com/decaporg/decap-cms/issues/7011)
 [^42]: Netlify/Decap CMS [#2307](https://github.com/decaporg/decap-cms/issues/2307)
-[^43]: Netlify/Decap CMS [#5381](https://github.com/decaporg/decap-cms/issues/5381)
+[^43]: Netlify/Decap CMS [#4387](https://github.com/decaporg/decap-cms/issues/4387), [#5381](https://github.com/decaporg/decap-cms/issues/5381)
 [^44]: Netlify/Decap CMS [#2613](https://github.com/decaporg/decap-cms/issues/2613)
 [^45]: Netlify/Decap CMS [#1424](https://github.com/decaporg/decap-cms/issues/1424)
 [^46]: Netlify/Decap CMS [#4726](https://github.com/decaporg/decap-cms/issues/4726)
@@ -777,7 +799,7 @@ This software is provided “as is” without any express or implied warranty. W
 [^58]: Netlify/Decap CMS [#5125](https://github.com/decaporg/decap-cms/issues/5125)
 [^59]: Netlify/Decap CMS [#1654](https://github.com/decaporg/decap-cms/issues/1654)
 [^60]: Netlify/Decap CMS [#386](https://github.com/decaporg/decap-cms/issues/386)
-[^61]: Netlify/Decap CMS [#1489](https://github.com/decaporg/decap-cms/issues/1489)
+[^61]: Netlify/Decap CMS [#1489](https://github.com/decaporg/decap-cms/issues/1489), [#5838](https://github.com/decaporg/decap-cms/issues/5838)
 [^62]: Netlify/Decap CMS [#7192](https://github.com/decaporg/decap-cms/issues/7192)
 [^63]: Netlify/Decap CMS [#4877](https://github.com/decaporg/decap-cms/issues/4877)
 [^64]: Netlify/Decap CMS [#3853](https://github.com/decaporg/decap-cms/issues/3853)
@@ -811,4 +833,12 @@ This software is provided “as is” without any express or implied warranty. W
 [^92]: Netlify/Decap CMS [#1466](https://github.com/decaporg/decap-cms/issues/1466)
 [^93]: Netlify/Decap CMS [#1000](https://github.com/decaporg/decap-cms/issues/1000)
 [^94]: Netlify/Decap CMS [#5487](https://github.com/decaporg/decap-cms/issues/5487)
-[^100]: Netlify/Decap CMS [#5656](https://github.com/decaporg/decap-cms/issues/5656), [#5837](https://github.com/decaporg/decap-cms/issues/5837), [#5972](https://github.com/decaporg/decap-cms/issues/5972), [#6476](https://github.com/decaporg/decap-cms/issues/6476), [#6516](https://github.com/decaporg/decap-cms/issues/6516), [#6930](https://github.com/decaporg/decap-cms/issues/6930), [#6965](https://github.com/decaporg/decap-cms/issues/6965), [#7080](https://github.com/decaporg/decap-cms/issues/7080), [#7105](https://github.com/decaporg/decap-cms/issues/7105), [#7106](https://github.com/decaporg/decap-cms/issues/7106), [#7119](https://github.com/decaporg/decap-cms/issues/7119), [#7176](https://github.com/decaporg/decap-cms/issues/7176), [#7194](https://github.com/decaporg/decap-cms/issues/7194) — These `removeChild` crashes are common in React apps and seem to be caused by a [browser extension](https://github.com/facebook/react/issues/17256) or [Google Translate](https://github.com/facebook/react/issues/11538).
+[^95]: Netlify/Decap CMS [#4417](https://github.com/decaporg/decap-cms/issues/4417)
+[^96]: Netlify/Decap CMS [#962](https://github.com/decaporg/decap-cms/issues/962)
+[^97]: Netlify/Decap CMS [#4288](https://github.com/decaporg/decap-cms/issues/4288)
+[^98]: Netlify/Decap CMS [#3856](https://github.com/decaporg/decap-cms/issues/3856)
+[^99]: Netlify/Decap CMS [#1685](https://github.com/decaporg/decap-cms/issues/1685)
+[^100]: Netlify/Decap CMS [#4147](https://github.com/decaporg/decap-cms/issues/4147)
+[^101]: Netlify/Decap CMS [#5969](https://github.com/decaporg/decap-cms/issues/5969)
+[^102]: Netlify/Decap CMS [#1270](https://github.com/decaporg/decap-cms/issues/1270)
+[^999]: Netlify/Decap CMS [#5656](https://github.com/decaporg/decap-cms/issues/5656), [#5837](https://github.com/decaporg/decap-cms/issues/5837), [#5972](https://github.com/decaporg/decap-cms/issues/5972), [#6476](https://github.com/decaporg/decap-cms/issues/6476), [#6516](https://github.com/decaporg/decap-cms/issues/6516), [#6930](https://github.com/decaporg/decap-cms/issues/6930), [#6965](https://github.com/decaporg/decap-cms/issues/6965), [#7080](https://github.com/decaporg/decap-cms/issues/7080), [#7105](https://github.com/decaporg/decap-cms/issues/7105), [#7106](https://github.com/decaporg/decap-cms/issues/7106), [#7119](https://github.com/decaporg/decap-cms/issues/7119), [#7176](https://github.com/decaporg/decap-cms/issues/7176), [#7194](https://github.com/decaporg/decap-cms/issues/7194) — These `removeChild` crashes are common in React apps and seem to be caused by a [browser extension](https://github.com/facebook/react/issues/17256) or [Google Translate](https://github.com/facebook/react/issues/11538).