igloo-d2c-components 1.0.20 → 1.0.22

package/dist/types/components/CheckoutFormButton/CheckoutFormButton.d.ts

@@ -35,5 +35,14 @@ export interface CheckoutFormButtonProps {
      * Whether the button is in loading state
      */
     loading?: boolean;
+    /**
+     * Enable desktop right-aligned layout
+     * When true, button is right-aligned on desktop with specified width
+     */
+    desktopRightAligned?: boolean;
+    /**
+     * Desktop button width (default: '180px')
+     */
+    desktopWidth?: string;
 }
 export declare const CheckoutFormButton: React.FC<CheckoutFormButtonProps>;

package/dist/types/components/CheckoutFormButton/styled.d.ts

@@ -3,7 +3,9 @@ export declare const ButtonContainer: import("@emotion/styled").StyledComponent<
     ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
 }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
     isFixed?: boolean | undefined;
+    desktopRightAligned?: boolean | undefined;
 }, {}, {}>;
 export declare const StyledButton: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
     isDisabled?: boolean | undefined;
+    desktopWidth?: string | undefined;
 }, import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, {}>;

package/dist/types/components/ChildInformationForm/ChildInformationForm.d.ts

@@ -48,5 +48,9 @@ export interface ChildInformationFormProps {
      * Optional custom styles
      */
     sx?: any;
+    /**
+     * Enable desktop grid layout (2 columns, max-width 938px)
+     */
+    desktopGridLayout?: boolean;
 }
 export declare const ChildInformationForm: React.FC<ChildInformationFormProps>;

package/dist/types/components/ChildInformationForm/styled.d.ts

@@ -2,3 +2,21 @@
 export declare const FormContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
 }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+/**
+ * Desktop form container - constrains content to 938px max-width and centers it
+ */
+export declare const DesktopFormContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+/**
+ * Fields grid container - displays fields in 2-column grid on desktop
+ */
+export declare const FieldsGridContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+/**
+ * Full width field - spans both columns on desktop grid
+ */
+export declare const FullWidthField: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

package/dist/types/components/ContactDetailsForm/ContactDetailsForm.d.ts

@@ -70,5 +70,9 @@ export interface ContactDetailsFormProps {
      * Optional custom styles
      */
     sx?: any;
+    /**
+     * Enable desktop grid layout (2 columns, max-width 938px)
+     */
+    desktopGridLayout?: boolean;
 }
 export declare const ContactDetailsForm: React.FC<ContactDetailsFormProps>;

package/dist/types/components/ContactDetailsForm/styled.d.ts

@@ -2,6 +2,24 @@
 export declare const FormContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
 }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+/**
+ * Desktop form container - constrains content to 938px max-width and centers it
+ */
+export declare const DesktopFormContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+/**
+ * Fields grid container - displays fields in 2-column grid on desktop
+ */
+export declare const FieldsGridContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+/**
+ * Full width field - spans both columns on desktop grid
+ */
+export declare const FullWidthField: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
 export declare const CheckboxContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
 }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

package/dist/types/components/CoverageAmountSlider/styled.d.ts

@@ -41,7 +41,7 @@ export declare const RangeLabel: import("@emotion/styled").StyledComponent<impor
 }, "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>, {}, {}>;
 export declare const StyledMuiSlider: import("@emotion/styled").StyledComponent<import("@mui/material").SliderOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
     ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
-}, "value" | "style" | "track" | "className" | "classes" | "disabled" | "sx" | "tabIndex" | "color" | "scale" | "size" | "name" | "defaultValue" | "aria-label" | "aria-labelledby" | "aria-valuetext" | "onChange" | "max" | "min" | "orientation" | "step" | "components" | "slots" | "slotProps" | "componentsProps" | "disableSwap" | "getAriaLabel" | "getAriaValueText" | "marks" | "onChangeCommitted" | "shiftStep" | "valueLabelDisplay" | "valueLabelFormat"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
+}, "value" | "style" | "track" | "className" | "classes" | "disabled" | "sx" | "tabIndex" | "color" | "scale" | "size" | "name" | "defaultValue" | "aria-label" | "aria-labelledby" | "aria-valuetext" | "onChange" | "max" | "min" | "orientation" | "step" | "components" | "componentsProps" | "slots" | "slotProps" | "disableSwap" | "getAriaLabel" | "getAriaValueText" | "marks" | "onChangeCommitted" | "shiftStep" | "valueLabelDisplay" | "valueLabelFormat"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {
     sliderActiveColor?: string | undefined;
     sliderInactiveColor?: string | undefined;
 }, {}, {}>;

