@cruk/cruk-react-components 1.1.4 → 1.1.7

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

@@ -1,2 +1,2 @@
-import{__makeTemplateObject as n}from"../../../node_modules/tslib/tslib.es6.js";import o,{css as r}from"styled-components";var t,e,c,i,a,l,d,u,s=o.span(t||(t=n(["\n  margin-left: ",";\n  &:first-of-type {\n    margin-left: 0;\n  }\n"],["\n  margin-left: ",";\n  &:first-of-type {\n    margin-left: 0;\n  }\n"])),(function(n){return n.theme.spacing.xxs})),b=o.button(u||(u=n(["\n  box-sizing: border-box;\n  min-height: ",";\n  display: inline-block;\n  vertical-align: middle;\n  padding: ",";\n  width: ",";\n  min-width: ",";\n\n  border-radius: ",";\n  border-style: solid;\n  border-width: ",";\n\n  transition: color 0.2s ease, background-color 0.2s ease,\n    border-color 0.2s ease;\n\n  cursor: pointer;\n  font-size: ",";\n  font-family: ",";\n  font-weight: ",";\n  text-align: center;\n  text-transform: ",";\n  text-decoration: ",";\n\n  &:focus-visible {\n    outline: auto;\n  }\n\n  ","\n\n  ","\n\n  ","\n  \n  ","\n\n  ","\n\n  ","\n"],["\n  box-sizing: border-box;\n  min-height: ",";\n  display: inline-block;\n  vertical-align: middle;\n  padding: ",";\n  width: ",";\n  min-width: ",";\n\n  border-radius: ",";\n  border-style: solid;\n  border-width: ",";\n\n  transition: color 0.2s ease, background-color 0.2s ease,\n    border-color 0.2s ease;\n\n  cursor: pointer;\n  font-size: ",";\n  font-family: ",";\n  font-weight: ",";\n  text-align: center;\n  text-transform: ",";\n  text-decoration: ",";\n\n  &:focus-visible {\n    outline: auto;\n  }\n\n  ","\n\n  ","\n\n  ","\n  \n  ","\n\n  ","\n\n  ","\n"])),"3rem",(function(n){var o=n.theme;return n.isIconButton?"0":"calc( (".concat("3rem"," - ( ").concat(o.button.buttonBorderThickness," * 2) - ").concat(o.typography.lineHeight," ) / 2) ").concat(o.spacing.m)}),(function(n){return n.isIconButton?"".concat("3rem"):"auto"}),(function(n){return n.isIconButton?"".concat("3rem"):"auto"}),(function(n){return n.theme.button.borderRadius}),(function(n){return n.theme.button.buttonBorderThickness}),(function(n){return n.theme.fontSizes.m}),(function(n){return n.theme.typography.fontFamilyHeadings}),(function(n){return n.theme.typography.fontWeightMedium}),(function(n){return n.theme.button.textTransform}),(function(n){return n.theme.button.textDecoration}),(function(o){return"primary"===o.appearance&&r(e||(e=n(["\n      background-color: ",";\n      border-color: ",";\n      color: "," !important;\n      :focus,\n      :hover {\n        background-color: ",";\n        border-color: ",";\n        color: "," !important;\n      }\n      :disabled {\n        cursor: not-allowed;\n        background-color: ",";\n        color: "," !important;\n        border-color: ",";\n      }\n    "],["\n      background-color: ",";\n      border-color: ",";\n      color: "," !important;\n      :focus,\n      :hover {\n        background-color: ",";\n        border-color: ",";\n        color: "," !important;\n      }\n      :disabled {\n        cursor: not-allowed;\n        background-color: ",";\n        color: "," !important;\n        border-color: ",";\n      }\n    "])),o.theme.colors.buttonPrimaryBackground,o.theme.colors.buttonPrimaryBorder,o.theme.colors.buttonPrimaryText,o.theme.colors.buttonPrimaryBackgroundHover,o.theme.colors.buttonPrimaryBorderHover,o.theme.colors.buttonPrimaryTextHover,o.theme.colors.buttonPrimaryDisabledBackground,o.theme.colors.buttonPrimaryDisabledText,o.theme.colors.buttonPrimaryDisabledBorder)}),(function(o){return"secondary"===o.appearance&&r(c||(c=n(["\n      background-color: ",";\n      border-color: ",";\n      color: "," !important;\n      :focus,\n      :hover {\n        background-color: ",";\n        border-color: ",";\n        color: "," !important;\n      }\n      :disabled {\n        cursor: not-allowed;\n        background-color: ",";\n        color: "," !important;\n        border-color: ",";\n      }\n    "],["\n      background-color: ",";\n      border-color: ",";\n      color: "," !important;\n      :focus,\n      :hover {\n        background-color: ",";\n        border-color: ",";\n        color: "," !important;\n      }\n      :disabled {\n        cursor: not-allowed;\n        background-color: ",";\n        color: "," !important;\n        border-color: ",";\n      }\n    "])),o.theme.colors.buttonSecondaryBackground,o.theme.colors.buttonSecondaryBorder,o.theme.colors.buttonSecondaryText,o.theme.colors.buttonSecondaryBackgroundHover,o.theme.colors.buttonSecondaryBorderHover,o.theme.colors.buttonSecondaryTextHover,o.theme.colors.buttonSecondaryDisabledBackground,o.theme.colors.buttonSecondaryDisabledText,o.theme.colors.buttonSecondaryDisabledBorder)}),(function(o){return"tertiary"===o.appearance&&r(i||(i=n(["\n      display: inline-block;\n      padding: 0;\n      border: 0px;\n      background-color: rgba(255, 255, 255, 0);\n      transition: color 0.2s ease;\n      color: ",";\n      :focus,\n      :hover {\n        color: ",";\n      }\n      :disabled {\n        cursor: not-allowed;\n        background-color: transparent;\n        color: "," !important;\n        border-color: transparent;\n      }\n    "],["\n      display: inline-block;\n      padding: 0;\n      border: 0px;\n      background-color: rgba(255, 255, 255, 0);\n      transition: color 0.2s ease;\n      color: ",";\n      :focus,\n      :hover {\n        color: ",";\n      }\n      :disabled {\n        cursor: not-allowed;\n        background-color: transparent;\n        color: "," !important;\n        border-color: transparent;\n      }\n    "])),o.theme.colors.buttonTertiaryText,o.theme.colors.buttonTertiaryTextHover,o.theme.colors.buttonTertiaryDisabledText)}),(function(o){return"l"===o.size&&r(a||(a=n(["\n      min-height: ",";\n      border-radius: ",";\n      padding: ",";\n      min-width: ",";\n      height: ",";\n    "],["\n      min-height: ",";\n      border-radius: ",";\n      padding: ",";\n      min-width: ",";\n      height: ",";\n    "])),"4rem",(function(n){return n.theme.button.borderRadiusLarge}),(function(n){var o=n.theme;return n.isIconButton?"0":"calc( (".concat("4rem"," - ( ").concat(o.button.buttonBorderThickness," * 2) - ").concat(o.typography.lineHeight," ) / 2) ").concat(o.spacing.m)}),(function(n){return n.isIconButton?"".concat("4rem"):"auto"}),(function(n){return n.isIconButton?"".concat("4rem"):"min-content"}))}),(function(o){return o.full&&r(l||(l=n(["\n      width: 100%;\n    "],["\n      width: 100%;\n    "])))}),(function(o){return o.css&&r(d||(d=n(["\n      ","\n    "],["\n      ","\n    "])),o.css)}));export{s as Spacer,b as StyledButton};
+import{__makeTemplateObject as n}from"../../../node_modules/tslib/tslib.es6.js";import o,{css as r}from"styled-components";var t,e,c,i,a,l,d,u,s=o.span(t||(t=n(["\n  margin-left: ",";\n  &:first-of-type {\n    margin-left: 0;\n  }\n"],["\n  margin-left: ",";\n  &:first-of-type {\n    margin-left: 0;\n  }\n"])),(function(n){return n.theme.spacing.xxs})),b=o.button(u||(u=n(["\n  box-sizing: border-box;\n  min-height: ",";\n  height: min-content;\n  display: inline-block;\n  vertical-align: middle;\n  padding: ",";\n  width: ",";\n  min-width: ",";\n\n  border-radius: ",";\n  border-style: solid;\n  border-width: ",";\n\n  transition: color 0.2s ease, background-color 0.2s ease,\n    border-color 0.2s ease;\n\n  cursor: pointer;\n  font-size: ",";\n  font-family: ",";\n  font-weight: ",";\n  text-align: center;\n  text-transform: ",";\n  text-decoration: ",";\n\n  &:focus-visible {\n    outline: auto;\n  }\n\n  ","\n\n  ","\n\n  ","\n  \n  ","\n\n  ","\n\n  ","\n"],["\n  box-sizing: border-box;\n  min-height: ",";\n  height: min-content;\n  display: inline-block;\n  vertical-align: middle;\n  padding: ",";\n  width: ",";\n  min-width: ",";\n\n  border-radius: ",";\n  border-style: solid;\n  border-width: ",";\n\n  transition: color 0.2s ease, background-color 0.2s ease,\n    border-color 0.2s ease;\n\n  cursor: pointer;\n  font-size: ",";\n  font-family: ",";\n  font-weight: ",";\n  text-align: center;\n  text-transform: ",";\n  text-decoration: ",";\n\n  &:focus-visible {\n    outline: auto;\n  }\n\n  ","\n\n  ","\n\n  ","\n  \n  ","\n\n  ","\n\n  ","\n"])),"3rem",(function(n){var o=n.theme;return n.isIconButton?"0":"calc( (".concat("3rem"," - ( ").concat(o.button.buttonBorderThickness," * 2) - ").concat(o.typography.lineHeight," ) / 2) ").concat(o.spacing.m)}),(function(n){return n.isIconButton?"".concat("3rem"):"auto"}),(function(n){return n.isIconButton?"".concat("3rem"):"auto"}),(function(n){return n.theme.button.borderRadius}),(function(n){return n.theme.button.buttonBorderThickness}),(function(n){return n.theme.fontSizes.m}),(function(n){return n.theme.typography.fontFamilyHeadings}),(function(n){return n.theme.typography.fontWeightMedium}),(function(n){return n.theme.button.textTransform}),(function(n){return n.theme.button.textDecoration}),(function(o){return"primary"===o.appearance&&r(e||(e=n(["\n      background-color: ",";\n      border-color: ",";\n      color: "," !important;\n      :focus,\n      :hover {\n        background-color: ",";\n        border-color: ",";\n        color: "," !important;\n      }\n      :disabled {\n        cursor: not-allowed;\n        background-color: ",";\n        color: "," !important;\n        border-color: ",";\n      }\n    "],["\n      background-color: ",";\n      border-color: ",";\n      color: "," !important;\n      :focus,\n      :hover {\n        background-color: ",";\n        border-color: ",";\n        color: "," !important;\n      }\n      :disabled {\n        cursor: not-allowed;\n        background-color: ",";\n        color: "," !important;\n        border-color: ",";\n      }\n    "])),o.theme.colors.buttonPrimaryBackground,o.theme.colors.buttonPrimaryBorder,o.theme.colors.buttonPrimaryText,o.theme.colors.buttonPrimaryBackgroundHover,o.theme.colors.buttonPrimaryBorderHover,o.theme.colors.buttonPrimaryTextHover,o.theme.colors.buttonPrimaryDisabledBackground,o.theme.colors.buttonPrimaryDisabledText,o.theme.colors.buttonPrimaryDisabledBorder)}),(function(o){return"secondary"===o.appearance&&r(c||(c=n(["\n      background-color: ",";\n      border-color: ",";\n      color: "," !important;\n      :focus,\n      :hover {\n        background-color: ",";\n        border-color: ",";\n        color: "," !important;\n      }\n      :disabled {\n        cursor: not-allowed;\n        background-color: ",";\n        color: "," !important;\n        border-color: ",";\n      }\n    "],["\n      background-color: ",";\n      border-color: ",";\n      color: "," !important;\n      :focus,\n      :hover {\n        background-color: ",";\n        border-color: ",";\n        color: "," !important;\n      }\n      :disabled {\n        cursor: not-allowed;\n        background-color: ",";\n        color: "," !important;\n        border-color: ",";\n      }\n    "])),o.theme.colors.buttonSecondaryBackground,o.theme.colors.buttonSecondaryBorder,o.theme.colors.buttonSecondaryText,o.theme.colors.buttonSecondaryBackgroundHover,o.theme.colors.buttonSecondaryBorderHover,o.theme.colors.buttonSecondaryTextHover,o.theme.colors.buttonSecondaryDisabledBackground,o.theme.colors.buttonSecondaryDisabledText,o.theme.colors.buttonSecondaryDisabledBorder)}),(function(o){return"tertiary"===o.appearance&&r(i||(i=n(["\n      display: inline-block;\n      padding: 0;\n      border: 0px;\n      background-color: rgba(255, 255, 255, 0);\n      transition: color 0.2s ease;\n      color: ",";\n      :focus,\n      :hover {\n        color: ",";\n      }\n      :disabled {\n        cursor: not-allowed;\n        background-color: transparent;\n        color: "," !important;\n        border-color: transparent;\n      }\n    "],["\n      display: inline-block;\n      padding: 0;\n      border: 0px;\n      background-color: rgba(255, 255, 255, 0);\n      transition: color 0.2s ease;\n      color: ",";\n      :focus,\n      :hover {\n        color: ",";\n      }\n      :disabled {\n        cursor: not-allowed;\n        background-color: transparent;\n        color: "," !important;\n        border-color: transparent;\n      }\n    "])),o.theme.colors.buttonTertiaryText,o.theme.colors.buttonTertiaryTextHover,o.theme.colors.buttonTertiaryDisabledText)}),(function(o){return"l"===o.size&&r(a||(a=n(["\n      min-height: ",";\n      border-radius: ",";\n      padding: ",";\n      min-width: ",";\n      height: ",";\n    "],["\n      min-height: ",";\n      border-radius: ",";\n      padding: ",";\n      min-width: ",";\n      height: ",";\n    "])),"4rem",(function(n){return n.theme.button.borderRadiusLarge}),(function(n){var o=n.theme;return n.isIconButton?"0":"calc( (".concat("4rem"," - ( ").concat(o.button.buttonBorderThickness," * 2) - ").concat(o.typography.lineHeight," ) / 2) ").concat(o.spacing.m)}),(function(n){return n.isIconButton?"".concat("4rem"):"auto"}),(function(n){return n.isIconButton?"".concat("4rem"):"min-content"}))}),(function(o){return o.full&&r(l||(l=n(["\n      width: 100%;\n    "],["\n      width: 100%;\n    "])))}),(function(o){return o.css&&r(d||(d=n(["\n      ","\n    "],["\n      ","\n    "])),o.css)}));export{s as Spacer,b as StyledButton};
 //# sourceMappingURL=styles.js.map

