@carto/meridian-ds 2.6.0 → 2.6.1-alpha-searchfield.3
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/CHANGELOG.md +10 -0
- package/dist/{Alert-DHd9hCGz.js → Alert-BN993lHa.js} +8 -5
- package/dist/{Alert-DOeOwxOe.cjs → Alert-CL9Y3l7D.cjs} +8 -5
- package/dist/{MenuItem-CYJN2OVU.cjs → MenuItem-Bssr5qGq.cjs} +1 -1
- package/dist/{MenuItem-MUmADf3e.js → MenuItem-COajCLkS.js} +1 -1
- package/dist/{SwatchSquare-CaaLsjAC.js → Search-C7wkXu3f.js} +4 -23
- package/dist/{SwatchSquare-B8PIY3Rd.cjs → Search-CMWbM9nD.cjs} +3 -22
- package/dist/SwatchSquare-B6KYVoqV.js +24 -0
- package/dist/SwatchSquare-DuXPIL7t.cjs +23 -0
- package/dist/components/index.cjs +315 -33
- package/dist/components/index.js +318 -36
- package/dist/{css-utils-CCi3p7os.cjs → css-utils-CqIN_t7x.cjs} +3 -0
- package/dist/{css-utils-WejOmkiI.js → css-utils-hxI-qUxK.js} +3 -0
- package/dist/custom-icons/index.cjs +643 -558
- package/dist/custom-icons/index.js +643 -558
- package/dist/theme/index.cjs +14 -4
- package/dist/theme/index.js +15 -5
- package/dist/types/components/Autocomplete/CreatableAutocomplete/CreatableAutocomplete.stories.d.ts +25 -0
- package/dist/types/components/Autocomplete/CreatableAutocomplete/CreatableAutocomplete.stories.d.ts.map +1 -1
- package/dist/types/components/Autocomplete/CreatableAutocomplete/useCreatableAutocomplete.d.ts.map +1 -1
- package/dist/types/components/Autocomplete/MultipleAutocomplete/useMultipleAutocomplete.d.ts.map +1 -1
- package/dist/types/components/Autocomplete/types.d.ts +4 -1
- package/dist/types/components/Autocomplete/types.d.ts.map +1 -1
- package/dist/types/components/CopiableComponent/CopiableComponent.d.ts.map +1 -1
- package/dist/types/components/CopiableComponent/CopiableComponent.stories.d.ts +3 -0
- package/dist/types/components/CopiableComponent/CopiableComponent.stories.d.ts.map +1 -1
- package/dist/types/components/CopiableComponent/types.d.ts +8 -1
- package/dist/types/components/CopiableComponent/types.d.ts.map +1 -1
- package/dist/types/components/FilterDropdown/FilterDropdown.d.ts +1 -1
- package/dist/types/components/FilterDropdown/FilterDropdown.d.ts.map +1 -1
- package/dist/types/components/FilterDropdown/FilterDropdown.stories.d.ts +48 -0
- package/dist/types/components/FilterDropdown/FilterDropdown.stories.d.ts.map +1 -1
- package/dist/types/components/FilterDropdown/types.d.ts +8 -0
- package/dist/types/components/FilterDropdown/types.d.ts.map +1 -1
- package/dist/types/components/Menu/MenuItemFilter/MenuItemFilter.d.ts.map +1 -1
- package/dist/types/components/Menu/types.d.ts +1 -0
- package/dist/types/components/Menu/types.d.ts.map +1 -1
- package/dist/types/components/SearchField/SearchField.d.ts +4 -0
- package/dist/types/components/SearchField/SearchField.d.ts.map +1 -0
- package/dist/types/components/SearchField/SearchField.stories.d.ts +131 -0
- package/dist/types/components/SearchField/SearchField.stories.d.ts.map +1 -0
- package/dist/types/components/SearchField/SearchField.styled.d.ts +23 -0
- package/dist/types/components/SearchField/SearchField.styled.d.ts.map +1 -0
- package/dist/types/components/SearchField/SearchField.test.d.ts +2 -0
- package/dist/types/components/SearchField/SearchField.test.d.ts.map +1 -0
- package/dist/types/components/SearchField/index.d.ts +3 -0
- package/dist/types/components/SearchField/index.d.ts.map +1 -0
- package/dist/types/components/SearchField/types.d.ts +31 -0
- package/dist/types/components/SearchField/types.d.ts.map +1 -0
- package/dist/types/components/SelectField/MultipleSelectField/MultipleSelectField.d.ts.map +1 -1
- package/dist/types/components/SelectField/MultipleSelectField/MultipleSelectField.stories.d.ts +22 -2
- package/dist/types/components/SelectField/MultipleSelectField/MultipleSelectField.stories.d.ts.map +1 -1
- package/dist/types/components/SelectField/types.d.ts +4 -0
- package/dist/types/components/SelectField/types.d.ts.map +1 -1
- package/dist/types/components/index.d.ts +2 -0
- package/dist/types/components/index.d.ts.map +1 -1
- package/dist/types/custom-icons/FoldersStackedOutlined.d.ts +4 -0
- package/dist/types/custom-icons/FoldersStackedOutlined.d.ts.map +1 -0
- package/dist/types/custom-icons/RedoAlt.d.ts +4 -0
- package/dist/types/custom-icons/RedoAlt.d.ts.map +1 -0
- package/dist/types/custom-icons/SelectFeature.d.ts.map +1 -1
- package/dist/types/custom-icons/UndoAlt.d.ts +4 -0
- package/dist/types/custom-icons/UndoAlt.d.ts.map +1 -0
- package/dist/types/custom-icons/index.d.ts +3 -0
- package/dist/types/custom-icons/index.d.ts.map +1 -1
- package/dist/types/localization/en.d.ts +1 -0
- package/dist/types/localization/en.d.ts.map +1 -1
- package/dist/types/localization/es.d.ts +1 -0
- package/dist/types/localization/es.d.ts.map +1 -1
- package/dist/types/localization/id.d.ts +1 -0
- package/dist/types/localization/id.d.ts.map +1 -1
- package/dist/types/localization/index.d.ts +3 -0
- package/dist/types/localization/index.d.ts.map +1 -1
- package/dist/types/theme/carto-theme.d.ts.map +1 -1
- package/dist/types/theme/components/layout.d.ts +3 -0
- package/dist/types/theme/components/layout.d.ts.map +1 -0
- package/dist/types/theme/components/navigation.d.ts.map +1 -1
- package/dist/types/utils/useTranslationWithFallback.d.ts +39 -0
- package/dist/types/utils/useTranslationWithFallback.d.ts.map +1 -0
- package/dist/types/utils/useTranslationWithFallback.test.d.ts +2 -0
- package/dist/types/utils/useTranslationWithFallback.test.d.ts.map +1 -0
- package/dist/widgets/index.cjs +8 -7
- package/dist/widgets/index.js +4 -3
- package/package.json +1 -1
- package/dist/types/utils/useTranslationFallback.d.ts +0 -20
- package/dist/types/utils/useTranslationFallback.d.ts.map +0 -1
- package/dist/types/utils/useTranslationFallback.test.d.ts +0 -2
- package/dist/types/utils/useTranslationFallback.test.d.ts.map +0 -1
package/CHANGELOG.md
CHANGED
|
@@ -2,8 +2,18 @@
|
|
|
2
2
|
|
|
3
3
|
## Unreleased
|
|
4
4
|
|
|
5
|
+
- New SearchField component [#308](https://github.com/CartoDB/meridian-ds/pull/308)
|
|
6
|
+
- Improve translations handling in Meridian (part 1) [#304](https://github.com/CartoDB/meridian-ds/pull/304)
|
|
7
|
+
- FilterDropdown: improve customization [#312](https://github.com/CartoDB/meridian-ds/pull/312)
|
|
8
|
+
- CopiableComponent: improve customization [#311](https://github.com/CartoDB/meridian-ds/pull/311)
|
|
9
|
+
|
|
5
10
|
## 2.0
|
|
6
11
|
|
|
12
|
+
### 2.6.1
|
|
13
|
+
|
|
14
|
+
- Custom Icons: FoldersStackedOutlined,RedoAlt,UndoAlt [#317](https://github.com/CartoDB/meridian-ds/pull/317)
|
|
15
|
+
- Tabs: remove box-shadow in vertical mode[#302](https://github.com/CartoDB/meridian-ds/pull/302)
|
|
16
|
+
|
|
7
17
|
### 2.6.0
|
|
8
18
|
|
|
9
19
|
- New EllipsisWithTooltip component [#299](https://github.com/CartoDB/meridian-ds/pull/299)
|
|
@@ -3,7 +3,7 @@ import { forwardRef, useState } from "react";
|
|
|
3
3
|
import { styled, Link as Link$1, Alert as Alert$1, Fade, AlertTitle } from "@mui/material";
|
|
4
4
|
import { OpenInNewOutlined } from "@mui/icons-material";
|
|
5
5
|
import "cartocolor";
|
|
6
|
-
import { u as useImperativeIntl, c as ICON_SIZE_SMALL, b as ICON_SIZE_MEDIUM, T as Typography } from "./css-utils-
|
|
6
|
+
import { u as useImperativeIntl, c as ICON_SIZE_SMALL, b as ICON_SIZE_MEDIUM, T as Typography } from "./css-utils-hxI-qUxK.js";
|
|
7
7
|
import { useIntl } from "react-intl";
|
|
8
8
|
const ScreenReaderOnly = styled("span")(() => ({
|
|
9
9
|
position: "absolute",
|
|
@@ -16,13 +16,16 @@ const ScreenReaderOnly = styled("span")(() => ({
|
|
|
16
16
|
whiteSpace: "nowrap",
|
|
17
17
|
border: 0
|
|
18
18
|
}));
|
|
19
|
-
function
|
|
19
|
+
function useTranslationWithFallback(translationKey, customText, intlValues) {
|
|
20
20
|
const intl = useIntl();
|
|
21
21
|
const intlConfig = useImperativeIntl(intl);
|
|
22
22
|
if (customText !== void 0 && customText !== null) {
|
|
23
23
|
return customText;
|
|
24
24
|
}
|
|
25
|
-
return intlConfig.formatMessage(
|
|
25
|
+
return intlConfig.formatMessage(
|
|
26
|
+
{ id: translationKey },
|
|
27
|
+
intlValues
|
|
28
|
+
);
|
|
26
29
|
}
|
|
27
30
|
const StyledLink = styled(Link$1)(() => ({
|
|
28
31
|
display: "inline-block"
|
|
@@ -82,7 +85,7 @@ function _Link({
|
|
|
82
85
|
"aria-describedby": ariaDescribedby,
|
|
83
86
|
...otherProps
|
|
84
87
|
}, ref) {
|
|
85
|
-
const screenReaderTextValue =
|
|
88
|
+
const screenReaderTextValue = useTranslationWithFallback(
|
|
86
89
|
"c4r.button.opensInNewTab",
|
|
87
90
|
screenReaderText
|
|
88
91
|
);
|
|
@@ -242,5 +245,5 @@ export {
|
|
|
242
245
|
Alert as A,
|
|
243
246
|
Link as L,
|
|
244
247
|
ScreenReaderOnly as S,
|
|
245
|
-
|
|
248
|
+
useTranslationWithFallback as u
|
|
246
249
|
};
|
|
@@ -4,7 +4,7 @@ const React = require("react");
|
|
|
4
4
|
const material = require("@mui/material");
|
|
5
5
|
const iconsMaterial = require("@mui/icons-material");
|
|
6
6
|
require("cartocolor");
|
|
7
|
-
const cssUtils = require("./css-utils-
|
|
7
|
+
const cssUtils = require("./css-utils-CqIN_t7x.cjs");
|
|
8
8
|
const reactIntl = require("react-intl");
|
|
9
9
|
const ScreenReaderOnly = material.styled("span")(() => ({
|
|
10
10
|
position: "absolute",
|
|
@@ -17,13 +17,16 @@ const ScreenReaderOnly = material.styled("span")(() => ({
|
|
|
17
17
|
whiteSpace: "nowrap",
|
|
18
18
|
border: 0
|
|
19
19
|
}));
|
|
20
|
-
function
|
|
20
|
+
function useTranslationWithFallback(translationKey, customText, intlValues) {
|
|
21
21
|
const intl = reactIntl.useIntl();
|
|
22
22
|
const intlConfig = cssUtils.useImperativeIntl(intl);
|
|
23
23
|
if (customText !== void 0 && customText !== null) {
|
|
24
24
|
return customText;
|
|
25
25
|
}
|
|
26
|
-
return intlConfig.formatMessage(
|
|
26
|
+
return intlConfig.formatMessage(
|
|
27
|
+
{ id: translationKey },
|
|
28
|
+
intlValues
|
|
29
|
+
);
|
|
27
30
|
}
|
|
28
31
|
const StyledLink = material.styled(material.Link)(() => ({
|
|
29
32
|
display: "inline-block"
|
|
@@ -83,7 +86,7 @@ function _Link({
|
|
|
83
86
|
"aria-describedby": ariaDescribedby,
|
|
84
87
|
...otherProps
|
|
85
88
|
}, ref) {
|
|
86
|
-
const screenReaderTextValue =
|
|
89
|
+
const screenReaderTextValue = useTranslationWithFallback(
|
|
87
90
|
"c4r.button.opensInNewTab",
|
|
88
91
|
screenReaderText
|
|
89
92
|
);
|
|
@@ -242,4 +245,4 @@ const Alert = React.forwardRef(_Alert);
|
|
|
242
245
|
exports.Alert = Alert;
|
|
243
246
|
exports.Link = Link;
|
|
244
247
|
exports.ScreenReaderOnly = ScreenReaderOnly;
|
|
245
|
-
exports.
|
|
248
|
+
exports.useTranslationWithFallback = useTranslationWithFallback;
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
const jsxRuntime = require("react/jsx-runtime");
|
|
3
3
|
const React = require("react");
|
|
4
4
|
const material = require("@mui/material");
|
|
5
|
-
const cssUtils = require("./css-utils-
|
|
5
|
+
const cssUtils = require("./css-utils-CqIN_t7x.cjs");
|
|
6
6
|
const StyledMenuItem = material.styled(material.MenuItem, {
|
|
7
7
|
shouldForwardProp: (prop) => !["subtitle", "destructive", "extended", "fixed", "iconColor"].includes(
|
|
8
8
|
prop
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import { forwardRef } from "react";
|
|
3
3
|
import { styled, MenuItem as MenuItem$1 } from "@mui/material";
|
|
4
|
-
import { f as MENU_ITEM_SIZE_DENSE, h as MENU_ITEM_SIZE_EXTENDED } from "./css-utils-
|
|
4
|
+
import { f as MENU_ITEM_SIZE_DENSE, h as MENU_ITEM_SIZE_EXTENDED } from "./css-utils-hxI-qUxK.js";
|
|
5
5
|
const StyledMenuItem = styled(MenuItem$1, {
|
|
6
6
|
shouldForwardProp: (prop) => !["subtitle", "destructive", "extended", "fixed", "iconColor"].includes(
|
|
7
7
|
prop
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { jsx } from "react/jsx-runtime";
|
|
2
2
|
import { forwardRef } from "react";
|
|
3
3
|
import { createSvgIcon } from "@mui/material";
|
|
4
|
-
const Icon
|
|
4
|
+
const Icon = () => /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", children: /* @__PURE__ */ jsx(
|
|
5
5
|
"path",
|
|
6
6
|
{
|
|
7
7
|
fill: "currentColor",
|
|
@@ -10,26 +10,8 @@ const Icon$1 = () => /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000
|
|
|
10
10
|
clipRule: "evenodd"
|
|
11
11
|
}
|
|
12
12
|
) });
|
|
13
|
-
const BaseSvgIcon
|
|
13
|
+
const BaseSvgIcon = createSvgIcon(Icon(), "Search");
|
|
14
14
|
function Search({ width, height, sx, ...props }, ref) {
|
|
15
|
-
return /* @__PURE__ */ jsx(
|
|
16
|
-
BaseSvgIcon$1,
|
|
17
|
-
{
|
|
18
|
-
ref,
|
|
19
|
-
viewBox: "0 0 24 24",
|
|
20
|
-
sx: {
|
|
21
|
-
width,
|
|
22
|
-
height: height || width,
|
|
23
|
-
...sx
|
|
24
|
-
},
|
|
25
|
-
...props
|
|
26
|
-
}
|
|
27
|
-
);
|
|
28
|
-
}
|
|
29
|
-
const Search$1 = forwardRef(Search);
|
|
30
|
-
const Icon = () => /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", children: /* @__PURE__ */ jsx("rect", { width: 16, height: 16, x: 4, y: 4, fill: "currentColor", rx: 2 }) });
|
|
31
|
-
const BaseSvgIcon = createSvgIcon(Icon(), "SwatchSquare");
|
|
32
|
-
function SwatchSquare({ width, height, sx, ...props }, ref) {
|
|
33
15
|
return /* @__PURE__ */ jsx(
|
|
34
16
|
BaseSvgIcon,
|
|
35
17
|
{
|
|
@@ -44,8 +26,7 @@ function SwatchSquare({ width, height, sx, ...props }, ref) {
|
|
|
44
26
|
}
|
|
45
27
|
);
|
|
46
28
|
}
|
|
47
|
-
const
|
|
29
|
+
const Search$1 = forwardRef(Search);
|
|
48
30
|
export {
|
|
49
|
-
Search$1 as S
|
|
50
|
-
SwatchSquare$1 as a
|
|
31
|
+
Search$1 as S
|
|
51
32
|
};
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
const jsxRuntime = require("react/jsx-runtime");
|
|
3
3
|
const React = require("react");
|
|
4
4
|
const material = require("@mui/material");
|
|
5
|
-
const Icon
|
|
5
|
+
const Icon = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", children: /* @__PURE__ */ jsxRuntime.jsx(
|
|
6
6
|
"path",
|
|
7
7
|
{
|
|
8
8
|
fill: "currentColor",
|
|
@@ -11,26 +11,8 @@ const Icon$1 = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.
|
|
|
11
11
|
clipRule: "evenodd"
|
|
12
12
|
}
|
|
13
13
|
) });
|
|
14
|
-
const BaseSvgIcon
|
|
14
|
+
const BaseSvgIcon = material.createSvgIcon(Icon(), "Search");
|
|
15
15
|
function Search({ width, height, sx, ...props }, ref) {
|
|
16
|
-
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
17
|
-
BaseSvgIcon$1,
|
|
18
|
-
{
|
|
19
|
-
ref,
|
|
20
|
-
viewBox: "0 0 24 24",
|
|
21
|
-
sx: {
|
|
22
|
-
width,
|
|
23
|
-
height: height || width,
|
|
24
|
-
...sx
|
|
25
|
-
},
|
|
26
|
-
...props
|
|
27
|
-
}
|
|
28
|
-
);
|
|
29
|
-
}
|
|
30
|
-
const Search$1 = React.forwardRef(Search);
|
|
31
|
-
const Icon = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", children: /* @__PURE__ */ jsxRuntime.jsx("rect", { width: 16, height: 16, x: 4, y: 4, fill: "currentColor", rx: 2 }) });
|
|
32
|
-
const BaseSvgIcon = material.createSvgIcon(Icon(), "SwatchSquare");
|
|
33
|
-
function SwatchSquare({ width, height, sx, ...props }, ref) {
|
|
34
16
|
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
35
17
|
BaseSvgIcon,
|
|
36
18
|
{
|
|
@@ -45,6 +27,5 @@ function SwatchSquare({ width, height, sx, ...props }, ref) {
|
|
|
45
27
|
}
|
|
46
28
|
);
|
|
47
29
|
}
|
|
48
|
-
const
|
|
30
|
+
const Search$1 = React.forwardRef(Search);
|
|
49
31
|
exports.Search = Search$1;
|
|
50
|
-
exports.SwatchSquare = SwatchSquare$1;
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { jsx } from "react/jsx-runtime";
|
|
2
|
+
import { forwardRef } from "react";
|
|
3
|
+
import { createSvgIcon } from "@mui/material";
|
|
4
|
+
const Icon = () => /* @__PURE__ */ jsx("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", children: /* @__PURE__ */ jsx("rect", { width: 16, height: 16, x: 4, y: 4, fill: "currentColor", rx: 2 }) });
|
|
5
|
+
const BaseSvgIcon = createSvgIcon(Icon(), "SwatchSquare");
|
|
6
|
+
function SwatchSquare({ width, height, sx, ...props }, ref) {
|
|
7
|
+
return /* @__PURE__ */ jsx(
|
|
8
|
+
BaseSvgIcon,
|
|
9
|
+
{
|
|
10
|
+
ref,
|
|
11
|
+
viewBox: "0 0 24 24",
|
|
12
|
+
sx: {
|
|
13
|
+
width,
|
|
14
|
+
height: height || width,
|
|
15
|
+
...sx
|
|
16
|
+
},
|
|
17
|
+
...props
|
|
18
|
+
}
|
|
19
|
+
);
|
|
20
|
+
}
|
|
21
|
+
const SwatchSquare$1 = forwardRef(SwatchSquare);
|
|
22
|
+
export {
|
|
23
|
+
SwatchSquare$1 as S
|
|
24
|
+
};
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
const jsxRuntime = require("react/jsx-runtime");
|
|
3
|
+
const React = require("react");
|
|
4
|
+
const material = require("@mui/material");
|
|
5
|
+
const Icon = () => /* @__PURE__ */ jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", fill: "none", children: /* @__PURE__ */ jsxRuntime.jsx("rect", { width: 16, height: 16, x: 4, y: 4, fill: "currentColor", rx: 2 }) });
|
|
6
|
+
const BaseSvgIcon = material.createSvgIcon(Icon(), "SwatchSquare");
|
|
7
|
+
function SwatchSquare({ width, height, sx, ...props }, ref) {
|
|
8
|
+
return /* @__PURE__ */ jsxRuntime.jsx(
|
|
9
|
+
BaseSvgIcon,
|
|
10
|
+
{
|
|
11
|
+
ref,
|
|
12
|
+
viewBox: "0 0 24 24",
|
|
13
|
+
sx: {
|
|
14
|
+
width,
|
|
15
|
+
height: height || width,
|
|
16
|
+
...sx
|
|
17
|
+
},
|
|
18
|
+
...props
|
|
19
|
+
}
|
|
20
|
+
);
|
|
21
|
+
}
|
|
22
|
+
const SwatchSquare$1 = React.forwardRef(SwatchSquare);
|
|
23
|
+
exports.SwatchSquare = SwatchSquare$1;
|