@cruk/cruk-react-components 5.0.6 → 5.0.8

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

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sources":["../../../../src/components/Step/styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport { type ThemeType } from \"../../types\";\n\nexport const StepWrapper = styled.div`\n  box-sizing: border-box;\n  *,\n  *:after,\n  *:before {\n    box-sizing: border-box;\n  }\n  text-align: center;\n  text-transform: capitalize;\n`;\n\nexport const StepList = styled.ul<{\n  $total: number;\n}>`\n  list-style: none;\n  padding: 0;\n  margin: 0;\n  display: flex;\n  justify-content: space-between;\n  width: 100%;\n\n  ${({ $total }) =>\n    $total &&\n    css`\n      li {\n        width: ${100 / $total}%;\n      }\n      li:last-child span:after {\n        display: none;\n      }\n    `}\n`;\n\nexport const StepBar = styled.span<{\n  theme: ThemeType;\n}>`\n  border-radius: 50%;\n  background-clip: padding-box;\n  width: 24px;\n  height: 24px;\n  background-color: ${({ theme }) => theme.colors.stepBackground};\n  display: block;\n  margin: 0 auto 0.5em auto;\n  border: 2px solid ${({ theme }) => theme.colors.stepBorder};\n  text-indent: -999px;\n\n  &:after {\n    display: block;\n    position: absolute;\n    width: 100%;\n    height: 2px;\n    content: \"\";\n    background-color: transparent;\n    border-bottom: 2px solid ${({ theme }) => theme.colors.stepBorder};\n    left: 50%;\n    top: 11px;\n    margin-left: 12px;\n  }\n`;\n\nexport const StepTick = styled.span<{\n  theme: ThemeType;\n}>`\n  display: block;\n  transform: rotate(45deg);\n  transform-origin: center center;\n  height: 14px;\n  width: 8px;\n  border-bottom: ${({\n    theme: {\n      colors: { textLight },\n    },\n  }) => `2px solid ${textLight}`};\n  border-right: ${({\n    theme: {\n      colors: { textLight },\n    },\n  }) => `2px solid ${textLight}`};\n  margin-top: 4px;\n  margin-left: 8px;\n`;\n\nexport const StepItem = styled.li<{\n  $active: boolean;\n  $done: boolean;\n  theme: ThemeType;\n}>`\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  font-family: ${({ theme }) => theme.typography.fontFamilyBase};\n\n  ${({ theme, $active }) =>\n    $active &&\n    css`\n      ${StepBar} {\n        border-color: ${theme.colors.tertiary};\n      }\n    `}\n  ${({ $done, theme }) =>\n    $done &&\n    css`\n      ${StepBar} {\n        border: none;\n        background-color: ${theme.colors.tertiary};\n        &:after {\n          border-bottom: 2px solid ${theme.colors.tertiary};\n        }\n      }\n    `}\n`;\n"],"names":["StepWrapper","styled","div","templateObject_1","__makeTemplateObject","StepList","ul","templateObject_3","_a","$total","css","templateObject_2","StepBar","span","templateObject_4","theme","colors","stepBackground","stepBorder","StepTick","templateObject_5","textLight","concat","StepItem","li","templateObject_8","typography","fontFamilyBase","$active","templateObject_6","tertiary","$done","templateObject_7"],"mappings":"2HAGa,oBAAAA,EAAcC,EAAOC,IAAGC,IAAAA,EAAAC,EAAA,CAAA,yJAAA,CAAA,4JAWxBC,EAAWJ,EAAOK,GAAEC,IAAAA,EAAAH,EAAA,CAAA,gIAAA,MAAA,CAE/B,gIAiBG,SATD,SAACI,GAAE,IAAAC,EAAMD,EAAAC,OACT,OAAAA,GACAC,EAAGC,IAAAA,EAAAP,EAAA,CAAA,gCAAA,wFAAA,CAAA,gCAEsB,0FAAZ,IAAMK,EAHnB,IAWSG,EAAUX,EAAOY,KAAIC,IAAAA,EAAAV,EAAA,CAAA,kHAAA,2EAAA,kNAAA,oEAAA,CAEhC,kHAK8D,2EAGJ,kNAUS,uEAb/C,SAACI,GAAc,OAAPA,EAAAO,MAAaC,OAAOC,cAAb,IAGf,SAACT,GAAc,OAAPA,EAAAO,MAAaC,OAAOE,UAAb,IAUN,SAACV,GAAc,OAAPA,EAAAO,MAAaC,OAAOE,UAAb,IAOjCC,EAAWlB,EAAOY,KAE7BO,IAAAA,EAAAhB,EAAA,CAAA,0IAAA,sBAAA,gDAAA,CAAA,0IAU8B,sBAKA,mDATb,SAACI,GAEJ,IAAAa,EAASb,EAAAO,MAAAC,OAAAK,UAEjB,MAAA,aAAAC,OAAaD,EAAb,IACU,SAACb,GAEH,IAAAa,EAASb,EAAAO,MAAAC,OAAAK,UAEjB,MAAA,aAAAC,OAAaD,EAAb,IAKKE,EAAWtB,EAAOuB,GAAEC,IAAAA,EAAArB,EAAA,CAAA,wFAAA,UAAA,OAAA,MAAA,CAI/B,wFAI6D,UAQ1D,OAWA,SAnBY,SAACI,GAAc,OAAPA,EAAAO,MAAaW,WAAWC,cAAjB,IAE5B,SAACnB,OAAEO,EAAKP,EAAAO,MACR,OADiBP,EAAAoB,SAEjBlB,EAAGmB,IAAAA,EAAAzB,EAAA,CAAA,WAAA,6BAAA,oBAAA,CAAA,WACQ,6BAC8B,sBADrCQ,EACgBG,EAAMC,OAAOc,SAHjC,IAMA,SAACtB,OAAEuB,EAAKvB,EAAAuB,MAAEhB,EAAKP,EAAAO,MACf,OAAAgB,GACArB,EAAGsB,IAAAA,EAAA5B,EAAA,CAAA,WAAA,wDAAA,4DAAA,+BAAA,CAAA,WACQ,wDAEkC,4DAES,iCAJlDQ,EAEoBG,EAAMC,OAAOc,SAEJf,EAAMC,OAAOc,SAN9C"}
+{"version":3,"file":"styles.js","sources":["../../../../src/components/Step/styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport { type ThemeType } from \"../../types\";\n\nexport const StepWrapper = styled.div`\n  box-sizing: border-box;\n  *,\n  *:after,\n  *:before {\n    box-sizing: border-box;\n  }\n  text-align: center;\n  text-transform: capitalize;\n`;\n\nexport const StepList = styled.ul<{\n  $total: number;\n}>`\n  list-style: none;\n  padding: 0;\n  margin: 0;\n  display: flex;\n  justify-content: space-between;\n  width: 100%;\n\n  ${({ $total }) =>\n    $total &&\n    css`\n      li {\n        width: ${100 / $total}%;\n      }\n      li:last-child span:after {\n        display: none;\n      }\n    `}\n`;\n\nexport const StepBar = styled.span<{\n  theme: ThemeType;\n}>`\n  border-radius: 50%;\n  background-clip: padding-box;\n  width: 24px;\n  height: 24px;\n  background-color: ${({ theme }) => theme.colors.stepBackground};\n  display: block;\n  margin: 0 auto 0.5em auto;\n  border: 2px solid ${({ theme }) => theme.colors.stepBorder};\n  text-indent: -999px;\n\n  &:after {\n    display: block;\n    position: absolute;\n    width: 100%;\n    height: 2px;\n    content: \"\";\n    background-color: transparent;\n    border-bottom: 2px solid ${({ theme }) => theme.colors.stepBorder};\n    left: 50%;\n    top: 11px;\n    margin-left: 12px;\n  }\n`;\n\nexport const StepTick = styled.span<{\n  theme: ThemeType;\n}>`\n  display: block;\n  transform: rotate(45deg);\n  transform-origin: center center;\n  height: 14px;\n  width: 8px;\n  border-bottom: ${({\n    theme: {\n      colors: { textLight },\n    },\n  }) => `2px solid ${textLight}`};\n  border-right: ${({\n    theme: {\n      colors: { textLight },\n    },\n  }) => `2px solid ${textLight}`};\n  margin-top: 4px;\n  margin-left: 8px;\n`;\n\nexport const StepItem = styled.li<{\n  $active: boolean;\n  $done: boolean;\n  theme: ThemeType;\n}>`\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  font-family: ${({ theme }) => theme.typography.fontFamilyBase};\n\n  ${({ theme, $active }) =>\n    $active &&\n    css`\n      ${StepBar} {\n        border-color: ${theme.colors.tertiary};\n      }\n    `}\n  ${({ $done, theme }) =>\n    $done &&\n    css`\n      ${StepBar} {\n        border: none;\n        background-color: ${theme.colors.tertiary};\n        &:after {\n          border-bottom: 2px solid ${theme.colors.tertiary};\n        }\n      }\n    `}\n`;\n"],"names":["StepWrapper","styled","div","StepList","ul","$total","css","StepBar","span","theme","colors","stepBackground","stepBorder","StepTick","textLight","StepItem","li","typography","fontFamilyBase","$active","tertiary","$done"],"mappings":"2CAGa,MAAAA,EAAcC,EAAOC,GAAG;;;;;;;;;EAWxBC,EAAWF,EAAOG,EAE7B;;;;;;;;IAQE,EAAGC,YACHA,GACAC,CAAG;;iBAEU,IAAMD;;;;;;EAQVE,EAAUN,EAAOO,IAE5B;;;;;sBAKoB,EAAGC,WAAYA,EAAMC,OAAOC;;;sBAG5B,EAAGF,WAAYA,EAAMC,OAAOE;;;;;;;;;;+BAUnB,EAAGH,WAAYA,EAAMC,OAAOE;;;;;EAO9CC,EAAWZ,EAAOO,IAE7B;;;;;;mBAMiB,EACfC,OACEC,QAAUI,iBAER,aAAaA;kBACH,EACdL,OACEC,QAAUI,iBAER,aAAaA;;;EAKRC,EAAWd,EAAOe,EAI7B;;;;iBAIe,EAAGP,WAAYA,EAAMQ,WAAWC;;IAE7C,EAAGT,QAAOU,aACVA,GACAb,CAAG;QACCC;wBACgBE,EAAMC,OAAOU;;;IAGjC,EAAGC,QAAOZ,WACVY,GACAf,CAAG;QACCC;;4BAEoBE,EAAMC,OAAOU;;qCAEJX,EAAMC,OAAOU;;;;"}

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

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

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