package/lib/es/src/components/Carousel/index.js

@@ -1,2 +1,2 @@
-import e,{memo as r,useState as t,useRef as n,useEffect as o}from"react";import{InView as l}from"../../../node_modules/react-intersection-observer/react-intersection-observer.modern.mjs.js";import i from"../Box/index.js";import{Dots as c}from"./Dots.js";import{CarouselWrapper as s,CarouselScrollArea as a,CarouselCard as u,CarouselCardInner as m}from"./styles.js";var d=function(r){var d=r.startPosition,f=void 0===d?0:d,h=r.children,v=r.onPositionChanged,g=r.shrinkUnselectedPages,E=void 0!==g&&g,p=t(f),P=p[0],j=p[1],x=t(!0),y=x[0],C=x[1],T=n(null),b=e.Children.toArray(h).filter(Boolean),k=function(e){if(T&&T.current){var r=T.current.scrollWidth,t=0===e,n=e===T.current.children.length-1,o=T.current.children[e];if(!o)return;var l=o.offsetLeft;t?T.current.scrollTo(0,0):n?T.current.scrollTo(r,0):T.current.scrollTo(l,0),y||C(!0)}};o((function(){0!==f&&C(!1)}),[f]),o((function(){!1===y&&k(f)}),[y]);var B=1===b.length;return e.createElement(e.Fragment,null,e.createElement(i,null,e.createElement(s,null,e.createElement(a,{ref:T,"aria-live":"assertive",smoothScrolling:y,tabIndex:0},b.map((function(r,t){var n=t===P;return e.createElement(u,{key:t,onlyChild:B},e.createElement(l,{threshold:.5,as:"div",onChange:function(e){var r;e&&P!==(r=t)&&(j(r),v&&v(r))}},e.createElement(m,{onlyChild:B,isSelected:n,shrinkUnselectedPages:E},r)))}))))),b.length>1?e.createElement(i,null,e.createElement(c,{count:b.length,currentPosition:P,scrollToPosition:k,next:function(){k(P+1)},previous:function(){k(P-1)}})):null)},f=r(d);export{d as Carousel,f as default};
+import e,{memo as r,useState as t,useRef as n,useEffect as o}from"react";import{InView as l}from"../../../node_modules/react-intersection-observer/react-intersection-observer.modern.mjs.js";import i from"../Box/index.js";import{Dots as c}from"./Dots.js";import{CarouselWrapper as s,CarouselScrollArea as a,CarouselCard as u,CarouselCardInner as m}from"./styles.js";var d=function(r){var d=r.startPosition,f=void 0===d?0:d,h=r.children,v=r.onPositionChanged,g=r.shrinkUnselectedPages,E=void 0!==g&&g,p=t(f),P=p[0],j=p[1],x=t(!0),y=x[0],C=x[1],T=n(null),b=e.Children.toArray(h).filter(Boolean),k=function(e){if(T&&T.current){var r=T.current.scrollWidth,t=0===e,n=e===T.current.children.length-1,o=T.current.children[e];if(!o)return;var l=o.offsetLeft;t?T.current.scrollTo(0,0):n?T.current.scrollTo(r,0):T.current.scrollTo(l,0),y||C(!0)}};o((function(){0!==f&&C(!1)}),[f]),o((function(){!1===y&&k(f)}),[y]);var B=1===b.length;return e.createElement(e.Fragment,null,e.createElement(i,null,e.createElement(s,null,e.createElement(a,{ref:T,"aria-live":"assertive",smoothScrolling:y,tabIndex:0},b.map((function(r,t){var n=t===P;return e.createElement(u,{key:"card".concat(t),onlyChild:B},e.createElement(l,{threshold:.5,as:"div",onChange:function(e){var r;e&&P!==(r=t)&&(j(r),v&&v(r))}},e.createElement(m,{onlyChild:B,isSelected:n,shrinkUnselectedPages:E},r)))}))))),b.length>1?e.createElement(i,null,e.createElement(c,{count:b.length,currentPosition:P,scrollToPosition:k,next:function(){k(P+1)},previous:function(){k(P-1)}})):null)},f=r(d);export{d as Carousel,f as default};
 //# sourceMappingURL=index.js.map

