@wavelengthusaf/components 1.1.7 → 1.1.9
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.
- package/dist/index.d.mts +6 -4
- package/dist/index.d.ts +6 -4
- package/dist/index.js +318 -139
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +322 -143
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
|
@@ -116,22 +116,24 @@ interface SearchResult {
|
|
|
116
116
|
interface SearchProps {
|
|
117
117
|
id?: string;
|
|
118
118
|
mode: "automatic" | "manual";
|
|
119
|
+
type?: "text-box" | "search-bar";
|
|
119
120
|
borderRadius?: number | string;
|
|
120
121
|
label?: string;
|
|
121
122
|
width?: string;
|
|
122
|
-
height?: string;
|
|
123
|
+
height?: string | number;
|
|
123
124
|
children?: ReactNode;
|
|
124
125
|
borderColor?: string;
|
|
125
126
|
hoverColor?: string;
|
|
126
127
|
textColor?: string;
|
|
127
128
|
backgroundColor?: string;
|
|
128
129
|
placeholder?: string;
|
|
130
|
+
size?: "small" | "medium";
|
|
131
|
+
fontSize?: string;
|
|
129
132
|
options: SearchResult[];
|
|
130
133
|
onChange?: React__default.ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement>;
|
|
131
|
-
|
|
132
|
-
onSearchItemSelected: (selectedItem: SearchResult | string) => void;
|
|
134
|
+
onSearchItemSelected?: (selectedItem: SearchResult | string) => void;
|
|
133
135
|
}
|
|
134
|
-
declare function WavelengthSearch({ id, mode, width, height, label, borderRadius, children, placeholder,
|
|
136
|
+
declare function WavelengthSearch({ id, mode, type, width, height, label, size, borderRadius, children, placeholder, onSearchItemSelected, options, onChange, borderColor, hoverColor, textColor, fontSize, backgroundColor, }: SearchProps): React__default.JSX.Element | undefined;
|
|
135
137
|
|
|
136
138
|
declare function SearchTextField(): React__default.JSX.Element;
|
|
137
139
|
|
package/dist/index.d.ts
CHANGED
|
@@ -116,22 +116,24 @@ interface SearchResult {
|
|
|
116
116
|
interface SearchProps {
|
|
117
117
|
id?: string;
|
|
118
118
|
mode: "automatic" | "manual";
|
|
119
|
+
type?: "text-box" | "search-bar";
|
|
119
120
|
borderRadius?: number | string;
|
|
120
121
|
label?: string;
|
|
121
122
|
width?: string;
|
|
122
|
-
height?: string;
|
|
123
|
+
height?: string | number;
|
|
123
124
|
children?: ReactNode;
|
|
124
125
|
borderColor?: string;
|
|
125
126
|
hoverColor?: string;
|
|
126
127
|
textColor?: string;
|
|
127
128
|
backgroundColor?: string;
|
|
128
129
|
placeholder?: string;
|
|
130
|
+
size?: "small" | "medium";
|
|
131
|
+
fontSize?: string;
|
|
129
132
|
options: SearchResult[];
|
|
130
133
|
onChange?: React__default.ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement>;
|
|
131
|
-
|
|
132
|
-
onSearchItemSelected: (selectedItem: SearchResult | string) => void;
|
|
134
|
+
onSearchItemSelected?: (selectedItem: SearchResult | string) => void;
|
|
133
135
|
}
|
|
134
|
-
declare function WavelengthSearch({ id, mode, width, height, label, borderRadius, children, placeholder,
|
|
136
|
+
declare function WavelengthSearch({ id, mode, type, width, height, label, size, borderRadius, children, placeholder, onSearchItemSelected, options, onChange, borderColor, hoverColor, textColor, fontSize, backgroundColor, }: SearchProps): React__default.JSX.Element | undefined;
|
|
135
137
|
|
|
136
138
|
declare function SearchTextField(): React__default.JSX.Element;
|
|
137
139
|
|
package/dist/index.js
CHANGED
|
@@ -3424,181 +3424,360 @@ var import_InputAdornment = __toESM(require("@mui/material/InputAdornment"));
|
|
|
3424
3424
|
var import_IconButton = __toESM(require("@mui/material/IconButton"));
|
|
3425
3425
|
var import_react13 = require("react");
|
|
3426
3426
|
var import_ListItem = __toESM(require("@mui/material/ListItem"));
|
|
3427
|
+
var CustomPopper = (props) => {
|
|
3428
|
+
return /* @__PURE__ */ import_react12.default.createElement(
|
|
3429
|
+
import_material5.Popper,
|
|
3430
|
+
__spreadProps(__spreadValues({
|
|
3431
|
+
sx: {
|
|
3432
|
+
"&.MuiAutocomplete-popper": {
|
|
3433
|
+
zIndex: 5
|
|
3434
|
+
}
|
|
3435
|
+
}
|
|
3436
|
+
}, props), {
|
|
3437
|
+
placement: "bottom",
|
|
3438
|
+
disablePortal: true,
|
|
3439
|
+
modifiers: [
|
|
3440
|
+
{
|
|
3441
|
+
name: "flip",
|
|
3442
|
+
enabled: true,
|
|
3443
|
+
options: {
|
|
3444
|
+
altBoundary: true,
|
|
3445
|
+
rootBoundary: "document",
|
|
3446
|
+
padding: 8
|
|
3447
|
+
}
|
|
3448
|
+
},
|
|
3449
|
+
{
|
|
3450
|
+
name: "preventOverflow",
|
|
3451
|
+
enabled: true,
|
|
3452
|
+
options: {
|
|
3453
|
+
altAxis: true,
|
|
3454
|
+
altBoundary: true,
|
|
3455
|
+
tether: true,
|
|
3456
|
+
rootBoundary: "document",
|
|
3457
|
+
padding: 8
|
|
3458
|
+
}
|
|
3459
|
+
}
|
|
3460
|
+
]
|
|
3461
|
+
})
|
|
3462
|
+
);
|
|
3463
|
+
};
|
|
3427
3464
|
function WavelengthSearch({
|
|
3428
3465
|
id,
|
|
3429
3466
|
mode,
|
|
3467
|
+
type,
|
|
3430
3468
|
width: width2,
|
|
3431
3469
|
height: height2,
|
|
3432
3470
|
label,
|
|
3471
|
+
size,
|
|
3433
3472
|
borderRadius: borderRadius2,
|
|
3434
3473
|
children,
|
|
3435
3474
|
placeholder,
|
|
3436
|
-
searchFunction,
|
|
3437
3475
|
onSearchItemSelected,
|
|
3438
3476
|
options,
|
|
3439
3477
|
onChange,
|
|
3440
3478
|
borderColor: borderColor2,
|
|
3441
3479
|
hoverColor,
|
|
3442
3480
|
textColor,
|
|
3481
|
+
fontSize,
|
|
3443
3482
|
backgroundColor: backgroundColor2
|
|
3444
3483
|
}) {
|
|
3445
3484
|
const palette2 = getPalette();
|
|
3446
|
-
const template = [];
|
|
3447
3485
|
borderColor2 = borderColor2 ? borderColor2 : "#2D3140";
|
|
3448
3486
|
hoverColor = hoverColor ? hoverColor : palette2.primary;
|
|
3449
|
-
const
|
|
3450
|
-
|
|
3451
|
-
|
|
3452
|
-
|
|
3453
|
-
|
|
3454
|
-
|
|
3455
|
-
|
|
3456
|
-
|
|
3457
|
-
|
|
3458
|
-
|
|
3459
|
-
|
|
3460
|
-
|
|
3461
|
-
|
|
3462
|
-
|
|
3463
|
-
|
|
3464
|
-
|
|
3487
|
+
const onChangeHandler = () => {
|
|
3488
|
+
onChange;
|
|
3489
|
+
};
|
|
3490
|
+
if (type == "search-bar" || type == void 0) {
|
|
3491
|
+
if (mode == "automatic") {
|
|
3492
|
+
return /* @__PURE__ */ import_react12.default.createElement(import_react12.default.Fragment, null, /* @__PURE__ */ import_react12.default.createElement(
|
|
3493
|
+
import_material5.Autocomplete,
|
|
3494
|
+
{
|
|
3495
|
+
filterOptions: (x) => x,
|
|
3496
|
+
loading: true,
|
|
3497
|
+
disableListWrap: true,
|
|
3498
|
+
freeSolo: true,
|
|
3499
|
+
onChange: (e, value) => {
|
|
3500
|
+
console.log(" AutoComplete value ", value);
|
|
3501
|
+
if (value != null) {
|
|
3502
|
+
if (typeof value != "string") {
|
|
3503
|
+
if (onSearchItemSelected) onSearchItemSelected(value);
|
|
3504
|
+
}
|
|
3465
3505
|
}
|
|
3466
|
-
}
|
|
3467
|
-
|
|
3468
|
-
|
|
3469
|
-
|
|
3470
|
-
|
|
3471
|
-
|
|
3472
|
-
|
|
3473
|
-
|
|
3474
|
-
|
|
3475
|
-
|
|
3476
|
-
|
|
3477
|
-
|
|
3478
|
-
|
|
3479
|
-
|
|
3480
|
-
|
|
3481
|
-
|
|
3482
|
-
|
|
3483
|
-
|
|
3484
|
-
|
|
3485
|
-
|
|
3486
|
-
|
|
3487
|
-
|
|
3488
|
-
|
|
3489
|
-
|
|
3490
|
-
|
|
3491
|
-
|
|
3492
|
-
|
|
3493
|
-
"& label.Mui-focused": {
|
|
3494
|
-
color: `${hoverColor}`
|
|
3506
|
+
},
|
|
3507
|
+
disableCloseOnSelect: false,
|
|
3508
|
+
getOptionLabel: (options2) => {
|
|
3509
|
+
const returnVal = typeof options2 === "string" ? options2 : options2.title;
|
|
3510
|
+
return returnVal;
|
|
3511
|
+
},
|
|
3512
|
+
options,
|
|
3513
|
+
sx: { width: width2 },
|
|
3514
|
+
renderOption: (props, results) => (
|
|
3515
|
+
// @ts-expect-error boneless chicken
|
|
3516
|
+
/* @__PURE__ */ import_react12.default.createElement(import_ListItem.default, __spreadValues({ key: results.id }, props), /* @__PURE__ */ import_react12.default.createElement(import_material5.ListItemText, { primary: results.title, secondary: results.subtitle }))
|
|
3517
|
+
),
|
|
3518
|
+
renderInput: (params) => /* @__PURE__ */ import_react12.default.createElement(
|
|
3519
|
+
import_TextField.default,
|
|
3520
|
+
__spreadProps(__spreadValues({
|
|
3521
|
+
placeholder
|
|
3522
|
+
}, params), {
|
|
3523
|
+
id,
|
|
3524
|
+
size,
|
|
3525
|
+
InputProps: __spreadProps(__spreadValues({}, params.InputProps), {
|
|
3526
|
+
style: { borderRadius: borderRadius2, color: textColor, backgroundColor: backgroundColor2, height: height2, fontSize },
|
|
3527
|
+
type: "search",
|
|
3528
|
+
endAdornment: /* @__PURE__ */ import_react12.default.createElement(import_InputAdornment.default, { position: "end" }, /* @__PURE__ */ import_react12.default.createElement(import_IconButton.default, { sx: { color: textColor } }, children))
|
|
3529
|
+
}),
|
|
3530
|
+
sx: {
|
|
3531
|
+
"& .MuiInputBase-root": {
|
|
3532
|
+
height: height2
|
|
3495
3533
|
},
|
|
3496
|
-
"
|
|
3497
|
-
"&
|
|
3498
|
-
|
|
3534
|
+
"&.MuiTextField-root": {
|
|
3535
|
+
"& label": { color: `${textColor}` },
|
|
3536
|
+
"& label.Mui-focused": {
|
|
3537
|
+
color: `${hoverColor}`
|
|
3499
3538
|
},
|
|
3500
|
-
"
|
|
3501
|
-
|
|
3502
|
-
|
|
3503
|
-
|
|
3504
|
-
|
|
3539
|
+
"& .MuiOutlinedInput-root": {
|
|
3540
|
+
"& fieldset": {
|
|
3541
|
+
borderColor: `${borderColor2}`
|
|
3542
|
+
},
|
|
3543
|
+
"&:hover fieldset": {
|
|
3544
|
+
borderColor: `${hoverColor}`
|
|
3545
|
+
},
|
|
3546
|
+
"&.Mui-focused fieldset": {
|
|
3547
|
+
borderColor: `${hoverColor}`
|
|
3548
|
+
}
|
|
3505
3549
|
}
|
|
3506
3550
|
}
|
|
3551
|
+
},
|
|
3552
|
+
label,
|
|
3553
|
+
onChange
|
|
3554
|
+
})
|
|
3555
|
+
),
|
|
3556
|
+
PopperComponent: CustomPopper
|
|
3557
|
+
}
|
|
3558
|
+
));
|
|
3559
|
+
} else if (mode == "manual") {
|
|
3560
|
+
return /* @__PURE__ */ import_react12.default.createElement(import_react12.default.Fragment, null, /* @__PURE__ */ import_react12.default.createElement(
|
|
3561
|
+
import_material5.Autocomplete,
|
|
3562
|
+
{
|
|
3563
|
+
filterOptions: (x) => x,
|
|
3564
|
+
loading: true,
|
|
3565
|
+
freeSolo: true,
|
|
3566
|
+
onChange: (e, value) => {
|
|
3567
|
+
if (value != null) {
|
|
3568
|
+
if (typeof value == "string") {
|
|
3569
|
+
console.log("String Input, No Selection");
|
|
3570
|
+
} else {
|
|
3571
|
+
if (onSearchItemSelected) onSearchItemSelected(value);
|
|
3507
3572
|
}
|
|
3508
|
-
},
|
|
3509
|
-
label,
|
|
3510
|
-
onChange
|
|
3511
|
-
})
|
|
3512
|
-
)
|
|
3513
|
-
}
|
|
3514
|
-
));
|
|
3515
|
-
} else if (mode == "manual") {
|
|
3516
|
-
const textRef = (0, import_react13.useRef)();
|
|
3517
|
-
return /* @__PURE__ */ import_react12.default.createElement(import_react12.default.Fragment, null, /* @__PURE__ */ import_react12.default.createElement(
|
|
3518
|
-
import_material5.Autocomplete,
|
|
3519
|
-
{
|
|
3520
|
-
filterOptions: (x) => x,
|
|
3521
|
-
loading: true,
|
|
3522
|
-
freeSolo: true,
|
|
3523
|
-
onChange: (e, value) => {
|
|
3524
|
-
if (value != null) {
|
|
3525
|
-
if (typeof value == "string") {
|
|
3526
|
-
console.log("String Input, No Selection");
|
|
3527
|
-
} else {
|
|
3528
|
-
onSearchItemSelected(value);
|
|
3529
3573
|
}
|
|
3530
|
-
}
|
|
3531
|
-
|
|
3532
|
-
|
|
3533
|
-
|
|
3534
|
-
|
|
3535
|
-
|
|
3536
|
-
|
|
3537
|
-
|
|
3538
|
-
|
|
3539
|
-
|
|
3540
|
-
|
|
3541
|
-
|
|
3542
|
-
|
|
3543
|
-
|
|
3544
|
-
|
|
3545
|
-
|
|
3546
|
-
|
|
3547
|
-
|
|
3548
|
-
|
|
3549
|
-
|
|
3550
|
-
|
|
3551
|
-
if (textRef.current) {
|
|
3552
|
-
const tempResults = searchFunction((_a = textRef.current) == null ? void 0 : _a.value);
|
|
3553
|
-
setResults(tempResults);
|
|
3554
|
-
console.log(results);
|
|
3574
|
+
},
|
|
3575
|
+
disableCloseOnSelect: false,
|
|
3576
|
+
getOptionLabel: (options2) => {
|
|
3577
|
+
const returnVal = typeof options2 === "string" ? options2 : options2.title;
|
|
3578
|
+
return returnVal;
|
|
3579
|
+
},
|
|
3580
|
+
options,
|
|
3581
|
+
sx: { width: width2 },
|
|
3582
|
+
renderOption: (props, options2) => (
|
|
3583
|
+
// @ts-expect-error boneless chicken
|
|
3584
|
+
/* @__PURE__ */ import_react12.default.createElement(import_ListItem.default, __spreadValues({ key: options2.id }, props), /* @__PURE__ */ import_react12.default.createElement(import_material5.ListItemText, { primary: options2.title, secondary: options2.subtitle }))
|
|
3585
|
+
),
|
|
3586
|
+
renderInput: (params) => /* @__PURE__ */ import_react12.default.createElement(
|
|
3587
|
+
import_TextField.default,
|
|
3588
|
+
__spreadProps(__spreadValues({
|
|
3589
|
+
placeholder,
|
|
3590
|
+
onKeyDown: (e) => {
|
|
3591
|
+
if (e.key == "Enter") {
|
|
3592
|
+
() => {
|
|
3593
|
+
onChangeHandler;
|
|
3594
|
+
};
|
|
3555
3595
|
}
|
|
3556
3596
|
}
|
|
3557
|
-
}
|
|
3558
|
-
|
|
3559
|
-
|
|
3560
|
-
|
|
3561
|
-
|
|
3562
|
-
|
|
3563
|
-
|
|
3564
|
-
|
|
3565
|
-
|
|
3566
|
-
|
|
3567
|
-
|
|
3568
|
-
|
|
3569
|
-
if (textRef.current) {
|
|
3570
|
-
const tempResults = searchFunction((_a = textRef.current) == null ? void 0 : _a.value);
|
|
3571
|
-
setResults(tempResults);
|
|
3597
|
+
}, params), {
|
|
3598
|
+
id,
|
|
3599
|
+
size,
|
|
3600
|
+
InputProps: __spreadProps(__spreadValues({}, params.InputProps), {
|
|
3601
|
+
style: { borderRadius: borderRadius2, color: textColor, fontSize },
|
|
3602
|
+
type: "search",
|
|
3603
|
+
endAdornment: /* @__PURE__ */ import_react12.default.createElement(import_InputAdornment.default, { position: "end" }, /* @__PURE__ */ import_react12.default.createElement(
|
|
3604
|
+
import_IconButton.default,
|
|
3605
|
+
{
|
|
3606
|
+
sx: { color: textColor },
|
|
3607
|
+
onClick: () => {
|
|
3608
|
+
onChange;
|
|
3572
3609
|
}
|
|
3573
|
-
}
|
|
3574
|
-
|
|
3575
|
-
|
|
3576
|
-
)
|
|
3577
|
-
|
|
3578
|
-
|
|
3579
|
-
|
|
3580
|
-
"& label": { color: `${textColor}` },
|
|
3581
|
-
"& label.Mui-focused": {
|
|
3582
|
-
color: `${hoverColor}`
|
|
3610
|
+
},
|
|
3611
|
+
children
|
|
3612
|
+
))
|
|
3613
|
+
}),
|
|
3614
|
+
sx: {
|
|
3615
|
+
"& .MuiInputBase-root": {
|
|
3616
|
+
height: height2
|
|
3583
3617
|
},
|
|
3584
|
-
"
|
|
3585
|
-
"&
|
|
3586
|
-
|
|
3618
|
+
"&.MuiTextField-root": {
|
|
3619
|
+
"& label": { color: `${textColor}`, verticalAlign: "bottom" },
|
|
3620
|
+
"& label.Mui-focused": {
|
|
3621
|
+
color: `${hoverColor}`
|
|
3587
3622
|
},
|
|
3588
|
-
"
|
|
3589
|
-
|
|
3623
|
+
"& .MuiOutlinedInput-root": {
|
|
3624
|
+
"& fieldset": {
|
|
3625
|
+
borderColor: `${borderColor2}`
|
|
3626
|
+
},
|
|
3627
|
+
"&:hover fieldset": {
|
|
3628
|
+
borderColor: `${hoverColor}`
|
|
3629
|
+
},
|
|
3630
|
+
"&.Mui-focused fieldset": {
|
|
3631
|
+
borderColor: `${hoverColor}`
|
|
3632
|
+
}
|
|
3633
|
+
}
|
|
3634
|
+
}
|
|
3635
|
+
},
|
|
3636
|
+
label
|
|
3637
|
+
})
|
|
3638
|
+
)
|
|
3639
|
+
}
|
|
3640
|
+
));
|
|
3641
|
+
}
|
|
3642
|
+
} else if (type == "text-box") {
|
|
3643
|
+
if (mode == "automatic") {
|
|
3644
|
+
return /* @__PURE__ */ import_react12.default.createElement(import_react12.default.Fragment, null, /* @__PURE__ */ import_react12.default.createElement(
|
|
3645
|
+
import_material5.Autocomplete,
|
|
3646
|
+
{
|
|
3647
|
+
filterOptions: (x) => x,
|
|
3648
|
+
loading: true,
|
|
3649
|
+
disableListWrap: true,
|
|
3650
|
+
freeSolo: true,
|
|
3651
|
+
disableClearable: true,
|
|
3652
|
+
onChange: (e, value) => {
|
|
3653
|
+
if (value != null) {
|
|
3654
|
+
if (typeof value != "string") {
|
|
3655
|
+
if (onSearchItemSelected) onSearchItemSelected(value);
|
|
3656
|
+
}
|
|
3657
|
+
}
|
|
3658
|
+
},
|
|
3659
|
+
disableCloseOnSelect: false,
|
|
3660
|
+
getOptionLabel: (options2) => {
|
|
3661
|
+
const returnVal = typeof options2 === "string" ? options2 : options2.title;
|
|
3662
|
+
return returnVal;
|
|
3663
|
+
},
|
|
3664
|
+
options,
|
|
3665
|
+
sx: { width: width2 },
|
|
3666
|
+
renderOption: (props, results) => (
|
|
3667
|
+
// @ts-expect-error boneless chicken
|
|
3668
|
+
/* @__PURE__ */ import_react12.default.createElement(import_ListItem.default, __spreadValues({ key: results.id }, props), /* @__PURE__ */ import_react12.default.createElement(import_material5.ListItemText, { primary: results.title, secondary: results.subtitle }))
|
|
3669
|
+
),
|
|
3670
|
+
renderInput: (params) => /* @__PURE__ */ import_react12.default.createElement(
|
|
3671
|
+
import_TextField.default,
|
|
3672
|
+
__spreadProps(__spreadValues({
|
|
3673
|
+
placeholder
|
|
3674
|
+
}, params), {
|
|
3675
|
+
id,
|
|
3676
|
+
size,
|
|
3677
|
+
InputProps: __spreadProps(__spreadValues({}, params.InputProps), {
|
|
3678
|
+
style: { borderRadius: borderRadius2, color: textColor, backgroundColor: backgroundColor2, height: height2, fontSize },
|
|
3679
|
+
type: "search"
|
|
3680
|
+
}),
|
|
3681
|
+
sx: {
|
|
3682
|
+
"& .MuiInputBase-root": {
|
|
3683
|
+
height: height2
|
|
3684
|
+
},
|
|
3685
|
+
"&.MuiTextField-root": {
|
|
3686
|
+
"& label": { color: `${textColor}` },
|
|
3687
|
+
"& label.Mui-focused": {
|
|
3688
|
+
color: `${hoverColor}`
|
|
3590
3689
|
},
|
|
3591
|
-
"
|
|
3592
|
-
|
|
3690
|
+
"& .MuiOutlinedInput-root": {
|
|
3691
|
+
"& fieldset": {
|
|
3692
|
+
borderColor: `${borderColor2}`
|
|
3693
|
+
},
|
|
3694
|
+
"&:hover fieldset": {
|
|
3695
|
+
borderColor: `${hoverColor}`
|
|
3696
|
+
},
|
|
3697
|
+
"&.Mui-focused fieldset": {
|
|
3698
|
+
borderColor: `${hoverColor}`
|
|
3699
|
+
}
|
|
3593
3700
|
}
|
|
3594
3701
|
}
|
|
3702
|
+
},
|
|
3703
|
+
label,
|
|
3704
|
+
onChange
|
|
3705
|
+
})
|
|
3706
|
+
),
|
|
3707
|
+
PopperComponent: CustomPopper
|
|
3708
|
+
}
|
|
3709
|
+
));
|
|
3710
|
+
} else if (mode == "manual") {
|
|
3711
|
+
const textRef = (0, import_react13.useRef)();
|
|
3712
|
+
return /* @__PURE__ */ import_react12.default.createElement(import_react12.default.Fragment, null, /* @__PURE__ */ import_react12.default.createElement(
|
|
3713
|
+
import_material5.Autocomplete,
|
|
3714
|
+
{
|
|
3715
|
+
filterOptions: (x) => x,
|
|
3716
|
+
loading: true,
|
|
3717
|
+
freeSolo: true,
|
|
3718
|
+
onChange: (e, value) => {
|
|
3719
|
+
if (value != null) {
|
|
3720
|
+
if (typeof value != "string") {
|
|
3721
|
+
if (onSearchItemSelected) onSearchItemSelected(value);
|
|
3595
3722
|
}
|
|
3596
|
-
}
|
|
3597
|
-
|
|
3598
|
-
|
|
3599
|
-
|
|
3600
|
-
|
|
3601
|
-
|
|
3723
|
+
}
|
|
3724
|
+
},
|
|
3725
|
+
disableCloseOnSelect: false,
|
|
3726
|
+
getOptionLabel: (results) => {
|
|
3727
|
+
const returnVal = typeof results === "string" ? results : results.title;
|
|
3728
|
+
return returnVal;
|
|
3729
|
+
},
|
|
3730
|
+
options,
|
|
3731
|
+
sx: { width: width2 },
|
|
3732
|
+
renderOption: (props, options2) => (
|
|
3733
|
+
// @ts-expect-error boneless chicken
|
|
3734
|
+
/* @__PURE__ */ import_react12.default.createElement(import_ListItem.default, __spreadValues({ key: options2.id }, props), /* @__PURE__ */ import_react12.default.createElement(import_material5.ListItemText, { primary: options2.title, secondary: options2.subtitle }))
|
|
3735
|
+
),
|
|
3736
|
+
renderInput: (params) => /* @__PURE__ */ import_react12.default.createElement(
|
|
3737
|
+
import_TextField.default,
|
|
3738
|
+
__spreadProps(__spreadValues({
|
|
3739
|
+
placeholder,
|
|
3740
|
+
inputRef: textRef,
|
|
3741
|
+
onKeyDown: (e) => {
|
|
3742
|
+
if (e.key == "Enter") {
|
|
3743
|
+
onChange;
|
|
3744
|
+
}
|
|
3745
|
+
}
|
|
3746
|
+
}, params), {
|
|
3747
|
+
id,
|
|
3748
|
+
size,
|
|
3749
|
+
InputProps: __spreadProps(__spreadValues({}, params.InputProps), {
|
|
3750
|
+
style: { borderRadius: borderRadius2, color: textColor, fontSize },
|
|
3751
|
+
type: "search"
|
|
3752
|
+
}),
|
|
3753
|
+
sx: {
|
|
3754
|
+
"& .MuiInputBase-root": {
|
|
3755
|
+
height: height2
|
|
3756
|
+
},
|
|
3757
|
+
"&.MuiTextField-root": {
|
|
3758
|
+
"& label": { color: `${textColor}`, verticalAlign: "bottom" },
|
|
3759
|
+
"& label.Mui-focused": {
|
|
3760
|
+
color: `${hoverColor}`
|
|
3761
|
+
},
|
|
3762
|
+
"& .MuiOutlinedInput-root": {
|
|
3763
|
+
"& fieldset": {
|
|
3764
|
+
borderColor: `${borderColor2}`
|
|
3765
|
+
},
|
|
3766
|
+
"&:hover fieldset": {
|
|
3767
|
+
borderColor: `${hoverColor}`
|
|
3768
|
+
},
|
|
3769
|
+
"&.Mui-focused fieldset": {
|
|
3770
|
+
borderColor: `${hoverColor}`
|
|
3771
|
+
}
|
|
3772
|
+
}
|
|
3773
|
+
}
|
|
3774
|
+
},
|
|
3775
|
+
label
|
|
3776
|
+
})
|
|
3777
|
+
)
|
|
3778
|
+
}
|
|
3779
|
+
));
|
|
3780
|
+
}
|
|
3602
3781
|
}
|
|
3603
3782
|
return void 0;
|
|
3604
3783
|
}
|