From 6d798861e1113d592c0aed95686906725a04c17d Mon Sep 17 00:00:00 2001 From: bendera Date: Sat, 21 Oct 2023 15:18:46 +0200 Subject: [PATCH 1/4] feat: show whether the property is static --- docs/assets/custom-elements.json | 40 ++++++++++++++++++++++++ docs/docs/api/styling.md | 3 ++ fixtures/lit/src/expansion-panel.ts | 5 +++ fixtures/lit/src/fancy-accordion.ts | 5 +++ fixtures/lit/src/intl-currency.ts | 5 +++ fixtures/lit/src/progress-bar.ts | 5 +++ packages/api-common/src/shared-styles.ts | 3 ++ packages/api-docs/src/layout.ts | 11 +++++-- packages/api-docs/src/styles.ts | 10 ++++++ 9 files changed, 84 insertions(+), 3 deletions(-) diff --git a/docs/assets/custom-elements.json b/docs/assets/custom-elements.json index 981a68b..dfd2ab0 100644 --- a/docs/assets/custom-elements.json +++ b/docs/assets/custom-elements.json @@ -105,6 +105,16 @@ "name": "_boundBodyKeyup", "privacy": "private" }, + { + "kind": "field", + "name": "version", + "type": { + "text": "string" + }, + "static": true, + "default": "'1.0.0'", + "description": "Version of the component" + }, { "kind": "method", "name": "focus", @@ -334,6 +344,16 @@ "privacy": "private", "default": "this._onOpened.bind(this)" }, + { + "kind": "field", + "name": "version", + "type": { + "text": "string" + }, + "static": true, + "default": "'1.0.0'", + "description": "Version of the component" + }, { "kind": "field", "name": "focused", @@ -500,6 +520,16 @@ "default": "'en-GB'", "description": "Locale code used for formatting.", "attribute": "locale" + }, + { + "kind": "field", + "name": "version", + "type": { + "text": "string" + }, + "static": true, + "default": "'1.0.0'", + "description": "Version of the component" } ], "attributes": [ @@ -691,6 +721,16 @@ "attribute": "indeterminate", "reflects": true }, + { + "kind": "field", + "name": "version", + "type": { + "text": "string" + }, + "static": true, + "default": "'1.0.0'", + "description": "Version of the component" + }, { "kind": "method", "name": "setBounds", diff --git a/docs/docs/api/styling.md b/docs/docs/api/styling.md index 91c9f16..5aaa223 100644 --- a/docs/docs/api/styling.md +++ b/docs/docs/api/styling.md @@ -24,6 +24,9 @@ The following custom CSS properties are available: | `--ave-tab-color` | Inactive tabs color | | `--ave-tab-selected-color` | Selected tab color | | `--ave-tab-indicator-size` | Size of the selected tab indicator | +| `--ave-tag-background-color` | Background color of tags (e.g., `static`) | +| `--ave-tag-border-color` | Color of tag borders | +| `--ave-tag-color` | Color of tags | ## CSS shadow parts diff --git a/fixtures/lit/src/expansion-panel.ts b/fixtures/lit/src/expansion-panel.ts index 8c9b1fc..d54e29d 100644 --- a/fixtures/lit/src/expansion-panel.ts +++ b/fixtures/lit/src/expansion-panel.ts @@ -51,6 +51,11 @@ export class ExpansionPanel extends OpenedMixin(LitElement) { private _boundBodyKeyup = this._onBodyKeyup.bind(this); + /** + * Version of the component + */ + static version = '1.0.0'; + static get styles(): CSSResult { return css` :host { diff --git a/fixtures/lit/src/fancy-accordion.ts b/fixtures/lit/src/fancy-accordion.ts index 032474a..6398537 100644 --- a/fixtures/lit/src/fancy-accordion.ts +++ b/fixtures/lit/src/fancy-accordion.ts @@ -41,6 +41,11 @@ export class FancyAccordion extends LitElement { private _boundOnOpened = this._onOpened.bind(this) as EventListener; + /** + * Version of the component + */ + static version = '1.0.0'; + static get styles(): CSSResult { return css` :host { diff --git a/fixtures/lit/src/intl-currency.ts b/fixtures/lit/src/intl-currency.ts index 1aa28fb..93adb0b 100644 --- a/fixtures/lit/src/intl-currency.ts +++ b/fixtures/lit/src/intl-currency.ts @@ -44,6 +44,11 @@ export class IntlCurrency extends LitElement { */ @property() locale: string | null | undefined = 'en-GB'; + /** + * Version of the component + */ + static version = '1.0.0'; + static get styles(): CSSResult { return css` :host { diff --git a/fixtures/lit/src/progress-bar.ts b/fixtures/lit/src/progress-bar.ts index 35cca50..9fe81b0 100644 --- a/fixtures/lit/src/progress-bar.ts +++ b/fixtures/lit/src/progress-bar.ts @@ -59,6 +59,11 @@ export class ProgressBar extends LitElement { */ @property({ type: Boolean, reflect: true }) indeterminate = false; + /** + * Version of the component + */ + static version = '1.0.0'; + static get styles(): CSSResult { return css` :host { diff --git a/packages/api-common/src/shared-styles.ts b/packages/api-common/src/shared-styles.ts index dc74e57..3c66d9c 100644 --- a/packages/api-common/src/shared-styles.ts +++ b/packages/api-common/src/shared-styles.ts @@ -25,6 +25,9 @@ export default css` --ave-link-hover-color: #d63200; --ave-tab-indicator-size: 2px; --ave-tab-color: rgba(0, 0, 0, 0.54); + --ave-tag-background-color: #e2e3e5; + --ave-tag-border-color: #d6d8db; + --ave-tag-color: #383d41; --ave-monospace-font: Menlo, 'DejaVu Sans Mono', 'Liberation Mono', Consolas, 'Courier New', monospace; } diff --git a/packages/api-docs/src/layout.ts b/packages/api-docs/src/layout.ts index aa22bc2..a18f1b3 100644 --- a/packages/api-docs/src/layout.ts +++ b/packages/api-docs/src/layout.ts @@ -25,9 +25,13 @@ const renderItem = ( description?: string, valueType?: string, value?: unknown, - attribute?: string + attribute?: string, + isStatic?: boolean ): TemplateResult => html`
+ ${isStatic + ? html`
static
` + : nothing}
Name
@@ -158,7 +162,7 @@ class ApiDocsLayout extends LitElement { props, html` ${props.map((prop) => { - const { name, description, type } = prop; + const { name, description, type, static: isStatic } = prop; const attribute = attrs.find((x) => x.fieldName === name); return renderItem( 'prop', @@ -166,7 +170,8 @@ class ApiDocsLayout extends LitElement { description, type?.text, prop.default, - attribute?.name + attribute?.name, + isStatic ); })} ` diff --git a/packages/api-docs/src/styles.ts b/packages/api-docs/src/styles.ts index 26cbc3f..7a76469 100644 --- a/packages/api-docs/src/styles.ts +++ b/packages/api-docs/src/styles.ts @@ -40,6 +40,16 @@ export default css` border-top: solid 1px var(--ave-border-color); } + [part='docs-tag'] { + background-color: var(--ave-tag-background-color); + border: 1px solid var(--ave-tag-border-color); + border-radius: 3px; + color: var(--ave-tag-color); + display: inline-block; + font-size: 0.75rem; + padding: 1px 5px; + } + [part='docs-description'] { display: block; padding: 0 1rem; From 8eeb4de6069c165d9767e267d77ad8edf280f0b1 Mon Sep 17 00:00:00 2001 From: bendera Date: Sat, 21 Oct 2023 23:58:20 +0200 Subject: [PATCH 2/4] feat: display static members first --- packages/api-docs/src/layout.ts | 2 ++ 1 file changed, 2 insertions(+) diff --git a/packages/api-docs/src/layout.ts b/packages/api-docs/src/layout.ts index a18f1b3..a2f5a42 100644 --- a/packages/api-docs/src/layout.ts +++ b/packages/api-docs/src/layout.ts @@ -144,6 +144,8 @@ class ApiDocsLayout extends LitElement { cssParts ].every((arr) => arr.length === 0); + props.sort((p) => (p.static ? -1 : 1)); + const attributes = attrs.filter( (x) => !props.some((y) => y.name === x.fieldName) ); From c38cd89e19dc2b3652377ffda4872c27136fb03e Mon Sep 17 00:00:00 2001 From: bendera Date: Sun, 22 Oct 2023 11:31:06 +0200 Subject: [PATCH 3/4] chore: add changeset --- .changeset/lazy-crabs-yell.md | 6 ++++++ 1 file changed, 6 insertions(+) create mode 100644 .changeset/lazy-crabs-yell.md diff --git a/.changeset/lazy-crabs-yell.md b/.changeset/lazy-crabs-yell.md new file mode 100644 index 0000000..49fd24e --- /dev/null +++ b/.changeset/lazy-crabs-yell.md @@ -0,0 +1,6 @@ +--- +'@api-viewer/common': minor +'@api-viewer/docs': minor +--- + +Added the ability to show whether a property is static From ff2e387bf43f59fb4d2bd5556ef8f60095c8c9dc Mon Sep 17 00:00:00 2001 From: web-padawan Date: Fri, 3 Nov 2023 10:20:24 +0200 Subject: [PATCH 4/4] fix: update changeset to list all packages --- .changeset/lazy-crabs-yell.md | 7 +++++-- 1 file changed, 5 insertions(+), 2 deletions(-) diff --git a/.changeset/lazy-crabs-yell.md b/.changeset/lazy-crabs-yell.md index 49fd24e..947ef5a 100644 --- a/.changeset/lazy-crabs-yell.md +++ b/.changeset/lazy-crabs-yell.md @@ -1,6 +1,9 @@ --- -'@api-viewer/common': minor -'@api-viewer/docs': minor +'@api-viewer/common': patch +'@api-viewer/demo': patch +'@api-viewer/docs': patch +'@api-viewer/tabs': patch +'api-viewer-element': patch --- Added the ability to show whether a property is static