@digdir/designsystemet-web 1.19.1 → 1.20.1

package/dist/index.d.ts

@@ -156,93 +156,81 @@ declare class DSTabElement extends UTabs.UHTMLTabElement {}
 declare class DSTabPanelElement extends UTabs.UHTMLTabPanelElement {}
 //#endregion
 export { DSBreadcrumbsElement, DSErrorSummaryElement, DSFieldElement, DSPaginationElement, DSSuggestionElement, DSTabElement, DSTabListElement, DSTabPanelElement, DSTabsElement, initTooltips, pagination, setTooltipElement };
-import type * as PreactTypes from 'preact'
-import type * as ReactTypes from 'react'
-import type * as SvelteTypes from 'svelte/elements'
-import type * as VueJSX from '@vue/runtime-dom'
-import type { JSX as QwikJSX } from '@builder.io/qwik/jsx-runtime'
-import type { JSX as SolidJSX } from 'solid-js'
 
 
-export type PreactDsbreadcrumbs = PreactTypes.JSX.HTMLAttributes<DSBreadcrumbsElement> & {  }
-export type ReactDsbreadcrumbs = ReactTypes.DetailedHTMLProps<ReactTypes.HTMLAttributes<DSBreadcrumbsElement>, DSBreadcrumbsElement> & { class?: string }
-export type QwikDsbreadcrumbs = QwikJSX.IntrinsicElements['div'] & { class?: string }
-export type VueDsbreadcrumbs = VueJSX.HTMLAttributes
-export type SvelteDsbreadcrumbs = SvelteTypes.HTMLAttributes<DSBreadcrumbsElement> & {  }
-export type SolidDsbreadcrumbs = SolidJSX.HTMLAttributes<DSBreadcrumbsElement>
+export type PreactDstabs = PreactTypes.JSX.HTMLAttributes<DSTabsElement> & {  }
+export type ReactDstabs = ReactTypes.DetailedHTMLProps<ReactTypes.HTMLAttributes<DSTabsElement>, DSTabsElement> & { class?: string }
+export type QwikDstabs = QwikJSX.IntrinsicElements['div'] & { class?: string }
+export type VueDstabs = VueJSX.HTMLAttributes
+export type SvelteDstabs = SvelteTypes.HTMLAttributes<DSTabsElement> & {  }
+export type SolidDstabs = SolidJSX.HTMLAttributes<DSTabsElement>
 
-declare global { namespace React.JSX { interface IntrinsicElements { 'ds-breadcrumbs': ReactDsbreadcrumbs } } }
-declare global { namespace preact.JSX { interface IntrinsicElements { 'ds-breadcrumbs': PreactDsbreadcrumbs } } }
-declare module '@builder.io/qwik/jsx-runtime' { export namespace JSX { export interface IntrinsicElements { 'ds-breadcrumbs': QwikDsbreadcrumbs } } }
+declare global { namespace React.JSX { interface IntrinsicElements { 'ds-tabs': ReactDstabs } } }
+declare global { namespace preact.JSX { interface IntrinsicElements { 'ds-tabs': PreactDstabs } } }
+declare module '@builder.io/qwik/jsx-runtime' { export namespace JSX { export interface IntrinsicElements { 'ds-tabs': QwikDstabs } } }
 // Augmenting @vue/runtime-dom instead of vue directly to avoid interfering with React JSX
-declare module '@vue/runtime-dom' { export interface GlobalComponents { 'ds-breadcrumbs': VueDsbreadcrumbs } }
-declare module 'svelte/elements' { interface SvelteHTMLElements { 'ds-breadcrumbs': SvelteDsbreadcrumbs } }
+declare module '@vue/runtime-dom' { export interface GlobalComponents { 'ds-tabs': VueDstabs } }
+declare module 'svelte/elements' { interface SvelteHTMLElements { 'ds-tabs': SvelteDstabs } }
 declare module 'solid-js' {
   namespace JSX {
-    interface IntrinsicElements { 'ds-breadcrumbs': SolidDsbreadcrumbs }
+    interface IntrinsicElements { 'ds-tabs': SolidDstabs }
     interface CustomEvents {  }
   }
 }
+export type PreactDstablist = PreactTypes.JSX.HTMLAttributes<DSTabListElement> & {  }
+export type ReactDstablist = ReactTypes.DetailedHTMLProps<ReactTypes.HTMLAttributes<DSTabListElement>, DSTabListElement> & { class?: string }
+export type QwikDstablist = QwikJSX.IntrinsicElements['div'] & { class?: string }
+export type VueDstablist = VueJSX.HTMLAttributes
+export type SvelteDstablist = SvelteTypes.HTMLAttributes<DSTabListElement> & {  }
+export type SolidDstablist = SolidJSX.HTMLAttributes<DSTabListElement>
 
