@digigov/react-core 2.0.0-rc.1 → 2.0.0-rc.11
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/AdminAside/__snapshots__/index.test.tsx.snap +7 -3
- package/AdminAside/index.js +6 -2
- package/AdminContainer/__snapshots__/index.test.tsx.snap +35 -7
- package/AdminContainer/index.d.ts +8 -1
- package/AdminContainer/index.js +6 -7
- package/AdminContainer/index.test/index.js +6 -0
- package/AdminMain/__snapshots__/index.test.tsx.snap +6 -3
- package/AdminMain/index.js +7 -2
- package/{src/AutoCompleteWrapper → AutoCompleteContainer}/__snapshots__/index.test.tsx.snap +4 -4
- package/AutoCompleteContainer/index.d.ts +22 -0
- package/{AutoCompleteWrapper → AutoCompleteContainer}/index.js +5 -5
- package/AutoCompleteContainer/index.test/index.js +7 -0
- package/{AutoCompleteStatusWrapper → AutoCompleteContainer}/index.test/package.json +1 -1
- package/{AutoCompleteStatusWrapper → AutoCompleteContainer}/package.json +1 -1
- package/AutoCompleteInput/__snapshots__/index.test.tsx.snap +14 -50
- package/AutoCompleteInput/index.d.ts +1 -9
- package/AutoCompleteInput/index.js +2 -4
- package/AutoCompleteInput/index.test/index.js +5 -19
- package/AutoCompleteMultipleInput/index.d.ts +9 -0
- package/AutoCompleteMultipleInput/index.js +21 -0
- package/{AutoCompleteWrapper/index.test → AutoCompleteMultipleInput}/package.json +1 -1
- package/AutoCompleteMultipleInputContainer/index.d.ts +12 -0
- package/AutoCompleteMultipleInputContainer/index.js +24 -0
- package/AutoCompleteMultipleInputContainer/package.json +6 -0
- package/AutoCompleteResultList/__snapshots__/index.test.tsx.snap +2 -38
- package/AutoCompleteResultList/index.d.ts +1 -10
- package/AutoCompleteResultList/index.js +2 -3
- package/AutoCompleteResultList/index.test/index.js +0 -14
- package/AutoCompleteStatus/__snapshots__/index.test.tsx.snap +2 -2
- package/AutoCompleteStatus/index.d.ts +1 -1
- package/AutoCompleteStatus/index.js +2 -2
- package/{AutoCompleteStatusWrapper → AutoCompleteStatusContainer}/__snapshots__/index.test.tsx.snap +4 -4
- package/AutoCompleteStatusContainer/index.d.ts +10 -0
- package/{AutoCompleteStatusWrapper → AutoCompleteStatusContainer}/index.js +5 -5
- package/AutoCompleteStatusContainer/index.test/index.js +7 -0
- package/AutoCompleteStatusContainer/index.test/package.json +6 -0
- package/AutoCompleteStatusContainer/package.json +6 -0
- package/Base/index.js +1 -1
- package/Card/__snapshots__/index.test.tsx.snap +42 -0
- package/Card/index.d.ts +8 -1
- package/Card/index.js +3 -2
- package/Card/index.test/index.js +21 -9
- package/DateInputItem/index.js +0 -2
- package/DropdownContent/index.d.ts +9 -1
- package/DropdownContent/index.js +6 -5
- package/FooterContentLogos/__snapshots__/index.test.tsx.snap +2 -2
- package/FooterContentLogos/index.js +1 -1
- package/Hidden/__snapshots__/index.test.tsx.snap +5 -5
- package/Hint/index.js +1 -1
- package/ImageLogo/__snapshots__/index.test.tsx.snap +2 -2
- package/ImageLogo/index.js +1 -2
- package/ImageLogoSet/__snapshots__/index.test.tsx.snap +10 -10
- package/KitchenSinkCard/index.d.ts +1 -1
- package/ModalContainer/index.d.ts +8 -1
- package/ModalContainer/index.js +8 -6
- package/ModalHeading/index.js +1 -2
- package/NormalText/__snapshots__/index.test.tsx.snap +60 -60
- package/NormalText/index.js +1 -1
- package/Paragraph/__snapshots__/index.test.tsx.snap +54 -54
- package/PhaseBannerHeaderContainer/__snapshots__/inde.test.tsx.snap +2 -2
- package/PhaseBannerHeaderContainer/index.js +1 -1
- package/Skeleton/__snapshots__/index.test.tsx.snap +296 -0
- package/{AutoCompleteStatusWrapper → Skeleton}/index.d.ts +44 -5
- package/Skeleton/index.js +35 -0
- package/Skeleton/index.test/index.js +64 -0
- package/Skeleton/index.test/package.json +6 -0
- package/Skeleton/index.test.d.ts +1 -0
- package/{AutoCompleteWrapper → Skeleton}/package.json +1 -1
- package/SummaryList/index.d.ts +10 -1
- package/SummaryList/index.js +4 -2
- package/Tabs/index.d.ts +1 -2
- package/Tabs/index.js +3 -4
- package/TabsHeading/__snapshots__/index.test.tsx.snap +3 -3
- package/Unpurge/index.js +1 -1
- package/cjs/AdminAside/__snapshots__/index.test.tsx.snap +7 -3
- package/cjs/AdminAside/index.js +6 -2
- package/cjs/AdminContainer/__snapshots__/index.test.tsx.snap +35 -7
- package/cjs/AdminContainer/index.js +6 -7
- package/cjs/AdminContainer/index.test/index.js +6 -0
- package/cjs/AdminMain/__snapshots__/index.test.tsx.snap +6 -3
- package/cjs/AdminMain/index.js +7 -2
- package/{AutoCompleteWrapper → cjs/AutoCompleteContainer}/__snapshots__/index.test.tsx.snap +4 -4
- package/cjs/{AutoCompleteWrapper → AutoCompleteContainer}/index.js +6 -6
- package/cjs/{AutoCompleteWrapper → AutoCompleteContainer}/index.test/index.js +2 -2
- package/cjs/AutoCompleteInput/__snapshots__/index.test.tsx.snap +14 -50
- package/cjs/AutoCompleteInput/index.js +2 -4
- package/cjs/AutoCompleteInput/index.test/index.js +5 -19
- package/cjs/AutoCompleteMultipleInput/index.js +28 -0
- package/cjs/AutoCompleteMultipleInputContainer/index.js +31 -0
- package/cjs/AutoCompleteResultList/__snapshots__/index.test.tsx.snap +2 -38
- package/cjs/AutoCompleteResultList/index.js +2 -3
- package/cjs/AutoCompleteResultList/index.test/index.js +0 -14
- package/cjs/AutoCompleteStatus/__snapshots__/index.test.tsx.snap +2 -2
- package/cjs/AutoCompleteStatus/index.js +2 -2
- package/cjs/{AutoCompleteStatusWrapper → AutoCompleteStatusContainer}/__snapshots__/index.test.tsx.snap +4 -4
- package/cjs/{AutoCompleteStatusWrapper → AutoCompleteStatusContainer}/index.js +6 -6
- package/cjs/{AutoCompleteStatusWrapper → AutoCompleteStatusContainer}/index.test/index.js +2 -2
- package/cjs/Base/index.js +1 -1
- package/cjs/Card/__snapshots__/index.test.tsx.snap +42 -0
- package/cjs/Card/index.js +3 -2
- package/cjs/Card/index.test/index.js +21 -9
- package/cjs/DateInputItem/index.js +0 -2
- package/cjs/DropdownContent/index.js +6 -5
- package/cjs/FooterContentLogos/__snapshots__/index.test.tsx.snap +2 -2
- package/cjs/FooterContentLogos/index.js +1 -1
- package/cjs/Hidden/__snapshots__/index.test.tsx.snap +5 -5
- package/cjs/Hint/index.js +1 -1
- package/cjs/ImageLogo/__snapshots__/index.test.tsx.snap +2 -2
- package/cjs/ImageLogo/index.js +1 -2
- package/cjs/ImageLogoSet/__snapshots__/index.test.tsx.snap +10 -10
- package/cjs/ModalContainer/index.js +8 -6
- package/cjs/ModalHeading/index.js +1 -2
- package/cjs/NormalText/__snapshots__/index.test.tsx.snap +60 -60
- package/cjs/NormalText/index.js +1 -1
- package/cjs/Paragraph/__snapshots__/index.test.tsx.snap +54 -54
- package/cjs/PhaseBannerHeaderContainer/__snapshots__/inde.test.tsx.snap +2 -2
- package/cjs/PhaseBannerHeaderContainer/index.js +1 -1
- package/cjs/Skeleton/__snapshots__/index.test.tsx.snap +296 -0
- package/cjs/Skeleton/index.js +42 -0
- package/cjs/Skeleton/index.test/index.js +67 -0
- package/cjs/SummaryList/index.js +4 -2
- package/cjs/Tabs/index.js +3 -4
- package/cjs/TabsHeading/__snapshots__/index.test.tsx.snap +3 -3
- package/cjs/Unpurge/index.js +1 -1
- package/cjs/index.js +26 -4
- package/cjs/lazy/index.js +30 -12
- package/cjs/registry/index.js +10 -4
- package/index.d.ts +3 -1
- package/index.js +4 -2
- package/lazy/index.js +24 -10
- package/lazy.d.ts +13 -11
- package/package.json +3 -3
- package/registry/index.js +10 -4
- package/registry.d.ts +5 -2
- package/src/AdminAside/__snapshots__/index.test.tsx.snap +7 -3
- package/src/AdminAside/index.tsx +6 -2
- package/src/AdminContainer/__snapshots__/index.test.tsx.snap +35 -7
- package/src/AdminContainer/index.test.tsx +3 -0
- package/src/AdminContainer/index.tsx +12 -11
- package/src/AdminMain/__snapshots__/index.test.tsx.snap +6 -3
- package/src/AdminMain/index.tsx +5 -2
- package/{cjs/AutoCompleteWrapper → src/AutoCompleteContainer}/__snapshots__/index.test.tsx.snap +4 -4
- package/src/{AutoCompleteWrapper → AutoCompleteContainer}/index.test.tsx +2 -2
- package/src/{AutoCompleteWrapper → AutoCompleteContainer}/index.tsx +8 -8
- package/src/AutoCompleteInput/__snapshots__/index.test.tsx.snap +14 -50
- package/src/AutoCompleteInput/index.test.tsx +4 -12
- package/src/AutoCompleteInput/index.tsx +2 -11
- package/src/AutoCompleteMultipleInput/index.tsx +28 -0
- package/src/AutoCompleteMultipleInputContainer/index.tsx +38 -0
- package/src/AutoCompleteResultList/__snapshots__/index.test.tsx.snap +2 -38
- package/src/AutoCompleteResultList/index.test.tsx +0 -20
- package/src/AutoCompleteResultList/index.tsx +1 -13
- package/src/AutoCompleteStatus/__snapshots__/index.test.tsx.snap +2 -2
- package/src/AutoCompleteStatus/index.tsx +2 -2
- package/src/AutoCompleteStatusContainer/__snapshots__/index.test.tsx.snap +16 -0
- package/src/AutoCompleteStatusContainer/index.test.tsx +10 -0
- package/src/AutoCompleteStatusContainer/index.tsx +28 -0
- package/src/Base/index.tsx +5 -5
- package/src/Card/__snapshots__/index.test.tsx.snap +42 -0
- package/src/Card/index.test.tsx +6 -0
- package/src/Card/index.tsx +9 -1
- package/src/DateInputItem/index.tsx +0 -2
- package/src/DropdownContent/index.tsx +10 -1
- package/src/FooterContentLogos/__snapshots__/index.test.tsx.snap +2 -2
- package/src/FooterContentLogos/index.tsx +1 -1
- package/src/Hidden/__snapshots__/index.test.tsx.snap +5 -5
- package/src/Hint/index.tsx +2 -2
- package/src/ImageLogo/__snapshots__/index.test.tsx.snap +2 -2
- package/src/ImageLogo/index.tsx +1 -2
- package/src/ImageLogoSet/__snapshots__/index.test.tsx.snap +10 -10
- package/src/ModalContainer/index.tsx +18 -14
- package/src/ModalHeading/index.tsx +2 -2
- package/src/NormalText/__snapshots__/index.test.tsx.snap +60 -60
- package/src/NormalText/index.tsx +2 -2
- package/src/Paragraph/__snapshots__/index.test.tsx.snap +54 -54
- package/src/PhaseBannerHeaderContainer/__snapshots__/inde.test.tsx.snap +2 -2
- package/src/PhaseBannerHeaderContainer/index.tsx +1 -1
- package/src/Skeleton/__snapshots__/index.test.tsx.snap +296 -0
- package/src/Skeleton/index.test.tsx +35 -0
- package/src/Skeleton/index.tsx +105 -0
- package/src/SummaryList/index.tsx +12 -1
- package/src/Tabs/index.tsx +1 -3
- package/src/TabsHeading/__snapshots__/index.test.tsx.snap +3 -3
- package/src/Unpurge/index.tsx +14 -2
- package/src/index.ts +3 -1
- package/src/lazy.js +4 -2
- package/src/registry.js +10 -4
- package/AutoCompleteStatusWrapper/index.test/index.js +0 -7
- package/AutoCompleteWrapper/index.d.ts +0 -22
- package/AutoCompleteWrapper/index.test/index.js +0 -7
- package/src/AutoCompleteStatusWrapper/__snapshots__/index.test.tsx.snap +0 -16
- package/src/AutoCompleteStatusWrapper/index.test.tsx +0 -10
- package/src/AutoCompleteStatusWrapper/index.tsx +0 -28
- /package/{AutoCompleteStatusWrapper → AutoCompleteContainer}/index.test.d.ts +0 -0
- /package/{AutoCompleteWrapper → AutoCompleteStatusContainer}/index.test.d.ts +0 -0
package/cjs/AdminMain/index.js
CHANGED
|
@@ -10,19 +10,24 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
|
|
|
10
10
|
var _react = _interopRequireDefault(require("react"));
|
|
11
11
|
var _clsx = _interopRequireDefault(require("clsx"));
|
|
12
12
|
var _Grid = _interopRequireDefault(require("@digigov/react-core/Grid"));
|
|
13
|
-
var _excluded = ["className", "children"];
|
|
13
|
+
var _excluded = ["className", "children", "id"];
|
|
14
14
|
/**
|
|
15
15
|
* Use this inside AdminContainer component for placing the main content of the page
|
|
16
16
|
*/
|
|
17
17
|
var AdminMain = exports.AdminMain = /*#__PURE__*/_react["default"].forwardRef(function AdminMain(_ref, ref) {
|
|
18
18
|
var className = _ref.className,
|
|
19
19
|
children = _ref.children,
|
|
20
|
+
_ref$id = _ref.id,
|
|
21
|
+
id = _ref$id === void 0 ? 'main-content' : _ref$id,
|
|
20
22
|
props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
|
|
21
23
|
return /*#__PURE__*/_react["default"].createElement(_Grid["default"], (0, _extends2["default"])({
|
|
22
24
|
item: true,
|
|
23
25
|
as: "main",
|
|
26
|
+
xs: 12,
|
|
27
|
+
md: 8,
|
|
28
|
+
lg: 9,
|
|
24
29
|
ref: ref,
|
|
25
|
-
className: (0, _clsx["default"])(className, true && 'ds-admin-main
|
|
30
|
+
className: (0, _clsx["default"])(className, true && 'ds-admin-main')
|
|
26
31
|
}, props), children);
|
|
27
32
|
});
|
|
28
33
|
var _default = exports["default"] = AdminMain;
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
|
2
2
|
|
|
3
3
|
exports[`renders the AdminContainer with no props 1`] = `
|
|
4
|
-
<ForwardRef(
|
|
4
|
+
<ForwardRef(AutoCompleteContainer)>
|
|
5
5
|
<ForwardRef(Base)
|
|
6
6
|
as="div"
|
|
7
|
-
className="ds-
|
|
7
|
+
className="ds-autocomplete__container"
|
|
8
8
|
>
|
|
9
9
|
<div
|
|
10
|
-
className="ds-
|
|
10
|
+
className="ds-autocomplete__container"
|
|
11
11
|
>
|
|
12
12
|
hello
|
|
13
13
|
</div>
|
|
14
14
|
</ForwardRef(Base)>
|
|
15
|
-
</ForwardRef(
|
|
15
|
+
</ForwardRef(AutoCompleteContainer)>
|
|
16
16
|
`;
|
|
@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
4
4
|
Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
|
-
exports["default"] = exports.
|
|
7
|
+
exports["default"] = exports.AutoCompleteContainer = void 0;
|
|
8
8
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
9
9
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
10
10
|
var _react = _interopRequireDefault(require("react"));
|
|
@@ -12,10 +12,10 @@ var _clsx = _interopRequireDefault(require("clsx"));
|
|
|
12
12
|
var _Base = _interopRequireDefault(require("@digigov/react-core/Base"));
|
|
13
13
|
var _excluded = ["className", "width", "children"];
|
|
14
14
|
/**
|
|
15
|
-
*
|
|
16
|
-
* Use
|
|
15
|
+
* AutoCompleteContainer is a wrapper for autocomplete element.
|
|
16
|
+
* Use AutoCompleteContainer to wrap autocomplete elements.
|
|
17
17
|
*/
|
|
18
|
-
var
|
|
18
|
+
var AutoCompleteContainer = exports.AutoCompleteContainer = /*#__PURE__*/_react["default"].forwardRef(function AutoCompleteContainer(_ref, ref) {
|
|
19
19
|
var className = _ref.className,
|
|
20
20
|
width = _ref.width,
|
|
21
21
|
children = _ref.children,
|
|
@@ -23,7 +23,7 @@ var AutoCompleteWrapper = exports.AutoCompleteWrapper = /*#__PURE__*/_react["def
|
|
|
23
23
|
return /*#__PURE__*/_react["default"].createElement(_Base["default"], (0, _extends2["default"])({
|
|
24
24
|
as: "div",
|
|
25
25
|
ref: ref,
|
|
26
|
-
className: (0, _clsx["default"])(className, width === '33.3%' && 'ds-!-width-one-third', width === '66.6%' && 'ds-!-width-two-thirds', width === 'full' && 'ds-!-width-full', width === '25%' && 'ds-!-width-one-quarter', width === '50%' && 'ds-!-width-one-half', width === '75%' && 'ds-!-width-three-quarters', true && 'ds-
|
|
26
|
+
className: (0, _clsx["default"])(className, width === '33.3%' && 'ds-!-width-one-third', width === '66.6%' && 'ds-!-width-two-thirds', width === 'full' && 'ds-!-width-full', width === '25%' && 'ds-!-width-one-quarter', width === '50%' && 'ds-!-width-one-half', width === '75%' && 'ds-!-width-three-quarters', true && 'ds-autocomplete__container')
|
|
27
27
|
}, props), children);
|
|
28
28
|
});
|
|
29
|
-
var _default = exports["default"] =
|
|
29
|
+
var _default = exports["default"] = AutoCompleteContainer;
|
|
@@ -3,8 +3,8 @@
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
4
|
var _react = _interopRequireDefault(require("react"));
|
|
5
5
|
var _enzyme = require("enzyme");
|
|
6
|
-
var
|
|
7
|
-
var _ref = /*#__PURE__*/_react["default"].createElement(
|
|
6
|
+
var _AutoCompleteContainer = _interopRequireDefault(require("@digigov/react-core/AutoCompleteContainer"));
|
|
7
|
+
var _ref = /*#__PURE__*/_react["default"].createElement(_AutoCompleteContainer["default"], null, "hello");
|
|
8
8
|
it('renders the AdminContainer with no props', function () {
|
|
9
9
|
expect((0, _enzyme.mount)(_ref)).toMatchSnapshot();
|
|
10
10
|
});
|
|
@@ -1,87 +1,51 @@
|
|
|
1
1
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
|
2
2
|
|
|
3
|
-
exports[`renders the AutoCompleteInput with
|
|
4
|
-
<ForwardRef(AutoCompleteInput)>
|
|
5
|
-
<ForwardRef(Base)
|
|
6
|
-
as="input"
|
|
7
|
-
className="ds-autocomplete__input--default ds-autocomplete__input"
|
|
8
|
-
type="text"
|
|
9
|
-
>
|
|
10
|
-
<input
|
|
11
|
-
className="ds-autocomplete__input--default ds-autocomplete__input"
|
|
12
|
-
type="text"
|
|
13
|
-
/>
|
|
14
|
-
</ForwardRef(Base)>
|
|
15
|
-
</ForwardRef(AutoCompleteInput)>
|
|
16
|
-
`;
|
|
17
|
-
|
|
18
|
-
exports[`renders the AutoCompleteInput with showAllValues 1`] = `
|
|
19
|
-
<ForwardRef(AutoCompleteInput)
|
|
20
|
-
showAllValues={true}
|
|
21
|
-
>
|
|
22
|
-
<ForwardRef(Base)
|
|
23
|
-
as="input"
|
|
24
|
-
className="ds-autocomplete__input--show-all-values ds-autocomplete__input"
|
|
25
|
-
type="text"
|
|
26
|
-
>
|
|
27
|
-
<input
|
|
28
|
-
className="ds-autocomplete__input--show-all-values ds-autocomplete__input"
|
|
29
|
-
type="text"
|
|
30
|
-
/>
|
|
31
|
-
</ForwardRef(Base)>
|
|
32
|
-
</ForwardRef(AutoCompleteInput)>
|
|
33
|
-
`;
|
|
34
|
-
|
|
35
|
-
exports[`renders the AutoCompleteInput with showAllValues 2`] = `
|
|
3
|
+
exports[`renders the AutoCompleteInput with isFocused 1`] = `
|
|
36
4
|
<ForwardRef(AutoCompleteInput)
|
|
37
|
-
|
|
5
|
+
isFocused={true}
|
|
38
6
|
>
|
|
39
7
|
<ForwardRef(Base)
|
|
40
8
|
as="input"
|
|
41
|
-
className="ds-autocomplete__input--
|
|
9
|
+
className="ds-autocomplete__input--focused ds-autocomplete__input"
|
|
42
10
|
type="text"
|
|
43
11
|
>
|
|
44
12
|
<input
|
|
45
|
-
className="ds-autocomplete__input--
|
|
13
|
+
className="ds-autocomplete__input--focused ds-autocomplete__input"
|
|
46
14
|
type="text"
|
|
47
15
|
/>
|
|
48
16
|
</ForwardRef(Base)>
|
|
49
17
|
</ForwardRef(AutoCompleteInput)>
|
|
50
18
|
`;
|
|
51
19
|
|
|
52
|
-
exports[`renders the AutoCompleteInput with
|
|
20
|
+
exports[`renders the AutoCompleteInput with isFocused and name props 1`] = `
|
|
53
21
|
<ForwardRef(AutoCompleteInput)
|
|
54
22
|
isFocused={true}
|
|
55
|
-
|
|
23
|
+
name="some-name"
|
|
56
24
|
>
|
|
57
25
|
<ForwardRef(Base)
|
|
58
26
|
as="input"
|
|
59
|
-
className="ds-autocomplete__input--
|
|
27
|
+
className="ds-autocomplete__input--focused ds-autocomplete__input"
|
|
28
|
+
name="some-name"
|
|
60
29
|
type="text"
|
|
61
30
|
>
|
|
62
31
|
<input
|
|
63
|
-
className="ds-autocomplete__input--
|
|
32
|
+
className="ds-autocomplete__input--focused ds-autocomplete__input"
|
|
33
|
+
name="some-name"
|
|
64
34
|
type="text"
|
|
65
35
|
/>
|
|
66
36
|
</ForwardRef(Base)>
|
|
67
37
|
</ForwardRef(AutoCompleteInput)>
|
|
68
38
|
`;
|
|
69
39
|
|
|
70
|
-
exports[`renders the AutoCompleteInput with
|
|
71
|
-
<ForwardRef(AutoCompleteInput)
|
|
72
|
-
isFocused={true}
|
|
73
|
-
name="some-name"
|
|
74
|
-
showAllValues={true}
|
|
75
|
-
>
|
|
40
|
+
exports[`renders the AutoCompleteInput with no props 1`] = `
|
|
41
|
+
<ForwardRef(AutoCompleteInput)>
|
|
76
42
|
<ForwardRef(Base)
|
|
77
43
|
as="input"
|
|
78
|
-
className="ds-autocomplete__input
|
|
79
|
-
name="some-name"
|
|
44
|
+
className="ds-autocomplete__input"
|
|
80
45
|
type="text"
|
|
81
46
|
>
|
|
82
47
|
<input
|
|
83
|
-
className="ds-autocomplete__input
|
|
84
|
-
name="some-name"
|
|
48
|
+
className="ds-autocomplete__input"
|
|
85
49
|
type="text"
|
|
86
50
|
/>
|
|
87
51
|
</ForwardRef(Base)>
|
|
@@ -10,7 +10,7 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
|
|
|
10
10
|
var _react = _interopRequireDefault(require("react"));
|
|
11
11
|
var _clsx = _interopRequireDefault(require("clsx"));
|
|
12
12
|
var _Base = _interopRequireDefault(require("@digigov/react-core/Base"));
|
|
13
|
-
var _excluded = ["name", "isFocused", "
|
|
13
|
+
var _excluded = ["name", "isFocused", "className"];
|
|
14
14
|
/**
|
|
15
15
|
* AutoCompleteInput component is used to display the value that the user is typing.
|
|
16
16
|
*
|
|
@@ -18,8 +18,6 @@ var _excluded = ["name", "isFocused", "showAllValues", "className"];
|
|
|
18
18
|
var AutoCompleteInput = exports.AutoCompleteInput = /*#__PURE__*/_react["default"].forwardRef(function AutoCompleteInput(_ref, ref) {
|
|
19
19
|
var name = _ref.name,
|
|
20
20
|
isFocused = _ref.isFocused,
|
|
21
|
-
_ref$showAllValues = _ref.showAllValues,
|
|
22
|
-
showAllValues = _ref$showAllValues === void 0 ? false : _ref$showAllValues,
|
|
23
21
|
className = _ref.className,
|
|
24
22
|
props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
|
|
25
23
|
return /*#__PURE__*/_react["default"].createElement(_Base["default"], (0, _extends2["default"])({
|
|
@@ -27,7 +25,7 @@ var AutoCompleteInput = exports.AutoCompleteInput = /*#__PURE__*/_react["default
|
|
|
27
25
|
type: "text",
|
|
28
26
|
name: name,
|
|
29
27
|
ref: ref,
|
|
30
|
-
className: (0, _clsx["default"])(className,
|
|
28
|
+
className: (0, _clsx["default"])(className, isFocused && 'ds-autocomplete__input--focused', true && 'ds-autocomplete__input')
|
|
31
29
|
}, props));
|
|
32
30
|
});
|
|
33
31
|
var _default = exports["default"] = AutoCompleteInput;
|
|
@@ -9,29 +9,15 @@ it('renders the AutoCompleteInput with no props', function () {
|
|
|
9
9
|
expect((0, _enzyme.mount)(_ref)).toMatchSnapshot();
|
|
10
10
|
});
|
|
11
11
|
var _ref2 = /*#__PURE__*/_react["default"].createElement(_AutoCompleteInput["default"], {
|
|
12
|
-
|
|
12
|
+
isFocused: true
|
|
13
13
|
});
|
|
14
|
-
it('renders the AutoCompleteInput with
|
|
14
|
+
it('renders the AutoCompleteInput with isFocused', function () {
|
|
15
15
|
expect((0, _enzyme.mount)(_ref2)).toMatchSnapshot();
|
|
16
16
|
});
|
|
17
17
|
var _ref3 = /*#__PURE__*/_react["default"].createElement(_AutoCompleteInput["default"], {
|
|
18
|
-
showAllValues: true
|
|
19
|
-
});
|
|
20
|
-
it('renders the AutoCompleteInput with showAllValues', function () {
|
|
21
|
-
expect((0, _enzyme.mount)(_ref3)).toMatchSnapshot();
|
|
22
|
-
});
|
|
23
|
-
var _ref4 = /*#__PURE__*/_react["default"].createElement(_AutoCompleteInput["default"], {
|
|
24
|
-
isFocused: true,
|
|
25
|
-
showAllValues: true
|
|
26
|
-
});
|
|
27
|
-
it('renders the AutoCompleteInput with showAllValues isFocused', function () {
|
|
28
|
-
expect((0, _enzyme.mount)(_ref4)).toMatchSnapshot();
|
|
29
|
-
});
|
|
30
|
-
var _ref5 = /*#__PURE__*/_react["default"].createElement(_AutoCompleteInput["default"], {
|
|
31
18
|
name: "some-name",
|
|
32
|
-
isFocused: true
|
|
33
|
-
showAllValues: true
|
|
19
|
+
isFocused: true
|
|
34
20
|
});
|
|
35
|
-
it('renders the AutoCompleteInput with
|
|
36
|
-
expect((0, _enzyme.mount)(
|
|
21
|
+
it('renders the AutoCompleteInput with isFocused and name props', function () {
|
|
22
|
+
expect((0, _enzyme.mount)(_ref3)).toMatchSnapshot();
|
|
37
23
|
});
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports["default"] = exports.AutoCompleteMultipleInput = void 0;
|
|
8
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
9
|
+
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
10
|
+
var _react = _interopRequireDefault(require("react"));
|
|
11
|
+
var _clsx = _interopRequireDefault(require("clsx"));
|
|
12
|
+
var _Base = _interopRequireDefault(require("@digigov/react-core/Base"));
|
|
13
|
+
var _excluded = ["children", "className"];
|
|
14
|
+
/**
|
|
15
|
+
* AutoCompleteMultipleInput is used inside AutoCompleteMultipleInputContainer for multiple values input.
|
|
16
|
+
*/
|
|
17
|
+
var AutoCompleteMultipleInput = exports.AutoCompleteMultipleInput = /*#__PURE__*/_react["default"].forwardRef(function AutoCompleteMultipleInput(_ref, ref) {
|
|
18
|
+
var children = _ref.children,
|
|
19
|
+
className = _ref.className,
|
|
20
|
+
props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
|
|
21
|
+
return /*#__PURE__*/_react["default"].createElement(_Base["default"], (0, _extends2["default"])({
|
|
22
|
+
as: "input",
|
|
23
|
+
type: "text",
|
|
24
|
+
ref: ref,
|
|
25
|
+
className: (0, _clsx["default"])(className, true && 'ds-autocomplete__multi-input')
|
|
26
|
+
}, props), children);
|
|
27
|
+
});
|
|
28
|
+
var _default = exports["default"] = AutoCompleteMultipleInput;
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports["default"] = exports.AutoCompleteMultipleInputContainer = void 0;
|
|
8
|
+
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
9
|
+
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
10
|
+
var _react = _interopRequireDefault(require("react"));
|
|
11
|
+
var _clsx = _interopRequireDefault(require("clsx"));
|
|
12
|
+
var _Base = _interopRequireDefault(require("@digigov/react-core/Base"));
|
|
13
|
+
var _excluded = ["numberOfSelected", "open", "children", "isFocused", "className"];
|
|
14
|
+
/**
|
|
15
|
+
* Use AutoCompleteMultipleInputContainer to accept multiple values input.
|
|
16
|
+
*/
|
|
17
|
+
var AutoCompleteMultipleInputContainer = exports.AutoCompleteMultipleInputContainer = /*#__PURE__*/_react["default"].forwardRef(function AutoCompleteMultipleInputContainer(_ref, ref) {
|
|
18
|
+
var _ref$numberOfSelected = _ref.numberOfSelected,
|
|
19
|
+
numberOfSelected = _ref$numberOfSelected === void 0 ? 'all' : _ref$numberOfSelected,
|
|
20
|
+
open = _ref.open,
|
|
21
|
+
children = _ref.children,
|
|
22
|
+
isFocused = _ref.isFocused,
|
|
23
|
+
className = _ref.className,
|
|
24
|
+
props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
|
|
25
|
+
return /*#__PURE__*/_react["default"].createElement(_Base["default"], (0, _extends2["default"])({
|
|
26
|
+
as: "div",
|
|
27
|
+
ref: ref,
|
|
28
|
+
className: (0, _clsx["default"])(className, typeof numberOfSelected === 'number' && "ds-autocomplete__multi-input-container--".concat(numberOfSelected), isFocused && 'ds-autocomplete__multi-input-container--focused', true && 'ds-autocomplete__multi-input-container')
|
|
29
|
+
}, props), children);
|
|
30
|
+
});
|
|
31
|
+
var _default = exports["default"] = AutoCompleteMultipleInputContainer;
|
|
@@ -1,51 +1,15 @@
|
|
|
1
1
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
|
2
2
|
|
|
3
|
-
exports[`renders the AutoCompleteResultList with isVisible displayMenu="inline props 1`] = `
|
|
4
|
-
<ForwardRef(List)
|
|
5
|
-
displayMenu="inline"
|
|
6
|
-
isVisible={true}
|
|
7
|
-
>
|
|
8
|
-
<ForwardRef(Base)
|
|
9
|
-
as="ul"
|
|
10
|
-
className="ds-autocomplete__menu--inline ds-autocomplete__menu--visible ds-autocomplete__menu"
|
|
11
|
-
>
|
|
12
|
-
<ul
|
|
13
|
-
className="ds-autocomplete__menu--inline ds-autocomplete__menu--visible ds-autocomplete__menu"
|
|
14
|
-
>
|
|
15
|
-
Hello
|
|
16
|
-
</ul>
|
|
17
|
-
</ForwardRef(Base)>
|
|
18
|
-
</ForwardRef(List)>
|
|
19
|
-
`;
|
|
20
|
-
|
|
21
|
-
exports[`renders the AutoCompleteResultList with isVisible displayMenu="overlay props 1`] = `
|
|
22
|
-
<ForwardRef(List)
|
|
23
|
-
displayMenu="overlay"
|
|
24
|
-
isVisible={true}
|
|
25
|
-
>
|
|
26
|
-
<ForwardRef(Base)
|
|
27
|
-
as="ul"
|
|
28
|
-
className="ds-autocomplete__menu--overlay ds-autocomplete__menu--visible ds-autocomplete__menu"
|
|
29
|
-
>
|
|
30
|
-
<ul
|
|
31
|
-
className="ds-autocomplete__menu--overlay ds-autocomplete__menu--visible ds-autocomplete__menu"
|
|
32
|
-
>
|
|
33
|
-
Hello
|
|
34
|
-
</ul>
|
|
35
|
-
</ForwardRef(Base)>
|
|
36
|
-
</ForwardRef(List)>
|
|
37
|
-
`;
|
|
38
|
-
|
|
39
3
|
exports[`renders the AutoCompleteResultList with isVisible props 1`] = `
|
|
40
4
|
<ForwardRef(List)
|
|
41
5
|
isVisible={true}
|
|
42
6
|
>
|
|
43
7
|
<ForwardRef(Base)
|
|
44
8
|
as="ul"
|
|
45
|
-
className="ds-autocomplete__menu
|
|
9
|
+
className="ds-autocomplete__menu"
|
|
46
10
|
>
|
|
47
11
|
<ul
|
|
48
|
-
className="ds-autocomplete__menu
|
|
12
|
+
className="ds-autocomplete__menu"
|
|
49
13
|
>
|
|
50
14
|
Hello
|
|
51
15
|
</ul>
|
|
@@ -10,7 +10,7 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
|
|
|
10
10
|
var _react = _interopRequireDefault(require("react"));
|
|
11
11
|
var _clsx = _interopRequireDefault(require("clsx"));
|
|
12
12
|
var _Base = _interopRequireDefault(require("@digigov/react-core/Base"));
|
|
13
|
-
var _excluded = ["isVisible", "
|
|
13
|
+
var _excluded = ["isVisible", "className", "children"];
|
|
14
14
|
/**
|
|
15
15
|
* AutoCompleteResultList component is used for listing items.
|
|
16
16
|
* This component must contain AutoCompleteResultListItem component.
|
|
@@ -18,14 +18,13 @@ var _excluded = ["isVisible", "displayMenu", "className", "children"];
|
|
|
18
18
|
var AutoCompleteResultList = exports.AutoCompleteResultList = /*#__PURE__*/_react["default"].forwardRef(function List(_ref, ref) {
|
|
19
19
|
var _ref$isVisible = _ref.isVisible,
|
|
20
20
|
isVisible = _ref$isVisible === void 0 ? false : _ref$isVisible,
|
|
21
|
-
displayMenu = _ref.displayMenu,
|
|
22
21
|
className = _ref.className,
|
|
23
22
|
children = _ref.children,
|
|
24
23
|
props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
|
|
25
24
|
return /*#__PURE__*/_react["default"].createElement(_Base["default"], (0, _extends2["default"])({
|
|
26
25
|
as: "ul",
|
|
27
26
|
ref: ref,
|
|
28
|
-
className: (0, _clsx["default"])(className,
|
|
27
|
+
className: (0, _clsx["default"])(className, isVisible === false && 'ds-autocomplete__menu--hidden', true && 'ds-autocomplete__menu')
|
|
29
28
|
}, props), children);
|
|
30
29
|
});
|
|
31
30
|
var _default = exports["default"] = AutoCompleteResultList;
|
|
@@ -13,18 +13,4 @@ var _ref2 = /*#__PURE__*/_react["default"].createElement(_AutoCompleteResultList
|
|
|
13
13
|
}, "Hello");
|
|
14
14
|
it('renders the AutoCompleteResultList with isVisible props', function () {
|
|
15
15
|
expect((0, _enzyme.mount)(_ref2)).toMatchSnapshot();
|
|
16
|
-
});
|
|
17
|
-
var _ref3 = /*#__PURE__*/_react["default"].createElement(_AutoCompleteResultList["default"], {
|
|
18
|
-
isVisible: true,
|
|
19
|
-
displayMenu: "inline"
|
|
20
|
-
}, "Hello");
|
|
21
|
-
it('renders the AutoCompleteResultList with isVisible displayMenu="inline props', function () {
|
|
22
|
-
expect((0, _enzyme.mount)(_ref3)).toMatchSnapshot();
|
|
23
|
-
});
|
|
24
|
-
var _ref4 = /*#__PURE__*/_react["default"].createElement(_AutoCompleteResultList["default"], {
|
|
25
|
-
isVisible: true,
|
|
26
|
-
displayMenu: "overlay"
|
|
27
|
-
}, "Hello");
|
|
28
|
-
it('renders the AutoCompleteResultList with isVisible displayMenu="overlay props', function () {
|
|
29
|
-
expect((0, _enzyme.mount)(_ref4)).toMatchSnapshot();
|
|
30
16
|
});
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
|
2
2
|
|
|
3
3
|
exports[`renders the AdminContainer with no props 1`] = `
|
|
4
|
-
<ForwardRef(
|
|
4
|
+
<ForwardRef(AutoCompleteStatusContainer)>
|
|
5
5
|
<ForwardRef(Base)
|
|
6
6
|
aria-atomic="true"
|
|
7
7
|
aria-live="polite"
|
|
@@ -18,5 +18,5 @@ exports[`renders the AdminContainer with no props 1`] = `
|
|
|
18
18
|
hello
|
|
19
19
|
</div>
|
|
20
20
|
</ForwardRef(Base)>
|
|
21
|
-
</ForwardRef(
|
|
21
|
+
</ForwardRef(AutoCompleteStatusContainer)>
|
|
22
22
|
`;
|
|
@@ -13,9 +13,9 @@ var _Base = _interopRequireDefault(require("@digigov/react-core/Base"));
|
|
|
13
13
|
var _excluded = ["className", "children"];
|
|
14
14
|
/**
|
|
15
15
|
* AutoCompleteStatus is a div element for displaying the autocomplete status.
|
|
16
|
-
* Use AutoCompleteStatus inside
|
|
16
|
+
* Use AutoCompleteStatus inside AutoCompleteStatusContainer wrapper.
|
|
17
17
|
*/
|
|
18
|
-
var AutoCompleteStatus = exports.AutoCompleteStatus = /*#__PURE__*/_react["default"].forwardRef(function
|
|
18
|
+
var AutoCompleteStatus = exports.AutoCompleteStatus = /*#__PURE__*/_react["default"].forwardRef(function AutoCompleteStatusContainer(_ref, ref) {
|
|
19
19
|
var className = _ref.className,
|
|
20
20
|
children = _ref.children,
|
|
21
21
|
props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
|
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
|
2
2
|
|
|
3
3
|
exports[`renders the AdminContainer with no props 1`] = `
|
|
4
|
-
<ForwardRef(
|
|
4
|
+
<ForwardRef(AutoCompleteStatusContainer)>
|
|
5
5
|
<ForwardRef(Base)
|
|
6
6
|
as="div"
|
|
7
|
-
className="ds-
|
|
7
|
+
className="ds-autocomplete__status__container"
|
|
8
8
|
>
|
|
9
9
|
<div
|
|
10
|
-
className="ds-
|
|
10
|
+
className="ds-autocomplete__status__container"
|
|
11
11
|
>
|
|
12
12
|
hello
|
|
13
13
|
</div>
|
|
14
14
|
</ForwardRef(Base)>
|
|
15
|
-
</ForwardRef(
|
|
15
|
+
</ForwardRef(AutoCompleteStatusContainer)>
|
|
16
16
|
`;
|
|
@@ -4,7 +4,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
4
4
|
Object.defineProperty(exports, "__esModule", {
|
|
5
5
|
value: true
|
|
6
6
|
});
|
|
7
|
-
exports["default"] = exports.
|
|
7
|
+
exports["default"] = exports.AutoCompleteStatusContainer = void 0;
|
|
8
8
|
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
|
|
9
9
|
var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
|
|
10
10
|
var _react = _interopRequireDefault(require("react"));
|
|
@@ -12,17 +12,17 @@ var _clsx = _interopRequireDefault(require("clsx"));
|
|
|
12
12
|
var _Base = _interopRequireDefault(require("@digigov/react-core/Base"));
|
|
13
13
|
var _excluded = ["className", "children"];
|
|
14
14
|
/**
|
|
15
|
-
*
|
|
16
|
-
* Use
|
|
15
|
+
* AutoCompleteStatusContainer is a wrapper for autocomplete element.
|
|
16
|
+
* Use AutoCompleteStatusContainer to wrap autocomplete elements.
|
|
17
17
|
*/
|
|
18
|
-
var
|
|
18
|
+
var AutoCompleteStatusContainer = exports.AutoCompleteStatusContainer = /*#__PURE__*/_react["default"].forwardRef(function AutoCompleteStatusContainer(_ref, ref) {
|
|
19
19
|
var className = _ref.className,
|
|
20
20
|
children = _ref.children,
|
|
21
21
|
props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
|
|
22
22
|
return /*#__PURE__*/_react["default"].createElement(_Base["default"], (0, _extends2["default"])({
|
|
23
23
|
as: "div",
|
|
24
24
|
ref: ref,
|
|
25
|
-
className: (0, _clsx["default"])(className, true && 'ds-
|
|
25
|
+
className: (0, _clsx["default"])(className, true && 'ds-autocomplete__status__container')
|
|
26
26
|
}, props), children);
|
|
27
27
|
});
|
|
28
|
-
var _default = exports["default"] =
|
|
28
|
+
var _default = exports["default"] = AutoCompleteStatusContainer;
|
|
@@ -3,8 +3,8 @@
|
|
|
3
3
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
4
4
|
var _react = _interopRequireDefault(require("react"));
|
|
5
5
|
var _enzyme = require("enzyme");
|
|
6
|
-
var
|
|
7
|
-
var _ref = /*#__PURE__*/_react["default"].createElement(
|
|
6
|
+
var _AutoCompleteStatusContainer = _interopRequireDefault(require("@digigov/react-core/AutoCompleteStatusContainer"));
|
|
7
|
+
var _ref = /*#__PURE__*/_react["default"].createElement(_AutoCompleteStatusContainer["default"], null, "hello");
|
|
8
8
|
it('renders the AdminContainer with no props', function () {
|
|
9
9
|
expect((0, _enzyme.mount)(_ref)).toMatchSnapshot();
|
|
10
10
|
});
|
package/cjs/Base/index.js
CHANGED
|
@@ -68,7 +68,7 @@ var Base = exports.Base = /*#__PURE__*/_react["default"].forwardRef(function Bas
|
|
|
68
68
|
props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
|
|
69
69
|
var Component = as || 'span';
|
|
70
70
|
return /*#__PURE__*/_react["default"].createElement(Component, (0, _extends2["default"])({
|
|
71
|
-
className: (0, _clsx["default"])(className, (paddingBottom !== undefined ? true : undefined) && "ds-pb-".concat(paddingBottom), (marginBottom !== undefined ? true : undefined) && "ds-mb-".concat(marginBottom), (paddingRight !== undefined ? true : undefined) && "ds-pr-".concat(paddingRight), (marginRight !== undefined ? true : undefined) && "ds-mr-".concat(marginRight), (paddingLeft !== undefined ? true : undefined) && "ds-pl-".concat(paddingLeft), (marginLeft !== undefined ? true : undefined) && "ds-ml-".concat(marginLeft), (paddingTop !== undefined ? true : undefined) && "ds-pt-".concat(paddingTop), (marginTop !== undefined ? true : undefined) && "ds-mt-".concat(marginTop), (padding !== undefined ? true : undefined) && "ds-p-".concat(padding), (margin !== undefined ? true : undefined) && "ds-m-".concat(margin), (mt !== undefined ? true : undefined) && "ds-mt-".concat(mt), (mb !== undefined ? true : undefined) && "ds-mb-".concat(mb), (mr !== undefined ? true : undefined) && "ds-mr-".concat(mr), (ml !== undefined ? true : undefined) && "ds-ml-".concat(ml), (mx !== undefined ? true : undefined) && "ds-mx-".concat(mx), (my !== undefined ? true : undefined) && "ds-my-".concat(my), (pt !== undefined ? true : undefined) && "ds-pt-".concat(pt), (pb !== undefined ? true : undefined) && "ds-pb-".concat(pb), (pr !== undefined ? true : undefined) && "ds-pr-".concat(pr), (pl !== undefined ? true : undefined) && "ds-pl-".concat(pl), (px !== undefined ? true : undefined) && "ds-px-".concat(px), (py !== undefined ? true : undefined) && "ds-py-".concat(py), (m !== undefined ? true : undefined) && "ds-m-".concat(m), (p !== undefined ? true : undefined) && "ds-p-".concat(p), printVisible === 'inline' && 'ds-print-visible-inline', printVisible === 'block' && 'ds-print-visible-block', !!printHidden && 'ds-print-hidden', !!xsUpHidden && 'ds-hidden-xs
|
|
71
|
+
className: (0, _clsx["default"])(className, (paddingBottom !== undefined ? true : undefined) && "ds-pb-".concat(paddingBottom), (marginBottom !== undefined ? true : undefined) && "ds-mb-".concat(marginBottom), (paddingRight !== undefined ? true : undefined) && "ds-pr-".concat(paddingRight), (marginRight !== undefined ? true : undefined) && "ds-mr-".concat(marginRight), (paddingLeft !== undefined ? true : undefined) && "ds-pl-".concat(paddingLeft), (marginLeft !== undefined ? true : undefined) && "ds-ml-".concat(marginLeft), (paddingTop !== undefined ? true : undefined) && "ds-pt-".concat(paddingTop), (marginTop !== undefined ? true : undefined) && "ds-mt-".concat(marginTop), (padding !== undefined ? true : undefined) && "ds-p-".concat(padding), (margin !== undefined ? true : undefined) && "ds-m-".concat(margin), (mt !== undefined ? true : undefined) && "ds-mt-".concat(mt), (mb !== undefined ? true : undefined) && "ds-mb-".concat(mb), (mr !== undefined ? true : undefined) && "ds-mr-".concat(mr), (ml !== undefined ? true : undefined) && "ds-ml-".concat(ml), (mx !== undefined ? true : undefined) && "ds-mx-".concat(mx), (my !== undefined ? true : undefined) && "ds-my-".concat(my), (pt !== undefined ? true : undefined) && "ds-pt-".concat(pt), (pb !== undefined ? true : undefined) && "ds-pb-".concat(pb), (pr !== undefined ? true : undefined) && "ds-pr-".concat(pr), (pl !== undefined ? true : undefined) && "ds-pl-".concat(pl), (px !== undefined ? true : undefined) && "ds-px-".concat(px), (py !== undefined ? true : undefined) && "ds-py-".concat(py), (m !== undefined ? true : undefined) && "ds-m-".concat(m), (p !== undefined ? true : undefined) && "ds-p-".concat(p), printVisible === 'inline' && 'ds-print-visible-inline', printVisible === 'block' && 'ds-print-visible-block', !!printHidden && 'ds-print-hidden', !!xsUpHidden && 'ds-hidden-xs-up', !!smUpHidden && 'ds-hidden-sm-up', !!mdUpHidden && 'ds-hidden-md-up', !!lgUpHidden && 'ds-hidden-lg-up', !!xlUpHidden && 'ds-hidden-xl-up', !!xsHidden && 'ds-hidden-xs', !!smHidden && 'ds-hidden-sm', !!mdHidden && 'ds-hidden-md', !!lgHidden && 'ds-hidden-lg', !!xlHidden && 'ds-hidden-xl', !!hidden && 'ds-hidden'),
|
|
72
72
|
ref: ref
|
|
73
73
|
}, props), children);
|
|
74
74
|
});
|
|
@@ -42,6 +42,48 @@ exports[`renders the Card with dense props 1`] = `
|
|
|
42
42
|
</ForwardRef(Card)>
|
|
43
43
|
`;
|
|
44
44
|
|
|
45
|
+
exports[`renders the Card with dense" prop 1`] = `
|
|
46
|
+
<ForwardRef(Card)
|
|
47
|
+
dense={true}
|
|
48
|
+
>
|
|
49
|
+
<ForwardRef(Base)
|
|
50
|
+
as="div"
|
|
51
|
+
className="ds-card--dense ds-card"
|
|
52
|
+
>
|
|
53
|
+
<div
|
|
54
|
+
className="ds-card--dense ds-card"
|
|
55
|
+
>
|
|
56
|
+
<div
|
|
57
|
+
className="ds-card__body"
|
|
58
|
+
>
|
|
59
|
+
hello
|
|
60
|
+
</div>
|
|
61
|
+
</div>
|
|
62
|
+
</ForwardRef(Base)>
|
|
63
|
+
</ForwardRef(Card)>
|
|
64
|
+
`;
|
|
65
|
+
|
|
66
|
+
exports[`renders the Card with fullHeight" prop 1`] = `
|
|
67
|
+
<ForwardRef(Card)
|
|
68
|
+
fullHeight={true}
|
|
69
|
+
>
|
|
70
|
+
<ForwardRef(Base)
|
|
71
|
+
as="div"
|
|
72
|
+
className="ds-card--full-height ds-card"
|
|
73
|
+
>
|
|
74
|
+
<div
|
|
75
|
+
className="ds-card--full-height ds-card"
|
|
76
|
+
>
|
|
77
|
+
<div
|
|
78
|
+
className="ds-card__body"
|
|
79
|
+
>
|
|
80
|
+
hello
|
|
81
|
+
</div>
|
|
82
|
+
</div>
|
|
83
|
+
</ForwardRef(Base)>
|
|
84
|
+
</ForwardRef(Card)>
|
|
85
|
+
`;
|
|
86
|
+
|
|
45
87
|
exports[`renders the Card with no props 1`] = `
|
|
46
88
|
<ForwardRef(Card)>
|
|
47
89
|
<ForwardRef(Base)
|
package/cjs/Card/index.js
CHANGED
|
@@ -10,7 +10,7 @@ var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/h
|
|
|
10
10
|
var _react = _interopRequireDefault(require("react"));
|
|
11
11
|
var _clsx = _interopRequireDefault(require("clsx"));
|
|
12
12
|
var _Base = _interopRequireDefault(require("@digigov/react-core/Base"));
|
|
13
|
-
var _excluded = ["variant", "borderColor", "callToAction", "dense", "className", "children"];
|
|
13
|
+
var _excluded = ["variant", "borderColor", "callToAction", "dense", "fullHeight", "className", "children"];
|
|
14
14
|
/**
|
|
15
15
|
* Cards can be used to divide and organise interface content for better understandability and readability.
|
|
16
16
|
* Cards can help your users to scan through vast amounts of information quicker.
|
|
@@ -21,13 +21,14 @@ var Card = exports.Card = /*#__PURE__*/_react["default"].forwardRef(function Car
|
|
|
21
21
|
borderColor = _ref.borderColor,
|
|
22
22
|
callToAction = _ref.callToAction,
|
|
23
23
|
dense = _ref.dense,
|
|
24
|
+
fullHeight = _ref.fullHeight,
|
|
24
25
|
className = _ref.className,
|
|
25
26
|
children = _ref.children,
|
|
26
27
|
props = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
|
|
27
28
|
return /*#__PURE__*/_react["default"].createElement(_Base["default"], (0, _extends2["default"])({
|
|
28
29
|
as: "div",
|
|
29
30
|
ref: ref,
|
|
30
|
-
className: (0, _clsx["default"])(className, variant === 'border-top' && 'ds-card--border-top', borderColor === 'light' && 'ds-card--border-light', borderColor === 'dark' && 'ds-card--border-dark', variant === 'divider' && 'ds-card--divider', variant === 'border' && 'ds-card--border', callToAction && 'ds-card--cta', dense && 'ds-card--dense', true && 'ds-card')
|
|
31
|
+
className: (0, _clsx["default"])(className, variant === 'border-top' && 'ds-card--border-top', borderColor === 'light' && 'ds-card--border-light', borderColor === 'dark' && 'ds-card--border-dark', variant === 'divider' && 'ds-card--divider', variant === 'border' && 'ds-card--border', callToAction && 'ds-card--cta', fullHeight && 'ds-card--full-height', dense && 'ds-card--dense', true && 'ds-card')
|
|
31
32
|
}, props), /*#__PURE__*/_react["default"].createElement("div", {
|
|
32
33
|
className: (0, _clsx["default"])(true && 'ds-card__body')
|
|
33
34
|
}, children));
|