@@ -1,2 +1,2 @@
-import{__assign as t,__rest as e}from"../../../node_modules/tslib/tslib.es6.js";import o,{forwardRef as r}from"react";import{useTheme as i}from"styled-components";import{crukTheme as m}from"../../themes/cruk.js";import{spacingPropsToSpacingPropsInternal as l}from"../Spacing/index.js";import{TextStyled as x}from"./styles.js";var a=r((function(r,a){var n=i(),s=t(t({},m),n),f=r.textColor,p=r.textAlign,d=r.textSize,g=r.textWeight,$=r.textFontFamily,c=r.wordBreak,w=r.overflowWrap,F=e(r,["textColor","textAlign","textSize","textWeight","textFontFamily","wordBreak","overflowWrap"]),W=l(F);return o.createElement(x,t({$textColor:f,$textAlign:p,$textSize:d,$textWeight:g,$textFontFamily:$,$wordBreak:c,$overflowWrap:w},W,{theme:s,ref:a}))}));export{a as Text,a as default};
+import t,{forwardRef as e}from"react";import{useTheme as o}from"styled-components";import{crukTheme as r}from"../../themes/cruk.js";import{spacingPropsToSpacingPropsInternal as m}from"../Spacing/index.js";import{TextStyled as i}from"./styles.js";const a=e(((e,a)=>{const l=o(),x={...r,...l},{textColor:n,textAlign:s,textSize:p,textWeight:f,textFontFamily:c,wordBreak:$,overflowWrap:d,...g}=e,y=m(g);return t.createElement(i,{$textColor:n,$textAlign:s,$textSize:p,$textWeight:f,$textFontFamily:c,$wordBreak:$,$overflowWrap:d,...y,theme:x,ref:a})}));a.displayName="Text";export{a as Text,a as default};
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/Text/index.tsx"],"sourcesContent":["import React, {\n  type HTMLAttributes,\n  type Ref,\n  forwardRef,\n  type ElementType,\n  type LegacyRef,\n} from \"react\";\nimport { useTheme } from \"styled-components\";\n\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\n\nimport {\n  spacingPropsToSpacingPropsInternal,\n  type SpacingProps,\n} from \"../Spacing\";\nimport {\n  type WordBreakType,\n  type FontSizeType,\n  type OverflowWrapType,\n} from \"../../types\";\nimport { TextStyled } from \"./styles\";\n\n// the 'as' prop is for styled component casting\n// text hover color prop is only used in Link which extends Text\n\n/**\n * Text is to be used as the main paragraph component (or span using as=\"span\"). Using the Text component is preferred to simply adding text to a div and styling that div, this will guarantee we are always using the correct font and default text colour.\n */\nexport type TextProps = SpacingProps &\n  HTMLAttributes<HTMLElement> & {\n    /** text colour  */\n    textColor?: string;\n    /** text horizontal alignment  */\n    textAlign?: \"left\" | \"right\" | \"center\" | \"justify\";\n    /** font size FontSizeType t-shirt sizes  */\n    textSize?: FontSizeType;\n    /** font weight theme.typography{fontWeightHeavy/fontWeightNormal/fontWeightMedium/fontWeightLight/fontWeightVLight} is better than a random number */\n    textWeight?: number | string;\n    /** font family theme.typography{fontFamilyBase/fontFamilyHeadings} is better than a random string */\n    textFontFamily?: string;\n    /** styled-components polymorphism where you can set this to \"span\", \"p\" or \"h2\" it default to \"p\" */\n    as?: ElementType;\n    /** word-break behaviour */\n    wordBreak?: WordBreakType;\n    /** overflow-wrap behaviour */\n    overflowWrap?: OverflowWrapType;\n    /** react reference to the DOM element sometime used to scroll to or set focus after an error */\n    ref?: Ref<HTMLElement>;\n  };\n\nexport const Text = forwardRef((props: TextProps, ref?: Ref<HTMLElement>) => {\n  const foundTheme = useTheme();\n  const theme = {\n    ...defaultTheme,\n    ...foundTheme,\n  };\n  const {\n    textColor,\n    textAlign,\n    textSize,\n    textWeight,\n    textFontFamily,\n    wordBreak,\n    overflowWrap,\n    ...rest\n  } = props;\n\n  const withInternalSpacingProps = spacingPropsToSpacingPropsInternal(rest);\n\n  return (\n    <TextStyled\n      $textColor={textColor}\n      $textAlign={textAlign}\n      $textSize={textSize}\n      $textWeight={textWeight}\n      $textFontFamily={textFontFamily}\n      $wordBreak={wordBreak}\n      $overflowWrap={overflowWrap}\n      {...withInternalSpacingProps}\n      theme={theme}\n      ref={ref as LegacyRef<HTMLParagraphElement>}\n    />\n  );\n});\n\nexport default Text;\n"],"names":["Text","forwardRef","props","ref","foundTheme","useTheme","theme","__assign","defaultTheme","textColor","textAlign","textSize","textWeight","textFontFamily","wordBreak","overflowWrap","rest","__rest","withInternalSpacingProps","spacingPropsToSpacingPropsInternal","React","createElement","TextStyled","$textColor","$textAlign","$textSize","$textWeight","$textFontFamily","$wordBreak","$overflowWrap"],"mappings":"0UAkDaA,EAAOC,GAAW,SAACC,EAAkBC,GAChD,IAAMC,EAAaC,IACbC,EACDC,EAAAA,EAAA,CAAA,EAAAC,GACAJ,GAGHK,EAQEP,YAPFQ,EAOER,EAAKQ,UANPC,EAMET,EAAKS,SALPC,EAKEV,EALQU,WACVC,EAIEX,EAJYW,eACdC,EAGEZ,YAFFa,EAEEb,EAAKa,aADJC,EAAIC,EACLf,EATE,CAAA,YAAA,YAAA,WAAA,aAAA,iBAAA,YAAA,iBAWAgB,EAA2BC,EAAmCH,GAEpE,OACEI,EAAAC,cAACC,EAAUf,EAAA,CAAAgB,WACGd,EAASe,WACTd,EAASe,UACVd,EAAQe,YACNd,EAAUe,gBACNd,EAAce,WACnBd,EAASe,cACNd,GACXG,EAAwB,CAC5BZ,MAAOA,EACPH,IAAKA,IAGX"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/Text/index.tsx"],"sourcesContent":["import React, {\n  type HTMLAttributes,\n  type Ref,\n  forwardRef,\n  type ElementType,\n  type LegacyRef,\n} from \"react\";\nimport { useTheme } from \"styled-components\";\n\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\n\nimport {\n  spacingPropsToSpacingPropsInternal,\n  type SpacingProps,\n} from \"../Spacing\";\nimport {\n  type WordBreakType,\n  type FontSizeType,\n  type OverflowWrapType,\n} from \"../../types\";\nimport { TextStyled } from \"./styles\";\n\n// the 'as' prop is for styled component casting\n// text hover color prop is only used in Link which extends Text\n\n/**\n * Text is to be used as the main paragraph component (or span using as=\"span\"). Using the Text component is preferred to simply adding text to a div and styling that div, this will guarantee we are always using the correct font and default text colour.\n */\nexport type TextProps = SpacingProps &\n  HTMLAttributes<HTMLElement> & {\n    /** text colour  */\n    textColor?: string;\n    /** text horizontal alignment  */\n    textAlign?: \"left\" | \"right\" | \"center\" | \"justify\";\n    /** font size FontSizeType t-shirt sizes  */\n    textSize?: FontSizeType;\n    /** font weight theme.typography{fontWeightHeavy/fontWeightNormal/fontWeightMedium/fontWeightLight/fontWeightVLight} is better than a random number */\n    textWeight?: number | string;\n    /** font family theme.typography{fontFamilyBase/fontFamilyHeadings} is better than a random string */\n    textFontFamily?: string;\n    /** styled-components polymorphism where you can set this to \"span\", \"p\" or \"h2\" it default to \"p\" */\n    as?: ElementType;\n    /** word-break behaviour */\n    wordBreak?: WordBreakType;\n    /** overflow-wrap behaviour */\n    overflowWrap?: OverflowWrapType;\n    /** react reference to the DOM element sometime used to scroll to or set focus after an error */\n    ref?: Ref<HTMLElement>;\n  };\n\nexport const Text = forwardRef((props: TextProps, ref?: Ref<HTMLElement>) => {\n  const foundTheme = useTheme();\n  const theme = {\n    ...defaultTheme,\n    ...foundTheme,\n  };\n  const {\n    textColor,\n    textAlign,\n    textSize,\n    textWeight,\n    textFontFamily,\n    wordBreak,\n    overflowWrap,\n    ...rest\n  } = props;\n\n  const withInternalSpacingProps = spacingPropsToSpacingPropsInternal(rest);\n\n  return (\n    <TextStyled\n      $textColor={textColor}\n      $textAlign={textAlign}\n      $textSize={textSize}\n      $textWeight={textWeight}\n      $textFontFamily={textFontFamily}\n      $wordBreak={wordBreak}\n      $overflowWrap={overflowWrap}\n      {...withInternalSpacingProps}\n      theme={theme}\n      ref={ref as LegacyRef<HTMLParagraphElement>}\n    />\n  );\n});\n\nText.displayName = \"Text\";\n\nexport default Text;\n"],"names":["Text","forwardRef","props","ref","foundTheme","useTheme","theme","defaultTheme","textColor","textAlign","textSize","textWeight","textFontFamily","wordBreak","overflowWrap","rest","withInternalSpacingProps","spacingPropsToSpacingPropsInternal","React","createElement","TextStyled","$textColor","$textAlign","$textSize","$textWeight","$textFontFamily","$wordBreak","$overflowWrap","displayName"],"mappings":"sPAkDa,MAAAA,EAAOC,GAAW,CAACC,EAAkBC,KAChD,MAAMC,EAAaC,IACbC,EAAQ,IACTC,KACAH,IAECI,UACJA,EAASC,UACTA,EAASC,SACTA,EAAQC,WACRA,EAAUC,eACVA,EAAcC,UACdA,EAASC,aACTA,KACGC,GACDb,EAEEc,EAA2BC,EAAmCF,GAEpE,OACEG,EAAAC,cAACC,EAAU,CAAAC,WACGb,EAASc,WACTb,EAASc,UACVb,EAAQc,YACNb,EAAUc,gBACNb,EAAcc,WACnBb,EAASc,cACNb,KACXE,EACJV,MAAOA,EACPH,IAAKA,GACL,IAINH,EAAK4B,YAAc"}

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

