bianic-ui 1.16.0-beta.1 → 1.16.0-beta.3

package/dist/cjs/index.js

@@ -443,10 +443,10 @@ var minWidthConfig$1 = {
     tn: 'min-w-[64px]',
 };
 var iconOnlySizeConfig$1 = {
-    lg: 'py-[13px] h-[48px] h-[48px] flex items-center justify-center gap-[10px]',
+    lg: 'py-[13px] h-[48px] w-[48px] flex items-center justify-center gap-[10px]',
     md: 'py-[11px] h-[40px] w-[40px] flex items-center justify-center gap-[5px]',
-    sm: 'py-[8px] h-[30px] h-[30px] flex items-center justify-center gap-[5px] ',
-    tn: 'py-[4px] h-[22px] h-[22px] flex items-center justify-center gap-[3px]',
+    sm: 'py-[8px] h-[30px] w-[30px] flex items-center justify-center gap-[5px] ',
+    tn: 'py-[4px] h-[22px] w-[22px] flex items-center justify-center gap-[3px]',
 };
 var shadow = 'shadow-[0px_6px_18px_1px_rgba(188,199,237,0.5)] disabled:shadow-none active:shadow-none';
 var variantConfig$2 = {
@@ -2401,10 +2401,11 @@ var getDropdownStyle = function (anchorRef, dropdownRef) {
     // AND space above is more than space below
     // then flip up
     if (spaceToBottom < dropdownHeight && spaceToTop > spaceToBottom) {
-        style.bottom = "".concat(window.innerHeight - anchorRect.top, "px");
+        var topPositionForFlip = anchorRect.top + window.scrollY - dropdownHeight;
+        style.bottom = "".concat(topPositionForFlip, "px");
     }
     else {
-        style.top = "".concat(anchorRect.bottom, "px");
+        style.top = "".concat(anchorRect.bottom + window.scrollY, "px");
     }
     return style;
 };
@@ -2595,7 +2596,7 @@ var processRenderedChildren = function (children, searchTerm, searchVariant, han
 var useLiveSearch = function (_a) {
     var value = _a.value, setValue = _a.setValue, onChangeText = _a.onChangeText, dropContOnClickItem = _a.dropContOnClickItem;
     var _b = React.useState(false), isOpen = _b[0], setIsOpen = _b[1];
-    var _c = React.useState(String(value.label || '')), searchTerm = _c[0], setSearchTerm = _c[1];
+    var _c = React.useState(getItemLabel(value)), searchTerm = _c[0], setSearchTerm = _c[1];
     React.useEffect(function () {
         if (!isOpen && searchTerm !== '') {
             setSearchTerm(getItemLabel(value));
@@ -3152,15 +3153,15 @@ var displayDateFormatter = function (date) {
 };
 
 function DatePicker(_a) {
-    var className = _a.className, value = _a.value, onChange = _a.onChange, size = _a.size, disabled = _a.disabled; _a.placeholder; var label = _a.label, minDate = _a.minDate, maxDate = _a.maxDate, required = _a.required, nullDisplay = _a.nullDisplay;
+    var value = _a.value, onChange = _a.onChange, size = _a.size, disabled = _a.disabled; _a.placeholder; var label = _a.label, minDate = _a.minDate, maxDate = _a.maxDate, required = _a.required, nullDisplay = _a.nullDisplay, inputclassName = _a.inputclassName, containerClassName = _a.containerClassName;
     // State and Ref
     var inputRef = React.useRef(null);
     var wrapperRef = React.useRef(null);
     var pickerRef = React.useRef(null);
     var _c = useDetectOutsideClick(wrapperRef, false, pickerRef), isPickerOpen = _c[0], setIsPickerOpen = _c[1];
-    return (React.createElement("div", { className: "bianic-datepicker-container relative", ref: wrapperRef },
+    return (React.createElement("div", { className: "bianic-datepicker-container relative ".concat(containerClassName), ref: wrapperRef },
         React.createElement("div", { className: "bianic-datepicker-field-container" },
-            React.createElement(DateInputDisplay, { inputClassName: className, value: value, setValue: onChange, placeholder: "YYYY-MM-DD", nullDisplay: nullDisplay, size: size, label: label, required: required, buttonAction: function () { return setIsPickerOpen(!isPickerOpen); }, ref: inputRef, disabled: disabled })),
+            React.createElement(DateInputDisplay, { inputClassName: inputclassName, value: value, setValue: onChange, placeholder: "YYYY-MM-DD", nullDisplay: nullDisplay, size: size, label: label, required: required, buttonAction: function () { return setIsPickerOpen(!isPickerOpen); }, ref: inputRef, disabled: disabled })),
         isPickerOpen && (React.createElement("div", { className: "bianic-datepicker-calendar-container absolute left-0 w-[250px] rounded-b-radius-sm bg-bia-white px-1.5 pb-[17px] pt-[15px] shadow-md" },
             React.createElement(PickerCalendar, { selectedDate: value, onDateChange: onChange, ref: pickerRef, minDate: minDate, maxDate: maxDate })))));
 }
@@ -3406,7 +3407,7 @@ function Modal(_a) {
 
 var sizeConfig$2 = {
     md: 'min-w-[38px] h-[40px] text-[14px] font-semibold',
-    sm: 'min-w-[29px] h-[30px] mt-1 text-[12px] font-normal',
+    sm: 'min-w-[29px] h-[30px] text-[12px] font-normal',
 };
 var positionConfig = {
     start: 'justify-start',
@@ -3454,8 +3455,8 @@ function PaginationBar(_a) {
     };
     return (React.createElement("div", { className: "flex ".concat(positionConfig[position], " gap-[5px]") },
         React.createElement(Button, { variant: "subtle-link", size: size, type: "button", onClick: function () { return handlePageChange(currentPage - 1); }, className: "cursor-pointer", iconLeft: React.createElement(TbChevronLeft, { size: iconSize }), disabled: currentPage === 1 }),
-        showedPages.map(function (page) { return (React.createElement(Button, { key: page, variant: currentPage === page ? 'default' : 'subtle-link', size: size, type: "button", onClick: function () { return handlePageChange(page); }, className: "cursor-pointer ".concat(sizeConfig$2[size]), label: page.toString(), minWidth: buttonSizingStyle })); }),
-        React.createElement(Button, { variant: "subtle-link", size: "md", type: "button", onClick: function () { return handlePageChange(currentPage + 1); }, className: "cursor-pointer", iconLeft: React.createElement(TbChevronRight, { size: iconSize }), disabled: currentPage === totalPages })));
+        showedPages.map(function (page) { return (React.createElement(Button, { key: page, variant: currentPage === page ? 'default' : 'subtle', size: size, type: "button", onClick: function () { return handlePageChange(page); }, className: "cursor-pointer ".concat(sizeConfig$2[size]), label: page.toString(), minWidth: buttonSizingStyle })); }),
+        React.createElement(Button, { variant: "subtle-link", size: size, type: "button", onClick: function () { return handlePageChange(currentPage + 1); }, className: "cursor-pointer", iconLeft: React.createElement(TbChevronRight, { size: iconSize }), disabled: currentPage === totalPages })));
 }
 
 var activeConfig = {