@wavelengthusaf/components 1.2.0 → 1.2.2
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 +3 -2
- package/dist/index.d.ts +3 -2
- package/dist/index.js +160 -6
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +160 -6
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
|
@@ -117,6 +117,7 @@ interface SearchProps {
|
|
|
117
117
|
id?: string;
|
|
118
118
|
mode: "automatic" | "manual";
|
|
119
119
|
type?: "text-box" | "search-bar";
|
|
120
|
+
iconPos?: "start" | "end";
|
|
120
121
|
borderRadius?: number | string;
|
|
121
122
|
label?: string;
|
|
122
123
|
width?: string;
|
|
@@ -134,7 +135,7 @@ interface SearchProps {
|
|
|
134
135
|
onChange?: React__default.ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement>;
|
|
135
136
|
onSearchItemSelected?: (selectedItem: SearchResult | string) => void;
|
|
136
137
|
}
|
|
137
|
-
declare function WavelengthSearch({ id, mode, type, width, height, label, size, borderRadius, children, placeholder, onEnter, onSearchItemSelected, options, onChange, borderColor, hoverColor, textColor, fontSize, backgroundColor, }: SearchProps): React__default.JSX.Element | undefined;
|
|
138
|
+
declare function WavelengthSearch({ id, mode, type, width, height, label, size, borderRadius, children, placeholder, onEnter, onSearchItemSelected, options, onChange, borderColor, hoverColor, textColor, fontSize, backgroundColor, iconPos, }: SearchProps): React__default.JSX.Element | undefined;
|
|
138
139
|
|
|
139
140
|
declare function SearchTextField(): React__default.JSX.Element;
|
|
140
141
|
|
|
@@ -320,6 +321,6 @@ interface StandardSnackbarProps {
|
|
|
320
321
|
message?: string | ReactNode;
|
|
321
322
|
customVertyAlign?: string;
|
|
322
323
|
}
|
|
323
|
-
declare
|
|
324
|
+
declare const WavelengthStandardSnackbar: (props: StandardSnackbarProps) => React__default.JSX.Element;
|
|
324
325
|
|
|
325
326
|
export { AceOfSpadesComponent, AppLogo, ArrowIcon, BomberBeeIcon, ButtonIcon, ButtonMenu, DefaultIcon, ManyPlanesComponent, NotAvailablePage, Old563EWSLogo, PortalIcon, RapidrefIcon, type SearchResult, SearchTextField, SquadronIcon, SwarmIcon, type ThemeProperties, WavelengthAppTheme, WavelengthAutocomplete, WavelengthBannerHeader, WavelengthBox, WavelengthButton, WavelengthConfirmationModal, WavelengthContentModal, WavelengthContentPlaceholder, WavelengthDropdownButton, WavelengthExampleComponent, WavelengthFooter, WavelengthIcon, WavelengthPlaneTrail, WavelengthPopUpMenu, WavelengthSearch, WavelengthSideBar, WavelengthSnackbar, WavelengthStandardSnackbar, WavelengthTitleBar, add, concat, findBestStringMatch, type menuItemProps, useThemeContext };
|
package/dist/index.d.ts
CHANGED
|
@@ -117,6 +117,7 @@ interface SearchProps {
|
|
|
117
117
|
id?: string;
|
|
118
118
|
mode: "automatic" | "manual";
|
|
119
119
|
type?: "text-box" | "search-bar";
|
|
120
|
+
iconPos?: "start" | "end";
|
|
120
121
|
borderRadius?: number | string;
|
|
121
122
|
label?: string;
|
|
122
123
|
width?: string;
|
|
@@ -134,7 +135,7 @@ interface SearchProps {
|
|
|
134
135
|
onChange?: React__default.ChangeEventHandler<HTMLInputElement | HTMLTextAreaElement>;
|
|
135
136
|
onSearchItemSelected?: (selectedItem: SearchResult | string) => void;
|
|
136
137
|
}
|
|
137
|
-
declare function WavelengthSearch({ id, mode, type, width, height, label, size, borderRadius, children, placeholder, onEnter, onSearchItemSelected, options, onChange, borderColor, hoverColor, textColor, fontSize, backgroundColor, }: SearchProps): React__default.JSX.Element | undefined;
|
|
138
|
+
declare function WavelengthSearch({ id, mode, type, width, height, label, size, borderRadius, children, placeholder, onEnter, onSearchItemSelected, options, onChange, borderColor, hoverColor, textColor, fontSize, backgroundColor, iconPos, }: SearchProps): React__default.JSX.Element | undefined;
|
|
138
139
|
|
|
139
140
|
declare function SearchTextField(): React__default.JSX.Element;
|
|
140
141
|
|
|
@@ -320,6 +321,6 @@ interface StandardSnackbarProps {
|
|
|
320
321
|
message?: string | ReactNode;
|
|
321
322
|
customVertyAlign?: string;
|
|
322
323
|
}
|
|
323
|
-
declare
|
|
324
|
+
declare const WavelengthStandardSnackbar: (props: StandardSnackbarProps) => React__default.JSX.Element;
|
|
324
325
|
|
|
325
326
|
export { AceOfSpadesComponent, AppLogo, ArrowIcon, BomberBeeIcon, ButtonIcon, ButtonMenu, DefaultIcon, ManyPlanesComponent, NotAvailablePage, Old563EWSLogo, PortalIcon, RapidrefIcon, type SearchResult, SearchTextField, SquadronIcon, SwarmIcon, type ThemeProperties, WavelengthAppTheme, WavelengthAutocomplete, WavelengthBannerHeader, WavelengthBox, WavelengthButton, WavelengthConfirmationModal, WavelengthContentModal, WavelengthContentPlaceholder, WavelengthDropdownButton, WavelengthExampleComponent, WavelengthFooter, WavelengthIcon, WavelengthPlaneTrail, WavelengthPopUpMenu, WavelengthSearch, WavelengthSideBar, WavelengthSnackbar, WavelengthStandardSnackbar, WavelengthTitleBar, add, concat, findBestStringMatch, type menuItemProps, useThemeContext };
|
package/dist/index.js
CHANGED
|
@@ -3480,13 +3480,14 @@ function WavelengthSearch({
|
|
|
3480
3480
|
hoverColor,
|
|
3481
3481
|
textColor,
|
|
3482
3482
|
fontSize,
|
|
3483
|
-
backgroundColor: backgroundColor2
|
|
3483
|
+
backgroundColor: backgroundColor2,
|
|
3484
|
+
iconPos = "end"
|
|
3484
3485
|
}) {
|
|
3485
3486
|
const palette2 = getPalette();
|
|
3486
3487
|
borderColor2 = borderColor2 ? borderColor2 : "#2D3140";
|
|
3487
3488
|
hoverColor = hoverColor ? hoverColor : palette2.primary;
|
|
3488
3489
|
if (type == "search-bar" || type == void 0) {
|
|
3489
|
-
if (mode == "automatic") {
|
|
3490
|
+
if (mode == "automatic" && iconPos == "end") {
|
|
3490
3491
|
return /* @__PURE__ */ import_react12.default.createElement(import_react12.default.Fragment, null, /* @__PURE__ */ import_react12.default.createElement(
|
|
3491
3492
|
import_material5.Autocomplete,
|
|
3492
3493
|
{
|
|
@@ -3553,7 +3554,74 @@ function WavelengthSearch({
|
|
|
3553
3554
|
PopperComponent: CustomPopper
|
|
3554
3555
|
}
|
|
3555
3556
|
));
|
|
3556
|
-
} else if (mode == "
|
|
3557
|
+
} else if (mode == "automatic" && iconPos == "start") {
|
|
3558
|
+
return /* @__PURE__ */ import_react12.default.createElement(import_react12.default.Fragment, null, /* @__PURE__ */ import_react12.default.createElement(
|
|
3559
|
+
import_material5.Autocomplete,
|
|
3560
|
+
{
|
|
3561
|
+
filterOptions: (x) => x,
|
|
3562
|
+
loading: true,
|
|
3563
|
+
disableListWrap: true,
|
|
3564
|
+
freeSolo: true,
|
|
3565
|
+
onChange: (e, value) => {
|
|
3566
|
+
if (value != null) {
|
|
3567
|
+
if (typeof value != "string") {
|
|
3568
|
+
if (onSearchItemSelected) onSearchItemSelected(value);
|
|
3569
|
+
}
|
|
3570
|
+
}
|
|
3571
|
+
},
|
|
3572
|
+
disableCloseOnSelect: false,
|
|
3573
|
+
getOptionLabel: (options2) => {
|
|
3574
|
+
const returnVal = typeof options2 === "string" ? options2 : options2.title;
|
|
3575
|
+
return returnVal;
|
|
3576
|
+
},
|
|
3577
|
+
options,
|
|
3578
|
+
sx: { width: width2 },
|
|
3579
|
+
renderOption: (props, results) => (
|
|
3580
|
+
// @ts-expect-error boneless chicken
|
|
3581
|
+
/* @__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 }))
|
|
3582
|
+
),
|
|
3583
|
+
renderInput: (params) => /* @__PURE__ */ import_react12.default.createElement(
|
|
3584
|
+
import_TextField.default,
|
|
3585
|
+
__spreadProps(__spreadValues({
|
|
3586
|
+
placeholder
|
|
3587
|
+
}, params), {
|
|
3588
|
+
id,
|
|
3589
|
+
size,
|
|
3590
|
+
InputProps: __spreadProps(__spreadValues({}, params.InputProps), {
|
|
3591
|
+
style: { borderRadius: borderRadius2, color: textColor, backgroundColor: backgroundColor2, height: height2, fontSize },
|
|
3592
|
+
type: "search",
|
|
3593
|
+
startAdornment: /* @__PURE__ */ import_react12.default.createElement(import_InputAdornment.default, { position: "start" }, /* @__PURE__ */ import_react12.default.createElement(import_IconButton.default, { sx: { color: textColor, paddingRight: "0px" } }, children))
|
|
3594
|
+
}),
|
|
3595
|
+
sx: {
|
|
3596
|
+
"& .MuiInputBase-root": {
|
|
3597
|
+
height: height2
|
|
3598
|
+
},
|
|
3599
|
+
"&.MuiTextField-root": {
|
|
3600
|
+
"& label": { color: `${textColor}` },
|
|
3601
|
+
"& label.Mui-focused": {
|
|
3602
|
+
color: `${hoverColor}`
|
|
3603
|
+
},
|
|
3604
|
+
"& .MuiOutlinedInput-root": {
|
|
3605
|
+
"& fieldset": {
|
|
3606
|
+
borderColor: `${borderColor2}`
|
|
3607
|
+
},
|
|
3608
|
+
"&:hover fieldset": {
|
|
3609
|
+
borderColor: `${hoverColor}`
|
|
3610
|
+
},
|
|
3611
|
+
"&.Mui-focused fieldset": {
|
|
3612
|
+
borderColor: `${hoverColor}`
|
|
3613
|
+
}
|
|
3614
|
+
}
|
|
3615
|
+
}
|
|
3616
|
+
},
|
|
3617
|
+
label,
|
|
3618
|
+
onChange
|
|
3619
|
+
})
|
|
3620
|
+
),
|
|
3621
|
+
PopperComponent: CustomPopper
|
|
3622
|
+
}
|
|
3623
|
+
));
|
|
3624
|
+
} else if (mode == "manual" && iconPos == "end") {
|
|
3557
3625
|
const textRef = (0, import_react13.useRef)();
|
|
3558
3626
|
return /* @__PURE__ */ import_react12.default.createElement(import_react12.default.Fragment, null, /* @__PURE__ */ import_react12.default.createElement(
|
|
3559
3627
|
import_material5.Autocomplete,
|
|
@@ -3637,6 +3705,90 @@ function WavelengthSearch({
|
|
|
3637
3705
|
)
|
|
3638
3706
|
}
|
|
3639
3707
|
));
|
|
3708
|
+
} else if (mode == "manual" && iconPos == "start") {
|
|
3709
|
+
const textRef = (0, import_react13.useRef)();
|
|
3710
|
+
return /* @__PURE__ */ import_react12.default.createElement(import_react12.default.Fragment, null, /* @__PURE__ */ import_react12.default.createElement(
|
|
3711
|
+
import_material5.Autocomplete,
|
|
3712
|
+
{
|
|
3713
|
+
filterOptions: (x) => x,
|
|
3714
|
+
loading: true,
|
|
3715
|
+
freeSolo: true,
|
|
3716
|
+
onChange: (e, value) => {
|
|
3717
|
+
if (value != null) {
|
|
3718
|
+
if (typeof value !== "string") {
|
|
3719
|
+
if (onSearchItemSelected) onSearchItemSelected(value);
|
|
3720
|
+
}
|
|
3721
|
+
}
|
|
3722
|
+
},
|
|
3723
|
+
disableCloseOnSelect: false,
|
|
3724
|
+
getOptionLabel: (options2) => {
|
|
3725
|
+
const returnVal = typeof options2 === "string" ? options2 : options2.title;
|
|
3726
|
+
return returnVal;
|
|
3727
|
+
},
|
|
3728
|
+
options,
|
|
3729
|
+
sx: { width: width2 },
|
|
3730
|
+
renderOption: (props, options2) => (
|
|
3731
|
+
// @ts-expect-error boneless chicken
|
|
3732
|
+
/* @__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 }))
|
|
3733
|
+
),
|
|
3734
|
+
renderInput: (params) => /* @__PURE__ */ import_react12.default.createElement(
|
|
3735
|
+
import_TextField.default,
|
|
3736
|
+
__spreadProps(__spreadValues({
|
|
3737
|
+
inputRef: textRef,
|
|
3738
|
+
placeholder,
|
|
3739
|
+
onKeyDown: (e) => {
|
|
3740
|
+
if (e.key == "Enter") {
|
|
3741
|
+
if (textRef.current && onEnter) {
|
|
3742
|
+
onEnter(textRef.current.value);
|
|
3743
|
+
}
|
|
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
|
+
startAdornment: /* @__PURE__ */ import_react12.default.createElement(import_InputAdornment.default, { position: "start" }, /* @__PURE__ */ import_react12.default.createElement(
|
|
3753
|
+
import_IconButton.default,
|
|
3754
|
+
{
|
|
3755
|
+
sx: { color: textColor, paddingRight: "0px" },
|
|
3756
|
+
onClick: () => {
|
|
3757
|
+
if (textRef.current && onEnter) {
|
|
3758
|
+
onEnter(textRef.current.value);
|
|
3759
|
+
}
|
|
3760
|
+
}
|
|
3761
|
+
},
|
|
3762
|
+
children
|
|
3763
|
+
))
|
|
3764
|
+
}),
|
|
3765
|
+
sx: {
|
|
3766
|
+
"& .MuiInputBase-root": {
|
|
3767
|
+
height: height2
|
|
3768
|
+
},
|
|
3769
|
+
"&.MuiTextField-root": {
|
|
3770
|
+
"& label": { color: `${textColor}`, verticalAlign: "bottom" },
|
|
3771
|
+
"& label.Mui-focused": {
|
|
3772
|
+
color: `${hoverColor}`
|
|
3773
|
+
},
|
|
3774
|
+
"& .MuiOutlinedInput-root": {
|
|
3775
|
+
"& fieldset": {
|
|
3776
|
+
borderColor: `${borderColor2}`
|
|
3777
|
+
},
|
|
3778
|
+
"&:hover fieldset": {
|
|
3779
|
+
borderColor: `${hoverColor}`
|
|
3780
|
+
},
|
|
3781
|
+
"&.Mui-focused fieldset": {
|
|
3782
|
+
borderColor: `${hoverColor}`
|
|
3783
|
+
}
|
|
3784
|
+
}
|
|
3785
|
+
}
|
|
3786
|
+
},
|
|
3787
|
+
label
|
|
3788
|
+
})
|
|
3789
|
+
)
|
|
3790
|
+
}
|
|
3791
|
+
));
|
|
3640
3792
|
}
|
|
3641
3793
|
} else if (type == "text-box") {
|
|
3642
3794
|
if (mode == "automatic") {
|
|
@@ -4884,8 +5036,10 @@ var import_Snackbar = __toESM(require("@mui/material/Snackbar"));
|
|
|
4884
5036
|
var import_IconButton2 = __toESM(require("@mui/material/IconButton"));
|
|
4885
5037
|
var import_Close3 = __toESM(require("@mui/icons-material/Close"));
|
|
4886
5038
|
var import_SnackbarContent = __toESM(require("@mui/material/SnackbarContent"));
|
|
4887
|
-
|
|
4888
|
-
|
|
5039
|
+
var WavelengthStandardSnackbar = (props) => {
|
|
5040
|
+
console.log(props.show);
|
|
5041
|
+
const show = props.show;
|
|
5042
|
+
const setShow = props.setShow;
|
|
4889
5043
|
const handleClose = () => {
|
|
4890
5044
|
setShow(false);
|
|
4891
5045
|
};
|
|
@@ -4935,7 +5089,7 @@ function WavelengthStandardSnackbar(props) {
|
|
|
4935
5089
|
}
|
|
4936
5090
|
)
|
|
4937
5091
|
);
|
|
4938
|
-
}
|
|
5092
|
+
};
|
|
4939
5093
|
// Annotate the CommonJS export names for ESM import in node:
|
|
4940
5094
|
0 && (module.exports = {
|
|
4941
5095
|
AceOfSpadesComponent,
|