@iabbb/bds-react 0.38.6 → 0.38.7
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/Button/Button.js +74 -0
- package/Button/Button.js.map +1 -0
- package/Button/index.js +10 -0
- package/Button/index.js.map +1 -0
- package/CallToAction/CallToAction.js +42 -0
- package/CallToAction/CallToAction.js.map +1 -0
- package/CallToAction/index.js +10 -0
- package/CallToAction/index.js.map +1 -0
- package/ErrorSummary/ErrorSummary.js +115 -0
- package/ErrorSummary/ErrorSummary.js.map +1 -0
- package/ErrorSummary/index.js +14 -0
- package/ErrorSummary/index.js.map +1 -0
- package/{src/ErrorSummary → ErrorSummary}/utils.js +16 -14
- package/ErrorSummary/utils.js.map +1 -0
- package/FieldTextInput/FieldTextInput.js +68 -0
- package/FieldTextInput/FieldTextInput.js.map +1 -0
- package/FieldTextInput/index.js +10 -0
- package/FieldTextInput/index.js.map +1 -0
- package/Pagination/Pagination.js +114 -0
- package/Pagination/Pagination.js.map +1 -0
- package/Pagination/index.js +10 -0
- package/Pagination/index.js.map +1 -0
- package/README.md +0 -8
- package/Typography/Typography.js +58 -0
- package/Typography/Typography.js.map +1 -0
- package/Typography/index.js +10 -0
- package/Typography/index.js.map +1 -0
- package/_rollupPluginBabelHelpers-28932a37.js +73 -0
- package/_rollupPluginBabelHelpers-28932a37.js.map +1 -0
- package/index.js +21 -0
- package/index.js.map +1 -0
- package/package.json +15 -7
- package/src/Button/Button.js +0 -54
- package/src/Button/index.js +0 -1
- package/src/CallToAction/CallToAction.js +0 -16
- package/src/CallToAction/index.js +0 -1
- package/src/ErrorSummary/ErrorSummary.js +0 -102
- package/src/ErrorSummary/index.js +0 -2
- package/src/FieldTextInput/FieldTextInput.js +0 -46
- package/src/FieldTextInput/index.js +0 -1
- package/src/Pagination/Pagination.js +0 -101
- package/src/Pagination/index.js +0 -1
- package/src/Typography/Typography.js +0 -26
- package/src/Typography/index.js +0 -1
- package/src/index.js +0 -6
package/Button/Button.js
ADDED
|
@@ -0,0 +1,74 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var _rollupPluginBabelHelpers = require('../_rollupPluginBabelHelpers-28932a37.js');
|
|
4
|
+
var React = require('react');
|
|
5
|
+
|
|
6
|
+
function _interopNamespaceDefault(e) {
|
|
7
|
+
var n = Object.create(null);
|
|
8
|
+
if (e) {
|
|
9
|
+
Object.keys(e).forEach(function (k) {
|
|
10
|
+
if (k !== 'default') {
|
|
11
|
+
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
12
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
13
|
+
enumerable: true,
|
|
14
|
+
get: function () { return e[k]; }
|
|
15
|
+
});
|
|
16
|
+
}
|
|
17
|
+
});
|
|
18
|
+
}
|
|
19
|
+
n.default = e;
|
|
20
|
+
return Object.freeze(n);
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
|
|
24
|
+
|
|
25
|
+
var _excluded = ["children", "className", "onClick", "preventDoubleClick", "variant"];
|
|
26
|
+
var DEBOUNCE_TIMEOUT_IN_SECONDS = 1;
|
|
27
|
+
var Button = /*#__PURE__*/React__namespace.forwardRef(function (_ref, ref) {
|
|
28
|
+
var children = _ref.children,
|
|
29
|
+
className = _ref.className,
|
|
30
|
+
onClick = _ref.onClick,
|
|
31
|
+
_ref$preventDoubleCli = _ref.preventDoubleClick,
|
|
32
|
+
preventDoubleClick = _ref$preventDoubleCli === void 0 ? false : _ref$preventDoubleCli,
|
|
33
|
+
_ref$variant = _ref.variant,
|
|
34
|
+
variant = _ref$variant === void 0 ? 'standard' : _ref$variant,
|
|
35
|
+
props = _rollupPluginBabelHelpers._objectWithoutProperties(_ref, _excluded);
|
|
36
|
+
var debounceClicks = React__namespace.useRef(false);
|
|
37
|
+
var handleClick = function handleClick(event) {
|
|
38
|
+
// 👇 button is not configured to ignore double clicks
|
|
39
|
+
if (!preventDoubleClick) {
|
|
40
|
+
if (onClick) {
|
|
41
|
+
onClick(event);
|
|
42
|
+
}
|
|
43
|
+
return;
|
|
44
|
+
}
|
|
45
|
+
|
|
46
|
+
// 👇 button has been clicked recently, and subsequent clicks are prevented
|
|
47
|
+
if (debounceClicks.current) {
|
|
48
|
+
event.preventDefault();
|
|
49
|
+
return false;
|
|
50
|
+
}
|
|
51
|
+
if (onClick) {
|
|
52
|
+
onClick(event);
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
// 👇 block from double clicks
|
|
56
|
+
debounceClicks.current = true;
|
|
57
|
+
|
|
58
|
+
// 👇 and remove the block after a given amount of seconds
|
|
59
|
+
setTimeout(function () {
|
|
60
|
+
debounceClicks.current = false;
|
|
61
|
+
}, DEBOUNCE_TIMEOUT_IN_SECONDS * 1000);
|
|
62
|
+
};
|
|
63
|
+
return /*#__PURE__*/React__namespace.createElement("button", _rollupPluginBabelHelpers._extends({
|
|
64
|
+
className: [variant === 'unstyled' ? 'bds-button-unstyled' : 'bds-button', className].filter(function (x) {
|
|
65
|
+
return x;
|
|
66
|
+
}).join(' '),
|
|
67
|
+
"data-type": variant !== 'standard' && variant !== 'unstyled' ? variant : null,
|
|
68
|
+
onClick: handleClick,
|
|
69
|
+
ref: ref
|
|
70
|
+
}, props), children);
|
|
71
|
+
});
|
|
72
|
+
|
|
73
|
+
module.exports = Button;
|
|
74
|
+
//# sourceMappingURL=Button.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Button.js","sources":["../../src/Button/Button.js"],"sourcesContent":["import * as React from 'react';\n\nconst DEBOUNCE_TIMEOUT_IN_SECONDS = 1;\n\nconst Button = React.forwardRef(\n ({ children, className, onClick, preventDoubleClick = false, variant = 'standard', ...props }, ref) => {\n const debounceClicks = React.useRef(false);\n\n const handleClick = (event) => {\n // 👇 button is not configured to ignore double clicks\n if (!preventDoubleClick) {\n if (onClick) {\n onClick(event);\n }\n\n return;\n }\n\n // 👇 button has been clicked recently, and subsequent clicks are prevented\n if (debounceClicks.current) {\n event.preventDefault();\n return false;\n }\n\n if (onClick) {\n onClick(event);\n }\n\n // 👇 block from double clicks\n debounceClicks.current = true;\n\n // 👇 and remove the block after a given amount of seconds\n setTimeout(() => {\n debounceClicks.current = false;\n }, DEBOUNCE_TIMEOUT_IN_SECONDS * 1000);\n };\n\n return (\n <button\n className={[variant === 'unstyled' ? 'bds-button-unstyled' : 'bds-button', className]\n .filter((x) => x)\n .join(' ')}\n data-type={variant !== 'standard' && variant !== 'unstyled' ? variant : null}\n onClick={handleClick}\n ref={ref}\n {...props}\n >\n {children}\n </button>\n );\n },\n);\n\nexport default Button;\n"],"names":["DEBOUNCE_TIMEOUT_IN_SECONDS","Button","React","forwardRef","_ref","ref","children","className","onClick","_ref$preventDoubleCli","preventDoubleClick","_ref$variant","variant","props","_objectWithoutProperties","_excluded","debounceClicks","useRef","handleClick","event","current","preventDefault","setTimeout","createElement","_extends","filter","x","join"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAEA,IAAMA,2BAA2B,GAAG,CAAC,CAAA;AAE/BC,IAAAA,MAAM,gBAAGC,gBAAK,CAACC,UAAU,CAC7B,UAAAC,IAAA,EAA+FC,GAAG,EAAK;AAAA,EAAA,IAApGC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;IAAEC,SAAS,GAAAH,IAAA,CAATG,SAAS;IAAEC,OAAO,GAAAJ,IAAA,CAAPI,OAAO;IAAAC,qBAAA,GAAAL,IAAA,CAAEM,kBAAkB;AAAlBA,IAAAA,kBAAkB,GAAAD,qBAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,qBAAA;IAAAE,YAAA,GAAAP,IAAA,CAAEQ,OAAO;AAAPA,IAAAA,OAAO,GAAAD,YAAA,KAAG,KAAA,CAAA,GAAA,UAAU,GAAAA,YAAA;AAAKE,IAAAA,KAAK,GAAAC,kDAAA,CAAAV,IAAA,EAAAW,SAAA,CAAA,CAAA;AACzF,EAAA,IAAMC,cAAc,GAAGd,gBAAK,CAACe,MAAM,CAAC,KAAK,CAAC,CAAA;AAE1C,EAAA,IAAMC,WAAW,GAAG,SAAdA,WAAWA,CAAIC,KAAK,EAAK;AAC7B;IACA,IAAI,CAACT,kBAAkB,EAAE;AACvB,MAAA,IAAIF,OAAO,EAAE;QACXA,OAAO,CAACW,KAAK,CAAC,CAAA;AAChB,OAAA;AAEA,MAAA,OAAA;AACF,KAAA;;AAEA;IACA,IAAIH,cAAc,CAACI,OAAO,EAAE;MAC1BD,KAAK,CAACE,cAAc,EAAE,CAAA;AACtB,MAAA,OAAO,KAAK,CAAA;AACd,KAAA;AAEA,IAAA,IAAIb,OAAO,EAAE;MACXA,OAAO,CAACW,KAAK,CAAC,CAAA;AAChB,KAAA;;AAEA;IACAH,cAAc,CAACI,OAAO,GAAG,IAAI,CAAA;;AAE7B;AACAE,IAAAA,UAAU,CAAC,YAAM;MACfN,cAAc,CAACI,OAAO,GAAG,KAAK,CAAA;AAChC,KAAC,EAAEpB,2BAA2B,GAAG,IAAI,CAAC,CAAA;GACvC,CAAA;AAED,EAAA,oBACEE,gBAAA,CAAAqB,aAAA,CAAA,QAAA,EAAAC,kCAAA,CAAA;AACEjB,IAAAA,SAAS,EAAE,CAACK,OAAO,KAAK,UAAU,GAAG,qBAAqB,GAAG,YAAY,EAAEL,SAAS,CAAC,CAClFkB,MAAM,CAAC,UAACC,CAAC,EAAA;AAAA,MAAA,OAAKA,CAAC,CAAA;AAAA,KAAA,CAAC,CAChBC,IAAI,CAAC,GAAG,CAAE;IACb,WAAWf,EAAAA,OAAO,KAAK,UAAU,IAAIA,OAAO,KAAK,UAAU,GAAGA,OAAO,GAAG,IAAK;AAC7EJ,IAAAA,OAAO,EAAEU,WAAY;AACrBb,IAAAA,GAAG,EAAEA,GAAAA;GACDQ,EAAAA,KAAK,CAERP,EAAAA,QACK,CAAC,CAAA;AAEb,CACF;;;;"}
|
package/Button/index.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var _rollupPluginBabelHelpers = require('../_rollupPluginBabelHelpers-28932a37.js');
|
|
4
|
+
var React = require('react');
|
|
5
|
+
|
|
6
|
+
function _interopNamespaceDefault(e) {
|
|
7
|
+
var n = Object.create(null);
|
|
8
|
+
if (e) {
|
|
9
|
+
Object.keys(e).forEach(function (k) {
|
|
10
|
+
if (k !== 'default') {
|
|
11
|
+
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
12
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
13
|
+
enumerable: true,
|
|
14
|
+
get: function () { return e[k]; }
|
|
15
|
+
});
|
|
16
|
+
}
|
|
17
|
+
});
|
|
18
|
+
}
|
|
19
|
+
n.default = e;
|
|
20
|
+
return Object.freeze(n);
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
|
|
24
|
+
|
|
25
|
+
var _excluded = ["children", "className", "variant"];
|
|
26
|
+
var CallToAction = /*#__PURE__*/React__namespace.forwardRef(function (_ref, ref) {
|
|
27
|
+
var children = _ref.children,
|
|
28
|
+
className = _ref.className,
|
|
29
|
+
_ref$variant = _ref.variant,
|
|
30
|
+
variant = _ref$variant === void 0 ? 'standard' : _ref$variant,
|
|
31
|
+
props = _rollupPluginBabelHelpers._objectWithoutProperties(_ref, _excluded);
|
|
32
|
+
return /*#__PURE__*/React__namespace.createElement("a", _rollupPluginBabelHelpers._extends({
|
|
33
|
+
className: ['bds-cta', className].filter(function (x) {
|
|
34
|
+
return x;
|
|
35
|
+
}).join(' '),
|
|
36
|
+
"data-type": variant !== 'standard' ? variant : null,
|
|
37
|
+
ref: ref
|
|
38
|
+
}, props), children);
|
|
39
|
+
});
|
|
40
|
+
|
|
41
|
+
module.exports = CallToAction;
|
|
42
|
+
//# sourceMappingURL=CallToAction.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"CallToAction.js","sources":["../../src/CallToAction/CallToAction.js"],"sourcesContent":["import * as React from 'react';\n\nconst CallToAction = React.forwardRef(({ children, className, variant = 'standard', ...props }, ref) => {\n return (\n <a\n className={['bds-cta', className].filter((x) => x).join(' ')}\n data-type={variant !== 'standard' ? variant : null}\n ref={ref}\n {...props}\n >\n {children}\n </a>\n );\n});\n\nexport default CallToAction;\n"],"names":["CallToAction","React","forwardRef","_ref","ref","children","className","_ref$variant","variant","props","_objectWithoutProperties","_excluded","createElement","_extends","filter","x","join"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAEMA,IAAAA,YAAY,gBAAGC,gBAAK,CAACC,UAAU,CAAC,UAAAC,IAAA,EAA0DC,GAAG,EAAK;AAAA,EAAA,IAA/DC,QAAQ,GAAAF,IAAA,CAARE,QAAQ;IAAEC,SAAS,GAAAH,IAAA,CAATG,SAAS;IAAAC,YAAA,GAAAJ,IAAA,CAAEK,OAAO;AAAPA,IAAAA,OAAO,GAAAD,YAAA,KAAG,KAAA,CAAA,GAAA,UAAU,GAAAA,YAAA;AAAKE,IAAAA,KAAK,GAAAC,kDAAA,CAAAP,IAAA,EAAAQ,SAAA,CAAA,CAAA;AAC1F,EAAA,oBACEV,gBAAA,CAAAW,aAAA,CAAA,GAAA,EAAAC,kCAAA,CAAA;IACEP,SAAS,EAAE,CAAC,SAAS,EAAEA,SAAS,CAAC,CAACQ,MAAM,CAAC,UAACC,CAAC,EAAA;AAAA,MAAA,OAAKA,CAAC,CAAA;AAAA,KAAA,CAAC,CAACC,IAAI,CAAC,GAAG,CAAE;AAC7D,IAAA,WAAA,EAAWR,OAAO,KAAK,UAAU,GAAGA,OAAO,GAAG,IAAK;AACnDJ,IAAAA,GAAG,EAAEA,GAAAA;GACDK,EAAAA,KAAK,CAERJ,EAAAA,QACA,CAAC,CAAA;AAER,CAAC;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
|
|
@@ -0,0 +1,115 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var _rollupPluginBabelHelpers = require('../_rollupPluginBabelHelpers-28932a37.js');
|
|
6
|
+
var React = require('react');
|
|
7
|
+
var ErrorSummary_utils = require('./utils.js');
|
|
8
|
+
|
|
9
|
+
function _interopNamespaceDefault(e) {
|
|
10
|
+
var n = Object.create(null);
|
|
11
|
+
if (e) {
|
|
12
|
+
Object.keys(e).forEach(function (k) {
|
|
13
|
+
if (k !== 'default') {
|
|
14
|
+
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
15
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
16
|
+
enumerable: true,
|
|
17
|
+
get: function () { return e[k]; }
|
|
18
|
+
});
|
|
19
|
+
}
|
|
20
|
+
});
|
|
21
|
+
}
|
|
22
|
+
n.default = e;
|
|
23
|
+
return Object.freeze(n);
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
|
|
27
|
+
|
|
28
|
+
var _excluded = ["className", "errors", "mapNameToId"];
|
|
29
|
+
var FormErrorKey = '_form';
|
|
30
|
+
var FINAL_FORM_ERROR = 'FINAL_FORM/form-error';
|
|
31
|
+
function BdsErrorSummary(_ref) {
|
|
32
|
+
var className = _ref.className,
|
|
33
|
+
errors = _ref.errors,
|
|
34
|
+
_ref$mapNameToId = _ref.mapNameToId,
|
|
35
|
+
mapNameToId = _ref$mapNameToId === void 0 ? function (name) {
|
|
36
|
+
return name;
|
|
37
|
+
} : _ref$mapNameToId,
|
|
38
|
+
props = _rollupPluginBabelHelpers._objectWithoutProperties(_ref, _excluded);
|
|
39
|
+
var headingId = React__namespace.useId();
|
|
40
|
+
var groupRef = React__namespace.useRef(null);
|
|
41
|
+
React__namespace.useEffect(function () {
|
|
42
|
+
if (!errors || Object.keys(errors).length === 0) return;
|
|
43
|
+
if (!groupRef.current) return;
|
|
44
|
+
groupRef.current.focus();
|
|
45
|
+
}, [errors]);
|
|
46
|
+
if (!errors || Object.keys(errors).length === 0) return null;
|
|
47
|
+
var handleLinkClick = function handleLinkClick(e) {
|
|
48
|
+
var inputId = ErrorSummary_utils.getFragmentFromUrl(e.currentTarget.href);
|
|
49
|
+
if (!inputId) {
|
|
50
|
+
return;
|
|
51
|
+
}
|
|
52
|
+
var input = document.getElementById(inputId);
|
|
53
|
+
if (!input) {
|
|
54
|
+
return;
|
|
55
|
+
}
|
|
56
|
+
var legendOrLabel = ErrorSummary_utils.getAssociatedLegendOrLabel(input);
|
|
57
|
+
if (!legendOrLabel) {
|
|
58
|
+
return;
|
|
59
|
+
}
|
|
60
|
+
e.preventDefault();
|
|
61
|
+
legendOrLabel.scrollIntoView();
|
|
62
|
+
input.focus({
|
|
63
|
+
preventScroll: true
|
|
64
|
+
});
|
|
65
|
+
};
|
|
66
|
+
return /*#__PURE__*/React__namespace.createElement("bds-error-summary", _rollupPluginBabelHelpers._extends({
|
|
67
|
+
className: ['stack', className].filter(function (x) {
|
|
68
|
+
return x;
|
|
69
|
+
}).join(' '),
|
|
70
|
+
role: "group",
|
|
71
|
+
"aria-labelledby": headingId,
|
|
72
|
+
ref: groupRef,
|
|
73
|
+
tabIndex: -1
|
|
74
|
+
}, props), /*#__PURE__*/React__namespace.createElement("h2", {
|
|
75
|
+
className: "bds-h5",
|
|
76
|
+
id: headingId
|
|
77
|
+
}, /*#__PURE__*/React__namespace.createElement("svg", {
|
|
78
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
79
|
+
viewBox: "0 0 512 512",
|
|
80
|
+
"aria-hidden": "true",
|
|
81
|
+
height: "1em",
|
|
82
|
+
width: "1em",
|
|
83
|
+
fill: "currentColor"
|
|
84
|
+
}, /*#__PURE__*/React__namespace.createElement("path", {
|
|
85
|
+
d: "M256 32c14.2 0 27.3 7.5 34.5 19.8l216 368c7.3 12.4 7.3 27.7.2 40.1S486.3 480 472 480H40c-14.3 0-27.6-7.7-34.7-20.1s-7-27.8.2-40.1l216-368C228.7 39.5 241.8 32 256 32zm0 128c-13.3 0-24 10.7-24 24v112c0 13.3 10.7 24 24 24s24-10.7 24-24V184c0-13.3-10.7-24-24-24zm32 224c0-17.7-14.3-32-32-32s-32 14.3-32 32 14.3 32 32 32 32-14.3 32-32z"
|
|
86
|
+
})), "Issue"), /*#__PURE__*/React__namespace.createElement("ul", null, Object.keys(errors).map(function (errorKey) {
|
|
87
|
+
var message = errors[errorKey];
|
|
88
|
+
var isFormError = [FINAL_FORM_ERROR, FormErrorKey].includes(errorKey);
|
|
89
|
+
if (isFormError) {
|
|
90
|
+
return /*#__PURE__*/React__namespace.createElement("li", {
|
|
91
|
+
key: errorKey,
|
|
92
|
+
dangerouslySetInnerHTML: {
|
|
93
|
+
__html: message
|
|
94
|
+
}
|
|
95
|
+
});
|
|
96
|
+
}
|
|
97
|
+
var isArrayField = Array.isArray(message);
|
|
98
|
+
var messages = isArrayField ? message : [message];
|
|
99
|
+
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, {
|
|
100
|
+
key: errorKey
|
|
101
|
+
}, messages.map(function (fieldMessage, index) {
|
|
102
|
+
var inputId = "".concat(mapNameToId(errorKey)).concat(isArrayField ? "[".concat(index, "]") : '');
|
|
103
|
+
return /*#__PURE__*/React__namespace.createElement("li", {
|
|
104
|
+
key: inputId
|
|
105
|
+
}, /*#__PURE__*/React__namespace.createElement("a", {
|
|
106
|
+
href: "#".concat(inputId),
|
|
107
|
+
onClick: handleLinkClick
|
|
108
|
+
}, fieldMessage, messages.length > 1 ? " (".concat(index + 1, " of ").concat(messages.length, ")") : undefined));
|
|
109
|
+
}));
|
|
110
|
+
})));
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
exports.FormErrorKey = FormErrorKey;
|
|
114
|
+
exports.default = BdsErrorSummary;
|
|
115
|
+
//# sourceMappingURL=ErrorSummary.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ErrorSummary.js","sources":["../../src/ErrorSummary/ErrorSummary.js"],"sourcesContent":["import * as React from 'react';\n\nimport { getAssociatedLegendOrLabel, getFragmentFromUrl } from './utils';\n\nexport const FormErrorKey = '_form';\n\nconst FINAL_FORM_ERROR = 'FINAL_FORM/form-error';\n\nexport default function BdsErrorSummary({ className, errors, mapNameToId = (name) => name, ...props }) {\n const headingId = React.useId();\n const groupRef = React.useRef(null);\n\n React.useEffect(() => {\n if (!errors || Object.keys(errors).length === 0) return;\n if (!groupRef.current) return;\n\n groupRef.current.focus();\n }, [errors]);\n\n if (!errors || Object.keys(errors).length === 0) return null;\n\n const handleLinkClick = (e) => {\n const inputId = getFragmentFromUrl(e.currentTarget.href);\n\n if (!inputId) {\n return;\n }\n\n const input = document.getElementById(inputId);\n\n if (!input) {\n return;\n }\n\n const legendOrLabel = getAssociatedLegendOrLabel(input);\n\n if (!legendOrLabel) {\n return;\n }\n\n e.preventDefault();\n\n legendOrLabel.scrollIntoView();\n input.focus({ preventScroll: true });\n };\n\n return (\n <bds-error-summary\n className={['stack', className].filter((x) => x).join(' ')}\n role=\"group\"\n aria-labelledby={headingId}\n ref={groupRef}\n tabIndex={-1}\n {...props}\n >\n <h2 className=\"bds-h5\" id={headingId}>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 512 512\"\n aria-hidden=\"true\"\n height=\"1em\"\n width=\"1em\"\n fill=\"currentColor\"\n >\n <path d=\"M256 32c14.2 0 27.3 7.5 34.5 19.8l216 368c7.3 12.4 7.3 27.7.2 40.1S486.3 480 472 480H40c-14.3 0-27.6-7.7-34.7-20.1s-7-27.8.2-40.1l216-368C228.7 39.5 241.8 32 256 32zm0 128c-13.3 0-24 10.7-24 24v112c0 13.3 10.7 24 24 24s24-10.7 24-24V184c0-13.3-10.7-24-24-24zm32 224c0-17.7-14.3-32-32-32s-32 14.3-32 32 14.3 32 32 32 32-14.3 32-32z\" />\n </svg>\n Issue\n </h2>\n <ul>\n {Object.keys(errors).map((errorKey) => {\n const message = errors[errorKey];\n const isFormError = [FINAL_FORM_ERROR, FormErrorKey].includes(errorKey);\n\n if (isFormError) {\n return <li key={errorKey} dangerouslySetInnerHTML={{ __html: message }} />;\n }\n\n const isArrayField = Array.isArray(message);\n\n const messages = isArrayField ? message : [message];\n\n return (\n <React.Fragment key={errorKey}>\n {messages.map((fieldMessage, index) => {\n const inputId = `${mapNameToId(errorKey)}${isArrayField ? `[${index}]` : ''}`;\n\n return (\n <li key={inputId}>\n <a href={`#${inputId}`} onClick={handleLinkClick}>\n {fieldMessage}\n {messages.length > 1 ? ` (${index + 1} of ${messages.length})` : undefined}\n </a>\n </li>\n );\n })}\n </React.Fragment>\n );\n })}\n </ul>\n </bds-error-summary>\n );\n}\n"],"names":["FormErrorKey","FINAL_FORM_ERROR","BdsErrorSummary","_ref","className","errors","_ref$mapNameToId","mapNameToId","name","props","_objectWithoutProperties","_excluded","headingId","React","useId","groupRef","useRef","useEffect","Object","keys","length","current","focus","handleLinkClick","e","inputId","getFragmentFromUrl","currentTarget","href","input","document","getElementById","legendOrLabel","getAssociatedLegendOrLabel","preventDefault","scrollIntoView","preventScroll","createElement","_extends","filter","x","join","role","ref","tabIndex","id","xmlns","viewBox","height","width","fill","d","map","errorKey","message","isFormError","includes","key","dangerouslySetInnerHTML","__html","isArrayField","Array","isArray","messages","Fragment","fieldMessage","index","concat","onClick","undefined"],"mappings":"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"}
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var ErrorSummary_ErrorSummary = require('./ErrorSummary.js');
|
|
6
|
+
require('../_rollupPluginBabelHelpers-28932a37.js');
|
|
7
|
+
require('react');
|
|
8
|
+
require('./utils.js');
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
exports.FormErrorKey = ErrorSummary_ErrorSummary.FormErrorKey;
|
|
13
|
+
exports.default = ErrorSummary_ErrorSummary.default;
|
|
14
|
+
//# sourceMappingURL=index.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;"}
|
|
@@ -1,15 +1,15 @@
|
|
|
1
|
-
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
function getFragmentFromUrl(url) {
|
|
2
4
|
return url.includes('#') ? url.split('#').pop() : undefined;
|
|
3
5
|
}
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
6
|
+
function getAssociatedLegendOrLabel(input) {
|
|
7
|
+
var _document$querySelect;
|
|
8
|
+
var fieldset = input.closest('fieldset');
|
|
8
9
|
if (fieldset) {
|
|
9
|
-
|
|
10
|
-
|
|
10
|
+
var legends = fieldset.getElementsByTagName('legend');
|
|
11
11
|
if (legends.length) {
|
|
12
|
-
|
|
12
|
+
var candidateLegend = legends[0];
|
|
13
13
|
|
|
14
14
|
// If the input type is radio or checkbox, always use the legend if there
|
|
15
15
|
// is one.
|
|
@@ -23,20 +23,22 @@ export function getAssociatedLegendOrLabel(input) {
|
|
|
23
23
|
//
|
|
24
24
|
// This should avoid situations where the input either ends up off the
|
|
25
25
|
// screen, or obscured by a software keyboard.
|
|
26
|
-
|
|
27
|
-
|
|
26
|
+
var legendTop = candidateLegend.getBoundingClientRect().top;
|
|
27
|
+
var inputRect = input.getBoundingClientRect();
|
|
28
28
|
|
|
29
29
|
// If the browser doesn't support Element.getBoundingClientRect().height
|
|
30
30
|
// or window.innerHeight (like IE8), bail and just link to the label.
|
|
31
31
|
if (inputRect.height && window.innerHeight) {
|
|
32
|
-
|
|
33
|
-
|
|
32
|
+
var inputBottom = inputRect.top + inputRect.height;
|
|
34
33
|
if (inputBottom - legendTop < window.innerHeight / 2) {
|
|
35
34
|
return candidateLegend;
|
|
36
35
|
}
|
|
37
36
|
}
|
|
38
37
|
}
|
|
39
38
|
}
|
|
40
|
-
|
|
41
|
-
return document.querySelector(`label[for='${input.getAttribute('id')}']`) ?? input.closest('label');
|
|
39
|
+
return (_document$querySelect = document.querySelector("label[for='".concat(input.getAttribute('id'), "']"))) !== null && _document$querySelect !== void 0 ? _document$querySelect : input.closest('label');
|
|
42
40
|
}
|
|
41
|
+
|
|
42
|
+
exports.getAssociatedLegendOrLabel = getAssociatedLegendOrLabel;
|
|
43
|
+
exports.getFragmentFromUrl = getFragmentFromUrl;
|
|
44
|
+
//# sourceMappingURL=utils.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"utils.js","sources":["../../src/ErrorSummary/utils.js"],"sourcesContent":["export function getFragmentFromUrl(url) {\n return url.includes('#') ? url.split('#').pop() : undefined;\n}\n\nexport function getAssociatedLegendOrLabel(input) {\n const fieldset = input.closest('fieldset');\n\n if (fieldset) {\n const legends = fieldset.getElementsByTagName('legend');\n\n if (legends.length) {\n const candidateLegend = legends[0];\n\n // If the input type is radio or checkbox, always use the legend if there\n // is one.\n if (input instanceof HTMLInputElement && (input.type === 'checkbox' || input.type === 'radio')) {\n return candidateLegend;\n }\n\n // For other input types, only scroll to the fieldset’s legend (instead of\n // the label associated with the input) if the input would end up in the\n // top half of the screen.\n //\n // This should avoid situations where the input either ends up off the\n // screen, or obscured by a software keyboard.\n const legendTop = candidateLegend.getBoundingClientRect().top;\n const inputRect = input.getBoundingClientRect();\n\n // If the browser doesn't support Element.getBoundingClientRect().height\n // or window.innerHeight (like IE8), bail and just link to the label.\n if (inputRect.height && window.innerHeight) {\n const inputBottom = inputRect.top + inputRect.height;\n\n if (inputBottom - legendTop < window.innerHeight / 2) {\n return candidateLegend;\n }\n }\n }\n }\n\n return document.querySelector(`label[for='${input.getAttribute('id')}']`) ?? input.closest('label');\n}\n"],"names":["getFragmentFromUrl","url","includes","split","pop","undefined","getAssociatedLegendOrLabel","input","_document$querySelect","fieldset","closest","legends","getElementsByTagName","length","candidateLegend","HTMLInputElement","type","legendTop","getBoundingClientRect","top","inputRect","height","window","innerHeight","inputBottom","document","querySelector","concat","getAttribute"],"mappings":";;AAAO,SAASA,kBAAkBA,CAACC,GAAG,EAAE;AACtC,EAAA,OAAOA,GAAG,CAACC,QAAQ,CAAC,GAAG,CAAC,GAAGD,GAAG,CAACE,KAAK,CAAC,GAAG,CAAC,CAACC,GAAG,EAAE,GAAGC,SAAS,CAAA;AAC7D,CAAA;AAEO,SAASC,0BAA0BA,CAACC,KAAK,EAAE;AAAA,EAAA,IAAAC,qBAAA,CAAA;AAChD,EAAA,IAAMC,QAAQ,GAAGF,KAAK,CAACG,OAAO,CAAC,UAAU,CAAC,CAAA;AAE1C,EAAA,IAAID,QAAQ,EAAE;AACZ,IAAA,IAAME,OAAO,GAAGF,QAAQ,CAACG,oBAAoB,CAAC,QAAQ,CAAC,CAAA;IAEvD,IAAID,OAAO,CAACE,MAAM,EAAE;AAClB,MAAA,IAAMC,eAAe,GAAGH,OAAO,CAAC,CAAC,CAAC,CAAA;;AAElC;AACA;AACA,MAAA,IAAIJ,KAAK,YAAYQ,gBAAgB,KAAKR,KAAK,CAACS,IAAI,KAAK,UAAU,IAAIT,KAAK,CAACS,IAAI,KAAK,OAAO,CAAC,EAAE;AAC9F,QAAA,OAAOF,eAAe,CAAA;AACxB,OAAA;;AAEA;AACA;AACA;AACA;AACA;AACA;MACA,IAAMG,SAAS,GAAGH,eAAe,CAACI,qBAAqB,EAAE,CAACC,GAAG,CAAA;AAC7D,MAAA,IAAMC,SAAS,GAAGb,KAAK,CAACW,qBAAqB,EAAE,CAAA;;AAE/C;AACA;AACA,MAAA,IAAIE,SAAS,CAACC,MAAM,IAAIC,MAAM,CAACC,WAAW,EAAE;QAC1C,IAAMC,WAAW,GAAGJ,SAAS,CAACD,GAAG,GAAGC,SAAS,CAACC,MAAM,CAAA;QAEpD,IAAIG,WAAW,GAAGP,SAAS,GAAGK,MAAM,CAACC,WAAW,GAAG,CAAC,EAAE;AACpD,UAAA,OAAOT,eAAe,CAAA;AACxB,SAAA;AACF,OAAA;AACF,KAAA;AACF,GAAA;EAEA,OAAAN,CAAAA,qBAAA,GAAOiB,QAAQ,CAACC,aAAa,CAAAC,aAAAA,CAAAA,MAAA,CAAepB,KAAK,CAACqB,YAAY,CAAC,IAAI,CAAC,EAAI,IAAA,CAAA,CAAC,MAAApB,IAAAA,IAAAA,qBAAA,KAAAA,KAAAA,CAAAA,GAAAA,qBAAA,GAAID,KAAK,CAACG,OAAO,CAAC,OAAO,CAAC,CAAA;AACrG;;;;;"}
|
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var _rollupPluginBabelHelpers = require('../_rollupPluginBabelHelpers-28932a37.js');
|
|
4
|
+
var React = require('react');
|
|
5
|
+
|
|
6
|
+
function _interopNamespaceDefault(e) {
|
|
7
|
+
var n = Object.create(null);
|
|
8
|
+
if (e) {
|
|
9
|
+
Object.keys(e).forEach(function (k) {
|
|
10
|
+
if (k !== 'default') {
|
|
11
|
+
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
12
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
13
|
+
enumerable: true,
|
|
14
|
+
get: function () { return e[k]; }
|
|
15
|
+
});
|
|
16
|
+
}
|
|
17
|
+
});
|
|
18
|
+
}
|
|
19
|
+
n.default = e;
|
|
20
|
+
return Object.freeze(n);
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
|
|
24
|
+
|
|
25
|
+
var _excluded = ["as", "error", "hint", "id", "isOptional", "label"];
|
|
26
|
+
function FieldTextInput(_ref) {
|
|
27
|
+
var _id;
|
|
28
|
+
var as = _ref.as,
|
|
29
|
+
error = _ref.error,
|
|
30
|
+
hint = _ref.hint,
|
|
31
|
+
id = _ref.id,
|
|
32
|
+
_ref$isOptional = _ref.isOptional,
|
|
33
|
+
isOptional = _ref$isOptional === void 0 ? false : _ref$isOptional,
|
|
34
|
+
label = _ref.label,
|
|
35
|
+
props = _rollupPluginBabelHelpers._objectWithoutProperties(_ref, _excluded);
|
|
36
|
+
id = (_id = id) !== null && _id !== void 0 ? _id : props.name;
|
|
37
|
+
var errorId = React__namespace.useId();
|
|
38
|
+
var hintId = React__namespace.useId();
|
|
39
|
+
var InputComponent = as !== null && as !== void 0 ? as : 'input';
|
|
40
|
+
return /*#__PURE__*/React__namespace.createElement("div", {
|
|
41
|
+
className: "bds-text-input stack"
|
|
42
|
+
}, /*#__PURE__*/React__namespace.createElement("label", {
|
|
43
|
+
htmlFor: id
|
|
44
|
+
}, label, isOptional && ' (optional)'), hint && /*#__PURE__*/React__namespace.createElement("span", {
|
|
45
|
+
className: "bds-hint",
|
|
46
|
+
id: hintId
|
|
47
|
+
}, hint), error && /*#__PURE__*/React__namespace.createElement("span", {
|
|
48
|
+
className: "bds-error",
|
|
49
|
+
id: errorId
|
|
50
|
+
}, /*#__PURE__*/React__namespace.createElement("svg", {
|
|
51
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
52
|
+
viewBox: "0 0 512 512",
|
|
53
|
+
"aria-hidden": "true",
|
|
54
|
+
height: "1em",
|
|
55
|
+
width: "1em",
|
|
56
|
+
fill: "currentColor"
|
|
57
|
+
}, /*#__PURE__*/React__namespace.createElement("path", {
|
|
58
|
+
d: "M256 32c14.2 0 27.3 7.5 34.5 19.8l216 368c7.3 12.4 7.3 27.7.2 40.1S486.3 480 472 480H40c-14.3 0-27.6-7.7-34.7-20.1s-7-27.8.2-40.1l216-368C228.7 39.5 241.8 32 256 32zm0 128c-13.3 0-24 10.7-24 24v112c0 13.3 10.7 24 24 24s24-10.7 24-24V184c0-13.3-10.7-24-24-24zm32 224c0-17.7-14.3-32-32-32s-32 14.3-32 32 14.3 32 32 32 32-14.3 32-32z"
|
|
59
|
+
})), error), /*#__PURE__*/React__namespace.createElement(InputComponent, _rollupPluginBabelHelpers._extends({
|
|
60
|
+
"aria-invalid": error ? true : undefined,
|
|
61
|
+
"aria-describedby": error && hint ? "".concat(hintId, " ").concat(errorId) : error ? errorId : hint ? hintId : undefined,
|
|
62
|
+
"aria-required": isOptional ? undefined : true,
|
|
63
|
+
id: id
|
|
64
|
+
}, props)));
|
|
65
|
+
}
|
|
66
|
+
|
|
67
|
+
module.exports = FieldTextInput;
|
|
68
|
+
//# sourceMappingURL=FieldTextInput.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"FieldTextInput.js","sources":["../../src/FieldTextInput/FieldTextInput.js"],"sourcesContent":["import * as React from 'react';\n\nexport default function FieldTextInput({ as, error, hint, id, isOptional = false, label, ...props }) {\n id = id ?? props.name;\n\n const errorId = React.useId();\n const hintId = React.useId();\n\n const InputComponent = as ?? 'input';\n\n return (\n <div className=\"bds-text-input stack\">\n <label htmlFor={id}>\n {label}\n {isOptional && ' (optional)'}\n </label>\n {hint && (\n <span className=\"bds-hint\" id={hintId}>\n {hint}\n </span>\n )}\n {error && (\n <span className=\"bds-error\" id={errorId}>\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 512 512\"\n aria-hidden=\"true\"\n height=\"1em\"\n width=\"1em\"\n fill=\"currentColor\"\n >\n <path d=\"M256 32c14.2 0 27.3 7.5 34.5 19.8l216 368c7.3 12.4 7.3 27.7.2 40.1S486.3 480 472 480H40c-14.3 0-27.6-7.7-34.7-20.1s-7-27.8.2-40.1l216-368C228.7 39.5 241.8 32 256 32zm0 128c-13.3 0-24 10.7-24 24v112c0 13.3 10.7 24 24 24s24-10.7 24-24V184c0-13.3-10.7-24-24-24zm32 224c0-17.7-14.3-32-32-32s-32 14.3-32 32 14.3 32 32 32 32-14.3 32-32z\" />\n </svg>\n {error}\n </span>\n )}\n <InputComponent\n aria-invalid={error ? true : undefined}\n aria-describedby={error && hint ? `${hintId} ${errorId}` : error ? errorId : hint ? hintId : undefined}\n aria-required={isOptional ? undefined : true}\n id={id}\n {...props}\n />\n </div>\n );\n}\n"],"names":["FieldTextInput","_ref","_id","as","error","hint","id","_ref$isOptional","isOptional","label","props","_objectWithoutProperties","_excluded","name","errorId","React","useId","hintId","InputComponent","createElement","className","htmlFor","xmlns","viewBox","height","width","fill","d","_extends","undefined","concat"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAEe,SAASA,cAAcA,CAAAC,IAAA,EAA+D;AAAA,EAAA,IAAAC,GAAA,CAAA;AAAA,EAAA,IAA5DC,EAAE,GAAAF,IAAA,CAAFE,EAAE;IAAEC,KAAK,GAAAH,IAAA,CAALG,KAAK;IAAEC,IAAI,GAAAJ,IAAA,CAAJI,IAAI;IAAEC,EAAE,GAAAL,IAAA,CAAFK,EAAE;IAAAC,eAAA,GAAAN,IAAA,CAAEO,UAAU;AAAVA,IAAAA,UAAU,GAAAD,eAAA,KAAG,KAAA,CAAA,GAAA,KAAK,GAAAA,eAAA;IAAEE,KAAK,GAAAR,IAAA,CAALQ,KAAK;AAAKC,IAAAA,KAAK,GAAAC,kDAAA,CAAAV,IAAA,EAAAW,SAAA,CAAA,CAAA;EAC/FN,EAAE,GAAA,CAAAJ,GAAA,GAAGI,EAAE,MAAA,IAAA,IAAAJ,GAAA,KAAA,KAAA,CAAA,GAAAA,GAAA,GAAIQ,KAAK,CAACG,IAAI,CAAA;AAErB,EAAA,IAAMC,OAAO,GAAGC,gBAAK,CAACC,KAAK,EAAE,CAAA;AAC7B,EAAA,IAAMC,MAAM,GAAGF,gBAAK,CAACC,KAAK,EAAE,CAAA;EAE5B,IAAME,cAAc,GAAGf,EAAE,KAAA,IAAA,IAAFA,EAAE,KAAFA,KAAAA,CAAAA,GAAAA,EAAE,GAAI,OAAO,CAAA;EAEpC,oBACEY,gBAAA,CAAAI,aAAA,CAAA,KAAA,EAAA;AAAKC,IAAAA,SAAS,EAAC,sBAAA;GACbL,eAAAA,gBAAA,CAAAI,aAAA,CAAA,OAAA,EAAA;AAAOE,IAAAA,OAAO,EAAEf,EAAAA;GACbG,EAAAA,KAAK,EACLD,UAAU,IAAI,aACV,CAAC,EACPH,IAAI,iBACHU,gBAAA,CAAAI,aAAA,CAAA,MAAA,EAAA;AAAMC,IAAAA,SAAS,EAAC,UAAU;AAACd,IAAAA,EAAE,EAAEW,MAAAA;AAAO,GAAA,EACnCZ,IACG,CACP,EACAD,KAAK,iBACJW,gBAAA,CAAAI,aAAA,CAAA,MAAA,EAAA;AAAMC,IAAAA,SAAS,EAAC,WAAW;AAACd,IAAAA,EAAE,EAAEQ,OAAAA;GAC9BC,eAAAA,gBAAA,CAAAI,aAAA,CAAA,KAAA,EAAA;AACEG,IAAAA,KAAK,EAAC,4BAA4B;AAClCC,IAAAA,OAAO,EAAC,aAAa;AACrB,IAAA,aAAA,EAAY,MAAM;AAClBC,IAAAA,MAAM,EAAC,KAAK;AACZC,IAAAA,KAAK,EAAC,KAAK;AACXC,IAAAA,IAAI,EAAC,cAAA;GAELX,eAAAA,gBAAA,CAAAI,aAAA,CAAA,MAAA,EAAA;AAAMQ,IAAAA,CAAC,EAAC,4UAAA;AAA4U,GAAE,CACnV,CAAC,EACLvB,KACG,CACP,eACDW,gBAAA,CAAAI,aAAA,CAACD,cAAc,EAAAU,kCAAA,CAAA;AACb,IAAA,cAAA,EAAcxB,KAAK,GAAG,IAAI,GAAGyB,SAAU;IACvC,kBAAkBzB,EAAAA,KAAK,IAAIC,IAAI,GAAA,EAAA,CAAAyB,MAAA,CAAMb,MAAM,OAAAa,MAAA,CAAIhB,OAAO,CAAKV,GAAAA,KAAK,GAAGU,OAAO,GAAGT,IAAI,GAAGY,MAAM,GAAGY,SAAU;AACvG,IAAA,eAAA,EAAerB,UAAU,GAAGqB,SAAS,GAAG,IAAK;AAC7CvB,IAAAA,EAAE,EAAEA,EAAAA;GACAI,EAAAA,KAAK,CACV,CACE,CAAC,CAAA;AAEV;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
|
|
@@ -0,0 +1,114 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var _rollupPluginBabelHelpers = require('../_rollupPluginBabelHelpers-28932a37.js');
|
|
4
|
+
var React = require('react');
|
|
5
|
+
|
|
6
|
+
function _interopNamespaceDefault(e) {
|
|
7
|
+
var n = Object.create(null);
|
|
8
|
+
if (e) {
|
|
9
|
+
Object.keys(e).forEach(function (k) {
|
|
10
|
+
if (k !== 'default') {
|
|
11
|
+
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
12
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
13
|
+
enumerable: true,
|
|
14
|
+
get: function () { return e[k]; }
|
|
15
|
+
});
|
|
16
|
+
}
|
|
17
|
+
});
|
|
18
|
+
}
|
|
19
|
+
n.default = e;
|
|
20
|
+
return Object.freeze(n);
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
|
|
24
|
+
|
|
25
|
+
var _excluded = ["buildPageUrl", "className", "currentPage", "onPageClick", "totalPages"];
|
|
26
|
+
function usePages(currentPage, totalPages) {
|
|
27
|
+
var pages = [1, currentPage - 1, currentPage, currentPage + 1, totalPages].filter(function (x) {
|
|
28
|
+
return x >= 1 && x <= totalPages;
|
|
29
|
+
});
|
|
30
|
+
return _rollupPluginBabelHelpers._toConsumableArray(new Set(pages));
|
|
31
|
+
}
|
|
32
|
+
function Pagination(_ref) {
|
|
33
|
+
var buildPageUrl = _ref.buildPageUrl,
|
|
34
|
+
className = _ref.className,
|
|
35
|
+
currentPage = _ref.currentPage,
|
|
36
|
+
onPageClick = _ref.onPageClick,
|
|
37
|
+
totalPages = _ref.totalPages,
|
|
38
|
+
props = _rollupPluginBabelHelpers._objectWithoutProperties(_ref, _excluded);
|
|
39
|
+
var pages = usePages(currentPage, totalPages);
|
|
40
|
+
return /*#__PURE__*/React__namespace.createElement("nav", _rollupPluginBabelHelpers._extends({
|
|
41
|
+
"aria-label": "pagination",
|
|
42
|
+
className: ['bds-pagination', className].filter(function (x) {
|
|
43
|
+
return x;
|
|
44
|
+
}).join(' ')
|
|
45
|
+
}, props), currentPage !== 1 && /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("a", {
|
|
46
|
+
href: buildPageUrl(1),
|
|
47
|
+
className: "bds-first-page"
|
|
48
|
+
}, /*#__PURE__*/React__namespace.createElement("svg", {
|
|
49
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
50
|
+
"aria-hidden": "true",
|
|
51
|
+
focusable: "false",
|
|
52
|
+
height: "1em",
|
|
53
|
+
width: "100%",
|
|
54
|
+
viewBox: "0 63.95 512 384.1"
|
|
55
|
+
}, /*#__PURE__*/React__namespace.createElement("path", {
|
|
56
|
+
d: "M459.5 440.6c9.5 7.9 22.8 9.7 34.1 4.4s18.4-16.6 18.4-29V96c0-12.4-7.2-23.7-18.4-29s-24.5-3.6-34.1 4.4L288 214.3v83.4l171.5 142.9zM256 352V96c0-12.4-7.2-23.7-18.4-29s-24.5-3.6-34.1 4.4l-192 160C4.2 237.5 0 246.5 0 256s4.2 18.5 11.5 24.6l192 160c9.5 7.9 22.8 9.7 34.1 4.4s18.4-16.6 18.4-29v-64z"
|
|
57
|
+
})), "First"), /*#__PURE__*/React__namespace.createElement("a", {
|
|
58
|
+
"aria-label": "previous",
|
|
59
|
+
href: buildPageUrl(currentPage - 1),
|
|
60
|
+
rel: "prev"
|
|
61
|
+
}, /*#__PURE__*/React__namespace.createElement("svg", {
|
|
62
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
63
|
+
"aria-hidden": "true",
|
|
64
|
+
focusable: "false",
|
|
65
|
+
width: "100%",
|
|
66
|
+
height: "1em",
|
|
67
|
+
viewBox: "0.02 95.9 192.08 320.17"
|
|
68
|
+
}, /*#__PURE__*/React__namespace.createElement("path", {
|
|
69
|
+
d: "M9.4 278.6c-12.5-12.5-12.5-32.8 0-45.3l128-128c9.2-9.2 22.9-11.9 34.9-6.9s19.8 16.6 19.8 29.6v256c0 12.9-7.8 24.6-19.8 29.6s-25.7 2.2-34.9-6.9l-128-128z"
|
|
70
|
+
})), "Prev.")), /*#__PURE__*/React__namespace.createElement("ul", null, pages.map(function (page, index) {
|
|
71
|
+
var handlePageClick = function handlePageClick() {
|
|
72
|
+
if (!onPageClick) return;
|
|
73
|
+
onPageClick(page);
|
|
74
|
+
};
|
|
75
|
+
return /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, {
|
|
76
|
+
key: page
|
|
77
|
+
}, /*#__PURE__*/React__namespace.createElement("li", null, /*#__PURE__*/React__namespace.createElement("a", {
|
|
78
|
+
"aria-current": page === currentPage ? 'page' : undefined,
|
|
79
|
+
href: buildPageUrl(page),
|
|
80
|
+
onClick: handlePageClick
|
|
81
|
+
}, /*#__PURE__*/React__namespace.createElement("span", {
|
|
82
|
+
className: "visually-hidden"
|
|
83
|
+
}, "Page"), " ", page)), pages[index + 1] > page + 1 ? /*#__PURE__*/React__namespace.createElement("li", {
|
|
84
|
+
"data-overflow": ""
|
|
85
|
+
}, "...") : null);
|
|
86
|
+
})), currentPage !== totalPages && /*#__PURE__*/React__namespace.createElement(React__namespace.Fragment, null, /*#__PURE__*/React__namespace.createElement("a", {
|
|
87
|
+
href: buildPageUrl(currentPage + 1),
|
|
88
|
+
rel: "next"
|
|
89
|
+
}, "Next", /*#__PURE__*/React__namespace.createElement("svg", {
|
|
90
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
91
|
+
"aria-hidden": "true",
|
|
92
|
+
focusable: "false",
|
|
93
|
+
viewBox: "63.9 95.9 192.1 320.17",
|
|
94
|
+
width: "100%",
|
|
95
|
+
height: "1em"
|
|
96
|
+
}, /*#__PURE__*/React__namespace.createElement("path", {
|
|
97
|
+
d: "M246.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-128-128c-9.2-9.2-22.9-11.9-34.9-6.9S63.9 115 63.9 128v256c0 12.9 7.8 24.6 19.8 29.6s25.7 2.2 34.9-6.9l128-128z"
|
|
98
|
+
}))), /*#__PURE__*/React__namespace.createElement("a", {
|
|
99
|
+
href: buildPageUrl(totalPages),
|
|
100
|
+
className: "bds-last-page"
|
|
101
|
+
}, "Last", /*#__PURE__*/React__namespace.createElement("svg", {
|
|
102
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
103
|
+
"aria-hidden": "true",
|
|
104
|
+
focusable: "false",
|
|
105
|
+
width: "100%",
|
|
106
|
+
height: "1em",
|
|
107
|
+
viewBox: "0 63.95 512 384.1"
|
|
108
|
+
}, /*#__PURE__*/React__namespace.createElement("path", {
|
|
109
|
+
d: "M52.5 440.6c-9.5 7.9-22.8 9.7-34.1 4.4S0 428.4 0 416V96c0-12.4 7.2-23.7 18.4-29s24.5-3.6 34.1 4.4L224 214.3v83.4L52.5 440.6zM256 352V96c0-12.4 7.2-23.7 18.4-29s24.5-3.6 34.1 4.4l192 160c7.3 6.1 11.5 15.1 11.5 24.6s-4.2 18.5-11.5 24.6l-192 160c-9.5 7.9-22.8 9.7-34.1 4.4S256 428.4 256 416v-64z"
|
|
110
|
+
})))));
|
|
111
|
+
}
|
|
112
|
+
|
|
113
|
+
module.exports = Pagination;
|
|
114
|
+
//# sourceMappingURL=Pagination.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Pagination.js","sources":["../../src/Pagination/Pagination.js"],"sourcesContent":["import * as React from 'react';\n\nfunction usePages(currentPage, totalPages) {\n const pages = [1, currentPage - 1, currentPage, currentPage + 1, totalPages].filter(\n (x) => x >= 1 && x <= totalPages,\n );\n return [...new Set(pages)];\n}\n\nexport default function Pagination({ buildPageUrl, className, currentPage, onPageClick, totalPages, ...props }) {\n const pages = usePages(currentPage, totalPages);\n\n return (\n <nav aria-label=\"pagination\" className={['bds-pagination', className].filter((x) => x).join(' ')} {...props}>\n {currentPage !== 1 && (\n <>\n <a href={buildPageUrl(1)} className=\"bds-first-page\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n focusable=\"false\"\n height=\"1em\"\n width=\"100%\"\n viewBox=\"0 63.95 512 384.1\"\n >\n <path d=\"M459.5 440.6c9.5 7.9 22.8 9.7 34.1 4.4s18.4-16.6 18.4-29V96c0-12.4-7.2-23.7-18.4-29s-24.5-3.6-34.1 4.4L288 214.3v83.4l171.5 142.9zM256 352V96c0-12.4-7.2-23.7-18.4-29s-24.5-3.6-34.1 4.4l-192 160C4.2 237.5 0 246.5 0 256s4.2 18.5 11.5 24.6l192 160c9.5 7.9 22.8 9.7 34.1 4.4s18.4-16.6 18.4-29v-64z\" />\n </svg>\n First\n </a>\n <a aria-label=\"previous\" href={buildPageUrl(currentPage - 1)} rel=\"prev\">\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"100%\"\n height=\"1em\"\n viewBox=\"0.02 95.9 192.08 320.17\"\n >\n <path d=\"M9.4 278.6c-12.5-12.5-12.5-32.8 0-45.3l128-128c9.2-9.2 22.9-11.9 34.9-6.9s19.8 16.6 19.8 29.6v256c0 12.9-7.8 24.6-19.8 29.6s-25.7 2.2-34.9-6.9l-128-128z\" />\n </svg>\n Prev.\n </a>\n </>\n )}\n <ul>\n {pages.map((page, index) => {\n const handlePageClick = () => {\n if (!onPageClick) return;\n\n onPageClick(page);\n };\n\n return (\n <React.Fragment key={page}>\n <li>\n <a\n aria-current={page === currentPage ? 'page' : undefined}\n href={buildPageUrl(page)}\n onClick={handlePageClick}\n >\n <span className=\"visually-hidden\">Page</span> {page}\n </a>\n </li>\n {pages[index + 1] > page + 1 ? <li data-overflow=\"\">...</li> : null}\n </React.Fragment>\n );\n })}\n </ul>\n {currentPage !== totalPages && (\n <>\n <a href={buildPageUrl(currentPage + 1)} rel=\"next\">\n Next\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n focusable=\"false\"\n viewBox=\"63.9 95.9 192.1 320.17\"\n width=\"100%\"\n height=\"1em\"\n >\n <path d=\"M246.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-128-128c-9.2-9.2-22.9-11.9-34.9-6.9S63.9 115 63.9 128v256c0 12.9 7.8 24.6 19.8 29.6s25.7 2.2 34.9-6.9l128-128z\" />\n </svg>\n </a>\n <a href={buildPageUrl(totalPages)} className=\"bds-last-page\">\n Last\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n aria-hidden=\"true\"\n focusable=\"false\"\n width=\"100%\"\n height=\"1em\"\n viewBox=\"0 63.95 512 384.1\"\n >\n <path d=\"M52.5 440.6c-9.5 7.9-22.8 9.7-34.1 4.4S0 428.4 0 416V96c0-12.4 7.2-23.7 18.4-29s24.5-3.6 34.1 4.4L224 214.3v83.4L52.5 440.6zM256 352V96c0-12.4 7.2-23.7 18.4-29s24.5-3.6 34.1 4.4l192 160c7.3 6.1 11.5 15.1 11.5 24.6s-4.2 18.5-11.5 24.6l-192 160c-9.5 7.9-22.8 9.7-34.1 4.4S256 428.4 256 416v-64z\" />\n </svg>\n </a>\n </>\n )}\n </nav>\n );\n}\n"],"names":["usePages","currentPage","totalPages","pages","filter","x","_toConsumableArray","Set","Pagination","_ref","buildPageUrl","className","onPageClick","props","_objectWithoutProperties","_excluded","React","createElement","_extends","join","Fragment","href","xmlns","focusable","height","width","viewBox","d","rel","map","page","index","handlePageClick","key","undefined","onClick"],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
|
package/README.md
CHANGED
|
@@ -12,14 +12,6 @@ yarn add @iabbb/bds-react
|
|
|
12
12
|
|
|
13
13
|
`@iabbb/bds` is a peer dependency, and should be installed at the same version as `@iabbb/bds-react`.
|
|
14
14
|
|
|
15
|
-
## Usage with Jest
|
|
16
|
-
|
|
17
|
-
By default, Jest does not transpile external packages. You can fix this by adding
|
|
18
|
-
[transformIgnorePatterns](https://jestjs.io/docs/configuration#transformignorepatterns-arraystring) to your Jest
|
|
19
|
-
config, like so:
|
|
20
|
-
|
|
21
|
-
`transformIgnorePatterns: ['/node_modules/(?!@iabbb/bds-react)']`
|
|
22
|
-
|
|
23
15
|
## Documentation
|
|
24
16
|
|
|
25
17
|
[BDS Storybook](https://iabbb.github.io/bds/?path=/docs/bds-documentation--docs)
|
|
@@ -0,0 +1,58 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var _rollupPluginBabelHelpers = require('../_rollupPluginBabelHelpers-28932a37.js');
|
|
4
|
+
var React = require('react');
|
|
5
|
+
|
|
6
|
+
function _interopNamespaceDefault(e) {
|
|
7
|
+
var n = Object.create(null);
|
|
8
|
+
if (e) {
|
|
9
|
+
Object.keys(e).forEach(function (k) {
|
|
10
|
+
if (k !== 'default') {
|
|
11
|
+
var d = Object.getOwnPropertyDescriptor(e, k);
|
|
12
|
+
Object.defineProperty(n, k, d.get ? d : {
|
|
13
|
+
enumerable: true,
|
|
14
|
+
get: function () { return e[k]; }
|
|
15
|
+
});
|
|
16
|
+
}
|
|
17
|
+
});
|
|
18
|
+
}
|
|
19
|
+
n.default = e;
|
|
20
|
+
return Object.freeze(n);
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
var React__namespace = /*#__PURE__*/_interopNamespaceDefault(React);
|
|
24
|
+
|
|
25
|
+
var _excluded = ["className", "component", "variant"];
|
|
26
|
+
var componentMap = {
|
|
27
|
+
h1: 'h1',
|
|
28
|
+
h2: 'h2',
|
|
29
|
+
h3: 'h3',
|
|
30
|
+
h4: 'h4',
|
|
31
|
+
h5: 'h5',
|
|
32
|
+
body: 'p'
|
|
33
|
+
};
|
|
34
|
+
var classMap = {
|
|
35
|
+
h1: 'bds-h1',
|
|
36
|
+
h2: 'bds-h2',
|
|
37
|
+
h3: 'bds-h3',
|
|
38
|
+
h4: 'bds-h4',
|
|
39
|
+
h5: 'bds-h5',
|
|
40
|
+
body: 'bds-body'
|
|
41
|
+
};
|
|
42
|
+
var Typography = /*#__PURE__*/React__namespace.forwardRef(function (_ref, ref) {
|
|
43
|
+
var className = _ref.className,
|
|
44
|
+
component = _ref.component,
|
|
45
|
+
_ref$variant = _ref.variant,
|
|
46
|
+
variant = _ref$variant === void 0 ? 'body' : _ref$variant,
|
|
47
|
+
props = _rollupPluginBabelHelpers._objectWithoutProperties(_ref, _excluded);
|
|
48
|
+
var Component = component !== null && component !== void 0 ? component : componentMap[variant];
|
|
49
|
+
return /*#__PURE__*/React__namespace.createElement(Component, _rollupPluginBabelHelpers._extends({
|
|
50
|
+
className: [classMap[variant], className].filter(function (x) {
|
|
51
|
+
return x;
|
|
52
|
+
}).join(' '),
|
|
53
|
+
ref: ref
|
|
54
|
+
}, props));
|
|
55
|
+
});
|
|
56
|
+
|
|
57
|
+
module.exports = Typography;
|
|
58
|
+
//# sourceMappingURL=Typography.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Typography.js","sources":["../../src/Typography/Typography.js"],"sourcesContent":["import * as React from 'react';\n\nconst componentMap = {\n h1: 'h1',\n h2: 'h2',\n h3: 'h3',\n h4: 'h4',\n h5: 'h5',\n body: 'p',\n};\n\nconst classMap = {\n h1: 'bds-h1',\n h2: 'bds-h2',\n h3: 'bds-h3',\n h4: 'bds-h4',\n h5: 'bds-h5',\n body: 'bds-body',\n};\n\nconst Typography = React.forwardRef(({ className, component, variant = 'body', ...props }, ref) => {\n const Component = component ?? componentMap[variant];\n return <Component className={[classMap[variant], className].filter((x) => x).join(' ')} ref={ref} {...props} />;\n});\n\nexport default Typography;\n"],"names":["componentMap","h1","h2","h3","h4","h5","body","classMap","Typography","React","forwardRef","_ref","ref","className","component","_ref$variant","variant","props","_objectWithoutProperties","_excluded","Component","createElement","_extends","filter","x","join"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAEA,IAAMA,YAAY,GAAG;AACnBC,EAAAA,EAAE,EAAE,IAAI;AACRC,EAAAA,EAAE,EAAE,IAAI;AACRC,EAAAA,EAAE,EAAE,IAAI;AACRC,EAAAA,EAAE,EAAE,IAAI;AACRC,EAAAA,EAAE,EAAE,IAAI;AACRC,EAAAA,IAAI,EAAE,GAAA;AACR,CAAC,CAAA;AAED,IAAMC,QAAQ,GAAG;AACfN,EAAAA,EAAE,EAAE,QAAQ;AACZC,EAAAA,EAAE,EAAE,QAAQ;AACZC,EAAAA,EAAE,EAAE,QAAQ;AACZC,EAAAA,EAAE,EAAE,QAAQ;AACZC,EAAAA,EAAE,EAAE,QAAQ;AACZC,EAAAA,IAAI,EAAE,UAAA;AACR,CAAC,CAAA;AAEKE,IAAAA,UAAU,gBAAGC,gBAAK,CAACC,UAAU,CAAC,UAAAC,IAAA,EAAuDC,GAAG,EAAK;AAAA,EAAA,IAA5DC,SAAS,GAAAF,IAAA,CAATE,SAAS;IAAEC,SAAS,GAAAH,IAAA,CAATG,SAAS;IAAAC,YAAA,GAAAJ,IAAA,CAAEK,OAAO;AAAPA,IAAAA,OAAO,GAAAD,YAAA,KAAG,KAAA,CAAA,GAAA,MAAM,GAAAA,YAAA;AAAKE,IAAAA,KAAK,GAAAC,kDAAA,CAAAP,IAAA,EAAAQ,SAAA,CAAA,CAAA;EACrF,IAAMC,SAAS,GAAGN,SAAS,KAATA,IAAAA,IAAAA,SAAS,KAATA,KAAAA,CAAAA,GAAAA,SAAS,GAAId,YAAY,CAACgB,OAAO,CAAC,CAAA;AACpD,EAAA,oBAAOP,gBAAA,CAAAY,aAAA,CAACD,SAAS,EAAAE,kCAAA,CAAA;AAACT,IAAAA,SAAS,EAAE,CAACN,QAAQ,CAACS,OAAO,CAAC,EAAEH,SAAS,CAAC,CAACU,MAAM,CAAC,UAACC,CAAC,EAAA;AAAA,MAAA,OAAKA,CAAC,CAAA;AAAA,KAAA,CAAC,CAACC,IAAI,CAAC,GAAG,CAAE;AAACb,IAAAA,GAAG,EAAEA,GAAAA;GAASK,EAAAA,KAAK,CAAG,CAAC,CAAA;AACjH,CAAC;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;"}
|
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
function _extends() {
|
|
4
|
+
_extends = Object.assign ? Object.assign.bind() : function (target) {
|
|
5
|
+
for (var i = 1; i < arguments.length; i++) {
|
|
6
|
+
var source = arguments[i];
|
|
7
|
+
for (var key in source) {
|
|
8
|
+
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
9
|
+
target[key] = source[key];
|
|
10
|
+
}
|
|
11
|
+
}
|
|
12
|
+
}
|
|
13
|
+
return target;
|
|
14
|
+
};
|
|
15
|
+
return _extends.apply(this, arguments);
|
|
16
|
+
}
|
|
17
|
+
function _objectWithoutPropertiesLoose(source, excluded) {
|
|
18
|
+
if (source == null) return {};
|
|
19
|
+
var target = {};
|
|
20
|
+
var sourceKeys = Object.keys(source);
|
|
21
|
+
var key, i;
|
|
22
|
+
for (i = 0; i < sourceKeys.length; i++) {
|
|
23
|
+
key = sourceKeys[i];
|
|
24
|
+
if (excluded.indexOf(key) >= 0) continue;
|
|
25
|
+
target[key] = source[key];
|
|
26
|
+
}
|
|
27
|
+
return target;
|
|
28
|
+
}
|
|
29
|
+
function _objectWithoutProperties(source, excluded) {
|
|
30
|
+
if (source == null) return {};
|
|
31
|
+
var target = _objectWithoutPropertiesLoose(source, excluded);
|
|
32
|
+
var key, i;
|
|
33
|
+
if (Object.getOwnPropertySymbols) {
|
|
34
|
+
var sourceSymbolKeys = Object.getOwnPropertySymbols(source);
|
|
35
|
+
for (i = 0; i < sourceSymbolKeys.length; i++) {
|
|
36
|
+
key = sourceSymbolKeys[i];
|
|
37
|
+
if (excluded.indexOf(key) >= 0) continue;
|
|
38
|
+
if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue;
|
|
39
|
+
target[key] = source[key];
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
return target;
|
|
43
|
+
}
|
|
44
|
+
function _toConsumableArray(arr) {
|
|
45
|
+
return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread();
|
|
46
|
+
}
|
|
47
|
+
function _arrayWithoutHoles(arr) {
|
|
48
|
+
if (Array.isArray(arr)) return _arrayLikeToArray(arr);
|
|
49
|
+
}
|
|
50
|
+
function _iterableToArray(iter) {
|
|
51
|
+
if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
|
|
52
|
+
}
|
|
53
|
+
function _unsupportedIterableToArray(o, minLen) {
|
|
54
|
+
if (!o) return;
|
|
55
|
+
if (typeof o === "string") return _arrayLikeToArray(o, minLen);
|
|
56
|
+
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
57
|
+
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
58
|
+
if (n === "Map" || n === "Set") return Array.from(o);
|
|
59
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
|
|
60
|
+
}
|
|
61
|
+
function _arrayLikeToArray(arr, len) {
|
|
62
|
+
if (len == null || len > arr.length) len = arr.length;
|
|
63
|
+
for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
|
|
64
|
+
return arr2;
|
|
65
|
+
}
|
|
66
|
+
function _nonIterableSpread() {
|
|
67
|
+
throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
exports._extends = _extends;
|
|
71
|
+
exports._objectWithoutProperties = _objectWithoutProperties;
|
|
72
|
+
exports._toConsumableArray = _toConsumableArray;
|
|
73
|
+
//# sourceMappingURL=_rollupPluginBabelHelpers-28932a37.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"_rollupPluginBabelHelpers-28932a37.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
|
package/index.js
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var Button_Button = require('./Button/Button.js');
|
|
4
|
+
var CallToAction_CallToAction = require('./CallToAction/CallToAction.js');
|
|
5
|
+
var ErrorSummary_ErrorSummary = require('./ErrorSummary/ErrorSummary.js');
|
|
6
|
+
var FieldTextInput_FieldTextInput = require('./FieldTextInput/FieldTextInput.js');
|
|
7
|
+
var Pagination_Pagination = require('./Pagination/Pagination.js');
|
|
8
|
+
var Typography_Typography = require('./Typography/Typography.js');
|
|
9
|
+
require('./_rollupPluginBabelHelpers-28932a37.js');
|
|
10
|
+
require('react');
|
|
11
|
+
require('./ErrorSummary/utils.js');
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
exports.Button = Button_Button;
|
|
16
|
+
exports.CallToAction = CallToAction_CallToAction;
|
|
17
|
+
exports.ErrorSummary = ErrorSummary_ErrorSummary.default;
|
|
18
|
+
exports.FieldTextInput = FieldTextInput_FieldTextInput;
|
|
19
|
+
exports.Pagination = Pagination_Pagination;
|
|
20
|
+
exports.Typography = Typography_Typography;
|
|
21
|
+
//# sourceMappingURL=index.js.map
|
package/index.js.map
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;"}
|
package/package.json
CHANGED
|
@@ -1,18 +1,26 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@iabbb/bds-react",
|
|
3
|
-
"version": "0.38.
|
|
4
|
-
"main": "
|
|
5
|
-
"
|
|
6
|
-
"
|
|
7
|
-
"
|
|
8
|
-
"./README.md": "./README.md"
|
|
3
|
+
"version": "0.38.7",
|
|
4
|
+
"main": "index.js",
|
|
5
|
+
"scripts": {
|
|
6
|
+
"build": "cross-env NODE_ENV=production rollup -c",
|
|
7
|
+
"dev": "rollup -c -w"
|
|
9
8
|
},
|
|
10
9
|
"devDependencies": {
|
|
11
10
|
"@babel/core": "7.22.9",
|
|
12
11
|
"@babel/preset-env": "7.22.7",
|
|
13
12
|
"@babel/preset-react": "7.22.5",
|
|
13
|
+
"@rollup/plugin-babel": "6.0.3",
|
|
14
|
+
"@rollup/plugin-commonjs": "25.0.2",
|
|
15
|
+
"@rollup/plugin-node-resolve": "15.1.0",
|
|
16
|
+
"@rollup/plugin-terser": "0.4.3",
|
|
14
17
|
"cross-env": "7.0.3",
|
|
15
|
-
"
|
|
18
|
+
"glob": "10.3.1",
|
|
19
|
+
"react": "18.2.0",
|
|
20
|
+
"rollup": "3.25.1",
|
|
21
|
+
"rollup-plugin-delete": "2.0.0",
|
|
22
|
+
"rollup-plugin-peer-deps-external": "2.2.4",
|
|
23
|
+
"rollup-plugin-summary": "2.0.0"
|
|
16
24
|
},
|
|
17
25
|
"peerDependencies": {
|
|
18
26
|
"@iabbb/bds": "0.38.1",
|
package/src/Button/Button.js
DELETED
|
@@ -1,54 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
|
|
3
|
-
const DEBOUNCE_TIMEOUT_IN_SECONDS = 1;
|
|
4
|
-
|
|
5
|
-
const Button = React.forwardRef(
|
|
6
|
-
({ children, className, onClick, preventDoubleClick = false, variant = 'standard', ...props }, ref) => {
|
|
7
|
-
const debounceClicks = React.useRef(false);
|
|
8
|
-
|
|
9
|
-
const handleClick = (event) => {
|
|
10
|
-
// 👇 button is not configured to ignore double clicks
|
|
11
|
-
if (!preventDoubleClick) {
|
|
12
|
-
if (onClick) {
|
|
13
|
-
onClick(event);
|
|
14
|
-
}
|
|
15
|
-
|
|
16
|
-
return;
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
// 👇 button has been clicked recently, and subsequent clicks are prevented
|
|
20
|
-
if (debounceClicks.current) {
|
|
21
|
-
event.preventDefault();
|
|
22
|
-
return false;
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
if (onClick) {
|
|
26
|
-
onClick(event);
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
// 👇 block from double clicks
|
|
30
|
-
debounceClicks.current = true;
|
|
31
|
-
|
|
32
|
-
// 👇 and remove the block after a given amount of seconds
|
|
33
|
-
setTimeout(() => {
|
|
34
|
-
debounceClicks.current = false;
|
|
35
|
-
}, DEBOUNCE_TIMEOUT_IN_SECONDS * 1000);
|
|
36
|
-
};
|
|
37
|
-
|
|
38
|
-
return (
|
|
39
|
-
<button
|
|
40
|
-
className={[variant === 'unstyled' ? 'bds-button-unstyled' : 'bds-button', className]
|
|
41
|
-
.filter((x) => x)
|
|
42
|
-
.join(' ')}
|
|
43
|
-
data-type={variant !== 'standard' && variant !== 'unstyled' ? variant : null}
|
|
44
|
-
onClick={handleClick}
|
|
45
|
-
ref={ref}
|
|
46
|
-
{...props}
|
|
47
|
-
>
|
|
48
|
-
{children}
|
|
49
|
-
</button>
|
|
50
|
-
);
|
|
51
|
-
},
|
|
52
|
-
);
|
|
53
|
-
|
|
54
|
-
export default Button;
|
package/src/Button/index.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { default } from './Button';
|
|
@@ -1,16 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
|
|
3
|
-
const CallToAction = React.forwardRef(({ children, className, variant = 'standard', ...props }, ref) => {
|
|
4
|
-
return (
|
|
5
|
-
<a
|
|
6
|
-
className={['bds-cta', className].filter((x) => x).join(' ')}
|
|
7
|
-
data-type={variant !== 'standard' ? variant : null}
|
|
8
|
-
ref={ref}
|
|
9
|
-
{...props}
|
|
10
|
-
>
|
|
11
|
-
{children}
|
|
12
|
-
</a>
|
|
13
|
-
);
|
|
14
|
-
});
|
|
15
|
-
|
|
16
|
-
export default CallToAction;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { default } from './CallToAction';
|
|
@@ -1,102 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
|
|
3
|
-
import { getAssociatedLegendOrLabel, getFragmentFromUrl } from './utils';
|
|
4
|
-
|
|
5
|
-
export const FormErrorKey = '_form';
|
|
6
|
-
|
|
7
|
-
const FINAL_FORM_ERROR = 'FINAL_FORM/form-error';
|
|
8
|
-
|
|
9
|
-
export default function BdsErrorSummary({ className, errors, mapNameToId = (name) => name, ...props }) {
|
|
10
|
-
const headingId = React.useId();
|
|
11
|
-
const groupRef = React.useRef(null);
|
|
12
|
-
|
|
13
|
-
React.useEffect(() => {
|
|
14
|
-
if (!errors || Object.keys(errors).length === 0) return;
|
|
15
|
-
if (!groupRef.current) return;
|
|
16
|
-
|
|
17
|
-
groupRef.current.focus();
|
|
18
|
-
}, [errors]);
|
|
19
|
-
|
|
20
|
-
if (!errors || Object.keys(errors).length === 0) return null;
|
|
21
|
-
|
|
22
|
-
const handleLinkClick = (e) => {
|
|
23
|
-
const inputId = getFragmentFromUrl(e.currentTarget.href);
|
|
24
|
-
|
|
25
|
-
if (!inputId) {
|
|
26
|
-
return;
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
const input = document.getElementById(inputId);
|
|
30
|
-
|
|
31
|
-
if (!input) {
|
|
32
|
-
return;
|
|
33
|
-
}
|
|
34
|
-
|
|
35
|
-
const legendOrLabel = getAssociatedLegendOrLabel(input);
|
|
36
|
-
|
|
37
|
-
if (!legendOrLabel) {
|
|
38
|
-
return;
|
|
39
|
-
}
|
|
40
|
-
|
|
41
|
-
e.preventDefault();
|
|
42
|
-
|
|
43
|
-
legendOrLabel.scrollIntoView();
|
|
44
|
-
input.focus({ preventScroll: true });
|
|
45
|
-
};
|
|
46
|
-
|
|
47
|
-
return (
|
|
48
|
-
<bds-error-summary
|
|
49
|
-
className={['stack', className].filter((x) => x).join(' ')}
|
|
50
|
-
role="group"
|
|
51
|
-
aria-labelledby={headingId}
|
|
52
|
-
ref={groupRef}
|
|
53
|
-
tabIndex={-1}
|
|
54
|
-
{...props}
|
|
55
|
-
>
|
|
56
|
-
<h2 className="bds-h5" id={headingId}>
|
|
57
|
-
<svg
|
|
58
|
-
xmlns="http://www.w3.org/2000/svg"
|
|
59
|
-
viewBox="0 0 512 512"
|
|
60
|
-
aria-hidden="true"
|
|
61
|
-
height="1em"
|
|
62
|
-
width="1em"
|
|
63
|
-
fill="currentColor"
|
|
64
|
-
>
|
|
65
|
-
<path d="M256 32c14.2 0 27.3 7.5 34.5 19.8l216 368c7.3 12.4 7.3 27.7.2 40.1S486.3 480 472 480H40c-14.3 0-27.6-7.7-34.7-20.1s-7-27.8.2-40.1l216-368C228.7 39.5 241.8 32 256 32zm0 128c-13.3 0-24 10.7-24 24v112c0 13.3 10.7 24 24 24s24-10.7 24-24V184c0-13.3-10.7-24-24-24zm32 224c0-17.7-14.3-32-32-32s-32 14.3-32 32 14.3 32 32 32 32-14.3 32-32z" />
|
|
66
|
-
</svg>
|
|
67
|
-
Issue
|
|
68
|
-
</h2>
|
|
69
|
-
<ul>
|
|
70
|
-
{Object.keys(errors).map((errorKey) => {
|
|
71
|
-
const message = errors[errorKey];
|
|
72
|
-
const isFormError = [FINAL_FORM_ERROR, FormErrorKey].includes(errorKey);
|
|
73
|
-
|
|
74
|
-
if (isFormError) {
|
|
75
|
-
return <li key={errorKey} dangerouslySetInnerHTML={{ __html: message }} />;
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
const isArrayField = Array.isArray(message);
|
|
79
|
-
|
|
80
|
-
const messages = isArrayField ? message : [message];
|
|
81
|
-
|
|
82
|
-
return (
|
|
83
|
-
<React.Fragment key={errorKey}>
|
|
84
|
-
{messages.map((fieldMessage, index) => {
|
|
85
|
-
const inputId = `${mapNameToId(errorKey)}${isArrayField ? `[${index}]` : ''}`;
|
|
86
|
-
|
|
87
|
-
return (
|
|
88
|
-
<li key={inputId}>
|
|
89
|
-
<a href={`#${inputId}`} onClick={handleLinkClick}>
|
|
90
|
-
{fieldMessage}
|
|
91
|
-
{messages.length > 1 ? ` (${index + 1} of ${messages.length})` : undefined}
|
|
92
|
-
</a>
|
|
93
|
-
</li>
|
|
94
|
-
);
|
|
95
|
-
})}
|
|
96
|
-
</React.Fragment>
|
|
97
|
-
);
|
|
98
|
-
})}
|
|
99
|
-
</ul>
|
|
100
|
-
</bds-error-summary>
|
|
101
|
-
);
|
|
102
|
-
}
|
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
|
|
3
|
-
export default function FieldTextInput({ as, error, hint, id, isOptional = false, label, ...props }) {
|
|
4
|
-
id = id ?? props.name;
|
|
5
|
-
|
|
6
|
-
const errorId = React.useId();
|
|
7
|
-
const hintId = React.useId();
|
|
8
|
-
|
|
9
|
-
const InputComponent = as ?? 'input';
|
|
10
|
-
|
|
11
|
-
return (
|
|
12
|
-
<div className="bds-text-input stack">
|
|
13
|
-
<label htmlFor={id}>
|
|
14
|
-
{label}
|
|
15
|
-
{isOptional && ' (optional)'}
|
|
16
|
-
</label>
|
|
17
|
-
{hint && (
|
|
18
|
-
<span className="bds-hint" id={hintId}>
|
|
19
|
-
{hint}
|
|
20
|
-
</span>
|
|
21
|
-
)}
|
|
22
|
-
{error && (
|
|
23
|
-
<span className="bds-error" id={errorId}>
|
|
24
|
-
<svg
|
|
25
|
-
xmlns="http://www.w3.org/2000/svg"
|
|
26
|
-
viewBox="0 0 512 512"
|
|
27
|
-
aria-hidden="true"
|
|
28
|
-
height="1em"
|
|
29
|
-
width="1em"
|
|
30
|
-
fill="currentColor"
|
|
31
|
-
>
|
|
32
|
-
<path d="M256 32c14.2 0 27.3 7.5 34.5 19.8l216 368c7.3 12.4 7.3 27.7.2 40.1S486.3 480 472 480H40c-14.3 0-27.6-7.7-34.7-20.1s-7-27.8.2-40.1l216-368C228.7 39.5 241.8 32 256 32zm0 128c-13.3 0-24 10.7-24 24v112c0 13.3 10.7 24 24 24s24-10.7 24-24V184c0-13.3-10.7-24-24-24zm32 224c0-17.7-14.3-32-32-32s-32 14.3-32 32 14.3 32 32 32 32-14.3 32-32z" />
|
|
33
|
-
</svg>
|
|
34
|
-
{error}
|
|
35
|
-
</span>
|
|
36
|
-
)}
|
|
37
|
-
<InputComponent
|
|
38
|
-
aria-invalid={error ? true : undefined}
|
|
39
|
-
aria-describedby={error && hint ? `${hintId} ${errorId}` : error ? errorId : hint ? hintId : undefined}
|
|
40
|
-
aria-required={isOptional ? undefined : true}
|
|
41
|
-
id={id}
|
|
42
|
-
{...props}
|
|
43
|
-
/>
|
|
44
|
-
</div>
|
|
45
|
-
);
|
|
46
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { default } from './FieldTextInput';
|
|
@@ -1,101 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
|
|
3
|
-
function usePages(currentPage, totalPages) {
|
|
4
|
-
const pages = [1, currentPage - 1, currentPage, currentPage + 1, totalPages].filter(
|
|
5
|
-
(x) => x >= 1 && x <= totalPages,
|
|
6
|
-
);
|
|
7
|
-
return [...new Set(pages)];
|
|
8
|
-
}
|
|
9
|
-
|
|
10
|
-
export default function Pagination({ buildPageUrl, className, currentPage, onPageClick, totalPages, ...props }) {
|
|
11
|
-
const pages = usePages(currentPage, totalPages);
|
|
12
|
-
|
|
13
|
-
return (
|
|
14
|
-
<nav aria-label="pagination" className={['bds-pagination', className].filter((x) => x).join(' ')} {...props}>
|
|
15
|
-
{currentPage !== 1 && (
|
|
16
|
-
<>
|
|
17
|
-
<a href={buildPageUrl(1)} className="bds-first-page">
|
|
18
|
-
<svg
|
|
19
|
-
xmlns="http://www.w3.org/2000/svg"
|
|
20
|
-
aria-hidden="true"
|
|
21
|
-
focusable="false"
|
|
22
|
-
height="1em"
|
|
23
|
-
width="100%"
|
|
24
|
-
viewBox="0 63.95 512 384.1"
|
|
25
|
-
>
|
|
26
|
-
<path d="M459.5 440.6c9.5 7.9 22.8 9.7 34.1 4.4s18.4-16.6 18.4-29V96c0-12.4-7.2-23.7-18.4-29s-24.5-3.6-34.1 4.4L288 214.3v83.4l171.5 142.9zM256 352V96c0-12.4-7.2-23.7-18.4-29s-24.5-3.6-34.1 4.4l-192 160C4.2 237.5 0 246.5 0 256s4.2 18.5 11.5 24.6l192 160c9.5 7.9 22.8 9.7 34.1 4.4s18.4-16.6 18.4-29v-64z" />
|
|
27
|
-
</svg>
|
|
28
|
-
First
|
|
29
|
-
</a>
|
|
30
|
-
<a aria-label="previous" href={buildPageUrl(currentPage - 1)} rel="prev">
|
|
31
|
-
<svg
|
|
32
|
-
xmlns="http://www.w3.org/2000/svg"
|
|
33
|
-
aria-hidden="true"
|
|
34
|
-
focusable="false"
|
|
35
|
-
width="100%"
|
|
36
|
-
height="1em"
|
|
37
|
-
viewBox="0.02 95.9 192.08 320.17"
|
|
38
|
-
>
|
|
39
|
-
<path d="M9.4 278.6c-12.5-12.5-12.5-32.8 0-45.3l128-128c9.2-9.2 22.9-11.9 34.9-6.9s19.8 16.6 19.8 29.6v256c0 12.9-7.8 24.6-19.8 29.6s-25.7 2.2-34.9-6.9l-128-128z" />
|
|
40
|
-
</svg>
|
|
41
|
-
Prev.
|
|
42
|
-
</a>
|
|
43
|
-
</>
|
|
44
|
-
)}
|
|
45
|
-
<ul>
|
|
46
|
-
{pages.map((page, index) => {
|
|
47
|
-
const handlePageClick = () => {
|
|
48
|
-
if (!onPageClick) return;
|
|
49
|
-
|
|
50
|
-
onPageClick(page);
|
|
51
|
-
};
|
|
52
|
-
|
|
53
|
-
return (
|
|
54
|
-
<React.Fragment key={page}>
|
|
55
|
-
<li>
|
|
56
|
-
<a
|
|
57
|
-
aria-current={page === currentPage ? 'page' : undefined}
|
|
58
|
-
href={buildPageUrl(page)}
|
|
59
|
-
onClick={handlePageClick}
|
|
60
|
-
>
|
|
61
|
-
<span className="visually-hidden">Page</span> {page}
|
|
62
|
-
</a>
|
|
63
|
-
</li>
|
|
64
|
-
{pages[index + 1] > page + 1 ? <li data-overflow="">...</li> : null}
|
|
65
|
-
</React.Fragment>
|
|
66
|
-
);
|
|
67
|
-
})}
|
|
68
|
-
</ul>
|
|
69
|
-
{currentPage !== totalPages && (
|
|
70
|
-
<>
|
|
71
|
-
<a href={buildPageUrl(currentPage + 1)} rel="next">
|
|
72
|
-
Next
|
|
73
|
-
<svg
|
|
74
|
-
xmlns="http://www.w3.org/2000/svg"
|
|
75
|
-
aria-hidden="true"
|
|
76
|
-
focusable="false"
|
|
77
|
-
viewBox="63.9 95.9 192.1 320.17"
|
|
78
|
-
width="100%"
|
|
79
|
-
height="1em"
|
|
80
|
-
>
|
|
81
|
-
<path d="M246.6 278.6c12.5-12.5 12.5-32.8 0-45.3l-128-128c-9.2-9.2-22.9-11.9-34.9-6.9S63.9 115 63.9 128v256c0 12.9 7.8 24.6 19.8 29.6s25.7 2.2 34.9-6.9l128-128z" />
|
|
82
|
-
</svg>
|
|
83
|
-
</a>
|
|
84
|
-
<a href={buildPageUrl(totalPages)} className="bds-last-page">
|
|
85
|
-
Last
|
|
86
|
-
<svg
|
|
87
|
-
xmlns="http://www.w3.org/2000/svg"
|
|
88
|
-
aria-hidden="true"
|
|
89
|
-
focusable="false"
|
|
90
|
-
width="100%"
|
|
91
|
-
height="1em"
|
|
92
|
-
viewBox="0 63.95 512 384.1"
|
|
93
|
-
>
|
|
94
|
-
<path d="M52.5 440.6c-9.5 7.9-22.8 9.7-34.1 4.4S0 428.4 0 416V96c0-12.4 7.2-23.7 18.4-29s24.5-3.6 34.1 4.4L224 214.3v83.4L52.5 440.6zM256 352V96c0-12.4 7.2-23.7 18.4-29s24.5-3.6 34.1 4.4l192 160c7.3 6.1 11.5 15.1 11.5 24.6s-4.2 18.5-11.5 24.6l-192 160c-9.5 7.9-22.8 9.7-34.1 4.4S256 428.4 256 416v-64z" />
|
|
95
|
-
</svg>
|
|
96
|
-
</a>
|
|
97
|
-
</>
|
|
98
|
-
)}
|
|
99
|
-
</nav>
|
|
100
|
-
);
|
|
101
|
-
}
|
package/src/Pagination/index.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { default } from './Pagination';
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
import * as React from 'react';
|
|
2
|
-
|
|
3
|
-
const componentMap = {
|
|
4
|
-
h1: 'h1',
|
|
5
|
-
h2: 'h2',
|
|
6
|
-
h3: 'h3',
|
|
7
|
-
h4: 'h4',
|
|
8
|
-
h5: 'h5',
|
|
9
|
-
body: 'p',
|
|
10
|
-
};
|
|
11
|
-
|
|
12
|
-
const classMap = {
|
|
13
|
-
h1: 'bds-h1',
|
|
14
|
-
h2: 'bds-h2',
|
|
15
|
-
h3: 'bds-h3',
|
|
16
|
-
h4: 'bds-h4',
|
|
17
|
-
h5: 'bds-h5',
|
|
18
|
-
body: 'bds-body',
|
|
19
|
-
};
|
|
20
|
-
|
|
21
|
-
const Typography = React.forwardRef(({ className, component, variant = 'body', ...props }, ref) => {
|
|
22
|
-
const Component = component ?? componentMap[variant];
|
|
23
|
-
return <Component className={[classMap[variant], className].filter((x) => x).join(' ')} ref={ref} {...props} />;
|
|
24
|
-
});
|
|
25
|
-
|
|
26
|
-
export default Typography;
|
package/src/Typography/index.js
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { default } from './Typography';
|
package/src/index.js
DELETED
|
@@ -1,6 +0,0 @@
|
|
|
1
|
-
export { default as Button } from './Button/index';
|
|
2
|
-
export { default as CallToAction } from './CallToAction/index';
|
|
3
|
-
export { default as ErrorSummary } from './ErrorSummary/index';
|
|
4
|
-
export { default as FieldTextInput } from './FieldTextInput/index';
|
|
5
|
-
export { default as Pagination } from './Pagination/index';
|
|
6
|
-
export { default as Typography } from './Typography/index';
|