package/lib/es/src/components/Footer/index.js

@@ -1,2 +1,2 @@
-import{__assign as e}from"../../../node_modules/tslib/tslib.es6.js";import t from"react";import{useTheme as l,ThemeProvider as n}from"styled-components";import r from"../../themes/cruk.js";import{Text as o}from"../Text/index.js";import{StyledFooter as a,FooterContentWrapper as m,FooterSectionLogo as s,StyledRegulatorLogo as i,FooterSectionLinks as c,StyledNav as E,StyledUL as f,StyledLI as u,FooterSection as p,FooterSectionAddress as d,StyledAddress as x}from"./styles.js";var g=function(g){var S=g.children,y=g.middleSection,h=t.Children.toArray(S),z=l(),C=e(e({},r),z);return t.createElement(n,{theme:C},t.createElement(a,null,t.createElement(m,null,t.createElement(s,null,t.createElement(i,{alt:C.siteConfig.footerLogoAlt||"",src:C.siteConfig.footerLogoSrc||""})),t.createElement(c,null,t.createElement(E,{"aria-label":"footer links"},t.createElement(f,null,h.length?h.map((function(e,l){return t.createElement(u,{key:l},e)})):null))),t.createElement(p,null,y?"string"==typeof y?t.createElement(o,{textSize:"s"},y):t.createElement(t.Fragment,null,y):t.createElement(o,{textSize:"s"},C.siteConfig.footerCopyText)),t.createElement(d,null,t.createElement(x,null,t.createElement(o,{as:"span",textSize:"s"},"2 Redman Place"),t.createElement(o,{as:"span",textSize:"s"},"London"),t.createElement(o,{as:"span",textSize:"s"},"E20 1JQ"))))))};export{g as Footer,g as default};
+import{__assign as e}from"../../../node_modules/tslib/tslib.es6.js";import t from"react";import{useTheme as n,ThemeProvider as l}from"styled-components";import r from"../../themes/cruk.js";import{Text as o}from"../Text/index.js";import{StyledFooter as a,FooterContentWrapper as m,FooterSectionLogo as s,StyledRegulatorLogo as c,FooterSectionLinks as i,StyledNav as E,StyledUL as f,StyledLI as u,FooterSection as p,FooterSectionAddress as d,StyledAddress as x}from"./styles.js";var g=function(g){var S=g.children,y=g.middleSection,h=t.Children.toArray(S),z=n(),C=e(e({},r),z);return t.createElement(l,{theme:C},t.createElement(a,null,t.createElement(m,null,t.createElement(s,null,t.createElement(c,{alt:C.siteConfig.footerLogoAlt||"",src:C.siteConfig.footerLogoSrc||""})),t.createElement(i,null,t.createElement(E,{"aria-label":"footer links"},t.createElement(f,null,h.length?h.map((function(e,n){return t.createElement(u,{key:"footerLink".concat(n)},e)})):null))),t.createElement(p,null,y?"string"==typeof y?t.createElement(o,{textSize:"s"},y):t.createElement(t.Fragment,null,y):t.createElement(o,{textSize:"s"},C.siteConfig.footerCopyText)),t.createElement(d,null,t.createElement(x,null,t.createElement(o,{as:"span",textSize:"s"},"2 Redman Place"),t.createElement(o,{as:"span",textSize:"s"},"London"),t.createElement(o,{as:"span",textSize:"s"},"E20 1JQ"))))))};export{g as Footer,g as default};
 //# sourceMappingURL=index.js.map

