@cruk/cruk-react-components 6.2.2 → 7.0.0

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/TextField/index.tsx"],"sourcesContent":["import React, {\n  type InputHTMLAttributes,\n  type ReactNode,\n  type Ref,\n} from \"react\";\nimport { useTheme } from \"styled-components\";\n\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\nimport { ErrorText } from \"../ErrorText\";\nimport { LabelWrapper } from \"../LabelWrapper\";\n\nimport {\n  ExtraLeft,\n  ExtraRight,\n  Extra,\n  ExtraWrapper,\n  StyledInput,\n  StyledInputWrapper,\n} from \"./styles\";\n\nexport type TextFieldProps = InputHTMLAttributes<HTMLInputElement> & {\n  /** error message text  */\n  errorMessage?: string;\n  /** custom component/text that appears underneath the input field */\n  extraBottom?: ReactNode;\n  /** custom component/text that appears to the left of the input field for example prefixes like \"£\" */\n  extraLeft?: ReactNode;\n  /** custom component/text that appears to the right of the input field for example a search button */\n  extraRight?: ReactNode;\n  /** custom component/text that appears above the input field for example a url domain */\n  extraTop?: ReactNode;\n  /** flag for error styling */\n  hasError?: boolean;\n  /** flag which controls the whether a cross icon or check icon is displayed to the right of the input field */\n  isValid?: boolean;\n  /** flag to hide or show the check icon when valid */\n  isValidVisible?: boolean;\n  /** flag to hide or show the cross icon when invalid */\n  isInvalidVisible?: boolean;\n  /** hint text */\n  hintText?: ReactNode;\n  /** label text */\n  label: string;\n  /** flag to stop (optional) appearing in label, useful for compound form components like DateInput */\n  hideRequiredIndicationInLabel?: boolean;\n  /** react reference to the DOM element sometime used to scroll to or set focus after an error */\n  ref?: Ref<HTMLInputElement>;\n};\n\n/**\n * TextFields let users enter and edit text. For multiline text entry please consider using the TextAreaFieldComponent.\n * */\nexport const TextField = ({\n  errorMessage,\n  extraBottom,\n  extraLeft,\n  extraRight,\n  extraTop,\n  hasError,\n  hintText,\n  isValid,\n  isValidVisible,\n  isInvalidVisible,\n  label,\n  hideRequiredIndicationInLabel,\n  ref,\n  ...props\n}: TextFieldProps) => {\n  const foundTheme = useTheme();\n  const theme = {\n    ...defaultTheme,\n    ...foundTheme,\n  };\n\n  const renderContent = (\n    <>\n      {!!extraLeft && <ExtraLeft theme={theme}>{extraLeft}</ExtraLeft>}\n      <StyledInputWrapper\n        $hasError={hasError || !!errorMessage || false}\n        $isValid={\n          typeof isValid !== \"undefined\" ? isValid : !hasError && !errorMessage\n        }\n        aria-invalid={hasError || !!errorMessage || false}\n        $isValidVisible={isValidVisible || false}\n        $isInvalidVisible={isInvalidVisible || false}\n        theme={theme}\n      >\n        <StyledInput\n          $hasError={hasError || !!errorMessage || false}\n          $isValid={\n            typeof isValid !== \"undefined\"\n              ? isValid\n              : !hasError && !errorMessage\n          }\n          aria-invalid={hasError || !!errorMessage || false}\n          aria-describedby={\n            !!props.id && !!errorMessage ? `${props.id}-error` : undefined\n          }\n          $isValidVisible={isValidVisible || false}\n          $isInvalidVisible={isInvalidVisible || false}\n          {...props}\n          theme={theme}\n          data-hj-suppress\n          ref={ref}\n        />\n      </StyledInputWrapper>\n      {!!extraRight && <ExtraRight theme={theme}>{extraRight}</ExtraRight>}\n    </>\n  );\n\n  return (\n    <LabelWrapper\n      label={label}\n      hintText={hintText}\n      required={props.required || false}\n      hideRequiredIndicationInLabel={hideRequiredIndicationInLabel}\n    >\n      {!!extraTop && <Extra theme={theme}>{extraTop}</Extra>}\n      {!!extraRight || !!extraLeft ? (\n        <ExtraWrapper>{renderContent}</ExtraWrapper>\n      ) : (\n        renderContent\n      )}\n      {!!extraBottom && <Extra theme={theme}>{extraBottom}</Extra>}\n      {!!errorMessage && (\n        <ErrorText\n          marginTop=\"xxs\"\n          id={props.id ? `${props.id}-error` : undefined}\n        >\n          {errorMessage}\n        </ErrorText>\n      )}\n    </LabelWrapper>\n  );\n};\n\nexport default TextField;\n"],"names":["TextField","_a","errorMessage","extraBottom","extraLeft","extraRight","extraTop","hasError","hintText","isValid","isValidVisible","isInvalidVisible","label","hideRequiredIndicationInLabel","ref","props","__rest","foundTheme","useTheme","theme","__assign","defaultTheme","renderContent","React","createElement","Fragment","ExtraLeft","StyledInputWrapper","$isValid","$isInvalidVisible","StyledInput","$hasError","id","undefined","$isValidVisible","ExtraRight","LabelWrapper","required","Extra","ExtraWrapper","ErrorText","marginTop","concat"],"mappings":"2aAoDO,IAAMA,EAAY,SAACC,GACxB,IAAAC,EAAYD,EAAAC,aACZC,EAAWF,EAAAE,YACXC,EAASH,EAAAG,UACTC,EAAUJ,EAAAI,WACVC,EAAQL,EAAAK,SACRC,EAAQN,EAAAM,SACRC,EAAQP,EAAAO,SACRC,EAAOR,EAAAQ,QACPC,EAAcT,EAAAS,eACdC,EAAgBV,EAAAU,iBAChBC,EAAKX,EAAAW,MACLC,EAA6BZ,EAAAY,8BAC7BC,EAAGb,EAAAa,IACAC,EAAKC,EAAAf,EAdgB,sLAgBlBgB,EAAaC,IACbC,EAAKC,EAAAA,EAAA,CAAA,EACNC,GACAJ,GAGCK,EACJC,EAAAC,cAAAD,EAAAE,SAAA,OACKrB,GAAamB,EAAAC,cAACE,EAAS,CAACP,MAAOA,GAAQf,GAC1CmB,EAAAC,cAACG,aACYpB,KAAcL,IAAgB,EAAK0B,cAEzB,IAAZnB,EAA0BA,GAAWF,IAAaL,EAAY,eAEzDK,KAAcL,IAAgB,kBAC3BQ,IAAkB,EAAKmB,kBACrBlB,IAAoB,EACvCQ,MAAOA,GAEPI,EAAAC,cAACM,EAAWV,EAAA,CAAAW,UACCxB,KAAcL,IAAgB,EAAK0B,cAEzB,IAAZnB,EACHA,GACCF,IAAaL,EAAY,eAElBK,KAAcL,IAAgB,EAAK,mBAE7Ca,EAAMiB,IAAQ9B,EAAe,UAAGa,EAAMiB,GAAE,eAAWC,EAASC,gBAE/CxB,IAAkB,EAAKmB,kBACrBlB,IAAoB,GACnCI,EAAK,CACTI,MAAOA,EAAK,oBAAA,EAEZL,IAAKA,QAGNT,GAAckB,EAAAC,cAACW,EAAU,CAAChB,MAAOA,GAAQd,IAIhD,OACEkB,gBAACa,EAAY,CACXxB,MAAOA,EACPJ,SAAUA,EACV6B,SAAUtB,EAAMsB,WAAY,EAC5BxB,8BAA+BA,KAE5BP,GAAYiB,EAAAC,cAACc,EAAK,CAACnB,MAAOA,GAAQb,GAClCD,GAAgBD,EACjBmB,gBAACgB,EAAY,KAAEjB,GAA6B,IAI3CnB,GAAeoB,EAAAC,cAACc,EAAK,CAACnB,MAAOA,GAAQhB,KACrCD,GACDqB,gBAACiB,EAAS,CACRC,UAAU,MACVT,GAAIjB,EAAMiB,GAAK,GAAAU,OAAG3B,EAAMiB,kBAAaC,GAEpC/B,GAKX"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/TextField/index.tsx"],"sourcesContent":["import React, {\n  type InputHTMLAttributes,\n  type ReactNode,\n  type Ref,\n} from \"react\";\n\nimport { ErrorText } from \"../ErrorText\";\nimport { LabelWrapper } from \"../LabelWrapper\";\n\nimport {\n  ExtraLeft,\n  ExtraRight,\n  Extra,\n  ExtraWrapper,\n  StyledInput,\n  StyledInputWrapper,\n} from \"./styles\";\n\nexport type TextFieldProps = InputHTMLAttributes<HTMLInputElement> & {\n  /** error message text  */\n  errorMessage?: string;\n  /** custom component/text that appears underneath the input field */\n  extraBottom?: ReactNode;\n  /** custom component/text that appears to the left of the input field for example prefixes like \"£\" */\n  extraLeft?: ReactNode;\n  /** custom component/text that appears to the right of the input field for example a search button */\n  extraRight?: ReactNode;\n  /** custom component/text that appears above the input field for example a url domain */\n  extraTop?: ReactNode;\n  /** flag for error styling */\n  hasError?: boolean;\n  /** flag which controls the whether a cross icon or check icon is displayed to the right of the input field */\n  isValid?: boolean;\n  /** flag to hide or show the check icon when valid */\n  isValidVisible?: boolean;\n  /** flag to hide or show the cross icon when invalid */\n  isInvalidVisible?: boolean;\n  /** hint text */\n  hintText?: ReactNode;\n  /** label text */\n  label: string;\n  /** flag to stop (optional) appearing in label, useful for compound form components like DateInput */\n  hideRequiredIndicationInLabel?: boolean;\n  /** react reference to the DOM element sometime used to scroll to or set focus after an error */\n  ref?: Ref<HTMLInputElement>;\n};\n\n/**\n * TextFields let users enter and edit text. For multiline text entry please consider using the TextAreaFieldComponent.\n * */\nexport const TextField = ({\n  errorMessage,\n  extraBottom,\n  extraLeft,\n  extraRight,\n  extraTop,\n  hasError,\n  hintText,\n  isValid,\n  isValidVisible,\n  isInvalidVisible,\n  label,\n  hideRequiredIndicationInLabel,\n  ref,\n  ...props\n}: TextFieldProps) => {\n  const renderContent = (\n    <>\n      {!!extraLeft && <ExtraLeft>{extraLeft}</ExtraLeft>}\n      <StyledInputWrapper\n        $hasError={hasError || !!errorMessage || false}\n        $isValid={\n          typeof isValid !== \"undefined\" ? isValid : !hasError && !errorMessage\n        }\n        aria-invalid={hasError || !!errorMessage || false}\n        $isValidVisible={isValidVisible || false}\n        $isInvalidVisible={isInvalidVisible || false}\n      >\n        <StyledInput\n          $hasError={hasError || !!errorMessage || false}\n          $isValid={\n            typeof isValid !== \"undefined\"\n              ? isValid\n              : !hasError && !errorMessage\n          }\n          aria-invalid={hasError || !!errorMessage || false}\n          aria-describedby={\n            !!props.id && !!errorMessage ? `${props.id}-error` : undefined\n          }\n          $isValidVisible={isValidVisible || false}\n          $isInvalidVisible={isInvalidVisible || false}\n          {...props}\n          data-hj-suppress\n          ref={ref}\n        />\n      </StyledInputWrapper>\n      {!!extraRight && <ExtraRight>{extraRight}</ExtraRight>}\n    </>\n  );\n\n  return (\n    <LabelWrapper\n      label={label}\n      hintText={hintText}\n      required={props.required || false}\n      hideRequiredIndicationInLabel={hideRequiredIndicationInLabel}\n    >\n      {!!extraTop && <Extra>{extraTop}</Extra>}\n      {!!extraRight || !!extraLeft ? (\n        <ExtraWrapper>{renderContent}</ExtraWrapper>\n      ) : (\n        renderContent\n      )}\n      {!!extraBottom && <Extra>{extraBottom}</Extra>}\n      {!!errorMessage && (\n        <ErrorText\n          marginTop=\"xxs\"\n          id={props.id ? `${props.id}-error` : undefined}\n        >\n          {errorMessage}\n        </ErrorText>\n      )}\n    </LabelWrapper>\n  );\n};\n\nexport default TextField;\n"],"names":["TextField","_a","errorMessage","extraBottom","extraLeft","extraRight","extraTop","hasError","hintText","isValid","isValidVisible","isInvalidVisible","label","hideRequiredIndicationInLabel","ref","props","__rest","renderContent","React","createElement","Fragment","ExtraLeft","StyledInputWrapper","$hasError","$isValid","$isInvalidVisible","StyledInput","__assign","id","concat","undefined","$isValidVisible","ExtraRight","LabelWrapper","required","Extra","ExtraWrapper","ErrorText","marginTop"],"mappings":"6UAkDO,IAAMA,EAAY,SAACC,GACxB,IAAAC,EAAYD,EAAAC,aACZC,EAAWF,EAAAE,YACXC,EAASH,EAAAG,UACTC,EAAUJ,EAAAI,WACVC,EAAQL,EAAAK,SACRC,EAAQN,EAAAM,SACRC,EAAQP,EAAAO,SACRC,EAAOR,EAAAQ,QACPC,EAAcT,EAAAS,eACdC,EAAgBV,EAAAU,iBAChBC,EAAKX,EAAAW,MACLC,EAA6BZ,EAAAY,8BAC7BC,EAAGb,EAAAa,IACAC,EAAKC,EAAAf,EAdgB,sLAgBlBgB,EACJC,EAAAC,cAAAD,EAAAE,SAAA,OACKhB,GAAac,gBAACG,EAAS,KAAEjB,GAC5Bc,EAAAC,cAACG,EAAkB,CAAAC,UACNhB,KAAcL,IAAgB,EAAKsB,cAEzB,IAAZf,EAA0BA,GAAWF,IAAaL,EAAY,eAEzDK,KAAcL,IAAgB,kBAC3BQ,IAAkB,EAAKe,kBACrBd,IAAoB,GAEvCO,EAAAC,cAACO,EAAWC,EAAA,CAAAJ,UACChB,KAAcL,IAAgB,EAAKsB,cAEzB,IAAZf,EACHA,GACCF,IAAaL,EAAY,eAElBK,KAAcL,IAAgB,EAAK,mBAE7Ca,EAAMa,IAAQ1B,EAAe,GAAA2B,OAAGd,EAAMa,GAAE,eAAWE,EAASC,gBAE/CrB,IAAkB,EAAKe,kBACrBd,IAAoB,GACnCI,yBAEJD,IAAKA,QAGNT,GAAca,EAAAC,cAACa,OAAY3B,IAIlC,OACEa,gBAACe,EAAY,CACXrB,MAAOA,EACPJ,SAAUA,EACV0B,SAAUnB,EAAMmB,WAAY,EAC5BrB,8BAA+BA,KAE5BP,GAAYY,gBAACiB,EAAK,KAAE7B,GACpBD,GAAgBD,EACjBc,gBAACkB,EAAY,KAAEnB,GAA6B,IAI3Cd,GAAee,gBAACiB,EAAK,KAAEhC,KACvBD,GACDgB,gBAACmB,EAAS,CACRC,UAAU,MACVV,GAAIb,EAAMa,GAAK,GAAAC,OAAGd,EAAMa,kBAAaE,GAEpC5B,GAKX"}

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

@@ -1,17 +1,12 @@
-import { type ThemeType } from "../../types";
-type ExtraProps = {
-    theme: ThemeType;
-};
 type StyledInputProps = {
     $hasError: boolean;
     $isValid: boolean;
-    theme: ThemeType;
     $isValidVisible?: boolean;
     $isInvalidVisible?: boolean;
 };
-export declare const Extra: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, ExtraProps>> & string;
-export declare const ExtraLeft: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "theme"> & ExtraProps, never>> & string;
-export declare const ExtraRight: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "theme"> & ExtraProps, ExtraProps>> & string;
+export declare const Extra: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
+export declare const ExtraLeft: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>, never>> & string;
+export declare const ExtraRight: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>, never>> & string;
 export declare const ExtraWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
 export declare const StyledInputWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, StyledInputProps>> & string;
 export declare const StyledInput: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, StyledInputProps>> & string;

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