package/dist/types/components/DesktopHeaderMenuBar/DesktopHeaderMenuBar.d.ts

@@ -0,0 +1,38 @@
+/**
+ * Desktop Header Menu Bar Component
+ * Based on Figma Design: Tech-Solution-V1.0 (node 1581-22604)
+ *
+ * A desktop-only header menu bar with logo, navigation items with dropdowns,
+ * and a login button.
+ *
+ * Usage:
+ * ```tsx
+ * <DesktopHeaderMenuBar
+ *   logo={logoSrc}
+ *   menuItems={[
+ *     { key: 'family', label: 'Family', hasDropdown: true, subItems: [...] },
+ *     { key: 'health', label: 'Health', hasDropdown: true, subItems: [...] },
+ *   ]}
+ *   onLogoClick={() => navigate('/')}
+ *   onLoginClick={() => setShowLoginModal(true)}
+ * />
+ * ```
+ */
+import { DesktopHeaderMenuBarProps } from './types';
+/**
+ * DesktopHeaderMenuBar Component
+ *
+ * A responsive desktop header with navigation menu items and dropdown support.
+ *
+ * @param logo - Logo image source URL
+ * @param logoAlt - Alt text for the logo image
+ * @param menuItems - Array of menu items to display
+ * @param showLoginButton - Whether to show the login button (default: true)
+ * @param loginButtonText - Text for the login button (default: 'Log in')
+ * @param onLogoClick - Handler for logo click
+ * @param onLoginClick - Handler for login button click
+ * @param formatMessage - i18n function for translations
+ */
+declare function DesktopHeaderMenuBar({ logo, logoAlt, menuItems, showLoginButton, loginButtonText, onLogoClick, onLoginClick, formatMessage, className, }: DesktopHeaderMenuBarProps): import("react/jsx-runtime").JSX.Element;
+export default DesktopHeaderMenuBar;
+export { DesktopHeaderMenuBar };

package/dist/types/components/DesktopHeaderMenuBar/index.d.ts

@@ -0,0 +1,6 @@
+/**
+ * Desktop Header Menu Bar Component
+ * Based on Figma Design: Tech-Solution-V1.0 (node 1581-22604)
+ */
+export { default, DesktopHeaderMenuBar } from './DesktopHeaderMenuBar';
+export type { DesktopHeaderMenuBarProps, MenuItemWithDropdown, SubMenuItem, } from './types';

package/dist/types/components/DesktopHeaderMenuBar/styled.d.ts

@@ -0,0 +1,89 @@
+/**
+ * Styled components for Desktop Header Menu Bar
+ * Based on Figma Design: Tech-Solution-V1.0 (node 1581-22604)
+ */
+/// <reference types="react" />
+/**
+ * Main AppBar container
+ * Height: 80px, white background, centered content
+ */
+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"> & {
+    ref?: ((instance: HTMLElement | null) => void) | import("react").RefObject<HTMLElement> | null | undefined;
+}, "children" | "style" | "className" | "classes" | "sx" | "color" | "position" | "variant" | "square" | "elevation" | "enableColorOnDark"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+/**
+ * Inner container with max-width constraint
+ * Max-width: 1128px, centered
+ */
+export declare const HeaderContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+/**
+ * Left section containing logo and menu items
+ */
+export declare const LeftSection: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+/**
+ * Logo container
+ */
+export declare const LogoContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+/**
+ * Logo image
+ * Width: 126px, height: auto
+ */
+export declare const LogoImage: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;
+/**
+ * Navigation menu container
+ */
+export declare const NavMenu: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+/**
+ * Individual menu item button
+ * Font: MetLife Circular Bold, 18px
+ */
+export declare const MenuItemButton: 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"> & {
+    ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
+}, "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>, {}, {}>;
+/**
+ * Menu item text
+ */
+export declare const MenuItemText: import("@emotion/styled").StyledComponent<import("@mui/material").TypographyOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, "ref"> & {
+    ref?: ((instance: HTMLSpanElement | null) => void) | import("react").RefObject<HTMLSpanElement> | null | undefined;
+}, "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>, {}, {}>;
+/**
+ * Dropdown arrow icon
+ * Size: 24px
+ */
+export declare const DropdownIcon: import("@emotion/styled").StyledComponent<import("@mui/material").SvgIconOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").SVGProps<SVGSVGElement>, "ref"> & {
+    ref?: ((instance: SVGSVGElement | null) => void) | import("react").RefObject<SVGSVGElement> | null | undefined;
+}, "children" | "style" | "fontSize" | "className" | "classes" | "sx" | "color" | "shapeRendering" | "viewBox" | "htmlColor" | "inheritViewBox" | "titleAccess"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+/**
+ * Right section containing login button
+ */
+export declare const RightSection: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+/**
+ * Login button (text style)
+ * Based on Figma: Style=Text, State=enabled, Show Icon=False
+ */
+export declare const LoginButton: 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"> & {
+    ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
+}, "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>, {}, {}>;
+/**
+ * Dropdown menu container
+ */
+export declare const StyledMenu: import("@emotion/styled").StyledComponent<import("@mui/material").MenuProps & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+/**
+ * Dropdown menu item
+ */
+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"> & {
+    ref?: ((instance: HTMLLIElement | null) => void) | import("react").RefObject<HTMLLIElement> | null | undefined;
+}, "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>, {}, {}>;
+/**
+ * Menu item icon
+ */
+export declare const MenuItemIcon: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").ImgHTMLAttributes<HTMLImageElement>, HTMLImageElement>, {}>;