package/lib/hocs/MdxProvider.d.ts

@@ -1,3 +1,6 @@
-import { FunctionComponent } from "react";
-declare const MdxProvider: FunctionComponent;
+import { ReactNode } from "@mdx-js/react/lib";
+declare type MdxProviderProps = {
+    children?: ReactNode;
+};
+declare const MdxProvider: ({ children }: MdxProviderProps) => JSX.Element;
 export default MdxProvider;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cruk/cruk-react-components",
-  "version": "1.1.4",
+  "version": "1.1.7",
   "description": "React components implementing CRUK and SU2C designs",
   "license": "UNLICENSED",
   "publishConfig": {
@@ -75,7 +75,7 @@
     "@babel/preset-typescript": "^7.9.0",
     "@cruk/eslint-config": "^1.0.5",
     "@cypress/react": "^6.0.0",
-    "@cypress/webpack-dev-server": "2.0.0",
+    "@cypress/webpack-dev-server": "2.1.0",
     "@cypress/webpack-preprocessor": "^5.12.0",
     "@mdx-js/loader": "^2.0.0",
     "@mdx-js/mdx": "^2.0.0",
@@ -99,9 +99,11 @@
     "@types/assert": "^1.5.1",
     "@types/cypress-image-snapshot": "^3.1.6",
     "@types/jest": "^27.4.0",
+    "@types/mdx": "^2.0.2",
     "@types/mdx-js__react": "^1.5.1",
     "@types/node": "^17.0.25",
-    "@types/react": "^17.0.47",
+    "@types/reach__router": "^1.3.10",
+    "@types/react": "^18.0.17",
     "@types/react-dom": "^17.0.17",
     "@types/styled-components": "^5.1.22",
     "@typescript-eslint/eslint-plugin": "^5.29.0",
@@ -147,8 +149,8 @@
     "webpack-dev-server": "^4.7.3"
   },
   "peerDependencies": {
-    "react": "^16.12.0 || ^17.0.1 ",
-    "react-dom": "^16.12.0 || ^17.0.1 ",
+    "react": "^16.12.0 || ^17.0.1 || ^18.0.1 ",
+    "react-dom": "^16.12.0 || ^17.0.1 || ^18.0.1 ",
     "styled-components": "^5.3.5"
   },
   "dependencies": {