@@ -1,2 +1,2 @@
-import{__makeTemplateObject as n}from"../../../node_modules/tslib/tslib.es6.js";import o,{css as t}from"styled-components";var e,A,i,r,a,l,b,g,c,u,d,s="48px",m=o.span(e||(e=n(["\n  box-sizing: border-box;\n  display: block;\n  background-color: ",";\n  color: ",";\n  font-size: ",";\n  line-height: ",";\n  font-weight: ",";\n  padding: ",";\n  margin: 0;\n  line-height: 1rem;\n  width: auto;\n"],["\n  box-sizing: border-box;\n  display: block;\n  background-color: ",";\n  color: ",";\n  font-size: ",";\n  line-height: ",";\n  font-weight: ",";\n  padding: ",";\n  margin: 0;\n  line-height: 1rem;\n  width: auto;\n"])),function(n){return n.theme.colors.textInputExtraInfo},function(n){return n.theme.colors.textDark},function(n){return n.theme.fontSizes.m},function(n){return n.theme.typography.lineHeight},function(n){return n.theme.typography.fontWeightLight},function(n){var o=n.theme;return"calc((".concat(s," - 1em ) / 2) ").concat(o.spacing.xs)}),h=o(m)(A||(A=n(["\n  box-sizing: border-box;\n  width: auto;\n  vertical-align: middle;\n  height: ",";\n\n  button {\n    min-height: "," !important;\n  }\n"],["\n  box-sizing: border-box;\n  width: auto;\n  vertical-align: middle;\n  height: ",";\n\n  button {\n    min-height: "," !important;\n  }\n"])),s,function(n){var o=n.theme;return"calc(".concat(s," - (2 * ").concat(o.utilities.inputBorderWidth,"))")}),p=o(m)(i||(i=n(["\n  box-sizing: border-box;\n  width: auto;\n  border: ",";\n  transition: border-color 150ms linear;\n  border-left: 0;\n  background-color: transparent;\n  padding: 0;\n  height: ",";\n  vertical-align: middle;\n\n  button {\n    min-height: "," !important;\n  }\n"],["\n  box-sizing: border-box;\n  width: auto;\n  border: ",";\n  transition: border-color 150ms linear;\n  border-left: 0;\n  background-color: transparent;\n  padding: 0;\n  height: ",";\n  vertical-align: middle;\n\n  button {\n    min-height: "," !important;\n  }\n"])),function(n){var o=n.theme;return"solid ".concat(o.utilities.inputBorderWidth," ").concat(o.colors.textInputBorder)},s,function(n){var o=n.theme;return"calc(".concat(s," - (2 * ").concat(o.utilities.inputBorderWidth,"))")}),Z=o.span(r||(r=n(["\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n"],["\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n"]))),W=o.span(b||(b=n(["\n  box-sizing: border-box;\n  position: relative;\n  display: block;\n  flex: 1 1;\n  &:after {\n    display: ",';\n    position: absolute;\n    width: 2em;\n    z-index: 1;\n    bottom: 0;\n    right: 0;\n    content: "";\n    top: 0;\n    background-repeat: no-repeat;\n    background-position: ',";\n    ","\n    ","\n  }\n"],["\n  box-sizing: border-box;\n  position: relative;\n  display: block;\n  flex: 1 1;\n  &:after {\n    display: ",';\n    position: absolute;\n    width: 2em;\n    z-index: 1;\n    bottom: 0;\n    right: 0;\n    content: "";\n    top: 0;\n    background-repeat: no-repeat;\n    background-position: ',";\n    ","\n    ","\n  }\n"])),function(n){var o=n.$isValidVisible;return n.$isInvalidVisible||o?"block":"none"},function(n){var o=n.theme;return"calc( 100% - ".concat(o.spacing.xxs,") 50% ")},function(o){var e=o.$isValid,A=o.$isInvalidVisible;return!e&&A&&t(a||(a=n(['\n        background-image: url("data:image/png;base64,','");\n      '],['\n        background-image: url("data:image/png;base64,','");\n      '])),"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")},function(o){var e=o.$isValid,A=o.$isValidVisible;return e&&A&&t(l||(l=n(['\n        background-image: url("data:image/png;base64,','");\n      '],['\n        background-image: url("data:image/png;base64,','");\n      '])),"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")}),C=o.input(d||(d=n(["\n  box-sizing: border-box;\n  background-color: ",";\n  background-image: none;\n  border: ",";\n  border-radius: 0;\n  color: ",";\n  display: block;\n  font-size: ",";\n  line-height: ",";\n  min-width: 3em;\n  padding: ",";\n\n  /* Make sure text doesn't go behind the valid indicatior icon */\n  ","\n\n  width: 100%;\n  transition: border-color 150ms linear;\n  &:hover {\n    border-color: ",";\n  }\n  &:disabled {\n    border-color: ",";\n    color: ",";\n  }\n\n  ",";\n\n  ","\n  &:-webkit-autofill,\n    &:-webkit-autofill:focus {\n    box-shadow: 0 0 0 3em white inset !important;\n  }\n\n  // increase font size for desktop\n  @media (min-width: ",") {\n    font-size: ",";\n  }\n"],["\n  box-sizing: border-box;\n  background-color: ",";\n  background-image: none;\n  border: ",";\n  border-radius: 0;\n  color: ",";\n  display: block;\n  font-size: ",";\n  line-height: ",";\n  min-width: 3em;\n  padding: ",";\n\n  /* Make sure text doesn't go behind the valid indicatior icon */\n  ","\n\n  width: 100%;\n  transition: border-color 150ms linear;\n  &:hover {\n    border-color: ",";\n  }\n  &:disabled {\n    border-color: ",";\n    color: ",";\n  }\n\n  ",";\n\n  ","\n  &:-webkit-autofill,\n    &:-webkit-autofill:focus {\n    box-shadow: 0 0 0 3em white inset !important;\n  }\n\n  // increase font size for desktop\n  @media (min-width: ",") {\n    font-size: ",";\n  }\n"])),function(n){return n.theme.colors.backgroundLight},function(n){var o=n.$hasError,t=n.theme;return"solid ".concat(t.utilities.inputBorderWidth," ").concat(o?t.colors.textError:t.colors.textInputBorder)},function(n){return n.theme.colors.textDark},function(n){return n.theme.fontSizes.m},function(n){return n.theme.typography.lineHeight},function(n){var o=n.theme;return"calc((".concat(s," - (").concat(o.utilities.inputBorderWidth," * 2) - ").concat(o.typography.lineHeight," ) / 2) ").concat(o.spacing.xs)},function(o){var e=o.$isValidVisible,A=o.$isInvalidVisible;return(e||A)&&t(g||(g=n(["\n      padding-right: 3rem;\n    "],["\n      padding-right: 3rem;\n    "])))},function(n){return n.theme.colors.secondary},function(n){return n.theme.colors.disabled},function(n){return n.theme.colors.disabled},function(o){var e=o.theme;return e.utilities.useDefaultFocusRect?null:t(c||(c=n(["\n          &:focus {\n            outline: 0;\n            border-color: ",";\n            ~ "," {\n              border-color: ",";\n            }\n          }\n        "],["\n          &:focus {\n            outline: 0;\n            border-color: ",";\n            ~ "," {\n              border-color: ",";\n            }\n          }\n        "])),e.colors.tertiary,p,e.colors.tertiary)},function(o){var e=o.$hasError,A=o.theme;return e&&t(u||(u=n(["\n      ~ "," {\n        border-color: ",";\n      }\n    "],["\n      ~ "," {\n        border-color: ",";\n      }\n    "])),p,A.colors.textError)},function(n){return n.theme.breakpoint.desktopLarge},function(n){return n.theme.fontSizes.ml});export{m as Extra,h as ExtraLeft,p as ExtraRight,Z as ExtraWrapper,C as StyledInput,W as StyledInputWrapper};
+import{__makeTemplateObject as n}from"../../../node_modules/tslib/tslib.es6.js";import i,{css as e}from"styled-components";var r,A,a,o,t,b,l,g,d,s,c=i.span(r||(r=n(['\n  box-sizing: border-box;\n  display: block;\n  background-color: var(--clr-text-input-extra-info, #e6e6e6);\n  color: var(--clr-text-dark, #000);\n  font-size: var(--font-size-m, 1em);\n  line-height: var(--typ-line-height, 1.5em);\n  font-weight: var(--typ-font-weight-base, 300);\n  font-family: var(--typ-font-family-base, "Poppins", Arial, sans-serif);\n  padding: calc((var(--_min-height, 48px) - 1em) / 2) var(--spacing-xs, 1rem);\n  margin: 0;\n  line-height: 1rem;\n  width: auto;\n'],['\n  box-sizing: border-box;\n  display: block;\n  background-color: var(--clr-text-input-extra-info, #e6e6e6);\n  color: var(--clr-text-dark, #000);\n  font-size: var(--font-size-m, 1em);\n  line-height: var(--typ-line-height, 1.5em);\n  font-weight: var(--typ-font-weight-base, 300);\n  font-family: var(--typ-font-family-base, "Poppins", Arial, sans-serif);\n  padding: calc((var(--_min-height, 48px) - 1em) / 2) var(--spacing-xs, 1rem);\n  margin: 0;\n  line-height: 1rem;\n  width: auto;\n']))),m=i(c)(A||(A=n(["\n  box-sizing: border-box;\n  width: auto;\n  vertical-align: middle;\n  height: var(--_min-height, 48px);\n\n  button {\n    min-height: calc(\n      var(--_min-height, 48px) - (2 * var(--size-border-width, 1px))\n    ) !important;\n  }\n"],["\n  box-sizing: border-box;\n  width: auto;\n  vertical-align: middle;\n  height: var(--_min-height, 48px);\n\n  button {\n    min-height: calc(\n      var(--_min-height, 48px) - (2 * var(--size-border-width, 1px))\n    ) !important;\n  }\n"]))),h=i(c)(a||(a=n(["\n  box-sizing: border-box;\n  width: auto;\n  border: solid var(--size-border-width, 1px)\n    var(--clr-text-input-border, #2e2d2c);\n  transition: border-color 150ms linear;\n  border-left: 0;\n  background-color: transparent;\n  padding: 0;\n  height: var(--_min-height, 48px);\n  vertical-align: middle;\n\n  button {\n    min-height: calc(\n      var(--_min-height, 48px) - (2 * var(--size-border-width, 1px))\n    ) !important;\n  }\n"],["\n  box-sizing: border-box;\n  width: auto;\n  border: solid var(--size-border-width, 1px)\n    var(--clr-text-input-border, #2e2d2c);\n  transition: border-color 150ms linear;\n  border-left: 0;\n  background-color: transparent;\n  padding: 0;\n  height: var(--_min-height, 48px);\n  vertical-align: middle;\n\n  button {\n    min-height: calc(\n      var(--_min-height, 48px) - (2 * var(--size-border-width, 1px))\n    ) !important;\n  }\n"]))),p=i.span(o||(o=n(["\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n"],["\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n"]))),u=i.span(l||(l=n(["\n  --_min-height: 48px;\n  box-sizing: border-box;\n  position: relative;\n  display: block;\n  flex: 1 1;\n  &:after {\n    display: ",';\n    position: absolute;\n    width: 2em;\n    z-index: 1;\n    bottom: 0;\n    right: 0;\n    content: "";\n    top: 0;\n    background-repeat: no-repeat;\n    background-position: calc(100% - var(--spacing-xxs, 0.5rem)) 50%;\n    ',"\n    ","\n  }\n"],["\n  --_min-height: 48px;\n  box-sizing: border-box;\n  position: relative;\n  display: block;\n  flex: 1 1;\n  &:after {\n    display: ",';\n    position: absolute;\n    width: 2em;\n    z-index: 1;\n    bottom: 0;\n    right: 0;\n    content: "";\n    top: 0;\n    background-repeat: no-repeat;\n    background-position: calc(100% - var(--spacing-xxs, 0.5rem)) 50%;\n    ',"\n    ","\n  }\n"])),function(n){var i=n.$isValidVisible;return n.$isInvalidVisible||i?"block":"none"},function(i){var r=i.$isValid,A=i.$isInvalidVisible;return!r&&A&&e(t||(t=n(['\n        background-image: url("data:image/png;base64,','");\n      '],['\n        background-image: url("data:image/png;base64,','");\n      '])),"iVBORw0KGgoAAAANSUhEUgAAABgAAAAZCAYAAAArK+5dAAAK0mlDQ1BJQ0MgUHJvZmlsZQAASImVlwdUU9kWhs+96Y0WQDqhN0E6AaSEHkB6F5WQBBIIMSYEEbsyqOBYUBFBZQCHquDoCMhYEAsWRLFhnyCDgjoOFmyozAUeYWbeeu+tt9c693x3Z5999r65Z63/AkDxY4lEAlgJgCxhtjgq0IeWkJhEww0CCGgDAlADtiy2RMSIiAgFiE3Pf7f3d5BoxG5aT+T699//q6lwuBI2AFAywqkcCTsL4Q5kDLFF4mwAUHWI32hptmiCuxFWFSMFIiyb4PQpfjfBqZOMxk/GxET5IqwDAJ7MYonTASCbI35aDjsdyUMOQthWyOELEc5F2JPNY3EQbkN4dlbW4gn+DWFzJF4EAIWMMD31LznT/5Y/VZ6fxUqX81Rfk4b340tEAtay//PR/G/LEkin9zBFBpknDopCZuTfhO5mLg6RszA1LHya+ZzJ+EnmSYNip5kt8U2aZg7LL0S+VhAWOs1p/ACmPE82M2aauRL/6GkWL46S75Um9mVMM0s8s680M1bu53GZ8vx5vJj4ac7hx4VNsyQzOmQmxlfuF0uj5PVzhYE+M/sGyHvPkvylXz5TvjabFxMk7501Uz9XyJjJKUmQ18bh+vnPxMTK40XZPvK9RIIIeTxXECj3S3Ki5WuzkZdzZm2E/BlmsIIjphlEgFDgAByBK3KNB5HZ3NzsiSZ8F4uWifnpvGwaAzlpXBpTyLaZTbO3tbcDYOLcTr0Kb+9OnkdIHT/jS0POl2MDclZcZ3yCDQCcuQ6AwsYZn9FbAAgTfgFbKs6Z8qEnLhhABIpAFWgCPWAEzIE1sAfOwB14A38QDMJBDEgECwEb8EAWEIOlYAVYCwpAEdgGdoEyUAGqQR04BI6AVnACnAEXwBVwHdwGD4AMDIIXYAS8B2MQBOEgCkSFNCF9yASyguwhOuQJ+UOhUBSUCKVA6ZAQkkIroPVQEVQMlUGVUD30E3QcOgNdgnqhe1A/NAy9gT7DKJgMq8K6sCk8B6bDDDgEjoEXwOnwEjgPzoe3wKVwFXwQboHPwFfg27AMfgGPogCKhFJHGaCsUXSULyoclYRKQ4lRq1CFqBJUFaoJ1Y7qQt1EyVAvUZ/QWDQVTUNbo93RQehYNBu9BL0KvRldhq5Dt6DPoW+i+9Ej6G8YCkYHY4VxwzAxCZh0zFJMAaYEU4M5hjmPuY0ZxLzHYrHqWDOsCzYIm4jNwC7HbsbuwzZjO7C92AHsKA6H08RZ4Txw4TgWLhtXgNuDO4g7jbuBG8R9xJPw+nh7fAA+CS/Er8OX4Bvwp/A38M/wYwQlggnBjRBO4BCWEbYSDhDaCdcIg4QxojLRjOhBjCFmENcSS4lNxPPEh8S3JBLJkORKiiTxSWtIpaTDpIukftInsgrZkuxLTiZLyVvIteQO8j3yWwqFYkrxpiRRsilbKPWUs5THlI8KVAUbBaYCR2G1QrlCi8INhVeKBEUTRYbiQsU8xRLFo4rXFF8qEZRMlXyVWEqrlMqVjiv1KY0qU5XtlMOVs5Q3KzcoX1IeUsGpmKr4q3BU8lWqVc6qDFBRVCOqL5VNXU89QD1PHVTFqpqpMlUzVItUD6n2qI6oqag5qsWp5aqVq51Uk6mj1E3VmeoC9a3qR9TvqH+epTuLMYs7a9Osplk3Zn3Q0Nbw1uBqFGo0a9zW+KxJ0/TXzNTcrtmq+UgLrWWpFam1VGu/1nmtl9qq2u7abO1C7SPa93VgHUudKJ3lOtU63Tqjunq6gboi3T26Z3Vf6qnreetl6O3UO6U3rE/V99Tn6+/UP63/nKZGY9AEtFLaOdqIgY5BkIHUoNKgx2DM0Mww1nCdYbPhIyOiEd0ozWinUafRiLG+8TzjFcaNxvdNCCZ0E57JbpMukw+mZqbxphtMW02HzDTMmGZ5Zo1mD80p5l7mS8yrzG9ZYC3oFpkW+yyuW8KWTpY8y3LLa1awlbMV32qfVe9szGzX2cLZVbP7rMnWDOsc60brfht1m1CbdTatNq/mGM9JmrN9Ttecb7ZOtgLbA7YP7FTsgu3W2bXbvbG3tGfbl9vfcqA4BDisdmhzeO1o5ch13O9414nqNM9pg1On01dnF2exc5PzsIuxS4rLXpc+uio9gr6ZftEV4+rjutr1hOsnN2e3bLcjbn+4W7tnuje4D801m8ude2DugIehB8uj0kPmSfNM8fzBU+Zl4MXyqvJ64m3kzfGu8X7GsGBkMA4yXvnY+oh9jvl88HXzXenb4YfyC/Qr9OvxV/GP9S/zfxxgGJAe0BgwEugUuDywIwgTFBK0PaiPqctkM+uZI8EuwSuDz4WQQ6JDykKehFqGikPb58HzguftmPcwzCRMGNYaDsKZ4TvCH0WYRSyJ+CUSGxkRWR75NMouakVUVzQ1elF0Q/T7GJ+YrTEPYs1jpbGdcYpxyXH1cR/i/eKL42UJcxJWJlxJ1ErkJ7Yl4ZLikmqSRuf7z981fzDZKbkg+c4CswW5Cy4t1FooWHhykeIi1qKjKZiU+JSGlC+scFYVazSVmbo3dYTty97NfsHx5uzkDHM9uMXcZ2keacVpQ+ke6TvSh3levBLeS74vv4z/OiMooyLjQ2Z4Zm3muCBe0JyFz0rJOi5UEWYKzy3WW5y7uFdkJSoQyZa4Ldm1ZEQcIq6RQJIFkrZsVUQgdUvNpd9J+3M8c8pzPi6NW3o0VzlXmNu9zHLZpmXP8gLyflyOXs5e3rnCYMXaFf0rGSsrV0GrUld1rjZanb96cE3gmrq1xLWZa6+us11XvO7d+vj17fm6+WvyB74L/K6xQKFAXNC3wX1DxUb0Rv7Gnk0Om/Zs+lbIKbxcZFtUUvRlM3vz5e/tvi/9fnxL2paerc5b92/DbhNuu7Pda3tdsXJxXvHAjnk7WnbSdhbufLdr0a5LJY4lFbuJu6W7ZaWhpW17jPds2/OljFd2u9ynvHmvzt5Nez/s4+y7sd97f1OFbkVRxecf+D/crQysbKkyrSqpxlbnVD89EHeg60f6j/U1WjVFNV9rhbWyuqi6c/Uu9fUNOg1bG+FGaePwweSD1w/5HWprsm6qbFZvLjoMDksPP/8p5ac7R0KOdB6lH2362eTnvceoxwpboJZlLSOtvFZZW2Jb7/Hg453t7u3HfrH5pfaEwYnyk2ont54inso/NX467/Roh6jj5Zn0MwOdizofnE04e+tc5Lme8yHnL14IuHC2i9F1+qLHxROX3C4dv0y/3HrF+UpLt1P3satOV4/1OPe0XHO51nbd9Xp779zeUze8bpy56Xfzwi3mrSu3w2733om9c7cvuU92l3N36J7g3uv7OffHHqx5iHlY+EjpUcljncdVv1r82ixzlp3s9+vvfhL95MEAe+DFb5LfvgzmP6U8LXmm/6x+yH7oxHDA8PXn858PvhC9GHtZ8Lvy73tfmb/6+Q/vP7pHEkYGX4tfj7/Z/Fbzbe07x3edoxGjj99nvR/7UPhR82PdJ/qnrs/xn5+NLf2C+1L61eJr+7eQbw/Hs8bHRSwxa1IKoJABp6UB8KYW0cWJAFAR/UCcP6WrJw2a+haYJPCfeEp7T5ozANVrAJiQXBOSqsIbABPknojMEciI8Qawg4N8/MskaQ72U7lIrYg0KRkff4voRpwFAF/7xsfHWsfHv9Ygxd4HoOP9lJ6flMhXAcihTtB9t27wT5vS+n/p8Z8zmKjAEfxz/hPZzxa5BBEfaQAAAGJlWElmTU0AKgAAAAgAAgESAAMAAAABAAEAAIdpAAQAAAABAAAAJgAAAAAAA5KGAAcAAAASAAAAUKACAAQAAAABAAAAGKADAAQAAAABAAAAGQAAAABBU0NJSQAAAFNjcmVlbnNob3QQNRc8AAACO2lUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iWE1QIENvcmUgNi4wLjAiPgogICA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPgogICAgICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgICAgICAgICB4bWxuczpleGlmPSJodHRwOi8vbnMuYWRvYmUuY29tL2V4aWYvMS4wLyIKICAgICAgICAgICAgeG1sbnM6dGlmZj0iaHR0cDovL25zLmFkb2JlLmNvbS90aWZmLzEuMC8iPgogICAgICAgICA8ZXhpZjpQaXhlbFlEaW1lbnNpb24+MzI8L2V4aWY6UGl4ZWxZRGltZW5zaW9uPgogICAgICAgICA8ZXhpZjpVc2VyQ29tbWVudD5TY3JlZW5zaG90PC9leGlmOlVzZXJDb21tZW50PgogICAgICAgICA8ZXhpZjpQaXhlbFhEaW1lbnNpb24+MzU8L2V4aWY6UGl4ZWxYRGltZW5zaW9uPgogICAgICAgICA8dGlmZjpPcmllbnRhdGlvbj4xPC90aWZmOk9yaWVudGF0aW9uPgogICAgICA8L3JkZjpEZXNjcmlwdGlvbj4KICAgPC9yZGY6UkRGPgo8L3g6eG1wbWV0YT4KNUAWJwAAAt1JREFUSA21lk9IFFEcx79vdtdZdycqTERBKhBUKLIOSXjpEITiFvbvULeS7N+tP+jNWx3qltSKXewWpYVSEQhdOkoKgf9WEASLLNT8s64zu6/3e/HGmd2ZbVH8wcx7vz/v85v35r35DeNCkE9SKWRGRpCZmAD/9VtGsn0l0KqrodXVAbqebzSCfl4+Po7U0y6kBj+AL614hrHdBvTmRuh3boPV1HjH5MxgZQWph4+QfNYD5J/bJpABxTdboXe0A4axaRc95kzA5+aweuESrLGEK6hQJVhbhejrV2AVFfYQOwGfn8dqUwxWYsZ2bqUTrDqA6PsBsNJSOVxTkOT1G9uGE4sekFhKZAKr9yU2Pn9RNtmyUABFDcddNi/FK45YxCTRYFpIPn6SM9bo7kLkbR/C55pzfMpAcONFXMbpTaeUWbaSKdhaemgI6dkfLicp5sCguDOE4889kyh4INYMPjMD8+uoi0FMYgc6Sko6rdFvLicp1tgkMD2JYCwmLjEL0Zc24XPBEwksn2lB5vt8DkOLhhFoD+mdmZ//Tmh2hFeSdGJaLot88jxwyUqbYIuVBzlfXstmu3R6D+F4XNg4MsPD0Orrwf8HF9FsVwRsYW8ZL+TEhi+eRbibkog0s7NYPt3kuSwyQN3ECdeYEVGqb0trHhLvQgkrL0fRiXql+rbE1gL7K30DyJH9QlP3H5DVd3c5YcTWgseOOm2ufjacdkuypxfrbW0FJSG2FmpsdEGV4gVXW3G9b7CgJJLNN0z+5/ARvrCnzHVZ/f30oeWZqSm+VHvI5VOxyavXODctcZl87fIVVwwxia0hFETxvbvqwe2WTjIVHb9DRIFqJrRls0+yZAq2/bleaznv+cHjZtpO6teh5XTGFZ1sQKT/jQy3E+x4PaACEX3XB6pKWxVZ0QRDFRvi2AWHFCp1xqePKL7VSlu9cKGaLMbQWGe5lExnTXYSd+6vwpmF+tv8L/oLio+JWZ6NQZEAAAAASUVORK5CYII=")},function(i){var r=i.$isValid,A=i.$isValidVisible;return r&&A&&e(b||(b=n(['\n        background-image: url("data:image/png;base64,','");\n      '],['\n        background-image: url("data:image/png;base64,','");\n      '])),"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")}),x=i.input(s||(s=n(["\n  box-sizing: border-box;\n  background-color: var(--clr-background-light, #ffffff);\n  background-image: none;\n  border: ",";\n  border-radius: 0;\n  color: var(--clr-text-dark, #000);\n  display: block;\n  font-size: var(--font-size-m, 1rem);\n  line-height: var(--typ-line-height, 1.5em);\n  min-width: 3em;\n  padding: calc(\n      (\n          var(--_min-height, 48px) -\n            (var(--size-border-width, 1px) * 2) - var(--typ-line-height, 1.5em)\n        ) /\n        2\n    )\n    var(--spacing-xs, 1rem);\n\n  /* Make sure text doesn't go behind the valid indicatior icon */\n  ","\n\n  width: 100%;\n  transition: border-color 150ms linear;\n\n  &:hover {\n    border-color: var(--clr-secondary, #e60079);\n  }\n\n  &:disabled {\n    border-color: var(--clr-disabled, #e6e6e6);\n    color: var(--clr-disabled, #e6e6e6);\n  }\n\n  ","\n  &:-webkit-autofill,\n    &:-webkit-autofill:focus {\n    box-shadow: 0 0 0 3em white inset !important;\n  }\n\n  // increase font size for desktop\n  @media (min-width: 1200px) {\n    font-size: var(--font-size-ml, 1.125rem);\n  }\n"],["\n  box-sizing: border-box;\n  background-color: var(--clr-background-light, #ffffff);\n  background-image: none;\n  border: ",";\n  border-radius: 0;\n  color: var(--clr-text-dark, #000);\n  display: block;\n  font-size: var(--font-size-m, 1rem);\n  line-height: var(--typ-line-height, 1.5em);\n  min-width: 3em;\n  padding: calc(\n      (\n          var(--_min-height, 48px) -\n            (var(--size-border-width, 1px) * 2) - var(--typ-line-height, 1.5em)\n        ) /\n        2\n    )\n    var(--spacing-xs, 1rem);\n\n  /* Make sure text doesn't go behind the valid indicatior icon */\n  ","\n\n  width: 100%;\n  transition: border-color 150ms linear;\n\n  &:hover {\n    border-color: var(--clr-secondary, #e60079);\n  }\n\n  &:disabled {\n    border-color: var(--clr-disabled, #e6e6e6);\n    color: var(--clr-disabled, #e6e6e6);\n  }\n\n  ","\n  &:-webkit-autofill,\n    &:-webkit-autofill:focus {\n    box-shadow: 0 0 0 3em white inset !important;\n  }\n\n  // increase font size for desktop\n  @media (min-width: 1200px) {\n    font-size: var(--font-size-ml, 1.125rem);\n  }\n"])),function(n){var i=n.$hasError;return"solid var(--size-border-width, 1px) ".concat(i?"var(--clr-text-error, #ff0000)":"var(--clr-text-input-border, #2e2d2c)")},function(i){var r=i.$isValidVisible,A=i.$isInvalidVisible;return(r||A)&&e(g||(g=n(["\n      padding-right: 3rem;\n    "],["\n      padding-right: 3rem;\n    "])))},function(i){return i.$hasError&&e(d||(d=n(["\n      ~ "," {\n        border-color: var(--clr-text-error, #ff0000);\n      }\n    "],["\n      ~ "," {\n        border-color: var(--clr-text-error, #ff0000);\n      }\n    "])),h)});export{c as Extra,m as ExtraLeft,h as ExtraRight,p as ExtraWrapper,x as StyledInput,u as StyledInputWrapper};
 //# sourceMappingURL=styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sources":["../../../../src/components/TextField/styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\nimport { type ThemeType } from \"../../types\";\n\nconst MIN_HEIGHT = \"48px\";\n\nconst crossBase64 =\n  \"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\";\n\nconst checkBase64 =\n  \"iVBORw0KGgoAAAANSUhEUgAAABgAAAAZCAYAAAArK+5dAAAK0mlDQ1BJQ0MgUHJvZmlsZQAASImVlwdUU9kWhs+96Y0WQDqhN0E6AaSEHkB6F5WQBBIIMSYEEbsyqOBYUBFBZQCHquDoCMhYEAsWRLFhnyCDgjoOFmyozAUeYWbeeu+tt9c693x3Z5999r65Z63/AkDxY4lEAlgJgCxhtjgq0IeWkJhEww0CCGgDAlADtiy2RMSIiAgFiE3Pf7f3d5BoxG5aT+T699//q6lwuBI2AFAywqkcCTsL4Q5kDLFF4mwAUHWI32hptmiCuxFWFSMFIiyb4PQpfjfBqZOMxk/GxET5IqwDAJ7MYonTASCbI35aDjsdyUMOQthWyOELEc5F2JPNY3EQbkN4dlbW4gn+DWFzJF4EAIWMMD31LznT/5Y/VZ6fxUqX81Rfk4b340tEAtay//PR/G/LEkin9zBFBpknDopCZuTfhO5mLg6RszA1LHya+ZzJ+EnmSYNip5kt8U2aZg7LL0S+VhAWOs1p/ACmPE82M2aauRL/6GkWL46S75Um9mVMM0s8s680M1bu53GZ8vx5vJj4ac7hx4VNsyQzOmQmxlfuF0uj5PVzhYE+M/sGyHvPkvylXz5TvjabFxMk7501Uz9XyJjJKUmQ18bh+vnPxMTK40XZPvK9RIIIeTxXECj3S3Ki5WuzkZdzZm2E/BlmsIIjphlEgFDgAByBK3KNB5HZ3NzsiSZ8F4uWifnpvGwaAzlpXBpTyLaZTbO3tbcDYOLcTr0Kb+9OnkdIHT/jS0POl2MDclZcZ3yCDQCcuQ6AwsYZn9FbAAgTfgFbKs6Z8qEnLhhABIpAFWgCPWAEzIE1sAfOwB14A38QDMJBDEgECwEb8EAWEIOlYAVYCwpAEdgGdoEyUAGqQR04BI6AVnACnAEXwBVwHdwGD4AMDIIXYAS8B2MQBOEgCkSFNCF9yASyguwhOuQJ+UOhUBSUCKVA6ZAQkkIroPVQEVQMlUGVUD30E3QcOgNdgnqhe1A/NAy9gT7DKJgMq8K6sCk8B6bDDDgEjoEXwOnwEjgPzoe3wKVwFXwQboHPwFfg27AMfgGPogCKhFJHGaCsUXSULyoclYRKQ4lRq1CFqBJUFaoJ1Y7qQt1EyVAvUZ/QWDQVTUNbo93RQehYNBu9BL0KvRldhq5Dt6DPoW+i+9Ej6G8YCkYHY4VxwzAxCZh0zFJMAaYEU4M5hjmPuY0ZxLzHYrHqWDOsCzYIm4jNwC7HbsbuwzZjO7C92AHsKA6H08RZ4Txw4TgWLhtXgNuDO4g7jbuBG8R9xJPw+nh7fAA+CS/Er8OX4Bvwp/A38M/wYwQlggnBjRBO4BCWEbYSDhDaCdcIg4QxojLRjOhBjCFmENcSS4lNxPPEh8S3JBLJkORKiiTxSWtIpaTDpIukftInsgrZkuxLTiZLyVvIteQO8j3yWwqFYkrxpiRRsilbKPWUs5THlI8KVAUbBaYCR2G1QrlCi8INhVeKBEUTRYbiQsU8xRLFo4rXFF8qEZRMlXyVWEqrlMqVjiv1KY0qU5XtlMOVs5Q3KzcoX1IeUsGpmKr4q3BU8lWqVc6qDFBRVCOqL5VNXU89QD1PHVTFqpqpMlUzVItUD6n2qI6oqag5qsWp5aqVq51Uk6mj1E3VmeoC9a3qR9TvqH+epTuLMYs7a9Osplk3Zn3Q0Nbw1uBqFGo0a9zW+KxJ0/TXzNTcrtmq+UgLrWWpFam1VGu/1nmtl9qq2u7abO1C7SPa93VgHUudKJ3lOtU63Tqjunq6gboi3T26Z3Vf6qnreetl6O3UO6U3rE/V99Tn6+/UP63/nKZGY9AEtFLaOdqIgY5BkIHUoNKgx2DM0Mww1nCdYbPhIyOiEd0ozWinUafRiLG+8TzjFcaNxvdNCCZ0E57JbpMukw+mZqbxphtMW02HzDTMmGZ5Zo1mD80p5l7mS8yrzG9ZYC3oFpkW+yyuW8KWTpY8y3LLa1awlbMV32qfVe9szGzX2cLZVbP7rMnWDOsc60brfht1m1CbdTatNq/mGM9JmrN9Ttecb7ZOtgLbA7YP7FTsgu3W2bXbvbG3tGfbl9vfcqA4BDisdmhzeO1o5ch13O9414nqNM9pg1On01dnF2exc5PzsIuxS4rLXpc+uio9gr6ZftEV4+rjutr1hOsnN2e3bLcjbn+4W7tnuje4D801m8ude2DugIehB8uj0kPmSfNM8fzBU+Zl4MXyqvJ64m3kzfGu8X7GsGBkMA4yXvnY+oh9jvl88HXzXenb4YfyC/Qr9OvxV/GP9S/zfxxgGJAe0BgwEugUuDywIwgTFBK0PaiPqctkM+uZI8EuwSuDz4WQQ6JDykKehFqGikPb58HzguftmPcwzCRMGNYaDsKZ4TvCH0WYRSyJ+CUSGxkRWR75NMouakVUVzQ1elF0Q/T7GJ+YrTEPYs1jpbGdcYpxyXH1cR/i/eKL42UJcxJWJlxJ1ErkJ7Yl4ZLikmqSRuf7z981fzDZKbkg+c4CswW5Cy4t1FooWHhykeIi1qKjKZiU+JSGlC+scFYVazSVmbo3dYTty97NfsHx5uzkDHM9uMXcZ2keacVpQ+ke6TvSh3levBLeS74vv4z/OiMooyLjQ2Z4Zm3muCBe0JyFz0rJOi5UEWYKzy3WW5y7uFdkJSoQyZa4Ldm1ZEQcIq6RQJIFkrZsVUQgdUvNpd9J+3M8c8pzPi6NW3o0VzlXmNu9zHLZpmXP8gLyflyOXs5e3rnCYMXaFf0rGSsrV0GrUld1rjZanb96cE3gmrq1xLWZa6+us11XvO7d+vj17fm6+WvyB74L/K6xQKFAXNC3wX1DxUb0Rv7Gnk0Om/Zs+lbIKbxcZFtUUvRlM3vz5e/tvi/9fnxL2paerc5b92/DbhNuu7Pda3tdsXJxXvHAjnk7WnbSdhbufLdr0a5LJY4lFbuJu6W7ZaWhpW17jPds2/OljFd2u9ynvHmvzt5Nez/s4+y7sd97f1OFbkVRxecf+D/crQysbKkyrSqpxlbnVD89EHeg60f6j/U1WjVFNV9rhbWyuqi6c/Uu9fUNOg1bG+FGaePwweSD1w/5HWprsm6qbFZvLjoMDksPP/8p5ac7R0KOdB6lH2362eTnvceoxwpboJZlLSOtvFZZW2Jb7/Hg453t7u3HfrH5pfaEwYnyk2ont54inso/NX467/Roh6jj5Zn0MwOdizofnE04e+tc5Lme8yHnL14IuHC2i9F1+qLHxROX3C4dv0y/3HrF+UpLt1P3satOV4/1OPe0XHO51nbd9Xp779zeUze8bpy56Xfzwi3mrSu3w2733om9c7cvuU92l3N36J7g3uv7OffHHqx5iHlY+EjpUcljncdVv1r82ixzlp3s9+vvfhL95MEAe+DFb5LfvgzmP6U8LXmm/6x+yH7oxHDA8PXn858PvhC9GHtZ8Lvy73tfmb/6+Q/vP7pHEkYGX4tfj7/Z/Fbzbe07x3edoxGjj99nvR/7UPhR82PdJ/qnrs/xn5+NLf2C+1L61eJr+7eQbw/Hs8bHRSwxa1IKoJABp6UB8KYW0cWJAFAR/UCcP6WrJw2a+haYJPCfeEp7T5ozANVrAJiQXBOSqsIbABPknojMEciI8Qawg4N8/MskaQ72U7lIrYg0KRkff4voRpwFAF/7xsfHWsfHv9Ygxd4HoOP9lJ6flMhXAcihTtB9t27wT5vS+n/p8Z8zmKjAEfxz/hPZzxa5BBEfaQAAAGJlWElmTU0AKgAAAAgAAgESAAMAAAABAAEAAIdpAAQAAAABAAAAJgAAAAAAA5KGAAcAAAASAAAAUKACAAQAAAABAAAAGKADAAQAAAABAAAAGQAAAABBU0NJSQAAAFNjcmVlbnNob3QQNRc8AAACO2lUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iWE1QIENvcmUgNi4wLjAiPgogICA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPgogICAgICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIgogICAgICAgICAgICB4bWxuczpleGlmPSJodHRwOi8vbnMuYWRvYmUuY29tL2V4aWYvMS4wLyIKICAgICAgICAgICAgeG1sbnM6dGlmZj0iaHR0cDovL25zLmFkb2JlLmNvbS90aWZmLzEuMC8iPgogICAgICAgICA8ZXhpZjpQaXhlbFlEaW1lbnNpb24+MzA8L2V4aWY6UGl4ZWxZRGltZW5zaW9uPgogICAgICAgICA8ZXhpZjpVc2VyQ29tbWVudD5TY3JlZW5zaG90PC9leGlmOlVzZXJDb21tZW50PgogICAgICAgICA8ZXhpZjpQaXhlbFhEaW1lbnNpb24+MzU8L2V4aWY6UGl4ZWxYRGltZW5zaW9uPgogICAgICAgICA8dGlmZjpPcmllbnRhdGlvbj4xPC90aWZmOk9yaWVudGF0aW9uPgogICAgICA8L3JkZjpEZXNjcmlwdGlvbj4KICAgPC9yZGY6UkRGPgo8L3g6eG1wbWV0YT4K2qAMJwAAAoBJREFUSA21ll9IU1Ecx787m0ora7m0cpnQrCY+REh/9KHCosCX7CmwRUFQUVDQk2RIrOytoAdhBkEP5UsP6otQD6MImhXSkzhBIxUptWwlLdK5Ot8b53LvNtfuFb8Pu797zu/3+d4z7vmd6/gjhRyaTy5g6NMIPsxM4Fviu5a53r0O20orUL25CoWughzVgGup2dGZcTyO9iAy/BZz87+yphUXrkLDzr0I1jXBX7o1a44jfQUJCQu/6MKTd33IuTQDziHjU3sacfFQM9zS1CiTwfSPL7jcFcLo10ljTt6x3+tDR3MbytZu0Gt0g9mfcZx7dB1j8Sl90k5Q6dmIh2fvoGS1RysXCtLafW/ZcLL4gGQpaQY975/jzdigGrN1rd0SgEv8e16yyKREMrWIB6+e2oKqomOB/QifDqH9+FU1pDHJFq9HBvB5blafsBoQfvvENVnmQGQoqpeTSbZ4Kd9zuzLCb3TfxbNYvwlFthiUu9SO/gcnk2wxGZ/O4Bc5c2//fOCEki0SC79NBizuvdQBv7fcNK5u8oUzn2zhLihStdq1obpO7kQvwsFbGSZW4ISRLXyeMpNBa+99RGJReNd4TCZW4YSS7Tx5PngzNvVRN0nJ7h0Z7pfdsQI15dtxOFAPp5xtabwgfx3I9rboxWnBgapaiIOy3aYrmUqhRW53tZIrR87IFGtwMskW9dJlU3FJugeMJovS0MqTE0Ym2Vo3Zd8I9XVmmHCA/WWXbwcGJmJZ55cabJN/adPuo9C6E4N9lTVZc7kSq3CyyKT0dt0u+wl7+XJFBllKugEPiE7ZEXkq2RVryVCHDTn6iaagK3omKxNeV+yrwmjCeLnfRX8BLskwhmjw6AkAAAAASUVORK5CYII=\";\n\ntype ExtraProps = {\n  theme: ThemeType;\n};\n\ntype StyledInputProps = {\n  $hasError: boolean;\n  $isValid: boolean;\n  theme: ThemeType;\n  $isValidVisible?: boolean;\n  $isInvalidVisible?: boolean;\n};\n\nexport const Extra = styled.span<ExtraProps>`\n  box-sizing: border-box;\n  display: block;\n  background-color: ${({ theme }) => theme.colors.textInputExtraInfo};\n  color: ${({ theme }) => theme.colors.textDark};\n  font-size: ${({ theme }) => theme.fontSizes.m};\n  line-height: ${({ theme }) => theme.typography.lineHeight};\n  font-weight: ${({ theme }) => theme.typography.fontWeightLight};\n  padding: ${({ theme }) =>\n    `calc((${MIN_HEIGHT} - 1em ) / 2) ${theme.spacing.xs}`};\n  margin: 0;\n  line-height: 1rem;\n  width: auto;\n`;\n\nexport const ExtraLeft = styled(Extra)`\n  box-sizing: border-box;\n  width: auto;\n  vertical-align: middle;\n  height: ${MIN_HEIGHT};\n\n  button {\n    min-height: ${({ theme }) =>\n      `calc(${MIN_HEIGHT} - (2 * ${theme.utilities.inputBorderWidth}))`} !important;\n  }\n`;\n\nexport const ExtraRight = styled(Extra)<ExtraProps>`\n  box-sizing: border-box;\n  width: auto;\n  border: ${({ theme }) =>\n    `solid ${theme.utilities.inputBorderWidth} ${theme.colors.textInputBorder}`};\n  transition: border-color 150ms linear;\n  border-left: 0;\n  background-color: transparent;\n  padding: 0;\n  height: ${MIN_HEIGHT};\n  vertical-align: middle;\n\n  button {\n    min-height: ${({ theme }) =>\n      `calc(${MIN_HEIGHT} - (2 * ${theme.utilities.inputBorderWidth}))`} !important;\n  }\n`;\n\nexport const ExtraWrapper = styled.span`\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n`;\n\nexport const StyledInputWrapper = styled.span<StyledInputProps>`\n  box-sizing: border-box;\n  position: relative;\n  display: block;\n  flex: 1 1;\n  &:after {\n    display: ${({ $isValidVisible, $isInvalidVisible }) =>\n      !!$isInvalidVisible || !!$isValidVisible ? \"block\" : \"none\"};\n    position: absolute;\n    width: 2em;\n    z-index: 1;\n    bottom: 0;\n    right: 0;\n    content: \"\";\n    top: 0;\n    background-repeat: no-repeat;\n    background-position: ${({ theme }) =>\n      `calc( 100% - ${theme.spacing.xxs}) 50% `};\n    ${({ $isValid, $isInvalidVisible }) =>\n      !$isValid &&\n      $isInvalidVisible &&\n      css`\n        background-image: url(\"data:image/png;base64,${crossBase64}\");\n      `}\n    ${({ $isValid, $isValidVisible }) =>\n      $isValid &&\n      $isValidVisible &&\n      css`\n        background-image: url(\"data:image/png;base64,${checkBase64}\");\n      `}\n  }\n`;\n\nexport const StyledInput = styled.input<StyledInputProps>`\n  box-sizing: border-box;\n  background-color: ${({ theme }) => theme.colors.backgroundLight};\n  background-image: none;\n  border: ${({ $hasError, theme }) =>\n    `solid ${theme.utilities.inputBorderWidth} ${\n      $hasError ? theme.colors.textError : theme.colors.textInputBorder\n    }`};\n  border-radius: 0;\n  color: ${({ theme }) => theme.colors.textDark};\n  display: block;\n  font-size: ${({ theme }) => theme.fontSizes.m};\n  line-height: ${({ theme }) => theme.typography.lineHeight};\n  min-width: 3em;\n  padding: ${({ theme }) =>\n    `calc((${MIN_HEIGHT} - (${theme.utilities.inputBorderWidth} * 2) - ${theme.typography.lineHeight} ) / 2) ${theme.spacing.xs}`};\n\n  /* Make sure text doesn't go behind the valid indicatior icon */\n  ${({ $isValidVisible, $isInvalidVisible }) =>\n    ($isValidVisible || $isInvalidVisible) &&\n    css`\n      padding-right: 3rem;\n    `}\n\n  width: 100%;\n  transition: border-color 150ms linear;\n  &:hover {\n    border-color: ${({ theme }) => theme.colors.secondary};\n  }\n  &:disabled {\n    border-color: ${({ theme }) => theme.colors.disabled};\n    color: ${({ theme }) => theme.colors.disabled};\n  }\n\n  ${({ theme }) =>\n    !theme.utilities.useDefaultFocusRect\n      ? css`\n          &:focus {\n            outline: 0;\n            border-color: ${theme.colors.tertiary};\n            ~ ${ExtraRight} {\n              border-color: ${theme.colors.tertiary};\n            }\n          }\n        `\n      : null};\n\n  ${({ $hasError, theme }) =>\n    $hasError &&\n    css`\n      ~ ${ExtraRight} {\n        border-color: ${theme.colors.textError};\n      }\n    `}\n  &:-webkit-autofill,\n    &:-webkit-autofill:focus {\n    box-shadow: 0 0 0 3em white inset !important;\n  }\n\n  // increase font size for desktop\n  @media (min-width: ${({ theme }) => theme.breakpoint.desktopLarge}) {\n    font-size: ${({ theme }) => theme.fontSizes.ml};\n  }\n`;\n"],"names":["MIN_HEIGHT","Extra","styled","span","templateObject_1","__makeTemplateObject","_a","theme","colors","textInputExtraInfo","textDark","fontSizes","m","typography","lineHeight","fontWeightLight","concat","spacing","xs","ExtraLeft","templateObject_2","utilities","inputBorderWidth","ExtraRight","templateObject_3","textInputBorder","ExtraWrapper","templateObject_4","StyledInputWrapper","templateObject_7","$isValidVisible","$isInvalidVisible","xxs","$isValid","css","templateObject_5","templateObject_6","StyledInput","input","templateObject_11","backgroundLight","$hasError","textError","templateObject_8","secondary","disabled","useDefaultFocusRect","templateObject_9","tertiary","templateObject_10","breakpoint","desktopLarge","ml"],"mappings":"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"}
