@cruk/cruk-react-components 5.0.7 → 6.0.0

package/lib/src/components/DateField/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/DateField/index.tsx"],"sourcesContent":["import React, { type InputHTMLAttributes } from \"react\";\n\nimport { useTheme } from \"styled-components\";\nimport { ErrorText } from \"../ErrorText\";\nimport { Text } from \"../Text\";\nimport { TextField } from \"../TextField\";\n\nimport {\n  Fieldset,\n  DateTextFieldWrapper,\n  LargeDateTextFieldWrapper,\n  ErrorTextWrapper,\n} from \"./styles\";\nimport { type ThemeType } from \"../../types\";\n\nexport type DateFieldProps = InputHTMLAttributes<HTMLInputElement> & {\n  /** label text */\n  label: string;\n  /** hind text */\n  hintText?: string;\n  /** day field text value  */\n  day: string;\n  /** month field text value  */\n  month: string;\n  /** year field text value  */\n  year: string;\n  /** name passed to day field input element */\n  dayName?: string;\n  /** name passed to month field input element */\n  monthName?: string;\n  /** name passed to year field input element */\n  yearName?: string;\n  /** flag of error styling on day field */\n  dayHasError?: boolean;\n  /** flag of error styling on month field */\n  monthHasError?: boolean;\n  /** flag of error styling on year field */\n  yearHasError?: boolean;\n  /** error message text */\n  errorMessage?: string;\n};\n\n/**\n * To be used in forms entering dates like date of birth which are known dates and would take too long to get to with a date picker\n * */\nexport function DateField({\n  label,\n  hintText,\n  day,\n  month,\n  year,\n  dayName = \"day\",\n  monthName = \"month\",\n  yearName = \"year\",\n  dayHasError,\n  monthHasError,\n  yearHasError,\n  errorMessage,\n  onChange = () => {\n    // no op\n  },\n  onBlur = () => {\n    // no op\n  },\n  onFocus = () => {\n    // no op\n  },\n  disabled,\n  required,\n}: DateFieldProps) {\n  const theme = useTheme();\n  const typedTheme = theme as ThemeType;\n  return (\n    <Fieldset>\n      <Text\n        as=\"legend\"\n        textWeight={typedTheme.typography.fontWeightLabels || 700}\n        marginBottom=\"xxs\"\n        textFontFamily={typedTheme.typography.fontFamilyLabel}\n      >\n        {label}\n        {!!required && (\n          <span\n            style={{\n              fontWeight: typedTheme.typography.fontWeightBase,\n            }}\n          >\n            {` (required)`}\n          </span>\n        )}\n      </Text>\n      {hintText && <Text>{hintText}</Text>}\n      <DateTextFieldWrapper>\n        <TextField\n          label=\"Day\"\n          type=\"text\"\n          name={dayName}\n          required={!!required}\n          hideRequiredInLabel\n          maxLength={2}\n          autoComplete=\"bday-day\"\n          pattern=\"[0-9]*\"\n          inputMode=\"numeric\"\n          value={day}\n          onChange={onChange}\n          onBlur={onBlur}\n          onFocus={onFocus}\n          hasError={dayHasError}\n          disabled={disabled}\n        />\n      </DateTextFieldWrapper>\n      <DateTextFieldWrapper>\n        <TextField\n          label=\"Month\"\n          type=\"text\"\n          name={monthName}\n          required={!!required}\n          hideRequiredInLabel\n          maxLength={2}\n          autoComplete=\"bday-month\"\n          pattern=\"[0-9]*\"\n          inputMode=\"numeric\"\n          value={month}\n          onChange={onChange}\n          onBlur={onBlur}\n          onFocus={onFocus}\n          hasError={monthHasError}\n          disabled={disabled}\n        />\n      </DateTextFieldWrapper>\n      <LargeDateTextFieldWrapper>\n        <TextField\n          label=\"Year\"\n          type=\"text\"\n          name={yearName}\n          required={!!required}\n          hideRequiredInLabel\n          maxLength={4}\n          autoComplete=\"bday-year\"\n          pattern=\"[0-9]*\"\n          inputMode=\"numeric\"\n          value={year}\n          onChange={onChange}\n          onBlur={onBlur}\n          onFocus={onFocus}\n          hasError={yearHasError}\n          disabled={disabled}\n        />\n      </LargeDateTextFieldWrapper>\n      {errorMessage && (\n        <ErrorTextWrapper>\n          <ErrorText marginTop=\"xxs\">{errorMessage}</ErrorText>\n        </ErrorTextWrapper>\n      )}\n    </Fieldset>\n  );\n}\n\nexport default DateField;\n"],"names":["DateField","_a","label","hintText","day","month","year","_b","dayName","_c","monthName","_d","yearName","dayHasError","monthHasError","yearHasError","errorMessage","_e","onChange","_f","onBlur","_g","onFocus","disabled","required","typedTheme","useTheme","React","Fieldset","createElement","Text","as","textWeight","typography","fontWeightLabels","marginBottom","textFontFamily","fontFamilyLabel","style","fontWeight","fontWeightBase","DateTextFieldWrapper","TextField","type","name","hideRequiredInLabel","maxLength","autoComplete","pattern","inputMode","value","hasError","LargeDateTextFieldWrapper","ErrorTextWrapper","ErrorText","marginTop"],"mappings":"oUA6CM,SAAUA,EAAUC,OACxBC,EAAKD,EAAAC,MACLC,EAAQF,EAAAE,SACRC,EAAGH,EAAAG,IACHC,EAAKJ,EAAAI,MACLC,EAAIL,EAAAK,KACJC,EAAeN,EAAAO,QAAfA,OAAO,IAAAD,EAAG,MAAKA,EACfE,EAAmBR,EAAAS,UAAnBA,OAAS,IAAAD,EAAG,QAAOA,EACnBE,aAAAC,aAAW,OAAMD,EACjBE,EAAWZ,EAAAY,YACXC,EAAab,EAAAa,cACbC,EAAYd,EAAAc,aACZC,iBACAC,EAAAhB,EAAAiB,SAAAA,OAAW,IAAAD,EAAA,WAEX,EAACA,EACDE,EAEClB,EAAAmB,OAFDA,OAAS,IAAAD,EAAA,WAET,EAACA,EACDE,EAECpB,EAAAqB,QAFDA,OAAU,IAAAD,EAAA,WAEV,IACAE,EAAQtB,EAAAsB,SACRC,EAAQvB,EAAAuB,SAGFC,EADQC,IAEd,OACEC,gBAACC,EAAQ,KACPD,EAACE,cAAAC,EACC,CAAAC,GAAG,SACHC,WAAYP,EAAWQ,WAAWC,kBAAoB,IACtDC,aAAa,MACbC,eAAgBX,EAAWQ,WAAWI,iBAErCnC,IACEsB,GACDG,EAAAE,cAAA,OAAA,CACES,MAAO,CACLC,WAAYd,EAAWQ,WAAWO,iBAGnC,gBAINrC,GAAYwB,EAAAE,cAACC,EAAI,KAAE3B,GACpBwB,EAAAE,cAACY,EAAoB,KACnBd,EAAAE,cAACa,EAAS,CACRxC,MAAM,MACNyC,KAAK,OACLC,KAAMpC,EACNgB,WAAYA,EACZqB,qBAAmB,EACnBC,UAAW,EACXC,aAAa,WACbC,QAAQ,SACRC,UAAU,UACVC,MAAO9C,EACPc,SAAUA,EACVE,OAAQA,EACRE,QAASA,EACT6B,SAAUtC,EACVU,SAAUA,KAGdI,EAAAE,cAACY,EAAoB,KACnBd,EAAAE,cAACa,EAAS,CACRxC,MAAM,QACNyC,KAAK,OACLC,KAAMlC,EACNc,WAAYA,EACZqB,qBAAmB,EACnBC,UAAW,EACXC,aAAa,aACbC,QAAQ,SACRC,UAAU,UACVC,MAAO7C,EACPa,SAAUA,EACVE,OAAQA,EACRE,QAASA,EACT6B,SAAUrC,EACVS,SAAUA,KAGdI,EAAAE,cAACuB,EAAyB,KACxBzB,EAAAE,cAACa,EAAS,CACRxC,MAAM,OACNyC,KAAK,OACLC,KAAMhC,EACNY,WAAYA,EACZqB,qBAAmB,EACnBC,UAAW,EACXC,aAAa,YACbC,QAAQ,SACRC,UAAU,UACVC,MAAO5C,EACPY,SAAUA,EACVE,OAAQA,EACRE,QAASA,EACT6B,SAAUpC,EACVQ,SAAUA,KAGbP,GACCW,EAAAE,cAACwB,EAAgB,KACf1B,EAAAE,cAACyB,EAAS,CAACC,UAAU,OAAOvC,IAKtC"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/DateField/index.tsx"],"sourcesContent":["import React, { type InputHTMLAttributes } from \"react\";\n\nimport { useTheme } from \"styled-components\";\nimport { ErrorText } from \"../ErrorText\";\nimport { Text } from \"../Text\";\nimport { TextField } from \"../TextField\";\n\nimport {\n  Fieldset,\n  DateTextFieldWrapper,\n  LargeDateTextFieldWrapper,\n  ErrorTextWrapper,\n} from \"./styles\";\nimport { type ThemeType } from \"../../types\";\n\nexport type DateFieldProps = InputHTMLAttributes<HTMLInputElement> & {\n  /** label text */\n  label: string;\n  /** hind text */\n  hintText?: string;\n  /** day field text value  */\n  day: string;\n  /** month field text value  */\n  month: string;\n  /** year field text value  */\n  year: string;\n  /** name passed to day field input element */\n  dayName?: string;\n  /** name passed to month field input element */\n  monthName?: string;\n  /** name passed to year field input element */\n  yearName?: string;\n  /** flag of error styling on day field */\n  dayHasError?: boolean;\n  /** flag of error styling on month field */\n  monthHasError?: boolean;\n  /** flag of error styling on year field */\n  yearHasError?: boolean;\n  /** error message text */\n  errorMessage?: string;\n};\n\n/**\n * To be used in forms entering dates like date of birth which are known dates and would take too long to get to with a date picker\n * */\nexport function DateField({\n  label,\n  hintText,\n  day,\n  month,\n  year,\n  dayName = \"day\",\n  monthName = \"month\",\n  yearName = \"year\",\n  dayHasError,\n  monthHasError,\n  yearHasError,\n  errorMessage,\n  onChange = () => {\n    // no op\n  },\n  onBlur = () => {\n    // no op\n  },\n  onFocus = () => {\n    // no op\n  },\n  disabled,\n  required,\n}: DateFieldProps) {\n  const theme = useTheme();\n  const typedTheme = theme as ThemeType;\n  return (\n    <Fieldset>\n      <Text\n        as=\"legend\"\n        textWeight={typedTheme.typography.fontWeightLabels || 700}\n        marginBottom=\"xxs\"\n        textFontFamily={typedTheme.typography.fontFamilyLabel}\n      >\n        {label}\n        {!!required && (\n          <span\n            style={{\n              fontWeight: typedTheme.typography.fontWeightBase,\n            }}\n          >\n            {` (required)`}\n          </span>\n        )}\n      </Text>\n      {hintText && <Text>{hintText}</Text>}\n      <DateTextFieldWrapper>\n        <TextField\n          label=\"Day\"\n          type=\"text\"\n          name={dayName}\n          required={!!required}\n          hideRequiredInLabel\n          maxLength={2}\n          autoComplete=\"bday-day\"\n          pattern=\"[0-9]*\"\n          inputMode=\"numeric\"\n          value={day}\n          onChange={onChange}\n          onBlur={onBlur}\n          onFocus={onFocus}\n          hasError={dayHasError}\n          disabled={disabled}\n        />\n      </DateTextFieldWrapper>\n      <DateTextFieldWrapper>\n        <TextField\n          label=\"Month\"\n          type=\"text\"\n          name={monthName}\n          required={!!required}\n          hideRequiredInLabel\n          maxLength={2}\n          autoComplete=\"bday-month\"\n          pattern=\"[0-9]*\"\n          inputMode=\"numeric\"\n          value={month}\n          onChange={onChange}\n          onBlur={onBlur}\n          onFocus={onFocus}\n          hasError={monthHasError}\n          disabled={disabled}\n        />\n      </DateTextFieldWrapper>\n      <LargeDateTextFieldWrapper>\n        <TextField\n          label=\"Year\"\n          type=\"text\"\n          name={yearName}\n          required={!!required}\n          hideRequiredInLabel\n          maxLength={4}\n          autoComplete=\"bday-year\"\n          pattern=\"[0-9]*\"\n          inputMode=\"numeric\"\n          value={year}\n          onChange={onChange}\n          onBlur={onBlur}\n          onFocus={onFocus}\n          hasError={yearHasError}\n          disabled={disabled}\n        />\n      </LargeDateTextFieldWrapper>\n      {errorMessage && (\n        <ErrorTextWrapper>\n          <ErrorText marginTop=\"xxs\">{errorMessage}</ErrorText>\n        </ErrorTextWrapper>\n      )}\n    </Fieldset>\n  );\n}\n\nexport default DateField;\n"],"names":["DateField","label","hintText","day","month","year","dayName","monthName","yearName","dayHasError","monthHasError","yearHasError","errorMessage","onChange","onBlur","onFocus","disabled","required","typedTheme","useTheme","React","Fieldset","createElement","Text","as","textWeight","typography","fontWeightLabels","marginBottom","textFontFamily","fontFamilyLabel","style","fontWeight","fontWeightBase","DateTextFieldWrapper","TextField","type","name","hideRequiredInLabel","maxLength","autoComplete","pattern","inputMode","value","hasError","LargeDateTextFieldWrapper","ErrorTextWrapper","ErrorText","marginTop"],"mappings":"6UA6CgBA,GAAUC,MACxBA,EAAKC,SACLA,EAAQC,IACRA,EAAGC,MACHA,EAAKC,KACLA,EAAIC,QACJA,EAAU,MAAKC,UACfA,EAAY,QAAOC,SACnBA,EAAW,OAAMC,YACjBA,EAAWC,cACXA,EAAaC,aACbA,EAAYC,aACZA,EAAYC,SACZA,EAAW,OAEVC,OACDA,EAAS,OAERC,QACDA,EAAU,OAETC,SACDA,EAAQC,SACRA,IAEA,MACMC,EADQC,IAEd,OACEC,gBAACC,EAAQ,KACPD,EAACE,cAAAC,EACC,CAAAC,GAAG,SACHC,WAAYP,EAAWQ,WAAWC,kBAAoB,IACtDC,aAAa,MACbC,eAAgBX,EAAWQ,WAAWI,iBAErC7B,IACEgB,GACDG,EAAAE,cAAA,OAAA,CACES,MAAO,CACLC,WAAYd,EAAWQ,WAAWO,iBAGnC,gBAIN/B,GAAYkB,EAAAE,cAACC,EAAI,KAAErB,GACpBkB,EAAAE,cAACY,EAAoB,KACnBd,EAAAE,cAACa,EAAS,CACRlC,MAAM,MACNmC,KAAK,OACLC,KAAM/B,EACNW,WAAYA,EACZqB,qBAAmB,EACnBC,UAAW,EACXC,aAAa,WACbC,QAAQ,SACRC,UAAU,UACVC,MAAOxC,EACPU,SAAUA,EACVC,OAAQA,EACRC,QAASA,EACT6B,SAAUnC,EACVO,SAAUA,KAGdI,EAAAE,cAACY,EAAoB,KACnBd,EAAAE,cAACa,EAAS,CACRlC,MAAM,QACNmC,KAAK,OACLC,KAAM9B,EACNU,WAAYA,EACZqB,qBAAmB,EACnBC,UAAW,EACXC,aAAa,aACbC,QAAQ,SACRC,UAAU,UACVC,MAAOvC,EACPS,SAAUA,EACVC,OAAQA,EACRC,QAASA,EACT6B,SAAUlC,EACVM,SAAUA,KAGdI,EAAAE,cAACuB,EAAyB,KACxBzB,EAAAE,cAACa,EAAS,CACRlC,MAAM,OACNmC,KAAK,OACLC,KAAM7B,EACNS,WAAYA,EACZqB,qBAAmB,EACnBC,UAAW,EACXC,aAAa,YACbC,QAAQ,SACRC,UAAU,UACVC,MAAOtC,EACPQ,SAAUA,EACVC,OAAQA,EACRC,QAASA,EACT6B,SAAUjC,EACVK,SAAUA,KAGbJ,GACCQ,EAAAE,cAACwB,EAAgB,KACf1B,EAAAE,cAACyB,EAAS,CAACC,UAAU,OAAOpC,IAKtC"}