-
-export type PreactDserrorsummary = PreactTypes.JSX.HTMLAttributes<DSErrorSummaryElement> & {  }
-export type ReactDserrorsummary = ReactTypes.DetailedHTMLProps<ReactTypes.HTMLAttributes<DSErrorSummaryElement>, DSErrorSummaryElement> & { class?: string }
-export type QwikDserrorsummary = QwikJSX.IntrinsicElements['div'] & { class?: string }
-export type VueDserrorsummary = VueJSX.HTMLAttributes
-export type SvelteDserrorsummary = SvelteTypes.HTMLAttributes<DSErrorSummaryElement> & {  }
-export type SolidDserrorsummary = SolidJSX.HTMLAttributes<DSErrorSummaryElement>
-
-declare global { namespace React.JSX { interface IntrinsicElements { 'ds-error-summary': ReactDserrorsummary } } }
-declare global { namespace preact.JSX { interface IntrinsicElements { 'ds-error-summary': PreactDserrorsummary } } }
-declare module '@builder.io/qwik/jsx-runtime' { export namespace JSX { export interface IntrinsicElements { 'ds-error-summary': QwikDserrorsummary } } }
+declare global { namespace React.JSX { interface IntrinsicElements { 'ds-tablist': ReactDstablist } } }
+declare global { namespace preact.JSX { interface IntrinsicElements { 'ds-tablist': PreactDstablist } } }
+declare module '@builder.io/qwik/jsx-runtime' { export namespace JSX { export interface IntrinsicElements { 'ds-tablist': QwikDstablist } } }
 // Augmenting @vue/runtime-dom instead of vue directly to avoid interfering with React JSX
-declare module '@vue/runtime-dom' { export interface GlobalComponents { 'ds-error-summary': VueDserrorsummary } }
-declare module 'svelte/elements' { interface SvelteHTMLElements { 'ds-error-summary': SvelteDserrorsummary } }
+declare module '@vue/runtime-dom' { export interface GlobalComponents { 'ds-tablist': VueDstablist } }
+declare module 'svelte/elements' { interface SvelteHTMLElements { 'ds-tablist': SvelteDstablist } }
 declare module 'solid-js' {
   namespace JSX {
-    interface IntrinsicElements { 'ds-error-summary': SolidDserrorsummary }
+    interface IntrinsicElements { 'ds-tablist': SolidDstablist }
     interface CustomEvents {  }
   }
 }
+export type PreactDstab = PreactTypes.JSX.HTMLAttributes<DSTabElement> & {  }
+export type ReactDstab = ReactTypes.DetailedHTMLProps<ReactTypes.HTMLAttributes<DSTabElement>, DSTabElement> & { class?: string }
+export type QwikDstab = QwikJSX.IntrinsicElements['div'] & { class?: string }
+export type VueDstab = VueJSX.HTMLAttributes
+export type SvelteDstab = SvelteTypes.HTMLAttributes<DSTabElement> & {  }
+export type SolidDstab = SolidJSX.HTMLAttributes<DSTabElement>
 
-
-export type PreactDsfield = PreactTypes.JSX.HTMLAttributes<DSFieldElement> & {  }
-export type ReactDsfield = ReactTypes.DetailedHTMLProps<ReactTypes.HTMLAttributes<DSFieldElement>, DSFieldElement> & { class?: string }
-export type QwikDsfield = QwikJSX.IntrinsicElements['div'] & { class?: string }
-export type VueDsfield = VueJSX.HTMLAttributes
-export type SvelteDsfield = SvelteTypes.HTMLAttributes<DSFieldElement> & {  }
-export type SolidDsfield = SolidJSX.HTMLAttributes<DSFieldElement>
-
-declare global { namespace React.JSX { interface IntrinsicElements { 'ds-field': ReactDsfield } } }
-declare global { namespace preact.JSX { interface IntrinsicElements { 'ds-field': PreactDsfield } } }
-declare module '@builder.io/qwik/jsx-runtime' { export namespace JSX { export interface IntrinsicElements { 'ds-field': QwikDsfield } } }
+declare global { namespace React.JSX { interface IntrinsicElements { 'ds-tab': ReactDstab } } }
+declare global { namespace preact.JSX { interface IntrinsicElements { 'ds-tab': PreactDstab } } }
+declare module '@builder.io/qwik/jsx-runtime' { export namespace JSX { export interface IntrinsicElements { 'ds-tab': QwikDstab } } }
 // Augmenting @vue/runtime-dom instead of vue directly to avoid interfering with React JSX
-declare module '@vue/runtime-dom' { export interface GlobalComponents { 'ds-field': VueDsfield } }
-declare module 'svelte/elements' { interface SvelteHTMLElements { 'ds-field': SvelteDsfield } }
+declare module '@vue/runtime-dom' { export interface GlobalComponents { 'ds-tab': VueDstab } }
+declare module 'svelte/elements' { interface SvelteHTMLElements { 'ds-tab': SvelteDstab } }
 declare module 'solid-js' {
   namespace JSX {
-    interface IntrinsicElements { 'ds-field': SolidDsfield }
+    interface IntrinsicElements { 'ds-tab': SolidDstab }
     interface CustomEvents {  }
   }
 }
+export type PreactDstabpanel = PreactTypes.JSX.HTMLAttributes<DSTabPanelElement> & {  }
+export type ReactDstabpanel = ReactTypes.DetailedHTMLProps<ReactTypes.HTMLAttributes<DSTabPanelElement>, DSTabPanelElement> & { class?: string }
+export type QwikDstabpanel = QwikJSX.IntrinsicElements['div'] & { class?: string }
+export type VueDstabpanel = VueJSX.HTMLAttributes
+export type SvelteDstabpanel = SvelteTypes.HTMLAttributes<DSTabPanelElement> & {  }
+export type SolidDstabpanel = SolidJSX.HTMLAttributes<DSTabPanelElement>
 
