@axos-web-dev/shared-components 0.0.1 → 0.0.2
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.
- package/README.md +42 -0
- package/dist/Accordion/Accordion.js +0 -1
- package/dist/Accordion/Accordion.js.map +1 -1
- package/dist/AlertBanner/index.js +0 -1
- package/dist/AlertBanner/index.js.map +1 -1
- package/dist/BulletItem/BulletItem.js +0 -1
- package/dist/BulletItem/BulletItem.js.map +1 -1
- package/dist/Carousel/index.js +0 -1
- package/dist/Carousel/index.js.map +1 -1
- package/dist/CollectInformationAlert/index.js +0 -1
- package/dist/CollectInformationAlert/index.js.map +1 -1
- package/dist/FaqAccordion/index.js +0 -1
- package/dist/FaqAccordion/index.js.map +1 -1
- package/dist/ImageBillboard/ImageBillboard.css.js +1 -0
- package/dist/ImageBillboard/ImageBillboard.css.js.map +1 -1
- package/dist/ImageBillboard/index.js +0 -1
- package/dist/ImageBillboard/index.js.map +1 -1
- package/dist/Modal/index.js +0 -1
- package/dist/Modal/index.js.map +1 -1
- package/dist/icons/DownloadIcon/DownloadIcon.css.js +0 -1
- package/dist/icons/DownloadIcon/DownloadIcon.css.js.map +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,3 +1,39 @@
|
|
|
1
|
+
# Installation
|
|
2
|
+
|
|
3
|
+
Using npm:
|
|
4
|
+
|
|
5
|
+
```shell
|
|
6
|
+
$ npm install @axos-web-dev/shared-components
|
|
7
|
+
```
|
|
8
|
+
To import components
|
|
9
|
+
In Node.js:
|
|
10
|
+
|
|
11
|
+
```js
|
|
12
|
+
// Import Components
|
|
13
|
+
import {
|
|
14
|
+
AlertBanner,
|
|
15
|
+
CallToActionBar,
|
|
16
|
+
DownloadTile,
|
|
17
|
+
ImageBillboard,
|
|
18
|
+
SecondaryFooter,
|
|
19
|
+
} from "@axos-web-dev/shared-components";
|
|
20
|
+
|
|
21
|
+
// Import Types/Interfaces
|
|
22
|
+
|
|
23
|
+
import {
|
|
24
|
+
AlertBannerInterface
|
|
25
|
+
} from "@axos-web-dev/shared-components/dist/AlertBanner/AlertBanner.interface";
|
|
26
|
+
|
|
27
|
+
```
|
|
28
|
+
|
|
29
|
+
In css files:
|
|
30
|
+
```css
|
|
31
|
+
/*** Import styles ***/
|
|
32
|
+
|
|
33
|
+
@import "@axos-web-dev/shared-components/dist/assets/AlertBanner/AlertBanner.css";
|
|
34
|
+
|
|
35
|
+
```
|
|
36
|
+
|
|
1
37
|
# Shared components
|
|
2
38
|
|
|
3
39
|
This project is develop using `React + TypeScript + Vite + Storybook + Vanilla-extract` to building custom components for internal use.
|
|
@@ -68,3 +104,9 @@ Then you will need to login into npm to do that write:
|
|
|
68
104
|
```shell
|
|
69
105
|
npm login --scope@my-org
|
|
70
106
|
```
|
|
107
|
+
|
|
108
|
+
Last you to publish the new version:
|
|
109
|
+
|
|
110
|
+
```shell
|
|
111
|
+
npm publish
|
|
112
|
+
```
|
|
@@ -3,7 +3,6 @@ import { jsxs, jsx } from "react/jsx-runtime";
|
|
|
3
3
|
import "../icons/CheckIcon/CheckIcon.css.js";
|
|
4
4
|
import SvgChevronDown from "../icons/ChevronDown.js";
|
|
5
5
|
import SvgChevronUp from "../icons/ChevronUp.js";
|
|
6
|
-
import "../themes/vars.css.ts.vanilla.css.js";
|
|
7
6
|
/* empty css */
|
|
8
7
|
import clsx from "clsx";
|
|
9
8
|
import React, { createContext, useContext, useState } from "react";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Accordion.js","sources":["../../lib/Accordion/Accordion.tsx"],"sourcesContent":["\"use client\";\n\nimport { ChevronDown, ChevronUp } from \"@lib/icons\";\nimport clsx from \"clsx\";\nimport React, {\n PropsWithChildren,\n createContext,\n useContext,\n useState,\n} from \"react\";\nimport {\n accordion,\n body,\n header,\n headerContent,\n hide,\n icon,\n paragraph,\n} from \"./Accordion.css\";\n\nexport type Accordion = {\n expanded?: boolean;\n};\n\nexport const AccordionCtx = createContext({\n isOpen: false,\n onclick: () => {},\n});\n\nexport const AccordionHeader = (props: PropsWithChildren) => {\n const { children } = props;\n const { isOpen, onclick } = useContext(AccordionCtx);\n return (\n <div className={clsx(header())} onClick={onclick}>\n <p className={clsx(headerContent)}>{children}</p>\n <div className={icon}>{isOpen ? <ChevronDown /> : <ChevronUp />}</div>\n </div>\n );\n};\n\nexport const AccordionDetails = ({ children }: PropsWithChildren) => {\n return <div>{children}</div>;\n};\n\nexport const Accordion = (props: Accordion & PropsWithChildren) => {\n const { expanded = false, children: childrenProps } = props;\n const [isOpen, setIsOpen] = useState(expanded);\n const [header, ...children] = React.Children.toArray(childrenProps);\n return (\n <AccordionCtx.Provider\n value={{\n isOpen: isOpen,\n onclick: () => setIsOpen(!isOpen),\n }}\n >\n <div className={clsx(accordion())}>\n <div className={clsx(isOpen ? \"expanded\" : \"\")}>\n {header}\n <div className={clsx(body, isOpen ? null : hide, paragraph)}>\n {children}\n </div>\n </div>\n </div>\n </AccordionCtx.Provider>\n );\n};\n"],"names":["ChevronDown","ChevronUp","header"],"mappings":"
|
|
1
|
+
{"version":3,"file":"Accordion.js","sources":["../../lib/Accordion/Accordion.tsx"],"sourcesContent":["\"use client\";\n\nimport { ChevronDown, ChevronUp } from \"@lib/icons\";\nimport clsx from \"clsx\";\nimport React, {\n PropsWithChildren,\n createContext,\n useContext,\n useState,\n} from \"react\";\nimport {\n accordion,\n body,\n header,\n headerContent,\n hide,\n icon,\n paragraph,\n} from \"./Accordion.css\";\n\nexport type Accordion = {\n expanded?: boolean;\n};\n\nexport const AccordionCtx = createContext({\n isOpen: false,\n onclick: () => {},\n});\n\nexport const AccordionHeader = (props: PropsWithChildren) => {\n const { children } = props;\n const { isOpen, onclick } = useContext(AccordionCtx);\n return (\n <div className={clsx(header())} onClick={onclick}>\n <p className={clsx(headerContent)}>{children}</p>\n <div className={icon}>{isOpen ? <ChevronDown /> : <ChevronUp />}</div>\n </div>\n );\n};\n\nexport const AccordionDetails = ({ children }: PropsWithChildren) => {\n return <div>{children}</div>;\n};\n\nexport const Accordion = (props: Accordion & PropsWithChildren) => {\n const { expanded = false, children: childrenProps } = props;\n const [isOpen, setIsOpen] = useState(expanded);\n const [header, ...children] = React.Children.toArray(childrenProps);\n return (\n <AccordionCtx.Provider\n value={{\n isOpen: isOpen,\n onclick: () => setIsOpen(!isOpen),\n }}\n >\n <div className={clsx(accordion())}>\n <div className={clsx(isOpen ? \"expanded\" : \"\")}>\n {header}\n <div className={clsx(body, isOpen ? null : hide, paragraph)}>\n {children}\n </div>\n </div>\n </div>\n </AccordionCtx.Provider>\n );\n};\n"],"names":["ChevronDown","ChevronUp","header"],"mappings":";;;;;;;;;AAwBO,MAAM,eAAe,cAAc;AAAA,EACxC,QAAQ;AAAA,EACR,SAAS,MAAM;AAAA,EAAC;AAClB,CAAC;AAEY,MAAA,kBAAkB,CAAC,UAA6B;AACrD,QAAA,EAAE,SAAa,IAAA;AACrB,QAAM,EAAE,QAAQ,QAAQ,IAAI,WAAW,YAAY;AAEjD,SAAA,qBAAC,SAAI,WAAW,KAAK,QAAQ,GAAG,SAAS,SACvC,UAAA;AAAA,IAAA,oBAAC,KAAE,EAAA,WAAW,KAAK,aAAa,GAAI,UAAS;AAAA,IAC7C,oBAAC,OAAI,EAAA,WAAW,MAAO,UAAA,6BAAUA,gBAAY,CAAA,CAAA,IAAM,oBAAAC,cAAA,CAAA,CAAU,EAAG,CAAA;AAAA,EAClE,EAAA,CAAA;AAEJ;AAEO,MAAM,mBAAmB,CAAC,EAAE,eAAkC;AAC5D,SAAA,oBAAC,SAAK,SAAS,CAAA;AACxB;AAEa,MAAA,YAAY,CAAC,UAAyC;AACjE,QAAM,EAAE,WAAW,OAAO,UAAU,kBAAkB;AACtD,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAS,QAAQ;AACvC,QAAA,CAACC,SAAQ,GAAG,QAAQ,IAAI,MAAM,SAAS,QAAQ,aAAa;AAEhE,SAAA;AAAA,IAAC,aAAa;AAAA,IAAb;AAAA,MACC,OAAO;AAAA,QACL;AAAA,QACA,SAAS,MAAM,UAAU,CAAC,MAAM;AAAA,MAClC;AAAA,MAEA,UAAC,oBAAA,OAAA,EAAI,WAAW,KAAK,UAAW,CAAA,GAC9B,UAAC,qBAAA,OAAA,EAAI,WAAW,KAAK,SAAS,aAAa,EAAE,GAC1C,UAAA;AAAA,QAAAA;AAAAA,QACD,oBAAC,OAAI,EAAA,WAAW,KAAK,MAAM,SAAS,OAAO,MAAM,SAAS,GACvD,SACH,CAAA;AAAA,MAAA,EAAA,CACF,EACF,CAAA;AAAA,IAAA;AAAA,EAAA;AAGN;"}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { Chevron } from "../Chevron/index.js";
|
|
3
3
|
import "../icons/CheckIcon/CheckIcon.css.js";
|
|
4
|
-
import "../themes/vars.css.ts.vanilla.css.js";
|
|
5
4
|
/* empty css */
|
|
6
5
|
import { LockIcon } from "../icons/LockIcon/index.js";
|
|
7
6
|
import { WarningIcon } from "../icons/WarningIcon/index.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../lib/AlertBanner/index.tsx"],"sourcesContent":["\"use client\";\nimport { Chevron } from \"@lib/Chevron\";\nimport { FC } from \"react\";\nimport { LockIcon, WarningIcon } from \"../icons\";\nimport {\n alertBanner,\n alertBanner_body,\n alertBanner_cta,\n alertBanner_img_section,\n} from \"./AlertBanner.css\";\nimport { AlertBannerInterface } from \"./AlertBanner.interface\";\n\nexport const AlertBanner: FC<AlertBannerInterface> = ({\n alertType,\n message,\n callToAction,\n id,\n}) => {\n return (\n <section key={id} className={``}>\n <div className={`${alertBanner({ variant: alertType })} flex`}>\n <div className={`${alertBanner_img_section}`}>\n {alertType === \"Standard\" ? <LockIcon /> : <WarningIcon />}\n </div>\n <div className={`${alertBanner_body} flex`}>\n <p>{message}</p>\n <div className={alertBanner_cta}>\n <Chevron targetUrl={callToAction.targetUrl} variant=\"primary\">\n {callToAction.displayText}\n </Chevron>\n </div>\n </div>\n </div>\n </section>\n );\n};\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../lib/AlertBanner/index.tsx"],"sourcesContent":["\"use client\";\nimport { Chevron } from \"@lib/Chevron\";\nimport { FC } from \"react\";\nimport { LockIcon, WarningIcon } from \"../icons\";\nimport {\n alertBanner,\n alertBanner_body,\n alertBanner_cta,\n alertBanner_img_section,\n} from \"./AlertBanner.css\";\nimport { AlertBannerInterface } from \"./AlertBanner.interface\";\n\nexport const AlertBanner: FC<AlertBannerInterface> = ({\n alertType,\n message,\n callToAction,\n id,\n}) => {\n return (\n <section key={id} className={``}>\n <div className={`${alertBanner({ variant: alertType })} flex`}>\n <div className={`${alertBanner_img_section}`}>\n {alertType === \"Standard\" ? <LockIcon /> : <WarningIcon />}\n </div>\n <div className={`${alertBanner_body} flex`}>\n <p>{message}</p>\n <div className={alertBanner_cta}>\n <Chevron targetUrl={callToAction.targetUrl} variant=\"primary\">\n {callToAction.displayText}\n </Chevron>\n </div>\n </div>\n </div>\n </section>\n );\n};\n"],"names":[],"mappings":";;;;;;;AAYO,MAAM,cAAwC,CAAC;AAAA,EACpD;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,SACG,oBAAA,WAAA,EAAiB,WAAW,IAC3B,+BAAC,OAAI,EAAA,WAAW,GAAG,YAAY,EAAE,SAAS,UAAU,CAAC,CAAC,SACpD,UAAA;AAAA,IAAA,oBAAC,OAAI,EAAA,WAAW,GAAG,uBAAuB,IACvC,UAAA,cAAc,aAAa,oBAAC,UAAS,CAAA,CAAA,IAAM,oBAAA,aAAA,CAAY,CAAA,GAC1D;AAAA,IACC,qBAAA,OAAA,EAAI,WAAW,GAAG,gBAAgB,SACjC,UAAA;AAAA,MAAA,oBAAC,OAAG,UAAQ,QAAA,CAAA;AAAA,MACX,oBAAA,OAAA,EAAI,WAAW,iBACd,UAAC,oBAAA,SAAA,EAAQ,WAAW,aAAa,WAAW,SAAQ,WACjD,UAAA,aAAa,YAChB,CAAA,GACF;AAAA,IAAA,GACF;AAAA,EAAA,GACF,KAbY,EAcd;AAEJ;"}
|
|
@@ -3,7 +3,6 @@ import { listItem } from "../IconBillboard/IconBillboard.css.js";
|
|
|
3
3
|
import SvgCheckCircle from "../icons/CheckCircle.js";
|
|
4
4
|
import SvgCheckCircleLight from "../icons/CheckCircleLight.js";
|
|
5
5
|
import "../icons/CheckIcon/CheckIcon.css.js";
|
|
6
|
-
import "../themes/vars.css.ts.vanilla.css.js";
|
|
7
6
|
/* empty css */
|
|
8
7
|
import { bulletIcon } from "./BulletItem.css.js";
|
|
9
8
|
const BulletItem = (props) => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BulletItem.js","sources":["../../lib/BulletItem/BulletItem.tsx"],"sourcesContent":["\"use client\";\nimport { listItem } from \"@lib/IconBillboard/IconBillboard.css\";\nimport { CheckCircle, CheckCircleLight } from \"@lib/icons\";\nimport { PropsWithChildren } from \"react\";\nimport { bulletIcon } from \"./BulletItem.css\";\nexport interface BulletItemProps extends PropsWithChildren {\n variant?: \"primary\" | \"secondary\" | \"tertiary\" | \"quaternary\";\n}\n\nexport const BulletItem = (props: BulletItemProps) => {\n const iconCheckVariant = new Map([\n [\"primary\", <CheckCircle height={18} width={18} />],\n [\"secondary\", <CheckCircle height={18} width={18} />],\n [\"tertiary\", <CheckCircleLight height={18} width={18} />],\n [\"quaternary\", <CheckCircleLight height={18} width={18} />],\n [undefined, <CheckCircleLight height={18} width={18} />],\n ]);\n\n const Icon = iconCheckVariant.get(props.variant);\n\n return (\n <li className={listItem}>\n <span className={bulletIcon}>{Icon}</span>\n <div>{props.children}</div>\n </li>\n );\n};\n"],"names":["CheckCircle","CheckCircleLight"],"mappings":"
|
|
1
|
+
{"version":3,"file":"BulletItem.js","sources":["../../lib/BulletItem/BulletItem.tsx"],"sourcesContent":["\"use client\";\nimport { listItem } from \"@lib/IconBillboard/IconBillboard.css\";\nimport { CheckCircle, CheckCircleLight } from \"@lib/icons\";\nimport { PropsWithChildren } from \"react\";\nimport { bulletIcon } from \"./BulletItem.css\";\nexport interface BulletItemProps extends PropsWithChildren {\n variant?: \"primary\" | \"secondary\" | \"tertiary\" | \"quaternary\";\n}\n\nexport const BulletItem = (props: BulletItemProps) => {\n const iconCheckVariant = new Map([\n [\"primary\", <CheckCircle height={18} width={18} />],\n [\"secondary\", <CheckCircle height={18} width={18} />],\n [\"tertiary\", <CheckCircleLight height={18} width={18} />],\n [\"quaternary\", <CheckCircleLight height={18} width={18} />],\n [undefined, <CheckCircleLight height={18} width={18} />],\n ]);\n\n const Icon = iconCheckVariant.get(props.variant);\n\n return (\n <li className={listItem}>\n <span className={bulletIcon}>{Icon}</span>\n <div>{props.children}</div>\n </li>\n );\n};\n"],"names":["CheckCircle","CheckCircleLight"],"mappings":";;;;;;;AASa,MAAA,aAAa,CAAC,UAA2B;AAC9C,QAAA,uCAAuB,IAAI;AAAA,IAC/B,CAAC,WAAY,oBAAAA,gBAAA,EAAY,QAAQ,IAAI,OAAO,IAAI,CAAE;AAAA,IAClD,CAAC,aAAc,oBAAAA,gBAAA,EAAY,QAAQ,IAAI,OAAO,IAAI,CAAE;AAAA,IACpD,CAAC,YAAa,oBAAAC,qBAAA,EAAiB,QAAQ,IAAI,OAAO,IAAI,CAAE;AAAA,IACxD,CAAC,cAAe,oBAAAA,qBAAA,EAAiB,QAAQ,IAAI,OAAO,IAAI,CAAE;AAAA,IAC1D,CAAC,QAAY,oBAAAA,qBAAA,EAAiB,QAAQ,IAAI,OAAO,IAAI,CAAE;AAAA,EAAA,CACxD;AAED,QAAM,OAAO,iBAAiB,IAAI,MAAM,OAAO;AAG7C,SAAA,qBAAC,MAAG,EAAA,WAAW,UACb,UAAA;AAAA,IAAC,oBAAA,QAAA,EAAK,WAAW,YAAa,UAAK,MAAA;AAAA,IACnC,oBAAC,OAAK,EAAA,UAAA,MAAM,SAAS,CAAA;AAAA,EACvB,EAAA,CAAA;AAEJ;"}
|
package/dist/Carousel/index.js
CHANGED
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
import { jsx, jsxs, Fragment } from "react/jsx-runtime";
|
|
3
3
|
import "../icons/CheckIcon/CheckIcon.css.js";
|
|
4
|
-
import "../themes/vars.css.ts.vanilla.css.js";
|
|
5
4
|
/* empty css */
|
|
6
5
|
import SvgQuoteIconGrey from "../icons/QuoteIconGrey.js";
|
|
7
6
|
import SvgQuoteIconWhite from "../icons/QuoteIconWhite.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../lib/Carousel/index.tsx"],"sourcesContent":["\"use client\";\nimport { QuoteIconGrey, QuoteIconWhite, QuoteIconYellow } from \"@lib/icons\";\nimport clsx from \"clsx\";\nimport React, {\n Children,\n PropsWithChildren,\n ReactNode,\n cloneElement,\n useEffect,\n} from \"react\";\nimport { create } from \"zustand\";\nimport {\n author as authorClassname,\n authorLocation,\n carousel,\n carouselVariants,\n dot,\n dots,\n icon,\n slide,\n slides,\n} from \"./Carousel.css\";\n\nexport interface SlideProps extends PropsWithChildren {\n id: string | number;\n selected?: boolean;\n content?: ReactNode;\n author?: ReactNode;\n location?: ReactNode;\n}\n\nexport interface CarouselProps extends PropsWithChildren {\n auto?: boolean;\n time?: number;\n selectedItem?: string | number;\n items?: SlideProps[];\n}\n\ntype state = {\n selected: number;\n items?: unknown[];\n timeout?: number;\n};\n\ntype actions = {\n change: (selected: number) => void;\n setItems: (items: unknown[]) => void;\n};\n\nexport const useCarousel = create<state & actions>()((set) => ({\n selected: 0,\n change: (selected) => set(() => ({ selected })),\n setItems: (items) => set(() => ({ items })),\n}));\n\nconst iconVarints = new Map([\n [\n \"primary\",\n <QuoteIconGrey width={64} height={46} className={clsx(icon())} />,\n ],\n [\n \"secondary\",\n <QuoteIconGrey width={64} height={46} className={clsx(icon())} />,\n ],\n [\n \"tertiary\",\n <QuoteIconWhite width={64} height={46} className={clsx(icon())} />,\n ],\n [\n \"quaternary\",\n <QuoteIconYellow width={64} height={46} className={clsx(icon())} />,\n ],\n [\n undefined,\n <QuoteIconGrey width={64} height={46} className={clsx(icon())} />,\n ],\n]);\n\nexport const CarouselSlide = (props: SlideProps & carouselVariants) => {\n const { children, selected, content, author, location, variant } = props;\n\n return (\n <div className={slide[selected ? \"show\" : \"hide\"]}>\n {children ? (\n children\n ) : (\n <>\n <p>{content}</p>\n <div className={authorLocation}>\n <span className={authorClassname({ variant })}>{author}</span>\n <span>|</span>\n <span>{location}</span>\n </div>\n </>\n )}\n </div>\n );\n};\n\nexport const Carousel = (props: CarouselProps & carouselVariants) => {\n const { children, time = 5000, variant, items, auto = false } = props;\n const change = useCarousel((state) => state.change);\n const itemSelected = useCarousel((state) => state.selected);\n\n // const countChildren = Children?.map(children, (item) => {\n // // console.log(item);\n\n // return React.isValidElement(item) && item?.props?.id;\n // });\n\n useEffect(() => {\n if (!auto) {\n return;\n }\n const plusSlides = (n: number) => {\n const noSlides = React.Children.count(children);\n if (n < noSlides - 1) {\n change(n + 1);\n }\n\n if (n === noSlides - 1) {\n change(0);\n }\n };\n const changeAfterTime = setInterval(() => plusSlides(itemSelected), time);\n\n return () => clearInterval(changeAfterTime);\n }, [auto, change, children, itemSelected, time]);\n\n const selectItem = (id: number) => {\n change(id);\n };\n\n const showDots = () => {\n if (children) {\n return Children.map(children, (_, indx) => (\n <div\n key={indx}\n onClick={() => selectItem(indx)}\n className={dot({ variant, selected: indx === itemSelected })}\n ></div>\n ));\n }\n if (items) {\n return items.map((_, indx) => (\n <div\n key={indx}\n onClick={() => selectItem(indx)}\n className={dot({ variant, selected: indx === itemSelected })}\n ></div>\n ));\n }\n };\n\n return (\n <div className={clsx(carousel({ variant }))}>\n <div>{iconVarints.get(variant)}</div>\n <div className={slides}>\n {children\n ? Children.map(\n children,\n (item, idx) =>\n React.isValidElement(item) &&\n cloneElement(item, {\n ...item.props,\n selected: idx === itemSelected,\n variant,\n })\n )\n : items?.map((item, idx) => (\n <CarouselSlide\n key={item.id}\n selected={idx === itemSelected}\n {...item}\n variant={variant}\n />\n ))}\n </div>\n <div className={dots}>{showDots()}</div>\n </div>\n );\n};\n"],"names":["QuoteIconGrey","QuoteIconWhite","QuoteIconYellow","author","authorClassname"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../lib/Carousel/index.tsx"],"sourcesContent":["\"use client\";\nimport { QuoteIconGrey, QuoteIconWhite, QuoteIconYellow } from \"@lib/icons\";\nimport clsx from \"clsx\";\nimport React, {\n Children,\n PropsWithChildren,\n ReactNode,\n cloneElement,\n useEffect,\n} from \"react\";\nimport { create } from \"zustand\";\nimport {\n author as authorClassname,\n authorLocation,\n carousel,\n carouselVariants,\n dot,\n dots,\n icon,\n slide,\n slides,\n} from \"./Carousel.css\";\n\nexport interface SlideProps extends PropsWithChildren {\n id: string | number;\n selected?: boolean;\n content?: ReactNode;\n author?: ReactNode;\n location?: ReactNode;\n}\n\nexport interface CarouselProps extends PropsWithChildren {\n auto?: boolean;\n time?: number;\n selectedItem?: string | number;\n items?: SlideProps[];\n}\n\ntype state = {\n selected: number;\n items?: unknown[];\n timeout?: number;\n};\n\ntype actions = {\n change: (selected: number) => void;\n setItems: (items: unknown[]) => void;\n};\n\nexport const useCarousel = create<state & actions>()((set) => ({\n selected: 0,\n change: (selected) => set(() => ({ selected })),\n setItems: (items) => set(() => ({ items })),\n}));\n\nconst iconVarints = new Map([\n [\n \"primary\",\n <QuoteIconGrey width={64} height={46} className={clsx(icon())} />,\n ],\n [\n \"secondary\",\n <QuoteIconGrey width={64} height={46} className={clsx(icon())} />,\n ],\n [\n \"tertiary\",\n <QuoteIconWhite width={64} height={46} className={clsx(icon())} />,\n ],\n [\n \"quaternary\",\n <QuoteIconYellow width={64} height={46} className={clsx(icon())} />,\n ],\n [\n undefined,\n <QuoteIconGrey width={64} height={46} className={clsx(icon())} />,\n ],\n]);\n\nexport const CarouselSlide = (props: SlideProps & carouselVariants) => {\n const { children, selected, content, author, location, variant } = props;\n\n return (\n <div className={slide[selected ? \"show\" : \"hide\"]}>\n {children ? (\n children\n ) : (\n <>\n <p>{content}</p>\n <div className={authorLocation}>\n <span className={authorClassname({ variant })}>{author}</span>\n <span>|</span>\n <span>{location}</span>\n </div>\n </>\n )}\n </div>\n );\n};\n\nexport const Carousel = (props: CarouselProps & carouselVariants) => {\n const { children, time = 5000, variant, items, auto = false } = props;\n const change = useCarousel((state) => state.change);\n const itemSelected = useCarousel((state) => state.selected);\n\n // const countChildren = Children?.map(children, (item) => {\n // // console.log(item);\n\n // return React.isValidElement(item) && item?.props?.id;\n // });\n\n useEffect(() => {\n if (!auto) {\n return;\n }\n const plusSlides = (n: number) => {\n const noSlides = React.Children.count(children);\n if (n < noSlides - 1) {\n change(n + 1);\n }\n\n if (n === noSlides - 1) {\n change(0);\n }\n };\n const changeAfterTime = setInterval(() => plusSlides(itemSelected), time);\n\n return () => clearInterval(changeAfterTime);\n }, [auto, change, children, itemSelected, time]);\n\n const selectItem = (id: number) => {\n change(id);\n };\n\n const showDots = () => {\n if (children) {\n return Children.map(children, (_, indx) => (\n <div\n key={indx}\n onClick={() => selectItem(indx)}\n className={dot({ variant, selected: indx === itemSelected })}\n ></div>\n ));\n }\n if (items) {\n return items.map((_, indx) => (\n <div\n key={indx}\n onClick={() => selectItem(indx)}\n className={dot({ variant, selected: indx === itemSelected })}\n ></div>\n ));\n }\n };\n\n return (\n <div className={clsx(carousel({ variant }))}>\n <div>{iconVarints.get(variant)}</div>\n <div className={slides}>\n {children\n ? Children.map(\n children,\n (item, idx) =>\n React.isValidElement(item) &&\n cloneElement(item, {\n ...item.props,\n selected: idx === itemSelected,\n variant,\n })\n )\n : items?.map((item, idx) => (\n <CarouselSlide\n key={item.id}\n selected={idx === itemSelected}\n {...item}\n variant={variant}\n />\n ))}\n </div>\n <div className={dots}>{showDots()}</div>\n </div>\n );\n};\n"],"names":["QuoteIconGrey","QuoteIconWhite","QuoteIconYellow","author","authorClassname"],"mappings":"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"}
|
|
@@ -3,7 +3,6 @@ import { Button } from "../Button/index.js";
|
|
|
3
3
|
import { Hyperlink } from "../Hyperlink/index.js";
|
|
4
4
|
import "../icons/CheckIcon/CheckIcon.css.js";
|
|
5
5
|
import { CloseIcon } from "../icons/CloseIcon/index.js";
|
|
6
|
-
import "../themes/vars.css.ts.vanilla.css.js";
|
|
7
6
|
/* empty css */
|
|
8
7
|
import { privacy_prompt, privacy_prompt_content, privacy_prompt_btns, close_btn_optin } from "./CollectInformationAlert.css.js";
|
|
9
8
|
const CollectInformationAlert = () => {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../lib/CollectInformationAlert/index.tsx"],"sourcesContent":["\"use client\";\nimport { Button } from \"@lib/Button\";\nimport { Hyperlink } from \"@lib/Hyperlink\";\nimport { CloseIcon } from \"@lib/icons\";\nimport { FC } from \"react\";\nimport {\n close_btn_optin,\n privacy_prompt,\n privacy_prompt_btns,\n privacy_prompt_content,\n} from \"./CollectInformationAlert.css\";\n\nexport const CollectInformationAlert: FC = () => {\n return (\n <div className={`${privacy_prompt}`}>\n <div className={privacy_prompt_content}>\n <p>\n Axos Bank may collect personal information from consumers in the\n course of doing business. California residents have a right to know\n what <a href=\"#\">categories of personal information</a> Axos Bank\n collects and the right to tell Axos Bank to{\" \"}\n <a href=\"#\">not sell their personal information</a>. For full details,\n please see our <a href=\"#\">California Consumer Privacy Act Notice</a>.\n </p>\n </div>\n <div className={privacy_prompt_btns}>\n <div id={\"consent_prompt_submit\"}>\n <Button\n id=\"privacy_pref_optin\"\n targetUrl=\"#\"\n color=\"tertiary\"\n size=\"large\"\n rounded=\"medium\"\n >\n Accept\n </Button>\n </div>\n <Hyperlink\n id=\"close_btn_optin\"\n className={`${close_btn_optin}`}\n targetUrl={\"#\"}\n >\n <CloseIcon />\n </Hyperlink>\n {/* <Button\n id=\"close_btn_optin\"\n className={`${close_btn_optin}`}\n url=\"#\"\n text=\"\"\n >\n <CloseIcon />\n </Button> */}\n </div>\n </div>\n );\n};\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../lib/CollectInformationAlert/index.tsx"],"sourcesContent":["\"use client\";\nimport { Button } from \"@lib/Button\";\nimport { Hyperlink } from \"@lib/Hyperlink\";\nimport { CloseIcon } from \"@lib/icons\";\nimport { FC } from \"react\";\nimport {\n close_btn_optin,\n privacy_prompt,\n privacy_prompt_btns,\n privacy_prompt_content,\n} from \"./CollectInformationAlert.css\";\n\nexport const CollectInformationAlert: FC = () => {\n return (\n <div className={`${privacy_prompt}`}>\n <div className={privacy_prompt_content}>\n <p>\n Axos Bank may collect personal information from consumers in the\n course of doing business. California residents have a right to know\n what <a href=\"#\">categories of personal information</a> Axos Bank\n collects and the right to tell Axos Bank to{\" \"}\n <a href=\"#\">not sell their personal information</a>. For full details,\n please see our <a href=\"#\">California Consumer Privacy Act Notice</a>.\n </p>\n </div>\n <div className={privacy_prompt_btns}>\n <div id={\"consent_prompt_submit\"}>\n <Button\n id=\"privacy_pref_optin\"\n targetUrl=\"#\"\n color=\"tertiary\"\n size=\"large\"\n rounded=\"medium\"\n >\n Accept\n </Button>\n </div>\n <Hyperlink\n id=\"close_btn_optin\"\n className={`${close_btn_optin}`}\n targetUrl={\"#\"}\n >\n <CloseIcon />\n </Hyperlink>\n {/* <Button\n id=\"close_btn_optin\"\n className={`${close_btn_optin}`}\n url=\"#\"\n text=\"\"\n >\n <CloseIcon />\n </Button> */}\n </div>\n </div>\n );\n};\n"],"names":[],"mappings":";;;;;;;AAYO,MAAM,0BAA8B,MAAM;AAC/C,SACG,qBAAA,OAAA,EAAI,WAAW,GAAG,cAAc,IAC/B,UAAA;AAAA,IAAA,oBAAC,OAAI,EAAA,WAAW,wBACd,UAAA,qBAAC,KAAE,EAAA,UAAA;AAAA,MAAA;AAAA,MAGK,oBAAA,KAAA,EAAE,MAAK,KAAI,UAAkC,sCAAA;AAAA,MAAI;AAAA,MACX;AAAA,MAC3C,oBAAA,KAAA,EAAE,MAAK,KAAI,UAAmC,uCAAA;AAAA,MAAI;AAAA,MACnC,oBAAA,KAAA,EAAE,MAAK,KAAI,UAAsC,0CAAA;AAAA,MAAI;AAAA,IAAA,EAAA,CACvE,EACF,CAAA;AAAA,IACA,qBAAC,OAAI,EAAA,WAAW,qBACd,UAAA;AAAA,MAAC,oBAAA,OAAA,EAAI,IAAI,yBACP,UAAA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,IAAG;AAAA,UACH,WAAU;AAAA,UACV,OAAM;AAAA,UACN,MAAK;AAAA,UACL,SAAQ;AAAA,UACT,UAAA;AAAA,QAAA;AAAA,MAAA,GAGH;AAAA,MACA;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,IAAG;AAAA,UACH,WAAW,GAAG,eAAe;AAAA,UAC7B,WAAW;AAAA,UAEX,8BAAC,WAAU,EAAA;AAAA,QAAA;AAAA,MACb;AAAA,IAAA,GASF;AAAA,EACF,EAAA,CAAA;AAEJ;"}
|
|
@@ -2,7 +2,6 @@ import { jsx, jsxs } from "react/jsx-runtime";
|
|
|
2
2
|
import "../icons/CheckIcon/CheckIcon.css.js";
|
|
3
3
|
import SvgChevronDown from "../icons/ChevronDown.js";
|
|
4
4
|
import SvgChevronUp from "../icons/ChevronUp.js";
|
|
5
|
-
import "../themes/vars.css.ts.vanilla.css.js";
|
|
6
5
|
/* empty css */
|
|
7
6
|
import { create } from "zustand";
|
|
8
7
|
import { icon } from "../Accordion/Accordion.css.js";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../lib/FaqAccordion/index.tsx"],"sourcesContent":["\"use client\";\nimport { ChevronDown, ChevronUp } from \"@lib/icons\";\nimport { MouseEvent, PropsWithChildren } from \"react\";\nimport { create } from \"zustand\";\nimport { icon } from \"../Accordion/Accordion.css\";\nimport {\n content,\n faqAccordion,\n header,\n summary,\n summaryHeader,\n} from \"./FaqAccordion.css\";\n\ntype state = {\n itemOpened: string;\n};\n\ntype actions = {\n toggle: (id: string) => void;\n};\n\nconst useAccordion = create<state & actions>()((set) => ({\n itemOpened: \"\",\n toggle: (id) => set(() => ({ itemOpened: id })),\n}));\n\nexport interface AccordionItemProps extends PropsWithChildren {\n id: string;\n}\n\nexport const AccordionItem = (props: AccordionItemProps) => {\n const selectItem = useAccordion((state) => state.toggle);\n const isOpen = useAccordion((state) => state.itemOpened);\n\n const toggle = (ev: MouseEvent<HTMLDialogElement>) => {\n ev.preventDefault();\n if (isOpen !== props.id) {\n selectItem(props.id);\n } else {\n selectItem(\"\");\n }\n };\n\n return (\n <details onClick={toggle} open={isOpen === props.id}>\n {props.children}\n </details>\n );\n};\n\nexport const AccordionItemSummary = (\n props: { id: string } & PropsWithChildren\n) => {\n const isOpen = useAccordion((state) => state.itemOpened);\n return (\n <summary className={summary}>\n <div className={summaryHeader}>{props.children}</div>\n <div>\n <div className={icon}>\n {isOpen === props.id ? <ChevronUp /> : <ChevronDown />}\n </div>\n </div>\n </summary>\n );\n};\n\nexport const AccordionItemContent = (props: PropsWithChildren) => {\n return <div className={content}>{props.children}</div>;\n};\n\nexport const FaqAccordion = (\n props: { header?: string } & PropsWithChildren\n) => {\n const { children } = props;\n return (\n <section>\n {props.header && <p className={header}>{props.header}</p>}\n <div className={faqAccordion}>{children}</div>\n </section>\n );\n};\n"],"names":["ChevronUp","ChevronDown"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../lib/FaqAccordion/index.tsx"],"sourcesContent":["\"use client\";\nimport { ChevronDown, ChevronUp } from \"@lib/icons\";\nimport { MouseEvent, PropsWithChildren } from \"react\";\nimport { create } from \"zustand\";\nimport { icon } from \"../Accordion/Accordion.css\";\nimport {\n content,\n faqAccordion,\n header,\n summary,\n summaryHeader,\n} from \"./FaqAccordion.css\";\n\ntype state = {\n itemOpened: string;\n};\n\ntype actions = {\n toggle: (id: string) => void;\n};\n\nconst useAccordion = create<state & actions>()((set) => ({\n itemOpened: \"\",\n toggle: (id) => set(() => ({ itemOpened: id })),\n}));\n\nexport interface AccordionItemProps extends PropsWithChildren {\n id: string;\n}\n\nexport const AccordionItem = (props: AccordionItemProps) => {\n const selectItem = useAccordion((state) => state.toggle);\n const isOpen = useAccordion((state) => state.itemOpened);\n\n const toggle = (ev: MouseEvent<HTMLDialogElement>) => {\n ev.preventDefault();\n if (isOpen !== props.id) {\n selectItem(props.id);\n } else {\n selectItem(\"\");\n }\n };\n\n return (\n <details onClick={toggle} open={isOpen === props.id}>\n {props.children}\n </details>\n );\n};\n\nexport const AccordionItemSummary = (\n props: { id: string } & PropsWithChildren\n) => {\n const isOpen = useAccordion((state) => state.itemOpened);\n return (\n <summary className={summary}>\n <div className={summaryHeader}>{props.children}</div>\n <div>\n <div className={icon}>\n {isOpen === props.id ? <ChevronUp /> : <ChevronDown />}\n </div>\n </div>\n </summary>\n );\n};\n\nexport const AccordionItemContent = (props: PropsWithChildren) => {\n return <div className={content}>{props.children}</div>;\n};\n\nexport const FaqAccordion = (\n props: { header?: string } & PropsWithChildren\n) => {\n const { children } = props;\n return (\n <section>\n {props.header && <p className={header}>{props.header}</p>}\n <div className={faqAccordion}>{children}</div>\n </section>\n );\n};\n"],"names":["ChevronUp","ChevronDown"],"mappings":";;;;;;;;AAqBA,MAAM,eAAe,SAA0B,CAAC,SAAS;AAAA,EACvD,YAAY;AAAA,EACZ,QAAQ,CAAC,OAAO,IAAI,OAAO,EAAE,YAAY,KAAK;AAChD,EAAE;AAMW,MAAA,gBAAgB,CAAC,UAA8B;AAC1D,QAAM,aAAa,aAAa,CAAC,UAAU,MAAM,MAAM;AACvD,QAAM,SAAS,aAAa,CAAC,UAAU,MAAM,UAAU;AAEjD,QAAA,SAAS,CAAC,OAAsC;AACpD,OAAG,eAAe;AACd,QAAA,WAAW,MAAM,IAAI;AACvB,iBAAW,MAAM,EAAE;AAAA,IAAA,OACd;AACL,iBAAW,EAAE;AAAA,IACf;AAAA,EAAA;AAIA,SAAA,oBAAC,aAAQ,SAAS,QAAQ,MAAM,WAAW,MAAM,IAC9C,UAAA,MAAM,SACT,CAAA;AAEJ;AAEa,MAAA,uBAAuB,CAClC,UACG;AACH,QAAM,SAAS,aAAa,CAAC,UAAU,MAAM,UAAU;AAErD,SAAA,qBAAC,WAAQ,EAAA,WAAW,SAClB,UAAA;AAAA,IAAA,oBAAC,OAAI,EAAA,WAAW,eAAgB,UAAA,MAAM,UAAS;AAAA,IAC9C,oBAAA,OAAA,EACC,UAAC,oBAAA,OAAA,EAAI,WAAW,MACb,UAAA,WAAW,MAAM,yBAAMA,cAAU,EAAA,IAAM,oBAAAC,gBAAA,CAAA,CAAY,EACtD,CAAA,GACF;AAAA,EACF,EAAA,CAAA;AAEJ;AAEa,MAAA,uBAAuB,CAAC,UAA6B;AAChE,SAAQ,oBAAA,OAAA,EAAI,WAAW,SAAU,gBAAM,SAAS,CAAA;AAClD;AAEa,MAAA,eAAe,CAC1B,UACG;AACG,QAAA,EAAE,SAAa,IAAA;AACrB,8BACG,WACE,EAAA,UAAA;AAAA,IAAA,MAAM,UAAW,oBAAA,KAAA,EAAE,WAAW,QAAS,gBAAM,QAAO;AAAA,IACpD,oBAAA,OAAA,EAAI,WAAW,cAAe,SAAS,CAAA;AAAA,EAC1C,EAAA,CAAA;AAEJ;"}
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import "../themes/vars.css.ts.vanilla.css.js";
|
|
1
2
|
/* empty css */
|
|
2
3
|
import { createRuntimeFn } from "@vanilla-extract/recipes/createRuntimeFn";
|
|
3
4
|
var billboard = createRuntimeFn({ defaultClassName: "_1m7m2a0", variantClassNames: { variant: { primary: "_1m7m2a1", secondary: "_1m7m2a2", tertiary: "_1m7m2a3", quaternary: "_1m7m2a4" } }, defaultVariants: {}, compoundVariants: [] });
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ImageBillboard.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ImageBillboard.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;"}
|
|
@@ -3,7 +3,6 @@ import { Chevron } from "../Chevron/index.js";
|
|
|
3
3
|
import { getVariant } from "../utils/getVariant.js";
|
|
4
4
|
import { Button } from "../Button/index.js";
|
|
5
5
|
import { CheckIcon } from "../icons/CheckIcon/index.js";
|
|
6
|
-
import "../themes/vars.css.ts.vanilla.css.js";
|
|
7
6
|
/* empty css */
|
|
8
7
|
import { section_text, header, container, billboard, billboard_container, billboard_img, body, billboard_body, billboard_header_section, supertag, billboard_ctas } from "./ImageBillboard.css.js";
|
|
9
8
|
const ImageBillboard = ({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../lib/ImageBillboard/index.tsx"],"sourcesContent":["\"use client\";\nimport { Chevron } from \"@lib/Chevron\";\nimport { ChevronProps } from \"@lib/Chevron/Chevron.interface\";\nimport { getVariant } from \"@lib/utils/getVariant\";\nimport { FC } from \"react\";\nimport { Button } from \"../Button\";\nimport { CheckIcon } from \"../icons\";\nimport {\n billboard,\n billboard_body,\n billboard_container,\n billboard_ctas,\n billboard_header_section,\n billboard_img,\n body,\n container,\n header,\n section_text,\n supertag,\n} from \"./ImageBillboard.css\";\nimport { Bullet, ImageBillboardSet } from \"./ImageBillboard.interface\";\n\nexport const ImageBillboard: FC<ImageBillboardSet> = ({\n id,\n variant,\n headline,\n bodyCopy,\n additionalDetails,\n imageBillboards,\n}: ImageBillboardSet) => {\n const inline = imageBillboards.length > 1;\n const billboard_variant = getVariant(variant);\n return (\n <section key={id} className={`containment section_spacer`}>\n {(headline || bodyCopy) && (\n <div className={section_text}>\n {headline && (\n <h2\n className={`header_2 ${header({ variant: billboard_variant })}`}\n >\n {headline}\n </h2>\n )}\n\n {bodyCopy && <>{bodyCopy}</>}\n </div>\n )}\n <div className={container}>\n {imageBillboards.map(\n ({\n id,\n bordered,\n imagePlacement,\n eyebrow,\n headline,\n bodyCopy,\n bullets,\n image,\n callToActionRow,\n }) => (\n <div\n key={id}\n className={`\n ${billboard({ variant: billboard_variant })} ${inline ? \"\" : billboard_container} \n rounded flex ${inline ? \"flex_col\" : \"flex_row\"} ${bordered ? \"bordered\" : \"\"} ${imagePlacement.toLowerCase() === \"left\" ? \"reversed\" : \"\"}`}\n >\n <div className={`${billboard_img} flex`}>\n <img src={image.src} className=\"img_fluid\" alt={image.alt} />\n </div>\n <div className={body}>\n <div className={billboard_body}>\n <div className={`${billboard_header_section}`}>\n <span\n className={`supertag ${supertag({ variant: billboard_variant })}`}\n >\n {eyebrow}\n </span>\n <h3\n className={`header_3 ${header({ variant: billboard_variant })}`}\n >\n {headline}\n </h3>\n </div>\n <div className=\"push_up\">{bodyCopy}</div>\n <ul className=\"list_unstyled mb_0 push_up\">\n {bullets.map(({ id, icon, copy }: Bullet) => (\n <li key={id} className=\"list_item flex\">\n <div className=\"img_item\">\n {billboard_variant ? (\n <CheckIcon\n variant={\n billboard_variant === \"primary\" ||\n billboard_variant === \"secondary\"\n ? \"primary\"\n : \"secondary\"\n }\n />\n ) : (\n <img src={icon.src} alt={icon.altText} />\n )}\n </div>\n <span>{copy}</span>\n </li>\n ))}\n </ul>\n </div>\n <div\n className={`${billboard_ctas} push_up_24 flex ${\n inline ? \"flex_col\" : \"flex_row\"\n } gap_24 ${callToActionRow.length > 1 ? \"middle\" : \"\"} center`}\n >\n {callToActionRow.map(\n ({\n id,\n variant,\n displayText,\n targetUrl,\n type,\n }: ChevronProps) =>\n type === \"Button\" ? (\n <Button\n key={id}\n targetUrl={targetUrl}\n color={getVariant(variant)}\n size=\"medium\"\n rounded=\"medium\"\n >\n {displayText}\n </Button>\n ) : (\n <Chevron\n key={id}\n targetUrl={targetUrl}\n variant={getVariant(variant)}\n >\n {displayText}\n </Chevron>\n )\n )}\n </div>\n </div>\n </div>\n )\n )}\n </div>\n {additionalDetails && (\n <div className={section_text}>\n <>{additionalDetails}</>\n </div>\n )}\n </section>\n );\n};\n"],"names":["id","headline","bodyCopy","variant"],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../lib/ImageBillboard/index.tsx"],"sourcesContent":["\"use client\";\nimport { Chevron } from \"@lib/Chevron\";\nimport { ChevronProps } from \"@lib/Chevron/Chevron.interface\";\nimport { getVariant } from \"@lib/utils/getVariant\";\nimport { FC } from \"react\";\nimport { Button } from \"../Button\";\nimport { CheckIcon } from \"../icons\";\nimport {\n billboard,\n billboard_body,\n billboard_container,\n billboard_ctas,\n billboard_header_section,\n billboard_img,\n body,\n container,\n header,\n section_text,\n supertag,\n} from \"./ImageBillboard.css\";\nimport { Bullet, ImageBillboardSet } from \"./ImageBillboard.interface\";\n\nexport const ImageBillboard: FC<ImageBillboardSet> = ({\n id,\n variant,\n headline,\n bodyCopy,\n additionalDetails,\n imageBillboards,\n}: ImageBillboardSet) => {\n const inline = imageBillboards.length > 1;\n const billboard_variant = getVariant(variant);\n return (\n <section key={id} className={`containment section_spacer`}>\n {(headline || bodyCopy) && (\n <div className={section_text}>\n {headline && (\n <h2\n className={`header_2 ${header({ variant: billboard_variant })}`}\n >\n {headline}\n </h2>\n )}\n\n {bodyCopy && <>{bodyCopy}</>}\n </div>\n )}\n <div className={container}>\n {imageBillboards.map(\n ({\n id,\n bordered,\n imagePlacement,\n eyebrow,\n headline,\n bodyCopy,\n bullets,\n image,\n callToActionRow,\n }) => (\n <div\n key={id}\n className={`\n ${billboard({ variant: billboard_variant })} ${inline ? \"\" : billboard_container} \n rounded flex ${inline ? \"flex_col\" : \"flex_row\"} ${bordered ? \"bordered\" : \"\"} ${imagePlacement.toLowerCase() === \"left\" ? \"reversed\" : \"\"}`}\n >\n <div className={`${billboard_img} flex`}>\n <img src={image.src} className=\"img_fluid\" alt={image.alt} />\n </div>\n <div className={body}>\n <div className={billboard_body}>\n <div className={`${billboard_header_section}`}>\n <span\n className={`supertag ${supertag({ variant: billboard_variant })}`}\n >\n {eyebrow}\n </span>\n <h3\n className={`header_3 ${header({ variant: billboard_variant })}`}\n >\n {headline}\n </h3>\n </div>\n <div className=\"push_up\">{bodyCopy}</div>\n <ul className=\"list_unstyled mb_0 push_up\">\n {bullets.map(({ id, icon, copy }: Bullet) => (\n <li key={id} className=\"list_item flex\">\n <div className=\"img_item\">\n {billboard_variant ? (\n <CheckIcon\n variant={\n billboard_variant === \"primary\" ||\n billboard_variant === \"secondary\"\n ? \"primary\"\n : \"secondary\"\n }\n />\n ) : (\n <img src={icon.src} alt={icon.altText} />\n )}\n </div>\n <span>{copy}</span>\n </li>\n ))}\n </ul>\n </div>\n <div\n className={`${billboard_ctas} push_up_24 flex ${\n inline ? \"flex_col\" : \"flex_row\"\n } gap_24 ${callToActionRow.length > 1 ? \"middle\" : \"\"} center`}\n >\n {callToActionRow.map(\n ({\n id,\n variant,\n displayText,\n targetUrl,\n type,\n }: ChevronProps) =>\n type === \"Button\" ? (\n <Button\n key={id}\n targetUrl={targetUrl}\n color={getVariant(variant)}\n size=\"medium\"\n rounded=\"medium\"\n >\n {displayText}\n </Button>\n ) : (\n <Chevron\n key={id}\n targetUrl={targetUrl}\n variant={getVariant(variant)}\n >\n {displayText}\n </Chevron>\n )\n )}\n </div>\n </div>\n </div>\n )\n )}\n </div>\n {additionalDetails && (\n <div className={section_text}>\n <>{additionalDetails}</>\n </div>\n )}\n </section>\n );\n};\n"],"names":["id","headline","bodyCopy","variant"],"mappings":"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"}
|
package/dist/Modal/index.js
CHANGED
|
@@ -4,7 +4,6 @@ import "../Accordion/Accordion.js";
|
|
|
4
4
|
import "../Accordion/Accordion.css.js";
|
|
5
5
|
import "../icons/ArrowIcon/ArrowIcon.css.js";
|
|
6
6
|
import "../icons/CheckIcon/CheckIcon.css.js";
|
|
7
|
-
import "../themes/vars.css.ts.vanilla.css.js";
|
|
8
7
|
/* empty css */
|
|
9
8
|
import "../AlertBanner/AlertBanner.css.js";
|
|
10
9
|
import { Button } from "../Button/index.js";
|
package/dist/Modal/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sources":["../../lib/Modal/index.tsx"],"sourcesContent":["\"use client\";\nimport { chevron } from \"@lib/Chevron/Chevron.css\";\nimport { Button } from \"@lib/main\";\nimport { FC } from \"react\";\nimport {\n modal,\n modal_body,\n modal_content,\n modal_dialog,\n modal_footer,\n modal_header,\n modal_subtitle,\n modal_title,\n site_link,\n solid,\n} from \"./Modal.css\";\nimport { ModalProps } from \"./Modal.interface\";\n\nexport const Modal: FC<ModalProps> = ({\n headline,\n bodyCopy,\n body,\n onAccept,\n onCancel,\n}) => {\n return (\n <>\n <div id={\"speedbump\"} tabIndex={-1} role=\"dialog\" className={modal}>\n <div className={`${modal_dialog} rounded`}>\n <div className={`${modal_content} rounded`}>\n <div className={`${modal_header} text_center`}>\n <h2 className={`${modal_title} header_3`}>{headline}</h2>\n <p className={`${modal_subtitle} p_16 mb_0 push_up`}>\n {bodyCopy}\n </p>\n </div>\n\n <hr className={solid} />\n\n <div\n className={`${modal_body} text-center flex flex_col center middle mx_auto`}\n >\n <p className=\"p_16\">You will now be redirected to:</p>\n <p id=\"insert-url\" className={site_link}>\n {body}\n </p>\n </div>\n\n <hr className={solid} />\n\n <div\n className={`${modal_footer} flex center middle push_up_24`}\n style={{ marginInline: \"auto\", width: \"max-content\" }}\n >\n <Button color=\"primary\" action={() => onAccept}>\n Continue\n </Button>\n <a\n style={{ textDecoration: \"none\", padding: \"8px 48px\" }}\n role=\"button\"\n className={`sc__btn ${chevron({ variant: \"primary\" })}`}\n aria-label=\"Close\"\n title=\"Go Back\"\n id=\"close\"\n onClick={() => onCancel}\n >\n Close\n </a>\n </div>\n </div>\n </div>\n </div>\n </>\n );\n};\n"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"index.js","sources":["../../lib/Modal/index.tsx"],"sourcesContent":["\"use client\";\nimport { chevron } from \"@lib/Chevron/Chevron.css\";\nimport { Button } from \"@lib/main\";\nimport { FC } from \"react\";\nimport {\n modal,\n modal_body,\n modal_content,\n modal_dialog,\n modal_footer,\n modal_header,\n modal_subtitle,\n modal_title,\n site_link,\n solid,\n} from \"./Modal.css\";\nimport { ModalProps } from \"./Modal.interface\";\n\nexport const Modal: FC<ModalProps> = ({\n headline,\n bodyCopy,\n body,\n onAccept,\n onCancel,\n}) => {\n return (\n <>\n <div id={\"speedbump\"} tabIndex={-1} role=\"dialog\" className={modal}>\n <div className={`${modal_dialog} rounded`}>\n <div className={`${modal_content} rounded`}>\n <div className={`${modal_header} text_center`}>\n <h2 className={`${modal_title} header_3`}>{headline}</h2>\n <p className={`${modal_subtitle} p_16 mb_0 push_up`}>\n {bodyCopy}\n </p>\n </div>\n\n <hr className={solid} />\n\n <div\n className={`${modal_body} text-center flex flex_col center middle mx_auto`}\n >\n <p className=\"p_16\">You will now be redirected to:</p>\n <p id=\"insert-url\" className={site_link}>\n {body}\n </p>\n </div>\n\n <hr className={solid} />\n\n <div\n className={`${modal_footer} flex center middle push_up_24`}\n style={{ marginInline: \"auto\", width: \"max-content\" }}\n >\n <Button color=\"primary\" action={() => onAccept}>\n Continue\n </Button>\n <a\n style={{ textDecoration: \"none\", padding: \"8px 48px\" }}\n role=\"button\"\n className={`sc__btn ${chevron({ variant: \"primary\" })}`}\n aria-label=\"Close\"\n title=\"Go Back\"\n id=\"close\"\n onClick={() => onCancel}\n >\n Close\n </a>\n </div>\n </div>\n </div>\n </div>\n </>\n );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBO,MAAM,QAAwB,CAAC;AAAA,EACpC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AAEF,SAAA,oBAAA,UAAA,EACE,8BAAC,OAAI,EAAA,IAAI,aAAa,UAAU,IAAI,MAAK,UAAS,WAAW,OAC3D,8BAAC,OAAI,EAAA,WAAW,GAAG,YAAY,YAC7B,+BAAC,OAAI,EAAA,WAAW,GAAG,aAAa,YAC9B,UAAA;AAAA,IAAA,qBAAC,OAAI,EAAA,WAAW,GAAG,YAAY,gBAC7B,UAAA;AAAA,MAAA,oBAAC,MAAG,EAAA,WAAW,GAAG,WAAW,aAAc,UAAS,UAAA;AAAA,0BACnD,KAAE,EAAA,WAAW,GAAG,cAAc,sBAC5B,UACH,UAAA;AAAA,IAAA,GACF;AAAA,IAEA,oBAAC,MAAG,EAAA,WAAW,MAAO,CAAA;AAAA,IAEtB;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW,GAAG,UAAU;AAAA,QAExB,UAAA;AAAA,UAAC,oBAAA,KAAA,EAAE,WAAU,QAAO,UAA8B,kCAAA;AAAA,8BACjD,KAAE,EAAA,IAAG,cAAa,WAAW,WAC3B,UACH,MAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,IAEA,oBAAC,MAAG,EAAA,WAAW,MAAO,CAAA;AAAA,IAEtB;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,WAAW,GAAG,YAAY;AAAA,QAC1B,OAAO,EAAE,cAAc,QAAQ,OAAO,cAAc;AAAA,QAEpD,UAAA;AAAA,UAAA,oBAAC,UAAO,OAAM,WAAU,QAAQ,MAAM,UAAU,UAEhD,YAAA;AAAA,UACA;AAAA,YAAC;AAAA,YAAA;AAAA,cACC,OAAO,EAAE,gBAAgB,QAAQ,SAAS,WAAW;AAAA,cACrD,MAAK;AAAA,cACL,WAAW,WAAW,QAAQ,EAAE,SAAS,UAAW,CAAA,CAAC;AAAA,cACrD,cAAW;AAAA,cACX,OAAM;AAAA,cACN,IAAG;AAAA,cACH,SAAS,MAAM;AAAA,cAChB,UAAA;AAAA,YAAA;AAAA,UAED;AAAA,QAAA;AAAA,MAAA;AAAA,IACF;AAAA,EACF,EAAA,CAAA,EACF,CAAA,GACF,EACF,CAAA;AAEJ;"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DownloadIcon.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"DownloadIcon.css.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;"}
|