@uncinc/uncinc-react-kitchen-sink 2.7.9 → 2.7.10
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/Context/KitchenSinkComponentMapperContext.js +3 -11
- package/dist/Context/ViewportContext.js +8 -21
- package/dist/Context/withMapping.js +6 -17
- package/dist/components/AbbreviationAnnotation/index.js +17 -28
- package/dist/components/Accordion/AccordionItem/index.js +19 -27
- package/dist/components/Accordion/AccordionItemVariant/index.js +14 -25
- package/dist/components/Accordion/index.js +6 -14
- package/dist/components/ApiAutocomplete/index.js +7 -17
- package/dist/components/Button/index.js +22 -31
- package/dist/components/CallToAction/index.js +12 -20
- package/dist/components/Cookie/Checkbox/index.js +6 -14
- package/dist/components/Cookie/index.js +59 -69
- package/dist/components/Dialog/DialogHelpersStory/index.js +13 -25
- package/dist/components/Dialog/DialogHookStory/index.js +12 -21
- package/dist/components/Dialog/DialogOverrideStory/index.js +9 -18
- package/dist/components/Dialog/index.js +35 -46
- package/dist/components/Download/index.js +14 -22
- package/dist/components/FontSizeSwitcher/index.js +17 -28
- package/dist/components/Form/Checkbox/index.js +18 -27
- package/dist/components/Form/Checkboxes/index.js +23 -31
- package/dist/components/Form/DateField/index.js +6 -14
- package/dist/components/Form/DatePicker/index.js +16 -24
- package/dist/components/Form/DatePickerRange/Picker/index.js +18 -26
- package/dist/components/Form/DatePickerRange/index.js +37 -47
- package/dist/components/Form/DateSelect/index.js +22 -33
- package/dist/components/Form/Email/index.js +4 -12
- package/dist/components/Form/FormikWrapper/index.js +13 -24
- package/dist/components/Form/GenericFormElement/index.js +14 -22
- package/dist/components/Form/Number/index.js +6 -14
- package/dist/components/Form/RadioButtons/index.js +23 -31
- package/dist/components/Form/SearchField/index.js +14 -22
- package/dist/components/Form/Select/Input/index.js +15 -23
- package/dist/components/Form/Select/index.js +12 -20
- package/dist/components/Form/TextField/index.js +16 -25
- package/dist/components/Form/Textarea/index.js +14 -22
- package/dist/components/Form/commonTests.js +19 -32
- package/dist/components/Form/index.js +13 -97
- package/dist/components/Hamburger/index.js +7 -15
- package/dist/components/Header/index.js +23 -38
- package/dist/components/Icon/index.js +9 -17
- package/dist/components/Image/AdaptivePicture/index.js +16 -23
- package/dist/components/Image/Background/index.js +10 -21
- package/dist/components/Image/LazyLoadWrapper/index.js +16 -26
- package/dist/components/Image/Picture/index.js +25 -33
- package/dist/components/Image/helpers/index.js +11 -21
- package/dist/components/Image/index.js +16 -24
- package/dist/components/InlineMenu/index.js +26 -37
- package/dist/components/Layout/Container/index.js +13 -21
- package/dist/components/Layout/QuickLayout/Auto/index.js +5 -13
- package/dist/components/Layout/QuickLayout/Center/index.js +6 -14
- package/dist/components/Layout/QuickLayout/Clamp/index.js +5 -13
- package/dist/components/Layout/QuickLayout/Sidebar/index.js +6 -14
- package/dist/components/Layout/QuickLayout/SpaceBetween/index.js +6 -14
- package/dist/components/Layout/QuickLayout/Stack/index.js +6 -14
- package/dist/components/Layout/QuickLayout/Wrap/index.js +7 -15
- package/dist/components/Layout/QuickLayout/index.js +16 -24
- package/dist/components/Lottie/LottieAnimation/index.js +12 -23
- package/dist/components/Lottie/LottieAnimationWithMousePosition.js +8 -19
- package/dist/components/Lottie/index.js +29 -41
- package/dist/components/MagicLine/index.js +12 -23
- package/dist/components/MediaPlayer/index.js +19 -28
- package/dist/components/MediaPlayer/types.js +1 -1
- package/dist/components/NavigationScroll/index.js +11 -21
- package/dist/components/Pagination/index.js +28 -37
- package/dist/components/SearchKit/Facets/ChipFacet/index.js +11 -20
- package/dist/components/SearchKit/Facets/ListFacet/index.js +11 -20
- package/dist/components/SearchKit/Facets/SelectFacet/index.js +15 -24
- package/dist/components/SearchKit/Query/index.js +13 -24
- package/dist/components/SearchKit/SearchFacets/index.js +10 -18
- package/dist/components/SearchKit/SearchField/index.js +12 -23
- package/dist/components/SearchKit/SearchLoadMore/index.js +7 -15
- package/dist/components/SearchKit/SearchPage/index.js +8 -17
- package/dist/components/SearchKit/SearchPagination/index.js +6 -14
- package/dist/components/SearchKit/SearchReset/index.js +8 -16
- package/dist/components/SearchKit/SearchResults/index.js +28 -39
- package/dist/components/SearchKit/SearchSelectedFilters/Filters/CustomValue/index.js +6 -14
- package/dist/components/SearchKit/SearchSelectedFilters/Filters/DateRange/index.js +6 -14
- package/dist/components/SearchKit/SearchSelectedFilters/Filters/NumericRange/index.js +6 -14
- package/dist/components/SearchKit/SearchSelectedFilters/Filters/Value/index.js +7 -18
- package/dist/components/SearchKit/SearchSelectedFilters/index.js +18 -26
- package/dist/components/SearchKit/SearchSorting/index.js +9 -17
- package/dist/components/SearchKit/index.js +29 -40
- package/dist/components/Share/index.js +18 -26
- package/dist/components/Sliders/SliderRelated/index.js +11 -19
- package/dist/components/TableRender/index.js +12 -23
- package/dist/components/Tag/index.js +10 -18
- package/dist/components/TitleWithText/index.js +8 -16
- package/dist/components/WysiwygField/index.js +10 -18
- package/dist/components/index.js +17 -127
- package/dist/config/constants.js +17 -37
- package/dist/config/i18next/index.js +9 -17
- package/dist/custom.d.js +0 -1
- package/dist/helpers/date.js +4 -13
- package/dist/helpers/gtm.js +4 -11
- package/dist/helpers/link.js +4 -12
- package/dist/helpers/useValueForCurrentViewPort.js +6 -13
- package/dist/hooks/useBoolean.js +6 -12
- package/dist/hooks/useClickOutside.js +3 -9
- package/dist/hooks/useDialog.js +6 -13
- package/dist/hooks/useDialogHelpers.js +11 -18
- package/dist/hooks/useEscape.js +3 -9
- package/dist/hooks/useOnScreen.js +4 -10
- package/dist/hooks/usePrevious.js +4 -10
- package/dist/hooks/useScrollPosition.js +4 -11
- package/dist/hooks/useTrapFocus.js +3 -9
- package/dist/hooks/useWindowDimensions.js +4 -10
- package/dist/index.js +89 -564
- package/dist/organisms/Downloads/index.js +10 -18
- package/dist/organisms/ImageGrid/index.js +5 -13
- package/dist/organisms/Quote/index.js +16 -24
- package/dist/organisms/Text/index.js +20 -31
- package/dist/setupTests.js +2 -5
- package/package.json +8 -2
|
@@ -1,21 +1,4 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
-
var _classnames = _interopRequireDefault(require("classnames"));
|
|
9
|
-
var _formik = require("formik");
|
|
10
|
-
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
11
|
-
var _reactI18next = require("react-i18next");
|
|
12
|
-
var _FormikWrapper = require("../FormikWrapper");
|
|
13
|
-
var _GenericFormElement = _interopRequireDefault(require("../GenericFormElement"));
|
|
14
|
-
var _Picker = _interopRequireDefault(require("./Picker"));
|
|
15
1
|
var _excluded = ["isSinglePicker", "title", "startDateTitle", "endDateTitle", "required", "description", "startDatePlaceholder", "endDatePlaceholder", "fieldName", "validation", "defaultValue", "minDate", "maxDate", "startDateClassName", "endDateClassName", "wrapperClassName", "disabled", "onChange"];
|
|
16
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
|
-
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
18
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
19
2
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
20
3
|
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
21
4
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
@@ -26,8 +9,16 @@ function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefine
|
|
|
26
9
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
27
10
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
28
11
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
12
|
+
import React, { useMemo } from 'react';
|
|
13
|
+
import c from 'classnames';
|
|
14
|
+
import { Field } from 'formik';
|
|
15
|
+
import PropTypes from 'prop-types';
|
|
16
|
+
import { useTranslation } from 'react-i18next';
|
|
17
|
+
import { useExtendedFormikContext } from '../FormikWrapper';
|
|
18
|
+
import GenericFormElement from '../GenericFormElement';
|
|
19
|
+
import Picker from './Picker';
|
|
29
20
|
var DatePickerRange = function DatePickerRange(props) {
|
|
30
|
-
var _useTranslation =
|
|
21
|
+
var _useTranslation = useTranslation(),
|
|
31
22
|
t = _useTranslation.t;
|
|
32
23
|
var isSinglePicker = props.isSinglePicker,
|
|
33
24
|
title = props.title,
|
|
@@ -48,7 +39,7 @@ var DatePickerRange = function DatePickerRange(props) {
|
|
|
48
39
|
disabled = props.disabled,
|
|
49
40
|
_onChange = props.onChange,
|
|
50
41
|
restProps = _objectWithoutProperties(props, _excluded);
|
|
51
|
-
var _useExtendedFormikCon =
|
|
42
|
+
var _useExtendedFormikCon = useExtendedFormikContext(),
|
|
52
43
|
values = _useExtendedFormikCon.values,
|
|
53
44
|
errors = _useExtendedFormikCon.errors,
|
|
54
45
|
touched = _useExtendedFormikCon.touched,
|
|
@@ -56,10 +47,10 @@ var DatePickerRange = function DatePickerRange(props) {
|
|
|
56
47
|
displayRequiredIndicator = _useExtendedFormikCon.displayRequiredIndicator;
|
|
57
48
|
var isTouched = touched[fieldName];
|
|
58
49
|
var error = errors[fieldName];
|
|
59
|
-
var startDateClassNames = (
|
|
60
|
-
var endDateClassNames = (
|
|
61
|
-
var wrapperClassNames = (
|
|
62
|
-
var _useMemo =
|
|
50
|
+
var startDateClassNames = c('DatePickerRange--start', startDateClassName);
|
|
51
|
+
var endDateClassNames = c('DatePickerRange--end', endDateClassName);
|
|
52
|
+
var wrapperClassNames = c('DatePickerRange', wrapperClassName);
|
|
53
|
+
var _useMemo = useMemo(function () {
|
|
63
54
|
var value = values[fieldName] || [];
|
|
64
55
|
var startDate = value[0] || defaultValue[0] || null;
|
|
65
56
|
var endDate = value[1] || defaultValue[1] || null;
|
|
@@ -89,7 +80,7 @@ var DatePickerRange = function DatePickerRange(props) {
|
|
|
89
80
|
return validation(value);
|
|
90
81
|
}
|
|
91
82
|
};
|
|
92
|
-
return /*#__PURE__*/
|
|
83
|
+
return /*#__PURE__*/React.createElement(GenericFormElement, {
|
|
93
84
|
className: wrapperClassNames,
|
|
94
85
|
title: title,
|
|
95
86
|
required: required,
|
|
@@ -98,12 +89,12 @@ var DatePickerRange = function DatePickerRange(props) {
|
|
|
98
89
|
touched: isTouched,
|
|
99
90
|
error: error,
|
|
100
91
|
displayRequiredIndicator: displayRequiredIndicator
|
|
101
|
-
}, /*#__PURE__*/
|
|
92
|
+
}, /*#__PURE__*/React.createElement(Field, {
|
|
102
93
|
name: fieldName,
|
|
103
94
|
value: [startDate, endDate],
|
|
104
95
|
validate: fieldValidation
|
|
105
96
|
}, function () {
|
|
106
|
-
return /*#__PURE__*/
|
|
97
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Picker, _extends({}, restProps, {
|
|
107
98
|
title: startDateTitle,
|
|
108
99
|
placeholder: startDatePlaceholder,
|
|
109
100
|
value: startDate,
|
|
@@ -125,7 +116,7 @@ var DatePickerRange = function DatePickerRange(props) {
|
|
|
125
116
|
_onChange(newValue);
|
|
126
117
|
}
|
|
127
118
|
}
|
|
128
|
-
})), !isSinglePicker && /*#__PURE__*/
|
|
119
|
+
})), !isSinglePicker && /*#__PURE__*/React.createElement(Picker, _extends({}, restProps, {
|
|
129
120
|
title: endDateTitle,
|
|
130
121
|
placeholder: endDatePlaceholder,
|
|
131
122
|
value: endDate,
|
|
@@ -165,24 +156,23 @@ DatePickerRange.defaultProps = {
|
|
|
165
156
|
onChange: function onChange() {}
|
|
166
157
|
};
|
|
167
158
|
DatePickerRange.propTypes = {
|
|
168
|
-
isSinglePicker:
|
|
169
|
-
title:
|
|
170
|
-
startDateTitle:
|
|
171
|
-
endDateTitle:
|
|
172
|
-
required:
|
|
173
|
-
description:
|
|
174
|
-
startDatePlaceholder:
|
|
175
|
-
endDatePlaceholder:
|
|
176
|
-
fieldName:
|
|
177
|
-
validation:
|
|
178
|
-
defaultValue:
|
|
179
|
-
minDate:
|
|
180
|
-
maxDate:
|
|
181
|
-
startDateClassName:
|
|
182
|
-
endDateClassName:
|
|
183
|
-
wrapperClassName:
|
|
184
|
-
disabled:
|
|
185
|
-
onChange:
|
|
159
|
+
isSinglePicker: PropTypes.bool,
|
|
160
|
+
title: PropTypes.string,
|
|
161
|
+
startDateTitle: PropTypes.string,
|
|
162
|
+
endDateTitle: PropTypes.string,
|
|
163
|
+
required: PropTypes.bool,
|
|
164
|
+
description: PropTypes.string,
|
|
165
|
+
startDatePlaceholder: PropTypes.string,
|
|
166
|
+
endDatePlaceholder: PropTypes.string,
|
|
167
|
+
fieldName: PropTypes.string.isRequired,
|
|
168
|
+
validation: PropTypes.func,
|
|
169
|
+
defaultValue: PropTypes.arrayOf(PropTypes.instanceOf(Date)),
|
|
170
|
+
minDate: PropTypes.instanceOf(Date),
|
|
171
|
+
maxDate: PropTypes.instanceOf(Date),
|
|
172
|
+
startDateClassName: PropTypes.string,
|
|
173
|
+
endDateClassName: PropTypes.string,
|
|
174
|
+
wrapperClassName: PropTypes.string,
|
|
175
|
+
disabled: PropTypes.bool,
|
|
176
|
+
onChange: PropTypes.func
|
|
186
177
|
};
|
|
187
|
-
|
|
188
|
-
exports.default = _default;
|
|
178
|
+
export default DatePickerRange;
|
|
@@ -1,26 +1,16 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.default = void 0;
|
|
8
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
9
|
-
var _formik = require("formik");
|
|
10
|
-
var _reactI18next = require("react-i18next");
|
|
11
|
-
var _GenericFormElement = _interopRequireDefault(require("../GenericFormElement"));
|
|
12
|
-
var _Input = _interopRequireDefault(require("../Select/Input"));
|
|
13
|
-
var _FormikWrapper = require("../FormikWrapper");
|
|
14
|
-
require("./style.scss");
|
|
15
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
16
|
-
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
17
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
18
1
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
19
2
|
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
20
3
|
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
21
4
|
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
|
|
22
5
|
function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
|
|
23
6
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
7
|
+
import React, { useState, useEffect, useMemo } from 'react';
|
|
8
|
+
import { Field } from 'formik';
|
|
9
|
+
import { useTranslation } from 'react-i18next';
|
|
10
|
+
import GenericFormElement from '../GenericFormElement';
|
|
11
|
+
import SelectInput from '../Select/Input';
|
|
12
|
+
import { useExtendedFormikContext } from '../FormikWrapper';
|
|
13
|
+
import './style.scss';
|
|
24
14
|
var DateSelect = function DateSelect(props) {
|
|
25
15
|
var title = props.title,
|
|
26
16
|
fieldName = props.fieldName,
|
|
@@ -38,7 +28,7 @@ var DateSelect = function DateSelect(props) {
|
|
|
38
28
|
monthPlaceholder = props.monthPlaceholder,
|
|
39
29
|
yearPlaceholder = props.yearPlaceholder,
|
|
40
30
|
onChange = props.onChange;
|
|
41
|
-
var _useExtendedFormikCon =
|
|
31
|
+
var _useExtendedFormikCon = useExtendedFormikContext(),
|
|
42
32
|
setFieldValue = _useExtendedFormikCon.setFieldValue,
|
|
43
33
|
setFieldError = _useExtendedFormikCon.setFieldError,
|
|
44
34
|
isSubmitting = _useExtendedFormikCon.isSubmitting,
|
|
@@ -49,25 +39,25 @@ var DateSelect = function DateSelect(props) {
|
|
|
49
39
|
var isTouched = touched[fieldName];
|
|
50
40
|
var value = values[fieldName];
|
|
51
41
|
var error = errors[fieldName];
|
|
52
|
-
var _useTranslation =
|
|
42
|
+
var _useTranslation = useTranslation(),
|
|
53
43
|
t = _useTranslation.t;
|
|
54
44
|
|
|
55
45
|
// Set all states for the date.
|
|
56
|
-
var _useState =
|
|
46
|
+
var _useState = useState(),
|
|
57
47
|
_useState2 = _slicedToArray(_useState, 2),
|
|
58
48
|
day = _useState2[0],
|
|
59
49
|
setDay = _useState2[1];
|
|
60
|
-
var _useState3 =
|
|
50
|
+
var _useState3 = useState(),
|
|
61
51
|
_useState4 = _slicedToArray(_useState3, 2),
|
|
62
52
|
month = _useState4[0],
|
|
63
53
|
setMonth = _useState4[1];
|
|
64
|
-
var _useState5 =
|
|
54
|
+
var _useState5 = useState(),
|
|
65
55
|
_useState6 = _slicedToArray(_useState5, 2),
|
|
66
56
|
year = _useState6[0],
|
|
67
57
|
setYear = _useState6[1];
|
|
68
58
|
|
|
69
59
|
// List all day options
|
|
70
|
-
var dayOptions =
|
|
60
|
+
var dayOptions = useMemo(function (placeholder) {
|
|
71
61
|
var options = [];
|
|
72
62
|
if (placeholder) {
|
|
73
63
|
options.push({
|
|
@@ -97,7 +87,7 @@ var DateSelect = function DateSelect(props) {
|
|
|
97
87
|
};
|
|
98
88
|
|
|
99
89
|
// List all month options
|
|
100
|
-
var monthOptions =
|
|
90
|
+
var monthOptions = useMemo(function () {
|
|
101
91
|
var months = [t('dateselect.months.jan', 'Januari'), t('dateselect.months.feb', 'Februari'), t('dateselect.months.mar', 'Maart'), t('dateselect.months.apr', 'April'), t('dateselect.months.may', 'Mei'), t('dateselect.months.jun', 'Juni'), t('dateselect.months.jul', 'Juli'), t('dateselect.months.aug', 'Augustus'), t('dateselect.months.sep', 'September'), t('dateselect.months.oct', 'Oktober'), t('dateselect.months.nov', 'November'), t('dateselect.months.dec', 'December')];
|
|
102
92
|
return months.map(function (e, i) {
|
|
103
93
|
return {
|
|
@@ -108,7 +98,7 @@ var DateSelect = function DateSelect(props) {
|
|
|
108
98
|
}, [t]);
|
|
109
99
|
|
|
110
100
|
// List all options for possible years from the yearMin and yearMax variables.
|
|
111
|
-
var yearOptions =
|
|
101
|
+
var yearOptions = useMemo(function () {
|
|
112
102
|
var options = [];
|
|
113
103
|
for (var index = yearMin; index <= yearMax; index++) {
|
|
114
104
|
options.push({
|
|
@@ -120,7 +110,7 @@ var DateSelect = function DateSelect(props) {
|
|
|
120
110
|
}, [yearMin, yearMax]);
|
|
121
111
|
|
|
122
112
|
// Validation and setting either an error or the FieldValue
|
|
123
|
-
|
|
113
|
+
useEffect(function () {
|
|
124
114
|
hideYear && setYear(fixedYear || new Date().getFullYear());
|
|
125
115
|
|
|
126
116
|
// All options are filled, start validation
|
|
@@ -162,7 +152,7 @@ var DateSelect = function DateSelect(props) {
|
|
|
162
152
|
});
|
|
163
153
|
}
|
|
164
154
|
};
|
|
165
|
-
return /*#__PURE__*/
|
|
155
|
+
return /*#__PURE__*/React.createElement(GenericFormElement, {
|
|
166
156
|
className: "DateSelect",
|
|
167
157
|
title: title,
|
|
168
158
|
required: required,
|
|
@@ -170,13 +160,13 @@ var DateSelect = function DateSelect(props) {
|
|
|
170
160
|
error: error,
|
|
171
161
|
touched: isTouched,
|
|
172
162
|
fieldName: fieldName
|
|
173
|
-
}, /*#__PURE__*/
|
|
163
|
+
}, /*#__PURE__*/React.createElement(Field, {
|
|
174
164
|
id: fieldName,
|
|
175
165
|
name: fieldName,
|
|
176
166
|
validate: handleValidation,
|
|
177
167
|
value: value
|
|
178
168
|
}, function () {
|
|
179
|
-
return /*#__PURE__*/
|
|
169
|
+
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(SelectInput, {
|
|
180
170
|
id: "".concat(fieldName, "day"),
|
|
181
171
|
fieldName: "".concat(fieldName, "day"),
|
|
182
172
|
options: dayOptions,
|
|
@@ -188,7 +178,7 @@ var DateSelect = function DateSelect(props) {
|
|
|
188
178
|
changedDay: day
|
|
189
179
|
});
|
|
190
180
|
}
|
|
191
|
-
}), /*#__PURE__*/
|
|
181
|
+
}), /*#__PURE__*/React.createElement(SelectInput, {
|
|
192
182
|
id: "".concat(fieldName, "month"),
|
|
193
183
|
fieldName: "".concat(fieldName, "month"),
|
|
194
184
|
options: monthOptions,
|
|
@@ -200,7 +190,7 @@ var DateSelect = function DateSelect(props) {
|
|
|
200
190
|
changedMonth: month
|
|
201
191
|
});
|
|
202
192
|
}
|
|
203
|
-
}), !hideYear && /*#__PURE__*/
|
|
193
|
+
}), !hideYear && /*#__PURE__*/React.createElement(SelectInput, {
|
|
204
194
|
id: "".concat(fieldName, "year"),
|
|
205
195
|
fieldName: "".concat(fieldName, "year"),
|
|
206
196
|
options: yearOptions,
|
|
@@ -228,5 +218,4 @@ DateSelect.defaultProps = {
|
|
|
228
218
|
yearPlaceholder: 'Jaar',
|
|
229
219
|
validation: undefined
|
|
230
220
|
};
|
|
231
|
-
|
|
232
|
-
exports.default = _default;
|
|
221
|
+
export default DateSelect;
|
|
@@ -1,17 +1,9 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
var _react = _interopRequireDefault(require("react"));
|
|
8
|
-
var _TextField = _interopRequireDefault(require("../TextField"));
|
|
9
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
10
1
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import TextField from '../TextField';
|
|
11
4
|
var Email = function Email(props) {
|
|
12
|
-
return /*#__PURE__*/
|
|
5
|
+
return /*#__PURE__*/React.createElement(TextField, _extends({}, props, {
|
|
13
6
|
type: "email"
|
|
14
7
|
}));
|
|
15
8
|
};
|
|
16
|
-
|
|
17
|
-
exports.default = _default;
|
|
9
|
+
export default Email;
|
|
@@ -1,16 +1,6 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
1
|
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
4
|
-
Object.defineProperty(exports, "__esModule", {
|
|
5
|
-
value: true
|
|
6
|
-
});
|
|
7
|
-
exports.useExtendedFormikContext = exports.default = exports.FormikExtendedContextProvider = void 0;
|
|
8
|
-
var _react = _interopRequireWildcard(require("react"));
|
|
9
|
-
var _formik = require("formik");
|
|
10
2
|
var _excluded = ["children"],
|
|
11
3
|
_excluded2 = ["initialValues", "onSubmit", "validate", "validateOnChange", "validateOnBlur", "validateOnMount", "onReset", "children", "displayRequiredIndicator"];
|
|
12
|
-
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
13
|
-
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
14
4
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
15
5
|
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
|
|
16
6
|
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
|
|
@@ -19,26 +9,26 @@ function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _ty
|
|
|
19
9
|
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
20
10
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
21
11
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
12
|
+
import React, { createContext, useContext, useMemo } from 'react';
|
|
13
|
+
import { Form, Formik, useFormikContext } from 'formik';
|
|
14
|
+
var CustomFormikContext = /*#__PURE__*/createContext();
|
|
15
|
+
export var useExtendedFormikContext = function useExtendedFormikContext() {
|
|
16
|
+
return useContext(CustomFormikContext);
|
|
25
17
|
};
|
|
26
|
-
|
|
27
|
-
var FormikExtendedContextProvider = function FormikExtendedContextProvider(_ref) {
|
|
18
|
+
export var FormikExtendedContextProvider = function FormikExtendedContextProvider(_ref) {
|
|
28
19
|
var children = _ref.children,
|
|
29
20
|
props = _objectWithoutProperties(_ref, _excluded);
|
|
30
|
-
var formikContext =
|
|
21
|
+
var formikContext = useFormikContext();
|
|
31
22
|
|
|
32
23
|
// We want to supply the elements with extra properties,
|
|
33
24
|
// so we extend the default FormikContext here with our own.
|
|
34
|
-
var value =
|
|
25
|
+
var value = useMemo(function () {
|
|
35
26
|
return _objectSpread(_objectSpread({}, formikContext), props);
|
|
36
27
|
}, [formikContext, props]);
|
|
37
|
-
return /*#__PURE__*/
|
|
28
|
+
return /*#__PURE__*/React.createElement(CustomFormikContext.Provider, {
|
|
38
29
|
value: value
|
|
39
|
-
}, /*#__PURE__*/
|
|
30
|
+
}, /*#__PURE__*/React.createElement(Form, null, children));
|
|
40
31
|
};
|
|
41
|
-
exports.FormikExtendedContextProvider = FormikExtendedContextProvider;
|
|
42
32
|
var FormikWrapper = function FormikWrapper(props) {
|
|
43
33
|
var initialValues = props.initialValues,
|
|
44
34
|
onSubmit = props.onSubmit,
|
|
@@ -50,7 +40,7 @@ var FormikWrapper = function FormikWrapper(props) {
|
|
|
50
40
|
children = props.children,
|
|
51
41
|
displayRequiredIndicator = props.displayRequiredIndicator,
|
|
52
42
|
restProps = _objectWithoutProperties(props, _excluded2);
|
|
53
|
-
return /*#__PURE__*/
|
|
43
|
+
return /*#__PURE__*/React.createElement(Formik, _extends({
|
|
54
44
|
initialValues: initialValues || {},
|
|
55
45
|
onSubmit: onSubmit,
|
|
56
46
|
validate: validate,
|
|
@@ -59,10 +49,9 @@ var FormikWrapper = function FormikWrapper(props) {
|
|
|
59
49
|
validateOnMount: validateOnMount,
|
|
60
50
|
onReset: onReset
|
|
61
51
|
}, restProps), function () {
|
|
62
|
-
return /*#__PURE__*/
|
|
52
|
+
return /*#__PURE__*/React.createElement(FormikExtendedContextProvider, {
|
|
63
53
|
displayRequiredIndicator: displayRequiredIndicator
|
|
64
54
|
}, children);
|
|
65
55
|
});
|
|
66
56
|
};
|
|
67
|
-
|
|
68
|
-
exports.default = _default;
|
|
57
|
+
export default FormikWrapper;
|
|
@@ -1,17 +1,10 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
var _react = _interopRequireDefault(require("react"));
|
|
8
|
-
var _reactI18next = require("react-i18next");
|
|
9
|
-
var _withMapping = _interopRequireDefault(require("../../../Context/withMapping"));
|
|
10
|
-
var _WysiwygField = _interopRequireDefault(require("../../WysiwygField"));
|
|
11
|
-
require("./style.scss");
|
|
12
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { useTranslation } from 'react-i18next';
|
|
3
|
+
import withMapping from '../../../Context/withMapping';
|
|
4
|
+
import WysiwygField from '../../WysiwygField';
|
|
5
|
+
import './style.scss';
|
|
13
6
|
var GenericFormElement = function GenericFormElement(props) {
|
|
14
|
-
var _useTranslation =
|
|
7
|
+
var _useTranslation = useTranslation(),
|
|
15
8
|
t = _useTranslation.t;
|
|
16
9
|
var className = props.className,
|
|
17
10
|
title = props.title,
|
|
@@ -22,23 +15,22 @@ var GenericFormElement = function GenericFormElement(props) {
|
|
|
22
15
|
error = props.error,
|
|
23
16
|
children = props.children,
|
|
24
17
|
displayRequiredIndicator = props.displayRequiredIndicator;
|
|
25
|
-
return /*#__PURE__*/
|
|
18
|
+
return /*#__PURE__*/React.createElement("div", {
|
|
26
19
|
className: error ? "FormElement ".concat(className, " error") : "FormElement ".concat(className)
|
|
27
|
-
}, title && /*#__PURE__*/
|
|
20
|
+
}, title && /*#__PURE__*/React.createElement("label", {
|
|
28
21
|
htmlFor: fieldName
|
|
29
|
-
}, title, !required && displayRequiredIndicator === 'optional' && /*#__PURE__*/
|
|
22
|
+
}, title, !required && displayRequiredIndicator === 'optional' && /*#__PURE__*/React.createElement("span", {
|
|
30
23
|
className: "FormElement__optional ".concat(className, "__optional")
|
|
31
|
-
}, t(['form.optional', ' - optioneel'])), required && displayRequiredIndicator === 'required' && /*#__PURE__*/
|
|
24
|
+
}, t(['form.optional', ' - optioneel'])), required && displayRequiredIndicator === 'required' && /*#__PURE__*/React.createElement("span", {
|
|
32
25
|
className: "FormElement__required ".concat(className, "__required")
|
|
33
|
-
}, t(['form.required', ' - vereist']))), /*#__PURE__*/
|
|
26
|
+
}, t(['form.required', ' - vereist']))), /*#__PURE__*/React.createElement("div", {
|
|
34
27
|
className: "FormElement__inner ".concat(className, "__inner")
|
|
35
|
-
}, children), description && /*#__PURE__*/
|
|
28
|
+
}, children), description && /*#__PURE__*/React.createElement(WysiwygField, {
|
|
36
29
|
property: "schema:text",
|
|
37
30
|
html: description,
|
|
38
31
|
className: "FormElement__description ".concat(className, "__description")
|
|
39
|
-
}), error && touched ? /*#__PURE__*/
|
|
32
|
+
}), error && touched ? /*#__PURE__*/React.createElement("div", {
|
|
40
33
|
className: "FormElement__error ".concat(className, "__error")
|
|
41
34
|
}, error) : null);
|
|
42
35
|
};
|
|
43
|
-
|
|
44
|
-
exports.default = _default;
|
|
36
|
+
export default withMapping(GenericFormElement);
|
|
@@ -1,17 +1,10 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
var _react = _interopRequireDefault(require("react"));
|
|
8
|
-
var _reactI18next = require("react-i18next");
|
|
9
|
-
var _TextField = _interopRequireDefault(require("../TextField"));
|
|
10
1
|
var _excluded = ["min", "max", "step", "required", "requiredError", "validation"];
|
|
11
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
12
2
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
13
3
|
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
14
4
|
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
5
|
+
import React from 'react';
|
|
6
|
+
import { useTranslation } from 'react-i18next';
|
|
7
|
+
import TextField from '../TextField';
|
|
15
8
|
var Number = function Number(props) {
|
|
16
9
|
var min = props.min,
|
|
17
10
|
max = props.max,
|
|
@@ -20,7 +13,7 @@ var Number = function Number(props) {
|
|
|
20
13
|
requiredError = props.requiredError,
|
|
21
14
|
validation = props.validation,
|
|
22
15
|
restProps = _objectWithoutProperties(props, _excluded);
|
|
23
|
-
var _useTranslation =
|
|
16
|
+
var _useTranslation = useTranslation(),
|
|
24
17
|
t = _useTranslation.t;
|
|
25
18
|
var handleValidation = function handleValidation(value) {
|
|
26
19
|
if (required && !value) {
|
|
@@ -40,7 +33,7 @@ var Number = function Number(props) {
|
|
|
40
33
|
return validation(value);
|
|
41
34
|
}
|
|
42
35
|
};
|
|
43
|
-
return /*#__PURE__*/
|
|
36
|
+
return /*#__PURE__*/React.createElement(TextField, _extends({}, restProps, {
|
|
44
37
|
type: "number",
|
|
45
38
|
validation: handleValidation,
|
|
46
39
|
min: min,
|
|
@@ -49,5 +42,4 @@ var Number = function Number(props) {
|
|
|
49
42
|
required: required
|
|
50
43
|
}));
|
|
51
44
|
};
|
|
52
|
-
|
|
53
|
-
exports.default = _default;
|
|
45
|
+
export default Number;
|
|
@@ -1,43 +1,36 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.default = void 0;
|
|
7
|
-
var _react = _interopRequireDefault(require("react"));
|
|
8
|
-
var _formik = require("formik");
|
|
9
|
-
var _classnames = _interopRequireDefault(require("classnames"));
|
|
10
|
-
var _reactI18next = require("react-i18next");
|
|
11
|
-
var _GenericFormElement = _interopRequireDefault(require("../GenericFormElement"));
|
|
12
|
-
var _FormikWrapper = require("../FormikWrapper");
|
|
13
|
-
require("./style.scss");
|
|
14
|
-
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
15
1
|
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
2
|
+
import React from 'react';
|
|
3
|
+
import { Field } from 'formik';
|
|
4
|
+
import c from 'classnames';
|
|
5
|
+
import { useTranslation } from 'react-i18next';
|
|
6
|
+
import GenericFormElement from '../GenericFormElement';
|
|
7
|
+
import { useExtendedFormikContext } from '../FormikWrapper';
|
|
8
|
+
import './style.scss';
|
|
16
9
|
var Radio = function Radio(props) {
|
|
17
10
|
var className = props.className,
|
|
18
11
|
disabled = props.disabled,
|
|
19
12
|
_onChange = props.onChange;
|
|
20
|
-
return /*#__PURE__*/
|
|
13
|
+
return /*#__PURE__*/React.createElement(Field, {
|
|
21
14
|
name: props.name,
|
|
22
15
|
validate: props.validate
|
|
23
16
|
}, function (_ref) {
|
|
24
17
|
var field = _ref.field,
|
|
25
18
|
form = _ref.form;
|
|
26
19
|
var name = "".concat(props.name, "--").concat(props.value);
|
|
27
|
-
var classes = (
|
|
20
|
+
var classes = c('WebformRadios__radio__input', {
|
|
28
21
|
'icon-before': true,
|
|
29
22
|
'icon-radio': true,
|
|
30
23
|
'icon-variant-0': !(field.value && field.value === props.value),
|
|
31
24
|
'icon-variant-1': field.value && field.value === props.value
|
|
32
25
|
});
|
|
33
26
|
if (props.value === '__other__') {
|
|
34
|
-
var inputClasses = (
|
|
27
|
+
var inputClasses = c({
|
|
35
28
|
hidden: field.value !== '__other__'
|
|
36
29
|
});
|
|
37
|
-
return /*#__PURE__*/
|
|
30
|
+
return /*#__PURE__*/React.createElement("label", {
|
|
38
31
|
htmlFor: name,
|
|
39
32
|
className: classes
|
|
40
|
-
}, /*#__PURE__*/
|
|
33
|
+
}, /*#__PURE__*/React.createElement("input", _extends({}, field, {
|
|
41
34
|
type: "radio",
|
|
42
35
|
id: name,
|
|
43
36
|
value: props.value,
|
|
@@ -49,7 +42,7 @@ var Radio = function Radio(props) {
|
|
|
49
42
|
}
|
|
50
43
|
field.onChange(event);
|
|
51
44
|
}
|
|
52
|
-
})), /*#__PURE__*/
|
|
45
|
+
})), /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement("span", null, props.otherLabel ? props.otherLabel : props.label), props.description && /*#__PURE__*/React.createElement("span", null, props.description)), /*#__PURE__*/React.createElement("textarea", {
|
|
53
46
|
placeholder: props.otherPlaceholder,
|
|
54
47
|
className: inputClasses,
|
|
55
48
|
onChange: function onChange(e) {
|
|
@@ -57,10 +50,10 @@ var Radio = function Radio(props) {
|
|
|
57
50
|
}
|
|
58
51
|
}));
|
|
59
52
|
}
|
|
60
|
-
return /*#__PURE__*/
|
|
53
|
+
return /*#__PURE__*/React.createElement("label", {
|
|
61
54
|
htmlFor: name,
|
|
62
55
|
className: classes
|
|
63
|
-
}, /*#__PURE__*/
|
|
56
|
+
}, /*#__PURE__*/React.createElement("input", _extends({}, field, {
|
|
64
57
|
type: "radio",
|
|
65
58
|
id: name,
|
|
66
59
|
value: props.value,
|
|
@@ -72,7 +65,7 @@ var Radio = function Radio(props) {
|
|
|
72
65
|
}
|
|
73
66
|
field.onChange(event);
|
|
74
67
|
}
|
|
75
|
-
})), /*#__PURE__*/
|
|
68
|
+
})), /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement("span", null, props.label), props.description && /*#__PURE__*/React.createElement("span", null, props.description)));
|
|
76
69
|
});
|
|
77
70
|
};
|
|
78
71
|
var RadioButtons = function RadioButtons(props) {
|
|
@@ -93,9 +86,9 @@ var RadioButtons = function RadioButtons(props) {
|
|
|
93
86
|
otherLabel = props.otherLabel,
|
|
94
87
|
otherPlaceholder = props.otherPlaceholder,
|
|
95
88
|
onChange = props.onChange;
|
|
96
|
-
var _useTranslation =
|
|
89
|
+
var _useTranslation = useTranslation(),
|
|
97
90
|
t = _useTranslation.t;
|
|
98
|
-
var _useExtendedFormikCon =
|
|
91
|
+
var _useExtendedFormikCon = useExtendedFormikContext(),
|
|
99
92
|
errors = _useExtendedFormikCon.errors,
|
|
100
93
|
touched = _useExtendedFormikCon.touched,
|
|
101
94
|
displayRequiredIndicator = _useExtendedFormikCon.displayRequiredIndicator;
|
|
@@ -109,8 +102,8 @@ var RadioButtons = function RadioButtons(props) {
|
|
|
109
102
|
return t(['webform.components.radio_buttons.required', 'webform.required', 'webform_required']);
|
|
110
103
|
}
|
|
111
104
|
};
|
|
112
|
-
return /*#__PURE__*/
|
|
113
|
-
className: (
|
|
105
|
+
return /*#__PURE__*/React.createElement(GenericFormElement, {
|
|
106
|
+
className: c('RadioButtons', wrapperClassName),
|
|
114
107
|
title: title,
|
|
115
108
|
required: required,
|
|
116
109
|
description: description,
|
|
@@ -121,11 +114,11 @@ var RadioButtons = function RadioButtons(props) {
|
|
|
121
114
|
}, Object.keys(options).map(function (value) {
|
|
122
115
|
var label = options[value];
|
|
123
116
|
var description = descriptions[value] || null;
|
|
124
|
-
return /*#__PURE__*/
|
|
117
|
+
return /*#__PURE__*/React.createElement(Radio, {
|
|
125
118
|
key: value,
|
|
126
119
|
label: label,
|
|
127
120
|
description: description,
|
|
128
|
-
className: (
|
|
121
|
+
className: c(className, {
|
|
129
122
|
'error': error && touched
|
|
130
123
|
}),
|
|
131
124
|
name: fieldName,
|
|
@@ -140,5 +133,4 @@ var RadioButtons = function RadioButtons(props) {
|
|
|
140
133
|
});
|
|
141
134
|
}));
|
|
142
135
|
};
|
|
143
|
-
|
|
144
|
-
exports.default = _default;
|
|
136
|
+
export default RadioButtons;
|