@royaloperahouse/harmonic 0.1.2 → 0.1.4
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 +13 -0
- package/dist/components/atoms/Icons/SvgIcons/Access/AudioDescription.svg.d.ts +4 -0
- package/dist/components/atoms/Icons/SvgIcons/Access/BritishSignLanguage.svg.d.ts +4 -0
- package/dist/components/atoms/Icons/SvgIcons/Access/ClosedCaptions.svg.d.ts +4 -0
- package/dist/components/atoms/Icons/SvgIcons/Access/OpenCaptions.svg.d.ts +4 -0
- package/dist/components/atoms/Icons/SvgIcons/Access/RelaxedPerformance.svg.d.ts +4 -0
- package/dist/components/atoms/Icons/SvgIcons/index.d.ts +4 -0
- package/dist/components/atoms/TabLink/index.d.ts +1 -2
- package/dist/components/atoms/index.d.ts +1 -1
- package/dist/components/organisms/Footer/index.d.ts +1 -2
- package/dist/components/organisms/index.d.ts +1 -1
- package/dist/harmonic.cjs.development.js +116 -17
- package/dist/harmonic.cjs.development.js.map +1 -1
- package/dist/harmonic.cjs.production.min.js +1 -1
- package/dist/harmonic.cjs.production.min.js.map +1 -1
- package/dist/harmonic.esm.js +116 -17
- package/dist/harmonic.esm.js.map +1 -1
- package/dist/types/index.d.ts +3 -2
- package/package.json +1 -1
- /package/dist/components/atoms/Icons/SvgIcons/{Video/AudioDescription.svg.d.ts → 12px/Detract.svg.d.ts} +0 -0
package/dist/harmonic.esm.js
CHANGED
|
@@ -1226,14 +1226,14 @@ var Expand12px = (function (_ref) {
|
|
|
1226
1226
|
color = _ref$color === void 0 ? '#1A1A1A' : _ref$color,
|
|
1227
1227
|
ariaLabel = _ref.ariaLabel;
|
|
1228
1228
|
return /*#__PURE__*/createElement("svg", {
|
|
1229
|
-
xmlns: "http://www.w3.org/2000/svg",
|
|
1230
1229
|
width: "12",
|
|
1231
1230
|
height: "12",
|
|
1232
1231
|
viewBox: "0 0 12 12",
|
|
1233
1232
|
fill: "none",
|
|
1234
|
-
"aria-label": ariaLabel
|
|
1233
|
+
"aria-label": ariaLabel,
|
|
1234
|
+
xmlns: "http://www.w3.org/2000/svg"
|
|
1235
1235
|
}, /*#__PURE__*/createElement("path", {
|
|
1236
|
-
d: "
|
|
1236
|
+
d: "M6.44531 6.08203V1.83203H5.94531V6.08203H1.69531V6.58203H5.94531V10.832H6.44531V6.58203H10.6953V6.08203H6.44531Z",
|
|
1237
1237
|
fill: color
|
|
1238
1238
|
}));
|
|
1239
1239
|
});
|
|
@@ -1250,7 +1250,7 @@ var Remove12px = (function (_ref) {
|
|
|
1250
1250
|
fill: "none",
|
|
1251
1251
|
"aria-label": ariaLabel
|
|
1252
1252
|
}, /*#__PURE__*/createElement("g", null, /*#__PURE__*/createElement("path", {
|
|
1253
|
-
d: "
|
|
1253
|
+
d: "M7.75597 6.26964L11.6954 2.33019L10.6348 1.26953L6.69531 5.20898L2.75586 1.26953L1.6952 2.33019L5.63465 6.26964L1.63477 10.2695L2.69543 11.3302L6.69531 7.33031L10.6952 11.3302L11.7559 10.2695L7.75597 6.26964Z",
|
|
1254
1254
|
fill: color
|
|
1255
1255
|
})));
|
|
1256
1256
|
});
|
|
@@ -1267,7 +1267,7 @@ var Tick = (function (_ref) {
|
|
|
1267
1267
|
xmlns: "http://www.w3.org/2000/svg",
|
|
1268
1268
|
"aria-label": ariaLabel
|
|
1269
1269
|
}, /*#__PURE__*/createElement("path", {
|
|
1270
|
-
d: "M4.
|
|
1270
|
+
d: "M4.79541 11.5305L1.79541 7.63047L2.59541 7.03047L4.79541 9.83047L10.7954 1.73047L11.5954 2.33047L4.79541 11.5305Z",
|
|
1271
1271
|
fill: color
|
|
1272
1272
|
}));
|
|
1273
1273
|
});
|
|
@@ -2572,6 +2572,32 @@ var Back10 = (function (_ref) {
|
|
|
2572
2572
|
}));
|
|
2573
2573
|
});
|
|
2574
2574
|
|
|
2575
|
+
var BritishSignLanguage = (function (_ref) {
|
|
2576
|
+
var _ref$color = _ref.color,
|
|
2577
|
+
color = _ref$color === void 0 ? '#1A1A1A' : _ref$color,
|
|
2578
|
+
ariaLabel = _ref.ariaLabel;
|
|
2579
|
+
return /*#__PURE__*/createElement("svg", {
|
|
2580
|
+
width: "100%",
|
|
2581
|
+
height: "100%",
|
|
2582
|
+
viewBox: "0 0 25 25",
|
|
2583
|
+
fill: "none",
|
|
2584
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
2585
|
+
"aria-label": ariaLabel
|
|
2586
|
+
}, /*#__PURE__*/createElement("path", {
|
|
2587
|
+
d: "M21.6953 5.33203V19.332H3.69531V5.33203H21.6953ZM22.6953 4.33203H2.69531V20.332H22.6953V4.33203Z",
|
|
2588
|
+
fill: color
|
|
2589
|
+
}), /*#__PURE__*/createElement("path", {
|
|
2590
|
+
d: "M5.69531 15.156V9.33203H8.37531C9.03931 9.33203 9.56731 9.51603 9.90331 9.84403C10.1673 10.116 10.2953 10.436 10.2953 10.836V10.852C10.2953 11.516 9.93531 11.884 9.51931 12.116C10.1913 12.364 10.6233 12.756 10.6233 13.54V13.556C10.6233 14.62 9.75931 15.156 8.44731 15.156H5.69531ZM9.07131 11.052V11.036C9.07131 10.644 8.75931 10.412 8.19931 10.412H6.88731V11.708H8.11931C8.70331 11.708 9.07131 11.508 9.07131 11.052ZM9.39931 13.396C9.39931 12.98 9.08731 12.732 8.39931 12.732H6.88731V14.076H8.44731C9.03931 14.076 9.39931 13.86 9.39931 13.412V13.396Z",
|
|
2591
|
+
fill: color
|
|
2592
|
+
}), /*#__PURE__*/createElement("path", {
|
|
2593
|
+
d: "M13.1593 15.316C12.2713 15.316 11.3913 15.012 10.6953 14.388L11.4233 13.516C11.9513 13.956 12.5033 14.236 13.1833 14.236C13.7273 14.236 14.0633 14.004 14.0633 13.644V13.628C14.0633 13.284 13.8553 13.108 12.8633 12.86C11.6713 12.564 10.9273 12.228 10.9273 11.084V11.068C10.9273 10.028 11.7753 9.33203 12.9593 9.33203C13.8073 9.33203 14.5193 9.59603 15.1113 10.068L14.4633 10.996C13.9513 10.628 13.4393 10.412 12.9353 10.412C12.4233 10.412 12.1513 10.66 12.1513 10.956V10.972C12.1513 11.372 12.4073 11.508 13.4313 11.772C14.6233 12.076 15.2873 12.508 15.2873 13.508V13.524C15.2873 14.668 14.4073 15.316 13.1593 15.316Z",
|
|
2594
|
+
fill: color
|
|
2595
|
+
}), /*#__PURE__*/createElement("path", {
|
|
2596
|
+
d: "M15.6953 15.156V9.33203H16.9193V14.036H19.8553V15.156H15.6953Z",
|
|
2597
|
+
fill: color
|
|
2598
|
+
}));
|
|
2599
|
+
});
|
|
2600
|
+
|
|
2575
2601
|
var Clips = (function (_ref) {
|
|
2576
2602
|
var _ref$color = _ref.color,
|
|
2577
2603
|
color = _ref$color === void 0 ? '#1A1A1A' : _ref$color,
|
|
@@ -2595,6 +2621,52 @@ var Clips = (function (_ref) {
|
|
|
2595
2621
|
}));
|
|
2596
2622
|
});
|
|
2597
2623
|
|
|
2624
|
+
var ClosedCaptions = (function (_ref) {
|
|
2625
|
+
var _ref$color = _ref.color,
|
|
2626
|
+
color = _ref$color === void 0 ? '#1A1A1A' : _ref$color,
|
|
2627
|
+
ariaLabel = _ref.ariaLabel;
|
|
2628
|
+
return /*#__PURE__*/createElement("svg", {
|
|
2629
|
+
width: "100%",
|
|
2630
|
+
height: "100%",
|
|
2631
|
+
viewBox: "0 0 25 25",
|
|
2632
|
+
fill: "none",
|
|
2633
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
2634
|
+
"aria-label": ariaLabel
|
|
2635
|
+
}, /*#__PURE__*/createElement("path", {
|
|
2636
|
+
d: "M21.6953 5.33203V19.332H3.69531V5.33203H21.6953ZM22.6953 4.33203H2.69531V20.332H22.6953V4.33203Z",
|
|
2637
|
+
fill: color
|
|
2638
|
+
}), /*#__PURE__*/createElement("path", {
|
|
2639
|
+
d: "M15.6793 15.348C13.9673 15.348 12.6953 14.028 12.6953 12.356V12.34C12.6953 10.684 13.9433 9.33203 15.7273 9.33203C16.8233 9.33203 17.4793 9.69203 18.0233 10.228L17.2393 11.132C16.7833 10.716 16.3193 10.46 15.7193 10.46C14.7113 10.46 13.9833 11.3 13.9833 12.324V12.34C13.9833 13.364 14.6953 14.22 15.7193 14.22C16.3993 14.22 16.8153 13.948 17.2793 13.524L18.0633 14.316C17.4633 14.948 16.7993 15.348 15.6793 15.348Z",
|
|
2640
|
+
fill: color
|
|
2641
|
+
}), /*#__PURE__*/createElement("path", {
|
|
2642
|
+
d: "M9.67931 15.348C7.96731 15.348 6.69531 14.028 6.69531 12.356V12.34C6.69531 10.684 7.94331 9.33203 9.72731 9.33203C10.8233 9.33203 11.4793 9.69203 12.0233 10.228L11.2393 11.132C10.7833 10.716 10.3193 10.46 9.71931 10.46C8.71131 10.46 7.98331 11.3 7.98331 12.324V12.34C7.98331 13.364 8.69531 14.22 9.71931 14.22C10.3993 14.22 10.8153 13.948 11.2793 13.524L12.0633 14.316C11.4633 14.948 10.7993 15.348 9.67931 15.348Z",
|
|
2643
|
+
fill: color
|
|
2644
|
+
}));
|
|
2645
|
+
});
|
|
2646
|
+
|
|
2647
|
+
var OpenCaptions = (function (_ref) {
|
|
2648
|
+
var _ref$color = _ref.color,
|
|
2649
|
+
color = _ref$color === void 0 ? '#1A1A1A' : _ref$color,
|
|
2650
|
+
ariaLabel = _ref.ariaLabel;
|
|
2651
|
+
return /*#__PURE__*/createElement("svg", {
|
|
2652
|
+
width: "100%",
|
|
2653
|
+
height: "100%",
|
|
2654
|
+
viewBox: "0 0 25 25",
|
|
2655
|
+
fill: "none",
|
|
2656
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
2657
|
+
"aria-label": ariaLabel
|
|
2658
|
+
}, /*#__PURE__*/createElement("path", {
|
|
2659
|
+
d: "M21.6953 5.33203V19.332H3.69531V5.33203H21.6953ZM22.6953 4.33203H2.69531V20.332H22.6953V4.33203Z",
|
|
2660
|
+
fill: color
|
|
2661
|
+
}), /*#__PURE__*/createElement("path", {
|
|
2662
|
+
d: "M16.6793 15.348C14.9673 15.348 13.6953 14.028 13.6953 12.356V12.34C13.6953 10.684 14.9433 9.33203 16.7273 9.33203C17.8233 9.33203 18.4793 9.69203 19.0233 10.228L18.2393 11.132C17.7833 10.716 17.3193 10.46 16.7193 10.46C15.7113 10.46 14.9833 11.3 14.9833 12.324V12.34C14.9833 13.364 15.6953 14.22 16.7193 14.22C17.3993 14.22 17.8153 13.948 18.2793 13.524L19.0633 14.316C18.4633 14.948 17.7993 15.348 16.6793 15.348Z",
|
|
2663
|
+
fill: color
|
|
2664
|
+
}), /*#__PURE__*/createElement("path", {
|
|
2665
|
+
d: "M9.77531 15.348C7.98331 15.348 6.69531 14.012 6.69531 12.356V12.34C6.69531 10.692 7.99931 9.33203 9.79131 9.33203C11.5833 9.33203 12.8713 10.668 12.8713 12.324V12.34C12.8713 13.988 11.5673 15.348 9.77531 15.348ZM9.79131 14.22C10.8473 14.22 11.5833 13.38 11.5833 12.356V12.34C11.5833 11.316 10.8313 10.46 9.77531 10.46C8.71931 10.46 7.98331 11.3 7.98331 12.324V12.34C7.98331 13.364 8.73531 14.22 9.79131 14.22Z",
|
|
2666
|
+
fill: color
|
|
2667
|
+
}));
|
|
2668
|
+
});
|
|
2669
|
+
|
|
2598
2670
|
var Forward10 = (function (_ref) {
|
|
2599
2671
|
var _ref$color = _ref.color,
|
|
2600
2672
|
color = _ref$color === void 0 ? '#1A1A1A' : _ref$color,
|
|
@@ -2730,6 +2802,29 @@ var Play = (function (_ref) {
|
|
|
2730
2802
|
}));
|
|
2731
2803
|
});
|
|
2732
2804
|
|
|
2805
|
+
var RelaxedPerformance = (function (_ref) {
|
|
2806
|
+
var _ref$color = _ref.color,
|
|
2807
|
+
color = _ref$color === void 0 ? '#1A1A1A' : _ref$color,
|
|
2808
|
+
ariaLabel = _ref.ariaLabel;
|
|
2809
|
+
return /*#__PURE__*/createElement("svg", {
|
|
2810
|
+
width: "100%",
|
|
2811
|
+
height: "100%",
|
|
2812
|
+
viewBox: "0 0 25 25",
|
|
2813
|
+
fill: "none",
|
|
2814
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
2815
|
+
"aria-label": ariaLabel
|
|
2816
|
+
}, /*#__PURE__*/createElement("path", {
|
|
2817
|
+
d: "M21.6953 5.33203V19.332H3.69531V5.33203H21.6953ZM22.6953 4.33203H2.69531V20.332H22.6953V4.33203Z",
|
|
2818
|
+
fill: color
|
|
2819
|
+
}), /*#__PURE__*/createElement("path", {
|
|
2820
|
+
d: "M7.69531 15.156V9.33203H10.3433C11.0793 9.33203 11.6553 9.54003 12.0393 9.92403C12.3593 10.244 12.5273 10.7 12.5273 11.236V11.252C12.5273 12.196 12.0073 12.788 11.2553 13.052L12.7113 15.156H11.2713L9.98331 13.26H8.91931V15.156H7.69531ZM8.91931 12.172H10.2633C10.9033 12.172 11.2873 11.828 11.2873 11.316V11.3C11.2873 10.74 10.8873 10.444 10.2393 10.444H8.91931V12.172Z",
|
|
2821
|
+
fill: color
|
|
2822
|
+
}), /*#__PURE__*/createElement("path", {
|
|
2823
|
+
d: "M13.6953 15.156V9.33203H16.0553C17.4393 9.33203 18.2793 10.148 18.2793 11.332V11.348C18.2793 12.692 17.2313 13.38 15.9353 13.38H14.9193V15.156H13.6953ZM14.9193 12.284H15.9753C16.6393 12.284 17.0393 11.892 17.0393 11.372V11.356C17.0393 10.764 16.6153 10.444 15.9513 10.444H14.9193V12.284Z",
|
|
2824
|
+
fill: color
|
|
2825
|
+
}));
|
|
2826
|
+
});
|
|
2827
|
+
|
|
2733
2828
|
var Restart = (function (_ref) {
|
|
2734
2829
|
var _ref$color = _ref.color,
|
|
2735
2830
|
color = _ref$color === void 0 ? '#1A1A1A' : _ref$color,
|
|
@@ -2834,6 +2929,7 @@ var IconLibrary = {
|
|
|
2834
2929
|
BalletAndDance: BalletAndDance,
|
|
2835
2930
|
Basket: Basket,
|
|
2836
2931
|
BasketFull: BasketFull,
|
|
2932
|
+
BritishSignLanguage: BritishSignLanguage,
|
|
2837
2933
|
BookTickets: BookTickets,
|
|
2838
2934
|
CarouselArrow: CarouselArrow,
|
|
2839
2935
|
ChooseDates: ChooseDates,
|
|
@@ -2841,6 +2937,7 @@ var IconLibrary = {
|
|
|
2841
2937
|
Clips: Clips,
|
|
2842
2938
|
Clock: Clock,
|
|
2843
2939
|
Close: Close,
|
|
2940
|
+
ClosedCaptions: ClosedCaptions,
|
|
2844
2941
|
Confirm: Confirm,
|
|
2845
2942
|
CreditCard: CreditCard,
|
|
2846
2943
|
Delete: Delete,
|
|
@@ -2870,6 +2967,7 @@ var IconLibrary = {
|
|
|
2870
2967
|
Minimise: Minimise,
|
|
2871
2968
|
Muted: Muted,
|
|
2872
2969
|
OnMyList: OnMyList,
|
|
2970
|
+
OpenCaptions: OpenCaptions,
|
|
2873
2971
|
OperaAndMusic: OperaAndMusic,
|
|
2874
2972
|
Pause: Pause,
|
|
2875
2973
|
PDF: PDF,
|
|
@@ -2877,6 +2975,7 @@ var IconLibrary = {
|
|
|
2877
2975
|
Play: Play,
|
|
2878
2976
|
Print: Print,
|
|
2879
2977
|
Refresh: Refresh,
|
|
2978
|
+
RelaxedPerformance: RelaxedPerformance,
|
|
2880
2979
|
Reminder: Reminder,
|
|
2881
2980
|
Remove: Remove,
|
|
2882
2981
|
Remove12px: Remove12px,
|
|
@@ -7057,15 +7156,10 @@ var largeColumnSpan = 9;
|
|
|
7057
7156
|
var mediumWordBreakpoint = 8;
|
|
7058
7157
|
var longWordBreakpoint = 13;
|
|
7059
7158
|
var getColumnSpan = function getColumnSpan(variant, textSize, longestWordLength) {
|
|
7060
|
-
if (
|
|
7061
|
-
|
|
7062
|
-
|
|
7063
|
-
|
|
7064
|
-
case longestWordLength < mediumWordBreakpoint:
|
|
7065
|
-
return smallColumnSpan;
|
|
7066
|
-
default:
|
|
7067
|
-
return defaultColumnSpan;
|
|
7068
|
-
}
|
|
7159
|
+
if (variant !== IInformationTitleVariant.Header || textSize !== 4) return defaultColumnSpan;
|
|
7160
|
+
if (longestWordLength > longWordBreakpoint) return largeColumnSpan;
|
|
7161
|
+
if (longestWordLength < mediumWordBreakpoint) return smallColumnSpan;
|
|
7162
|
+
return defaultColumnSpan;
|
|
7069
7163
|
};
|
|
7070
7164
|
var renderTitle = function renderTitle(props) {
|
|
7071
7165
|
var headerLevel = props.variant === IInformationTitleVariant.Header && props.textSize < 4 ? 4 : props.textSize;
|
|
@@ -7080,12 +7174,17 @@ var Information = function Information(_ref) {
|
|
|
7080
7174
|
title = _ref.title,
|
|
7081
7175
|
background = _ref.background,
|
|
7082
7176
|
cta = _ref.cta;
|
|
7083
|
-
var
|
|
7177
|
+
var safeTitle = title || {
|
|
7178
|
+
text: '',
|
|
7179
|
+
variant: IInformationTitleVariant.Header,
|
|
7180
|
+
textSize: 5
|
|
7181
|
+
}; // Provide a fallback
|
|
7182
|
+
var titleWords = safeTitle.text.split(' ');
|
|
7084
7183
|
var titleWordLengths = titleWords.map(function (word) {
|
|
7085
7184
|
return word.length;
|
|
7086
7185
|
});
|
|
7087
7186
|
var maxTitleWordLength = Math.max.apply(Math, titleWordLengths);
|
|
7088
|
-
var titleColumnSpan = getColumnSpan(
|
|
7187
|
+
var titleColumnSpan = getColumnSpan(safeTitle.variant, safeTitle.textSize, maxTitleWordLength);
|
|
7089
7188
|
var bgColour = background != null ? background : IInformationBackgroundColour.White;
|
|
7090
7189
|
return /*#__PURE__*/React__default.createElement(InfoWrapper, {
|
|
7091
7190
|
background: bgColour,
|
|
@@ -7095,7 +7194,7 @@ var Information = function Information(_ref) {
|
|
|
7095
7194
|
columnStartDevice: 2,
|
|
7096
7195
|
columnSpanDesktop: titleColumnSpan,
|
|
7097
7196
|
columnSpanDevice: 12
|
|
7098
|
-
}, /*#__PURE__*/React__default.createElement(InfoTitle, null, renderTitle(
|
|
7197
|
+
}, /*#__PURE__*/React__default.createElement(InfoTitle, null, renderTitle(safeTitle))), /*#__PURE__*/React__default.createElement(GridItem, {
|
|
7099
7198
|
columnStartDesktop: titleColumnSpan + 2,
|
|
7100
7199
|
columnStartDevice: 2,
|
|
7101
7200
|
columnSpanDesktop: 14 - titleColumnSpan,
|