package/dist/types/components/DesktopHeaderMenuBar/types.d.ts

@@ -0,0 +1,92 @@
+/**
+ * Types for Desktop Header Menu Bar Component
+ * Based on Figma Design: Tech-Solution-V1.0 (node 1581-22604)
+ */
+export interface MenuItemWithDropdown {
+    /**
+     * Unique identifier for the menu item
+     */
+    key: string;
+    /**
+     * Display label for the menu item
+     */
+    label: string;
+    /**
+     * Whether this item has a dropdown menu
+     */
+    hasDropdown?: boolean;
+    /**
+     * Sub-menu items (if hasDropdown is true)
+     */
+    subItems?: SubMenuItem[];
+    /**
+     * Click handler for the menu item
+     */
+    onClick?: () => void;
+    /**
+     * URL for navigation (optional)
+     */
+    href?: string;
+}
+export interface SubMenuItem {
+    /**
+     * Unique identifier for the sub-menu item
+     */
+    key: string;
+    /**
+     * Display label for the sub-menu item
+     */
+    label: string;
+    /**
+     * Icon source URL (optional)
+     */
+    icon?: string;
+    /**
+     * Click handler for the sub-menu item
+     */
+    onClick?: () => void;
+    /**
+     * URL for navigation (optional)
+     */
+    href?: string;
+}
+export interface DesktopHeaderMenuBarProps {
+    /**
+     * Logo image source
+     */
+    logo: string;
+    /**
+     * Logo alt text
+     */
+    logoAlt?: string;
+    /**
+     * Menu items to display in the header
+     */
+    menuItems: MenuItemWithDropdown[];
+    /**
+     * Whether to show the login button
+     */
+    showLoginButton?: boolean;
+    /**
+     * Login button text
+     */
+    loginButtonText?: string;
+    /**
+     * Logo click handler
+     */
+    onLogoClick?: () => void;
+    /**
+     * Login button click handler
+     */
+    onLoginClick?: () => void;
+    /**
+     * Format message function for i18n
+     */
+    formatMessage?: (descriptor: {
+        id: string;
+    }) => string;
+    /**
+     * Custom class name for the container
+     */
+    className?: string;
+}

package/dist/types/components/FAQAccordion/styled.d.ts

@@ -24,7 +24,7 @@ export declare const StyledAccordion: import("@emotion/styled").StyledComponent<
     TransitionProps?: import("@mui/material/transitions").TransitionProps | undefined;
 } & import("@mui/material").AccordionSlotsAndSlotProps & Omit<import("@mui/material").PaperOwnProps, "classes" | "onChange"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}, "children" | keyof import("@mui/material/OverridableComponent").CommonProps | "disabled" | "sx" | "variant" | "onChange" | "expanded" | "square" | "elevation" | "disableGutters" | "TransitionComponent" | "TransitionProps" | "defaultExpanded" | keyof import("@mui/material").AccordionSlotsAndSlotProps> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+}, "children" | keyof import("@mui/material/OverridableComponent").CommonProps | "disabled" | "sx" | "variant" | "onChange" | "expanded" | "square" | "elevation" | "TransitionComponent" | "TransitionProps" | "disableGutters" | "defaultExpanded" | keyof import("@mui/material").AccordionSlotsAndSlotProps> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
 export declare const StyledAccordionSummary: import("@emotion/styled").StyledComponent<import("@mui/material").AccordionSummaryOwnProps & Omit<import("@mui/material").ButtonBaseOwnProps, "classes"> & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
 }, "children" | "style" | "className" | "classes" | "action" | "centerRipple" | "disabled" | "disableRipple" | "disableTouchRipple" | "focusRipple" | "focusVisibleClassName" | "LinkComponent" | "onFocusVisible" | "sx" | "tabIndex" | "TouchRippleProps" | "touchRippleRef" | "expandIcon"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

