igloo-d2c-components 1.0.8 → 1.0.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (75) hide show
  1. package/README.md +8 -0
  2. package/dist/assets/icons/alert.svg +5 -0
  3. package/dist/assets/icons/arrow-down.svg +3 -0
  4. package/dist/assets/icons/arrow.svg +9 -0
  5. package/dist/assets/icons/close.svg +4 -0
  6. package/dist/assets/icons/facebook.svg +3 -0
  7. package/dist/assets/icons/index.ts +26 -0
  8. package/dist/assets/icons/instagram.svg +11 -0
  9. package/dist/assets/icons/youtube.svg +11 -0
  10. package/dist/assets/index.ts +13 -0
  11. package/dist/assets/tenants/ammetlife/logo.svg +10 -0
  12. package/dist/assets/tenants/cimb/logo-white.png +0 -0
  13. package/dist/assets/tenants/cimb/logo.svg +62 -0
  14. package/dist/assets/tenants/igloo/logo.svg +22 -0
  15. package/dist/cjs/index.js +2125 -38
  16. package/dist/cjs/index.js.map +1 -0
  17. package/dist/esm/index.js +2084 -38
  18. package/dist/esm/index.js.map +1 -0
  19. package/dist/types/assets/icons/index.d.ts +21 -0
  20. package/dist/types/assets/index.d.ts +9 -0
  21. package/dist/types/components/BillingToggle/BillingToggle.d.ts +34 -0
  22. package/dist/types/components/BillingToggle/index.d.ts +3 -0
  23. package/dist/types/components/BillingToggle/styled.d.ts +12 -0
  24. package/dist/types/components/CoverageAmountSlider/CoverageAmountSlider.d.ts +53 -0
  25. package/dist/types/components/CoverageAmountSlider/index.d.ts +3 -0
  26. package/dist/types/components/CoverageAmountSlider/styled.d.ts +41 -0
  27. package/dist/types/components/Footer/Footer.d.ts +94 -0
  28. package/dist/types/components/Footer/index.d.ts +3 -0
  29. package/dist/types/components/Footer/styled.d.ts +38 -0
  30. package/dist/types/components/Header/Header.d.ts +159 -0
  31. package/dist/types/components/Header/index.d.ts +3 -0
  32. package/dist/types/components/Header/styled.d.ts +80 -0
  33. package/dist/types/components/InfoCallout/InfoCallout.d.ts +34 -0
  34. package/dist/types/components/InfoCallout/index.d.ts +3 -0
  35. package/dist/types/components/InfoCallout/styled.d.ts +16 -0
  36. package/dist/types/components/NewHeader/NewHeader.d.ts +60 -0
  37. package/dist/types/components/NewHeader/index.d.ts +3 -0
  38. package/dist/types/components/NewHeader/styled.d.ts +26 -0
  39. package/dist/types/components/OptionButton/OptionButton.d.ts +59 -0
  40. package/dist/types/components/OptionButton/index.d.ts +3 -0
  41. package/dist/types/components/OptionButton/styled.d.ts +18 -0
  42. package/dist/types/components/ProductSelectionDrawer/ProductSelectionDrawer.d.ts +54 -0
  43. package/dist/types/components/ProductSelectionDrawer/index.d.ts +3 -0
  44. package/dist/types/components/ProductSelectionDrawer/styled.d.ts +44 -0
  45. package/dist/types/components/QuestionSection/QuestionSection.d.ts +71 -0
  46. package/dist/types/components/QuestionSection/index.d.ts +3 -0
  47. package/dist/types/components/QuestionSection/styled.d.ts +16 -0
  48. package/dist/types/components/RecommendationsDrawer/RecommendationsDrawer.d.ts +92 -0
  49. package/dist/types/components/RecommendationsDrawer/index.d.ts +3 -0
  50. package/dist/types/components/RecommendationsDrawer/styled.d.ts +35 -0
  51. package/dist/types/components/ToggleGroup/ToggleGroup.d.ts +45 -0
  52. package/dist/types/components/ToggleGroup/index.d.ts +3 -0
  53. package/dist/types/components/ToggleGroup/styled.d.ts +17 -0
  54. package/dist/types/context/TenantThemeContext.d.ts +3 -2
  55. package/dist/types/index.d.ts +30 -4
  56. package/dist/types/{components/Banner → storybook-components}/Banner.stories.d.ts +1 -1
  57. package/dist/types/storybook-components/BillingToggle.stories.d.ts +10 -0
  58. package/dist/types/{components/Button → storybook-components}/Button.stories.d.ts +1 -1
  59. package/dist/types/{components/Card → storybook-components}/Card.stories.d.ts +1 -1
  60. package/dist/types/storybook-components/CoverageAmountSlider.stories.d.ts +14 -0
  61. package/dist/types/storybook-components/Footer.stories.d.ts +10 -0
  62. package/dist/types/storybook-components/Header.stories.d.ts +9 -0
  63. package/dist/types/storybook-components/InfoCallout.stories.d.ts +11 -0
  64. package/dist/types/storybook-components/NewHeader.stories.d.ts +82 -0
  65. package/dist/types/storybook-components/OptionButton.stories.d.ts +12 -0
  66. package/dist/types/storybook-components/ProductSelectionDrawer.stories.d.ts +24 -0
  67. package/dist/types/storybook-components/QuestionSection.stories.d.ts +11 -0
  68. package/dist/types/storybook-components/RecommendationsDrawer.stories.d.ts +36 -0
  69. package/dist/types/storybook-components/ToggleGroup.stories.d.ts +10 -0
  70. package/dist/types/themes/index.d.ts +1 -1
  71. package/dist/types/themes/typography.d.ts +69 -0
  72. package/dist/types/types/tenant.d.ts +23 -2
  73. package/dist/types/utils/assets.d.ts +54 -0
  74. package/dist/types/utils/theme.d.ts +3 -2
  75. package/package.json +4 -2