+{"version":3,"file":"styles.js","sources":["../../../../src/components/TextField/styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\nconst crossBase64 =\n  \"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\";\n\nconst checkBase64 =\n  \"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\";\n\ntype StyledInputProps = {\n  $hasError: boolean;\n  $isValid: boolean;\n  $isValidVisible?: boolean;\n  $isInvalidVisible?: boolean;\n};\n\nexport const Extra = styled.span`\n  box-sizing: border-box;\n  display: block;\n  background-color: var(--clr-text-input-extra-info, #e6e6e6);\n  color: var(--clr-text-dark, #000);\n  font-size: var(--font-size-m, 1em);\n  line-height: var(--typ-line-height, 1.5em);\n  font-weight: var(--typ-font-weight-base, 300);\n  font-family: var(--typ-font-family-base, \"Poppins\", Arial, sans-serif);\n  padding: calc((var(--_min-height, 48px) - 1em) / 2) var(--spacing-xs, 1rem);\n  margin: 0;\n  line-height: 1rem;\n  width: auto;\n`;\n\nexport const ExtraLeft = styled(Extra)`\n  box-sizing: border-box;\n  width: auto;\n  vertical-align: middle;\n  height: var(--_min-height, 48px);\n\n  button {\n    min-height: calc(\n      var(--_min-height, 48px) - (2 * var(--size-border-width, 1px))\n    ) !important;\n  }\n`;\n\nexport const ExtraRight = styled(Extra)`\n  box-sizing: border-box;\n  width: auto;\n  border: solid var(--size-border-width, 1px)\n    var(--clr-text-input-border, #2e2d2c);\n  transition: border-color 150ms linear;\n  border-left: 0;\n  background-color: transparent;\n  padding: 0;\n  height: var(--_min-height, 48px);\n  vertical-align: middle;\n\n  button {\n    min-height: calc(\n      var(--_min-height, 48px) - (2 * var(--size-border-width, 1px))\n    ) !important;\n  }\n`;\n\nexport const ExtraWrapper = styled.span`\n  box-sizing: border-box;\n  display: flex;\n  align-items: center;\n`;\n\nexport const StyledInputWrapper = styled.span<StyledInputProps>`\n  --_min-height: 48px;\n  box-sizing: border-box;\n  position: relative;\n  display: block;\n  flex: 1 1;\n  &:after {\n    display: ${({ $isValidVisible, $isInvalidVisible }) =>\n      !!$isInvalidVisible || !!$isValidVisible ? \"block\" : \"none\"};\n    position: absolute;\n    width: 2em;\n    z-index: 1;\n    bottom: 0;\n    right: 0;\n    content: \"\";\n    top: 0;\n    background-repeat: no-repeat;\n    background-position: calc(100% - var(--spacing-xxs, 0.5rem)) 50%;\n    ${({ $isValid, $isInvalidVisible }) =>\n      !$isValid &&\n      $isInvalidVisible &&\n      css`\n        background-image: url(\"data:image/png;base64,${crossBase64}\");\n      `}\n    ${({ $isValid, $isValidVisible }) =>\n      $isValid &&\n      $isValidVisible &&\n      css`\n        background-image: url(\"data:image/png;base64,${checkBase64}\");\n      `}\n  }\n`;\n\nexport const StyledInput = styled.input<StyledInputProps>`\n  box-sizing: border-box;\n  background-color: var(--clr-background-light, #ffffff);\n  background-image: none;\n  border: ${({ $hasError }) =>\n    `solid var(--size-border-width, 1px) ${\n      $hasError\n        ? \"var(--clr-text-error, #ff0000)\"\n        : \"var(--clr-text-input-border, #2e2d2c)\"\n    }`};\n  border-radius: 0;\n  color: var(--clr-text-dark, #000);\n  display: block;\n  font-size: var(--font-size-m, 1rem);\n  line-height: var(--typ-line-height, 1.5em);\n  min-width: 3em;\n  padding: calc(\n      (\n          var(--_min-height, 48px) -\n            (var(--size-border-width, 1px) * 2) - var(--typ-line-height, 1.5em)\n        ) /\n        2\n    )\n    var(--spacing-xs, 1rem);\n\n  /* Make sure text doesn't go behind the valid indicatior icon */\n  ${({ $isValidVisible, $isInvalidVisible }) =>\n    ($isValidVisible || $isInvalidVisible) &&\n    css`\n      padding-right: 3rem;\n    `}\n\n  width: 100%;\n  transition: border-color 150ms linear;\n\n  &:hover {\n    border-color: var(--clr-secondary, #e60079);\n  }\n\n  &:disabled {\n    border-color: var(--clr-disabled, #e6e6e6);\n    color: var(--clr-disabled, #e6e6e6);\n  }\n\n  ${({ $hasError }) =>\n    $hasError &&\n    css`\n      ~ ${ExtraRight} {\n        border-color: var(--clr-text-error, #ff0000);\n      }\n    `}\n  &:-webkit-autofill,\n    &:-webkit-autofill:focus {\n    box-shadow: 0 0 0 3em white inset !important;\n  }\n\n  // increase font size for desktop\n  @media (min-width: 1200px) {\n    font-size: var(--font-size-ml, 1.125rem);\n  }\n`;\n"],"names":["Extra","styled","span","templateObject_1","__makeTemplateObject","ExtraLeft","templateObject_2","ExtraRight","templateObject_3","ExtraWrapper","templateObject_4","StyledInputWrapper","templateObject_7","_a","$isValidVisible","$isInvalidVisible","$isValid","css","templateObject_5","templateObject_6","StyledInput","input","templateObject_10","$hasError","templateObject_8","templateObject_9"],"mappings":"2HAEA,wBAaaA,EAAQC,EAAOC,KAAIC,IAAAA,EAAAC,EAAA,CAAA,ifAAA,CAAA,ofAenBC,EAAYJ,EAAOD,EAAPC,CAAaK,IAAAA,EAAAF,EAAA,CAAA,oPAAA,CAAA,uPAazBG,EAAaN,EAAOD,EAAPC,CAAaO,IAAAA,EAAAJ,EAAA,CAAA,6bAAA,CAAA,gcAmB1BK,EAAeR,EAAOC,KAAIQ,IAAAA,EAAAN,EAAA,CAAA,2EAAA,CAAA,8EAM1BO,EAAqBV,EAAOC,KAAIU,IAAAA,EAAAR,EAAA,CAAA,0IAAA,6OAAA,SAAA,WAAA,CAAkB,0IAQE,6OAe1D,SAMA,aAtBQ,SAACS,OAAEC,EAAeD,EAAAC,gBAC3B,OAD8CD,EAAAE,mBACrBD,EAAkB,QAAU,MAArD,EAUA,SAACD,OAAEG,EAAQH,EAAAG,SAAED,EAAiBF,EAAAE,kBAC9B,OAACC,GACDD,GACAE,EAAGC,IAAAA,EAAAd,EAAA,CAAA,0DAAA,eAAA,CAAA,0DACyD,iBAvFhE,2jLAoFI,EAKA,SAACS,OAAEG,EAAQH,EAAAG,SAAEF,EAAeD,EAAAC,gBAC5B,OAAAE,GACAF,GACAG,EAAGE,IAAAA,EAAAf,EAAA,CAAA,0DAAA,eAAA,CAAA,0DACyD,iBA1FhE,+7KAuFI,GAQOgB,EAAcnB,EAAOoB,MAAKC,IAAAA,EAAAlB,EAAA,CAAA,gIAAA,qdAAA,6PAAA,gPAAA,CAAkB,gIASnD,qdAqBD,6PAoBA,kPA9CO,SAACS,GAAE,IAAAU,EAASV,EAAAU,UACpB,MAAA,8CACEA,EACI,iCACA,wCAHN,EAqBA,SAACV,OAAEC,EAAeD,EAAAC,gBAAEC,EAAiBF,EAAAE,kBACrC,OAACD,GAAmBC,IACpBE,EAAGO,IAAAA,EAAApB,EAAA,CAAA,sCAAA,CAAA,wCADH,EAiBA,SAACS,GACD,OADYA,EAAAU,WAEZN,EAAGQ,IAAAA,EAAArB,EAAA,CAAA,aAAA,4EAAA,CAAA,aACa,8EAAVG,EAFN"}

