@statistikzh/leu 0.17.0 → 0.18.1

package/src/components/icon/test/icon.test.ts

@@ -2,16 +2,17 @@ import { html } from "lit"
 import { fixture, expect } from "@open-wc/testing"
 
 import "../leu-icon.js"
+import { IconPathName } from "../paths.js"
 
-async function defaultFixture(name = "close") {
+async function defaultFixture(name: IconPathName | "" = "close") {
   return fixture(html` <leu-icon name=${name}></leu-icon> `)
 }
 
 describe("LeuIcon", () => {
   it("is a defined element", async () => {
-    const el = await customElements.get("leu-icon")
+    const el = customElements.get("leu-icon")
 
-    await expect(el).not.to.be.undefined
+    expect(el).not.to.be.undefined
   })
 
   it("passes the a11y audit", async () => {
@@ -30,7 +31,7 @@ describe("LeuIcon", () => {
   })
 
   it("renders the correct icon path", async () => {
-    const el = await defaultFixture("angleDropup")
+    const el = await defaultFixture("angleDropUp")
 
     const path = el.shadowRoot.querySelector("path")
     expect(path).to.have.attribute("d", "M7 14.5L12 9.5L17 14.5H7Z")

package/src/components/input/Input.ts

@@ -250,29 +250,6 @@ export class LeuInput extends LeuElement {
     )
   }
 
-  /**
-   * Method for getting the id of the input element.
-   * If the id attribute is set, the value of the id attribute is returned.
-   * Otherwise a random id is generated and returned.
-   *
-   * @private
-   * @returns {string} id
-   */
-  getId() {
-    const id = this.getAttribute("id")
-
-    if (id !== null && id !== "") {
-      return id
-    }
-
-    if (this._identifier !== "") {
-      return this._identifier
-    }
-
-    this._identifier = crypto.randomUUID()
-    return this._identifier
-  }
-
   /**
    * Merge custom and default validation messages.
    * A validation message can be a function or a string.
@@ -352,7 +329,7 @@ export class LeuInput extends LeuElement {
     }
 
     return html`
-      <ul class="error" aria-errormessage=${`input-${this.getId()}`}>
+      <ul class="error" aria-errormessage="input">
         ${errorMessages.map(
           (message) => html`<li class="error-message">${message}</li>`,
         )}
@@ -412,7 +389,7 @@ export class LeuInput extends LeuElement {
       >
         <input
           class="input"
-          id="input-${this.getId()}"
+          id="input"
           type=${this.type}
           name=${this.name}
           @change=${this.handleChange}
@@ -431,7 +408,7 @@ export class LeuInput extends LeuElement {
           ref=${ref(this._inputRef)}
           aria-invalid=${isInvalid}
         />
-        <label for="input-${this.getId()}" class="label">${this.label}</label>
+        <label for="input" class="label">${this.label}</label>
         ${this.prefix
           ? html`<div class="prefix" .aria-hidden=${true}>${this.prefix}</div>`
           : nothing}