db-ui · mfranzke · Aug 6, 2024 · Aug 6, 2024 · Aug 6, 2024 · Aug 6, 2024
@@ -30,15 +30,15 @@
   },
   "devDependencies": {
     "@angular-devkit/build-angular": "17.3.8",
-    "@angular/animations": "^17.3.11",
+    "@angular/animations": "^17.3.12",
     "@angular/cli": "17.3.8",
-    "@angular/common": "^17.3.11",
-    "@angular/compiler": "^17.3.11",
-    "@angular/compiler-cli": "17.3.11",
-    "@angular/core": "^17.3.11",
-    "@angular/forms": "^17.3.11",
-    "@angular/platform-browser": "^17.3.11",
-    "@angular/platform-browser-dynamic": "^17.3.11",
+    "@angular/common": "^17.3.12",
+    "@angular/compiler": "^17.3.12",
+    "@angular/compiler-cli": "17.3.12",
+    "@angular/core": "^17.3.12",
+    "@angular/forms": "^17.3.12",
+    "@angular/platform-browser": "^17.3.12",
+    "@angular/platform-browser-dynamic": "^17.3.12",
     "@rollup/plugin-commonjs": "26.0.1",
     "@rollup/plugin-json": "6.1.0",
     "@rollup/plugin-node-resolve": "15.2.3",

@@ -2,8 +2,8 @@
   "name": "lib",
   "version": "0.0.1",
   "peerDependencies": {
-    "@angular/common": "^17.3.11",
-    "@angular/core": "^17.3.11"
+    "@angular/common": "^17.3.12",
+    "@angular/core": "^17.3.12"
   },
   "dependencies": {
     "tslib": "^2.6.3"

@@ -45,7 +45,7 @@
     "puppeteer": "^22.12.1"
   },
   "dependencies": {
-    "@db-ui/core": "^2.22.0"
+    "@db-ui/core": "^3.0.0"
   },
   "license": "Apache-2.0",
   "publishConfig": {

@@ -1,3 +1,4 @@
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
 import { Component, Host, h, Prop } from '@stencil/core';
 import { uuid } from '../../utils/utils';
 
@@ -75,12 +76,7 @@ export class DbChip {
           name={this.name}
           checked={this.selected}
         />
-        <label
-          htmlFor={this.input_id}
-          role="button"
-          aria-hidden="true"
-          data-variant={this.variant}
-        >
+        <label htmlFor={this.input_id} data-variant={this.variant}>
           {this.icon ? <db-icon variant="20-outline" icon={this.icon} /> : null}
           <slot />
           {this.iconafter ? (

@@ -9,22 +9,22 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "17.3.11",
-    "@angular/common": "17.3.11",
-    "@angular/compiler": "17.3.11",
-    "@angular/core": "17.3.11",
-    "@angular/forms": "17.3.11",
-    "@angular/platform-browser": "17.3.11",
-    "@angular/platform-browser-dynamic": "17.3.11",
-    "@angular/router": "17.3.11",
+    "@angular/animations": "17.3.12",
+    "@angular/common": "17.3.12",
+    "@angular/compiler": "17.3.12",
+    "@angular/core": "17.3.12",
+    "@angular/forms": "17.3.12",
+    "@angular/platform-browser": "17.3.12",
+    "@angular/platform-browser-dynamic": "17.3.12",
+    "@angular/router": "17.3.12",
     "rxjs": "7.8.1",
     "tslib": "2.6.3",
     "zone.js": "0.14.8"
   },
   "devDependencies": {
     "@angular-devkit/build-angular": "17.3.8",
     "@angular/cli": "17.3.8",
-    "@angular/compiler-cli": "17.3.11",
+    "@angular/compiler-cli": "17.3.12",
     "injection-js": "2.4.0",
     "rxjs": "7.8.1",
     "typescript": "5.4.5"

diff --git a/packages/db-ui-elements-stencil/src/components/db-breadcrumb/db-breadcrumb.tsx b/packages/db-ui-elements-stencil/src/components/db-breadcrumb/db-breadcrumb.tsx
  /**
   * an optional [`aria-label`-attribute](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label)
   */
  @Prop({ reflect: true }) arialabel: string;
  private compData: DbLinkType[];

  private hasItemsWrapper: boolean;
diff --git a/packages/db-ui-elements-stencil/src/components/db-button/db-button.tsx b/packages/db-ui-elements-stencil/src/components/db-button/db-button.tsx
  /**
   * If the button controls a grouping of other elements, the ariaexpanded state indicates whether the controlled grouping is currently expanded or collapsed.
   */
  @Prop({ reflect: true }) ariaexpanded?: 'true' | 'false' = null;

  /**
   * Defines the button as a toggle button. The value of aria-pressed describes the state of the button.
   */
  @Prop({ reflect: true }) ariapressed?: 'true' | 'false' = null;

  /**
   * The disabled attribute can be set to keep a user from clicking on the button.
diff --git a/packages/db-ui-elements-stencil/src/components/db-checkbox/db-checkbox.tsx b/packages/db-ui-elements-stencil/src/components/db-checkbox/db-checkbox.tsx
  /**
   * The autofocus content attribute allows the author to indicate that a control is to be focused as soon as the page is loaded, allowing the user to just start typing without having to manually focus the main control.
   */
  @Prop({ reflect: true }) autofocus: boolean;

  /**
   * The checked content attribute is a boolean attribute that gives the default checkedness of the input element.
diff --git a/packages/db-ui-elements-stencil/src/components/db-input/db-input.tsx b/packages/db-ui-elements-stencil/src/components/db-input/db-input.tsx
  /**
   * The ariainvalid attribute is used to indicate that the value entered into an input field does not conform to the format expected by the application.
   */
  @Prop({ reflect: true }) ariainvalid?:
    | 'false'
    | 'grammar'
    | 'spelling'
  /**
   * The ariarequired attribute can be applied to a form element, to indicate to an AT that it is required to complete the form.
   */
  @Prop({ reflect: true }) ariarequired?: 'false' | 'true' = null;

  /**
   * User agents sometimes have features for helping users fill forms in, for example prefilling the user's address based on earlier user input.
  /**
   * The autofocus content attribute allows the author to indicate that a control is to be focused as soon as the page is loaded, allowing the user to just start typing without having to manually focus the main control.
   */
  @Prop({ reflect: true }) autofocus = false;

  /**
   * The description attribute specifies the description/hint of the input.
diff --git a/packages/db-ui-elements-stencil/src/components/db-notification/db-notifications.tsx b/packages/db-ui-elements-stencil/src/components/db-notification/db-notifications.tsx
   * out the notification if set to "assertive", while it will wait for the
   * user's idleness when set to "polite"
   */
  @Prop({ reflect: true }) arialive: 'assertive' | 'polite' = 'polite';

  /**
   * Notifications have two variants ("hovering" and "alert") which change the styling.
diff --git a/packages/db-ui-elements-stencil/src/components/db-pagination/db-pagination.tsx b/packages/db-ui-elements-stencil/src/components/db-pagination/db-pagination.tsx
   * The arialabel attribute is a string attribute and defines the text
   * content of the aria-label in the pagination.
   */
  @Prop({ reflect: true }) arialabel = 'Pagination';

  /**
   * Optional id for the caption aria label - otherwise random id will be set
diff --git a/packages/db-ui-elements-stencil/src/components/db-radio/db-radio.tsx b/packages/db-ui-elements-stencil/src/components/db-radio/db-radio.tsx
  /**
   * The autofocus content attribute allows the author to indicate that a control is to be focused as soon as the page is loaded, allowing the user to just start typing without having to manually focus the main control.
   */
  @Prop({ reflect: true }) autofocus: boolean;

  /**
   * The checked content attribute is a boolean attribute that gives the default checkedness of the input element.
	/**
	* an optional [`aria-label`-attribute](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-label)
	*/
	@Prop({ reflect: true }) arialabel: string;
Check warning on line 27 in packages/db-ui-elements-stencil/src/components/db-breadcrumb/db-breadcrumb.tsx GitHub Actions / validate / Lint `The @prop name "arialabel conflicts with a key in the HTMLElement prototype. Please choose a different name`
	private compData: DbLinkType[];

	private hasItemsWrapper: boolean;
	/**
	* If the button controls a grouping of other elements, the ariaexpanded state indicates whether the controlled grouping is currently expanded or collapsed.
	*/
	@Prop({ reflect: true }) ariaexpanded?: 'true' \| 'false' = null;
Check warning on line 11 in packages/db-ui-elements-stencil/src/components/db-button/db-button.tsx GitHub Actions / validate / Lint `The @prop name "ariaexpanded conflicts with a key in the HTMLElement prototype. Please choose a different name`

	/**
	* Defines the button as a toggle button. The value of aria-pressed describes the state of the button.
	*/
	@Prop({ reflect: true }) ariapressed?: 'true' \| 'false' = null;
Check warning on line 16 in packages/db-ui-elements-stencil/src/components/db-button/db-button.tsx GitHub Actions / validate / Lint `The @prop name "ariapressed conflicts with a key in the HTMLElement prototype. Please choose a different name`

	/**
	* The disabled attribute can be set to keep a user from clicking on the button.
	/**
	* The autofocus content attribute allows the author to indicate that a control is to be focused as soon as the page is loaded, allowing the user to just start typing without having to manually focus the main control.
	*/
	@Prop({ reflect: true }) autofocus: boolean;
Check warning on line 17 in packages/db-ui-elements-stencil/src/components/db-checkbox/db-checkbox.tsx GitHub Actions / validate / Lint `The @prop name "autofocus conflicts with a key in the HTMLElement prototype. Please choose a different name`

	/**
	* The checked content attribute is a boolean attribute that gives the default checkedness of the input element.
	/**
	* The ariainvalid attribute is used to indicate that the value entered into an input field does not conform to the format expected by the application.
	*/
	@Prop({ reflect: true }) ariainvalid?:
Check warning on line 15 in packages/db-ui-elements-stencil/src/components/db-input/db-input.tsx GitHub Actions / validate / Lint `The @prop name "ariainvalid conflicts with a key in the HTMLElement prototype. Please choose a different name`
	\| 'false'
	\| 'grammar'
	\| 'spelling'
	/**
	* The ariarequired attribute can be applied to a form element, to indicate to an AT that it is required to complete the form.
	*/
	@Prop({ reflect: true }) ariarequired?: 'false' \| 'true' = null;
Check warning on line 24 in packages/db-ui-elements-stencil/src/components/db-input/db-input.tsx GitHub Actions / validate / Lint `The @prop name "ariarequired conflicts with a key in the HTMLElement prototype. Please choose a different name`

	/**
	* User agents sometimes have features for helping users fill forms in, for example prefilling the user's address based on earlier user input.
	/**
	* The autofocus content attribute allows the author to indicate that a control is to be focused as soon as the page is loaded, allowing the user to just start typing without having to manually focus the main control.
	*/
	@Prop({ reflect: true }) autofocus = false;
Check warning on line 34 in packages/db-ui-elements-stencil/src/components/db-input/db-input.tsx GitHub Actions / validate / Lint `The @prop name "autofocus conflicts with a key in the HTMLElement prototype. Please choose a different name`

	/**
	* The description attribute specifies the description/hint of the input.
	* out the notification if set to "assertive", while it will wait for the
	* user's idleness when set to "polite"
	*/
	@Prop({ reflect: true }) arialive: 'assertive' \| 'polite' = 'polite';
Check warning on line 14 in packages/db-ui-elements-stencil/src/components/db-notification/db-notifications.tsx GitHub Actions / validate / Lint `The @prop name "arialive conflicts with a key in the HTMLElement prototype. Please choose a different name`

	/**
	* Notifications have two variants ("hovering" and "alert") which change the styling.
	* The arialabel attribute is a string attribute and defines the text
	* content of the aria-label in the pagination.
	*/
	@Prop({ reflect: true }) arialabel = 'Pagination';
Check warning on line 86 in packages/db-ui-elements-stencil/src/components/db-pagination/db-pagination.tsx GitHub Actions / validate / Lint `The @prop name "arialabel conflicts with a key in the HTMLElement prototype. Please choose a different name`

	/**
	* Optional id for the caption aria label - otherwise random id will be set
	/**
	* The autofocus content attribute allows the author to indicate that a control is to be focused as soon as the page is loaded, allowing the user to just start typing without having to manually focus the main control.
	*/
	@Prop({ reflect: true }) autofocus: boolean;
Check warning on line 13 in packages/db-ui-elements-stencil/src/components/db-radio/db-radio.tsx GitHub Actions / validate / Lint `The @prop name "autofocus conflicts with a key in the HTMLElement prototype. Please choose a different name`

	/**
	* The checked content attribute is a boolean attribute that gives the default checkedness of the input element.