package/lib/src/components/Totaliser/index.d.ts

@@ -1,5 +1,8 @@
 import React, { type ReactNode } from "react";
-export type TotaliserProps = {
+/**
+ * Think Blue Peter, used to display total raised and if target prop is passed will display percentage of target reached.
+ * */
+export declare function Totaliser({ total, additionalAmount, giftAid, target, isCompact, summaryMessage, children, }: {
     /** financial total as a number */
     total: number;
     /** additional donation amount as a number */
@@ -14,9 +17,5 @@ export type TotaliserProps = {
     summaryMessage?: ReactNode;
     /** component children */
     children?: ReactNode;
-};
-/**
- * Think Blue Peter, used to display total raised and if target prop is passed will display tercentage of target reached.
- * */
-export declare function Totaliser({ total, additionalAmount, giftAid, target, isCompact, summaryMessage, children, }: TotaliserProps): React.JSX.Element;
+}): React.JSX.Element;
 export default Totaliser;

package/lib/src/components/Totaliser/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}from"styled-components";import{calculatePercentRounded as r,formatMoneyWithCommas as m}from"../../utils/Helper.js";import{crukTheme as l}from"../../themes/cruk.js";import{Text as a}from"../Text/index.js";import{Badge as o}from"../Badge/index.js";import{Box as i}from"../Box/index.js";import{TotaliserWrapper as c,BubbleWrapper as s,BubbleText as d,Total as p,GiftAid as u,ProgressBarWrapper as E,StyledProgressBar as f,Summary as g,CompactWrapper as h}from"./styles.js";function x(x){var j=x.total,v=x.additionalAmount,y=x.giftAid,A=x.target,B=void 0===A?null:A,C=x.isCompact,b=x.summaryMessage,H=void 0===b?void 0:b,T=x.children,$=n(),k=e(e({},l),$),z=r(+j,B||0),F=r(v?+j+(v||0):0,B||0),G="".concat(z,"% of the £").concat(m(B||0)," target");return t.createElement(c,{$isCompact:C||!1,theme:k},C?t.createElement(i,{marginHorizontal:"none",marginRight:"xxs",marginBottom:"none"},t.createElement(o,null,"£".concat(m(j)))):t.createElement(s,{theme:k},t.createElement(d,null,"Total raised"),t.createElement(p,null,"£",m(j)),t.createElement(u,null,"+ £",m(y||0)," Gift Aid")),(!!B||!!H)&&t.createElement(t.Fragment,null,t.createElement(E,{$isCompact:C||!1,theme:k},t.createElement(f,{theme:k,percentage:z,secondaryPercentage:F}),C?t.createElement(h,{theme:k},null!==B&&t.createElement(g,null,t.createElement(a,{as:"span"},G))):H?t.createElement(g,null,H):t.createElement(g,null,t.createElement(a,{as:"span"},G)))),T)}export{x as Totaliser,x as default};
+import e from"react";import{calculatePercentRounded as t,formatMoneyWithCommas as n}from"../../utils/Helper.js";import{Text as l}from"../Text/index.js";import{Badge as a}from"../Badge/index.js";import{Box as r}from"../Box/index.js";import{TotaliserWrapper as m,BubbleWrapper as o,BubbleText as c,Total as i,GiftAid as s,ProgressBarWrapper as u,StyledProgressBar as E,Summary as d,CompactWrapper as p}from"./styles.js";function g(g){var f=g.total,x=g.additionalAmount,j=g.giftAid,v=g.target,h=void 0===v?null:v,y=g.isCompact,A=g.summaryMessage,B=void 0===A?void 0:A,C=g.children,H=t(+f,h||0),T=t(x?+f+(x||0):0,h||0),$="".concat(H,"% of the £").concat(n(h||0)," target");return e.createElement(m,{$isCompact:y||!1},y?e.createElement(r,{marginHorizontal:"none",marginRight:"xxs",marginBottom:"none"},e.createElement(a,null,"£".concat(n(f)))):e.createElement(o,null,e.createElement(c,null,"Total raised"),e.createElement(i,null,"£",n(f)),e.createElement(s,null,"+ £",n(j||0)," Gift Aid")),(!!h||!!B)&&e.createElement(e.Fragment,null,e.createElement(u,{$isCompact:y||!1},e.createElement(E,{percentage:H,secondaryPercentage:T}),y?e.createElement(p,null,null!==h&&e.createElement(d,null,e.createElement(l,{as:"span"},$))):B?e.createElement(d,null,B):e.createElement(d,null,e.createElement(l,{as:"span"},$)))),C)}export{g as Totaliser,g as default};
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/Totaliser/index.tsx"],"sourcesContent":["import React, { type ReactNode } from \"react\";\nimport { useTheme } from \"styled-components\";\n\nimport {\n  calculatePercentRounded,\n  formatMoneyWithCommas,\n} from \"../../utils/Helper\";\n\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\nimport { Text } from \"../Text\";\nimport { Badge } from \"../Badge\";\nimport { Box } from \"../Box\";\n\nimport {\n  TotaliserWrapper,\n  CompactWrapper,\n  Summary,\n  BubbleWrapper,\n  BubbleText,\n  GiftAid,\n  Total,\n  ProgressBarWrapper,\n  StyledProgressBar,\n} from \"./styles\";\n\nexport type TotaliserProps = {\n  /** financial total as a number */\n  total: number;\n  /** additional donation amount as a number */\n  additionalAmount?: number;\n  /** git aid total as a number */\n  giftAid?: number;\n  /** money target as a number */\n  target?: number | null;\n  /** flag for low height compact appearance */\n  isCompact?: boolean;\n  /** component for custom summary message underneath total graph only visible if there is a target */\n  summaryMessage?: ReactNode;\n  /** component children */\n  children?: ReactNode;\n};\n\n// TODO figure out how we want to handle AriaAttributes\n\n/**\n * Think Blue Peter, used to display total raised and if target prop is passed will display tercentage of target reached.\n * */\nexport function Totaliser({\n  total,\n  additionalAmount,\n  giftAid,\n  target = null,\n  isCompact,\n  summaryMessage = undefined,\n  children,\n}: TotaliserProps) {\n  const foundTheme = useTheme();\n  const theme = {\n    ...defaultTheme,\n    ...foundTheme,\n  };\n  const percentageOfTotal = calculatePercentRounded(+total, target || 0);\n  const withAdditionalPercentageOfTotal = calculatePercentRounded(\n    additionalAmount ? +total + (additionalAmount || 0) : 0,\n    target || 0,\n  );\n\n  const summaryString = `${percentageOfTotal}% of the £${formatMoneyWithCommas(\n    target || 0,\n  )} target`;\n\n  return (\n    <TotaliserWrapper $isCompact={isCompact || false} theme={theme}>\n      {!isCompact ? (\n        <BubbleWrapper theme={theme}>\n          <BubbleText>Total raised</BubbleText>\n          <Total>£{formatMoneyWithCommas(total)}</Total>\n          <GiftAid>+ £{formatMoneyWithCommas(giftAid || 0)} Gift Aid</GiftAid>\n        </BubbleWrapper>\n      ) : (\n        <Box marginHorizontal=\"none\" marginRight=\"xxs\" marginBottom=\"none\">\n          <Badge>{`£${formatMoneyWithCommas(total)}`}</Badge>\n        </Box>\n      )}\n      {/* We don't want to show the default summaryMessage if there is no target, because the summary is associated with the target progress bar */}\n      {/* However, if we explicitly pass a summaryMessage string/component, then we want to always display it even if the target is zero */}\n\n      {(!!target || !!summaryMessage) && (\n        <>\n          <ProgressBarWrapper $isCompact={isCompact || false} theme={theme}>\n            <StyledProgressBar\n              theme={theme}\n              percentage={percentageOfTotal}\n              secondaryPercentage={withAdditionalPercentageOfTotal}\n            />\n            {!isCompact ? (\n              summaryMessage ? (\n                <Summary>{summaryMessage}</Summary>\n              ) : (\n                <Summary>\n                  <Text as=\"span\">{summaryString}</Text>\n                </Summary>\n              )\n            ) : (\n              <CompactWrapper theme={theme}>\n                {target !== null && (\n                  <Summary>\n                    <Text as=\"span\">{summaryString}</Text>\n                  </Summary>\n                )}\n              </CompactWrapper>\n            )}\n          </ProgressBarWrapper>\n        </>\n      )}\n      {children}\n    </TotaliserWrapper>\n  );\n}\n\nexport default Totaliser;\n"],"names":["Totaliser","_a","total","additionalAmount","giftAid","_b","target","isCompact","_c","summaryMessage","undefined","children","foundTheme","useTheme","theme","__assign","defaultTheme","percentageOfTotal","calculatePercentRounded","withAdditionalPercentageOfTotal","summaryString","concat","formatMoneyWithCommas","React","createElement","TotaliserWrapper","$isCompact","Box","marginHorizontal","marginRight","marginBottom","Badge","BubbleWrapper","BubbleText","Total","GiftAid","Fragment","ProgressBarWrapper","StyledProgressBar","percentage","secondaryPercentage","CompactWrapper","Summary","Text","as"],"mappings":"okBA+CM,SAAUA,EAAUC,OACxBC,EAAKD,EAAAC,MACLC,EAAgBF,EAAAE,iBAChBC,EAAOH,EAAAG,QACPC,EAAAJ,EAAAK,OAAAA,OAAM,IAAAD,EAAG,OACTE,EAASN,EAAAM,UACTC,EAAAP,EAAAQ,eAAAA,OAAc,IAAAD,OAAGE,EAASF,EAC1BG,EAAQV,EAAAU,SAEFC,EAAaC,IACbC,EAAKC,EAAAA,EAAA,CAAA,EACNC,GACAJ,GAECK,EAAoBC,GAAyBhB,EAAOI,GAAU,GAC9Da,EAAkCD,EACtCf,GAAoBD,GAASC,GAAoB,GAAK,EACtDG,GAAU,GAGNc,EAAgB,GAAAC,OAAGJ,EAAiB,cAAAI,OAAaC,EACrDhB,GAAU,GACX,WAED,OACEiB,EAAAC,cAACC,EAAgB,CAAAC,WAAanB,IAAa,EAAOO,MAAOA,GACrDP,EAOAgB,EAAAC,cAACG,EAAG,CAACC,iBAAiB,OAAOC,YAAY,MAAMC,aAAa,QAC1DP,EAAAC,cAACO,EAAK,KAAE,IAAAV,OAAIC,EAAsBpB,MAPpCqB,gBAACS,EAAa,CAAClB,MAAOA,GACpBS,EAAAC,cAACS,EAAU,KAAA,gBACXV,EAAAC,cAACU,EAAK,SAAGZ,EAAsBpB,IAC/BqB,EAAAC,cAACW,EAAO,WAAKb,EAAsBlB,GAAW,GAAsB,iBAUpEE,KAAYG,IACdc,EAAAC,cAAAD,EAAAa,SAAA,KACEb,EAAAC,cAACa,cAA+B9B,IAAa,EAAOO,MAAOA,GACzDS,EAAAC,cAACc,EAAiB,CAChBxB,MAAOA,EACPyB,WAAYtB,EACZuB,oBAAqBrB,IAErBZ,EASAgB,EAAAC,cAACiB,EAAc,CAAC3B,MAAOA,GACT,OAAXR,GACCiB,EAAAC,cAACkB,EAAO,KACNnB,EAAAC,cAACmB,EAAI,CAACC,GAAG,QAAQxB,KAXvBX,EACEc,gBAACmB,EAAO,KAAEjC,GAEVc,EAAAC,cAACkB,EAAO,KACNnB,EAAAC,cAACmB,EAAI,CAACC,GAAG,QAAQxB,MAe5BT,EAGP"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/Totaliser/index.tsx"],"sourcesContent":["import React, { type ReactNode } from \"react\";\n\nimport {\n  calculatePercentRounded,\n  formatMoneyWithCommas,\n} from \"../../utils/Helper\";\n\nimport { Text } from \"../Text\";\nimport { Badge } from \"../Badge\";\nimport { Box } from \"../Box\";\n\nimport {\n  TotaliserWrapper,\n  CompactWrapper,\n  Summary,\n  BubbleWrapper,\n  BubbleText,\n  GiftAid,\n  Total,\n  ProgressBarWrapper,\n  StyledProgressBar,\n} from \"./styles\";\n\n// TODO figure out how we want to handle AriaAttributes\n\n/**\n * Think Blue Peter, used to display total raised and if target prop is passed will display percentage of target reached.\n * */\nexport function Totaliser({\n  total,\n  additionalAmount,\n  giftAid,\n  target = null,\n  isCompact,\n  summaryMessage = undefined,\n  children,\n}: {\n  /** financial total as a number */\n  total: number;\n  /** additional donation amount as a number */\n  additionalAmount?: number;\n  /** git aid total as a number */\n  giftAid?: number;\n  /** money target as a number */\n  target?: number | null;\n  /** flag for low height compact appearance */\n  isCompact?: boolean;\n  /** component for custom summary message underneath total graph only visible if there is a target */\n  summaryMessage?: ReactNode;\n  /** component children */\n  children?: ReactNode;\n}) {\n  const percentageOfTotal = calculatePercentRounded(+total, target || 0);\n  const withAdditionalPercentageOfTotal = calculatePercentRounded(\n    additionalAmount ? +total + (additionalAmount || 0) : 0,\n    target || 0,\n  );\n\n  const summaryString = `${percentageOfTotal}% of the £${formatMoneyWithCommas(\n    target || 0,\n  )} target`;\n\n  return (\n    <TotaliserWrapper $isCompact={isCompact || false}>\n      {!isCompact ? (\n        <BubbleWrapper>\n          <BubbleText>Total raised</BubbleText>\n          <Total>£{formatMoneyWithCommas(total)}</Total>\n          <GiftAid>+ £{formatMoneyWithCommas(giftAid || 0)} Gift Aid</GiftAid>\n        </BubbleWrapper>\n      ) : (\n        <Box marginHorizontal=\"none\" marginRight=\"xxs\" marginBottom=\"none\">\n          <Badge>{`£${formatMoneyWithCommas(total)}`}</Badge>\n        </Box>\n      )}\n      {/* We don't want to show the default summaryMessage if there is no target, because the summary is associated with the target progress bar */}\n      {/* However, if we explicitly pass a summaryMessage string/component, then we want to always display it even if the target is zero */}\n\n      {(!!target || !!summaryMessage) && (\n        <>\n          <ProgressBarWrapper $isCompact={isCompact || false}>\n            <StyledProgressBar\n              percentage={percentageOfTotal}\n              secondaryPercentage={withAdditionalPercentageOfTotal}\n            />\n            {!isCompact ? (\n              summaryMessage ? (\n                <Summary>{summaryMessage}</Summary>\n              ) : (\n                <Summary>\n                  <Text as=\"span\">{summaryString}</Text>\n                </Summary>\n              )\n            ) : (\n              <CompactWrapper>\n                {target !== null && (\n                  <Summary>\n                    <Text as=\"span\">{summaryString}</Text>\n                  </Summary>\n                )}\n              </CompactWrapper>\n            )}\n          </ProgressBarWrapper>\n        </>\n      )}\n      {children}\n    </TotaliserWrapper>\n  );\n}\n\nexport default Totaliser;\n"],"names":["Totaliser","_a","total","additionalAmount","giftAid","_b","target","isCompact","_c","summaryMessage","undefined","children","percentageOfTotal","calculatePercentRounded","withAdditionalPercentageOfTotal","summaryString","concat","formatMoneyWithCommas","React","createElement","TotaliserWrapper","$isCompact","Box","marginHorizontal","marginRight","marginBottom","Badge","BubbleWrapper","BubbleText","Total","GiftAid","Fragment","ProgressBarWrapper","StyledProgressBar","percentage","secondaryPercentage","CompactWrapper","Summary","Text","as"],"mappings":"kaA4BM,SAAUA,EAAUC,OACxBC,EAAKD,EAAAC,MACLC,EAAgBF,EAAAE,iBAChBC,EAAOH,EAAAG,QACPC,EAAAJ,EAAAK,OAAAA,OAAM,IAAAD,EAAG,OACTE,EAASN,EAAAM,UACTC,EAAAP,EAAAQ,eAAAA,OAAc,IAAAD,OAAGE,EAASF,EAC1BG,EAAQV,EAAAU,SAiBFC,EAAoBC,GAAyBX,EAAOI,GAAU,GAC9DQ,EAAkCD,EACtCV,GAAoBD,GAASC,GAAoB,GAAK,EACtDG,GAAU,GAGNS,EAAgB,GAAAC,OAAGJ,EAAiB,cAAAI,OAAaC,EACrDX,GAAU,GACX,WAED,OACEY,EAAAC,cAACC,EAAgB,CAAAC,WAAad,IAAa,GACvCA,EAOAW,EAAAC,cAACG,EAAG,CAACC,iBAAiB,OAAOC,YAAY,MAAMC,aAAa,QAC1DP,EAAAC,cAACO,EAAK,KAAE,IAAAV,OAAIC,EAAsBf,MAPpCgB,gBAACS,EAAa,KACZT,EAAAC,cAACS,EAAU,KAAA,gBACXV,EAAAC,cAACU,EAAK,SAAGZ,EAAsBf,IAC/BgB,EAAAC,cAACW,EAAO,WAAKb,EAAsBb,GAAW,GAAsB,iBAUpEE,KAAYG,IACdS,EAAAC,cAAAD,EAAAa,SAAA,KACEb,EAAAC,cAACa,EAAkB,CAAAX,WAAad,IAAa,GAC3CW,EAAAC,cAACc,GACCC,WAAYtB,EACZuB,oBAAqBrB,IAErBP,EASAW,EAAAC,cAACiB,EAAc,KACD,OAAX9B,GACCY,EAAAC,cAACkB,EAAO,KACNnB,EAAAC,cAACmB,EAAI,CAACC,GAAG,QAAQxB,KAXvBN,EACES,gBAACmB,EAAO,KAAE5B,GAEVS,EAAAC,cAACkB,EAAO,KACNnB,EAAAC,cAACmB,EAAI,CAACC,GAAG,QAAQxB,MAe5BJ,EAGP"}

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