-
-export type PreactDspagination = PreactTypes.JSX.HTMLAttributes<DSPaginationElement> & {  }
-export type ReactDspagination = ReactTypes.DetailedHTMLProps<ReactTypes.HTMLAttributes<DSPaginationElement>, DSPaginationElement> & { class?: string }
-export type QwikDspagination = QwikJSX.IntrinsicElements['div'] & { class?: string }
-export type VueDspagination = VueJSX.HTMLAttributes
-export type SvelteDspagination = SvelteTypes.HTMLAttributes<DSPaginationElement> & {  }
-export type SolidDspagination = SolidJSX.HTMLAttributes<DSPaginationElement>
-
-declare global { namespace React.JSX { interface IntrinsicElements { 'ds-pagination': ReactDspagination } } }
-declare global { namespace preact.JSX { interface IntrinsicElements { 'ds-pagination': PreactDspagination } } }
-declare module '@builder.io/qwik/jsx-runtime' { export namespace JSX { export interface IntrinsicElements { 'ds-pagination': QwikDspagination } } }
+declare global { namespace React.JSX { interface IntrinsicElements { 'ds-tabpanel': ReactDstabpanel } } }
+declare global { namespace preact.JSX { interface IntrinsicElements { 'ds-tabpanel': PreactDstabpanel } } }
+declare module '@builder.io/qwik/jsx-runtime' { export namespace JSX { export interface IntrinsicElements { 'ds-tabpanel': QwikDstabpanel } } }
 // Augmenting @vue/runtime-dom instead of vue directly to avoid interfering with React JSX
-declare module '@vue/runtime-dom' { export interface GlobalComponents { 'ds-pagination': VueDspagination } }
-declare module 'svelte/elements' { interface SvelteHTMLElements { 'ds-pagination': SvelteDspagination } }
+declare module '@vue/runtime-dom' { export interface GlobalComponents { 'ds-tabpanel': VueDstabpanel } }
+declare module 'svelte/elements' { interface SvelteHTMLElements { 'ds-tabpanel': SvelteDstabpanel } }
 declare module 'solid-js' {
   namespace JSX {
-    interface IntrinsicElements { 'ds-pagination': SolidDspagination }
+    interface IntrinsicElements { 'ds-tabpanel': SolidDstabpanel }
     interface CustomEvents {  }
   }
 }
@@ -269,79 +257,85 @@ declare module 'solid-js' {
 }
 
 
-export type PreactDstabs = PreactTypes.JSX.HTMLAttributes<DSTabsElement> & {  }
-export type ReactDstabs = ReactTypes.DetailedHTMLProps<ReactTypes.HTMLAttributes<DSTabsElement>, DSTabsElement> & { class?: string }
-export type QwikDstabs = QwikJSX.IntrinsicElements['div'] & { class?: string }
-export type VueDstabs = VueJSX.HTMLAttributes
-export type SvelteDstabs = SvelteTypes.HTMLAttributes<DSTabsElement> & {  }
-export type SolidDstabs = SolidJSX.HTMLAttributes<DSTabsElement>
+export type PreactDspagination = PreactTypes.JSX.HTMLAttributes<DSPaginationElement> & {  }
+export type ReactDspagination = ReactTypes.DetailedHTMLProps<ReactTypes.HTMLAttributes<DSPaginationElement>, DSPaginationElement> & { class?: string }
+export type QwikDspagination = QwikJSX.IntrinsicElements['div'] & { class?: string }
+export type VueDspagination = VueJSX.HTMLAttributes
+export type SvelteDspagination = SvelteTypes.HTMLAttributes<DSPaginationElement> & {  }
+export type SolidDspagination = SolidJSX.HTMLAttributes<DSPaginationElement>
 
-declare global { namespace React.JSX { interface IntrinsicElements { 'ds-tabs': ReactDstabs } } }
-declare global { namespace preact.JSX { interface IntrinsicElements { 'ds-tabs': PreactDstabs } } }
-declare module '@builder.io/qwik/jsx-runtime' { export namespace JSX { export interface IntrinsicElements { 'ds-tabs': QwikDstabs } } }
+declare global { namespace React.JSX { interface IntrinsicElements { 'ds-pagination': ReactDspagination } } }
+declare global { namespace preact.JSX { interface IntrinsicElements { 'ds-pagination': PreactDspagination } } }
+declare module '@builder.io/qwik/jsx-runtime' { export namespace JSX { export interface IntrinsicElements { 'ds-pagination': QwikDspagination } } }
 // Augmenting @vue/runtime-dom instead of vue directly to avoid interfering with React JSX
-declare module '@vue/runtime-dom' { export interface GlobalComponents { 'ds-tabs': VueDstabs } }
-declare module 'svelte/elements' { interface SvelteHTMLElements { 'ds-tabs': SvelteDstabs } }
+declare module '@vue/runtime-dom' { export interface GlobalComponents { 'ds-pagination': VueDspagination } }
+declare module 'svelte/elements' { interface SvelteHTMLElements { 'ds-pagination': SvelteDspagination } }
 declare module 'solid-js' {
   namespace JSX {
-    interface IntrinsicElements { 'ds-tabs': SolidDstabs }
+    interface IntrinsicElements { 'ds-pagination': SolidDspagination }
     interface CustomEvents {  }
   }
 }