package/dist/types/components/Header/Header.d.ts

@@ -10,6 +10,22 @@ export interface NavigationLink {
     link?: string;
     badge?: string;
 }
+/**
+ * Desktop menu item with dropdown support
+ * Based on Figma Design: Tech-Solution-V1.0 (node 1581-22604)
+ */
+export interface DesktopMenuItem {
+    key: string;
+    label: string;
+    hasDropdown?: boolean;
+    subItems?: {
+        key: string;
+        label: string;
+        icon?: string;
+        onClick?: () => void;
+    }[];
+    onClick?: () => void;
+}
 export interface LanguageOption {
     value: string;
     locale: string;
@@ -140,6 +156,16 @@ export interface HeaderProps {
      * User profile component
      */
     userProfileComponent?: React.ReactNode;
+    /**
+     * Enable new desktop menu layout (based on Figma 1581-22604)
+     * When true, uses individual menu items instead of Products dropdown
+     */
+    useNewDesktopLayout?: boolean;
+    /**
+     * Desktop menu items for new layout
+     * Only used when useNewDesktopLayout is true
+     */
+    desktopMenuItems?: DesktopMenuItem[];
 }
 /**
  * Header component with tenant theme support and responsive navigation
@@ -156,4 +182,4 @@ export interface HeaderProps {
  * />
  * ```
  */
-export declare function Header({ logo, alternateLogo, showAlternateLogo, navigationLinks, languages, currentLocale, currentLang, userToken, userFirstName, isMobile: propIsMobile, scrolled, isPartnershipPageMobileView, isPartnershipPagePCView, isSeoPageView, showGetQuoteButton, bannerData, ctaData, host, welcomeMessage, formatMessage, menuItems, userProfileComponent, onLogoClick, onProductMenuClick, onLanguageChange, onLoginClick, onSignupClick, onLogoutClick, onPartnershipClick, onAboutUsClick, onBlogClick, onMyProfileClick, onGetQuoteClick, onPartnershipCTAClick, }: HeaderProps): import("react/jsx-runtime").JSX.Element;
+export declare function Header({ logo, alternateLogo, showAlternateLogo, navigationLinks, languages, currentLocale, currentLang, userToken, userFirstName, isMobile: propIsMobile, scrolled, isPartnershipPageMobileView, isPartnershipPagePCView, isSeoPageView, showGetQuoteButton, bannerData, ctaData, host, welcomeMessage, formatMessage, menuItems, userProfileComponent, onLogoClick, onProductMenuClick, onLanguageChange, onLoginClick, onSignupClick, onLogoutClick, onPartnershipClick, onAboutUsClick, onBlogClick, onMyProfileClick, onGetQuoteClick, onPartnershipCTAClick, useNewDesktopLayout, desktopMenuItems, }: HeaderProps): import("react/jsx-runtime").JSX.Element;

package/dist/types/components/Header/index.d.ts

@@ -1,3 +1,3 @@
 export { Header } from './Header';
-export type { HeaderProps, NavigationLink, LanguageOption } from './Header';
+export type { HeaderProps, NavigationLink, LanguageOption, DesktopMenuItem } from './Header';
 export * from './styled';

package/dist/types/components/Header/styled.d.ts

@@ -21,7 +21,7 @@ export declare const ButtonDesktopMenu: import("@emotion/styled").StyledComponen
 export declare const AnchorLinks: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, {}>;
 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"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}, "children" | "style" | "className" | "classes" | "sx" | "variant" | "sizes" | "alt" | "src" | "srcSet" | "imgProps" | "slots" | "slotProps"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+}, "children" | "style" | "className" | "classes" | "sx" | "variant" | "sizes" | "alt" | "src" | "srcSet" | "slots" | "slotProps" | "imgProps"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
 export declare const DivButtonWrapper: import("@emotion/styled").StyledComponent<import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
 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"> & {
     ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
@@ -44,7 +44,7 @@ export declare const StyledCloseIcon: import("@emotion/styled").StyledComponent<
 }, "children" | "style" | "fontSize" | "className" | "classes" | "sx" | "color" | "shapeRendering" | "viewBox" | "htmlColor" | "inheritViewBox" | "titleAccess"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
 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"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
