@statistikzh/leu 0.14.2 → 0.14.4

package/dist/leu-visually-hidden.d.ts

@@ -1,3 +1,13 @@
-export { LeuVisuallyHidden };
 import { LeuVisuallyHidden } from './VisuallyHidden.js';
-//# sourceMappingURL=leu-visually-hidden.d.ts.map
+import 'lit-html';
+import 'lit';
+import './LeuElement.d-BevHqLUu.js';
+
+declare global {
+    interface HTMLElementTagNameMap {
+        "leu-visually-hidden": LeuVisuallyHidden;
+    }
+}
+//# sourceMappingURL=leu-visually-hidden.d.ts.map
+
+export { LeuVisuallyHidden };

package/dist/leu-visually-hidden.js

@@ -1,6 +1,6 @@
 import { LeuVisuallyHidden } from './VisuallyHidden.js';
-import './LeuElement-BI1CxItv.js';
 import 'lit';
+import './LeuElement-x8UlIDDl.js';
 
 LeuVisuallyHidden.define("leu-visually-hidden");
 

package/dist/lib/LeuElement.d.ts

@@ -0,0 +1,8 @@
+import { CSSResultGroup, LitElement } from "lit";
+export declare class LeuElement extends LitElement {
+    static version: string;
+    static dependencies: Record<string, typeof LeuElement>;
+    static styles: CSSResultGroup;
+    static define(name: string, constructor?: typeof LeuElement, options?: ElementDefinitionOptions): void;
+}
+//# sourceMappingURL=LeuElement.d.ts.map

package/dist/lib/LeuElement.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"LeuElement.d.ts","sourceRoot":"","sources":["../../src/lib/LeuElement.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,cAAc,EAAE,UAAU,EAAE,MAAM,KAAK,CAAA;AAGhD,qBAAa,UAAW,SAAQ,UAAU;IACxC,MAAM,CAAC,OAAO,SAAkB;IAEhC,MAAM,CAAC,YAAY,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,UAAU,CAAC,CAAK;IAE3D,MAAM,CAAC,MAAM,EAAE,cAAc,CAAe;IAE5C,MAAM,CAAC,MAAM,CACX,IAAI,EAAE,MAAM,EACZ,WAAW,oBAAO,EAClB,OAAO,GAAE,wBAA6B;CA6BzC"}

package/dist/lib/a11y.d.ts

@@ -0,0 +1,11 @@
+/**
+ * All roles that are associated with a aria-checked attribute
+ * @link https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-checked
+ */
+export declare const ARIA_CHECKED_ROLES: readonly ["checkbox", "menuitemcheckbox", "menuitemradio", "option", "radio", "switch"];
+/**
+ * All roles that are associated with a aria-selected attribute
+ * @link https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected
+ */
+export declare const ARIA_SELECTED_ROLES: readonly ["gridcell", "option", "row", "tab", "columnheader", "rowheader", "treeitem"];
+//# sourceMappingURL=a11y.d.ts.map

package/dist/lib/a11y.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"a11y.d.ts","sourceRoot":"","sources":["../../src/lib/a11y.ts"],"names":[],"mappings":"AAAA;;;GAGG;AACH,eAAO,MAAM,kBAAkB,yFAOrB,CAAA;AAEV;;;GAGG;AACH,eAAO,MAAM,mBAAmB,wFAQtB,CAAA"}

package/dist/lib/hasSlotController.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Thanks Shoelace!
+ * Source: https://github.com/shoelace-style/shoelace/blob/next/src/internal/slot.ts
+ */
+import { ReactiveController, ReactiveControllerHost } from "lit";
+/**
+ * A reactive controller that determines when slots exist.
+ */
+export declare class HasSlotController implements ReactiveController {
+    host: ReactiveControllerHost & Element;
+    slotNames: string[];
+    constructor(host: ReactiveControllerHost & Element, slotNames: string[]);
+    private hasDefaultSlot;
+    private hasNamedSlot;
+    test(slotName: string): boolean;
+    hostConnected(): void;
+    hostDisconnected(): void;
+    private handleSlotChange;
+}
+//# sourceMappingURL=hasSlotController.d.ts.map

