@warp-ds/elements 2.10.0-next.17 → 2.10.0-next.19

package/dist/packages/breadcrumbs/breadcrumbs.react.stories.js

@@ -1,13 +1,14 @@
 import React from "react";
 import { Breadcrumbs } from "./react";
+import { BreadcrumbItem } from "../breadcrumb-item/react";
 export default {
     title: "Navigation/Breadcrumbs",
     render(args) {
         return (React.createElement(Breadcrumbs, { ...args },
-            React.createElement("a", { href: "#/home" }, "Home"),
-            React.createElement("a", { href: "#/category" }, "Category"),
-            React.createElement("a", { href: "#/subcategory" }, "Subcategory"),
-            React.createElement("span", { "aria-current": "page" }, "Current Page")));
+            React.createElement(BreadcrumbItem, { href: "#/home" }, "Home"),
+            React.createElement(BreadcrumbItem, { href: "#/category" }, "Category"),
+            React.createElement(BreadcrumbItem, { href: "#/subcategory" }, "Subcategory"),
+            React.createElement(BreadcrumbItem, { "current-page": true }, "Current Page")));
     },
     component: Breadcrumbs,
 };
@@ -22,9 +23,9 @@ export const WithLinks = {
     },
     render(args) {
         return (React.createElement(Breadcrumbs, { ...args },
-            React.createElement("a", { href: "#/eiendom" }, "Eiendom"),
-            React.createElement("a", { href: "#/bolig-til-salgs" }, "Bolig til salgs"),
-            React.createElement("a", { href: "#/oslo", "aria-current": "page" }, "Oslo")));
+            React.createElement(BreadcrumbItem, { href: "#/eiendom" }, "Eiendom"),
+            React.createElement(BreadcrumbItem, { href: "#/bolig-til-salgs" }, "Bolig til salgs"),
+            React.createElement(BreadcrumbItem, { href: "#/oslo", "current-page": true }, "Oslo")));
     },
 };
 export const WithSpanForCurrentPage = {
@@ -33,8 +34,8 @@ export const WithSpanForCurrentPage = {
     },
     render(args) {
         return (React.createElement(Breadcrumbs, { ...args },
-            React.createElement("a", { href: "#/eiendom" }, "Eiendom"),
-            React.createElement("a", { href: "#/bolig-til-salgs" }, "Bolig til salgs"),
-            React.createElement("span", { "aria-current": "page" }, "Oslo")));
+            React.createElement(BreadcrumbItem, { href: "#/eiendom" }, "Eiendom"),
+            React.createElement(BreadcrumbItem, { href: "#/bolig-til-salgs" }, "Bolig til salgs"),
+            React.createElement(BreadcrumbItem, { "current-page": true }, "Oslo")));
     },
 };

package/dist/packages/breadcrumbs/breadcrumbs.stories.d.ts

@@ -1,12 +1,11 @@
 import type { Meta, StoryObj } from "@storybook/web-components-vite";
 import type { WarpBreadcrumbs } from "./breadcrumbs.js";
 import "./breadcrumbs.js";
-declare const args: Partial<WarpBreadcrumbs> & {
-    [key: string]: any;
-};
-declare const meta: Meta<typeof args>;
+import "../breadcrumb-item/breadcrumb-item.js";
+declare const storybookHelpers: import("@wc-toolkit/storybook-helpers").StoryHelpers<WarpBreadcrumbs>;
+declare const meta: Meta<typeof storybookHelpers.args>;
 export default meta;
-type Story = StoryObj<typeof args>;
+type Story = StoryObj<typeof storybookHelpers.args>;
 export declare const Default: Story;
 export declare const WithLinks: Story;
 export declare const WithSpanForCurrentPage: Story;

package/dist/packages/breadcrumbs/breadcrumbs.stories.js

@@ -3,21 +3,22 @@ import { getStorybookHelpers } from "@wc-toolkit/storybook-helpers";
 import { html } from "lit";
 import { prespread } from "../../.storybook/utilities.js";
 import "./breadcrumbs.js";