package/lib/{components → src/components}/DateField/styles.d.ts

@@ -1,16 +1,22 @@
 import { type ThemeType } from "../../types";
 export declare const Fieldset: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").FieldsetHTMLAttributes<HTMLFieldSetElement>, HTMLFieldSetElement>, never>> & string;
-export declare const TextAsLabel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<Omit<import("../Text").TextProps, "ref"> & import("react").RefAttributes<HTMLElement>, "ref"> & {
-    ref?: ((instance: HTMLElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLElement> | null | undefined;
+export declare const TextAsLabel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("../Spacing").SpacingProps & import("react").HTMLAttributes<HTMLElement> & {
+    textColor?: string;
+    textAlign?: "left" | "right" | "center" | "justify";
+    textSize?: import("../../types").FontSizeType;
+    textWeight?: number | string;
+    textFontFamily?: string;
+    as?: import("react").ElementType;
+    wordBreak?: import("../../types").WordBreakType;
+    overflowWrap?: import("../../types").OverflowWrapType;
+    ref?: import("react").Ref<HTMLElement>;
 }, {
     theme: ThemeType;
-}>> & string & Omit<import("react").ForwardRefExoticComponent<Omit<import("../Text").TextProps, "ref"> & import("react").RefAttributes<HTMLElement>>, keyof import("react").Component<any, {}, any>>;
+}>> & string & Omit<(props: import("../Text").TextProps) => import("react").JSX.Element, keyof import("react").Component<any, {}, any>>;
 export declare const DateTextFieldWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
     theme: ThemeType;
 }>> & string;
-export declare const LargeDateTextFieldWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "theme"> & {
+export declare const LargeDateTextFieldWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "theme"> & {
     theme: ThemeType;
-}, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
 }, never>> & string;
 export declare const ErrorTextWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/lib/src/components/DateField/styles.js

@@ -1,2 +1,27 @@
-import{__makeTemplateObject as n}from"../../../node_modules/tslib/tslib.es6.js";import i from"styled-components";import{Text as o}from"../Text/index.js";var r=i.fieldset(e||(e=n(["\n  margin: 0;\n  padding: 0;\n  border: 0;\n  *,\n  *:after,\n  *:before {\n    -webkit-box-sizing: border-box;\n    -moz-box-sizing: border-box;\n    box-sizing: border-box;\n  }\n"],["\n  margin: 0;\n  padding: 0;\n  border: 0;\n  *,\n  *:after,\n  *:before {\n    -webkit-box-sizing: border-box;\n    -moz-box-sizing: border-box;\n    box-sizing: border-box;\n  }\n"])));i(o)(t||(t=n(["\n  font-family: ",";\n"],["\n  font-family: ",";\n"])),(function(n){return n.theme.typography.fontFamilyLabel}));var e,t,a,s,b,m=i.div(a||(a=n(["\n  display: inline-block;\n  width: 60px;\n  margin-right: ",";\n  span {\n    margin-bottom: 0.25rem; // this is smaller than xxs spacing\n    font-weight: ",";\n  }\n"],["\n  display: inline-block;\n  width: 60px;\n  margin-right: ",";\n  span {\n    margin-bottom: 0.25rem; // this is smaller than xxs spacing\n    font-weight: ",";\n  }\n"])),(function(n){return n.theme.spacing.xs}),(function(n){return n.theme.typography.fontWeightBase})),d=i(m)(s||(s=n(["\n  width: 80px;\n"],["\n  width: 80px;\n"]))),g=i.div(b||(b=n(["\n  clear: left;\n"],["\n  clear: left;\n"])));export{m as DateTextFieldWrapper,g as ErrorTextWrapper,r as Fieldset,d as LargeDateTextFieldWrapper};
+import i from"styled-components";import{Text as e}from"../Text/index.js";const o=i.fieldset`
+  margin: 0;
+  padding: 0;
+  border: 0;
+  *,
+  *:after,
+  *:before {
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+  }
+`;i(e)`
+  font-family: ${({theme:i})=>i.typography.fontFamilyLabel};
+`;const t=i.div`
+  display: inline-block;
+  width: 60px;
+  margin-right: ${({theme:i})=>i.spacing.xs};
+  span {
+    margin-bottom: 0.25rem; // this is smaller than xxs spacing
+    font-weight: ${({theme:i})=>i.typography.fontWeightBase};
+  }
+`,r=i(t)`
+  width: 80px;
+`,n=i.div`
+  clear: left;
+`;export{t as DateTextFieldWrapper,n as ErrorTextWrapper,o as Fieldset,r as LargeDateTextFieldWrapper};
 //# sourceMappingURL=styles.js.map

package/lib/src/components/DateField/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sources":["../../../../src/components/DateField/styles.ts"],"sourcesContent":["import styled from \"styled-components\";\nimport { type ThemeType } from \"../../types\";\nimport Text from \"../Text\";\n\nexport const Fieldset = styled.fieldset`\n  margin: 0;\n  padding: 0;\n  border: 0;\n  *,\n  *:after,\n  *:before {\n    -webkit-box-sizing: border-box;\n    -moz-box-sizing: border-box;\n    box-sizing: border-box;\n  }\n`;\n\nexport const TextAsLabel = styled(Text)<{ theme: ThemeType }>`\n  font-family: ${({ theme }) => theme.typography.fontFamilyLabel};\n`;\n\nexport const DateTextFieldWrapper = styled.div<{ theme: ThemeType }>`\n  display: inline-block;\n  width: 60px;\n  margin-right: ${({ theme }) => theme.spacing.xs};\n  span {\n    margin-bottom: 0.25rem; // this is smaller than xxs spacing\n    font-weight: ${({ theme }) => theme.typography.fontWeightBase};\n  }\n`;\n\nexport const LargeDateTextFieldWrapper = styled(DateTextFieldWrapper)`\n  width: 80px;\n`;\n\nexport const ErrorTextWrapper = styled.div`\n  clear: left;\n`;\n"],"names":["Fieldset","styled","fieldset","templateObject_1","__makeTemplateObject","Text","templateObject_2","_a","theme","typography","fontFamilyLabel","DateTextFieldWrapper","div","templateObject_3","spacing","xs","fontWeightBase","LargeDateTextFieldWrapper","templateObject_4","ErrorTextWrapper","templateObject_5"],"mappings":"yJAIa,IAAAA,EAAWC,EAAOC,SAAQC,IAAAA,EAAAC,EAAA,CAAA,0LAAA,CAAA,6LAaZH,EAAOI,EAAPJ,CAAYK,IAAAA,EAAAF,EAAA,CAAA,oBAAA,OAAA,CAAsB,oBACG,UAA/C,SAACG,GAAc,OAAPA,EAAAC,MAAaC,WAAWC,eAAjB,IAGzB,cAAMC,EAAuBV,EAAOW,IAAyBC,IAAAA,EAAAT,EAAA,CAAA,+DAAA,kGAAA,YAAA,CAAA,+DAGnB,kGAGgB,eAH/C,SAACG,GAAc,OAAPA,EAAAC,MAAaM,QAAQC,EAAd,IAGd,SAACR,GAAc,OAAPA,EAAAC,MAAaC,WAAWO,cAAjB,IAIrBC,EAA4BhB,EAAOU,EAAPV,CAA4BiB,IAAAA,EAAAd,EAAA,CAAA,sBAAA,CAAA,yBAIxDe,EAAmBlB,EAAOW,IAAGQ,IAAAA,EAAAhB,EAAA,CAAA,sBAAA,CAAA"}
+{"version":3,"file":"styles.js","sources":["../../../../src/components/DateField/styles.ts"],"sourcesContent":["import styled from \"styled-components\";\nimport { type ThemeType } from \"../../types\";\nimport Text from \"../Text\";\n\nexport const Fieldset = styled.fieldset`\n  margin: 0;\n  padding: 0;\n  border: 0;\n  *,\n  *:after,\n  *:before {\n    -webkit-box-sizing: border-box;\n    -moz-box-sizing: border-box;\n    box-sizing: border-box;\n  }\n`;\n\nexport const TextAsLabel = styled(Text)<{ theme: ThemeType }>`\n  font-family: ${({ theme }) => theme.typography.fontFamilyLabel};\n`;\n\nexport const DateTextFieldWrapper = styled.div<{ theme: ThemeType }>`\n  display: inline-block;\n  width: 60px;\n  margin-right: ${({ theme }) => theme.spacing.xs};\n  span {\n    margin-bottom: 0.25rem; // this is smaller than xxs spacing\n    font-weight: ${({ theme }) => theme.typography.fontWeightBase};\n  }\n`;\n\nexport const LargeDateTextFieldWrapper = styled(DateTextFieldWrapper)`\n  width: 80px;\n`;\n\nexport const ErrorTextWrapper = styled.div`\n  clear: left;\n`;\n"],"names":["Fieldset","styled","fieldset","Text","theme","typography","fontFamilyLabel","DateTextFieldWrapper","div","spacing","xs","fontWeightBase","LargeDateTextFieldWrapper","ErrorTextWrapper"],"mappings":"yEAIa,MAAAA,EAAWC,EAAOC,QAAQ;;;;;;;;;;;EAaZD,EAAOE,EAA2B;iBAC5C,EAAGC,WAAYA,EAAMC,WAAWC;EAGpC,MAAAC,EAAuBN,EAAOO,GAAyB;;;kBAGlD,EAAGJ,WAAYA,EAAMK,QAAQC;;;mBAG5B,EAAGN,WAAYA,EAAMC,WAAWM;;EAItCC,EAA4BX,EAAOM,EAAqB;;EAIxDM,EAAmBZ,EAAOO,GAAG;;"}

