From b90ca280231a49e1b9df3f9901467425322f43ac Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Tue, 21 Mar 2023 15:57:11 +0100 Subject: [PATCH 01/28] add gpr workflow --- .../workflows/npm-publish-github-packages.yml | 60 +++++++++++++++++++ 1 file changed, 60 insertions(+) create mode 100644 src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml diff --git a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml new file mode 100644 index 0000000000..e2d952a8bf --- /dev/null +++ b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml @@ -0,0 +1,60 @@ +# This workflow will run tests using node and then publish a package to GitHub Packages when a release is created +# For more information see: https://docs.github.com/en/actions/publishing-packages/publishing-nodejs-packages + +name: Node.js Libraries Package + +on: + push: + branches: [ main ] + paths: + - 'libs/**' + - 'package.json' + - 'package-lock.json' + - '.github/workflows/npm-publish-github-packages.yml' + - './rollup-libs.config.js' + pull_request: + branches: [ main ] + paths: + - 'libs/**' + - 'package.json' + - 'package-lock.json' + - '.github/workflows/npm-publish-github-packages.yml' + - './rollup-libs.config.js' + +jobs: + build: + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v3 + - uses: actions/setup-node@v3 + with: + node-version: 18 + cache: 'npm' + - run: npm ci + - run: npm run build:libs + - uses: actions/upload-artifact@v3 + with: + name: artifact + path: ./dist/libs + + publish-gpr: + if: github.event_name == 'push' && github.ref == 'refs/heads/main' + needs: build + runs-on: ubuntu-latest + permissions: + contents: read + packages: write + steps: + - uses: actions/download-artifact@v2 + with: + name: artifact + - uses: actions/setup-node@v3 + with: + node-version: 18 + registry-url: https://npm.pkg.github.com/ + - run: | + SHA_SHORT=$(echo $GITHUB_SHA | cut -c1-8) + npm version 13.0.0-alpha.$SHA_SHORT --allow-same-version --no-git-tag-version + - run: npm publish + env: + NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}} From df9ac3ef36acd226b9d24c679902f64b480a30c9 Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Tue, 21 Mar 2023 16:01:34 +0100 Subject: [PATCH 02/28] allow workflow_dispatch --- .../.github/workflows/npm-publish-github-packages.yml | 1 + 1 file changed, 1 insertion(+) diff --git a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml index e2d952a8bf..9523db73ac 100644 --- a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml +++ b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml @@ -20,6 +20,7 @@ on: - 'package-lock.json' - '.github/workflows/npm-publish-github-packages.yml' - './rollup-libs.config.js' + workflow_dispatch: jobs: build: From 838a3ba877c8d0aca5df2bd762a3612ac3545249 Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Tue, 21 Mar 2023 16:02:13 +0100 Subject: [PATCH 03/28] try and set NODE_OPTIONS with more memory --- .../.github/workflows/npm-publish-github-packages.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml index 9523db73ac..8e9fbf39ed 100644 --- a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml +++ b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml @@ -32,7 +32,7 @@ jobs: node-version: 18 cache: 'npm' - run: npm ci - - run: npm run build:libs + - run: NODE_OPTIONS=--max-old-space-size=4096 npm run build:libs - uses: actions/upload-artifact@v3 with: name: artifact From e7161170f5b42544e6a723ba44f0dfa5d1efd2fc Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Tue, 21 Mar 2023 16:05:44 +0100 Subject: [PATCH 04/28] set NODE_OPTIONS for all tasks --- .../.github/workflows/npm-publish-github-packages.yml | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml index 8e9fbf39ed..d9ea2471cd 100644 --- a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml +++ b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml @@ -31,8 +31,9 @@ jobs: with: node-version: 18 cache: 'npm' + - run: NODE_OPTIONS=--max-old-space-size=4096 - run: npm ci - - run: NODE_OPTIONS=--max-old-space-size=4096 npm run build:libs + - run: npm run build:libs - uses: actions/upload-artifact@v3 with: name: artifact From c295874ccfc315512445dc9247cb792006922522 Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Tue, 21 Mar 2023 16:06:01 +0100 Subject: [PATCH 05/28] remove the if condition to test publish --- .../.github/workflows/npm-publish-github-packages.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml index d9ea2471cd..1d6fc550a8 100644 --- a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml +++ b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml @@ -40,7 +40,7 @@ jobs: path: ./dist/libs publish-gpr: - if: github.event_name == 'push' && github.ref == 'refs/heads/main' + # if: github.event_name == 'push' && github.ref == 'refs/heads/main' needs: build runs-on: ubuntu-latest permissions: From 7c308fdad9c4dcd7686e209583d9e5f6a683cdc3 Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Tue, 21 Mar 2023 16:08:27 +0100 Subject: [PATCH 06/28] set max-old-space-size --- .../.github/workflows/npm-publish-github-packages.yml | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml index 1d6fc550a8..140b6c92c7 100644 --- a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml +++ b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml @@ -31,9 +31,8 @@ jobs: with: node-version: 18 cache: 'npm' - - run: NODE_OPTIONS=--max-old-space-size=4096 - run: npm ci - - run: npm run build:libs + - run: NODE_OPTIONS=--max-old-space-size=4096 npm run build:libs - uses: actions/upload-artifact@v3 with: name: artifact From b48c2c3385c78b5fa4ed49f818b2d5d3a6b45241 Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Tue, 21 Mar 2023 16:13:07 +0100 Subject: [PATCH 07/28] set global node_options --- .../.github/workflows/npm-publish-github-packages.yml | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml index 140b6c92c7..f5ec3153d0 100644 --- a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml +++ b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml @@ -22,6 +22,9 @@ on: - './rollup-libs.config.js' workflow_dispatch: +env: + NODE_OPTIONS: --max-old-space-size=16384 + jobs: build: runs-on: ubuntu-latest @@ -32,7 +35,7 @@ jobs: node-version: 18 cache: 'npm' - run: npm ci - - run: NODE_OPTIONS=--max-old-space-size=4096 npm run build:libs + - run: npm run build:libs - uses: actions/upload-artifact@v3 with: name: artifact From fd0f3f0704be3d36feefb8cd28c9cb3f7a344f49 Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Tue, 21 Mar 2023 16:18:55 +0100 Subject: [PATCH 08/28] login and tag gpr --- .../.github/workflows/npm-publish-github-packages.yml | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml index f5ec3153d0..b90be17da6 100644 --- a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml +++ b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml @@ -58,7 +58,8 @@ jobs: registry-url: https://npm.pkg.github.com/ - run: | SHA_SHORT=$(echo $GITHUB_SHA | cut -c1-8) - npm version 13.0.0-alpha.$SHA_SHORT --allow-same-version --no-git-tag-version - - run: npm publish + npm version 13.0.0-next.$SHA_SHORT --allow-same-version --no-git-tag-version + - run: npm login --registry=https://npm.pkg.github.com/ --scope=@umbraco-cms + - run: npm publish --tag next env: NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}} From 75f9f14ea355535455a36773fade13d9c5e67cf8 Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Tue, 21 Mar 2023 16:25:20 +0100 Subject: [PATCH 09/28] auth type legacy --- .../.github/workflows/npm-publish-github-packages.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml index b90be17da6..320f08929f 100644 --- a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml +++ b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml @@ -59,7 +59,7 @@ jobs: - run: | SHA_SHORT=$(echo $GITHUB_SHA | cut -c1-8) npm version 13.0.0-next.$SHA_SHORT --allow-same-version --no-git-tag-version - - run: npm login --registry=https://npm.pkg.github.com/ --scope=@umbraco-cms + - run: npm login --scope=@umbraco-cms --auth-type=legacy --registry=https://npm.pkg.github.com/ - run: npm publish --tag next env: NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}} From 1f58d4504b8e14a6527a268816b7114382b72860 Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Tue, 21 Mar 2023 16:33:29 +0100 Subject: [PATCH 10/28] create .npmrc file automatically --- .../.github/workflows/npm-publish-github-packages.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml index 320f08929f..8ef9df9b38 100644 --- a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml +++ b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml @@ -56,10 +56,10 @@ jobs: with: node-version: 18 registry-url: https://npm.pkg.github.com/ + scope: '@umbraco-cms' - run: | SHA_SHORT=$(echo $GITHUB_SHA | cut -c1-8) npm version 13.0.0-next.$SHA_SHORT --allow-same-version --no-git-tag-version - - run: npm login --scope=@umbraco-cms --auth-type=legacy --registry=https://npm.pkg.github.com/ - run: npm publish --tag next env: NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}} From dcfbee0388c0733865353128d90a71200e0ee6f1 Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Wed, 22 Mar 2023 08:52:12 +0100 Subject: [PATCH 11/28] publish to npm --- .../.github/workflows/npm-publish-github-packages.yml | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml index 8ef9df9b38..1e322701b4 100644 --- a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml +++ b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml @@ -55,11 +55,12 @@ jobs: - uses: actions/setup-node@v3 with: node-version: 18 - registry-url: https://npm.pkg.github.com/ + registry-url: https://registry.npmjs.org/ scope: '@umbraco-cms' + always-auth: true - run: | SHA_SHORT=$(echo $GITHUB_SHA | cut -c1-8) npm version 13.0.0-next.$SHA_SHORT --allow-same-version --no-git-tag-version - run: npm publish --tag next env: - NODE_AUTH_TOKEN: ${{secrets.GITHUB_TOKEN}} + NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}} From f9cf3d4a5fc5716ed76b2d57b7961eae5db6e2b3 Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Wed, 22 Mar 2023 08:54:35 +0100 Subject: [PATCH 12/28] rename job to publish-npm --- .../.github/workflows/npm-publish-github-packages.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml index 1e322701b4..33aaab6653 100644 --- a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml +++ b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml @@ -41,7 +41,7 @@ jobs: name: artifact path: ./dist/libs - publish-gpr: + publish-npm: # if: github.event_name == 'push' && github.ref == 'refs/heads/main' needs: build runs-on: ubuntu-latest From b0771db7333548c8d297156bd21637c47d3642cb Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Wed, 22 Mar 2023 08:56:51 +0100 Subject: [PATCH 13/28] set access to public --- .../.github/workflows/npm-publish-github-packages.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml index 33aaab6653..ffdbc32edb 100644 --- a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml +++ b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml @@ -61,6 +61,6 @@ jobs: - run: | SHA_SHORT=$(echo $GITHUB_SHA | cut -c1-8) npm version 13.0.0-next.$SHA_SHORT --allow-same-version --no-git-tag-version - - run: npm publish --tag next + - run: npm publish --tag next --access public env: NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}} From c458796f819173c83b95e1a2644d2793e957c40c Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Wed, 22 Mar 2023 08:58:06 +0100 Subject: [PATCH 14/28] add concurrency rules --- .../.github/workflows/npm-publish-github-packages.yml | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml index ffdbc32edb..195253fc3a 100644 --- a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml +++ b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml @@ -45,6 +45,9 @@ jobs: # if: github.event_name == 'push' && github.ref == 'refs/heads/main' needs: build runs-on: ubuntu-latest + concurrency: + group: npm-publish + cancel-in-progress: true permissions: contents: read packages: write From 2db7ff555be3f91b00d333506b86716d78dde691 Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Wed, 22 Mar 2023 08:59:24 +0100 Subject: [PATCH 15/28] download artifact v3 --- .../.github/workflows/npm-publish-github-packages.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml index 195253fc3a..b4b3657ec1 100644 --- a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml +++ b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml @@ -52,7 +52,7 @@ jobs: contents: read packages: write steps: - - uses: actions/download-artifact@v2 + - uses: actions/download-artifact@v3 with: name: artifact - uses: actions/setup-node@v3 From e5f21ab21c08261ac76f61870c4cb99f59469245 Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Wed, 22 Mar 2023 10:01:07 +0100 Subject: [PATCH 16/28] add README --- src/Umbraco.Web.UI.Client/libs/README.md | 167 +++++++++++++++++++ src/Umbraco.Web.UI.Client/libs/package.json | 7 + src/Umbraco.Web.UI.Client/utils/move-libs.js | 11 +- 3 files changed, 181 insertions(+), 4 deletions(-) create mode 100644 src/Umbraco.Web.UI.Client/libs/README.md diff --git a/src/Umbraco.Web.UI.Client/libs/README.md b/src/Umbraco.Web.UI.Client/libs/README.md new file mode 100644 index 0000000000..00f200c8d7 --- /dev/null +++ b/src/Umbraco.Web.UI.Client/libs/README.md @@ -0,0 +1,167 @@ +# @umbraco-cms/backoffice + +This package contains the types for the libraries for Umbraco 13. + +## Installation + +```bash +npm install -D @umbraco-cms/backoffice +``` + +## Usage + +### Vanilla JavaScript + +Create an umbraco-package.json file in the root of your package. + +```json +{ + "name": "My.Package", + "version": "0.1.0", + "extensions": [ + { + "type": "dashboard", + "alias": "my.custom.dashboard", + "name": "My Dashboard", + "js": "/App_Plugins/MyPackage/dashboard.js", + "weight": -1, + "meta": { + "label": "My Dashboard", + "pathname": "my-dashboard" + }, + "conditions": { + "sections": ["Umb.Section.Content"] + } + } + ] +} +``` + +Then create a dashboard.js file the same folder. + +```javascript +import { UmbElementMixin } from '@umbraco-cms/backoffice/element'; +import { UMB_NOTIFICATION_CONTEXT_TOKEN } from '@umbraco-cms/backoffice/notification'; + +const template = document.createElement('template'); +template.innerHTML = ` + + + +

