diff --git a/.github/workflows/draft-deploy.yml b/.github/workflows/draft-deploy.yml index 4e967955db..0e6f1e80e4 100644 --- a/.github/workflows/draft-deploy.yml +++ b/.github/workflows/draft-deploy.yml @@ -6,6 +6,7 @@ on: jobs: deploy: + if: ${{ github.event.pull_request.base.repo.clone_url == github.event.pull_request.head.repo.clone_url }} runs-on: ubuntu-latest steps: - uses: actions/checkout@v4 diff --git a/.github/workflows/test-deploy.yml b/.github/workflows/test-deploy.yml new file mode 100644 index 0000000000..7e3db6aefa --- /dev/null +++ b/.github/workflows/test-deploy.yml @@ -0,0 +1,52 @@ +name: Netlify Test Deploy - Deploy stable branches under fixed aliases + +on: + push: + branches: + - 'develop' + - 'release/*' + +jobs: + deploy: + runs-on: ubuntu-latest + steps: + - uses: actions/checkout@v4 + with: + fetch-depth: 0 + persist-credentials: false + + # https://github.com/pnpm/action-setup#use-cache-to-reduce-installation-time + - name: Install Node.js + uses: actions/setup-node@v4 + with: + node-version: 20 + - name: Install pnpm + uses: pnpm/action-setup@v2 + id: pnpm-install + with: + version: 8 + - name: Get pnpm store directory + id: pnpm-cache + shell: bash + run: echo "STORE_PATH=$(pnpm store path)" >> $GITHUB_OUTPUT + - uses: actions/cache@v3 + name: Setup pnpm cache + with: + path: ${{ steps.pnpm-cache.outputs.STORE_PATH }} + key: ${{ runner.os }}-pnpm-store + restore-keys: | + ${{ runner.os }}-pnpm-store + - name: Install + run: pnpm i --no-frozen-lockfile --no-verify-store-integrity + + - name: Build + run: pnpm --filter @public-ui/sample-react... build + + - name: Netlify Deploy + uses: netlify/actions/cli@master + id: netlify + env: + NETLIFY_AUTH_TOKEN: ${{ secrets.NETLIFY_AUTH_TOKEN }} + NETLIFY_SITE_ID: ${{ vars.NETLIFY_SITE_ID }} + with: + args: deploy --filter=@public-ui/sample-react --alias="$GITHUB_REF_NAME" # Netlify conveniently sanitizes the alias for us. E.g. `release/1.7` becomes `release-1-7` diff --git a/.gitignore b/.gitignore index 6bd93a1901..516c4a1317 100644 --- a/.gitignore +++ b/.gitignore @@ -1,12 +1,12 @@ /.husky/ +/.idea/ +/.nx/ /license-reports/*.html /packages/**/pnpm-lock.yaml + +# in all sub folders +.DS_Store/ dist/ node_modules/ - -package-lock.json -.DS_Store -.nx/ -CHANGELOG.* *.log *.tgz diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md index e0eef0d036..32cb52c8b0 100644 --- a/CONTRIBUTING.md +++ b/CONTRIBUTING.md @@ -49,8 +49,13 @@ We work according to the Git flow: https://medium.com/android-news/gitflow-with- 6. Create a new branch for your changes 7. [Install PNPM](https://pnpm.io/installation) on you local machine 8. Install all packages with `pnpm i` -9. Navigate to the desired package in our monorepo -10. Start the project with “pnpm start” +9. Build all packages within the mono repository `pnpm -r build` +10. Navigate to the desired package in our monorepo +11. When you want to start the project navigate to `packages/components/` and run pnpm start + +### Develop new component + +Refer to [new component](docs/tutorials/NEW_COMPONENT.md) tutorial. ### Switching between branches diff --git a/docs/tutorials/NEW_COMPONENT.md b/docs/tutorials/NEW_COMPONENT.md index 1a99de03bc..bcc6e9f426 100644 --- a/docs/tutorials/NEW_COMPONENT.md +++ b/docs/tutorials/NEW_COMPONENT.md @@ -7,45 +7,49 @@ Folgende Grundprinzipien gelten für das Schreiben von Quellcode: - Auflistungen werden immer alphabetisch sortiert -- Wiederverwendete Algorithmen (z.B. Property-Validatoren) werden in statische Funktionen ausgelagert (z.B. `src/utils/validators/.ts`) +- Wiederverwendete Algorithmen (z.B. Property-Validatoren) werden in statische Funktionen ausgelagert (z.B. `packages/schema/src/validators/.ts`) - ... ## Checkliste -| Schritt | Kurzbeschreibung | -| :-----: | --------------------------------------------------------------------------------------------------------------------------------------- | -| 0 | Name im Schema hinterlegen | -| 1 | Verzeichnis anlegen
- component.tsx(optional)
- readme.md
- shadow.tsx: Komponente mit Shadow DOM
- styles.css
- types.ts | -| 2 | API spezifizieren | -| 3 | Klasse zur API implementieren
- Props
- State
- Watcher
- Initialer Hook
- Render-Methode | -| 4 | Styling anlegen | -| 5 | Beispiele in `index.html` aufnehmen | -| 6 | readme.md vervollständigen | -|. 7. | Component-Identifier in die `stencil.config.js` eintragen | -| ... | ... | -| ... | Klasse in Komponenten-Liste für Tests aufnehmen (packages/components/src/components/component-list.ts) | -| ... | Alle autogeneierten Daten zur Komponente mit einchecken | +| Schritt | Kurzbeschreibung | +|:-------:|------------------------------------------------------------------------------------------------------------------------------------------| +| 0 | Projekt starten | +| 1 | Name im Schema hinterlegen | +| 2 | Verzeichnis anlegen
- component.tsx(optional)
- readme.md
- shadow.tsx: Komponente mit Shadow DOM
- styles.css
- types.ts | +| 3 | API spezifizieren | +| 4 | Klasse zur API implementieren
- Props
- State
- Watcher
- Initialer Hook
- Render-Methode | +| 5 | Styling anlegen | +| 6 | Beispiele in `index.html` aufnehmen | +| 7 | readme.md vervollständigen | +| ... | ... | +| ... | Klasse in Komponenten-Liste für Tests aufnehmen (packages/components/src/components/component-list.ts) | +| ... | Alle autogeneierten Daten zur Komponente mit einchecken | ## Schritt 0 -Als erstes wird der **Name** der neuen Komponenten in der **Schema**-Datei (`src/schema/tag-names.ts`) hinterlegt. +Projekt starten, wie in [Contribution](../../CONTRIBUTING.md) beschrieben. -## Schritt 1 - Verzeichnis anlegen +## Schritt 1 -Eine Vorlage ist unter `/docs/tutorials/component` zu finden. Ziel: `/packages/components/src/components/[component-name]`. +Als erstes wird der **Name** der neuen Komponenten in der **Schema**-Datei (`packages/schema/tag-names.ts`) hinterlegt. + +## Schritt 2 - Verzeichnis anlegen + +Eine Vorlage ist unter `/docs/tutorials/new-component` zu finden. Ziel: `/packages/components/src/components/[component-name]`. Sofern eine Variante ohne Shadow DOM für andere Komponenten benötigt wird, ist die Komponente selbst, mit `shadow: false` anzulegen und diese Komponente in `shadow.tsx` einzubinden. Andernfalls ist die Komponente direkt mit `shadow: true` in `shadow.tsx` zu implementieren. Ziel: shadow.tsx existiert immer und liefert die Komponente mit Shadow DOM. Die `readme.md` wird automatisch bei `pnpm build` erzeugt, sollte sie bereits existieren wird der automatisch generierte Inhalt angehängt. -## Schritt 2 - API spezifizieren +## Schritt 3 - API spezifizieren Datei: `types.ts`; Inhalt: `RequiredProps`, `OptionalProps`, `RequiredStates`, `OptionalStates`, `States` und `ComponentApi` -## Schritt 3 - Klasse Implementieren +## Schritt 4 - Klasse Implementieren -Datei: `shadow.tsx` ooder/und `component.tsx`; +Datei: `shadow.tsx` oder/und `component.tsx`; Inhalt: - `@Component` (außerhalb der Klasse), @@ -55,13 +59,13 @@ Inhalt: - `public componentWillLoad()`: Initialer Hook, alle Validierungsmethoden hier aufrufen - `public render()`: Render-Methode, erstellt das HTML, das gerendert werden soll -## Schritt 4 - Styling anlegen +## Schritt 5 - Styling anlegen Datei: `styles.css`; Wichtig: `packages/components/src/components/README.md` beachten. Sofern Styling für mehrere Komponenten verwendet werden soll, Datei passend benennen und direkt unter `/packages/components/src/components/` erstellen und in styles.css importieren. -## Schritt 5 - Beispiel in index.html erstellen +## Schritt 6 - Beispiel in index.html erstellen Datei: `/packages/components/src/index.html`; Unter body > main > ol ein li mit dem Beispielcode erstellen. @@ -69,7 +73,7 @@ Aus dem Verzeichnis `/packages/components` kann mit `pnpm start` der dev-server Andere li können vorrübergehend entfernt werden, dafür ist die `index.bak.html` da. Nach Beendigung der Entwicklung ist die `index.html` zurückzusetzen, abgesehen des neuen Beispiels, welches in die `index.bak.html` ebenfalls einzufügen ist. -## Schritt 6 - readme.md vervollständigen +## Schritt 7 - readme.md vervollständigen Datei: `readme.md`; Die von `pnpm build` (in `/packages/components` ausgeführt) erzeugte `readme.md` mit sinnvollen Informationen vervollständigen. diff --git a/docs/tutorials/new-component/component.tsx b/docs/tutorials/new-component/component.tsx index e1fdb978e1..c97a02349e 100644 --- a/docs/tutorials/new-component/component.tsx +++ b/docs/tutorials/new-component/component.tsx @@ -1,12 +1,13 @@ // https://codepen.io/mbxtr/pen/OJPOYg?html-preprocessor=haml -import { Component, Host, JSX, Prop, State, Watch } from '@stencil/core'; +import type { JSX } from '@stencil/core'; +import { Component, Host, Prop, State, Watch, h } from '@stencil/core'; -import { HeadingLevel } from '../../types/heading-level'; +import type { HeadingLevel } from '@public-ui/schema'; import { nonce } from '../../utils/dev.utils'; -import { setState, watchBoolean, watchString } from '../../utils/prop.validators'; +import { setState, watchBoolean, watchString } from '@public-ui/schema'; import { watchHeadingLevel } from '../heading/validation'; -import { NewComponentAPI } from './styles'; +import type { KoliBriNewComponentCallbacks, NewComponentAPI, NewComponentStates } from './types'; /** * @class NewComponent - Ermöglicht das Stylen des äußeren Container des NewComponents. @@ -35,10 +36,11 @@ export class KolNewComponent implements NewComponentAPI {
+
{ + private toggle = (event: Event) => { this._open = !this._open; /** @@ -148,7 +149,7 @@ export class KolNewComponent implements NewComponentAPI { const timeout = setTimeout(() => { clearTimeout(timeout); if (typeof this.state._on?.onClick === 'function') { - this.state._on.onClick(event, this._open); + this.state._on.onClick(event, !!this._open); } }); }; diff --git a/docs/tutorials/new-component/readme.md b/docs/tutorials/new-component/readme.md index 5c887a50fc..1ac51dfe01 100644 --- a/docs/tutorials/new-component/readme.md +++ b/docs/tutorials/new-component/readme.md @@ -1,24 +1,31 @@ # New-Component ->kurze Beschreibung der gerenderten Komponente (nicht technisch) +> kurze Beschreibung der gerenderten Komponente (nicht technisch) ->wann diese Komponente einzusetzen ist +> wann diese Komponente einzusetzen ist ## Konstruktion ### Code ->Beispielcode, wird als Code in der Dokumentation angezeigt +> Beispielcode, wird als Code in der Dokumentation angezeigt + ```html - -
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
-
Inhalt eines Header
- + +
+ Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. + At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum + dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos + et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. +
+
Inhalt eines Header
+ ``` ### Beispiel ->Beispiel, wird gerendert; Empfehlung: selber code wie oben, eventuell mit Wrapper +> Beispiel, wird gerendert; Empfehlung: selber code wie oben, eventuell mit Wrapper +
Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
@@ -28,7 +35,7 @@ ## Verwendung ->Erläuterungen der Attribute und Slots +> Erläuterungen der Attribute und Slots ### Best practices @@ -42,12 +49,10 @@ ## Barrierefreiheit - - ### Tastatursteuerung | Taste | Funktion | -| ------- | -----------------------------------| +| ------- | ---------------------------------- | | `Tab` | Springt die einzelnen Elemente an. | | `Enter` | Tut Dinge. | @@ -55,18 +60,44 @@ - Liste von hilfreichen Links ->Der folgende Teil wird automatisch beim build generiert. Die Überschriften sind als Hilfe, was man nicht manuell einfügen muss. +> Der folgende Teil wird automatisch beim build generiert. Die Überschriften sind als Hilfe, was man nicht manuell einfügen muss. + ## Properties +| Property | Attribute | Description | Type | Default | +| ----------------------- | ---------- | --------------------------------------------------------- | ------------------------------------------------------------------------------------ | ----------- | +| `_heading` _(required)_ | `_heading` | Gibt die Überschrift des NewComponents an. | `string` | `undefined` | +| `_level` | `_level` | Gibt an, welchen H-Level von 1 bis 6 die Überschrift hat. | `0 \| 1 \| 2 \| 3 \| 4 \| 5 \| 6 \| undefined` | `1` | +| `_on` | -- | Gibt die EventCallback-Funktionen an. | `undefined \| { onClick?: EventValueOrEventCallback \| undefined; }` | `undefined` | +| `_open` | `_open` | Gibt an, ob das NewComponent geöffnet ist. | `boolean \| undefined` | `false` | + ## Slots -## Shadow Parts +| Slot | Description | +| ----------- | ------------------------------------------------------------------------------------------------------------------------------------------------------- | +| `"content"` | Ermöglicht das Einfügen beliebigen HTML's in den Inhaltsbereich des NewComponents. (wenn nur ein slot verwendet wird, kann der Name weggelassen werden) | ## Dependencies ### Depends on +- [kol-button](../button) +- [kol-heading-wc](../heading) + ### Graph +```mermaid +graph TD; + kol-new-component --> kol-button + kol-new-component --> kol-heading-wc + kol-button --> kol-button-wc + kol-button-wc --> kol-span-wc + kol-button-wc --> kol-tooltip-wc + kol-span-wc --> kol-icon + kol-tooltip-wc --> kol-span-wc + style kol-new-component stroke:#333,stroke-width:4px +``` + +--- diff --git a/docs/tutorials/new-component/style.css b/docs/tutorials/new-component/style.css index cb22ec474a..4c66ea29b7 100644 --- a/docs/tutorials/new-component/style.css +++ b/docs/tutorials/new-component/style.css @@ -9,6 +9,7 @@ /* Außer ':host' verlässt kein Selektor den shadow-DOM, diese Regel gilt also nur für Elemente innerhalb der Komponente */ * { display: flex; + flex-direction: column; } /* Komponenten sollten keine Farben oder Abstände definieren, ein Zurücksetzen auf 0 ist erlaubt. */ diff --git a/docs/tutorials/new-component/test/html.mock.ts b/docs/tutorials/new-component/test/html.mock.ts index e91f1e5699..65c823f382 100644 --- a/docs/tutorials/new-component/test/html.mock.ts +++ b/docs/tutorials/new-component/test/html.mock.ts @@ -2,9 +2,8 @@ * erzeugt die Componente als String, um es mit dem Original vergleichen zu können */ import { mixMembers } from 'stencil-awesome-test'; -import { getButtonWcHtml } from '../../button/test/html.mock'; import { getHeadingWcHtml } from '../../heading/test/html.mock'; -import { Props } from '../component'; +import { Props } from '../types'; export const getNewComponentHtml = ( props: Props, @@ -12,33 +11,23 @@ export const getNewComponentHtml = ( header?: string; content?: string; footer?: string; - } = {}, + } = {} ): string => { props = mixMembers( { _heading: '…', // ⚠ required _level: 1, }, - props, + props ); const open = props._open === true; return `
- ${getHeadingWcHtml( - { - _headline: '', - _level: props._level, - }, - { - default: `${getButtonWcHtml({ - _ariaControls: 'nonce', - _ariaExpanded: open, - _icons: `codicon codicon-${open ? 'chrome-minimize' : 'add'}`, - _label: props._heading, - })}`, - }, - )} + ${getHeadingWcHtml({ + _label: '', + _level: props._level, + })} diff --git a/docs/tutorials/new-component/test/snapshot.spec.tsx b/docs/tutorials/new-component/test/snapshot.spec.tsx index 2b125a3f09..96ae4ca888 100644 --- a/docs/tutorials/new-component/test/snapshot.spec.tsx +++ b/docs/tutorials/new-component/test/snapshot.spec.tsx @@ -3,7 +3,7 @@ import { newSpecPage, SpecPage } from '@stencil/core/testing'; import { COMPONENTS } from '../../component-list'; import { executeTests } from 'stencil-awesome-test'; -import { Props } from '../component'; +import { Props } from '../types'; import { getNewComponentHtml } from './html.mock'; executeTests( diff --git a/docs/tutorials/new-component/styles.ts b/docs/tutorials/new-component/types.ts similarity index 75% rename from docs/tutorials/new-component/styles.ts rename to docs/tutorials/new-component/types.ts index cf9a67ccf8..4b8fc08bbb 100644 --- a/docs/tutorials/new-component/styles.ts +++ b/docs/tutorials/new-component/types.ts @@ -1,9 +1,7 @@ /* Hier kommen alle Typen rein, die von der Komponente verwendet werden; 'States' und 'Props' werden in der Komponente mindestens benötigt. */ import type { Generic } from 'adopted-style-sheets'; -import { Events } from '../../enums/events'; -import { EventValueOrEventCallback } from '../../types/callbacks'; -import { HeadingLevel } from '../../types/heading-level'; +import type { HeadingLevel, EventValueOrEventCallback, Events } from '@public-ui/schema'; export type KoliBriNewComponentCallbacks = { [Events.onClick]?: EventValueOrEventCallback; @@ -25,6 +23,6 @@ export type Props = Generic.Element.Members; type RequiredStates = RequiredProps; type OptionalStates = OptionalProps; -export type States = Generic.Element.Members; +export type NewComponentStates = Generic.Element.Members; export type NewComponentAPI = Generic.Element.ComponentApi; diff --git a/lerna.json b/lerna.json index 3383deed31..921df9874a 100644 --- a/lerna.json +++ b/lerna.json @@ -30,5 +30,5 @@ "packages/tools/visual-tests" ], "useNx": true, - "version": "2.0.3" + "version": "2.0.4" } diff --git a/packages/adapters/angular/v11/package.json b/packages/adapters/angular/v11/package.json index e7c9e246d4..1cedeb07e5 100644 --- a/packages/adapters/angular/v11/package.json +++ b/packages/adapters/angular/v11/package.json @@ -1,6 +1,6 @@ { "name": "@public-ui/angular-v11", - "version": "2.0.3", + "version": "2.0.4", "license": "EUPL-1.2", "homepage": "https://public-ui.github.io", "repository": "https://github.com/public-ui/kolibri", @@ -66,7 +66,7 @@ "@angular/compiler": "11.2.14", "@angular/compiler-cli": "11.2.14", "@angular/core": "11.2.14", - "@public-ui/components": "2.0.3", + "@public-ui/components": "2.0.4", "@types/minimatch": "5.1.2", "@types/minimist": "1.2.5", "@types/node": "ts4.1", @@ -80,7 +80,7 @@ }, "peerDependencies": { "@angular/core": "^11", - "@public-ui/components": "2.0.3" + "@public-ui/components": "2.0.4" }, "files": [ "dist" diff --git a/packages/adapters/angular/v12/package.json b/packages/adapters/angular/v12/package.json index 7e050aa521..cd7c2fad83 100644 --- a/packages/adapters/angular/v12/package.json +++ b/packages/adapters/angular/v12/package.json @@ -1,6 +1,6 @@ { "name": "@public-ui/angular-v12", - "version": "2.0.3", + "version": "2.0.4", "license": "EUPL-1.2", "homepage": "https://public-ui.github.io", "repository": "https://github.com/public-ui/kolibri", @@ -66,7 +66,7 @@ "@angular/compiler": "12.2.17", "@angular/compiler-cli": "12.2.17", "@angular/core": "12.2.17", - "@public-ui/components": "2.0.3", + "@public-ui/components": "2.0.4", "@types/minimatch": "5.1.2", "@types/minimist": "1.2.5", "@types/node": "ts4.3", @@ -80,7 +80,7 @@ }, "peerDependencies": { "@angular/core": "^12", - "@public-ui/components": "2.0.3" + "@public-ui/components": "2.0.4" }, "files": [ "dist" diff --git a/packages/adapters/angular/v13/package.json b/packages/adapters/angular/v13/package.json index 64b1d33bf2..38f38698cf 100644 --- a/packages/adapters/angular/v13/package.json +++ b/packages/adapters/angular/v13/package.json @@ -1,6 +1,6 @@ { "name": "@public-ui/angular-v13", - "version": "2.0.3", + "version": "2.0.4", "license": "EUPL-1.2", "homepage": "https://public-ui.github.io", "repository": "https://github.com/public-ui/kolibri", @@ -66,7 +66,7 @@ "@angular/compiler": "13.4.0", "@angular/compiler-cli": "13.4.0", "@angular/core": "13.4.0", - "@public-ui/components": "2.0.3", + "@public-ui/components": "2.0.4", "@types/minimatch": "5.1.2", "@types/minimist": "1.2.5", "@types/node": "ts4.6", @@ -80,7 +80,7 @@ }, "peerDependencies": { "@angular/core": "^13", - "@public-ui/components": "2.0.3" + "@public-ui/components": "2.0.4" }, "files": [ "dist" diff --git a/packages/adapters/angular/v14/package.json b/packages/adapters/angular/v14/package.json index 5ff662fc9f..07fb581314 100644 --- a/packages/adapters/angular/v14/package.json +++ b/packages/adapters/angular/v14/package.json @@ -1,6 +1,6 @@ { "name": "@public-ui/angular-v14", - "version": "2.0.3", + "version": "2.0.4", "license": "EUPL-1.2", "homepage": "https://public-ui.github.io", "repository": "https://github.com/public-ui/kolibri", @@ -66,7 +66,7 @@ "@angular/compiler": "14.3.0", "@angular/compiler-cli": "14.3.0", "@angular/core": "14.3.0", - "@public-ui/components": "2.0.3", + "@public-ui/components": "2.0.4", "@types/minimatch": "5.1.2", "@types/minimist": "1.2.5", "@types/node": "ts4.8", @@ -80,7 +80,7 @@ }, "peerDependencies": { "@angular/core": "^14", - "@public-ui/components": "2.0.3" + "@public-ui/components": "2.0.4" }, "files": [ "dist" diff --git a/packages/adapters/angular/v15/package.json b/packages/adapters/angular/v15/package.json index e0d1ddfcdc..88adaf88fc 100644 --- a/packages/adapters/angular/v15/package.json +++ b/packages/adapters/angular/v15/package.json @@ -1,6 +1,6 @@ { "name": "@public-ui/angular-v15", - "version": "2.0.3", + "version": "2.0.4", "license": "EUPL-1.2", "homepage": "https://public-ui.github.io", "repository": "https://github.com/public-ui/kolibri", @@ -66,7 +66,7 @@ "@angular/compiler": "15.2.10", "@angular/compiler-cli": "15.2.10", "@angular/core": "15.2.10", - "@public-ui/components": "2.0.3", + "@public-ui/components": "2.0.4", "@types/minimatch": "5.1.2", "@types/minimist": "1.2.5", "@types/node": "ts4.9", @@ -80,7 +80,7 @@ }, "peerDependencies": { "@angular/core": "^15", - "@public-ui/components": "2.0.3" + "@public-ui/components": "2.0.4" }, "files": [ "dist" diff --git a/packages/adapters/angular/v16/package.json b/packages/adapters/angular/v16/package.json index ae4fc5e516..d60d46a2ba 100644 --- a/packages/adapters/angular/v16/package.json +++ b/packages/adapters/angular/v16/package.json @@ -1,6 +1,6 @@ { "name": "@public-ui/angular-v16", - "version": "2.0.3", + "version": "2.0.4", "license": "EUPL-1.2", "homepage": "https://public-ui.github.io", "repository": "https://github.com/public-ui/kolibri", @@ -66,7 +66,7 @@ "@angular/compiler": "16.2.12", "@angular/compiler-cli": "16.2.12", "@angular/core": "16.2.12", - "@public-ui/components": "2.0.3", + "@public-ui/components": "2.0.4", "@types/minimatch": "5.1.2", "@types/minimist": "1.2.5", "@types/node": "ts5.1", @@ -80,7 +80,7 @@ }, "peerDependencies": { "@angular/core": "^16", - "@public-ui/components": "2.0.3" + "@public-ui/components": "2.0.4" }, "files": [ "dist" diff --git a/packages/adapters/angular/v17/package.json b/packages/adapters/angular/v17/package.json index 155db20002..9a65b10c6e 100644 --- a/packages/adapters/angular/v17/package.json +++ b/packages/adapters/angular/v17/package.json @@ -1,6 +1,6 @@ { "name": "@public-ui/angular-v17", - "version": "2.0.3", + "version": "2.0.4", "license": "EUPL-1.2", "homepage": "https://public-ui.github.io", "repository": "https://github.com/public-ui/kolibri", @@ -66,7 +66,7 @@ "@angular/compiler": "17.1.1", "@angular/compiler-cli": "17.1.1", "@angular/core": "17.1.1", - "@public-ui/components": "2.0.3", + "@public-ui/components": "2.0.4", "@types/minimatch": "5.1.2", "@types/minimist": "1.2.5", "@types/node": "ts5.2", @@ -80,7 +80,7 @@ }, "peerDependencies": { "@angular/core": "^17", - "@public-ui/components": "2.0.3" + "@public-ui/components": "2.0.4" }, "files": [ "dist" diff --git a/packages/adapters/hydrate/package.json b/packages/adapters/hydrate/package.json index 40856986fc..f79f3fb08f 100644 --- a/packages/adapters/hydrate/package.json +++ b/packages/adapters/hydrate/package.json @@ -1,6 +1,6 @@ { "name": "@public-ui/hydrate", - "version": "2.0.3", + "version": "2.0.4", "license": "EUPL-1.2", "homepage": "https://public-ui.github.io", "repository": "https://github.com/public-ui/kolibri", @@ -46,11 +46,11 @@ "prepack": "npm run build" }, "devDependencies": { - "@public-ui/components": "2.0.3", + "@public-ui/components": "2.0.4", "rimraf": "3.0.2" }, "peerDependencies": { - "@public-ui/components": "2.0.3" + "@public-ui/components": "2.0.4" }, "sideEffects": false, "type": "commonjs", diff --git a/packages/adapters/preact/package.json b/packages/adapters/preact/package.json index 5fb4757394..d974bc2175 100644 --- a/packages/adapters/preact/package.json +++ b/packages/adapters/preact/package.json @@ -1,6 +1,6 @@ { "name": "@public-ui/preact", - "version": "2.0.3", + "version": "2.0.4", "license": "EUPL-1.2", "homepage": "https://public-ui.github.io", "repository": "https://github.com/public-ui/kolibri", @@ -46,10 +46,10 @@ "prepack": "unbuild" }, "dependencies": { - "@public-ui/react": "2.0.3" + "@public-ui/react": "2.0.4" }, "devDependencies": { - "@public-ui/components": "2.0.3", + "@public-ui/components": "2.0.4", "react": "18.2.0", "react-dom": "18.2.0", "typescript": "5.3.3", diff --git a/packages/adapters/react-standalone/kolibri-rock's.html b/packages/adapters/react-standalone/kolibri-rock's.html index 5ffd781ed5..7fffe1b0dc 100644 --- a/packages/adapters/react-standalone/kolibri-rock's.html +++ b/packages/adapters/react-standalone/kolibri-rock's.html @@ -10,8 +10,8 @@ - - + + @@ -23,7 +23,7 @@
diff --git a/packages/adapters/react-standalone/package.json b/packages/adapters/react-standalone/package.json index cef77e46ad..90b4af9d5a 100644 --- a/packages/adapters/react-standalone/package.json +++ b/packages/adapters/react-standalone/package.json @@ -1,6 +1,6 @@ { "name": "@public-ui/react-standalone", - "version": "2.0.3", + "version": "2.0.4", "license": "EUPL-1.2", "homepage": "https://public-ui.github.io", "repository": "https://github.com/public-ui/kolibri", @@ -47,12 +47,12 @@ "prepack": "pnpm build" }, "devDependencies": { - "@public-ui/react": "2.0.3", + "@public-ui/react": "2.0.4", "cpy-cli": "5.0.0", "rimraf": "3.0.2" }, "peerDependencies": { - "@public-ui/components": "2.0.3", + "@public-ui/components": "2.0.4", "react": ">=16.14.0", "react-dom": ">=16.14.0" }, diff --git a/packages/adapters/react/package.json b/packages/adapters/react/package.json index c0b0089d0f..8978378437 100644 --- a/packages/adapters/react/package.json +++ b/packages/adapters/react/package.json @@ -1,6 +1,6 @@ { "name": "@public-ui/react", - "version": "2.0.3", + "version": "2.0.4", "license": "EUPL-1.2", "homepage": "https://public-ui.github.io", "repository": "https://github.com/public-ui/kolibri", @@ -46,7 +46,7 @@ "prepack": "unbuild" }, "devDependencies": { - "@public-ui/components": "2.0.3", + "@public-ui/components": "2.0.4", "@types/minimatch": "5.1.2", "@types/minimist": "1.2.5", "@types/node": "ts5.3", @@ -59,7 +59,7 @@ "unbuild": "1.2.1" }, "peerDependencies": { - "@public-ui/components": "2.0.3", + "@public-ui/components": "2.0.4", "react": ">=16.14.0", "react-dom": ">=16.14.0" }, diff --git a/packages/adapters/solid/package.json b/packages/adapters/solid/package.json index 793173d888..1557bfce3a 100644 --- a/packages/adapters/solid/package.json +++ b/packages/adapters/solid/package.json @@ -1,6 +1,6 @@ { "name": "@public-ui/solid", - "version": "2.0.3", + "version": "2.0.4", "license": "EUPL-1.2", "homepage": "https://public-ui.github.io", "repository": "https://github.com/public-ui/kolibri", @@ -46,7 +46,7 @@ "prepack": "unbuild" }, "devDependencies": { - "@public-ui/components": "2.0.3", + "@public-ui/components": "2.0.4", "@types/minimatch": "5.1.2", "@types/minimist": "1.2.5", "@types/node": "ts5.3", @@ -56,7 +56,7 @@ "unbuild": "1.2.1" }, "peerDependencies": { - "@public-ui/components": "2.0.3", + "@public-ui/components": "2.0.4", "solid-js": ">=1.2.0" }, "sideEffects": false, diff --git a/packages/adapters/vue/package.json b/packages/adapters/vue/package.json index b0722dcef7..e1beddbcbf 100644 --- a/packages/adapters/vue/package.json +++ b/packages/adapters/vue/package.json @@ -1,6 +1,6 @@ { "name": "@public-ui/vue", - "version": "2.0.3", + "version": "2.0.4", "license": "EUPL-1.2", "homepage": "https://public-ui.github.io", "repository": "https://github.com/public-ui/kolibri", @@ -47,7 +47,7 @@ }, "devDependencies": { "@babel/types": "7.23.6", - "@public-ui/components": "2.0.3", + "@public-ui/components": "2.0.4", "@types/minimatch": "5.1.2", "@types/minimist": "1.2.5", "@types/node": "ts5.3", @@ -57,7 +57,7 @@ "vue": "3.4.15" }, "peerDependencies": { - "@public-ui/components": "2.0.3", + "@public-ui/components": "2.0.4", "vue": ">=3" }, "sideEffects": false, diff --git a/packages/components/package.json b/packages/components/package.json index 89c18a4236..a3dac62026 100644 --- a/packages/components/package.json +++ b/packages/components/package.json @@ -1,6 +1,6 @@ { "name": "@public-ui/components", - "version": "2.0.3", + "version": "2.0.4", "license": "EUPL-1.2", "homepage": "https://public-ui.github.io", "repository": "https://github.com/public-ui/kolibri", @@ -68,7 +68,7 @@ }, "dependencies": { "@floating-ui/dom": "1.5.4", - "@public-ui/schema": "2.0.3", + "@public-ui/schema": "2.0.4", "adopted-style-sheets": "1.1.3", "i18next": "23.7.19", "markdown-it": "13.0.2" diff --git a/packages/components/src/components.d.ts b/packages/components/src/components.d.ts index 35b008a06a..68b2db85ee 100644 --- a/packages/components/src/components.d.ts +++ b/packages/components/src/components.d.ts @@ -1844,9 +1844,13 @@ export namespace Components { */ "_collapsible"?: boolean; /** - * Gibt an, ob die Navigation eine zusätzliche Schaltfläche zum Aus- und Einklappen der Navigation anzeigen soll. + * Creates a button below the navigation, that toggles _collapsible. Only available for _orientation="vertical". */ "_hasCompactButton"?: boolean; + /** + * Shows icons next to the navigation item labels, even when the navigation is not collapsed. + */ + "_hasIconsWhenExpanded"?: boolean; /** * Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. * @TODO : Change type back to `HideLabelPropType` after Stencil#4663 has been resolved. @@ -4621,9 +4625,13 @@ declare namespace LocalJSX { */ "_collapsible"?: boolean; /** - * Gibt an, ob die Navigation eine zusätzliche Schaltfläche zum Aus- und Einklappen der Navigation anzeigen soll. + * Creates a button below the navigation, that toggles _collapsible. Only available for _orientation="vertical". */ "_hasCompactButton"?: boolean; + /** + * Shows icons next to the navigation item labels, even when the navigation is not collapsed. + */ + "_hasIconsWhenExpanded"?: boolean; /** * Hides the caption by default and displays the caption text with a tooltip when the interactive element is focused or the mouse is over it. * @TODO : Change type back to `HideLabelPropType` after Stencil#4663 has been resolved. diff --git a/packages/components/src/components/accordion/style.css b/packages/components/src/components/accordion/style.css index 6681a6fc12..df3fcb2d76 100644 --- a/packages/components/src/components/accordion/style.css +++ b/packages/components/src/components/accordion/style.css @@ -29,7 +29,16 @@ .wrapper { transition-duration: 0s; } - } /* + } + + /* @see https://github.com/public-ui/kolibri/issues/5952 */ + @media print { + .accordion:not(.open) .animation-wrapper { + display: none; + } + } + + /* * Inside a button, the caption text is always centered. * So we have to align the text to the left. */ diff --git a/packages/components/src/components/form/component.tsx b/packages/components/src/components/form/component.tsx index d0c835d33c..e532210f4e 100644 --- a/packages/components/src/components/form/component.tsx +++ b/packages/components/src/components/form/component.tsx @@ -13,6 +13,8 @@ import type { ErrorListPropType, FormAPI, FormStates, KoliBriFormCallbacks, Stri shadow: true, }) export class KolForm implements FormAPI { + errorListElement?: HTMLElement; + private readonly onSubmit = (event: Event) => { event.preventDefault(); event.stopPropagation(); @@ -51,7 +53,14 @@ export class KolForm implements FormAPI {
    {this._errorList.map((error, index) => (
  • - + { + if (index === 0) this.errorListElement = el as HTMLElement; + }} + />
    • ))}
@@ -118,4 +127,10 @@ export class KolForm implements FormAPI { this.validateRequiredText(this._requiredText); this.validateErrorList(this._errorList); } + + public componentDidRender() { + if (this._errorList && this._errorList.length > 0) { + this.errorListElement?.focus(); + } + } } diff --git a/packages/components/src/components/link/readme.md b/packages/components/src/components/link/readme.md index 1a081f5dfa..45418ce251 100644 --- a/packages/components/src/components/link/readme.md +++ b/packages/components/src/components/link/readme.md @@ -2,9 +2,6 @@ Die **Link**-Komponente rendert einen auf Barrierefreiheit optimierten Link, der als Text, als Icon oder auch in Kombination ausgegeben werden kann. -Beachten Sie, dass die Komponente automatisch ein Padding links und rechts zum umgebenden Text erzeugt. Sie kann daher im Fließtext ohne -Eingabe von Leerzeichen eingefügt werden. Zusätzliche Leerzeichen vergrößern den Abstand zum umgebenden Text. - ## Konstruktion ### Code diff --git a/packages/components/src/components/nav/component.tsx b/packages/components/src/components/nav/component.tsx index c1a0f1c21e..d7656b69b6 100644 --- a/packages/components/src/components/nav/component.tsx +++ b/packages/components/src/components/nav/component.tsx @@ -15,6 +15,7 @@ import { devWarning, validateCollapsible, validateHasCompactButton, + validateHasIconsWhenExpanded, validateHideLabel, validateLabel, watchValidator, @@ -81,7 +82,10 @@ export class KolNav implements NavAPI { link: ButtonOrLinkOrTextWithChildrenProps, expanded: boolean ): JSX.Element { - const icons = link._icons || (this.state._hideLabel ? 'codicon codicon-primitive-square' : undefined); + const icons = + this.state._hasIconsWhenExpanded || this.state._hideLabel + ? link._icons || (this.state._hideLabel ? 'codicon codicon-symbol-method' : undefined) + : undefined; return (
@@ -237,10 +241,15 @@ export class KolNav implements NavAPI { @Prop() public _collapsible?: boolean = true; /** - * Gibt an, ob die Navigation eine zusätzliche Schaltfläche zum Aus- und Einklappen der Navigation anzeigen soll. + * Creates a button below the navigation, that toggles _collapsible. Only available for _orientation="vertical". */ @Prop() public _hasCompactButton?: boolean = false; + /** + * Shows icons next to the navigation item labels, even when the navigation is not collapsed. + */ + @Prop() public _hasIconsWhenExpanded?: boolean = false; + /** * Hides the caption by default and displays the caption text with a tooltip when the * interactive element is focused or the mouse is over it. @@ -266,6 +275,7 @@ export class KolNav implements NavAPI { @State() public state: NavStates = { _collapsible: true, _hasCompactButton: false, + _hasIconsWhenExpanded: false, _hideLabel: false, _label: '', // ⚠ required _links: [], @@ -283,6 +293,11 @@ export class KolNav implements NavAPI { validateHasCompactButton(this, value); } + @Watch('_hasIconsWhenExpanded') + public validateHasIconsWhenExpanded(value?: boolean): void { + validateHasIconsWhenExpanded(this, value); + } + @Watch('_hideLabel') public validateHideLabel(value?: HideLabelPropType) { validateHideLabel(this, value); @@ -324,6 +339,7 @@ export class KolNav implements NavAPI { this.validateCollapsible(this._collapsible); this.validateHideLabel(this._hideLabel); this.validateHasCompactButton(this._hasCompactButton); + this.validateHasIconsWhenExpanded(this._hasIconsWhenExpanded); this.validateLabel(this._label, undefined, true); this.validateLinks(this._links); this.validateOrientation(this._orientation); diff --git a/packages/components/src/components/nav/readme.md b/packages/components/src/components/nav/readme.md index c1073d1514..caca207a29 100644 --- a/packages/components/src/components/nav/readme.md +++ b/packages/components/src/components/nav/readme.md @@ -18,17 +18,30 @@ noch die Icons ausgegeben. ``` diff --git a/packages/components/src/components/pagination/component.tsx b/packages/components/src/components/pagination/component.tsx index 444b5ead06..a62364c72d 100644 --- a/packages/components/src/components/pagination/component.tsx +++ b/packages/components/src/components/pagination/component.tsx @@ -298,13 +298,17 @@ export class KolPagination implements PaginationAPI { exportparts="icon" key={`${this.nonce}-${page}`} _customClass={this.state._customClass} - _label={`${page}`} + _label="" _on={{ onClick: (event: Event) => { this.onClick(event, page); }, }} - > + > + + {page} + + ); } @@ -312,7 +316,11 @@ export class KolPagination implements PaginationAPI { private getSelectedPageButton(page: number): JSX.Element { return (
  • - + + + {page} + +
    • ); } diff --git a/packages/components/src/components/textarea/component.tsx b/packages/components/src/components/textarea/component.tsx index d9cc6fbe5a..f231d37e76 100644 --- a/packages/components/src/components/textarea/component.tsx +++ b/packages/components/src/components/textarea/component.tsx @@ -395,7 +395,7 @@ export class KolTextarea implements TextareaAPI { public componentDidLoad(): void { setTimeout(() => { - if (this.ref instanceof HTMLTextAreaElement) { + if (this.ref /* SSR instanceof HTMLTextAreaElement */) { this._rows = this.state?._rows && this.state._rows > increaseTextareaHeight(this.ref) ? this.state._rows : increaseTextareaHeight(this.ref); } }, 0); diff --git a/packages/components/src/components/tooltip/component.tsx b/packages/components/src/components/tooltip/component.tsx index 3b627491f6..e8d13a6720 100644 --- a/packages/components/src/components/tooltip/component.tsx +++ b/packages/components/src/components/tooltip/component.tsx @@ -1,12 +1,12 @@ import { autoUpdate } from '@floating-ui/dom'; +import type { AccessKeyPropType, AlignPropType, IdPropType, LabelPropType, TooltipAPI, TooltipStates } from '@public-ui/schema'; import { getDocument, validateAccessKey, validateAlign, validateId, validateLabel } from '@public-ui/schema'; +import type { JSX } from '@stencil/core'; import { Component, Element, h, Host, Prop, State, Watch } from '@stencil/core'; import { alignFloatingElements } from '../../utils/align-floating-elements'; import { hideOverlay, showOverlay } from '../../utils/overlay'; -import type { AccessKeyPropType, AlignPropType, IdPropType, LabelPropType, TooltipAPI, TooltipStates } from '@public-ui/schema'; -import type { JSX } from '@stencil/core'; @Component({ tag: 'kol-tooltip-wc', styleUrl: './style.css', @@ -18,6 +18,8 @@ export class KolTooltip implements TooltipAPI { private arrowElement?: HTMLDivElement; private previousSibling?: Element | null; private tooltipElement?: HTMLDivElement; + private hasFocusIn = false; + private hasMouseIn = false; private cleanupAutoPositioning?: () => void; @@ -65,22 +67,35 @@ export class KolTooltip implements TooltipAPI { } }; + private handleMouseEnter() { + this.hasMouseIn = true; + this.showOrHideTooltip(); + } + private handleMouseleave() { + this.hasMouseIn = false; + this.showOrHideTooltip(); + } + private handleFocusIn() { + this.hasFocusIn = true; + this.showOrHideTooltip(); + } + private handleFocusout() { + this.hasFocusIn = false; + this.showOrHideTooltip(); + } + private addListeners = (el: Element): void => { - el.addEventListener('mouseover', this.incrementOverFocusCount); - el.addEventListener('focus', this.incrementOverFocusCount); - el.addEventListener('focusin', this.incrementOverFocusCount); - el.addEventListener('mouseout', this.decrementOverFocusCount); - el.addEventListener('blur', this.decrementOverFocusCount); - el.addEventListener('focusout', this.decrementOverFocusCount); + el.addEventListener('mouseenter', this.handleMouseEnter.bind(this)); + el.addEventListener('mouseleave', this.handleMouseleave.bind(this)); + el.addEventListener('focusin', this.handleFocusIn.bind(this)); + el.addEventListener('focusout', this.handleFocusout.bind(this)); }; private removeListeners = (el: Element): void => { - el.removeEventListener('mouseover', this.incrementOverFocusCount); - el.removeEventListener('focus', this.incrementOverFocusCount); - el.removeEventListener('focusin', this.incrementOverFocusCount); - el.removeEventListener('mouseout', this.decrementOverFocusCount); - el.removeEventListener('blur', this.decrementOverFocusCount); - el.addEventListener('focusout', this.decrementOverFocusCount); + el.removeEventListener('mouseenter', this.handleMouseEnter.bind(this)); + el.removeEventListener('mouseleave', this.handleMouseleave.bind(this)); + el.removeEventListener('focusin', this.handleFocusIn.bind(this)); + el.removeEventListener('focusout', this.handleFocusout.bind(this)); }; private resyncListeners = (last?: Element | null, next?: Element | null, replacePreviousSibling = false): void => { @@ -165,24 +180,12 @@ export class KolTooltip implements TooltipAPI { }); } - private overFocusCount = 0; private overFocusTimeout?: ReturnType; - private incrementOverFocusCount = (): void => { - this.overFocusCount++; - this.showOrHideTooltip(); - }; - - private decrementOverFocusCount = (): void => { - this.overFocusCount--; - this.showOrHideTooltip(); - }; - private showOrHideTooltip = (): void => { clearTimeout(this.overFocusTimeout); this.overFocusTimeout = setTimeout(() => { - clearTimeout(this.overFocusTimeout); - if (this.overFocusCount > 0) { + if (this.hasMouseIn || this.hasFocusIn) { this.showTooltip(); } else { this.hideTooltip(); @@ -204,7 +207,6 @@ export class KolTooltip implements TooltipAPI { public connectedCallback(): void { this.previousSibling = this.host?.previousElementSibling; - this.handleEventListeners(); } public componentDidRender(): void { diff --git a/packages/components/src/index.html b/packages/components/src/index.html index c5cd0b5708..06a5363fda 100644 --- a/packages/components/src/index.html +++ b/packages/components/src/index.html @@ -238,7 +238,7 @@
    - +
    @@ -2188,8 +2188,8 @@
    - - + +
    diff --git a/packages/components/src/locales/de.ts b/packages/components/src/locales/de.ts index 1aa7067a7b..c1513cde4c 100644 --- a/packages/components/src/locales/de.ts +++ b/packages/components/src/locales/de.ts @@ -19,6 +19,7 @@ export default { 'page-next': 'Eine Seite weiter', 'page-last': 'Direkt zur letzten Seite', 'entries-per-site': 'Einträge pro Seite', + page: 'Seite', 'page-current': 'Seite {{page}}', 'page-selected': 'Seite {{page}} ist ausgewählt', 'page-per-site': '{{entries}} Einträge pro Seite', diff --git a/packages/components/src/locales/en.ts b/packages/components/src/locales/en.ts index 0445b00509..68f8208d29 100644 --- a/packages/components/src/locales/en.ts +++ b/packages/components/src/locales/en.ts @@ -19,6 +19,7 @@ export default { 'page-next': 'One page further', 'page-last': 'Directly to the last page', 'entries-per-site': 'Entries per page', + page: 'Page', 'page-current': 'Page {{page}}', 'page-selected': 'Page {{page}} is selected', 'page-per-site': '{{entries}} entries per page', diff --git a/packages/components/src/utils/dev.utils.ts b/packages/components/src/utils/dev.utils.ts index 267f4436fb..7c7c22dea6 100644 --- a/packages/components/src/utils/dev.utils.ts +++ b/packages/components/src/utils/dev.utils.ts @@ -144,7 +144,7 @@ export const initKoliBri = (): void => { | . ' | .-. | | | ,--. | .-. \\ | .--' ,--. | |\\ \\ | '-' | | | | | | '--' / | | | | \`--' \`--´ \`---´ \`--' \`--' \`------´ \`--' \`--' - 🚹 The accessible HTML-Standard | 👉 https://public-ui.github.io | 2.0.3 + 🚹 The accessible HTML-Standard | 👉 https://public-ui.github.io | 2.0.4 `, { forceLog: true, diff --git a/packages/create-kolibri/package.json b/packages/create-kolibri/package.json index b38d1f2206..5ee24aed3f 100644 --- a/packages/create-kolibri/package.json +++ b/packages/create-kolibri/package.json @@ -1,6 +1,6 @@ { "name": "create-kolibri", - "version": "2.0.3", + "version": "2.0.4", "license": "EUPL-1.2", "homepage": "https://public-ui.github.io", "repository": "https://github.com/public-ui/kolibri", diff --git a/packages/create-kolibri/templates/angular-app/package.json b/packages/create-kolibri/templates/angular-app/package.json index 2805992887..9d13bbbe36 100644 --- a/packages/create-kolibri/templates/angular-app/package.json +++ b/packages/create-kolibri/templates/angular-app/package.json @@ -29,9 +29,9 @@ "@angular/forms": "16.2.2", "@angular/platform-browser": "16.2.2", "@angular/platform-browser-dynamic": "16.2.2", - "@public-ui/angular-v16": "2.0.3", - "@public-ui/components": "2.0.3", - "@public-ui/themes": "2.0.3", + "@public-ui/angular-v16": "2.0.4", + "@public-ui/components": "2.0.4", + "@public-ui/themes": "2.0.4", "zone.js": "0.13.1" }, "devDependencies": { diff --git a/packages/create-kolibri/templates/astro-app/package.json b/packages/create-kolibri/templates/astro-app/package.json index 6d93dda413..c23e50a133 100644 --- a/packages/create-kolibri/templates/astro-app/package.json +++ b/packages/create-kolibri/templates/astro-app/package.json @@ -26,16 +26,16 @@ "@astrojs/react": "1.2.2", "@astrojs/preact": "1.2.0", "@leanup/stack": "1.3.39", - "@public-ui/components": "2.0.3", - "@public-ui/react": "2.0.3", - "@public-ui/themes": "2.0.3", + "@public-ui/components": "2.0.4", + "@public-ui/react": "2.0.4", + "@public-ui/themes": "2.0.4", "@types/react": "18.0.26", "@types/node": "18.11.17", "@types/react-dom": "18.0.9", "astro": "1.7.2", "chromedriver": "118.0.1", "cpy-cli": "5.0.0", - "nightwatch-axe-verbose": "2.0.3", + "nightwatch-axe-verbose": "2.0.4", "npm-check-updates": "16.6.0", "npm-run-all": "4.1.5", "preact": "10.11.3", diff --git a/packages/create-kolibri/templates/astro-app/src/layouts/MainLayout.astro b/packages/create-kolibri/templates/astro-app/src/layouts/MainLayout.astro index 414fd03bc5..58af09d537 100644 --- a/packages/create-kolibri/templates/astro-app/src/layouts/MainLayout.astro +++ b/packages/create-kolibri/templates/astro-app/src/layouts/MainLayout.astro @@ -21,9 +21,9 @@ import Search from '../components/Search';