package/lib/src/components/Divider.js

@@ -1,2 +1,18 @@
-import{__makeTemplateObject as n}from"../../node_modules/tslib/tslib.es6.js";import e from"react";import t from"styled-components";var i,o=t.div(i||(i=n(['\n  align-items: center;\n  display: flex;\n  flex-basis: 100%;\n  padding-bottom: 10px;\n  padding-top: 10px;\n  text-align: center;\n  width: 100%;\n  &:before,\n  &:after {\n    background-color: #333;\n    content: "";\n    display: inline-block;\n    flex-grow: 1;\n    height: 1px;\n  }\n'],['\n  align-items: center;\n  display: flex;\n  flex-basis: 100%;\n  padding-bottom: 10px;\n  padding-top: 10px;\n  text-align: center;\n  width: 100%;\n  &:before,\n  &:after {\n    background-color: #333;\n    content: "";\n    display: inline-block;\n    flex-grow: 1;\n    height: 1px;\n  }\n']))),l=function(n){var t=n.children;return e.createElement(o,null,t)};export{l as Divider,l as default};
+import e from"react";import t from"styled-components";const o=t.div`
+  align-items: center;
+  display: flex;
+  flex-basis: 100%;
+  padding-bottom: 10px;
+  padding-top: 10px;
+  text-align: center;
+  width: 100%;
+  &:before,
+  &:after {
+    background-color: #333;
+    content: "";
+    display: inline-block;
+    flex-grow: 1;
+    height: 1px;
+  }
+`,n=({children:t})=>e.createElement(o,null,t);export{n as Divider,n as default};
 //# sourceMappingURL=Divider.js.map

package/lib/src/components/Divider.js.map

@@ -1 +1 @@
-{"version":3,"file":"Divider.js","sources":["../../../src/components/Divider.tsx"],"sourcesContent":["import React, { type ReactNode } from \"react\";\nimport styled from \"styled-components\";\n\nconst StyledDivider = styled.div`\n  align-items: center;\n  display: flex;\n  flex-basis: 100%;\n  padding-bottom: 10px;\n  padding-top: 10px;\n  text-align: center;\n  width: 100%;\n  &:before,\n  &:after {\n    background-color: #333;\n    content: \"\";\n    display: inline-block;\n    flex-grow: 1;\n    height: 1px;\n  }\n`;\n\nexport const Divider = ({ children }: { children?: ReactNode }) => (\n  <StyledDivider>{children}</StyledDivider>\n);\n\nexport default Divider;\n"],"names":["StyledDivider","styled","div","templateObject_1","__makeTemplateObject","Divider","_a","children","React","createElement"],"mappings":"mIAGA,MAAMA,EAAgBC,EAAOC,IAAGC,IAAAA,EAAAC,EAAA,CAAA,0SAAA,CAAA,6SAkBnBC,EAAU,SAACC,GAAE,IAAAC,EAAQD,EAAAC,SAAiC,OACjEC,EAACC,cAAAT,EAAe,KAAAO,EADiD"}
+{"version":3,"file":"Divider.js","sources":["../../../src/components/Divider.tsx"],"sourcesContent":["import React, { type ReactNode } from \"react\";\nimport styled from \"styled-components\";\n\nconst StyledDivider = styled.div`\n  align-items: center;\n  display: flex;\n  flex-basis: 100%;\n  padding-bottom: 10px;\n  padding-top: 10px;\n  text-align: center;\n  width: 100%;\n  &:before,\n  &:after {\n    background-color: #333;\n    content: \"\";\n    display: inline-block;\n    flex-grow: 1;\n    height: 1px;\n  }\n`;\n\nexport const Divider = ({ children }: { children?: ReactNode }) => (\n  <StyledDivider>{children}</StyledDivider>\n);\n\nexport default Divider;\n"],"names":["StyledDivider","styled","div","Divider","children","React","createElement"],"mappings":"sDAGA,MAAMA,EAAgBC,EAAOC,GAAG;;;;;;;;;;;;;;;;EAkBnBC,EAAU,EAAGC,cACxBC,EAACC,cAAAN,OAAeI"}

package/lib/{components → src/components}/ErrorText/ErrorText.stories.d.ts

@@ -1,4 +1,4 @@
-import { StoryObj } from "@storybook/react";
+import { type StoryObj } from "@storybook/react";
 import ErrorText from ".";
 declare const _default: {
     title: string;

package/lib/src/components/ErrorText/index.js

@@ -1,2 +1,2 @@
-import{__rest as e,__assign as o}from"../../../node_modules/tslib/tslib.es6.js";import r from"react";import{useTheme as t}from"styled-components";import{faTriangleExclamation as s}from"../../../node_modules/@fortawesome/free-solid-svg-icons/index.js";import{crukTheme as m}from"../../themes/cruk.js";import{StyledErrorText as n}from"./styles.js";import{IconFa as i}from"../IconFa/index.js";import{Box as a}from"../Box/index.js";function l(l){var d=l.children,f=l.as,p=void 0===f?"span":f,c=e(l,["children","as"]),u=t(),x=o(o({},m),u),h="string"==typeof d&&d.length;return r.createElement(n,o({forwardedAs:p},c,{theme:x,role:"alert"}),h?r.createElement(a,{as:"span",marginRight:"xxs"},r.createElement(i,{faIcon:s,size:"1em"})):null,d)}export{l as ErrorText,l as default};
+import e from"react";import{useTheme as o}from"styled-components";import{faTriangleExclamation as r}from"../../../node_modules/@fortawesome/free-solid-svg-icons/index.js";import{crukTheme as t}from"../../themes/cruk.js";import{StyledErrorText as s}from"./styles.js";import{IconFa as m}from"../IconFa/index.js";import{Box as n}from"../Box/index.js";function i({children:i,as:a="span",...f}){const l=o(),c={...t,...l},p="string"==typeof i&&i.length;return e.createElement(s,{forwardedAs:a,...f,theme:c,role:"alert"},p?e.createElement(n,{as:"span",marginRight:"xxs"},e.createElement(m,{faIcon:r,size:"1em"})):null,i)}export{i as ErrorText,i as default};
 //# sourceMappingURL=index.js.map

package/lib/src/components/ErrorText/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/ErrorText/index.tsx"],"sourcesContent":["import React, { type HTMLAttributes } from \"react\";\nimport { useTheme } from \"styled-components\";\n\nimport { faTriangleExclamation } from \"@fortawesome/free-solid-svg-icons\";\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\nimport { type SpacingProps } from \"../Spacing\";\nimport { StyledErrorText } from \"./styles\";\nimport { IconFa } from \"../IconFa\";\nimport { Box } from \"../Box\";\n\nexport type ErrorTextProps = SpacingProps &\n  HTMLAttributes<HTMLElement> & {\n    as?: React.ElementType;\n  };\n\n/**\n *\n * To be used in forms for inline validation. Applies styling and accessibility attribute so that it will be read by screen readers.\n *\n * Please be aware that some input components already have this component built in and can be passed an \"errorMessage\" prop\n */\nexport function ErrorText({ children, as = \"span\", ...props }: ErrorTextProps) {\n  const foundTheme = useTheme();\n  const theme = {\n    ...defaultTheme,\n    ...foundTheme,\n  };\n\n  const shouldShowIcon = typeof children === \"string\" && children.length;\n  return (\n    <StyledErrorText forwardedAs={as} {...props} theme={theme} role=\"alert\">\n      {shouldShowIcon ? (\n        <Box as=\"span\" marginRight=\"xxs\">\n          <IconFa faIcon={faTriangleExclamation} size=\"1em\" />\n        </Box>\n      ) : null}\n      {children}\n    </StyledErrorText>\n  );\n}\n\nexport default ErrorText;\n"],"names":["ErrorText","_a","children","_b","as","props","__rest","foundTheme","useTheme","theme","__assign","defaultTheme","shouldShowIcon","length","React","createElement","StyledErrorText","forwardedAs","role","Box","marginRight","IconFa","faIcon","faTriangleExclamation","size"],"mappings":"4aAqBM,SAAUA,EAAUC,GAAE,IAAAC,EAAQD,EAAAC,SAAEC,EAAAF,EAAAG,GAAAA,OAAK,IAAAD,EAAA,OAAMA,EAAKE,EAAKC,EAAAL,EAAjC,mBAClBM,EAAaC,IACbC,EACDC,EAAAA,EAAA,CAAA,EAAAC,GACAJ,GAGCK,EAAqC,iBAAbV,GAAyBA,EAASW,OAChE,OACEC,EAACC,cAAAC,EAAgBN,EAAA,CAAAO,YAAab,GAAQC,EAAK,CAAEI,MAAOA,EAAOS,KAAK,UAC7DN,EACCE,EAACC,cAAAI,EAAI,CAAAf,GAAG,OAAOgB,YAAY,OACzBN,EAAAC,cAACM,EAAM,CAACC,OAAQC,EAAuBC,KAAK,SAE5C,KACHtB,EAGP"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/ErrorText/index.tsx"],"sourcesContent":["import React, { type HTMLAttributes } from \"react\";\nimport { useTheme } from \"styled-components\";\n\nimport { faTriangleExclamation } from \"@fortawesome/free-solid-svg-icons\";\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\nimport { type SpacingProps } from \"../Spacing\";\nimport { StyledErrorText } from \"./styles\";\nimport { IconFa } from \"../IconFa\";\nimport { Box } from \"../Box\";\n\nexport type ErrorTextProps = SpacingProps &\n  HTMLAttributes<HTMLElement> & {\n    as?: React.ElementType;\n  };\n\n/**\n *\n * To be used in forms for inline validation. Applies styling and accessibility attribute so that it will be read by screen readers.\n *\n * Please be aware that some input components already have this component built in and can be passed an \"errorMessage\" prop\n */\nexport function ErrorText({ children, as = \"span\", ...props }: ErrorTextProps) {\n  const foundTheme = useTheme();\n  const theme = {\n    ...defaultTheme,\n    ...foundTheme,\n  };\n\n  const shouldShowIcon = typeof children === \"string\" && children.length;\n  return (\n    <StyledErrorText forwardedAs={as} {...props} theme={theme} role=\"alert\">\n      {shouldShowIcon ? (\n        <Box as=\"span\" marginRight=\"xxs\">\n          <IconFa faIcon={faTriangleExclamation} size=\"1em\" />\n        </Box>\n      ) : null}\n      {children}\n    </StyledErrorText>\n  );\n}\n\nexport default ErrorText;\n"],"names":["ErrorText","children","as","props","foundTheme","useTheme","theme","defaultTheme","shouldShowIcon","length","React","createElement","StyledErrorText","forwardedAs","role","Box","marginRight","IconFa","faIcon","faTriangleExclamation","size"],"mappings":"4VAqBgB,SAAAA,GAAUC,SAAEA,EAAQC,GAAEA,EAAK,UAAWC,IACpD,MAAMC,EAAaC,IACbC,EAAQ,IACTC,KACAH,GAGCI,EAAqC,iBAAbP,GAAyBA,EAASQ,OAChE,OACEC,EAACC,cAAAC,EAAgB,CAAAC,YAAaX,KAAQC,EAAOG,MAAOA,EAAOQ,KAAK,SAC7DN,EACCE,EAACC,cAAAI,EAAI,CAAAb,GAAG,OAAOc,YAAY,OACzBN,EAAAC,cAACM,EAAM,CAACC,OAAQC,EAAuBC,KAAK,SAE5C,KACHnB,EAGP"}

package/lib/src/components/ErrorText/styles.d.ts

@@ -0,0 +1,16 @@
+import { type ThemeType } from "../../types";
+type ThemeProps = {
+    theme: ThemeType;
+};
+export declare const StyledErrorText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("../Spacing").SpacingProps & import("react").HTMLAttributes<HTMLElement> & {
+    textColor?: string;
+    textAlign?: "left" | "right" | "center" | "justify";
+    textSize?: import("../../types").FontSizeType;
+    textWeight?: number | string;
+    textFontFamily?: string;
+    as?: import("react").ElementType;
+    wordBreak?: import("../../types").WordBreakType;
+    overflowWrap?: import("../../types").OverflowWrapType;
+    ref?: import("react").Ref<HTMLElement>;
+}, ThemeProps>> & string & Omit<(props: import("../Text").TextProps) => import("react").JSX.Element, keyof import("react").Component<any, {}, any>>;
+export default StyledErrorText;

package/lib/src/components/ErrorText/styles.js

@@ -1,2 +1,6 @@
-import{__makeTemplateObject as o}from"../../../node_modules/tslib/tslib.es6.js";import n from"styled-components";import{Text as t}from"../Text/index.js";var e,r=n(t)(e||(e=o(["\n  display: inline-block;\n  color: ",";\n  font-weight: ",";\n"],["\n  display: inline-block;\n  color: ",";\n  font-weight: ",";\n"])),(function(o){return o.theme.colors.textError}),(function(o){return o.theme.typography.fontWeightHeavy}));export{r as StyledErrorText,r as default};
+import o from"styled-components";import{Text as t}from"../Text/index.js";const e=o(t)`
+  display: inline-block;
+  color: ${({theme:o})=>o.colors.textError};
+  font-weight: ${({theme:o})=>o.typography.fontWeightHeavy};
+`;export{e as StyledErrorText,e as default};
 //# sourceMappingURL=styles.js.map