-export type PreactDstablist = PreactTypes.JSX.HTMLAttributes<DSTabListElement> & {  }
-export type ReactDstablist = ReactTypes.DetailedHTMLProps<ReactTypes.HTMLAttributes<DSTabListElement>, DSTabListElement> & { class?: string }
-export type QwikDstablist = QwikJSX.IntrinsicElements['div'] & { class?: string }
-export type VueDstablist = VueJSX.HTMLAttributes
-export type SvelteDstablist = SvelteTypes.HTMLAttributes<DSTabListElement> & {  }
-export type SolidDstablist = SolidJSX.HTMLAttributes<DSTabListElement>
 
-declare global { namespace React.JSX { interface IntrinsicElements { 'ds-tablist': ReactDstablist } } }
-declare global { namespace preact.JSX { interface IntrinsicElements { 'ds-tablist': PreactDstablist } } }
-declare module '@builder.io/qwik/jsx-runtime' { export namespace JSX { export interface IntrinsicElements { 'ds-tablist': QwikDstablist } } }
+
+export type PreactDsfield = PreactTypes.JSX.HTMLAttributes<DSFieldElement> & {  }
+export type ReactDsfield = ReactTypes.DetailedHTMLProps<ReactTypes.HTMLAttributes<DSFieldElement>, DSFieldElement> & { class?: string }
+export type QwikDsfield = QwikJSX.IntrinsicElements['div'] & { class?: string }
+export type VueDsfield = VueJSX.HTMLAttributes
+export type SvelteDsfield = SvelteTypes.HTMLAttributes<DSFieldElement> & {  }
+export type SolidDsfield = SolidJSX.HTMLAttributes<DSFieldElement>
+
+declare global { namespace React.JSX { interface IntrinsicElements { 'ds-field': ReactDsfield } } }
+declare global { namespace preact.JSX { interface IntrinsicElements { 'ds-field': PreactDsfield } } }
+declare module '@builder.io/qwik/jsx-runtime' { export namespace JSX { export interface IntrinsicElements { 'ds-field': QwikDsfield } } }
 // Augmenting @vue/runtime-dom instead of vue directly to avoid interfering with React JSX
-declare module '@vue/runtime-dom' { export interface GlobalComponents { 'ds-tablist': VueDstablist } }
-declare module 'svelte/elements' { interface SvelteHTMLElements { 'ds-tablist': SvelteDstablist } }
+declare module '@vue/runtime-dom' { export interface GlobalComponents { 'ds-field': VueDsfield } }
+declare module 'svelte/elements' { interface SvelteHTMLElements { 'ds-field': SvelteDsfield } }
 declare module 'solid-js' {
   namespace JSX {
-    interface IntrinsicElements { 'ds-tablist': SolidDstablist }
+    interface IntrinsicElements { 'ds-field': SolidDsfield }
     interface CustomEvents {  }
   }
 }
-export type PreactDstab = PreactTypes.JSX.HTMLAttributes<DSTabElement> & {  }
-export type ReactDstab = ReactTypes.DetailedHTMLProps<ReactTypes.HTMLAttributes<DSTabElement>, DSTabElement> & { class?: string }
-export type QwikDstab = QwikJSX.IntrinsicElements['div'] & { class?: string }
-export type VueDstab = VueJSX.HTMLAttributes
-export type SvelteDstab = SvelteTypes.HTMLAttributes<DSTabElement> & {  }
-export type SolidDstab = SolidJSX.HTMLAttributes<DSTabElement>
 
-declare global { namespace React.JSX { interface IntrinsicElements { 'ds-tab': ReactDstab } } }
-declare global { namespace preact.JSX { interface IntrinsicElements { 'ds-tab': PreactDstab } } }
-declare module '@builder.io/qwik/jsx-runtime' { export namespace JSX { export interface IntrinsicElements { 'ds-tab': QwikDstab } } }
+
+export type PreactDserrorsummary = PreactTypes.JSX.HTMLAttributes<DSErrorSummaryElement> & {  }
+export type ReactDserrorsummary = ReactTypes.DetailedHTMLProps<ReactTypes.HTMLAttributes<DSErrorSummaryElement>, DSErrorSummaryElement> & { class?: string }
+export type QwikDserrorsummary = QwikJSX.IntrinsicElements['div'] & { class?: string }
+export type VueDserrorsummary = VueJSX.HTMLAttributes
+export type SvelteDserrorsummary = SvelteTypes.HTMLAttributes<DSErrorSummaryElement> & {  }
+export type SolidDserrorsummary = SolidJSX.HTMLAttributes<DSErrorSummaryElement>
+
+declare global { namespace React.JSX { interface IntrinsicElements { 'ds-error-summary': ReactDserrorsummary } } }
+declare global { namespace preact.JSX { interface IntrinsicElements { 'ds-error-summary': PreactDserrorsummary } } }
+declare module '@builder.io/qwik/jsx-runtime' { export namespace JSX { export interface IntrinsicElements { 'ds-error-summary': QwikDserrorsummary } } }
 // Augmenting @vue/runtime-dom instead of vue directly to avoid interfering with React JSX
