From cf72602fbf4afc3f160a164642ff5bc638b87b9e Mon Sep 17 00:00:00 2001 From: electrovir Date: Tue, 20 Feb 2024 01:21:53 +0000 Subject: [PATCH] [minor] add ToniqErrorMessage --- package-lock.json | 10 +++--- package.json | 2 +- packages/design-system/package.json | 2 +- .../element-book/all-element-book-entries.ts | 2 ++ packages/design-system/src/elements/index.ts | 1 + .../toniq-error-message.element.book.ts | 32 +++++++++++++++++++ .../toniq-error-message.element.ts | 22 +++++++++++++ packages/native-elements-test/package.json | 2 +- packages/scripts/package.json | 2 +- 9 files changed, 66 insertions(+), 9 deletions(-) create mode 100644 packages/design-system/src/elements/toniq-error-message/toniq-error-message.element.book.ts create mode 100644 packages/design-system/src/elements/toniq-error-message/toniq-error-message.element.ts diff --git a/package-lock.json b/package-lock.json index 4f5b3cec..0c3e511c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "@toniq-labs/design-system-root", - "version": "16.2.3", + "version": "16.3.0", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "@toniq-labs/design-system-root", - "version": "16.2.3", + "version": "16.3.0", "hasInstallScript": true, "license": "MIT", "workspaces": [ @@ -13297,7 +13297,7 @@ }, "packages/design-system": { "name": "@toniq-labs/design-system", - "version": "16.2.3", + "version": "16.3.0", "license": "MIT", "dependencies": { "@augment-vir/common": "^23.3.4", @@ -13337,7 +13337,7 @@ }, "packages/native-elements-test": { "name": "@toniq-labs/design-system-native-elements-test", - "version": "16.2.3", + "version": "16.3.0", "dependencies": { "@toniq-labs/design-system": "*", "element-vir": "*", @@ -13359,7 +13359,7 @@ }, "packages/scripts": { "name": "@toniq-labs/design-system-scripts", - "version": "16.2.3", + "version": "16.3.0", "dependencies": { "@augment-vir/common": "^23.3.4", "@augment-vir/node-js": "^23.3.4", diff --git a/package.json b/package.json index e9779076..b88dd293 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@toniq-labs/design-system-root", - "version": "16.2.3", + "version": "16.3.0", "private": true, "description": "Root design system mono-repo package.", "homepage": "https://github.com/Toniq-Labs/toniq-labs-design-system", diff --git a/packages/design-system/package.json b/packages/design-system/package.json index 8fd53ef6..c45cbcc0 100644 --- a/packages/design-system/package.json +++ b/packages/design-system/package.json @@ -1,6 +1,6 @@ { "name": "@toniq-labs/design-system", - "version": "16.2.3", + "version": "16.3.0", "private": false, "description": "Design system elements for Toniq Labs", "keywords": [ diff --git a/packages/design-system/src/element-book/all-element-book-entries.ts b/packages/design-system/src/element-book/all-element-book-entries.ts index df1dae3c..c63a5b97 100644 --- a/packages/design-system/src/element-book/all-element-book-entries.ts +++ b/packages/design-system/src/element-book/all-element-book-entries.ts @@ -6,6 +6,7 @@ import {toniqCheckboxPage} from '../elements/toniq-checkbox/toniq-checkbox.eleme import {toniqChipBookPage} from '../elements/toniq-chip/toniq-chip.element.book'; import {toniqDateTimeBookPage} from '../elements/toniq-date-time/toniq-date-time.element.book'; import {toniqDropdownPage} from '../elements/toniq-dropdown/toniq-dropdown.element.book'; +import {toniqErrorMessageBookPage} from '../elements/toniq-error-message/toniq-error-message.element.book'; import {toniqFeaturedFlipCardBookPage} from '../elements/toniq-featured-flip-card/toniq-featured-flip-card.element.book'; import {toniqFlipCardBookPage} from '../elements/toniq-flip-card/toniq-flip-card.element.book'; import {toniqHeadingBookPage} from '../elements/toniq-heading/toniq-heading.element.book'; @@ -47,6 +48,7 @@ const childPages = [ toniqColorsBookPage, toniqDateTimeBookPage, toniqDropdownPage, + toniqErrorMessageBookPage, toniqFeaturedFlipCardBookPage, toniqFlipCardBookPage, toniqFontsBookPage, diff --git a/packages/design-system/src/elements/index.ts b/packages/design-system/src/elements/index.ts index 60144917..4da448eb 100644 --- a/packages/design-system/src/elements/index.ts +++ b/packages/design-system/src/elements/index.ts @@ -8,6 +8,7 @@ export * from './toniq-checkbox/toniq-checkbox.element'; export * from './toniq-chip/toniq-chip.element'; export * from './toniq-date-time/toniq-date-time.element'; export * from './toniq-dropdown/toniq-dropdown.element'; +export * from './toniq-error-message/toniq-error-message.element'; export * from './toniq-featured-flip-card/toniq-featured-flip-card-footer.element'; export * from './toniq-featured-flip-card/toniq-featured-flip-card.element'; export * from './toniq-flip-card/toniq-flip-card.element'; diff --git a/packages/design-system/src/elements/toniq-error-message/toniq-error-message.element.book.ts b/packages/design-system/src/elements/toniq-error-message/toniq-error-message.element.book.ts new file mode 100644 index 00000000..bcf87c76 --- /dev/null +++ b/packages/design-system/src/elements/toniq-error-message/toniq-error-message.element.book.ts @@ -0,0 +1,32 @@ +import {defineBookPage} from 'element-book'; +import {HtmlInterpolation, html} from 'element-vir'; +import {elementsBookPage} from '../../element-book/book-pages/elements.book'; +import {ToniqErrorMessage} from './toniq-error-message.element'; + +const examples: ReadonlyArray> = [ + { + title: 'empty', + content: '', + }, + { + title: 'with text', + content: 'Error: there was an error', + }, +]; + +export const toniqErrorMessageBookPage = defineBookPage({ + title: ToniqErrorMessage.tagName, + parent: elementsBookPage, + elementExamplesCallback({defineExample}) { + examples.forEach((example) => { + defineExample({ + title: example.title, + renderCallback() { + return html` + <${ToniqErrorMessage}>${example.content} + `; + }, + }); + }); + }, +}); diff --git a/packages/design-system/src/elements/toniq-error-message/toniq-error-message.element.ts b/packages/design-system/src/elements/toniq-error-message/toniq-error-message.element.ts new file mode 100644 index 00000000..168a959a --- /dev/null +++ b/packages/design-system/src/elements/toniq-error-message/toniq-error-message.element.ts @@ -0,0 +1,22 @@ +import {css, html} from 'element-vir'; +import {defineToniqElementNoInputs} from '../define-toniq-element'; + +export const ToniqErrorMessage = defineToniqElementNoInputs({ + tagName: 'toniq-error-message', + styles: css` + :host { + display: block; + color: red; + } + + p { + padding: 0; + margin: 0; + } + `, + renderCallback() { + return html` +

+ `; + }, +}); diff --git a/packages/native-elements-test/package.json b/packages/native-elements-test/package.json index 3c0fa3b9..aef295a4 100644 --- a/packages/native-elements-test/package.json +++ b/packages/native-elements-test/package.json @@ -1,6 +1,6 @@ { "name": "@toniq-labs/design-system-native-elements-test", - "version": "16.2.3", + "version": "16.3.0", "private": true, "scripts": { "compile": "virmator compile", diff --git a/packages/scripts/package.json b/packages/scripts/package.json index e317ffe6..e0133c21 100644 --- a/packages/scripts/package.json +++ b/packages/scripts/package.json @@ -1,6 +1,6 @@ { "name": "@toniq-labs/design-system-scripts", - "version": "16.2.3", + "version": "16.3.0", "private": true, "scripts": { "compile": "virmator compile",