@cruk/cruk-react-components 5.0.0 → 5.0.2

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

@@ -1,36 +1,32 @@
 import { type ThemeType } from "../../types";
-type ThemeProp = {
+export declare const ProgressBarWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
+export declare const LineProgressBarWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $percentage: number;
+    $secondaryPercentage: number;
+    theme: ThemeType;
+}>> & string;
+export declare const LineProgressBar: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $percentage: number;
+    $barColor?: string;
+    $isSecondary?: boolean;
     theme: ThemeType;
-};
-type LineProgressBarProps = {
-    percentage: number;
-    barColor?: string;
-    isSecondary?: boolean;
+}>> & string;
+export declare const ScreenReaderOnly: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
+export declare const CircularWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
+    $circleSize: string;
     theme: ThemeType;
-};
-type LineProgressWrapperProps = {
-    percentage: number;
-    secondaryPercentage: number;
+}>> & string;
+export declare const CircleSvg: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").SVGProps<SVGSVGElement>, never>> & string;
+export declare const EmptyCircle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").SVGProps<SVGCircleElement>, {
     theme: ThemeType;
-};
-type CircleProps = ThemeProp & {
-    strokeDashoffsetInit: number;
+}>> & string;
+export declare const FullCircle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").SVGProps<SVGCircleElement>, {
     strokeDashoffset: number;
-    barColor?: string;
-    isSecondary?: boolean;
     theme: ThemeType;
-};
-type CircleWrapperProps = {
-    circleSize: string;
+    $strokeDashoffsetInit: number;
+    $barColor?: string;
+    $isSecondary?: boolean;
+}>> & string;
+export declare const CircularValue: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
     theme: ThemeType;
-};
-export declare const ProgressBarWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-export declare const LineProgressBarWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, LineProgressWrapperProps>> & string;
-export declare const LineProgressBar: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, LineProgressBarProps>> & string;
-export declare const ScreenReaderOnly: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, never>> & string;
-export declare const CircularWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, CircleWrapperProps>> & string;
-export declare const CircleSvg: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").SVGProps<SVGSVGElement>, never>> & string;
-export declare const EmptyCircle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").SVGProps<SVGCircleElement>, ThemeProp>> & string;
-export declare const FullCircle: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").SVGProps<SVGCircleElement>, CircleProps>> & string;
-export declare const CircularValue: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, ThemeProp>> & string;
-export {};
+}>> & string;

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

@@ -1,21 +1,21 @@
 import { type ThemeType } from "../../types";
-type ThemeProp = {
+export declare const CheckWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
     theme: ThemeType;
-};
-export declare const CheckWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, ThemeProp>> & string;
-export declare const Check: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, ThemeProp>> & string;
-type StyledLabelProps = {
-    hasError: boolean;
-    disabled: boolean;
-    checked: boolean;
+}>> & string;
+export declare const Check: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {
+    theme: ThemeType;
+}>> & string;
+export declare const StyledLabel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, {
+    $hasError: boolean;
+    $disabled: boolean;
+    $checked: boolean;
+    theme: ThemeType;
+}>> & string;
+export declare const VerticalAlign: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {
     theme: ThemeType;
-};
-export declare const StyledLabel: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LabelHTMLAttributes<HTMLLabelElement>, HTMLLabelElement>, StyledLabelProps>> & string;
-export declare const VerticalAlign: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, ThemeProp>> & string;
+}>> & string;
 export declare const SelectedBorder: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-type StyledInputType = {
+export declare const StyledInput: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, {
     disabled: boolean;
     theme: ThemeType;
-};
-export declare const StyledInput: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, StyledInputType>> & string;
-export {};
+}>> & string;

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

@@ -1,13 +1,15 @@
 import { type ThemeType } from "../../types";
-type ThemeProp = {
+type StyleRadioWidthProp = {
+    $numberOfAttributes: number;
     theme: ThemeType;
 };
-type StyleRadioWidthProp = {
-    numberOfAttributes: number;
-} & ThemeProp;
 export declare const StyledRadio: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<Omit<Omit<import("../Radio").RadioProps, "ref"> & import("react").RefAttributes<HTMLInputElement>, "ref"> & {
     ref?: ((instance: HTMLInputElement | null) => void | import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES[keyof import("react").DO_NOT_USE_OR_YOU_WILL_BE_FIRED_CALLBACK_REF_RETURN_VALUES]) | import("react").RefObject<HTMLInputElement> | null | undefined;
 }, StyleRadioWidthProp>> & string & Omit<import("react").ForwardRefExoticComponent<Omit<import("../Radio").RadioProps, "ref"> & import("react").RefAttributes<HTMLInputElement>>, keyof import("react").Component<any, {}, any>>;
-export declare const StyledLegend: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLLegendElement>, HTMLLegendElement>, ThemeProp>> & string;
-export declare const StyledFieldSet: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").FieldsetHTMLAttributes<HTMLFieldSetElement>, HTMLFieldSetElement>, ThemeProp>> & string;
+export declare const StyledLegend: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLLegendElement>, HTMLLegendElement>, {
+    theme: ThemeType;
+}>> & string;
+export declare const StyledFieldSet: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").FieldsetHTMLAttributes<HTMLFieldSetElement>, HTMLFieldSetElement>, {
+    theme: ThemeType;
+}>> & string;
 export {};

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

@@ -1,7 +1,7 @@
 import { type ThemeType } from "../../types";
 type StyledSelectProps = {
-    hasError: boolean;
-    errorMessage?: string;
+    $hasError: boolean;
+    $errorMessage?: string;
     theme: ThemeType;
 };
 declare const StyledSelect: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").SelectHTMLAttributes<HTMLSelectElement>, HTMLSelectElement>, StyledSelectProps>> & string;

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

@@ -15,5 +15,54 @@ export type SpacingProps = {
     paddingVertical?: SpaceType;
     paddingHorizontal?: SpaceType;
 };
-export declare function Spacing(props: SpacingProps, theme: ThemeType): string;
-export default Spacing;
+interface SpacingPropsInterface {
+    margin?: SpaceType;
+    marginTop?: SpaceType;
+    marginRight?: SpaceType;
+    marginBottom?: SpaceType;
+    marginLeft?: SpaceType;
+    marginVertical?: SpaceType;
+    marginHorizontal?: SpaceType;
+    padding?: SpaceType;
+    paddingTop?: SpaceType;
+    paddingRight?: SpaceType;
+    paddingBottom?: SpaceType;
+    paddingLeft?: SpaceType;
+    paddingVertical?: SpaceType;
+    paddingHorizontal?: SpaceType;
+}
+export type SpacingPropsInternal = {
+    $margin?: SpaceType;
+    $marginTop?: SpaceType;
+    $marginRight?: SpaceType;
+    $marginBottom?: SpaceType;
+    $marginLeft?: SpaceType;
+    $marginVertical?: SpaceType;
+    $marginHorizontal?: SpaceType;
+    $padding?: SpaceType;
+    $paddingTop?: SpaceType;
+    $paddingRight?: SpaceType;
+    $paddingBottom?: SpaceType;
+    $paddingLeft?: SpaceType;
+    $paddingVertical?: SpaceType;
+    $paddingHorizontal?: SpaceType;
+};
+interface SpacingPropsInternalInterface {
+    $margin?: SpaceType;
+    $marginTop?: SpaceType;
+    $marginRight?: SpaceType;
+    $marginBottom?: SpaceType;
+    $marginLeft?: SpaceType;
+    $marginVertical?: SpaceType;
+    $marginHorizontal?: SpaceType;
+    $padding?: SpaceType;
+    $paddingTop?: SpaceType;
+    $paddingRight?: SpaceType;
+    $paddingBottom?: SpaceType;
+    $paddingLeft?: SpaceType;
+    $paddingVertical?: SpaceType;
+    $paddingHorizontal?: SpaceType;
+}
+export declare function spacingPropsToSpacingPropsInternal(props: SpacingPropsInterface): SpacingPropsInternalInterface;
+export declare function spacing(props: SpacingPropsInternal, theme: ThemeType): string;
+export default spacing;

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

@@ -1,18 +1,16 @@
 import { type ThemeType } from "../../types";
 export declare const StepWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
-type StepListProps = {
-    total: number;
-};
-type ThemeProps = {
+export declare const StepList: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, {
+    $total: number;
+}>> & string;
+export declare const StepBar: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {
     theme: ThemeType;
-};
-export declare const StepList: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLUListElement>, HTMLUListElement>, StepListProps>> & string;
-export declare const StepBar: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, ThemeProps>> & string;
-export declare const StepTick: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, ThemeProps>> & string;
-type StepItemProps = {
-    active: boolean;
-    done: boolean;
+}>> & string;
+export declare const StepTick: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {
     theme: ThemeType;
-};
-export declare const StepItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, StepItemProps>> & string;
-export {};
+}>> & string;
+export declare const StepItem: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, {
+    $active: boolean;
+    $done: boolean;
+    theme: ThemeType;
+}>> & string;

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

@@ -1,15 +1,15 @@
 import { type ElementType } from "react";