-declare module '@vue/runtime-dom' { export interface GlobalComponents { 'ds-tab': VueDstab } }
-declare module 'svelte/elements' { interface SvelteHTMLElements { 'ds-tab': SvelteDstab } }
+declare module '@vue/runtime-dom' { export interface GlobalComponents { 'ds-error-summary': VueDserrorsummary } }
+declare module 'svelte/elements' { interface SvelteHTMLElements { 'ds-error-summary': SvelteDserrorsummary } }
 declare module 'solid-js' {
   namespace JSX {
-    interface IntrinsicElements { 'ds-tab': SolidDstab }
+    interface IntrinsicElements { 'ds-error-summary': SolidDserrorsummary }
     interface CustomEvents {  }
   }
 }
-export type PreactDstabpanel = PreactTypes.JSX.HTMLAttributes<DSTabPanelElement> & {  }
-export type ReactDstabpanel = ReactTypes.DetailedHTMLProps<ReactTypes.HTMLAttributes<DSTabPanelElement>, DSTabPanelElement> & { class?: string }
-export type QwikDstabpanel = QwikJSX.IntrinsicElements['div'] & { class?: string }
-export type VueDstabpanel = VueJSX.HTMLAttributes
-export type SvelteDstabpanel = SvelteTypes.HTMLAttributes<DSTabPanelElement> & {  }
-export type SolidDstabpanel = SolidJSX.HTMLAttributes<DSTabPanelElement>
 
-declare global { namespace React.JSX { interface IntrinsicElements { 'ds-tabpanel': ReactDstabpanel } } }
-declare global { namespace preact.JSX { interface IntrinsicElements { 'ds-tabpanel': PreactDstabpanel } } }
-declare module '@builder.io/qwik/jsx-runtime' { export namespace JSX { export interface IntrinsicElements { 'ds-tabpanel': QwikDstabpanel } } }
+
+export type PreactDsbreadcrumbs = PreactTypes.JSX.HTMLAttributes<DSBreadcrumbsElement> & {  }
+export type ReactDsbreadcrumbs = ReactTypes.DetailedHTMLProps<ReactTypes.HTMLAttributes<DSBreadcrumbsElement>, DSBreadcrumbsElement> & { class?: string }
+export type QwikDsbreadcrumbs = QwikJSX.IntrinsicElements['div'] & { class?: string }
+export type VueDsbreadcrumbs = VueJSX.HTMLAttributes
+export type SvelteDsbreadcrumbs = SvelteTypes.HTMLAttributes<DSBreadcrumbsElement> & {  }
+export type SolidDsbreadcrumbs = SolidJSX.HTMLAttributes<DSBreadcrumbsElement>
+
+declare global { namespace React.JSX { interface IntrinsicElements { 'ds-breadcrumbs': ReactDsbreadcrumbs } } }
+declare global { namespace preact.JSX { interface IntrinsicElements { 'ds-breadcrumbs': PreactDsbreadcrumbs } } }
+declare module '@builder.io/qwik/jsx-runtime' { export namespace JSX { export interface IntrinsicElements { 'ds-breadcrumbs': QwikDsbreadcrumbs } } }
 // Augmenting @vue/runtime-dom instead of vue directly to avoid interfering with React JSX
-declare module '@vue/runtime-dom' { export interface GlobalComponents { 'ds-tabpanel': VueDstabpanel } }
-declare module 'svelte/elements' { interface SvelteHTMLElements { 'ds-tabpanel': SvelteDstabpanel } }
+declare module '@vue/runtime-dom' { export interface GlobalComponents { 'ds-breadcrumbs': VueDsbreadcrumbs } }
+declare module 'svelte/elements' { interface SvelteHTMLElements { 'ds-breadcrumbs': SvelteDsbreadcrumbs } }
 declare module 'solid-js' {
   namespace JSX {
-    interface IntrinsicElements { 'ds-tabpanel': SolidDstabpanel }
+    interface IntrinsicElements { 'ds-breadcrumbs': SolidDsbreadcrumbs }
     interface CustomEvents {  }
   }
 }

package/dist/index.js

@@ -4,7 +4,7 @@ import { UHTMLComboboxElement } from "@u-elements/u-combobox";
 import * as UTabs from "@u-elements/u-tabs";
 export * from "@u-elements/u-datalist";
 //#region package.json
-var version = "1.19.1";
+var version = "1.20.1";
 //#endregion
 //#region src/utils/utils.ts
 const ARIA_DESC = "aria-description";
@@ -212,9 +212,10 @@ const handleClickDelegateFor = (event) => {
 	const target = getComposedTarget(event);
 	const delegateTarget = event.button < 2 && getDelegateTarget(event);
 	if (!delegateTarget || delegateTarget.contains(target)) return;
+	for (const el of getComposedPath(target)) if (el.control === delegateTarget) return;
 	if (isNewTab && delegateTarget instanceof HTMLAnchorElement) return window.open(delegateTarget.href, void 0, delegateTarget.rel);
 	event.stopImmediatePropagation();
-	if (delegateTarget.nodeName !== "LABEL") delegateTarget.click();
+	delegateTarget.click();
 };
 let HOVER;
 let TARGET$1;