package/lib/src/components/ErrorText/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sources":["../../../../src/components/ErrorText/styles.ts"],"sourcesContent":["import styled from \"styled-components\";\nimport Text from \"../Text\";\nimport { type ThemeType } from \"../../types\";\n\ntype ThemeProps = {\n  theme: ThemeType;\n};\nexport const StyledErrorText = styled(Text)<ThemeProps>`\n  display: inline-block;\n  color: ${({ theme }) => theme.colors.textError};\n  font-weight: ${({ theme }) => theme.typography.fontWeightHeavy};\n`;\n\nexport default StyledErrorText;\n"],"names":["StyledErrorText","styled","Text","templateObject_1","__makeTemplateObject","_a","theme","colors","textError","typography","fontWeightHeavy"],"mappings":"yJAOa,MAAAA,EAAkBC,EAAOC,EAAPD,CAAwBE,IAAAA,EAAAC,EAAA,CAAA,wCAAA,qBAAA,OAAA,CAAA,wCAEP,qBACgB,UADrD,SAACC,GAAc,OAAPA,EAAAC,MAAaC,OAAOC,SAAb,IACT,SAACH,GAAc,OAAPA,EAAAC,MAAaG,WAAWC,eAAjB"}
+{"version":3,"file":"styles.js","sources":["../../../../src/components/ErrorText/styles.ts"],"sourcesContent":["import styled from \"styled-components\";\nimport Text from \"../Text\";\nimport { type ThemeType } from \"../../types\";\n\ntype ThemeProps = {\n  theme: ThemeType;\n};\nexport const StyledErrorText = styled(Text)<ThemeProps>`\n  display: inline-block;\n  color: ${({ theme }) => theme.colors.textError};\n  font-weight: ${({ theme }) => theme.typography.fontWeightHeavy};\n`;\n\nexport default StyledErrorText;\n"],"names":["StyledErrorText","styled","Text","theme","colors","textError","typography","fontWeightHeavy"],"mappings":"+EAOaA,EAAkBC,EAAOC,EAAiB;;WAE5C,EAAGC,WAAYA,EAAMC,OAAOC;iBACtB,EAAGF,WAAYA,EAAMG,WAAWC;"}

package/lib/src/components/Flex.js

@@ -1,2 +1,8 @@
-import{__makeTemplateObject as e,__assign as n}from"../../node_modules/tslib/tslib.es6.js";import t from"react";import i from"styled-components";import{spacing as r,spacingPropsToSpacingPropsInternal as m}from"./Spacing/index.js";var o,a=i.div(o||(o=e(["\n  display: block;\n  @media (min-width: ",") {\n    display: flex;\n  }\n  ","\n"],["\n  display: block;\n  @media (min-width: ",") {\n    display: flex;\n  }\n  ","\n"])),(function(e){return e.theme.breakpoint.tablet}),(function(e){return r(e,e.theme)}));function l(e){var i=m(e);return t.createElement(a,n({theme:e.theme},i))}export{l as Flex,l as default};
+import e from"react";import t from"styled-components";import{spacing as m,spacingPropsToSpacingPropsInternal as o}from"./Spacing/index.js";const i=t.div`
+  display: block;
+  @media (min-width: ${({theme:e})=>e.breakpoint.tablet}) {
+    display: flex;
+  }
+  ${e=>m(e,e.theme)}
+`;function n(t){const m=o(t);return e.createElement(i,{theme:t.theme,...m})}export{n as Flex,n as default};
 //# sourceMappingURL=Flex.js.map

package/lib/src/components/Flex.js.map

@@ -1 +1 @@
-{"version":3,"file":"Flex.js","sources":["../../../src/components/Flex.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"styled-components\";\nimport {\n  spacing,\n  type SpacingPropsInternal,\n  spacingPropsToSpacingPropsInternal,\n  type SpacingProps,\n} from \"./Spacing\";\nimport { type ThemeType } from \"../types\";\n\ntype StyledProps = SpacingPropsInternal & {\n  theme: ThemeType;\n};\n\nconst FlexStyled = styled.div<StyledProps>`\n  display: block;\n  @media (min-width: ${({ theme }) => theme.breakpoint.tablet}) {\n    display: flex;\n  }\n  ${(props) => spacing(props, props.theme as ThemeType)}\n`;\n\ntype Props = SpacingProps & {\n  theme: ThemeType;\n};\nexport function Flex(props: Props) {\n  const spacingProps = spacingPropsToSpacingPropsInternal(props);\n\n  return <FlexStyled theme={props.theme} {...spacingProps} />;\n}\n\nexport default Flex;\n"],"names":["FlexStyled","styled","div","templateObject_1","__makeTemplateObject","_a","theme","breakpoint","tablet","props","spacing","Flex","spacingProps","spacingPropsToSpacingPropsInternal","React","createElement","__assign"],"mappings":"sOAcA,MAAMA,EAAaC,EAAOC,IAAGC,IAAAA,EAAAC,EAAA,CAAA,6CAAA,mCAAA,MAAA,CAAa,6CAEmB,mCAGN,SAHhC,SAACC,GAAc,OAAPA,EAAAC,MAAaC,WAAWC,MAAjB,IAGlC,SAACC,GAAU,OAAAC,EAAQD,EAAOA,EAAMH,UAM9B,SAAUK,EAAKF,GACnB,IAAMG,EAAeC,EAAmCJ,GAExD,OAAOK,EAAAC,cAACf,EAAUgB,EAAA,CAACV,MAAOG,EAAMH,OAAWM,GAC7C"}
+{"version":3,"file":"Flex.js","sources":["../../../src/components/Flex.tsx"],"sourcesContent":["import React from \"react\";\nimport styled from \"styled-components\";\nimport {\n  spacing,\n  type SpacingPropsInternal,\n  spacingPropsToSpacingPropsInternal,\n  type SpacingProps,\n} from \"./Spacing\";\nimport { type ThemeType } from \"../types\";\n\ntype StyledProps = SpacingPropsInternal & {\n  theme: ThemeType;\n};\n\nconst FlexStyled = styled.div<StyledProps>`\n  display: block;\n  @media (min-width: ${({ theme }) => theme.breakpoint.tablet}) {\n    display: flex;\n  }\n  ${(props) => spacing(props, props.theme as ThemeType)}\n`;\n\ntype Props = SpacingProps & {\n  theme: ThemeType;\n};\nexport function Flex(props: Props) {\n  const spacingProps = spacingPropsToSpacingPropsInternal(props);\n\n  return <FlexStyled theme={props.theme} {...spacingProps} />;\n}\n\nexport default Flex;\n"],"names":["FlexStyled","styled","div","theme","breakpoint","tablet","props","spacing","Flex","spacingProps","spacingPropsToSpacingPropsInternal","React","createElement"],"mappings":"2IAcA,MAAMA,EAAaC,EAAOC,GAAgB;;uBAEnB,EAAGC,WAAYA,EAAMC,WAAWC;;;IAGlDC,GAAUC,EAAQD,EAAOA,EAAMH;EAM9B,SAAUK,EAAKF,GACnB,MAAMG,EAAeC,EAAmCJ,GAExD,OAAOK,EAAAC,cAACZ,EAAU,CAACG,MAAOG,EAAMH,SAAWM,GAC7C"}

package/lib/src/components/Fontface.js

@@ -1,2 +1,2 @@
-import{crukTheme as o}from"../themes/cruk.js";import{rflTheme as t}from"../themes/rfl.js";import{su2cTheme as n}from"../themes/su2c.js";import{bowelbabeTheme as f}from"../themes/bowelbabe.js";var c=function(o){return o.map((function(o){return"\n        @font-face {\n          font-family: ".concat(o.family,";\n          src: ").concat((null==o?void 0:o.urlWoff2)?'url("'.concat(o.urlWoff2,"\") format('woff2')"):"").concat(o.urlWoff&&(null==o?void 0:o.urlWoff2)?", ":"","\n          ").concat((null==o?void 0:o.urlWoff)?'url("'.concat(o.urlWoff,"\") format('woff')"):"",";\n          font-weight: ").concat(o.fontWeight||"normal",";\n          font-style: normal;\n          font-display: fallback;\n        }\n      ")})).join("")},r="\n".concat(c(o.typography.customFonts),"\n").concat(c(t.typography.customFonts),"\n").concat(c(n.typography.customFonts),"\n").concat(c(f.typography.customFonts),"\n");export{r as Fontface,c as buildCustomFonts,r as default};
+import{crukTheme as o}from"../themes/cruk.js";import{rflTheme as f}from"../themes/rfl.js";import{su2cTheme as t}from"../themes/su2c.js";import{bowelbabeTheme as n}from"../themes/bowelbabe.js";const r=o=>o.map((o=>`\n        @font-face {\n          font-family: ${o.family};\n          src: ${o?.urlWoff2?`url("${o.urlWoff2}") format('woff2')`:""}${o.urlWoff&&o?.urlWoff2?", ":""}\n          ${o?.urlWoff?`url("${o.urlWoff}") format('woff')`:""};\n          font-weight: ${o.fontWeight||"normal"};\n          font-style: normal;\n          font-display: fallback;\n        }\n      `)).join(""),m=`\n${r(o.typography.customFonts)}\n${r(f.typography.customFonts)}\n${r(t.typography.customFonts)}\n${r(n.typography.customFonts)}\n`;export{m as Fontface,r as buildCustomFonts,m as default};
 //# sourceMappingURL=Fontface.js.map

package/lib/src/components/Fontface.js.map

@@ -1 +1 @@
-{"version":3,"file":"Fontface.js","sources":["../../../src/components/Fontface.ts"],"sourcesContent":["import { type CustomFontType } from \"../types\";\nimport { crukTheme } from \"../themes/cruk\";\nimport { rflTheme } from \"../themes/rfl\";\nimport { su2cTheme } from \"../themes/su2c\";\nimport { bowelbabeTheme } from \"../themes/bowelbabe\";\n\n// font-display fall back to stop font's flickering on SSR rehydration\nexport const buildCustomFonts = (customFonts: CustomFontType[]) =>\n  customFonts\n    .map(\n      (font) => `\n        @font-face {\n          font-family: ${font.family};\n          src: ${\n            font?.urlWoff2 ? `url(\"${font.urlWoff2}\") format('woff2')` : \"\"\n          }${!!font.urlWoff && !!font?.urlWoff2 ? \", \" : \"\"}\n          ${font?.urlWoff ? `url(\"${font.urlWoff}\") format('woff')` : \"\"};\n          font-weight: ${font.fontWeight || \"normal\"};\n          font-style: normal;\n          font-display: fallback;\n        }\n      `,\n    )\n    .join(\"\");\n\nexport const Fontface = `\n${buildCustomFonts(crukTheme.typography.customFonts)}\n${buildCustomFonts(rflTheme.typography.customFonts)}\n${buildCustomFonts(su2cTheme.typography.customFonts)}\n${buildCustomFonts(bowelbabeTheme.typography.customFonts)}\n`;\n\nexport default Fontface;\n"],"names":["buildCustomFonts","customFonts","map","font","concat","family","urlWoff2","urlWoff","fontWeight","join","Fontface","crukTheme","typography","rflTheme","su2cTheme","bowelbabeTheme"],"mappings":"gMAOO,IAAMA,EAAmB,SAACC,GAC/B,OAAAA,EACGC,KACC,SAACC,GAAS,MAAA,kDAAAC,OAESD,EAAKE,OAElB,sBAAAD,QAAAD,eAAAA,EAAMG,UAAW,QAAAF,OAAQD,EAAKG,gCAA+B,IAAEF,OAC5DD,EAAKI,UAAaJ,aAAA,EAAAA,EAAMG,UAAW,KAAO,2BAC7CH,aAAI,EAAJA,EAAMI,SAAU,QAAQH,OAAAD,EAAKI,QAAO,sBAAsB,GAC7C,8BAAAH,OAAAD,EAAKK,YAAc,SAIrC,yFAAA,IAEFC,KAAK,GAfR,EAiBWC,EAAW,KACtBN,OAAAJ,EAAiBW,EAAUC,WAAWX,aAAY,MAAAG,OAClDJ,EAAiBa,EAASD,WAAWX,0BACrCD,EAAiBc,EAAUF,WAAWX,0BACtCD,EAAiBe,EAAeH,WAAWX"}
+{"version":3,"file":"Fontface.js","sources":["../../../src/components/Fontface.ts"],"sourcesContent":["import { type CustomFontType } from \"../types\";\nimport { crukTheme } from \"../themes/cruk\";\nimport { rflTheme } from \"../themes/rfl\";\nimport { su2cTheme } from \"../themes/su2c\";\nimport { bowelbabeTheme } from \"../themes/bowelbabe\";\n\n// font-display fall back to stop font's flickering on SSR rehydration\nexport const buildCustomFonts = (customFonts: CustomFontType[]) =>\n  customFonts\n    .map(\n      (font) => `\n        @font-face {\n          font-family: ${font.family};\n          src: ${\n            font?.urlWoff2 ? `url(\"${font.urlWoff2}\") format('woff2')` : \"\"\n          }${!!font.urlWoff && !!font?.urlWoff2 ? \", \" : \"\"}\n          ${font?.urlWoff ? `url(\"${font.urlWoff}\") format('woff')` : \"\"};\n          font-weight: ${font.fontWeight || \"normal\"};\n          font-style: normal;\n          font-display: fallback;\n        }\n      `,\n    )\n    .join(\"\");\n\nexport const Fontface = `\n${buildCustomFonts(crukTheme.typography.customFonts)}\n${buildCustomFonts(rflTheme.typography.customFonts)}\n${buildCustomFonts(su2cTheme.typography.customFonts)}\n${buildCustomFonts(bowelbabeTheme.typography.customFonts)}\n`;\n\nexport default Fontface;\n"],"names":["buildCustomFonts","customFonts","map","font","family","urlWoff2","urlWoff","fontWeight","join","Fontface","crukTheme","typography","rflTheme","su2cTheme","bowelbabeTheme"],"mappings":"sMAOaA,EAAoBC,GAC/BA,EACGC,KACEC,GAAS,kDAESA,EAAKC,2BAElBD,GAAME,SAAW,QAAQF,EAAKE,6BAA+B,KAC1DF,EAAKG,SAAaH,GAAME,SAAW,KAAO,iBAC7CF,GAAMG,QAAU,QAAQH,EAAKG,2BAA6B,+BAC7CH,EAAKI,YAAc,mGAMvCC,KAAK,IAEGC,EAAW,KACtBT,EAAiBU,EAAUC,WAAWV,iBACtCD,EAAiBY,EAASD,WAAWV,iBACrCD,EAAiBa,EAAUF,WAAWV,iBACtCD,EAAiBc,EAAeH,WAAWV"}

