@royaloperahouse/harmonic 0.9.3-d → 0.9.3-f

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.
@@ -1,4 +1,8 @@
1
- export declare const AnchorBarContainer: import("styled-components").StyledComponent<"div", any, {}, never>;
1
+ interface AnchorBarContainerProps {
2
+ withShadow?: boolean;
3
+ }
4
+ export declare const AnchorBarContainer: import("styled-components").StyledComponent<"div", any, AnchorBarContainerProps, never>;
2
5
  export declare const CTAWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
3
6
  export declare const CloseButtonWrapper: import("styled-components").StyledComponent<"a", any, {}, never>;
4
7
  export declare const ContentWrapper: import("styled-components").StyledComponent<"a", any, {}, never>;
8
+ export {};
@@ -4,6 +4,6 @@ export declare const MorePages: import("styled-components").StyledComponent<"spa
4
4
  export declare const PageNumberWrapper: import("styled-components").StyledComponent<"ol", any, {}, never>;
5
5
  export declare const LastPageItem: import("styled-components").StyledComponent<"li", any, {}, never>;
6
6
  export declare const PreviousPageItem: import("styled-components").StyledComponent<"li", any, {}, never>;
7
- export declare const TextLinkPagination: import("styled-components").StyledComponent<({ children, size, color, className, bold, ...props }: import("../../../types/typography").IGenericTypographyProps<HTMLParagraphElement>) => import("react").JSX.Element, any, {
7
+ export declare const TextLinkPagination: import("styled-components").StyledComponent<({ children, size, color, className, bold, tag: Tag, ...props }: import("../../../types/typography").IBodyCopyHarmonicProps) => import("react").JSX.Element, any, {
8
8
  active?: boolean | undefined;
9
9
  }, never>;
@@ -707,6 +707,9 @@
707
707
  --color-secondary-orange: #ff6700;
708
708
  --color-secondary-blue: #5f9cff;
709
709
 
710
+ /* Shadows */
711
+ --shadow-floating: 0px 4px 38px 0px #0000000a;
712
+
710
713
  /* Core theme colors */
711
714
  --base-color-primary: #c8102e;
712
715
  --base-color-core: #c8102e;
@@ -9571,10 +9571,10 @@ var PageHeadingCompact = function PageHeadingCompact(_ref4) {
9571
9571
  };
9572
9572
 
9573
9573
  var _templateObject$14, _templateObject2$R, _templateObject3$E, _templateObject5$r, _templateObject6$m, _templateObject7$g, _templateObject8$c;
9574
- var linkButtonStyles = /*#__PURE__*/styled.css(_templateObject$14 || (_templateObject$14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n align-items: center;\n justify-content: center;\n margin-left: 0;\n background: none;\n border: none;\n color: inherit;\n text-decoration: none;\n cursor: pointer;\n font: inherit;\n padding: 0;\n\n span {\n height: 1.5em;\n svg > path {\n fill: var(--color-base-black);\n }\n }\n\n &:hover,\n &:focus {\n outline: none;\n }\n"])));
9574
+ var linkButtonStyles = /*#__PURE__*/styled.css(_templateObject$14 || (_templateObject$14 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: inline-flex;\n align-items: center;\n justify-content: center;\n margin-left: 0;\n background: none;\n border: none;\n color: inherit;\n text-decoration: none;\n cursor: pointer;\n font: inherit;\n padding: 0;\n\n span {\n height: 1.5em;\n width: 1.5em;\n\n svg > path {\n fill: var(--color-base-black);\n }\n }\n\n &:hover {\n outline: none;\n }\n"])));
9575
9575
  var PageNav = /*#__PURE__*/styled__default.a(_templateObject2$R || (_templateObject2$R = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), linkButtonStyles);
9576
9576
  var PaginationLink = /*#__PURE__*/styled__default.a(_templateObject3$E || (_templateObject3$E = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n ", "\n"])), linkButtonStyles);
9577
- var PageNumberWrapper = /*#__PURE__*/styled__default.ol(_templateObject5$r || (_templateObject5$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n min-width: fit-content;\n align-items: center;\n justify-content: center;\n margin-top: 40px;\n margin-bottom: 40px;\n flex-wrap: nowrap;\n flex-direction: row;\n list-style: none;\n padding: 0;\n max-width: fit-content;\n margin: auto;\n li {\n margin-left: 24px;\n color: var(--color-base-black);\n display: flex;\n align-items: center;\n }\n li:first-child {\n margin-left: 0px;\n }\n"])));
9577
+ var PageNumberWrapper = /*#__PURE__*/styled__default.ol(_templateObject5$r || (_templateObject5$r = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n min-width: fit-content;\n align-items: center;\n justify-content: center;\n flex-wrap: nowrap;\n flex-direction: row;\n list-style: none;\n padding: 0;\n max-width: fit-content;\n margin: 0 auto;\n\n li {\n margin-left: 24px;\n color: var(--color-base-black);\n display: flex;\n justify-content: flex-start;\n align-items: center;\n }\n\n li:first-child {\n margin-left: 0px;\n }\n"])));
9578
9578
  var LastPageItem = /*#__PURE__*/styled__default.li(_templateObject6$m || (_templateObject6$m = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-left: 12px;\n }\n"])));
9579
9579
  var PreviousPageItem = /*#__PURE__*/styled__default.li(_templateObject7$g || (_templateObject7$g = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n margin-left: 12px;\n }\n"])));
9580
9580
  var TextLinkPagination = /*#__PURE__*/styled__default(BodyCopyHarmonic)(_templateObject8$c || (_templateObject8$c = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n && {\n color: ", ";\n border-bottom: ", ";\n }\n\n :hover {\n cursor: pointer;\n color: var(--color-primary-red);\n border-bottom: 1px solid var(--color-primary-red);\n svg > path {\n fill: var(--color-base-black);\n }\n }\n"])), function (_ref) {
@@ -12216,10 +12216,13 @@ var SignUpFormComponent = function SignUpFormComponent(_ref) {
12216
12216
  }))))));
12217
12217
  };
12218
12218
 
12219
- var _templateObject$1o, _templateObject3$U, _templateObject4$J;
12220
- var AnchorBarContainer = /*#__PURE__*/styled__default(Grid)(_templateObject$1o || (_templateObject$1o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: sticky;\n top: 0;\n min-height: 70px;\n background: var(--color-base-white);\n z-index: ", ";\n align-content: center;\n\n @media ", " {\n min-height: 60px;\n }\n"])), zIndexes.anchor, devices.mobile);
12221
- var CloseButtonWrapper = /*#__PURE__*/styled__default.a(_templateObject3$U || (_templateObject3$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-decoration: none;\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 24px;\n min-width: 24px;\n max-height: 24px;\n max-width: 24px;\n border: none;\n padding: 0;\n background: none;\n\n :hover {\n cursor: pointer;\n }\n\n @media ", " {\n min-height: 12px;\n min-width: 12px;\n max-height: 12px;\n max-width: 12px;\n }\n"])), devices.mobile);
12222
- var ContentWrapper$3 = /*#__PURE__*/styled__default.a(_templateObject4$J || (_templateObject4$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n"])));
12219
+ var _templateObject$1o, _templateObject2$16, _templateObject4$J, _templateObject5$C;
12220
+ var AnchorBarContainer = /*#__PURE__*/styled__default(Grid)(_templateObject$1o || (_templateObject$1o = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n position: sticky;\n top: 0;\n min-height: 70px;\n background: var(--color-base-white);\n z-index: ", ";\n align-content: center;\n border-bottom: 1px solid var(--color-base-light-grey);\n\n ", "\n\n @media ", " {\n min-height: 60px;\n }\n"])), zIndexes.anchor, function (_ref) {
12221
+ var withShadow = _ref.withShadow;
12222
+ return withShadow && styled.css(_templateObject2$16 || (_templateObject2$16 = _taggedTemplateLiteralLoose(["\n box-shadow: var(--shadow-floating);\n "])));
12223
+ }, devices.mobile);
12224
+ var CloseButtonWrapper = /*#__PURE__*/styled__default.a(_templateObject4$J || (_templateObject4$J = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n text-decoration: none;\n display: flex;\n align-items: center;\n justify-content: center;\n min-height: 24px;\n min-width: 24px;\n max-height: 24px;\n max-width: 24px;\n border: none;\n padding: 0;\n background: none;\n\n :hover {\n cursor: pointer;\n }\n\n @media ", " {\n min-height: 12px;\n min-width: 12px;\n max-height: 12px;\n max-width: 12px;\n }\n"])), devices.mobile);
12225
+ var ContentWrapper$3 = /*#__PURE__*/styled__default.a(_templateObject5$C || (_templateObject5$C = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n align-items: center;\n justify-content: space-between;\n"])));
12223
12226
 
12224
12227
  var AnchorBar = function AnchorBar(_ref) {
12225
12228
  var cta = _ref.cta,
@@ -12227,7 +12230,9 @@ var AnchorBar = function AnchorBar(_ref) {
12227
12230
  onCloseHandler = _ref.onCloseHandler,
12228
12231
  _ref$showAnchorBar = _ref.showAnchorBar,
12229
12232
  showAnchorBar = _ref$showAnchorBar === void 0 ? true : _ref$showAnchorBar,
12230
- className = _ref.className;
12233
+ className = _ref.className,
12234
+ _ref$withShadow = _ref.withShadow,
12235
+ withShadow = _ref$withShadow === void 0 ? false : _ref$withShadow;
12231
12236
  var _useState = React.useState(showAnchorBar),
12232
12237
  isRendered = _useState[0],
12233
12238
  setIsRendered = _useState[1];
@@ -12249,7 +12254,8 @@ var AnchorBar = function AnchorBar(_ref) {
12249
12254
  var _cta$href;
12250
12255
  return /*#__PURE__*/React__default.createElement(AnchorBarContainer, {
12251
12256
  "data-testid": "anchor-bar",
12252
- className: className
12257
+ className: className,
12258
+ withShadow: withShadow
12253
12259
  }, /*#__PURE__*/React__default.createElement(GridItem, {
12254
12260
  columnStartDesktop: 2,
12255
12261
  columnSpanDesktop: 14,
@@ -12531,9 +12537,9 @@ var HighlightsStream = function HighlightsStream(_ref) {
12531
12537
  })));
12532
12538
  };
12533
12539
 
12534
- var _templateObject$1p, _templateObject3$V;
12540
+ var _templateObject$1p, _templateObject3$U;
12535
12541
  var CarouselWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject$1p || (_templateObject$1p = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n user-select: none;\n display: flex;\n\n .swipe-slide {\n width: 100%;\n }\n"])));
12536
- var ButtonsWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$V || (_templateObject3$V = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: center;\n flex-direction: column;\n margin-left: 6px;\n"])));
12542
+ var ButtonsWrapper$1 = /*#__PURE__*/styled__default.div(_templateObject3$U || (_templateObject3$U = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n display: flex;\n justify-content: center;\n flex-direction: column;\n margin-left: 6px;\n"])));
12537
12543
 
12538
12544
  var MinimalCarousel = function MinimalCarousel(_ref) {
12539
12545
  var children = _ref.children;