package/dist/lib/hasSlotController.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"hasSlotController.d.ts","sourceRoot":"","sources":["../../src/lib/hasSlotController.ts"],"names":[],"mappings":"AAAA;;;GAGG;AAEH,OAAO,EAAE,kBAAkB,EAAE,sBAAsB,EAAE,MAAM,KAAK,CAAA;AAEhE;;GAEG;AACH,qBAAa,iBAAkB,YAAW,kBAAkB;IAC1D,IAAI,EAAE,sBAAsB,GAAG,OAAO,CAAA;IAEtC,SAAS,EAAE,MAAM,EAAE,CAAA;gBAEP,IAAI,EAAE,sBAAsB,GAAG,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE;IAOvE,OAAO,CAAC,cAAc;IAmBtB,OAAO,CAAC,YAAY;IAIpB,IAAI,CAAC,QAAQ,EAAE,MAAM;IAMrB,aAAa;IAIb,gBAAgB;IAOhB,OAAO,CAAC,gBAAgB,CAUvB;CACF"}

package/dist/lib/utils.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Return a debounced function that delays invoking func until after wait milliseconds have elapsed since the last time the debounced function was invoked.
+ * @param {Function} func - Your function
+ * @param {Number} timeout - Default is 500 ms
+ * @returns {Function} - Your function wrapped in a timeout function
+ */
+declare const debounce: (func: any, timeout?: number) => (...args: any[]) => void;
+/**
+ * Return a throttled function that only invokes func at most once per every wait milliseconds.
+ * @param {Function} func - Your function
+ * @param {Number} timeout - Default is 500 ms
+ * @returns {Function} - Your function wrapped in a timeout function
+ */
+declare const throttle: (func: any, timeout?: number) => (...args: any[]) => void;
+export { debounce, throttle };
+//# sourceMappingURL=utils.d.ts.map

package/dist/lib/utils.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../src/lib/utils.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,QAAA,MAAM,QAAQ,2DAQb,CAAA;AAED;;;;;GAKG;AACH,QAAA,MAAM,QAAQ,2DAUb,CAAA;AAED,OAAO,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAA"}

package/dist/styles/style.stories.d.ts

@@ -0,0 +1,6 @@
+declare const _default: {
+    title: string;
+};
+export default _default;
+export declare const Regular: any;
+//# sourceMappingURL=style.stories.d.ts.map

package/dist/styles/style.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"style.stories.d.ts","sourceRoot":"","sources":["../../src/styles/style.stories.ts"],"names":[],"mappings":";;;AAEA,wBAEC;AA0DD,eAAO,MAAM,OAAO,KAAoB,CAAA"}

package/dist/vscode.html-custom-data.json

@@ -23,7 +23,7 @@
         },
         {
           "name": "label",
-          "description": "The label (title) of the accordion.",
+          "description": "The label (title) of the accordion",
           "values": []
         }
       ],

package/dist/vue/index.d.ts

@@ -33,7 +33,7 @@ type LeuAccordionProps = {
   "label-prefix"?: LeuAccordion["labelPrefix"];
   /** The expanded state of the accordion. */
   open?: LeuAccordion["open"];
-  /** The label (title) of the accordion. */
+  /** The label (title) of the accordion */
   label?: LeuAccordion["label"];
 };
 