-import { type SpacingProps } from "../Spacing";
-import { type WordBreakType, type FontSizeType, type ThemeType, type ColorKeyType, type OverflowWrapType } from "../../types";
-export type TextStyledProps = SpacingProps & {
-    textColor?: ColorKeyType;
-    textAlign?: "left" | "right" | "center" | "justify";
-    textSize?: FontSizeType;
-    textWeight?: number;
+import { type SpacingPropsInternal } from "../Spacing";
+import { type WordBreakType, type FontSizeType, type ThemeType, type OverflowWrapType } from "../../types";
+export type TextStyledProps = SpacingPropsInternal & {
+    $textColor?: string;
+    $textAlign?: "left" | "right" | "center" | "justify";
+    $textSize?: FontSizeType;
+    $textWeight?: number | string;
     as?: ElementType;
-    wordBreak?: WordBreakType;
-    overflowWrap?: OverflowWrapType;
-    textFontFamily?: string;
+    $wordBreak?: WordBreakType;
+    $overflowWrap?: OverflowWrapType;
+    $textFontFamily?: string;
     theme: ThemeType;
 };
 export declare const TextStyled: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLParagraphElement>, HTMLParagraphElement>, TextStyledProps>> & string;

package/lib/components/TextAreaField/TextAreaField.stories.d.ts

@@ -6,7 +6,6 @@ declare const _default: {
     component: React.ForwardRefExoticComponent<Omit<import(".").TextAreaFieldProps, "ref"> & React.RefAttributes<HTMLTextAreaElement>>;
     args: {
         defaultValue: string;
-        textColor: string;
         disabled: boolean;
         required: boolean;
         label: string;

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

@@ -1,8 +1,8 @@
 import { type ThemeType } from "../../types";
 type StyledTextareaProps = {
-    hasError: boolean;
-    resize: "both" | "vertical" | "horizontal" | "none";
-    lineCount: number;
+    $hasError: boolean;
+    $lineCount: number;
+    $resize: "both" | "vertical" | "horizontal" | "none";
     theme: ThemeType;
 };
 declare const StyledTextArea: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, StyledTextareaProps>> & string;

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

@@ -3,11 +3,11 @@ type ExtraProps = {
     theme: ThemeType;
 };
 type StyledInputProps = {
-    hasError: boolean;
-    isValid: boolean;
+    $hasError: boolean;
+    $isValid: boolean;
     theme: ThemeType;
-    isValidVisible?: boolean;
-    isInvalidVisible?: boolean;
+    $isValidVisible?: boolean;
+    $isInvalidVisible?: boolean;
 };
 export declare const Extra: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, ExtraProps>> & string;
 export declare const ExtraLeft: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<Omit<import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "theme"> & ExtraProps, "ref"> & {

package/lib/components/ThemeCheatSheet.d.ts

@@ -1,8 +1,7 @@
 import React from "react";
 import { type ThemeType } from "../types";
-type Props = {
+export declare function ThemeCheatSheet({ theme }: {
     theme?: ThemeType;
-};
-export declare function ThemeCheatSheet({ theme }: Props): React.JSX.Element;
+}): React.JSX.Element;
 declare const _default: React.ForwardRefExoticComponent<import("styled-components").ExecutionProps & React.RefAttributes<typeof ThemeCheatSheet>> & {};
 export default _default;

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

@@ -1,4 +1,4 @@
-import React, { type ReactChild, type ReactNode } from "react";
+import React, { type ReactNode } from "react";
 export type TotaliserProps = {
     /** financial total as a number */
     total: number;
@@ -11,7 +11,7 @@ export type TotaliserProps = {
     /** flag for low height compact appearance */
     isCompact?: boolean;
     /** component for custom summary message underneath total graph only visible if there is a target */
-    summaryMessage?: ReactChild;
+    summaryMessage?: ReactNode;
     /** component children */
     children?: ReactNode;
 };

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

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

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

@@ -1,2 +1,2 @@
-import{__rest as e,__assign as t}from"../../../node_modules/tslib/tslib.es6.js";import n,{forwardRef as r,useState as o,useRef as s,useCallback as a,useEffect as i}from"react";import{useTheme as l}from"styled-components";import{faChevronRight as c}from"../../../node_modules/@fortawesome/free-solid-svg-icons/index.js";import{useKey as d}from"../../hooks/useKey.js";import{debounce as u}from"../../utils/debounce.js";import{removeCommasFromObjectStringValues as m}from"../../utils/Helper.js";import{Text as f}from"../Text/index.js";import{TextField as p}from"../TextField/index.js";import{IconFa as h}from"../IconFa/index.js";import{crukTheme as g}from"../../themes/cruk.js";import{ScreenReaderOnly as v,ListWrapper as y,List as E,ListItem as w}from"./styles.js";var b=r((function(r,b){var x=r.apiKey,j=r.countries,I=r.errorMessage,T=r.hasError,V=r.isValid,k=r.isValidVisible,A=r.isInvalidVisible,C=r.label,K=r.hintText,D=r.onAddressError,F=void 0===D?function(e){console.log(e)}:D,S=r.onAddressSelected,M=r.onChange,_=r.onBlur,B=e(r,["apiKey","countries","errorMessage","hasError","isValid","isValidVisible","isInvalidVisible","label","hintText","onAddressError","onAddressSelected","onChange","onBlur"]),H=o([]),L=H[0],O=H[1],U=o(-1),q=U[0],R=U[1],W=s(null),z=l(),G=t(t({},g),z),J=function(){R(-1),O([])},N=a(u(500,(function(e){return P(e)})),[]),P=function(e,t){if(void 0===t&&(t=""),0===e.length)return O([]);var n="".concat("https://api.addressy.com/Capture/Interactive/Find/v1.1/json3.ws","?Key=").concat(x,"&Text=").concat(e,"&Container=").concat(t);return void 0!==j&&(n="".concat(n,"&Countries=").concat(j.join(","))),fetch(n).then((function(e){if(!e.ok)throw new Error("Something went wrong please try again");return e.json()})).then((function(e){if(e.Items[0].Error)throw new Error("Something went wrong please try again");return O(e.Items||[]),null})).catch((function(e){return F(e)})),null},Q=function(e){fetch("".concat("https://api.addressy.com/Capture/Interactive/Retrieve/v1/json3.ws","?Key=").concat(x,"&Id=").concat(e)).then((function(e){if(!e.ok)throw new Error("Something went wrong please try again");return e.json()})).then((function(e){var t=e.Items[0],n=m(t);return S(n),J(),null})).catch((function(e){return F(e)}))},X=function(e){return"Address"===e.Type?Q(e.Id):(P(e.Text,e.Id),null)},Y=function(e){W.current&&e.target instanceof HTMLElement&&!W.current.contains(e.target)&&J()};return i((function(){return document.addEventListener("mousedown",Y),function(){document.removeEventListener("mousedown",Y)}})),d((function(){J()}),{detectKeys:["Escape","Tab"]},[]),n.createElement(n.Fragment,null,n.createElement(p,t({"aria-activedescendant":L.length?"addressOptions-".concat(q):"","aria-owns":"found_addresses","aria-autocomplete":"both","aria-expanded":L.length?"true":"false",autoComplete:"off",hasError:T||!!I,errorMessage:I,hintText:null!=K?K:"Start typing your address or postcode",isValid:V,isValidVisible:k,isInvalidVisible:A,label:null!=C?C:"Home address",ref:b,required:!0,role:"combobox",type:"search"},B,{onKeyDown:function(e){"Enter"===e.key&&L[q]?(e.preventDefault(),"Address"===L[q].Type&&Q(L[q].Id),P(L[q].Text,L[q].Id),R(-1)):"ArrowUp"===e.key?(e.preventDefault(),q<=-1&&R(L.length-1),R(q-1)):"ArrowDown"===e.key?(e.preventDefault(),q+1>=L.length&&R(0),R(q+1)):R(-1)},onChange:function(e){N(e.target.value),M&&M(e)},onBlur:function(e){var t=!!L.length;_&&!t&&_(e)}})),!!L.length&&n.createElement(n.Fragment,null,n.createElement(v,{role:"status","aria-live":"assertive"},!!L.length&&"We have found ".concat(L.length," result").concat(1!==L.length?"s":""," matching your search. Use up and down arrow keys to navigate")),n.createElement(y,{ref:W},n.createElement(E,{"aria-label":"found addresses",id:"found_addresses",role:"listbox",theme:G},L.map((function(e,t){return n.createElement(w,{tabIndex:0,id:"addressOptions-".concat(t),isActive:t===q,key:e.Id,onClick:function(){X(e)},onKeyDown:function(t){"Enter"===t.key&&X(e)},role:"option","data-hj-suppress":!0,theme:G},n.createElement(f,{as:"span","data-hj-suppress":!0},e.Text," ",e.Description),"Address"!==e.Type&&n.createElement(n.Fragment,null,n.createElement(v,null,"press enter for these addresses"),n.createElement(h,{faIcon:c})))}))))))}));export{b as AddressLookup,b as default};
+import{__rest as e,__assign as t}from"../../../node_modules/tslib/tslib.es6.js";import n,{forwardRef as r,useState as o,useRef as s,useCallback as a,useEffect as i}from"react";import{useTheme as l}from"styled-components";import{faChevronRight as c}from"../../../node_modules/@fortawesome/free-solid-svg-icons/index.js";import{useKey as d}from"../../hooks/useKey.js";import{debounce as u}from"../../utils/debounce.js";import{removeCommasFromObjectStringValues as m}from"../../utils/Helper.js";import{Text as f}from"../Text/index.js";import{TextField as p}from"../TextField/index.js";import{IconFa as h}from"../IconFa/index.js";import{crukTheme as g}from"../../themes/cruk.js";import{ScreenReaderOnly as v,ListWrapper as y,List as E,ListItem as w}from"./styles.js";var b=r((function(r,b){var x=r.apiKey,j=r.countries,I=r.errorMessage,T=r.hasError,V=r.isValid,k=r.isValidVisible,A=r.isInvalidVisible,C=r.label,K=r.hintText,D=r.onAddressError,F=void 0===D?function(e){console.log(e)}:D,S=r.onAddressSelected,M=r.onChange,_=r.onBlur,B=e(r,["apiKey","countries","errorMessage","hasError","isValid","isValidVisible","isInvalidVisible","label","hintText","onAddressError","onAddressSelected","onChange","onBlur"]),H=o([]),L=H[0],O=H[1],U=o(-1),q=U[0],R=U[1],W=s(null),$=l(),z=t(t({},g),$),G=function(){R(-1),O([])},J=a(u(500,(function(e){return N(e)})),[]),N=function(e,t){if(void 0===t&&(t=""),0===e.length)return O([]);var n="".concat("https://api.addressy.com/Capture/Interactive/Find/v1.1/json3.ws","?Key=").concat(x,"&Text=").concat(e,"&Container=").concat(t);return void 0!==j&&(n="".concat(n,"&Countries=").concat(j.join(","))),fetch(n).then((function(e){if(!e.ok)throw new Error("Something went wrong please try again");return e.json()})).then((function(e){if(e.Items[0].Error)throw new Error("Something went wrong please try again");return O(e.Items||[]),null})).catch((function(e){return F(e)})),null},P=function(e){fetch("".concat("https://api.addressy.com/Capture/Interactive/Retrieve/v1/json3.ws","?Key=").concat(x,"&Id=").concat(e)).then((function(e){if(!e.ok)throw new Error("Something went wrong please try again");return e.json()})).then((function(e){var t=e.Items[0],n=m(t);return S(n),G(),null})).catch((function(e){return F(e)}))},Q=function(e){return"Address"===e.Type?P(e.Id):(N(e.Text,e.Id),null)},X=function(e){W.current&&e.target instanceof HTMLElement&&!W.current.contains(e.target)&&G()};return i((function(){return document.addEventListener("mousedown",X),function(){document.removeEventListener("mousedown",X)}})),d((function(){G()}),{detectKeys:["Escape","Tab"]},[]),n.createElement(n.Fragment,null,n.createElement(p,t({"aria-activedescendant":L.length?"addressOptions-".concat(q):"","aria-owns":"found_addresses","aria-autocomplete":"both","aria-expanded":L.length?"true":"false",autoComplete:"off",hasError:T||!!I,errorMessage:I,hintText:null!=K?K:"Start typing your address or postcode",isValid:V,isValidVisible:k,isInvalidVisible:A,label:null!=C?C:"Home address",ref:b,required:!0,role:"combobox",type:"search"},B,{onKeyDown:function(e){"Enter"===e.key&&L[q]?(e.preventDefault(),"Address"===L[q].Type&&P(L[q].Id),N(L[q].Text,L[q].Id),R(-1)):"ArrowUp"===e.key?(e.preventDefault(),q<=-1&&R(L.length-1),R(q-1)):"ArrowDown"===e.key?(e.preventDefault(),q+1>=L.length&&R(0),R(q+1)):R(-1)},onChange:function(e){J(e.target.value),M&&M(e)},onBlur:function(e){var t=!!L.length;_&&!t&&_(e)}})),!!L.length&&n.createElement(n.Fragment,null,n.createElement(v,{role:"status","aria-live":"assertive"},!!L.length&&"We have found ".concat(L.length," result").concat(1!==L.length?"s":""," matching your search. Use up and down arrow keys to navigate")),n.createElement(y,{ref:W},n.createElement(E,{"aria-label":"found addresses",id:"found_addresses",role:"listbox",theme:z},L.map((function(e,t){return n.createElement(w,{tabIndex:0,id:"addressOptions-".concat(t),$isActive:t===q,key:e.Id,onClick:function(){Q(e)},onKeyDown:function(t){"Enter"===t.key&&Q(e)},role:"option","data-hj-suppress":!0,theme:z},n.createElement(f,{as:"span","data-hj-suppress":!0},e.Text," ",e.Description),"Address"!==e.Type&&n.createElement(n.Fragment,null,n.createElement(v,null,"press enter for these addresses"),n.createElement(h,{faIcon:c})))}))))))}));export{b as AddressLookup,b as default};
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/AddressLookup/index.tsx"],"sourcesContent":["import React, {\n  type InputHTMLAttributes,\n  useCallback,\n  useEffect,\n  type Ref,\n  useRef,\n  forwardRef,\n  type FocusEvent,\n  type ChangeEvent,\n  type KeyboardEvent,\n  useState,\n  type ReactNode,\n} from \"react\";\nimport { useTheme } from \"styled-components\";\nimport { faChevronRight } from \"@fortawesome/free-solid-svg-icons\";\n\nimport { type AddressDataType, type AddressOptionsType } from \"../../types\";\nimport { useKey } from \"../../hooks/useKey\";\n\nimport { debounce } from \"../../utils/debounce\";\nimport { removeCommasFromObjectStringValues } from \"../../utils/Helper\";\nimport { Text } from \"../Text\";\nimport { TextField } from \"../TextField\";\nimport { IconFa } from \"../IconFa\";\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\n\nimport { ListWrapper, ListItem, ScreenReaderOnly, List } from \"./styles\";\n\nconst FIND_URL =\n  \"https://api.addressy.com/Capture/Interactive/Find/v1.1/json3.ws\";\nconst RETRIEVE_URL =\n  \"https://api.addressy.com/Capture/Interactive/Retrieve/v1/json3.ws\";\n\nexport type AddressLookupProps = InputHTMLAttributes<HTMLInputElement> & {\n  /** api key for loqate */\n  apiKey: string;\n  /** list of countries codes you want the address look up to search within */\n  countries?: string[];\n  /** callback function which is passed the selected address data */\n  onAddressSelected: (address: AddressDataType) => void;\n  /** error message */\n  errorMessage?: string;\n  /** when true a input has a red border */\n  hasError?: boolean;\n  /** flag which effects the check or cross icons to the right of the input */\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  /** label text */\n  label?: string;\n  /** hint text text */\n  hintText?: ReactNode;\n  /** callback function which is passed the error */\n  onAddressError?: (error: Error) => void;\n  /** onBlur handler */\n  onBlur?: (e: FocusEvent<HTMLInputElement>) => void;\n  /** attach a DOM reference variable to your component */\n  ref?: Ref<HTMLInputElement>;\n};\n\n/**\n * This component creates a combobox for a user to type in a post code or partial address and be presented with a of verified addresses.\n * We use Loqate (formerly Addressy and Postcode Anywhere) API v3, we have looked at v4 but it is more expensive without many benefits for our use case.\n * You will need a Loqate api key, the examples below use \"MG17-ZD93-FF33-KF13\" our development key.\n * This component is generally only used for country codes including \"GBR\", \"GGY\", \"IMN\", \"JEY\". An example of this behavior is included bellow.\n */\nexport const AddressLookup = forwardRef(\n  (\n    {\n      apiKey,\n      countries,\n      errorMessage,\n      hasError,\n      isValid,\n      isValidVisible,\n      isInvalidVisible,\n      label,\n      hintText,\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n      onAddressError = (error: Error) => {\n        console.log(error);\n      },\n      onAddressSelected,\n      onChange,\n      onBlur,\n      ...props\n    }: AddressLookupProps,\n    ref?: Ref<HTMLInputElement>,\n  ) => {\n    const [addressOptions, setAddressOptions] = useState<AddressOptionsType[]>(\n      [],\n    );\n    const [activeOption, setActiveOption] = useState(-1);\n    const wrapperRef = useRef<HTMLDivElement>(null);\n    const foundTheme = useTheme();\n    const theme = {\n      ...defaultTheme,\n      ...foundTheme,\n    };\n\n    const clearOptions = () => {\n      setActiveOption(-1);\n      setAddressOptions([]);\n    };\n\n    const searchDebounced = useCallback(\n      debounce(500, (query: string) => search(query)),\n      [],\n    );\n\n    const search = (query: string, id = \"\") => {\n      if (query.length === 0) return setAddressOptions([]);\n      let searchUrl = `${FIND_URL}?Key=${apiKey}&Text=${query}&Container=${id}`;\n      if (countries !== undefined) {\n        searchUrl = `${searchUrl}&Countries=${countries.join(\",\")}`;\n      }\n      fetch(searchUrl)\n        .then((res: Response) => {\n          if (!res.ok) throw new Error(\"Something went wrong please try again\");\n          return res.json();\n        })\n        .then((data: { Items: AddressOptionsType[] }) => {\n          // Occasionally get the error \"The query didn't respond fast enough, it may be too complex.\"\n          // returned with a 200 response. Example query \"n17 6t\"\n          if (data.Items[0].Error)\n            throw new Error(\"Something went wrong please try again\");\n          setAddressOptions(data.Items || []);\n          return null;\n        })\n        .catch((err) => onAddressError(err as Error));\n      return null;\n    };\n\n    const getAddress = (id: string) => {\n      fetch(`${RETRIEVE_URL}?Key=${apiKey}&Id=${id}`)\n        .then((res: Response) => {\n          if (!res.ok) throw new Error(\"Something went wrong please try again\");\n          return res.json();\n        })\n        .then((data: { Items: AddressDataType[] }) => {\n          const selectedAddress = data.Items[0];\n          const selectedAddressWithoutCommas =\n            removeCommasFromObjectStringValues<AddressDataType>(\n              selectedAddress,\n            );\n          onAddressSelected(selectedAddressWithoutCommas);\n          clearOptions();\n          return null;\n        })\n        .catch((err) => onAddressError(err as Error));\n    };\n\n    const selectAddress = (address: AddressOptionsType) => {\n      if (address.Type === \"Address\") return getAddress(address.Id);\n      search(address.Text, address.Id);\n      return null;\n    };\n\n    const handleKeyDown = (e: KeyboardEvent<HTMLInputElement>): void => {\n      if (e.key === \"Enter\" && addressOptions[activeOption]) {\n        e.preventDefault();\n        if (addressOptions[activeOption].Type === \"Address\")\n          getAddress(addressOptions[activeOption].Id);\n        search(\n          addressOptions[activeOption].Text,\n          addressOptions[activeOption].Id,\n        );\n        setActiveOption(-1);\n      } else if (e.key === \"ArrowUp\") {\n        e.preventDefault();\n        if (activeOption <= -1) setActiveOption(addressOptions.length - 1);\n        setActiveOption(activeOption - 1);\n      } else if (e.key === \"ArrowDown\") {\n        e.preventDefault();\n        if (activeOption + 1 >= addressOptions.length) setActiveOption(0);\n        setActiveOption(activeOption + 1);\n      } else {\n        setActiveOption(-1);\n      }\n    };\n\n    const handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n      searchDebounced(e.target.value);\n      if (onChange) onChange(e);\n    };\n\n    const handleBlur = (e: FocusEvent<HTMLInputElement>) => {\n      const isOptionsOpen = !!addressOptions.length;\n      if (onBlur && !isOptionsOpen) onBlur(e);\n    };\n\n    const handleClickOutside = (event: MouseEvent) => {\n      if (\n        wrapperRef.current &&\n        event.target instanceof HTMLElement &&\n        !wrapperRef.current.contains(event.target)\n      )\n        clearOptions();\n    };\n\n    useEffect(() => {\n      document.addEventListener(\"mousedown\", handleClickOutside);\n      return () => {\n        document.removeEventListener(\"mousedown\", handleClickOutside);\n      };\n    });\n\n    useKey(\n      () => {\n        clearOptions();\n      },\n      {\n        detectKeys: [\"Escape\", \"Tab\"],\n      },\n      [],\n    );\n\n    return (\n      <>\n        <TextField\n          aria-activedescendant={\n            addressOptions.length ? `addressOptions-${activeOption}` : \"\"\n          }\n          aria-owns=\"found_addresses\"\n          aria-autocomplete=\"both\"\n          aria-expanded={addressOptions.length ? \"true\" : \"false\"}\n          autoComplete=\"off\"\n          hasError={hasError || !!errorMessage}\n          errorMessage={errorMessage}\n          hintText={hintText ?? \"Start typing your address or postcode\"}\n          isValid={isValid}\n          isValidVisible={isValidVisible}\n          isInvalidVisible={isInvalidVisible}\n          label={label ?? \"Home address\"}\n          ref={ref}\n          required\n          role=\"combobox\"\n          type=\"search\"\n          {...props}\n          onKeyDown={handleKeyDown}\n          onChange={handleChange}\n          onBlur={handleBlur}\n        />\n\n        {!!addressOptions.length && (\n          <>\n            <ScreenReaderOnly role=\"status\" aria-live=\"assertive\">\n              {!!addressOptions.length &&\n                `We have found ${addressOptions.length} result${\n                  addressOptions.length !== 1 ? \"s\" : \"\"\n                } matching your search. Use up and down arrow keys to navigate`}\n            </ScreenReaderOnly>\n            <ListWrapper ref={wrapperRef}>\n              <List\n                aria-label=\"found addresses\"\n                id=\"found_addresses\"\n                role=\"listbox\"\n                theme={theme}\n              >\n                {addressOptions.map((address, index) => (\n                  <ListItem\n                    tabIndex={0}\n                    id={`addressOptions-${index}`}\n                    isActive={index === activeOption}\n                    key={address.Id}\n                    onClick={() => {\n                      selectAddress(address);\n                    }}\n                    onKeyDown={(e) => {\n                      if (e.key === \"Enter\") {\n                        selectAddress(address);\n                      }\n                    }}\n                    role=\"option\"\n                    data-hj-suppress\n                    theme={theme}\n                  >\n                    <Text as=\"span\" data-hj-suppress>\n                      {address.Text} {address.Description}\n                    </Text>\n                    {address.Type !== \"Address\" && (\n                      <>\n                        <ScreenReaderOnly>\n                          press enter for these addresses\n                        </ScreenReaderOnly>\n                        <IconFa faIcon={faChevronRight} />\n                      </>\n                    )}\n                  </ListItem>\n                ))}\n              </List>\n            </ListWrapper>\n          </>\n        )}\n      </>\n    );\n  },\n);\n\nexport default AddressLookup;\n"],"names":["AddressLookup","forwardRef","_a","ref","apiKey","countries","errorMessage","hasError","isValid","isValidVisible","isInvalidVisible","label","hintText","_b","onAddressError","error","console","log","onAddressSelected","onChange","onBlur","props","__rest","_c","useState","addressOptions","setAddressOptions","_d","activeOption","setActiveOption","wrapperRef","useRef","foundTheme","useTheme","theme","__assign","defaultTheme","clearOptions","searchDebounced","useCallback","debounce","query","search","id","length","searchUrl","concat","undefined","join","fetch","then","res","ok","Error","json","data","Items","catch","err","getAddress","selectedAddress","selectedAddressWithoutCommas","removeCommasFromObjectStringValues","selectAddress","address","Type","Id","Text","handleClickOutside","event","current","target","HTMLElement","contains","useEffect","document","addEventListener","removeEventListener","useKey","detectKeys","React","createElement","Fragment","TextField","autoComplete","required","role","type","onKeyDown","e","key","preventDefault","value","isOptionsOpen","ScreenReaderOnly","ListWrapper","List","map","index","ListItem","tabIndex","isActive","onClick","as","Description","IconFa","faIcon","faChevronRight"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/AddressLookup/index.tsx"],"sourcesContent":["import React, {\n  type InputHTMLAttributes,\n  useCallback,\n  useEffect,\n  type Ref,\n  useRef,\n  forwardRef,\n  type FocusEvent,\n  type ChangeEvent,\n  type KeyboardEvent,\n  useState,\n  type ReactNode,\n} from \"react\";\nimport { useTheme } from \"styled-components\";\nimport { faChevronRight } from \"@fortawesome/free-solid-svg-icons\";\n\nimport { type AddressDataType, type AddressOptionsType } from \"../../types\";\nimport { useKey } from \"../../hooks/useKey\";\n\nimport { debounce } from \"../../utils/debounce\";\nimport { removeCommasFromObjectStringValues } from \"../../utils/Helper\";\nimport { Text } from \"../Text\";\nimport { TextField } from \"../TextField\";\nimport { IconFa } from \"../IconFa\";\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\n\nimport { ListWrapper, ListItem, ScreenReaderOnly, List } from \"./styles\";\n\nconst FIND_URL =\n  \"https://api.addressy.com/Capture/Interactive/Find/v1.1/json3.ws\";\nconst RETRIEVE_URL =\n  \"https://api.addressy.com/Capture/Interactive/Retrieve/v1/json3.ws\";\n\nexport type AddressLookupProps = InputHTMLAttributes<HTMLInputElement> & {\n  /** api key for loqate */\n  apiKey: string;\n  /** list of countries codes you want the address look up to search within */\n  countries?: string[];\n  /** callback function which is passed the selected address data */\n  onAddressSelected: (address: AddressDataType) => void;\n  /** error message */\n  errorMessage?: string;\n  /** when true a input has a red border */\n  hasError?: boolean;\n  /** flag which effects the check or cross icons to the right of the input */\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  /** label text */\n  label?: string;\n  /** hint text text */\n  hintText?: ReactNode;\n  /** callback function which is passed the error */\n  onAddressError?: (error: Error) => void;\n  /** onBlur handler */\n  onBlur?: (e: FocusEvent<HTMLInputElement>) => void;\n  /** attach a DOM reference variable to your component */\n  ref?: Ref<HTMLInputElement>;\n};\n\n/**\n * This component creates a combobox for a user to type in a post code or partial address and be presented with a of verified addresses.\n * We use Loqate (formerly Addressy and Postcode Anywhere) API v3, we have looked at v4 but it is more expensive without many benefits for our use case.\n * You will need a Loqate api key, the examples below use \"MG17-ZD93-FF33-KF13\" our development key.\n * This component is generally only used for country codes including \"GBR\", \"GGY\", \"IMN\", \"JEY\". An example of this behavior is included bellow.\n */\nexport const AddressLookup = forwardRef(\n  (\n    {\n      apiKey,\n      countries,\n      errorMessage,\n      hasError,\n      isValid,\n      isValidVisible,\n      isInvalidVisible,\n      label,\n      hintText,\n      // eslint-disable-next-line @typescript-eslint/no-unused-vars\n      onAddressError = (error: Error) => {\n        console.log(error);\n      },\n      onAddressSelected,\n      onChange,\n      onBlur,\n      ...props\n    }: AddressLookupProps,\n    ref?: Ref<HTMLInputElement>,\n  ) => {\n    const [addressOptions, setAddressOptions] = useState<AddressOptionsType[]>(\n      [],\n    );\n    const [activeOption, setActiveOption] = useState(-1);\n    const wrapperRef = useRef<HTMLDivElement>(null);\n    const foundTheme = useTheme();\n    const theme = {\n      ...defaultTheme,\n      ...foundTheme,\n    };\n\n    const clearOptions = () => {\n      setActiveOption(-1);\n      setAddressOptions([]);\n    };\n\n    const searchDebounced = useCallback(\n      debounce(500, (query: string) => search(query)),\n      [],\n    );\n\n    const search = (query: string, id = \"\") => {\n      if (query.length === 0) return setAddressOptions([]);\n      let searchUrl = `${FIND_URL}?Key=${apiKey}&Text=${query}&Container=${id}`;\n      if (countries !== undefined) {\n        searchUrl = `${searchUrl}&Countries=${countries.join(\",\")}`;\n      }\n      fetch(searchUrl)\n        .then((res: Response) => {\n          if (!res.ok) throw new Error(\"Something went wrong please try again\");\n          return res.json();\n        })\n        .then((data: { Items: AddressOptionsType[] }) => {\n          // Occasionally get the error \"The query didn't respond fast enough, it may be too complex.\"\n          // returned with a 200 response. Example query \"n17 6t\"\n          if (data.Items[0].Error)\n            throw new Error(\"Something went wrong please try again\");\n          setAddressOptions(data.Items || []);\n          return null;\n        })\n        .catch((err) => onAddressError(err as Error));\n      return null;\n    };\n\n    const getAddress = (id: string) => {\n      fetch(`${RETRIEVE_URL}?Key=${apiKey}&Id=${id}`)\n        .then((res: Response) => {\n          if (!res.ok) throw new Error(\"Something went wrong please try again\");\n          return res.json();\n        })\n        .then((data: { Items: AddressDataType[] }) => {\n          const selectedAddress = data.Items[0];\n          const selectedAddressWithoutCommas =\n            removeCommasFromObjectStringValues<AddressDataType>(\n              selectedAddress,\n            );\n          onAddressSelected(selectedAddressWithoutCommas);\n          clearOptions();\n          return null;\n        })\n        .catch((err) => onAddressError(err as Error));\n    };\n\n    const selectAddress = (address: AddressOptionsType) => {\n      if (address.Type === \"Address\") return getAddress(address.Id);\n      search(address.Text, address.Id);\n      return null;\n    };\n\n    const handleKeyDown = (e: KeyboardEvent<HTMLInputElement>): void => {\n      if (e.key === \"Enter\" && addressOptions[activeOption]) {\n        e.preventDefault();\n        if (addressOptions[activeOption].Type === \"Address\")\n          getAddress(addressOptions[activeOption].Id);\n        search(\n          addressOptions[activeOption].Text,\n          addressOptions[activeOption].Id,\n        );\n        setActiveOption(-1);\n      } else if (e.key === \"ArrowUp\") {\n        e.preventDefault();\n        if (activeOption <= -1) setActiveOption(addressOptions.length - 1);\n        setActiveOption(activeOption - 1);\n      } else if (e.key === \"ArrowDown\") {\n        e.preventDefault();\n        if (activeOption + 1 >= addressOptions.length) setActiveOption(0);\n        setActiveOption(activeOption + 1);\n      } else {\n        setActiveOption(-1);\n      }\n    };\n\n    const handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n      searchDebounced(e.target.value);\n      if (onChange) onChange(e);\n    };\n\n    const handleBlur = (e: FocusEvent<HTMLInputElement>) => {\n      const isOptionsOpen = !!addressOptions.length;\n      if (onBlur && !isOptionsOpen) onBlur(e);\n    };\n\n    const handleClickOutside = (event: MouseEvent) => {\n      if (\n        wrapperRef.current &&\n        event.target instanceof HTMLElement &&\n        !wrapperRef.current.contains(event.target)\n      )\n        clearOptions();\n    };\n\n    useEffect(() => {\n      document.addEventListener(\"mousedown\", handleClickOutside);\n      return () => {\n        document.removeEventListener(\"mousedown\", handleClickOutside);\n      };\n    });\n\n    useKey(\n      () => {\n        clearOptions();\n      },\n      {\n        detectKeys: [\"Escape\", \"Tab\"],\n      },\n      [],\n    );\n\n    return (\n      <>\n        <TextField\n          aria-activedescendant={\n            addressOptions.length ? `addressOptions-${activeOption}` : \"\"\n          }\n          aria-owns=\"found_addresses\"\n          aria-autocomplete=\"both\"\n          aria-expanded={addressOptions.length ? \"true\" : \"false\"}\n          autoComplete=\"off\"\n          hasError={hasError || !!errorMessage}\n          errorMessage={errorMessage}\n          hintText={hintText ?? \"Start typing your address or postcode\"}\n          isValid={isValid}\n          isValidVisible={isValidVisible}\n          isInvalidVisible={isInvalidVisible}\n          label={label ?? \"Home address\"}\n          ref={ref}\n          required\n          role=\"combobox\"\n          type=\"search\"\n          {...props}\n          onKeyDown={handleKeyDown}\n          onChange={handleChange}\n          onBlur={handleBlur}\n        />\n\n        {!!addressOptions.length && (\n          <>\n            <ScreenReaderOnly role=\"status\" aria-live=\"assertive\">\n              {!!addressOptions.length &&\n                `We have found ${addressOptions.length} result${\n                  addressOptions.length !== 1 ? \"s\" : \"\"\n                } matching your search. Use up and down arrow keys to navigate`}\n            </ScreenReaderOnly>\n            <ListWrapper ref={wrapperRef}>\n              <List\n                aria-label=\"found addresses\"\n                id=\"found_addresses\"\n                role=\"listbox\"\n                theme={theme}\n              >\n                {addressOptions.map((address, index) => (\n                  <ListItem\n                    tabIndex={0}\n                    id={`addressOptions-${index}`}\n                    $isActive={index === activeOption}\n                    key={address.Id}\n                    onClick={() => {\n                      selectAddress(address);\n                    }}\n                    onKeyDown={(e) => {\n                      if (e.key === \"Enter\") {\n                        selectAddress(address);\n                      }\n                    }}\n                    role=\"option\"\n                    data-hj-suppress\n                    theme={theme}\n                  >\n                    <Text as=\"span\" data-hj-suppress>\n                      {address.Text} {address.Description}\n                    </Text>\n                    {address.Type !== \"Address\" && (\n                      <>\n                        <ScreenReaderOnly>\n                          press enter for these addresses\n                        </ScreenReaderOnly>\n                        <IconFa faIcon={faChevronRight} />\n                      </>\n                    )}\n                  </ListItem>\n                ))}\n              </List>\n            </ListWrapper>\n          </>\n        )}\n      </>\n    );\n  },\n);\n\nexport default AddressLookup;\n"],"names":["AddressLookup","forwardRef","_a","ref","apiKey","countries","errorMessage","hasError","isValid","isValidVisible","isInvalidVisible","label","hintText","_b","onAddressError","error","console","log","onAddressSelected","onChange","onBlur","props","__rest","_c","useState","addressOptions","setAddressOptions","_d","activeOption","setActiveOption","wrapperRef","useRef","foundTheme","useTheme","theme","__assign","defaultTheme","clearOptions","searchDebounced","useCallback","debounce","query","search","id","length","searchUrl","concat","undefined","join","fetch","then","res","ok","Error","json","data","Items","catch","err","getAddress","selectedAddress","selectedAddressWithoutCommas","removeCommasFromObjectStringValues","selectAddress","address","Type","Id","Text","handleClickOutside","event","current","target","HTMLElement","contains","useEffect","document","addEventListener","removeEventListener","useKey","detectKeys","React","createElement","Fragment","TextField","autoComplete","required","role","type","onKeyDown","e","key","preventDefault","value","isOptionsOpen","ScreenReaderOnly","ListWrapper","List","map","index","ListItem","tabIndex","onClick","as","Description","IconFa","faIcon","faChevronRight"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-import{__makeTemplateObject as n}from"../../../node_modules/tslib/tslib.es6.js";import o from"styled-components";var i,r,e,t,p=o.div(i||(i=n(["\n  position: relative;\n"],["\n  position: relative;\n"]))),d=o.ul(r||(r=n(["\n  background-color: ",";\n  border-radius: 3px;\n  border: 2px solid #ccc;\n  box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.2);\n  list-style: none;\n  margin-top: 0;\n  max-height: 400px;\n  overflow-y: auto;\n  padding: 0;\n  position: absolute;\n  width: 100%;\n  z-index: 999;\n"],["\n  background-color: ",";\n  border-radius: 3px;\n  border: 2px solid #ccc;\n  box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.2);\n  list-style: none;\n  margin-top: 0;\n  max-height: 400px;\n  overflow-y: auto;\n  padding: 0;\n  position: absolute;\n  width: 100%;\n  z-index: 999;\n"])),(function(n){return n.theme.colors.backgroundLight})),a=o.li(e||(e=n(["\n  align-items: center;\n  background-color: ",";\n  cursor: pointer;\n  display: flex;\n  justify-content: space-between;\n  padding: 5px;\n  &:hover,\n  &:focus {\n    background-color: #ddd;\n  }\n"],["\n  align-items: center;\n  background-color: ",";\n  cursor: pointer;\n  display: flex;\n  justify-content: space-between;\n  padding: 5px;\n  &:hover,\n  &:focus {\n    background-color: #ddd;\n  }\n"])),(function(n){var o=n.theme;return n.isActive?o.colors.backgroundMid:o.colors.backgroundLight})),s=o.div(t||(t=n(["\n  border: 0px;\n  clip: rect(0px, 0px, 0px, 0px);\n  height: 1px;\n  margin-bottom: -1px;\n  margin-right: -1px;\n  overflow: hidden;\n  padding: 0px;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n"],["\n  border: 0px;\n  clip: rect(0px, 0px, 0px, 0px);\n  height: 1px;\n  margin-bottom: -1px;\n  margin-right: -1px;\n  overflow: hidden;\n  padding: 0px;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n"])));export{d as List,a as ListItem,p as ListWrapper,s as ScreenReaderOnly};
+import{__makeTemplateObject as n}from"../../../node_modules/tslib/tslib.es6.js";import o from"styled-components";var i,r,e,t,p=o.div(i||(i=n(["\n  position: relative;\n"],["\n  position: relative;\n"]))),d=o.ul(r||(r=n(["\n  background-color: ",";\n  border-radius: 3px;\n  border: 2px solid #ccc;\n  box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.2);\n  list-style: none;\n  margin-top: 0;\n  max-height: 400px;\n  overflow-y: auto;\n  padding: 0;\n  position: absolute;\n  width: 100%;\n  z-index: 999;\n"],["\n  background-color: ",";\n  border-radius: 3px;\n  border: 2px solid #ccc;\n  box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.2);\n  list-style: none;\n  margin-top: 0;\n  max-height: 400px;\n  overflow-y: auto;\n  padding: 0;\n  position: absolute;\n  width: 100%;\n  z-index: 999;\n"])),(function(n){return n.theme.colors.backgroundLight})),a=o.li(e||(e=n(["\n  align-items: center;\n  background-color: ",";\n  cursor: pointer;\n  display: flex;\n  justify-content: space-between;\n  padding: 5px;\n  &:hover,\n  &:focus {\n    background-color: #ddd;\n  }\n"],["\n  align-items: center;\n  background-color: ",";\n  cursor: pointer;\n  display: flex;\n  justify-content: space-between;\n  padding: 5px;\n  &:hover,\n  &:focus {\n    background-color: #ddd;\n  }\n"])),(function(n){var o=n.theme;return n.$isActive?o.colors.backgroundMid:o.colors.backgroundLight})),s=o.div(t||(t=n(["\n  border: 0px;\n  clip: rect(0px, 0px, 0px, 0px);\n  height: 1px;\n  margin-bottom: -1px;\n  margin-right: -1px;\n  overflow: hidden;\n  padding: 0px;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n"],["\n  border: 0px;\n  clip: rect(0px, 0px, 0px, 0px);\n  height: 1px;\n  margin-bottom: -1px;\n  margin-right: -1px;\n  overflow: hidden;\n  padding: 0px;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n"])));export{d as List,a as ListItem,p as ListWrapper,s as ScreenReaderOnly};
 //# sourceMappingURL=styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sources":["../../../../src/components/AddressLookup/styles.ts"],"sourcesContent":["import styled from \"styled-components\";\nimport { type ThemeType } from \"../../types\";\n\ninterface ListWrapperProps extends React.HTMLProps<HTMLDivElement> {\n  tabIndex?: number;\n}\n\ntype ListProps = {\n  theme: ThemeType;\n  isActive?: boolean;\n};\n\nexport const ListWrapper = styled.div<ListWrapperProps>`\n  position: relative;\n`;\n\nexport const List = styled.ul<\n  ListProps & { ref?: React.Ref<HTMLUListElement> }\n>`\n  background-color: ${({ theme }) => theme.colors.backgroundLight};\n  border-radius: 3px;\n  border: 2px solid #ccc;\n  box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.2);\n  list-style: none;\n  margin-top: 0;\n  max-height: 400px;\n  overflow-y: auto;\n  padding: 0;\n  position: absolute;\n  width: 100%;\n  z-index: 999;\n`;\n\nexport const ListItem = styled.li<\n  ListProps & {\n    ref?: React.Ref<HTMLLIElement>;\n  }\n>`\n  align-items: center;\n  background-color: ${({ theme, isActive }: ListProps) =>\n    isActive ? theme.colors.backgroundMid : theme.colors.backgroundLight};\n  cursor: pointer;\n  display: flex;\n  justify-content: space-between;\n  padding: 5px;\n  &:hover,\n  &:focus {\n    background-color: #ddd;\n  }\n`;\n\n// TODO move to its own component\nexport const ScreenReaderOnly = styled.div`\n  border: 0px;\n  clip: rect(0px, 0px, 0px, 0px);\n  height: 1px;\n  margin-bottom: -1px;\n  margin-right: -1px;\n  overflow: hidden;\n  padding: 0px;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n`;\n"],"names":["ListWrapper","styled","div","templateObject_1","__makeTemplateObject","List","ul","templateObject_2","_a","theme","colors","backgroundLight","ListItem","li","templateObject_3","isActive","backgroundMid","ScreenReaderOnly","templateObject_4"],"mappings":"iHAYa,YAAAA,EAAcC,EAAOC,IAAGC,IAAAA,EAAAC,EAAA,CAAA,6BAAA,CAAkB,gCAI1CC,EAAOJ,EAAOK,GAAEC,IAAAA,EAAAH,EAAA,CAAA,yBAAA,kQAAA,CAE5B,yBACgE,qQAA3C,SAACI,GAAc,OAAPA,EAAAC,MAAaC,OAAOC,eAAb,IAcxBC,EAAWX,EAAOY,GAAEC,IAAAA,EAAAV,EAAA,CAAA,iDAAA,4JAAA,CAIhC,iDAGuE,+JADlD,SAACI,OAAEC,EAAKD,EAAAC,MAC1B,OADoCD,EAAAO,SACzBN,EAAMC,OAAOM,cAAgBP,EAAMC,OAAOC,eAArD,IAYSM,EAAmBhB,EAAOC,IAAGgB,IAAAA,EAAAd,EAAA,CAAA,4NAAA,CAAA"}
+{"version":3,"file":"styles.js","sources":["../../../../src/components/AddressLookup/styles.ts"],"sourcesContent":["import styled from \"styled-components\";\nimport { type ThemeType } from \"../../types\";\n\ninterface ListWrapperProps extends React.HTMLProps<HTMLDivElement> {\n  tabIndex?: number;\n}\n\ntype ListProps = {\n  theme: ThemeType;\n  $isActive?: boolean;\n};\n\nexport const ListWrapper = styled.div<ListWrapperProps>`\n  position: relative;\n`;\n\nexport const List = styled.ul<\n  ListProps & { ref?: React.Ref<HTMLUListElement> }\n>`\n  background-color: ${({ theme }) => theme.colors.backgroundLight};\n  border-radius: 3px;\n  border: 2px solid #ccc;\n  box-shadow: 0px 6px 12px rgba(0, 0, 0, 0.2);\n  list-style: none;\n  margin-top: 0;\n  max-height: 400px;\n  overflow-y: auto;\n  padding: 0;\n  position: absolute;\n  width: 100%;\n  z-index: 999;\n`;\n\nexport const ListItem = styled.li<\n  ListProps & {\n    ref?: React.Ref<HTMLLIElement>;\n  }\n>`\n  align-items: center;\n  background-color: ${({ theme, $isActive }: ListProps) =>\n    $isActive ? theme.colors.backgroundMid : theme.colors.backgroundLight};\n  cursor: pointer;\n  display: flex;\n  justify-content: space-between;\n  padding: 5px;\n  &:hover,\n  &:focus {\n    background-color: #ddd;\n  }\n`;\n\n// TODO move to its own component\nexport const ScreenReaderOnly = styled.div`\n  border: 0px;\n  clip: rect(0px, 0px, 0px, 0px);\n  height: 1px;\n  margin-bottom: -1px;\n  margin-right: -1px;\n  overflow: hidden;\n  padding: 0px;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n`;\n"],"names":["ListWrapper","styled","div","templateObject_1","__makeTemplateObject","List","ul","templateObject_2","_a","theme","colors","backgroundLight","ListItem","li","templateObject_3","$isActive","backgroundMid","ScreenReaderOnly","templateObject_4"],"mappings":"iHAYa,YAAAA,EAAcC,EAAOC,IAAGC,IAAAA,EAAAC,EAAA,CAAA,6BAAA,CAAkB,gCAI1CC,EAAOJ,EAAOK,GAAEC,IAAAA,EAAAH,EAAA,CAAA,yBAAA,kQAAA,CAE5B,yBACgE,qQAA3C,SAACI,GAAc,OAAPA,EAAAC,MAAaC,OAAOC,eAAb,IAcxBC,EAAWX,EAAOY,GAAEC,IAAAA,EAAAV,EAAA,CAAA,iDAAA,4JAAA,CAIhC,iDAGwE,+JADnD,SAACI,OAAEC,EAAKD,EAAAC,MAC1B,OADqCD,EAAAO,UACzBN,EAAMC,OAAOM,cAAgBP,EAAMC,OAAOC,eAAtD,IAYSM,EAAmBhB,EAAOC,IAAGgB,IAAAA,EAAAd,EAAA,CAAA,4NAAA,CAAA"}

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

@@ -1,2 +1,2 @@
-import{__rest as t,__assign as r}from"../../../node_modules/tslib/tslib.es6.js";import o from"react";import{useTheme as a}from"styled-components";import{crukTheme as e}from"../../themes/cruk.js";import{StyledAvatar as n}from"./styles.js";function m(m){var i=m.url,s=m.name,c=m.size,p=void 0===c?"m":c,l=m.alt,u=void 0===l?"":l,f=t(m,["url","name","size","alt"]),v=a(),d=r(r({},e),v);return o.createElement(n,r({},f,{size:d.avatar[p||"m"],src:function(){if(i)return i;var t=s&&"string"==typeof s&&"Anonymous"!==s&&/[a-z]/i.exec(s[0].trim())?"icon-avatar-".concat(s[0].trim().toUpperCase(),".png"):"icon-avatar-Anonymous.png";return"".concat(d.avatar.path).concat(t)}(),alt:u}))}export{m as Avatar,m as default};
+import{__rest as t,__assign as r}from"../../../node_modules/tslib/tslib.es6.js";import o from"react";import{useTheme as a}from"styled-components";import{crukTheme as e}from"../../themes/cruk.js";import{StyledAvatar as n}from"./styles.js";function m(m){var i=m.url,s=m.name,c=m.size,p=void 0===c?"m":c,l=m.alt,u=void 0===l?"":l,f=t(m,["url","name","size","alt"]),v=a(),d=r(r({},e),v);return o.createElement(n,r({},f,{$size:d.avatar[p||"m"],src:function(){if(i)return i;var t=s&&"string"==typeof s&&"Anonymous"!==s&&/[a-z]/i.exec(s[0].trim())?"icon-avatar-".concat(s[0].trim().toUpperCase(),".png"):"icon-avatar-Anonymous.png";return"".concat(d.avatar.path).concat(t)}(),alt:u}))}export{m as Avatar,m as default};
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/Avatar/index.tsx"],"sourcesContent":["import React, { type ImgHTMLAttributes } from \"react\";\nimport { useTheme } from \"styled-components\";\n\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\n\nimport { StyledAvatar } from \"./styles\";\n\nexport type AvatarProps = ImgHTMLAttributes<HTMLElement> & {\n  /** name of user/entity */\n  name?: string;\n  /** image url */\n  url?: string;\n  /** image size */\n  size?: \"s\" | \"m\" | \"l\" | \"xl\";\n};\n\n/**\n *\n * You can use an avatar to display ownership of an item of content. If you pass a URL of an image that will be displayed otherwise the first letter of the name will be used to display a branded avatar.\n */\nexport function Avatar({\n  url,\n  name,\n  size = \"m\",\n  alt = \"\",\n  ...rest\n}: AvatarProps) {\n  const foundTheme = useTheme();\n  const theme = {\n    ...defaultTheme,\n    ...foundTheme,\n  };\n\n  const avatarUrl = () => {\n    if (url) return url;\n    const fileName =\n      name &&\n      typeof name === \"string\" &&\n      name !== \"Anonymous\" &&\n      /[a-z]/i.exec(name[0].trim())\n        ? `icon-avatar-${name[0].trim().toUpperCase()}.png`\n        : \"icon-avatar-Anonymous.png\";\n\n    return `${theme.avatar.path}${fileName}`;\n  };\n\n  return (\n    <StyledAvatar\n      {...rest}\n      size={theme.avatar[size || \"m\"]}\n      src={avatarUrl()}\n      alt={alt}\n    />\n  );\n}\n\nexport default Avatar;\n"],"names":["Avatar","_a","url","name","_b","size","_c","alt","rest","__rest","foundTheme","useTheme","theme","__assign","defaultTheme","React","createElement","StyledAvatar","avatar","src","fileName","exec","trim","concat","toUpperCase","path","avatarUrl"],"mappings":"8OAoBM,SAAUA,EAAOC,GACrB,IAAAC,QACAC,SACAC,EAAAH,EAAAI,KAAAA,OAAO,IAAAD,EAAA,MACPE,EAAAL,EAAAM,IAAAA,OAAM,IAAAD,EAAA,KACHE,EALkBC,EAAAR,EAAA,CAAA,MAAA,OAAA,OAAA,QAOfS,EAAaC,IACbC,EACDC,EAAAA,EAAA,CAAA,EAAAC,GACAJ,GAgBL,OACEK,EAACC,cAAAC,EACKJ,EAAA,CAAA,EAAAL,EACJ,CAAAH,KAAMO,EAAMM,OAAOb,GAAQ,KAC3Bc,IAjBc,WAChB,GAAIjB,EAAK,OAAOA,EAChB,IAAMkB,EACJjB,GACgB,iBAATA,GACE,cAATA,GACA,SAASkB,KAAKlB,EAAK,GAAGmB,QAClB,eAAAC,OAAepB,EAAK,GAAGmB,OAAOE,cAAmB,QACjD,4BAEN,MAAO,GAAAD,OAAGX,EAAMM,OAAOO,MAAIF,OAAGH,EAChC,CAMSM,GACLnB,IAAKA,IAGX"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/Avatar/index.tsx"],"sourcesContent":["import React, { type ImgHTMLAttributes } from \"react\";\nimport { useTheme } from \"styled-components\";\n\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\n\nimport { StyledAvatar } from \"./styles\";\n\nexport type AvatarProps = ImgHTMLAttributes<HTMLElement> & {\n  /** name of user/entity */\n  name?: string;\n  /** image url */\n  url?: string;\n  /** image size */\n  size?: \"s\" | \"m\" | \"l\" | \"xl\";\n};\n\n/**\n *\n * You can use an avatar to display ownership of an item of content. If you pass a URL of an image that will be displayed otherwise the first letter of the name will be used to display a branded avatar.\n */\nexport function Avatar({\n  url,\n  name,\n  size = \"m\",\n  alt = \"\",\n  ...rest\n}: AvatarProps) {\n  const foundTheme = useTheme();\n  const theme = {\n    ...defaultTheme,\n    ...foundTheme,\n  };\n\n  const avatarUrl = () => {\n    if (url) return url;\n    const fileName =\n      name &&\n      typeof name === \"string\" &&\n      name !== \"Anonymous\" &&\n      /[a-z]/i.exec(name[0].trim())\n        ? `icon-avatar-${name[0].trim().toUpperCase()}.png`\n        : \"icon-avatar-Anonymous.png\";\n\n    return `${theme.avatar.path}${fileName}`;\n  };\n\n  return (\n    <StyledAvatar\n      {...rest}\n      $size={theme.avatar[size || \"m\"]}\n      src={avatarUrl()}\n      alt={alt}\n    />\n  );\n}\n\nexport default Avatar;\n"],"names":["Avatar","_a","url","name","_b","size","_c","alt","rest","__rest","foundTheme","useTheme","theme","__assign","defaultTheme","React","createElement","StyledAvatar","avatar","src","fileName","exec","trim","concat","toUpperCase","path","avatarUrl"],"mappings":"8OAoBM,SAAUA,EAAOC,GACrB,IAAAC,QACAC,SACAC,EAAAH,EAAAI,KAAAA,OAAO,IAAAD,EAAA,MACPE,EAAAL,EAAAM,IAAAA,OAAM,IAAAD,EAAA,KACHE,EALkBC,EAAAR,EAAA,CAAA,MAAA,OAAA,OAAA,QAOfS,EAAaC,IACbC,EACDC,EAAAA,EAAA,CAAA,EAAAC,GACAJ,GAgBL,OACEK,EAACC,cAAAC,EACKJ,EAAA,CAAA,EAAAL,SACGI,EAAMM,OAAOb,GAAQ,KAC5Bc,IAjBc,WAChB,GAAIjB,EAAK,OAAOA,EAChB,IAAMkB,EACJjB,GACgB,iBAATA,GACE,cAATA,GACA,SAASkB,KAAKlB,EAAK,GAAGmB,QAClB,eAAAC,OAAepB,EAAK,GAAGmB,OAAOE,cAAmB,QACjD,4BAEN,MAAO,GAAAD,OAAGX,EAAMM,OAAOO,MAAIF,OAAGH,EAChC,CAMSM,GACLnB,IAAKA,IAGX"}

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

@@ -1,2 +1,2 @@
-import{__makeTemplateObject as r}from"../../../node_modules/tslib/tslib.es6.js";import o from"styled-components";var e,n=o.img(e||(e=r(["\n  box-sizing: border-box;\n  border-radius: 50%;\n  height: ",";\n  object-fit: cover;\n  width: ",";\n  border-style: solid;\n  border-width: 2px;\n  border-color: ",";\n"],["\n  box-sizing: border-box;\n  border-radius: 50%;\n  height: ",";\n  object-fit: cover;\n  width: ",";\n  border-style: solid;\n  border-width: 2px;\n  border-color: ",";\n"])),(function(r){return r.size}),(function(r){return r.size}),(function(r){return r.theme.colors.avatarBorder}));export{n as StyledAvatar,n as default};
+import{__makeTemplateObject as r}from"../../../node_modules/tslib/tslib.es6.js";import o from"styled-components";var e,n=o.img(e||(e=r(["\n  box-sizing: border-box;\n  border-radius: 50%;\n  height: ",";\n  object-fit: cover;\n  width: ",";\n  border-style: solid;\n  border-width: 2px;\n  border-color: ",";\n"],["\n  box-sizing: border-box;\n  border-radius: 50%;\n  height: ",";\n  object-fit: cover;\n  width: ",";\n  border-style: solid;\n  border-width: 2px;\n  border-color: ",";\n"])),(function(r){return r.$size}),(function(r){return r.$size}),(function(r){return r.theme.colors.avatarBorder}));export{n as StyledAvatar,n as default};
 //# sourceMappingURL=styles.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sources":["../../../../src/components/Avatar/styles.ts"],"sourcesContent":["import styled from \"styled-components\";\nimport { type ThemeType } from \"../../types\";\n\ntype AvatarStyledProps = {\n  size?: string;\n  theme: ThemeType;\n};\n\nexport const StyledAvatar = styled.img<AvatarStyledProps>`\n  box-sizing: border-box;\n  border-radius: 50%;\n  height: ${({ size }) => size};\n  object-fit: cover;\n  width: ${({ size }) => size};\n  border-style: solid;\n  border-width: 2px;\n  border-color: ${({ theme }: AvatarStyledProps) => theme.colors.avatarBorder};\n`;\n\nexport default StyledAvatar;\n"],"names":["StyledAvatar","styled","img","templateObject_1","__makeTemplateObject","_a","size","theme","colors","avatarBorder"],"mappings":"iHAQa,MAAAA,EAAeC,EAAOC,IAAGC,IAAAA,EAAAC,EAAA,CAAA,iEAAA,qCAAA,oEAAA,OAAA,CAAmB,iEAG3B,qCAED,oEAGgD,UALjE,SAACC,GAAa,OAAPA,EAAAC,IAAO,IAEf,SAACD,GAAa,OAAPA,EAAAC,IAAO,IAGP,SAACD,GAAiC,OAA1BA,EAAAE,MAAgCC,OAAOC,YAAb"}
+{"version":3,"file":"styles.js","sources":["../../../../src/components/Avatar/styles.ts"],"sourcesContent":["import styled from \"styled-components\";\nimport { type ThemeType } from \"../../types\";\n\nexport const StyledAvatar = styled.img<{\n  $size?: string;\n  theme: ThemeType;\n}>`\n  box-sizing: border-box;\n  border-radius: 50%;\n  height: ${({ $size }) => $size};\n  object-fit: cover;\n  width: ${({ $size }) => $size};\n  border-style: solid;\n  border-width: 2px;\n  border-color: ${({ theme }) => theme.colors.avatarBorder};\n`;\n\nexport default StyledAvatar;\n"],"names":["StyledAvatar","styled","img","templateObject_1","__makeTemplateObject","_a","$size","theme","colors","avatarBorder"],"mappings":"iHAGa,MAAAA,EAAeC,EAAOC,IAAGC,IAAAA,EAAAC,EAAA,CAAA,iEAAA,qCAAA,oEAAA,OAAA,CAGpC,iEAG8B,qCAED,oEAG2B,UAL9C,SAACC,GAAc,OAAPA,EAAAC,KAAO,IAEhB,SAACD,GAAc,OAAPA,EAAAC,KAAO,IAGR,SAACD,GAAc,OAAPA,EAAAE,MAAaC,OAAOC,YAAb"}

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

@@ -1,2 +1,2 @@
-import{__rest as e,__assign as t}from"../../../node_modules/tslib/tslib.es6.js";import r from"react";import{useTheme as o}from"styled-components";import{crukTheme as s}from"../../themes/cruk.js";import{StyledBadge as m}from"./styles.js";function i(i){var n=i.children,l=e(i,["children"]),f=o(),p=t(t({},s),f);return r.createElement(m,t({theme:p,isText:"string"==typeof n,size:"xs"},l),n)}export{i as Badge,i as default};
+import{__rest as o,__assign as r}from"../../../node_modules/tslib/tslib.es6.js";import e from"react";import{useTheme as t}from"styled-components";import{crukTheme as s}from"../../themes/cruk.js";import{StyledBadge as l}from"./styles.js";function i(i){var m=i.children,d=i.size,n=void 0===d?"xs":d,c=i.backgroundColor,C=i.borderColor,a=i.textColor,b=o(i,["children","size","backgroundColor","borderColor","textColor"]),f=t(),p=r(r({},s),f);return e.createElement(l,r({theme:p,$isText:"string"==typeof m,$size:n,$backgroundColor:c,$borderColor:C,$textColor:a},b),m)}export{i as Badge,i as default};
 //# sourceMappingURL=index.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/components/Badge/index.tsx"],"sourcesContent":["import React, { type ReactNode } from \"react\";\nimport { useTheme } from \"styled-components\";\n\nimport { type SpaceType } from \"../../types\";\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\n\nimport { StyledBadge } from \"./styles\";\n\nexport type BadgeProps = {\n  /** background colour of badge */\n  backgroundColor?: string;\n  /** border colour of badge */\n  borderColor?: string;\n  /** text colour of badge */\n  textColor?: string;\n  /** size of badge */\n  size?: SpaceType;\n  /** contents of badge */\n  children?: ReactNode;\n};\n\n/**\n * Displays a numeric or icon indicator. You can use the icon prop to\nindicate the importance of the badge to the user.\n\nNote that depending on how they are used, badges may be confusing for users\nof screen readers and similar assistive technologies. While the styling of\nbadges provides a visual cue as to their purpose, these users will simply\nbe presented with the content of the badge. Depending on the specific\nsituation, these badges may seem like random additional words or numbers\nat the end of a sentence, link, or button. Unless the context is clear,\nconsider including additional context with a visually hidden piece of\nadditional text.\n */\nexport function Badge({ children, ...rest }: BadgeProps) {\n  const foundTheme = useTheme();\n  const theme = {\n    ...defaultTheme,\n    ...foundTheme,\n  };\n  return (\n    <StyledBadge\n      theme={theme}\n      isText={typeof children === \"string\"}\n      size=\"xs\"\n      {...rest}\n    >\n      {children}\n    </StyledBadge>\n  );\n}\n\nexport default Badge;\n"],"names":["Badge","_a","children","rest","__rest","foundTheme","useTheme","theme","__assign","defaultTheme","React","createElement","StyledBadge","isText","size"],"mappings":"6OAkCM,SAAUA,EAAMC,GAAE,IAAAC,EAAQD,EAAAC,SAAKC,EAAIC,EAAAH,EAAnB,cACdI,EAAaC,IACbC,EACDC,EAAAA,EAAA,CAAA,EAAAC,GACAJ,GAEL,OACEK,EAACC,cAAAC,EACCJ,EAAA,CAAAD,MAAOA,EACPM,OAA4B,iBAAbX,EACfY,KAAK,MACDX,GAEHD,EAGP"}
+{"version":3,"file":"index.js","sources":["../../../../src/components/Badge/index.tsx"],"sourcesContent":["import React, { type HTMLAttributes, type ReactNode } from \"react\";\nimport { useTheme } from \"styled-components\";\n\nimport { type SpaceType } from \"../../types\";\nimport { crukTheme as defaultTheme } from \"../../themes/cruk\";\n\nimport { StyledBadge } from \"./styles\";\n\nexport type BadgeProps = HTMLAttributes<HTMLSpanElement> & {\n  /** background colour of badge */\n  backgroundColor?: string;\n  /** border colour of badge */\n  borderColor?: string;\n  /** text colour of badge */\n  textColor?: string;\n  /** size of badge */\n  size?: SpaceType;\n  /** contents of badge */\n  children?: ReactNode;\n};\n\n/**\n * Displays a numeric or icon indicator. You can use the icon prop to\nindicate the importance of the badge to the user.\n\nNote that depending on how they are used, badges may be confusing for users\nof screen readers and similar assistive technologies. While the styling of\nbadges provides a visual cue as to their purpose, these users will simply\nbe presented with the content of the badge. Depending on the specific\nsituation, these badges may seem like random additional words or numbers\nat the end of a sentence, link, or button. Unless the context is clear,\nconsider including additional context with a visually hidden piece of\nadditional text.\n */\nexport function Badge({\n  children,\n  size = \"xs\",\n  backgroundColor,\n  borderColor,\n  textColor,\n  ...rest\n}: BadgeProps) {\n  const foundTheme = useTheme();\n  const theme = {\n    ...defaultTheme,\n    ...foundTheme,\n  };\n  return (\n    <StyledBadge\n      theme={theme}\n      $isText={typeof children === \"string\"}\n      $size={size}\n      $backgroundColor={backgroundColor}\n      $borderColor={borderColor}\n      $textColor={textColor}\n      {...rest}\n    >\n      {children}\n    </StyledBadge>\n  );\n}\n\nexport default Badge;\n"],"names":["Badge","_a","children","_b","size","backgroundColor","borderColor","textColor","rest","__rest","foundTheme","useTheme","theme","__assign","defaultTheme","React","createElement","StyledBadge","$isText","$size","$backgroundColor","$borderColor","$textColor"],"mappings":"6OAkCM,SAAUA,EAAMC,GACpB,IAAAC,aACAC,EAAAF,EAAAG,KAAAA,OAAI,IAAAD,EAAG,KAAIA,EACXE,oBACAC,gBACAC,cACGC,EANiBC,EAAAR,EAAA,CAAA,WAAA,OAAA,kBAAA,cAAA,cAQdS,EAAaC,IACbC,EACDC,EAAAA,EAAA,CAAA,EAAAC,GACAJ,GAEL,OACEK,EAACC,cAAAC,EACCJ,EAAA,CAAAD,MAAOA,EACEM,QAAoB,iBAAbhB,EAAqBiB,MAC9Bf,EACWgB,iBAAAf,EACJgB,aAAAf,EACFgB,WAAAf,GACRC,GAEHN,EAGP"}