package/lib/{components → src/components}/Footer/Footer.stories.d.ts

@@ -1,6 +1,6 @@
 import React from "react";
-import { StoryObj } from "@storybook/react";
-import Footer, { FooterProps } from ".";
+import { type StoryObj } from "@storybook/react";
+import Footer, { type FooterProps } from ".";
 declare const _default: {
     title: string;
     component: typeof Footer;

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

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/Footer/index.tsx"],"sourcesContent":["import React, { type ReactNode, type HTMLAttributes } from \"react\";\nimport { useTheme, ThemeProvider } from \"styled-components\";\n\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\nimport { Text } from \"../Text\";\n\nimport {\n  StyledFooter,\n  FooterContentWrapper,\n  FooterSectionLogo,\n  FooterSection,\n  FooterSectionAddress,\n  StyledAddress,\n  StyledRegulatorLogo,\n  FooterSectionLinks,\n  StyledNav,\n  StyledUL,\n  StyledLI,\n} from \"./styles\";\n\nexport type FooterProps = HTMLAttributes<HTMLElement> & {\n  /** used to customise text in middle section, it could also be react element, this is not to be confused with the component children which is primarily for the links in the footer */\n  middleSection?: ReactNode;\n  children?: ReactNode;\n};\n\n/**\n * There should be only one footer component at the bottom of the body of each page. Links can be passed as children\n * */\nexport function Footer({ children, middleSection }: FooterProps) {\n  const childArray = React.Children.toArray(children);\n\n  const foundTheme = useTheme();\n  const theme = {\n    ...defaultTheme,\n    ...foundTheme,\n  };\n\n  return (\n    <ThemeProvider theme={theme}>\n      <StyledFooter>\n        <FooterContentWrapper>\n          <FooterSectionLogo>\n            <StyledRegulatorLogo\n              width={130}\n              height={40}\n              alt={theme.siteConfig.footerLogoAlt || \"\"}\n              src={theme.siteConfig.footerLogoSrc || \"\"}\n            />\n          </FooterSectionLogo>\n          <FooterSectionLinks>\n            <StyledNav aria-label=\"footer links\">\n              <StyledUL>\n                {childArray.length\n                  ? childArray.map((child, index) => {\n                      const footerLinkKey = `footerLink${index}`;\n                      return <StyledLI key={footerLinkKey}>{child}</StyledLI>;\n                    })\n                  : null}\n              </StyledUL>\n            </StyledNav>\n          </FooterSectionLinks>\n\n          <FooterSection>\n            {middleSection ? (\n              typeof middleSection === \"string\" ? (\n                <Text textSize=\"s\">{middleSection}</Text>\n              ) : (\n                <>{middleSection}</>\n              )\n            ) : (\n              <Text textSize=\"s\">{theme.siteConfig.footerCopyText}</Text>\n            )}\n          </FooterSection>\n\n          <FooterSectionAddress>\n            <StyledAddress>\n              <Text as=\"span\" textSize=\"s\">\n                2 Redman Place\n              </Text>\n              <Text as=\"span\" textSize=\"s\">\n                London\n              </Text>\n              <Text as=\"span\" textSize=\"s\">\n                E20 1JQ\n              </Text>\n            </StyledAddress>\n          </FooterSectionAddress>\n        </FooterContentWrapper>\n      </StyledFooter>\n    </ThemeProvider>\n  );\n}\n\nexport default Footer;\n"],"names":["Footer","_a","children","middleSection","childArray","React","Children","toArray","foundTheme","useTheme","theme","__assign","defaultTheme","createElement","ThemeProvider","StyledFooter","FooterContentWrapper","FooterSectionLogo","StyledRegulatorLogo","width","height","alt","siteConfig","footerLogoAlt","src","footerLogoSrc","FooterSectionLinks","StyledNav","StyledUL","length","map","child","index","footerLinkKey","concat","StyledLI","key","FooterSection","Text","textSize","Fragment","footerCopyText","FooterSectionAddress","StyledAddress","as"],"mappings":"0eA6BM,SAAUA,EAAOC,OAAEC,EAAQD,EAAAC,SAAEC,EAAaF,EAAAE,cACxCC,EAAaC,EAAMC,SAASC,QAAQL,GAEpCM,EAAaC,IACbC,EACDC,EAAAA,EAAA,CAAA,EAAAC,GACAJ,GAGL,OACEH,EAACQ,cAAAC,EAAc,CAAAJ,MAAOA,GACpBL,EAAAQ,cAACE,EAAY,KACXV,EAAAQ,cAACG,EAAoB,KACnBX,EAAAQ,cAACI,EAAiB,KAChBZ,EAAAQ,cAACK,EAAmB,CAClBC,MAAO,IACPC,OAAQ,GACRC,IAAKX,EAAMY,WAAWC,eAAiB,GACvCC,IAAKd,EAAMY,WAAWG,eAAiB,MAG3CpB,EAAAQ,cAACa,EAAkB,KACjBrB,EAACQ,cAAAc,gBAAqB,gBACpBtB,EAAAQ,cAACe,EAAQ,KACNxB,EAAWyB,OACRzB,EAAW0B,KAAI,SAACC,EAAOC,GACrB,IAAMC,EAAgB,aAAaC,OAAAF,GACnC,OAAO3B,EAAAQ,cAACsB,EAAS,CAAAC,IAAKH,GAAgBF,EACvC,IACD,QAKV1B,EAACQ,cAAAwB,EACE,KAAAlC,EAC0B,iBAAlBA,EACLE,EAACQ,cAAAyB,EAAK,CAAAC,SAAS,KAAKpC,GAEpBE,EAAGQ,cAAAR,EAAAmC,SAAA,KAAArC,GAGLE,EAACQ,cAAAyB,GAAKC,SAAS,KAAK7B,EAAMY,WAAWmB,iBAIzCpC,EAAAQ,cAAC6B,EAAoB,KACnBrC,EAAAQ,cAAC8B,EAAa,KACZtC,EAACQ,cAAAyB,GAAKM,GAAG,OAAOL,SAAS,KAElB,kBACPlC,EAACQ,cAAAyB,GAAKM,GAAG,OAAOL,SAAS,KAElB,UACPlC,EAAAQ,cAACyB,EAAK,CAAAM,GAAG,OAAOL,SAAS,KAAG,eAS1C"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/Footer/index.tsx"],"sourcesContent":["import React, { type ReactNode, type HTMLAttributes } from \"react\";\nimport { useTheme, ThemeProvider } from \"styled-components\";\n\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\nimport { Text } from \"../Text\";\n\nimport {\n  StyledFooter,\n  FooterContentWrapper,\n  FooterSectionLogo,\n  FooterSection,\n  FooterSectionAddress,\n  StyledAddress,\n  StyledRegulatorLogo,\n  FooterSectionLinks,\n  StyledNav,\n  StyledUL,\n  StyledLI,\n} from \"./styles\";\n\nexport type FooterProps = HTMLAttributes<HTMLElement> & {\n  /** used to customise text in middle section, it could also be react element, this is not to be confused with the component children which is primarily for the links in the footer */\n  middleSection?: ReactNode;\n  children?: ReactNode;\n};\n\n/**\n * There should be only one footer component at the bottom of the body of each page. Links can be passed as children\n * */\nexport function Footer({ children, middleSection }: FooterProps) {\n  const childArray = React.Children.toArray(children);\n\n  const foundTheme = useTheme();\n  const theme = {\n    ...defaultTheme,\n    ...foundTheme,\n  };\n\n  return (\n    <ThemeProvider theme={theme}>\n      <StyledFooter>\n        <FooterContentWrapper>\n          <FooterSectionLogo>\n            <StyledRegulatorLogo\n              width={130}\n              height={40}\n              alt={theme.siteConfig.footerLogoAlt || \"\"}\n              src={theme.siteConfig.footerLogoSrc || \"\"}\n            />\n          </FooterSectionLogo>\n          <FooterSectionLinks>\n            <StyledNav aria-label=\"footer links\">\n              <StyledUL>\n                {childArray.length\n                  ? childArray.map((child, index) => {\n                      const footerLinkKey = `footerLink${index}`;\n                      return <StyledLI key={footerLinkKey}>{child}</StyledLI>;\n                    })\n                  : null}\n              </StyledUL>\n            </StyledNav>\n          </FooterSectionLinks>\n\n          <FooterSection>\n            {middleSection ? (\n              typeof middleSection === \"string\" ? (\n                <Text textSize=\"s\">{middleSection}</Text>\n              ) : (\n                <>{middleSection}</>\n              )\n            ) : (\n              <Text textSize=\"s\">{theme.siteConfig.footerCopyText}</Text>\n            )}\n          </FooterSection>\n\n          <FooterSectionAddress>\n            <StyledAddress>\n              <Text as=\"span\" textSize=\"s\">\n                2 Redman Place\n              </Text>\n              <Text as=\"span\" textSize=\"s\">\n                London\n              </Text>\n              <Text as=\"span\" textSize=\"s\">\n                E20 1JQ\n              </Text>\n            </StyledAddress>\n          </FooterSectionAddress>\n        </FooterContentWrapper>\n      </StyledFooter>\n    </ThemeProvider>\n  );\n}\n\nexport default Footer;\n"],"names":["Footer","children","middleSection","childArray","React","Children","toArray","foundTheme","useTheme","theme","defaultTheme","createElement","ThemeProvider","StyledFooter","FooterContentWrapper","FooterSectionLogo","StyledRegulatorLogo","width","height","alt","siteConfig","footerLogoAlt","src","footerLogoSrc","FooterSectionLinks","StyledNav","StyledUL","length","map","child","index","footerLinkKey","StyledLI","key","FooterSection","Text","textSize","Fragment","footerCopyText","FooterSectionAddress","StyledAddress","as"],"mappings":"+aA6BgBA,GAAOC,SAAEA,EAAQC,cAAEA,IACjC,MAAMC,EAAaC,EAAMC,SAASC,QAAQL,GAEpCM,EAAaC,IACbC,EAAQ,IACTC,KACAH,GAGL,OACEH,EAACO,cAAAC,EAAc,CAAAH,MAAOA,GACpBL,EAAAO,cAACE,EAAY,KACXT,EAAAO,cAACG,EAAoB,KACnBV,EAAAO,cAACI,EAAiB,KAChBX,EAAAO,cAACK,EAAmB,CAClBC,MAAO,IACPC,OAAQ,GACRC,IAAKV,EAAMW,WAAWC,eAAiB,GACvCC,IAAKb,EAAMW,WAAWG,eAAiB,MAG3CnB,EAAAO,cAACa,EAAkB,KACjBpB,EAACO,cAAAc,gBAAqB,gBACpBrB,EAAAO,cAACe,EAAQ,KACNvB,EAAWwB,OACRxB,EAAWyB,KAAI,CAACC,EAAOC,KACrB,MAAMC,EAAgB,aAAaD,IACnC,OAAO1B,EAAAO,cAACqB,EAAS,CAAAC,IAAKF,GAAgBF,EAAiB,IAEzD,QAKVzB,EAACO,cAAAuB,EACE,KAAAhC,EAC0B,iBAAlBA,EACLE,EAACO,cAAAwB,EAAK,CAAAC,SAAS,KAAKlC,GAEpBE,EAAGO,cAAAP,EAAAiC,SAAA,KAAAnC,GAGLE,EAACO,cAAAwB,GAAKC,SAAS,KAAK3B,EAAMW,WAAWkB,iBAIzClC,EAAAO,cAAC4B,EAAoB,KACnBnC,EAAAO,cAAC6B,EAAa,KACZpC,EAACO,cAAAwB,GAAKM,GAAG,OAAOL,SAAS,KAElB,kBACPhC,EAACO,cAAAwB,GAAKM,GAAG,OAAOL,SAAS,KAElB,UACPhC,EAAAO,cAACwB,EAAK,CAAAM,GAAG,OAAOL,SAAS,KAAG,eAS1C"}

