@royaloperahouse/chord 2.2.13 → 2.2.14
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +3 -0
- package/dist/chord.cjs.development.js +17 -13
- package/dist/chord.cjs.development.js.map +1 -1
- package/dist/chord.cjs.production.min.js +1 -1
- package/dist/chord.cjs.production.min.js.map +1 -1
- package/dist/chord.esm.js +17 -13
- package/dist/chord.esm.js.map +1 -1
- package/dist/components/molecules/Table/Table.style.d.ts +6 -3
- package/package.json +1 -1
package/dist/chord.esm.js
CHANGED
|
@@ -9274,23 +9274,26 @@ var PasswordStrength = function PasswordStrength(_ref) {
|
|
|
9274
9274
|
}, strengthLabel))));
|
|
9275
9275
|
};
|
|
9276
9276
|
|
|
9277
|
-
var _templateObject$1h, _templateObject2$X, _templateObject3$O, _templateObject4$D, _templateObject5$s, _templateObject6$n, _templateObject7$f, _templateObject8$b, _templateObject9$6;
|
|
9278
|
-
var
|
|
9279
|
-
var
|
|
9277
|
+
var _templateObject$1h, _templateObject2$X, _templateObject3$O, _templateObject4$D, _templateObject5$s, _templateObject6$n, _templateObject7$f, _templateObject8$b, _templateObject9$6, _templateObject10$6;
|
|
9278
|
+
var TableContainer = /*#__PURE__*/styled.table(_templateObject$1h || (_templateObject$1h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-collapse: collapse;\n"])));
|
|
9279
|
+
var Container$6 = /*#__PURE__*/styled.div(_templateObject2$X || (_templateObject2$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-x: auto;\n"])));
|
|
9280
|
+
var Wrapper$7 = /*#__PURE__*/styled.div(_templateObject3$O || (_templateObject3$O = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 100%;\n"])));
|
|
9281
|
+
var TableHeader = /*#__PURE__*/styled.th(_templateObject4$D || (_templateObject4$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-subtitle-2);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-2);\n letter-spacing: var(--letter-spacing-subtitle-2);\n line-height: var(--line-height-subtitle-2);\n padding: 30px 30px 30px 0;\n text-align: left;\n text-transform: uppercase;\n\n &:last-child {\n white-space: nowrap;\n width: auto;\n }\n\n &:not(:last-child) {\n width: ", ";\n }\n\n @media ", " {\n &:last-child {\n white-space: nowrap;\n }\n }\n\n @media ", " {\n padding: 20px 20px 20px 0;\n\n &:last-child {\n white-space: normal;\n }\n }\n"])), function (props) {
|
|
9280
9282
|
return "calc(100% / " + (props.columns - 1) + ")";
|
|
9281
|
-
});
|
|
9282
|
-
var
|
|
9283
|
+
}, devices.tablet, devices.mobile);
|
|
9284
|
+
var TableCell = /*#__PURE__*/styled.td(_templateObject5$s || (_templateObject5$s = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-weight: var(--font-weight-body-1);\n letter-spacing: var(--letter-spacing-body-1);\n line-height: var(--line-height-body-1);\n padding: 30px 30px 30px 0;\n text-align: left;\n vertical-align: top;\n\n &:last-child {\n width: auto;\n }\n\n &:not(:last-child) {\n width: ", ";\n }\n\n > span > svg {\n width: 24px;\n height: 24px;\n }\n\n @media ", " {\n padding: 20px 20px 20px 0;\n }\n"])), function (props) {
|
|
9285
|
+
return "calc(100% / " + (props.columns - 1) + ")";
|
|
9286
|
+
}, devices.mobile);
|
|
9287
|
+
var LineContainer$1 = /*#__PURE__*/styled.div(_templateObject6$n || (_templateObject6$n = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 1px;\n background-color: ", ";\n width: 100%;\n"])), function (props) {
|
|
9283
9288
|
return "var(--base-color-" + props.lineColor + ")";
|
|
9284
9289
|
});
|
|
9285
|
-
var Pagination$1 = /*#__PURE__*/styled.div(
|
|
9286
|
-
var PageNumber$1 = /*#__PURE__*/styled.button(
|
|
9290
|
+
var Pagination$1 = /*#__PURE__*/styled.div(_templateObject7$f || (_templateObject7$f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 40px 0;\n flex-wrap: nowrap;\n flex-direction: row;\n list-style: none;\n max-width: fit-content;\n margin: auto;\n li {\n font-size: var(--font-size-subtitle-1);\n font-weight: var(--font-weight-body-1);\n line-height: var(--line-height-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n margin-left: 16px;\n color: var(--base-color-dark-grey);\n display: flex;\n align-items: center;\n border-bottom: none;\n }\n"])));
|
|
9291
|
+
var PageNumber$1 = /*#__PURE__*/styled.button(_templateObject8$b || (_templateObject8$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: none;\n border: none;\n padding: 0;\n font-size: inherit;\n color: inherit;\n cursor: pointer;\n display: inline-block;\n margin: 0;\n border-bottom: 1px solid var(--base-color-transparent);\n line-height: var(--base-line-height);\n text-decoration: none;\n font-family: var(--font-family-body-1);\n\n :hover {\n outline: none;\n color: var(--base-color-core);\n border-bottom: 1px solid var(--base-color-core);\n svg > path {\n fill: var(--base-color-core);\n }\n }\n\n /* Active state */\n ", "\n"])), function (_ref) {
|
|
9287
9292
|
var active = _ref.active;
|
|
9288
9293
|
return active === 'true' && "\n color: var(--base-color-core);\n border-bottom: 1px solid var(--base-color-core);\n ";
|
|
9289
9294
|
});
|
|
9290
|
-
var Next = /*#__PURE__*/styled.span(
|
|
9291
|
-
var ScrollButtons = /*#__PURE__*/styled.div(
|
|
9292
|
-
var TableContainer = /*#__PURE__*/styled.table(_templateObject8$b || (_templateObject8$b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-collapse: collapse;\n"])));
|
|
9293
|
-
var Container$6 = /*#__PURE__*/styled.div(_templateObject9$6 || (_templateObject9$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow-x: auto;\n"])));
|
|
9295
|
+
var Next = /*#__PURE__*/styled.span(_templateObject9$6 || (_templateObject9$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n width: 25px;\n align-items: center;\n justify-content: center;\n margin-left: 0;\n span {\n height: 1.5em;\n svg > path {\n fill: var(--base-color-dark-grey);\n }\n }\n"])));
|
|
9296
|
+
var ScrollButtons = /*#__PURE__*/styled.div(_templateObject10$6 || (_templateObject10$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: flex-end;\n padding: 0 0 24px 0;\n\n div:hover {\n background-color: var(--base-color-light-grey);\n }\n\n > div > div {\n background-color: var(--base-color-light-grey);\n }\n\n svg path {\n fill: var(--base-color-black) !important;\n }\n"])));
|
|
9294
9297
|
|
|
9295
9298
|
var Table = function Table(_ref) {
|
|
9296
9299
|
var columns = _ref.columns,
|
|
@@ -9393,7 +9396,7 @@ var Table = function Table(_ref) {
|
|
|
9393
9396
|
return i;
|
|
9394
9397
|
});
|
|
9395
9398
|
var reducedPageNumbers = reducePages(pageNumbers, currentPage);
|
|
9396
|
-
return /*#__PURE__*/React__default.createElement(
|
|
9399
|
+
return /*#__PURE__*/React__default.createElement(Wrapper$7, null, showScrollButtons && /*#__PURE__*/React__default.createElement(ScrollButtons, null, /*#__PURE__*/React__default.createElement(RotatorButtons, {
|
|
9397
9400
|
onClickPrev: function onClickPrev() {
|
|
9398
9401
|
return scrollTable('left');
|
|
9399
9402
|
},
|
|
@@ -9412,7 +9415,8 @@ var Table = function Table(_ref) {
|
|
|
9412
9415
|
})))), /*#__PURE__*/React__default.createElement("thead", null, /*#__PURE__*/React__default.createElement("tr", null, headings && headings.map(function (heading, index) {
|
|
9413
9416
|
return /*#__PURE__*/React__default.createElement(TableHeader, {
|
|
9414
9417
|
key: index,
|
|
9415
|
-
role: "columnheader"
|
|
9418
|
+
role: "columnheader",
|
|
9419
|
+
columns: columns
|
|
9416
9420
|
}, /*#__PURE__*/React__default.createElement(Content, {
|
|
9417
9421
|
content: heading
|
|
9418
9422
|
}));
|