@@ -280,9 +281,14 @@ onHotReload("dialog", () => [
 //#region src/fieldset/fieldset.ts
 const FIELDSETS = isBrowser() ? document.getElementsByTagName("fieldset") : [];
 const handleFieldsetMutations = () => {
-	for (const el of FIELDSETS) {
-		if (el.hasAttribute("aria-labelledby")) continue;
-		attr(el, ARIA_LABELLEDBY, `${useId(el.querySelector("legend"))} ${useId(el.querySelector(":scope > :is([data-field=\"description\"],legend + p)"))}`.trim() || null);
+	for (const fieldset of FIELDSETS) {
+		if (fieldset.hasAttribute("aria-labelledby")) continue;
+		let labelledby = "";
+		for (const el of fieldset.children) {
+			const name = el.nodeName;
+			if (name === "LEGEND" || el.getAttribute("data-field") === "description" || name === "P" && el.previousElementSibling?.nodeName === "LEGEND") labelledby += `${useId(el)} `;
+		}
+		attr(fieldset, ARIA_LABELLEDBY, labelledby.trim() || null);
 	}
 };
 onHotReload("fieldset", () => [onMutation(document, handleFieldsetMutations, {
@@ -699,7 +705,7 @@ function apply$1() {
 //#region src/invokers/invokers.ts
 if (isBrowser() && !isSupported$1()) apply$1();
 //#endregion
-//#region ../../node_modules/.pnpm/@oddbird+popover-polyfill@0.7.1/node_modules/@oddbird/popover-polyfill/dist/popover-fn.js
+//#region ../../node_modules/.pnpm/@oddbird+popover-polyfill@0.7.1_patch_hash=6227913935a153774e0e2569cb889d63767e7a5d572dbc6beeadfb2e77ed5c11/node_modules/@oddbird/popover-polyfill/dist/popover-fn.js
 var ToggleEvent = class extends Event {
 	oldState;
 	newState;
@@ -1035,7 +1041,7 @@ function setInvokerAriaExpanded(el, force = false) {
 var ShadowRoot2 = globalThis.ShadowRoot || function() {};
 var DEFAULT_LAYER_NAME = "popover-polyfill";
 function isSupported() {
-	return typeof HTMLElement !== "undefined" && typeof HTMLElement.prototype === "object" && "popover" in HTMLElement.prototype;
+	return typeof HTMLElement !== "undefined" && typeof HTMLElement.prototype === "object" && "popover" in HTMLElement.prototype && "showPopover" in HTMLElement.prototype;
 }
 function isPolyfilled() {
 	var _a;
@@ -1054,7 +1060,7 @@ function hasLayerSupport() {
 function getStyles(layerName) {
 	var _a;
 	const useLayer = hasLayerSupport();
-	const layerNameEscaped = (layerName ?? ((_a = window.POPOVER_POLYFILL_OPTIONS) == null ? void 0 : _a.layerName) ?? DEFAULT_LAYER_NAME).split(".").map(CSS.escape).join(".");
+	const layerNameEscaped = (layerName ?? ((_a = window.POPOVER_POLYFILL_OPTIONS) == null ? void 0 : _a.layerName) ?? DEFAULT_LAYER_NAME).split(".").map((c) => CSS.escape(c)).join(".");
 	return `
 ${useLayer ? `@layer ${layerNameEscaped} {` : ""}
   :where([popover]) {
@@ -1128,7 +1134,7 @@ function injectStyles(root, layerName) {
 	} catch {
 		popoverStyleSheet = false;
 	}
-	if (popoverStyleSheet === false) {
+	if (popoverStyleSheet === false || !root.adoptedStyleSheets) {
 		const sheet = document.createElement("style");
 		sheet.textContent = styles;
 		if (root instanceof Document) root.head.prepend(sheet);
@@ -1169,6 +1175,7 @@ function apply(opts) {
 		showPopover: {
 			enumerable: true,
 			configurable: true,
+			writable: true,
 			value(options = {}) {
 				showPopover(this);
 			}
@@ -1176,6 +1183,7 @@ function apply(opts) {
 		hidePopover: {
 			enumerable: true,
 			configurable: true,
+			writable: true,
 			value() {
 				hidePopover(this, true, true);
 			}
@@ -1183,6 +1191,7 @@ function apply(opts) {
 		togglePopover: {
 			enumerable: true,
 			configurable: true,
+			writable: true,
 			value(options = {}) {
 				if (typeof options === "boolean") options = { force: options };
 				if (visibilityState.get(this) === "showing" && options.force === void 0 || options.force === false) hidePopover(this, true, true);
@@ -1282,7 +1291,7 @@ function apply(opts) {
 	const onKeydown = (event) => {
 		const key = event.key;
 		const target = event.target;
-		if (!event.defaultPrevented && target && (key === "Escape" || key === "Esc")) hideAllPopoversUntil(target.ownerDocument, true, true);
+		if (!event.defaultPrevented && target && (key === "Escape" || key === "Esc")) hideAllPopoversUntil(target.ownerDocument || target, true, true);
 	};
 	const addEventListeners = (root) => {
 		root.addEventListener("click", handleInvokerActivation);
@@ -1321,6 +1330,7 @@ function toggle(el, newState, oldState, source) {
 	const shiftProp = placement.match(/left|right/gi) ? "Height" : "Width";
 	const shiftLimit = source[`offset${shiftProp}`] / 2 + arrowSize;
 	if (placement === "none") return;
+	let sized = false;
 	const options = {
 		strategy: "absolute",
 		placement,
@@ -1336,8 +1346,14 @@ function toggle(el, newState, oldState, source) {
 				crossAxis: false
 			})] : [],
 			...overscroll ? [size({ apply({ availableHeight }) {
-				if (overscroll === "fit") el.style.width = `${source.offsetWidth}px`;
-				el.style.maxHeight = `${Math.max(50, availableHeight - padding * 2)}px`;
+				if (sized) return;
+				sized = true;
+				const width = `${source.offsetWidth}px`;
+				const maxHeight = `${Math.max(50, availableHeight - padding * 2)}px`;
+				requestAnimationFrame(() => {
+					if (overscroll === "fit" && el.style.width !== width) el.style.width = width;
+					if (el.style.maxHeight !== maxHeight) el.style.maxHeight = maxHeight;
+				});
 			} })] : []
 		]
 	};
@@ -1363,40 +1379,62 @@ const handleClick$1 = (e) => {
 	if (root instanceof ShadowRoot && !ROOTS.has(root)) ROOTS.set(root, on(root, "toggle", handleToggle, QUICK_EVENT));
 };
 onHotReload("popover", () => {
-	const isFunction = (fn) => typeof fn === "function";
+	const descriptors = Object.getOwnPropertyDescriptors(HTMLElement.prototype);
 	const togglePopover = HTMLElement.prototype.togglePopover;
 	const showPopover = HTMLElement.prototype.showPopover;
 	const hidePopover = HTMLElement.prototype.hidePopover;
-	if (isFunction(togglePopover)) HTMLElement.prototype.togglePopover = function(opt) {
-		const isOpen = this.matches(":popover-open");
-		const isBool = typeof opt === "boolean";
-		const prev = isOpen ? "open" : "closed";
-		const next = (isBool ? opt : opt?.force ?? !isOpen) ? "open" : "closed";
-		const source = isBool ? void 0 : opt?.source;
-		const result = togglePopover.call(this, opt);
-		toggle(this, next, prev, source);
-		return result;
-	};
-	if (isFunction(showPopover)) HTMLElement.prototype.showPopover = function(opt) {
-		const prev = this.matches(":popover-open") ? "open" : "closed";
-		const result = showPopover.call(this, opt);
-		toggle(this, "open", prev, opt?.source);
-		return result;
-	};
-	if (isFunction(hidePopover)) HTMLElement.prototype.hidePopover = function() {
-		const prev = this.matches(":popover-open") ? "open" : "closed";
-		const result = hidePopover.call(this);
-		toggle(this, "closed", prev);
-		return result;
-	};
+	Object.defineProperties(HTMLElement.prototype, {
+		togglePopover: {
+			...descriptors.togglePopover,
+			value(opt) {
+				const isOpen = this.matches(":popover-open");
+				const isBool = typeof opt === "boolean";
+				const prev = isOpen ? "open" : "closed";
+				const next = (isBool ? opt : opt?.force ?? !isOpen) ? "open" : "closed";
+				const source = isBool ? void 0 : opt?.source;
+				const result = togglePopover?.call(this, opt);
+				toggle(this, next, prev, source);
+				return result;
+			}
+		},
+		showPopover: {
+			...descriptors.showPopover,
+			value(opt) {
+				const prev = this.matches(":popover-open") ? "open" : "closed";
+				const result = showPopover?.call(this, opt);
+				toggle(this, "open", prev, opt?.source);
+				return result;
+			}
+		},
+		hidePopover: {
+			...descriptors.hidePopover,
+			value() {
+				const prev = this.matches(":popover-open") ? "open" : "closed";
+				const result = hidePopover?.call(this);
+				toggle(this, "closed", prev);
+				return result;
+			}
+		}
+	});
 	return [
 		on(document, "click", handleClick$1, QUICK_EVENT),
 		on(document, "pointerdown pointerup scroll", handleScrollbar, QUICK_EVENT),
 		on(document, "toggle ds-toggle-source", handleToggle, QUICK_EVENT),
 		() => {
-			HTMLElement.prototype.togglePopover = togglePopover;
-			HTMLElement.prototype.showPopover = showPopover;
-			HTMLElement.prototype.hidePopover = hidePopover;
+			Object.defineProperties(HTMLElement.prototype, {
+				togglePopover: {
+					...descriptors.togglePopover,
+					value: togglePopover
+				},
+				showPopover: {
+					...descriptors.showPopover,
+					value: showPopover
+				},
+				hidePopover: {
+					...descriptors.hidePopover,
+					value: hidePopover
+				}
+			});
 			for (const [, off] of ROOTS) off();
 			ROOTS.clear();
 		}
@@ -1688,9 +1726,12 @@ const render$2 = (self) => {
 customElements.define("ds-error-summary", DSErrorSummaryElement);
 //#endregion
 //#region src/field/field.ts
+const ATTR_FIELD = "data-field";
+const ATTR_LIMIT = "data-limit";
 const ATTR_INVALID = "aria-invalid";
 const ATTR_DESCRIBEDBY = "aria-describedby";
 const ATTR_INDETERMINATE = "data-indeterminate";
+const SELECTOR_VALIDATION = `:scope > [${ATTR_FIELD}="validation"]`;
 const COUNTER_DEBOUNCE = isWindows() ? 800 : 200;
 const WARNING_MULTIPLE_INPUTS = `Fields should only have one input element. Use <fieldset> to group multiple fields:`;
 const handleFieldMutation = (field) => {
@@ -1706,22 +1747,22 @@ const handleFieldMutation = (field) => {
 		if (isInputLike(el)) if (field._input?.isConnected && field._input !== el) warn(WARNING_MULTIPLE_INPUTS, field);
 		else field._input = el;
 		else {
-			const type = el.getAttribute("data-field");
+			const type = el.getAttribute(ATTR_FIELD);
 			if (type === "counter") field._counter = el;
 			if (type === "validation") {
 				nextDescs.unshift(useId(el));
 				hasValidation = true;
-				invalid = invalid || isInvalid(el);
+				invalid = invalid || isInvalidColor(el);
 			} else if (type) nextDescs.push(useId(el));
 		}
 	}
 	if (!field._input?.isConnected) return;
 	const input = field._input;
 	for (const label of labels) attr(label, "for", useId(input) || null);
-	const fieldsetValidation = field.closest("fieldset")?.querySelector(":scope > [data-field=\"validation\"]");
+	const fieldsetValidation = field.closest("fieldset")?.querySelector(SELECTOR_VALIDATION);
 	if (fieldsetValidation && !fieldsetValidation?.hidden) {
 		hasValidation = true;
-		invalid = invalid || isInvalid(fieldsetValidation);
+		invalid = invalid || isInvalidColor(fieldsetValidation);
 		nextDescs.unshift(useId(fieldsetValidation));
 	}
 	const indeterminate = attr(input, ATTR_INDETERMINATE);
@@ -1732,7 +1773,7 @@ const handleFieldMutation = (field) => {
 	field._descs = nextDescs;
 	const hadValidation = field._validation;
 	if (hasValidation && !hadValidation && !input.hasAttribute(ATTR_INVALID)) {
-		attr(input, ATTR_INVALID, "true");
+		attr(input, ATTR_INVALID, invalid ? "true" : null);
 		field._validation = true;
 	} else if (!hasValidation && hadValidation) {
 		attr(input, ATTR_INVALID, null);
@@ -1745,9 +1786,12 @@ const TEXTS = {
 	under: "%d tegn igjen"
 };
 const debouncedCounterLiveRegion = debounce((input, text) => {
-	if (document.activeElement === input) announce(text);
+	if (document?.activeElement === input) announce(text);
 }, COUNTER_DEBOUNCE);
-const isInvalid = (el) => el.getAttribute("data-color") !== "success";
+const isInvalidColor = (el) => {
+	const color = el.getAttribute("data-color");
+	return !color || color === "danger";
+};
 const isInputLike = (el) => el instanceof HTMLElement && "validity" in el && !(el instanceof HTMLButtonElement) && el.type !== "hidden";
 var DSFieldElement = class extends DSElement {
 	_counter;
@@ -1760,8 +1804,8 @@ var DSFieldElement = class extends DSElement {
 		this._unevents = on(this, "input", this, QUICK_EVENT);
 		this._unmutate = onMutation(this, () => handleFieldMutation(this), {
 			attributeFilter: [
-				"data-field",
-				"data-limit",
+				ATTR_FIELD,
+				ATTR_LIMIT,
 				"hidden",
 				"id",
 				"value",
@@ -1775,13 +1819,14 @@ var DSFieldElement = class extends DSElement {
 	handleEvent(event) {
 		const { _counter, _input } = this;
 		if (_counter?.isConnected && _input) {
-			const count = (Number(attr(_counter, "data-limit")) || 0) - _input.value.length;
+			const count = (Number(attr(_counter, ATTR_LIMIT)) || 0) - _input.value.length;
 			const state = count < 0 ? "over" : "under";
 			const label = (attrOrCSS(_counter, `data-${state}`) || TEXTS[state])?.replace("%d", `${Math.abs(count)}`);
 			if (!label) warn(`Missing data-${state} on:`, _counter);
 			attr(_counter, "data-label", label);
 			attr(_counter, "data-state", state);
 			attr(_counter, "data-color", count < 0 ? "danger" : null);
+			attr(_input, "aria-invalid", count < 0 ? "true" : null);
 			if (event?.type === "input" && label) debouncedCounterLiveRegion(_input, label);
 		}
 		if (_input instanceof HTMLTextAreaElement) {
@@ -1902,14 +1947,12 @@ var DSSuggestionElement = class extends UHTMLComboboxElement {
 const render = (self) => {
 	const { control, list } = self;
 	const datalist = list || self.querySelector("u-datalist");
-	if (control) {
-		attr(control, "popovertarget", list ? useId(list) : null);
-		if (!control.placeholder) attr(control, "placeholder", " ");
-	}
+	if (control) attr(control, "popovertarget", list ? useId(list) : null);
 	if (datalist) {
 		attr(datalist, "popover", "manual");
 		attr(datalist, "data-is-floating", "true");
 	}
+	handleEmpty({ currentTarget: self });
 };
 const handleEmpty = ({ currentTarget: self }) => {
 	const { creatable, control, options } = self;