{"version":3,"file":"3356-1d8df1295efc4e1285d9.js","mappings":"0SAUA,MAAMA,GAAYC,EAAAA,EAAAA,IAAOC,EAAAA,GAAV,oFAAGD,CAAH,mGAEGE,EAAAA,EAAAA,IAAM,EAAG,KAEhBC,EAAAA,EAAAA,IAAKC,EAAAA,GAAAA,cAILD,EAAAA,EAAAA,IAAKC,EAAAA,GAAAA,cAILD,EAAAA,EAAAA,IAAKC,EAAAA,GAAAA,UAIVC,EAAQL,EAAAA,GAAAA,GAAAA,WAAH,qEAAGA,CAAH,yCACPM,EAAAA,IAIOH,EAAAA,EAAAA,IAAKC,EAAAA,GAAAA,aACVG,EAAAA,EAAAA,QAAAA,QAGAC,EAAkBR,EAAAA,GAAAA,IAAAA,WAAH,+EAAGA,CAAH,sBAGfS,GAAQT,EAAAA,EAAAA,IAAOU,EAAAA,GAAV,gFAAGV,CAAH,sOACPD,EACEY,EAAAA,EAAAA,OAGOT,EAAAA,EAAAA,IAAM,GAAI,IAInBH,GA8CJ,EAR4B,CACxBA,YACAS,kBACAI,KApCSZ,EAAAA,GAAAA,GAAAA,WAAH,oEAAGA,CAAH,mLAGND,GAISI,EAAAA,EAAAA,IAAKC,EAAAA,GAAAA,cAILD,EAAAA,EAAAA,IAAKC,EAAAA,GAAAA,SA0BdK,QACAI,gBAtBoBb,EAAAA,GAAAA,IAAAA,WAAH,+EAAGA,CAAH,6JACjBD,EAIAA,GACUG,EAAAA,EAAAA,IAAM,GAAI,IAGpBY,EAAAA,EAAAA,UACaC,EAAAA,EAAAA,KAAAA,KAGbD,EAAAA,EAAAA,gBACaC,EAAAA,EAAAA,KAAAA,MASbV,SCzEJ,GAAeW,EAAAA,EAAAA,IAXQC,GACXC,EAAAA,cAAoBC,EAAAA,EAAc,CAAEC,WAAY,CAAEC,SAAU,IAAMC,KAAM,YAC5EJ,EAAAA,cAAoBK,EAAAA,EAAkB,CAAEC,cAAe,EAAGC,MAAOR,EAAMS,MAAMC,QACzET,EAAAA,cAAoBU,EAAAA,UAAa,CAAEC,GAAIZ,EAAMa,SAAU,YAAab,EAAMc,MACtEb,EAAAA,cAAoBU,EAAAA,MAAS,KAAMX,EAAMe,OACzCd,EAAAA,cAAoBU,EAAAA,gBAAmB,KACnCV,EAAAA,cAAoBU,EAAAA,MAAS,CAAEK,eAA+B,aAAfhB,EAAMc,MAAuBd,EAAMS,MAAMQ,KAAKC,GAAUjB,EAAAA,cAAoBU,EAAAA,KAAQ,CAAEQ,IAAKD,EAAKN,IAC3IX,EAAAA,cAAoBmB,EAAAA,EAAY,IAAKF,SAC7CjB,EAAAA,cAAoBU,EAAAA,gBAAmB,KACnCV,EAAAA,cAAoBoB,EAAAA,EAAY,W","sources":["webpack://lcci/./src/stories/Widgets/PeopleListing/PeopleListing.styles.ts","webpack://lcci/./src/stories/Widgets/PeopleListing/PeopleListing.tsx"],"sourcesContent":["import brand from '@helpers/brand';\r\nimport { fluid } from '@helpers/fluid';\r\nimport fonts from '@helpers/fonts';\r\nimport { Device, from } from '@helpers/media';\r\nimport { h4 } from '@helpers/typography';\r\nimport MotionTrack from '@stories/Components/Carousels/Carousel/MotionTrack/MotionTrack';\r\nimport MotionTrackStyles from '@stories/Components/Carousels/Carousel/MotionTrack/MotionTrack.styles';\r\nimport PaginationStyles from '@stories/Components/Carousels/Carousel/Pagination/Pagination.styles';\r\nimport SectionWrapper from '@stories/Components/Misc/SectionWrapper/SectionWrapper';\r\nimport styled from 'styled-components';\r\nconst Container = styled(SectionWrapper) `\r\n  --items: 1;\r\n  --itemGutter: ${fluid(8, 16)};\r\n\r\n  @media ${from(Device.MobileLarge)} {\r\n    --items: 2;\r\n  }\r\n\r\n  @media ${from(Device.TabletLarge)} {\r\n    --items: 3;\r\n  }\r\n\r\n  @media ${from(Device.Desktop)} {\r\n    --items: 4;\r\n  }\r\n`;\r\nconst Title = styled.h2 `\r\n  ${h4};\r\n\r\n  margin: 0 0 32px;\r\n\r\n  @media ${from(Device.TabletLarge)} {\r\n    ${fonts.apparat.medium};\r\n  }\r\n`;\r\nconst CarouselWrapper = styled.div `\r\n  overflow: hidden;\r\n`;\r\nconst Track = styled(MotionTrack) `\r\n  ${Container}[data-type='listing'] & {\r\n    ${MotionTrackStyles.Track} {\r\n      display: grid;\r\n      grid-template-columns: repeat(var(--items), 1fr);\r\n      gap: ${fluid(32, 90)} var(--itemGutter);\r\n    }\r\n  }\r\n\r\n  ${Container}[data-type='carousel'] & {\r\n    width: calc(100% + var(--itemGutter));\r\n    margin: 0 calc(var(--itemGutter) * -0.5);\r\n  }\r\n`;\r\nconst Item = styled.li `\r\n  height: 100%;\r\n\r\n  ${Container}[data-type='carousel'] & {\r\n    flex: 0 0 90%;\r\n    padding: 0 calc(var(--itemGutter) * 0.5) 5px;\r\n\r\n    @media ${from(Device.MobileLarge)} {\r\n      flex: 0 0 calc(100% / var(--items));\r\n    }\r\n\r\n    @media ${from(Device.Tablet)} {\r\n      padding-bottom: 0;\r\n    }\r\n  }\r\n`;\r\nconst ControlsWrapper = styled.div `\r\n  ${Container}[data-type='listing'] & {\r\n    display: none;\r\n  }\r\n\r\n  ${Container}[data-type='carousel'] & {\r\n    margin: ${fluid(27, 40)} calc(var(--itemGutter) * -0.5) 0;\r\n  }\r\n\r\n  ${PaginationStyles.Container} {\r\n    --bgColor: ${brand.base.blue};\r\n  }\r\n\r\n  ${PaginationStyles.ControlsWrapper} {\r\n    --fgColor: ${brand.base.blue};\r\n  }\r\n`;\r\nconst PeopleListingStyles = {\r\n    Container,\r\n    CarouselWrapper,\r\n    Item,\r\n    Track,\r\n    ControlsWrapper,\r\n    Title,\r\n};\r\nexport default PeopleListingStyles;\r\n","import { withMotionMax } from '@hoc/withMotionMax';\r\nimport PeopleCard from '@stories/Components/Cards/PeopleCard/PeopleCard';\r\nimport CarouselProvider from '@stories/Components/Carousels/Carousel/CarouselProvider/CarouselProvider';\r\nimport Pagination from '@stories/Components/Carousels/Carousel/Pagination/Pagination';\r\nimport { MotionConfig } from 'framer-motion';\r\nimport * as React from 'react';\r\nimport S from './PeopleListing.styles';\r\nconst PeopleListing = (props) => {\r\n    return (React.createElement(MotionConfig, { transition: { duration: 0.35, ease: 'easeOut' } },\r\n        React.createElement(CarouselProvider, { paddingOffset: 0, count: props.items.length },\r\n            React.createElement(S.Container, { id: props.anchorId, \"data-type\": props.type },\r\n                React.createElement(S.Title, null, props.title),\r\n                React.createElement(S.CarouselWrapper, null,\r\n                    React.createElement(S.Track, { enableCarousel: props.type === 'carousel' }, props.items.map((item) => (React.createElement(S.Item, { key: item.id },\r\n                        React.createElement(PeopleCard, { ...item })))))),\r\n                React.createElement(S.ControlsWrapper, null,\r\n                    React.createElement(Pagination, null))))));\r\n};\r\nexport default withMotionMax(PeopleListing);\r\n"],"names":["Container","styled","SectionWrapper","fluid","from","Device","Title","h4","fonts","CarouselWrapper","Track","MotionTrack","MotionTrackStyles","Item","ControlsWrapper","PaginationStyles","brand","withMotionMax","props","React","MotionConfig","transition","duration","ease","CarouselProvider","paddingOffset","count","items","length","S","id","anchorId","type","title","enableCarousel","map","item","key","PeopleCard","Pagination"],"sourceRoot":""}