-}, "children" | "style" | "className" | "classes" | "sx" | "variant" | "sizes" | "alt" | "src" | "srcSet" | "imgProps" | "slots" | "slotProps"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+}, "children" | "style" | "className" | "classes" | "sx" | "variant" | "sizes" | "alt" | "src" | "srcSet" | "slots" | "slotProps" | "imgProps"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
 export declare const StyledMenuIcon: import("@emotion/styled").StyledComponent<import("@mui/material").SvgIconOwnProps & import("@mui/material/OverridableComponent").CommonProps & Omit<Omit<import("react").SVGProps<SVGSVGElement>, "ref"> & {
     ref?: ((instance: SVGSVGElement | null) => void) | import("react").RefObject<SVGSVGElement> | null | undefined;
 }, "children" | "style" | "fontSize" | "className" | "classes" | "sx" | "color" | "shapeRendering" | "viewBox" | "htmlColor" | "inheritViewBox" | "titleAccess"> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme> & {

package/dist/types/components/HealthInformationForm/HealthInformationForm.d.ts

@@ -77,5 +77,9 @@ export interface HealthInformationFormProps {
      * Optional custom styles
      */
     sx?: any;
+    /**
+     * Enable desktop grid layout (2 columns for measurements, max-width 938px)
+     */
+    desktopGridLayout?: boolean;
 }
 export declare const HealthInformationForm: React.FC<HealthInformationFormProps>;

package/dist/types/components/HealthInformationForm/styled.d.ts

@@ -2,3 +2,15 @@
 export declare const FormContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
 }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+/**
+ * Desktop form container - constrains content to 938px max-width and centers it
+ */
+export declare const DesktopFormContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+/**
+ * Measurement fields grid - displays weight and height side by side on desktop
+ */
+export declare const MeasurementFieldsGrid: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

package/dist/types/components/PersonalInformationForm/PersonalInformationForm.d.ts

@@ -71,5 +71,9 @@ export interface PersonalInformationFormProps {
      * Optional custom styles
      */
     sx?: any;
+    /**
+     * Enable desktop grid layout (2 columns, max-width 938px)
+     */
+    desktopGridLayout?: boolean;
 }
 export declare const PersonalInformationForm: React.FC<PersonalInformationFormProps>;

package/dist/types/components/PersonalInformationForm/styled.d.ts

@@ -2,6 +2,24 @@
 export declare const FormContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
 }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+/**
+ * Desktop form container - constrains content to 938px max-width and centers it
+ */
+export declare const DesktopFormContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+/**
+ * Fields grid container - displays fields in 2-column grid on desktop
+ */
+export declare const FieldsGridContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
+/**
+ * Full width field - spans both columns on desktop grid
+ */
+export declare const FullWidthField: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+    ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
+}, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;
 export declare const CheckboxContainer: import("@emotion/styled").StyledComponent<import("@mui/system").BoxOwnProps<import("@mui/material").Theme> & Omit<Omit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
     ref?: ((instance: HTMLDivElement | null) => void) | import("react").RefObject<HTMLDivElement> | null | undefined;
 }, keyof import("@mui/system").BoxOwnProps<import("@mui/material").Theme>> & import("@mui/system").MUIStyledCommonProps<import("@mui/material").Theme>, {}, {}>;

package/dist/types/index.d.ts

@@ -15,9 +15,11 @@ export type { CardProps } from './components/Card';
 export { Banner } from './components/Banner';
 export type { BannerProps } from './components/Banner';
 export { Header } from './components/Header';
-export type { HeaderProps, LanguageOption, NavigationLink } from './components/Header';
+export type { DesktopMenuItem, HeaderProps, LanguageOption, NavigationLink } from './components/Header';
 export { NewHeader } from './components/NewHeader';
 export type { NewHeaderNavigationLink, NewHeaderProps } from './components/NewHeader';
+export { DesktopHeaderMenuBar } from './components/DesktopHeaderMenuBar';
+export type { DesktopHeaderMenuBarProps, MenuItemWithDropdown, SubMenuItem, } from './components/DesktopHeaderMenuBar';
 export { Footer } from './components/Footer';
 export type { FooterLicenseImage, FooterNavigationLink, FooterProps, SocialLink } from './components/Footer';
 export { RecommendationsDrawer } from './components/RecommendationsDrawer';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "igloo-d2c-components",
-  "version": "1.0.20",
+  "version": "1.0.22",
   "description": "Reusable component library with tenant-aware theming for B2C applications",
   "main": "dist/cjs/index.js",
   "module": "dist/esm/index.js",