@dynamic-framework/ui-react 2.8.0 → 2.10.0

package/dist/esm/components/DInputCurrency/DInputCurrency.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DInputCurrency.js","sources":["../../../../dist-transpiled/components/DInputCurrency/DInputCurrency.js"],"sourcesContent":["import { __rest } from \"tslib\";\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { forwardRef } from 'react';\nimport DInput from '../DInput';\nimport useInputCurrency from '../../hooks/useInputCurrency';\nimport { useDContext } from '../../contexts';\nimport { useDisableInputWheel } from '../../hooks';\nfunction DInputCurrency(_a, ref) {\n    var { value, minValue, maxValue, currencyCode, onFocus, onBlur, onChange } = _a, props = __rest(_a, [\"value\", \"minValue\", \"maxValue\", \"currencyCode\", \"onFocus\", \"onBlur\", \"onChange\"]);\n    const { currency: currencyOptions } = useDContext();\n    const { handleOnWheel, } = useDisableInputWheel(ref);\n    const { inputRef, innerValue, innerType, handleOnFocus, handleOnChange, handleOnBlur, } = useInputCurrency(currencyOptions, value, onFocus, onChange, onBlur, ref, minValue, maxValue);\n    return (_jsx(DInput, Object.assign({ ref: inputRef, value: innerValue, onChange: handleOnChange, inputMode: \"decimal\", type: innerType, onFocus: handleOnFocus, onBlur: handleOnBlur, onWheel: handleOnWheel, inputStart: (_jsx(\"span\", { slot: \"input-start\", className: \"d-input-currency-symbol\", children: currencyCode || currencyOptions.symbol })) }, props)));\n}\nconst ForwardedDInputCurrency = forwardRef(DInputCurrency);\nForwardedDInputCurrency.displayName = 'DInputCurrency';\nexport default ForwardedDInputCurrency;\n//# sourceMappingURL=DInputCurrency.js.map"],"names":["_jsx","DInput"],"mappings":";;;;;;;;AAOA,SAAS,cAAc,CAAC,EAAE,EAAE,GAAG,EAAE;AACjC,IAAI,IAAI,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,YAAY,EAAE,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,EAAE,EAAE,KAAK,GAAG,MAAM,CAAC,EAAE,EAAE,CAAC,OAAO,EAAE,UAAU,EAAE,UAAU,EAAE,cAAc,EAAE,SAAS,EAAE,QAAQ,EAAE,UAAU,CAAC,CAAC;AAC3L,IAAI,MAAM,EAAE,QAAQ,EAAE,eAAe,EAAE,GAAG,WAAW,EAAE;AACvD,IAAI,MAAM,EAAE,aAAa,GAAG,GAAG,oBAAoB,CAAC,GAAG,CAAC;AACxD,IAAI,MAAM,EAAE,QAAQ,EAAE,UAAU,EAAE,SAAS,EAAE,aAAa,EAAE,cAAc,EAAE,YAAY,GAAG,GAAG,gBAAgB,CAAC,eAAe,EAAE,KAAK,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,EAAE,QAAQ,EAAE,QAAQ,CAAC;AAC1L,IAAI,QAAQA,GAAI,CAACC,eAAM,EAAE,MAAM,CAAC,MAAM,CAAC,EAAE,GAAG,EAAE,QAAQ,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,cAAc,EAAE,SAAS,EAAE,SAAS,EAAE,IAAI,EAAE,SAAS,EAAE,OAAO,EAAE,aAAa,EAAE,MAAM,EAAE,YAAY,EAAE,OAAO,EAAE,aAAa,EAAE,UAAU,GAAGD,GAAI,CAAC,MAAM,EAAE,EAAE,IAAI,EAAE,aAAa,EAAE,SAAS,EAAE,yBAAyB,EAAE,QAAQ,EAAE,YAAY,IAAI,eAAe,CAAC,MAAM,EAAE,CAAC,CAAC,EAAE,EAAE,KAAK,CAAC,CAAC;AACxW;AACK,MAAC,uBAAuB,GAAG,UAAU,CAAC,cAAc;AACzD,uBAAuB,CAAC,WAAW,GAAG,gBAAgB;;;;"}

package/dist/esm/components/DInputCurrency/index.js

@@ -0,0 +1,6 @@
+import ForwardedDInputCurrency from './DInputCurrency.js';
+
+
+
+export { ForwardedDInputCurrency as default };
+//# sourceMappingURL=index.js.map

package/dist/esm/components/DInputCurrency/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/esm/components/DInputMask/DInputMask.js

@@ -0,0 +1,13 @@
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef } from 'react';
+import { InputMask } from '@react-input/mask';
+import ForwardedDInput from '../DInput/DInput.js';
+
+function DInputMask(props, ref) {
+    return (jsx(InputMask, Object.assign({ ref: ref, component: ForwardedDInput }, props)));
+}
+const ForwardedDInputMask = forwardRef(DInputMask);
+ForwardedDInputMask.displayName = 'DInputMask';
+
+export { ForwardedDInputMask as default };
+//# sourceMappingURL=DInputMask.js.map

package/dist/esm/components/DInputMask/DInputMask.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DInputMask.js","sources":["../../../../dist-transpiled/components/DInputMask/DInputMask.js"],"sourcesContent":["import { jsx as _jsx } from \"react/jsx-runtime\";\nimport { forwardRef } from 'react';\nimport { InputMask } from '@react-input/mask';\nimport DInput from '../DInput';\nfunction DInputMask(props, ref) {\n    return (_jsx(InputMask, Object.assign({ ref: ref, component: DInput }, props)));\n}\nconst ForwardedDInputMask = forwardRef(DInputMask);\nForwardedDInputMask.displayName = 'DInputMask';\nexport default ForwardedDInputMask;\n//# sourceMappingURL=DInputMask.js.map"],"names":["_jsx","DInput"],"mappings":";;;;;AAIA,SAAS,UAAU,CAAC,KAAK,EAAE,GAAG,EAAE;AAChC,IAAI,QAAQA,GAAI,CAAC,SAAS,EAAE,MAAM,CAAC,MAAM,CAAC,EAAE,GAAG,EAAE,GAAG,EAAE,SAAS,EAAEC,eAAM,EAAE,EAAE,KAAK,CAAC,CAAC;AAClF;AACK,MAAC,mBAAmB,GAAG,UAAU,CAAC,UAAU;AACjD,mBAAmB,CAAC,WAAW,GAAG,YAAY;;;;"}

package/dist/esm/components/DInputMask/index.js

@@ -0,0 +1,6 @@
+import ForwardedDInputMask from './DInputMask.js';
+
+
+
+export { ForwardedDInputMask as default };
+//# sourceMappingURL=index.js.map

package/dist/esm/components/DInputMask/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/esm/components/DInputPassword/DInputPassword.js

@@ -0,0 +1,24 @@
+import { __rest } from 'tslib';
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef, useState, useCallback, useMemo } from 'react';
+import ForwardedDInput from '../DInput/DInput.js';
+import useProvidedRefOrCreate from '../../hooks/useProvidedRefOrCreate.js';
+import { useDContext } from '../../contexts/DContext.js';
+
+function DInputPassword(_a, ref) {
+    var { onIconEndClick, iconEndAriaLabel = 'show/hide password' } = _a, props = __rest(_a, ["onIconEndClick", "iconEndAriaLabel"]);
+    const inputRef = useProvidedRefOrCreate(ref);
+    const [visible, setVisible] = useState(false);
+    const handleOnIconEndClick = useCallback(() => {
+        setVisible((prevVisible) => !prevVisible);
+        onIconEndClick === null || onIconEndClick === void 0 ? void 0 : onIconEndClick();
+    }, [onIconEndClick]);
+    const { iconMap: { input } } = useDContext();
+    const iconEnd = useMemo(() => (!visible ? input.hide : input.show), [input.hide, input.show, visible]);
+    return (jsx(ForwardedDInput, Object.assign({ ref: inputRef, iconEnd: iconEnd, type: !visible ? 'password' : 'text', onIconEndClick: handleOnIconEndClick, iconEndAriaLabel: iconEndAriaLabel }, props)));
+}
+const ForwardedDInputPassword = forwardRef(DInputPassword);
+ForwardedDInputPassword.displayName = 'DInputPassword';
+
+export { ForwardedDInputPassword as default };
+//# sourceMappingURL=DInputPassword.js.map

package/dist/esm/components/DInputPassword/DInputPassword.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DInputPassword.js","sources":["../../../../dist-transpiled/components/DInputPassword/DInputPassword.js"],"sourcesContent":["import { __rest } from \"tslib\";\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { forwardRef, useCallback, useMemo, useState, } from 'react';\nimport DInput from '../DInput';\nimport useProvidedRefOrCreate from '../../hooks/useProvidedRefOrCreate';\nimport { useDContext } from '../../contexts';\nfunction DInputPassword(_a, ref) {\n    var { onIconEndClick, iconEndAriaLabel = 'show/hide password' } = _a, props = __rest(_a, [\"onIconEndClick\", \"iconEndAriaLabel\"]);\n    const inputRef = useProvidedRefOrCreate(ref);\n    const [visible, setVisible] = useState(false);\n    const handleOnIconEndClick = useCallback(() => {\n        setVisible((prevVisible) => !prevVisible);\n        onIconEndClick === null || onIconEndClick === void 0 ? void 0 : onIconEndClick();\n    }, [onIconEndClick]);\n    const { iconMap: { input } } = useDContext();\n    const iconEnd = useMemo(() => (!visible ? input.hide : input.show), [input.hide, input.show, visible]);\n    return (_jsx(DInput, Object.assign({ ref: inputRef, iconEnd: iconEnd, type: !visible ? 'password' : 'text', onIconEndClick: handleOnIconEndClick, iconEndAriaLabel: iconEndAriaLabel }, props)));\n}\nconst ForwardedDInputPassword = forwardRef(DInputPassword);\nForwardedDInputPassword.displayName = 'DInputPassword';\nexport default ForwardedDInputPassword;\n//# sourceMappingURL=DInputPassword.js.map"],"names":["_jsx","DInput"],"mappings":";;;;;;;AAMA,SAAS,cAAc,CAAC,EAAE,EAAE,GAAG,EAAE;AACjC,IAAI,IAAI,EAAE,cAAc,EAAE,gBAAgB,GAAG,oBAAoB,EAAE,GAAG,EAAE,EAAE,KAAK,GAAG,MAAM,CAAC,EAAE,EAAE,CAAC,gBAAgB,EAAE,kBAAkB,CAAC,CAAC;AACpI,IAAI,MAAM,QAAQ,GAAG,sBAAsB,CAAC,GAAG,CAAC;AAChD,IAAI,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC;AACjD,IAAI,MAAM,oBAAoB,GAAG,WAAW,CAAC,MAAM;AACnD,QAAQ,UAAU,CAAC,CAAC,WAAW,KAAK,CAAC,WAAW,CAAC;AACjD,QAAQ,cAAc,KAAK,IAAI,IAAI,cAAc,KAAK,MAAM,GAAG,MAAM,GAAG,cAAc,EAAE;AACxF,IAAI,CAAC,EAAE,CAAC,cAAc,CAAC,CAAC;AACxB,IAAI,MAAM,EAAE,OAAO,EAAE,EAAE,KAAK,EAAE,EAAE,GAAG,WAAW,EAAE;AAChD,IAAI,MAAM,OAAO,GAAG,OAAO,CAAC,OAAO,CAAC,OAAO,GAAG,KAAK,CAAC,IAAI,GAAG,KAAK,CAAC,IAAI,CAAC,EAAE,CAAC,KAAK,CAAC,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,OAAO,CAAC,CAAC;AAC1G,IAAI,QAAQA,GAAI,CAACC,eAAM,EAAE,MAAM,CAAC,MAAM,CAAC,EAAE,GAAG,EAAE,QAAQ,EAAE,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,OAAO,GAAG,UAAU,GAAG,MAAM,EAAE,cAAc,EAAE,oBAAoB,EAAE,gBAAgB,EAAE,gBAAgB,EAAE,EAAE,KAAK,CAAC,CAAC;AACnM;AACK,MAAC,uBAAuB,GAAG,UAAU,CAAC,cAAc;AACzD,uBAAuB,CAAC,WAAW,GAAG,gBAAgB;;;;"}

package/dist/esm/components/DInputPassword/index.js

@@ -0,0 +1,6 @@
+import ForwardedDInputPassword from './DInputPassword.js';
+
+
+
+export { ForwardedDInputPassword as default };
+//# sourceMappingURL=index.js.map

package/dist/esm/components/DInputPassword/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/esm/components/DInputPhone/DInputPhone.js

@@ -0,0 +1,96 @@
+import { __rest } from 'tslib';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { forwardRef, useId, useMemo, useCallback } from 'react';
+import classNames from 'classnames';
+import { defaultCountries, parseCountry, usePhoneInput, CountrySelector } from 'react-international-phone';
+import DIcon from '../DIcon/DIcon.js';
+import useProvidedRefOrCreate from '../../hooks/useProvidedRefOrCreate.js';
+import { useDContext } from '../../contexts/DContext.js';
+import validatePhoneNumber from '../../utils/validatePhoneNumber.js';
+
+function DInputPhone(_a, ref) {
+    var { id: idProp, style, className, label = '', disabled = false, loading = false, iconFamilyClass, iconFamilyPrefix, iconMaterialStyle, iconEnd, iconEndDisabled, iconEndFamilyClass, iconEndFamilyPrefix, iconEndAriaLabel, iconEndTabIndex, iconEndMaterialStyle, hint, size, invalid = false, valid = false, floatingLabel = false, inputEnd, value, placeholder = '', dataAttributes, onChange, onIconEndClick, countrySelectorProps, filteredCountries, defaultCountry = 'cl' } = _a, inputProps = __rest(_a, ["id", "style", "className", "label", "disabled", "loading", "iconFamilyClass", "iconFamilyPrefix", "iconMaterialStyle", "iconEnd", "iconEndDisabled", "iconEndFamilyClass", "iconEndFamilyPrefix", "iconEndAriaLabel", "iconEndTabIndex", "iconEndMaterialStyle", "hint", "size", "invalid", "valid", "floatingLabel", "inputEnd", "value", "placeholder", "dataAttributes", "onChange", "onIconEndClick", "countrySelectorProps", "filteredCountries", "defaultCountry"]);
+    const innerRef = useProvidedRefOrCreate(ref);
+    const innerId = useId();
+    const id = useMemo(() => idProp || innerId, [idProp, innerId]);
+    const { icon: { familyClass, familyPrefix, materialStyle, }, } = useDContext();
+    const handleOnIconEndClick = useCallback(() => {
+        onIconEndClick === null || onIconEndClick === void 0 ? void 0 : onIconEndClick(value);
+    }, [onIconEndClick, value]);
+    const ariaDescribedby = useMemo(() => ([
+        (invalid || valid) && !iconEnd && !loading && `${id}State`,
+        (iconEnd && !loading) && `${id}End`,
+        loading && `${id}Loading`,
+        !!inputEnd && `${id}InputEnd`,
+        !!hint && `${id}Hint`,
+    ]
+        .filter(Boolean)
+        .join(' ')), [
+        id,
+        invalid,
+        valid,
+        iconEnd,
+        loading,
+        inputEnd,
+        hint,
+    ]);
+    const countries = useMemo(() => {
+        if (filteredCountries === undefined) {
+            return defaultCountries;
+        }
+        return defaultCountries.filter((country) => {
+            const { iso2 } = parseCountry(country);
+            return filteredCountries.includes(iso2);
+        });
+    }, [filteredCountries]);
+    const { inputValue, handlePhoneValueChange, inputRef, country, setCountry, } = usePhoneInput({
+        inputRef: innerRef,
+        defaultCountry,
+        value,
+        countries,
+        onChange: (data) => {
+            onChange === null || onChange === void 0 ? void 0 : onChange(Object.assign(Object.assign({}, data), { isValid: validatePhoneNumber(data.phone) }));
+        },
+    });
+    const inputComponent = useMemo(() => (jsx("input", Object.assign({ ref: inputRef, id: id, className: classNames('form-control', {
+            'is-invalid': invalid,
+            'is-valid': valid,
+        }), disabled: disabled || loading, value: inputValue, onChange: handlePhoneValueChange, inputMode: "tel" }, (floatingLabel || placeholder) && { placeholder: floatingLabel ? '' : placeholder }, ariaDescribedby && { 'aria-describedby': ariaDescribedby }, inputProps))), [
+        ariaDescribedby,
+        disabled,
+        floatingLabel,
+        handlePhoneValueChange,
+        id,
+        inputProps,
+        inputRef,
+        inputValue,
+        invalid,
+        loading,
+        placeholder,
+        valid,
+    ]);
+    const labelComponent = useMemo(() => (jsx("label", { htmlFor: id, children: label })), [
+        id,
+        label,
+    ]);
+    const dynamicComponent = useMemo(() => {
+        if (floatingLabel) {
+            return (jsxs("div", { className: "form-floating", children: [inputComponent, labelComponent] }));
+        }
+        return inputComponent;
+    }, [
+        floatingLabel,
+        inputComponent,
+        labelComponent,
+    ]);
+    return (jsxs("div", Object.assign({ className: classNames('d-input-phone', className), style: style }, dataAttributes, { children: [label && !floatingLabel && labelComponent, jsxs("div", { className: classNames({
+                    [`input-group-${size}`]: !!size,
+                    'input-group': true,
+                    'has-validation': invalid || valid,
+                }), children: [jsx(CountrySelector, Object.assign({}, countrySelectorProps, { selectedCountry: country.iso2, onSelect: ({ iso2 }) => setCountry(iso2), countries: countries, disabled: disabled || loading, className: classNames('input-group-text', countrySelectorProps === null || countrySelectorProps === void 0 ? void 0 : countrySelectorProps.className) })), dynamicComponent, (iconEnd && !loading) && (jsx("button", { type: "button", className: "input-group-text", id: `${id}End`, onClick: handleOnIconEndClick, disabled: disabled || loading || iconEndDisabled, "aria-label": iconEndAriaLabel, tabIndex: onIconEndClick ? iconEndTabIndex : -1, children: jsx(DIcon, { icon: iconEnd, familyClass: iconEndFamilyClass !== null && iconEndFamilyClass !== void 0 ? iconEndFamilyClass : familyClass, familyPrefix: iconEndFamilyPrefix !== null && iconEndFamilyPrefix !== void 0 ? iconEndFamilyPrefix : familyPrefix, materialStyle: iconEndMaterialStyle !== null && iconEndMaterialStyle !== void 0 ? iconEndMaterialStyle : materialStyle }) })), loading && (jsx("div", { className: "input-group-text", id: `${id}Loading`, children: jsx("span", { className: "spinner-border spinner-border-sm", role: "status", "aria-hidden": "true", children: jsx("span", { className: "visually-hidden", children: "Loading..." }) }) })), !!inputEnd && (jsx("div", { className: "input-group-text", id: `${id}InputEnd`, children: inputEnd }))] }), hint && (jsx("div", { className: "form-text", id: `${id}Hint`, children: hint }))] })));
+}
+const ForwardedDInputPhone = forwardRef(DInputPhone);
+ForwardedDInputPhone.displayName = 'DInputPhone';
+
+export { ForwardedDInputPhone as default };
+//# sourceMappingURL=DInputPhone.js.map

package/dist/esm/components/DInputPhone/DInputPhone.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DInputPhone.js","sources":["../../../../dist-transpiled/components/DInputPhone/DInputPhone.js"],"sourcesContent":["import { __rest } from \"tslib\";\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { forwardRef, useCallback, useMemo, useId, } from 'react';\nimport classNames from 'classnames';\nimport { CountrySelector, defaultCountries, parseCountry, usePhoneInput, } from 'react-international-phone';\nimport DIcon from '../DIcon';\nimport { useProvidedRefOrCreate } from '../../hooks';\nimport { validatePhoneNumber } from '../../utils';\nimport { useDContext } from '../../contexts';\nfunction DInputPhone(_a, ref) {\n    var { id: idProp, style, className, label = '', disabled = false, loading = false, iconFamilyClass, iconFamilyPrefix, iconMaterialStyle, iconEnd, iconEndDisabled, iconEndFamilyClass, iconEndFamilyPrefix, iconEndAriaLabel, iconEndTabIndex, iconEndMaterialStyle, hint, size, invalid = false, valid = false, floatingLabel = false, inputEnd, value, placeholder = '', dataAttributes, onChange, onIconEndClick, countrySelectorProps, filteredCountries, defaultCountry = 'cl' } = _a, inputProps = __rest(_a, [\"id\", \"style\", \"className\", \"label\", \"disabled\", \"loading\", \"iconFamilyClass\", \"iconFamilyPrefix\", \"iconMaterialStyle\", \"iconEnd\", \"iconEndDisabled\", \"iconEndFamilyClass\", \"iconEndFamilyPrefix\", \"iconEndAriaLabel\", \"iconEndTabIndex\", \"iconEndMaterialStyle\", \"hint\", \"size\", \"invalid\", \"valid\", \"floatingLabel\", \"inputEnd\", \"value\", \"placeholder\", \"dataAttributes\", \"onChange\", \"onIconEndClick\", \"countrySelectorProps\", \"filteredCountries\", \"defaultCountry\"]);\n    const innerRef = useProvidedRefOrCreate(ref);\n    const innerId = useId();\n    const id = useMemo(() => idProp || innerId, [idProp, innerId]);\n    const { icon: { familyClass, familyPrefix, materialStyle, }, } = useDContext();\n    const handleOnIconEndClick = useCallback(() => {\n        onIconEndClick === null || onIconEndClick === void 0 ? void 0 : onIconEndClick(value);\n    }, [onIconEndClick, value]);\n    const ariaDescribedby = useMemo(() => ([\n        (invalid || valid) && !iconEnd && !loading && `${id}State`,\n        (iconEnd && !loading) && `${id}End`,\n        loading && `${id}Loading`,\n        !!inputEnd && `${id}InputEnd`,\n        !!hint && `${id}Hint`,\n    ]\n        .filter(Boolean)\n        .join(' ')), [\n        id,\n        invalid,\n        valid,\n        iconEnd,\n        loading,\n        inputEnd,\n        hint,\n    ]);\n    const countries = useMemo(() => {\n        if (filteredCountries === undefined) {\n            return defaultCountries;\n        }\n        return defaultCountries.filter((country) => {\n            const { iso2 } = parseCountry(country);\n            return filteredCountries.includes(iso2);\n        });\n    }, [filteredCountries]);\n    const { inputValue, handlePhoneValueChange, inputRef, country, setCountry, } = usePhoneInput({\n        inputRef: innerRef,\n        defaultCountry,\n        value,\n        countries,\n        onChange: (data) => {\n            onChange === null || onChange === void 0 ? void 0 : onChange(Object.assign(Object.assign({}, data), { isValid: validatePhoneNumber(data.phone) }));\n        },\n    });\n    const inputComponent = useMemo(() => (_jsx(\"input\", Object.assign({ ref: inputRef, id: id, className: classNames('form-control', {\n            'is-invalid': invalid,\n            'is-valid': valid,\n        }), disabled: disabled || loading, value: inputValue, onChange: handlePhoneValueChange, inputMode: \"tel\" }, (floatingLabel || placeholder) && { placeholder: floatingLabel ? '' : placeholder }, ariaDescribedby && { 'aria-describedby': ariaDescribedby }, inputProps))), [\n        ariaDescribedby,\n        disabled,\n        floatingLabel,\n        handlePhoneValueChange,\n        id,\n        inputProps,\n        inputRef,\n        inputValue,\n        invalid,\n        loading,\n        placeholder,\n        valid,\n    ]);\n    const labelComponent = useMemo(() => (_jsx(\"label\", { htmlFor: id, children: label })), [\n        id,\n        label,\n    ]);\n    const dynamicComponent = useMemo(() => {\n        if (floatingLabel) {\n            return (_jsxs(\"div\", { className: \"form-floating\", children: [inputComponent, labelComponent] }));\n        }\n        return inputComponent;\n    }, [\n        floatingLabel,\n        inputComponent,\n        labelComponent,\n    ]);\n    return (_jsxs(\"div\", Object.assign({ className: classNames('d-input-phone', className), style: style }, dataAttributes, { children: [label && !floatingLabel && labelComponent, _jsxs(\"div\", { className: classNames({\n                    [`input-group-${size}`]: !!size,\n                    'input-group': true,\n                    'has-validation': invalid || valid,\n                }), children: [_jsx(CountrySelector, Object.assign({}, countrySelectorProps, { selectedCountry: country.iso2, onSelect: ({ iso2 }) => setCountry(iso2), countries: countries, disabled: disabled || loading, className: classNames('input-group-text', countrySelectorProps === null || countrySelectorProps === void 0 ? void 0 : countrySelectorProps.className) })), dynamicComponent, (iconEnd && !loading) && (_jsx(\"button\", { type: \"button\", className: \"input-group-text\", id: `${id}End`, onClick: handleOnIconEndClick, disabled: disabled || loading || iconEndDisabled, \"aria-label\": iconEndAriaLabel, tabIndex: onIconEndClick ? iconEndTabIndex : -1, children: _jsx(DIcon, { icon: iconEnd, familyClass: iconEndFamilyClass !== null && iconEndFamilyClass !== void 0 ? iconEndFamilyClass : familyClass, familyPrefix: iconEndFamilyPrefix !== null && iconEndFamilyPrefix !== void 0 ? iconEndFamilyPrefix : familyPrefix, materialStyle: iconEndMaterialStyle !== null && iconEndMaterialStyle !== void 0 ? iconEndMaterialStyle : materialStyle }) })), loading && (_jsx(\"div\", { className: \"input-group-text\", id: `${id}Loading`, children: _jsx(\"span\", { className: \"spinner-border spinner-border-sm\", role: \"status\", \"aria-hidden\": \"true\", children: _jsx(\"span\", { className: \"visually-hidden\", children: \"Loading...\" }) }) })), !!inputEnd && (_jsx(\"div\", { className: \"input-group-text\", id: `${id}InputEnd`, children: inputEnd }))] }), hint && (_jsx(\"div\", { className: \"form-text\", id: `${id}Hint`, children: hint }))] })));\n}\nconst ForwardedDInputPhone = forwardRef(DInputPhone);\nForwardedDInputPhone.displayName = 'DInputPhone';\nexport default ForwardedDInputPhone;\n//# sourceMappingURL=DInputPhone.js.map"],"names":["_jsx","_jsxs"],"mappings":";;;;;;;;;;AASA,SAAS,WAAW,CAAC,EAAE,EAAE,GAAG,EAAE;AAC9B,IAAI,IAAI,EAAE,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,SAAS,EAAE,KAAK,GAAG,EAAE,EAAE,QAAQ,GAAG,KAAK,EAAE,OAAO,GAAG,KAAK,EAAE,eAAe,EAAE,gBAAgB,EAAE,iBAAiB,EAAE,OAAO,EAAE,eAAe,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,eAAe,EAAE,oBAAoB,EAAE,IAAI,EAAE,IAAI,EAAE,OAAO,GAAG,KAAK,EAAE,KAAK,GAAG,KAAK,EAAE,aAAa,GAAG,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,WAAW,GAAG,EAAE,EAAE,cAAc,EAAE,QAAQ,EAAE,cAAc,EAAE,oBAAoB,EAAE,iBAAiB,EAAE,cAAc,GAAG,IAAI,EAAE,GAAG,EAAE,EAAE,UAAU,GAAG,MAAM,CAAC,EAAE,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,WAAW,EAAE,OAAO,EAAE,UAAU,EAAE,SAAS,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,SAAS,EAAE,iBAAiB,EAAE,oBAAoB,EAAE,qBAAqB,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,sBAAsB,EAAE,MAAM,EAAE,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,eAAe,EAAE,UAAU,EAAE,OAAO,EAAE,aAAa,EAAE,gBAAgB,EAAE,UAAU,EAAE,gBAAgB,EAAE,sBAAsB,EAAE,mBAAmB,EAAE,gBAAgB,CAAC,CAAC;AACn8B,IAAI,MAAM,QAAQ,GAAG,sBAAsB,CAAC,GAAG,CAAC;AAChD,IAAI,MAAM,OAAO,GAAG,KAAK,EAAE;AAC3B,IAAI,MAAM,EAAE,GAAG,OAAO,CAAC,MAAM,MAAM,IAAI,OAAO,EAAE,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;AAClE,IAAI,MAAM,EAAE,IAAI,EAAE,EAAE,WAAW,EAAE,YAAY,EAAE,aAAa,GAAG,GAAG,GAAG,WAAW,EAAE;AAClF,IAAI,MAAM,oBAAoB,GAAG,WAAW,CAAC,MAAM;AACnD,QAAQ,cAAc,KAAK,IAAI,IAAI,cAAc,KAAK,MAAM,GAAG,MAAM,GAAG,cAAc,CAAC,KAAK,CAAC;AAC7F,IAAI,CAAC,EAAE,CAAC,cAAc,EAAE,KAAK,CAAC,CAAC;AAC/B,IAAI,MAAM,eAAe,GAAG,OAAO,CAAC,OAAO;AAC3C,QAAQ,CAAC,OAAO,IAAI,KAAK,KAAK,CAAC,OAAO,IAAI,CAAC,OAAO,IAAI,CAAC,EAAE,EAAE,CAAC,KAAK,CAAC;AAClE,QAAQ,CAAC,OAAO,IAAI,CAAC,OAAO,KAAK,CAAC,EAAE,EAAE,CAAC,GAAG,CAAC;AAC3C,QAAQ,OAAO,IAAI,CAAC,EAAE,EAAE,CAAC,OAAO,CAAC;AACjC,QAAQ,CAAC,CAAC,QAAQ,IAAI,CAAC,EAAE,EAAE,CAAC,QAAQ,CAAC;AACrC,QAAQ,CAAC,CAAC,IAAI,IAAI,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC;AAC7B;AACA,SAAS,MAAM,CAAC,OAAO;AACvB,SAAS,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE;AACrB,QAAQ,EAAE;AACV,QAAQ,OAAO;AACf,QAAQ,KAAK;AACb,QAAQ,OAAO;AACf,QAAQ,OAAO;AACf,QAAQ,QAAQ;AAChB,QAAQ,IAAI;AACZ,KAAK,CAAC;AACN,IAAI,MAAM,SAAS,GAAG,OAAO,CAAC,MAAM;AACpC,QAAQ,IAAI,iBAAiB,KAAK,SAAS,EAAE;AAC7C,YAAY,OAAO,gBAAgB;AACnC,QAAQ;AACR,QAAQ,OAAO,gBAAgB,CAAC,MAAM,CAAC,CAAC,OAAO,KAAK;AACpD,YAAY,MAAM,EAAE,IAAI,EAAE,GAAG,YAAY,CAAC,OAAO,CAAC;AAClD,YAAY,OAAO,iBAAiB,CAAC,QAAQ,CAAC,IAAI,CAAC;AACnD,QAAQ,CAAC,CAAC;AACV,IAAI,CAAC,EAAE,CAAC,iBAAiB,CAAC,CAAC;AAC3B,IAAI,MAAM,EAAE,UAAU,EAAE,sBAAsB,EAAE,QAAQ,EAAE,OAAO,EAAE,UAAU,GAAG,GAAG,aAAa,CAAC;AACjG,QAAQ,QAAQ,EAAE,QAAQ;AAC1B,QAAQ,cAAc;AACtB,QAAQ,KAAK;AACb,QAAQ,SAAS;AACjB,QAAQ,QAAQ,EAAE,CAAC,IAAI,KAAK;AAC5B,YAAY,QAAQ,KAAK,IAAI,IAAI,QAAQ,KAAK,MAAM,GAAG,MAAM,GAAG,QAAQ,CAAC,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,MAAM,CAAC,EAAE,EAAE,IAAI,CAAC,EAAE,EAAE,OAAO,EAAE,mBAAmB,CAAC,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;AAC9J,QAAQ,CAAC;AACT,KAAK,CAAC;AACN,IAAI,MAAM,cAAc,GAAG,OAAO,CAAC,OAAOA,GAAI,CAAC,OAAO,EAAE,MAAM,CAAC,MAAM,CAAC,EAAE,GAAG,EAAE,QAAQ,EAAE,EAAE,EAAE,EAAE,EAAE,SAAS,EAAE,UAAU,CAAC,cAAc,EAAE;AACrI,YAAY,YAAY,EAAE,OAAO;AACjC,YAAY,UAAU,EAAE,KAAK;AAC7B,SAAS,CAAC,EAAE,QAAQ,EAAE,QAAQ,IAAI,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,QAAQ,EAAE,sBAAsB,EAAE,SAAS,EAAE,KAAK,EAAE,EAAE,CAAC,aAAa,IAAI,WAAW,KAAK,EAAE,WAAW,EAAE,aAAa,GAAG,EAAE,GAAG,WAAW,EAAE,EAAE,eAAe,IAAI,EAAE,kBAAkB,EAAE,eAAe,EAAE,EAAE,UAAU,CAAC,CAAC,CAAC,EAAE;AACpR,QAAQ,eAAe;AACvB,QAAQ,QAAQ;AAChB,QAAQ,aAAa;AACrB,QAAQ,sBAAsB;AAC9B,QAAQ,EAAE;AACV,QAAQ,UAAU;AAClB,QAAQ,QAAQ;AAChB,QAAQ,UAAU;AAClB,QAAQ,OAAO;AACf,QAAQ,OAAO;AACf,QAAQ,WAAW;AACnB,QAAQ,KAAK;AACb,KAAK,CAAC;AACN,IAAI,MAAM,cAAc,GAAG,OAAO,CAAC,OAAOA,GAAI,CAAC,OAAO,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE,QAAQ,EAAE,KAAK,EAAE,CAAC,CAAC,EAAE;AAC5F,QAAQ,EAAE;AACV,QAAQ,KAAK;AACb,KAAK,CAAC;AACN,IAAI,MAAM,gBAAgB,GAAG,OAAO,CAAC,MAAM;AAC3C,QAAQ,IAAI,aAAa,EAAE;AAC3B,YAAY,QAAQC,IAAK,CAAC,KAAK,EAAE,EAAE,SAAS,EAAE,eAAe,EAAE,QAAQ,EAAE,CAAC,cAAc,EAAE,cAAc,CAAC,EAAE,CAAC;AAC5G,QAAQ;AACR,QAAQ,OAAO,cAAc;AAC7B,IAAI,CAAC,EAAE;AACP,QAAQ,aAAa;AACrB,QAAQ,cAAc;AACtB,QAAQ,cAAc;AACtB,KAAK,CAAC;AACN,IAAI,QAAQA,IAAK,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,CAAC,EAAE,SAAS,EAAE,UAAU,CAAC,eAAe,EAAE,SAAS,CAAC,EAAE,KAAK,EAAE,KAAK,EAAE,EAAE,cAAc,EAAE,EAAE,QAAQ,EAAE,CAAC,KAAK,IAAI,CAAC,aAAa,IAAI,cAAc,EAAEA,IAAK,CAAC,KAAK,EAAE,EAAE,SAAS,EAAE,UAAU,CAAC;AACzN,oBAAoB,CAAC,CAAC,YAAY,EAAE,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,IAAI;AACnD,oBAAoB,aAAa,EAAE,IAAI;AACvC,oBAAoB,gBAAgB,EAAE,OAAO,IAAI,KAAK;AACtD,iBAAiB,CAAC,EAAE,QAAQ,EAAE,CAACD,GAAI,CAAC,eAAe,EAAE,MAAM,CAAC,MAAM,CAAC,EAAE,EAAE,oBAAoB,EAAE,EAAE,eAAe,EAAE,OAAO,CAAC,IAAI,EAAE,QAAQ,EAAE,CAAC,EAAE,IAAI,EAAE,KAAK,UAAU,CAAC,IAAI,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,IAAI,OAAO,EAAE,SAAS,EAAE,UAAU,CAAC,kBAAkB,EAAE,oBAAoB,KAAK,IAAI,IAAI,oBAAoB,KAAK,MAAM,GAAG,MAAM,GAAG,oBAAoB,CAAC,SAAS,CAAC,EAAE,CAAC,CAAC,EAAE,gBAAgB,EAAE,CAAC,OAAO,IAAI,CAAC,OAAO,MAAMA,GAAI,CAAC,QAAQ,EAAE,EAAE,IAAI,EAAE,QAAQ,EAAE,SAAS,EAAE,kBAAkB,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,GAAG,CAAC,EAAE,OAAO,EAAE,oBAAoB,EAAE,QAAQ,EAAE,QAAQ,IAAI,OAAO,IAAI,eAAe,EAAE,YAAY,EAAE,gBAAgB,EAAE,QAAQ,EAAE,cAAc,GAAG,eAAe,GAAG,EAAE,EAAE,QAAQ,EAAEA,GAAI,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,OAAO,EAAE,WAAW,EAAE,kBAAkB,KAAK,IAAI,IAAI,kBAAkB,KAAK,MAAM,GAAG,kBAAkB,GAAG,WAAW,EAAE,YAAY,EAAE,mBAAmB,KAAK,IAAI,IAAI,mBAAmB,KAAK,MAAM,GAAG,mBAAmB,GAAG,YAAY,EAAE,aAAa,EAAE,oBAAoB,KAAK,IAAI,IAAI,oBAAoB,KAAK,MAAM,GAAG,oBAAoB,GAAG,aAAa,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,OAAO,KAAKA,GAAI,CAAC,KAAK,EAAE,EAAE,SAAS,EAAE,kBAAkB,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,OAAO,CAAC,EAAE,QAAQ,EAAEA,GAAI,CAAC,MAAM,EAAE,EAAE,SAAS,EAAE,kCAAkC,EAAE,IAAI,EAAE,QAAQ,EAAE,aAAa,EAAE,MAAM,EAAE,QAAQ,EAAEA,GAAI,CAAC,MAAM,EAAE,EAAE,SAAS,EAAE,iBAAiB,EAAE,QAAQ,EAAE,YAAY,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,EAAE,CAAC,CAAC,QAAQ,KAAKA,GAAI,CAAC,KAAK,EAAE,EAAE,SAAS,EAAE,kBAAkB,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,QAAQ,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,IAAI,KAAKA,GAAI,CAAC,KAAK,EAAE,EAAE,SAAS,EAAE,WAAW,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC;AACt/C;AACK,MAAC,oBAAoB,GAAG,UAAU,CAAC,WAAW;AACnD,oBAAoB,CAAC,WAAW,GAAG,aAAa;;;;"}

package/dist/esm/components/DInputPhone/index.js

@@ -0,0 +1,6 @@
+import ForwardedDInputPhone from './DInputPhone.js';
+
+
+
+export { ForwardedDInputPhone as default };
+//# sourceMappingURL=index.js.map

package/dist/esm/components/DInputPhone/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/esm/components/DInputPin/DInputPin.js

@@ -0,0 +1,86 @@
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useId, useMemo, useState, useEffect, useCallback } from 'react';
+import classNames from 'classnames';
+
+function DInputPin({ id: idProp, label = '', placeholder, type = 'text', disabled = false, loading = false, secret = false, characters = 4, innerInputMode = 'text', hint, invalid = false, valid = false, className, style, dataAttributes, onChange, 'aria-label': ariaLabel = 'Pin character number', }) {
+    const innerId = useId();
+    const id = useMemo(() => idProp || innerId, [idProp, innerId]);
+    const [pattern, setPattern] = useState('');
+    const [activeInput, setActiveInput] = useState(Array.from({ length: characters }).fill(''));
+    const isInputNum = useMemo(() => type === 'number' || type === 'tel', [type]);
+    useEffect(() => {
+        setPattern(type === 'number' ? '[0-9]+' : '^[a-zA-Z0-9]+$');
+    }, [type]);
+    const handleOTPChange = useCallback((otp) => {
+        const otpValue = otp.join('');
+        onChange === null || onChange === void 0 ? void 0 : onChange(otpValue);
+    }, [onChange]);
+    useEffect(() => {
+        handleOTPChange(activeInput);
+    }, [activeInput, handleOTPChange]);
+    const handlePaste = useCallback((event) => {
+        event.preventDefault();
+        const pastedData = event.clipboardData.getData('text/plain');
+        const cleanData = isInputNum ? pastedData.replace(/[^0-9]/gmi, '') : pastedData;
+        const newInput = Array.from({ length: characters }).map((_, index) => cleanData[index] || '');
+        setActiveInput(newInput);
+        event.currentTarget.blur();
+    }, [characters, isInputNum]);
+    const nextInput = useCallback((event, index) => {
+        var _a;
+        const regex = new RegExp(pattern);
+        const input = event.currentTarget;
+        if (!regex.test(input.value)) {
+            input.value = '';
+        }
+        if (input.value !== '') {
+            setActiveInput((prev) => {
+                const newValue = [...prev];
+                newValue[index] = input.value;
+                return newValue;
+            });
+            if (input.nextSibling) {
+                (_a = input.nextSibling) === null || _a === void 0 ? void 0 : _a.focus();
+            }
+            else {
+                input.blur();
+            }
+        }
+    }, [pattern]);
+    const prevInput = useCallback(({ key, currentTarget }, index) => {
+        var _a;
+        if (key === 'Backspace') {
+            const { value } = currentTarget;
+            setActiveInput((prev) => {
+                const newVal = [...prev];
+                newVal[index] = '';
+                return newVal;
+            });
+            if (currentTarget.previousSibling && value === '') {
+                (_a = currentTarget.previousSibling) === null || _a === void 0 ? void 0 : _a.focus();
+            }
+            else {
+                currentTarget.blur();
+                currentTarget.focus();
+            }
+        }
+    }, []);
+    const focusInput = useCallback((index) => {
+        setActiveInput((prev) => {
+            const newVal = [...prev];
+            newVal[index] = '';
+            return newVal;
+        });
+    }, []);
+    const wheelInput = useCallback((event) => {
+        event.currentTarget.blur();
+    }, []);
+    return (jsxs("div", Object.assign({ className: classNames('d-input-pin', className), style: style }, dataAttributes, { children: [label && (jsx("label", { htmlFor: "pinIndex0", children: label })), jsxs("div", { className: "d-input-pin-group", id: id, children: [Array.from({ length: characters }).map((_, index) => (jsx("input", Object.assign({ className: classNames({
+                            'form-control': true,
+                            'is-invalid': invalid,
+                            'is-valid': valid,
+                        }), value: activeInput[index], type: secret ? 'password' : type, "aria-label": `${ariaLabel} ${index + 1} of ${characters}`, inputMode: innerInputMode, id: `pinIndex${index}`, name: `pin-${index}`, maxLength: 1, onInput: (event) => nextInput(event, index), onKeyDown: (event) => prevInput(event, index), onFocus: () => focusInput(index), onWheel: wheelInput, onClick: (event) => event.preventDefault(), onPaste: (event) => handlePaste(event), autoComplete: "off", placeholder: placeholder, disabled: disabled || loading, required: true }, type === 'number' && ({ min: 0, max: 9 })), index))), loading && (jsx("div", { className: "input-group-text", children: jsx("span", { className: "spinner-border spinner-border-sm", role: "status", "aria-hidden": "true", children: jsx("span", { className: "visually-hidden", children: "Loading..." }) }) }))] }), hint && (jsx("div", { className: "form-text", id: `${id}Hint`, children: hint }))] })));
+}
+
+export { DInputPin as default };
+//# sourceMappingURL=DInputPin.js.map

package/dist/esm/components/DInputPin/DInputPin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DInputPin.js","sources":["../../../../dist-transpiled/components/DInputPin/DInputPin.js"],"sourcesContent":["import { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\n/* eslint-disable no-return-assign */\nimport { useCallback, useEffect, useId, useMemo, useState, } from 'react';\nimport classNames from 'classnames';\nexport default function DInputPin({ id: idProp, label = '', placeholder, type = 'text', disabled = false, loading = false, secret = false, characters = 4, innerInputMode = 'text', hint, invalid = false, valid = false, className, style, dataAttributes, onChange, 'aria-label': ariaLabel = 'Pin character number', }) {\n    const innerId = useId();\n    const id = useMemo(() => idProp || innerId, [idProp, innerId]);\n    const [pattern, setPattern] = useState('');\n    const [activeInput, setActiveInput] = useState(Array.from({ length: characters }).fill(''));\n    const isInputNum = useMemo(() => type === 'number' || type === 'tel', [type]);\n    useEffect(() => {\n        setPattern(type === 'number' ? '[0-9]+' : '^[a-zA-Z0-9]+$');\n    }, [type]);\n    const handleOTPChange = useCallback((otp) => {\n        const otpValue = otp.join('');\n        onChange === null || onChange === void 0 ? void 0 : onChange(otpValue);\n    }, [onChange]);\n    useEffect(() => {\n        handleOTPChange(activeInput);\n    }, [activeInput, handleOTPChange]);\n    const handlePaste = useCallback((event) => {\n        event.preventDefault();\n        const pastedData = event.clipboardData.getData('text/plain');\n        const cleanData = isInputNum ? pastedData.replace(/[^0-9]/gmi, '') : pastedData;\n        const newInput = Array.from({ length: characters }).map((_, index) => cleanData[index] || '');\n        setActiveInput(newInput);\n        event.currentTarget.blur();\n    }, [characters, isInputNum]);\n    const nextInput = useCallback((event, index) => {\n        var _a;\n        const regex = new RegExp(pattern);\n        const input = event.currentTarget;\n        if (!regex.test(input.value)) {\n            input.value = '';\n        }\n        if (input.value !== '') {\n            setActiveInput((prev) => {\n                const newValue = [...prev];\n                newValue[index] = input.value;\n                return newValue;\n            });\n            if (input.nextSibling) {\n                (_a = input.nextSibling) === null || _a === void 0 ? void 0 : _a.focus();\n            }\n            else {\n                input.blur();\n            }\n        }\n    }, [pattern]);\n    const prevInput = useCallback(({ key, currentTarget }, index) => {\n        var _a;\n        if (key === 'Backspace') {\n            const { value } = currentTarget;\n            setActiveInput((prev) => {\n                const newVal = [...prev];\n                newVal[index] = '';\n                return newVal;\n            });\n            if (currentTarget.previousSibling && value === '') {\n                (_a = currentTarget.previousSibling) === null || _a === void 0 ? void 0 : _a.focus();\n            }\n            else {\n                currentTarget.blur();\n                currentTarget.focus();\n            }\n        }\n    }, []);\n    const focusInput = useCallback((index) => {\n        setActiveInput((prev) => {\n            const newVal = [...prev];\n            newVal[index] = '';\n            return newVal;\n        });\n    }, []);\n    const wheelInput = useCallback((event) => {\n        event.currentTarget.blur();\n    }, []);\n    return (_jsxs(\"div\", Object.assign({ className: classNames('d-input-pin', className), style: style }, dataAttributes, { children: [label && (_jsx(\"label\", { htmlFor: \"pinIndex0\", children: label })), _jsxs(\"div\", { className: \"d-input-pin-group\", id: id, children: [Array.from({ length: characters }).map((_, index) => (_jsx(\"input\", Object.assign({ className: classNames({\n                            'form-control': true,\n                            'is-invalid': invalid,\n                            'is-valid': valid,\n                        }), value: activeInput[index], type: secret ? 'password' : type, \"aria-label\": `${ariaLabel} ${index + 1} of ${characters}`, inputMode: innerInputMode, id: `pinIndex${index}`, name: `pin-${index}`, maxLength: 1, onInput: (event) => nextInput(event, index), onKeyDown: (event) => prevInput(event, index), onFocus: () => focusInput(index), onWheel: wheelInput, onClick: (event) => event.preventDefault(), onPaste: (event) => handlePaste(event), autoComplete: \"off\", placeholder: placeholder, disabled: disabled || loading, required: true }, type === 'number' && ({ min: 0, max: 9 })), index))), loading && (_jsx(\"div\", { className: \"input-group-text\", children: _jsx(\"span\", { className: \"spinner-border spinner-border-sm\", role: \"status\", \"aria-hidden\": \"true\", children: _jsx(\"span\", { className: \"visually-hidden\", children: \"Loading...\" }) }) }))] }), hint && (_jsx(\"div\", { className: \"form-text\", id: `${id}Hint`, children: hint }))] })));\n}\n//# sourceMappingURL=DInputPin.js.map"],"names":["_jsxs","_jsx"],"mappings":"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"}

package/dist/esm/components/DInputPin/index.js

@@ -0,0 +1,6 @@
+import DInputPin from './DInputPin.js';
+
+
+
+export { DInputPin as default };
+//# sourceMappingURL=index.js.map

package/dist/esm/components/DInputPin/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/esm/components/DInputRange/DInputRange.js

@@ -0,0 +1,46 @@
+import { __rest } from 'tslib';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { forwardRef, useId, useMemo } from 'react';
+import classNames from 'classnames';
+import useProvidedRefOrCreate from '../../hooks/useProvidedRefOrCreate.js';
+import { PREFIX_BS } from '../config.js';
+
+function DInputRange(_a, ref) {
+    var { id: idProp, label, ariaLabel, className, style, value = '0', min = '0', max = '100', filledValue = true, onChange } = _a, props = __rest(_a, ["id", "label", "ariaLabel", "className", "style", "value", "min", "max", "filledValue", "onChange"]);
+    const innerRef = useProvidedRefOrCreate(ref);
+    const innerId = useId();
+    const id = useMemo(() => idProp || innerId, [idProp, innerId]);
+    const generateClasses = useMemo(() => ({
+        'form-range': true,
+        'form-range-value-indicator': filledValue,
+    }), [filledValue]);
+    const generateStyleVariables = useMemo(() => {
+        const minNumber = parseFloat(min.toString());
+        const maxNumber = parseFloat(max.toString());
+        const valueNumber = parseFloat(value.toString());
+        const percentage = ((valueNumber - minNumber) / (maxNumber - minNumber)) * 100;
+        return Object.assign(Object.assign({}, style), { [`--${PREFIX_BS}form-range-component-value`]: `${percentage}%` });
+    }, [min, max, value, style]);
+    const inputComponent = useMemo(() => (jsx("input", Object.assign({ id: id, ref: innerRef, className: classNames(generateClasses, className), "aria-label": ariaLabel, type: "range", value: value, min: min, max: max, style: generateStyleVariables, onChange: onChange }, props))), [
+        ariaLabel,
+        className,
+        generateClasses,
+        generateStyleVariables,
+        id,
+        innerRef,
+        max,
+        min,
+        onChange,
+        props,
+        value,
+    ]);
+    if (!label) {
+        return inputComponent;
+    }
+    return (jsxs(Fragment, { children: [jsx("label", { className: "form-label", htmlFor: id, children: label }), inputComponent] }));
+}
+const ForwardedDInputRange = forwardRef(DInputRange);
+ForwardedDInputRange.displayName = 'DInputRange';
+
+export { ForwardedDInputRange as default };
+//# sourceMappingURL=DInputRange.js.map

package/dist/esm/components/DInputRange/DInputRange.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DInputRange.js","sources":["../../../../dist-transpiled/components/DInputRange/DInputRange.js"],"sourcesContent":["import { __rest } from \"tslib\";\nimport { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { forwardRef, useId, useMemo, } from 'react';\nimport classNames from 'classnames';\nimport useProvidedRefOrCreate from '../../hooks/useProvidedRefOrCreate';\nimport { PREFIX_BS } from '../config';\nfunction DInputRange(_a, ref) {\n    var { id: idProp, label, ariaLabel, className, style, value = '0', min = '0', max = '100', filledValue = true, onChange } = _a, props = __rest(_a, [\"id\", \"label\", \"ariaLabel\", \"className\", \"style\", \"value\", \"min\", \"max\", \"filledValue\", \"onChange\"]);\n    const innerRef = useProvidedRefOrCreate(ref);\n    const innerId = useId();\n    const id = useMemo(() => idProp || innerId, [idProp, innerId]);\n    const generateClasses = useMemo(() => ({\n        'form-range': true,\n        'form-range-value-indicator': filledValue,\n    }), [filledValue]);\n    const generateStyleVariables = useMemo(() => {\n        const minNumber = parseFloat(min.toString());\n        const maxNumber = parseFloat(max.toString());\n        const valueNumber = parseFloat(value.toString());\n        const percentage = ((valueNumber - minNumber) / (maxNumber - minNumber)) * 100;\n        return Object.assign(Object.assign({}, style), { [`--${PREFIX_BS}form-range-component-value`]: `${percentage}%` });\n    }, [min, max, value, style]);\n    const inputComponent = useMemo(() => (_jsx(\"input\", Object.assign({ id: id, ref: innerRef, className: classNames(generateClasses, className), \"aria-label\": ariaLabel, type: \"range\", value: value, min: min, max: max, style: generateStyleVariables, onChange: onChange }, props))), [\n        ariaLabel,\n        className,\n        generateClasses,\n        generateStyleVariables,\n        id,\n        innerRef,\n        max,\n        min,\n        onChange,\n        props,\n        value,\n    ]);\n    if (!label) {\n        return inputComponent;\n    }\n    return (_jsxs(_Fragment, { children: [_jsx(\"label\", { className: \"form-label\", htmlFor: id, children: label }), inputComponent] }));\n}\nconst ForwardedDInputRange = forwardRef(DInputRange);\nForwardedDInputRange.displayName = 'DInputRange';\nexport default ForwardedDInputRange;\n//# sourceMappingURL=DInputRange.js.map"],"names":["_jsx","_jsxs","_Fragment"],"mappings":"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"}

package/dist/esm/components/DInputRange/index.js

@@ -0,0 +1,6 @@
+import ForwardedDInputRange from './DInputRange.js';
+
+
+
+export { ForwardedDInputRange as default };
+//# sourceMappingURL=index.js.map

package/dist/esm/components/DInputRange/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/esm/components/DInputSearch/DInputSearch.js

@@ -0,0 +1,57 @@
+import { __rest } from 'tslib';
+import { jsx } from 'react/jsx-runtime';
+import { forwardRef, useRef, useState, useEffect, useCallback } from 'react';
+import ForwardedDInput from '../DInput/DInput.js';
+import useProvidedRefOrCreate from '../../hooks/useProvidedRefOrCreate.js';
+
+function normalizeValue(value) {
+    return value !== null && value !== void 0 ? value : '';
+}
+function DInputSearch(_a, ref) {
+    var { debounceMs = 300, onChange, onImmediateChange, value, defaultValue, placeholder = 'Search...' } = _a, props = __rest(_a, ["debounceMs", "onChange", "onImmediateChange", "value", "defaultValue", "placeholder"]);
+    const inputRef = useProvidedRefOrCreate(ref);
+    const isControlled = value !== undefined;
+    const onChangeRef = useRef(onChange);
+    onChangeRef.current = onChange;
+    const [internalValue, setInternalValue] = useState(normalizeValue(isControlled ? value : defaultValue));
+    // null = no keystroke has occurred yet (skip debounce on mount)
+    const [pendingValue, setPendingValue] = useState(null);
+    useEffect(() => {
+        if (!isControlled)
+            return;
+        setInternalValue(normalizeValue(value));
+    }, [isControlled, value]);
+    const handleChange = useCallback((nextValue) => {
+        if (!isControlled) {
+            setInternalValue(nextValue);
+        }
+        setPendingValue(nextValue);
+        onImmediateChange === null || onImmediateChange === void 0 ? void 0 : onImmediateChange(nextValue);
+    }, [isControlled, onImmediateChange]);
+    useEffect(() => {
+        var _a;
+        let timeoutId;
+        if (pendingValue !== null) {
+            if (debounceMs <= 0) {
+                (_a = onChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onChangeRef, pendingValue);
+                setPendingValue(null);
+            }
+            else {
+                timeoutId = window.setTimeout(() => {
+                    var _a;
+                    (_a = onChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onChangeRef, pendingValue);
+                    setPendingValue(null);
+                }, debounceMs);
+            }
+        }
+        return () => {
+            window.clearTimeout(timeoutId);
+        };
+    }, [debounceMs, pendingValue]);
+    return (jsx(ForwardedDInput, Object.assign({ ref: inputRef }, props, { type: "search", value: internalValue, onChange: handleChange, placeholder: placeholder })));
+}
+const ForwardedDInputSearch = forwardRef(DInputSearch);
+ForwardedDInputSearch.displayName = 'DInputSearch';
+
+export { ForwardedDInputSearch as default };
+//# sourceMappingURL=DInputSearch.js.map

package/dist/esm/components/DInputSearch/DInputSearch.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DInputSearch.js","sources":["../../../../dist-transpiled/components/DInputSearch/DInputSearch.js"],"sourcesContent":["import { __rest } from \"tslib\";\nimport { jsx as _jsx } from \"react/jsx-runtime\";\nimport { forwardRef, useCallback, useEffect, useRef, useState, } from 'react';\nimport DInput from '../DInput';\nimport useProvidedRefOrCreate from '../../hooks/useProvidedRefOrCreate';\nfunction normalizeValue(value) {\n    return value !== null && value !== void 0 ? value : '';\n}\nfunction DInputSearch(_a, ref) {\n    var { debounceMs = 300, onChange, onImmediateChange, value, defaultValue, placeholder = 'Search...' } = _a, props = __rest(_a, [\"debounceMs\", \"onChange\", \"onImmediateChange\", \"value\", \"defaultValue\", \"placeholder\"]);\n    const inputRef = useProvidedRefOrCreate(ref);\n    const isControlled = value !== undefined;\n    const onChangeRef = useRef(onChange);\n    onChangeRef.current = onChange;\n    const [internalValue, setInternalValue] = useState(normalizeValue(isControlled ? value : defaultValue));\n    // null = no keystroke has occurred yet (skip debounce on mount)\n    const [pendingValue, setPendingValue] = useState(null);\n    useEffect(() => {\n        if (!isControlled)\n            return;\n        setInternalValue(normalizeValue(value));\n    }, [isControlled, value]);\n    const handleChange = useCallback((nextValue) => {\n        if (!isControlled) {\n            setInternalValue(nextValue);\n        }\n        setPendingValue(nextValue);\n        onImmediateChange === null || onImmediateChange === void 0 ? void 0 : onImmediateChange(nextValue);\n    }, [isControlled, onImmediateChange]);\n    useEffect(() => {\n        var _a;\n        let timeoutId;\n        if (pendingValue !== null) {\n            if (debounceMs <= 0) {\n                (_a = onChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onChangeRef, pendingValue);\n                setPendingValue(null);\n            }\n            else {\n                timeoutId = window.setTimeout(() => {\n                    var _a;\n                    (_a = onChangeRef.current) === null || _a === void 0 ? void 0 : _a.call(onChangeRef, pendingValue);\n                    setPendingValue(null);\n                }, debounceMs);\n            }\n        }\n        return () => {\n            window.clearTimeout(timeoutId);\n        };\n    }, [debounceMs, pendingValue]);\n    return (_jsx(DInput, Object.assign({ ref: inputRef }, props, { type: \"search\", value: internalValue, onChange: handleChange, placeholder: placeholder })));\n}\nconst ForwardedDInputSearch = forwardRef(DInputSearch);\nForwardedDInputSearch.displayName = 'DInputSearch';\nexport default ForwardedDInputSearch;\n//# sourceMappingURL=DInputSearch.js.map"],"names":["_jsx","DInput"],"mappings":"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"}

package/dist/esm/components/DInputSearch/index.js

@@ -0,0 +1,6 @@
+import ForwardedDInputSearch from './DInputSearch.js';
+
+
+
+export { ForwardedDInputSearch as default };
+//# sourceMappingURL=index.js.map

package/dist/esm/components/DInputSearch/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}

package/dist/esm/components/DInputSelect/DInputSelect.js

@@ -0,0 +1,90 @@
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useId, useMemo, useCallback } from 'react';
+import classNames from 'classnames';
+import DIcon from '../DIcon/DIcon.js';
+
+function DInputSelect({ id: idProp, name, label = '', className, style, options = [], disabled = false, loading = false, iconStart, iconStartFamilyClass, iconStartFamilyPrefix, iconStartAriaLabel, iconEnd, iconEndFamilyClass, iconEndFamilyPrefix, iconEndAriaLabel, hint, value, size, floatingLabel = false, invalid = false, valid = false, dataAttributes, valueExtractor, labelExtractor, onChange, onBlur, onIconStartClick, onIconEndClick, }) {
+    const innerId = useId();
+    const id = useMemo(() => idProp || innerId, [idProp, innerId]);
+    const internalValueExtractor = useCallback((option) => {
+        if (valueExtractor) {
+            return valueExtractor(option);
+        }
+        if ('value' in option) {
+            return option === null || option === void 0 ? void 0 : option.value;
+        }
+        throw new Error('Must provide a valueExtractor for custom object forms');
+    }, [valueExtractor]);
+    const internalLabelExtractor = useCallback((option) => {
+        if (labelExtractor) {
+            return labelExtractor(option);
+        }
+        if ('label' in option) {
+            return option === null || option === void 0 ? void 0 : option.label;
+        }
+        throw new Error('Must provide a labelExtractor for custom object forms');
+    }, [labelExtractor]);
+    const changeHandler = useCallback((event) => {
+        const selected = options
+            .find((option) => internalValueExtractor(option).toString() === event.currentTarget.value);
+        if (selected) {
+            onChange === null || onChange === void 0 ? void 0 : onChange(selected);
+        }
+    }, [onChange, options, internalValueExtractor]);
+    const blurHandler = useCallback((event) => {
+        onBlur === null || onBlur === void 0 ? void 0 : onBlur(event);
+    }, [onBlur]);
+    const iconStartClickHandler = useCallback((event) => {
+        onIconStartClick === null || onIconStartClick === void 0 ? void 0 : onIconStartClick(event);
+    }, [onIconStartClick]);
+    const iconEndClickHandler = useCallback((event) => {
+        onIconEndClick === null || onIconEndClick === void 0 ? void 0 : onIconEndClick(event);
+    }, [onIconEndClick]);
+    const ariaDescribedby = useMemo(() => ([
+        iconStart && `${id}Start`,
+        hint && `${id}Hint`,
+        iconEnd && `${id}End`,
+    ]
+        .filter(Boolean)
+        .join(' ')), [id, iconStart, iconEnd, hint]);
+    const selectComponent = useMemo(() => (jsx("select", Object.assign({ id: id, name: name, className: classNames({
+            'form-select': true,
+            [`form-select-${size}`]: !!size,
+            'floating-label': floatingLabel,
+            'is-invalid': invalid,
+            'is-valid': valid,
+        }), "aria-label": label, disabled: disabled || loading, onChange: changeHandler, onBlur: blurHandler }, ariaDescribedby && { 'aria-describedby': ariaDescribedby }, value && { value }, { children: options.map((option) => (jsx("option", { value: internalValueExtractor(option), children: internalLabelExtractor(option) }, internalValueExtractor(option)))) }))), [
+        ariaDescribedby,
+        blurHandler,
+        changeHandler,
+        disabled,
+        id,
+        internalLabelExtractor,
+        internalValueExtractor,
+        label,
+        loading,
+        name,
+        options,
+        value,
+        floatingLabel,
+        invalid,
+        valid,
+        size,
+    ]);
+    const labelComponent = useMemo(() => (jsx("label", { htmlFor: id, children: label })), [
+        id,
+        label,
+    ]);
+    const dynamicComponent = useMemo(() => {
+        if (floatingLabel) {
+            return (jsxs("div", { className: "form-floating", children: [selectComponent, labelComponent] }));
+        }
+        return selectComponent;
+    }, [floatingLabel, labelComponent, selectComponent]);
+    return (jsxs("div", Object.assign({ className: className, style: style }, dataAttributes, { children: [label && !floatingLabel && (labelComponent), jsxs("div", { className: classNames({
+                    'input-group': true,
+                }), children: [iconStart && (jsx("button", { type: "button", className: "input-group-text", id: `${id}Start`, onClick: iconStartClickHandler, disabled: disabled || loading, "aria-label": iconStartAriaLabel, children: iconStart && (jsx(DIcon, { icon: iconStart, familyClass: iconStartFamilyClass, familyPrefix: iconStartFamilyPrefix })) })), dynamicComponent, iconEnd && !loading && (jsx("button", { type: "button", className: "input-group-text", id: `${id}End`, onClick: iconEndClickHandler, disabled: disabled || loading, "aria-label": iconEndAriaLabel, children: iconEnd && (jsx(DIcon, { icon: iconEnd, familyClass: iconEndFamilyClass, familyPrefix: iconEndFamilyPrefix })) })), loading && (jsx("div", { className: "input-group-text form-control-icon loading", children: jsx("span", { className: "spinner-border spinner-border-sm", role: "status", "aria-hidden": "true", children: jsx("span", { className: "visually-hidden", children: "Loading..." }) }) }))] }), hint && (jsx("div", { className: "form-text", id: `${id}Hint`, children: hint }))] })));
+}
+
+export { DInputSelect as default };
+//# sourceMappingURL=DInputSelect.js.map