Welcome to my dashboard

+

Example of vanilla JS code

+ + + +`; + +export default class MyDashboardElement extends UmbElementMixin(HTMLElement) { + /** @type {import('@umbraco-cms/backoffice/notification').UmbNotificationContext} */ + #notificationContext; + + constructor() { + super(); + this.attachShadow({ mode: 'open' }); + this.shadowRoot.appendChild(template.content.cloneNode(true)); + + this.shadowRoot.getElementById('clickMe').addEventListener('click', this.onClick.bind(this)); + + this.consumeContext(UMB_NOTIFICATION_CONTEXT_TOKEN, (_instance) => { + this.#notificationContext = _instance; + }); + } + + onClick = () => { + this.#notificationContext?.peek('positive', { data: { headline: 'Hello' } }); + }; +} + +customElements.define('my-custom-dashboard', MyDashboardElement); +``` + +### TypeScript with Lit + +First install Lit and Vite. This command will create a new folder called "my-package". Choose "lit" and "typescript" when prompted. + +```bash +npm create vite@latest my-package +``` + +Go to the new folder and install the backoffice package. + +```bash +cd my-package +npm install -D @umbraco-cms/backoffice +``` + +Then go to the element located in `src/my-element.ts` and add the following code. + +```typescript +// src/my-element.ts +import { LitElement, html } from 'lit'; +import { customElement } from 'lit/decorators.js'; +import { UmbElementMixin } from '@umbraco-cms/backoffice/element'; +import { UmbNotificationContext, UMB_NOTIFICATION_CONTEXT_TOKEN } from '@umbraco-cms/backoffice/notification'; + +@customElement('my-element') +export default class MyElement extends UmbElementMixin(LitElement) { + #notificationContext?: UmbNotificationContext; + + constructor() { + super(); + this.consumeContext(UMB_NOTIFICATION_CONTEXT_TOKEN, (_instance) => { + this.#notificationContext = _instance; + }); + } + + onClick() { + this.#notificationContext?.peek('positive', { data: { message: '#h5yr' } }); + } + + render() { + return html` + +