@@ -1,27 +1,14 @@
-import { type ThemeType } from "../../types";
 import ProgressBar from "../ProgressBar";
-export declare const BubbleWrapper: 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 BubbleWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const ProgressBarWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
     $isCompact?: boolean;
-    theme: ThemeType;
-}>> & string;
-export declare const Total: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, {
-    theme: ThemeType;
-}>> & string;
-export declare const BubbleText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, {
-    theme: ThemeType;
-}>> & string;
-export declare const GiftAid: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, {
-    theme: ThemeType;
-}>> & string;
-export declare const Summary: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {
-    theme: ThemeType;
 }>> & string;
+export declare const Total: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, never>> & string;
+export declare const BubbleText: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, never>> & string;
+export declare const GiftAid: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, never>> & string;
+export declare const Summary: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
 export declare const TotaliserWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
     $isCompact: boolean;
-    theme: ThemeType;
 }>> & string;
 export declare const CompactWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const StyledProgressBar: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("../ProgressBar").ProgressBarProps, never>> & string & Omit<typeof ProgressBar, keyof import("react").Component<any, {}, any>>;

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

@@ -1,2 +1,2 @@
-import{__makeTemplateObject as n}from"../../../node_modules/tslib/tslib.es6.js";import t,{css as o}from"styled-components";import{ProgressBar as e}from"../ProgressBar/index.js";var r,i,a,f,l,p,m,s,g,c,h,u=t.div(r||(r=n(["\n  text-align: center;\n  background-color: ",";\n  border-radius: 3.2rem;\n  padding: 5px;\n  position: relative;\n  p {\n    margin: 0;\n  }\n"],["\n  text-align: center;\n  background-color: ",";\n  border-radius: 3.2rem;\n  padding: 5px;\n  position: relative;\n  p {\n    margin: 0;\n  }\n"])),function(n){return n.theme.colors.totaliserBubbleColor}),d=t.div(a||(a=n(["\n  padding: 0 46px 12px;\n  margin-top: ",";\n  position: relative;\n\n  ",";\n"],["\n  padding: 0 46px 12px;\n  margin-top: ",";\n  position: relative;\n\n  ",";\n"])),function(n){return n.theme.spacing.s},function(t){var e=t.$isCompact,r=t.theme;return!0!=!!e&&o(i||(i=n(['\n      div > div > div:not(:first-child) {\n        &:after {\n          content: "\\25bc";\n          color: ',";\n          position: absolute;\n          top: -36px;\n          right: -15px;\n          font-size: 32px;\n        }\n      }\n    "],['\n      div > div > div:not(:first-child) {\n        &:after {\n          content: "\\\\25bc";\n          color: ',";\n          position: absolute;\n          top: -36px;\n          right: -15px;\n          font-size: 32px;\n        }\n      }\n    "])),r.colors.totaliserBubbleColor)}),y=t.p(f||(f=n(["\n  color: ",";\n  font-size: 2.625rem;\n  line-height: 3rem;\n  font-family: ",";\n  text-transform: ",";\n  font-weight: ",";\n"],["\n  color: ",";\n  font-size: 2.625rem;\n  line-height: 3rem;\n  font-family: ",";\n  text-transform: ",";\n  font-weight: ",";\n"])),function(n){return n.theme.colors.totaliserBubbleTotalColor},function(n){return n.theme.typography.fontFamilyHeadings},function(n){return n.theme.typography.headerTextTransform},function(n){return n.theme.typography.fontWeightLabels}),x=t.p(l||(l=n(["\n  color: ",";\n  font-family: ",";\n  text-transform: ",";\n  font-weight: ",";\n"],["\n  color: ",";\n  font-family: ",";\n  text-transform: ",";\n  font-weight: ",";\n"])),function(n){return n.theme.colors.totaliserBubbleTextColor},function(n){return n.theme.typography.fontFamilyHeadings},function(n){return n.theme.typography.headerTextTransform},function(n){return n.theme.typography.fontWeightLabels}),b=t.p(p||(p=n(["\n  color: ",";\n  font-family: ",";\n  text-transform: ",";\n  font-weight: ",";\n"],["\n  color: ",";\n  font-family: ",";\n  text-transform: ",";\n  font-weight: ",";\n"])),function(n){return n.theme.colors.totaliserBubbleTotalColor},function(n){return n.theme.typography.fontFamilyHeadings},function(n){return n.theme.typography.headerTextTransform},function(n){return n.theme.typography.fontWeightLabels}),v=t.span(m||(m=n(["\n  display: block;\n  text-align: right;\n  margin-top: 12px;\n  margin-bottom: 0;\n  font-family: ",";\n"],["\n  display: block;\n  text-align: right;\n  margin-top: 12px;\n  margin-bottom: 0;\n  font-family: ",";\n"])),function(n){return n.theme.typography.fontFamilyBase}),T=t.div(g||(g=n(["\n  font-family: ",";\n  margin: 0;\n  ","\n"],["\n  font-family: ",";\n  margin: 0;\n  ","\n"])),function(n){return n.theme.typography.fontFamilyHeadings},function(t){return t.$isCompact&&o(s||(s=n(["\n      "," {\n        border: none;\n        padding: 0;\n      }\n    "],["\n      "," {\n        border: none;\n        padding: 0;\n      }\n    "])),d)}),B=t.div(c||(c=n(["\n  justify-content: flex-end;\n  display: flex;\n"],["\n  justify-content: flex-end;\n  display: flex;\n"]))),C=t(e)(h||(h=n([""],[""])));export{x as BubbleText,u as BubbleWrapper,B as CompactWrapper,b as GiftAid,d as ProgressBarWrapper,C as StyledProgressBar,v as Summary,y as Total,T as TotaliserWrapper};
+import{__makeTemplateObject as n}from"../../../node_modules/tslib/tslib.es6.js";import t,{css as r}from"styled-components";import{ProgressBar as a}from"../ProgressBar/index.js";var e,i,o,s,l,f,p,m,g,d,b,v=t.div(e||(e=n(["\n  text-align: center;\n  background-color: var(--clr-totaliser-bubble, #f2f2f2);\n  border-radius: 3.2rem;\n  padding: 5px;\n  position: relative;\n  p {\n    margin: 0;\n  }\n"],["\n  text-align: center;\n  background-color: var(--clr-totaliser-bubble, #f2f2f2);\n  border-radius: 3.2rem;\n  padding: 5px;\n  position: relative;\n  p {\n    margin: 0;\n  }\n"]))),y=t.div(o||(o=n(["\n  padding: 0 46px 12px;\n  margin-top: var(--spacing-s, 1.5rem);\n  position: relative;\n\n  ",";\n"],["\n  padding: 0 46px 12px;\n  margin-top: var(--spacing-s, 1.5rem);\n  position: relative;\n\n  ",";\n"])),function(t){return!0!=!!t.$isCompact&&r(i||(i=n(['\n      div > div > div:not(:first-child) {\n        &:after {\n          content: "\\25bc";\n          color: var(--clr-totaliser-bubble, #f2f2f2);\n          position: absolute;\n          top: -36px;\n          right: -15px;\n          font-size: 32px;\n        }\n      }\n    '],['\n      div > div > div:not(:first-child) {\n        &:after {\n          content: "\\\\25bc";\n          color: var(--clr-totaliser-bubble, #f2f2f2);\n          position: absolute;\n          top: -36px;\n          right: -15px;\n          font-size: 32px;\n        }\n      }\n    '])))}),c=t.p(s||(s=n(['\n  color: var(--clr-totaliser-bubble-total, #00007e);\n  font-size: 2.625rem;\n  line-height: 3rem;\n  font-family: var(--typ-font-family-headings, "Progress", Arial, sans-serif);\n  text-transform: var(--typ-header-text-transform, none);\n  font-weight: var(--typ-font-weight-labels, 500);\n'],['\n  color: var(--clr-totaliser-bubble-total, #00007e);\n  font-size: 2.625rem;\n  line-height: 3rem;\n  font-family: var(--typ-font-family-headings, "Progress", Arial, sans-serif);\n  text-transform: var(--typ-header-text-transform, none);\n  font-weight: var(--typ-font-weight-labels, 500);\n']))),x=t.p(l||(l=n(['\n  color: var(--clr-totaliser-bubble-text, #000);\n  font-family: var(--typ-font-family-headings, "Progress", Arial, sans-serif);\n  text-transform: var(--typ-header-text-transform, none);\n  font-weight: var(--typ-font-weight-labels, 500);\n'],['\n  color: var(--clr-totaliser-bubble-text, #000);\n  font-family: var(--typ-font-family-headings, "Progress", Arial, sans-serif);\n  text-transform: var(--typ-header-text-transform, none);\n  font-weight: var(--typ-font-weight-labels, 500);\n']))),h=t.p(f||(f=n(['\n  color: var(--clr-totaliser-bubble-total, #00007e);\n  font-family: var(--typ-font-family-headings, "Progress", Arial, sans-serif);\n  text-transform: var(--typ-header-text-transform, none);\n  font-weight: var(--typ-font-weight-labels, 500);\n'],['\n  color: var(--clr-totaliser-bubble-total, #00007e);\n  font-family: var(--typ-font-family-headings, "Progress", Arial, sans-serif);\n  text-transform: var(--typ-header-text-transform, none);\n  font-weight: var(--typ-font-weight-labels, 500);\n']))),u=t.span(p||(p=n(['\n  display: block;\n  text-align: right;\n  margin-top: 12px;\n  margin-bottom: 0;\n  font-family: var(--typ-font-family-base, "Poppins", Arial, sans-serif);\n'],['\n  display: block;\n  text-align: right;\n  margin-top: 12px;\n  margin-bottom: 0;\n  font-family: var(--typ-font-family-base, "Poppins", Arial, sans-serif);\n']))),w=t.div(g||(g=n(['\n  font-family: var(--typ-font-family-headings, "Progress", Arial, sans-serif);\n  margin: 0;\n  ',"\n"],['\n  font-family: var(--typ-font-family-headings, "Progress", Arial, sans-serif);\n  margin: 0;\n  ',"\n"])),function(t){return t.$isCompact&&r(m||(m=n(["\n      "," {\n        border: none;\n        padding: 0;\n      }\n    "],["\n      "," {\n        border: none;\n        padding: 0;\n      }\n    "])),y)}),P=t.div(d||(d=n(["\n  justify-content: flex-end;\n  display: flex;\n"],["\n  justify-content: flex-end;\n  display: flex;\n"]))),A=t(a)(b||(b=n([""],[""])));export{x as BubbleText,v as BubbleWrapper,P as CompactWrapper,h as GiftAid,y as ProgressBarWrapper,A as StyledProgressBar,u as Summary,c as Total,w as TotaliserWrapper};
 //# sourceMappingURL=styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sources":["../../../../src/components/Totaliser/styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\nimport { type ThemeType } from \"../../types\";\n\nimport ProgressBar from \"../ProgressBar\";\n\nexport const BubbleWrapper = styled.div<{\n  theme: ThemeType;\n}>`\n  text-align: center;\n  background-color: ${({ theme }) => theme.colors.totaliserBubbleColor};\n  border-radius: 3.2rem;\n  padding: 5px;\n  position: relative;\n  p {\n    margin: 0;\n  }\n`;\n\nexport const ProgressBarWrapper = styled.div<{\n  $isCompact?: boolean;\n  theme: ThemeType;\n}>`\n  padding: 0 46px 12px;\n  margin-top: ${({ theme }) => theme.spacing.s};\n  position: relative;\n\n  ${({ $isCompact, theme }) =>\n    !!$isCompact !== true &&\n    css`\n      div > div > div:not(:first-child) {\n        &:after {\n          content: \"\\\\25bc\";\n          color: ${theme.colors.totaliserBubbleColor};\n          position: absolute;\n          top: -36px;\n          right: -15px;\n          font-size: 32px;\n        }\n      }\n    `};\n`;\n\nexport const Total = styled.p<{\n  theme: ThemeType;\n}>`\n  color: ${({ theme }) => theme.colors.totaliserBubbleTotalColor};\n  font-size: 2.625rem;\n  line-height: 3rem;\n  font-family: ${({ theme }) => theme.typography.fontFamilyHeadings};\n  text-transform: ${({ theme }) => theme.typography.headerTextTransform};\n  font-weight: ${({ theme }) => theme.typography.fontWeightLabels};\n`;\n\nexport const BubbleText = styled.p<{ theme: ThemeType }>`\n  color: ${({ theme }) => theme.colors.totaliserBubbleTextColor};\n  font-family: ${({ theme }) => theme.typography.fontFamilyHeadings};\n  text-transform: ${({\n    theme: {\n      typography: { headerTextTransform },\n    },\n  }) => headerTextTransform};\n  font-weight: ${({ theme }) => theme.typography.fontWeightLabels};\n`;\n\nexport const GiftAid = styled.p<{ theme: ThemeType }>`\n  color: ${({ theme }) => theme.colors.totaliserBubbleTotalColor};\n  font-family: ${({ theme }) => theme.typography.fontFamilyHeadings};\n  text-transform: ${({\n    theme: {\n      typography: { headerTextTransform },\n    },\n  }) => headerTextTransform};\n  font-weight: ${({ theme }) => theme.typography.fontWeightLabels};\n`;\n\n/* span not a div so that we don't end up with two speech bubble arrows from ProgressBarWrapper */\nexport const Summary = styled.span<{ theme: ThemeType }>`\n  display: block;\n  text-align: right;\n  margin-top: 12px;\n  margin-bottom: 0;\n  font-family: ${({ theme }) => theme.typography.fontFamilyBase};\n`;\n\nexport const TotaliserWrapper = styled.div<{\n  $isCompact: boolean;\n  theme: ThemeType;\n}>`\n  font-family: ${({ theme }) => theme.typography.fontFamilyHeadings};\n  margin: 0;\n  ${(props) =>\n    props.$isCompact &&\n    css`\n      ${ProgressBarWrapper} {\n        border: none;\n        padding: 0;\n      }\n    `}\n`;\n\nexport const CompactWrapper = styled.div`\n  justify-content: flex-end;\n  display: flex;\n`;\n\nexport const StyledProgressBar = styled(ProgressBar)``;\n"],"names":["BubbleWrapper","styled","div","templateObject_1","__makeTemplateObject","_a","theme","colors","totaliserBubbleColor","ProgressBarWrapper","templateObject_3","spacing","s","$isCompact","css","templateObject_2","Total","p","templateObject_4","totaliserBubbleTotalColor","typography","fontFamilyHeadings","headerTextTransform","fontWeightLabels","BubbleText","templateObject_5","totaliserBubbleTextColor","GiftAid","templateObject_6","Summary","span","templateObject_7","fontFamilyBase","TotaliserWrapper","templateObject_9","props","templateObject_8","CompactWrapper","templateObject_10","StyledProgressBar","ProgressBar","templateObject_11"],"mappings":"iLAMO,0BAAMA,EAAgBC,EAAOC,IAAGC,IAAAA,EAAAC,EAAA,CAAA,gDAAA,qGAAA,CAErC,gDAEoE,uGAAhD,SAACC,GAAc,OAAPA,EAAAC,MAAaC,OAAOC,oBAAb,GASxBC,EAAqBR,EAAOC,IAAGQ,IAAAA,EAAAN,EAAA,CAAA,4CAAA,iCAAA,OAAA,CAG1C,4CAE4C,iCAgBzC,SAhBW,SAACC,GAAc,OAAPA,EAAAC,MAAaK,QAAQC,CAAd,EAG3B,SAACP,OAAEQ,EAAUR,EAAAQ,WAAEP,EAAKD,EAAAC,MACpB,OAAiB,KAAfO,GACFC,EAAGC,IAAAA,EAAAX,EAAA,CAAA,kHAAA,0IAAA,CAAA,oHAI6C,4IAAjCE,EAAMC,OAAOC,qBAL5B,GAeSQ,EAAQf,EAAOgB,EAACC,IAAAA,EAAAd,EAAA,CAAA,cAAA,mEAAA,wBAAA,qBAAA,OAAA,CAE3B,cAC8D,mEAGG,wBACI,qBACN,SALtD,SAACC,GAAc,OAAPA,EAAAC,MAAaC,OAAOY,yBAAb,EAGT,SAACd,GAAc,OAAPA,EAAAC,MAAac,WAAWC,kBAAjB,EACZ,SAAChB,GAAc,OAAPA,EAAAC,MAAac,WAAWE,mBAAjB,EAClB,SAACjB,GAAc,OAAPA,EAAAC,MAAac,WAAWG,gBAAjB,GAGnBC,EAAavB,EAAOgB,EAACQ,IAAAA,EAAArB,EAAA,CAAA,cAAA,qBAAA,wBAAA,qBAAA,OAAA,CAAsB,cACO,qBACI,wBAKxC,qBACsC,SAPtD,SAACC,GAAc,OAAPA,EAAAC,MAAaC,OAAOmB,wBAAb,EACT,SAACrB,GAAc,OAAPA,EAAAC,MAAac,WAAWC,kBAAjB,EACZ,SAAChB,GAIb,OAF+BA,EAAAC,MAAAc,WAAAE,mBAE/B,EACS,SAACjB,GAAc,OAAPA,EAAAC,MAAac,WAAWG,gBAAjB,GAGnBI,EAAU1B,EAAOgB,EAACW,IAAAA,EAAAxB,EAAA,CAAA,cAAA,qBAAA,wBAAA,qBAAA,OAAA,CAAsB,cACW,qBACG,wBAKxC,qBACsC,SAPtD,SAACC,GAAc,OAAPA,EAAAC,MAAaC,OAAOY,yBAAb,EACT,SAACd,GAAc,OAAPA,EAAAC,MAAac,WAAWC,kBAAjB,EACZ,SAAChB,GAIb,OAF+BA,EAAAC,MAAAc,WAAAE,mBAE/B,EACS,SAACjB,GAAc,OAAPA,EAAAC,MAAac,WAAWG,gBAAjB,GAInBM,EAAU5B,EAAO6B,KAAIC,IAAAA,EAAA3B,EAAA,CAAA,uGAAA,OAAA,CAAsB,uGAKO,SAA9C,SAACC,GAAc,OAAPA,EAAAC,MAAac,WAAWY,cAAjB,GAGnBC,EAAmBhC,EAAOC,IAAGgC,IAAAA,EAAA9B,EAAA,CAAA,oBAAA,sBAAA,MAAA,CAGxC,oBACiE,sBAS9D,QATY,SAACC,GAAc,OAAPA,EAAAC,MAAac,WAAWC,kBAAjB,EAE5B,SAACc,GACD,OAAAA,EAAMtB,YACNC,EAAGsB,IAAAA,EAAAhC,EAAA,CAAA,WAAA,iEAAA,CAAA,WACmB,mEAAlBK,EAFJ,GASS4B,EAAiBpC,EAAOC,IAAGoC,IAAAA,EAAAlC,EAAA,CAAA,sDAAA,CAAA,yDAK3BmC,EAAoBtC,EAAOuC,EAAPvC,CAAmBwC,IAAAA,EAAArC,EAAA,CAAA,IAAA,CAAA"}
