diff --git a/src/Umbraco.Web.UI.Client/.storybook/main.ts b/src/Umbraco.Web.UI.Client/.storybook/main.ts index 1904aec0d2..58d9e365e4 100644 --- a/src/Umbraco.Web.UI.Client/.storybook/main.ts +++ b/src/Umbraco.Web.UI.Client/.storybook/main.ts @@ -12,7 +12,7 @@ const config: StorybookConfig = { check: true, }, docs: { - autodocs: 'tag' + autodocs: true, }, }; export default config; diff --git a/src/Umbraco.Web.UI.Client/.storybook/preview.js b/src/Umbraco.Web.UI.Client/.storybook/preview.js index 9ec7b81059..87af746303 100644 --- a/src/Umbraco.Web.UI.Client/.storybook/preview.js +++ b/src/Umbraco.Web.UI.Client/.storybook/preview.js @@ -13,6 +13,8 @@ import { setCustomElements } from '@storybook/web-components'; import { UmbDataTypeStore } from '../src/backoffice/settings/data-types/repository/data-type.store.ts'; import { UmbDocumentTypeStore } from '../src/backoffice/documents/document-types/repository/document-type.store.ts'; +import { UmbDocumentStore } from '../src/backoffice/documents/documents/repository/document.store.ts'; +import { UmbDocumentTreeStore } from '../src/backoffice/documents/documents/repository/document.tree.store.ts'; import customElementManifests from '../custom-elements.json'; import { UmbIconStore } from '../libs/store/icon/icon.store'; @@ -21,23 +23,20 @@ import { handlers } from '../src/core/mocks/browser-handlers'; import { LitElement } from 'lit'; import { UMB_MODAL_CONTEXT_TOKEN, UmbModalContext } from '../src/core/modal'; -// TODO: Fix storybook manifest registrations. - import { umbExtensionsRegistry } from '../libs/extensions-api'; -import '../src/backoffice/shared/components/backoffice-frame/backoffice-notification-container.element'; import '../libs/element/context-provider.element'; -import '../src/backoffice/shared/components/backoffice-frame/backoffice-modal-container.element'; -import '../src/backoffice/shared/components/code-block/code-block.element'; -import '../src/backoffice/shared/components/workspace/workspace-layout/workspace-layout.element'; import '../src/backoffice/shared/components'; +import { manifests as documentManifests } from '../src/backoffice/documents'; + class UmbStoryBookElement extends LitElement { _umbIconStore = new UmbIconStore(); constructor() { super(); this._umbIconStore.attach(this); + this._registerExtensions(documentManifests); } _registerExtensions(manifests) { @@ -56,7 +55,6 @@ customElements.define('umb-storybook', UmbStoryBookElement); const storybookProvider = (story) => html` ${story()} `; -// TODO: Stop using this context provider element. If we need to continue this path, then we should make a new element which just has a create method that can be used to spin up code. This is because our ContextAPIs provide them self. so no need for a provider element. just a element. const dataTypeStoreProvider = (story) => html` new UmbDataTypeStore(host)}>${story()} `; @@ -65,6 +63,14 @@ const documentTypeStoreProvider = (story) => html` new UmbDocumentTypeStore(host)}>${story()} `; +const documentStoreProvider = (story) => html` + new UmbDocumentStore(host)}>${story()} +`; + +const documentTreeStoreProvider = (story) => html` + new UmbDocumentTreeStore(host)}>${story()} +`; + const modalContextProvider = (story) => html` diff --git a/src/Umbraco.Web.UI.Client/package-lock.json b/src/Umbraco.Web.UI.Client/package-lock.json index e28bc3ad69..3457c02a8d 100644 --- a/src/Umbraco.Web.UI.Client/package-lock.json +++ b/src/Umbraco.Web.UI.Client/package-lock.json @@ -19374,34 +19374,6 @@ "integrity": "sha512-1eEgUGmkaljiBnRMTdksDV1W4kUnmwgp7X9G8B++9GYwl1lUdqSndSriIrTJ0N7LQaoauY9JJ2yhiOYK5+NI4A==", "dev": true }, - "@esbuild/android-arm": { - "version": "0.16.17", - "resolved": "https://registry.npmjs.org/@esbuild/android-arm/-/android-arm-0.16.17.tgz", - "integrity": "sha512-N9x1CMXVhtWEAMS7pNNONyA14f71VPQN9Cnavj1XQh6T7bskqiLLrSca4O0Vr8Wdcga943eThxnVp3JLnBMYtw==", - "dev": true, - "optional": true - }, - "@esbuild/android-arm64": { - "version": "0.16.17", - "resolved": "https://registry.npmjs.org/@esbuild/android-arm64/-/android-arm64-0.16.17.tgz", - "integrity": "sha512-MIGl6p5sc3RDTLLkYL1MyL8BMRN4tLMRCn+yRJJmEDvYZ2M7tmAf80hx1kbNEUX2KJ50RRtxZ4JHLvCfuB6kBg==", - "dev": true, - "optional": true - }, - "@esbuild/android-x64": { - "version": "0.16.17", - "resolved": "https://registry.npmjs.org/@esbuild/android-x64/-/android-x64-0.16.17.tgz", - "integrity": "sha512-a3kTv3m0Ghh4z1DaFEuEDfz3OLONKuFvI4Xqczqx4BqLyuFaFkuaG4j2MtA6fuWEFeC5x9IvqnX7drmRq/fyAQ==", - "dev": true, - "optional": true - }, - "@esbuild/darwin-arm64": { - "version": "0.16.17", - "resolved": "https://registry.npmjs.org/@esbuild/darwin-arm64/-/darwin-arm64-0.16.17.tgz", - "integrity": "sha512-/2agbUEfmxWHi9ARTX6OQ/KgXnOWfsNlTeLcoV7HSuSTv63E4DqtAc+2XqGw1KHxKMHGZgbVCZge7HXWX9Vn+w==", - "dev": true, - "optional": true - }, "@esbuild/darwin-x64": { "version": "0.16.17", "resolved": "https://registry.npmjs.org/@esbuild/darwin-x64/-/darwin-x64-0.16.17.tgz", @@ -19409,125 +19381,6 @@ "dev": true, "optional": true }, - "@esbuild/freebsd-arm64": { - "version": "0.16.17", - "resolved": "https://registry.npmjs.org/@esbuild/freebsd-arm64/-/freebsd-arm64-0.16.17.tgz", - "integrity": "sha512-mt+cxZe1tVx489VTb4mBAOo2aKSnJ33L9fr25JXpqQqzbUIw/yzIzi+NHwAXK2qYV1lEFp4OoVeThGjUbmWmdw==", - "dev": true, - "optional": true - }, - "@esbuild/freebsd-x64": { - "version": "0.16.17", - "resolved": "https://registry.npmjs.org/@esbuild/freebsd-x64/-/freebsd-x64-0.16.17.tgz", - "integrity": "sha512-8ScTdNJl5idAKjH8zGAsN7RuWcyHG3BAvMNpKOBaqqR7EbUhhVHOqXRdL7oZvz8WNHL2pr5+eIT5c65kA6NHug==", - "dev": true, - "optional": true - }, - "@esbuild/linux-arm": { - "version": "0.16.17", - "resolved": "https://registry.npmjs.org/@esbuild/linux-arm/-/linux-arm-0.16.17.tgz", - "integrity": "sha512-iihzrWbD4gIT7j3caMzKb/RsFFHCwqqbrbH9SqUSRrdXkXaygSZCZg1FybsZz57Ju7N/SHEgPyaR0LZ8Zbe9gQ==", - "dev": true, - "optional": true - }, - "@esbuild/linux-arm64": { - "version": "0.16.17", - "resolved": "https://registry.npmjs.org/@esbuild/linux-arm64/-/linux-arm64-0.16.17.tgz", - "integrity": "sha512-7S8gJnSlqKGVJunnMCrXHU9Q8Q/tQIxk/xL8BqAP64wchPCTzuM6W3Ra8cIa1HIflAvDnNOt2jaL17vaW+1V0g==", - "dev": true, - "optional": true - }, - "@esbuild/linux-ia32": { - "version": "0.16.17", - "resolved": "https://registry.npmjs.org/@esbuild/linux-ia32/-/linux-ia32-0.16.17.tgz", - "integrity": "sha512-kiX69+wcPAdgl3Lonh1VI7MBr16nktEvOfViszBSxygRQqSpzv7BffMKRPMFwzeJGPxcio0pdD3kYQGpqQ2SSg==", - "dev": true, - "optional": true - }, - "@esbuild/linux-loong64": { - "version": "0.16.17", - "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.16.17.tgz", - "integrity": "sha512-dTzNnQwembNDhd654cA4QhbS9uDdXC3TKqMJjgOWsC0yNCbpzfWoXdZvp0mY7HU6nzk5E0zpRGGx3qoQg8T2DQ==", - "dev": true, - "optional": true - }, - "@esbuild/linux-mips64el": { - "version": "0.16.17", - "resolved": "https://registry.npmjs.org/@esbuild/linux-mips64el/-/linux-mips64el-0.16.17.tgz", - "integrity": "sha512-ezbDkp2nDl0PfIUn0CsQ30kxfcLTlcx4Foz2kYv8qdC6ia2oX5Q3E/8m6lq84Dj/6b0FrkgD582fJMIfHhJfSw==", - "dev": true, - "optional": true - }, - "@esbuild/linux-ppc64": { - "version": "0.16.17", - "resolved": "https://registry.npmjs.org/@esbuild/linux-ppc64/-/linux-ppc64-0.16.17.tgz", - "integrity": "sha512-dzS678gYD1lJsW73zrFhDApLVdM3cUF2MvAa1D8K8KtcSKdLBPP4zZSLy6LFZ0jYqQdQ29bjAHJDgz0rVbLB3g==", - "dev": true, - "optional": true - }, - "@esbuild/linux-riscv64": { - "version": "0.16.17", - "resolved": "https://registry.npmjs.org/@esbuild/linux-riscv64/-/linux-riscv64-0.16.17.tgz", - "integrity": "sha512-ylNlVsxuFjZK8DQtNUwiMskh6nT0vI7kYl/4fZgV1llP5d6+HIeL/vmmm3jpuoo8+NuXjQVZxmKuhDApK0/cKw==", - "dev": true, - "optional": true - }, - "@esbuild/linux-s390x": { - "version": "0.16.17", - "resolved": "https://registry.npmjs.org/@esbuild/linux-s390x/-/linux-s390x-0.16.17.tgz", - "integrity": "sha512-gzy7nUTO4UA4oZ2wAMXPNBGTzZFP7mss3aKR2hH+/4UUkCOyqmjXiKpzGrY2TlEUhbbejzXVKKGazYcQTZWA/w==", - "dev": true, - "optional": true - }, - "@esbuild/linux-x64": { - "version": "0.16.17", - "resolved": "https://registry.npmjs.org/@esbuild/linux-x64/-/linux-x64-0.16.17.tgz", - "integrity": "sha512-mdPjPxfnmoqhgpiEArqi4egmBAMYvaObgn4poorpUaqmvzzbvqbowRllQ+ZgzGVMGKaPkqUmPDOOFQRUFDmeUw==", - "dev": true, - "optional": true - }, - "@esbuild/netbsd-x64": { - "version": "0.16.17", - "resolved": "https://registry.npmjs.org/@esbuild/netbsd-x64/-/netbsd-x64-0.16.17.tgz", - "integrity": "sha512-/PzmzD/zyAeTUsduZa32bn0ORug+Jd1EGGAUJvqfeixoEISYpGnAezN6lnJoskauoai0Jrs+XSyvDhppCPoKOA==", - "dev": true, - "optional": true - }, - "@esbuild/openbsd-x64": { - "version": "0.16.17", - "resolved": "https://registry.npmjs.org/@esbuild/openbsd-x64/-/openbsd-x64-0.16.17.tgz", - "integrity": "sha512-2yaWJhvxGEz2RiftSk0UObqJa/b+rIAjnODJgv2GbGGpRwAfpgzyrg1WLK8rqA24mfZa9GvpjLcBBg8JHkoodg==", - "dev": true, - "optional": true - }, - "@esbuild/sunos-x64": { - "version": "0.16.17", - "resolved": "https://registry.npmjs.org/@esbuild/sunos-x64/-/sunos-x64-0.16.17.tgz", - "integrity": "sha512-xtVUiev38tN0R3g8VhRfN7Zl42YCJvyBhRKw1RJjwE1d2emWTVToPLNEQj/5Qxc6lVFATDiy6LjVHYhIPrLxzw==", - "dev": true, - "optional": true - }, - "@esbuild/win32-arm64": { - "version": "0.16.17", - "resolved": "https://registry.npmjs.org/@esbuild/win32-arm64/-/win32-arm64-0.16.17.tgz", - "integrity": "sha512-ga8+JqBDHY4b6fQAmOgtJJue36scANy4l/rL97W+0wYmijhxKetzZdKOJI7olaBaMhWt8Pac2McJdZLxXWUEQw==", - "dev": true, - "optional": true - }, - "@esbuild/win32-ia32": { - "version": "0.16.17", - "resolved": "https://registry.npmjs.org/@esbuild/win32-ia32/-/win32-ia32-0.16.17.tgz", - "integrity": "sha512-WnsKaf46uSSF/sZhwnqE4L/F89AYNMiD4YtEcYekBt9Q7nj0DiId2XH2Ng2PHM54qi5oPrQ8luuzGszqi/veig==", - "dev": true, - "optional": true - }, - "@esbuild/win32-x64": { - "version": "0.16.17", - "resolved": "https://registry.npmjs.org/@esbuild/win32-x64/-/win32-x64-0.16.17.tgz", - "integrity": "sha512-y+EHuSchhL7FjHgvQL/0fnnFmO4T1bhvWANX6gcnqTjtnKWbTvUMCpGnv2+t+31d7RzyEAYAd4u2fnIhHL6N/Q==", - "dev": true, - "optional": true - }, "@eslint/eslintrc": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/@eslint/eslintrc/-/eslintrc-2.0.0.tgz", @@ -23261,13 +23114,6 @@ "ua-parser-js": "^1.0.2" }, "dependencies": { - "@esbuild/linux-loong64": { - "version": "0.14.54", - "resolved": "https://registry.npmjs.org/@esbuild/linux-loong64/-/linux-loong64-0.14.54.tgz", - "integrity": "sha512-bZBrLAIX1kpWelV0XemxBZllyRmM6vgFQQG2GdNb+r3Fkp0FOh1NJSvekXDs7jq70k4euu1cryLMfU+mTXlEpw==", - "dev": true, - "optional": true - }, "esbuild": { "version": "0.14.54", "resolved": "https://registry.npmjs.org/esbuild/-/esbuild-0.14.54.tgz", @@ -25290,20 +25136,6 @@ "@esbuild/win32-x64": "0.16.17" } }, - "esbuild-android-64": { - "version": "0.14.54", - "resolved": "https://registry.npmjs.org/esbuild-android-64/-/esbuild-android-64-0.14.54.tgz", - "integrity": "sha512-Tz2++Aqqz0rJ7kYBfz+iqyE3QMycD4vk7LBRyWaAVFgFtQ/O8EJOnVmTOiDWYZ/uYzB4kvP+bqejYdVKzE5lAQ==", - "dev": true, - "optional": true - }, - "esbuild-android-arm64": { - "version": "0.14.54", - "resolved": "https://registry.npmjs.org/esbuild-android-arm64/-/esbuild-android-arm64-0.14.54.tgz", - "integrity": "sha512-F9E+/QDi9sSkLaClO8SOV6etqPd+5DgJje1F9lOWoNncDdOBL2YF59IhsWATSt0TLZbYCf3pNlTHvVV5VfHdvg==", - "dev": true, - "optional": true - }, "esbuild-darwin-64": { "version": "0.14.54", "resolved": "https://registry.npmjs.org/esbuild-darwin-64/-/esbuild-darwin-64-0.14.54.tgz", @@ -25311,97 +25143,6 @@ "dev": true, "optional": true }, - "esbuild-darwin-arm64": { - "version": "0.14.54", - "resolved": "https://registry.npmjs.org/esbuild-darwin-arm64/-/esbuild-darwin-arm64-0.14.54.tgz", - "integrity": "sha512-OPafJHD2oUPyvJMrsCvDGkRrVCar5aVyHfWGQzY1dWnzErjrDuSETxwA2HSsyg2jORLY8yBfzc1MIpUkXlctmw==", - "dev": true, - "optional": true - }, - "esbuild-freebsd-64": { - "version": "0.14.54", - "resolved": "https://registry.npmjs.org/esbuild-freebsd-64/-/esbuild-freebsd-64-0.14.54.tgz", - "integrity": "sha512-OKwd4gmwHqOTp4mOGZKe/XUlbDJ4Q9TjX0hMPIDBUWWu/kwhBAudJdBoxnjNf9ocIB6GN6CPowYpR/hRCbSYAg==", - "dev": true, - "optional": true - }, - "esbuild-freebsd-arm64": { - "version": "0.14.54", - "resolved": "https://registry.npmjs.org/esbuild-freebsd-arm64/-/esbuild-freebsd-arm64-0.14.54.tgz", - "integrity": "sha512-sFwueGr7OvIFiQT6WeG0jRLjkjdqWWSrfbVwZp8iMP+8UHEHRBvlaxL6IuKNDwAozNUmbb8nIMXa7oAOARGs1Q==", - "dev": true, - "optional": true - }, - "esbuild-linux-32": { - "version": "0.14.54", - "resolved": "https://registry.npmjs.org/esbuild-linux-32/-/esbuild-linux-32-0.14.54.tgz", - "integrity": "sha512-1ZuY+JDI//WmklKlBgJnglpUL1owm2OX+8E1syCD6UAxcMM/XoWd76OHSjl/0MR0LisSAXDqgjT3uJqT67O3qw==", - "dev": true, - "optional": true - }, - "esbuild-linux-64": { - "version": "0.14.54", - "resolved": "https://registry.npmjs.org/esbuild-linux-64/-/esbuild-linux-64-0.14.54.tgz", - "integrity": "sha512-EgjAgH5HwTbtNsTqQOXWApBaPVdDn7XcK+/PtJwZLT1UmpLoznPd8c5CxqsH2dQK3j05YsB3L17T8vE7cp4cCg==", - "dev": true, - "optional": true - }, - "esbuild-linux-arm": { - "version": "0.14.54", - "resolved": "https://registry.npmjs.org/esbuild-linux-arm/-/esbuild-linux-arm-0.14.54.tgz", - "integrity": "sha512-qqz/SjemQhVMTnvcLGoLOdFpCYbz4v4fUo+TfsWG+1aOu70/80RV6bgNpR2JCrppV2moUQkww+6bWxXRL9YMGw==", - "dev": true, - "optional": true - }, - "esbuild-linux-arm64": { - "version": "0.14.54", - "resolved": "https://registry.npmjs.org/esbuild-linux-arm64/-/esbuild-linux-arm64-0.14.54.tgz", - "integrity": "sha512-WL71L+0Rwv+Gv/HTmxTEmpv0UgmxYa5ftZILVi2QmZBgX3q7+tDeOQNqGtdXSdsL8TQi1vIaVFHUPDe0O0kdig==", - "dev": true, - "optional": true - }, - "esbuild-linux-mips64le": { - "version": "0.14.54", - "resolved": "https://registry.npmjs.org/esbuild-linux-mips64le/-/esbuild-linux-mips64le-0.14.54.tgz", - "integrity": "sha512-qTHGQB8D1etd0u1+sB6p0ikLKRVuCWhYQhAHRPkO+OF3I/iSlTKNNS0Lh2Oc0g0UFGguaFZZiPJdJey3AGpAlw==", - "dev": true, - "optional": true - }, - "esbuild-linux-ppc64le": { - "version": "0.14.54", - "resolved": "https://registry.npmjs.org/esbuild-linux-ppc64le/-/esbuild-linux-ppc64le-0.14.54.tgz", - "integrity": "sha512-j3OMlzHiqwZBDPRCDFKcx595XVfOfOnv68Ax3U4UKZ3MTYQB5Yz3X1mn5GnodEVYzhtZgxEBidLWeIs8FDSfrQ==", - "dev": true, - "optional": true - }, - "esbuild-linux-riscv64": { - "version": "0.14.54", - "resolved": "https://registry.npmjs.org/esbuild-linux-riscv64/-/esbuild-linux-riscv64-0.14.54.tgz", - "integrity": "sha512-y7Vt7Wl9dkOGZjxQZnDAqqn+XOqFD7IMWiewY5SPlNlzMX39ocPQlOaoxvT4FllA5viyV26/QzHtvTjVNOxHZg==", - "dev": true, - "optional": true - }, - "esbuild-linux-s390x": { - "version": "0.14.54", - "resolved": "https://registry.npmjs.org/esbuild-linux-s390x/-/esbuild-linux-s390x-0.14.54.tgz", - "integrity": "sha512-zaHpW9dziAsi7lRcyV4r8dhfG1qBidQWUXweUjnw+lliChJqQr+6XD71K41oEIC3Mx1KStovEmlzm+MkGZHnHA==", - "dev": true, - "optional": true - }, - "esbuild-netbsd-64": { - "version": "0.14.54", - "resolved": "https://registry.npmjs.org/esbuild-netbsd-64/-/esbuild-netbsd-64-0.14.54.tgz", - "integrity": "sha512-PR01lmIMnfJTgeU9VJTDY9ZerDWVFIUzAtJuDHwwceppW7cQWjBBqP48NdeRtoP04/AtO9a7w3viI+PIDr6d+w==", - "dev": true, - "optional": true - }, - "esbuild-openbsd-64": { - "version": "0.14.54", - "resolved": "https://registry.npmjs.org/esbuild-openbsd-64/-/esbuild-openbsd-64-0.14.54.tgz", - "integrity": "sha512-Qyk7ikT2o7Wu76UsvvDS5q0amJvmRzDyVlL0qf5VLsLchjCa1+IAvd8kTBgUxD7VBUUVgItLkk609ZHUc1oCaw==", - "dev": true, - "optional": true - }, "esbuild-plugin-alias": { "version": "0.2.1", "resolved": "https://registry.npmjs.org/esbuild-plugin-alias/-/esbuild-plugin-alias-0.2.1.tgz", @@ -25417,34 +25158,6 @@ "debug": "^4.3.4" } }, - "esbuild-sunos-64": { - "version": "0.14.54", - "resolved": "https://registry.npmjs.org/esbuild-sunos-64/-/esbuild-sunos-64-0.14.54.tgz", - "integrity": "sha512-28GZ24KmMSeKi5ueWzMcco6EBHStL3B6ubM7M51RmPwXQGLe0teBGJocmWhgwccA1GeFXqxzILIxXpHbl9Q/Kw==", - "dev": true, - "optional": true - }, - "esbuild-windows-32": { - "version": "0.14.54", - "resolved": "https://registry.npmjs.org/esbuild-windows-32/-/esbuild-windows-32-0.14.54.tgz", - "integrity": "sha512-T+rdZW19ql9MjS7pixmZYVObd9G7kcaZo+sETqNH4RCkuuYSuv9AGHUVnPoP9hhuE1WM1ZimHz1CIBHBboLU7w==", - "dev": true, - "optional": true - }, - "esbuild-windows-64": { - "version": "0.14.54", - "resolved": "https://registry.npmjs.org/esbuild-windows-64/-/esbuild-windows-64-0.14.54.tgz", - "integrity": "sha512-AoHTRBUuYwXtZhjXZbA1pGfTo8cJo3vZIcWGLiUcTNgHpJJMC1rVA44ZereBHMJtotyN71S8Qw0npiCIkW96cQ==", - "dev": true, - "optional": true - }, - "esbuild-windows-arm64": { - "version": "0.14.54", - "resolved": "https://registry.npmjs.org/esbuild-windows-arm64/-/esbuild-windows-arm64-0.14.54.tgz", - "integrity": "sha512-M0kuUvXhot1zOISQGXwWn6YtS+Y/1RT9WrVIOywZnJHo3jCDyewAc79aKNQWFCQm+xNHVTq9h8dZKvygoXQQRg==", - "dev": true, - "optional": true - }, "escalade": { "version": "3.1.1", "resolved": "https://registry.npmjs.org/escalade/-/escalade-3.1.1.tgz", diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/documents/index.ts b/src/Umbraco.Web.UI.Client/src/backoffice/documents/index.ts index bf9cceb4dc..7cfabc7cce 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/documents/index.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/documents/index.ts @@ -8,15 +8,17 @@ import { manifests as documentManifests } from './documents/manifests'; import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api'; import { ManifestTypes } from '@umbraco-cms/extensions-registry'; -const registerExtensions = (manifests: Array) => { - manifests.forEach((manifest) => umbExtensionsRegistry.register(manifest)); -}; - -registerExtensions([ +export const manifests = [ ...dashboardManifests, ...contentSectionManifests, ...contentMenuManifest, ...documentBlueprintManifests, ...documentTypeManifests, ...documentManifests, -]); +]; + +const registerExtensions = (manifests: Array) => { + manifests.forEach((manifest) => umbExtensionsRegistry.register(manifest)); +}; + +registerExtensions(manifests); diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/media/index.ts b/src/Umbraco.Web.UI.Client/src/backoffice/media/index.ts index 89e6e16643..76a1e6c199 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/media/index.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/media/index.ts @@ -6,8 +6,10 @@ import { manifests as mediaTypesManifests } from './media-types/manifests'; import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api'; import { ManifestTypes } from '@umbraco-cms/extensions-registry'; +export const manifests = [...mediaSectionManifests, ...mediaMenuManifests, ...mediaManifests, ...mediaTypesManifests]; + const registerExtensions = (manifests: Array) => { manifests.forEach((manifest) => umbExtensionsRegistry.register(manifest)); }; -registerExtensions([...mediaSectionManifests, ...mediaMenuManifests, ...mediaManifests, ...mediaTypesManifests]); +registerExtensions(manifests); diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/members/index.ts b/src/Umbraco.Web.UI.Client/src/backoffice/members/index.ts index c5731e4ba3..386a38582f 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/members/index.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/members/index.ts @@ -7,14 +7,16 @@ import { manifests as memberManifests } from './members/manifests'; import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api'; import { ManifestTypes } from '@umbraco-cms/extensions-registry'; -const registerExtensions = (manifests: Array) => { - manifests.forEach((manifest) => umbExtensionsRegistry.register(manifest)); -}; - -registerExtensions([ +export const manifests = [ ...memberSectionManifests, ...menuSectionManifests, ...memberGroupManifests, ...memberTypeManifests, ...memberManifests, -]); +]; + +const registerExtensions = (manifests: Array) => { + manifests.forEach((manifest) => umbExtensionsRegistry.register(manifest)); +}; + +registerExtensions(manifests); diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/packages/index.ts b/src/Umbraco.Web.UI.Client/src/backoffice/packages/index.ts index 2609d2d22a..f0a7107779 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/packages/index.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/packages/index.ts @@ -6,13 +6,15 @@ import { manifests as packageSectionManifests } from './package-section/manifest import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api'; import { ManifestTypes } from '@umbraco-cms/extensions-registry'; -const registerExtensions = (manifests: Array) => { - manifests.forEach((manifest) => umbExtensionsRegistry.register(manifest)); -}; - -registerExtensions([ +export const manifests = [ ...repositoryManifests, ...packageBuilderManifests, ...packageRepoManifests, ...packageSectionManifests, -]); +]; + +const registerExtensions = (manifests: Array) => { + manifests.forEach((manifest) => umbExtensionsRegistry.register(manifest)); +}; + +registerExtensions(manifests); diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/search/index.ts b/src/Umbraco.Web.UI.Client/src/backoffice/search/index.ts index eba052d212..e0d341e7cc 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/search/index.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/search/index.ts @@ -3,8 +3,10 @@ import { manifests as searchManifests } from '../search/manifests'; import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api'; import { ManifestTypes } from '@umbraco-cms/extensions-registry'; +export const manifests = [...searchManifests]; + const registerExtensions = (manifests: Array) => { manifests.forEach((manifest) => umbExtensionsRegistry.register(manifest)); }; -registerExtensions([...searchManifests]); +registerExtensions(manifests); diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/settings/index.ts b/src/Umbraco.Web.UI.Client/src/backoffice/settings/index.ts index ad131eb979..abe3d1ba75 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/settings/index.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/settings/index.ts @@ -10,11 +10,7 @@ import { manifests as logviewerManifests } from './logviewer/manifests'; import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api'; import { ManifestTypes } from '@umbraco-cms/extensions-registry'; -const registerExtensions = (manifests: Array) => { - manifests.forEach((manifest) => umbExtensionsRegistry.register(manifest)); -}; - -registerExtensions([ +export const manifests = [ ...settingsSectionManifests, ...settingsMenuManifests, ...dashboardManifests, @@ -23,4 +19,10 @@ registerExtensions([ ...cultureManifests, ...languageManifests, ...logviewerManifests, -]); +]; + +const registerExtensions = (manifests: Array) => { + manifests.forEach((manifest) => umbExtensionsRegistry.register(manifest)); +}; + +registerExtensions(manifests); diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/body-layout/body-layout.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/body-layout/body-layout.element.ts index 0770f98a60..bf8a267d1a 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/body-layout/body-layout.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/body-layout/body-layout.element.ts @@ -2,6 +2,10 @@ import { css, html, LitElement, nothing } from 'lit'; import { UUITextStyles } from '@umbraco-ui/uui-css/lib'; import { customElement, property, state } from 'lit/decorators.js'; +/* + * is used to create a layout with a header, main and footer slot for workspaces + * @element umb-body-layout +*/ @customElement('umb-body-layout') export class UmbBodyLayout extends LitElement { static styles = [ diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/body-layout/body-layout.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/body-layout/body-layout.stories.ts index b26242bee7..087ae4c959 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/body-layout/body-layout.stories.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/body-layout/body-layout.stories.ts @@ -1,19 +1,22 @@ -import './body-layout.element'; - -import { Meta, Story } from '@storybook/web-components'; +import { Meta, StoryObj } from '@storybook/web-components'; import { html } from 'lit-html'; +import './body-layout.element'; import type { UmbBodyLayout } from './body-layout.element'; -export default { - title: 'Workspaces/Shared/Workspace Layout', - component: 'umb-body-layout', - id: 'umb-body-layout', -} as Meta; +const meta: Meta = { + title: 'Components/Workspace Layout', + component: 'umb-body-layout' +}; + +export default meta; +type Story = StoryObj; -export const AAAOverview: Story = () => html` -
Header slot
- Main slot -
Footer slot
-`; -AAAOverview.storyName = 'Overview'; +export const Overview: Story = { + render: () => html` + +
Header slot
+ Main slot +
Footer slot
+ ` +}; diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/code-block/code-block.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/code-block/code-block.stories.ts new file mode 100644 index 0000000000..533a46b28e --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/code-block/code-block.stories.ts @@ -0,0 +1,26 @@ +import { Meta, StoryObj } from '@storybook/web-components'; +import { html } from 'lit-html'; +import './code-block.element'; +import type { UUICodeBlock } from './code-block.element'; + +const meta: Meta = { + title: 'Components/Code Block', + component: 'uui-code-block' +}; + +export default meta; +type Story = StoryObj; + +export const Overview: Story = { + args: { + } +}; + +export const WithCode: Story = { + decorators: [], + render: () => html` + + // Lets write some javascript + alert("Hello World"); + ` +}; \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/debug/stories/debug.mdx b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/debug/stories/debug.mdx index 3497502ad5..511a284cb4 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/debug/stories/debug.mdx +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/debug/stories/debug.mdx @@ -1,11 +1,8 @@ -import { Canvas, Meta, Story } from '@storybook/addon-docs'; +import { Meta } from '@storybook/blocks'; import DebugDialogImage from './umb-debug-dialog.jpg'; import DebugImage from './umb-debug.jpg'; - - - - + # Debugging diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/empty-state/empty-state.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/empty-state/empty-state.stories.ts new file mode 100644 index 0000000000..5784914c4e --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/empty-state/empty-state.stories.ts @@ -0,0 +1,26 @@ +import { Meta, StoryObj } from '@storybook/web-components'; +import { html } from 'lit-html'; +import './empty-state.element'; +import type { UmbEmptyStateElement } from './empty-state.element'; + +const meta: Meta = { + title: 'Components/Empty State', + component: 'umb-empty-state', + render: (args) => html` + There are no items to be found`, +}; + +export default meta; +type Story = StoryObj; + +export const Overview: Story = { + args: { + size: 'large', + } +}; + +export const Small: Story = { + args: { + size: 'small', + } +}; \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/header-app/header-app.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/header-app/header-app.stories.ts new file mode 100644 index 0000000000..581f8416eb --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/header-app/header-app.stories.ts @@ -0,0 +1,26 @@ +import { Meta, StoryObj } from '@storybook/web-components'; +import './header-app-button.element'; +import type { UmbHeaderAppButton } from './header-app-button.element'; + +const meta: Meta = { + title: 'Components/Header App Button', + component: 'umb-header-app-button' +}; + +export default meta; +type Story = StoryObj; + +export const Overview: Story = { + args: { + manifest: { + name: 'Some Manifest', + alias: 'someManifestAlias', + type: 'headerApp', + meta: { + label: 'Some Header', + icon: 'umb:home', + pathname: '/some/path' + } + } + } +}; \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/index.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/index.ts index bdc95016b6..e72f6bd7cf 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/index.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/index.ts @@ -21,7 +21,7 @@ import './input-language-picker/input-language-picker.element'; import './input-media-picker/input-media-picker.element'; import './input-multi-url-picker/input-multi-url-picker.element'; import './input-slider/input-slider.element'; -import './input-toggle/input-toggle-element'; +import './input-toggle/input-toggle.element'; import './property-type-based-property/property-type-based-property.element'; import './ref-property-editor-ui/ref-property-editor-ui.element'; import './section/section-main/section-main.element'; diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-checkbox-list/input-checkbox-list.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-checkbox-list/input-checkbox-list.stories.ts new file mode 100644 index 0000000000..d3ed1de046 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-checkbox-list/input-checkbox-list.stories.ts @@ -0,0 +1,28 @@ +import { Meta, StoryObj } from '@storybook/web-components'; +import './input-checkbox-list.element'; +import type { UmbInputCheckboxListElement } from './input-checkbox-list.element'; + +const meta: Meta = { + title: 'Components/Inputs/Checkbox List', + component: 'umb-input-checkbox-list' +}; + +export default meta; +type Story = StoryObj; + +export const Overview: Story = { + args: { + list: [ + { + key: "isAwesome", + value: "Umbraco is awesome?", + checked: true + }, + { + key: "attendingCodeGarden", + value: "Attending CodeGarden?", + checked: false + }, + ] + } +}; \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-color-picker/input-color-picker.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-color-picker/input-color-picker.element.ts index cc2c423039..3764f7ac75 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-color-picker/input-color-picker.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-color-picker/input-color-picker.element.ts @@ -6,6 +6,10 @@ import { UUIColorSwatchesEvent } from '@umbraco-ui/uui'; import { UmbLitElement } from '@umbraco-cms/element'; import type { SwatchDetails } from '@umbraco-cms/models'; +/* + * This wraps the UUI library uui-color-swatches component + * @element umb-input-color-picker +*/ @customElement('umb-input-color-picker') export class UmbInputColorPickerElement extends FormControlMixin(UmbLitElement) { static styles = [UUITextStyles]; diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-color-picker/input-color-picker.mdx b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-color-picker/input-color-picker.mdx new file mode 100644 index 0000000000..01bf535439 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-color-picker/input-color-picker.mdx @@ -0,0 +1,22 @@ +import { Meta, Title, Primary, Controls, Story, Source } from '@storybook/blocks'; +import * as ColorPickerStories from './input-color-picker.stories'; + + + + + +This color picker allows you to select a color from a palette. + +This shows how we can override the autogen docs from StoryBook to document a component how we want to exactly using [MDX doc blocks](https://storybook.js.org/docs/7.0/web-components/writing-docs/doc-blocks) + +## Stories +### Primary +<Story of={ColorPickerStories.Overview} /> +<Source of={ColorPickerStories.Overview} /> + +## Properties +<Controls of={ColorPickerStories.Overview} /> + +### Without Labels +<Story of={ColorPickerStories.WithoutLabels} /> +<Source of={ColorPickerStories.WithoutLabels} dark /> \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-color-picker/input-color-picker.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-color-picker/input-color-picker.stories.ts new file mode 100644 index 0000000000..daf4592007 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-color-picker/input-color-picker.stories.ts @@ -0,0 +1,62 @@ +import { Meta, StoryObj } from '@storybook/web-components'; +import './input-color-picker.element'; +import type { UmbInputColorPickerElement } from './input-color-picker.element'; + +const meta: Meta<UmbInputColorPickerElement> = { + title: 'Components/Inputs/Color Picker', + component: 'umb-input-color-picker' +}; + +export default meta; +type Story = StoryObj<UmbInputColorPickerElement>; + +export const Overview: Story = { + args: { + showLabels: true, + swatches: [ + { + label: "Red", + value: "#ff0000" + }, + { + label: "Green", + value: "#00ff00" + } + ] + } +}; + +export const WithoutLabels: Story = { + args: { + showLabels: false, + swatches: [ + { + label: "Red", + value: "#ff0000" + }, + { + label: "Green", + value: "#00ff00" + } + ] + } +}; + +// TODO: This doesn't check the correct swatch when the value is set +// Perhaps a BUG ? +export const WithValueLabels: Story = { + args: { + showLabels: true, + swatches: [ + { + label: "Red", + value: "#ff0000" + }, + { + label: "Green", + value: "#00ff00" + } + ], + value: "#00ff00" + } +}; \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-culture-select/input-culture-select.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-culture-select/input-culture-select.stories.ts new file mode 100644 index 0000000000..59084ad6fc --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-culture-select/input-culture-select.stories.ts @@ -0,0 +1,56 @@ +import { Meta, StoryObj } from '@storybook/web-components'; +import './input-culture-select.element'; +import type { UmbInputCultureSelectElement } from './input-culture-select.element'; + +const meta: Meta<UmbInputCultureSelectElement> = { + title: 'Components/Inputs/Culture Select', + component: 'umb-input-culture-select' +}; + +export default meta; +type Story = StoryObj<UmbInputCultureSelectElement>; + +export const Overview: Story = { + args: { + readonly: false, + disabled: false + } +}; + +export const ReadOnly: Story = { + args: { + readonly: true, + disabled: false + } +}; + +export const Disabled: Story = { + args: { + readonly: false, + disabled: true + } +}; + +export const WithValue: Story = { + args: { + readonly: false, + disabled: false, + value: 'da-DK' + } +}; + +export const WithValueAndDisabled: Story = { + args: { + readonly: false, + disabled: true, + value: 'en-US' + } +}; + +export const WithValueAndReadOnly: Story = { + args: { + readonly: true, + disabled: false, + value: 'en-GB' + } +}; \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-document-picker/input-document-picker.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-document-picker/input-document-picker.stories.ts new file mode 100644 index 0000000000..14ab53fa24 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-document-picker/input-document-picker.stories.ts @@ -0,0 +1,16 @@ +import { Meta, StoryObj } from '@storybook/web-components'; +import './input-document-picker.element'; +import type { UmbInputDocumentPickerElement } from './input-document-picker.element'; + +const meta: Meta<UmbInputDocumentPickerElement> = { + title: 'Components/Inputs/Document Picker', + component: 'umb-input-document-picker' +}; + +export default meta; +type Story = StoryObj<UmbInputDocumentPickerElement>; + +export const Overview: Story = { + args: { + } +}; diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-eye-dropper/input-eye-dropper.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-eye-dropper/input-eye-dropper.stories.ts new file mode 100644 index 0000000000..ab9d45aaff --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-eye-dropper/input-eye-dropper.stories.ts @@ -0,0 +1,29 @@ +import { Meta, StoryObj } from '@storybook/web-components'; +import './input-eye-dropper.element'; +import type { UmbInputEyeDropperElement } from './input-eye-dropper.element'; + +const meta: Meta<UmbInputEyeDropperElement> = { + title: 'Components/Inputs/Eye Dropper', + component: 'umb-input-eye-dropper' +}; + +export default meta; +type Story = StoryObj<UmbInputEyeDropperElement>; + +export const Overview: Story = { + args: { + + } +}; + +export const WithOpacity: Story = { + args: { + opacity: true, + } +}; + +export const WithSwatches: Story = { + args: { + swatches: ['#000000', '#ffffff', '#ff0000', '#00ff00', '#0000ff'] + } +}; diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-language-picker/input-language-picker.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-language-picker/input-language-picker.stories.ts new file mode 100644 index 0000000000..623c58db4a --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-language-picker/input-language-picker.stories.ts @@ -0,0 +1,17 @@ +import { Meta, StoryObj } from '@storybook/web-components'; +import './input-language-picker.element'; +import type { UmbInputLanguagePickerElement } from './input-language-picker.element'; + +const meta: Meta<UmbInputLanguagePickerElement> = { + title: 'Components/Inputs/Language Picker', + component: 'umb-input-language-picker' +}; + +export default meta; +type Story = StoryObj<UmbInputLanguagePickerElement>; + +export const Overview: Story = { + args: { + + } +}; diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-media-picker/input-media-picker.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-media-picker/input-media-picker.stories.ts new file mode 100644 index 0000000000..c760ca1f09 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-media-picker/input-media-picker.stories.ts @@ -0,0 +1,17 @@ +import { Meta, StoryObj } from '@storybook/web-components'; +import './input-media-picker.element'; +import type { UmbInputMediaPickerElement } from './input-media-picker.element'; + +const meta: Meta<UmbInputMediaPickerElement> = { + title: 'Components/Inputs/Media Picker', + component: 'umb-input-media-picker' +}; + +export default meta; +type Story = StoryObj<UmbInputMediaPickerElement>; + +export const Overview: Story = { + args: { + + } +}; \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-multi-url-picker/input-multi-url-picker.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-multi-url-picker/input-multi-url-picker.stories.ts new file mode 100644 index 0000000000..4e56a92845 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-multi-url-picker/input-multi-url-picker.stories.ts @@ -0,0 +1,17 @@ +import { Meta, StoryObj } from '@storybook/web-components'; +import './input-multi-url-picker.element'; +import type { UmbInputMultiUrlPickerElement } from './input-multi-url-picker.element'; + +const meta: Meta<UmbInputMultiUrlPickerElement> = { + title: 'Components/Inputs/Multi URL Picker', + component: 'umb-input-multi-url-picker' +}; + +export default meta; +type Story = StoryObj<UmbInputMultiUrlPickerElement>; + +export const Overview: Story = { + args: { + + } +}; diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-number-range/input-number-range.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-number-range/input-number-range.stories.ts new file mode 100644 index 0000000000..f8a473cd6a --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-number-range/input-number-range.stories.ts @@ -0,0 +1,23 @@ +import { Meta, StoryObj } from '@storybook/web-components'; +import './input-number-range.element'; +import type { UmbInputNumberRangeElement } from './input-number-range.element'; + +const meta: Meta<UmbInputNumberRangeElement> = { + title: 'Components/Inputs/Number Range Picker', + component: 'umb-input-number-range' +}; + +export default meta; +type Story = StoryObj<UmbInputNumberRangeElement>; + +export const Overview: Story = { + args: { + } +}; + +export const WithMinMax: Story = { + args: { + minValue:0, + maxValue:40, + } +}; diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-radio-button-list/input-radio-button-list.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-radio-button-list/input-radio-button-list.stories.ts new file mode 100644 index 0000000000..17ca8ddd83 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-radio-button-list/input-radio-button-list.stories.ts @@ -0,0 +1,79 @@ +import { Meta, StoryObj } from '@storybook/web-components'; +import './input-radio-button-list.element'; +import type { UmbInputRadioButtonListElement } from './input-radio-button-list.element'; + +const meta: Meta<UmbInputRadioButtonListElement> = { + title: 'Components/Inputs/Radio Button List', + component: 'umb-input-radio-button-list' +}; + +export default meta; +type Story = StoryObj<UmbInputRadioButtonListElement>; + +export const Overview: Story = { + args: { + list: [ + { + key: '1', + sortOrder: 0, + value: 'One' + }, + { + key: '2', + sortOrder: 1, + value: 'Two' + }, + { + key: '3', + sortOrder: 2, + value: 'Three' + } + ] + } +}; + +export const WithSelectedValue: Story = { + args: { + list: [ + { + key: '1', + sortOrder: 0, + value: 'One' + }, + { + key: '2', + sortOrder: 1, + value: 'Two' + }, + { + key: '3', + sortOrder: 2, + value: 'Three' + } + ], + selected: '2', + value: 'Two' + } +}; + +export const SortOrder: Story = { + args: { + list: [ + { + key: '1', + sortOrder: 4, + value: 'One' + }, + { + key: '2', + sortOrder: 1, + value: 'Two' + }, + { + key: '3', + sortOrder: 2, + value: 'Three' + } + ] + } +}; diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-section/input-section.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-section/input-section.stories.ts new file mode 100644 index 0000000000..5144d7e765 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-section/input-section.stories.ts @@ -0,0 +1,44 @@ +import { Meta, StoryObj } from '@storybook/web-components'; +import './input-section.element'; +import type { UmbInputPickerSectionElement } from './input-section.element'; + +const meta: Meta<UmbInputPickerSectionElement> = { + title: 'Components/Inputs/Section', + component: 'umb-input-section', + argTypes: { + modalType: { + control: 'inline-radio', + options: ['dialog', 'sidebar'], + defaultValue: 'sidebar', + description: 'The type of modal to use when selecting sections', + }, + modalSize:{ + control: 'select', + options: ['small', 'medium', 'large', 'full'], + defaultValue: 'small', + description: 'The size of the modal to use when selecting sections, only applicable to sidebar not dialog', + } + } +}; + +export default meta; +type Story = StoryObj<UmbInputPickerSectionElement>; + +export const Overview: Story = { + args: { + modalType: 'sidebar', + } +}; + +export const WithDialog: Story = { + args: { + modalType: 'dialog' + } +}; + +export const WithFullSidebar: Story = { + args: { + modalType: 'sidebar', + modalSize: 'full' + } +}; \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-slider/input-slider.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-slider/input-slider.stories.ts new file mode 100644 index 0000000000..01e52a100c --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-slider/input-slider.stories.ts @@ -0,0 +1,50 @@ +import { Meta, StoryObj } from '@storybook/web-components'; +import './input-slider.element'; +import type { UmbInputSliderElement } from './input-slider.element'; + +const meta: Meta<UmbInputSliderElement> = { + title: 'Components/Inputs/Slider', + component: 'umb-input-slider', + +}; + +export default meta; +type Story = StoryObj<UmbInputSliderElement>; + +export const Overview: Story = { + args: { + min: 0, + max: 100, + step: 10, + initVal1: 20 + } +}; + +export const WithRange: Story = { + args: { + min: 0, + max: 100, + step: 10, + initVal1: 20, + initVal2: 80, + enableRange: true + } +}; + +export const WithSmallStep: Story = { + args: { + min: 0, + max: 5, + step: 1, + initVal1: 4, + } +}; + +export const WithLargeMinMax: Story = { + args: { + min: 0, + max: 100, + step: 1, + initVal1: 86 + } +}; diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-toggle/input-toggle-element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-toggle/input-toggle.element.ts similarity index 100% rename from src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-toggle/input-toggle-element.ts rename to src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-toggle/input-toggle.element.ts diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-toggle/input-toggle.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-toggle/input-toggle.stories.ts new file mode 100644 index 0000000000..fe52faabaf --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-toggle/input-toggle.stories.ts @@ -0,0 +1,37 @@ +import { Meta, StoryObj } from '@storybook/web-components'; +import './input-toggle.element'; +import type { UmbInputToggleElement } from './input-toggle.element'; + +const meta: Meta<UmbInputToggleElement> = { + title: 'Components/Inputs/Toggle', + component: 'umb-input-toggle', + +}; + +export default meta; +type Story = StoryObj<UmbInputToggleElement>; + +export const Overview: Story = { + args: { + checked: true, + showLabels: true, + labelOn: 'On', + labelOff: 'Off' + } +}; + +export const WithDifferentLabels: Story = { + args: { + checked: false, + showLabels: true, + labelOn: 'Hide the treasure', + labelOff: 'Show the way to the treasure' + } +}; + +export const WithNoLabels: Story = { + args: { + checked: true, + showLabels: false, + } +}; diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-user-group/input-user-group.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-user-group/input-user-group.stories.ts new file mode 100644 index 0000000000..9cacc00a54 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-user-group/input-user-group.stories.ts @@ -0,0 +1,30 @@ +import { Meta, StoryObj } from '@storybook/web-components'; +import './input-user-group.element'; +import type { UmbInputPickerUserGroupElement } from './input-user-group.element'; + +const meta: Meta<UmbInputPickerUserGroupElement> = { + title: 'Components/Inputs/User Group', + component: 'umb-input-user-group', + argTypes: { + modalType: { + control: 'inline-radio', + options: ['dialog', 'sidebar'], + defaultValue: 'sidebar', + description: 'The type of modal to use when selecting user groups', + }, + modalSize:{ + control: 'select', + options: ['small', 'medium', 'large', 'full'], + defaultValue: 'small', + description: 'The size of the modal to use when selecting user groups, only applicable to sidebar not dialog', + } + } +}; + +export default meta; +type Story = StoryObj<UmbInputPickerUserGroupElement>; + +export const Overview: Story = { + args: { + } +}; \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-user/input-user.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-user/input-user.stories.ts new file mode 100644 index 0000000000..e1f907ddd1 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/input-user/input-user.stories.ts @@ -0,0 +1,30 @@ +import { Meta, StoryObj } from '@storybook/web-components'; +import './input-user.element'; +import type { UmbPickerUserElement } from './input-user.element'; + +const meta: Meta<UmbPickerUserElement> = { + title: 'Components/Inputs/User', + component: 'umb-input-user', + argTypes: { + modalType: { + control: 'inline-radio', + options: ['dialog', 'sidebar'], + defaultValue: 'sidebar', + description: 'The type of modal to use when selecting users', + }, + modalSize:{ + control: 'select', + options: ['small', 'medium', 'large', 'full'], + defaultValue: 'small', + description: 'The size of the modal to use when selecting users, only applicable to sidebar not dialog', + } + } +}; + +export default meta; +type Story = StoryObj<UmbPickerUserElement>; + +export const Overview: Story = { + args: { + } +}; \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/ref-property-editor-ui/ref-property-editor-ui.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/ref-property-editor-ui/ref-property-editor-ui.stories.ts index d622e7321d..34d8e5365b 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/ref-property-editor-ui/ref-property-editor-ui.stories.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/ref-property-editor-ui/ref-property-editor-ui.stories.ts @@ -1,19 +1,55 @@ -import './ref-property-editor-ui.element'; - -import { Meta, Story } from '@storybook/web-components'; +import { Meta, StoryObj } from '@storybook/web-components'; import { html } from 'lit-html'; - +import './ref-property-editor-ui.element'; import type { UmbRefPropertyEditorUIElement } from './ref-property-editor-ui.element'; -export default { - title: 'Components/Ref Property Editor UI', - component: 'umb-ref-property-editor-ui', - id: 'umb-ref-property-editor-ui', -} as Meta; +const meta: Meta<UmbRefPropertyEditorUIElement> = { + title: 'Components/Ref Property Editor UI', + component: 'umb-ref-property-editor-ui', +}; + +export default meta; +type Story = StoryObj<UmbRefPropertyEditorUIElement>; + +export const Overview: Story = { + args: { + name: "Custom Property Editor UI", + alias: "Umb.PropertyEditorUI.CustomUI", + propertyEditorAlias: "Umbraco.JSON" + } +}; -export const AAAOverview: Story<UmbRefPropertyEditorUIElement> = () => - html` <umb-ref-property-editor-ui - name="Custom Property Editor UI" - alias="Umb.PropertyEditorUI.CustomUI" - property-editor-model-alias="Umbraco.JSON"></umb-ref-property-editor-ui>`; -AAAOverview.storyName = 'Overview'; + +export const WithDetail: Story = { + args: { + name: "Custom Property Editor UI", + alias: "Umb.PropertyEditorUI.CustomUI", + propertyEditorAlias: "Umbraco.JSON", + detail: "With some custom details" + } +}; + +export const WithSlots: Story = { + args: { + name: "Custom Property Editor UI", + alias: "Umb.PropertyEditorUI.CustomUI", + propertyEditorAlias: "Umbraco.JSON", + detail: "With some custom details" + }, + render: (args) => html` + <umb-ref-property-editor-ui + .name=${args.name} + .alias=${args.alias} + .propertyEditorAlias=${args.propertyEditorAlias} + .detail=${args.detail}> + <div slot="tag"><uui-tag color="positive">10</uui-tag></div> + <div slot="actions"> + <uui-action-bar> + <uui-button label="delete" look="primary" color="danger" compact> + <uui-icon name="umb:delete"></uui-icon> + </uui-button> + </uui-action-bar> + </div> + </umb-ref-property-editor-ui> + ` +}; \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/table/table.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/table/table.stories.ts index b26be13e10..d7ac93c25a 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/table/table.stories.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/table/table.stories.ts @@ -1,16 +1,17 @@ -import { Meta, Story } from '@storybook/web-components'; -import { html } from 'lit-html'; -import { v4 as uuidv4 } from 'uuid'; - -import type { UmbTableElement, UmbTableColumn, UmbTableConfig, UmbTableItem } from './table.element'; - +import { Meta, StoryObj } from '@storybook/web-components'; import './table.element'; +import { v4 as uuidv4 } from 'uuid'; +import type { UmbTableElement, UmbTableColumn, UmbTableConfig, UmbTableItem } from './table.element' -export default { - title: 'Components/Table', - component: 'umb-table', - id: 'umb-table', -} as Meta; +const meta: Meta<UmbTableElement> = { + title: 'Components/Table', + component: 'umb-table', +}; + +export default meta; +type Story = StoryObj<UmbTableElement>; + +const today = new Intl.DateTimeFormat('en-US').format(new Date()); const columns: Array<UmbTableColumn> = [ { @@ -23,8 +24,6 @@ const columns: Array<UmbTableColumn> = [ }, ]; -const today = new Intl.DateTimeFormat('en-US').format(new Date()); - const items: Array<UmbTableItem> = [ { key: uuidv4(), @@ -70,11 +69,36 @@ const items: Array<UmbTableItem> = [ }, ]; -const config: UmbTableConfig = { - allowSelection: true, - hideIcon: false, +export const Overview: Story = { + args: { + items: items, + columns: columns, + config: { + allowSelection: true, + hideIcon: false, + } + } }; -export const AAAOverview: Story<UmbTableElement> = () => - html`<umb-table .items=${items} .columns=${columns} .config=${config}></umb-table>`; -AAAOverview.storyName = 'Overview'; + +export const WithDisallowedSelections: Story = { + args: { + items: items, + columns: columns, + config: { + allowSelection: false, + hideIcon: false, + } + } +}; + +export const WithHiddenIcons: Story = { + args: { + items: items, + columns: columns, + config: { + allowSelection: true, + hideIcon: true, + } + } +}; \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/tooltip-menu/tooltip-menu.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/tooltip-menu/tooltip-menu.stories.ts new file mode 100644 index 0000000000..1d963f4047 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/tooltip-menu/tooltip-menu.stories.ts @@ -0,0 +1,39 @@ +import { Meta, StoryObj } from '@storybook/web-components'; +import './tooltip-menu.element'; +import type { UmbTooltipMenuElement, TooltipMenuItem } from './tooltip-menu.element' + +const meta: Meta<UmbTooltipMenuElement> = { + title: 'Components/Tooltip Menu', + component: 'umb-tooltip-menu', +}; + +export default meta; +type Story = StoryObj<UmbTooltipMenuElement>; + +const items: Array<TooltipMenuItem> = [ + { + label: 'Item 1', + icon: 'umb:document', + action: () => alert('Item 1 clicked'), + }, + { + label: 'Item 2', + icon: 'umb:home', + action: () => alert('Item 2 clicked') + } +]; + +export const Overview: Story = { + args: { + items: items, + iconOnly: false, + } +}; + +export const WithIconsOnly: Story = { + args: { + items: items, + iconOnly: true, + } +}; + diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/tree/tree-item.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/tree/tree-item.stories.ts new file mode 100644 index 0000000000..5b59cbde3b --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/tree/tree-item.stories.ts @@ -0,0 +1,27 @@ +import { Meta, StoryObj } from '@storybook/web-components'; +import './tree-item.element'; +import type { UmbTreeItem } from './tree-item.element' + +const meta: Meta<UmbTreeItem> = { + title: 'Components/Tree/Tree Item', + component: 'umb-tree-item', +}; + +export default meta; +type Story = StoryObj<UmbTreeItem>; + +export const Overview: Story = { + args: { + label: 'My Tree Item', + icon: 'umb:home', + hasChildren: false, + } +}; + +export const WithChildren: Story = { + args: { + label: 'My Tree Item', + icon: 'umb:home', + hasChildren: true, + } +}; \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/tree/tree.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/tree/tree.stories.ts new file mode 100644 index 0000000000..9b3c0aa66c --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/tree/tree.stories.ts @@ -0,0 +1,19 @@ +import { Meta, StoryObj } from '@storybook/web-components'; +import './tree.element'; +import type { UmbTreeElement } from './tree.element'; + +const meta: Meta<UmbTreeElement> = { + title: 'Components/Tree/Tree', + component: 'umb-tree', +}; + +export default meta; +type Story = StoryObj<UmbTreeElement>; + +// TODO: This does not display anything - need help +export const Overview: Story = { + args: { + alias: 'Umb.Tree.Documents', + selectable: true, + }, +}; diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/variant-selector/variant-selector.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/variant-selector/variant-selector.stories.ts new file mode 100644 index 0000000000..c5f645add3 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/variant-selector/variant-selector.stories.ts @@ -0,0 +1,17 @@ +import { Meta, StoryObj } from '@storybook/web-components'; +import './variant-selector.element'; +import type { UmbVariantSelectorElement } from './variant-selector.element' + +const meta: Meta<UmbVariantSelectorElement> = { + title: 'Components/Variant Selector', + component: 'umb-variant-selector', +}; + +export default meta; +type Story = StoryObj<UmbVariantSelectorElement>; + +export const Overview: Story = { + args: { + alias: 'myAlias' + } +}; \ No newline at end of file diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/variantable-property/variantable-property.stories.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/variantable-property/variantable-property.stories.ts new file mode 100644 index 0000000000..abcf01e0e0 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/components/variantable-property/variantable-property.stories.ts @@ -0,0 +1,32 @@ +import { Meta, StoryObj } from '@storybook/web-components'; +import './variantable-property.element'; +import type { UmbVariantablePropertyElement } from './variantable-property.element' + +const meta: Meta<UmbVariantablePropertyElement> = { + title: 'Components/Variantable Property', + component: 'umb-variantable-property', +}; + +export default meta; +type Story = StoryObj<UmbVariantablePropertyElement>; + +export const Overview: Story = { + args: { + property: { + name: 'Header', + alias: 'headerAlias', + appearance: { + labelOnTop: false + }, + description: 'This is a description', + variesByCulture: true, + variesBySegment: true, + validation: { + mandatory: true, + mandatoryMessage: 'This is a mandatory message', + } + }, + + } +}; + diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/index.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/index.ts index 15b18b337d..093ecba10c 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/index.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/index.ts @@ -8,13 +8,15 @@ import { manifests as collectionViewManifests } from './collection/views/manifes import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api'; import { ManifestTypes } from '@umbraco-cms/extensions-registry'; -const registerExtensions = (manifests: Array<ManifestTypes>) => { - manifests.forEach((manifest) => umbExtensionsRegistry.register(manifest)); -}; - -registerExtensions([ +export const manifests = [ ...propertyActionManifests, ...propertyEditorModelManifests, ...propertyEditorUIManifests, ...collectionViewManifests, -]); +]; + +const registerExtensions = (manifests: Array<ManifestTypes>) => { + manifests.forEach((manifest) => umbExtensionsRegistry.register(manifest)); +}; + +registerExtensions(manifests); diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/toggle/property-editor-ui-toggle.element.ts b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/toggle/property-editor-ui-toggle.element.ts index eded572828..1e411f549a 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/toggle/property-editor-ui-toggle.element.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/shared/property-editors/uis/toggle/property-editor-ui-toggle.element.ts @@ -1,7 +1,7 @@ import { html } from 'lit'; import { UUITextStyles } from '@umbraco-ui/uui-css/lib'; import { customElement, property, state } from 'lit/decorators.js'; -import { UmbInputToggleElement } from '../../../components/input-toggle/input-toggle-element'; +import { UmbInputToggleElement } from '../../../components/input-toggle/input-toggle.element'; import { UmbLitElement } from '@umbraco-cms/element'; import { DataTypePropertyModel } from '@umbraco-cms/backend-api'; diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/templating/index.ts b/src/Umbraco.Web.UI.Client/src/backoffice/templating/index.ts index 86ae3c10c9..a869c8a5fb 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/templating/index.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/templating/index.ts @@ -3,8 +3,10 @@ import { manifests as templateManifests } from './templates/manifests'; import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api'; import { ManifestTypes } from '@umbraco-cms/extensions-registry'; +export const manifests = [...menuManifests, ...templateManifests]; + const registerExtensions = (manifests: Array<ManifestTypes>) => { manifests.forEach((manifest) => umbExtensionsRegistry.register(manifest)); }; -registerExtensions([...menuManifests, ...templateManifests]); +registerExtensions(manifests); diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/translation/index.ts b/src/Umbraco.Web.UI.Client/src/backoffice/translation/index.ts index 223cf9d2c1..7712683eb5 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/translation/index.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/translation/index.ts @@ -3,8 +3,10 @@ import { manifests as dictionaryManifests } from './dictionary/manifests'; import type { ManifestTypes } from '@umbraco-cms/models'; import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api'; +export const manifests = [...translationSectionManifests, ...dictionaryManifests]; + const registerExtensions = (manifests: Array<ManifestTypes>) => { manifests.forEach((manifest) => umbExtensionsRegistry.register(manifest)); }; -registerExtensions([...translationSectionManifests, ...dictionaryManifests]); +registerExtensions(manifests); diff --git a/src/Umbraco.Web.UI.Client/src/backoffice/users/index.ts b/src/Umbraco.Web.UI.Client/src/backoffice/users/index.ts index 7c8945b94f..03d81407b4 100644 --- a/src/Umbraco.Web.UI.Client/src/backoffice/users/index.ts +++ b/src/Umbraco.Web.UI.Client/src/backoffice/users/index.ts @@ -6,8 +6,10 @@ import { manifests as currentUserManifests } from './current-user/manifests'; import { umbExtensionsRegistry } from '@umbraco-cms/extensions-api'; import { ManifestTypes } from '@umbraco-cms/extensions-registry'; +export const manifests = [...userGroupManifests, ...userManifests, ...userSectionManifests, ...currentUserManifests]; + const registerExtensions = (manifests: Array<ManifestTypes>) => { manifests.forEach((manifest) => umbExtensionsRegistry.register(manifest)); }; -registerExtensions([...userGroupManifests, ...userManifests, ...userSectionManifests, ...currentUserManifests]); +registerExtensions(manifests); diff --git a/src/Umbraco.Web.UI.Client/src/core/modal/stories/modal.mdx b/src/Umbraco.Web.UI.Client/src/core/modal/stories/modal.mdx index 1c2293c49c..fa40855dc5 100644 --- a/src/Umbraco.Web.UI.Client/src/core/modal/stories/modal.mdx +++ b/src/Umbraco.Web.UI.Client/src/core/modal/stories/modal.mdx @@ -1,6 +1,6 @@ -import { Meta } from '@storybook/addon-docs'; +import { Meta } from '@storybook/blocks'; -<Meta title="API/Modals/Intro" parameters={{ previewTabs: { canvas: { hidden: true } } }} /> +<Meta title="API/Modals/Intro" /> # Modals