@@ -1,2 +1,20 @@
-import{__makeTemplateObject as n}from"../../../node_modules/tslib/tslib.es6.js";import t from"styled-components";import{spacing as o}from"../Spacing/index.js";var e,r=t.p(e||(e=n(["\n  font-family: ",";\n  word-break: ",";\n  overflow-wrap: ",";\n  color: ",";\n  text-align: ",";\n  font-size: ",";\n  line-height: ",";\n  font-weight: ",";\n  padding: 0;\n  margin: 0;\n  margin-bottom: ",";\n\n  &:last-child {\n    margin-bottom: 0;\n  }\n\n  ","\n"],["\n  font-family: ",";\n  word-break: ",";\n  overflow-wrap: ",";\n  color: ",";\n  text-align: ",";\n  font-size: ",";\n  line-height: ",";\n  font-weight: ",";\n  padding: 0;\n  margin: 0;\n  margin-bottom: ",";\n\n  &:last-child {\n    margin-bottom: 0;\n  }\n\n  ","\n"])),(function(n){var t=n.$textFontFamily,o=n.theme;return t||o.typography.fontFamilyBase}),(function(n){return n.$wordBreak||"normal"}),(function(n){return n.$overflowWrap||"break-word"}),(function(n){var t=n.theme.colors,o=n.$textColor;return o&&void 0!==t[o]?t[o]:o||t.textDark}),(function(n){return n.$textAlign||"left"}),(function(n){var t=n.theme,o=t.fontSizes,e=t.fontSizes.m,r=n.$textSize;return r?o[r]:e}),(function(n){return n.theme.typography.lineHeight}),(function(n){var t=n.$textWeight,o=n.theme;return t||o.typography.fontWeightBase}),(function(n){var t=n.as,o=n.theme.spacing.xs;return void 0===t||"p"===t?"".concat(o):0}),(function(n){return o(n,n.theme)}));export{r as TextStyled};
+import t from"styled-components";import{spacing as e}from"../Spacing/index.js";const o=t.p`
+  font-family: ${({$textFontFamily:t,theme:e})=>t||e.typography.fontFamilyBase};
+  word-break: ${({$wordBreak:t})=>t||"normal"};
+  overflow-wrap: ${({$overflowWrap:t})=>t||"break-word"};
+  color: ${({theme:{colors:t},$textColor:e})=>e&&void 0!==t[e]?t[e]:e||t.textDark};
+  text-align: ${({$textAlign:t})=>t||"left"};
+  font-size: ${({theme:{fontSizes:t,fontSizes:{m:e}},$textSize:o})=>o?t[o]:e};
+  line-height: ${({theme:t})=>t.typography.lineHeight};
+  font-weight: ${({$textWeight:t,theme:e})=>t||e.typography.fontWeightBase};
+  padding: 0;
+  margin: 0;
+  margin-bottom: ${({as:t,theme:{spacing:{xs:e}}})=>void 0===t||"p"===t?`${e}`:0};
+
+  &:last-child {
+    margin-bottom: 0;
+  }
+
+  ${t=>e(t,t.theme)}
+`;export{o as TextStyled};
 //# sourceMappingURL=styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sources":["../../../../src/components/Text/styles.ts"],"sourcesContent":["import { type ElementType } from \"react\";\nimport styled from \"styled-components\";\n\nimport { spacing, type SpacingPropsInternal } from \"../Spacing\";\nimport {\n  type WordBreakType,\n  type FontSizeType,\n  type ThemeType,\n  type ColorKeyType,\n  type OverflowWrapType,\n} from \"../../types\";\n\nexport type TextStyledProps = SpacingPropsInternal & {\n  $textColor?: string;\n  $textAlign?: \"left\" | \"right\" | \"center\" | \"justify\";\n  $textSize?: FontSizeType;\n  $textWeight?: number | string;\n  as?: ElementType;\n  $wordBreak?: WordBreakType;\n  $overflowWrap?: OverflowWrapType;\n  $textFontFamily?: string;\n  theme: ThemeType;\n};\n\nexport const TextStyled = styled.p<TextStyledProps>`\n  font-family: ${({ $textFontFamily, theme }) =>\n    $textFontFamily || theme.typography.fontFamilyBase};\n  word-break: ${({ $wordBreak }) => $wordBreak || \"normal\"};\n  overflow-wrap: ${({ $overflowWrap }) => $overflowWrap || \"break-word\"};\n  color: ${({ theme: { colors }, $textColor }) =>\n    $textColor && typeof colors[$textColor as ColorKeyType] !== \"undefined\"\n      ? colors[$textColor as ColorKeyType]\n      : $textColor || colors.textDark};\n  text-align: ${({ $textAlign }) => $textAlign || \"left\"};\n  font-size: ${({\n    theme: {\n      fontSizes,\n      fontSizes: { m },\n    },\n    $textSize,\n  }) => ($textSize ? fontSizes[$textSize] : m)};\n  line-height: ${({ theme }) => theme.typography.lineHeight};\n  font-weight: ${({ $textWeight, theme }) =>\n    $textWeight || theme.typography.fontWeightBase};\n  padding: 0;\n  margin: 0;\n  margin-bottom: ${({\n    as,\n    theme: {\n      spacing: { xs },\n    },\n  }) => (typeof as === \"undefined\" || as === \"p\" ? `${xs}` : 0)};\n\n  &:last-child {\n    margin-bottom: 0;\n  }\n\n  ${(props) => spacing(props, props.theme as ThemeType)}\n`;\n"],"names":["TextStyled","styled","p","templateObject_1","__makeTemplateObject","_a","$textFontFamily","theme","typography","fontFamilyBase","$wordBreak","$overflowWrap","colors","$textColor","textDark","$textAlign","_b","fontSizes","m","$textSize","lineHeight","$textWeight","fontWeightBase","as","xs","spacing","props"],"mappings":"+JAwBO,MAAMA,EAAaC,EAAOC,EAACC,IAAAA,EAAAC,EAAA,CAAA,oBAAA,oBAAA,uBAAA,eAAA,oBAAA,mBAAA,qBAAA,qBAAA,oDAAA,0DAAA,MAAA,CAAiB,oBAEG,oBACI,uBACa,eAIlC,oBACmB,mBAOV,qBACa,qBAET,oDAQa,0DAMR,SAhCtC,SAACC,OAAEC,EAAeD,EAAAC,gBAAEC,EAAKF,EAAAE,MACtC,OAAAD,GAAmBC,EAAMC,WAAWC,cAApC,IACY,SAACJ,GAAmB,OAAPA,EAAAK,YAAqB,QAAd,IACjB,SAACL,GAAsB,OAAPA,EAAAM,eAAwB,YAAjB,IAC/B,SAACN,OAAWO,EAAMP,EAAAE,MAAAK,OAAIC,EAAUR,EAAAQ,WACvC,OAAAA,QAA4D,IAAvCD,EAAOC,GACxBD,EAAOC,GACPA,GAAcD,EAAOE,QAFzB,IAGY,SAACT,GAAmB,OAAPA,EAAAU,YAAqB,MAAd,IACrB,SAACV,OACZW,EAGCX,EAAAE,MAFCU,EAASD,EAAAC,UACIC,EAACF,EAAAC,UAAAC,EAEhBC,EAASd,EAAAc,UACL,OAACA,EAAYF,EAAUE,GAAaD,CAApC,IACS,SAACb,GAAc,OAAPA,EAAAE,MAAaC,WAAWY,UAAjB,IACf,SAACf,OAAEgB,EAAWhB,EAAAgB,YAAEd,EAAKF,EAAAE,MAClC,OAAAc,GAAed,EAAMC,WAAWc,cAAhC,IAGe,SAACjB,OAChBkB,EAAElB,EAAAkB,GAEWC,EAAEnB,EAAAE,MAAAkB,QAAAD,GAEX,YAAe,IAAPD,GAA6B,MAAPA,EAAa,UAAGC,GAAO,CAArD,IAMJ,SAACE,GAAU,OAAAD,EAAQC,EAAOA,EAAMnB,MAAmB"}