+{"version":3,"file":"styles.js","sources":["../../../../src/components/Totaliser/styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\n\nimport ProgressBar from \"../ProgressBar\";\n\nexport const BubbleWrapper = styled.div`\n  text-align: center;\n  background-color: var(--clr-totaliser-bubble, #f2f2f2);\n  border-radius: 3.2rem;\n  padding: 5px;\n  position: relative;\n  p {\n    margin: 0;\n  }\n`;\n\nexport const ProgressBarWrapper = styled.div<{\n  $isCompact?: boolean;\n}>`\n  padding: 0 46px 12px;\n  margin-top: var(--spacing-s, 1.5rem);\n  position: relative;\n\n  ${({ $isCompact }) =>\n    !!$isCompact !== true &&\n    css`\n      div > div > div:not(:first-child) {\n        &:after {\n          content: \"\\\\25bc\";\n          color: var(--clr-totaliser-bubble, #f2f2f2);\n          position: absolute;\n          top: -36px;\n          right: -15px;\n          font-size: 32px;\n        }\n      }\n    `};\n`;\n\nexport const Total = styled.p`\n  color: var(--clr-totaliser-bubble-total, #00007e);\n  font-size: 2.625rem;\n  line-height: 3rem;\n  font-family: var(--typ-font-family-headings, \"Progress\", Arial, sans-serif);\n  text-transform: var(--typ-header-text-transform, none);\n  font-weight: var(--typ-font-weight-labels, 500);\n`;\n\nexport const BubbleText = styled.p`\n  color: var(--clr-totaliser-bubble-text, #000);\n  font-family: var(--typ-font-family-headings, \"Progress\", Arial, sans-serif);\n  text-transform: var(--typ-header-text-transform, none);\n  font-weight: var(--typ-font-weight-labels, 500);\n`;\n\nexport const GiftAid = styled.p`\n  color: var(--clr-totaliser-bubble-total, #00007e);\n  font-family: var(--typ-font-family-headings, \"Progress\", Arial, sans-serif);\n  text-transform: var(--typ-header-text-transform, none);\n  font-weight: var(--typ-font-weight-labels, 500);\n`;\n\n/* span not a div so that we don't end up with two speech bubble arrows from ProgressBarWrapper */\nexport const Summary = styled.span`\n  display: block;\n  text-align: right;\n  margin-top: 12px;\n  margin-bottom: 0;\n  font-family: var(--typ-font-family-base, \"Poppins\", Arial, sans-serif);\n`;\n\nexport const TotaliserWrapper = styled.div<{\n  $isCompact: boolean;\n}>`\n  font-family: var(--typ-font-family-headings, \"Progress\", Arial, sans-serif);\n  margin: 0;\n  ${(props) =>\n    props.$isCompact &&\n    css`\n      ${ProgressBarWrapper} {\n        border: none;\n        padding: 0;\n      }\n    `}\n`;\n\nexport const CompactWrapper = styled.div`\n  justify-content: flex-end;\n  display: flex;\n`;\n\nexport const StyledProgressBar = styled(ProgressBar)``;\n"],"names":["BubbleWrapper","styled","div","templateObject_1","__makeTemplateObject","ProgressBarWrapper","templateObject_3","_a","$isCompact","css","templateObject_2","Total","p","templateObject_4","BubbleText","templateObject_5","GiftAid","templateObject_6","Summary","span","templateObject_7","TotaliserWrapper","templateObject_9","props","templateObject_8","CompactWrapper","templateObject_10","StyledProgressBar","ProgressBar","templateObject_11"],"mappings":"iLAIO,0BAAMA,EAAgBC,EAAOC,IAAGC,IAAAA,EAAAC,EAAA,CAAA,sLAAA,CAAA,yLAW1BC,EAAqBJ,EAAOC,IAAGI,IAAAA,EAAAF,EAAA,CAAA,kGAAA,OAAA,CAE1C,kGAkBG,SAbD,SAACG,GACD,OAAiB,KADJA,EAAAC,YAEbC,EAAGC,IAAAA,EAAAN,EAAA,CAAA,6RAAA,CAAA,iSADH,GAeSO,EAAQV,EAAOW,EAACC,IAAAA,EAAAT,EAAA,CAAA,ySAAA,CAAA,4SAShBU,EAAab,EAAOW,EAACG,IAAAA,EAAAX,EAAA,CAAA,uPAAA,CAAA,0PAOrBY,EAAUf,EAAOW,EAACK,IAAAA,EAAAb,EAAA,CAAA,2PAAA,CAAA,8PAQlBc,EAAUjB,EAAOkB,KAAIC,IAAAA,EAAAhB,EAAA,CAAA,oKAAA,CAAA,uKAQrBiB,EAAmBpB,EAAOC,IAAGoB,IAAAA,EAAAlB,EAAA,CAAA,qGAAA,MAAA,CAExC,qGAUG,QAPD,SAACmB,GACD,OAAAA,EAAMf,YACNC,EAAGe,IAAAA,EAAApB,EAAA,CAAA,WAAA,iEAAA,CAAA,WACmB,mEAAlBC,EAFJ,GASSoB,EAAiBxB,EAAOC,IAAGwB,IAAAA,EAAAtB,EAAA,CAAA,sDAAA,CAAA,yDAK3BuB,EAAoB1B,EAAO2B,EAAP3B,CAAmB4B,IAAAA,EAAAzB,EAAA,CAAA,IAAA,CAAA"}

