@db-ux/react-core-components 4.9.0 → 4.10.0

package/dist/utils/floating-components.js

@@ -1,359 +1,108 @@
-// TODO: We should reevaluate this as soon as CSS Anchor Positioning is supported in all relevant browsers
-const isInView = (el) => {
-    var _a;
-    const { top, bottom, left, right } = el.getBoundingClientRect();
-    const { innerHeight, innerWidth } = window;
-    let outTop = top < 0;
-    let outBottom = bottom > innerHeight;
-    let outLeft = left < 0;
-    let outRight = right > innerWidth;
-    // We need to check if it was already outside
-    const outsideY = el.dataset['outsideVy'];
-    const outsideX = el.dataset['outsideVx'];
-    const parentRect = (_a = el === null || el === void 0 ? void 0 : el.parentElement) === null || _a === void 0 ? void 0 : _a.getBoundingClientRect();
-    if (parentRect) {
-        if (outsideY) {
-            const position = el.dataset['outsideVy'];
-            if (position === 'top') {
-                outTop = parentRect.top - (bottom - parentRect.bottom) < 0;
-            }
-            else {
-                outBottom = parentRect.bottom + (parentRect.top - top) > innerHeight;
-            }
-        }
-        if (outsideX) {
-            const position = el.dataset['outsideVx'];
-            if (position === 'left') {
-                outLeft = parentRect.left - (right - parentRect.right) < 0;
-            }
-            else {
-                outRight = parentRect.right + (parentRect.left - left) > innerWidth;
-            }
-        }
-    }
-    return {
-        outTop,
-        outBottom,
-        outLeft,
-        outRight
-    };
-};
-export const handleDataOutside = (el) => {
-    const { outTop, outBottom, outLeft, outRight } = isInView(el);
-    let dataOutsidePair = {};
-    if (outTop || outBottom) {
-        dataOutsidePair = {
-            vy: outTop ? 'top' : 'bottom'
-        };
-        el.dataset['outsideVy'] = dataOutsidePair.vy;
-    }
-    else {
-        delete el.dataset['outsideVy'];
-    }
-    if (outLeft || outRight) {
-        dataOutsidePair = Object.assign(Object.assign({}, dataOutsidePair), { vx: outRight ? 'right' : 'left' });
-        el.dataset['outsideVx'] = dataOutsidePair.vx;
-    }
-    else {
-        delete el.dataset['outsideVx'];
-    }
-    return dataOutsidePair;
-};
-export const handleFixedDropdown = (element, parent, placement) => {
-    if (!element || !parent)
-        return;
-    // We skip this if we are in mobile it's already fixed
-    if (getComputedStyle(element).zIndex === '9999')
-        return;
-    const { top, bottom, childHeight, childWidth, width, right, left, correctedPlacement } = getFloatingProps(element, parent, placement);
-    const fullWidth = element.dataset['width'] === 'full';
-    if (fullWidth) {
-        element.style.inlineSize = `${width}px`;
-    }
-    if (correctedPlacement === 'top' || correctedPlacement === 'bottom' || correctedPlacement === 'top-start' || correctedPlacement === 'bottom-start') {
-        element.style.insetInlineStart = `${left}px`;
-    }
-    else if (correctedPlacement === 'top-end' || correctedPlacement === 'bottom-end') {
-        element.style.insetInlineStart = `${right - childWidth}px`;
-    }
-    if (correctedPlacement === null || correctedPlacement === void 0 ? void 0 : correctedPlacement.startsWith('top')) {
-        element.style.insetBlockStart = `${top - childHeight}px`;
-    }
-    else if (correctedPlacement === null || correctedPlacement === void 0 ? void 0 : correctedPlacement.startsWith('bottom')) {
-        element.style.insetBlockStart = `${bottom}px`;
-    }
-    element.style.position = 'fixed';
-};
-export const getFloatingProps = (element, parent, placement) => {
-    if (!element || !parent) {
-        return {
-            top: 0,
-            bottom: 0,
-            right: 0,
-            height: 0,
-            width: 0,
-            left: 0,
-            childHeight: 0,
-            childWidth: 0,
-            correctedPlacement: placement,
-            innerWidth: window.innerWidth,
-            innerHeight: window.innerHeight
-        };
-    }
-    const childRect = element.getBoundingClientRect();
-    const { top, height, bottom, right, left, width } = parent.getBoundingClientRect();
-    const { innerHeight, innerWidth } = window;
-    let childHeight = childRect.height;
-    let childWidth = childRect.width;
-    if (placement === 'bottom' || placement === 'top') {
-        childWidth = childWidth / 2;
-    }
-    if (placement === 'left' || placement === 'right') {
-        childHeight = childHeight / 2;
-    }
-    const outsideBottom = bottom + childHeight > innerHeight;
-    const outsideTop = top - childHeight < 0;
-    const outsideLeft = left - childWidth < 0;
-    const outsideRight = right + childWidth > innerWidth;
-    let correctedPlacement = placement;
-    if (placement.startsWith('bottom')) {
-        if (outsideBottom) {
-            correctedPlacement = placement === null || placement === void 0 ? void 0 : placement.replace('bottom', 'top');
-            if (outsideLeft && outsideRight) {
-                correctedPlacement = 'top';
-            }
-            else if (outsideLeft) {
-                correctedPlacement = 'top-start';
-            }
-            else if (outsideRight) {
-                correctedPlacement = 'top-end';
-            }
-        }
-        else {
-            if (outsideLeft && outsideRight) {
-                correctedPlacement = 'bottom';
-            }
-            else if (outsideLeft) {
-                correctedPlacement = 'bottom-start';
-            }
-            else if (outsideRight) {
-                correctedPlacement = 'bottom-end';
-            }
-        }
-    }
-    else if (placement.startsWith('top')) {
-        if (outsideTop) {
-            correctedPlacement = placement === null || placement === void 0 ? void 0 : placement.replace('top', 'bottom');
-            if (outsideLeft && outsideRight) {
-                correctedPlacement = 'bottom';
-            }
-            else if (outsideLeft) {
-                correctedPlacement = 'bottom-start';
-            }
-            else if (outsideRight) {
-                correctedPlacement = 'bottom-end';
-            }
-        }
-        else {
-            if (outsideLeft && outsideRight) {
-                correctedPlacement = 'top';
-            }
-            else if (outsideLeft) {
-                correctedPlacement = 'top-start';
-            }
-            else if (outsideRight) {
-                correctedPlacement = 'top-end';
-            }
-        }
-    }
-    else if (placement.startsWith('left')) {
-        if (outsideLeft) {
-            correctedPlacement = placement === null || placement === void 0 ? void 0 : placement.replace('left', 'right');
-            if (outsideBottom && outsideTop) {
-                correctedPlacement = 'right';
-            }
-            else if (outsideBottom) {
-                correctedPlacement = 'right-end';
-            }
-            else if (outsideTop) {
-                correctedPlacement = 'right-start';
-            }
-        }
-        else {
-            if (outsideBottom && outsideTop) {
-                correctedPlacement = 'left';
-            }
-            else if (outsideBottom) {
-                correctedPlacement = 'left-end';
-            }
-            else if (outsideTop) {
-                correctedPlacement = 'left-start';
-            }
-        }
-    }
-    else if (correctedPlacement.startsWith('right')) {
-        if (outsideRight) {
-            correctedPlacement = placement === null || placement === void 0 ? void 0 : placement.replace('right', 'left');
-            if (outsideBottom && outsideTop) {
-                correctedPlacement = 'left';
-            }
-            else if (outsideBottom) {
-                correctedPlacement = 'left-end';
-            }
-            else if (outsideTop) {
-                correctedPlacement = 'left-start';
-            }
-        }
-        else {
-            if (outsideBottom && outsideTop) {
-                correctedPlacement = 'right';
-            }
-            else if (outsideBottom) {
-                correctedPlacement = 'right-end';
-            }
-            else if (outsideTop) {
-                correctedPlacement = 'right-start';
-            }
-        }
-    }
-    return {
-        top,
-        bottom,
-        right,
-        height,
-        width,
-        left,
-        childHeight: childRect.height,
-        childWidth: childRect.width,
-        correctedPlacement,
-        innerWidth,
-        innerHeight
-    };
-};
-const MAX_ANCESTOR_DEPTH = 10;
-const ancestorCache = new WeakMap();
-const getAncestorHasCorrectedPlacement = (element) => {
-    if (ancestorCache.has(element)) {
-        return ancestorCache.get(element);
-    }
-    let current = element.parentElement;
-    let anchor = 0;
-    while (current && anchor < MAX_ANCESTOR_DEPTH) {
-        if (current.dataset['correctedPlacement']) {
-            ancestorCache.set(element, current);
-            return current;
-        }
-        current = current.parentElement;
-        anchor += 1;
-    }
-    ancestorCache.set(element, null);
-    return null;
-};
-export const handleFixedPopover = (element, parent, placement) => {
-    var _a, _b;
-    if (!element || !parent)
-        return;
-    const parentComputedStyles = getComputedStyle(parent);
-    const parentHasFloatingPosition = ['absolute', 'fixed'].includes(parentComputedStyles.position);
-    const ancestorWithCorrectedPlacement = getAncestorHasCorrectedPlacement(element);
-    const noFloatingAncestor = !ancestorWithCorrectedPlacement && !parentHasFloatingPosition;
-    const distance = (_b = (_a = getComputedStyle(element)) === null || _a === void 0 ? void 0 : _a.getPropertyValue('--db-popover-distance')) !== null && _b !== void 0 ? _b : '0px';
-    let { top, height, width, childHeight, childWidth, right, left, bottom, correctedPlacement, innerWidth, innerHeight } = getFloatingProps(element, parent, placement);
-    if (ancestorWithCorrectedPlacement) {
-        const ancestorRect = ancestorWithCorrectedPlacement.getBoundingClientRect();
-        left = Math.abs(left - ancestorRect.left);
-        right = (width + Math.abs(right - ancestorRect.right)) * 1.5; // We add a transform -50% later
-        top = Math.abs(top - ancestorRect.top);
-        bottom = (height + Math.abs(bottom - ancestorRect.bottom)) * 1.5; // We add a transform -50% later
-    }
-    if (parentHasFloatingPosition) {
-        /*
-         * If we have a floating element inside an element with position:absolute/fixed
-         * we need to calculate with relative values
-         * */
-        left = 0;
-        right = width;
-        top = 0;
-        bottom = height;
-        if (['auto', 'inherit', '0'].includes(parentComputedStyles.zIndex)) {
-            // We need the default zIndex for floating elements on the parent
-            parent.style.zIndex = '1';
-        }
-    }
-    // Tooltip arrow position
-    if (childWidth > width && (correctedPlacement.startsWith('bottom') || correctedPlacement.startsWith('top'))) {
-        const diff = width / 2 / childWidth * 100;
-        if (correctedPlacement.endsWith('start')) {
-            element.style.setProperty('--db-tooltip-arrow-inline-start', `${diff}%`);
-        }
-        else if (correctedPlacement.endsWith('end')) {
-            element.style.setProperty('--db-tooltip-arrow-inline-start', `${100 - diff}%`);
-        }
-        else {
-            element.style.setProperty('--db-tooltip-arrow-inline-start', `50%`);
-        }
-    }
-    if (childHeight > height && (correctedPlacement.startsWith('left') || correctedPlacement.startsWith('bottom'))) {
-        const diff = height / 2 / childHeight * 100;
-        if (correctedPlacement.endsWith('start')) {
-            element.style.setProperty('--db-tooltip-arrow-block-start', `${diff}%`);
-        }
-        else if (correctedPlacement.endsWith('end')) {
-            element.style.setProperty('--db-tooltip-arrow-block-start', `${100 - diff}%`);
-        }
-        else {
-            element.style.setProperty('--db-tooltip-arrow-block-start', `50%`);
-        }
-    }
-    // Popover position
-    if (correctedPlacement === 'right' || correctedPlacement === 'left') {
-        // center horizontally
-        element.style.insetBlockStart = `${top + height / 2}px`;
-    }
-    else if (correctedPlacement === 'right-start' || correctedPlacement === 'left-start') {
-        const end = top + childHeight;
-        element.style.insetBlockStart = `${top}px`;
-        element.style.insetBlockEnd = `${!parentHasFloatingPosition && end > innerHeight ? innerHeight : end}px`;
-    }
-    else if (correctedPlacement === 'right-end' || correctedPlacement === 'left-end') {
-        const start = bottom - childHeight;
-        element.style.insetBlockStart = `${!parentHasFloatingPosition && start < 0 ? 0 : start}px`;
-        element.style.insetBlockEnd = `${bottom}px`;
-    }
-    else if (correctedPlacement === 'top' || correctedPlacement === 'bottom') {
-        // center vertically
-        element.style.insetInlineStart = `${left + width / 2}px`;
-    }
-    else if (correctedPlacement === 'top-start' || correctedPlacement === 'bottom-start') {
-        const end = left + childWidth;
-        element.style.insetInlineStart = `${left}px`;
-        element.style.insetInlineEnd = `${!parentHasFloatingPosition && end > innerWidth ? innerWidth : end}px`;
-    }
-    else if (correctedPlacement === 'top-end' || correctedPlacement === 'bottom-end') {
-        const start = right - childWidth;
-        element.style.insetInlineStart = `${!parentHasFloatingPosition && start < 0 ? 0 : start}px`;
-        element.style.insetInlineEnd = `${right}px`;
-    }
-    if (correctedPlacement === null || correctedPlacement === void 0 ? void 0 : correctedPlacement.startsWith('right')) {
-        const end = right + childWidth;
-        element.style.insetInlineStart = `calc(${right}px + ${distance})`;
-        element.style.insetInlineEnd = `calc(${noFloatingAncestor && end > innerWidth ? innerWidth : end}px + ${distance})`;
-    }
-    else if (correctedPlacement === null || correctedPlacement === void 0 ? void 0 : correctedPlacement.startsWith('left')) {
-        const start = left - childWidth;
-        element.style.insetInlineStart = `calc(${noFloatingAncestor && start < 0 ? 0 : start}px - ${distance})`;
-        element.style.insetInlineEnd = `calc(${right}px - ${distance})`;
-    }
-    else if (correctedPlacement === null || correctedPlacement === void 0 ? void 0 : correctedPlacement.startsWith('top')) {
-        const start = top - childHeight;
-        element.style.insetBlockStart = `calc(${noFloatingAncestor && start < 0 ? 0 : start}px - ${distance})`;
-        element.style.insetBlockEnd = `calc(${parentHasFloatingPosition ? start : bottom}px - ${distance})`;
-    }
-    else if (correctedPlacement === null || correctedPlacement === void 0 ? void 0 : correctedPlacement.startsWith('bottom')) {
-        const end = bottom + childHeight;
-        element.style.insetBlockStart = `calc(${parentHasFloatingPosition ? end : bottom}px + ${distance})`;
-        element.style.insetBlockEnd = `calc(${noFloatingAncestor && end > innerHeight ? innerHeight : end}px + ${distance})`;
-    }
-    element.style.position = 'fixed';
-    element.dataset['correctedPlacement'] = correctedPlacement;
+//#region src/utils/floating-components.ts
+var e = (e) => {
+	let { top: t, bottom: n, left: r, right: i } = e.getBoundingClientRect(), { innerHeight: a, innerWidth: o } = window, s = t < 0, c = n > a, l = r < 0, u = i > o, d = e.dataset.outsideVy, f = e.dataset.outsideVx, p = e?.parentElement?.getBoundingClientRect();
+	return p && (d && (e.dataset.outsideVy === "top" ? s = p.top - (n - p.bottom) < 0 : c = p.bottom + (p.top - t) > a), f && (e.dataset.outsideVx === "left" ? l = p.left - (i - p.right) < 0 : u = p.right + (p.left - r) > o)), {
+		outTop: s,
+		outBottom: c,
+		outLeft: l,
+		outRight: u
+	};
+}, t = (t) => {
+	let { outTop: n, outBottom: r, outLeft: i, outRight: a } = e(t), o = {};
+	return n || r ? (o = { vy: n ? "top" : "bottom" }, t.dataset.outsideVy = o.vy) : delete t.dataset.outsideVy, i || a ? (o = {
+		...o,
+		vx: a ? "right" : "left"
+	}, t.dataset.outsideVx = o.vx) : delete t.dataset.outsideVx, o;
+}, n = (e, t, n) => {
+	if (!e || !t || getComputedStyle(e).zIndex === "9999") return;
+	let { top: i, bottom: a, childHeight: o, childWidth: s, width: c, right: l, left: u, correctedPlacement: d } = r(e, t, n);
+	e.dataset.width === "full" && (e.style.inlineSize = `${c}px`), d === "top" || d === "bottom" || d === "top-start" || d === "bottom-start" ? e.style.insetInlineStart = `${u}px` : (d === "top-end" || d === "bottom-end") && (e.style.insetInlineStart = `${l - s}px`), d?.startsWith("top") ? e.style.insetBlockStart = `${i - o}px` : d?.startsWith("bottom") && (e.style.insetBlockStart = `${a}px`), e.style.position = "fixed";
+}, r = (e, t, n) => {
+	if (!e || !t) return {
+		top: 0,
+		bottom: 0,
+		right: 0,
+		height: 0,
+		width: 0,
+		left: 0,
+		childHeight: 0,
+		childWidth: 0,
+		correctedPlacement: n,
+		innerWidth: window.innerWidth,
+		innerHeight: window.innerHeight
+	};
+	let r = e.getBoundingClientRect(), { top: i, height: a, bottom: o, right: s, left: c, width: l } = t.getBoundingClientRect(), { innerHeight: u, innerWidth: d } = window, f = r.height, p = r.width;
+	(n === "bottom" || n === "top") && (p /= 2), (n === "left" || n === "right") && (f /= 2);
+	let m = o + f > u, h = i - f < 0, g = c - p < 0, _ = s + p > d, v = n;
+	return n.startsWith("bottom") ? m ? (v = n?.replace("bottom", "top"), g && _ ? v = "top" : g ? v = "top-start" : _ && (v = "top-end")) : g && _ ? v = "bottom" : g ? v = "bottom-start" : _ && (v = "bottom-end") : n.startsWith("top") ? h ? (v = n?.replace("top", "bottom"), g && _ ? v = "bottom" : g ? v = "bottom-start" : _ && (v = "bottom-end")) : g && _ ? v = "top" : g ? v = "top-start" : _ && (v = "top-end") : n.startsWith("left") ? g ? (v = n?.replace("left", "right"), m && h ? v = "right" : m ? v = "right-end" : h && (v = "right-start")) : m && h ? v = "left" : m ? v = "left-end" : h && (v = "left-start") : v.startsWith("right") && (_ ? (v = n?.replace("right", "left"), m && h ? v = "left" : m ? v = "left-end" : h && (v = "left-start")) : m && h ? v = "right" : m ? v = "right-end" : h && (v = "right-start")), {
+		top: i,
+		bottom: o,
+		right: s,
+		height: a,
+		width: l,
+		left: c,
+		childHeight: r.height,
+		childWidth: r.width,
+		correctedPlacement: v,
+		innerWidth: d,
+		innerHeight: u
+	};
+}, i = 10, a = /* @__PURE__ */ new WeakMap(), o = (e) => {
+	if (a.has(e)) return a.get(e);
+	let t = e.parentElement, n = 0;
+	for (; t && n < i;) {
+		if (t.dataset.correctedPlacement) return a.set(e, t), t;
+		t = t.parentElement, n += 1;
+	}
+	return a.set(e, null), null;
+}, s = (e, t, n) => {
+	if (!e || !t) return;
+	let i = getComputedStyle(t), a = ["absolute", "fixed"].includes(i.position), s = o(e), c = !s && !a, l = getComputedStyle(e)?.getPropertyValue("--db-popover-distance") ?? "0px", { top: u, height: d, width: f, childHeight: p, childWidth: m, right: h, left: g, bottom: _, correctedPlacement: v, innerWidth: y, innerHeight: b } = r(e, t, n);
+	if (s) {
+		let e = s.getBoundingClientRect();
+		g = Math.abs(g - e.left), h = (f + Math.abs(h - e.right)) * 1.5, u = Math.abs(u - e.top), _ = (d + Math.abs(_ - e.bottom)) * 1.5;
+	}
+	if (a && (g = 0, h = f, u = 0, _ = d, [
+		"auto",
+		"inherit",
+		"0"
+	].includes(i.zIndex) && (t.style.zIndex = "1")), m > f && (v.startsWith("bottom") || v.startsWith("top"))) {
+		let t = f / 2 / m * 100;
+		v.endsWith("start") ? e.style.setProperty("--db-tooltip-arrow-inline-start", `${t}%`) : v.endsWith("end") ? e.style.setProperty("--db-tooltip-arrow-inline-start", `${100 - t}%`) : e.style.setProperty("--db-tooltip-arrow-inline-start", "50%");
+	}
+	if (p > d && (v.startsWith("left") || v.startsWith("bottom"))) {
+		let t = d / 2 / p * 100;
+		v.endsWith("start") ? e.style.setProperty("--db-tooltip-arrow-block-start", `${t}%`) : v.endsWith("end") ? e.style.setProperty("--db-tooltip-arrow-block-start", `${100 - t}%`) : e.style.setProperty("--db-tooltip-arrow-block-start", "50%");
+	}
+	if (v === "right" || v === "left") e.style.insetBlockStart = `${u + d / 2}px`;
+	else if (v === "right-start" || v === "left-start") {
+		let t = u + p;
+		e.style.insetBlockStart = `${u}px`, e.style.insetBlockEnd = `${!a && t > b ? b : t}px`;
+	} else if (v === "right-end" || v === "left-end") {
+		let t = _ - p;
+		e.style.insetBlockStart = `${!a && t < 0 ? 0 : t}px`, e.style.insetBlockEnd = `${_}px`;
+	} else if (v === "top" || v === "bottom") e.style.insetInlineStart = `${g + f / 2}px`;
+	else if (v === "top-start" || v === "bottom-start") {
+		let t = g + m;
+		e.style.insetInlineStart = `${g}px`, e.style.insetInlineEnd = `${!a && t > y ? y : t}px`;
+	} else if (v === "top-end" || v === "bottom-end") {
+		let t = h - m;
+		e.style.insetInlineStart = `${!a && t < 0 ? 0 : t}px`, e.style.insetInlineEnd = `${h}px`;
+	}
+	if (v?.startsWith("right")) {
+		let t = h + m;
+		e.style.insetInlineStart = `calc(${h}px + ${l})`, e.style.insetInlineEnd = `calc(${c && t > y ? y : t}px + ${l})`;
+	} else if (v?.startsWith("left")) {
+		let t = g - m;
+		e.style.insetInlineStart = `calc(${c && t < 0 ? 0 : t}px - ${l})`, e.style.insetInlineEnd = `calc(${h}px - ${l})`;
+	} else if (v?.startsWith("top")) {
+		let t = u - p;
+		e.style.insetBlockStart = `calc(${c && t < 0 ? 0 : t}px - ${l})`, e.style.insetBlockEnd = `calc(${a ? t : _}px - ${l})`;
+	} else if (v?.startsWith("bottom")) {
+		let t = _ + p;
+		e.style.insetBlockStart = `calc(${a ? t : _}px + ${l})`, e.style.insetBlockEnd = `calc(${c && t > b ? b : t}px + ${l})`;
+	}
+	e.style.position = "fixed", e.dataset.correctedPlacement = v;
 };
+//#endregion
+export { r as getFloatingProps, t as handleDataOutside, n as handleFixedDropdown, s as handleFixedPopover };

package/dist/utils/form-components.js

@@ -1,61 +1,35 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
-import { delay } from './index';
-const specialNumberCharacters = ['.', ',', 'e', 'E', '+', '-'];
-export const handleFrameworkEventAngular = (component, event, modelValue = 'value', lastValue) => {
-    var _a;
-    const value = event.target[modelValue];
-    const type = (_a = event.target) === null || _a === void 0 ? void 0 : _a.type;
-    if (!value && value !== '' && ['date', 'time', 'week', 'month', 'datetime-local'].includes(type)) {
-        // If value is empty and type date we skip `writingValue` function
-        return;
-    }
-    if (type === 'number') {
-        if (event.type === 'input') {
-            if (specialNumberCharacters.includes(event.data) || specialNumberCharacters.some(specialCharacter => lastValue === null || lastValue === void 0 ? void 0 : lastValue.toString().includes(specialCharacter)) && event.inputType === 'deleteContentBackward') {
-                // Skip `writingValue` function if number type and input event
-                // and `.` or `,` or 'e', 'E', '+', '-' was typed
-                // or content was deleted but last number had a `.`
-                return;
-            }
-        }
-        else if (event.type === 'change') {
-            // Skip `writingValue` function if number type and change event
-            return;
-        }
-    }
-    component.propagateChange(value);
-    component.writeValue(value);
-};
-export const handleFrameworkEventVue = (emit, event, modelValue = 'value') => {
-    // TODO: Replace this with the solution out of https://github.com/BuilderIO/mitosis/issues/833 after this has been "solved"
-    emit(`update:${modelValue}`, event.target[modelValue]);
-};
-export const addResetEventListener = (element, resetFunction, signal) => {
-    if (element.form && !element._dbFormResetListenerAdded) {
-        element.form.addEventListener('reset', (event) => {
-            resetFunction(event);
-        }, {
-            signal
-        });
-        // Mark as added to avoid duplicate listeners
-        element._dbFormResetListenerAdded = true;
-    }
-};
-export const addCheckedResetEventListener = (element, props, resetFunction, signal) => {
-    addResetEventListener(element, (event) => {
-        void delay(() => {
-            const resetValue = props.checked ? props.checked : props.defaultChecked ? props.defaultChecked : element.checked;
-            const valueEvent = Object.assign(Object.assign({}, event), { target: Object.assign(Object.assign({}, event.target), { checked: resetValue }) });
-            resetFunction(valueEvent);
-        }, 1);
-    }, signal);
-};
-export const addValueResetEventListener = (element, props, resetFunction, signal) => {
-    addResetEventListener(element, (event) => {
-        void delay(() => {
-            const resetValue = props.value ? props.value : props.defaultValue ? props.defaultValue : element.value;
-            const valueEvent = Object.assign(Object.assign({}, event), { target: Object.assign(Object.assign({}, event.target), { value: resetValue }) });
-            resetFunction(valueEvent);
-        }, 1);
-    }, signal);
+import { delay as e } from "./index.js";
+//#region src/utils/form-components.ts
+var t = (e, t, n) => {
+	e.form && !e._dbFormResetListenerAdded && (e.form.addEventListener("reset", (e) => {
+		t(e);
+	}, { signal: n }), e._dbFormResetListenerAdded = !0);
+}, n = (n, r, i, a) => {
+	t(n, (t) => {
+		e(() => {
+			let e = r.checked ? r.checked : r.defaultChecked ? r.defaultChecked : n.checked;
+			i({
+				...t,
+				target: {
+					...t.target,
+					checked: e
+				}
+			});
+		}, 1);
+	}, a);
+}, r = (n, r, i, a) => {
+	t(n, (t) => {
+		e(() => {
+			let e = r.value ? r.value : r.defaultValue ? r.defaultValue : n.value;
+			i({
+				...t,
+				target: {
+					...t.target,
+					value: e
+				}
+			});
+		}, 1);
+	}, a);
 };
+//#endregion
+export { n as addCheckedResetEventListener, t as addResetEventListener, r as addValueResetEventListener };