@@ -0,0 +1,80 @@
1
+ /// <reference types="react" />
2
+ export declare const StyledAppBar: import("@emotion/styled").StyledComponent<import("@mui/material").AppBarOwnProps & Omit<import("@mui/material").PaperOwnProps, "classes" | "color" | "position"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & {
3
+ ref?: ((instance: HTMLElement | null) => void) | import("react").RefObject<HTMLElement> | null | undefined;
4
+ }, "children" | "style" | "className" | "classes" | "sx" | "color" | "position" | "variant" | "square" | "elevation" | "enableColorOnDark"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
5
+ ispartnershippagemobileview: boolean;
6
+ scrolled: any;
7
+ }, {}, {}>;
8
+ export declare const ResponsiveB2CLayout: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
9
+ export declare const StyledContainer: import("@emotion/styled").StyledComponent<import("@mui/material").ContainerOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
10
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
11
+ }, "children" | "fixed" | "style" | "className" | "classes" | "sx" | "maxWidth" | "disableGutters"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
12
+ ispartnershippagemobileview: boolean;
13
+ scrolled: any;
14
+ }, {}, {}>;
15
+ export declare const TypographyLogo: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
16
+ ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
17
+ }, "fontFamily" | "children" | "p" | "style" | "fontSize" | "fontStyle" | "fontWeight" | "lineHeight" | "border" | "className" | "classes" | "sx" | "boxShadow" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxSizing" | "color" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "marginBlock" | "marginInline" | "overflow" | "padding" | "paddingBlock" | "paddingInline" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint" | "variant" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
18
+ export declare const ButtonDesktopMenu: import("@emotion/styled").StyledComponent<import("@mui/material").ButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
19
+ ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
20
+ }, "children" | "style" | "className" | "classes" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "color" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "href" | "size" | "startIcon" | "variant"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
21
+ export declare const AnchorLinks: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, {}>;
22
+ export declare const StyledAvatar: import("@emotion/styled").StyledComponent<import("@mui/material").AvatarOwnProps & import("@mui/material").AvatarSlotsAndSlotProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
23
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
24
+ }, "children" | "style" | "className" | "classes" | "sx" | "variant" | "sizes" | "alt" | "src" | "srcSet" | "imgProps" | "slots" | "slotProps"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
25
+ export declare const DivButtonWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
26
+ export declare const ButtonAuth: import("@emotion/styled").StyledComponent<import("@mui/material").ButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
27
+ ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
28
+ }, "children" | "style" | "className" | "classes" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "color" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "href" | "size" | "startIcon" | "variant"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
29
+ export declare const TypographyAuth: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
30
+ ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
31
+ }, "fontFamily" | "children" | "p" | "style" | "fontSize" | "fontStyle" | "fontWeight" | "lineHeight" | "border" | "className" | "classes" | "sx" | "boxShadow" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxSizing" | "color" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "marginBlock" | "marginInline" | "overflow" | "padding" | "paddingBlock" | "paddingInline" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint" | "variant" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
32
+ export declare const StyledMenu: import("@emotion/styled").StyledComponent<import("@mui/material").MenuProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
33
+ export declare const DivProductListing: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
34
+ export declare const StyledMenuItem: import("@emotion/styled").StyledComponent<import("@mui/material").MenuItemOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & {
35
+ ref?: ((instance: HTMLLIElement | null) => void) | import("react").RefObject<HTMLLIElement> | null | undefined;
36
+ }, "children" | "style" | "className" | "classes" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "autoFocus" | "dense" | "selected" | "disableGutters" | "divider"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
37
+ export declare const SpanImageWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
38
+ export declare const ImageProductIcon: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
39
+ export declare const StyledMenuItemDesktop: import("@emotion/styled").StyledComponent<import("@mui/material").MenuItemOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & {
40
+ ref?: ((instance: HTMLLIElement | null) => void) | import("react").RefObject<HTMLLIElement> | null | undefined;
41
+ }, "children" | "style" | "className" | "classes" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "autoFocus" | "dense" | "selected" | "disableGutters" | "divider"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
42
+ export declare const StyledCloseIcon: import("@emotion/styled").StyledComponent<import("@mui/material").SvgIconOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").SVGProps<SVGSVGElement>, "ref"> & {
43
+ ref?: ((instance: SVGSVGElement | null) => void) | import("react").RefObject<SVGSVGElement> | null | undefined;
44
+ }, "children" | "style" | "fontSize" | "className" | "classes" | "sx" | "color" | "shapeRendering" | "viewBox" | "htmlColor" | "inheritViewBox" | "titleAccess"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
45
+ export declare const StyledAvatarUserIcon: import("@emotion/styled").StyledComponent<import("@mui/material").AvatarOwnProps & import("@mui/material").AvatarSlotsAndSlotProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
46
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
47
+ }, "children" | "style" | "className" | "classes" | "sx" | "variant" | "sizes" | "alt" | "src" | "srcSet" | "imgProps" | "slots" | "slotProps"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
48
+ export declare const StyledMenuIcon: import("@emotion/styled").StyledComponent<import("@mui/material").SvgIconOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").SVGProps<SVGSVGElement>, "ref"> & {
49
+ ref?: ((instance: SVGSVGElement | null) => void) | import("react").RefObject<SVGSVGElement> | null | undefined;
50
+ }, "children" | "style" | "fontSize" | "className" | "classes" | "sx" | "color" | "shapeRendering" | "viewBox" | "htmlColor" | "inheritViewBox" | "titleAccess"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
51
+ ispartnershippagemobileview: any;
52
+ scrolled: any;
53
+ }, {}, {}>;
54
+ export declare const StyledDrawer: import("@emotion/styled").StyledComponent<import("@mui/material").DrawerProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
55
+ export declare const DivLogoWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
56
+ export declare const DivLogo: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
57
+ export declare const DivCrossIconWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
58
+ export declare const StyledCloseIconBtn: import("@emotion/styled").StyledComponent<import("@mui/material").IconButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
59
+ ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
60
+ }, "children" | "style" | "className" | "classes" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "color" | "disableFocusRipple" | "size" | "edge"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
61
+ export declare const DivLoginActionContainer: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
62
+ export declare const DivCommonMenus: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
63
+ export declare const MenuItemOtherLinks: import("@emotion/styled").StyledComponent<import("@mui/material").MenuItemOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").LiHTMLAttributes<HTMLLIElement>, HTMLLIElement>, "ref"> & {
64
+ ref?: ((instance: HTMLLIElement | null) => void) | import("react").RefObject<HTMLLIElement> | null | undefined;
65
+ }, "children" | "style" | "className" | "classes" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "autoFocus" | "dense" | "selected" | "disableGutters" | "divider"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
66
+ export declare const StyledFormControlLabel: import("@emotion/styled").StyledComponent<import("@mui/material").FormControlLabelProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
67
+ export declare const ButtonLogout: import("@emotion/styled").StyledComponent<import("@mui/material").ButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
68
+ ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
69
+ }, "children" | "style" | "className" | "classes" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "color" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "href" | "size" | "startIcon" | "variant"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
70
+ export declare const DivLogoutBtnWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
71
+ export declare const AnchorLink: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, {}>;
72
+ export declare const StyledButton: import("@emotion/styled").StyledComponent<import("@mui/material").ButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
73
+ ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
74
+ }, "children" | "style" | "className" | "classes" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "color" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "href" | "size" | "startIcon" | "variant"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
75
+ export declare const StyledButtonBanner: import("@emotion/styled").StyledComponent<import("@mui/material").ButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
76
+ ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
77
+ }, "children" | "style" | "className" | "classes" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "color" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "href" | "size" | "startIcon" | "variant"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
78
+ export declare const TypographyBtnText: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
79
+ ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
80
+ }, "fontFamily" | "children" | "p" | "style" | "fontSize" | "fontStyle" | "fontWeight" | "lineHeight" | "border" | "className" | "classes" | "sx" | "boxShadow" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxSizing" | "color" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "marginBlock" | "marginInline" | "overflow" | "padding" | "paddingBlock" | "paddingInline" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint" | "variant" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
@@ -0,0 +1,34 @@
1
+ /**
2
+ * Info Callout Component
3
+ * Displays helpful information or tips in a callout box
4
+ * Based on Figma design (node-id: 98-21866)
5
+ */
6
+ import * as React from 'react';
7
+ export interface InfoCalloutProps {
8
+ /**
9
+ * Title text for the callout
10
+ */
11
+ title?: string;
12
+ /**
13
+ * Main content text
14
+ */
15
+ children: React.ReactNode;
16
+ /**
17
+ * Optional format message function for i18n
18
+ */
19
+ formatMessage?: (descriptor: {
20
+ id: string;
21
+ defaultMessage?: string;
22
+ }) => string;
23
+ }
24
+ /**
25
+ * InfoCallout - Displays helpful information or tips
26
+ *
27
+ * @example
28
+ * ```tsx
29
+ * <InfoCallout title="Helpful tip">
30
+ * Many Malaysians aim for life protection that's at least 10–12 times their annual income
31
+ * </InfoCallout>
32
+ * ```
33
+ */
34
+ export declare function InfoCallout({ title, children, formatMessage, }: InfoCalloutProps): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,3 @@
1
+ export { InfoCallout } from './InfoCallout';
2
+ export type { InfoCalloutProps } from './InfoCallout';
3
+ export * from './styled';
@@ -0,0 +1,16 @@
1
+ /// <reference types="react" />
2
+ export declare const CalloutContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
3
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
4
+ }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
5
+ export declare const CalloutHeader: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
6
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
7
+ }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
8
+ export declare const CalloutIcon: import("@emotion/styled").StyledComponent<import("@mui/material").SvgIconOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").SVGProps<SVGSVGElement>, "ref"> & {
9
+ ref?: ((instance: SVGSVGElement | null) => void) | import("react").RefObject<SVGSVGElement> | null | undefined;
10
+ }, "children" | "style" | "fontSize" | "className" | "classes" | "sx" | "color" | "shapeRendering" | "viewBox" | "htmlColor" | "inheritViewBox" | "titleAccess"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
11
+ export declare const CalloutTitle: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
12
+ ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
13
+ }, "fontFamily" | "children" | "p" | "style" | "fontSize" | "fontStyle" | "fontWeight" | "lineHeight" | "border" | "className" | "classes" | "sx" | "boxShadow" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxSizing" | "color" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "marginBlock" | "marginInline" | "overflow" | "padding" | "paddingBlock" | "paddingInline" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint" | "variant" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
14
+ export declare const CalloutText: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
15
+ ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
16
+ }, "fontFamily" | "children" | "p" | "style" | "fontSize" | "fontStyle" | "fontWeight" | "lineHeight" | "border" | "className" | "classes" | "sx" | "boxShadow" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxSizing" | "color" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "marginBlock" | "marginInline" | "overflow" | "padding" | "paddingBlock" | "paddingInline" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint" | "variant" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
@@ -0,0 +1,60 @@
1
+ /**
2
+ * New Simplified Header Component
3
+ * Clean, minimal header with logo and menu based on Figma design
4
+ */
5
+ import * as React from 'react';
6
+ export interface NewHeaderNavigationLink {
7
+ key: string;
8
+ label: string;
9
+ onClick?: () => void;
10
+ }
11
+ export interface NewHeaderProps {
12
+ /**
13
+ * Logo image source (required)
14
+ */
15
+ logo?: string;
16
+ /**
17
+ * Navigation links for menu
18
+ */
19
+ navigationLinks?: NewHeaderNavigationLink[];
20
+ /**
21
+ * Additional menu sections (e.g., user profile, settings)
22
+ */
23
+ additionalMenuSections?: {
24
+ title?: string;
25
+ items: NewHeaderNavigationLink[];
26
+ }[];
27
+ /**
28
+ * Is mobile view (optional, auto-detected if not provided)
29
+ */
30
+ isMobile?: boolean;
31
+ /**
32
+ * Event handlers
33
+ */
34
+ onLogoClick?: () => void;
35
+ onMenuOpen?: () => void;
36
+ onMenuClose?: () => void;
37
+ /**
38
+ * Custom drawer content (overrides default menu)
39
+ */
40
+ customDrawerContent?: React.ReactNode;
41
+ /**
42
+ * Format message function for i18n
43
+ */
44
+ formatMessage?: (descriptor: {
45
+ id: string;
46
+ }) => string;
47
+ }
48
+ /**
49
+ * NewHeader component - simplified design based on Figma
50
+ *
51
+ * @example
52
+ * ```tsx
53
+ * <NewHeader
54
+ * logo={logoSrc}
55
+ * navigationLinks={navLinks}
56
+ * onLogoClick={() => history.push('/')}
57
+ * />
58
+ * ```
59
+ */
60
+ export declare function NewHeader({ logo: propLogo, navigationLinks, additionalMenuSections, isMobile: propIsMobile, onLogoClick, onMenuOpen, onMenuClose, customDrawerContent, formatMessage, }: NewHeaderProps): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,3 @@
1
+ export { NewHeader } from './NewHeader';
2
+ export type { NewHeaderProps, NewHeaderNavigationLink } from './NewHeader';
3
+ export * from './styled';
@@ -0,0 +1,26 @@
1
+ /// <reference types="react" />
2
+ export declare const StyledAppBar: import("@emotion/styled").StyledComponent<import("@mui/material").AppBarOwnProps & Omit<import("@mui/material").PaperOwnProps, "classes" | "color" | "position"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLElement>, HTMLElement>, "ref"> & {
3
+ ref?: ((instance: HTMLElement | null) => void) | import("react").RefObject<HTMLElement> | null | undefined;
4
+ }, "children" | "style" | "className" | "classes" | "sx" | "color" | "position" | "variant" | "square" | "elevation" | "enableColorOnDark"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
5
+ export declare const StyledToolbar: import("@emotion/styled").StyledComponent<import("@mui/material").ToolbarOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
6
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
7
+ }, "children" | "style" | "className" | "classes" | "sx" | "variant" | "disableGutters"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
8
+ export declare const LogoContainer: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
9
+ export declare const LogoImage: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
10
+ export declare const MenuIconButton: import("@emotion/styled").StyledComponent<import("@mui/material").IconButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
11
+ ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
12
+ }, "children" | "style" | "className" | "classes" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "color" | "disableFocusRipple" | "size" | "edge"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
13
+ export declare const StyledDrawer: import("@emotion/styled").StyledComponent<import("@mui/material").DrawerProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
14
+ export declare const DrawerHeader: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
15
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
16
+ }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
17
+ export declare const DrawerLogoContainer: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
18
+ export declare const CloseIconButton: import("@emotion/styled").StyledComponent<import("@mui/material").IconButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
19
+ ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
20
+ }, "children" | "style" | "className" | "classes" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "color" | "disableFocusRipple" | "size" | "edge"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
21
+ export declare const DrawerContent: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
22
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
23
+ }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
24
+ export declare const DrawerFooter: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
25
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
26
+ }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
@@ -0,0 +1,59 @@
1
+ /**
2
+ * OptionButton Component
3
+ * Selectable button option for forms and questionnaires
4
+ */
5
+ export interface OptionButtonProps {
6
+ /**
7
+ * Option value
8
+ */
9
+ value: string;
10
+ /**
11
+ * Option label/text
12
+ */
13
+ label: string;
14
+ /**
15
+ * Optional icon (emoji or image URL)
16
+ */
17
+ icon?: string;
18
+ /**
19
+ * Whether this option is selected
20
+ */
21
+ selected?: boolean;
22
+ /**
23
+ * Whether this option is disabled
24
+ */
25
+ disabled?: boolean;
26
+ /**
27
+ * Callback when option is clicked
28
+ */
29
+ onClick?: (value: string) => void;
30
+ /**
31
+ * Button size variant
32
+ */
33
+ size?: 'small' | 'medium' | 'large';
34
+ /**
35
+ * Full width button
36
+ */
37
+ fullWidth?: boolean;
38
+ /**
39
+ * Format message function for i18n
40
+ */
41
+ formatMessage?: (descriptor: {
42
+ id: string;
43
+ }) => string;
44
+ }
45
+ /**
46
+ * OptionButton - Selectable button for questionnaire options
47
+ *
48
+ * @example
49
+ * ```tsx
50
+ * <OptionButton
51
+ * value="option1"
52
+ * label="Option 1"
53
+ * icon="🎯"
54
+ * selected={selectedValue === 'option1'}
55
+ * onClick={(value) => setSelectedValue(value)}
56
+ * />
57
+ * ```
58
+ */
59
+ export declare function OptionButton({ value, label, icon, selected, disabled, onClick, size, fullWidth, formatMessage, }: OptionButtonProps): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,3 @@
1
+ export { OptionButton } from './OptionButton';
2
+ export type { OptionButtonProps } from './OptionButton';
3
+ export * from './styled';
@@ -0,0 +1,18 @@
1
+ /// <reference types="react" />
2
+ export declare const StyledOptionButton: import("@emotion/styled").StyledComponent<import("@mui/material").ButtonBaseOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
3
+ ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
4
+ }, "children" | "style" | "className" | "classes" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
5
+ selected?: boolean | undefined;
6
+ size?: "small" | "large" | "medium" | undefined;
7
+ fullWidth?: boolean | undefined;
8
+ }, {}, {}>;
9
+ export declare const OptionContent: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
10
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
11
+ }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
12
+ export declare const OptionIcon: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
13
+ export declare const OptionLabel: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
14
+ ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
15
+ }, "fontFamily" | "children" | "p" | "style" | "fontSize" | "fontStyle" | "fontWeight" | "lineHeight" | "border" | "className" | "classes" | "sx" | "boxShadow" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxSizing" | "color" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "marginBlock" | "marginInline" | "overflow" | "padding" | "paddingBlock" | "paddingInline" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint" | "variant" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
16
+ selected?: boolean | undefined;
17
+ disabled?: boolean | undefined;
18
+ }, {}, {}>;
@@ -0,0 +1,54 @@
1
+ /**
2
+ * Product Selection Drawer Component
3
+ * Mobile drawer for selecting insurance products
4
+ * Based on Figma design (node-id: 98-23206)
5
+ */
6
+ export interface Product {
7
+ /**
8
+ * Unique identifier for the product
9
+ */
10
+ id: string;
11
+ /**
12
+ * Display name of the product
13
+ */
14
+ name: string;
15
+ /**
16
+ * Type or category of the product (e.g., "Term Plan", "CI Plan")
17
+ */
18
+ type: string;
19
+ /**
20
+ * URL or path to the product logo
21
+ */
22
+ logo: string;
23
+ }
24
+ export interface ProductSelectionDrawerProps {
25
+ /**
26
+ * Whether the drawer is open
27
+ */
28
+ open: boolean;
29
+ /**
30
+ * Callback when drawer should close
31
+ */
32
+ onClose: () => void;
33
+ /**
34
+ * Array of products to display
35
+ */
36
+ products: Product[];
37
+ /**
38
+ * Callback when a product is selected
39
+ */
40
+ onProductSelect: (productId: string) => void;
41
+ /**
42
+ * Optional title text (defaults to "Select your product")
43
+ */
44
+ title?: string;
45
+ /**
46
+ * Optional subtitle text
47
+ */
48
+ subtitle?: string;
49
+ /**
50
+ * Optional custom text for the view plans button
51
+ */
52
+ viewPlansButtonText?: string;
53
+ }
54
+ export declare function ProductSelectionDrawer({ open, onClose, products, onProductSelect, title, subtitle, viewPlansButtonText, }: ProductSelectionDrawerProps): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,3 @@
1
+ export { ProductSelectionDrawer } from './ProductSelectionDrawer';
2
+ export type { Product, ProductSelectionDrawerProps } from './ProductSelectionDrawer';
3
+ export * from './styled';
@@ -0,0 +1,44 @@
1
+ /// <reference types="react" />
2
+ export declare const StyledDrawer: import("@emotion/styled").StyledComponent<import("@mui/material").DrawerProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
3
+ export declare const DrawerContent: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
4
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
5
+ }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
6
+ export declare const DrawerHeader: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
7
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
8
+ }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
9
+ export declare const CloseButtonContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
10
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
11
+ }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
12
+ export declare const Header: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
13
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
14
+ }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
15
+ export declare const HeaderTitle: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
16
+ ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
17
+ }, "fontFamily" | "children" | "p" | "style" | "fontSize" | "fontStyle" | "fontWeight" | "lineHeight" | "border" | "className" | "classes" | "sx" | "boxShadow" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxSizing" | "color" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "marginBlock" | "marginInline" | "overflow" | "padding" | "paddingBlock" | "paddingInline" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint" | "variant" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
18
+ export declare const HeaderSubtitle: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
19
+ ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
20
+ }, "fontFamily" | "children" | "p" | "style" | "fontSize" | "fontStyle" | "fontWeight" | "lineHeight" | "border" | "className" | "classes" | "sx" | "boxShadow" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxSizing" | "color" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "marginBlock" | "marginInline" | "overflow" | "padding" | "paddingBlock" | "paddingInline" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint" | "variant" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
21
+ export declare const ProductsContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
22
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
23
+ }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
24
+ export declare const ProductsGrid: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
25
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
26
+ }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
27
+ export declare const ProductCard: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
28
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
29
+ }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
30
+ export declare const ProductInfo: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
31
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
32
+ }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
33
+ export declare const ProductLogo: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
34
+ ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
35
+ }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
36
+ export declare const ProductName: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
37
+ ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
38
+ }, "fontFamily" | "children" | "p" | "style" | "fontSize" | "fontStyle" | "fontWeight" | "lineHeight" | "border" | "className" | "classes" | "sx" | "boxShadow" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxSizing" | "color" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "marginBlock" | "marginInline" | "overflow" | "padding" | "paddingBlock" | "paddingInline" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint" | "variant" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
39
+ export declare const ProductType: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
40
+ ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
41
+ }, "fontFamily" | "children" | "p" | "style" | "fontSize" | "fontStyle" | "fontWeight" | "lineHeight" | "border" | "className" | "classes" | "sx" | "boxShadow" | "zIndex" | "alignContent" | "alignItems" | "alignSelf" | "bottom" | "boxSizing" | "color" | "columnGap" | "display" | "flexBasis" | "flexDirection" | "flexGrow" | "flexShrink" | "flexWrap" | "gridAutoColumns" | "gridAutoFlow" | "gridAutoRows" | "gridTemplateAreas" | "gridTemplateColumns" | "gridTemplateRows" | "height" | "justifyContent" | "justifyItems" | "justifySelf" | "left" | "letterSpacing" | "marginBlockEnd" | "marginBlockStart" | "marginBottom" | "marginInlineEnd" | "marginInlineStart" | "marginLeft" | "marginRight" | "marginTop" | "maxHeight" | "maxWidth" | "minHeight" | "minWidth" | "order" | "paddingBlockEnd" | "paddingBlockStart" | "paddingBottom" | "paddingInlineEnd" | "paddingInlineStart" | "paddingLeft" | "paddingRight" | "paddingTop" | "position" | "right" | "rowGap" | "textAlign" | "textOverflow" | "textTransform" | "top" | "visibility" | "whiteSpace" | "width" | "borderBottom" | "borderColor" | "borderLeft" | "borderRadius" | "borderRight" | "borderTop" | "flex" | "gap" | "gridArea" | "gridColumn" | "gridRow" | "margin" | "marginBlock" | "marginInline" | "overflow" | "padding" | "paddingBlock" | "paddingInline" | "bgcolor" | "m" | "mt" | "mr" | "mb" | "ml" | "mx" | "marginX" | "my" | "marginY" | "pt" | "pr" | "pb" | "pl" | "px" | "paddingX" | "py" | "paddingY" | "typography" | "displayPrint" | "variant" | "align" | "gutterBottom" | "noWrap" | "paragraph" | "variantMapping"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
42
+ export declare const ViewPlansButton: import("@emotion/styled").StyledComponent<import("@mui/material").ButtonOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
43
+ ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
44
+ }, "children" | "style" | "className" | "classes" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "color" | "disableElevation" | "disableFocusRipple" | "endIcon" | "fullWidth" | "href" | "size" | "startIcon" | "variant"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
@@ -0,0 +1,71 @@
1
+ /**
2
+ * QuestionSection Component
3
+ * Displays a question with selectable options for recommendations
4
+ */
5
+ import * as React from 'react';
6
+ export interface QuestionOption {
7
+ value: string;
8
+ label: string;
9
+ icon?: string;
10
+ disabled?: boolean;
11
+ }
12
+ export interface QuestionSectionProps {
13
+ /**
14
+ * Question number (e.g., "1", "2", "3")
15
+ */
16
+ questionNumber?: string;
17
+ /**
18
+ * Question text
19
+ */
20
+ question: string;
21
+ /**
22
+ * Helper text below question
23
+ */
24
+ helperText?: string;
25
+ /**
26
+ * Available options
27
+ */
28
+ options: QuestionOption[];
29
+ /**
30
+ * Currently selected value
31
+ */
32
+ selectedValue?: string;
33
+ /**
34
+ * Callback when option is selected
35
+ */
36
+ onSelect?: (value: string) => void;
37
+ /**
38
+ * Multiple selection allowed
39
+ */
40
+ multiple?: boolean;
41
+ /**
42
+ * Selected values (for multiple selection)
43
+ */
44
+ selectedValues?: string[];
45
+ /**
46
+ * Custom option renderer
47
+ */
48
+ renderOption?: (option: QuestionOption, isSelected: boolean) => React.ReactNode;
49
+ /**
50
+ * Format message function for i18n
51
+ */
52
+ formatMessage?: (descriptor: {
53
+ id: string;
54
+ }) => string;
55
+ }
56
+ /**
57
+ * QuestionSection - Displays a question with selectable options
58
+ *
59
+ * @example
60
+ * ```tsx
61
+ * <QuestionSection
62
+ * questionNumber="1"
63
+ * question="Which plan feels right for you?"
64
+ * helperText="Select one option"
65
+ * options={planOptions}
66
+ * selectedValue={selectedPlan}
67
+ * onSelect={setSelectedPlan}
68
+ * />
69
+ * ```
70
+ */
71
+ export declare function QuestionSection({ questionNumber, question, helperText, options, selectedValue, onSelect, multiple, selectedValues, renderOption, formatMessage, }: QuestionSectionProps): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,3 @@
1
+ export { QuestionSection } from './QuestionSection';
2
+ export type { QuestionSectionProps, QuestionOption } from './QuestionSection';
3
+ export * from './styled';