@cruk/cruk-react-components 1.2.4 → 1.3.0

package/lib/cjs/src/components/Header/styles.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var n=require("../../../node_modules/tslib/tslib.es6.js"),e=require("styled-components"),t=require("../../themes/cruk.js");function i(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var o,a,r,d,h,l,u,s,c,p,m,f=i(e),g="120px",x="72px",b=t.default.spacing.s,y="40px",w="0.2s",k=f.default.header(o||(o=n.__makeTemplateObject(["\n  box-sizing: border-box;\n  position: relative;\n  width: 100%;\n  background-color: ",";\n  z-index: 9998;\n"],["\n  box-sizing: border-box;\n  position: relative;\n  width: 100%;\n  background-color: ",";\n  z-index: 9998;\n"])),(function(n){return n.theme.colors.headerBackground})),v=f.default.div(a||(a=n.__makeTemplateObject(["\n  position: relative;\n  box-sizing: border-box;\n  width: 100%;\n  height: ",";\n\n  @media (min-width: ",") {\n    height: ",";\n  }\n"],["\n  position: relative;\n  box-sizing: border-box;\n  width: 100%;\n  height: ",";\n\n  @media (min-width: ",") {\n    height: ",";\n  }\n"])),x,(function(n){return n.theme.breakpoint.desktop}),g),_=f.default.div(r||(r=n.__makeTemplateObject(["\n  width: 100%;\n  height: 100%;\n  padding: 0 ",";\n  background-color: ",";\n  position: relative;\n  border-bottom: ",";\n  height: ",";\n\n  top: ",";\n  position: ",";\n  transition: height "," ease;\n\n  @media (min-width: ",") {\n    position: ",";\n    height: ",";\n  }\n"],["\n  width: 100%;\n  height: 100%;\n  padding: 0 ",";\n  background-color: ",";\n  position: relative;\n  border-bottom: ",";\n  height: ",";\n\n  top: ",";\n  position: ",";\n  transition: height "," ease;\n\n  @media (min-width: ",") {\n    position: ",";\n    height: ",";\n  }\n"])),b,(function(n){return n.theme.colors.headerBackground}),(function(n){var e=n.theme.colors.headerBorder;return"solid 1px ".concat(e)}),x,(function(n){return n.isSticky?0:"auto"}),(function(n){return n.isSticky?"fixed":"relative"}),w,(function(n){return n.theme.breakpoint.desktop}),(function(n){return n.isSticky?"fixed":"relative"}),(function(n){var e=n.isSmall,t=n.isSticky;return e&&t?x:g})),j=f.default.div(d||(d=n.__makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n  height: 100%;\n  margin: 0 auto;\n  max-width: ",";\n"],["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n  height: 100%;\n  margin: 0 auto;\n  max-width: ",";\n"])),(function(n){var e=n.fullWidth,t=n.theme.utilities.contentMaxWidth;return e?"100%":t})),z=f.default.img(h||(h=n.__makeTemplateObject(["\n  height: 100%;\n  width: auto;\n  max-width: 100%;\n  max-height: 100%;\n"],["\n  height: 100%;\n  width: auto;\n  max-width: 100%;\n  max-height: 100%;\n"]))),S=f.default.div(l||(l=n.__makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  justify-content: space-around;\n  width: auto;\n  transition: height "," ease;\n\n  height: ",";\n\n  @media (min-width: ",") {\n    height: ",";\n  }\n"],["\n  display: flex;\n  flex-direction: column;\n  justify-content: space-around;\n  width: auto;\n  transition: height "," ease;\n\n  height: ",";\n\n  @media (min-width: ",") {\n    height: ",";\n  }\n"])),w,y,(function(n){return n.theme.breakpoint.desktop}),(function(n){var e=n.isSmall,t=n.isSticky;return e&&t?y:"80px"})),T=f.default.a(u||(u=n.__makeTemplateObject(["\n  display: inline-block;\n"],["\n  display: inline-block;\n"]))),O=f.default.a(s||(s=n.__makeTemplateObject(["\n  left: -999px;\n  position: absolute;\n  top: auto;\n  width: 1px;\n  height: 1px;\n  overflow: hidden;\n  z-index: -999;\n  &:focus,\n  &:active,\n  &:focus-within {\n    left: auto;\n    top: auto;\n    width: 30%;\n    height: auto;\n    overflow: auto;\n    margin: 10px 35%;\n    padding: ",";\n    border-radius: 15px;\n    border: 4px solid yellow;\n    text-align: center;\n    font-size: 1.2em;\n    z-index: 999;\n  }\n"],["\n  left: -999px;\n  position: absolute;\n  top: auto;\n  width: 1px;\n  height: 1px;\n  overflow: hidden;\n  z-index: -999;\n  &:focus,\n  &:active,\n  &:focus-within {\n    left: auto;\n    top: auto;\n    width: 30%;\n    height: auto;\n    overflow: auto;\n    margin: 10px 35%;\n    padding: ",";\n    border-radius: 15px;\n    border: 4px solid yellow;\n    text-align: center;\n    font-size: 1.2em;\n    z-index: 999;\n  }\n"])),(function(n){return n.theme.spacing.xs})),H=f.default.p(c||(c=n.__makeTemplateObject(["\n  flex: 1 1 auto;\n  font-family: ",";\n  font-weight: ",";\n  font-size: ",";\n  color: ",";\n  text-align: center;\n  opacity: 0;\n\n  transition: opacity "," ease;\n\n  @media (min-width: ",") {\n    opacity: ",";\n  }\n"],["\n  flex: 1 1 auto;\n  font-family: ",";\n  font-weight: ",";\n  font-size: ",";\n  color: ",";\n  text-align: center;\n  opacity: 0;\n\n  transition: opacity "," ease;\n\n  @media (min-width: ",") {\n    opacity: ",";\n  }\n"])),(function(n){return n.theme.typography.fontFamilyHeadings}),(function(n){return n.theme.typography.fontWeightLight}),(function(n){return n.theme.fontSizes.xl}),(function(n){return n.theme.colors.primary}),w,(function(n){return n.theme.breakpoint.desktop}),(function(n){var e=n.isSmall,t=n.isSticky;return e&&t?0:1})),W=f.default.div(p||(p=n.__makeTemplateObject(["\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-around;\n"],["\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-around;\n"]))),C=f.default.div(m||(m=n.__makeTemplateObject(["\n  height: auto;\n  margin: auto 0;\n"],["\n  height: auto;\n  margin: auto 0;\n"])));exports.ChildInner=C,exports.ChildWrapper=W,exports.HeaderMainContent=j,exports.HeaderStickyContainer=_,exports.HeaderStickyPlaceHolder=v,exports.Logo=z,exports.LogoWrapper=S,exports.SkipToMain=O,exports.StyledHeader=k,exports.StyledLink=T,exports.Tagline=H;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var n=require("../../../node_modules/tslib/tslib.es6.js"),e=require("styled-components"),t=require("../../themes/cruk.js");function i(n){return n&&"object"==typeof n&&"default"in n?n:{default:n}}var o,a,r,d,l,h,s,u,p,c,m,f=i(e),g="120px",x="72px",b=t.default.spacing.s,y="40px",k="0.2s",w=f.default.header(o||(o=n.__makeTemplateObject(["\n  box-sizing: border-box;\n  position: relative;\n  width: 100%;\n  background-color: ",";\n  z-index: 9998;\n"],["\n  box-sizing: border-box;\n  position: relative;\n  width: 100%;\n  background-color: ",";\n  z-index: 9998;\n"])),(function(n){return n.theme.colors.headerBackground})),v=f.default.div(a||(a=n.__makeTemplateObject(["\n  position: relative;\n  box-sizing: border-box;\n  width: 100%;\n  height: ",";\n\n  @media (min-width: ",") {\n    height: ",";\n  }\n"],["\n  position: relative;\n  box-sizing: border-box;\n  width: 100%;\n  height: ",";\n\n  @media (min-width: ",") {\n    height: ",";\n  }\n"])),x,(function(n){return n.theme.breakpoint.desktop}),g),_=f.default.div(r||(r=n.__makeTemplateObject(["\n  width: 100%;\n  height: 100%;\n  padding: 0 ",";\n  background-color: ",";\n  position: relative;\n  border-bottom: ",";\n  height: ",";\n\n  top: ",";\n  position: ",";\n  transition: height "," ease;\n\n  @media (min-width: ",") {\n    position: ",";\n    height: ",";\n  }\n"],["\n  width: 100%;\n  height: 100%;\n  padding: 0 ",";\n  background-color: ",";\n  position: relative;\n  border-bottom: ",";\n  height: ",";\n\n  top: ",";\n  position: ",";\n  transition: height "," ease;\n\n  @media (min-width: ",") {\n    position: ",";\n    height: ",";\n  }\n"])),b,(function(n){return n.theme.colors.headerBackground}),(function(n){var e=n.theme.colors.headerBorder;return"solid 1px ".concat(e)}),x,(function(n){return n.isSticky?0:"auto"}),(function(n){return n.isSticky?"fixed":"relative"}),k,(function(n){return n.theme.breakpoint.desktop}),(function(n){return n.isSticky?"fixed":"relative"}),(function(n){var e=n.isSmall,t=n.isSticky;return e&&t?x:g})),j=f.default.div(d||(d=n.__makeTemplateObject(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n  height: 100%;\n  margin: 0 auto;\n  max-width: ",";\n"],["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n  height: 100%;\n  margin: 0 auto;\n  max-width: ",";\n"])),(function(n){var e=n.fullWidth,t=n.theme.utilities.contentMaxWidth;return e?"100%":t})),z=f.default.img(l||(l=n.__makeTemplateObject(["\n  height: 100%;\n  width: auto;\n  max-width: 100%;\n  max-height: 100%;\n"],["\n  height: 100%;\n  width: auto;\n  max-width: 100%;\n  max-height: 100%;\n"]))),S=f.default.div(h||(h=n.__makeTemplateObject(["\n  display: flex;\n  flex-direction: column;\n  justify-content: space-around;\n  width: auto;\n  transition: height "," ease;\n\n  height: ",";\n\n  @media (min-width: ",") {\n    height: ",";\n  }\n"],["\n  display: flex;\n  flex-direction: column;\n  justify-content: space-around;\n  width: auto;\n  transition: height "," ease;\n\n  height: ",";\n\n  @media (min-width: ",") {\n    height: ",";\n  }\n"])),k,y,(function(n){return n.theme.breakpoint.desktop}),(function(n){var e=n.isSmall,t=n.isSticky;return e&&t?y:"80px"})),T=f.default.a(s||(s=n.__makeTemplateObject(["\n  display: inline-block;\n"],["\n  display: inline-block;\n"]))),O=f.default.a(u||(u=n.__makeTemplateObject(["\n  left: -999px;\n  position: absolute;\n  top: auto;\n  width: 1px;\n  height: 1px;\n  overflow: hidden;\n  z-index: -999;\n  &:focus,\n  &:active,\n  &:focus-within {\n    left: auto;\n    top: auto;\n    width: 30%;\n    height: auto;\n    overflow: auto;\n    margin: 10px 35%;\n    padding: ",";\n    border-radius: 15px;\n    border: 4px solid yellow;\n    text-align: center;\n    font-size: 1.2em;\n    z-index: 999;\n  }\n"],["\n  left: -999px;\n  position: absolute;\n  top: auto;\n  width: 1px;\n  height: 1px;\n  overflow: hidden;\n  z-index: -999;\n  &:focus,\n  &:active,\n  &:focus-within {\n    left: auto;\n    top: auto;\n    width: 30%;\n    height: auto;\n    overflow: auto;\n    margin: 10px 35%;\n    padding: ",";\n    border-radius: 15px;\n    border: 4px solid yellow;\n    text-align: center;\n    font-size: 1.2em;\n    z-index: 999;\n  }\n"])),(function(n){return n.theme.spacing.xs})),H=f.default.p(p||(p=n.__makeTemplateObject(["\n  flex: 1 1 auto;\n  font-family: ",";\n  font-weight: ",";\n  font-size: ",";\n  color: ",";\n  text-align: center;\n  opacity: 0;\n  transition: opacity "," ease;\n  display: none;\n\n  @media (min-width: ",") {\n    display: block;\n    opacity: ",";\n  }\n"],["\n  flex: 1 1 auto;\n  font-family: ",";\n  font-weight: ",";\n  font-size: ",";\n  color: ",";\n  text-align: center;\n  opacity: 0;\n  transition: opacity "," ease;\n  display: none;\n\n  @media (min-width: ",") {\n    display: block;\n    opacity: ",";\n  }\n"])),(function(n){return n.theme.typography.fontFamilyHeadings}),(function(n){return n.theme.typography.fontWeightLight}),(function(n){return n.theme.fontSizes.xl}),(function(n){return n.theme.colors.primary}),k,(function(n){return n.theme.breakpoint.desktop}),(function(n){var e=n.isSmall,t=n.isSticky;return e&&t?0:1})),W=f.default.div(c||(c=n.__makeTemplateObject(["\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-around;\n"],["\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-around;\n"]))),C=f.default.div(m||(m=n.__makeTemplateObject(["\n  height: auto;\n  margin: auto 0;\n"],["\n  height: auto;\n  margin: auto 0;\n"])));exports.ChildInner=C,exports.ChildWrapper=W,exports.HeaderMainContent=j,exports.HeaderStickyContainer=_,exports.HeaderStickyPlaceHolder=v,exports.Logo=z,exports.LogoWrapper=S,exports.SkipToMain=O,exports.StyledHeader=w,exports.StyledLink=T,exports.Tagline=H;
 //# sourceMappingURL=styles.js.map

package/lib/components/Link/index.d.ts

@@ -1,6 +1,6 @@
 import React, { AnchorHTMLAttributes, Ref, ElementType, ReactNode } from "react";
 import { TextProps } from "../Text";
-export type LinkProps = AnchorHTMLAttributes<HTMLElement> & TextProps & {
+export type LinkProps = Omit<AnchorHTMLAttributes<HTMLElement>, "nonce"> & Omit<TextProps, "as" | "ref"> & {
     /** link text hover colour */
     textHoverColor?: string;
     /** link appearance variant, undefined is a standarding link withing a text block */
@@ -22,16 +22,7 @@ export type LinkProps = AnchorHTMLAttributes<HTMLElement> & TextProps & {
  * If you want something that looks like a link but behaves like a button ie. nothing to do with navigation, please consider using Link with as='button'
  *
  * If you want something that looks like a button but behaves like a link ie. it takes the user to a new location, please consider using Button and simply passing it an href, it will automatically turn into a link. */
-export declare const Link: React.ForwardRefExoticComponent<Pick<React.AnchorHTMLAttributes<HTMLElement> & import("../Spacing").SpacingProps & React.HTMLAttributes<HTMLElement> & {
-    textColor?: string | undefined;
-    textAlign?: "left" | "right" | "center" | "justify" | undefined;
-    textSize?: import("..").FontSizeType | undefined;
-    textWeight?: number | undefined;
-    as?: any;
-    wordBreak?: import("..").WordBreakType | undefined;
-    overflowWrap?: import("..").OverflowWrapType | undefined;
-    ref?: React.Ref<HTMLElement> | undefined;
-} & {
+export declare const Link: React.ForwardRefExoticComponent<Pick<Omit<React.AnchorHTMLAttributes<HTMLElement>, "nonce"> & Omit<TextProps, "as" | "ref"> & {
     /** link text hover colour */
     textHoverColor?: string | undefined;
     /** link appearance variant, undefined is a standarding link withing a text block */
@@ -42,5 +33,5 @@ export declare const Link: React.ForwardRefExoticComponent<Pick<React.AnchorHTML
     as?: React.ElementType<any> | undefined;
     /** Component children */
     children?: ReactNode;
-}, "slot" | "style" | "title" | "download" | "href" | "hrefLang" | "media" | "ping" | "rel" | "target" | "type" | "referrerPolicy" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "nonce" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "margin" | "marginTop" | "marginRight" | "marginBottom" | "marginLeft" | "marginVertical" | "marginHorizontal" | "padding" | "paddingTop" | "paddingRight" | "paddingBottom" | "paddingLeft" | "paddingVertical" | "paddingHorizontal" | "textColor" | "textAlign" | "textSize" | "textWeight" | "as" | "wordBreak" | "overflowWrap" | "textHoverColor" | "appearance"> & React.RefAttributes<HTMLElement>>;
+}, "download" | "href" | "hrefLang" | "media" | "ping" | "rel" | "target" | "type" | "referrerPolicy" | "as" | keyof import("../Spacing").SpacingProps | keyof React.HTMLAttributes<HTMLElement> | "textColor" | "textAlign" | "textSize" | "textWeight" | "wordBreak" | "overflowWrap" | "textHoverColor" | "appearance"> & React.RefAttributes<HTMLElement>>;
 export default Link;

package/lib/components/Link/styles.d.ts

@@ -7,7 +7,7 @@ export declare const StyledLink: import("styled-components").StyledComponent<imp
     textAlign?: "left" | "right" | "center" | "justify" | undefined;
     textSize?: import("../../types").FontSizeType | undefined;
     textWeight?: number | undefined;
-    as?: any;
+    as?: import("react").ElementType<any> | undefined;
     wordBreak?: import("../../types").WordBreakType | undefined;
     overflowWrap?: import("../../types").OverflowWrapType | undefined;
     ref?: import("react").Ref<HTMLElement> | undefined;

package/lib/components/Text/index.d.ts

@@ -1,4 +1,4 @@
-import { FunctionComponent, HTMLAttributes, Ref } from "react";
+import { FunctionComponent, HTMLAttributes, Ref, ElementType } from "react";
 import { SpacingProps } from "../Spacing";
 import { WordBreakType, FontSizeType, ColorKeyType, OverflowWrapType } from "../../types";
 /**
@@ -14,7 +14,7 @@ export type TextProps = SpacingProps & HTMLAttributes<HTMLElement> & {
     /** font weight theme.typography{fontWeightHeavy/fontWeightNormal/fontWeightMedium/fontWeightLight/fontWeightVLight} is better than a random number */
     textWeight?: number;
     /** styled-components polymorphism where you can set this to "span", "p" or "h2" it default to "p" */
-    as?: any;
+    as?: ElementType;
     /** word-break behaviour */
     wordBreak?: WordBreakType;
     /** overflow-wrap behaviour */

package/lib/es/src/components/Header/styles.js

@@ -1,2 +1,2 @@
-import{__makeTemplateObject as n}from"../../../node_modules/tslib/tslib.es6.js";import t from"styled-components";import i from"../../themes/cruk.js";var e,o,r,a,h,d,s,u,c,l,p,f="120px",g="72px",m=i.spacing.s,x="40px",w="0.2s",y=t.header(e||(e=n(["\n  box-sizing: border-box;\n  position: relative;\n  width: 100%;\n  background-color: ",";\n  z-index: 9998;\n"],["\n  box-sizing: border-box;\n  position: relative;\n  width: 100%;\n  background-color: ",";\n  z-index: 9998;\n"])),(function(n){return n.theme.colors.headerBackground})),b=t.div(o||(o=n(["\n  position: relative;\n  box-sizing: border-box;\n  width: 100%;\n  height: ",";\n\n  @media (min-width: ",") {\n    height: ",";\n  }\n"],["\n  position: relative;\n  box-sizing: border-box;\n  width: 100%;\n  height: ",";\n\n  @media (min-width: ",") {\n    height: ",";\n  }\n"])),g,(function(n){return n.theme.breakpoint.desktop}),f),v=t.div(r||(r=n(["\n  width: 100%;\n  height: 100%;\n  padding: 0 ",";\n  background-color: ",";\n  position: relative;\n  border-bottom: ",";\n  height: ",";\n\n  top: ",";\n  position: ",";\n  transition: height "," ease;\n\n  @media (min-width: ",") {\n    position: ",";\n    height: ",";\n  }\n"],["\n  width: 100%;\n  height: 100%;\n  padding: 0 ",";\n  background-color: ",";\n  position: relative;\n  border-bottom: ",";\n  height: ",";\n\n  top: ",";\n  position: ",";\n  transition: height "," ease;\n\n  @media (min-width: ",") {\n    position: ",";\n    height: ",";\n  }\n"])),m,(function(n){return n.theme.colors.headerBackground}),(function(n){var t=n.theme.colors.headerBorder;return"solid 1px ".concat(t)}),g,(function(n){return n.isSticky?0:"auto"}),(function(n){return n.isSticky?"fixed":"relative"}),w,(function(n){return n.theme.breakpoint.desktop}),(function(n){return n.isSticky?"fixed":"relative"}),(function(n){var t=n.isSmall,i=n.isSticky;return t&&i?g:f})),k=t.div(a||(a=n(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n  height: 100%;\n  margin: 0 auto;\n  max-width: ",";\n"],["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n  height: 100%;\n  margin: 0 auto;\n  max-width: ",";\n"])),(function(n){var t=n.fullWidth,i=n.theme.utilities.contentMaxWidth;return t?"100%":i})),z=t.img(h||(h=n(["\n  height: 100%;\n  width: auto;\n  max-width: 100%;\n  max-height: 100%;\n"],["\n  height: 100%;\n  width: auto;\n  max-width: 100%;\n  max-height: 100%;\n"]))),S=t.div(d||(d=n(["\n  display: flex;\n  flex-direction: column;\n  justify-content: space-around;\n  width: auto;\n  transition: height "," ease;\n\n  height: ",";\n\n  @media (min-width: ",") {\n    height: ",";\n  }\n"],["\n  display: flex;\n  flex-direction: column;\n  justify-content: space-around;\n  width: auto;\n  transition: height "," ease;\n\n  height: ",";\n\n  @media (min-width: ",") {\n    height: ",";\n  }\n"])),w,x,(function(n){return n.theme.breakpoint.desktop}),(function(n){var t=n.isSmall,i=n.isSticky;return t&&i?x:"80px"})),j=t.a(s||(s=n(["\n  display: inline-block;\n"],["\n  display: inline-block;\n"]))),B=t.a(u||(u=n(["\n  left: -999px;\n  position: absolute;\n  top: auto;\n  width: 1px;\n  height: 1px;\n  overflow: hidden;\n  z-index: -999;\n  &:focus,\n  &:active,\n  &:focus-within {\n    left: auto;\n    top: auto;\n    width: 30%;\n    height: auto;\n    overflow: auto;\n    margin: 10px 35%;\n    padding: ",";\n    border-radius: 15px;\n    border: 4px solid yellow;\n    text-align: center;\n    font-size: 1.2em;\n    z-index: 999;\n  }\n"],["\n  left: -999px;\n  position: absolute;\n  top: auto;\n  width: 1px;\n  height: 1px;\n  overflow: hidden;\n  z-index: -999;\n  &:focus,\n  &:active,\n  &:focus-within {\n    left: auto;\n    top: auto;\n    width: 30%;\n    height: auto;\n    overflow: auto;\n    margin: 10px 35%;\n    padding: ",";\n    border-radius: 15px;\n    border: 4px solid yellow;\n    text-align: center;\n    font-size: 1.2em;\n    z-index: 999;\n  }\n"])),(function(n){return n.theme.spacing.xs})),W=t.p(c||(c=n(["\n  flex: 1 1 auto;\n  font-family: ",";\n  font-weight: ",";\n  font-size: ",";\n  color: ",";\n  text-align: center;\n  opacity: 0;\n\n  transition: opacity "," ease;\n\n  @media (min-width: ",") {\n    opacity: ",";\n  }\n"],["\n  flex: 1 1 auto;\n  font-family: ",";\n  font-weight: ",";\n  font-size: ",";\n  color: ",";\n  text-align: center;\n  opacity: 0;\n\n  transition: opacity "," ease;\n\n  @media (min-width: ",") {\n    opacity: ",";\n  }\n"])),(function(n){return n.theme.typography.fontFamilyHeadings}),(function(n){return n.theme.typography.fontWeightLight}),(function(n){return n.theme.fontSizes.xl}),(function(n){return n.theme.colors.primary}),w,(function(n){return n.theme.breakpoint.desktop}),(function(n){var t=n.isSmall,i=n.isSticky;return t&&i?0:1})),F=t.div(l||(l=n(["\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-around;\n"],["\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-around;\n"]))),H=t.div(p||(p=n(["\n  height: auto;\n  margin: auto 0;\n"],["\n  height: auto;\n  margin: auto 0;\n"])));export{H as ChildInner,F as ChildWrapper,k as HeaderMainContent,v as HeaderStickyContainer,b as HeaderStickyPlaceHolder,z as Logo,S as LogoWrapper,B as SkipToMain,y as StyledHeader,j as StyledLink,W as Tagline};
+import{__makeTemplateObject as n}from"../../../node_modules/tslib/tslib.es6.js";import t from"styled-components";import i from"../../themes/cruk.js";var e,o,a,r,h,d,s,u,l,c,p,f="120px",g="72px",m=i.spacing.s,x="40px",y="0.2s",w=t.header(e||(e=n(["\n  box-sizing: border-box;\n  position: relative;\n  width: 100%;\n  background-color: ",";\n  z-index: 9998;\n"],["\n  box-sizing: border-box;\n  position: relative;\n  width: 100%;\n  background-color: ",";\n  z-index: 9998;\n"])),(function(n){return n.theme.colors.headerBackground})),b=t.div(o||(o=n(["\n  position: relative;\n  box-sizing: border-box;\n  width: 100%;\n  height: ",";\n\n  @media (min-width: ",") {\n    height: ",";\n  }\n"],["\n  position: relative;\n  box-sizing: border-box;\n  width: 100%;\n  height: ",";\n\n  @media (min-width: ",") {\n    height: ",";\n  }\n"])),g,(function(n){return n.theme.breakpoint.desktop}),f),v=t.div(a||(a=n(["\n  width: 100%;\n  height: 100%;\n  padding: 0 ",";\n  background-color: ",";\n  position: relative;\n  border-bottom: ",";\n  height: ",";\n\n  top: ",";\n  position: ",";\n  transition: height "," ease;\n\n  @media (min-width: ",") {\n    position: ",";\n    height: ",";\n  }\n"],["\n  width: 100%;\n  height: 100%;\n  padding: 0 ",";\n  background-color: ",";\n  position: relative;\n  border-bottom: ",";\n  height: ",";\n\n  top: ",";\n  position: ",";\n  transition: height "," ease;\n\n  @media (min-width: ",") {\n    position: ",";\n    height: ",";\n  }\n"])),m,(function(n){return n.theme.colors.headerBackground}),(function(n){var t=n.theme.colors.headerBorder;return"solid 1px ".concat(t)}),g,(function(n){return n.isSticky?0:"auto"}),(function(n){return n.isSticky?"fixed":"relative"}),y,(function(n){return n.theme.breakpoint.desktop}),(function(n){return n.isSticky?"fixed":"relative"}),(function(n){var t=n.isSmall,i=n.isSticky;return t&&i?g:f})),k=t.div(r||(r=n(["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n  height: 100%;\n  margin: 0 auto;\n  max-width: ",";\n"],["\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n  height: 100%;\n  margin: 0 auto;\n  max-width: ",";\n"])),(function(n){var t=n.fullWidth,i=n.theme.utilities.contentMaxWidth;return t?"100%":i})),z=t.img(h||(h=n(["\n  height: 100%;\n  width: auto;\n  max-width: 100%;\n  max-height: 100%;\n"],["\n  height: 100%;\n  width: auto;\n  max-width: 100%;\n  max-height: 100%;\n"]))),S=t.div(d||(d=n(["\n  display: flex;\n  flex-direction: column;\n  justify-content: space-around;\n  width: auto;\n  transition: height "," ease;\n\n  height: ",";\n\n  @media (min-width: ",") {\n    height: ",";\n  }\n"],["\n  display: flex;\n  flex-direction: column;\n  justify-content: space-around;\n  width: auto;\n  transition: height "," ease;\n\n  height: ",";\n\n  @media (min-width: ",") {\n    height: ",";\n  }\n"])),y,x,(function(n){return n.theme.breakpoint.desktop}),(function(n){var t=n.isSmall,i=n.isSticky;return t&&i?x:"80px"})),j=t.a(s||(s=n(["\n  display: inline-block;\n"],["\n  display: inline-block;\n"]))),B=t.a(u||(u=n(["\n  left: -999px;\n  position: absolute;\n  top: auto;\n  width: 1px;\n  height: 1px;\n  overflow: hidden;\n  z-index: -999;\n  &:focus,\n  &:active,\n  &:focus-within {\n    left: auto;\n    top: auto;\n    width: 30%;\n    height: auto;\n    overflow: auto;\n    margin: 10px 35%;\n    padding: ",";\n    border-radius: 15px;\n    border: 4px solid yellow;\n    text-align: center;\n    font-size: 1.2em;\n    z-index: 999;\n  }\n"],["\n  left: -999px;\n  position: absolute;\n  top: auto;\n  width: 1px;\n  height: 1px;\n  overflow: hidden;\n  z-index: -999;\n  &:focus,\n  &:active,\n  &:focus-within {\n    left: auto;\n    top: auto;\n    width: 30%;\n    height: auto;\n    overflow: auto;\n    margin: 10px 35%;\n    padding: ",";\n    border-radius: 15px;\n    border: 4px solid yellow;\n    text-align: center;\n    font-size: 1.2em;\n    z-index: 999;\n  }\n"])),(function(n){return n.theme.spacing.xs})),W=t.p(l||(l=n(["\n  flex: 1 1 auto;\n  font-family: ",";\n  font-weight: ",";\n  font-size: ",";\n  color: ",";\n  text-align: center;\n  opacity: 0;\n  transition: opacity "," ease;\n  display: none;\n\n  @media (min-width: ",") {\n    display: block;\n    opacity: ",";\n  }\n"],["\n  flex: 1 1 auto;\n  font-family: ",";\n  font-weight: ",";\n  font-size: ",";\n  color: ",";\n  text-align: center;\n  opacity: 0;\n  transition: opacity "," ease;\n  display: none;\n\n  @media (min-width: ",") {\n    display: block;\n    opacity: ",";\n  }\n"])),(function(n){return n.theme.typography.fontFamilyHeadings}),(function(n){return n.theme.typography.fontWeightLight}),(function(n){return n.theme.fontSizes.xl}),(function(n){return n.theme.colors.primary}),y,(function(n){return n.theme.breakpoint.desktop}),(function(n){var t=n.isSmall,i=n.isSticky;return t&&i?0:1})),F=t.div(c||(c=n(["\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-around;\n"],["\n  height: 100%;\n  display: flex;\n  flex-direction: column;\n  justify-content: space-around;\n"]))),H=t.div(p||(p=n(["\n  height: auto;\n  margin: auto 0;\n"],["\n  height: auto;\n  margin: auto 0;\n"])));export{H as ChildInner,F as ChildWrapper,k as HeaderMainContent,v as HeaderStickyContainer,b as HeaderStickyPlaceHolder,z as Logo,S as LogoWrapper,B as SkipToMain,w as StyledHeader,j as StyledLink,W as Tagline};
 //# sourceMappingURL=styles.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cruk/cruk-react-components",
-  "version": "1.2.4",
+  "version": "1.3.0",
   "description": "React components implementing CRUK and SU2C designs",
   "license": "UNLICENSED",
   "publishConfig": {
@@ -74,7 +74,6 @@
     "@babel/preset-react": "^7.14.5",
     "@babel/preset-typescript": "^7.9.0",
     "@cruk/eslint-config": "^1.0.8",
-    "@cypress/react": "^7.0.2",
     "@cypress/webpack-dev-server": "2.1.0",
     "@cypress/webpack-preprocessor": "^5.12.0",
     "@mdx-js/loader": "^2.2.1",
@@ -112,7 +111,7 @@
     "babel-loader": "8.3.0",
     "babel-plugin-styled-components": "^2.0.2",
     "cypress": "^10.4.0",
-    "cypress-axe": "1.0.0",
+    "cypress-axe": "1.2.0",
     "cypress-plugin-tab": "^1.0.5",
     "eslint": "^8.30.0",
     "eslint-config-airbnb": "^19.0.4",
@@ -144,7 +143,7 @@
     "ts-loader": "9.4.1",
     "typescript": "^4.9.4",
     "webpack": "^5.53.0",
-    "webpack-cli": "4.10.0",
+    "webpack-cli": "5.0.1",
     "webpack-dev-server": "^4.7.3"
   },
   "peerDependencies": {