TS dashboard

+ this.onClick()}> + + `; + } +} + +declare global { + interface HTMLElementTagNameMap { + 'my-element': MyElement; + } +} +``` + +Finally add an umbraco-package.json file in the root of your package. + +```json +{ + "name": "My.Package", + "version": "0.1.0", + "extensions": [ + { + "type": "dashboard", + "alias": "my.custom.dashboard", + "name": "My Dashboard", + "js": "/App_Plugins/MyPackage/dist/my-package.js", + "weight": -1, + "meta": { + "label": "My Dashboard", + "pathname": "my-dashboard" + }, + "conditions": { + "sections": ["Umb.Section.Content"] + } + } + ] +} +``` diff --git a/src/Umbraco.Web.UI.Client/libs/package.json b/src/Umbraco.Web.UI.Client/libs/package.json index 0064a56274..cc2b8932a7 100644 --- a/src/Umbraco.Web.UI.Client/libs/package.json +++ b/src/Umbraco.Web.UI.Client/libs/package.json @@ -2,6 +2,10 @@ "name": "@umbraco-cms/backoffice", "version": "13.0.0-alpha.0", "license": "MIT", + "keywords": [ + "umbraco", + "backoffice" + ], "repository": { "url": "https://github.com/umbraco/Umbraco.CMS.Backoffice", "type": "git" @@ -15,6 +19,9 @@ "url": "https://umbraco.com" }, "type": "module", + "files": [ + "*.d.ts" + ], "peerDependencies": { "@types/uuid": "^9.0.1", "@umbraco-ui/uui": "^1.2.0-rc.0", diff --git a/src/Umbraco.Web.UI.Client/utils/move-libs.js b/src/Umbraco.Web.UI.Client/utils/move-libs.js index 0d19cfea8b..95c64e855d 100644 --- a/src/Umbraco.Web.UI.Client/utils/move-libs.js +++ b/src/Umbraco.Web.UI.Client/utils/move-libs.js @@ -10,21 +10,24 @@ // Note: This script is not used in the build process, it is only used to transform the d.ts files // when the d.ts files are copied to the dist folder -import { readdirSync, readFileSync, writeFileSync, cpSync, mkdirSync, lstatSync } from 'fs'; +import { readdirSync, readFileSync, writeFileSync, cpSync, mkdirSync } from 'fs'; const srcDir = './libs'; const inputDir = './dist/libs'; const outputDir = '../Umbraco.Cms.StaticAssets/wwwroot/umbraco/backoffice/libs'; -// Copy package.json +// Copy package files cpSync(`${srcDir}/package.json`, `${inputDir}/package.json`, { recursive: true }); +cpSync(`${srcDir}/README.md`, `${inputDir}/README.md`, { recursive: true }); const libs = readdirSync(inputDir); // Create output folder try { - mkdirSync(outputDir, {recursive: true}); -} catch {} + mkdirSync(outputDir, { recursive: true }); +} catch { + // Ignore +} // Transform all .d.ts files and copy all other files to the output folder libs.forEach(lib => { From 60dbf19c9b8680879a4594221deab8a3de444ce8 Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Wed, 22 Mar 2023 10:01:44 +0100 Subject: [PATCH 17/28] publish v1-next --- .../.github/workflows/npm-publish-github-packages.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml index b4b3657ec1..4be3671097 100644 --- a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml +++ b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml @@ -63,7 +63,7 @@ jobs: always-auth: true - run: | SHA_SHORT=$(echo $GITHUB_SHA | cut -c1-8) - npm version 13.0.0-next.$SHA_SHORT --allow-same-version --no-git-tag-version + npm version 1.0.0-next.$SHA_SHORT --allow-same-version --no-git-tag-version - run: npm publish --tag next --access public env: NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}} From c0483a47c89ddd1288b750092750e2b16eb9f593 Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Wed, 22 Mar 2023 10:05:01 +0100 Subject: [PATCH 18/28] remove scope option --- .../.github/workflows/npm-publish-github-packages.yml | 1 - 1 file changed, 1 deletion(-) diff --git a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml index 4be3671097..f36304212b 100644 --- a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml +++ b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml @@ -59,7 +59,6 @@ jobs: with: node-version: 18 registry-url: https://registry.npmjs.org/ - scope: '@umbraco-cms' always-auth: true - run: | SHA_SHORT=$(echo $GITHUB_SHA | cut -c1-8) From e4e41466a0409d01dc94f0d184fca38305c40226 Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Wed, 22 Mar 2023 10:16:13 +0100 Subject: [PATCH 19/28] npm token --- .../.github/workflows/npm-publish-github-packages.yml | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml index f36304212b..dbd2f1bb49 100644 --- a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml +++ b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml @@ -48,9 +48,6 @@ jobs: concurrency: group: npm-publish cancel-in-progress: true - permissions: - contents: read - packages: write steps: - uses: actions/download-artifact@v3 with: @@ -65,4 +62,4 @@ jobs: npm version 1.0.0-next.$SHA_SHORT --allow-same-version --no-git-tag-version - run: npm publish --tag next --access public env: - NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}} + NPM_TOKEN: ${{secrets.NPM_TOKEN}} From 254a07e6c317002c55312d328b5490f1286e2014 Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Wed, 22 Mar 2023 10:41:27 +0100 Subject: [PATCH 20/28] authenticate --- .../workflows/npm-publish-github-packages.yml | 17 +++++++++++------ 1 file changed, 11 insertions(+), 6 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml index dbd2f1bb49..09842d5015 100644 --- a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml +++ b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml @@ -48,6 +48,8 @@ jobs: concurrency: group: npm-publish cancel-in-progress: true + env: + NPM_TOKEN: ${{secrets.NPM_TOKEN}} steps: - uses: actions/download-artifact@v3 with: @@ -55,11 +57,14 @@ jobs: - uses: actions/setup-node@v3 with: node-version: 18 - registry-url: https://registry.npmjs.org/ - always-auth: true - - run: | + - name: Authenticate with Registry + run: | + echo "@umbraco-cms:registry=https://registry.npmjs.org/" > .npmrc + echo "registry=https://registry.npmjs.org/" >> .npmrc + echo "//registry.npmjs.org/:_authToken=${NPM_TOKEN}" >> .npmrc + npm whoami + - name: Version and publish + run: | SHA_SHORT=$(echo $GITHUB_SHA | cut -c1-8) npm version 1.0.0-next.$SHA_SHORT --allow-same-version --no-git-tag-version - - run: npm publish --tag next --access public - env: - NPM_TOKEN: ${{secrets.NPM_TOKEN}} + npm publish --tag next --access public From 15dc08f74e53705f9245cd55e647fb70f03e1027 Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Wed, 22 Mar 2023 11:01:31 +0100 Subject: [PATCH 21/28] set token --- .../workflows/npm-publish-github-packages.yml | 15 +++++++-------- 1 file changed, 7 insertions(+), 8 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml index 09842d5015..b77010f818 100644 --- a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml +++ b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml @@ -48,8 +48,6 @@ jobs: concurrency: group: npm-publish cancel-in-progress: true - env: - NPM_TOKEN: ${{secrets.NPM_TOKEN}} steps: - uses: actions/download-artifact@v3 with: @@ -57,14 +55,15 @@ jobs: - uses: actions/setup-node@v3 with: node-version: 18 - - name: Authenticate with Registry - run: | - echo "@umbraco-cms:registry=https://registry.npmjs.org/" > .npmrc - echo "registry=https://registry.npmjs.org/" >> .npmrc - echo "//registry.npmjs.org/:_authToken=${NPM_TOKEN}" >> .npmrc - npm whoami + registry-url: https://registry.npmjs.org/ + scope: '@umbraco-cms' + env: + NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}} - name: Version and publish run: | SHA_SHORT=$(echo $GITHUB_SHA | cut -c1-8) + npm whoami npm version 1.0.0-next.$SHA_SHORT --allow-same-version --no-git-tag-version npm publish --tag next --access public + env: + NODE_AUTH_TOKEN: ${{secrets.NPM_TOKEN}} From 620a9b5b039475d9d2f5913403603d0f706fbcda Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Wed, 22 Mar 2023 11:07:56 +0100 Subject: [PATCH 22/28] comment --- .../.github/workflows/npm-publish-github-packages.yml | 1 + 1 file changed, 1 insertion(+) diff --git a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml index b77010f818..a44dba0303 100644 --- a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml +++ b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml @@ -1,5 +1,6 @@ # This workflow will run tests using node and then publish a package to GitHub Packages when a release is created # For more information see: https://docs.github.com/en/actions/publishing-packages/publishing-nodejs-packages +# The @umbraco-cms scope is owned by Umbraco HQ name: Node.js Libraries Package From a5a80cadb79629ee54911bf6ae662c4a360fc828 Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Wed, 22 Mar 2023 11:11:53 +0100 Subject: [PATCH 23/28] insert condition to publish --- .../.github/workflows/npm-publish-github-packages.yml | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml index a44dba0303..7a99f6fd45 100644 --- a/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml +++ b/src/Umbraco.Web.UI.Client/.github/workflows/npm-publish-github-packages.yml @@ -43,7 +43,7 @@ jobs: path: ./dist/libs publish-npm: - # if: github.event_name == 'push' && github.ref == 'refs/heads/main' + if: github.event_name == 'push' && github.ref == 'refs/heads/main' needs: build runs-on: ubuntu-latest concurrency: From f8e1b074ddd8635f2a5ca1950661b4ad7d22178f Mon Sep 17 00:00:00 2001 From: Warren Buckley Date: Thu, 23 Mar 2023 09:19:56 +0000 Subject: [PATCH 24/28] Update libs/README.md --- src/Umbraco.Web.UI.Client/libs/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Umbraco.Web.UI.Client/libs/README.md b/src/Umbraco.Web.UI.Client/libs/README.md index 00f200c8d7..300e31540f 100644 --- a/src/Umbraco.Web.UI.Client/libs/README.md +++ b/src/Umbraco.Web.UI.Client/libs/README.md @@ -100,7 +100,7 @@ cd my-package npm install -D @umbraco-cms/backoffice ``` -Then go to the element located in `src/my-element.ts` and add the following code. +Then go to the element located in `src/my-element.ts` and replace it with the following code. ```typescript // src/my-element.ts From 6a3a452239b7eacab03e40cbb931db72ded8e446 Mon Sep 17 00:00:00 2001 From: Jacob Overgaard <752371+iOvergaard@users.noreply.github.com> Date: Thu, 23 Mar 2023 10:32:41 +0100 Subject: [PATCH 25/28] Update libs/README.md Co-authored-by: Warren Buckley --- src/Umbraco.Web.UI.Client/libs/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Umbraco.Web.UI.Client/libs/README.md b/src/Umbraco.Web.UI.Client/libs/README.md index 300e31540f..4fb24534bc 100644 --- a/src/Umbraco.Web.UI.Client/libs/README.md +++ b/src/Umbraco.Web.UI.Client/libs/README.md @@ -90,7 +90,7 @@ customElements.define('my-custom-dashboard', MyDashboardElement); First install Lit and Vite. This command will create a new folder called "my-package". Choose "lit" and "typescript" when prompted. ```bash -npm create vite@latest my-package +npm create vite@latest -- --template lit-ts my-package ``` Go to the new folder and install the backoffice package. From 6cf65d8c4d28c0a77732218a062d3742a5a4764a Mon Sep 17 00:00:00 2001 From: Warren Buckley Date: Thu, 23 Mar 2023 09:41:22 +0000 Subject: [PATCH 26/28] Update libs/README.md --- src/Umbraco.Web.UI.Client/libs/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Umbraco.Web.UI.Client/libs/README.md b/src/Umbraco.Web.UI.Client/libs/README.md index 4fb24534bc..cb7494c968 100644 --- a/src/Umbraco.Web.UI.Client/libs/README.md +++ b/src/Umbraco.Web.UI.Client/libs/README.md @@ -87,7 +87,7 @@ customElements.define('my-custom-dashboard', MyDashboardElement); ### TypeScript with Lit -First install Lit and Vite. This command will create a new folder called "my-package". Choose "lit" and "typescript" when prompted. +First install Lit and Vite. This command will create a new folder called `my-package` which will have the Vite tooling and Lit for WebComponent development setup. ```bash npm create vite@latest -- --template lit-ts my-package From e1d41d1f58c4f1881ef3fb568e3d848a25641301 Mon Sep 17 00:00:00 2001 From: Warren Buckley Date: Thu, 23 Mar 2023 09:45:16 +0000 Subject: [PATCH 27/28] Update libs/README.md --- src/Umbraco.Web.UI.Client/libs/README.md | 9 +++++---- 1 file changed, 5 insertions(+), 4 deletions(-) diff --git a/src/Umbraco.Web.UI.Client/libs/README.md b/src/Umbraco.Web.UI.Client/libs/README.md index cb7494c968..2a6828f460 100644 --- a/src/Umbraco.Web.UI.Client/libs/README.md +++ b/src/Umbraco.Web.UI.Client/libs/README.md @@ -111,23 +111,24 @@ import { UmbNotificationContext, UMB_NOTIFICATION_CONTEXT_TOKEN } from '@umbraco @customElement('my-element') export default class MyElement extends UmbElementMixin(LitElement) { - #notificationContext?: UmbNotificationContext; + + private _notificationContext?: UmbNotificationContext; constructor() { super(); this.consumeContext(UMB_NOTIFICATION_CONTEXT_TOKEN, (_instance) => { - this.#notificationContext = _instance; + this._notificationContext = _instance; }); } onClick() { - this.#notificationContext?.peek('positive', { data: { message: '#h5yr' } }); + this._notificationContext?.peek('positive', { data: { message: '#h5yr' } }); } render() { return html` -

TS dashboard

+

A TypeScript Lit Dashboard

this.onClick()}> `; From c2f6e25d72c80bfccaf43bdfc9f883f75ce548bb Mon Sep 17 00:00:00 2001 From: Warren Buckley Date: Thu, 23 Mar 2023 09:46:23 +0000 Subject: [PATCH 28/28] Update libs/README.md --- src/Umbraco.Web.UI.Client/libs/README.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/Umbraco.Web.UI.Client/libs/README.md b/src/Umbraco.Web.UI.Client/libs/README.md index 2a6828f460..8796b8f582 100644 --- a/src/Umbraco.Web.UI.Client/libs/README.md +++ b/src/Umbraco.Web.UI.Client/libs/README.md @@ -142,7 +142,7 @@ declare global { } ``` -Finally add an umbraco-package.json file in the root of your package. +Finally add an umbraco-package.json file in the root of your package folder `my-package`. ```json {