+{"version":3,"file":"styles.js","sources":["../../../../src/components/Text/styles.ts"],"sourcesContent":["import { type ElementType } from \"react\";\nimport styled from \"styled-components\";\n\nimport { spacing, type SpacingPropsInternal } from \"../Spacing\";\nimport {\n  type WordBreakType,\n  type FontSizeType,\n  type ThemeType,\n  type ColorKeyType,\n  type OverflowWrapType,\n} from \"../../types\";\n\nexport type TextStyledProps = SpacingPropsInternal & {\n  $textColor?: string;\n  $textAlign?: \"left\" | \"right\" | \"center\" | \"justify\";\n  $textSize?: FontSizeType;\n  $textWeight?: number | string;\n  as?: ElementType;\n  $wordBreak?: WordBreakType;\n  $overflowWrap?: OverflowWrapType;\n  $textFontFamily?: string;\n  theme: ThemeType;\n};\n\nexport const TextStyled = styled.p<TextStyledProps>`\n  font-family: ${({ $textFontFamily, theme }) =>\n    $textFontFamily || theme.typography.fontFamilyBase};\n  word-break: ${({ $wordBreak }) => $wordBreak || \"normal\"};\n  overflow-wrap: ${({ $overflowWrap }) => $overflowWrap || \"break-word\"};\n  color: ${({ theme: { colors }, $textColor }) =>\n    $textColor && typeof colors[$textColor as ColorKeyType] !== \"undefined\"\n      ? colors[$textColor as ColorKeyType]\n      : $textColor || colors.textDark};\n  text-align: ${({ $textAlign }) => $textAlign || \"left\"};\n  font-size: ${({\n    theme: {\n      fontSizes,\n      fontSizes: { m },\n    },\n    $textSize,\n  }) => ($textSize ? fontSizes[$textSize] : m)};\n  line-height: ${({ theme }) => theme.typography.lineHeight};\n  font-weight: ${({ $textWeight, theme }) =>\n    $textWeight || theme.typography.fontWeightBase};\n  padding: 0;\n  margin: 0;\n  margin-bottom: ${({\n    as,\n    theme: {\n      spacing: { xs },\n    },\n  }) => (typeof as === \"undefined\" || as === \"p\" ? `${xs}` : 0)};\n\n  &:last-child {\n    margin-bottom: 0;\n  }\n\n  ${(props) => spacing(props, props.theme as ThemeType)}\n`;\n"],"names":["TextStyled","styled","p","$textFontFamily","theme","typography","fontFamilyBase","$wordBreak","$overflowWrap","colors","$textColor","textDark","$textAlign","fontSizes","m","$textSize","lineHeight","$textWeight","fontWeightBase","as","spacing","xs","props"],"mappings":"+EAwBa,MAAAA,EAAaC,EAAOC,CAAkB;iBAClC,EAAGC,kBAAiBC,WACjCD,GAAmBC,EAAMC,WAAWC;gBACxB,EAAGC,gBAAiBA,GAAc;mBAC/B,EAAGC,mBAAoBA,GAAiB;WAChD,EAAGJ,OAASK,UAAUC,gBAC7BA,QAA4D,IAAvCD,EAAOC,GACxBD,EAAOC,GACPA,GAAcD,EAAOE;gBACb,EAAGC,gBAAiBA,GAAc;eACnC,EACXR,OACES,YACAA,WAAaC,MAEfC,eACKA,EAAYF,EAAUE,GAAaD;iBAC3B,EAAGV,WAAYA,EAAMC,WAAWW;iBAChC,EAAGC,cAAab,WAC7Ba,GAAeb,EAAMC,WAAWa;;;mBAGjB,EACfC,KACAf,OACEgB,SAAWC,eAEM,IAAPF,GAA6B,MAAPA,EAAa,GAAGE,IAAO;;;;;;IAMxDC,GAAUF,EAAQE,EAAOA,EAAMlB;"}

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

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

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

@@ -1,2 +1,2 @@
-import{__rest as r,__assign as e}from"../../../node_modules/tslib/tslib.es6.js";import i,{forwardRef as t}from"react";import{useTheme as o}from"styled-components";import{crukTheme as s}from"../../themes/cruk.js";import{ErrorText as a}from"../ErrorText/index.js";import{LabelWrapper as n}from"../LabelWrapper/index.js";import m from"./styles.js";var d=t((function(t,d){var l=t.errorMessage,p=t.hasError,c=t.hintText,u=t.label,f=t.resize,h=void 0===f?"vertical":f,x=t.lineCount,b=void 0===x?3:x,v=r(t,["errorMessage","hasError","hintText","label","resize","lineCount"]),E=o(),j=e(e({},s),E);return i.createElement(n,{label:u,hintText:c,required:v.required||!1},i.createElement(m,e({},v,{"aria-invalid":p||!!l||!1,"aria-describedby":v.id&&l?"".concat(v.id,"-error"):void 0,$hasError:p||!!l||!1,$resize:h,$lineCount:b,theme:j,ref:d,"data-hj-suppress":!0})),!!l&&i.createElement(a,{marginTop:"xxs",id:v.id?"".concat(v.id,"-error"):void 0},l))}));export{d as TextAreaField,d as default};
+import e,{forwardRef as r}from"react";import{useTheme as t}from"styled-components";import{crukTheme as i}from"../../themes/cruk.js";import{ErrorText as o}from"../ErrorText/index.js";import{LabelWrapper as a}from"../LabelWrapper/index.js";import s from"./styles.js";const m=r((({errorMessage:r,hasError:m,hintText:d,label:n,resize:l="vertical",lineCount:p=3,...c},x)=>{const f=t(),u={...i,...f};return e.createElement(a,{label:n,hintText:d,required:c.required||!1},e.createElement(s,{...c,"aria-invalid":m||!!r||!1,"aria-describedby":c.id&&r?`${c.id}-error`:void 0,$hasError:m||!!r||!1,$resize:l,$lineCount:p,theme:u,ref:x,"data-hj-suppress":!0}),!!r&&e.createElement(o,{marginTop:"xxs",id:c.id?`${c.id}-error`:void 0},r))}));m.displayName="TextAreaField";export{m as TextAreaField,m as default};
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/TextAreaField/index.tsx"],"sourcesContent":["import React, {\n  type ReactNode,\n  type TextareaHTMLAttributes,\n  type Ref,\n  forwardRef,\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 { StyledTextArea } from \"./styles\";\n\nexport type TextAreaFieldProps = TextareaHTMLAttributes<HTMLTextAreaElement> & {\n  /** error message text */\n  errorMessage?: string;\n  /** flag for error styling */\n  hasError?: boolean;\n  /** hint text */\n  hintText?: ReactNode;\n  /** label text */\n  label: string;\n  /** resize behaviour using the resize button on the bottom right of the component */\n  resize?: \"both\" | \"vertical\" | \"horizontal\" | \"none\";\n  /** number of visible lines of text before scroll is required this affect the height of the input field */\n  lineCount?: number;\n  /** react reference to the DOM element sometime used to scroll to or set focus after an error */\n  ref?: Ref<HTMLTextAreaElement>;\n};\n\n/**\n * TextAreaField lets users enter and edit multiline text.\n */\nexport const TextAreaField = forwardRef(\n  (\n    {\n      errorMessage,\n      hasError,\n      hintText,\n      label,\n      resize = \"vertical\",\n      lineCount = 3,\n      ...props\n    }: TextAreaFieldProps,\n    ref?: Ref<HTMLTextAreaElement>,\n  ) => {\n    const foundTheme = useTheme();\n    const theme = {\n      ...defaultTheme,\n      ...foundTheme,\n    };\n\n    return (\n      <LabelWrapper\n        label={label}\n        hintText={hintText}\n        required={props.required || false}\n      >\n        <StyledTextArea\n          {...props}\n          aria-invalid={hasError || !!errorMessage || false}\n          aria-describedby={\n            !!props.id && !!errorMessage ? `${props.id}-error` : undefined\n          }\n          $hasError={hasError || !!errorMessage || false}\n          $resize={resize}\n          $lineCount={lineCount}\n          theme={theme}\n          ref={ref}\n          data-hj-suppress\n        />\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);\n\nexport default TextAreaField;\n"],"names":["TextAreaField","forwardRef","_a","ref","errorMessage","hasError","hintText","label","_b","resize","_c","lineCount","props","__rest","foundTheme","useTheme","theme","__assign","defaultTheme","React","createElement","LabelWrapper","required","StyledTextArea","id","concat","undefined","$resize","$lineCount","ErrorText","marginTop"],"mappings":"6VAkCaA,EAAgBC,GAC3B,SACEC,EASAC,GARE,IAAAC,EAAYF,EAAAE,aACZC,EAAQH,EAAAG,SACRC,EAAQJ,EAAAI,SACRC,EAAKL,EAAAK,MACLC,EAAmBN,EAAAO,OAAnBA,OAAM,IAAAD,EAAG,WAAUA,EACnBE,EAAAR,EAAAS,UAAAA,OAAY,IAAAD,EAAA,EAACA,EACVE,EAAKC,EAAAX,EAPV,qEAWMY,EAAaC,IACbC,EACDC,EAAAA,EAAA,CAAA,EAAAC,GACAJ,GAGL,OACEK,EAACC,cAAAC,GACCd,MAAOA,EACPD,SAAUA,EACVgB,SAAUV,EAAMU,WAAY,GAE5BH,EAACC,cAAAG,EACKN,EAAA,CAAA,EAAAL,EACU,CAAA,eAAAP,KAAcD,IAAgB,EAAK,mBAE7CQ,EAAMY,IAAQpB,EAAe,GAAGqB,OAAAb,EAAMY,GAAE,eAAWE,YAE5CrB,KAAcD,IAAgB,EAChCuB,QAAAlB,EACGmB,WAAAjB,EACZK,MAAOA,EACPb,IAAKA,EAEL,oBAAA,OACCC,GACDe,gBAACU,EAAS,CACRC,UAAU,MACVN,GAAIZ,EAAMY,GAAK,GAAGC,OAAAb,EAAMY,kBAAaE,GAEpCtB,GAKX"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/TextAreaField/index.tsx"],"sourcesContent":["import React, {\n  type ReactNode,\n  type TextareaHTMLAttributes,\n  type Ref,\n  forwardRef,\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 { StyledTextArea } from \"./styles\";\n\nexport type TextAreaFieldProps = TextareaHTMLAttributes<HTMLTextAreaElement> & {\n  /** error message text */\n  errorMessage?: string;\n  /** flag for error styling */\n  hasError?: boolean;\n  /** hint text */\n  hintText?: ReactNode;\n  /** label text */\n  label: string;\n  /** resize behaviour using the resize button on the bottom right of the component */\n  resize?: \"both\" | \"vertical\" | \"horizontal\" | \"none\";\n  /** number of visible lines of text before scroll is required this affect the height of the input field */\n  lineCount?: number;\n  /** react reference to the DOM element sometime used to scroll to or set focus after an error */\n  ref?: Ref<HTMLTextAreaElement>;\n};\n\n/**\n * TextAreaField lets users enter and edit multiline text.\n */\nexport const TextAreaField = forwardRef(\n  (\n    {\n      errorMessage,\n      hasError,\n      hintText,\n      label,\n      resize = \"vertical\",\n      lineCount = 3,\n      ...props\n    }: TextAreaFieldProps,\n    ref?: Ref<HTMLTextAreaElement>,\n  ) => {\n    const foundTheme = useTheme();\n    const theme = {\n      ...defaultTheme,\n      ...foundTheme,\n    };\n\n    return (\n      <LabelWrapper\n        label={label}\n        hintText={hintText}\n        required={props.required || false}\n      >\n        <StyledTextArea\n          {...props}\n          aria-invalid={hasError || !!errorMessage || false}\n          aria-describedby={\n            !!props.id && !!errorMessage ? `${props.id}-error` : undefined\n          }\n          $hasError={hasError || !!errorMessage || false}\n          $resize={resize}\n          $lineCount={lineCount}\n          theme={theme}\n          ref={ref}\n          data-hj-suppress\n        />\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);\n\nTextAreaField.displayName = \"TextAreaField\";\n\nexport default TextAreaField;\n"],"names":["TextAreaField","forwardRef","errorMessage","hasError","hintText","label","resize","lineCount","props","ref","foundTheme","useTheme","theme","defaultTheme","React","createElement","LabelWrapper","required","StyledTextArea","id","undefined","$resize","$lineCount","ErrorText","marginTop","displayName"],"mappings":"yQAkCO,MAAMA,EAAgBC,GAC3B,EAEIC,eACAC,WACAC,WACAC,QACAC,SAAS,WACTC,YAAY,KACTC,GAELC,KAEA,MAAMC,EAAaC,IACbC,EAAQ,IACTC,KACAH,GAGL,OACEI,EAACC,cAAAC,GACCX,MAAOA,EACPD,SAAUA,EACVa,SAAUT,EAAMS,WAAY,GAE5BH,EAACC,cAAAG,EACK,IAAAV,EACU,eAAAL,KAAcD,IAAgB,EAAK,mBAE7CM,EAAMW,IAAQjB,EAAe,GAAGM,EAAMW,gBAAaC,YAE5CjB,KAAcD,IAAgB,EAChCmB,QAAAf,EACGgB,WAAAf,EACZK,MAAOA,EACPH,IAAKA,EAEL,oBAAA,MACCP,GACDY,gBAACS,EAAS,CACRC,UAAU,MACVL,GAAIX,EAAMW,GAAK,GAAGX,EAAMW,gBAAaC,GAEpClB,GAGQ,IAKrBF,EAAcyB,YAAc"}

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