package/lib/{components → src/components}/Footer/styles.d.ts

@@ -5,18 +5,12 @@ type ThemeProps = {
 export declare const StyledFooter: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, ThemeProps>> & string;
 export declare const FooterContentWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, ThemeProps>> & string;
 export declare const FooterSection: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, ThemeProps>> & string;
-export declare const FooterSectionLogo: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "theme"> & ThemeProps, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}, never>> & string;
-export declare const FooterSectionLinks: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "theme"> & ThemeProps, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}, never>> & string;
+export declare const FooterSectionLogo: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "theme"> & ThemeProps, never>> & string;
+export declare const FooterSectionLinks: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "theme"> & ThemeProps, never>> & string;
 export declare const StyledNav: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, ThemeProps>> & string;
 export declare const StyledUL: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, never>> & string;
 export declare const StyledLI: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, ThemeProps>> & string;
-export declare const FooterSectionAddress: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "theme"> & ThemeProps, "ref"> & {
-    ref?: ((instance: HTMLDivElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}, never>> & string;
+export declare const FooterSectionAddress: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "theme"> & ThemeProps, never>> & string;
 export declare const StyledRegulatorLogo: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, never>> & string;
 export declare const StyledAddress: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, never>> & string;
 export {};

package/lib/src/components/Footer/styles.js

@@ -1,2 +1,70 @@
-import{__makeTemplateObject as n}from"../../../node_modules/tslib/tslib.es6.js";import i from"styled-components";var t,e,o,l,d,a,r,s,p,f,c,h=i.footer(t||(t=n(["\n  ",";\n  box-sizing: border-box;\n  display: block;\n  position: relative;\n  width: 100%;\n  background-color: ",";\n"],["\n  ",";\n  box-sizing: border-box;\n  display: block;\n  position: relative;\n  width: 100%;\n  background-color: ",";\n"])),(function(n){return n.theme.colors.inputBorder}),(function(n){return n.theme.colors.footerBackground})),m=i.div(e||(e=n(["\n  max-width: ",";\n  display: block;\n  margin: 0 auto;\n\n  @media (min-width: ",") {\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n  }\n"],["\n  max-width: ",";\n  display: block;\n  margin: 0 auto;\n\n  @media (min-width: ",") {\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n  }\n"])),(function(n){return n.theme.utilities.contentMaxWidth}),(function(n){return n.theme.breakpoint.desktop})),u=i.div(o||(o=n(["\n  box-sizing: border-box;\n  display: inline-block;\n  padding: ",";\n  position: relative;\n  width: 100%;\n  flex: 0 1 auto;\n"],["\n  box-sizing: border-box;\n  display: inline-block;\n  padding: ",";\n  position: relative;\n  width: 100%;\n  flex: 0 1 auto;\n"])),(function(n){return n.theme.spacing.xs})),x=i(u)(l||(l=n(["\n  width: 50%;\n  display: block;\n  float: left;\n\n  @media (min-width: ",") {\n    flex: 0 0 140px;\n    width: auto;\n  }\n"],["\n  width: 50%;\n  display: block;\n  float: left;\n\n  @media (min-width: ",") {\n    flex: 0 0 140px;\n    width: auto;\n  }\n"])),(function(n){return n.theme.breakpoint.desktop})),b=i(u)(d||(d=n(["\n  width: 50%;\n  display: block;\n  float: left;\n\n  @media (min-width: ",") {\n    flex: 0 0 170px;\n    width: auto;\n  }\n"],["\n  width: 50%;\n  display: block;\n  float: left;\n\n  @media (min-width: ",") {\n    flex: 0 0 170px;\n    width: auto;\n  }\n"])),(function(n){return n.theme.breakpoint.desktop})),g=i.nav(a||(a=n(["\n  display: flex;\n  flex-direction: column;\n  a {\n    font-size: ",";\n    font-weight: ",";\n  }\n"],["\n  display: flex;\n  flex-direction: column;\n  a {\n    font-size: ",";\n    font-weight: ",";\n  }\n"])),(function(n){return n.theme.fontSizes.s}),(function(n){return n.theme.typography.fontWeightLinks})),y=i.ul(r||(r=n(["\n  padding: 0;\n  margin: 0;\n"],["\n  padding: 0;\n  margin: 0;\n"]))),w=i.li(s||(s=n(["\n  list-style-type: none;\n  display: block;\n  padding: 0;\n  margin: 0;\n  line-height: 1;\n  padding-bottom: ",";\n"],["\n  list-style-type: none;\n  display: block;\n  padding: 0;\n  margin: 0;\n  line-height: 1;\n  padding-bottom: ",";\n"])),(function(n){return n.theme.spacing.xxs})),k=i(u)(p||(p=n(["\n  flex: 0 0 150px;\n"],["\n  flex: 0 0 150px;\n"]))),v=i.img(f||(f=n(["\n  height: 40px;\n  width: auto;\n"],["\n  height: 40px;\n  width: auto;\n"]))),z=i.address(c||(c=n(["\n  display: flex;\n  flex-direction: column;\n  font-style: normal;\n"],["\n  display: flex;\n  flex-direction: column;\n  font-style: normal;\n"])));export{m as FooterContentWrapper,u as FooterSection,k as FooterSectionAddress,b as FooterSectionLinks,x as FooterSectionLogo,z as StyledAddress,h as StyledFooter,w as StyledLI,g as StyledNav,v as StyledRegulatorLogo,y as StyledUL};
+import e from"styled-components";const i=e.footer`
+  ${({theme:e})=>e.colors.inputBorder};
+  box-sizing: border-box;
+  display: block;
+  position: relative;
+  width: 100%;
+  background-color: ${({theme:e})=>e.colors.footerBackground};
+`,t=e.div`
+  max-width: ${({theme:e})=>e.utilities.contentMaxWidth};
+  display: block;
+  margin: 0 auto;
+
+  @media (min-width: ${({theme:e})=>e.breakpoint.desktop}) {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+  }
+`,o=e.div`
+  box-sizing: border-box;
+  display: inline-block;
+  padding: ${({theme:e})=>e.spacing.xs};
+  position: relative;
+  width: 100%;
+  flex: 0 1 auto;
+`,d=e(o)`
+  width: 50%;
+  display: block;
+  float: left;
+
+  @media (min-width: ${({theme:e})=>e.breakpoint.desktop}) {
+    flex: 0 0 140px;
+    width: auto;
+  }
+`,n=e(o)`
+  width: 50%;
+  display: block;
+  float: left;
+
+  @media (min-width: ${({theme:e})=>e.breakpoint.desktop}) {
+    flex: 0 0 170px;
+    width: auto;
+  }
+`,l=e.nav`
+  display: flex;
+  flex-direction: column;
+  a {
+    font-size: ${({theme:e})=>e.fontSizes.s};
+    font-weight: ${({theme:{typography:{fontWeightLinks:e}}})=>e};
+  }
+`,a=e.ul`
+  padding: 0;
+  margin: 0;
+`,s=e.li`
+  list-style-type: none;
+  display: block;
+  padding: 0;
+  margin: 0;
+  line-height: 1;
+  padding-bottom: ${({theme:{spacing:{xxs:e}}})=>e};
+`,p=e(o)`
+  flex: 0 0 150px;
+`,r=e.img`
+  height: 40px;
+  width: auto;
+`,h=e.address`
+  display: flex;
+  flex-direction: column;
+  font-style: normal;
+`;export{t as FooterContentWrapper,o as FooterSection,p as FooterSectionAddress,n as FooterSectionLinks,d as FooterSectionLogo,h as StyledAddress,i as StyledFooter,s as StyledLI,l as StyledNav,r as StyledRegulatorLogo,a as StyledUL};
 //# sourceMappingURL=styles.js.map

package/lib/src/components/Footer/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sources":["../../../../src/components/Footer/styles.ts"],"sourcesContent":["import styled from \"styled-components\";\nimport { type ThemeType } from \"../../types\";\n\ntype ThemeProps = {\n  theme: ThemeType;\n};\nexport const StyledFooter = styled.footer<ThemeProps>`\n  ${({ theme }) => theme.colors.inputBorder};\n  box-sizing: border-box;\n  display: block;\n  position: relative;\n  width: 100%;\n  background-color: ${({ theme }) => theme.colors.footerBackground};\n`;\n\nexport const FooterContentWrapper = styled.div<ThemeProps>`\n  max-width: ${({ theme }) => theme.utilities.contentMaxWidth};\n  display: block;\n  margin: 0 auto;\n\n  @media (min-width: ${({ theme }) => theme.breakpoint.desktop}) {\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n  }\n`;\n\nexport const FooterSection = styled.div<ThemeProps>`\n  box-sizing: border-box;\n  display: inline-block;\n  padding: ${({ theme }) => theme.spacing.xs};\n  position: relative;\n  width: 100%;\n  flex: 0 1 auto;\n`;\n\nexport const FooterSectionLogo = styled(FooterSection)`\n  width: 50%;\n  display: block;\n  float: left;\n\n  @media (min-width: ${({ theme }) => theme.breakpoint.desktop}) {\n    flex: 0 0 140px;\n    width: auto;\n  }\n`;\n\n// TODO: I'm assuming here that the links have fixed width here with a flex basis\n// and the company info expands to fill the gap but it could be the other way round\nexport const FooterSectionLinks = styled(FooterSection)`\n  width: 50%;\n  display: block;\n  float: left;\n\n  @media (min-width: ${({ theme }) => theme.breakpoint.desktop}) {\n    flex: 0 0 170px;\n    width: auto;\n  }\n`;\n\nexport const StyledNav = styled.nav<ThemeProps>`\n  display: flex;\n  flex-direction: column;\n  a {\n    font-size: ${({ theme }) => theme.fontSizes.s};\n    font-weight: ${({\n      theme: {\n        typography: { fontWeightLinks },\n      },\n    }: ThemeProps) => fontWeightLinks};\n  }\n`;\n\nexport const StyledUL = styled.ul`\n  padding: 0;\n  margin: 0;\n`;\n\nexport const StyledLI = styled.li<ThemeProps>`\n  list-style-type: none;\n  display: block;\n  padding: 0;\n  margin: 0;\n  line-height: 1;\n  padding-bottom: ${({\n    theme: {\n      spacing: { xxs },\n    },\n  }) => xxs};\n`;\n\nexport const FooterSectionAddress = styled(FooterSection)`\n  flex: 0 0 150px;\n`;\n\nexport const StyledRegulatorLogo = styled.img`\n  height: 40px;\n  width: auto;\n`;\n\nexport const StyledAddress = styled.address`\n  display: flex;\n  flex-direction: column;\n  font-style: normal;\n`;\n"],"names":["StyledFooter","styled","footer","templateObject_1","__makeTemplateObject","_a","theme","colors","inputBorder","footerBackground","FooterContentWrapper","div","templateObject_2","utilities","contentMaxWidth","breakpoint","desktop","FooterSection","templateObject_3","spacing","xs","FooterSectionLogo","templateObject_4","FooterSectionLinks","templateObject_5","StyledNav","nav","templateObject_6","fontSizes","s","typography","fontWeightLinks","StyledUL","ul","templateObject_7","StyledLI","li","templateObject_8","xxs","FooterSectionAddress","templateObject_9","StyledRegulatorLogo","img","templateObject_10","StyledAddress","address","templateObject_11"],"mappings":"iHAMO,0BAAMA,EAAeC,EAAOC,OAAkBC,IAAAA,EAAAC,EAAA,CAAA,OAAA,+GAAA,OAAA,CAAA,OACV,+GAKuB,UAL9D,SAACC,GAAc,OAAPA,EAAAC,MAAaC,OAAOC,WAAb,IAKG,SAACH,GAAc,OAAPA,EAAAC,MAAaC,OAAOE,gBAAb,IAGxBC,EAAuBT,EAAOU,IAAeC,IAAAA,EAAAR,EAAA,CAAA,kBAAA,mEAAA,iGAAA,CAAA,kBACG,mEAIC,oGAJ/C,SAACC,GAAc,OAAPA,EAAAC,MAAaO,UAAUC,eAAhB,IAIP,SAACT,GAAc,OAAPA,EAAAC,MAAaS,WAAWC,OAAjB,IAOzBC,EAAgBhB,EAAOU,IAAGO,IAAAA,EAAAd,EAAA,CAAA,qEAAA,iEAAA,CAAY,qEAGP,oEAA/B,SAACC,GAAc,OAAPA,EAAAC,MAAaa,QAAQC,EAAd,IAMfC,EAAoBpB,EAAOgB,EAAPhB,CAAqBqB,IAAAA,EAAAlB,EAAA,CAAA,8EAAA,sDAAA,CAAA,8EAKQ,yDAAvC,SAACC,GAAc,OAAPA,EAAAC,MAAaS,WAAWC,OAAjB,IAQzBO,EAAqBtB,EAAOgB,EAAPhB,CAAqBuB,IAAAA,EAAApB,EAAA,CAAA,8EAAA,sDAAA,CAAA,8EAKO,yDAAvC,SAACC,GAAc,OAAPA,EAAAC,MAAaS,WAAWC,OAAjB,IAMzBS,EAAYxB,EAAOyB,IAAeC,IAAAA,EAAAvB,EAAA,CAAA,wEAAA,uBAAA,YAAA,CAAA,wEAIE,uBAKZ,eALpB,SAACC,GAAc,OAAPA,EAAAC,MAAasB,UAAUC,CAAhB,IACb,SAACxB,GAIE,OAFeA,EAAAC,MAAAwB,WAAAC,eAEf,IAITC,EAAW/B,EAAOgC,GAAEC,IAAAA,EAAA9B,EAAA,CAAA,mCAAA,CAAA,sCAKpB+B,EAAWlC,EAAOmC,GAAEC,IAAAA,EAAAjC,EAAA,CAAA,oHAAA,OAAA,CAAY,oHAUlC,UAJS,SAACC,GAIb,OAFYA,EAAAC,MAAAa,QAAAmB,GAEZ,IAGKC,EAAuBtC,EAAOgB,EAAPhB,CAAqBuC,IAAAA,EAAApC,EAAA,CAAA,0BAAA,CAAA,6BAI5CqC,EAAsBxC,EAAOyC,IAAGC,IAAAA,EAAAvC,EAAA,CAAA,uCAAA,CAAA,0CAKhCwC,EAAgB3C,EAAO4C,QAAOC,IAAAA,EAAA1C,EAAA,CAAA,0EAAA,CAAA"}
+{"version":3,"file":"styles.js","sources":["../../../../src/components/Footer/styles.ts"],"sourcesContent":["import styled from \"styled-components\";\nimport { type ThemeType } from \"../../types\";\n\ntype ThemeProps = {\n  theme: ThemeType;\n};\nexport const StyledFooter = styled.footer<ThemeProps>`\n  ${({ theme }) => theme.colors.inputBorder};\n  box-sizing: border-box;\n  display: block;\n  position: relative;\n  width: 100%;\n  background-color: ${({ theme }) => theme.colors.footerBackground};\n`;\n\nexport const FooterContentWrapper = styled.div<ThemeProps>`\n  max-width: ${({ theme }) => theme.utilities.contentMaxWidth};\n  display: block;\n  margin: 0 auto;\n\n  @media (min-width: ${({ theme }) => theme.breakpoint.desktop}) {\n    display: flex;\n    flex-direction: row;\n    justify-content: space-between;\n  }\n`;\n\nexport const FooterSection = styled.div<ThemeProps>`\n  box-sizing: border-box;\n  display: inline-block;\n  padding: ${({ theme }) => theme.spacing.xs};\n  position: relative;\n  width: 100%;\n  flex: 0 1 auto;\n`;\n\nexport const FooterSectionLogo = styled(FooterSection)`\n  width: 50%;\n  display: block;\n  float: left;\n\n  @media (min-width: ${({ theme }) => theme.breakpoint.desktop}) {\n    flex: 0 0 140px;\n    width: auto;\n  }\n`;\n\n// TODO: I'm assuming here that the links have fixed width here with a flex basis\n// and the company info expands to fill the gap but it could be the other way round\nexport const FooterSectionLinks = styled(FooterSection)`\n  width: 50%;\n  display: block;\n  float: left;\n\n  @media (min-width: ${({ theme }) => theme.breakpoint.desktop}) {\n    flex: 0 0 170px;\n    width: auto;\n  }\n`;\n\nexport const StyledNav = styled.nav<ThemeProps>`\n  display: flex;\n  flex-direction: column;\n  a {\n    font-size: ${({ theme }) => theme.fontSizes.s};\n    font-weight: ${({\n      theme: {\n        typography: { fontWeightLinks },\n      },\n    }: ThemeProps) => fontWeightLinks};\n  }\n`;\n\nexport const StyledUL = styled.ul`\n  padding: 0;\n  margin: 0;\n`;\n\nexport const StyledLI = styled.li<ThemeProps>`\n  list-style-type: none;\n  display: block;\n  padding: 0;\n  margin: 0;\n  line-height: 1;\n  padding-bottom: ${({\n    theme: {\n      spacing: { xxs },\n    },\n  }) => xxs};\n`;\n\nexport const FooterSectionAddress = styled(FooterSection)`\n  flex: 0 0 150px;\n`;\n\nexport const StyledRegulatorLogo = styled.img`\n  height: 40px;\n  width: auto;\n`;\n\nexport const StyledAddress = styled.address`\n  display: flex;\n  flex-direction: column;\n  font-style: normal;\n`;\n"],"names":["StyledFooter","styled","footer","theme","colors","inputBorder","footerBackground","FooterContentWrapper","div","utilities","contentMaxWidth","breakpoint","desktop","FooterSection","spacing","xs","FooterSectionLogo","FooterSectionLinks","StyledNav","nav","fontSizes","s","typography","fontWeightLinks","StyledUL","ul","StyledLI","li","xxs","FooterSectionAddress","StyledRegulatorLogo","img","StyledAddress","address"],"mappings":"iCAMa,MAAAA,EAAeC,EAAOC,MAAkB;IACjD,EAAGC,WAAYA,EAAMC,OAAOC;;;;;sBAKV,EAAGF,WAAYA,EAAMC,OAAOE;EAGrCC,EAAuBN,EAAOO,GAAe;eAC3C,EAAGL,WAAYA,EAAMM,UAAUC;;;;uBAIvB,EAAGP,WAAYA,EAAMQ,WAAWC;;;;;EAO1CC,EAAgBZ,EAAOO,GAAe;;;aAGtC,EAAGL,WAAYA,EAAMW,QAAQC;;;;EAM7BC,EAAoBf,EAAOY,EAAc;;;;;uBAK/B,EAAGV,WAAYA,EAAMQ,WAAWC;;;;EAQ1CK,EAAqBhB,EAAOY,EAAc;;;;;uBAKhC,EAAGV,WAAYA,EAAMQ,WAAWC;;;;EAM1CM,EAAYjB,EAAOkB,GAAe;;;;iBAI9B,EAAGhB,WAAYA,EAAMiB,UAAUC;mBAC7B,EACblB,OACEmB,YAAcC,uBAEAA;;EAITC,EAAWvB,EAAOwB,EAAE;;;EAKpBC,EAAWzB,EAAO0B,EAAc;;;;;;oBAMzB,EAChBxB,OACEW,SAAWc,WAETA;EAGKC,EAAuB5B,EAAOY,EAAc;;EAI5CiB,EAAsB7B,EAAO8B,GAAG;;;EAKhCC,EAAgB/B,EAAOgC,OAAO;;;;"}

