@agilant/toga-blox 1.0.147 → 1.0.148
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -8,7 +8,7 @@ const SearchInput = ({ textHighlight = "text-sky-500", inputType = "text", dropd
|
|
|
8
8
|
name: "chevronDown",
|
|
9
9
|
weight: "bold",
|
|
10
10
|
iconClasses: "text-black",
|
|
11
|
-
}, dropdownOptions = [], selectedDropdownOption = "", onDropdownOptionSelect, searchItems = [], setSearchItems, toggleStatus = false, setToggleStatus, minValue, setMinValue, maxValue, setMaxValue, onChange, selectedValue, selectedDate, onDateSelect, selectedStartDate, onStartDateSelect, selectedEndDate, onEndDateSelect, handleFilter, column, setSearchCriteria, setEditingHeader, pillColor, firstIconClasses, dataPickerThemeColor, dataPickerThemeColorAccent, isBoolean = false, toggleColor = "bg-sky-500", toggleTextColor = "text-black", fontFamily, removePattern = /^[^:]*:/, isSearchable = false, hasOperator = false, tooltipText = "Clear filters to edit operator", hoverBgColor, clearTextHoverColor, numberTypeIcon, firstIconTop, inactiveCircleColor, activeCircleColor = "peer-checked:after:bg-purple-500", placeHolderColor = "placeholder:text-green-500", buttonPlaceHolderTextColor = "text-
|
|
11
|
+
}, dropdownOptions = [], selectedDropdownOption = "", onDropdownOptionSelect, searchItems = [], setSearchItems, toggleStatus = false, setToggleStatus, minValue, setMinValue, maxValue, setMaxValue, onChange, selectedValue, selectedDate, onDateSelect, selectedStartDate, onStartDateSelect, selectedEndDate, onEndDateSelect, handleFilter, column, setSearchCriteria, setEditingHeader, pillColor, firstIconClasses, dataPickerThemeColor, dataPickerThemeColorAccent, isBoolean = false, toggleColor = "bg-sky-500", toggleTextColor = "text-black", fontFamily, removePattern = /^[^:]*:/, isSearchable = false, hasOperator = false, tooltipText = "Clear filters to edit operator", hoverBgColor, clearTextHoverColor, numberTypeIcon, firstIconTop, inactiveCircleColor, activeCircleColor = "peer-checked:after:bg-purple-500", placeHolderColor = "placeholder:text-green-500", buttonPlaceHolderTextColor = "text-orange-500", inactiveColorBackground = "bg-purple-300", inactiveColorBorder = "border-purple-300", activeColorBorder = "border-orange-900", }) => {
|
|
12
12
|
const containerRef = useRef(null);
|
|
13
13
|
const inputRef = useRef(null);
|
|
14
14
|
useEffect(() => {
|
|
@@ -346,21 +346,21 @@ function SearchDatePickerInput({ themeBgColor = "bg-sky-500", lightThemeBg = "bg
|
|
|
346
346
|
setIsDatePickerOpen(false);
|
|
347
347
|
setActiveInput(null);
|
|
348
348
|
}
|
|
349
|
-
}, firstIcon: getFontAwesomeIcon("calendar", "regular"), required: false, firstIconTop: firstIconTop, additionalClasses: "border-2 px-3 py-2 flex-[2] h-10 text-left min-w-44 max-w-44 rounded", hasAutoFocus: true })) : (_jsxs("button", { onClick: openStartPicker, className: `${buttonPlaceHolderTextColor} border-2 px-3 py-2 flex-1 h-10 text-left min-w-44 max-w-44 rounded `, children: [_jsx("span", { className:
|
|
349
|
+
}, firstIcon: _jsx("span", { className: `${buttonPlaceHolderTextColor}`, children: getFontAwesomeIcon("calendar", "regular") }), required: false, firstIconTop: firstIconTop, additionalClasses: "border-2 px-3 py-2 flex-[2] h-10 text-left min-w-44 max-w-44 rounded ", hasAutoFocus: true })) : (_jsxs("button", { onClick: openStartPicker, className: `${buttonPlaceHolderTextColor} border-2 px-3 py-2 flex-1 h-10 text-left min-w-44 max-w-44 rounded `, children: [_jsx("span", { className: `pr-2 ${buttonPlaceHolderTextColor}`, children: _jsx("span", { className: `${buttonPlaceHolderTextColor}`, children: getFontAwesomeIcon("calendar", "regular") }) }), localStartDate
|
|
350
350
|
? formatDateAsMonthDayYear(localStartDate)
|
|
351
351
|
: "mm/dd/yyyy"] })), _jsx("span", { className: "mx-2", children: "to" }), activeInput === "end" ? (_jsx(Input, { type: "text", value: endDateInputValue, onChange: handleEndDateInputChange, placeholder: "mm/dd/yyy", placeHolderColor: placeHolderColor, onKeyDown: (e) => {
|
|
352
352
|
if (e.key === "Enter") {
|
|
353
353
|
setIsDatePickerOpen(false);
|
|
354
354
|
setActiveInput(null);
|
|
355
355
|
}
|
|
356
|
-
}, firstIcon: getFontAwesomeIcon("calendar", "regular"), required: false, firstIconTop: firstIconTop, additionalClasses: "border-2 px-3 py-2 flex-[2] h-10 text-left min-w-44 max-w-44 rounded", hasAutoFocus: true })) : (_jsxs("button", { onClick: openEndPicker, className: `${buttonPlaceHolderTextColor} border-2 px-3 py-2 flex-1 h-10 text-left min-w-44 max-w-44 rounded`, children: [_jsx("span", { className:
|
|
356
|
+
}, firstIcon: _jsx("span", { className: `${buttonPlaceHolderTextColor}`, children: getFontAwesomeIcon("calendar", "regular") }), required: false, firstIconTop: firstIconTop, additionalClasses: "border-2 px-3 py-2 flex-[2] h-10 text-left min-w-44 max-w-44 rounded", hasAutoFocus: true })) : (_jsxs("button", { onClick: openEndPicker, className: `${buttonPlaceHolderTextColor} border-2 px-3 py-2 flex-1 h-10 text-left min-w-44 max-w-44 rounded`, children: [_jsx("span", { className: `pr-2 ${buttonPlaceHolderTextColor}`, children: getFontAwesomeIcon("calendar", "regular") }), localEndDate
|
|
357
357
|
? formatDateAsMonthDayYear(localEndDate)
|
|
358
358
|
: "mm/dd/yyyy"] }))] })) : (_jsxs(_Fragment, { children: [_jsx(Dropdown, { options: dropdownOptions, selectedOption: localOperator, onOptionSelect: handleOperatorSelect, optionClasses: "px-4 h-full flex items-center ", menuClasses: "bg-white min-w-32xw rounded-md shadow-md top-12", dropdownClasses: "border-2 border-r-0 flex-[1] h-10 w-auto min-w-44 max-w-44 rounded-l", icon: dropdownIconProp, isEnabled: !hasOperator, tooltipText: tooltipText }), activeInput === "single" ? (_jsx(_Fragment, { children: _jsx(Input, { type: "text", value: dateInputValue, onChange: handleSingleDateInputChange, placeholder: "mm/dd/yyy", onKeyDown: (e) => {
|
|
359
359
|
if (e.key === "Enter") {
|
|
360
360
|
setIsDatePickerOpen(false);
|
|
361
361
|
setActiveInput(null);
|
|
362
362
|
}
|
|
363
|
-
}, firstIcon: getFontAwesomeIcon("calendar", "regular"), required: false, additionalClasses: "border-2 px-3 py-2 flex-auto h-10 text-left rounded-r min-w-52 max-w-52", hasAutoFocus: true, firstIconTop: firstIconTop, placeHolderColor: placeHolderColor }) })) : (_jsx(_Fragment, { children: _jsxs("button", { onClick: openSinglePicker, className: `${buttonPlaceHolderTextColor} border-2 px-3 py-2 flex-auto h-10 text-left rounded-r min-w-52 max-w-52 rounded-r`, children: [_jsx("span", { className:
|
|
363
|
+
}, firstIcon: _jsx("span", { className: `${buttonPlaceHolderTextColor}`, children: getFontAwesomeIcon("calendar", "regular") }), required: false, additionalClasses: "border-2 px-3 py-2 flex-auto h-10 text-left rounded-r min-w-52 max-w-52", hasAutoFocus: true, firstIconTop: firstIconTop, placeHolderColor: placeHolderColor }) })) : (_jsx(_Fragment, { children: _jsxs("button", { onClick: openSinglePicker, className: `${buttonPlaceHolderTextColor} border-2 px-3 py-2 flex-auto h-10 text-left rounded-r min-w-52 max-w-52 rounded-r`, children: [_jsx("span", { className: `pr-2 ${buttonPlaceHolderTextColor}`, children: getFontAwesomeIcon("calendar", "regular") }), localDate
|
|
364
364
|
? formatDateAsMonthDayYear(localDate)
|
|
365
365
|
: "mm/dd/yyyy"] }) }))] })) }), dayPicker, searchItems?.length ? (_jsx("div", { className: "flex flex-wrap bg-white py-2 px-2 mt-2 rounded-md", children: searchItems.map((item, index) => {
|
|
366
366
|
const cleanedText = getCleanedText(item, removePattern);
|