@@ -1,2 +1,30 @@
-import{__makeTemplateObject as n}from"../../../node_modules/tslib/tslib.es6.js";import o,{css as r}from"styled-components";var e,t,i=o.textarea(t||(t=n(["\n  resize: ",";\n  background-color: ",";\n  background-image: none;\n  border: ",";\n  color: ",";\n  display: block;\n  font-family: ",";\n  font-size: ",";\n  padding: 6px 8px;\n  width: 100%;\n  height: ",";\n\n  transition: border-color 150ms linear;\n  &:hover {\n    border-color: ",";\n  }\n  &:disabled {\n    border-color: ",";\n    color: ",";\n  }\n\n  ",";\n"],["\n  resize: ",";\n  background-color: ",";\n  background-image: none;\n  border: ",";\n  color: ",";\n  display: block;\n  font-family: ",";\n  font-size: ",";\n  padding: 6px 8px;\n  width: 100%;\n  height: ",";\n\n  transition: border-color 150ms linear;\n  &:hover {\n    border-color: ",";\n  }\n  &:disabled {\n    border-color: ",";\n    color: ",";\n  }\n\n  ",";\n"])),(function(n){return n.$resize}),(function(n){return n.theme.colors.backgroundLight}),(function(n){var o=n.theme,r=n.$hasError;return"solid ".concat(o.utilities.inputBorderWidth,"\n    ").concat(r?o.colors.textError:o.colors.textInputBorder)}),(function(n){return n.theme.colors.textDark}),(function(n){return n.theme.typography.fontFamilyBase}),(function(n){return n.theme.fontSizes.m}),(function(n){var o=n.$lineCount,r=n.theme;return"calc(".concat(r.typography.lineHeight," * ").concat(o,")")}),(function(n){return n.theme.colors.secondary}),(function(n){return n.theme.colors.disabled}),(function(n){return n.theme.colors.disabled}),(function(o){var t=o.theme;return t.utilities.useDefaultFocusRect?null:r(e||(e=n(["\n          &:focus {\n            outline: 0;\n            border-color: ",";\n          }\n        "],["\n          &:focus {\n            outline: 0;\n            border-color: ",";\n          }\n        "])),t.colors.tertiary)}));export{i as StyledTextArea,i as default};
+import o,{css as e}from"styled-components";const r=o.textarea`
+  resize: ${({$resize:o})=>o};
+  background-color: ${({theme:o})=>o.colors.backgroundLight};
+  background-image: none;
+  border: ${({theme:o,$hasError:e})=>`solid ${o.utilities.inputBorderWidth}\n    ${e?o.colors.textError:o.colors.textInputBorder}`};
+  color: ${({theme:o})=>o.colors.textDark};
+  display: block;
+  font-family: ${({theme:o})=>o.typography.fontFamilyBase};
+  font-size: ${({theme:o})=>o.fontSizes.m};
+  padding: 6px 8px;
+  width: 100%;
+  height: ${({$lineCount:o,theme:e})=>`calc(${e.typography.lineHeight} * ${o})`};
+
+  transition: border-color 150ms linear;
+  &:hover {
+    border-color: ${({theme:o})=>o.colors.secondary};
+  }
+  &:disabled {
+    border-color: ${({theme:o})=>o.colors.disabled};
+    color: ${({theme:o})=>o.colors.disabled};
+  }
+
+  ${({theme:o})=>o.utilities.useDefaultFocusRect?null:e`
+          &:focus {
+            outline: 0;
+            border-color: ${o.colors.tertiary};
+          }
+        `};
+`;export{r as StyledTextArea,r as default};
 //# sourceMappingURL=styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sources":["../../../../src/components/TextAreaField/styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport { type ThemeType } from \"../../types\";\n\ntype StyledTextareaProps = {\n  $hasError: boolean;\n  $lineCount: number;\n  $resize: \"both\" | \"vertical\" | \"horizontal\" | \"none\";\n  theme: ThemeType;\n};\n\nconst StyledTextArea = styled.textarea<StyledTextareaProps>`\n  resize: ${({ $resize }) => $resize};\n  background-color: ${({ theme }) => theme.colors.backgroundLight};\n  background-image: none;\n  border: ${({ theme, $hasError }) => `solid ${theme.utilities.inputBorderWidth}\n    ${$hasError ? theme.colors.textError : theme.colors.textInputBorder}`};\n  color: ${({ theme }) => theme.colors.textDark};\n  display: block;\n  font-family: ${({ theme }) => theme.typography.fontFamilyBase};\n  font-size: ${({ theme }) => theme.fontSizes.m};\n  padding: 6px 8px;\n  width: 100%;\n  height: ${({ $lineCount, theme }) =>\n    `calc(${theme.typography.lineHeight} * ${$lineCount})`};\n\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          }\n        `\n      : null};\n`;\n\nexport default StyledTextArea;\nexport { StyledTextArea };\n"],"names":["StyledTextArea","styled","textarea","templateObject_2","__makeTemplateObject","_a","$resize","theme","colors","backgroundLight","$hasError","concat","utilities","inputBorderWidth","textError","textInputBorder","textDark","typography","fontFamilyBase","fontSizes","m","$lineCount","lineHeight","secondary","disabled","useDefaultFocusRect","css","templateObject_1","tertiary"],"mappings":"2HAUA,QAAMA,EAAiBC,EAAOC,SAAQC,IAAAA,EAAAC,EAAA,CAAA,eAAA,0BAAA,2CAAA,eAAA,wCAAA,mBAAA,qDAAA,iFAAA,6CAAA,iBAAA,eAAA,OAAA,CAAqB,eACvB,0BAC6B,2CAGQ,eAC1B,wCAEgB,mBAChB,qDAIW,iFAID,6CAGD,iBACP,eAWrC,UA/BA,SAACC,GAAgB,OAAPA,EAAAC,OAAO,IACP,SAACD,GAAc,OAAPA,EAAAE,MAAaC,OAAOC,eAAb,IAEzB,SAACJ,OAAEE,EAAKF,EAAAE,MAAEG,EAASL,EAAAK,UAAO,MAAA,SAAAC,OAASJ,EAAMK,UAAUC,iBACzD,UAAAF,OAAAD,EAAYH,EAAMC,OAAOM,UAAYP,EAAMC,OAAOO,gBADlB,IAE3B,SAACV,GAAc,OAAPA,EAAAE,MAAaC,OAAOQ,QAAb,IAET,SAACX,GAAc,OAAPA,EAAAE,MAAaU,WAAWC,cAAjB,IACjB,SAACb,GAAc,OAAPA,EAAAE,MAAaY,UAAUC,CAAhB,IAGlB,SAACf,OAAEgB,EAAUhB,EAAAgB,WAAEd,EAAKF,EAAAE,MAC5B,MAAA,QAAAI,OAAQJ,EAAMU,WAAWK,WAAU,OAAAX,OAAMU,EAAa,IAAtD,IAIgB,SAAChB,GAAc,OAAPA,EAAAE,MAAaC,OAAOe,SAAb,IAGf,SAAClB,GAAc,OAAPA,EAAAE,MAAaC,OAAOgB,QAAb,IACtB,SAACnB,GAAc,OAAPA,EAAAE,MAAaC,OAAOgB,QAAb,IAGxB,SAACnB,GAAE,IAAAE,EAAKF,EAAAE,MACR,OAACA,EAAMK,UAAUa,oBAOb,KANAC,EAAGC,IAAAA,EAAAvB,EAAA,CAAA,6EAAA,4BAAA,CAAA,6EAGsC,8BAArBG,EAAMC,OAAOoB,SAJrC"}