package/lib/src/components/GlobalStyle.d.ts

@@ -0,0 +1,2 @@
+export declare const GlobalStyle: import("react").ForwardRefExoticComponent<Omit<JSX.LibraryManagedAttributes<T, import("styled-components").ExecutionProps>, "ref"> & import("react").RefAttributes<import("react").NamedExoticComponent<import("styled-components").ExecutionProps & object>>> & {};
+export default GlobalStyle;

package/lib/src/components/GlobalStyle.js

@@ -1,2 +1,38 @@
-import{__makeTemplateObject as n,__assign as o}from"../../node_modules/tslib/tslib.es6.js";import{withTheme as t,createGlobalStyle as e}from"styled-components";import{crukTheme as i}from"../themes/cruk.js";var r,a=t(e(r||(r=n(["\n  ","\n  *, *:after, *:before {\n    -webkit-box-sizing: border-box;\n    -moz-box-sizing: border-box;\n    box-sizing: border-box;\n  }\n  \n  @media (prefers-reduced-motion: reduce) {\n    *, *:after, *:before {\n      animation-play-state: paused !important;\n      animation-direction: reverse !important;\n      transition: none !important;\n      scroll-behavior: auto !important;\n    }\n  }\n\n  table, td, th {\n    border-spacing: 0;\n    border: 1px solid #ccc;\n    padding: 10px;\n  }\n  .no-focus-outline a:focus,\n  .no-focus-outline button:focus {\n    outline: none;\n  }\n  img {\n    width: 100%;\n    height: auto;\n  }\n  section {\n    width: 100%;\n  }\n    button {\n    font-size: 1em;\n  }\n"],["\n  ","\n  *, *:after, *:before {\n    -webkit-box-sizing: border-box;\n    -moz-box-sizing: border-box;\n    box-sizing: border-box;\n  }\n  \n  @media (prefers-reduced-motion: reduce) {\n    *, *:after, *:before {\n      animation-play-state: paused !important;\n      animation-direction: reverse !important;\n      transition: none !important;\n      scroll-behavior: auto !important;\n    }\n  }\n\n  table, td, th {\n    border-spacing: 0;\n    border: 1px solid #ccc;\n    padding: 10px;\n  }\n  .no-focus-outline a:focus,\n  .no-focus-outline button:focus {\n    outline: none;\n  }\n  img {\n    width: 100%;\n    height: auto;\n  }\n  section {\n    width: 100%;\n  }\n    button {\n    font-size: 1em;\n  }\n"])),(function(n){var t,e=o(o({},i),n.theme);return"\n      ".concat((t=e.typography.customFonts,t.map((function(n){return"\n        @font-face {\n          font-family: ".concat(n.family,";\n          src: ").concat((null==n?void 0:n.urlWoff2)?'url("'.concat(n.urlWoff2,"\") format('woff2')"):"").concat(n.urlWoff&&(null==n?void 0:n.urlWoff2)?", ":"","\n          ").concat((null==n?void 0:n.urlWoff)?'url("'.concat(n.urlWoff,"\") format('woff')"):"",";\n          font-weight: ").concat(null==n?void 0:n.fontWeight,";\n          font-style: normal;\n          font-display: fallback;\n        }\n      ")})).join("")),"\n      html {\n        font-size: ").concat(e.typography.fontSizeBase,";\n        font-family: ").concat(e.typography.fontFamilyBase,";\n        line-height: ").concat(e.typography.lineHeight,";\n      }\n      body {\n        background-color: ").concat(e.colors.backgroundMidLight,";\n        color: ").concat(e.colors.textDark,";\n        margin: 0;\n        padding: 0;\n        overflow-x: hidden;\n        -webkit-text-size-adjust: 100%;\n        -moz-text-size-adjust: none;\n        -ms-text-size-adjust: 100%;\n      }\n    ")})));a.defaultProps={theme:i};export{a as GlobalStyle,a as default};
+import{withTheme as o,createGlobalStyle as t}from"styled-components";import{crukTheme as n}from"../themes/cruk.js";const e=o(t`
+  ${o=>{const t={...n,...o.theme};return`\n      ${e=t.typography.customFonts,e.map((o=>`\n        @font-face {\n          font-family: ${o.family};\n          src: ${o?.urlWoff2?`url("${o.urlWoff2}") format('woff2')`:""}${o.urlWoff&&o?.urlWoff2?", ":""}\n          ${o?.urlWoff?`url("${o.urlWoff}") format('woff')`:""};\n          font-weight: ${o?.fontWeight};\n          font-style: normal;\n          font-display: fallback;\n        }\n      `)).join("")}\n      html {\n        font-size: ${t.typography.fontSizeBase};\n        font-family: ${t.typography.fontFamilyBase};\n        line-height: ${t.typography.lineHeight};\n      }\n      body {\n        background-color: ${t.colors.backgroundMidLight};\n        color: ${t.colors.textDark};\n        margin: 0;\n        padding: 0;\n        overflow-x: hidden;\n        -webkit-text-size-adjust: 100%;\n        -moz-text-size-adjust: none;\n        -ms-text-size-adjust: 100%;\n      }\n    `;var e}}
+  *, *:after, *:before {
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+  }
+  
+  @media (prefers-reduced-motion: reduce) {
+    *, *:after, *:before {
+      animation-play-state: paused !important;
+      animation-direction: reverse !important;
+      transition: none !important;
+      scroll-behavior: auto !important;
+    }
+  }
+
+  table, td, th {
+    border-spacing: 0;
+    border: 1px solid #ccc;
+    padding: 10px;
+  }
+  .no-focus-outline a:focus,
+  .no-focus-outline button:focus {
+    outline: none;
+  }
+  img {
+    width: 100%;
+    height: auto;
+  }
+  section {
+    width: 100%;
+  }
+    button {
+    font-size: 1em;
+  }
+`);export{e as GlobalStyle,e as default};
 //# sourceMappingURL=GlobalStyle.js.map

package/lib/src/components/GlobalStyle.js.map