package/lib/src/components/UserBlock/index.d.ts

@@ -1,4 +1,5 @@
 import React, { type ReactNode, type HTMLAttributes } from "react";
+import { type ThemeNameType } from "../../types";
 export type UserBlockProps = HTMLAttributes<HTMLElement> & {
     /** name component or text */
     name?: ReactNode;
@@ -10,9 +11,10 @@ export type UserBlockProps = HTMLAttributes<HTMLElement> & {
     extra?: ReactNode;
     /** size of avatar component */
     size?: "s" | "m" | "l" | "xl";
+    themeName: ThemeNameType;
 };
 /**
  * Display an avatar with title and subtitle
  */
-export declare function UserBlock({ name, avatarName, avatarUrl, extra, size, }: UserBlockProps): React.JSX.Element;
+export declare function UserBlock({ name, avatarName, avatarUrl, extra, size, themeName, }: UserBlockProps): React.JSX.Element;
 export default UserBlock;

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

@@ -1,2 +1,2 @@
-import{__assign as e}from"../../../node_modules/tslib/tslib.es6.js";import t from"react";import{useTheme as r}from"styled-components";import{crukTheme as m}from"../../themes/cruk.js";import{Avatar as o}from"../Avatar/index.js";import{StyledUserBlock as n,Details as a,Name as l,Extra as s}from"./styles.js";function i(i){var u=i.name,c=i.avatarName,f=i.avatarUrl,p=i.extra,d=i.size,v=void 0===d?"l":d,y=r(),E=e(e({},m),y);return t.createElement(n,{theme:E},t.createElement(o,{name:c||("string"==typeof u?u:"Anonymous"),url:f||void 0,size:v}),t.createElement(a,null,t.createElement(l,null,u||"Anonymous"),!!p&&t.createElement(s,null,p)))}export{i as UserBlock,i as default};
+import e from"react";import{Avatar as t}from"../Avatar/index.js";import{StyledUserBlock as r,Details as a,Name as m,Extra as n}from"./styles.js";function l(l){var o=l.name,i=l.avatarName,u=l.avatarUrl,s=l.extra,c=l.size,v=void 0===c?"l":c,f=l.themeName,d=void 0===f?"cruk":f;return e.createElement(r,null,e.createElement(t,{name:i||("string"==typeof o?o:"Anonymous"),url:u||void 0,size:v,themeName:d}),e.createElement(a,null,e.createElement(m,null,o||"Anonymous"),!!s&&e.createElement(n,null,s)))}export{l as UserBlock,l as default};
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/UserBlock/index.tsx"],"sourcesContent":["import React, { type ReactNode, type HTMLAttributes } from \"react\";\nimport { useTheme } from \"styled-components\";\n\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\nimport { Avatar } from \"../Avatar\";\n\nimport { StyledUserBlock, Details, Name, Extra } from \"./styles\";\n\nexport type UserBlockProps = HTMLAttributes<HTMLElement> & {\n  /** name component or text */\n  name?: ReactNode;\n  /** string name used in avatar component */\n  avatarName?: string | null;\n  /** avatar image url */\n  avatarUrl?: string | null;\n  /** extra content component appears underneath name */\n  extra?: ReactNode;\n  /** size of avatar component */\n  size?: \"s\" | \"m\" | \"l\" | \"xl\";\n};\n\n/**\n * Display an avatar with title and subtitle\n */\nexport function UserBlock({\n  name,\n  avatarName,\n  avatarUrl,\n  extra,\n  size = \"l\",\n}: UserBlockProps) {\n  const foundTheme = useTheme();\n  const theme = {\n    ...defaultTheme,\n    ...foundTheme,\n  };\n\n  // name is a reserved html prop so we make sure we don't pass it into the styled component\n  // or it will end up in the markup\n  return (\n    <StyledUserBlock theme={theme}>\n      <Avatar\n        name={avatarName || (typeof name === \"string\" ? name : \"Anonymous\")}\n        url={avatarUrl || undefined}\n        size={size}\n      />\n      <Details>\n        <Name>{name || \"Anonymous\"}</Name>\n        {!!extra && <Extra>{extra}</Extra>}\n      </Details>\n    </StyledUserBlock>\n  );\n}\n\nexport default UserBlock;\n"],"names":["UserBlock","_a","name","avatarName","avatarUrl","extra","_b","size","foundTheme","useTheme","theme","__assign","defaultTheme","React","createElement","StyledUserBlock","Avatar","url","undefined","Details","Name","Extra"],"mappings":"mTAwBM,SAAUA,EAAUC,GACxB,IAAAC,SACAC,EAAUF,EAAAE,WACVC,EAASH,EAAAG,UACTC,EAAKJ,EAAAI,MACLC,EAAAL,EAAAM,KAAAA,OAAI,IAAAD,EAAG,IAAGA,EAEJE,EAAaC,IACbC,EAAKC,EAAAA,EAAA,CAAA,EACNC,GACAJ,GAKL,OACEK,EAAAC,cAACC,EAAe,CAACL,MAAOA,GACtBG,EAAAC,cAACE,EAAM,CACLd,KAAMC,IAA+B,iBAATD,EAAoBA,EAAO,aACvDe,IAAKb,QAAac,EAClBX,KAAMA,IAERM,EAAAC,cAACK,EAAO,KACNN,EAAAC,cAACM,EAAI,KAAElB,GAAQ,eACZG,GAASQ,EAAAC,cAACO,EAAK,KAAEhB,IAI5B"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/UserBlock/index.tsx"],"sourcesContent":["import React, { type ReactNode, type HTMLAttributes } from \"react\";\n\nimport { Avatar } from \"../Avatar\";\n\nimport { StyledUserBlock, Details, Name, Extra } from \"./styles\";\nimport { type ThemeNameType } from \"../../types\";\n\nexport type UserBlockProps = HTMLAttributes<HTMLElement> & {\n  /** name component or text */\n  name?: ReactNode;\n  /** string name used in avatar component */\n  avatarName?: string | null;\n  /** avatar image url */\n  avatarUrl?: string | null;\n  /** extra content component appears underneath name */\n  extra?: ReactNode;\n  /** size of avatar component */\n  size?: \"s\" | \"m\" | \"l\" | \"xl\";\n  themeName: ThemeNameType;\n};\n\n/**\n * Display an avatar with title and subtitle\n */\nexport function UserBlock({\n  name,\n  avatarName,\n  avatarUrl,\n  extra,\n  size = \"l\",\n  themeName = \"cruk\",\n}: UserBlockProps) {\n  // name is a reserved html prop so we make sure we don't pass it into the styled component\n  // or it will end up in the markup\n  return (\n    <StyledUserBlock>\n      <Avatar\n        name={avatarName || (typeof name === \"string\" ? name : \"Anonymous\")}\n        url={avatarUrl || undefined}\n        size={size}\n        themeName={themeName}\n      />\n      <Details>\n        <Name>{name || \"Anonymous\"}</Name>\n        {!!extra && <Extra>{extra}</Extra>}\n      </Details>\n    </StyledUserBlock>\n  );\n}\n\nexport default UserBlock;\n"],"names":["UserBlock","_a","name","avatarName","avatarUrl","extra","_b","size","_c","themeName","React","StyledUserBlock","createElement","Avatar","url","undefined","Details","Name","Extra"],"mappings":"iJAwBM,SAAUA,EAAUC,OACxBC,EAAID,EAAAC,KACJC,EAAUF,EAAAE,WACVC,EAASH,EAAAG,UACTC,EAAKJ,EAAAI,MACLC,SAAAC,OAAI,IAAAD,EAAG,IAAGA,EACVE,cAAAC,OAAS,IAAAD,EAAG,OAAMA,EAIlB,OACEE,gBAACC,EAAe,KACdD,EAAAE,cAACC,EAAM,CACLX,KAAMC,IAA+B,iBAATD,EAAoBA,EAAO,aACvDY,IAAKV,QAAaW,EAClBR,KAAMA,EACNE,UAAWA,IAEbC,EAAAE,cAACI,EAAO,KACNN,EAAAE,cAACK,EAAI,KAAEf,GAAQ,eACZG,GAASK,EAAAE,cAACM,EAAK,KAAEb,IAI5B"}

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