+{"version":3,"file":"styles.js","sources":["../../../../src/components/TextAreaField/styles.ts"],"sourcesContent":["import styled, { css } from \"styled-components\";\nimport { type ThemeType } from \"../../types\";\n\ntype StyledTextareaProps = {\n  $hasError: boolean;\n  $lineCount: number;\n  $resize: \"both\" | \"vertical\" | \"horizontal\" | \"none\";\n  theme: ThemeType;\n};\n\nconst StyledTextArea = styled.textarea<StyledTextareaProps>`\n  resize: ${({ $resize }) => $resize};\n  background-color: ${({ theme }) => theme.colors.backgroundLight};\n  background-image: none;\n  border: ${({ theme, $hasError }) => `solid ${theme.utilities.inputBorderWidth}\n    ${$hasError ? theme.colors.textError : theme.colors.textInputBorder}`};\n  color: ${({ theme }) => theme.colors.textDark};\n  display: block;\n  font-family: ${({ theme }) => theme.typography.fontFamilyBase};\n  font-size: ${({ theme }) => theme.fontSizes.m};\n  padding: 6px 8px;\n  width: 100%;\n  height: ${({ $lineCount, theme }) =>\n    `calc(${theme.typography.lineHeight} * ${$lineCount})`};\n\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          }\n        `\n      : null};\n`;\n\nexport default StyledTextArea;\nexport { StyledTextArea };\n"],"names":["StyledTextArea","styled","textarea","$resize","theme","colors","backgroundLight","$hasError","utilities","inputBorderWidth","textError","textInputBorder","textDark","typography","fontFamilyBase","fontSizes","m","$lineCount","lineHeight","secondary","disabled","useDefaultFocusRect","css","tertiary"],"mappings":"2CAUA,MAAMA,EAAiBC,EAAOC,QAA6B;YAC/C,EAAGC,aAAcA;sBACP,EAAGC,WAAYA,EAAMC,OAAOC;;YAEtC,EAAGF,QAAOG,eAAgB,SAASH,EAAMI,UAAUC,yBACzDF,EAAYH,EAAMC,OAAOK,UAAYN,EAAMC,OAAOM;WAC7C,EAAGP,WAAYA,EAAMC,OAAOO;;iBAEtB,EAAGR,WAAYA,EAAMS,WAAWC;eAClC,EAAGV,WAAYA,EAAMW,UAAUC;;;YAGlC,EAAGC,aAAYb,WACvB,QAAQA,EAAMS,WAAWK,gBAAgBD;;;;oBAIzB,EAAGb,WAAYA,EAAMC,OAAOc;;;oBAG5B,EAAGf,WAAYA,EAAMC,OAAOe;aACnC,EAAGhB,WAAYA,EAAMC,OAAOe;;;IAGrC,EAAGhB,WACFA,EAAMI,UAAUa,oBAOb,KANAC,CAAG;;;4BAGiBlB,EAAMC,OAAOkB;;;"}

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

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

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

@@ -1,2 +1,2 @@
-import{__rest as e,__assign as i}from"../../../node_modules/tslib/tslib.es6.js";import r,{forwardRef as t}from"react";import{useTheme as a}from"styled-components";import{crukTheme as l}from"../../themes/cruk.js";import{ErrorText as s}from"../ErrorText/index.js";import{LabelWrapper as o}from"../LabelWrapper/index.js";import{ExtraLeft as d,StyledInputWrapper as m,StyledInput as n,ExtraRight as h,Extra as b,ExtraWrapper as c}from"./styles.js";var x=t((function(t,x){var p=t.errorMessage,V=t.extraBottom,E=t.extraLeft,u=t.extraRight,f=t.extraTop,v=t.hasError,$=t.hintText,I=t.isValid,T=t.isValidVisible,g=t.isInvalidVisible,j=t.label,L=t.hideRequiredInLabel,q=e(t,["errorMessage","extraBottom","extraLeft","extraRight","extraTop","hasError","hintText","isValid","isValidVisible","isInvalidVisible","label","hideRequiredInLabel"]),R=a(),y=i(i({},l),R),B=r.createElement(r.Fragment,null,!!E&&r.createElement(d,{theme:y},E),r.createElement(m,{$hasError:v||!!p||!1,$isValid:void 0!==I?I:!v&&!p,"aria-invalid":v||!!p||!1,$isValidVisible:T||!1,$isInvalidVisible:g||!1,theme:y},r.createElement(n,i({$hasError:v||!!p||!1,$isValid:void 0!==I?I:!v&&!p,"aria-invalid":v||!!p||!1,"aria-describedby":q.id&&p?"".concat(q.id,"-error"):void 0,$isValidVisible:T||!1,$isInvalidVisible:g||!1},q,{theme:y,"data-hj-suppress":!0,ref:x}))),!!u&&r.createElement(h,{theme:y},u));return r.createElement(o,{label:j,hintText:$,required:q.required||!1,hideRequiredInLabel:L},!!f&&r.createElement(b,{theme:y},f),u||E?r.createElement(c,null,B):B,!!V&&r.createElement(b,{theme:y},V),!!p&&r.createElement(s,{marginTop:"xxs",id:q.id?"".concat(q.id,"-error"):void 0},p))}));export{x as TextField,x as default};
+import e,{forwardRef as r}from"react";import{useTheme as i}from"styled-components";import{crukTheme as t}from"../../themes/cruk.js";import{ErrorText as a}from"../ErrorText/index.js";import{LabelWrapper as l}from"../LabelWrapper/index.js";import{ExtraLeft as s,StyledInputWrapper as d,StyledInput as m,ExtraRight as o,Extra as n,ExtraWrapper as c}from"./styles.js";const h=r((({errorMessage:r,extraBottom:h,extraLeft:p,extraRight:E,extraTop:b,hasError:x,hintText:V,isValid:u,isValidVisible:$,isInvalidVisible:f,label:v,hideRequiredInLabel:T,...j},I)=>{const g=i(),q={...t,...g},y=e.createElement(e.Fragment,null,!!p&&e.createElement(s,{theme:q},p),e.createElement(d,{$hasError:x||!!r||!1,$isValid:void 0!==u?u:!x&&!r,"aria-invalid":x||!!r||!1,$isValidVisible:$||!1,$isInvalidVisible:f||!1,theme:q},e.createElement(m,{$hasError:x||!!r||!1,$isValid:void 0!==u?u:!x&&!r,"aria-invalid":x||!!r||!1,"aria-describedby":j.id&&r?`${j.id}-error`:void 0,$isValidVisible:$||!1,$isInvalidVisible:f||!1,...j,theme:q,"data-hj-suppress":!0,ref:I})),!!E&&e.createElement(o,{theme:q},E));return e.createElement(l,{label:v,hintText:V,required:j.required||!1,hideRequiredInLabel:T},!!b&&e.createElement(n,{theme:q},b),E||p?e.createElement(c,null,y):y,!!h&&e.createElement(n,{theme:q},h),!!r&&e.createElement(a,{marginTop:"xxs",id:j.id?`${j.id}-error`:void 0},r))}));h.displayName="TextField";export{h as TextField,h as default};
 //# sourceMappingURL=index.js.map

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  forwardRef,\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 (required) appearing in label, useful for compound form components like DateInput */\n  hideRequiredInLabel?: 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 = forwardRef(\n  (\n    {\n      errorMessage,\n      extraBottom,\n      extraLeft,\n      extraRight,\n      extraTop,\n      hasError,\n      hintText,\n      isValid,\n      isValidVisible,\n      isInvalidVisible,\n      label,\n      hideRequiredInLabel,\n      ...props\n    }: TextFieldProps,\n    ref?: Ref<HTMLInputElement>,\n  ) => {\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\"\n              ? isValid\n              : !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        hideRequiredInLabel={hideRequiredInLabel}\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);\n\nexport default TextField;\n"],"names":["TextField","forwardRef","_a","ref","errorMessage","extraBottom","extraLeft","extraRight","extraTop","hasError","hintText","isValid","isValidVisible","isInvalidVisible","label","hideRequiredInLabel","props","__rest","foundTheme","useTheme","theme","__assign","defaultTheme","renderContent","React","createElement","Fragment","ExtraLeft","StyledInputWrapper","$hasError","$isValid","$isValidVisible","$isInvalidVisible","StyledInput","id","undefined","ExtraRight","LabelWrapper","required","Extra","ExtraWrapper","ErrorText","marginTop","concat"],"mappings":"gcAqDaA,EAAYC,GACvB,SACEC,EAeAC,GAdE,IAAAC,EAAYF,EAAAE,aACZC,EAAWH,EAAAG,YACXC,EAASJ,EAAAI,UACTC,eACAC,aACAC,aACAC,EAAQR,EAAAQ,SACRC,EAAOT,EAAAS,QACPC,EAAcV,EAAAU,eACdC,EAAgBX,EAAAW,iBAChBC,EAAKZ,EAAAY,MACLC,EAAmBb,EAAAa,oBAChBC,EAAKC,EAAAf,EAbV,sKAiBMgB,EAAaC,IACbC,EACDC,EAAAA,EAAA,CAAA,EAAAC,GACAJ,GAGCK,EACJC,EAAAC,cAAAD,EAAAE,SAAA,OACKpB,GAAakB,EAACC,cAAAE,EAAU,CAAAP,MAAOA,GAAQd,GAC1CkB,EAAAC,cAACG,EAAkB,CAAAC,UACNpB,KAAcL,IAAgB,EAAK0B,cAEzB,IAAZnB,EACHA,GACCF,IAAaL,EAEN,eAAAK,KAAcL,IAAgB,EAAK2B,gBAChCnB,IAAkB,EAAKoB,kBACrBnB,IAAoB,EACvCO,MAAOA,GAEPI,EAAAC,cAACQ,EAAWZ,EAAA,CAAAQ,UACCpB,KAAcL,IAAgB,EAAK0B,cAEzB,IAAZnB,EACHA,GACCF,IAAaL,EAEN,eAAAK,KAAcL,IAAgB,EAAK,mBAE7CY,EAAMkB,IAAQ9B,EAAe,UAAGY,EAAMkB,GAAE,eAAWC,EAEtCJ,gBAAAnB,IAAkB,EAChBoB,kBAAAnB,IAAoB,GACnCG,EAAK,CACTI,MAAOA,EAAK,oBAAA,EAEZjB,IAAKA,QAGNI,GAAciB,EAAAC,cAACW,EAAW,CAAAhB,MAAOA,GAAQb,IAIhD,OACEiB,gBAACa,EAAY,CACXvB,MAAOA,EACPJ,SAAUA,EACV4B,SAAUtB,EAAMsB,WAAY,EAC5BvB,oBAAqBA,KAElBP,GAAYgB,EAACC,cAAAc,EAAM,CAAAnB,MAAOA,GAAQZ,GAClCD,GAAgBD,EACjBkB,gBAACgB,EAAY,KAAEjB,GAA6B,IAI3ClB,GAAemB,EAACC,cAAAc,EAAM,CAAAnB,MAAOA,GAAQf,KACrCD,GACDoB,gBAACiB,EAAS,CACRC,UAAU,MACVR,GAAIlB,EAAMkB,GAAK,GAAGS,OAAA3B,EAAMkB,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  forwardRef,\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 (required) appearing in label, useful for compound form components like DateInput */\n  hideRequiredInLabel?: 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 = forwardRef(\n  (\n    {\n      errorMessage,\n      extraBottom,\n      extraLeft,\n      extraRight,\n      extraTop,\n      hasError,\n      hintText,\n      isValid,\n      isValidVisible,\n      isInvalidVisible,\n      label,\n      hideRequiredInLabel,\n      ...props\n    }: TextFieldProps,\n    ref?: Ref<HTMLInputElement>,\n  ) => {\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\"\n              ? isValid\n              : !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        hideRequiredInLabel={hideRequiredInLabel}\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);\n\nTextField.displayName = \"TextField\";\n\nexport default TextField;\n"],"names":["TextField","forwardRef","errorMessage","extraBottom","extraLeft","extraRight","extraTop","hasError","hintText","isValid","isValidVisible","isInvalidVisible","label","hideRequiredInLabel","props","ref","foundTheme","useTheme","theme","defaultTheme","renderContent","React","createElement","Fragment","ExtraLeft","StyledInputWrapper","$hasError","$isValid","$isValidVisible","$isInvalidVisible","StyledInput","id","undefined","ExtraRight","LabelWrapper","required","Extra","ExtraWrapper","ErrorText","marginTop","displayName"],"mappings":"4WAqDa,MAAAA,EAAYC,GACvB,EAEIC,eACAC,cACAC,YACAC,aACAC,WACAC,WACAC,WACAC,UACAC,iBACAC,mBACAC,QACAC,yBACGC,GAELC,KAEA,MAAMC,EAAaC,IACbC,EAAQ,IACTC,KACAH,GAGCI,EACJC,EAAAC,cAAAD,EAAAE,SAAA,OACKnB,GAAaiB,EAACC,cAAAE,EAAU,CAAAN,MAAOA,GAAQd,GAC1CiB,EAAAC,cAACG,EAAkB,CAAAC,UACNnB,KAAcL,IAAgB,EAAKyB,cAEzB,IAAZlB,EACHA,GACCF,IAAaL,EAEN,eAAAK,KAAcL,IAAgB,EAAK0B,gBAChClB,IAAkB,EAAKmB,kBACrBlB,IAAoB,EACvCO,MAAOA,GAEPG,EAAAC,cAACQ,EAAW,CAAAJ,UACCnB,KAAcL,IAAgB,EAAKyB,cAEzB,IAAZlB,EACHA,GACCF,IAAaL,EAEN,eAAAK,KAAcL,IAAgB,EAAK,mBAE7CY,EAAMiB,IAAQ7B,EAAe,GAAGY,EAAMiB,gBAAaC,EAEtCJ,gBAAAlB,IAAkB,EAChBmB,kBAAAlB,IAAoB,KACnCG,EACJI,MAAOA,EAAK,oBAAA,EAEZH,IAAKA,OAGNV,GAAcgB,EAAAC,cAACW,EAAW,CAAAf,MAAOA,GAAQb,IAIhD,OACEgB,gBAACa,EAAY,CACXtB,MAAOA,EACPJ,SAAUA,EACV2B,SAAUrB,EAAMqB,WAAY,EAC5BtB,oBAAqBA,KAElBP,GAAYe,EAACC,cAAAc,EAAM,CAAAlB,MAAOA,GAAQZ,GAClCD,GAAgBD,EACjBiB,gBAACgB,EAAY,KAAEjB,GAA6B,IAI3CjB,GAAekB,EAACC,cAAAc,EAAM,CAAAlB,MAAOA,GAAQf,KACrCD,GACDmB,gBAACiB,EAAS,CACRC,UAAU,MACVR,GAAIjB,EAAMiB,GAAK,GAAGjB,EAAMiB,gBAAaC,GAEpC9B,GAGQ,IAKrBF,EAAUwC,YAAc"}

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

