@statistikzh/leu 0.27.0 → 0.28.0

package/dist/leu-menu-item.js

@@ -1,6 +1,6 @@
-import "./LeuElement-k4RjIeoG.js";
-import "./Icon-CbZXpyHU.js";
-import { t as LeuMenuItem } from "./MenuItem-Cs3KFhJm.js";
+import "./LeuElement-DQI8cqZV.js";
+import "./Icon-D83qesg5.js";
+import { t as LeuMenuItem } from "./MenuItem-DCttylRO.js";
 //#region src/components/menu/leu-menu-item.ts
 LeuMenuItem.define("leu-menu-item");
 //#endregion

package/dist/leu-menu.d.ts

@@ -1,4 +1,4 @@
-import { t as LeuMenu } from "./Menu-CQdx1ef3.js";
+import { t as LeuMenu } from "./Menu-Z2b7dsB5.js";
 
 //#region src/components/menu/leu-menu.d.ts
 declare global {

package/dist/leu-menu.js

@@ -1,7 +1,7 @@
-import "./LeuElement-k4RjIeoG.js";
-import "./Icon-CbZXpyHU.js";
-import "./MenuItem-Cs3KFhJm.js";
-import { t as LeuMenu } from "./Menu-Cu8eIF1T.js";
+import "./LeuElement-DQI8cqZV.js";
+import "./Icon-D83qesg5.js";
+import "./MenuItem-DCttylRO.js";
+import { t as LeuMenu } from "./Menu-DRU1LiMM.js";
 //#region src/components/menu/leu-menu.ts
 LeuMenu.define("leu-menu");
 //#endregion

package/dist/leu-message.js

@@ -1,6 +1,6 @@
-import "./LeuElement-k4RjIeoG.js";
-import "./Icon-CbZXpyHU.js";
-import { t as LeuMessage } from "./Message-C6Zlk_2p.js";
+import "./LeuElement-DQI8cqZV.js";
+import "./Icon-D83qesg5.js";
+import { t as LeuMessage } from "./Message-0NxnKEqw.js";
 //#region src/components/message/leu-message.ts
 LeuMessage.define("leu-message");
 //#endregion

package/dist/leu-pagination.d.ts

@@ -1,4 +1,4 @@
-import { t as LeuPagination } from "./Pagination-CqkHh-Vd.js";
+import { t as LeuPagination } from "./Pagination-9eZ8WMvR.js";
 
 //#region src/components/pagination/leu-pagination.d.ts
 declare global {

package/dist/leu-pagination.js

@@ -1,10 +1,10 @@
-import "./LeuElement-k4RjIeoG.js";
-import "./Icon-CbZXpyHU.js";
-import "./Spinner-VhKfzI3Q.js";
-import "./Button-BSyDL_cV.js";
+import "./LeuElement-DQI8cqZV.js";
+import "./Icon-D83qesg5.js";
+import "./Spinner-BBiVZxFH.js";
+import "./Button-DyNVOHCd.js";
 import "./FormAssociatedMixin-DLPvFtbT.js";
-import "./VisuallyHidden-Co_txzxB.js";
-import { t as LeuPagination } from "./Pagination-CB2eVlXk.js";
+import "./VisuallyHidden-CpYXyuC7.js";
+import { t as LeuPagination } from "./Pagination-CIy7YvWE.js";
 //#region src/components/pagination/leu-pagination.ts
 LeuPagination.define("leu-pagination");
 //#endregion

package/dist/leu-placeholder.js

@@ -1,5 +1,5 @@
-import "./LeuElement-k4RjIeoG.js";
-import { t as LeuPlaceholder } from "./Placeholder-DHMexMhK.js";
+import "./LeuElement-DQI8cqZV.js";
+import { t as LeuPlaceholder } from "./Placeholder-Dol_X5Hp.js";
 //#region src/components/placeholder/leu-placeholder.ts
 LeuPlaceholder.define("leu-placeholder");
 //#endregion

package/dist/leu-popup.d.ts

@@ -1,4 +1,4 @@
-import { t as LeuPopup } from "./Popup-Btgm2a3D.js";
+import { t as LeuPopup } from "./Popup-B5iDSLIO.js";
 
 //#region src/components/popup/leu-popup.d.ts
 declare global {

package/dist/leu-popup.js

@@ -1,5 +1,5 @@
-import "./LeuElement-k4RjIeoG.js";
-import { t as LeuPopup } from "./Popup-8jhVy8gB.js";
+import "./LeuElement-DQI8cqZV.js";
+import { t as LeuPopup } from "./Popup-nJrJHGSy.js";
 //#region src/components/popup/leu-popup.ts
 LeuPopup.define("leu-popup");
 //#endregion

package/dist/leu-progress-bar.js

@@ -1,5 +1,5 @@
-import "./LeuElement-k4RjIeoG.js";
-import { t as LeuProgressBar } from "./ProgressBar-CG0_lHfS.js";
+import "./LeuElement-DQI8cqZV.js";
+import { t as LeuProgressBar } from "./ProgressBar-Dmq9veqU.js";
 //#region src/components/progress-bar/leu-progress-bar.ts
 LeuProgressBar.define("leu-progress-bar");
 //#endregion

package/dist/leu-radio-group.js

@@ -1,6 +1,6 @@
-import "./LeuElement-k4RjIeoG.js";
-import "./Radio-DG3xqP3s.js";
-import { t as LeuRadioGroup } from "./RadioGroup-BKCp9ICX.js";
+import "./LeuElement-DQI8cqZV.js";
+import "./Radio-W5ck_IJI.js";
+import { t as LeuRadioGroup } from "./RadioGroup-De5x2YCO.js";
 //#region src/components/radio/leu-radio-group.ts
 LeuRadioGroup.define("leu-radio-group");
 //#endregion

package/dist/leu-radio.js

@@ -1,5 +1,5 @@
-import "./LeuElement-k4RjIeoG.js";
-import { t as LeuRadio } from "./Radio-DG3xqP3s.js";
+import "./LeuElement-DQI8cqZV.js";
+import { t as LeuRadio } from "./Radio-W5ck_IJI.js";
 //#region src/components/radio/leu-radio.ts
 LeuRadio.define("leu-radio");
 //#endregion

package/dist/leu-range.js

@@ -1,5 +1,5 @@
-import "./LeuElement-k4RjIeoG.js";
-import { t as LeuRange } from "./Range-7LrESv4K.js";
+import "./LeuElement-DQI8cqZV.js";
+import { t as LeuRange } from "./Range-NCdfDkeD.js";
 //#region src/components/range/leu-range.ts
 LeuRange.define("leu-range");
 //#endregion

package/dist/leu-scroll-top.js

@@ -1,9 +1,9 @@
-import "./LeuElement-k4RjIeoG.js";
-import "./Icon-CbZXpyHU.js";
-import "./Spinner-VhKfzI3Q.js";
-import "./Button-BSyDL_cV.js";
+import "./LeuElement-DQI8cqZV.js";
+import "./Icon-D83qesg5.js";
+import "./Spinner-BBiVZxFH.js";
+import "./Button-DyNVOHCd.js";
 import "./FormAssociatedMixin-DLPvFtbT.js";
-import { t as LeuScrollTop } from "./ScrollTop-CJJsfniA.js";
+import { t as LeuScrollTop } from "./ScrollTop-DwcNIKmN.js";
 //#region src/components/scroll-top/leu-scroll-top.ts
 LeuScrollTop.define("leu-scroll-top");
 //#endregion

package/dist/leu-select.js

@@ -1,13 +1,13 @@
-import "./LeuElement-k4RjIeoG.js";
-import "./Icon-CbZXpyHU.js";
-import "./Spinner-VhKfzI3Q.js";
-import "./Button-BSyDL_cV.js";
+import "./LeuElement-DQI8cqZV.js";
+import "./Icon-D83qesg5.js";
+import "./Spinner-BBiVZxFH.js";
+import "./Button-DyNVOHCd.js";
 import "./FormAssociatedMixin-DLPvFtbT.js";
-import "./MenuItem-Cs3KFhJm.js";
-import "./Menu-Cu8eIF1T.js";
-import "./Popup-8jhVy8gB.js";
-import "./Input-DBXX7ev8.js";
-import { t as LeuSelect } from "./Select-CxEDXIBn.js";
+import "./MenuItem-DCttylRO.js";
+import "./Menu-DRU1LiMM.js";
+import "./Popup-nJrJHGSy.js";
+import "./Input-D7zS50oz.js";
+import { t as LeuSelect } from "./Select-Bpicra9q.js";
 //#region src/components/select/leu-select.ts
 LeuSelect.define("leu-select");
 //#endregion

package/dist/leu-spinner.d.ts

@@ -1,4 +1,4 @@
-import { t as LeuSpinner } from "./Spinner-CrM1enM0.js";
+import { t as LeuSpinner } from "./Spinner-DHYaX6-Y.js";
 
 //#region src/components/spinner/leu-spinner.d.ts
 declare global {

package/dist/leu-spinner.js

@@ -1,5 +1,5 @@
-import "./LeuElement-k4RjIeoG.js";
-import { t as LeuSpinner } from "./Spinner-VhKfzI3Q.js";
+import "./LeuElement-DQI8cqZV.js";
+import { t as LeuSpinner } from "./Spinner-BBiVZxFH.js";
 //#region src/components/spinner/leu-spinner.ts
 LeuSpinner.define("leu-spinner");
 //#endregion

package/dist/leu-tab-group.d.ts

@@ -0,0 +1,10 @@
+import { LeuTabGroup } from "./TabGroup.js";
+
+//#region src/components/tab/leu-tab-group.d.ts
+declare global {
+  interface HTMLElementTagNameMap {
+    "leu-tab-group": LeuTabGroup;
+  }
+}
+//#endregion
+export { LeuTabGroup };

package/dist/leu-tab-group.js

@@ -0,0 +1,8 @@
+import "./LeuElement-DQI8cqZV.js";
+import "./Tab-Ce9nrDok.js";
+import "./TabPanel-BW1ydVBT.js";
+import { t as LeuTabGroup } from "./TabGroup-C-cd4Wcx.js";
+//#region src/components/tab/leu-tab-group.ts
+LeuTabGroup.define("leu-tab-group");
+//#endregion
+export { LeuTabGroup };

package/dist/leu-tab-panel.d.ts

@@ -0,0 +1,10 @@
+import { t as LeuTabPanel } from "./TabPanel-DQgWP7LO.js";
+
+//#region src/components/tab/leu-tab-panel.d.ts
+declare global {
+  interface HTMLElementTagNameMap {
+    "leu-tab-panel": LeuTabPanel;
+  }
+}
+//#endregion
+export { LeuTabPanel };

package/dist/leu-tab-panel.js

@@ -0,0 +1,6 @@
+import "./LeuElement-DQI8cqZV.js";
+import { t as LeuTabPanel } from "./TabPanel-BW1ydVBT.js";
+//#region src/components/tab/leu-tab-panel.ts
+LeuTabPanel.define("leu-tab-panel");
+//#endregion
+export { LeuTabPanel };

package/dist/leu-tab.d.ts

@@ -0,0 +1,10 @@
+import { t as LeuTab } from "./Tab-CN97q0nj.js";
+
+//#region src/components/tab/leu-tab.d.ts
+declare global {
+  interface HTMLElementTagNameMap {
+    "leu-tab": LeuTab;
+  }
+}
+//#endregion
+export { LeuTab };

package/dist/leu-tab.js

@@ -0,0 +1,6 @@
+import "./LeuElement-DQI8cqZV.js";
+import { t as LeuTab } from "./Tab-Ce9nrDok.js";
+//#region src/components/tab/leu-tab.ts
+LeuTab.define("leu-tab");
+//#endregion
+export { LeuTab };

package/dist/leu-table.js

@@ -1,11 +1,11 @@
-import "./LeuElement-k4RjIeoG.js";
-import "./Icon-CbZXpyHU.js";
-import "./Spinner-VhKfzI3Q.js";
-import "./Button-BSyDL_cV.js";
+import "./LeuElement-DQI8cqZV.js";
+import "./Icon-D83qesg5.js";
+import "./Spinner-BBiVZxFH.js";
+import "./Button-DyNVOHCd.js";
 import "./FormAssociatedMixin-DLPvFtbT.js";
-import "./VisuallyHidden-Co_txzxB.js";
-import "./Pagination-CB2eVlXk.js";
-import { t as LeuTable } from "./Table-rg_JCtsA.js";
+import "./VisuallyHidden-CpYXyuC7.js";
+import "./Pagination-CIy7YvWE.js";
+import { t as LeuTable } from "./Table-DiYqIzBu.js";
 //#region src/components/table/leu-table.ts
 LeuTable.define("leu-table");
 //#endregion

package/dist/leu-tag.js

@@ -1,5 +1,5 @@
-import "./LeuElement-k4RjIeoG.js";
-import { t as LeuTag } from "./Tag-BROUaDAZ.js";
+import "./LeuElement-DQI8cqZV.js";
+import { t as LeuTag } from "./Tag-Ct8Hhv7W.js";
 //#region src/components/tag/leu-tag.ts
 LeuTag.define("leu-tag");
 //#endregion

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

@@ -1,4 +1,4 @@
-import { t as LeuVisuallyHidden } from "./VisuallyHidden-OeQvhxYn.js";
+import { t as LeuVisuallyHidden } from "./VisuallyHidden-CB7aRJzF.js";
 
 //#region src/components/visually-hidden/leu-visually-hidden.d.ts
 declare global {

package/dist/leu-visually-hidden.js

@@ -1,5 +1,5 @@
-import "./LeuElement-k4RjIeoG.js";
-import { t as LeuVisuallyHidden } from "./VisuallyHidden-Co_txzxB.js";
+import "./LeuElement-DQI8cqZV.js";
+import { t as LeuVisuallyHidden } from "./VisuallyHidden-CpYXyuC7.js";
 //#region src/components/visually-hidden/leu-visually-hidden.ts
 LeuVisuallyHidden.define("leu-visually-hidden");
 //#endregion

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

@@ -59,7 +59,7 @@
         },
         {
           "name": "type",
-          "description": "The `type` of the underlying button element.",
+          "description": "The `type` of the underlying button element. Ignored when `href` is set.",
           "values": [
             { "name": "button" },
             { "name": "submit" },
@@ -68,12 +68,27 @@
         },
         {
           "name": "componentRole",
-          "description": "The `role` of the underlying button element.",
+          "description": "The `role` of the underlying button element. Ignored when `href` is set.",
           "values": []
         },
+        {
+          "name": "href",
+          "description": "If set, renders the button as an <a> element instead of a <button> with the provided href.",
+          "values": []
+        },
+        {
+          "name": "target",
+          "description": "Tells the browser where to display the linked URL. Only used when `href` is set.",
+          "values": [
+            { "name": "_blank" },
+            { "name": "_parent" },
+            { "name": "_self" },
+            { "name": "_top" }
+          ]
+        },
         {
           "name": "disabled",
-          "description": "Whether the button is disabled or not.",
+          "description": "Whether the button is disabled or not. Ignored when `href` is set.",
           "values": []
         },
         {
@@ -96,11 +111,6 @@
           "description": "Whether the button is expanded or not.\nOnly has an effect on the variant `ghost` to show an expanding icon.\nIf the property is not set, the icon will not be shown.\nIf it is set, the icon will either show an expanded or collapsed state.",
           "values": [{ "name": "true" }, { "name": "false" }]
         },
-        {
-          "name": "fluid",
-          "description": "Alters the shape of the button to be full width of its parent container",
-          "values": []
-        },
         {
           "name": "loading",
           "description": "Replaces the content with a spinner",
@@ -859,6 +869,64 @@
         }
       ]
     },
+    {
+      "name": "leu-tab",
+      "description": "Tab Button.\n---\n\n\n### **Events:**\n - **leu:tab-select**",
+      "attributes": [
+        {
+          "name": "name",
+          "description": "Name to link Button and Panel together",
+          "values": []
+        },
+        { "name": "active", "description": "Is active", "values": [] }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://statistikzh.github.io/leu/?path=/story/tab"
+        }
+      ]
+    },
+    {
+      "name": "leu-tab-group",
+      "description": "Tab Group\n---\n\n\n### **Methods:**\n \n\n### **Slots:**\n - **tabs** - Slot for the leu-tab elements\n- **panels** - Slot for the leu-tab-panel elements",
+      "attributes": [
+        {
+          "name": "label",
+          "description": "Label for the tab list, used for accessibility.\nContent will not be visible on the page, but should be provided for screen readers.",
+          "values": []
+        },
+        {
+          "name": "active",
+          "description": "Name of the active/selected tab and panel. Has to match the name property of a leu-tab and leu-tab-panel.",
+          "values": []
+        }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://statistikzh.github.io/leu/?path=/story/tab-group"
+        }
+      ]
+    },
+    {
+      "name": "leu-tab-panel",
+      "description": "Tab Panel\n---\n\n\n### **Events:**\n - **leu:show-tab-panel** - Fired when a tab panel is shown",
+      "attributes": [
+        {
+          "name": "name",
+          "description": "Name of the tab. Apply the same name to the corresponding tab button to link them together.\nHas to be unique within the tab component.",
+          "values": []
+        },
+        { "name": "active", "values": [] }
+      ],
+      "references": [
+        {
+          "name": "Documentation",
+          "url": "https://statistikzh.github.io/leu/?path=/story/tab-panel"
+        }
+      ]
+    },
     {
       "name": "leu-table",
       "description": "\n---\n",

package/dist/vue/index.d.ts

@@ -28,6 +28,9 @@ import type { LeuRange, CustomEvent } from "../Range.js";
 import type { LeuScrollTop } from "../ScrollTop.js";
 import type { LeuSelect } from "../Select.js";
 import type { LeuSpinner } from "../Spinner.js";
+import type { LeuTab, CustomEvent } from "../Tab.js";
+import type { LeuTabGroup } from "../TabGroup.js";
+import type { LeuTabPanel, CustomEvent } from "../TabPanel.js";
 import type { LeuTable } from "../Table.js";
 import type { LeuTag } from "../Tag.js";
 import type { LeuVisuallyHidden } from "../VisuallyHidden.js";
@@ -51,11 +54,15 @@ Use it to provide a label when only an icon is visible. */
   size?: LeuButton["size"];
   /** The visual variant of the button. */
   variant?: LeuButton["variant"];
-  /** The `type` of the underlying button element. */
+  /** The `type` of the underlying button element. Ignored when `href` is set. */
   type?: LeuButton["type"];
-  /** The `role` of the underlying button element. */
+  /** The `role` of the underlying button element. Ignored when `href` is set. */
   componentRole?: LeuButton["componentRole"];
-  /** Whether the button is disabled or not. */
+  /** If set, renders the button as an <a> element instead of a <button> with the provided href. */
+  href?: LeuButton["href"];
+  /** Tells the browser where to display the linked URL. Only used when `href` is set. */
+  target?: LeuButton["target"];
+  /** Whether the button is disabled or not. Ignored when `href` is set. */
   disabled?: LeuButton["disabled"];
   /** Whether the button should be round.
 Can only be applied when the button contains an icon without a visible label. */
@@ -70,8 +77,6 @@ Only has an effect on the variant `ghost` to show an expanding icon.
 If the property is not set, the icon will not be shown.
 If it is set, the icon will either show an expanded or collapsed state. */
   expanded?: LeuButton["expanded"];
-  /** Alters the shape of the button to be full width of its parent container */
-  fluid?: LeuButton["fluid"];
   /** Replaces the content with a spinner */
   loading?: LeuButton["loading"];
 };
@@ -450,6 +455,35 @@ finds all the options that match the given values and selects them. */
 
 type LeuSpinnerProps = {};
 
+type LeuTabProps = {
+  /** Name to link Button and Panel together */
+  name?: LeuTab["name"];
+  /** Is active */
+  active?: LeuTab["active"];
+
+  /**  */
+  "onleu:tab-select"?: (e: CustomEvent<CustomEvent>) => void;
+};
+
+type LeuTabGroupProps = {
+  /** Label for the tab list, used for accessibility.
+Content will not be visible on the page, but should be provided for screen readers. */
+  label?: LeuTabGroup["label"];
+  /** Name of the active/selected tab and panel. Has to match the name property of a leu-tab and leu-tab-panel. */
+  active?: LeuTabGroup["active"];
+};
+
+type LeuTabPanelProps = {
+  /** Name of the tab. Apply the same name to the corresponding tab button to link them together.
+Has to be unique within the tab component. */
+  name?: LeuTabPanel["name"];
+  /**  */
+  active?: LeuTabPanel["active"];
+
+  /** Fired when a tab panel is shown */
+  "onleu:show-tab-panel"?: (e: CustomEvent<CustomEvent>) => void;
+};
+
 type LeuTableProps = {
   /**  */
   columns?: LeuTable["columns"];
@@ -813,6 +847,40 @@ export type CustomElements = {
    */
   "leu-spinner": DefineComponent<LeuSpinnerProps>;
 
+  /**
+   * Tab Button.
+   * ---
+   *
+   *
+   * ### **Events:**
+   *  - **leu:tab-select**
+   */
+  "leu-tab": DefineComponent<LeuTabProps>;
+
+  /**
+   * Tab Group
+   * ---
+   *
+   *
+   * ### **Methods:**
+   *
+   *
+   * ### **Slots:**
+   *  - **tabs** - Slot for the leu-tab elements
+   * - **panels** - Slot for the leu-tab-panel elements
+   */
+  "leu-tab-group": DefineComponent<LeuTabGroupProps>;
+
+  /**
+   * Tab Panel
+   * ---
+   *
+   *
+   * ### **Events:**
+   *  - **leu:show-tab-panel** - Fired when a tab panel is shown
+   */
+  "leu-tab-panel": DefineComponent<LeuTabPanelProps>;
+
   /**
    *
    * ---