@@ -1,9 +1,4 @@
-import { type ThemeType } from "../../types";
-type Props = {
-    theme: ThemeType;
-};
 export declare const StyledUserBlock: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const Details: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Props>> & string;
-export declare const Name: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Props>> & string;
-export declare const Extra: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, Props>> & string;
-export {};
+export declare const Details: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const Name: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const Extra: 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/UserBlock/styles.js

@@ -1,2 +1,2 @@
-import{__makeTemplateObject as n}from"../../../node_modules/tslib/tslib.es6.js";import e from"styled-components";var t,r,o,i,a=e.div(t||(t=n(["\n  display: flex;\n  align-items: center;\n  justify-content: start;\n  flex: 1;\n"],["\n  display: flex;\n  align-items: center;\n  justify-content: start;\n  flex: 1;\n"]))),l=e.div(r||(r=n(["\n  flex: 1;\n  margin-left: ",";\n  text-align: left;\n  min-width: 0;\n"],["\n  flex: 1;\n  margin-left: ",";\n  text-align: left;\n  min-width: 0;\n"])),function(n){return n.theme.spacing.xs}),s=e.div(o||(o=n(["\n  font-family: ",";\n  font-size: ",";\n  white-space: normal;\n  word-break: break-word;\n"],["\n  font-family: ",";\n  font-size: ",";\n  white-space: normal;\n  word-break: break-word;\n"])),function(n){return n.theme.typography.fontFamilyHeadings},function(n){return n.theme.fontSizes.l}),f=e.div(i||(i=n(["\n  color: ",";\n  margin-top: 4px;\n  white-space: normal;\n  word-break: break-word;\n"],["\n  color: ",";\n  margin-top: 4px;\n  white-space: normal;\n  word-break: break-word;\n"])),function(n){return n.theme.colors.userBlockExtraText});export{l as Details,f as Extra,s as Name,a as StyledUserBlock};
+import{__makeTemplateObject as n}from"../../../node_modules/tslib/tslib.es6.js";import e from"styled-components";var r,t,a,i,o=e.div(r||(r=n(["\n  display: flex;\n  align-items: center;\n  justify-content: start;\n  flex: 1;\n"],["\n  display: flex;\n  align-items: center;\n  justify-content: start;\n  flex: 1;\n"]))),s=e.div(t||(t=n(["\n  flex: 1;\n  margin-left: var(--spacing-xs, 1rem);\n  text-align: left;\n  min-width: 0;\n"],["\n  flex: 1;\n  margin-left: var(--spacing-xs, 1rem);\n  text-align: left;\n  min-width: 0;\n"]))),l=e.div(a||(a=n(['\n  font-family: var(--typ-font-family-headings, "Progress", Arial, sans-serif);\n  font-size: var(--font-size-l, 1.25rem);\n  white-space: normal;\n  word-break: break-word;\n'],['\n  font-family: var(--typ-font-family-headings, "Progress", Arial, sans-serif);\n  font-size: var(--font-size-l, 1.25rem);\n  white-space: normal;\n  word-break: break-word;\n']))),f=e.div(i||(i=n(["\n  color: var(--clr-user-block-extra-text, #575757);\n  margin-top: 4px;\n  white-space: normal;\n  word-break: break-word;\n"],["\n  color: var(--clr-user-block-extra-text, #575757);\n  margin-top: 4px;\n  white-space: normal;\n  word-break: break-word;\n"])));export{s as Details,f as Extra,l as Name,o as StyledUserBlock};
 //# sourceMappingURL=styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sources":["../../../../src/components/UserBlock/styles.ts"],"sourcesContent":["import styled from \"styled-components\";\nimport { type ThemeType } from \"../../types\";\n\ntype Props = {\n  theme: ThemeType;\n};\n\nexport const StyledUserBlock = styled.div`\n  display: flex;\n  align-items: center;\n  justify-content: start;\n  flex: 1;\n`;\n\nexport const Details = styled.div<Props>`\n  flex: 1;\n  margin-left: ${({ theme }) => theme.spacing.xs};\n  text-align: left;\n  min-width: 0;\n`;\n\nexport const Name = styled.div<Props>`\n  font-family: ${({ theme }) => theme.typography.fontFamilyHeadings};\n  font-size: ${({ theme }) => theme.fontSizes.l};\n  white-space: normal;\n  word-break: break-word;\n`;\n\nexport const Extra = styled.div<Props>`\n  color: ${({ theme }) => theme.colors.userBlockExtraText};\n  margin-top: 4px;\n  white-space: normal;\n  word-break: break-word;\n`;\n"],"names":["StyledUserBlock","styled","div","templateObject_1","__makeTemplateObject","Details","templateObject_2","_a","theme","spacing","xs","Name","templateObject_3","typography","fontFamilyHeadings","fontSizes","l","Extra","templateObject_4","colors","userBlockExtraText"],"mappings":"iHAOO,YAAMA,EAAkBC,EAAOC,IAAGC,IAAAA,EAAAC,EAAA,CAAA,uFAAA,CAAA,0FAO5BC,EAAUJ,EAAOC,IAAGI,IAAAA,EAAAF,EAAA,CAAA,gCAAA,6CAAA,CAAO,gCAEQ,+CAA/B,SAACG,GAAc,OAAPA,EAAAC,MAAaC,QAAQC,EAAd,GAKnBC,EAAOV,EAAOC,IAAGU,IAAAA,EAAAR,EAAA,CAAA,oBAAA,mBAAA,0DAAA,CAAO,oBAC8B,mBACpB,4DAD9B,SAACG,GAAc,OAAPA,EAAAC,MAAaK,WAAWC,kBAAjB,EACjB,SAACP,GAAc,OAAPA,EAAAC,MAAaO,UAAUC,CAAhB,GAKjBC,EAAQhB,EAAOC,IAAGgB,IAAAA,EAAAd,EAAA,CAAA,cAAA,8EAAA,CAAO,cACmB,gFAA9C,SAACG,GAAc,OAAPA,EAAAC,MAAaW,OAAOC,kBAAb"}
+{"version":3,"file":"styles.js","sources":["../../../../src/components/UserBlock/styles.ts"],"sourcesContent":["import styled from \"styled-components\";\n\nexport const StyledUserBlock = styled.div`\n  display: flex;\n  align-items: center;\n  justify-content: start;\n  flex: 1;\n`;\n\nexport const Details = styled.div`\n  flex: 1;\n  margin-left: var(--spacing-xs, 1rem);\n  text-align: left;\n  min-width: 0;\n`;\n\nexport const Name = styled.div`\n  font-family: var(--typ-font-family-headings, \"Progress\", Arial, sans-serif);\n  font-size: var(--font-size-l, 1.25rem);\n  white-space: normal;\n  word-break: break-word;\n`;\n\nexport const Extra = styled.div`\n  color: var(--clr-user-block-extra-text, #575757);\n  margin-top: 4px;\n  white-space: normal;\n  word-break: break-word;\n`;\n"],"names":["StyledUserBlock","styled","div","templateObject_1","__makeTemplateObject","Details","templateObject_2","Name","templateObject_3","Extra","templateObject_4"],"mappings":"iHAEO,YAAMA,EAAkBC,EAAOC,IAAGC,IAAAA,EAAAC,EAAA,CAAA,uFAAA,CAAA,0FAO5BC,EAAUJ,EAAOC,IAAGI,IAAAA,EAAAF,EAAA,CAAA,iGAAA,CAAA,oGAOpBG,EAAON,EAAOC,IAAGM,IAAAA,EAAAJ,EAAA,CAAA,oLAAA,CAAA,uLAOjBK,EAAQR,EAAOC,IAAGQ,IAAAA,EAAAN,EAAA,CAAA,kIAAA,CAAA"}

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

@@ -1,3 +1,4 @@
+import "./global-styles.css";
 export { AddressLookup } from "./AddressLookup";
 export { Avatar } from "./Avatar";
 export { Badge } from "./Badge";
@@ -9,11 +10,7 @@ export { Collapse } from "./Collapse";
 export { DateField } from "./DateField";
 export { Divider } from "./Divider";
 export { ErrorText } from "./ErrorText";
-export { Fontface } from "./Fontface";
-export { Flex } from "./Flex";
 export { Footer } from "./Footer";
-export { GlobalStyle } from "./GlobalStyle";
-export { GlobalStyleNoFontFace } from "./GlobalStyleNoFontFace";
 export { Header } from "./Header";
 export { Heading } from "./Heading";
 export { IconFa } from "./IconFa";
@@ -35,8 +32,4 @@ export { TextField } from "./TextField";
 export { Totaliser } from "./Totaliser";
 export { UserBlock } from "./UserBlock";
 export { InfoBox } from "./InfoBox";
-export { bowelbabeTheme } from "../themes/bowelbabe";
-export { crukTheme } from "../themes/cruk";
-export { su2cTheme } from "../themes/su2c";
-export { rflTheme } from "../themes/rfl";
 export * from "../types";

package/lib/src/components/index.js

@@ -1,2 +1,2 @@
-export{AddressLookup}from"./AddressLookup/index.js";export{Avatar}from"./Avatar/index.js";export{Badge}from"./Badge/index.js";export{Box}from"./Box/index.js";export{Button}from"./Button/index.js";export{Carousel}from"./Carousel/index.js";export{Checkbox}from"./Checkbox/index.js";export{Collapse}from"./Collapse/index.js";export{DateField}from"./DateField/index.js";export{Divider}from"./Divider.js";export{ErrorText}from"./ErrorText/index.js";export{Fontface}from"./Fontface.js";export{Flex}from"./Flex.js";export{Footer}from"./Footer/index.js";export{GlobalStyle}from"./GlobalStyle.js";export{GlobalStyleNoFontFace}from"./GlobalStyleNoFontFace.js";export{Header}from"./Header/index.js";export{Heading}from"./Heading/index.js";export{IconFa}from"./IconFa/index.js";export{LabelWrapper}from"./LabelWrapper/index.js";export{LegendWrapper}from"./LegendWrapper/index.js";export{Link}from"./Link/index.js";export{Loader}from"./Loader/index.js";export{Modal}from"./Modal/index.js";export{Pagination}from"./Pagination/index.js";export{PopOver}from"./PopOver/index.js";export{ProgressBar}from"./ProgressBar/index.js";export{Radio}from"./Radio/index.js";export{RadioConsent}from"./RadioConsent/index.js";export{Select}from"./Select/index.js";export{Step}from"./Step/index.js";export{Text}from"./Text/index.js";export{TextAreaField}from"./TextAreaField/index.js";export{TextField}from"./TextField/index.js";export{Totaliser}from"./Totaliser/index.js";export{UserBlock}from"./UserBlock/index.js";export{InfoBox}from"./InfoBox/index.js";export{bowelbabeTheme}from"../themes/bowelbabe.js";export{crukTheme}from"../themes/cruk.js";export{su2cTheme}from"../themes/su2c.js";export{rflTheme}from"../themes/rfl.js";
+export{AddressLookup}from"./AddressLookup/index.js";export{Avatar}from"./Avatar/index.js";export{Badge}from"./Badge/index.js";export{Box}from"./Box/index.js";export{Button}from"./Button/index.js";export{Carousel}from"./Carousel/index.js";export{Checkbox}from"./Checkbox/index.js";export{Collapse}from"./Collapse/index.js";export{DateField}from"./DateField/index.js";export{Divider}from"./Divider.js";export{ErrorText}from"./ErrorText/index.js";export{Footer}from"./Footer/index.js";export{Header}from"./Header/index.js";export{Heading}from"./Heading/index.js";export{IconFa}from"./IconFa/index.js";export{LabelWrapper}from"./LabelWrapper/index.js";export{LegendWrapper}from"./LegendWrapper/index.js";export{Link}from"./Link/index.js";export{Loader}from"./Loader/index.js";export{Modal}from"./Modal/index.js";export{Pagination}from"./Pagination/index.js";export{PopOver}from"./PopOver/index.js";export{ProgressBar}from"./ProgressBar/index.js";export{Radio}from"./Radio/index.js";export{RadioConsent}from"./RadioConsent/index.js";export{Select}from"./Select/index.js";export{Step}from"./Step/index.js";export{Text}from"./Text/index.js";export{TextAreaField}from"./TextAreaField/index.js";export{TextField}from"./TextField/index.js";export{Totaliser}from"./Totaliser/index.js";export{UserBlock}from"./UserBlock/index.js";export{InfoBox}from"./InfoBox/index.js";export{colours,fontSizes,spaces,themeNames}from"../types.js";
 //# sourceMappingURL=index.js.map