@db-ux/react-core-components 4.11.1 → 4.12.1

package/dist/components/checkbox/checkbox.js

@@ -1,165 +1,145 @@
 "use client";
-import { filterPassingProps as e, getRootProps as t } from "../../utils/react.js";
-import { cls as n, delay as r, getBoolean as i, getHideProp as a, hasVoiceOver as o, stringPropVisible as s } from "../../utils/index.js";
-import { DEFAULT_INVALID_MESSAGE_ID_SUFFIX as c, DEFAULT_MESSAGE_ID_SUFFIX as l, DEFAULT_VALID_MESSAGE_ID_SUFFIX as u } from "../../shared/constants.js";
-import { addCheckedResetEventListener as d } from "../../utils/form-components.js";
-import f from "../infotext/infotext.js";
-import { forwardRef as p, useEffect as m, useId as h, useRef as g, useState as _ } from "react";
-import { Fragment as v, jsx as y, jsxs as b } from "react/jsx-runtime";
-//#region src/components/checkbox/checkbox.tsx
-function x(p, x) {
-	let S = h(), C = x || g(x), [w, T] = _(() => !1), [E, D] = _(() => void 0), [O, k] = _(() => void 0), [A, j] = _(() => void 0), [M, N] = _(() => void 0), [P, F] = _(() => void 0), [I, L] = _(() => void 0), [R, z] = _(() => ""), [B, V] = _(() => void 0);
-	function H() {
-		return !!(p.validMessage ?? p.validation === "valid");
-	}
-	function U() {
-		!C.current?.validity.valid || p.validation === "invalid" ? (L(M), F(p.invalidMessage || C.current?.validationMessage || "TODO: Add an invalidMessage"), o() && (z(P), r(() => z(""), 1e3))) : H() && C.current?.validity.valid && p.required ? (L(A), o() && (z(p.validMessage ?? "TODO: Add a validMessage"), r(() => z(""), 1e3))) : s(p.message, p.showMessage) ? L(O) : L(void 0);
-	}
-	function W(e, t) {
-		p.onChange && p.onChange(e), U();
-	}
-	function G(e) {
-		p.onBlur && p.onBlur(e);
-	}
-	function K(e) {
-		p.onFocus && p.onFocus(e);
-	}
-	function q() {
-		let e = p.id ?? p.propOverrides?.id ?? `checkbox-${S}`;
-		D(e), k(e + l), j(e + u), N(e + c);
-	}
-	return m(() => {
-		T(!0), q(), F(p.invalidMessage || "TODO: Add an invalidMessage");
-	}, []), m(() => {
-		(p.id ?? p.propOverrides?.id) && q();
-	}, [p.id, p.propOverrides?.id]), m(() => {
-		F(p.invalidMessage || C.current?.validationMessage || "TODO: Add an invalidMessage");
-	}, [C.current, p.invalidMessage]), m(() => {
-		if (E) {
-			let e = E + l;
-			k(e), j(E + u), N(E + c), s(p.message, p.showMessage) && L(e), U();
-		}
-	}, [E]), m(() => {
-		C.current && p.indeterminate !== void 0 && (C.current.indeterminate = !!i(p.indeterminate));
-	}, [
-		w,
-		C.current,
-		p.indeterminate
-	]), m(() => {
-		w && C.current && (p.checked != null && (C.current.checked = !!i(p.checked)), T(!1));
-	}, [
-		w,
-		C.current,
-		p.checked
-	]), m(() => {
-		if (C.current) {
-			let e = p.defaultChecked, t = B;
-			t || (t = new AbortController(), V(t)), d(C.current, {
-				checked: p.checked,
-				defaultChecked: e
-			}, (e) => {
-				W(e, !0);
-			}, t.signal);
-		}
-	}, [C.current]), m(() => () => {
-		B?.abort();
-	}, []), /* @__PURE__ */ b("div", {
-		...t(p, [
-			"data-icon-variant",
-			"data-icon-variant-before",
-			"data-icon-variant-after",
-			"data-icon-weight",
-			"data-icon-weight-before",
-			"data-icon-weight-after",
-			"data-interactive",
-			"data-force-mobile",
-			"data-color",
-			"data-container-color",
-			"data-bg-color",
-			"data-on-bg-color",
-			"data-color-scheme",
-			"data-font-size",
-			"data-headline-size",
-			"data-divider",
-			"data-focus",
-			"data-font",
-			"data-density"
-		]),
-		className: n("db-checkbox", p.className),
-		"data-size": p.size,
-		"data-hide-asterisk": a(p.showRequiredAsterisk),
-		"data-hide-label": a(p.showLabel),
-		children: [
-			/* @__PURE__ */ b("label", {
-				htmlFor: E,
-				children: [
-					/* @__PURE__ */ y("input", {
-						type: "checkbox",
-						"aria-invalid": p.validation === "invalid",
-						"data-custom-validity": p.validation,
-						ref: C,
-						...e(p, [
-							"data-icon-variant",
-							"data-icon-variant-before",
-							"data-icon-variant-after",
-							"data-icon-weight",
-							"data-icon-weight-before",
-							"data-icon-weight-after",
-							"data-interactive",
-							"data-force-mobile",
-							"data-color",
-							"data-container-color",
-							"data-bg-color",
-							"data-on-bg-color",
-							"data-color-scheme",
-							"data-font-size",
-							"data-headline-size",
-							"data-divider",
-							"data-focus",
-							"data-font",
-							"data-density"
-						]),
-						id: E,
-						name: p.name,
-						checked: i(p.checked, "checked"),
-						disabled: i(p.disabled, "disabled"),
-						value: p.value,
-						required: i(p.required, "required"),
-						onChange: (e) => W(e),
-						onBlur: (e) => G(e),
-						onFocus: (e) => K(e),
-						"aria-describedby": p.ariaDescribedBy ?? I
-					}),
-					p.label ? /* @__PURE__ */ y(v, { children: p.label }) : null,
-					p.children
-				]
-			}),
-			s(p.message, p.showMessage) ? /* @__PURE__ */ y(f, {
-				size: "small",
-				icon: p.messageIcon,
-				id: O,
-				children: p.message
-			}) : null,
-			H() ? /* @__PURE__ */ y(f, {
-				size: "small",
-				semantic: "successful",
-				id: A,
-				children: p.validMessage || "TODO: Add a validMessage"
-			}) : null,
-			/* @__PURE__ */ y(f, {
-				size: "small",
-				semantic: "critical",
-				id: M,
-				children: P
-			}),
-			/* @__PURE__ */ y("span", {
-				"data-visually-hidden": "true",
-				role: "status",
-				children: R
-			})
-		]
-	});
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { filterPassingProps, getRootProps } from "../../utils/react.js";
+import { useState, useRef, useEffect, forwardRef } from "react";
+import { DEFAULT_INVALID_MESSAGE, DEFAULT_INVALID_MESSAGE_ID_SUFFIX, DEFAULT_MESSAGE_ID_SUFFIX, DEFAULT_VALID_MESSAGE, DEFAULT_VALID_MESSAGE_ID_SUFFIX, } from "../../shared/constants.js";
+import { cls, delay, getBoolean, getHideProp, hasVoiceOver, stringPropVisible, } from "../../utils/index.js";
+import { addCheckedResetEventListener, } from "../../utils/form-components.js";
+import DBInfotext from "../infotext/infotext.js";
+import { useId } from "react";
+function DBCheckboxFn(props, component) {
+    const uuid = useId();
+    const _ref = component || useRef(component);
+    const [initialized, setInitialized] = useState(() => false);
+    const [_id, set_id] = useState(() => undefined);
+    const [_messageId, set_messageId] = useState(() => undefined);
+    const [_validMessageId, set_validMessageId] = useState(() => undefined);
+    const [_invalidMessageId, set_invalidMessageId] = useState(() => undefined);
+    const [_invalidMessage, set_invalidMessage] = useState(() => undefined);
+    const [_descByIds, set_descByIds] = useState(() => undefined);
+    const [_voiceOverFallback, set_voiceOverFallback] = useState(() => "");
+    const [abortController, setAbortController] = useState(() => undefined);
+    function hasValidState() {
+        return !!(props.validMessage ?? props.validation === "valid");
+    }
+    function handleValidation() {
+        /* For a11y reasons we need to map the correct message with the checkbox */
+        if (!_ref.current?.validity.valid || props.validation === "invalid") {
+            set_descByIds(_invalidMessageId);
+            set_invalidMessage(props.invalidMessage ||
+                _ref.current?.validationMessage ||
+                DEFAULT_INVALID_MESSAGE);
+            if (hasVoiceOver()) {
+                set_voiceOverFallback(_invalidMessage);
+                void delay(() => set_voiceOverFallback(""), 1000);
+            }
+        }
+        else if (hasValidState() &&
+            _ref.current?.validity.valid &&
+            props.required) {
+            set_descByIds(_validMessageId);
+            if (hasVoiceOver()) {
+                set_voiceOverFallback(props.validMessage ?? DEFAULT_VALID_MESSAGE);
+                void delay(() => set_voiceOverFallback(""), 1000);
+            }
+        }
+        else if (stringPropVisible(props.message, props.showMessage)) {
+            set_descByIds(_messageId);
+        }
+        else {
+            set_descByIds(undefined);
+        }
+    }
+    function handleChange(event, reset) {
+        if (props.onChange) {
+            props.onChange(event);
+        }
+        handleValidation();
+    }
+    function handleBlur(event) {
+        if (props.onBlur) {
+            props.onBlur(event);
+        }
+    }
+    function handleFocus(event) {
+        if (props.onFocus) {
+            props.onFocus(event);
+        }
+    }
+    function resetIds() {
+        const mId = props.id ?? props.propOverrides?.id ?? `checkbox-${uuid}`;
+        set_id(mId);
+        set_messageId(mId + DEFAULT_MESSAGE_ID_SUFFIX);
+        set_validMessageId(mId + DEFAULT_VALID_MESSAGE_ID_SUFFIX);
+        set_invalidMessageId(mId + DEFAULT_INVALID_MESSAGE_ID_SUFFIX);
+    }
+    useEffect(() => {
+        setInitialized(true);
+        resetIds();
+        set_invalidMessage(props.invalidMessage || DEFAULT_INVALID_MESSAGE);
+    }, []);
+    useEffect(() => {
+        if (props.id ?? props.propOverrides?.id) {
+            resetIds();
+        }
+    }, [props.id, props.propOverrides?.id]);
+    useEffect(() => {
+        set_invalidMessage(props.invalidMessage ||
+            _ref.current?.validationMessage ||
+            DEFAULT_INVALID_MESSAGE);
+    }, [_ref.current, props.invalidMessage]);
+    useEffect(() => {
+        if (_id) {
+            const messageId = _id + DEFAULT_MESSAGE_ID_SUFFIX;
+            set_messageId(messageId);
+            set_validMessageId(_id + DEFAULT_VALID_MESSAGE_ID_SUFFIX);
+            set_invalidMessageId(_id + DEFAULT_INVALID_MESSAGE_ID_SUFFIX);
+            if (stringPropVisible(props.message, props.showMessage)) {
+                set_descByIds(messageId);
+            }
+            handleValidation();
+        }
+    }, [_id]);
+    useEffect(() => {
+        if (_ref.current) {
+            if (props.indeterminate !== undefined) {
+                // When indeterminate is set, the value of the checked prop only impacts the form submitted values.
+                // It has no accessibility or UX implications. (https://mui.com/material-ui/react-checkbox/)
+                _ref.current.indeterminate = !!getBoolean(props.indeterminate);
+            }
+        }
+    }, [initialized, _ref.current, props.indeterminate]);
+    useEffect(() => {
+        if (initialized && _ref.current) {
+            // in angular this must be set via native element
+            if (props.checked != undefined) {
+                _ref.current.checked = !!getBoolean(props.checked);
+            }
+            setInitialized(false);
+        }
+    }, [initialized, _ref.current, props.checked]);
+    useEffect(() => {
+        if (_ref.current) {
+            const defaultChecked = props.defaultChecked;
+            let controller = abortController;
+            if (!controller) {
+                controller = new AbortController();
+                setAbortController(controller);
+            }
+            addCheckedResetEventListener(_ref.current, {
+                checked: props.checked,
+                defaultChecked,
+            }, (event) => {
+                handleChange(event, true);
+            }, controller.signal);
+        }
+    }, [_ref.current]);
+    useEffect(() => {
+        return () => {
+            abortController?.abort();
+        };
+    }, []);
+    return (_jsxs("div", { ...getRootProps(props, ["data-icon-variant", "data-icon-variant-before", "data-icon-variant-after", "data-icon-weight", "data-icon-weight-before", "data-icon-weight-after", "data-interactive", "data-force-mobile", "data-color", "data-container-color", "data-bg-color", "data-on-bg-color", "data-color-scheme", "data-font-size", "data-headline-size", "data-divider", "data-focus", "data-font", "data-density"]), className: cls("db-checkbox", props.className), "data-size": props.size, "data-hide-asterisk": getHideProp(props.showRequiredAsterisk), "data-hide-label": getHideProp(props.showLabel), children: [_jsxs("label", { htmlFor: _id, children: [_jsx("input", { type: "checkbox", "aria-invalid": props.validation === "invalid", "data-custom-validity": props.validation, ref: _ref, ...filterPassingProps(props, ["data-icon-variant", "data-icon-variant-before", "data-icon-variant-after", "data-icon-weight", "data-icon-weight-before", "data-icon-weight-after", "data-interactive", "data-force-mobile", "data-color", "data-container-color", "data-bg-color", "data-on-bg-color", "data-color-scheme", "data-font-size", "data-headline-size", "data-divider", "data-focus", "data-font", "data-density"]), id: _id, name: props.name, checked: getBoolean(props.checked, "checked"), disabled: getBoolean(props.disabled, "disabled"), value: props.value, required: getBoolean(props.required, "required"), onChange: (event) => handleChange(event), onBlur: (event) => handleBlur(event), onFocus: (event) => handleFocus(event), "aria-describedby": props.ariaDescribedBy ?? _descByIds }), props.label ? _jsx(_Fragment, { children: props.label }) : null, props.children] }), stringPropVisible(props.message, props.showMessage) ? (_jsx(DBInfotext, { size: "small", icon: props.messageIcon, id: _messageId, children: props.message })) : null, hasValidState() ? (_jsx(DBInfotext, { size: "small", semantic: "successful", id: _validMessageId, children: props.validMessage || DEFAULT_VALID_MESSAGE })) : null, _jsx(DBInfotext, { size: "small", semantic: "critical", id: _invalidMessageId, children: _invalidMessage }), _jsx("span", { "data-visually-hidden": "true", role: "status", children: _voiceOverFallback })] }));
 }
-var S = p(x);
-//#endregion
-export { S as default };
+const DBCheckbox = forwardRef(DBCheckboxFn);
+export default DBCheckbox;

package/dist/components/checkbox/index.d.ts

@@ -1 +1 @@
-export { default as DBCheckbox } from './checkbox';
+export { default as DBCheckbox } from './checkbox.js';

package/dist/components/checkbox/index.js

@@ -0,0 +1 @@
+export { default as DBCheckbox } from './checkbox.js';

package/dist/components/checkbox/model.d.ts

@@ -1,4 +1,4 @@
-import type { ChangeEventProps, ChangeEventState, FocusEventProps, FocusEventState, FormCheckProps, FormMessageProps, FormProps, FormState, FromValidState, GlobalProps, GlobalState, InitializedState, SizeProps } from '../../shared/model';
+import type { ChangeEventProps, ChangeEventState, FocusEventProps, FocusEventState, FormCheckProps, FormMessageProps, FormProps, FormState, FromValidState, GlobalProps, GlobalState, InitializedState, SizeProps } from '../../shared/model.js';
 export type DBCheckboxDefaultProps = {
     /**
      * Define an [indeterminate](https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement#indeterminate) state of a checkbox

package/dist/components/checkbox/model.js

@@ -0,0 +1 @@
+export {};

package/dist/components/custom-button/custom-button.d.ts

@@ -1,3 +1,3 @@
 import * as React from "react";
-declare const DBCustomButton: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLDivElement>, keyof import("../..").GlobalProps | "variant" | "size" | "wrap" | "icon" | "showIcon" | "width" | "showIconLeading" | "showIconTrailing" | "iconLeading" | "iconTrailing" | "noText"> & import("../..").DBButtonSharedProps & import("../..").GlobalProps & import("../..").IconProps & import("../..").WidthProps & import("../..").SizeProps & import("../..").ShowIconProps & import("../..").ShowIconLeadingProps & import("../..").ShowIconTrailingProps & import("../..").IconLeadingProps & import("../..").IconTrailingProps & import("../..").NoTextProps & import("../..").WrapProps & React.RefAttributes<HTMLDivElement>>;
+declare const DBCustomButton: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<HTMLDivElement>, keyof import("../../index.js").GlobalProps | "variant" | "size" | "wrap" | "icon" | "showIcon" | "width" | "showIconLeading" | "showIconTrailing" | "iconLeading" | "iconTrailing" | "noText"> & import("../button/model.js").DBButtonSharedProps & import("../../index.js").GlobalProps & import("../../index.js").IconProps & import("../../index.js").WidthProps & import("../../index.js").SizeProps & import("../../index.js").ShowIconProps & import("../../index.js").ShowIconLeadingProps & import("../../index.js").ShowIconTrailingProps & import("../../index.js").IconLeadingProps & import("../../index.js").IconTrailingProps & import("../../index.js").NoTextProps & import("../../index.js").WrapProps & React.RefAttributes<HTMLDivElement>>;
 export default DBCustomButton;

package/dist/components/custom-button/custom-button.js

@@ -1,67 +1,12 @@
 "use client";
-import { filterPassingProps as e, getRootProps as t } from "../../utils/react.js";
-import { cls as n, getBooleanAsString as r } from "../../utils/index.js";
-import { forwardRef as i, useRef as a } from "react";
-import { jsx as o } from "react/jsx-runtime";
-//#region src/components/custom-button/custom-button.tsx
-function s(i, s) {
-	return /* @__PURE__ */ o("div", {
-		ref: s || a(s),
-		...e(i, [
-			"data-icon-variant",
-			"data-icon-variant-before",
-			"data-icon-variant-after",
-			"data-icon-weight",
-			"data-icon-weight-before",
-			"data-icon-weight-after",
-			"data-interactive",
-			"data-force-mobile",
-			"data-color",
-			"data-container-color",
-			"data-bg-color",
-			"data-on-bg-color",
-			"data-color-scheme",
-			"data-font-size",
-			"data-headline-size",
-			"data-divider",
-			"data-focus",
-			"data-font",
-			"data-density"
-		]),
-		id: i.id ?? i.propOverrides?.id,
-		...t(i, [
-			"data-icon-variant",
-			"data-icon-variant-before",
-			"data-icon-variant-after",
-			"data-icon-weight",
-			"data-icon-weight-before",
-			"data-icon-weight-after",
-			"data-interactive",
-			"data-force-mobile",
-			"data-color",
-			"data-container-color",
-			"data-bg-color",
-			"data-on-bg-color",
-			"data-color-scheme",
-			"data-font-size",
-			"data-headline-size",
-			"data-divider",
-			"data-focus",
-			"data-font",
-			"data-density"
-		]),
-		className: n("db-custom-button", i.className),
-		"data-icon": i.iconLeading ?? i.icon,
-		"data-show-icon": r(i.showIconLeading, "showIconLeading") || r(i.showIcon, "showIcon"),
-		"data-icon-trailing": i.iconTrailing,
-		"data-show-icon-trailing": r(i.showIconTrailing, "showIconTrailing"),
-		"data-size": i.size,
-		"data-width": i.width,
-		"data-variant": i.variant,
-		"data-no-text": r(i.noText, "noText"),
-		children: i.children
-	});
+import { jsx as _jsx } from "react/jsx-runtime";
+import { filterPassingProps, getRootProps } from "../../utils/react.js";
+import { useRef, forwardRef } from "react";
+import { cls, getBooleanAsString } from "../../utils/index.js";
+function DBCustomButtonFn(props, component) {
+    const _ref = component || useRef(component);
+    return (_jsx("div", { ref: _ref, ...filterPassingProps(props, ["data-icon-variant", "data-icon-variant-before", "data-icon-variant-after", "data-icon-weight", "data-icon-weight-before", "data-icon-weight-after", "data-interactive", "data-force-mobile", "data-color", "data-container-color", "data-bg-color", "data-on-bg-color", "data-color-scheme", "data-font-size", "data-headline-size", "data-divider", "data-focus", "data-font", "data-density"]), id: props.id ?? props.propOverrides?.id, ...getRootProps(props, ["data-icon-variant", "data-icon-variant-before", "data-icon-variant-after", "data-icon-weight", "data-icon-weight-before", "data-icon-weight-after", "data-interactive", "data-force-mobile", "data-color", "data-container-color", "data-bg-color", "data-on-bg-color", "data-color-scheme", "data-font-size", "data-headline-size", "data-divider", "data-focus", "data-font", "data-density"]), className: cls("db-custom-button", props.className), "data-icon": props.iconLeading ?? props.icon, "data-show-icon": getBooleanAsString(props.showIconLeading, "showIconLeading") ||
+            getBooleanAsString(props.showIcon, "showIcon"), "data-icon-trailing": props.iconTrailing, "data-show-icon-trailing": getBooleanAsString(props.showIconTrailing, "showIconTrailing"), "data-size": props.size, "data-width": props.width, "data-variant": props.variant, "data-no-text": getBooleanAsString(props.noText, "noText"), children: props.children }));
 }
-var c = i(s);
-//#endregion
-export { c as default };
+const DBCustomButton = forwardRef(DBCustomButtonFn);
+export default DBCustomButton;

package/dist/components/custom-button/index.d.ts

@@ -1 +1 @@
-export { default as DBCustomButton } from './custom-button';
+export { default as DBCustomButton } from './custom-button.js';

package/dist/components/custom-button/index.js

@@ -0,0 +1 @@
+export { default as DBCustomButton } from './custom-button.js';

package/dist/components/custom-button/model.d.ts

@@ -1,5 +1,5 @@
-import type { GlobalProps, GlobalState, IconLeadingProps, IconProps, IconTrailingProps, NoTextProps, ShowIconLeadingProps, ShowIconProps, ShowIconTrailingProps, SizeProps, WidthProps, WrapProps } from '../../shared/model';
-import type { DBButtonSharedProps } from '../button/model';
+import type { GlobalProps, GlobalState, IconLeadingProps, IconProps, IconTrailingProps, NoTextProps, ShowIconLeadingProps, ShowIconProps, ShowIconTrailingProps, SizeProps, WidthProps, WrapProps } from '../../shared/model.js';
+import type { DBButtonSharedProps } from '../button/model.js';
 export type DBCustomButtonDefaultProps = {};
 export type DBCustomButtonProps = DBCustomButtonDefaultProps & DBButtonSharedProps & GlobalProps & IconProps & WidthProps & SizeProps & ShowIconProps & ShowIconLeadingProps & ShowIconTrailingProps & IconLeadingProps & IconTrailingProps & NoTextProps & WrapProps;
 export type DBCustomButtonDefaultState = {};

package/dist/components/custom-button/model.js

@@ -0,0 +1 @@
+export {};

package/dist/components/custom-select/custom-select.d.ts

@@ -1,3 +1,3 @@
 import * as React from "react";
-declare const DBCustomSelect: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<any>, keyof import("../../shared/model").GlobalProps | "icon" | "showIcon" | keyof import("../../shared/model").CustomFormProps | keyof import("../../shared/model").BaseFormProps | keyof import("../../shared/model").RequiredProps | "showLabel" | keyof import("../../shared/model").FormMessageProps | keyof import("./model").DBCustomSelectDefaultProps | keyof import("./model").DBCustomSelectEvents> & import("../../shared/model").GlobalProps & import("../../shared/model").CustomFormProps & import("../../shared/model").BaseFormProps & import("../../shared/model").RequiredProps & import("../../shared/model").FormMessageProps & import("./model").DBCustomSelectDefaultProps & import("./model").DBCustomSelectEvents & import("../../shared/model").IconProps & import("../../shared/model").ShowIconProps & import("../../shared/model").ShowLabelProps & React.RefAttributes<any>>;
+declare const DBCustomSelect: React.ForwardRefExoticComponent<Omit<React.HTMLAttributes<any>, keyof import("../../shared/model.js").GlobalProps | "icon" | "showIcon" | keyof import("../../shared/model.js").CustomFormProps | keyof import("../../shared/model.js").BaseFormProps | keyof import("../../shared/model.js").RequiredProps | "showLabel" | keyof import("../../shared/model.js").FormMessageProps | keyof import("./model.js").DBCustomSelectDefaultProps | keyof import("./model.js").DBCustomSelectEvents> & import("../../shared/model.js").GlobalProps & import("../../shared/model.js").CustomFormProps & import("../../shared/model.js").BaseFormProps & import("../../shared/model.js").RequiredProps & import("../../shared/model.js").FormMessageProps & import("./model.js").DBCustomSelectDefaultProps & import("./model.js").DBCustomSelectEvents & import("../../shared/model.js").IconProps & import("../../shared/model.js").ShowIconProps & import("../../shared/model.js").ShowLabelProps & React.RefAttributes<any>>;
 export default DBCustomSelect;