@@ -1,2 +1,111 @@
-import{__makeTemplateObject as n}from"../../../node_modules/tslib/tslib.es6.js";import o,{css as A}from"styled-components";var t,e,i,r,a,l,b,g,c,u,d,s="48px",m=o.span(t||(t=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)(e||(e=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 t=o.$isValid,e=o.$isInvalidVisible;return!t&&e&&A(a||(a=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(o){var t=o.$isValid,e=o.$isValidVisible;return t&&e&&A(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  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"])),(function(n){return n.theme.colors.backgroundLight}),(function(n){var o=n.$hasError,A=n.theme;return"solid ".concat(A.utilities.inputBorderWidth," ").concat(o?A.colors.textError:A.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 t=o.$isValidVisible,e=o.$isInvalidVisible;return(t||e)&&A(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 t=o.theme;return t.utilities.useDefaultFocusRect?null:A(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        "])),t.colors.tertiary,p,t.colors.tertiary)}),(function(o){var t=o.$hasError,e=o.theme;return t&&A(u||(u=n(["\n      ~ "," {\n        border-color: ",";\n      }\n    "],["\n      ~ "," {\n        border-color: ",";\n      }\n    "])),p,e.colors.textError)}));export{m as Extra,h as ExtraLeft,p as ExtraRight,Z as ExtraWrapper,C as StyledInput,W as StyledInputWrapper};
+import A,{css as o}from"styled-components";const e="48px",t=A.span`
+  box-sizing: border-box;
+  display: block;
+  background-color: ${({theme:A})=>A.colors.textInputExtraInfo};
+  color: ${({theme:A})=>A.colors.textDark};
+  font-size: ${({theme:A})=>A.fontSizes.m};
+  line-height: ${({theme:A})=>A.typography.lineHeight};
+  font-weight: ${({theme:A})=>A.typography.fontWeightLight};
+  padding: ${({theme:A})=>`calc((${e} - 1em ) / 2) ${A.spacing.xs}`};
+  margin: 0;
+  line-height: 1rem;
+  width: auto;
+`,i=A(t)`
+  box-sizing: border-box;
+  width: auto;
+  vertical-align: middle;
+  height: ${e};
+
+  button {
+    min-height: ${({theme:A})=>`calc(${e} - (2 * ${A.utilities.inputBorderWidth}))`} !important;
+  }
+`,l=A(t)`
+  box-sizing: border-box;
+  width: auto;
+  border: ${({theme:A})=>`solid ${A.utilities.inputBorderWidth} ${A.colors.textInputBorder}`};
+  transition: border-color 150ms linear;
+  border-left: 0;
+  background-color: transparent;
+  padding: 0;
+  height: ${e};
+  vertical-align: middle;
+
+  button {
+    min-height: ${({theme:A})=>`calc(${e} - (2 * ${A.utilities.inputBorderWidth}))`} !important;
+  }
+`,b=A.span`
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+`,g=A.span`
+  box-sizing: border-box;
+  position: relative;
+  display: block;
+  flex: 1 1;
+  &:after {
+    display: ${({$isValidVisible:A,$isInvalidVisible:o})=>o||A?"block":"none"};
+    position: absolute;
+    width: 2em;
+    z-index: 1;
+    bottom: 0;
+    right: 0;
+    content: "";
+    top: 0;
+    background-repeat: no-repeat;
+    background-position: ${({theme:A})=>`calc( 100% - ${A.spacing.xxs}) 50% `};
+    ${({$isValid:A,$isInvalidVisible:e})=>!A&&e&&o`
+        background-image: url("data:image/png;base64,${"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"}");
+      `}
+    ${({$isValid:A,$isValidVisible:e})=>A&&e&&o`
+        background-image: url("data:image/png;base64,${"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="}");
+      `}
+  }
+`,a=A.input`
+  box-sizing: border-box;
+  background-color: ${({theme:A})=>A.colors.backgroundLight};
+  background-image: none;
+  border: ${({$hasError:A,theme:o})=>`solid ${o.utilities.inputBorderWidth} ${A?o.colors.textError:o.colors.textInputBorder}`};
+  border-radius: 0;
+  color: ${({theme:A})=>A.colors.textDark};
+  display: block;
+  font-size: ${({theme:A})=>A.fontSizes.m};
+  line-height: ${({theme:A})=>A.typography.lineHeight};
+  min-width: 3em;
+  padding: ${({theme:A})=>`calc((${e} - (${A.utilities.inputBorderWidth} * 2) - ${A.typography.lineHeight} ) / 2) ${A.spacing.xs}`};
+
+  /* Make sure text doesn't go behind the valid indicatior icon */
+  ${({$isValidVisible:A,$isInvalidVisible:e})=>(A||e)&&o`
+      padding-right: 3rem;
+    `}
+
+  width: 100%;
+  transition: border-color 150ms linear;
+  &:hover {
+    border-color: ${({theme:A})=>A.colors.secondary};
+  }
+  &:disabled {
+    border-color: ${({theme:A})=>A.colors.disabled};
+    color: ${({theme:A})=>A.colors.disabled};
+  }
+
+  ${({theme:A})=>A.utilities.useDefaultFocusRect?null:o`
+          &:focus {
+            outline: 0;
+            border-color: ${A.colors.tertiary};
+            ~ ${l} {
+              border-color: ${A.colors.tertiary};
+            }
+          }
+        `};
+
+  ${({$hasError:A,theme:e})=>A&&o`
+      ~ ${l} {
+        border-color: ${e.colors.textError};
+      }
+    `}
+  &:-webkit-autofill,
+    &:-webkit-autofill:focus {
+    box-shadow: 0 0 0 3em white inset !important;
+  }
+`;export{t as Extra,i as ExtraLeft,l as ExtraRight,b as ExtraWrapper,a as StyledInput,g 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  \"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\";\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"],"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"],"mappings":"2HAIA,0BAAMA,EAAa,OAoBNC,EAAQC,EAAOC,KAAgBC,IAAAA,EAAAC,EAAA,CAAA,uEAAA,eAAA,mBAAA,qBAAA,qBAAA,iBAAA,2DAAA,CAAA,uEAGwB,eACrB,mBACA,qBACY,qBACK,iBAEN,8DANpC,SAACC,GAAc,OAAPA,EAAAC,MAAaC,OAAOC,kBAAb,IAC1B,SAACH,GAAc,OAAPA,EAAAC,MAAaC,OAAOE,QAAb,IACX,SAACJ,GAAc,OAAPA,EAAAC,MAAaI,UAAUC,CAAhB,IACb,SAACN,GAAc,OAAPA,EAAAC,MAAaM,WAAWC,UAAjB,IACf,SAACR,GAAc,OAAPA,EAAAC,MAAaM,WAAWE,eAAjB,IACnB,SAACT,GAAE,IAAAC,EAAKD,EAAAC,MACjB,MAAA,SAAAS,OAAShB,EAA2B,kBAAAgB,OAAAT,EAAMU,QAAQC,GAAlD,IAMSC,EAAYjB,EAAOD,EAAPC,CAAakB,IAAAA,EAAAf,EAAA,CAAA,qFAAA,oCAAA,uBAAA,CAAA,qFAIhB,oCAIiD,yBAJ3DL,GAGM,SAACM,GAAE,IAAAC,EAAKD,EAAAC,MACpB,MAAA,QAAAS,OAAQhB,EAAqB,YAAAgB,OAAAT,EAAMc,UAAUC,iBAAoB,KAAjE,IAIOC,EAAarB,EAAOD,EAAPC,CAAasB,IAAAA,EAAAnB,EAAA,CAAA,0DAAA,8HAAA,+DAAA,uBAAA,CAAY,0DAI4B,8HAKzD,+DAKiD,0BAX3D,SAACC,GAAE,IAAAC,EAAKD,EAAAC,MAChB,MAAA,SAASS,OAAAT,EAAMc,UAAUC,iBAAoB,KAAAN,OAAAT,EAAMC,OAAOiB,gBAA1D,GAKQzB,GAIM,SAACM,GAAE,IAAAC,EAAKD,EAAAC,MACpB,MAAA,QAAAS,OAAQhB,EAAqB,YAAAgB,OAAAT,EAAMc,UAAUC,iBAAoB,KAAjE,IAIOI,EAAexB,EAAOC,KAAIwB,IAAAA,EAAAtB,EAAA,CAAA,2EAAA,CAAA,8EAM1BuB,EAAqB1B,EAAOC,KAAsB0B,IAAAA,EAAAxB,EAAA,CAAA,kHAAA,2LAAA,UAAA,SAAA,WAAA,CAAA,kHAOE,2LAUlB,UAMxC,SAMA,cAvBQ,SAACC,OAAEwB,EAAexB,EAAAwB,gBAC3B,OAD8CxB,EAAAyB,mBACrBD,EAAkB,QAAU,MAArD,IASqB,SAACxB,GAAE,IAAAC,EAAKD,EAAAC,MAC7B,MAAA,uBAAgBA,EAAMU,QAAQe,IAAW,SAAzC,IACA,SAAC1B,OAAE2B,EAAQ3B,EAAA2B,SAAEF,EAAiBzB,EAAAyB,kBAC9B,OAACE,GACDF,GACAG,EAAGC,IAAAA,EAAA9B,EAAA,CAAA,0DAAA,eAAA,CAAA,0DACyD,iBA1FhE,2jLAuFI,IAKA,SAACC,OAAE2B,EAAQ3B,EAAA2B,SAAEH,EAAexB,EAAAwB,gBAC5B,OAAAG,GACAH,GACAI,EAAGE,IAAAA,EAAA/B,EAAA,CAAA,0DAAA,eAAA,CAAA,0DACyD,iBA7FhE,+7KA0FI,IAQOgC,EAAcnC,EAAOoC,MAAuBC,IAAAA,EAAAlC,EAAA,CAAA,oDAAA,2CAAA,oCAAA,sCAAA,qBAAA,oCAAA,8EAAA,gGAAA,6CAAA,iBAAA,eAAA,UAAA,qHAAA,CAAA,oDAEQ,2CAK3D,oCAEyC,sCAEA,qBACY,oCAGsE,8EAO5H,gGAKoD,6CAGD,iBACP,eAcrC,UAQP,wHAnDiB,SAACC,GAAc,OAAPA,EAAAC,MAAaC,OAAOgC,eAAb,IAEzB,SAAClC,OAAEmC,EAASnC,EAAAmC,UAAElC,EAAKD,EAAAC,MAC3B,MAAA,SAAAS,OAAST,EAAMc,UAAUC,iBACvB,KAAAN,OAAAyB,EAAYlC,EAAMC,OAAOkC,UAAYnC,EAAMC,OAAOiB,gBADpD,IAIO,SAACnB,GAAc,OAAPA,EAAAC,MAAaC,OAAOE,QAAb,IAEX,SAACJ,GAAc,OAAPA,EAAAC,MAAaI,UAAUC,CAAhB,IACb,SAACN,GAAc,OAAPA,EAAAC,MAAaM,WAAWC,UAAjB,IAEnB,SAACR,GAAE,IAAAC,EAAKD,EAAAC,MACjB,MAAA,SAAAS,OAAShB,EAAiB,QAAAgB,OAAAT,EAAMc,UAAUC,iBAA2B,YAAAN,OAAAT,EAAMM,WAAWC,WAAqB,YAAAE,OAAAT,EAAMU,QAAQC,GAAzH,IAGA,SAACZ,OAAEwB,EAAexB,EAAAwB,gBAAEC,EAAiBzB,EAAAyB,kBACrC,OAACD,GAAmBC,IACpBG,EAAGS,IAAAA,EAAAtC,EAAA,CAAA,sCAAA,CAAA,wCADH,IAQgB,SAACC,GAAc,OAAPA,EAAAC,MAAaC,OAAOoC,SAAb,IAGf,SAACtC,GAAc,OAAPA,EAAAC,MAAaC,OAAOqC,QAAb,IACtB,SAACvC,GAAc,OAAPA,EAAAC,MAAaC,OAAOqC,QAAb,IAGxB,SAACvC,GAAE,IAAAC,EAAKD,EAAAC,MACR,OAACA,EAAMc,UAAUyB,oBAUb,KATAZ,EAAGa,IAAAA,EAAA1C,EAAA,CAAA,6EAAA,oBAAA,mCAAA,2CAAA,CAAA,6EAGsC,oBACvB,mCACyB,6CAFvBE,EAAMC,OAAOwC,SACzBzB,EACchB,EAAMC,OAAOwC,SANvC,IAYA,SAAC1C,OAAEmC,EAASnC,EAAAmC,UAAElC,EAAKD,EAAAC,MACnB,OAAAkC,GACAP,EAAGe,IAAAA,EAAA5C,EAAA,CAAA,aAAA,6BAAA,oBAAA,CAAA,aACa,6BAC0B,sBADpCkB,EACchB,EAAMC,OAAOkC,UAHjC"}
+{"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  \"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\";\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"],"names":["MIN_HEIGHT","Extra","styled","span","theme","colors","textInputExtraInfo","textDark","fontSizes","m","typography","lineHeight","fontWeightLight","spacing","xs","ExtraLeft","utilities","inputBorderWidth","ExtraRight","textInputBorder","ExtraWrapper","StyledInputWrapper","$isValidVisible","$isInvalidVisible","xxs","$isValid","css","StyledInput","input","backgroundLight","$hasError","textError","secondary","disabled","useDefaultFocusRect","tertiary"],"mappings":"2CAIA,MAAMA,EAAa,OAoBNC,EAAQC,EAAOC,IAAgB;;;sBAGtB,EAAGC,WAAYA,EAAMC,OAAOC;WACvC,EAAGF,WAAYA,EAAMC,OAAOE;eACxB,EAAGH,WAAYA,EAAMI,UAAUC;iBAC7B,EAAGL,WAAYA,EAAMM,WAAWC;iBAChC,EAAGP,WAAYA,EAAMM,WAAWE;aACpC,EAAGR,WACZ,SAASJ,kBAA2BI,EAAMS,QAAQC;;;;EAMzCC,EAAYb,EAAOD,EAAM;;;;YAI1BD;;;kBAGM,EAAGI,WACf,QAAQJ,YAAqBI,EAAMY,UAAUC;;EAItCC,EAAahB,EAAOD,EAAkB;;;YAGvC,EAAGG,WACX,SAASA,EAAMY,UAAUC,oBAAoBb,EAAMC,OAAOc;;;;;YAKlDnB;;;;kBAIM,EAAGI,WACf,QAAQJ,YAAqBI,EAAMY,UAAUC;;EAItCG,EAAelB,EAAOC,IAAI;;;;EAM1BkB,EAAqBnB,EAAOC,IAAsB;;;;;;eAMhD,EAAGmB,kBAAiBC,uBAC3BA,GAAuBD,EAAkB,QAAU;;;;;;;;;2BAShC,EAAGlB,WACxB,gBAAgBA,EAAMS,QAAQW;MAC9B,EAAGC,WAAUF,wBACZE,GACDF,GACAG,CAAG;uDAzFP;;MA4FI,EAAGD,WAAUH,qBACbG,GACAH,GACAI,CAAG;uDA5FP;;;EAkGWC,EAAczB,EAAO0B,KAAuB;;sBAEnC,EAAGxB,WAAYA,EAAMC,OAAOwB;;YAEtC,EAAGC,YAAW1B,WACtB,SAASA,EAAMY,UAAUC,oBACvBa,EAAY1B,EAAMC,OAAO0B,UAAY3B,EAAMC,OAAOc;;WAG7C,EAAGf,WAAYA,EAAMC,OAAOE;;eAExB,EAAGH,WAAYA,EAAMI,UAAUC;iBAC7B,EAAGL,WAAYA,EAAMM,WAAWC;;aAEpC,EAAGP,WACZ,SAASJ,QAAiBI,EAAMY,UAAUC,2BAA2Bb,EAAMM,WAAWC,qBAAqBP,EAAMS,QAAQC;;;IAGzH,EAAGQ,kBAAiBC,wBACnBD,GAAmBC,IACpBG,CAAG;;;;;;;oBAOa,EAAGtB,WAAYA,EAAMC,OAAO2B;;;oBAG5B,EAAG5B,WAAYA,EAAMC,OAAO4B;aACnC,EAAG7B,WAAYA,EAAMC,OAAO4B;;;IAGrC,EAAG7B,WACFA,EAAMY,UAAUkB,oBAUb,KATAR,CAAG;;;4BAGiBtB,EAAMC,OAAO8B;gBACzBjB;8BACcd,EAAMC,OAAO8B;;;;;IAMvC,EAAGL,YAAW1B,WACd0B,GACAJ,CAAG;UACGR;wBACcd,EAAMC,OAAO0B;;;;;;;"}

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

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

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