@carto/meridian-ds 1.5.0-alpha-virtual-autocomplete.2 → 1.5.0-alpha-virtual-autocomplete.4
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/{MenuItem-D6wJym7Z.js → MenuItem-C1DvWMry.js} +1 -1
- package/dist/{MenuItem-lAxlHrDp.cjs → MenuItem-C4bG5WHw.cjs} +1 -1
- package/dist/components/index.cjs +163 -33
- package/dist/components/index.js +165 -35
- package/dist/theme/index.cjs +1 -1
- package/dist/theme/index.js +1 -1
- package/dist/types/components/molecules/Autocomplete/Autocomplete.d.ts.map +1 -1
- package/dist/types/components/molecules/Autocomplete/AutocompleteList.d.ts +13 -0
- package/dist/types/components/molecules/Autocomplete/AutocompleteList.d.ts.map +1 -0
- package/dist/types/components/molecules/Autocomplete/CreatableAutocomplete.d.ts +1 -1
- package/dist/types/components/molecules/Autocomplete/CreatableAutocomplete.d.ts.map +1 -1
- package/dist/types/components/molecules/Autocomplete/MultipleAutocomplete.d.ts +1 -1
- package/dist/types/components/molecules/Autocomplete/MultipleAutocomplete.d.ts.map +1 -1
- package/dist/types/components/molecules/Autocomplete/index.d.ts +3 -1
- package/dist/types/components/molecules/Autocomplete/index.d.ts.map +1 -1
- package/dist/types/components/molecules/Autocomplete/types.d.ts +39 -0
- package/dist/types/components/molecules/Autocomplete/types.d.ts.map +1 -1
- package/dist/types/components/molecules/Autocomplete/useAutocomplete.d.ts +11 -0
- package/dist/types/components/molecules/Autocomplete/useAutocomplete.d.ts.map +1 -0
- package/dist/types/components/molecules/Autocomplete/useAutocompleteRenderOption.d.ts +6 -1
- package/dist/types/components/molecules/Autocomplete/useAutocompleteRenderOption.d.ts.map +1 -1
- package/dist/types/components/molecules/Autocomplete/utils.d.ts +15 -0
- package/dist/types/components/molecules/Autocomplete/utils.d.ts.map +1 -1
- package/package.json +1 -1
- package/dist/types/components/molecules/Autocomplete/ListBoxWithFilter.d.ts +0 -35
- package/dist/types/components/molecules/Autocomplete/ListBoxWithFilter.d.ts.map +0 -1
|
@@ -21,7 +21,7 @@ const StyledMenuItem = styled(MenuItem$1, {
|
|
|
21
21
|
columnGap: 0,
|
|
22
22
|
...theme.typography.caption,
|
|
23
23
|
fontWeight: 500,
|
|
24
|
-
color: theme.palette.text.secondary
|
|
24
|
+
color: `${theme.palette.text.secondary} !important`,
|
|
25
25
|
".MuiListItemText-root .MuiTypography-root": {
|
|
26
26
|
...theme.typography.caption,
|
|
27
27
|
fontWeight: 500,
|
|
@@ -22,7 +22,7 @@ const StyledMenuItem = material.styled(material.MenuItem, {
|
|
|
22
22
|
columnGap: 0,
|
|
23
23
|
...theme.typography.caption,
|
|
24
24
|
fontWeight: 500,
|
|
25
|
-
color: theme.palette.text.secondary
|
|
25
|
+
color: `${theme.palette.text.secondary} !important`,
|
|
26
26
|
".MuiListItemText-root .MuiTypography-root": {
|
|
27
27
|
...theme.typography.caption,
|
|
28
28
|
fontWeight: 500,
|
|
@@ -10,7 +10,7 @@ const reactIntl = require("react-intl");
|
|
|
10
10
|
const iconsMaterial = require("@mui/icons-material");
|
|
11
11
|
const Alert$1 = require("../Alert-BzEgeyQJ.cjs");
|
|
12
12
|
require("cartocolor");
|
|
13
|
-
const MenuItem = require("../MenuItem-
|
|
13
|
+
const MenuItem = require("../MenuItem-C4bG5WHw.cjs");
|
|
14
14
|
const reactWindow = require("react-window");
|
|
15
15
|
const DatePicker$1 = require("@mui/x-date-pickers/DatePicker");
|
|
16
16
|
const xDatePickers = require("@mui/x-date-pickers");
|
|
@@ -1118,27 +1118,6 @@ function UploadField({
|
|
|
1118
1118
|
)
|
|
1119
1119
|
] });
|
|
1120
1120
|
}
|
|
1121
|
-
function _Autocomplete({
|
|
1122
|
-
disabled,
|
|
1123
|
-
loading,
|
|
1124
|
-
...props
|
|
1125
|
-
}, ref) {
|
|
1126
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
1127
|
-
material.Autocomplete,
|
|
1128
|
-
{
|
|
1129
|
-
...props,
|
|
1130
|
-
ref,
|
|
1131
|
-
disabled: disabled || loading,
|
|
1132
|
-
popupIcon: loading ? /* @__PURE__ */ jsxRuntime.jsx(material.CircularProgress, { size: 18, color: "inherit" }) : /* @__PURE__ */ jsxRuntime.jsx(ArrowDown.ArrowDown, {}),
|
|
1133
|
-
"data-name": "autocomplete",
|
|
1134
|
-
ListboxProps: {
|
|
1135
|
-
"aria-multiselectable": false,
|
|
1136
|
-
...props.ListboxProps
|
|
1137
|
-
}
|
|
1138
|
-
}
|
|
1139
|
-
);
|
|
1140
|
-
}
|
|
1141
|
-
const Autocomplete = React.forwardRef(_Autocomplete);
|
|
1142
1121
|
const getDefaultOptionLabel = (option) => {
|
|
1143
1122
|
return option && typeof option === "object" ? option.title ?? String(option) : String(option);
|
|
1144
1123
|
};
|
|
@@ -1194,8 +1173,85 @@ function createCounterFormatter(counterText, allText, showSingleItemText = true)
|
|
|
1194
1173
|
}
|
|
1195
1174
|
};
|
|
1196
1175
|
}
|
|
1176
|
+
function createAutocompleteGroupByList(options, groupBy) {
|
|
1177
|
+
const grouped = options.reduce(
|
|
1178
|
+
(acc, option) => {
|
|
1179
|
+
const group = groupBy(option);
|
|
1180
|
+
if (!acc[group]) {
|
|
1181
|
+
acc[group] = [];
|
|
1182
|
+
}
|
|
1183
|
+
acc[group].push(option);
|
|
1184
|
+
return acc;
|
|
1185
|
+
},
|
|
1186
|
+
{}
|
|
1187
|
+
);
|
|
1188
|
+
const result = [];
|
|
1189
|
+
Object.keys(grouped).forEach((title) => {
|
|
1190
|
+
result.push({ __isGroupHeader: true, title });
|
|
1191
|
+
const groupOptions = grouped[title];
|
|
1192
|
+
if (groupOptions) {
|
|
1193
|
+
result.push(...groupOptions);
|
|
1194
|
+
}
|
|
1195
|
+
});
|
|
1196
|
+
return result;
|
|
1197
|
+
}
|
|
1198
|
+
function warnDeprecatedGroupBy(componentName) {
|
|
1199
|
+
if (process.env.NODE_ENV !== "production") {
|
|
1200
|
+
console.warn(
|
|
1201
|
+
`${componentName}: The \`groupBy\` prop is deprecated and breaks virtualization. Use \`createAutocompleteGroupByList\` instead:
|
|
1202
|
+
|
|
1203
|
+
\`\`\`
|
|
1204
|
+
import { createAutocompleteGroupByList, ${componentName} } from "@carto/meridian-ds/components"
|
|
1205
|
+
|
|
1206
|
+
const groupedOptions = createAutocompleteGroupByList(options, (option) => option.category)
|
|
1207
|
+
|
|
1208
|
+
<${componentName} options={groupedOptions} />
|
|
1209
|
+
\`\`\`
|
|
1210
|
+
`
|
|
1211
|
+
);
|
|
1212
|
+
}
|
|
1213
|
+
}
|
|
1214
|
+
function _Autocomplete({
|
|
1215
|
+
disabled,
|
|
1216
|
+
loading,
|
|
1217
|
+
...props
|
|
1218
|
+
}, ref) {
|
|
1219
|
+
if (props.groupBy) {
|
|
1220
|
+
warnDeprecatedGroupBy("Autocomplete");
|
|
1221
|
+
}
|
|
1222
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
1223
|
+
material.Autocomplete,
|
|
1224
|
+
{
|
|
1225
|
+
...props,
|
|
1226
|
+
ref,
|
|
1227
|
+
disabled: disabled || loading,
|
|
1228
|
+
popupIcon: loading ? /* @__PURE__ */ jsxRuntime.jsx(material.CircularProgress, { size: 18, color: "inherit" }) : /* @__PURE__ */ jsxRuntime.jsx(ArrowDown.ArrowDown, {}),
|
|
1229
|
+
"data-name": "autocomplete",
|
|
1230
|
+
ListboxProps: {
|
|
1231
|
+
"aria-multiselectable": false,
|
|
1232
|
+
...props.ListboxProps
|
|
1233
|
+
}
|
|
1234
|
+
}
|
|
1235
|
+
);
|
|
1236
|
+
}
|
|
1237
|
+
const Autocomplete = React.forwardRef(_Autocomplete);
|
|
1197
1238
|
function useAutocompleteRenderOption() {
|
|
1198
1239
|
const renderOption = (props, option, state, getOptionLabel, customIcon) => {
|
|
1240
|
+
const { key, ...otherProps } = props;
|
|
1241
|
+
if (typeof option === "object" && option !== null && "__isGroupHeader" in option) {
|
|
1242
|
+
return /* @__PURE__ */ React.createElement(
|
|
1243
|
+
MenuItem.MenuItem,
|
|
1244
|
+
{
|
|
1245
|
+
...otherProps,
|
|
1246
|
+
subtitle: true,
|
|
1247
|
+
key,
|
|
1248
|
+
"aria-disabled": true,
|
|
1249
|
+
"aria-selected": false
|
|
1250
|
+
},
|
|
1251
|
+
option.title
|
|
1252
|
+
);
|
|
1253
|
+
}
|
|
1254
|
+
const regularOption = option;
|
|
1199
1255
|
const {
|
|
1200
1256
|
title,
|
|
1201
1257
|
inputValue,
|
|
@@ -1212,9 +1268,8 @@ function useAutocompleteRenderOption() {
|
|
|
1212
1268
|
alternativeTitle,
|
|
1213
1269
|
secondaryText,
|
|
1214
1270
|
multiple
|
|
1215
|
-
} =
|
|
1216
|
-
const
|
|
1217
|
-
const isPrimitiveOptionType = typeof option === "string" || typeof option === "number";
|
|
1271
|
+
} = regularOption;
|
|
1272
|
+
const isPrimitiveOptionType = typeof regularOption === "string" || typeof regularOption === "number";
|
|
1218
1273
|
const getOptionLabelText = (getOptionLabel2, option2, alternativeTitle2, title2) => {
|
|
1219
1274
|
if (alternativeTitle2) return alternativeTitle2;
|
|
1220
1275
|
if (title2) return title2;
|
|
@@ -1248,7 +1303,7 @@ function useAutocompleteRenderOption() {
|
|
|
1248
1303
|
/* @__PURE__ */ jsxRuntime.jsxs(material.ListItemText, { children: [
|
|
1249
1304
|
getOptionLabelText(
|
|
1250
1305
|
getOptionLabel ?? getDefaultOptionLabel,
|
|
1251
|
-
|
|
1306
|
+
regularOption,
|
|
1252
1307
|
alternativeTitle,
|
|
1253
1308
|
title
|
|
1254
1309
|
),
|
|
@@ -1397,7 +1452,40 @@ function useMultipleAutocomplete({
|
|
|
1397
1452
|
getCounterRenderTags
|
|
1398
1453
|
};
|
|
1399
1454
|
}
|
|
1400
|
-
|
|
1455
|
+
const ItemWrapper = material.styled("div")(
|
|
1456
|
+
({ theme, isSubtitle }) => ({
|
|
1457
|
+
"& .MuiMenuItem-root": {
|
|
1458
|
+
marginTop: 0,
|
|
1459
|
+
"&:first-of-type": {
|
|
1460
|
+
marginTop: "0 !important"
|
|
1461
|
+
}
|
|
1462
|
+
},
|
|
1463
|
+
...isSubtitle && {
|
|
1464
|
+
"& .MuiAutocomplete-option.MuiMenuItem-root": {
|
|
1465
|
+
height: TablePaginationActions.MENU_ITEM_SIZE_DENSE,
|
|
1466
|
+
minHeight: TablePaginationActions.MENU_ITEM_SIZE_DENSE,
|
|
1467
|
+
marginTop: `${theme.spacing(1)} !important`,
|
|
1468
|
+
alignItems: "flex-end",
|
|
1469
|
+
...theme.typography.caption,
|
|
1470
|
+
fontWeight: 500
|
|
1471
|
+
},
|
|
1472
|
+
// First item has no divider
|
|
1473
|
+
"&:not(:first-of-type)": {
|
|
1474
|
+
"&::before": {
|
|
1475
|
+
content: '""',
|
|
1476
|
+
position: "absolute",
|
|
1477
|
+
zIndex: 1,
|
|
1478
|
+
top: theme.spacing(0.5),
|
|
1479
|
+
left: 0,
|
|
1480
|
+
right: 0,
|
|
1481
|
+
height: "1px",
|
|
1482
|
+
backgroundColor: theme.palette.divider
|
|
1483
|
+
}
|
|
1484
|
+
}
|
|
1485
|
+
}
|
|
1486
|
+
})
|
|
1487
|
+
);
|
|
1488
|
+
function _AutocompleteList({
|
|
1401
1489
|
children,
|
|
1402
1490
|
showFilters,
|
|
1403
1491
|
allSelected,
|
|
@@ -1434,7 +1522,16 @@ function _ListboxWithFilter({
|
|
|
1434
1522
|
}) => {
|
|
1435
1523
|
const child = childrenArray[index];
|
|
1436
1524
|
if (!child) return null;
|
|
1437
|
-
|
|
1525
|
+
const isSubtitle = React.isValidElement(child) && child.props.subtitle === true;
|
|
1526
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
1527
|
+
ItemWrapper,
|
|
1528
|
+
{
|
|
1529
|
+
style,
|
|
1530
|
+
isSubtitle,
|
|
1531
|
+
"data-name": "virtual-menu-item",
|
|
1532
|
+
children: child
|
|
1533
|
+
}
|
|
1534
|
+
);
|
|
1438
1535
|
};
|
|
1439
1536
|
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
1440
1537
|
"ul",
|
|
@@ -1471,7 +1568,7 @@ function _ListboxWithFilter({
|
|
|
1471
1568
|
}
|
|
1472
1569
|
);
|
|
1473
1570
|
}
|
|
1474
|
-
const
|
|
1571
|
+
const AutocompleteList = React.forwardRef(_AutocompleteList);
|
|
1475
1572
|
function _CreatableAutocomplete({
|
|
1476
1573
|
newItemLabel,
|
|
1477
1574
|
newItemIcon,
|
|
@@ -1493,8 +1590,12 @@ function _CreatableAutocomplete({
|
|
|
1493
1590
|
itemHeight,
|
|
1494
1591
|
maxListHeight,
|
|
1495
1592
|
extended,
|
|
1593
|
+
groupBy,
|
|
1496
1594
|
...props
|
|
1497
1595
|
}, ref) {
|
|
1596
|
+
if (groupBy) {
|
|
1597
|
+
warnDeprecatedGroupBy("CreatableAutocomplete");
|
|
1598
|
+
}
|
|
1498
1599
|
const { freeSolo = true, ...otherProps } = props;
|
|
1499
1600
|
const {
|
|
1500
1601
|
multipleValue,
|
|
@@ -1550,7 +1651,7 @@ function _CreatableAutocomplete({
|
|
|
1550
1651
|
forcePopupIcon: true,
|
|
1551
1652
|
multiple,
|
|
1552
1653
|
disableCloseOnSelect: disableCloseOnSelect ?? multiple,
|
|
1553
|
-
ListboxComponent:
|
|
1654
|
+
ListboxComponent: AutocompleteList,
|
|
1554
1655
|
ListboxProps: listboxProps,
|
|
1555
1656
|
getLimitTagsText: getLimitTagsText ?? getDefaultLimitTagsText,
|
|
1556
1657
|
disabled: disabled || loading,
|
|
@@ -1579,8 +1680,12 @@ function _MultipleAutocomplete({
|
|
|
1579
1680
|
itemHeight,
|
|
1580
1681
|
maxListHeight,
|
|
1581
1682
|
extended,
|
|
1683
|
+
groupBy,
|
|
1582
1684
|
...props
|
|
1583
1685
|
}, ref) {
|
|
1686
|
+
if (groupBy) {
|
|
1687
|
+
warnDeprecatedGroupBy("MultipleAutocomplete");
|
|
1688
|
+
}
|
|
1584
1689
|
const {
|
|
1585
1690
|
multipleValue,
|
|
1586
1691
|
allSelected,
|
|
@@ -1621,7 +1726,7 @@ function _MultipleAutocomplete({
|
|
|
1621
1726
|
getOptionLabel,
|
|
1622
1727
|
renderOption: renderOption ?? multipleRenderOption,
|
|
1623
1728
|
renderTags: finalRenderTags,
|
|
1624
|
-
ListboxComponent:
|
|
1729
|
+
ListboxComponent: AutocompleteList,
|
|
1625
1730
|
ListboxProps: listboxProps,
|
|
1626
1731
|
multiple: true,
|
|
1627
1732
|
getLimitTagsText: getLimitTagsText ?? getDefaultLimitTagsText,
|
|
@@ -1633,6 +1738,30 @@ function _MultipleAutocomplete({
|
|
|
1633
1738
|
);
|
|
1634
1739
|
}
|
|
1635
1740
|
const MultipleAutocomplete = React.forwardRef(_MultipleAutocomplete);
|
|
1741
|
+
function useAutocomplete({
|
|
1742
|
+
getOptionLabel = getDefaultOptionLabel
|
|
1743
|
+
}) {
|
|
1744
|
+
const { renderOption: autocompleteRenderOption } = useAutocompleteRenderOption();
|
|
1745
|
+
const internalGetOptionLabel = (option) => {
|
|
1746
|
+
if (typeof option === "object" && option !== null && "__isGroupHeader" in option) {
|
|
1747
|
+
return option.title;
|
|
1748
|
+
}
|
|
1749
|
+
return getOptionLabel(option);
|
|
1750
|
+
};
|
|
1751
|
+
const singleRenderOption = (props, option, state) => {
|
|
1752
|
+
const optionWithMultiple = createOptionWithMultiple(option, false);
|
|
1753
|
+
return autocompleteRenderOption(
|
|
1754
|
+
props,
|
|
1755
|
+
optionWithMultiple,
|
|
1756
|
+
state,
|
|
1757
|
+
internalGetOptionLabel
|
|
1758
|
+
);
|
|
1759
|
+
};
|
|
1760
|
+
return {
|
|
1761
|
+
singleRenderOption,
|
|
1762
|
+
getOptionLabel: internalGetOptionLabel
|
|
1763
|
+
};
|
|
1764
|
+
}
|
|
1636
1765
|
const _CopiableComponent = ({
|
|
1637
1766
|
children,
|
|
1638
1767
|
disabled,
|
|
@@ -4860,6 +4989,7 @@ exports.MenuItem = MenuItem.MenuItem;
|
|
|
4860
4989
|
exports.AccordionGroup = AccordionGroup;
|
|
4861
4990
|
exports.AppBar = AppBar;
|
|
4862
4991
|
exports.Autocomplete = Autocomplete;
|
|
4992
|
+
exports.AutocompleteList = AutocompleteList;
|
|
4863
4993
|
exports.Avatar = Avatar;
|
|
4864
4994
|
exports.Button = Button;
|
|
4865
4995
|
exports.CodeAreaDialog = CodeAreaDialog;
|
|
@@ -4903,7 +5033,7 @@ exports.TooltipData = TooltipData;
|
|
|
4903
5033
|
exports.UploadField = UploadField;
|
|
4904
5034
|
exports.UploadFieldBase = UploadFieldBase;
|
|
4905
5035
|
exports.copyString = copyString;
|
|
4906
|
-
exports.
|
|
4907
|
-
exports.createCounterRenderTags = createCounterRenderTags;
|
|
5036
|
+
exports.createAutocompleteGroupByList = createAutocompleteGroupByList;
|
|
4908
5037
|
exports.dialogDimensionsBySize = dialogDimensionsBySize;
|
|
5038
|
+
exports.useAutocomplete = useAutocomplete;
|
|
4909
5039
|
exports.useCopyValue = useCopyValue;
|
package/dist/components/index.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx, jsxs, Fragment } from "react/jsx-runtime";
|
|
2
|
-
import React, { forwardRef, useState, useRef, useEffect, useMemo, Fragment as Fragment$1, useImperativeHandle, useCallback } from "react";
|
|
2
|
+
import React, { forwardRef, useState, useRef, useEffect, useMemo, createElement, Fragment as Fragment$1, useImperativeHandle, useCallback } from "react";
|
|
3
3
|
import { styled, Box, Button as Button$1, CircularProgress, Popper, Grow, Paper, ClickAwayListener, MenuList as MenuList$1, MenuItem, ButtonGroup as ButtonGroup$1, TextField, InputAdornment, IconButton, Tooltip, Select, FormControl, InputLabel, FormHelperText, ToggleButtonGroup as ToggleButtonGroup$1, Menu as Menu$2, Link, Checkbox, ListItemText, Autocomplete as Autocomplete$1, Divider, ListItemIcon, createFilterOptions, Accordion, AccordionSummary, AccordionDetails, Avatar as Avatar$1, Snackbar as Snackbar$1, Portal, Fade, Slide, alpha, useTheme, Toolbar, AppBar as AppBar$1, Dialog as Dialog$1, DialogTitle as DialogTitle$1, Chip, DialogContent as DialogContent$1, DialogActions as DialogActions$1 } from "@mui/material";
|
|
4
|
-
import { T as Typography, c as ICON_SIZE_SMALL, u as useImperativeIntl, f as MENU_ITEM_SIZE_EXTENDED, d as MENU_LIST_MAX_SIZE, M as MENU_ITEM_SIZE_DEFAULT, N as NOTIFICATION_DURATION_IN_MS, A as APPBAR_SIZE } from "../TablePaginationActions-Cz5Hbi6N.js";
|
|
4
|
+
import { T as Typography, c as ICON_SIZE_SMALL, u as useImperativeIntl, f as MENU_ITEM_SIZE_EXTENDED, e as MENU_ITEM_SIZE_DENSE, d as MENU_LIST_MAX_SIZE, M as MENU_ITEM_SIZE_DEFAULT, N as NOTIFICATION_DURATION_IN_MS, A as APPBAR_SIZE } from "../TablePaginationActions-Cz5Hbi6N.js";
|
|
5
5
|
import { a } from "../TablePaginationActions-Cz5Hbi6N.js";
|
|
6
6
|
import { A as ArrowDown } from "../ArrowDown-CY_wMVJT.js";
|
|
7
7
|
import { A as ArrowUp, O as OpenDiagonallyRight, C as CloseDiagonallyRight } from "../OpenDiagonallyRight-CSm5GYYJ.js";
|
|
@@ -9,7 +9,7 @@ import { useIntl } from "react-intl";
|
|
|
9
9
|
import { VisibilityOffOutlined, VisibilityOutlined, Cancel, AddCircleOutlineOutlined, ContentCopyOutlined, CloseOutlined, MenuOutlined, HelpOutline, TodayOutlined, MoreVertOutlined, ErrorOutline, Check } from "@mui/icons-material";
|
|
10
10
|
import { I as IconButton$1, A as Alert$1 } from "../Alert-CnaTtNJd.js";
|
|
11
11
|
import "cartocolor";
|
|
12
|
-
import { M as MenuItem$1 } from "../MenuItem-
|
|
12
|
+
import { M as MenuItem$1 } from "../MenuItem-C1DvWMry.js";
|
|
13
13
|
import { FixedSizeList } from "react-window";
|
|
14
14
|
import { DatePicker as DatePicker$1 } from "@mui/x-date-pickers/DatePicker";
|
|
15
15
|
import { PickersDay as PickersDay$1 } from "@mui/x-date-pickers";
|
|
@@ -1117,27 +1117,6 @@ function UploadField({
|
|
|
1117
1117
|
)
|
|
1118
1118
|
] });
|
|
1119
1119
|
}
|
|
1120
|
-
function _Autocomplete({
|
|
1121
|
-
disabled,
|
|
1122
|
-
loading,
|
|
1123
|
-
...props
|
|
1124
|
-
}, ref) {
|
|
1125
|
-
return /* @__PURE__ */ jsx(
|
|
1126
|
-
Autocomplete$1,
|
|
1127
|
-
{
|
|
1128
|
-
...props,
|
|
1129
|
-
ref,
|
|
1130
|
-
disabled: disabled || loading,
|
|
1131
|
-
popupIcon: loading ? /* @__PURE__ */ jsx(CircularProgress, { size: 18, color: "inherit" }) : /* @__PURE__ */ jsx(ArrowDown, {}),
|
|
1132
|
-
"data-name": "autocomplete",
|
|
1133
|
-
ListboxProps: {
|
|
1134
|
-
"aria-multiselectable": false,
|
|
1135
|
-
...props.ListboxProps
|
|
1136
|
-
}
|
|
1137
|
-
}
|
|
1138
|
-
);
|
|
1139
|
-
}
|
|
1140
|
-
const Autocomplete = forwardRef(_Autocomplete);
|
|
1141
1120
|
const getDefaultOptionLabel = (option) => {
|
|
1142
1121
|
return option && typeof option === "object" ? option.title ?? String(option) : String(option);
|
|
1143
1122
|
};
|
|
@@ -1193,8 +1172,85 @@ function createCounterFormatter(counterText, allText, showSingleItemText = true)
|
|
|
1193
1172
|
}
|
|
1194
1173
|
};
|
|
1195
1174
|
}
|
|
1175
|
+
function createAutocompleteGroupByList(options, groupBy) {
|
|
1176
|
+
const grouped = options.reduce(
|
|
1177
|
+
(acc, option) => {
|
|
1178
|
+
const group = groupBy(option);
|
|
1179
|
+
if (!acc[group]) {
|
|
1180
|
+
acc[group] = [];
|
|
1181
|
+
}
|
|
1182
|
+
acc[group].push(option);
|
|
1183
|
+
return acc;
|
|
1184
|
+
},
|
|
1185
|
+
{}
|
|
1186
|
+
);
|
|
1187
|
+
const result = [];
|
|
1188
|
+
Object.keys(grouped).forEach((title) => {
|
|
1189
|
+
result.push({ __isGroupHeader: true, title });
|
|
1190
|
+
const groupOptions = grouped[title];
|
|
1191
|
+
if (groupOptions) {
|
|
1192
|
+
result.push(...groupOptions);
|
|
1193
|
+
}
|
|
1194
|
+
});
|
|
1195
|
+
return result;
|
|
1196
|
+
}
|
|
1197
|
+
function warnDeprecatedGroupBy(componentName) {
|
|
1198
|
+
if (process.env.NODE_ENV !== "production") {
|
|
1199
|
+
console.warn(
|
|
1200
|
+
`${componentName}: The \`groupBy\` prop is deprecated and breaks virtualization. Use \`createAutocompleteGroupByList\` instead:
|
|
1201
|
+
|
|
1202
|
+
\`\`\`
|
|
1203
|
+
import { createAutocompleteGroupByList, ${componentName} } from "@carto/meridian-ds/components"
|
|
1204
|
+
|
|
1205
|
+
const groupedOptions = createAutocompleteGroupByList(options, (option) => option.category)
|
|
1206
|
+
|
|
1207
|
+
<${componentName} options={groupedOptions} />
|
|
1208
|
+
\`\`\`
|
|
1209
|
+
`
|
|
1210
|
+
);
|
|
1211
|
+
}
|
|
1212
|
+
}
|
|
1213
|
+
function _Autocomplete({
|
|
1214
|
+
disabled,
|
|
1215
|
+
loading,
|
|
1216
|
+
...props
|
|
1217
|
+
}, ref) {
|
|
1218
|
+
if (props.groupBy) {
|
|
1219
|
+
warnDeprecatedGroupBy("Autocomplete");
|
|
1220
|
+
}
|
|
1221
|
+
return /* @__PURE__ */ jsx(
|
|
1222
|
+
Autocomplete$1,
|
|
1223
|
+
{
|
|
1224
|
+
...props,
|
|
1225
|
+
ref,
|
|
1226
|
+
disabled: disabled || loading,
|
|
1227
|
+
popupIcon: loading ? /* @__PURE__ */ jsx(CircularProgress, { size: 18, color: "inherit" }) : /* @__PURE__ */ jsx(ArrowDown, {}),
|
|
1228
|
+
"data-name": "autocomplete",
|
|
1229
|
+
ListboxProps: {
|
|
1230
|
+
"aria-multiselectable": false,
|
|
1231
|
+
...props.ListboxProps
|
|
1232
|
+
}
|
|
1233
|
+
}
|
|
1234
|
+
);
|
|
1235
|
+
}
|
|
1236
|
+
const Autocomplete = forwardRef(_Autocomplete);
|
|
1196
1237
|
function useAutocompleteRenderOption() {
|
|
1197
1238
|
const renderOption = (props, option, state, getOptionLabel, customIcon) => {
|
|
1239
|
+
const { key, ...otherProps } = props;
|
|
1240
|
+
if (typeof option === "object" && option !== null && "__isGroupHeader" in option) {
|
|
1241
|
+
return /* @__PURE__ */ createElement(
|
|
1242
|
+
MenuItem$1,
|
|
1243
|
+
{
|
|
1244
|
+
...otherProps,
|
|
1245
|
+
subtitle: true,
|
|
1246
|
+
key,
|
|
1247
|
+
"aria-disabled": true,
|
|
1248
|
+
"aria-selected": false
|
|
1249
|
+
},
|
|
1250
|
+
option.title
|
|
1251
|
+
);
|
|
1252
|
+
}
|
|
1253
|
+
const regularOption = option;
|
|
1198
1254
|
const {
|
|
1199
1255
|
title,
|
|
1200
1256
|
inputValue,
|
|
@@ -1211,9 +1267,8 @@ function useAutocompleteRenderOption() {
|
|
|
1211
1267
|
alternativeTitle,
|
|
1212
1268
|
secondaryText,
|
|
1213
1269
|
multiple
|
|
1214
|
-
} =
|
|
1215
|
-
const
|
|
1216
|
-
const isPrimitiveOptionType = typeof option === "string" || typeof option === "number";
|
|
1270
|
+
} = regularOption;
|
|
1271
|
+
const isPrimitiveOptionType = typeof regularOption === "string" || typeof regularOption === "number";
|
|
1217
1272
|
const getOptionLabelText = (getOptionLabel2, option2, alternativeTitle2, title2) => {
|
|
1218
1273
|
if (alternativeTitle2) return alternativeTitle2;
|
|
1219
1274
|
if (title2) return title2;
|
|
@@ -1247,7 +1302,7 @@ function useAutocompleteRenderOption() {
|
|
|
1247
1302
|
/* @__PURE__ */ jsxs(ListItemText, { children: [
|
|
1248
1303
|
getOptionLabelText(
|
|
1249
1304
|
getOptionLabel ?? getDefaultOptionLabel,
|
|
1250
|
-
|
|
1305
|
+
regularOption,
|
|
1251
1306
|
alternativeTitle,
|
|
1252
1307
|
title
|
|
1253
1308
|
),
|
|
@@ -1396,7 +1451,40 @@ function useMultipleAutocomplete({
|
|
|
1396
1451
|
getCounterRenderTags
|
|
1397
1452
|
};
|
|
1398
1453
|
}
|
|
1399
|
-
|
|
1454
|
+
const ItemWrapper = styled("div")(
|
|
1455
|
+
({ theme, isSubtitle }) => ({
|
|
1456
|
+
"& .MuiMenuItem-root": {
|
|
1457
|
+
marginTop: 0,
|
|
1458
|
+
"&:first-of-type": {
|
|
1459
|
+
marginTop: "0 !important"
|
|
1460
|
+
}
|
|
1461
|
+
},
|
|
1462
|
+
...isSubtitle && {
|
|
1463
|
+
"& .MuiAutocomplete-option.MuiMenuItem-root": {
|
|
1464
|
+
height: MENU_ITEM_SIZE_DENSE,
|
|
1465
|
+
minHeight: MENU_ITEM_SIZE_DENSE,
|
|
1466
|
+
marginTop: `${theme.spacing(1)} !important`,
|
|
1467
|
+
alignItems: "flex-end",
|
|
1468
|
+
...theme.typography.caption,
|
|
1469
|
+
fontWeight: 500
|
|
1470
|
+
},
|
|
1471
|
+
// First item has no divider
|
|
1472
|
+
"&:not(:first-of-type)": {
|
|
1473
|
+
"&::before": {
|
|
1474
|
+
content: '""',
|
|
1475
|
+
position: "absolute",
|
|
1476
|
+
zIndex: 1,
|
|
1477
|
+
top: theme.spacing(0.5),
|
|
1478
|
+
left: 0,
|
|
1479
|
+
right: 0,
|
|
1480
|
+
height: "1px",
|
|
1481
|
+
backgroundColor: theme.palette.divider
|
|
1482
|
+
}
|
|
1483
|
+
}
|
|
1484
|
+
}
|
|
1485
|
+
})
|
|
1486
|
+
);
|
|
1487
|
+
function _AutocompleteList({
|
|
1400
1488
|
children,
|
|
1401
1489
|
showFilters,
|
|
1402
1490
|
allSelected,
|
|
@@ -1433,7 +1521,16 @@ function _ListboxWithFilter({
|
|
|
1433
1521
|
}) => {
|
|
1434
1522
|
const child = childrenArray[index];
|
|
1435
1523
|
if (!child) return null;
|
|
1436
|
-
|
|
1524
|
+
const isSubtitle = React.isValidElement(child) && child.props.subtitle === true;
|
|
1525
|
+
return /* @__PURE__ */ jsx(
|
|
1526
|
+
ItemWrapper,
|
|
1527
|
+
{
|
|
1528
|
+
style,
|
|
1529
|
+
isSubtitle,
|
|
1530
|
+
"data-name": "virtual-menu-item",
|
|
1531
|
+
children: child
|
|
1532
|
+
}
|
|
1533
|
+
);
|
|
1437
1534
|
};
|
|
1438
1535
|
return /* @__PURE__ */ jsxs(
|
|
1439
1536
|
"ul",
|
|
@@ -1470,7 +1567,7 @@ function _ListboxWithFilter({
|
|
|
1470
1567
|
}
|
|
1471
1568
|
);
|
|
1472
1569
|
}
|
|
1473
|
-
const
|
|
1570
|
+
const AutocompleteList = forwardRef(_AutocompleteList);
|
|
1474
1571
|
function _CreatableAutocomplete({
|
|
1475
1572
|
newItemLabel,
|
|
1476
1573
|
newItemIcon,
|
|
@@ -1492,8 +1589,12 @@ function _CreatableAutocomplete({
|
|
|
1492
1589
|
itemHeight,
|
|
1493
1590
|
maxListHeight,
|
|
1494
1591
|
extended,
|
|
1592
|
+
groupBy,
|
|
1495
1593
|
...props
|
|
1496
1594
|
}, ref) {
|
|
1595
|
+
if (groupBy) {
|
|
1596
|
+
warnDeprecatedGroupBy("CreatableAutocomplete");
|
|
1597
|
+
}
|
|
1497
1598
|
const { freeSolo = true, ...otherProps } = props;
|
|
1498
1599
|
const {
|
|
1499
1600
|
multipleValue,
|
|
@@ -1549,7 +1650,7 @@ function _CreatableAutocomplete({
|
|
|
1549
1650
|
forcePopupIcon: true,
|
|
1550
1651
|
multiple,
|
|
1551
1652
|
disableCloseOnSelect: disableCloseOnSelect ?? multiple,
|
|
1552
|
-
ListboxComponent:
|
|
1653
|
+
ListboxComponent: AutocompleteList,
|
|
1553
1654
|
ListboxProps: listboxProps,
|
|
1554
1655
|
getLimitTagsText: getLimitTagsText ?? getDefaultLimitTagsText,
|
|
1555
1656
|
disabled: disabled || loading,
|
|
@@ -1578,8 +1679,12 @@ function _MultipleAutocomplete({
|
|
|
1578
1679
|
itemHeight,
|
|
1579
1680
|
maxListHeight,
|
|
1580
1681
|
extended,
|
|
1682
|
+
groupBy,
|
|
1581
1683
|
...props
|
|
1582
1684
|
}, ref) {
|
|
1685
|
+
if (groupBy) {
|
|
1686
|
+
warnDeprecatedGroupBy("MultipleAutocomplete");
|
|
1687
|
+
}
|
|
1583
1688
|
const {
|
|
1584
1689
|
multipleValue,
|
|
1585
1690
|
allSelected,
|
|
@@ -1620,7 +1725,7 @@ function _MultipleAutocomplete({
|
|
|
1620
1725
|
getOptionLabel,
|
|
1621
1726
|
renderOption: renderOption ?? multipleRenderOption,
|
|
1622
1727
|
renderTags: finalRenderTags,
|
|
1623
|
-
ListboxComponent:
|
|
1728
|
+
ListboxComponent: AutocompleteList,
|
|
1624
1729
|
ListboxProps: listboxProps,
|
|
1625
1730
|
multiple: true,
|
|
1626
1731
|
getLimitTagsText: getLimitTagsText ?? getDefaultLimitTagsText,
|
|
@@ -1632,6 +1737,30 @@ function _MultipleAutocomplete({
|
|
|
1632
1737
|
);
|
|
1633
1738
|
}
|
|
1634
1739
|
const MultipleAutocomplete = forwardRef(_MultipleAutocomplete);
|
|
1740
|
+
function useAutocomplete({
|
|
1741
|
+
getOptionLabel = getDefaultOptionLabel
|
|
1742
|
+
}) {
|
|
1743
|
+
const { renderOption: autocompleteRenderOption } = useAutocompleteRenderOption();
|
|
1744
|
+
const internalGetOptionLabel = (option) => {
|
|
1745
|
+
if (typeof option === "object" && option !== null && "__isGroupHeader" in option) {
|
|
1746
|
+
return option.title;
|
|
1747
|
+
}
|
|
1748
|
+
return getOptionLabel(option);
|
|
1749
|
+
};
|
|
1750
|
+
const singleRenderOption = (props, option, state) => {
|
|
1751
|
+
const optionWithMultiple = createOptionWithMultiple(option, false);
|
|
1752
|
+
return autocompleteRenderOption(
|
|
1753
|
+
props,
|
|
1754
|
+
optionWithMultiple,
|
|
1755
|
+
state,
|
|
1756
|
+
internalGetOptionLabel
|
|
1757
|
+
);
|
|
1758
|
+
};
|
|
1759
|
+
return {
|
|
1760
|
+
singleRenderOption,
|
|
1761
|
+
getOptionLabel: internalGetOptionLabel
|
|
1762
|
+
};
|
|
1763
|
+
}
|
|
1635
1764
|
const _CopiableComponent = ({
|
|
1636
1765
|
children,
|
|
1637
1766
|
disabled,
|
|
@@ -4856,6 +4985,7 @@ export {
|
|
|
4856
4985
|
Alert$1 as Alert,
|
|
4857
4986
|
AppBar,
|
|
4858
4987
|
Autocomplete,
|
|
4988
|
+
AutocompleteList,
|
|
4859
4989
|
Avatar,
|
|
4860
4990
|
Button,
|
|
4861
4991
|
CodeAreaDialog,
|
|
@@ -4903,8 +5033,8 @@ export {
|
|
|
4903
5033
|
UploadField,
|
|
4904
5034
|
UploadFieldBase,
|
|
4905
5035
|
copyString,
|
|
4906
|
-
|
|
4907
|
-
createCounterRenderTags,
|
|
5036
|
+
createAutocompleteGroupByList,
|
|
4908
5037
|
dialogDimensionsBySize,
|
|
5038
|
+
useAutocomplete,
|
|
4909
5039
|
useCopyValue
|
|
4910
5040
|
};
|
package/dist/theme/index.cjs
CHANGED
|
@@ -7,7 +7,7 @@ const TablePaginationActions = require("../TablePaginationActions-mbbjzV6Y.cjs")
|
|
|
7
7
|
const iconsMaterial = require("@mui/icons-material");
|
|
8
8
|
const ArrowDown = require("../ArrowDown-8fLj23Ge.cjs");
|
|
9
9
|
const xDatePickers = require("@mui/x-date-pickers");
|
|
10
|
-
const MenuItem = require("../MenuItem-
|
|
10
|
+
const MenuItem = require("../MenuItem-C4bG5WHw.cjs");
|
|
11
11
|
const paletteUtils = require("../paletteUtils-B9ybmwiI.cjs");
|
|
12
12
|
const tooltipArrowSize = 1;
|
|
13
13
|
const tooltipSeparation = 0.5;
|
package/dist/theme/index.js
CHANGED
|
@@ -6,7 +6,7 @@ import { f, N } from "../TablePaginationActions-Cz5Hbi6N.js";
|
|
|
6
6
|
import { Cancel, EventOutlined, ChevronRightOutlined, ChevronLeftOutlined, ExpandMoreOutlined, CheckCircleOutlined } from "@mui/icons-material";
|
|
7
7
|
import { A as ArrowDown } from "../ArrowDown-CY_wMVJT.js";
|
|
8
8
|
import { renderDigitalClockTimeView } from "@mui/x-date-pickers";
|
|
9
|
-
import { M as MenuItem } from "../MenuItem-
|
|
9
|
+
import { M as MenuItem } from "../MenuItem-C1DvWMry.js";
|
|
10
10
|
import { c as commonPalette } from "../paletteUtils-BHqJlHm9.js";
|
|
11
11
|
import { g } from "../paletteUtils-BHqJlHm9.js";
|
|
12
12
|
const tooltipArrowSize = 1;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Autocomplete.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/Autocomplete/Autocomplete.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAc,MAAM,OAAO,CAAA;AAChD,OAAO,EACL,WAAW,EAGZ,MAAM,eAAe,CAAA;AAGtB,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;
|
|
1
|
+
{"version":3,"file":"Autocomplete.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/Autocomplete/Autocomplete.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAc,MAAM,OAAO,CAAA;AAChD,OAAO,EACL,WAAW,EAGZ,MAAM,eAAe,CAAA;AAGtB,OAAO,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAA;AAG3C,iBAAS,aAAa,CACpB,KAAK,EACL,QAAQ,SAAS,OAAO,GAAG,SAAS,GAAG,KAAK,EAC5C,gBAAgB,SAAS,OAAO,GAAG,SAAS,GAAG,SAAS,EACxD,QAAQ,SAAS,OAAO,GAAG,SAAS,GAAG,SAAS,EAChD,aAAa,SAAS,KAAK,CAAC,WAAW,GAAG,WAAW,CAAC,kBAAkB,CAAC,EAEzE,EACE,QAAQ,EACR,OAAO,EACP,GAAG,KAAK,EACT,EAAE,iBAAiB,CAClB,KAAK,EACL,QAAQ,EACR,gBAAgB,EAChB,QAAQ,EACR,aAAa,CACd,EACD,GAAG,EAAE,YAAY,CAAC,WAAW,CAAC,2CAsB/B;AAID,QAAA,MAAM,YAAY,EAAgC,CAChD,KAAK,EACL,QAA4C,SAA3B,OAAO,GAAG,SAAS,GAAG,KAAK,EAC5C,gBAAwD,SAA/B,OAAO,GAAG,SAAS,GAAG,SAAS,EACxD,QAAgD,SAA/B,OAAO,GAAG,SAAS,GAAG,SAAS,EAChD,aAAyE,SAAnD,KAAK,CAAC,WAAW,GAAG,WAAW,CAAC,kBAAkB,CAAC,EAEzE,KAAK,EAAE,iBAAiB,CACtB,KAAK,EACL,QAAQ,EACR,gBAAgB,EAChB,QAAQ,EACR,aAAa,CACd,GAAG;IAAE,GAAG,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,CAAA;CAAE,KACpC,UAAU,CAAC,OAAO,aAAa,CAAC,CAAA;AAErC,eAAe,YAAY,CAAA"}
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
declare const AutocompleteList: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLElement> & {
|
|
3
|
+
showFilters?: boolean;
|
|
4
|
+
allSelected?: boolean;
|
|
5
|
+
someSelected?: boolean;
|
|
6
|
+
handleSelectAll?: () => void;
|
|
7
|
+
multiple?: boolean;
|
|
8
|
+
extended?: boolean;
|
|
9
|
+
itemHeight?: number;
|
|
10
|
+
maxListHeight?: number;
|
|
11
|
+
} & React.RefAttributes<HTMLUListElement>>;
|
|
12
|
+
export default AutocompleteList;
|
|
13
|
+
//# sourceMappingURL=AutocompleteList.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"AutocompleteList.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/Autocomplete/AutocompleteList.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA4C,MAAM,OAAO,CAAA;AAsJhE,QAAA,MAAM,gBAAgB;;;;;;;;;0CAAgC,CAAA;AACtD,eAAe,gBAAgB,CAAA"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { ForwardedRef } from 'react';
|
|
2
2
|
import { ChipTypeMap } from '@mui/material';
|
|
3
3
|
import { CreatableAutocompleteProps } from './types';
|
|
4
|
-
declare function _CreatableAutocomplete<Value, Multiple extends boolean | undefined = undefined, DisableClearable extends boolean | undefined = undefined, FreeSolo extends boolean | undefined = undefined, ChipComponent extends React.ElementType = ChipTypeMap['defaultComponent']>({ newItemLabel, newItemIcon, getOptionLabel, multiple, disableCloseOnSelect, disabled, loading, showFilters, showCounter, counterFormatter, counterText, allSelectedText, options, value, onChange, getLimitTagsText, renderTags, itemHeight, maxListHeight, extended, ...props }: CreatableAutocompleteProps<Value, Multiple, DisableClearable, FreeSolo, ChipComponent>, ref: ForwardedRef<HTMLElement>): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
declare function _CreatableAutocomplete<Value, Multiple extends boolean | undefined = undefined, DisableClearable extends boolean | undefined = undefined, FreeSolo extends boolean | undefined = undefined, ChipComponent extends React.ElementType = ChipTypeMap['defaultComponent']>({ newItemLabel, newItemIcon, getOptionLabel, multiple, disableCloseOnSelect, disabled, loading, showFilters, showCounter, counterFormatter, counterText, allSelectedText, options, value, onChange, getLimitTagsText, renderTags, itemHeight, maxListHeight, extended, groupBy, ...props }: CreatableAutocompleteProps<Value, Multiple, DisableClearable, FreeSolo, ChipComponent>, ref: ForwardedRef<HTMLElement>): import("react/jsx-runtime").JSX.Element;
|
|
5
5
|
declare const CreatableAutocomplete: <Value, Multiple extends boolean | undefined = undefined, DisableClearable extends boolean | undefined = undefined, FreeSolo extends boolean | undefined = undefined, ChipComponent extends React.ElementType = ChipTypeMap["defaultComponent"]>(props: CreatableAutocompleteProps<Value, Multiple, DisableClearable, FreeSolo, ChipComponent> & {
|
|
6
6
|
ref?: ForwardedRef<HTMLElement>;
|
|
7
7
|
}) => ReturnType<typeof _CreatableAutocomplete>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CreatableAutocomplete.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/Autocomplete/CreatableAutocomplete.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAc,MAAM,OAAO,CAAA;AAChD,OAAO,EACL,WAAW,EAGZ,MAAM,eAAe,CAAA;
|
|
1
|
+
{"version":3,"file":"CreatableAutocomplete.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/Autocomplete/CreatableAutocomplete.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAc,MAAM,OAAO,CAAA;AAChD,OAAO,EACL,WAAW,EAGZ,MAAM,eAAe,CAAA;AAWtB,OAAO,EAAE,0BAA0B,EAAyB,MAAM,SAAS,CAAA;AAG3E,iBAAS,sBAAsB,CAC7B,KAAK,EACL,QAAQ,SAAS,OAAO,GAAG,SAAS,GAAG,SAAS,EAChD,gBAAgB,SAAS,OAAO,GAAG,SAAS,GAAG,SAAS,EACxD,QAAQ,SAAS,OAAO,GAAG,SAAS,GAAG,SAAS,EAChD,aAAa,SAAS,KAAK,CAAC,WAAW,GAAG,WAAW,CAAC,kBAAkB,CAAC,EAEzE,EACE,YAAY,EACZ,WAAW,EACX,cAAsC,EACtC,QAAQ,EACR,oBAAoB,EACpB,QAAQ,EACR,OAAO,EACP,WAAW,EACX,WAAmB,EACnB,gBAAgB,EAChB,WAAW,EACX,eAAe,EACf,OAAY,EACZ,KAAK,EACL,QAAQ,EACR,gBAAgB,EAChB,UAAU,EACV,UAAU,EACV,aAAa,EACb,QAAQ,EACR,OAAO,EACP,GAAG,KAAK,EACT,EAAE,0BAA0B,CAC3B,KAAK,EACL,QAAQ,EACR,gBAAgB,EAChB,QAAQ,EACR,aAAa,CACd,EACD,GAAG,EAAE,YAAY,CAAC,WAAW,CAAC,2CA6E/B;AAID,QAAA,MAAM,qBAAqB,EAAyC,CAClE,KAAK,EACL,QAAgD,SAA/B,OAAO,GAAG,SAAS,GAAG,SAAS,EAChD,gBAAwD,SAA/B,OAAO,GAAG,SAAS,GAAG,SAAS,EACxD,QAAgD,SAA/B,OAAO,GAAG,SAAS,GAAG,SAAS,EAChD,aAAyE,SAAnD,KAAK,CAAC,WAAW,GAAG,WAAW,CAAC,kBAAkB,CAAC,EAEzE,KAAK,EAAE,0BAA0B,CAC/B,KAAK,EACL,QAAQ,EACR,gBAAgB,EAChB,QAAQ,EACR,aAAa,CACd,GAAG;IAAE,GAAG,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,CAAA;CAAE,KACpC,UAAU,CAAC,OAAO,sBAAsB,CAAC,CAAA;AAE9C,eAAe,qBAAqB,CAAA"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { ForwardedRef } from 'react';
|
|
2
2
|
import { ChipTypeMap } from '@mui/material';
|
|
3
3
|
import { MultipleAutocompleteProps } from './types';
|
|
4
|
-
declare function _MultipleAutocomplete<Value, Multiple extends boolean | undefined = true, DisableClearable extends boolean | undefined = undefined, FreeSolo extends boolean | undefined = undefined, ChipComponent extends React.ElementType = ChipTypeMap['defaultComponent']>({ renderOption, disableCloseOnSelect, disabled, loading, showFilters, showCounter, counterFormatter, counterText, allSelectedText, options, value, onChange, getOptionLabel, getLimitTagsText, renderTags, itemHeight, maxListHeight, extended, ...props }: MultipleAutocompleteProps<Value, Multiple, DisableClearable, FreeSolo, ChipComponent>, ref: ForwardedRef<HTMLElement>): import("react/jsx-runtime").JSX.Element;
|
|
4
|
+
declare function _MultipleAutocomplete<Value, Multiple extends boolean | undefined = true, DisableClearable extends boolean | undefined = undefined, FreeSolo extends boolean | undefined = undefined, ChipComponent extends React.ElementType = ChipTypeMap['defaultComponent']>({ renderOption, disableCloseOnSelect, disabled, loading, showFilters, showCounter, counterFormatter, counterText, allSelectedText, options, value, onChange, getOptionLabel, getLimitTagsText, renderTags, itemHeight, maxListHeight, extended, groupBy, ...props }: MultipleAutocompleteProps<Value, Multiple, DisableClearable, FreeSolo, ChipComponent>, ref: ForwardedRef<HTMLElement>): import("react/jsx-runtime").JSX.Element;
|
|
5
5
|
declare const MultipleAutocomplete: <Value, Multiple extends boolean | undefined = true, DisableClearable extends boolean | undefined = undefined, FreeSolo extends boolean | undefined = undefined, ChipComponent extends React.ElementType = ChipTypeMap["defaultComponent"]>(props: MultipleAutocompleteProps<Value, Multiple, DisableClearable, FreeSolo, ChipComponent> & {
|
|
6
6
|
ref?: ForwardedRef<HTMLElement>;
|
|
7
7
|
}) => ReturnType<typeof _MultipleAutocomplete>;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"MultipleAutocomplete.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/Autocomplete/MultipleAutocomplete.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAc,MAAM,OAAO,CAAA;AAChD,OAAO,EACL,WAAW,EAGZ,MAAM,eAAe,CAAA;AAMtB,OAAO,EAAE,yBAAyB,
|
|
1
|
+
{"version":3,"file":"MultipleAutocomplete.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/Autocomplete/MultipleAutocomplete.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAc,MAAM,OAAO,CAAA;AAChD,OAAO,EACL,WAAW,EAGZ,MAAM,eAAe,CAAA;AAMtB,OAAO,EAAE,yBAAyB,EAAyB,MAAM,SAAS,CAAA;AAG1E,iBAAS,qBAAqB,CAC5B,KAAK,EACL,QAAQ,SAAS,OAAO,GAAG,SAAS,GAAG,IAAI,EAC3C,gBAAgB,SAAS,OAAO,GAAG,SAAS,GAAG,SAAS,EACxD,QAAQ,SAAS,OAAO,GAAG,SAAS,GAAG,SAAS,EAChD,aAAa,SAAS,KAAK,CAAC,WAAW,GAAG,WAAW,CAAC,kBAAkB,CAAC,EAEzE,EACE,YAAY,EACZ,oBAA2B,EAC3B,QAAQ,EACR,OAAO,EACP,WAAW,EACX,WAAmB,EACnB,gBAAgB,EAChB,WAAW,EACX,eAAe,EACf,OAAO,EACP,KAAK,EACL,QAAQ,EACR,cAAc,EACd,gBAAgB,EAChB,UAAU,EACV,UAAU,EACV,aAAa,EACb,QAAQ,EACR,OAAO,EACP,GAAG,KAAK,EACT,EAAE,yBAAyB,CAC1B,KAAK,EACL,QAAQ,EACR,gBAAgB,EAChB,QAAQ,EACR,aAAa,CACd,EACD,GAAG,EAAE,YAAY,CAAC,WAAW,CAAC,2CA8D/B;AAID,QAAA,MAAM,oBAAoB,EAAwC,CAChE,KAAK,EACL,QAA2C,SAA1B,OAAO,GAAG,SAAS,GAAG,IAAI,EAC3C,gBAAwD,SAA/B,OAAO,GAAG,SAAS,GAAG,SAAS,EACxD,QAAgD,SAA/B,OAAO,GAAG,SAAS,GAAG,SAAS,EAChD,aAAyE,SAAnD,KAAK,CAAC,WAAW,GAAG,WAAW,CAAC,kBAAkB,CAAC,EAEzE,KAAK,EAAE,yBAAyB,CAC9B,KAAK,EACL,QAAQ,EACR,gBAAgB,EAChB,QAAQ,EACR,aAAa,CACd,GAAG;IAAE,GAAG,CAAC,EAAE,YAAY,CAAC,WAAW,CAAC,CAAA;CAAE,KACpC,UAAU,CAAC,OAAO,qBAAqB,CAAC,CAAA;AAE7C,eAAe,oBAAoB,CAAA"}
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
export { default as Autocomplete } from './Autocomplete';
|
|
2
2
|
export { default as CreatableAutocomplete } from './CreatableAutocomplete';
|
|
3
3
|
export { default as MultipleAutocomplete } from './MultipleAutocomplete';
|
|
4
|
-
export {
|
|
4
|
+
export { default as AutocompleteList } from './AutocompleteList';
|
|
5
|
+
export { default as useAutocomplete } from './useAutocomplete';
|
|
6
|
+
export { createAutocompleteGroupByList } from './utils';
|
|
5
7
|
//# sourceMappingURL=index.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/Autocomplete/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAA;AACxD,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,yBAAyB,CAAA;AAC1E,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,wBAAwB,CAAA;AACxE,OAAO,EAAE,
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/Autocomplete/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,YAAY,EAAE,MAAM,gBAAgB,CAAA;AACxD,OAAO,EAAE,OAAO,IAAI,qBAAqB,EAAE,MAAM,yBAAyB,CAAA;AAC1E,OAAO,EAAE,OAAO,IAAI,oBAAoB,EAAE,MAAM,wBAAwB,CAAA;AACxE,OAAO,EAAE,OAAO,IAAI,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AAChE,OAAO,EAAE,OAAO,IAAI,eAAe,EAAE,MAAM,mBAAmB,CAAA;AAC9D,OAAO,EAAE,6BAA6B,EAAE,MAAM,SAAS,CAAA"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { ChipTypeMap, AutocompleteProps as MUIAutocompleteProps } from '@mui/material';
|
|
2
2
|
import { MenuItemProps } from '../Menu/MenuItem';
|
|
3
|
+
import { HTMLAttributes } from 'react';
|
|
3
4
|
type BaseAutocompleteProps<Value, Multiple extends boolean | undefined = undefined, DisableClearable extends boolean | undefined = undefined, FreeSolo extends boolean | undefined = undefined, ChipComponent extends React.ElementType = ChipTypeMap['defaultComponent']> = Omit<MUIAutocompleteProps<Value, Multiple, DisableClearable, FreeSolo, ChipComponent>, 'ref'> & {
|
|
4
5
|
loading?: boolean;
|
|
5
6
|
/**
|
|
@@ -17,6 +18,28 @@ type BaseAutocompleteProps<Value, Multiple extends boolean | undefined = undefin
|
|
|
17
18
|
* @default false
|
|
18
19
|
*/
|
|
19
20
|
extended?: boolean;
|
|
21
|
+
/**
|
|
22
|
+
* @deprecated since v1.6.0 - This prop breaks virtualization.
|
|
23
|
+
* Use createAutocompleteGroupByList instead to create a flat list with group headers:
|
|
24
|
+
*
|
|
25
|
+
* @example
|
|
26
|
+
* ```tsx
|
|
27
|
+
* import { createAutocompleteGroupByList } from "@carto/meridian-ds"
|
|
28
|
+
*
|
|
29
|
+
* const groupedOptions = createAutocompleteGroupByList(
|
|
30
|
+
* rawOptions,
|
|
31
|
+
* (option) => option.category
|
|
32
|
+
* )
|
|
33
|
+
*
|
|
34
|
+
* <MultipleAutocomplete
|
|
35
|
+
* options={groupedOptions}
|
|
36
|
+
* // ... other props
|
|
37
|
+
* />
|
|
38
|
+
* ```
|
|
39
|
+
*
|
|
40
|
+
* This approach maintains virtualization performance while providing proper grouping.
|
|
41
|
+
*/
|
|
42
|
+
groupBy?: (option: Value) => string;
|
|
20
43
|
};
|
|
21
44
|
type BaseMultipleAutocompleteProps<Value, Multiple extends boolean | undefined = true, DisableClearable extends boolean | undefined = undefined, FreeSolo extends boolean | undefined = undefined, ChipComponent extends React.ElementType = ChipTypeMap['defaultComponent']> = BaseAutocompleteProps<Value, Multiple, DisableClearable, FreeSolo, ChipComponent> & {
|
|
22
45
|
/**
|
|
@@ -90,5 +113,21 @@ export type AutocompleteRenderOptionProps = Pick<MenuItemProps, 'dense' | 'disab
|
|
|
90
113
|
secondaryText?: string;
|
|
91
114
|
multiple?: boolean;
|
|
92
115
|
};
|
|
116
|
+
export type AutocompleteListProps = HTMLAttributes<HTMLElement> & {
|
|
117
|
+
showFilters?: boolean;
|
|
118
|
+
allSelected?: boolean;
|
|
119
|
+
someSelected?: boolean;
|
|
120
|
+
handleSelectAll?: () => void;
|
|
121
|
+
multiple?: boolean;
|
|
122
|
+
extended?: boolean;
|
|
123
|
+
/**
|
|
124
|
+
* Height of each item in pixels
|
|
125
|
+
*/
|
|
126
|
+
itemHeight?: number;
|
|
127
|
+
/**
|
|
128
|
+
* Maximum height of the listbox in pixels
|
|
129
|
+
*/
|
|
130
|
+
maxListHeight?: number;
|
|
131
|
+
};
|
|
93
132
|
export {};
|
|
94
133
|
//# sourceMappingURL=types.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/Autocomplete/types.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,WAAW,EACX,iBAAiB,IAAI,oBAAoB,EAC1C,MAAM,eAAe,CAAA;AACtB,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAA;
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/Autocomplete/types.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,WAAW,EACX,iBAAiB,IAAI,oBAAoB,EAC1C,MAAM,eAAe,CAAA;AACtB,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAA;AAChD,OAAO,EAAE,cAAc,EAAE,MAAM,OAAO,CAAA;AAEtC,KAAK,qBAAqB,CACxB,KAAK,EACL,QAAQ,SAAS,OAAO,GAAG,SAAS,GAAG,SAAS,EAChD,gBAAgB,SAAS,OAAO,GAAG,SAAS,GAAG,SAAS,EACxD,QAAQ,SAAS,OAAO,GAAG,SAAS,GAAG,SAAS,EAChD,aAAa,SAAS,KAAK,CAAC,WAAW,GAAG,WAAW,CAAC,kBAAkB,CAAC,IACvE,IAAI,CACN,oBAAoB,CAClB,KAAK,EACL,QAAQ,EACR,gBAAgB,EAChB,QAAQ,EACR,aAAa,CACd,EACD,KAAK,CACN,GAAG;IACF,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;;OAGG;IACH,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB;;;OAGG;IACH,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB;;;OAGG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;;;;;;;;;;;;;;;;;;;OAoBG;IACH,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,KAAK,KAAK,MAAM,CAAA;CACpC,CAAA;AAED,KAAK,6BAA6B,CAChC,KAAK,EACL,QAAQ,SAAS,OAAO,GAAG,SAAS,GAAG,IAAI,EAC3C,gBAAgB,SAAS,OAAO,GAAG,SAAS,GAAG,SAAS,EACxD,QAAQ,SAAS,OAAO,GAAG,SAAS,GAAG,SAAS,EAChD,aAAa,SAAS,KAAK,CAAC,WAAW,GAAG,WAAW,CAAC,kBAAkB,CAAC,IACvE,qBAAqB,CACvB,KAAK,EACL,QAAQ,EACR,gBAAgB,EAChB,QAAQ,EACR,aAAa,CACd,GAAG;IACF;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB;;;OAGG;IACH,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAC9B;;;OAGG;IACH,WAAW,CAAC,EAAE,OAAO,CAAA;IAErB;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,CAAC,MAAM,EAAE;QAC1B,aAAa,EAAE,MAAM,CAAA;QACrB,UAAU,EAAE,MAAM,CAAA;QAClB,aAAa,EAAE,SAAS,OAAO,EAAE,CAAA;QACjC,QAAQ,EAAE,SAAS,OAAO,EAAE,CAAA;QAC5B,cAAc,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,MAAM,CAAA;KAC5C,KAAK,MAAM,CAAA;IACZ;;;;OAIG;IACH,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,CAAA;CACzB,CAAA;AAED,MAAM,MAAM,iBAAiB,CAC3B,KAAK,EACL,QAAQ,SAAS,OAAO,GAAG,SAAS,GAAG,KAAK,EAC5C,gBAAgB,SAAS,OAAO,GAAG,SAAS,GAAG,SAAS,EACxD,QAAQ,SAAS,OAAO,GAAG,SAAS,GAAG,SAAS,EAChD,aAAa,SAAS,KAAK,CAAC,WAAW,GAAG,WAAW,CAAC,kBAAkB,CAAC,IACvE,IAAI,CACN,qBAAqB,CACnB,KAAK,EACL,QAAQ,EACR,gBAAgB,EAChB,QAAQ,EACR,aAAa,CACd,EACD,UAAU,CACX,CAAA;AAED,MAAM,MAAM,yBAAyB,CACnC,KAAK,EACL,QAAQ,SAAS,OAAO,GAAG,SAAS,GAAG,IAAI,EAC3C,gBAAgB,SAAS,OAAO,GAAG,SAAS,GAAG,SAAS,EACxD,QAAQ,SAAS,OAAO,GAAG,SAAS,GAAG,SAAS,EAChD,aAAa,SAAS,KAAK,CAAC,WAAW,GAAG,WAAW,CAAC,kBAAkB,CAAC,IACvE,qBAAqB,CACvB,KAAK,EACL,QAAQ,EACR,gBAAgB,EAChB,QAAQ,EACR,aAAa,CACd,GACC,6BAA6B,CAC3B,KAAK,EACL,QAAQ,EACR,gBAAgB,EAChB,QAAQ,EACR,aAAa,CACd,CAAA;AAEH,MAAM,MAAM,0BAA0B,CACpC,KAAK,EACL,QAAQ,SAAS,OAAO,GAAG,SAAS,GAAG,SAAS,EAChD,gBAAgB,SAAS,OAAO,GAAG,SAAS,GAAG,SAAS,EACxD,QAAQ,SAAS,OAAO,GAAG,SAAS,GAAG,SAAS,EAChD,aAAa,SAAS,KAAK,CAAC,WAAW,GAAG,WAAW,CAAC,kBAAkB,CAAC,IACvE,6BAA6B,CAC/B,KAAK,EACL,QAAQ,EACR,gBAAgB,EAChB,QAAQ,EACR,aAAa,CACd,GAAG;IACF;;OAEG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,CAAC,CAAC,KAAK,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAC,CAAA;IAC5D;;OAEG;IACH,WAAW,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC7B;;;OAGG;IACH,QAAQ,CAAC,EAAE,QAAQ,CAAA;CACpB,CAAA;AAED,MAAM,MAAM,mBAAmB,GAAG;IAChC,UAAU,EAAE,MAAM,CAAA;IAClB,KAAK,EAAE,MAAM,CAAA;CACd,CAAA;AAED,MAAM,MAAM,6BAA6B,GAAG,IAAI,CAC9C,aAAa,EACX,OAAO,GACP,UAAU,GACV,aAAa,GACb,UAAU,GACV,OAAO,GACP,WAAW,GACX,UAAU,GACV,SAAS,GACT,OAAO,CACV,GAAG;IACF,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,MAAM,GAAG,MAAM,CAAA;IACvB,cAAc,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAChC,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;IAC9B,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,MAAM,MAAM,qBAAqB,GAAG,cAAc,CAAC,WAAW,CAAC,GAAG;IAChE,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;IAC5B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAA;CACvB,CAAA"}
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
type UseAutocompleteProps<Value> = {
|
|
2
|
+
getOptionLabel?: (option: Value) => string;
|
|
3
|
+
};
|
|
4
|
+
export default function useAutocomplete<Value>({ getOptionLabel, }: UseAutocompleteProps<Value>): {
|
|
5
|
+
singleRenderOption: (props: React.HTMLAttributes<HTMLLIElement>, option: Value, state: {
|
|
6
|
+
selected: boolean;
|
|
7
|
+
}) => import("react/jsx-runtime").JSX.Element;
|
|
8
|
+
getOptionLabel: (option: Value) => string;
|
|
9
|
+
};
|
|
10
|
+
export {};
|
|
11
|
+
//# sourceMappingURL=useAutocomplete.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useAutocomplete.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/Autocomplete/useAutocomplete.tsx"],"names":[],"mappings":"AAGA,KAAK,oBAAoB,CAAC,KAAK,IAAI;IACjC,cAAc,CAAC,EAAE,CAAC,MAAM,EAAE,KAAK,KAAK,MAAM,CAAA;CAC3C,CAAA;AAED,MAAM,CAAC,OAAO,UAAU,eAAe,CAAC,KAAK,EAAE,EAC7C,cAAsC,GACvC,EAAE,oBAAoB,CAAC,KAAK,CAAC;gCAmBnB,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC,UAClC,KAAK,SACN;QAAE,QAAQ,EAAE,OAAO,CAAA;KAAE;6BAhBU,KAAK;EAgC9C"}
|
|
@@ -1,9 +1,14 @@
|
|
|
1
1
|
import { HTMLAttributes, Key, ReactNode } from 'react';
|
|
2
|
+
type GroupHeaderOption = {
|
|
3
|
+
__isGroupHeader: true;
|
|
4
|
+
title: string;
|
|
5
|
+
};
|
|
2
6
|
export default function useAutocompleteRenderOption<Value>(): {
|
|
3
7
|
renderOption: (props: HTMLAttributes<HTMLLIElement> & {
|
|
4
8
|
key?: Key;
|
|
5
|
-
}, option: Value, state: {
|
|
9
|
+
}, option: Value | GroupHeaderOption, state: {
|
|
6
10
|
selected: boolean;
|
|
7
11
|
}, getOptionLabel?: (option: Value) => string, customIcon?: ReactNode) => import("react/jsx-runtime").JSX.Element;
|
|
8
12
|
};
|
|
13
|
+
export {};
|
|
9
14
|
//# sourceMappingURL=useAutocompleteRenderOption.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useAutocompleteRenderOption.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/Autocomplete/useAutocompleteRenderOption.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,cAAc,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAQhE,MAAM,CAAC,OAAO,UAAU,2BAA2B,CAAC,KAAK;0BAE9C,cAAc,CAAC,aAAa,CAAC,GAAG;QAAE,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,UAC5C,KAAK,
|
|
1
|
+
{"version":3,"file":"useAutocompleteRenderOption.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/Autocomplete/useAutocompleteRenderOption.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAY,cAAc,EAAE,GAAG,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAQhE,KAAK,iBAAiB,GAAG;IAAE,eAAe,EAAE,IAAI,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAA;AAEjE,MAAM,CAAC,OAAO,UAAU,2BAA2B,CAAC,KAAK;0BAE9C,cAAc,CAAC,aAAa,CAAC,GAAG;QAAE,GAAG,CAAC,EAAE,GAAG,CAAA;KAAE,UAC5C,KAAK,GAAG,iBAAiB,SAC1B;QAAE,QAAQ,EAAE,OAAO,CAAA;KAAE,mBACX,CAAC,MAAM,EAAE,KAAK,KAAK,MAAM,eAC7B,SAAS;EAyHzB"}
|
|
@@ -50,4 +50,19 @@ export declare function createCounterFormatter(counterText: string, allText: str
|
|
|
50
50
|
selectedItems: readonly unknown[];
|
|
51
51
|
getOptionLabel: (option: unknown) => string;
|
|
52
52
|
}) => string;
|
|
53
|
+
/**
|
|
54
|
+
* Creates a grouped options list with group headers for direct use in autocomplete options
|
|
55
|
+
* @param options - Array of options to group
|
|
56
|
+
* @param groupBy - Function that returns the group key for each option
|
|
57
|
+
* @returns Flat array with group headers and options ready for autocomplete
|
|
58
|
+
*/
|
|
59
|
+
export declare function createAutocompleteGroupByList<T>(options: T[], groupBy: (option: T) => string): (T | {
|
|
60
|
+
__isGroupHeader: true;
|
|
61
|
+
title: string;
|
|
62
|
+
})[];
|
|
63
|
+
/**
|
|
64
|
+
* Shows a runtime warning for deprecated groupBy prop usage
|
|
65
|
+
* @param componentName - Name of the component (e.g., 'Autocomplete', 'MultipleAutocomplete')
|
|
66
|
+
*/
|
|
67
|
+
export declare function warnDeprecatedGroupBy(componentName: string): void;
|
|
53
68
|
//# sourceMappingURL=utils.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/Autocomplete/utils.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/Autocomplete/utils.tsx"],"names":[],"mappings":"AAIA,eAAO,MAAM,qBAAqB,GAAI,KAAK,UAAW,KAAK,KAAG,MAI7D,CAAA;AAGD,eAAO,MAAM,wBAAwB,GAAI,KAAK,UACpC,KAAK,YACH,OAAO,KAChB,MAAM,CAAC,MAAM,EAAE,OAAO,CAIxB,CAAA;AAGD,eAAO,MAAM,uBAAuB,SAAU,MAAM,4CAEnD,CAAA;AAED;;;;;;;GAOG;AACH,wBAAgB,uBAAuB,CACrC,aAAa,EAAE,CAAC,MAAM,EAAE;IACtB,aAAa,EAAE,MAAM,CAAA;IACrB,UAAU,EAAE,MAAM,CAAA;IAClB,aAAa,EAAE,SAAS,OAAO,EAAE,CAAA;IACjC,QAAQ,EAAE,SAAS,OAAO,EAAE,CAAA;IAC5B,cAAc,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,MAAM,CAAA;CAC5C,KAAK,MAAM,EACZ,OAAO,GAAE,SAAS,OAAO,EAAO,EAChC,IAAI,GAAE,OAAO,GAAG,QAAkB,EAClC,cAAc,GAAE,CAAC,MAAM,EAAE,OAAO,KAAK,MAA8B,WAEjC,SAAS,OAAO,EAAE,oDA+BrD;AAED;;;;;;;;;;;;;;;;;;;;;;;;;;;GA2BG;AACH,wBAAgB,sBAAsB,CACpC,WAAW,EAAE,MAAM,EACnB,OAAO,EAAE,MAAM,EACf,kBAAkB,UAAO,mEAOtB;IACD,aAAa,EAAE,MAAM,CAAA;IACrB,UAAU,EAAE,MAAM,CAAA;IAClB,aAAa,EAAE,SAAS,OAAO,EAAE,CAAA;IACjC,cAAc,EAAE,CAAC,MAAM,EAAE,OAAO,KAAK,MAAM,CAAA;CAC5C,YASF;AAED;;;;;GAKG;AACH,wBAAgB,6BAA6B,CAAC,CAAC,EAC7C,OAAO,EAAE,CAAC,EAAE,EACZ,OAAO,EAAE,CAAC,MAAM,EAAE,CAAC,KAAK,MAAM,GAC7B,CAAC,CAAC,GAAG;IAAE,eAAe,EAAE,IAAI,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAC,EAAE,CA+BlD;AAED;;;GAGG;AACH,wBAAgB,qBAAqB,CAAC,aAAa,EAAE,MAAM,GAAG,IAAI,CAejE"}
|
package/package.json
CHANGED
|
@@ -1,35 +0,0 @@
|
|
|
1
|
-
import { default as React, HTMLAttributes } from 'react';
|
|
2
|
-
export type ListboxWithFilterProps = HTMLAttributes<HTMLElement> & {
|
|
3
|
-
showFilters?: boolean;
|
|
4
|
-
allSelected?: boolean;
|
|
5
|
-
someSelected?: boolean;
|
|
6
|
-
handleSelectAll?: () => void;
|
|
7
|
-
multiple?: boolean;
|
|
8
|
-
extended?: boolean;
|
|
9
|
-
/**
|
|
10
|
-
* Height of each item in pixels
|
|
11
|
-
*/
|
|
12
|
-
itemHeight?: number;
|
|
13
|
-
/**
|
|
14
|
-
* Maximum height of the listbox in pixels
|
|
15
|
-
*/
|
|
16
|
-
maxListHeight?: number;
|
|
17
|
-
};
|
|
18
|
-
declare const ListboxWithFilter: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLElement> & {
|
|
19
|
-
showFilters?: boolean;
|
|
20
|
-
allSelected?: boolean;
|
|
21
|
-
someSelected?: boolean;
|
|
22
|
-
handleSelectAll?: () => void;
|
|
23
|
-
multiple?: boolean;
|
|
24
|
-
extended?: boolean;
|
|
25
|
-
/**
|
|
26
|
-
* Height of each item in pixels
|
|
27
|
-
*/
|
|
28
|
-
itemHeight?: number;
|
|
29
|
-
/**
|
|
30
|
-
* Maximum height of the listbox in pixels
|
|
31
|
-
*/
|
|
32
|
-
maxListHeight?: number;
|
|
33
|
-
} & React.RefAttributes<HTMLUListElement>>;
|
|
34
|
-
export default ListboxWithFilter;
|
|
35
|
-
//# sourceMappingURL=ListBoxWithFilter.d.ts.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"ListBoxWithFilter.d.ts","sourceRoot":"","sources":["../../../../../src/components/molecules/Autocomplete/ListBoxWithFilter.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAA4B,cAAc,EAAW,MAAM,OAAO,CAAA;AAUhF,MAAM,MAAM,sBAAsB,GAAG,cAAc,CAAC,WAAW,CAAC,GAAG;IACjE,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,eAAe,CAAC,EAAE,MAAM,IAAI,CAAA;IAC5B,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB;;OAEG;IACH,aAAa,CAAC,EAAE,MAAM,CAAA;CACvB,CAAA;AAyFD,QAAA,MAAM,iBAAiB;kBAvGP,OAAO;kBACP,OAAO;mBACN,OAAO;sBACJ,MAAM,IAAI;eACjB,OAAO;eACP,OAAO;IAClB;;OAEG;iBACU,MAAM;IACnB;;OAEG;oBACa,MAAM;0CA0FgC,CAAA;AACxD,eAAe,iBAAiB,CAAA"}
|