@@ -1 +1 @@
-{"version":3,"file":"GlobalStyle.js","sources":["../../../src/components/GlobalStyle.tsx"],"sourcesContent":["import { createGlobalStyle, withTheme } from \"styled-components\";\nimport { type CustomFontType } from \"../types\";\nimport { crukTheme as defaultTheme } from \"../themes/cruk\";\n\n// font-display fall back to stop font's flickering on SSR rehydration\nconst buildCustomFonts = (customFonts: CustomFontType[]) =>\n  customFonts\n    .map(\n      (font) => `\n        @font-face {\n          font-family: ${font.family};\n          src: ${\n            font?.urlWoff2 ? `url(\"${font.urlWoff2}\") format('woff2')` : \"\"\n          }${!!font.urlWoff && !!font?.urlWoff2 ? \", \" : \"\"}\n          ${font?.urlWoff ? `url(\"${font.urlWoff}\") format('woff')` : \"\"};\n          font-weight: ${font?.fontWeight};\n          font-style: normal;\n          font-display: fallback;\n        }\n      `,\n    )\n    .join(\"\");\n\nexport const GlobalStyle = withTheme(createGlobalStyle`\n  ${(props) => {\n    const theme = {\n      ...defaultTheme,\n      ...props.theme,\n    };\n    return `\n      ${buildCustomFonts(theme.typography.customFonts)}\n      html {\n        font-size: ${theme.typography.fontSizeBase};\n        font-family: ${theme.typography.fontFamilyBase};\n        line-height: ${theme.typography.lineHeight};\n      }\n      body {\n        background-color: ${theme.colors.backgroundMidLight};\n        color: ${theme.colors.textDark};\n        margin: 0;\n        padding: 0;\n        overflow-x: hidden;\n        -webkit-text-size-adjust: 100%;\n        -moz-text-size-adjust: none;\n        -ms-text-size-adjust: 100%;\n      }\n    `;\n  }}\n  *, *:after, *:before {\n    -webkit-box-sizing: border-box;\n    -moz-box-sizing: border-box;\n    box-sizing: border-box;\n  }\n  \n  @media (prefers-reduced-motion: reduce) {\n    *, *:after, *:before {\n      animation-play-state: paused !important;\n      animation-direction: reverse !important;\n      transition: none !important;\n      scroll-behavior: auto !important;\n    }\n  }\n\n  table, td, th {\n    border-spacing: 0;\n    border: 1px solid #ccc;\n    padding: 10px;\n  }\n  .no-focus-outline a:focus,\n  .no-focus-outline button:focus {\n    outline: none;\n  }\n  img {\n    width: 100%;\n    height: auto;\n  }\n  section {\n    width: 100%;\n  }\n    button {\n    font-size: 1em;\n  }\n`);\n\nGlobalStyle.defaultProps = {\n  theme: defaultTheme,\n};\n\nexport default GlobalStyle;\n"],"names":["GlobalStyle","withTheme","createGlobalStyle","templateObject_1","__makeTemplateObject","props","customFonts","theme","defaultTheme","typography","map","font","concat","family","urlWoff2","urlWoff","fontWeight","join","fontSizeBase","fontFamilyBase","lineHeight","colors","backgroundMidLight","textDark","defaultProps"],"mappings":"8MAKA,MAkBaA,EAAcC,EAAUC,EAAiBC,IAAAA,EAAAC,EAAA,CAAA,OAAA,4sBAAA,CAAA,OAwBnD,+sBAvBC,SAACC,GACD,IApBsBC,EAoBhBC,SACDC,GACAH,EAAME,OAEX,MAAO,mBAxBeD,EAyBDC,EAAME,WAAWH,YAxBxCA,EACGI,KACC,SAACC,GAAS,MAAA,kDAAAC,OAESD,EAAKE,qCAElBF,aAAI,EAAJA,EAAMG,UAAW,QAAQF,OAAAD,EAAKG,SAAQ,uBAAuB,IAC5DF,OAAED,EAAKI,UAAaJ,aAAI,EAAJA,EAAMG,UAAW,KAAO,GAC7C,gBAAAF,QAAAD,eAAAA,EAAMI,SAAU,QAAAH,OAAQD,EAAKI,8BAA6B,GAAE,8BAAAH,OAC/CD,eAAAA,EAAMK,WAIxB,yFAAA,IAEFC,KAAK,KAWW,uCAAAL,OAAAL,EAAME,WAAWS,aACf,4BAAAN,OAAAL,EAAME,WAAWU,eAAc,4BAAAP,OAC/BL,EAAME,WAAWW,WAAU,wDAAAR,OAGtBL,EAAMc,OAAOC,gDACxBf,EAAMc,OAAOE,sNAS5B,KAqCFvB,EAAYwB,aAAe,CACzBjB,MAAOC"}
+{"version":3,"file":"GlobalStyle.js","sources":["../../../src/components/GlobalStyle.tsx"],"sourcesContent":["import { createGlobalStyle, withTheme } from \"styled-components\";\nimport { type CustomFontType } from \"../types\";\nimport { crukTheme as defaultTheme } from \"../themes/cruk\";\n\n// font-display fall back to stop font's flickering on SSR rehydration\nconst buildCustomFonts = (customFonts: CustomFontType[]) =>\n  customFonts\n    .map(\n      (font) => `\n        @font-face {\n          font-family: ${font.family};\n          src: ${\n            font?.urlWoff2 ? `url(\"${font.urlWoff2}\") format('woff2')` : \"\"\n          }${!!font.urlWoff && !!font?.urlWoff2 ? \", \" : \"\"}\n          ${font?.urlWoff ? `url(\"${font.urlWoff}\") format('woff')` : \"\"};\n          font-weight: ${font?.fontWeight};\n          font-style: normal;\n          font-display: fallback;\n        }\n      `,\n    )\n    .join(\"\");\n\nexport const GlobalStyle = withTheme(createGlobalStyle`\n  ${(props) => {\n    const theme = {\n      ...defaultTheme,\n      ...props.theme,\n    };\n    return `\n      ${buildCustomFonts(theme.typography.customFonts)}\n      html {\n        font-size: ${theme.typography.fontSizeBase};\n        font-family: ${theme.typography.fontFamilyBase};\n        line-height: ${theme.typography.lineHeight};\n      }\n      body {\n        background-color: ${theme.colors.backgroundMidLight};\n        color: ${theme.colors.textDark};\n        margin: 0;\n        padding: 0;\n        overflow-x: hidden;\n        -webkit-text-size-adjust: 100%;\n        -moz-text-size-adjust: none;\n        -ms-text-size-adjust: 100%;\n      }\n    `;\n  }}\n  *, *:after, *:before {\n    -webkit-box-sizing: border-box;\n    -moz-box-sizing: border-box;\n    box-sizing: border-box;\n  }\n  \n  @media (prefers-reduced-motion: reduce) {\n    *, *:after, *:before {\n      animation-play-state: paused !important;\n      animation-direction: reverse !important;\n      transition: none !important;\n      scroll-behavior: auto !important;\n    }\n  }\n\n  table, td, th {\n    border-spacing: 0;\n    border: 1px solid #ccc;\n    padding: 10px;\n  }\n  .no-focus-outline a:focus,\n  .no-focus-outline button:focus {\n    outline: none;\n  }\n  img {\n    width: 100%;\n    height: auto;\n  }\n  section {\n    width: 100%;\n  }\n    button {\n    font-size: 1em;\n  }\n`);\n\nexport default GlobalStyle;\n"],"names":["GlobalStyle","withTheme","createGlobalStyle","props","theme","defaultTheme","customFonts","typography","map","font","family","urlWoff2","urlWoff","fontWeight","join","fontSizeBase","fontFamilyBase","lineHeight","colors","backgroundMidLight","textDark"],"mappings":"mHAKA,MAkBaA,EAAcC,EAAUC,CAAiB;IACjDC,IACD,MAAMC,EAAQ,IACTC,KACAF,EAAMC,OAEX,MAAO,WAxBeE,EAyBDF,EAAMG,WAAWD,YAxBxCA,EACGE,KACEC,GAAS,kDAESA,EAAKC,2BAElBD,GAAME,SAAW,QAAQF,EAAKE,6BAA+B,KAC1DF,EAAKG,SAAaH,GAAME,SAAW,KAAO,iBAC7CF,GAAMG,QAAU,QAAQH,EAAKG,2BAA6B,+BAC7CH,GAAMI,qGAM1BC,KAAK,yCAWWV,EAAMG,WAAWQ,uCACfX,EAAMG,WAAWS,yCACjBZ,EAAMG,WAAWU,iEAGZb,EAAMc,OAAOC,uCACxBf,EAAMc,OAAOE,qNAjCL,IAACd,CAyCrB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/lib/src/components/GlobalStyleNoFontFace.d.ts

@@ -0,0 +1,2 @@
+export declare const GlobalStyleNoFontFace: import("react").ForwardRefExoticComponent<Omit<JSX.LibraryManagedAttributes<T, import("styled-components").ExecutionProps>, "ref"> & import("react").RefAttributes<import("react").NamedExoticComponent<import("styled-components").ExecutionProps & object>>> & {};
+export default GlobalStyleNoFontFace;

package/lib/src/components/GlobalStyleNoFontFace.js

@@ -1,2 +1,38 @@
-import{__makeTemplateObject as n,__assign as o}from"../../node_modules/tslib/tslib.es6.js";import{withTheme as t,createGlobalStyle as e}from"styled-components";import{crukTheme as i}from"../themes/cruk.js";var r,a=t(e(r||(r=n(["\n  ","\n  *, *:after, *:before {\n    -webkit-box-sizing: border-box;\n    -moz-box-sizing: border-box;\n    box-sizing: border-box;\n  }\n  \n  @media (prefers-reduced-motion: reduce) {\n    *, *:after, *:before {\n      animation-play-state: paused !important;\n      animation-direction: reverse !important;\n      transition: none !important;\n      scroll-behavior: auto !important;\n    }\n  }\n\n  table, td, th {\n    border-spacing: 0;\n    border: 1px solid #ccc;\n    padding: 10px;\n  }\n  .no-focus-outline a:focus,\n  .no-focus-outline button:focus {\n    outline: none;\n  }\n  img {\n    width: 100%;\n    height: auto;\n  }\n  section {\n    width: 100%;\n  }\n    button {\n    font-size: 1em;\n  }\n"],["\n  ","\n  *, *:after, *:before {\n    -webkit-box-sizing: border-box;\n    -moz-box-sizing: border-box;\n    box-sizing: border-box;\n  }\n  \n  @media (prefers-reduced-motion: reduce) {\n    *, *:after, *:before {\n      animation-play-state: paused !important;\n      animation-direction: reverse !important;\n      transition: none !important;\n      scroll-behavior: auto !important;\n    }\n  }\n\n  table, td, th {\n    border-spacing: 0;\n    border: 1px solid #ccc;\n    padding: 10px;\n  }\n  .no-focus-outline a:focus,\n  .no-focus-outline button:focus {\n    outline: none;\n  }\n  img {\n    width: 100%;\n    height: auto;\n  }\n  section {\n    width: 100%;\n  }\n    button {\n    font-size: 1em;\n  }\n"])),(function(n){var t=o(o({},i),n.theme);return"\n      html {\n        font-size: ".concat(t.typography.fontSizeBase,";\n        font-family: ").concat(t.typography.fontFamilyBase,";\n        line-height: ").concat(t.typography.lineHeight,";\n      }\n      body {\n        background-color: ").concat(t.colors.backgroundMidLight,";\n        color: ").concat(t.colors.textDark,";\n        margin: 0;\n        padding: 0;\n        overflow-x: hidden;\n        -webkit-text-size-adjust: 100%;\n        -moz-text-size-adjust: none;\n        -ms-text-size-adjust: 100%;\n      }\n    ")})));a.defaultProps={theme:i};export{a as GlobalStyleNoFontFace,a as default};
+import{withTheme as o,createGlobalStyle as t}from"styled-components";import{crukTheme as e}from"../themes/cruk.js";const n=o(t`
+  ${o=>{const t={...e,...o.theme};return`\n      html {\n        font-size: ${t.typography.fontSizeBase};\n        font-family: ${t.typography.fontFamilyBase};\n        line-height: ${t.typography.lineHeight};\n      }\n      body {\n        background-color: ${t.colors.backgroundMidLight};\n        color: ${t.colors.textDark};\n        margin: 0;\n        padding: 0;\n        overflow-x: hidden;\n        -webkit-text-size-adjust: 100%;\n        -moz-text-size-adjust: none;\n        -ms-text-size-adjust: 100%;\n      }\n    `}}
+  *, *:after, *:before {
+    -webkit-box-sizing: border-box;
+    -moz-box-sizing: border-box;
+    box-sizing: border-box;
+  }
+  
+  @media (prefers-reduced-motion: reduce) {
+    *, *:after, *:before {
+      animation-play-state: paused !important;
+      animation-direction: reverse !important;
+      transition: none !important;
+      scroll-behavior: auto !important;
+    }
+  }
+
+  table, td, th {
+    border-spacing: 0;
+    border: 1px solid #ccc;
+    padding: 10px;
+  }
+  .no-focus-outline a:focus,
+  .no-focus-outline button:focus {
+    outline: none;
+  }
+  img {
+    width: 100%;
+    height: auto;
+  }
+  section {
+    width: 100%;
+  }
+    button {
+    font-size: 1em;
+  }
+`);export{n as GlobalStyleNoFontFace,n as default};
 //# sourceMappingURL=GlobalStyleNoFontFace.js.map