-const { events, args, argTypes } = getStorybookHelpers("w-breadcrumbs");
+import "../breadcrumb-item/breadcrumb-item.js";
+const storybookHelpers = getStorybookHelpers("w-breadcrumbs");
+const { events, argTypes } = storybookHelpers;
 const meta = {
     title: "Navigation/Breadcrumbs",
     render(args) {
         return html `
 			<w-breadcrumbs ${spread(prespread(args))}>
-				<a href="#/home">Home</a>
-				<a href="#/category">Category</a>
-				<span aria-current="page">Current page</span>
+				<w-breadcrumb-item href="#/home">Home</w-breadcrumb-item>
+				<w-breadcrumb-item href="#/category">Category</w-breadcrumb-item>
+				<w-breadcrumb-item current-page>Current page</w-breadcrumb-item>
 			</w-breadcrumbs>
 		`;
     },
     args: {
         "aria-label": "You are here",
-        ...args,
     },
     argTypes,
     parameters: {
@@ -32,9 +33,11 @@ export const WithLinks = {
     render(args) {
         return html `
 			<w-breadcrumbs ${spread(prespread(args))}>
-				<a href="#/home">Home</a>
-				<a href="#/category">Category</a>
-				<a href="#/subcategory" aria-current="page">Current page</a>
+				<w-breadcrumb-item href="#/home">Home</w-breadcrumb-item>
+				<w-breadcrumb-item href="#/category">Category</w-breadcrumb-item>
+				<w-breadcrumb-item href="#" current-page
+					>Current page</w-breadcrumb-item
+				>
 			</w-breadcrumbs>
 		`;
     },
@@ -43,9 +46,9 @@ export const WithSpanForCurrentPage = {
     render(args) {
         return html `
 			<w-breadcrumbs ${spread(prespread(args))}>
-				<a href="#/home">Home</a>
-				<a href="#/category">Category</a>
-				<span aria-current="page">Current page</span>
+				<w-breadcrumb-item href="#/home">Home</w-breadcrumb-item>
+				<w-breadcrumb-item href="#/category">Category</w-breadcrumb-item>
+				<w-breadcrumb-item current-page>Current page</w-breadcrumb-item>
 			</w-breadcrumbs>
 		`;
     },

package/dist/packages/button/button.react.stories.d.ts

@@ -3,11 +3,11 @@ import React from "react";
 import { Button } from "./react";
 declare const _default: {
     title: string;
-    render(args: Omit<Omit<Omit<React.HTMLAttributes<import("./button").WarpButton>, "value" | "form" | "small" | "type" | "name" | "disabled" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "updated" | "firstUpdated" | "resetFormControl" | "render" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "target" | "rel" | "variant" | "command" | "quiet" | "href" | "fullWidth" | "iconOnly" | "loading" | "buttonClass" | "commandfor" | "_handleButtonClick"> & {} & Partial<Omit<import("./button").WarpButton, keyof HTMLElement>> & React.RefAttributes<import("./button").WarpButton>, "ref">, "full-width" | "icon-only"> & {
+    render(args: Omit<Omit<Omit<React.HTMLAttributes<import("./button").WarpButton>, "value" | "form" | "small" | "name" | "type" | "disabled" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "updated" | "firstUpdated" | "resetFormControl" | "render" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "target" | "rel" | "variant" | "command" | "quiet" | "href" | "fullWidth" | "iconOnly" | "loading" | "buttonClass" | "commandfor" | "_handleButtonClick"> & {} & Partial<Omit<import("./button").WarpButton, keyof HTMLElement>> & React.RefAttributes<import("./button").WarpButton>, "ref">, "full-width" | "icon-only"> & {
         fullWidth?: boolean;
         iconOnly?: boolean;
     } & React.RefAttributes<import("./button").WarpButton>): React.JSX.Element;
-    component: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<import("./button").WarpButton>, "value" | "form" | "small" | "type" | "name" | "disabled" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "updated" | "firstUpdated" | "resetFormControl" | "render" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "target" | "rel" | "variant" | "command" | "quiet" | "href" | "fullWidth" | "iconOnly" | "loading" | "buttonClass" | "commandfor" | "_handleButtonClick"> & {} & Partial<Omit<import("./button").WarpButton, keyof HTMLElement>> & React.RefAttributes<import("./button").WarpButton>, "ref">, "full-width" | "icon-only"> & {
+    component: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<import("./button").WarpButton>, "value" | "form" | "small" | "name" | "type" | "disabled" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "updated" | "firstUpdated" | "resetFormControl" | "render" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "target" | "rel" | "variant" | "command" | "quiet" | "href" | "fullWidth" | "iconOnly" | "loading" | "buttonClass" | "commandfor" | "_handleButtonClick"> & {} & Partial<Omit<import("./button").WarpButton, keyof HTMLElement>> & React.RefAttributes<import("./button").WarpButton>, "ref">, "full-width" | "icon-only"> & {
         fullWidth?: boolean;
         iconOnly?: boolean;
     } & React.RefAttributes<import("./button").WarpButton>>;

package/dist/packages/button/react.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
 import { WarpButton } from "./button.js";
-export declare const Button: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<WarpButton>, "value" | "form" | "small" | "type" | "name" | "disabled" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "updated" | "firstUpdated" | "resetFormControl" | "render" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "target" | "rel" | "variant" | "command" | "quiet" | "href" | "fullWidth" | "iconOnly" | "loading" | "buttonClass" | "commandfor" | "_handleButtonClick"> & {} & Partial<Omit<WarpButton, keyof HTMLElement>> & React.RefAttributes<WarpButton>, "ref">, "full-width" | "icon-only"> & {
+export declare const Button: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<WarpButton>, "value" | "form" | "small" | "name" | "type" | "disabled" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "updated" | "firstUpdated" | "resetFormControl" | "render" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "target" | "rel" | "variant" | "command" | "quiet" | "href" | "fullWidth" | "iconOnly" | "loading" | "buttonClass" | "commandfor" | "_handleButtonClick"> & {} & Partial<Omit<WarpButton, keyof HTMLElement>> & React.RefAttributes<WarpButton>, "ref">, "full-width" | "icon-only"> & {
     fullWidth?: boolean;
     iconOnly?: boolean;
 } & React.RefAttributes<WarpButton>>;

package/dist/packages/checkbox-group/react.d.ts

@@ -1,5 +1,5 @@
 import React from "react";
 import { WarpCheckboxGroup } from "./checkbox-group.js";
-export declare const CheckboxGroup: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<WarpCheckboxGroup>, "form" | "label" | "name" | "invalid" | "helpText" | "required" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "updated" | "resetFormControl" | "render" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "reportValidity" | "optional"> & {} & Partial<Omit<WarpCheckboxGroup, keyof HTMLElement>> & React.RefAttributes<WarpCheckboxGroup>, "ref">, "help-text"> & {
+export declare const CheckboxGroup: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<WarpCheckboxGroup>, "form" | "label" | "name" | "invalid" | "helpText" | "optional" | "required" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "updated" | "resetFormControl" | "render" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "reportValidity"> & {} & Partial<Omit<WarpCheckboxGroup, keyof HTMLElement>> & React.RefAttributes<WarpCheckboxGroup>, "ref">, "help-text"> & {
     helpText?: string;
 } & React.RefAttributes<WarpCheckboxGroup>>;

package/dist/packages/combobox/combobox.react.stories.d.ts

@@ -3,7 +3,7 @@ import React from "react";
 import { Combobox } from "./react";
 declare const _default: {
     title: string;
-    component: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<import("./combobox").WarpCombobox>, "value" | "form" | "label" | "name" | "autocomplete" | "disabled" | "invalid" | "helpText" | "placeholder" | "required" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "onchange" | "onselect" | "updated" | "firstUpdated" | "resetFormControl" | "render" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "onChange" | "onSelect" | "optional" | "options" | "openOnFocus" | "selectOnBlur" | "matchTextSegments" | "disableStaticFiltering"> & {
+    component: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<import("./combobox").WarpCombobox>, "value" | "form" | "label" | "autocomplete" | "name" | "disabled" | "invalid" | "helpText" | "optional" | "placeholder" | "required" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "onchange" | "onselect" | "updated" | "firstUpdated" | "resetFormControl" | "render" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "onChange" | "onSelect" | "options" | "openOnFocus" | "selectOnBlur" | "matchTextSegments" | "disableStaticFiltering"> & {
         onSelect?: ((e: CustomEvent<{
             value: string;
         }>) => void) | undefined;
@@ -23,7 +23,7 @@ declare const _default: {
         disableStaticFiltering?: boolean;
         helpText?: string;
     } & React.RefAttributes<import("./combobox").WarpCombobox>>;
-    render(args: Omit<Omit<Omit<React.HTMLAttributes<import("./combobox").WarpCombobox>, "value" | "form" | "label" | "name" | "autocomplete" | "disabled" | "invalid" | "helpText" | "placeholder" | "required" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "onchange" | "onselect" | "updated" | "firstUpdated" | "resetFormControl" | "render" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "onChange" | "onSelect" | "optional" | "options" | "openOnFocus" | "selectOnBlur" | "matchTextSegments" | "disableStaticFiltering"> & {
+    render(args: Omit<Omit<Omit<React.HTMLAttributes<import("./combobox").WarpCombobox>, "value" | "form" | "label" | "autocomplete" | "name" | "disabled" | "invalid" | "helpText" | "optional" | "placeholder" | "required" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "onchange" | "onselect" | "updated" | "firstUpdated" | "resetFormControl" | "render" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "onChange" | "onSelect" | "options" | "openOnFocus" | "selectOnBlur" | "matchTextSegments" | "disableStaticFiltering"> & {
         onSelect?: ((e: CustomEvent<{
             value: string;
         }>) => void) | undefined;

package/dist/packages/combobox/react.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
 import { WarpCombobox } from "./combobox.js";
-export declare const Combobox: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<WarpCombobox>, "value" | "form" | "label" | "name" | "autocomplete" | "disabled" | "invalid" | "helpText" | "placeholder" | "required" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "onchange" | "onselect" | "updated" | "firstUpdated" | "resetFormControl" | "render" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "onChange" | "onSelect" | "optional" | "options" | "openOnFocus" | "selectOnBlur" | "matchTextSegments" | "disableStaticFiltering"> & {
+export declare const Combobox: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<WarpCombobox>, "value" | "form" | "label" | "autocomplete" | "name" | "disabled" | "invalid" | "helpText" | "optional" | "placeholder" | "required" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "onchange" | "onselect" | "updated" | "firstUpdated" | "resetFormControl" | "render" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "onChange" | "onSelect" | "options" | "openOnFocus" | "selectOnBlur" | "matchTextSegments" | "disableStaticFiltering"> & {
     onSelect?: ((e: CustomEvent<{
         value: string;
     }>) => void) | undefined;