@royaloperahouse/chord 2.2.9-b-chord-development → 2.2.9-d-chord-development
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/chord.cjs.development.js +189 -136
- 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 +188 -137
- package/dist/chord.esm.js.map +1 -1
- package/dist/components/index.d.ts +2 -2
- package/dist/components/molecules/Card/Card.style.d.ts +3 -1
- package/dist/components/molecules/Select/Select.d.ts +1 -0
- package/dist/components/molecules/Select2/Select2.d.ts +18 -0
- package/dist/components/molecules/Select2/Select2.style.d.ts +5 -0
- package/dist/components/molecules/Select2/index.d.ts +2 -0
- package/dist/components/molecules/index.d.ts +2 -1
- package/dist/index.d.ts +2 -2
- package/dist/types/formTypes.d.ts +27 -0
- package/package.json +5 -3
|
@@ -10,6 +10,8 @@ var styled = require('styled-components');
|
|
|
10
10
|
var styled__default = _interopDefault(styled);
|
|
11
11
|
var moment = _interopDefault(require('moment'));
|
|
12
12
|
var server = require('react-dom/server');
|
|
13
|
+
var Select$1 = require('react-select');
|
|
14
|
+
var Select$1__default = _interopDefault(Select$1);
|
|
13
15
|
var Modal = _interopDefault(require('react-modal'));
|
|
14
16
|
var ScrollLock = _interopDefault(require('react-scrolllock'));
|
|
15
17
|
|
|
@@ -2262,15 +2264,13 @@ var Icon = /*#__PURE__*/React.memo(function (_ref) {
|
|
|
2262
2264
|
});
|
|
2263
2265
|
Icon.displayName = 'Icon';
|
|
2264
2266
|
|
|
2265
|
-
var _excluded = ["children", "iconName", "iconDirection", "iconClassName", "color"];
|
|
2266
|
-
|
|
2267
2267
|
var Button = function Button(_ref) {
|
|
2268
2268
|
var children = _ref.children,
|
|
2269
2269
|
iconName = _ref.iconName,
|
|
2270
2270
|
iconDirection = _ref.iconDirection,
|
|
2271
2271
|
iconClassName = _ref.iconClassName,
|
|
2272
2272
|
color = _ref.color,
|
|
2273
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
2273
|
+
rest = _objectWithoutPropertiesLoose(_ref, ["children", "iconName", "iconDirection", "iconClassName", "color"]);
|
|
2274
2274
|
|
|
2275
2275
|
var truncatedString = children.substring(0, 30);
|
|
2276
2276
|
return /*#__PURE__*/React__default.createElement(ButtonWrapper, Object.assign({}, rest, {
|
|
@@ -2339,11 +2339,9 @@ var AspectRatioWidth;
|
|
|
2339
2339
|
ButtonType["Tertiary"] = "Tertiary";
|
|
2340
2340
|
})(exports.ButtonType || (exports.ButtonType = {}));
|
|
2341
2341
|
|
|
2342
|
-
var _excluded$1 = ["children"];
|
|
2343
|
-
|
|
2344
2342
|
var PrimaryButton = function PrimaryButton(_ref) {
|
|
2345
2343
|
var children = _ref.children,
|
|
2346
|
-
props = _objectWithoutPropertiesLoose(_ref,
|
|
2344
|
+
props = _objectWithoutPropertiesLoose(_ref, ["children"]);
|
|
2347
2345
|
|
|
2348
2346
|
return /*#__PURE__*/React__default.createElement(PrimaryButtonWrapper, Object.assign({
|
|
2349
2347
|
color: exports.Colors.White
|
|
@@ -2357,11 +2355,9 @@ var PrimaryButtonWrapper$1 = /*#__PURE__*/styled__default(Button)(_templateObjec
|
|
|
2357
2355
|
return color ? "var(--base-color-" + color + ")" : theme.colors.primary;
|
|
2358
2356
|
});
|
|
2359
2357
|
|
|
2360
|
-
var _excluded$2 = ["children"];
|
|
2361
|
-
|
|
2362
2358
|
var SecondaryButton = function SecondaryButton(_ref) {
|
|
2363
2359
|
var children = _ref.children,
|
|
2364
|
-
props = _objectWithoutPropertiesLoose(_ref,
|
|
2360
|
+
props = _objectWithoutPropertiesLoose(_ref, ["children"]);
|
|
2365
2361
|
|
|
2366
2362
|
return /*#__PURE__*/React__default.createElement(PrimaryButtonWrapper$1, Object.assign({
|
|
2367
2363
|
color: exports.Colors.Primary
|
|
@@ -2375,12 +2371,10 @@ var TertiaryButtonWrapper = /*#__PURE__*/styled__default.a(_templateObject$6 ||
|
|
|
2375
2371
|
});
|
|
2376
2372
|
var TertiaryIconWrapper = /*#__PURE__*/styled__default.span(_templateObject2 || (_templateObject2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: var(--button-icon-width);\n min-width: 20px;\n height: var(--button-icon-height);\n margin-left: var(--button-icon-margin);\n display: inline-block;\n"])));
|
|
2377
2373
|
|
|
2378
|
-
var _excluded$3 = ["children", "color"];
|
|
2379
|
-
|
|
2380
2374
|
var Button$1 = function Button(_ref) {
|
|
2381
2375
|
var children = _ref.children,
|
|
2382
2376
|
color = _ref.color,
|
|
2383
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
2377
|
+
rest = _objectWithoutPropertiesLoose(_ref, ["children", "color"]);
|
|
2384
2378
|
|
|
2385
2379
|
var truncatedString = children.substring(0, 100);
|
|
2386
2380
|
return /*#__PURE__*/React__default.createElement(TertiaryButtonWrapper, Object.assign({}, rest, {
|
|
@@ -2906,7 +2900,6 @@ var ErrorLabel = /*#__PURE__*/styled__default.div(_templateObject6 || (_template
|
|
|
2906
2900
|
return 'var(--base-color-errorstate)';
|
|
2907
2901
|
});
|
|
2908
2902
|
|
|
2909
|
-
var _excluded$4 = ["children", "disabled", "error", "darkMode", "blackBox"];
|
|
2910
2903
|
/**
|
|
2911
2904
|
* A Radio component, that wraps around the native `<input type="radio"/>` element
|
|
2912
2905
|
* and adds some extra styling, states and information around it (i.e. an error label,
|
|
@@ -2936,7 +2929,7 @@ var Radio2 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
2936
2929
|
darkMode = _ref$darkMode === void 0 ? false : _ref$darkMode,
|
|
2937
2930
|
_ref$blackBox = _ref.blackBox,
|
|
2938
2931
|
blackBox = _ref$blackBox === void 0 ? false : _ref$blackBox,
|
|
2939
|
-
inputProps = _objectWithoutPropertiesLoose(_ref,
|
|
2932
|
+
inputProps = _objectWithoutPropertiesLoose(_ref, ["children", "disabled", "error", "darkMode", "blackBox"]);
|
|
2940
2933
|
|
|
2941
2934
|
return /*#__PURE__*/React__default.createElement(Container, null, /*#__PURE__*/React__default.createElement(TickboxLabel, {
|
|
2942
2935
|
darkMode: darkMode,
|
|
@@ -3456,8 +3449,6 @@ var TabLinkWrapper = /*#__PURE__*/styled__default.a(_templateObject$m || (_templ
|
|
|
3456
3449
|
});
|
|
3457
3450
|
var TabLinkIconWrapper = /*#__PURE__*/styled__default.span(_templateObject2$a || (_templateObject2$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: var(--button-icon-width);\n height: var(--button-icon-height);\n margin-right: var(--button-icon-margin);\n"])));
|
|
3458
3451
|
|
|
3459
|
-
var _excluded$5 = ["children", "iconName", "iconDirection", "color", "hoverColor"];
|
|
3460
|
-
|
|
3461
3452
|
var TabLink = function TabLink(_ref) {
|
|
3462
3453
|
var children = _ref.children,
|
|
3463
3454
|
iconName = _ref.iconName,
|
|
@@ -3466,7 +3457,7 @@ var TabLink = function TabLink(_ref) {
|
|
|
3466
3457
|
color = _ref$color === void 0 ? exports.Colors.DarkGrey : _ref$color,
|
|
3467
3458
|
_ref$hoverColor = _ref.hoverColor,
|
|
3468
3459
|
hoverColor = _ref$hoverColor === void 0 ? exports.Colors.Primary : _ref$hoverColor,
|
|
3469
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
3460
|
+
rest = _objectWithoutPropertiesLoose(_ref, ["children", "iconName", "iconDirection", "color", "hoverColor"]);
|
|
3470
3461
|
|
|
3471
3462
|
return /*#__PURE__*/React__default.createElement(TabLinkWrapper, Object.assign({
|
|
3472
3463
|
color: color,
|
|
@@ -3516,7 +3507,6 @@ var TextAreaError = /*#__PURE__*/styled__default.div(_templateObject4$3 || (_tem
|
|
|
3516
3507
|
return darkMode ? 'var(--base-color-white)' : 'var(--base-color-errorstate)';
|
|
3517
3508
|
});
|
|
3518
3509
|
|
|
3519
|
-
var _excluded$6 = ["label", "error", "width", "darkMode", "height", "columnStartDesktop", "columnStartDevice", "columnSpanDesktop", "columnSpanDevice", "maxLength", "tabIndex"];
|
|
3520
3510
|
/**
|
|
3521
3511
|
* An HTML textarea component for Chord.
|
|
3522
3512
|
*
|
|
@@ -3578,7 +3568,7 @@ var TextArea = function TextArea(_ref) {
|
|
|
3578
3568
|
maxLength = _ref$maxLength === void 0 ? 950 : _ref$maxLength,
|
|
3579
3569
|
_ref$tabIndex = _ref.tabIndex,
|
|
3580
3570
|
tabIndex = _ref$tabIndex === void 0 ? 0 : _ref$tabIndex,
|
|
3581
|
-
textareaProps = _objectWithoutPropertiesLoose(_ref,
|
|
3571
|
+
textareaProps = _objectWithoutPropertiesLoose(_ref, ["label", "error", "width", "darkMode", "height", "columnStartDesktop", "columnStartDevice", "columnSpanDesktop", "columnSpanDevice", "maxLength", "tabIndex"]);
|
|
3582
3572
|
|
|
3583
3573
|
return /*#__PURE__*/React__default.createElement(GridItem, {
|
|
3584
3574
|
columnStartDesktop: columnStartDesktop,
|
|
@@ -3638,7 +3628,6 @@ var ErrorLabel$1 = /*#__PURE__*/styled__default.div(_templateObject6$1 || (_temp
|
|
|
3638
3628
|
return "var(--base-color-errorstate)";
|
|
3639
3629
|
});
|
|
3640
3630
|
|
|
3641
|
-
var _excluded$7 = ["label", "type", "error", "darkMode", "width"];
|
|
3642
3631
|
/**
|
|
3643
3632
|
* A text field component, that wraps around the native `<input />` element
|
|
3644
3633
|
* and adds some extra states and information around it (i.e. a text and an error labels,
|
|
@@ -3686,7 +3675,7 @@ var TextField = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
3686
3675
|
_ref$darkMode = _ref.darkMode,
|
|
3687
3676
|
darkMode = _ref$darkMode === void 0 ? false : _ref$darkMode,
|
|
3688
3677
|
width = _ref.width,
|
|
3689
|
-
inputProps = _objectWithoutPropertiesLoose(_ref,
|
|
3678
|
+
inputProps = _objectWithoutPropertiesLoose(_ref, ["label", "type", "error", "darkMode", "width"]);
|
|
3690
3679
|
|
|
3691
3680
|
var _useState = React.useState(false),
|
|
3692
3681
|
showPassword = _useState[0],
|
|
@@ -3744,14 +3733,12 @@ var TextLinkWrapper = /*#__PURE__*/styled__default.a(_templateObject$p || (_temp
|
|
|
3744
3733
|
});
|
|
3745
3734
|
var TextLinkIconWrapper = /*#__PURE__*/styled__default.span(_templateObject2$d || (_templateObject2$d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: var(--button-icon-width);\n height: var(--button-icon-height);\n margin-left: var(--button-icon-margin);\n"])));
|
|
3746
3735
|
|
|
3747
|
-
var _excluded$8 = ["children", "iconName", "iconDirection", "color"];
|
|
3748
|
-
|
|
3749
3736
|
var TextLink = function TextLink(_ref) {
|
|
3750
3737
|
var children = _ref.children,
|
|
3751
3738
|
iconName = _ref.iconName,
|
|
3752
3739
|
iconDirection = _ref.iconDirection,
|
|
3753
3740
|
color = _ref.color,
|
|
3754
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
3741
|
+
rest = _objectWithoutPropertiesLoose(_ref, ["children", "iconName", "iconDirection", "color"]);
|
|
3755
3742
|
|
|
3756
3743
|
var truncatedString = children.substring(0, 30);
|
|
3757
3744
|
return /*#__PURE__*/React__default.createElement(TextLinkWrapper, Object.assign({
|
|
@@ -3970,7 +3957,6 @@ var ErrorLabel$2 = /*#__PURE__*/styled__default.div(_templateObject6$2 || (_temp
|
|
|
3970
3957
|
return 'var(--base-color-errorstate)';
|
|
3971
3958
|
});
|
|
3972
3959
|
|
|
3973
|
-
var _excluded$9 = ["children", "disabled", "error", "darkMode", "blackBox"];
|
|
3974
3960
|
/**
|
|
3975
3961
|
* A Tickbox component, that wraps around the native `<input type="checkbox"/>` element
|
|
3976
3962
|
* and adds some extra styling, states and information around it (i.e. an error label,
|
|
@@ -4000,7 +3986,7 @@ var Tickbox2 = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
|
4000
3986
|
darkMode = _ref$darkMode === void 0 ? false : _ref$darkMode,
|
|
4001
3987
|
_ref$blackBox = _ref.blackBox,
|
|
4002
3988
|
blackBox = _ref$blackBox === void 0 ? false : _ref$blackBox,
|
|
4003
|
-
inputProps = _objectWithoutPropertiesLoose(_ref,
|
|
3989
|
+
inputProps = _objectWithoutPropertiesLoose(_ref, ["children", "disabled", "error", "darkMode", "blackBox"]);
|
|
4004
3990
|
|
|
4005
3991
|
return /*#__PURE__*/React__default.createElement(Container$2, null, /*#__PURE__*/React__default.createElement(TickboxLabel$2, {
|
|
4006
3992
|
darkMode: darkMode,
|
|
@@ -5475,8 +5461,6 @@ var ContactNewsletter = function ContactNewsletter(_ref) {
|
|
|
5475
5461
|
}, contact.title))));
|
|
5476
5462
|
};
|
|
5477
5463
|
|
|
5478
|
-
var _excluded$a = ["dataRoh"];
|
|
5479
|
-
|
|
5480
5464
|
var Footer = function Footer(_ref) {
|
|
5481
5465
|
var data = _ref.data;
|
|
5482
5466
|
var policyLinks = data.policyLinks;
|
|
@@ -5486,7 +5470,7 @@ var Footer = function Footer(_ref) {
|
|
|
5486
5470
|
|
|
5487
5471
|
var _data$artsLogo = data.artsLogo,
|
|
5488
5472
|
artsDataRoh = _data$artsLogo.dataRoh,
|
|
5489
|
-
artsLogo = _objectWithoutPropertiesLoose(_data$artsLogo,
|
|
5473
|
+
artsLogo = _objectWithoutPropertiesLoose(_data$artsLogo, ["dataRoh"]);
|
|
5490
5474
|
|
|
5491
5475
|
var additionalInfo = data.additionalInfo;
|
|
5492
5476
|
return /*#__PURE__*/React__default.createElement(FooterSection, null, /*#__PURE__*/React__default.createElement(Grid, null, /*#__PURE__*/React__default.createElement(GridItem, {
|
|
@@ -5541,8 +5525,6 @@ var ArrowsContainer = /*#__PURE__*/styled__default.div(_templateObject5$b || (_t
|
|
|
5541
5525
|
});
|
|
5542
5526
|
var ArrowWrapper = /*#__PURE__*/styled__default.div(_templateObject6$9 || (_templateObject6$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n width: 24px;\n height: 24px;\n cursor: pointer;\n display: flex;\n align-items: center;\n justify-content: flex-center;\n\n :hover {\n && svg path {\n fill: var(--base-color-primary);\n }\n }\n"])));
|
|
5543
5527
|
|
|
5544
|
-
var _excluded$b = ["id", "text"];
|
|
5545
|
-
|
|
5546
5528
|
var AnchorTabBar = function AnchorTabBar(_ref) {
|
|
5547
5529
|
var tabs = _ref.tabs,
|
|
5548
5530
|
onTabClick = _ref.onTabClick,
|
|
@@ -5757,7 +5739,7 @@ var AnchorTabBar = function AnchorTabBar(_ref) {
|
|
|
5757
5739
|
}, tabs.map(function (_ref4) {
|
|
5758
5740
|
var id = _ref4.id,
|
|
5759
5741
|
text = _ref4.text,
|
|
5760
|
-
rest = _objectWithoutPropertiesLoose(_ref4,
|
|
5742
|
+
rest = _objectWithoutPropertiesLoose(_ref4, ["id", "text"]);
|
|
5761
5743
|
|
|
5762
5744
|
return /*#__PURE__*/React__default.createElement("li", {
|
|
5763
5745
|
key: id
|
|
@@ -5813,9 +5795,6 @@ var PrimaryButtonReverse = /*#__PURE__*/styled__default(PrimaryButton)(_template
|
|
|
5813
5795
|
var MessageWrapper = /*#__PURE__*/styled__default.div(_templateObject9$1 || (_templateObject9$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n margin-right: var(--grid-outer-margin);\n height: var(--button-height);\n\n h6 {\n margin: 0;\n padding: 0;\n }\n\n @media ", " {\n & {\n margin-right: var(--grid-margin);\n }\n }\n\n @media ", " {\n & {\n display: none;\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
5814
5796
|
var MessageWrapperMobile = /*#__PURE__*/styled__default.div(_templateObject10$1 || (_templateObject10$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h6 {\n margin: 0;\n padding: 0;\n }\n display: none;\n\n @media ", " {\n & {\n display: flex;\n align-items: center;\n margin-left: var(--grid-margin);\n padding: 12px 0;\n }\n }\n"])), devices.mobile);
|
|
5815
5797
|
|
|
5816
|
-
var _excluded$c = ["text"],
|
|
5817
|
-
_excluded2 = ["text"];
|
|
5818
|
-
|
|
5819
5798
|
var TitleWithCTA = function TitleWithCTA(_ref) {
|
|
5820
5799
|
var title = _ref.title,
|
|
5821
5800
|
links = _ref.links,
|
|
@@ -5825,11 +5804,11 @@ var TitleWithCTA = function TitleWithCTA(_ref) {
|
|
|
5825
5804
|
|
|
5826
5805
|
var _ref2 = (links == null ? void 0 : links[0]) || {},
|
|
5827
5806
|
primaryButtonText = _ref2.text,
|
|
5828
|
-
primaryButtonProps = _objectWithoutPropertiesLoose(_ref2,
|
|
5807
|
+
primaryButtonProps = _objectWithoutPropertiesLoose(_ref2, ["text"]);
|
|
5829
5808
|
|
|
5830
5809
|
var _ref3 = (links == null ? void 0 : links[1]) || {},
|
|
5831
5810
|
secondaryButtonText = _ref3.text,
|
|
5832
|
-
secondaryButtonProps = _objectWithoutPropertiesLoose(_ref3,
|
|
5811
|
+
secondaryButtonProps = _objectWithoutPropertiesLoose(_ref3, ["text"]);
|
|
5833
5812
|
|
|
5834
5813
|
return /*#__PURE__*/React__default.createElement(TitleCTAGridWrapper, {
|
|
5835
5814
|
sticky: sticky
|
|
@@ -6173,13 +6152,11 @@ var AuxiliaryButtonWrapper = /*#__PURE__*/styled__default(Button)(_templateObjec
|
|
|
6173
6152
|
return color;
|
|
6174
6153
|
});
|
|
6175
6154
|
|
|
6176
|
-
var _excluded$d = ["children"];
|
|
6177
|
-
|
|
6178
6155
|
var AuxiliaryButton = function AuxiliaryButton(_ref) {
|
|
6179
6156
|
var _props$color;
|
|
6180
6157
|
|
|
6181
6158
|
var children = _ref.children,
|
|
6182
|
-
props = _objectWithoutPropertiesLoose(_ref,
|
|
6159
|
+
props = _objectWithoutPropertiesLoose(_ref, ["children"]);
|
|
6183
6160
|
|
|
6184
6161
|
return /*#__PURE__*/React__default.createElement(AuxiliaryButtonWrapper, Object.assign({}, props, {
|
|
6185
6162
|
color: (_props$color = props.color) != null ? _props$color : exports.Colors.Black,
|
|
@@ -6224,28 +6201,34 @@ var LabelContainer = /*#__PURE__*/styled__default.div(_templateObject10$2 || (_t
|
|
|
6224
6201
|
var isGridCard = _ref7.isGridCard;
|
|
6225
6202
|
return isGridCard ? '20px' : '0';
|
|
6226
6203
|
});
|
|
6227
|
-
var ExtraActionsContainer = /*#__PURE__*/styled__default.div(_templateObject11$1 || (_templateObject11$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: var(--editorial-margin-between);\n"])))
|
|
6228
|
-
var
|
|
6229
|
-
|
|
6230
|
-
|
|
6204
|
+
var ExtraActionsContainer = /*#__PURE__*/styled__default.div(_templateObject11$1 || (_templateObject11$1 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: var(--editorial-margin-between);\n\n @media ", " {\n margin-left: ", ";\n margin-right: ", ";\n }\n"])), devices.mobile, function (_ref8) {
|
|
6205
|
+
var fullWidth = _ref8.fullWidth;
|
|
6206
|
+
return fullWidth ? '0' : '20px';
|
|
6207
|
+
}, function (_ref9) {
|
|
6208
|
+
var fullWidth = _ref9.fullWidth;
|
|
6209
|
+
return fullWidth ? '0' : '20px';
|
|
6210
|
+
});
|
|
6211
|
+
var LabelElements = /*#__PURE__*/styled__default.div(_templateObject12 || (_templateObject12 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n height: 30px;\n padding: 0 8px;\n background-color: ", ";\n color: var(--base-color-white);\n"])), function (_ref10) {
|
|
6212
|
+
var bgColor = _ref10.bgColor,
|
|
6213
|
+
theme = _ref10.theme;
|
|
6231
6214
|
return bgColor ? "var(--base-color-" + bgColor + ")" : theme.colors.primary;
|
|
6232
6215
|
});
|
|
6233
6216
|
var LabelIconWrapper = /*#__PURE__*/styled__default.div(_templateObject13 || (_templateObject13 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-left: 10px;\n\n svg {\n height: 24px;\n width: 24px;\n }\n"])));
|
|
6234
6217
|
|
|
6235
|
-
var getButtonsOpacity = function getButtonsOpacity(
|
|
6236
|
-
var onlyShowButtonsOnHover =
|
|
6218
|
+
var getButtonsOpacity = function getButtonsOpacity(_ref11) {
|
|
6219
|
+
var onlyShowButtonsOnHover = _ref11.onlyShowButtonsOnHover;
|
|
6237
6220
|
return onlyShowButtonsOnHover ? 'opacity: 0;' : 'opacity: 1;';
|
|
6238
6221
|
};
|
|
6239
6222
|
|
|
6240
|
-
var getButtonsMinHeight = function getButtonsMinHeight(
|
|
6241
|
-
var onlyShowButtonsOnHover =
|
|
6223
|
+
var getButtonsMinHeight = function getButtonsMinHeight(_ref12) {
|
|
6224
|
+
var onlyShowButtonsOnHover = _ref12.onlyShowButtonsOnHover;
|
|
6242
6225
|
return onlyShowButtonsOnHover ? 'min-height: unset;' : 'min-height: 120px;';
|
|
6243
6226
|
};
|
|
6244
6227
|
|
|
6245
|
-
var ButtonsContainer$1 = /*#__PURE__*/styled__default.div(_templateObject14 || (_templateObject14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", ";\n display: flex;\n gap: 16px;\n margin-top: var(--editorial-margin-between);\n\n ", "\n\n @media ", " {\n ", ";\n margin-left: ", ";\n margin-right: ", ";\n opacity: 1 !important;\n gap: 24px;\n margin-top: 24px;\n flex-direction: column;\n align-items: center;\n }\n\n @media ", " {\n ", ";\n opacity: 1 !important;\n gap: 24px;\n margin-top: 24px;\n align-items: flex-start;\n\n ", "\n }\n"])), getButtonsOpacity, function (
|
|
6246
|
-
var size =
|
|
6247
|
-
primaryButtonTextLength =
|
|
6248
|
-
tertiaryButtonTextLength =
|
|
6228
|
+
var ButtonsContainer$1 = /*#__PURE__*/styled__default.div(_templateObject14 || (_templateObject14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", ";\n display: flex;\n gap: 16px;\n margin-top: var(--editorial-margin-between);\n\n ", "\n\n @media ", " {\n ", ";\n margin-left: ", ";\n margin-right: ", ";\n opacity: 1 !important;\n gap: 24px;\n margin-top: 24px;\n flex-direction: column;\n align-items: center;\n }\n\n @media ", " {\n ", ";\n opacity: 1 !important;\n gap: 24px;\n margin-top: 24px;\n align-items: flex-start;\n\n ", "\n }\n"])), getButtonsOpacity, function (_ref13) {
|
|
6229
|
+
var size = _ref13.size,
|
|
6230
|
+
primaryButtonTextLength = _ref13.primaryButtonTextLength,
|
|
6231
|
+
tertiaryButtonTextLength = _ref13.tertiaryButtonTextLength;
|
|
6249
6232
|
var isLinksLayoutColumn = size === 'small' ? primaryButtonTextLength >= LENGTH_SMALL_TEXT$1 || tertiaryButtonTextLength >= LENGTH_SMALL_TEXT$1 : primaryButtonTextLength >= LENGTH_LARGE_TEXT || tertiaryButtonTextLength >= LENGTH_LARGE_TEXT;
|
|
6250
6233
|
|
|
6251
6234
|
if (isLinksLayoutColumn) {
|
|
@@ -6253,15 +6236,15 @@ var ButtonsContainer$1 = /*#__PURE__*/styled__default.div(_templateObject14 || (
|
|
|
6253
6236
|
}
|
|
6254
6237
|
|
|
6255
6238
|
return '';
|
|
6256
|
-
}, devices.mobile, getButtonsMinHeight, function (
|
|
6257
|
-
var fullWidth =
|
|
6239
|
+
}, devices.mobile, getButtonsMinHeight, function (_ref14) {
|
|
6240
|
+
var fullWidth = _ref14.fullWidth;
|
|
6258
6241
|
return fullWidth ? '0' : '20px';
|
|
6259
|
-
}, function (
|
|
6260
|
-
var fullWidth =
|
|
6242
|
+
}, function (_ref15) {
|
|
6243
|
+
var fullWidth = _ref15.fullWidth;
|
|
6261
6244
|
return fullWidth ? '0' : '20px';
|
|
6262
|
-
}, devices.tablet, getButtonsMinHeight, function (
|
|
6263
|
-
var primaryButtonTextLength =
|
|
6264
|
-
tertiaryButtonTextLength =
|
|
6245
|
+
}, devices.tablet, getButtonsMinHeight, function (_ref16) {
|
|
6246
|
+
var primaryButtonTextLength = _ref16.primaryButtonTextLength,
|
|
6247
|
+
tertiaryButtonTextLength = _ref16.tertiaryButtonTextLength;
|
|
6265
6248
|
var isLinksLayoutColumnTablet = primaryButtonTextLength >= LENGTH_TEXT_TABLET || tertiaryButtonTextLength >= LENGTH_TEXT_TABLET;
|
|
6266
6249
|
|
|
6267
6250
|
if (isLinksLayoutColumnTablet) {
|
|
@@ -6337,9 +6320,6 @@ var truncateReactNodeString = function truncateReactNodeString(node, resultLengt
|
|
|
6337
6320
|
return truncateHtmlString(nodeString, resultLength, addDots);
|
|
6338
6321
|
};
|
|
6339
6322
|
|
|
6340
|
-
var _excluded$e = ["text"],
|
|
6341
|
-
_excluded2$1 = ["text"];
|
|
6342
|
-
|
|
6343
6323
|
var _buttonTypeToButton;
|
|
6344
6324
|
var LENGTH_LARGE_TEXT$1 = 28;
|
|
6345
6325
|
var LENGTH_SMALL_TEXT$2 = 19;
|
|
@@ -6393,7 +6373,7 @@ var Card = function Card(_ref) {
|
|
|
6393
6373
|
var _ref2 = firstButton || {},
|
|
6394
6374
|
_ref2$text = _ref2.text,
|
|
6395
6375
|
firstButtonText = _ref2$text === void 0 ? '' : _ref2$text,
|
|
6396
|
-
restFirstButton = _objectWithoutPropertiesLoose(_ref2,
|
|
6376
|
+
restFirstButton = _objectWithoutPropertiesLoose(_ref2, ["text"]);
|
|
6397
6377
|
|
|
6398
6378
|
var primaryButtonTextTruncate = size === 'small' ? truncate(firstButtonText, LENGTH_SMALL_TEXT$2) : truncate(firstButtonText, LENGTH_LARGE_TEXT$1);
|
|
6399
6379
|
var secondButton = links == null ? void 0 : links[1];
|
|
@@ -6401,7 +6381,7 @@ var Card = function Card(_ref) {
|
|
|
6401
6381
|
var _ref3 = secondButton || {},
|
|
6402
6382
|
_ref3$text = _ref3.text,
|
|
6403
6383
|
secondButtonText = _ref3$text === void 0 ? '' : _ref3$text,
|
|
6404
|
-
restSecondButton = _objectWithoutPropertiesLoose(_ref3,
|
|
6384
|
+
restSecondButton = _objectWithoutPropertiesLoose(_ref3, ["text"]);
|
|
6405
6385
|
|
|
6406
6386
|
var tertiaryButtonTextTruncate = size === 'small' ? truncate(secondButtonText, LENGTH_SMALL_TEXT$2) : truncate(secondButtonText, LENGTH_LARGE_TEXT$1);
|
|
6407
6387
|
|
|
@@ -6472,7 +6452,9 @@ var Card = function Card(_ref) {
|
|
|
6472
6452
|
}
|
|
6473
6453
|
}))), highlightText && /*#__PURE__*/React__default.createElement(HighlightTextContainer, null, /*#__PURE__*/React__default.createElement(BodyText, {
|
|
6474
6454
|
level: 1
|
|
6475
|
-
}, highlightText)), auxiliaryCTA && /*#__PURE__*/React__default.createElement(ExtraActionsContainer,
|
|
6455
|
+
}, highlightText)), auxiliaryCTA && /*#__PURE__*/React__default.createElement(ExtraActionsContainer, {
|
|
6456
|
+
fullWidth: fullWidth
|
|
6457
|
+
}, /*#__PURE__*/React__default.createElement(AuxiliaryButton, Object.assign({}, auxiliaryCTA), auxiliaryCTA.text)), links && /*#__PURE__*/React__default.createElement(ButtonsContainer$1, {
|
|
6476
6458
|
ref: node,
|
|
6477
6459
|
"data-testid": "buttonscontainer",
|
|
6478
6460
|
className: "cardButtonsContainer",
|
|
@@ -6910,8 +6892,6 @@ var LogoWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject6$e || (_tem
|
|
|
6910
6892
|
var ButtonWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject7$9 || (_templateObject7$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: button;\n justify-self: end;\n align-self: end;\n\n @media ", " {\n & {\n justify-self: center;\n align-self: center;\n width: 100%;\n margin-top: 16px;\n }\n }\n"])), devices.mobile);
|
|
6911
6893
|
var PageHeadingText = /*#__PURE__*/styled__default.div(_templateObject8$6 || (_templateObject8$6 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-family: var(--font-family-altHeader);\n text-transform: var(--text-transform-altHeader);\n word-break: var(--word-break-altHeader);\n"])));
|
|
6912
6894
|
|
|
6913
|
-
var _excluded$f = ["text"];
|
|
6914
|
-
|
|
6915
6895
|
var PageHeading = function PageHeading(_ref) {
|
|
6916
6896
|
var title = _ref.title,
|
|
6917
6897
|
text = _ref.text,
|
|
@@ -6922,7 +6902,7 @@ var PageHeading = function PageHeading(_ref) {
|
|
|
6922
6902
|
|
|
6923
6903
|
var _ref2 = link || {},
|
|
6924
6904
|
linkText = _ref2.text,
|
|
6925
|
-
restLink = _objectWithoutPropertiesLoose(_ref2,
|
|
6905
|
+
restLink = _objectWithoutPropertiesLoose(_ref2, ["text"]);
|
|
6926
6906
|
|
|
6927
6907
|
var truncatedText = text == null ? void 0 : text.substring(0, 250);
|
|
6928
6908
|
var truncatedTitle = title && title.substring(0, 40);
|
|
@@ -6950,11 +6930,9 @@ var PageHeading = function PageHeading(_ref) {
|
|
|
6950
6930
|
}, /*#__PURE__*/React__default.createElement(PrimaryButton, Object.assign({}, restLink), linkText)) : null));
|
|
6951
6931
|
};
|
|
6952
6932
|
|
|
6953
|
-
var _excluded$g = ["link"];
|
|
6954
|
-
|
|
6955
6933
|
var PageHeadingCore = function PageHeadingCore(_ref) {
|
|
6956
6934
|
var link = _ref.link,
|
|
6957
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
6935
|
+
rest = _objectWithoutPropertiesLoose(_ref, ["link"]);
|
|
6958
6936
|
|
|
6959
6937
|
var coreLink = link && _extends({}, link, {
|
|
6960
6938
|
color: exports.Colors.White,
|
|
@@ -6968,11 +6946,9 @@ var PageHeadingCore = function PageHeadingCore(_ref) {
|
|
|
6968
6946
|
})));
|
|
6969
6947
|
};
|
|
6970
6948
|
|
|
6971
|
-
var _excluded$h = ["link"];
|
|
6972
|
-
|
|
6973
6949
|
var PageHeadingCinema = function PageHeadingCinema(_ref) {
|
|
6974
6950
|
var link = _ref.link,
|
|
6975
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
6951
|
+
rest = _objectWithoutPropertiesLoose(_ref, ["link"]);
|
|
6976
6952
|
|
|
6977
6953
|
var cinemaLink = link && _extends({}, link, {
|
|
6978
6954
|
color: exports.Colors.Black,
|
|
@@ -6996,8 +6972,6 @@ var TextWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject6$f || (_tem
|
|
|
6996
6972
|
var ButtonWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject7$a || (_templateObject7$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n grid-area: button;\n align-self: end;\n display: flex;\n justify-content: center;\n margin-top: 40px;\n\n @media ", " {\n & {\n margin-top: 0px;\n margin-bottom: 20px;\n }\n }\n"])), devices.mobile);
|
|
6997
6973
|
var ScrollDownWrapper = /*#__PURE__*/styled__default.div(_templateObject8$7 || (_templateObject8$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n bottom: 20px;\n left: var(--grid-outer-margin);\n width: fit-content;\n z-index: ", ";\n\n @keyframes UpDown {\n 0%,\n 100% {\n transform: translateY(0);\n }\n 50% {\n transform: translateY(8px);\n }\n }\n\n a {\n font-size: var(--font-size-overline-1);\n font-weight: var(--font-weight-overline-1);\n letter-spacing: var(--letter-spacing-overline-1);\n border: none;\n padding: 0;\n :hover {\n border: none;\n\n > span {\n animation: UpDown 1500ms linear infinite;\n }\n }\n }\n\n @media ", " {\n & {\n display: none;\n }\n }\n\n @media ", " {\n & {\n display: none;\n }\n }\n"])), zIndexes.contentOverlay, devices.mobile, devices.tablet);
|
|
6998
6974
|
|
|
6999
|
-
var _excluded$i = ["text"];
|
|
7000
|
-
|
|
7001
6975
|
var PageHeadingImpact = function PageHeadingImpact(_ref) {
|
|
7002
6976
|
var children = _ref.children,
|
|
7003
6977
|
text = _ref.text,
|
|
@@ -7014,7 +6988,7 @@ var PageHeadingImpact = function PageHeadingImpact(_ref) {
|
|
|
7014
6988
|
|
|
7015
6989
|
var _ref2 = link || {},
|
|
7016
6990
|
linkText = _ref2.text,
|
|
7017
|
-
restLink = _objectWithoutPropertiesLoose(_ref2,
|
|
6991
|
+
restLink = _objectWithoutPropertiesLoose(_ref2, ["text"]);
|
|
7018
6992
|
|
|
7019
6993
|
return /*#__PURE__*/React__default.createElement(ImpactWrapper, {
|
|
7020
6994
|
bgUrlDesktop: bgUrlDesktop,
|
|
@@ -7107,11 +7081,9 @@ var PageHeadingPanel = function PageHeadingPanel(_ref) {
|
|
|
7107
7081
|
var _templateObject$Z;
|
|
7108
7082
|
var StreamWrapper = /*#__PURE__*/styled__default.div(_templateObject$Z || (_templateObject$Z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h2::selection,\n div::selection {\n color: #1866dc;\n background-color: #fff;\n }\n"])));
|
|
7109
7083
|
|
|
7110
|
-
var _excluded$j = ["link"];
|
|
7111
|
-
|
|
7112
7084
|
var PageHeadingStream = function PageHeadingStream(_ref) {
|
|
7113
7085
|
var link = _ref.link,
|
|
7114
|
-
rest = _objectWithoutPropertiesLoose(_ref,
|
|
7086
|
+
rest = _objectWithoutPropertiesLoose(_ref, ["link"]);
|
|
7115
7087
|
|
|
7116
7088
|
var streamLink = link && _extends({}, link, {
|
|
7117
7089
|
color: exports.Colors.Black,
|
|
@@ -7305,8 +7277,6 @@ var useMobile = function useMobile() {
|
|
|
7305
7277
|
return mobile;
|
|
7306
7278
|
};
|
|
7307
7279
|
|
|
7308
|
-
var _excluded$k = ["text"];
|
|
7309
|
-
|
|
7310
7280
|
var useResponsiveVideo = function useResponsiveVideo(video, poster) {
|
|
7311
7281
|
var mobileVideo = video.mobile || video.desktop;
|
|
7312
7282
|
var desktopVideo = video.desktop || video.mobile;
|
|
@@ -7421,7 +7391,7 @@ var PageHeadingCompact = function PageHeadingCompact(_ref4) {
|
|
|
7421
7391
|
|
|
7422
7392
|
var _ref5 = link || {},
|
|
7423
7393
|
linkText = _ref5.text,
|
|
7424
|
-
restLink = _objectWithoutPropertiesLoose(_ref5,
|
|
7394
|
+
restLink = _objectWithoutPropertiesLoose(_ref5, ["text"]);
|
|
7425
7395
|
|
|
7426
7396
|
var titleSize = title && title.length > 20 ? 4 : 3;
|
|
7427
7397
|
var video = {
|
|
@@ -7761,10 +7731,6 @@ var PromoWithTagsContainer = /*#__PURE__*/styled__default.div(_templateObject19
|
|
|
7761
7731
|
var TimerWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject20 || (_templateObject20 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-bottom: 32px;\n"])));
|
|
7762
7732
|
var EndDateText = /*#__PURE__*/styled__default.div(_templateObject21 || (_templateObject21 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border-bottom: 1px solid var(--base-color-black);\n padding-bottom: 32px;\n margin-bottom: 32px;\n\n @media ", " {\n padding-bottom: 20px;\n margin-bottom: 20px;\n }\n"])), devices.mobile);
|
|
7763
7733
|
|
|
7764
|
-
var _excluded$l = ["text"],
|
|
7765
|
-
_excluded2$2 = ["text"],
|
|
7766
|
-
_excluded3 = ["text"];
|
|
7767
|
-
|
|
7768
7734
|
var _buttonTypeToButton$1;
|
|
7769
7735
|
var LENGTH_TEXT$1 = 28;
|
|
7770
7736
|
var LENGTH_TEXT_PARAGRAPH = 130;
|
|
@@ -7835,7 +7801,7 @@ var PromoWithTags = function PromoWithTags(_ref) {
|
|
|
7835
7801
|
var _ref2 = firstButton || {},
|
|
7836
7802
|
_ref2$text = _ref2.text,
|
|
7837
7803
|
firstButtonText = _ref2$text === void 0 ? '' : _ref2$text,
|
|
7838
|
-
restFirstButton = _objectWithoutPropertiesLoose(_ref2,
|
|
7804
|
+
restFirstButton = _objectWithoutPropertiesLoose(_ref2, ["text"]);
|
|
7839
7805
|
|
|
7840
7806
|
var primaryButtonTextTruncate = truncate(firstButtonText, LENGTH_TEXT$1);
|
|
7841
7807
|
var secondButton = links == null ? void 0 : links[1];
|
|
@@ -7843,7 +7809,7 @@ var PromoWithTags = function PromoWithTags(_ref) {
|
|
|
7843
7809
|
var _ref3 = secondButton || {},
|
|
7844
7810
|
_ref3$text = _ref3.text,
|
|
7845
7811
|
secondButtonText = _ref3$text === void 0 ? '' : _ref3$text,
|
|
7846
|
-
restSecondButton = _objectWithoutPropertiesLoose(_ref3,
|
|
7812
|
+
restSecondButton = _objectWithoutPropertiesLoose(_ref3, ["text"]);
|
|
7847
7813
|
|
|
7848
7814
|
var secondButtonTextTruncate = truncate(secondButtonText, LENGTH_TEXT$1);
|
|
7849
7815
|
var textTruncate = asCard ? truncate(text || '', LENGTH_TEXT_PARAGRAPH) : text;
|
|
@@ -7852,7 +7818,7 @@ var PromoWithTags = function PromoWithTags(_ref) {
|
|
|
7852
7818
|
var textLinkItems = textLinks ? textLinks.map(function (link, index) {
|
|
7853
7819
|
var _link$text = link.text,
|
|
7854
7820
|
textLinkText = _link$text === void 0 ? '' : _link$text,
|
|
7855
|
-
restTextLink = _objectWithoutPropertiesLoose(link,
|
|
7821
|
+
restTextLink = _objectWithoutPropertiesLoose(link, ["text"]);
|
|
7856
7822
|
|
|
7857
7823
|
return /*#__PURE__*/React__default.createElement(TextLinkWrapper$2, {
|
|
7858
7824
|
key: index
|
|
@@ -8010,8 +7976,6 @@ var ButtonsContainer$3 = /*#__PURE__*/styled__default.div(_templateObject7$d ||
|
|
|
8010
7976
|
return '';
|
|
8011
7977
|
});
|
|
8012
7978
|
|
|
8013
|
-
var _excluded$m = ["text"],
|
|
8014
|
-
_excluded2$3 = ["text"];
|
|
8015
7979
|
var LENGTH_TEXT$3 = 28;
|
|
8016
7980
|
|
|
8017
7981
|
var PromoWithTitle = function PromoWithTitle(_ref) {
|
|
@@ -8037,7 +8001,7 @@ var PromoWithTitle = function PromoWithTitle(_ref) {
|
|
|
8037
8001
|
var _ref2 = primaryButton || {},
|
|
8038
8002
|
_ref2$text = _ref2.text,
|
|
8039
8003
|
primaryButtonText = _ref2$text === void 0 ? '' : _ref2$text,
|
|
8040
|
-
restPrimaryButton = _objectWithoutPropertiesLoose(_ref2,
|
|
8004
|
+
restPrimaryButton = _objectWithoutPropertiesLoose(_ref2, ["text"]);
|
|
8041
8005
|
|
|
8042
8006
|
var primaryButtonTextTruncate = truncate(primaryButtonText, LENGTH_TEXT$3);
|
|
8043
8007
|
var tertiaryButton = links == null ? void 0 : links[1];
|
|
@@ -8045,7 +8009,7 @@ var PromoWithTitle = function PromoWithTitle(_ref) {
|
|
|
8045
8009
|
var _ref3 = tertiaryButton || {},
|
|
8046
8010
|
_ref3$text = _ref3.text,
|
|
8047
8011
|
tertiaryButtonText = _ref3$text === void 0 ? '' : _ref3$text,
|
|
8048
|
-
restTertiaryButton = _objectWithoutPropertiesLoose(_ref3,
|
|
8012
|
+
restTertiaryButton = _objectWithoutPropertiesLoose(_ref3, ["text"]);
|
|
8049
8013
|
|
|
8050
8014
|
var tertiaryButtonTextTruncate = truncate(tertiaryButtonText, LENGTH_TEXT$3);
|
|
8051
8015
|
return /*#__PURE__*/React__default.createElement(PromoWithTitleGrid, {
|
|
@@ -8514,6 +8478,7 @@ var useAccessibility = function useAccessibility(props) {
|
|
|
8514
8478
|
};
|
|
8515
8479
|
};
|
|
8516
8480
|
/**
|
|
8481
|
+
* DEPRECATED. Use Select2 instead.
|
|
8517
8482
|
* A select component, created using <ul> and <li> elements, with bespoke accessibility
|
|
8518
8483
|
* logic.
|
|
8519
8484
|
*
|
|
@@ -8734,8 +8699,96 @@ function Select(_ref3) {
|
|
|
8734
8699
|
}))), /*#__PURE__*/React__default.createElement(ArrowIcon, null)));
|
|
8735
8700
|
}
|
|
8736
8701
|
|
|
8737
|
-
var _templateObject$19;
|
|
8738
|
-
var
|
|
8702
|
+
var _templateObject$19, _templateObject2$Q, _templateObject3$I, _templateObject4$y;
|
|
8703
|
+
var Container$4 = /*#__PURE__*/styled__default.div(_templateObject$19 || (_templateObject$19 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n"])));
|
|
8704
|
+
var SelectWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject2$Q || (_templateObject2$Q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n width: auto;\n max-width: ", ";\n\n .chord-select__control {\n min-height: 48px;\n border-radius: 0;\n transition: none;\n border: ", ";\n &:hover {\n border-color: ", ";\n }\n }\n .chord-select__control--is-focused {\n border-color: var(--base-color-darkgrey);\n box-shadow: ", ";\n }\n .chord-select__indicator-separator {\n display: none;\n }\n .chord-select__control--menu-is-open {\n .chord-select__indicator {\n svg {\n transform: rotate(180deg);\n }\n }\n }\n .chord-select__indicator {\n font-size: 25px;\n padding: 0;\n margin-right: 12px;\n color: var(--base-color-black);\n svg {\n height: 1em;\n width: 1em;\n color: inherit;\n path {\n fill: currentColor;\n color: inherit;\n }\n }\n }\n .chord-select__single-value,\n .chord-select__placeholder {\n margin-left: 0;\n margin-right: 0;\n font-family: var(--font-family-altHeader);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n text-transform: var(--text-transform-altHeader);\n }\n .chord-select__placeholder {\n color: var(--base-color-darkgrey);\n }\n .chord-select__single-value {\n color: var(--base-color-black);\n }\n .chord-select__value-container {\n padding-left: 20px;\n padding-right: 15px;\n padding-top: 1px;\n padding-bottom: 0px;\n }\n .chord-select--is-disabled {\n .chord-select__control {\n border: 1px solid var(--base-color-lightgrey);\n background: var(--base-color-lightgrey);\n }\n .chord-select__indicator,\n .chord-select__single-value {\n color: var(--base-color-darkgrey);\n }\n }\n .chord-select__menu {\n margin-top: -1px;\n box-shadow: none;\n border-radius: 0;\n border: 1px solid var(--base-color-darkgrey);\n background: var(--base-color-lightgrey);\n }\n .chord-select__menu-list {\n padding-top: 0;\n padding-bottom: 0;\n }\n .chord-select__option {\n padding: 10px 20px;\n font-family: var(--font-family-altHeader);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n text-transform: var(--text-transform-altHeader);\n color: var(--base-color-black);\n &:active,\n &.chord-select__option--is-focused {\n background: var(--base-color-midgrey);\n }\n }\n .chord-select__option--is-selected {\n color: var(--base-color-black);\n background: none;\n }\n .chord-select__input-container {\n margin: 0;\n padding-top: 0;\n padding-bottom: 0;\n font-family: var(--font-family-altHeader);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n text-transform: var(--text-transform-altHeader);\n color: var(--base-color-black);\n }\n .chord-select__menu-notice {\n padding: 10px 20px;\n font-family: var(--font-family-altHeader);\n font-feature-settings: var(--font-feature-settings-altHeader);\n font-size: var(--font-size-altHeader-6);\n font-weight: var(--font-weight-altHeader-6);\n letter-spacing: var(--letter-spacing-altHeader-6);\n line-height: var(--line-height-altHeader-6);\n text-transform: var(--text-transform-altHeader);\n color: var(--base-color-darkgrey);\n text-align: left;\n }\n"])), function (_ref) {
|
|
8705
|
+
var width = _ref.width;
|
|
8706
|
+
if (!width) return 'none';
|
|
8707
|
+
return width + 'px';
|
|
8708
|
+
}, function (_ref2) {
|
|
8709
|
+
var error = _ref2.error;
|
|
8710
|
+
if (error !== undefined) return "1px solid var(--base-color-errorstate)";
|
|
8711
|
+
return "1px solid var(--base-color-darkgrey)";
|
|
8712
|
+
}, function (_ref3) {
|
|
8713
|
+
var error = _ref3.error;
|
|
8714
|
+
if (error !== undefined) return "var(--base-color-errorstate)";
|
|
8715
|
+
return "var(--base-color-darkgrey)";
|
|
8716
|
+
}, function (_ref4) {
|
|
8717
|
+
var darkMode = _ref4.darkMode;
|
|
8718
|
+
if (darkMode) return "0 0 0 4px var(--base-color-lemonchiffon)";
|
|
8719
|
+
return "0 0 0 3px var(--base-color-lapislazuli)";
|
|
8720
|
+
});
|
|
8721
|
+
var TextLabel$3 = /*#__PURE__*/styled__default.p(_templateObject3$I || (_templateObject3$I = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 0 0 20px;\n color: ", ";\n"])), function (_ref5) {
|
|
8722
|
+
var darkMode = _ref5.darkMode;
|
|
8723
|
+
if (darkMode) return "var(--base-color-white)";
|
|
8724
|
+
return "var(--base-color-black)";
|
|
8725
|
+
});
|
|
8726
|
+
var ErrorLabel$4 = /*#__PURE__*/styled__default.p(_templateObject4$y || (_templateObject4$y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin: 20px 0 0;\n color: ", ";\n"])), function (_ref6) {
|
|
8727
|
+
var darkMode = _ref6.darkMode;
|
|
8728
|
+
if (darkMode) return "var(--base-color-white)";
|
|
8729
|
+
return "var(--base-color-errorstate)";
|
|
8730
|
+
});
|
|
8731
|
+
|
|
8732
|
+
var DropdownIndicator = function DropdownIndicator(props) {
|
|
8733
|
+
return /*#__PURE__*/React__default.createElement(Select$1.components.DropdownIndicator, Object.assign({}, props), /*#__PURE__*/React__default.createElement(Icon, {
|
|
8734
|
+
iconName: "DropdownArrow"
|
|
8735
|
+
}));
|
|
8736
|
+
};
|
|
8737
|
+
/**
|
|
8738
|
+
* A Select2 component wraps react-select with Chord styling and additional elements like
|
|
8739
|
+
* text and error labels. This should be used just as usual react-select component.
|
|
8740
|
+
* Note: using some advanced opportunities of react-select may require additional styling.
|
|
8741
|
+
*
|
|
8742
|
+
* # Error state
|
|
8743
|
+
* An error label will be shown below the select if the `error` prop exists.
|
|
8744
|
+
* Also select will be rendered with a red border. An empty string can be passed to
|
|
8745
|
+
* render only error state without error message.
|
|
8746
|
+
*
|
|
8747
|
+
* # Light / Dark mode
|
|
8748
|
+
* The component can also adapt its styles for light / dark mode. If you want this component
|
|
8749
|
+
* to be rendered on a dark / coloured background, you can use the `darkMode` prop.
|
|
8750
|
+
*/
|
|
8751
|
+
|
|
8752
|
+
|
|
8753
|
+
var SelectComponent = function SelectComponent(_ref) {
|
|
8754
|
+
var label = _ref.label,
|
|
8755
|
+
error = _ref.error,
|
|
8756
|
+
width = _ref.width,
|
|
8757
|
+
_ref$darkMode = _ref.darkMode,
|
|
8758
|
+
darkMode = _ref$darkMode === void 0 ? false : _ref$darkMode,
|
|
8759
|
+
_ref$isSearchable = _ref.isSearchable,
|
|
8760
|
+
isSearchable = _ref$isSearchable === void 0 ? false : _ref$isSearchable,
|
|
8761
|
+
_ref$placeholder = _ref.placeholder,
|
|
8762
|
+
placeholder = _ref$placeholder === void 0 ? 'Please select' : _ref$placeholder,
|
|
8763
|
+
selectProps = _objectWithoutPropertiesLoose(_ref, ["label", "error", "width", "darkMode", "isSearchable", "placeholder"]);
|
|
8764
|
+
|
|
8765
|
+
return /*#__PURE__*/React__default.createElement(Container$4, null, /*#__PURE__*/React__default.createElement("label", null, !!label && /*#__PURE__*/React__default.createElement(TextLabel$3, {
|
|
8766
|
+
darkMode: darkMode,
|
|
8767
|
+
"data-testid": "select2-text-label"
|
|
8768
|
+
}, /*#__PURE__*/React__default.createElement(AltHeader, {
|
|
8769
|
+
level: 6
|
|
8770
|
+
}, label)), /*#__PURE__*/React__default.createElement(SelectWrapper$1, {
|
|
8771
|
+
width: width,
|
|
8772
|
+
error: error,
|
|
8773
|
+
darkMode: darkMode
|
|
8774
|
+
}, /*#__PURE__*/React__default.createElement(Select$1__default, Object.assign({
|
|
8775
|
+
components: {
|
|
8776
|
+
DropdownIndicator: DropdownIndicator
|
|
8777
|
+
},
|
|
8778
|
+
isSearchable: isSearchable,
|
|
8779
|
+
placeholder: placeholder,
|
|
8780
|
+
className: "chord-select-container",
|
|
8781
|
+
classNamePrefix: "chord-select"
|
|
8782
|
+
}, selectProps)))), !!error && /*#__PURE__*/React__default.createElement(ErrorLabel$4, {
|
|
8783
|
+
darkMode: darkMode,
|
|
8784
|
+
"data-testid": "select2-error-label"
|
|
8785
|
+
}, /*#__PURE__*/React__default.createElement(AltHeader, {
|
|
8786
|
+
level: 6
|
|
8787
|
+
}, error)));
|
|
8788
|
+
};
|
|
8789
|
+
|
|
8790
|
+
var _templateObject$1a;
|
|
8791
|
+
var TextContainer$2 = /*#__PURE__*/styled__default.div(_templateObject$1a || (_templateObject$1a = /*#__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 text-transform: var(--text-transform-body);\n\n & h1,\n h2,\n h3,\n h4 {\n font-size: var(--font-size-header-4);\n font-family: var(--font-family-header);\n font-feature-settings: var(--font-feature-settings-header);\n font-weight: var(--font-weight-header-4);\n letter-spacing: var(--letter-spacing-header-4);\n line-height: var(--line-height-header-4);\n text-transform: var(--text-transform-header);\n white-space: break-spaces;\n overflow-wrap: break-word;\n margin: 80px 0 16px;\n\n @media ", " {\n margin-top: 60px;\n }\n\n + p {\n margin-top: 0px;\n }\n }\n\n & h5,\n h6 {\n font-size: var(--font-size-subtitle-1);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n white-space: break-spaces;\n overflow-wrap: break-word;\n margin: 80px 0 16px;\n\n @media ", " {\n margin-top: 60px;\n }\n\n + p {\n margin-top: 10px;\n }\n }\n\n & a {\n color: ", ";\n text-decoration: underline;\n cursor: pointer;\n }\n\n p {\n margin: 30px 0;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & strong {\n font-weight: bold;\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n\n & ul {\n padding: 0;\n list-style: none;\n margin: 0 0 0 30px;\n\n li {\n text-indent: -20px;\n line-height: var(--line-height-listing);\n }\n }\n\n & ol {\n padding: 0;\n margin: 0 0 0 20px;\n\n li {\n line-height: var(--line-height-listing);\n }\n }\n\n & ul > li:before {\n display: inline-block;\n content: '\u2014';\n width: 0px;\n margin-left: 12px;\n margin-right: 8px;\n }\n"])), devices.mobileAndTablet, devices.mobileAndTablet, function (_ref) {
|
|
8739
8792
|
var theme = _ref.theme;
|
|
8740
8793
|
return theme.colors.primary;
|
|
8741
8794
|
});
|
|
@@ -8763,8 +8816,8 @@ var TextOnly = function TextOnly(_ref) {
|
|
|
8763
8816
|
})));
|
|
8764
8817
|
};
|
|
8765
8818
|
|
|
8766
|
-
var _templateObject$
|
|
8767
|
-
var Wrapper$6 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
8819
|
+
var _templateObject$1b, _templateObject2$R;
|
|
8820
|
+
var Wrapper$6 = /*#__PURE__*/styled__default.div(_templateObject$1b || (_templateObject$1b = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n height: 100%;\n width: fit-content;\n\n ", " {\n height: calc(100% - 12px - var(--line-height-body-2));\n @supports not (aspect-ratio: ", ") {\n width: ", ";\n }\n }\n"])), ImageAspectRatioWrapper, function (_ref) {
|
|
8768
8821
|
var _ref$aspectRatio = _ref.aspectRatio,
|
|
8769
8822
|
aspectRatio = _ref$aspectRatio === void 0 ? exports.AspectRatio['1:1'] : _ref$aspectRatio;
|
|
8770
8823
|
return aspectRatio;
|
|
@@ -8774,7 +8827,7 @@ var Wrapper$6 = /*#__PURE__*/styled__default.div(_templateObject$1a || (_templat
|
|
|
8774
8827
|
height = _ref2.height;
|
|
8775
8828
|
return "calc(calc(" + height + "px - 12px - var(--line-height-body-2)) * " + AspectRatioWidth[aspectRatio] + ")";
|
|
8776
8829
|
});
|
|
8777
|
-
var CaptionWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
8830
|
+
var CaptionWrapper = /*#__PURE__*/styled__default.div(_templateObject2$R || (_templateObject2$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 12px;\n height: var(--line-height-body-2);\n font-family: var(--font-family-body);\n font-feature-settings: var(--font-feature-settings-body);\n font-size: var(--font-size-body-2);\n font-weight: var(--font-weight-body-2);\n letter-spacing: var(--letter-spacing-body-2);\n line-height: var(--line-height-body-2);\n text-transform: var(--text-transform-body-2);\n word-break: var(--word-break-body-2);\n font-style: italic;\n"])));
|
|
8778
8831
|
|
|
8779
8832
|
var ImageWithCaption = function ImageWithCaption(_ref) {
|
|
8780
8833
|
var caption = _ref.caption,
|
|
@@ -8812,13 +8865,13 @@ var ImageWithCaption = function ImageWithCaption(_ref) {
|
|
|
8812
8865
|
}, children), /*#__PURE__*/React__default.createElement(CaptionWrapper, null, caption));
|
|
8813
8866
|
};
|
|
8814
8867
|
|
|
8815
|
-
var _templateObject$
|
|
8816
|
-
var TextWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
8817
|
-
var AttributionWrapper = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
8868
|
+
var _templateObject$1c, _templateObject2$S, _templateObject3$J;
|
|
8869
|
+
var TextWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject$1c || (_templateObject$1c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h4 {\n margin: 0;\n }\n"])));
|
|
8870
|
+
var AttributionWrapper = /*#__PURE__*/styled__default.div(_templateObject2$S || (_templateObject2$S = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), function (_ref) {
|
|
8818
8871
|
var displayAttribution = _ref.displayAttribution;
|
|
8819
8872
|
return "display: " + (displayAttribution ? 'block' : 'none') + ";";
|
|
8820
8873
|
});
|
|
8821
|
-
var Line$1 = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
8874
|
+
var Line$1 = /*#__PURE__*/styled__default.div(_templateObject3$J || (_templateObject3$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background-color: var(--base-color-black);\n height: 2px;\n width: 62px;\n margin: 32px 0;\n\n @media ", " {\n height: 1px;\n width: 46px;\n margin: 24px 0;\n }\n"])), devices.mobile);
|
|
8822
8875
|
|
|
8823
8876
|
var Quote = function Quote(_ref) {
|
|
8824
8877
|
var text = _ref.text,
|
|
@@ -8842,11 +8895,11 @@ var Quote = function Quote(_ref) {
|
|
|
8842
8895
|
}, attribution))));
|
|
8843
8896
|
};
|
|
8844
8897
|
|
|
8845
|
-
var _templateObject$
|
|
8846
|
-
var CardContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$
|
|
8847
|
-
var ContentContainer$4 = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
8848
|
-
var StyledImage = /*#__PURE__*/styled__default.img(_templateObject3$
|
|
8849
|
-
var ImageWrapper = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
8898
|
+
var _templateObject$1d, _templateObject2$T, _templateObject3$K, _templateObject4$z, _templateObject5$q, _templateObject6$l;
|
|
8899
|
+
var CardContainer$1 = /*#__PURE__*/styled__default.div(_templateObject$1d || (_templateObject$1d = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n cursor: pointer;\n width: 100%;\n display: grid;\n grid-template-columns: repeat(7, minmax(0, 1fr));\n gap: 15px;\n min-height: 50px;\n"])));
|
|
8900
|
+
var ContentContainer$4 = /*#__PURE__*/styled__default.div(_templateObject2$T || (_templateObject2$T = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n height: 100%;\n display: flex;\n flex-direction: column;\n justify-content: center;\n"])));
|
|
8901
|
+
var StyledImage = /*#__PURE__*/styled__default.img(_templateObject3$K || (_templateObject3$K = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n border: 1px solid var(--base-color-white);\n"])));
|
|
8902
|
+
var ImageWrapper = /*#__PURE__*/styled__default.div(_templateObject4$z || (_templateObject4$z = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n"])));
|
|
8850
8903
|
var IconWrapper$3 = /*#__PURE__*/styled__default.div(_templateObject5$q || (_templateObject5$q = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n background: rgba(0, 0, 0, 0.4);\n position: absolute;\n top: 0;\n width: 100%;\n height: 100%;\n display: flex;\n justify-content: center;\n align-items: center;\n span {\n width: 40px;\n height: 40px;\n @media ", " {\n width: 24px;\n height: 24px;\n }\n @media ", " {\n width: 18px;\n height: 18px;\n }\n }\n"])), devices.tablet, devices.mobile);
|
|
8851
8904
|
var TitleWrapper$2 = /*#__PURE__*/styled__default.div(_templateObject6$l || (_templateObject6$l = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n margin-top: 8px;\n div {\n @media ", " {\n display: -webkit-box;\n -webkit-line-clamp: 2;\n -webkit-box-orient: vertical;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n"])), devices.mobile);
|
|
8852
8905
|
|
|
@@ -8886,11 +8939,11 @@ var MiniCard = function MiniCard(_ref) {
|
|
|
8886
8939
|
}, title)))));
|
|
8887
8940
|
};
|
|
8888
8941
|
|
|
8889
|
-
var _templateObject$
|
|
8890
|
-
var ReadMoreContainer = /*#__PURE__*/styled__default.div(_templateObject$
|
|
8891
|
-
var LinkContainer = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
8892
|
-
var FullTextContainer = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
8893
|
-
var ContentContainer$5 = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
8942
|
+
var _templateObject$1e, _templateObject2$U, _templateObject3$L, _templateObject4$A;
|
|
8943
|
+
var ReadMoreContainer = /*#__PURE__*/styled__default.div(_templateObject$1e || (_templateObject$1e = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n h1,\n h2,\n h3,\n h4,\n h5,\n h6 {\n margin: 0px 0px 12px 0px !important;\n }\n width: 100%;\n"])));
|
|
8944
|
+
var LinkContainer = /*#__PURE__*/styled__default.div(_templateObject2$U || (_templateObject2$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding-top: 24px;\n gap: 8px;\n\n :hover {\n cursor: pointer;\n }\n"])));
|
|
8945
|
+
var FullTextContainer = /*#__PURE__*/styled__default.div(_templateObject3$L || (_templateObject3$L = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
8946
|
+
var ContentContainer$5 = /*#__PURE__*/styled__default.div(_templateObject4$A || (_templateObject4$A = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n overflow: auto;\n transition: max-height 0.4s ease;\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 text-transform: var(--text-transform-body);\n\n & h1 {\n font-size: var(--font-size-header-4);\n font-family: var(--font-family-header);\n font-feature-settings: var(--font-feature-settings-header);\n font-weight: var(--font-weight-header-4);\n letter-spacing: var(--letter-spacing-header-4);\n line-height: var(--line-height-header-4);\n text-transform: var(--text-transform-header);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & h2 {\n font-size: var(--font-size-subtitle-1);\n font-family: var(--font-family-subtitle);\n font-feature-settings: var(--font-feature-settings-subtitle);\n font-weight: var(--font-weight-subtitle-1);\n letter-spacing: var(--letter-spacing-subtitle-1);\n line-height: var(--line-height-subtitle-1);\n text-transform: var(--text-transform-subtitle);\n white-space: break-spaces;\n overflow-wrap: break-word;\n }\n\n & em {\n font-family: var(--font-family-body-italics);\n }\n\n & u {\n font-size: var(--font-size-body-1);\n font-family: var(--font-family-body);\n }\n"])));
|
|
8894
8947
|
|
|
8895
8948
|
var keyDown = function keyDown(e, toggleFunction) {
|
|
8896
8949
|
if (e.key === 'Enter' || e.key === 'Space') {
|
|
@@ -8988,14 +9041,14 @@ var ReadMore = function ReadMore(_ref) {
|
|
|
8988
9041
|
}, isFullTextOpen ? "" + hideText : "" + showMoreText)));
|
|
8989
9042
|
};
|
|
8990
9043
|
|
|
8991
|
-
var _templateObject$
|
|
8992
|
-
var Container$
|
|
8993
|
-
var Sections = /*#__PURE__*/styled__default.div(_templateObject2$
|
|
8994
|
-
var Section = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
9044
|
+
var _templateObject$1f, _templateObject2$V, _templateObject3$M, _templateObject4$B, _templateObject5$r, _templateObject6$m;
|
|
9045
|
+
var Container$5 = /*#__PURE__*/styled__default.div(_templateObject$1f || (_templateObject$1f = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: column;\n gap: 10px;\n"])));
|
|
9046
|
+
var Sections = /*#__PURE__*/styled__default.div(_templateObject2$V || (_templateObject2$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n gap: 8px;\n"])));
|
|
9047
|
+
var Section = /*#__PURE__*/styled__default.div(_templateObject3$M || (_templateObject3$M = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n flex: 1;\n height: 2px;\n background-color: ", ";\n"])), function (_ref) {
|
|
8995
9048
|
var color = _ref.color;
|
|
8996
9049
|
return "var(--base-color-" + color + ")";
|
|
8997
9050
|
});
|
|
8998
|
-
var BottomLine = /*#__PURE__*/styled__default.div(_templateObject4$
|
|
9051
|
+
var BottomLine = /*#__PURE__*/styled__default.div(_templateObject4$B || (_templateObject4$B = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n gap: 20px;\n"])));
|
|
8999
9052
|
var Text = /*#__PURE__*/styled__default.div(_templateObject5$r || (_templateObject5$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n color: ", ";\n"])), function (_ref2) {
|
|
9000
9053
|
var color = _ref2.color;
|
|
9001
9054
|
return "var(--base-color-" + color + ")";
|
|
@@ -9061,7 +9114,7 @@ var PasswordStrength = function PasswordStrength(_ref) {
|
|
|
9061
9114
|
return index < activeSections ? 'password-strength-section-active' : 'password-strength-section';
|
|
9062
9115
|
};
|
|
9063
9116
|
|
|
9064
|
-
return /*#__PURE__*/React__default.createElement(Container$
|
|
9117
|
+
return /*#__PURE__*/React__default.createElement(Container$5, {
|
|
9065
9118
|
"data-testid": "password-strength-container"
|
|
9066
9119
|
}, /*#__PURE__*/React__default.createElement(Sections, {
|
|
9067
9120
|
"data-testid": "password-strength-sections"
|
|
@@ -9086,17 +9139,17 @@ var PasswordStrength = function PasswordStrength(_ref) {
|
|
|
9086
9139
|
}, strengthLabel))));
|
|
9087
9140
|
};
|
|
9088
9141
|
|
|
9089
|
-
var _templateObject$
|
|
9090
|
-
var MenuContainer$2 = /*#__PURE__*/styled__default.menu(_templateObject$
|
|
9091
|
-
var MenuList = /*#__PURE__*/styled__default.ul(_templateObject2$
|
|
9142
|
+
var _templateObject$1g, _templateObject2$W, _templateObject3$N, _templateObject4$C;
|
|
9143
|
+
var MenuContainer$2 = /*#__PURE__*/styled__default.menu(_templateObject$1g || (_templateObject$1g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: relative;\n padding: 0;\n margin: 0;\n"])));
|
|
9144
|
+
var MenuList = /*#__PURE__*/styled__default.ul(_templateObject2$W || (_templateObject2$W = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 0;\n margin: 0;\n list-style: none;\n border-right: 1px solid var(--base-color-", ");\n li {\n margin-left: -5px;\n @media ", " {\n margin-left: 0px;\n }\n }\n @media ", " {\n display: ", ";\n background: var(--base-color-", ");\n border: 1px solid var(--base-color-", ");\n border-top: 0;\n position: absolute;\n top: 100%;\n left: 0;\n right: 0;\n }\n"])), exports.Colors.LightGrey, devices.mobile, devices.mobile, function (_ref) {
|
|
9092
9145
|
var mobileOpen = _ref.mobileOpen;
|
|
9093
9146
|
return mobileOpen ? "block" : 'none';
|
|
9094
9147
|
}, exports.Colors.White, exports.Colors.DarkGrey);
|
|
9095
|
-
var MenuItem$1 = /*#__PURE__*/styled__default.button(_templateObject3$
|
|
9148
|
+
var MenuItem$1 = /*#__PURE__*/styled__default.button(_templateObject3$N || (_templateObject3$N = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n line-height: var(--line-height-navigation);\n font-size: var(--font-size-navigation);\n font-family: var(--font-family-navigation);\n font-weight: var(--font-weight-navigation);\n letter-spacing: var(--letter-spacing-navigation);\n color: var(--base-color-", ");\n text-transform: uppercase;\n margin: 0;\n padding: 16px 20px 15px 5px;\n border: 0;\n border-radius: 0;\n display: block;\n width: 100%;\n text-align: left;\n background: ", ";\n cursor: pointer;\n &:hover {\n background: var(--base-color-", ");\n }\n @media ", " {\n padding: 16px 20px 15px 20px;\n }\n"])), exports.Colors.Black, function (_ref2) {
|
|
9096
9149
|
var active = _ref2.active;
|
|
9097
9150
|
return active ? "var(--base-color-" + exports.Colors.MidGrey + ")" : 'none';
|
|
9098
9151
|
}, exports.Colors.MidGrey, devices.mobile);
|
|
9099
|
-
var MobileButton = /*#__PURE__*/styled__default.button(_templateObject4$
|
|
9152
|
+
var MobileButton = /*#__PURE__*/styled__default.button(_templateObject4$C || (_templateObject4$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n line-height: var(--line-height-navigation);\n font-size: var(--font-size-navigation);\n font-family: var(--font-family-navigation);\n font-weight: var(--font-weight-navigation);\n letter-spacing: var(--letter-spacing-navigation);\n color: var(--base-color-", ");\n text-transform: uppercase;\n margin: 0;\n padding: 16px 46px 14px 20px;\n background: var(--base-color-", ");\n border: 1px solid var(--base-color-", ");\n border-radius: 0;\n display: none;\n width: 100%;\n text-align: left;\n cursor: pointer;\n position: relative;\n span {\n width: 25px;\n height: 25px;\n position: absolute;\n top: 50%;\n margin-top: -12px;\n right: 10px;\n }\n @media ", " {\n display: block;\n }\n"])), exports.Colors.Black, exports.Colors.White, exports.Colors.DarkGrey, devices.mobile);
|
|
9100
9153
|
|
|
9101
9154
|
/**
|
|
9102
9155
|
* Vertical menu component uses for navigation
|
|
@@ -9256,9 +9309,9 @@ var LiveChat = function LiveChat() {
|
|
|
9256
9309
|
});
|
|
9257
9310
|
};
|
|
9258
9311
|
|
|
9259
|
-
var _templateObject$
|
|
9260
|
-
var StickyBarWrapper = /*#__PURE__*/styled__default.div(_templateObject$
|
|
9261
|
-
var StickyBarGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$
|
|
9312
|
+
var _templateObject$1h, _templateObject2$X;
|
|
9313
|
+
var StickyBarWrapper = /*#__PURE__*/styled__default.div(_templateObject$1h || (_templateObject$1h = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n top: 0;\n position: sticky;\n z-index: ", ";\n background-color: var(--base-color-white);\n"])), zIndexes.anchor);
|
|
9314
|
+
var StickyBarGrid = /*#__PURE__*/styled__default(Grid)(_templateObject2$X || (_templateObject2$X = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n padding: 28px 0 26px;\n\n @media ", " {\n padding: 24px 0 28px;\n }\n\n @media ", " {\n border-bottom: none;\n }\n"])), function (_ref) {
|
|
9262
9315
|
var hideBottomBorder = _ref.hideBottomBorder;
|
|
9263
9316
|
return !hideBottomBorder && 'border-bottom: 2px solid var(--base-color-lightgrey);';
|
|
9264
9317
|
}, devices.mobileAndTablet, devices.mobile);
|
|
@@ -9286,13 +9339,12 @@ var StickyBar = function StickyBar(_ref) {
|
|
|
9286
9339
|
}, children)));
|
|
9287
9340
|
};
|
|
9288
9341
|
|
|
9289
|
-
var _templateObject$
|
|
9290
|
-
var InnerModal = /*#__PURE__*/styled__default.div(_templateObject$
|
|
9291
|
-
var CloseButton = /*#__PURE__*/styled__default.button(_templateObject2$
|
|
9292
|
-
var ContentWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$
|
|
9293
|
-
var Overlay = /*#__PURE__*/styled__default(Grid)(_templateObject4$
|
|
9342
|
+
var _templateObject$1i, _templateObject2$Y, _templateObject3$O, _templateObject4$D;
|
|
9343
|
+
var InnerModal = /*#__PURE__*/styled__default.div(_templateObject$1i || (_templateObject$1i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n padding: 62px;\n background-color: var(--base-color-white);\n z-index: ", ";\n position: relative;\n\n @media ", ", ", " {\n height: 100vh;\n padding: 62px 0 0;\n }\n"])), zIndexes.popup, devices.smallMobile, devices.mobile);
|
|
9344
|
+
var CloseButton = /*#__PURE__*/styled__default.button(_templateObject2$Y || (_templateObject2$Y = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: absolute;\n top: 0;\n right: 0;\n margin: 15px;\n height: 26px;\n width: 26px;\n padding: 0;\n background-color: transparent;\n border: none;\n cursor: pointer;\n @media ", " {\n margin: 25px;\n }\n @media ", ", ", " {\n margin: 30px;\n }\n"])), devices.tablet, devices.desktop, devices.largeDesktop);
|
|
9345
|
+
var ContentWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$O || (_templateObject3$O = /*#__PURE__*/_taggedTemplateLiteralLoose([""])));
|
|
9346
|
+
var Overlay = /*#__PURE__*/styled__default(Grid)(_templateObject4$D || (_templateObject4$D = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100vh;\n align-content: center;\n background-color: rgba(0, 0, 0, 0.4);\n"])));
|
|
9294
9347
|
|
|
9295
|
-
var _excluded$n = ["isOpen", "setIsOpen", "children", "appElementId"];
|
|
9296
9348
|
var MAX_Z_INDEX = 9999999999;
|
|
9297
9349
|
|
|
9298
9350
|
if (Modal.defaultStyles.content) {
|
|
@@ -9369,7 +9421,7 @@ var ModalWindow = function ModalWindow(_ref) {
|
|
|
9369
9421
|
setIsOpen = _ref.setIsOpen,
|
|
9370
9422
|
children = _ref.children,
|
|
9371
9423
|
appElementId = _ref.appElementId,
|
|
9372
|
-
modalProps = _objectWithoutPropertiesLoose(_ref,
|
|
9424
|
+
modalProps = _objectWithoutPropertiesLoose(_ref, ["isOpen", "setIsOpen", "children", "appElementId"]);
|
|
9373
9425
|
|
|
9374
9426
|
var isMobile = useMobile();
|
|
9375
9427
|
var customStyles = {
|
|
@@ -9411,8 +9463,8 @@ var ModalWindow = function ModalWindow(_ref) {
|
|
|
9411
9463
|
})), /*#__PURE__*/React__default.createElement(ContentWrapper$1, null, children))), /*#__PURE__*/React__default.createElement(ScrollLock, null)));
|
|
9412
9464
|
};
|
|
9413
9465
|
|
|
9414
|
-
var _templateObject$
|
|
9415
|
-
var GlobalStyles = /*#__PURE__*/styled.createGlobalStyle(_templateObject$1i || (_templateObject$1i = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n html {\n --base-color-primary: ", ";\n --base-color-core: ", ";\n --base-color-stream: ", ";\n --base-color-cinema: ", ";\n --base-color-white: ", ";\n --base-color-black: ", ";\n --base-color-dark-grey: ", ";\n --base-color-mid-grey: ", ";\n --base-color-light-grey: ", ";\n --error-color-state: ", ";\n --medium-color-state: ", ";\n --good-color-state: ", ";\n --base-color-darkgrey: ", ";\n --base-color-midgrey: ", ";\n --base-color-lightgrey: ", ";\n --base-color-transparent: transparent;\n --base-color-errorstate: ", ";\n --base-color-mediumstate: ", ";\n --base-color-goodstate: ", ";\n --base-color-progress: ", ";\n --base-color-navigation: ", ";\n --base-color-lapislazuli: ", ";\n --base-color-lemonchiffon: ", ";\n\n --button-height: ", ";\n --button-line-height: ", ";\n --button-padding-x: ", ";\n --button-padding-y: ", ";\n --button-padding-y-icon: ", ";\n --button-icon-margin: ", ";\n --button-icon-width: ", ";\n --button-icon-height: ", ";\n --button-font-size: ", ";\n --button-font-weight: ", ";\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n --margin-header-1: ", ";\n\n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n --margin-header-2: ", ";\n\n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n --margin-header-3: ", ";\n\n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n --margin-header-4: ", ";\n\n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n --margin-header-5: ", ";\n\n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n --margin-header-6: ", ";\n\n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n\n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n\n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n\n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n\n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n\n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n\n --font-size-overline-3: ", ";\n --font-weight-overline-3: ", ";\n --letter-spacing-overline-3: ", ";\n --line-height-overline-3: ", "; \n\n --font-size-overline-4: ", ";\n --font-weight-overline-4: ", ";\n --letter-spacing-overline-4: ", ";\n --line-height-overline-4: ", ";\n\n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n\n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n\n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n\n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-listing: ", ";\n --font-size-individual-listing-name: ", ";\n --line-height-individual-listing-name: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n\n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n\n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n\n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n\n --font-family-navigation: ", ";\n --font-size-navigation: ", ";\n --font-weight-navigation: ", ";\n --line-height-navigation: ", ";\n --text-transform-navigation: ", ";\n --letter-spacing-navigation: ", ";\n\n --navigation-small-gap: ", ";\n --navigation-middle-gap: ", ";\n --navigation-large-gap: ", ";\n --navigation-xlarge-gap: ", ";\n --navigation-large-margin: ", ";\n\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --grid-margin: ", ";\n --grid-outer-margin: ", ";\n --grid-template-columns: calc(", " - ", ") calc(", " - ", " - ", ") repeat(12, minmax(0,1fr)) calc(", " - ", " - ", ") calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: 0;\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --text-link-underline-offset: ", ";\n\n --cards-spacing-stack: ", ";\n\n --editorial-subtitle-margin-bottom: ", ";\n --editorial-margin-between: ", ";\n --editorial-spacing-hover: ", ";\n --anchor-tabs-height: 70px;\n \n\n @media ", " {\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n \n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n \n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n \n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n \n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n \n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n \n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n \n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n \n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n \n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n \n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n \n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n \n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n \n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n \n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n \n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n \n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n \n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n \n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n \n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --anchor-tabs-height: 60px;\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n }\n\n @media ", " {\n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-header-6: ", ";\n\n --font-size-altHeader-4: ", ";\n\n --font-size-body-1: ", ";\n }\n\n @media ", " {\n \n }\n\n @media ", " {\n \n }\n }\n"])), function (_ref) {
|
|
9466
|
+
var _templateObject$1j;
|
|
9467
|
+
var GlobalStyles = /*#__PURE__*/styled.createGlobalStyle(_templateObject$1j || (_templateObject$1j = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n html {\n --base-color-primary: ", ";\n --base-color-core: ", ";\n --base-color-stream: ", ";\n --base-color-cinema: ", ";\n --base-color-white: ", ";\n --base-color-black: ", ";\n --base-color-dark-grey: ", ";\n --base-color-mid-grey: ", ";\n --base-color-light-grey: ", ";\n --error-color-state: ", ";\n --medium-color-state: ", ";\n --good-color-state: ", ";\n --base-color-darkgrey: ", ";\n --base-color-midgrey: ", ";\n --base-color-lightgrey: ", ";\n --base-color-transparent: transparent;\n --base-color-errorstate: ", ";\n --base-color-mediumstate: ", ";\n --base-color-goodstate: ", ";\n --base-color-progress: ", ";\n --base-color-navigation: ", ";\n --base-color-lapislazuli: ", ";\n --base-color-lemonchiffon: ", ";\n\n --button-height: ", ";\n --button-line-height: ", ";\n --button-padding-x: ", ";\n --button-padding-y: ", ";\n --button-padding-y-icon: ", ";\n --button-icon-margin: ", ";\n --button-icon-width: ", ";\n --button-icon-height: ", ";\n --button-font-size: ", ";\n --button-font-weight: ", ";\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n --margin-header-1: ", ";\n\n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n --margin-header-2: ", ";\n\n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n --margin-header-3: ", ";\n\n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n --margin-header-4: ", ";\n\n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n --margin-header-5: ", ";\n\n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n --margin-header-6: ", ";\n\n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n\n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n\n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n\n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n\n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n\n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n\n --font-size-overline-3: ", ";\n --font-weight-overline-3: ", ";\n --letter-spacing-overline-3: ", ";\n --line-height-overline-3: ", "; \n\n --font-size-overline-4: ", ";\n --font-weight-overline-4: ", ";\n --letter-spacing-overline-4: ", ";\n --line-height-overline-4: ", ";\n\n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n\n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n\n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n\n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-listing: ", ";\n --font-size-individual-listing-name: ", ";\n --line-height-individual-listing-name: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n\n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n\n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n\n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n\n --font-family-navigation: ", ";\n --font-size-navigation: ", ";\n --font-weight-navigation: ", ";\n --line-height-navigation: ", ";\n --text-transform-navigation: ", ";\n --letter-spacing-navigation: ", ";\n\n --navigation-small-gap: ", ";\n --navigation-middle-gap: ", ";\n --navigation-large-gap: ", ";\n --navigation-xlarge-gap: ", ";\n --navigation-large-margin: ", ";\n\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --grid-margin: ", ";\n --grid-outer-margin: ", ";\n --grid-template-columns: calc(", " - ", ") calc(", " - ", " - ", ") repeat(12, minmax(0,1fr)) calc(", " - ", " - ", ") calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: 0;\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --text-link-underline-offset: ", ";\n\n --cards-spacing-stack: ", ";\n\n --editorial-subtitle-margin-bottom: ", ";\n --editorial-margin-between: ", ";\n --editorial-spacing-hover: ", ";\n --anchor-tabs-height: 70px;\n \n\n @media ", " {\n\n --font-size-header-1: ", ";\n --font-weight-header-1: ", ";\n --letter-spacing-header-1: ", ";\n --line-height-header-1: ", ";\n \n --font-size-header-2: ", ";\n --font-weight-header-2: ", ";\n --letter-spacing-header-2: ", ";\n --line-height-header-2: ", ";\n \n --font-size-header-3: ", ";\n --font-weight-header-3: ", ";\n --letter-spacing-header-3: ", ";\n --line-height-header-3: ", ";\n \n --font-size-header-4: ", ";\n --font-weight-header-4: ", ";\n --letter-spacing-header-4: ", ";\n --line-height-header-4: ", ";\n \n --font-size-header-5: ", ";\n --font-weight-header-5: ", ";\n --letter-spacing-header-5: ", ";\n --line-height-header-5: ", ";\n \n --font-size-header-6: ", ";\n --font-weight-header-6: ", ";\n --letter-spacing-header-6: ", ";\n --line-height-header-6: ", ";\n \n --font-size-altHeader-3: ", ";\n --font-weight-altHeader-3: ", ";\n --letter-spacing-altHeader-3: ", ";\n --line-height-altHeader-3: ", ";\n \n --font-size-altHeader-4: ", ";\n --font-weight-altHeader-4: ", ";\n --letter-spacing-altHeader-4: ", ";\n --line-height-altHeader-4: ", ";\n \n --font-size-altHeader-5: ", ";\n --font-weight-altHeader-5: ", ";\n --letter-spacing-altHeader-5: ", ";\n --line-height-altHeader-5: ", ";\n \n --font-size-altHeader-6: ", ";\n --font-weight-altHeader-6: ", ";\n --letter-spacing-altHeader-6: ", ";\n --line-height-altHeader-6: ", ";\n \n --font-size-overline-1: ", ";\n --font-weight-overline-1: ", ";\n --letter-spacing-overline-1: ", ";\n --line-height-overline-1: ", ";\n \n --font-size-overline-2: ", ";\n --font-weight-overline-2: ", ";\n --letter-spacing-overline-2: ", ";\n --line-height-overline-2: ", ";\n \n --font-size-body-1: ", ";\n --font-weight-body-1: ", ";\n --letter-spacing-body-1: ", ";\n --line-height-body-1: ", ";\n \n --font-size-body-2: ", ";\n --font-weight-body-2: ", ";\n --letter-spacing-body-2: ", ";\n --line-height-body-2: ", ";\n \n --font-size-body-3: ", ";\n --font-weight-body-3: ", ";\n --letter-spacing-body-3: ", ";\n --line-height-body-3: ", ";\n \n --font-size-subtitle-1: ", ";\n --font-weight-subtitle-1: ", ";\n --letter-spacing-subtitle-1: ", ";\n --line-height-subtitle-1: ", ";\n \n --font-size-subtitle-2: ", ";\n --font-weight-subtitle-2: ", ";\n --letter-spacing-subtitle-2: ", ";\n --line-height-subtitle-2: ", ";\n\n --font-size-title-description: ", ";\n --line-height-title-description: ", ";\n --line-height-people-listing-gap: ", ";\n\n --font-size-search: ", ";\n --font-family-search: ", ";\n\n --font-family-header: ", ";\n --font-family-altHeader: ", ";\n --font-family-body: ", ";\n --font-family-body-italics: ", ";\n --font-family-buttons: ", ";\n --font-family-overline: ", ";\n --font-family-subtitle: ", ";\n --font-family-people-listing-role: ", ";\n --font-family-people-listing-name: ", ";\n \n --font-feature-settings-header: ", ";\n --font-feature-settings-altHeader: ", ";\n --font-feature-settings-overline: ", ";\n --font-feature-settings-subtitle: ", ";\n --font-feature-settings-body: ", ";\n --font-feature-settings-navigation: ", ";\n \n --text-transform-header: ", ";\n --text-transform-altHeader: ", ";\n --text-transform-body: ", ";\n --text-transform-overline: ", ";\n --text-transform-subtitle: ", ";\n \n --word-break-header: ", ";\n --word-break-altHeader: ", ";\n --word-break-body: ", ";\n --word-break-overline: ", ";\n --word-break-subtitle: ", ";\n \n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n\n --footer-height: ", ";\n --footer-padding-top: ", ";\n --footer-padding-bottom: ", ";\n --footer-items-gap: ", ";\n --footer-media-gap: ", ";\n --footer-media-icon-width: ", ";\n --footer-media-icon-height: ", ";\n --footer-vertical-spacing-lg: ", ";\n --footer-vertical-spacing-sm: ", ";\n\n --anchor-tabs-height: 60px;\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n }\n\n @media ", " {\n --grid-template-columns: calc(", " - ", ") repeat(12, minmax(0, 1fr)) calc(", " - ", ");\n --grid-column-gap: ", ";\n --grid-margin: ", ";\n --rotator-button-width: ", ";\n --rotator-button-icon-width: ", ";\n\n --font-size-header-6: ", ";\n\n --font-size-altHeader-4: ", ";\n\n --font-size-body-1: ", ";\n }\n\n @media ", " {\n \n }\n\n @media ", " {\n \n }\n }\n"])), function (_ref) {
|
|
9416
9468
|
var theme = _ref.theme;
|
|
9417
9469
|
return theme.colors.primary;
|
|
9418
9470
|
}, function (_ref2) {
|
|
@@ -10409,6 +10461,7 @@ exports.SecondaryLogo = SecondaryLogo;
|
|
|
10409
10461
|
exports.SectionSplitter = SectionSplitter;
|
|
10410
10462
|
exports.SectionTitle = SectionTitle;
|
|
10411
10463
|
exports.Select = Select;
|
|
10464
|
+
exports.Select2 = SelectComponent;
|
|
10412
10465
|
exports.Sponsorship = Sponsorship;
|
|
10413
10466
|
exports.StatusBanner = StatusBanner;
|
|
10414
10467
|
exports.Stepper = Component;
|