@megha-ui/react 1.2.229 → 1.2.231

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.
Files changed (2) hide show
  1. package/dist/components/dropdown/index.js +11 -8
  2. package/package.json +1 -1
package/dist/components/dropdown/index.js CHANGED
@@ -337,7 +337,7 @@ const Dropdown = ({ options, selectedValues, onChange, placeholder = "Select..."
337
337
  }, children: [isClear && (displayValue || selectedDisplay) && (_jsx("div", { style: { marginRight: "0.5rem" }, onClick: handleClear, id: clearId, title: "Click to clear the value", children: ClearIcon ? (ClearIcon) : (_jsx("span", { style: {
338
338
  color: "var(--form-border-color, #dbdfe9)",
339
339
  fontSize: "1rem",
340
- }, children: "X" })) })), disabled ? (Tooltip && Tooltip) : DropDownIcon ? (DropDownIcon) : (_jsx(HiChevronDown, { fontSize: "1rem" })), withTooltip && Tooltip && Tooltip] })] }), _jsxs("ul", { style: Object.assign(Object.assign({ width: dropdownListWidth || "100%", position: "absolute", backgroundColor: dropdownListBG || "var(--dropdown-bg)", boxShadow: "0 4px 6px rgba(0, 0, 0, 0.1)", border: "1px solid var(--divider, #f5f5f5)", zIndex: 10, marginTop: 4, borderRadius: 4, overflow: "hidden" }, clickStyle), { display: !isOpen ? "none" : "" }), children: [searchEnabled && (_jsx("li", { style: { padding: "0.5rem" }, children: _jsx("input", { ref: searchInputRef, type: "text", placeholder: "Search...", value: searchTerm, onChange: (e) => setSearchTerm(e.target.value), disabled: disabled, style: {
340
+ }, children: "X" })) })), disabled ? (Tooltip && Tooltip) : DropDownIcon ? (DropDownIcon) : (_jsx(HiChevronDown, { fontSize: "1rem" })), withTooltip && Tooltip && Tooltip] })] }), _jsxs("ul", { style: Object.assign(Object.assign({ width: dropdownListWidth || "100%", position: "absolute", backgroundColor: dropdownListBG || "var(--dropdown-bg)", boxShadow: "0 4px 0.75rem rgba(0, 0, 0, 0.1)", border: "1px solid var(--divider, #f5f5f5)", zIndex: 10, marginTop: 4, borderRadius: 4, overflow: "hidden" }, clickStyle), { display: !isOpen ? "none" : "" }), children: [searchEnabled && (_jsx("li", { style: { padding: "0.5rem" }, children: _jsx("input", { ref: searchInputRef, type: "text", placeholder: "Search...", value: searchTerm, onChange: (e) => setSearchTerm(e.target.value), disabled: disabled, style: {
341
341
  width: "100%",
342
342
  padding: "0.5rem",
343
343
  boxSizing: "border-box",
@@ -360,13 +360,16 @@ const Dropdown = ({ options, selectedValues, onChange, placeholder = "Select..."
360
360
  display: "flex",
361
361
  alignItems: "start",
362
362
  width: "100%",
363
- }, children: _jsxs("span", { style: { marginLeft: "0.5rem" }, children: ["+ Create ", searchTerm] }) })] }, String(searchTerm))) : groupedOptions.length > 0 ? (groupedOptions.map((groupOption, gIndex) => (_jsxs("div", { children: [_jsx("div", { children: groupOption.groupedValue }), groupOption.options.map((option, index) => {
363
+ }, children: _jsxs("span", { style: { marginLeft: "0.5rem" }, children: ["+ Create ", searchTerm] }) })] }, String(searchTerm))) : groupedOptions.length > 0 ? (groupedOptions.map((groupOption, gIndex) => (_jsxs("div", { children: [_jsx("div", { style: {
364
+ paddingLeft: "1rem",
365
+ borderBottom: "1px solid var(--divider-strong, #dddddd)",
366
+ }, children: groupOption.groupedValue }), groupOption.options.map((option, index) => {
364
367
  let prevOptions = groupedOptions.filter((item, index) => index < gIndex);
365
- prevOptions = [...prevOptions.map((item) => item.options)];
368
+ prevOptions = [
369
+ ...prevOptions.map((item) => item.options),
370
+ ];
366
371
  prevOptions = prevOptions.flatMap((item) => item);
367
- const refIndex = gIndex > 0
368
- ? prevOptions.length + index
369
- : index;
372
+ const refIndex = gIndex > 0 ? prevOptions.length + index : index;
370
373
  return (_jsxs("li", { ref: (el) => {
371
374
  optionRefs.current[refIndex] = el;
372
375
  }, id: `${refIndex}`, onClick: (e) => onSelectChange
@@ -377,9 +380,9 @@ const Dropdown = ({ options, selectedValues, onChange, placeholder = "Select..."
377
380
  !isMultiple &&
378
381
  intermediateValues.includes(option.value)
379
382
  ? selectedItemStyle
380
- : {})), { borderBottom: refIndex === filteredOptions.length - 1
383
+ : {})), { borderBottom: refIndex === optionRefs.current.length - 1
381
384
  ? "none"
382
- : "1px solid var(--divider-strong, #dddddd)", wordWrap: "break-word", textWrap: "wrap", justifyContent: "space-between" }), onMouseEnter: (e) => {
385
+ : "1px solid var(--divider-strong, #dddddd)", wordWrap: "break-word", textWrap: "wrap", justifyContent: "space-between", padding: "0.75rem 1rem 0.75rem 1.5rem" }), onMouseEnter: (e) => {
383
386
  if (!option.disabled) {
384
387
  setHighlightIndex(index);
385
388
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@megha-ui/react",
3
- "version": "1.2.229",
3
+ "version": "1.2.231",
4
4
  "description": "A collection of reusable UI components for React applications, built with TypeScript.",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.js",