@@ -65,8 +65,6 @@ type LeuButtonProps = {
 type LeuButtonGroupProps = {
   /** The value of the currenty selected (active) button */
   value?: LeuButtonGroup["value"];
-  /**  */
-  _items?: LeuButtonGroup["_items"];
   /** When the value of the group changes by clicking a button */
   oninput?: (e: CustomEvent<CustomEvent>) => void;
 };

package/dist/web-types.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://raw.githubusercontent.com/JetBrains/web-types/master/schema/web-types.json",
   "name": "@statistikzh/leu",
-  "version": "0.14.2",
+  "version": "0.14.4",
   "description-markup": "markdown",
   "contributions": {
     "html": {
@@ -28,7 +28,7 @@
             },
             {
               "name": "label",
-              "description": "The label (title) of the accordion.",
+              "description": "The label (title) of the accordion",
               "value": { "type": "string", "default": "\"\"" }
             }
           ],
@@ -53,7 +53,7 @@
               },
               {
                 "name": "label",
-                "description": "The label (title) of the accordion.",
+                "description": "The label (title) of the accordion",
                 "type": "string"
               },
               {
@@ -192,8 +192,7 @@
                 "name": "value",
                 "description": "The value of the currenty selected (active) button",
                 "type": "string"
-              },
-              { "name": "_items", "type": "array" }
+              }
             ],
             "events": [
               {

package/package.json

@@ -3,7 +3,7 @@
   "description": "UI component library of the canton of zurich",
   "license": "MIT",
   "author": "statistikzh",
-  "version": "0.14.2",
+  "version": "0.14.4",
   "type": "module",
   "main": "dist/index.js",
   "module": "dist/index.js",
@@ -24,19 +24,19 @@
   "homepage": "https://github.com/statistikzh/leu/",
   "scripts": {
     "analyze": "cem analyze --config custom-elements-manifest.config.js",
-    "build": "rimraf dist && npm run build:js && npm run build:types && npm run build:css && npm run analyze",
+    "build": "rimraf dist && npm run build:types && npm run build:js && npm run build:css && npm run analyze",
     "build:js": "rollup -c rollup.config.js",
     "build:types": "tsc -p tsconfig.build.json",
     "build:css": "postcss src/styles/theme.css -o dist/theme.css && cp dist/theme.css .storybook/static/",
     "watch:css": "nodemon --watch 'src/styles/*' -e css --exec npm run build:css",
     "lint": "npm run lint:eslint && npm run lint:prettier",
-    "lint:eslint": "eslint --ext .js,.mjs,.html . --ignore-path .gitignore ",
-    "lint:prettier": "prettier \"**/*.{js,mjs,md,mdx,html,json}\" --check",
-    "lint:stylelint": "stylelint \"**/*.{js,css}\" --ignore-path .gitignore",
+    "lint:eslint": "eslint --ext .ts,.js,.mjs,.html . --ignore-path .gitignore ",
+    "lint:prettier": "prettier \"**/*.{.ts,js,mjs,md,mdx,html,json}\" --check",
+    "lint:stylelint": "stylelint \"**/*.{ts,js,css}\" --ignore-path .gitignore",
     "lint:types": "tsc",
     "format": "npm run format:eslint && npm run format:prettier",
-    "format:eslint": "eslint --ext .js,.mjs,.html . --fix --ignore-path .gitignore",
-    "format:prettier": "prettier \"**/*.{js,mjs,md,mdx,html,json}\" --write",
+    "format:eslint": "eslint --ext .ts,.js,.mjs,.html . --fix --ignore-path .gitignore",
+    "format:prettier": "prettier \"**/*.{ts,js,mjs,md,mdx,html,json}\" --write",
     "test": "web-test-runner --coverage",
     "test:watch": "web-test-runner --watch",
     "prepare": "husky",
@@ -46,17 +46,14 @@
   },
   "dependencies": {
     "@floating-ui/dom": "^1.6.13",
-    "lit": "^3.1.4",
-    "stylelint-config-recommended": "^15.0.0"
+    "lit": "^3.1.4"
   },
   "devDependencies": {
-    "@babel/preset-env": "^7.26.9",
     "@commitlint/cli": "^19.7.1",
     "@commitlint/config-conventional": "^19.7.1",
     "@custom-elements-manifest/analyzer": "^0.10.4",
     "@open-wc/eslint-config": "^12.0.3",
     "@open-wc/testing": "^4.0.0",
-    "@rollup/plugin-babel": "^6.0.4",
     "@rollup/plugin-commonjs": "^28.0.2",
     "@rollup/plugin-json": "^6.1.0",
     "@rollup/plugin-replace": "^6.0.2",
@@ -69,7 +66,11 @@
     "@storybook/manager-api": "^8.5.8",
     "@storybook/theming": "^8.5.8",
     "@storybook/web-components": "^8.5.8",
+    "@types/mocha": "^10.0.10",
+    "@typescript-eslint/eslint-plugin": "^8.34.0",
+    "@typescript-eslint/parser": "^8.34.0",
     "@web/dev-server": "^0.4.6",
+    "@web/dev-server-esbuild": "^1.0.4",
     "@web/dev-server-rollup": "^0.6.4",
     "@web/storybook-builder": "^0.2.1",
     "@web/storybook-framework-web-components": "^0.2.0",
@@ -97,11 +98,14 @@
     "react-syntax-highlighter": "^15.6.1",
     "rimraf": "^6.0.1",
     "rollup": "^4.34.8",
+    "rollup-plugin-dts": "^6.2.1",
     "rollup-plugin-postcss": "^4.0.2",
     "rollup-plugin-postcss-lit": "^2.1.0",
+    "rollup-plugin-typescript2": "^0.36.0",
     "sinon": "^19.0.2",
     "storybook": "^8.5.8",
     "stylelint": "^16.14.1",
+    "stylelint-config-recommended": "^15.0.0",
     "stylelint-config-standard": "^37.0.0",
     "typescript": "^5.7.3"
   },
@@ -109,10 +113,10 @@
     "semi": false
   },
   "lint-staged": {
-    "*.{js,css}": [
+    "*.{ts,js,css}": [
       "stylelint --fix"
     ],
-    "*.{js,mjs,html}": [
+    "*.{ts,js,mjs,html}": [
       "eslint --fix",
       "prettier --write"
     ],
@@ -120,5 +124,8 @@
   },
   "overrides": {
     "estree-walker": "2.0.2"
+  },
+  "esm.sh": {
+    "bundle": false
   }
 }

package/release-please-config.json

@@ -0,0 +1,10 @@
+{
+  "$schema": "https://raw.githubusercontent.com/googleapis/release-please/main/schemas/config.json",
+  "release-type": "node",
+  "bump-minor-pre-major": true,
+  "bump-patch-for-minor-pre-major": true,
+  "last-release-sha": "c00695d82782cfa6e3fa0046e3a7deb31c14eb26",
+  "packages": {
+    ".": {}
+  }
+}

package/rollup.config.js

@@ -3,8 +3,9 @@ import path from "path"
 import { fileURLToPath } from "url"
 import postcss from "rollup-plugin-postcss"
 import postcssLit from "rollup-plugin-postcss-lit"
-import { babel } from "@rollup/plugin-babel"
 import replace from "@rollup/plugin-replace"
+import typescript from "rollup-plugin-typescript2"
+import { dts } from "rollup-plugin-dts"
 
 export const plugins = [
   {
@@ -35,30 +36,59 @@ export const plugins = [
 /**
  * @type {import("rollup").RollupOptions}
  */
-export default {
-  // Select all files in a direct subdirectory of src/components
-  // that have a name starting with
-  // -  a capital letter
-  // -  or "leu-"
-  input: {
-    index: "index.js",
-    ...Object.fromEntries(
-      globSync("src/components/*/{[A-Z],leu-}*.js", { nocase: false }).map(
-        (file) => [
-          path.basename(file, path.extname(file)),
-          fileURLToPath(new URL(file, import.meta.url)),
-        ],
+export default [
+  {
+    // Select all files in a direct subdirectory of src/components
+    // that have a name starting with
+    // -  a capital letter
+    // -  or "leu-"
+    input: {
+      index: "src/index.ts",
+      ...Object.fromEntries(
+        globSync("src/components/*/{[A-Z],leu-}*.ts", { nocase: false }).map(
+          (file) => [
+            path.basename(file, path.extname(file)),
+            fileURLToPath(new URL(file, import.meta.url)),
+          ],
+        ),
       ),
-    ),
+    },
+    output: {
+      dir: "./dist/",
+      format: "esm",
+      entryFileNames: "[name].js",
+    },
+    plugins: [
+      typescript({
+        tsconfig: fileURLToPath(
+          new URL("./tsconfig.build.json", import.meta.url),
+        ),
+        tsconfigOverride: {
+          compilerOptions: {
+            declarationMap: false,
+            emitDeclarationOnly: false,
+            declaration: false,
+          },
+        },
+      }),
+      ...plugins.map((p) => p.plugin(...p.args)),
+    ],
+    external: [/^lit(\/.*\.js)?$/, "@floating-ui/dom"],
   },
-  output: {
-    dir: "./dist/",
-    format: "esm",
-    entryFileNames: "[name].js",
+  {
+    input: {
+      ...Object.fromEntries(
+        globSync("dist/components/*/{[A-Z],leu-}*.d.ts", { nocase: false }).map(
+          (file) => [
+            path.basename(file, ".d.ts"),
+            fileURLToPath(new URL(file, import.meta.url)),
+          ],
+        ),
+      ),
+    },
+    output: {
+      dir: "./dist/",
+    },
+    plugins: [dts()],
   },
-  plugins: [
-    babel({ babelHelpers: "bundled" }),
-    ...plugins.map((p) => p.plugin(...p.args)),
-  ],
-  external: [/^lit(\/.*\.js)?$/, "@floating-ui/dom"],
-}
+]

package/scripts/generate-component/generate.js

@@ -1,5 +1,5 @@
 #!/usr/bin/env node
-/* eslint-disable no-use-before-define */
+/* eslint-disable @typescript-eslint/no-use-before-define */
 
 import arg from "arg"
 import fs from "fs"

package/scripts/generate-component/templates/{[Name].js → [Name].ts}

@@ -1,4 +1,5 @@
 import { html } from "lit"
+import { property } from "lit/decorators.js"
 
 import { LeuElement } from "../../lib/LeuElement.js"
 
@@ -15,9 +16,8 @@ export class Leu[Name] extends LeuElement {
     delegatesFocus: true,
   }
 
-  static properties = {
-    value: { type: String },
-  }
+  @property({ type: String })
+  value: string = ""
 
   constructor() {
     super()

package/src/components/accordion/{Accordion.js → Accordion.ts}

@@ -1,17 +1,14 @@
 import { nothing } from "lit"
 import { html, unsafeStatic } from "lit/static-html.js"
+import { property } from "lit/decorators.js"
+
 import { LeuElement } from "../../lib/LeuElement.js"
 
-// @ts-ignore
 import styles from "./accordion.css"
 
 /**
  * @tagname leu-accordion
  * @slot content - The content of the accordion. No styles will be applied to the content.
- * @prop {number} headingLevel - The heading level of the accordion title. Must be between 1 and 6.
- * @prop {boolean} open - The expanded state of the accordion.
- * @prop {string} label - The label (title) of the accordion.
- * @prop {string} labelPrefix - The prefix of the accordion label. e.g. "01"
  * @attr {number} heading-level - The heading level of the accordion title. Must be between 1 and 6.
  * @attr {string} label-prefix - The prefix of the accordion label. e.g. "01"
  */
@@ -24,29 +21,37 @@ export class LeuAccordion extends LeuElement {
     delegatesFocus: true,
   }
 
-  static properties = {
-    headingLevel: { type: Number, attribute: "heading-level", reflect: true },
-    open: { type: Boolean, reflect: true },
-    label: { type: String, reflect: true },
-    labelPrefix: { type: String, attribute: "label-prefix", reflect: true },
-  }
+  /**
+   * The heading level of the accordion title. Must be between 1 and 6.
+   */
+  @property({ type: Number, attribute: "heading-level", reflect: true })
+  headingLevel = 2
 
-  constructor() {
-    super()
-    this.headingLevel = 2
-    this.open = false
-    this.label = ""
-    this.labelPrefix = ""
-  }
+  /**
+   * The expanded state of the accordion.
+   */
+  @property({ type: Boolean, reflect: true })
+  open = false
+
+  /**
+   * The label (title) of the accordion
+   */
+  @property({ type: String, reflect: true })
+  label = ""
+
+  /**
+   * The prefix of the accordion label. e.g. "01"
+   */
+  @property({ type: String, attribute: "label-prefix", reflect: true })
+  labelPrefix = ""
 
   /**
    * Determines the heading tag of the accordion toggle.
    * The headingLevel shouldn't be used directly to render the heading tag
    * in order to avoid XSS issues.
-   * @returns {string} The heading tag of the accordion toggle.
    * @internal
    */
-  _getHeadingTag() {
+  private _getHeadingTag(): string {
     let level = 2
     if (this.headingLevel > 0 && this.headingLevel < 7) {
       level = Math.floor(this.headingLevel)
@@ -59,7 +64,7 @@ export class LeuAccordion extends LeuElement {
    * Toggles the accordion open state.
    * @internal
    */
-  _handleToggleClick() {
+  private _handleToggleClick() {
     this.open = !this.open
   }
 

package/src/components/accordion/{leu-accordion.js → leu-accordion.ts}

@@ -3,3 +3,9 @@ import { LeuAccordion } from "./Accordion.js"
 export { LeuAccordion }
 
 LeuAccordion.define("leu-accordion")
+
+declare global {
+  interface HTMLElementTagNameMap {
+    "leu-accordion": LeuAccordion
+  }
+}

package/src/components/accordion/stories/{accordion.stories.js → accordion.stories.ts}

@@ -26,14 +26,16 @@ export default {
 }
 
 function Template(args) {
-  return html` <leu-accordion
-    heading-level=${ifDefined(args["heading-level"])}
-    label=${ifDefined(args.label)}
-    label-prefix=${ifDefined(args["label-prefix"])}
-    ?open=${args.open}
-  >
-    <div slot="content">${args.content}</div>
-  </leu-accordion>`
+  return html`
+    <leu-accordion
+      heading-level=${ifDefined(args["heading-level"])}
+      label=${ifDefined(args.label)}
+      label-prefix=${ifDefined(args["label-prefix"])}
+      ?open=${args.open}
+    >
+      <div slot="content">${args.content}</div>
+    </leu-accordion>
+  `
 }
 
 export const Regular = Template.bind({})

package/src/components/button/{Button.js → Button.ts}

@@ -7,7 +7,6 @@ import { LeuElement } from "../../lib/LeuElement.js"
 import { HasSlotController } from "../../lib/hasSlotController.js"
 import { ARIA_CHECKED_ROLES, ARIA_SELECTED_ROLES } from "../../lib/a11y.js"
 
-// @ts-ignore
 import styles from "./button.css"
 
 /*

package/src/components/button/{leu-button.js → leu-button.ts}

@@ -3,3 +3,9 @@ import { LeuButton } from "./Button.js"
 export { LeuButton }
 
 LeuButton.define("leu-button")
+
+declare global {
+  interface HTMLElementTagNameMap {
+    "leu-button": LeuButton
+  }
+}

package/src/components/button-group/{ButtonGroup.js → ButtonGroup.ts}

@@ -1,8 +1,8 @@
 import { html } from "lit"
 import { LeuElement } from "../../lib/LeuElement.js"
 
-// @ts-ignore
 import styles from "./button-group.css"
+import { LeuButton } from "../button/Button.js"
 
 /**
  * @tagname leu-button-group
@@ -13,14 +13,10 @@ import styles from "./button-group.css"
 export class LeuButtonGroup extends LeuElement {
   static styles = [LeuElement.styles, styles]
 
-  constructor() {
-    super()
-
-    this._items = []
-  }
+  private _items: LeuButton[] = []
 
   /**
-   * @param {import("../button/Button").LeuButton} button
+   * @param {import("../button/Button.js").LeuButton} button
    * @returns {string}
    */
   static getButtonValue(button) {
@@ -75,7 +71,7 @@ export class LeuButtonGroup extends LeuElement {
   }
 
   /**
-   * @param {import("../button/Button").LeuButton} button
+   * @param {import("../button/Button.js").LeuButton} button
    */
   _handleButtonClick(button) {
     if (!button.active) {

package/src/components/button-group/{leu-button-group.js → leu-button-group.ts}

@@ -3,3 +3,9 @@ import { LeuButtonGroup } from "./ButtonGroup.js"
 export { LeuButtonGroup }
 
 LeuButtonGroup.define("leu-button-group")
+
+declare global {
+  interface HTMLElementTagNameMap {
+    "leu-button-group": LeuButtonGroup
+  }
+}

package/src/components/checkbox/{Checkbox.js → Checkbox.ts}

@@ -3,7 +3,6 @@ import { html } from "lit"
 import { LeuElement } from "../../lib/LeuElement.js"
 import { LeuIcon } from "../icon/Icon.js"
 
-// @ts-ignore
 import styles from "./checkbox.css"
 
 /**

package/src/components/checkbox/{CheckboxGroup.js → CheckboxGroup.ts}

@@ -3,7 +3,6 @@ import { classMap } from "lit/directives/class-map.js"
 
 import { LeuElement } from "../../lib/LeuElement.js"
 
-// @ts-ignore
 import styles from "./checkbox-group.css"
 
 /**

package/src/components/checkbox/{leu-checkbox-group.js → leu-checkbox-group.ts}

@@ -3,3 +3,9 @@ import { LeuCheckboxGroup } from "./CheckboxGroup.js"
 export { LeuCheckboxGroup }
 
 LeuCheckboxGroup.define("leu-checkbox-group")
+
+declare global {
+  interface HTMLElementTagNameMap {
+    "leu-checkbox-group": LeuCheckboxGroup
+  }
+}

package/src/components/checkbox/{leu-checkbox.js → leu-checkbox.ts}

@@ -3,3 +3,9 @@ import { LeuCheckbox } from "./Checkbox.js"
 export { LeuCheckbox }
 
 LeuCheckbox.define("leu-checkbox")
+
+declare global {
+  interface HTMLElementTagNameMap {
+    "leu-checkbox": LeuCheckbox
+  }
+}

package/src/components/chip/{Chip.js → Chip.ts}

@@ -1,6 +1,5 @@
 import { LeuElement } from "../../lib/LeuElement.js"
 
-// @ts-ignore
 import styles from "./chip.css"
 
 /* Design: https://www.figma.com/file/d6Pv21UVUbnBs3AdcZijHmbN/KTZH-Design-System?type=design&node-id=21161-184433&mode=design&t=Kjo5VDiqivihn8dh-11 */