@xo-union/tk-component-header-nav
Version:
99 lines • 5.32 kB
JavaScript
import React from "react";
import { getMediaApiEnv } from "@xo-union/tk-component-picture";
import { MegaMenu, FeaturedSection, LinkSection, FeaturedUnitCard, LinkColumn, MainCategoryLinkMenu, SubCategoryLink, SeeAllSubCategoryLink, MainCategoryPrimaryLink } from "../../MegaMenu/index.js";
import { useHeaderNavContext } from "../../Context.js";
import { layout4LinkColsAnd4SmallFeaturedUnits } from "../layouts.js";
const weddingDressesImageId = getMediaApiEnv() === 'production' ? 'b2a65f1a-e1d1-4df7-ab66-abfff88e0971' : '9ff03095-c88f-458b-b58e-aace89d23eef';
const engagementRingsImageId = getMediaApiEnv() === 'production' ? '52c54e3c-0c82-4fc5-9c7b-1c384e980b86' : 'd83ec348-1325-4d35-8270-35099a2bdcf6';
const suitsTuxesImageId = getMediaApiEnv() === 'production' ? 'd3f29d7e-29d1-40d2-a094-18578e00c8b3' : 'b7e3c826-22f1-4fed-b114-ba6090dda464';
const bridesmaidDressesImageId = getMediaApiEnv() === 'production' ? '90fa3460-cacc-42b4-b1de-38effb7afc48' : '7126c306-d040-4e4f-a586-56d155ef66a3';
const AttireRingsMegaMenu = () => {
const {
menuTypes,
links
} = useHeaderNavContext();
return /*#__PURE__*/React.createElement(MegaMenu, {
menuID: menuTypes.ATTIRE_RINGS,
containerProps: {
'data-trackable-context-group': 'fashion'
},
layout: layout4LinkColsAnd4SmallFeaturedUnits
}, /*#__PURE__*/React.createElement(LinkSection, {
headingContent: "Attire & Rings",
headingTextProps: {
href: links.ATTIRE_RINGS
}
}, /*#__PURE__*/React.createElement(LinkColumn, null, /*#__PURE__*/React.createElement(MainCategoryLinkMenu, {
id: "attire-rings-wedding-dresses",
headingContent: "Wedding dresses",
href: links.WEDDING_DRESSES,
menuID: menuTypes.ATTIRE_RINGS
}, /*#__PURE__*/React.createElement(SeeAllSubCategoryLink, {
href: links.WEDDING_DRESSES
}, "All wedding dresses"), /*#__PURE__*/React.createElement(SubCategoryLink, {
href: links.A_LINE_DRESSES
}, "A-line dresses"), /*#__PURE__*/React.createElement(SubCategoryLink, {
href: links.BALL_GOWN_DRESSES
}, "Ball gown dresses"), /*#__PURE__*/React.createElement(SubCategoryLink, {
href: links.MERMAID_DRESSES
}, "Mermaid dresses"), /*#__PURE__*/React.createElement(SubCategoryLink, {
href: links.SHEATH_DRESSES
}, "Sheath dresses"), /*#__PURE__*/React.createElement(SubCategoryLink, {
href: links.SHORT_DRESSES
}, "Short dresses"))), /*#__PURE__*/React.createElement(LinkColumn, null, /*#__PURE__*/React.createElement(MainCategoryPrimaryLink, {
href: links.SUITS_TUXEDOS
}, "Suits & tuxedos"), /*#__PURE__*/React.createElement(MainCategoryPrimaryLink, {
href: links.BRIDESMAID_DRESSES
}, "Bridesmaid dresses"), /*#__PURE__*/React.createElement(MainCategoryPrimaryLink, {
href: links.MOTHER_OF_THE_BRIDE_DRESSES
}, "Mother of the bride dresses"), /*#__PURE__*/React.createElement(MainCategoryPrimaryLink, {
href: links.FLOWER_GIRL_DRESSES
}, "Flower girl dresses and ring bearer outfits")), /*#__PURE__*/React.createElement(LinkColumn, null, /*#__PURE__*/React.createElement(MainCategoryLinkMenu, {
id: "attire-rings-engagement-rings",
headingContent: "Engagement rings",
href: links.ENGAGEMENT_RINGS
}, /*#__PURE__*/React.createElement(SeeAllSubCategoryLink, {
href: links.ENGAGEMENT_RINGS
}, "All engagement rings"), /*#__PURE__*/React.createElement(SubCategoryLink, {
href: links.PRINCESS_CUT
}, "Princess cut"), /*#__PURE__*/React.createElement(SubCategoryLink, {
href: links.ASSCHER_CUT
}, "Asscher cut"), /*#__PURE__*/React.createElement(SubCategoryLink, {
href: links.CUSHION_CUT
}, "Cushion cut"), /*#__PURE__*/React.createElement(SubCategoryLink, {
href: links.EMERALD_CUT
}, "Emerald cut"), /*#__PURE__*/React.createElement(SubCategoryLink, {
href: links.PEAR_CUT
}, "Pear cut"), /*#__PURE__*/React.createElement(SubCategoryLink, {
href: links.RADIANT_CUT
}, "Radiant cut"), /*#__PURE__*/React.createElement(SubCategoryLink, {
href: links.ROUND_CUT
}, "Round cut"), /*#__PURE__*/React.createElement(SubCategoryLink, {
href: links.OVAL_CUT
}, "Oval cut"))), /*#__PURE__*/React.createElement(LinkColumn, null, /*#__PURE__*/React.createElement(MainCategoryPrimaryLink, {
href: links.WEDDING_RINGS
}, "Wedding rings"), /*#__PURE__*/React.createElement(MainCategoryPrimaryLink, {
href: links.WEDDING_JEWELRY
}, "Wedding jewelry"), /*#__PURE__*/React.createElement(MainCategoryPrimaryLink, {
href: links.WEDDING_ACCESSORIES
}, "Wedding accessories"))), /*#__PURE__*/React.createElement(FeaturedSection, {
headingContent: "Get Fashion Inspiration"
}, /*#__PURE__*/React.createElement(FeaturedUnitCard, {
linkUrl: links.WEDDING_DRESSES,
imageId: weddingDressesImageId,
copy: "Wedding dresses"
}), /*#__PURE__*/React.createElement(FeaturedUnitCard, {
linkUrl: links.ENGAGEMENT_RINGS,
imageId: engagementRingsImageId,
copy: "Engagement rings"
}), /*#__PURE__*/React.createElement(FeaturedUnitCard, {
linkUrl: links.SUITS_TUXEDOS,
imageId: suitsTuxesImageId,
copy: "Suits & tuxedos"
}), /*#__PURE__*/React.createElement(FeaturedUnitCard, {
linkUrl: links.BRIDESMAID_DRESSES,
imageId: bridesmaidDressesImageId,
copy: "Bridesmaid dresses"
})));
};
export default AttireRingsMegaMenu;