From 58c1b70f300c74618b50074cd51a0c2feb22b1d1 Mon Sep 17 00:00:00 2001 From: "guillem.cordoba" Date: Tue, 1 Oct 2024 13:06:42 +0200 Subject: [PATCH] Docs working for icon-button element --- README.md | 8 +- docs/.vitepress/config.mts | 161 +- docs/elements/custom-elements.json | 765 ++++++ docs/elements/my-notifications-icon-button.md | 34 +- docs/notifications-store.md | 2 +- docs/package.json | 11 +- flake.lock | 63 +- package.json | 56 +- pnpm-lock.yaml | 2415 +++++++++-------- tests/package.json | 2 +- ui/custom-elements.json | 56 + ui/package.json | 4 +- .../elements/my-notifications-icon-button.ts | 13 +- ui/src/elements/my-notifications-list.ts | 16 +- ui/src/mocks.ts | 110 +- 15 files changed, 2413 insertions(+), 1303 deletions(-) create mode 100644 docs/elements/custom-elements.json diff --git a/README.md b/README.md index c07e5461..a4af5e6c 100644 --- a/README.md +++ b/README.md @@ -8,7 +8,7 @@ Enter the nix shell by running this in the root folder of the repository: ```bash nix develop -npm install +pnpm install ``` **Run all the other instructions in this README from inside this nix shell, otherwise they won't work**. @@ -16,16 +16,16 @@ npm install ## Running 2 agents ```bash -npm start +pnpm start ``` This will create a network of 2 nodes connected to each other and their respective UIs. It will also bring up the Holochain Playground for advanced introspection of the conductors. -## Running the backend tests +## Running the tests ```bash -npm test +pnpm test ``` ## Bootstrapping a network diff --git a/docs/.vitepress/config.mts b/docs/.vitepress/config.mts index 7f891cdf..bde58aa4 100644 --- a/docs/.vitepress/config.mts +++ b/docs/.vitepress/config.mts @@ -1,87 +1,86 @@ -import { withMermaid } from 'vitepress-plugin-mermaid'; import fs from 'fs'; +import { withMermaid } from 'vitepress-plugin-mermaid'; // https://vitepress.dev/reference/site-config // Uncomment this to enable mermaid inside your site when this is solved: https://github.com/mermaid-js/mermaid/issues/4320 // export default withMermaid({ -export default ({ - vue: { - template: { - compilerOptions: { - // treat all tags with a dash as custom elements - isCustomElement: (tag) => tag.includes("-"), - }, - }, - }, - vite: { - optimizeDeps: { - include: [ - 'mermaid' - ] - } - }, - base: "/notifications", - title: "@darksoil-studio/notifications", - description: "Notifications zome for holochain apps", - themeConfig: { - // https://vitepress.dev/reference/default-theme-config +export default { + vue: { + template: { + compilerOptions: { + // treat all tags with a dash as custom elements + isCustomElement: tag => tag.includes('-'), + }, + }, + }, + vite: { + optimizeDeps: { + include: ['mermaid'], + }, + }, + base: '/notifications', + title: '@darksoil-studio/notifications', + description: 'Notifications zome for holochain apps', + themeConfig: { + // https://vitepress.dev/reference/default-theme-config - sidebar: [ - { - text: "Setup", - link: "/setup.md", - }, - { - text: "API Reference", - items: [ - { - text: "Integrity Zome", - link: "/backend/doc/notifications_integrity/index.html", - target: "_blank", - }, - { - text: "Coordinator Zome", - link: "/backend/doc/notifications/index.html", - target: "_blank", - }, - { - text: "Frontend", - items: [ - { - text: "NotificationsStore", - link: "/notifications-store.md", - }, - { - text: "Elements", - items: fs.readdirSync("./elements").filter(file => file.endsWith('.md')).map(el => - ({ - text: el.split('.md')[0], - link: `/elements/${el}`, - }), - ), - }, - ], - }, - ], - }, - ], + sidebar: [ + { + text: 'Setup', + link: '/setup.md', + }, + { + text: 'API Reference', + items: [ + { + text: 'Integrity Zome', + link: '/backend/doc/notifications_integrity/index.html', + target: '_blank', + }, + { + text: 'Coordinator Zome', + link: '/backend/doc/notifications/index.html', + target: '_blank', + }, + { + text: 'Frontend', + items: [ + { + text: 'NotificationsStore', + link: '/notifications-store.md', + }, + { + text: 'Elements', + items: fs + .readdirSync('./elements') + .filter(file => file.endsWith('.md')) + .map(el => ({ + text: el.split('.md')[0], + link: `/elements/${el}`, + })), + }, + ], + }, + ], + }, + ], - socialLinks: [ - { - icon: "github", - link: "https://github.com/darksoil-studio/ notifications", - }, - ], - search: { - provider: 'local' - } -}, - head: [ - [ - 'script', - {}, - // Synchronize the vitepress dark/light theme with the shoelace mode - ` + socialLinks: [ + { + icon: 'github', + link: 'https://github.com/darksoil-studio/notifications', + }, + ], + search: { + provider: 'local', + }, + }, + head: [ + [ + 'script', + {}, + // Synchronize the vitepress dark/light theme with the shoelace mode + ` function syncTheme() { const isDark = document.documentElement.classList.contains('dark'); const isShoelaceDark = document.documentElement.classList.contains('sl-theme-dark'); @@ -96,7 +95,7 @@ export default ({ }); attrObserver.observe(document.documentElement, {attributes: true}); syncTheme(); - ` - ] - ], -}); + `, + ], + ], +}; diff --git a/docs/elements/custom-elements.json b/docs/elements/custom-elements.json new file mode 100644 index 00000000..0236c221 --- /dev/null +++ b/docs/elements/custom-elements.json @@ -0,0 +1,765 @@ +{ + "schemaVersion": "1.0.0", + "readme": "", + "modules": [ + { + "kind": "javascript-module", + "path": "src/context.ts", + "declarations": [ + { + "kind": "variable", + "name": "notificationsStoreContext" + } + ], + "exports": [ + { + "kind": "js", + "name": "notificationsStoreContext", + "declaration": { + "name": "notificationsStoreContext", + "module": "src/context.ts" + } + } + ] + }, + { + "kind": "javascript-module", + "path": "src/index.ts", + "declarations": [], + "exports": [ + { + "kind": "js", + "name": "*", + "declaration": { + "name": "*", + "package": "./notifications-store.js" + } + }, + { + "kind": "js", + "name": "*", + "declaration": { + "name": "*", + "package": "./notifications-client.js" + } + }, + { + "kind": "js", + "name": "*", + "declaration": { + "name": "*", + "package": "./context.js" + } + }, + { + "kind": "js", + "name": "*", + "declaration": { + "name": "*", + "package": "./types.js" + } + } + ] + }, + { + "kind": "javascript-module", + "path": "src/mocks.ts", + "declarations": [ + { + "kind": "class", + "description": "", + "name": "NotificationsZomeMock", + "members": [ + { + "kind": "field", + "name": "notifications", + "default": "new HoloHashMap<\n\t\tActionHash,\n\t\t{\n\t\t\tdeletes: Array>;\n\t\t\trevisions: Array;\n\t\t}\n\t>()", + "description": "Notification" + }, + { + "kind": "field", + "name": "notificationsForRecipient", + "default": "new HoloHashMap()" + }, + { + "kind": "field", + "name": "readNotificationsByRecipient", + "default": "new HoloHashMap>()" + }, + { + "kind": "method", + "name": "create_notification", + "return": { + "type": { + "text": "Promise" + } + }, + "parameters": [ + { + "name": "notification", + "type": { + "text": "Notification" + } + } + ] + }, + { + "kind": "method", + "name": "get_notification", + "return": { + "type": { + "text": "Promise" + } + }, + "parameters": [ + { + "name": "notificationHash", + "type": { + "text": "ActionHash" + } + } + ] + }, + { + "kind": "method", + "name": "get_all_deletes_for_notification", + "return": { + "type": { + "text": "Promise> | undefined>" + } + }, + "parameters": [ + { + "name": "notificationHash", + "type": { + "text": "ActionHash" + } + } + ] + }, + { + "kind": "method", + "name": "get_oldest_delete_for_notification", + "return": { + "type": { + "text": "Promise | undefined>" + } + }, + "parameters": [ + { + "name": "notificationHash", + "type": { + "text": "ActionHash" + } + } + ] + }, + { + "kind": "method", + "name": "delete_notification", + "return": { + "type": { + "text": "Promise" + } + }, + "parameters": [ + { + "name": "original_notification_hash", + "type": { + "text": "ActionHash" + } + } + ] + }, + { + "kind": "method", + "name": "get_notifications_for_recipient", + "return": { + "type": { + "text": "Promise>" + } + }, + "parameters": [ + { + "name": "recipient", + "type": { + "text": "AgentPubKey" + } + } + ] + }, + { + "kind": "method", + "name": "mark_notifications_as_read", + "parameters": [ + { + "name": "notifications", + "type": { + "text": "ActionHash[]" + } + } + ] + }, + { + "kind": "method", + "name": "dismiss_notifications", + "parameters": [ + { + "name": "notifications", + "type": { + "text": "ActionHash[]" + } + } + ] + }, + { + "kind": "method", + "name": "get_undismissed_notifications", + "return": { + "type": { + "text": "Promise>" + } + } + }, + { + "kind": "method", + "name": "get_dismissed_notifications", + "return": { + "type": { + "text": "Promise>" + } + } + }, + { + "kind": "method", + "name": "get_read_notifications", + "return": { + "type": { + "text": "Promise>" + } + } + } + ], + "superclass": { + "name": "ZomeMock", + "package": "@holochain-open-dev/utils" + } + }, + { + "kind": "function", + "name": "sampleNotification", + "return": { + "type": { + "text": "Promise" + } + }, + "parameters": [ + { + "name": "client", + "type": { + "text": "NotificationsClient" + } + }, + { + "name": "partialNotification", + "default": "{}", + "type": { + "text": "Partial" + } + } + ] + } + ], + "exports": [ + { + "kind": "js", + "name": "NotificationsZomeMock", + "declaration": { + "name": "NotificationsZomeMock", + "module": "src/mocks.ts" + } + }, + { + "kind": "js", + "name": "sampleNotification", + "declaration": { + "name": "sampleNotification", + "module": "src/mocks.ts" + } + } + ] + }, + { + "kind": "javascript-module", + "path": "src/notifications-client.ts", + "declarations": [ + { + "kind": "class", + "description": "", + "name": "NotificationsClient", + "members": [ + { + "kind": "method", + "name": "createNotification", + "return": { + "type": { + "text": "Promise" + } + }, + "parameters": [ + { + "name": "notification", + "type": { + "text": "Notification" + } + } + ], + "description": "Notification" + }, + { + "kind": "method", + "name": "getNotification", + "return": { + "type": { + "text": "Promise | undefined>" + } + }, + "parameters": [ + { + "name": "notificationHash", + "type": { + "text": "ActionHash" + } + } + ] + }, + { + "kind": "method", + "name": "markNotificationsAsRead", + "return": { + "type": { + "text": "Promise" + } + }, + "parameters": [ + { + "name": "notificationsHashes", + "type": { + "text": "ActionHash[]" + } + } + ] + }, + { + "kind": "method", + "name": "dismissNotifications", + "return": { + "type": { + "text": "Promise" + } + }, + "parameters": [ + { + "name": "notificationsHashes", + "type": { + "text": "ActionHash[]" + } + } + ] + }, + { + "kind": "method", + "name": "getAllDeletesForNotification", + "return": { + "type": { + "text": "Promise> | undefined>" + } + }, + "parameters": [ + { + "name": "originalNotificationHash", + "type": { + "text": "ActionHash" + } + } + ] + }, + { + "kind": "method", + "name": "getUndismissedNotifications", + "return": { + "type": { + "text": "Promise>" + } + } + }, + { + "kind": "method", + "name": "getReadNotifications", + "return": { + "type": { + "text": "Promise>" + } + } + }, + { + "kind": "method", + "name": "getDismissedNotifications", + "return": { + "type": { + "text": "Promise<\n\t\tArray<[SignedActionHashed, SignedActionHashed[]]>\n\t>" + } + } + } + ], + "superclass": { + "name": "ZomeClient", + "package": "@holochain-open-dev/utils" + } + } + ], + "exports": [ + { + "kind": "js", + "name": "NotificationsClient", + "declaration": { + "name": "NotificationsClient", + "module": "src/notifications-client.ts" + } + } + ] + }, + { + "kind": "javascript-module", + "path": "src/notifications-store.ts", + "declarations": [ + { + "kind": "class", + "description": "", + "name": "NotificationsStore", + "members": [ + { + "kind": "method", + "name": "addTypes", + "parameters": [ + { + "name": "notificationsType", + "type": { + "text": "Record" + } + } + ] + }, + { + "kind": "field", + "name": "notifications", + "default": "new LazyHoloHashMap((notificationHash: ActionHash) => ({\n\t\tentry: immutableEntrySignal(() =>\n\t\t\tthis.client.getNotification(notificationHash),\n\t\t),\n\t\tdeletes: deletesForEntrySignal(this.client, notificationHash, () =>\n\t\t\tthis.client.getAllDeletesForNotification(notificationHash),\n\t\t),\n\t}))", + "description": "Notification" + }, + { + "kind": "field", + "name": "undismissedNotificationsLinks", + "privacy": "private" + }, + { + "kind": "field", + "name": "readNotificationsLinks", + "privacy": "private" + }, + { + "kind": "field", + "name": "readNotifications", + "default": "new AsyncComputed(() => {\n\t\tconst readNotificationsLinks = this.readNotificationsLinks.get();\n\t\tconst undismissedNotifications = this.undismissedNotificationsLinks.get();\n\t\tif (readNotificationsLinks.status !== 'completed')\n\t\t\treturn readNotificationsLinks;\n\t\tif (undismissedNotifications.status !== 'completed')\n\t\t\treturn undismissedNotifications;\n\n\t\t/** Aggregate the read notification hashes and filter them by whether they've been dismissed */\n\n\t\tconst allReadNotificationsHashes = uniquify(\n\t\t\tArray.from([] as ActionHash[]).concat(\n\t\t\t\t...readNotificationsLinks.value.map(\n\t\t\t\t\tlink => decode(link.tag) as ActionHash[],\n\t\t\t\t),\n\t\t\t),\n\t\t);\n\n\t\tconst undismissedNotificationsHashes = undismissedNotifications.value.map(\n\t\t\tl => encodeHashToBase64(l.target),\n\t\t);\n\n\t\tconst notificationsHashes = allReadNotificationsHashes.filter(hash =>\n\t\t\tundismissedNotificationsHashes.includes(encodeHashToBase64(hash)),\n\t\t);\n\n\t\t/* If a notification was persistent and has been read but was deleted (usually by someone else performing the action that the notification required), then we dismiss the notification */\n\n\t\t// const deletes = joinAsync(\n\t\t// \tnotificationsHashes.map(hash =>\n\t\t// \t\tthis.notifications.get(hash).deletes.get(),\n\t\t// \t),\n\t\t// );\n\t\t// const entries = joinAsync(\n\t\t// \tnotificationsHashes.map(hash =>\n\t\t// \t\tthis.notifications.get(hash).entry.get(),\n\t\t// \t),\n\t\t// );\n\t\t// if (entries.status !== 'completed') return entries;\n\t\t// if (deletes.status !== 'completed') return deletes;\n\n\t\t// const nonDeletedNotificationHashes: ActionHash[] = [];\n\t\t// const notificationsToDismiss: ActionHash[] = [];\n\n\t\t// for (let i = 0; i < notificationsHashes.length; i++) {\n\t\t// \tif (!entries.value[i].entry.persistent || deletes.value[i].length === 0) {\n\t\t// \t\tnonDeletedNotificationHashes.push(notificationsHashes[i]);\n\t\t// \t} else {\n\t\t// \t\tnotificationsToDismiss.push(notificationsHashes[i]);\n\t\t// \t}\n\t\t// }\n\n\t\t// if (notificationsToDismiss.length > 0) {\n\t\t// \tthis.client.dismissNotifications(notificationsToDismiss);\n\t\t// }\n\n\t\tconst value = slice(this.notifications, notificationsHashes);\n\t\treturn {\n\t\t\tstatus: 'completed',\n\t\t\tvalue,\n\t\t};\n\t})" + }, + { + "kind": "field", + "name": "unreadNotifications", + "default": "new AsyncComputed(() => {\n\t\tconst readNotifications = this.readNotifications.get();\n\t\tconst undismissedNotifications = this.undismissedNotificationsLinks.get();\n\n\t\tif (readNotifications.status !== 'completed') return readNotifications;\n\t\tif (undismissedNotifications.status !== 'completed')\n\t\t\treturn undismissedNotifications;\n\n\t\tconst readNotificationsHashes = Array.from(\n\t\t\treadNotifications.value.keys(),\n\t\t).map(h => encodeHashToBase64(h));\n\n\t\tconst links = undismissedNotifications.value.filter(\n\t\t\tlink =>\n\t\t\t\t!readNotificationsHashes.includes(encodeHashToBase64(link.target)),\n\t\t);\n\t\tconst value = slice(this.notifications, uniquify(links.map(l => l.target)));\n\t\treturn {\n\t\t\tstatus: 'completed',\n\t\t\tvalue,\n\t\t};\n\t})" + }, + { + "kind": "field", + "name": "deletedNotificationsLinks" + }, + { + "kind": "field", + "name": "dismissedNotifications", + "default": "new AsyncComputed(() => {\n\t\tconst deletedLinks = this.deletedNotificationsLinks.get();\n\t\tif (deletedLinks.status !== 'completed') return deletedLinks;\n\n\t\tconst value = slice(\n\t\t\tthis.notifications,\n\t\t\tdeletedLinks.value.map(l => l[0].hashed.content.target_address),\n\t\t);\n\n\t\treturn {\n\t\t\tstatus: 'completed',\n\t\t\tvalue,\n\t\t};\n\t})" + }, + { + "kind": "field", + "name": "notificationsByTypeAndGroup", + "default": "new LazyMap(\n\t\t(notificationType: string) =>\n\t\t\tnew LazyMap((notificationGroup: string) => ({\n\t\t\t\tread: new AsyncComputed(() => {\n\t\t\t\t\tconst notifications = this.readNotifications.get();\n\t\t\t\t\tif (notifications.status !== 'completed') return notifications;\n\n\t\t\t\t\tconst entries = joinAsyncMap(\n\t\t\t\t\t\tmapValues(notifications.value, n => n.entry.get()),\n\t\t\t\t\t);\n\t\t\t\t\tif (entries.status !== 'completed') return entries;\n\n\t\t\t\t\tconst value = pickBy(\n\t\t\t\t\t\tentries.value,\n\t\t\t\t\t\tn =>\n\t\t\t\t\t\t\tn.entry.notification_type === notificationType &&\n\t\t\t\t\t\t\tn.entry.notification_group === notificationGroup,\n\t\t\t\t\t);\n\n\t\t\t\t\treturn {\n\t\t\t\t\t\tstatus: 'completed',\n\t\t\t\t\t\tvalue,\n\t\t\t\t\t};\n\t\t\t\t}),\n\t\t\t\tunread: new AsyncComputed(() => {\n\t\t\t\t\tconst notifications = this.unreadNotifications.get();\n\t\t\t\t\tif (notifications.status !== 'completed') return notifications;\n\n\t\t\t\t\tconst entries = joinAsyncMap(\n\t\t\t\t\t\tmapValues(notifications.value, n => n.entry.get()),\n\t\t\t\t\t);\n\t\t\t\t\tif (entries.status !== 'completed') return entries;\n\n\t\t\t\t\tconst value = pickBy(\n\t\t\t\t\t\tentries.value,\n\t\t\t\t\t\tn =>\n\t\t\t\t\t\t\tn.entry.notification_type === notificationType &&\n\t\t\t\t\t\t\tn.entry.notification_group === notificationGroup,\n\t\t\t\t\t);\n\n\t\t\t\t\treturn {\n\t\t\t\t\t\tstatus: 'completed',\n\t\t\t\t\t\tvalue,\n\t\t\t\t\t};\n\t\t\t\t}),\n\t\t\t})),\n\t)", + "description": "Helpers for consuming UIs" + } + ] + } + ], + "exports": [ + { + "kind": "js", + "name": "NotificationsStore", + "declaration": { + "name": "NotificationsStore", + "module": "src/notifications-store.ts" + } + } + ] + }, + { + "kind": "javascript-module", + "path": "src/types.ts", + "declarations": [], + "exports": [] + }, + { + "kind": "javascript-module", + "path": "locales/locales.js", + "declarations": [ + { + "kind": "variable", + "name": "sourceLocale", + "default": "`en`", + "description": "The locale code that templates in this source code are written in." + }, + { + "kind": "variable", + "name": "targetLocales", + "type": { + "text": "array" + }, + "default": "[\n ,\n]", + "description": "The other locale codes that this application is localized into. Sorted\nlexicographically." + }, + { + "kind": "variable", + "name": "allLocales", + "type": { + "text": "array" + }, + "default": "[\n `en`,\n]", + "description": "All valid project locale codes. Sorted lexicographically." + } + ], + "exports": [ + { + "kind": "js", + "name": "sourceLocale", + "declaration": { + "name": "sourceLocale", + "module": "locales/locales.js" + } + }, + { + "kind": "js", + "name": "targetLocales", + "declaration": { + "name": "targetLocales", + "module": "locales/locales.js" + } + }, + { + "kind": "js", + "name": "allLocales", + "declaration": { + "name": "allLocales", + "module": "locales/locales.js" + } + } + ] + }, + { + "kind": "javascript-module", + "path": "src/elements/my-notifications-icon-button.ts", + "declarations": [ + { + "kind": "class", + "description": "", + "name": "MyNotificationsIconButton", + "members": [], + "mixins": [ + { + "name": "SignalWatcher", + "package": "@holochain-open-dev/signals" + } + ], + "superclass": { + "name": "LitElement", + "package": "lit" + }, + "tagName": "my-notifications-icon-button", + "customElement": true + } + ], + "exports": [ + { + "kind": "js", + "name": "MyNotificationsIconButton", + "declaration": { + "name": "MyNotificationsIconButton", + "module": "src/elements/my-notifications-icon-button.ts" + } + }, + { + "kind": "custom-element-definition", + "name": "my-notifications-icon-button", + "declaration": { + "name": "MyNotificationsIconButton", + "module": "src/elements/my-notifications-icon-button.ts" + } + } + ] + }, + { + "kind": "javascript-module", + "path": "src/elements/my-notifications-list.ts", + "declarations": [ + { + "kind": "class", + "description": "", + "name": "MyNotifications", + "members": [ + { + "kind": "method", + "name": "renderNotificationGroup", + "parameters": [ + { + "name": "read", + "type": { + "text": "boolean" + } + }, + { + "name": "persistent", + "type": { + "text": "boolean" + } + }, + { + "name": "notificationGroup", + "type": { + "text": "NotificationGroup" + } + }, + { + "name": "last", + "type": { + "text": "boolean" + } + } + ] + }, + { + "kind": "method", + "name": "notificationInfo", + "return": { + "type": { + "text": "AsyncResult" + } + }, + "parameters": [ + { + "name": "notificationHash", + "type": { + "text": "ActionHash" + } + } + ] + }, + { + "kind": "method", + "name": "getNotificationsGroups" + }, + { + "kind": "method", + "name": "notificationCount" + } + ], + "mixins": [ + { + "name": "SignalWatcher", + "package": "@holochain-open-dev/signals" + } + ], + "superclass": { + "name": "LitElement", + "package": "lit" + }, + "tagName": "my-notifications-list", + "customElement": true + } + ], + "exports": [ + { + "kind": "js", + "name": "MyNotifications", + "declaration": { + "name": "MyNotifications", + "module": "src/elements/my-notifications-list.ts" + } + }, + { + "kind": "custom-element-definition", + "name": "my-notifications-list", + "declaration": { + "name": "MyNotifications", + "module": "src/elements/my-notifications-list.ts" + } + } + ] + }, + { + "kind": "javascript-module", + "path": "src/elements/notifications-context.ts", + "declarations": [ + { + "kind": "class", + "description": "", + "name": "NotificationsContext", + "members": [ + { + "kind": "field", + "name": "store", + "type": { + "text": "NotificationsStore" + }, + "attribute": "store" + } + ], + "attributes": [ + { + "name": "store", + "type": { + "text": "NotificationsStore" + }, + "fieldName": "store" + } + ], + "superclass": { + "name": "LitElement", + "package": "lit" + }, + "tagName": "notifications-context", + "customElement": true + } + ], + "exports": [ + { + "kind": "js", + "name": "NotificationsContext", + "declaration": { + "name": "NotificationsContext", + "module": "src/elements/notifications-context.ts" + } + }, + { + "kind": "custom-element-definition", + "name": "notifications-context", + "declaration": { + "name": "NotificationsContext", + "module": "src/elements/notifications-context.ts" + } + } + ] + } + ] +} diff --git a/docs/elements/my-notifications-icon-button.md b/docs/elements/my-notifications-icon-button.md index 40def42f..328550d3 100644 --- a/docs/elements/my-notifications-icon-button.md +++ b/docs/elements/my-notifications-icon-button.md @@ -53,9 +53,13 @@ Here is an interactive demo of the element: