bianic-ui 1.16.0-beta.4 → 1.16.0-beta.5

package/dist/cjs/index.js

@@ -1513,7 +1513,7 @@ var stateColorConfig = {
     default: 'enabled:hover:bg-black/10 enabled:focus-visible:border-bia-blue-disabled enabled:focus-visible:outline-2 enabled:focus-visible:-outline-offset-1 enabled:focus-visible:outline-bia-blue-disabled enabled:active:bg-black/15',
 };
 
-var ContextualButton = function (_a) {
+var ContextualButton = React.forwardRef(function (_a, ref) {
     var actionElement = _a.actionElement, label = _a.label, icon = _a.icon, _b = _a.variant, variant = _b === void 0 ? 'dark' : _b, disabled = _a.disabled; _a.isNotified; var _d = _a.isSelected, isSelected = _d === void 0 ? false : _d, props = __rest(_a, ["actionElement", "label", "icon", "variant", "disabled", "isNotified", "isSelected"]);
     var textColor = isSelected
         ? variant === 'dark'
@@ -1521,12 +1521,12 @@ var ContextualButton = function (_a) {
             : 'text-primary-white'
         : textColorConfig[variant];
     var stateColor = stateColorConfig[isSelected ? 'selected' : 'default'];
-    return (React.createElement("button", __assign({ className: "bianic-contextual-button box-border flex flex-row items-center rounded-radius-sm border border-transparent p-[1px] outline-none ".concat(stateColor, " ").concat(textColor) }, props, { disabled: disabled }),
+    return (React.createElement("button", __assign({ ref: ref, className: "bianic-contextual-button box-border flex flex-row items-center rounded-radius-sm border border-transparent p-[1px] outline-none ".concat(stateColor, " ").concat(textColor) }, props, { disabled: disabled }),
         icon,
         label && (React.createElement("div", { className: "label flex max-h-[46px] items-center px-[5px] text-[12px] leading-none" },
             React.createElement("span", { className: "mr-0.5" }, label),
             actionElement))));
-};
+});
 
 function Color() {
     var colors = [
@@ -2070,8 +2070,8 @@ var styleConfig = {
     },
 };
 
-function TextInput(_a) {
-    var descText = _a.descText, _b = _a.disabled, disabled = _b === void 0 ? false : _b, icon = _a.icon, _c = _a.id, id = _c === void 0 ? '' : _c, _d = _a.size, size = _d === void 0 ? 'md' : _d, _e = _a.isValid, isValid = _e === void 0 ? null : _e, label = _a.label, _f = _a.placeholder, placeholder = _f === void 0 ? '' : _f, _g = _a.readOnly, readOnly = _g === void 0 ? false : _g, _h = _a.required, required = _h === void 0 ? false : _h, _j = _a.variant, variant = _j === void 0 ? 'text' : _j, _k = _a.value, value = _k === void 0 ? undefined : _k, _l = _a.onChange, onChange = _l === void 0 ? function () { } : _l, _m = _a.maxLength, maxLength = _m === void 0 ? undefined : _m, _o = _a.inputClassName, inputClassName = _o === void 0 ? '' : _o; _a.isFlatRight; var actionElement = _a.actionElement, _q = _a.autoComplete, autoComplete = _q === void 0 ? 'off' : _q, ref = _a.ref, props = __rest(_a, ["descText", "disabled", "icon", "id", "size", "isValid", "label", "placeholder", "readOnly", "required", "variant", "value", "onChange", "maxLength", "inputClassName", "isFlatRight", "actionElement", "autoComplete", "ref"]);
+var TextInput = React.forwardRef(function (_a, ref) {
+    var descText = _a.descText, _b = _a.disabled, disabled = _b === void 0 ? false : _b, icon = _a.icon, _c = _a.id, id = _c === void 0 ? '' : _c, _d = _a.size, size = _d === void 0 ? 'md' : _d, _e = _a.isValid, isValid = _e === void 0 ? null : _e, label = _a.label, _f = _a.placeholder, placeholder = _f === void 0 ? '' : _f, _g = _a.readOnly, readOnly = _g === void 0 ? false : _g, _h = _a.required, required = _h === void 0 ? false : _h, _j = _a.variant, variant = _j === void 0 ? 'text' : _j, _k = _a.value, value = _k === void 0 ? undefined : _k, _l = _a.onChange, onChange = _l === void 0 ? function () { } : _l, _m = _a.maxLength, maxLength = _m === void 0 ? undefined : _m, _o = _a.inputClassName, inputClassName = _o === void 0 ? '' : _o; _a.isFlatRight; var actionElement = _a.actionElement, _q = _a.autoComplete, autoComplete = _q === void 0 ? 'off' : _q, props = __rest(_a, ["descText", "disabled", "icon", "id", "size", "isValid", "label", "placeholder", "readOnly", "required", "variant", "value", "onChange", "maxLength", "inputClassName", "isFlatRight", "actionElement", "autoComplete"]);
     var isTransparent = variant.includes('transparent');
     var _r = React.useState(false), isShow = _r[0], setIsShow = _r[1];
     var _s = styleConfig[variant], fieldStyle = _s.fieldStyle, iconStyle = _s.iconStyle;
@@ -2121,7 +2121,7 @@ function TextInput(_a) {
                 remainWords,
                 "/",
                 maxLength))))));
-}
+});
 TextInput.defaultProps = {
     descText: '',
     disabled: false,
@@ -3154,7 +3154,7 @@ var PickerCalendar = function (_a) {
         setViewYearValue(year);
         handlePickerMode('month');
     };
-    return (React.createElement("div", __assign({ className: "bianic-datepicker-calendar absolute flex w-[250px] flex-col gap-[15px] rounded-b-radius-sm bg-bia-white px-1.5 pb-[17px] pt-[15px] text-bia-black shadow-md", ref: pickerCalendarRef, style: positionStyle }, props),
+    return reactDom.createPortal(React.createElement("div", __assign({ className: "bianic-datepicker-calendar absolute flex w-[250px] flex-col gap-[15px] rounded-b-radius-sm bg-bia-white px-1.5 pb-[17px] pt-[15px] text-bia-black shadow-md", ref: pickerCalendarRef, style: positionStyle }, props),
         React.createElement("div", { className: "bianic-datepicker-calendar-controller flex w-full items-center justify-between" },
             React.createElement("button", { className: "bianic-datepicker-calendar-prev-button text-bia-coolgrey disabled:text-bia-coolgrey-light-50", disabled: isPrevDisabled(), onClick: pickerMode === 'date'
                     ? handlePrevMonth
@@ -3185,7 +3185,7 @@ var PickerCalendar = function (_a) {
                 React.createElement(TbChevronRight, { size: 18 }))),
         pickerMode === 'date' && (React.createElement(DateDisplay, { displayDays: displayDays, maxDateValue: maxDateValue, minDateValue: minDateValue, onDateSelect: handleDateSelect, selectedDate: selectedDate, viewMonthValue: viewMonthValue })),
         pickerMode === 'month' && (React.createElement(MonthDisplay, { maxDateValue: maxDateValue, minDateValue: minDateValue, onMonthSelect: handleMonthSelect, selectedDate: selectedDate, viewMonthValue: viewMonthValue, viewYearValue: viewYearValue })),
-        pickerMode === 'year' && (React.createElement(YearDisplay, { maxDateValue: maxDateValue, minDateValue: minDateValue, onYearSelect: handleYearSelect, viewYearValue: viewYearValue, yearDisplayRange: yearDisplayRange }))));
+        pickerMode === 'year' && (React.createElement(YearDisplay, { maxDateValue: maxDateValue, minDateValue: minDateValue, onYearSelect: handleYearSelect, viewYearValue: viewYearValue, yearDisplayRange: yearDisplayRange }))), document.body);
 };
 
 var monthMap = [
@@ -3202,7 +3202,7 @@ var monthMap = [
     'November',
     'December',
 ];
-var DateInputDisplay = function (_a) {
+var DateInputDisplay = React.forwardRef(function (_a, ref) {
     var value = _a.value, setValue = _a.setValue, _b = _a.placeholder, placeholder = _b === void 0 ? 'YYYY-MM-DD' : _b, label = _a.label, required = _a.required, id = _a.id, _c = _a.size, size = _c === void 0 ? 'sm' : _c, className = _a.className, _d = _a.disabled, disabled = _d === void 0 ? false : _d, buttonAction = _a.buttonAction, nullDisplay = _a.nullDisplay, props = __rest(_a, ["value", "setValue", "placeholder", "label", "required", "id", "size", "className", "disabled", "buttonAction", "nullDisplay"]);
     var _e = React.useState(false), isEditing = _e[0], setIsEditing = _e[1];
     var _f = React.useState(value), dateString = _f[0], setDateString = _f[1];
@@ -3251,8 +3251,8 @@ var DateInputDisplay = function (_a) {
         label && (React.createElement("label", { htmlFor: id, className: "bianic-text-input-label text-xs font-semibold ".concat(labelStatus) },
             label,
             required && React.createElement("span", { className: "p-1 text-bia-red" }, "*"))),
-        React.createElement("div", { className: "relative w-full" }, input)));
-};
+        React.createElement("div", { className: "relative w-full", ref: ref }, input)));
+});
 var dateToInputString = function (dateObj) {
     if (!(dateObj instanceof Date) || isNaN(dateObj))
         return ''; // Return empty string for invalid dates

package/dist/cjs/types/components/Button/ContextualButton/ContextualButton.d.ts

@@ -7,5 +7,5 @@ interface ContextualButtonProps extends ComponentPropsWithoutRef<'button'> {
     isNotified?: boolean;
     isSelected?: boolean;
 }
-declare const ContextualButton: ({ actionElement, label, icon, variant, disabled, isNotified, isSelected, ...props }: ContextualButtonProps) => React.JSX.Element;
+declare const ContextualButton: React.ForwardRefExoticComponent<ContextualButtonProps & React.RefAttributes<HTMLButtonElement>>;
 export default ContextualButton;

package/dist/cjs/types/components/Forms/DatePicker/DateInputDisplay.d.ts

@@ -12,5 +12,5 @@ interface DateInputDisplayProps extends Omit<TextInputProps, 'value'> {
     disabled: boolean;
     nullDisplay?: string;
 }
-declare const DateInputDisplay: ({ value, setValue, placeholder, label, required, id, size, className, disabled, buttonAction, nullDisplay, ...props }: DateInputDisplayProps) => React.JSX.Element;
+declare const DateInputDisplay: React.ForwardRefExoticComponent<Omit<DateInputDisplayProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
 export default DateInputDisplay;

package/dist/cjs/types/components/Forms/TextInput/index.d.ts

@@ -1,23 +1,5 @@
 import React from 'react';
 import TextInputProps from './PropsInterface';
 import './style.css';
-declare function TextInput({ descText, disabled, icon, id, size, isValid, label, placeholder, readOnly, required, variant, value, onChange, maxLength, inputClassName, isFlatRight, actionElement, autoComplete, ref, ...props }: TextInputProps): React.JSX.Element;
-declare namespace TextInput {
-    var defaultProps: {
-        descText: string;
-        disabled: boolean;
-        icon: null;
-        id: string;
-        size: string;
-        isValid: null;
-        label: string;
-        placeholder: string;
-        readOnly: boolean;
-        variant: string;
-        value: undefined;
-        onChange: () => void;
-        inputClassName: string;
-        isFlatRight: boolean;
-    };
-}
+declare const TextInput: React.ForwardRefExoticComponent<Omit<TextInputProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
 export default TextInput;

package/dist/cjs/types/stories/Form/TextInput/TextInput.stories.d.ts

@@ -1,8 +1,8 @@
 import type { StoryObj } from '@storybook/react';
-import { TextInput } from '../../../components';
+import React from 'react';
 declare const meta: {
     title: string;
-    component: typeof TextInput;
+    component: React.ForwardRefExoticComponent<Omit<import("../../../components/Forms/TextInput/PropsInterface").default, "ref"> & React.RefAttributes<HTMLInputElement>>;
     parameters: {
         layout: string;
     };

package/dist/esm/index.js

@@ -1511,7 +1511,7 @@ var stateColorConfig = {
     default: 'enabled:hover:bg-black/10 enabled:focus-visible:border-bia-blue-disabled enabled:focus-visible:outline-2 enabled:focus-visible:-outline-offset-1 enabled:focus-visible:outline-bia-blue-disabled enabled:active:bg-black/15',
 };
 
-var ContextualButton = function (_a) {
+var ContextualButton = forwardRef(function (_a, ref) {
     var actionElement = _a.actionElement, label = _a.label, icon = _a.icon, _b = _a.variant, variant = _b === void 0 ? 'dark' : _b, disabled = _a.disabled; _a.isNotified; var _d = _a.isSelected, isSelected = _d === void 0 ? false : _d, props = __rest(_a, ["actionElement", "label", "icon", "variant", "disabled", "isNotified", "isSelected"]);
     var textColor = isSelected
         ? variant === 'dark'
@@ -1519,12 +1519,12 @@ var ContextualButton = function (_a) {
             : 'text-primary-white'
         : textColorConfig[variant];
     var stateColor = stateColorConfig[isSelected ? 'selected' : 'default'];
-    return (React.createElement("button", __assign({ className: "bianic-contextual-button box-border flex flex-row items-center rounded-radius-sm border border-transparent p-[1px] outline-none ".concat(stateColor, " ").concat(textColor) }, props, { disabled: disabled }),
+    return (React.createElement("button", __assign({ ref: ref, className: "bianic-contextual-button box-border flex flex-row items-center rounded-radius-sm border border-transparent p-[1px] outline-none ".concat(stateColor, " ").concat(textColor) }, props, { disabled: disabled }),
         icon,
         label && (React.createElement("div", { className: "label flex max-h-[46px] items-center px-[5px] text-[12px] leading-none" },
             React.createElement("span", { className: "mr-0.5" }, label),
             actionElement))));
-};
+});
 
 function Color() {
     var colors = [
@@ -2068,8 +2068,8 @@ var styleConfig = {
     },
 };
 
-function TextInput(_a) {
-    var descText = _a.descText, _b = _a.disabled, disabled = _b === void 0 ? false : _b, icon = _a.icon, _c = _a.id, id = _c === void 0 ? '' : _c, _d = _a.size, size = _d === void 0 ? 'md' : _d, _e = _a.isValid, isValid = _e === void 0 ? null : _e, label = _a.label, _f = _a.placeholder, placeholder = _f === void 0 ? '' : _f, _g = _a.readOnly, readOnly = _g === void 0 ? false : _g, _h = _a.required, required = _h === void 0 ? false : _h, _j = _a.variant, variant = _j === void 0 ? 'text' : _j, _k = _a.value, value = _k === void 0 ? undefined : _k, _l = _a.onChange, onChange = _l === void 0 ? function () { } : _l, _m = _a.maxLength, maxLength = _m === void 0 ? undefined : _m, _o = _a.inputClassName, inputClassName = _o === void 0 ? '' : _o; _a.isFlatRight; var actionElement = _a.actionElement, _q = _a.autoComplete, autoComplete = _q === void 0 ? 'off' : _q, ref = _a.ref, props = __rest(_a, ["descText", "disabled", "icon", "id", "size", "isValid", "label", "placeholder", "readOnly", "required", "variant", "value", "onChange", "maxLength", "inputClassName", "isFlatRight", "actionElement", "autoComplete", "ref"]);
+var TextInput = forwardRef(function (_a, ref) {
+    var descText = _a.descText, _b = _a.disabled, disabled = _b === void 0 ? false : _b, icon = _a.icon, _c = _a.id, id = _c === void 0 ? '' : _c, _d = _a.size, size = _d === void 0 ? 'md' : _d, _e = _a.isValid, isValid = _e === void 0 ? null : _e, label = _a.label, _f = _a.placeholder, placeholder = _f === void 0 ? '' : _f, _g = _a.readOnly, readOnly = _g === void 0 ? false : _g, _h = _a.required, required = _h === void 0 ? false : _h, _j = _a.variant, variant = _j === void 0 ? 'text' : _j, _k = _a.value, value = _k === void 0 ? undefined : _k, _l = _a.onChange, onChange = _l === void 0 ? function () { } : _l, _m = _a.maxLength, maxLength = _m === void 0 ? undefined : _m, _o = _a.inputClassName, inputClassName = _o === void 0 ? '' : _o; _a.isFlatRight; var actionElement = _a.actionElement, _q = _a.autoComplete, autoComplete = _q === void 0 ? 'off' : _q, props = __rest(_a, ["descText", "disabled", "icon", "id", "size", "isValid", "label", "placeholder", "readOnly", "required", "variant", "value", "onChange", "maxLength", "inputClassName", "isFlatRight", "actionElement", "autoComplete"]);
     var isTransparent = variant.includes('transparent');
     var _r = useState(false), isShow = _r[0], setIsShow = _r[1];
     var _s = styleConfig[variant], fieldStyle = _s.fieldStyle, iconStyle = _s.iconStyle;
@@ -2119,7 +2119,7 @@ function TextInput(_a) {
                 remainWords,
                 "/",
                 maxLength))))));
-}
+});
 TextInput.defaultProps = {
     descText: '',
     disabled: false,
@@ -3152,7 +3152,7 @@ var PickerCalendar = function (_a) {
         setViewYearValue(year);
         handlePickerMode('month');
     };
-    return (React.createElement("div", __assign({ className: "bianic-datepicker-calendar absolute flex w-[250px] flex-col gap-[15px] rounded-b-radius-sm bg-bia-white px-1.5 pb-[17px] pt-[15px] text-bia-black shadow-md", ref: pickerCalendarRef, style: positionStyle }, props),
+    return createPortal(React.createElement("div", __assign({ className: "bianic-datepicker-calendar absolute flex w-[250px] flex-col gap-[15px] rounded-b-radius-sm bg-bia-white px-1.5 pb-[17px] pt-[15px] text-bia-black shadow-md", ref: pickerCalendarRef, style: positionStyle }, props),
         React.createElement("div", { className: "bianic-datepicker-calendar-controller flex w-full items-center justify-between" },
             React.createElement("button", { className: "bianic-datepicker-calendar-prev-button text-bia-coolgrey disabled:text-bia-coolgrey-light-50", disabled: isPrevDisabled(), onClick: pickerMode === 'date'
                     ? handlePrevMonth
@@ -3183,7 +3183,7 @@ var PickerCalendar = function (_a) {
                 React.createElement(TbChevronRight, { size: 18 }))),
         pickerMode === 'date' && (React.createElement(DateDisplay, { displayDays: displayDays, maxDateValue: maxDateValue, minDateValue: minDateValue, onDateSelect: handleDateSelect, selectedDate: selectedDate, viewMonthValue: viewMonthValue })),
         pickerMode === 'month' && (React.createElement(MonthDisplay, { maxDateValue: maxDateValue, minDateValue: minDateValue, onMonthSelect: handleMonthSelect, selectedDate: selectedDate, viewMonthValue: viewMonthValue, viewYearValue: viewYearValue })),
-        pickerMode === 'year' && (React.createElement(YearDisplay, { maxDateValue: maxDateValue, minDateValue: minDateValue, onYearSelect: handleYearSelect, viewYearValue: viewYearValue, yearDisplayRange: yearDisplayRange }))));
+        pickerMode === 'year' && (React.createElement(YearDisplay, { maxDateValue: maxDateValue, minDateValue: minDateValue, onYearSelect: handleYearSelect, viewYearValue: viewYearValue, yearDisplayRange: yearDisplayRange }))), document.body);
 };
 
 var monthMap = [
@@ -3200,7 +3200,7 @@ var monthMap = [
     'November',
     'December',
 ];
-var DateInputDisplay = function (_a) {
+var DateInputDisplay = forwardRef(function (_a, ref) {
     var value = _a.value, setValue = _a.setValue, _b = _a.placeholder, placeholder = _b === void 0 ? 'YYYY-MM-DD' : _b, label = _a.label, required = _a.required, id = _a.id, _c = _a.size, size = _c === void 0 ? 'sm' : _c, className = _a.className, _d = _a.disabled, disabled = _d === void 0 ? false : _d, buttonAction = _a.buttonAction, nullDisplay = _a.nullDisplay, props = __rest(_a, ["value", "setValue", "placeholder", "label", "required", "id", "size", "className", "disabled", "buttonAction", "nullDisplay"]);
     var _e = useState(false), isEditing = _e[0], setIsEditing = _e[1];
     var _f = useState(value), dateString = _f[0], setDateString = _f[1];
@@ -3249,8 +3249,8 @@ var DateInputDisplay = function (_a) {
         label && (React.createElement("label", { htmlFor: id, className: "bianic-text-input-label text-xs font-semibold ".concat(labelStatus) },
             label,
             required && React.createElement("span", { className: "p-1 text-bia-red" }, "*"))),
-        React.createElement("div", { className: "relative w-full" }, input)));
-};
+        React.createElement("div", { className: "relative w-full", ref: ref }, input)));
+});
 var dateToInputString = function (dateObj) {
     if (!(dateObj instanceof Date) || isNaN(dateObj))
         return ''; // Return empty string for invalid dates

package/dist/esm/types/components/Button/ContextualButton/ContextualButton.d.ts

@@ -7,5 +7,5 @@ interface ContextualButtonProps extends ComponentPropsWithoutRef<'button'> {
     isNotified?: boolean;
     isSelected?: boolean;
 }
-declare const ContextualButton: ({ actionElement, label, icon, variant, disabled, isNotified, isSelected, ...props }: ContextualButtonProps) => React.JSX.Element;
+declare const ContextualButton: React.ForwardRefExoticComponent<ContextualButtonProps & React.RefAttributes<HTMLButtonElement>>;
 export default ContextualButton;

package/dist/esm/types/components/Forms/DatePicker/DateInputDisplay.d.ts

@@ -12,5 +12,5 @@ interface DateInputDisplayProps extends Omit<TextInputProps, 'value'> {
     disabled: boolean;
     nullDisplay?: string;
 }
-declare const DateInputDisplay: ({ value, setValue, placeholder, label, required, id, size, className, disabled, buttonAction, nullDisplay, ...props }: DateInputDisplayProps) => React.JSX.Element;
+declare const DateInputDisplay: React.ForwardRefExoticComponent<Omit<DateInputDisplayProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
 export default DateInputDisplay;

package/dist/esm/types/components/Forms/TextInput/index.d.ts

@@ -1,23 +1,5 @@
 import React from 'react';
 import TextInputProps from './PropsInterface';
 import './style.css';
-declare function TextInput({ descText, disabled, icon, id, size, isValid, label, placeholder, readOnly, required, variant, value, onChange, maxLength, inputClassName, isFlatRight, actionElement, autoComplete, ref, ...props }: TextInputProps): React.JSX.Element;
-declare namespace TextInput {
-    var defaultProps: {
-        descText: string;
-        disabled: boolean;
-        icon: null;
-        id: string;
-        size: string;
-        isValid: null;
-        label: string;
-        placeholder: string;
-        readOnly: boolean;
-        variant: string;
-        value: undefined;
-        onChange: () => void;
-        inputClassName: string;
-        isFlatRight: boolean;
-    };
-}
+declare const TextInput: React.ForwardRefExoticComponent<Omit<TextInputProps, "ref"> & React.RefAttributes<HTMLInputElement>>;
 export default TextInput;

package/dist/esm/types/stories/Form/TextInput/TextInput.stories.d.ts

@@ -1,8 +1,8 @@
 import type { StoryObj } from '@storybook/react';
-import { TextInput } from '../../../components';
+import React from 'react';
 declare const meta: {
     title: string;
-    component: typeof TextInput;
+    component: React.ForwardRefExoticComponent<Omit<import("../../../components/Forms/TextInput/PropsInterface").default, "ref"> & React.RefAttributes<HTMLInputElement>>;
     parameters: {
         layout: string;
     };

package/dist/index.d.ts

@@ -119,7 +119,7 @@ interface ContextualButtonProps extends ComponentPropsWithoutRef<'button'> {
     isNotified?: boolean;
     isSelected?: boolean;
 }
-declare const ContextualButton: ({ actionElement, label, icon, variant, disabled, isNotified, isSelected, ...props }: ContextualButtonProps) => React$1.JSX.Element;
+declare const ContextualButton: React$1.ForwardRefExoticComponent<ContextualButtonProps & React$1.RefAttributes<HTMLButtonElement>>;
 
 declare function Color(): React$1.JSX.Element;
 
@@ -209,25 +209,7 @@ interface TextInputProps extends Omit<ComponentPropsWithRef<'input'>, 'size'> {
     actionElement?: React.ReactNode;
 }
 
-declare function TextInput({ descText, disabled, icon, id, size, isValid, label, placeholder, readOnly, required, variant, value, onChange, maxLength, inputClassName, isFlatRight, actionElement, autoComplete, ref, ...props }: TextInputProps): React$1.JSX.Element;
-declare namespace TextInput {
-    var defaultProps: {
-        descText: string;
-        disabled: boolean;
-        icon: null;
-        id: string;
-        size: string;
-        isValid: null;
-        label: string;
-        placeholder: string;
-        readOnly: boolean;
-        variant: string;
-        value: undefined;
-        onChange: () => void;
-        inputClassName: string;
-        isFlatRight: boolean;
-    };
-}
+declare const TextInput: React$1.ForwardRefExoticComponent<Omit<TextInputProps, "ref"> & React$1.RefAttributes<HTMLInputElement>>;
 
 interface RadioProps extends Omit<ComponentPropsWithoutRef<'input'>, 'size'> {
     label?: string;

package/package.json

@@ -3,7 +3,7 @@
   "publishConfig": {
     "@biaenergi:registry": "https://gitlab.com/api/v4/projects/50905269/packages/npm/"
   },
-  "version": "1.16.0-beta.4",
+  "version": "1.16.0-beta.5",
   "description": "Design Language System develop by BIAENERGI",
   "scripts": {
     "rollup": "rollup -c",