@deriv-web-design/ui 0.1.15 → 0.1.17
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/block-registry.json +110 -0
- package/components.manifest.json +37 -2
- package/dist/index.css +111 -0
- package/dist/index.css.map +1 -1
- package/dist/index.d.mts +53 -3
- package/dist/index.d.ts +53 -3
- package/dist/index.js +67 -1
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +65 -1
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.d.mts
CHANGED
|
@@ -31,15 +31,17 @@ interface LinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
|
|
|
31
31
|
colorScheme?: LinkColorScheme;
|
|
32
32
|
/** Link label text */
|
|
33
33
|
label?: string;
|
|
34
|
-
/** Optional
|
|
34
|
+
/** Optional icon. When provided, the chevron is hidden and the label underlines on hover/active. */
|
|
35
35
|
icon?: ReactNode;
|
|
36
|
+
/** Which side the `icon` sits on. Only takes effect when `icon` is provided. */
|
|
37
|
+
iconPosition?: "left" | "right";
|
|
36
38
|
/** Show trailing chevron arrow. Active only when no icon is provided. */
|
|
37
39
|
showChevron?: boolean;
|
|
38
40
|
/** Disabled state — prevents interaction and reduces opacity */
|
|
39
41
|
disabled?: boolean;
|
|
40
42
|
}
|
|
41
43
|
|
|
42
|
-
declare const Link: ({ colorScheme, label, icon, showChevron, disabled, children, className, onClick, ...props }: LinkProps) => react_jsx_runtime.JSX.Element;
|
|
44
|
+
declare const Link: ({ colorScheme, label, icon, iconPosition, showChevron, disabled, children, className, onClick, ...props }: LinkProps) => react_jsx_runtime.JSX.Element;
|
|
43
45
|
|
|
44
46
|
type ChipSize = "sm" | "md" | "lg";
|
|
45
47
|
interface ChipProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
@@ -2287,4 +2289,52 @@ interface MasterPartnerProps {
|
|
|
2287
2289
|
*/
|
|
2288
2290
|
declare const MasterPartner: ({ title, description, note, closingText, ctaLabel, ctaHref, onCtaClick, image, imageAlt, steps, }: MasterPartnerProps) => react_jsx_runtime.JSX.Element;
|
|
2289
2291
|
|
|
2290
|
-
|
|
2292
|
+
type ResourceBannerHeadingLevel = "h2" | "h3" | "h4";
|
|
2293
|
+
interface ResourceBannerLink {
|
|
2294
|
+
/** Unique key for the link (falls back to array index) */
|
|
2295
|
+
id?: string | number;
|
|
2296
|
+
/** Link label text */
|
|
2297
|
+
label: string;
|
|
2298
|
+
/** Destination URL */
|
|
2299
|
+
href: string;
|
|
2300
|
+
/**
|
|
2301
|
+
* Opens in a new tab and shows the external-link icon.
|
|
2302
|
+
* The reference section (deriv.com/fraud-prevention) sets this on every link.
|
|
2303
|
+
* @default true
|
|
2304
|
+
*/
|
|
2305
|
+
external?: boolean;
|
|
2306
|
+
}
|
|
2307
|
+
interface ResourceBannerProps extends HTMLAttributes<HTMLElement> {
|
|
2308
|
+
/** Heading text */
|
|
2309
|
+
title?: string;
|
|
2310
|
+
/** Supporting paragraph below the heading */
|
|
2311
|
+
description?: string;
|
|
2312
|
+
/**
|
|
2313
|
+
* Resource links, rendered as a vertical stack on every breakpoint.
|
|
2314
|
+
* Any number is supported — there is no fixed maximum.
|
|
2315
|
+
*/
|
|
2316
|
+
links?: ResourceBannerLink[];
|
|
2317
|
+
/**
|
|
2318
|
+
* Heading tag to render. Use a lower level when the surrounding page
|
|
2319
|
+
* already owns the heading hierarchy.
|
|
2320
|
+
* @default "h2"
|
|
2321
|
+
*/
|
|
2322
|
+
headingLevel?: ResourceBannerHeadingLevel;
|
|
2323
|
+
}
|
|
2324
|
+
|
|
2325
|
+
/**
|
|
2326
|
+
* Real deriv.com copy, exported for consumers who want to reproduce the
|
|
2327
|
+
* exact reference section (deriv.com/fraud-prevention → `.section_fraud_resources`).
|
|
2328
|
+
*
|
|
2329
|
+
* Opt-in only — the component's defaults and the Storybook stories both use
|
|
2330
|
+
* generic placeholder copy (design-system Rule 6). Import this when you want
|
|
2331
|
+
* the reference content specifically; don't treat it as the template's content.
|
|
2332
|
+
*/
|
|
2333
|
+
declare const RESOURCE_BANNER_DERIV_CONTENT: {
|
|
2334
|
+
title: string;
|
|
2335
|
+
description: string;
|
|
2336
|
+
links: ResourceBannerLink[];
|
|
2337
|
+
};
|
|
2338
|
+
declare const ResourceBanner: ({ title, description, links, headingLevel: HeadingTag, className, ...props }: ResourceBannerProps) => react_jsx_runtime.JSX.Element;
|
|
2339
|
+
|
|
2340
|
+
export { AVATAR_DATA, Accordion, type AccordionProps, ArticleHero, type ArticleHeroArticle, type ArticleHeroColumn, type ArticleHeroProps, ArticleSection, type ArticleSectionItem, type ArticleSectionProps, type ArticleSectionVariant, AvatarGrid, type AvatarGridProps, type AvatarItem, type AvatarPosition, type AwardItem, BottomSheet, type BottomSheetAction, type BottomSheetProps, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, type BreadcrumbSize, Button, type ButtonColorScheme, type ButtonIconPosition, type ButtonProps, type ButtonVariant, COL_ONE_LOGOS, COL_TWO_LOGOS, CORAL_BANNER_DERIV_SLIDES, CTABanner, type CTABannerProps, type CalculationToken, Card, type CardPrimaryStyle, type CardProps, type CardTag, type CardThumbnailType, Chip, ChipDropdown, type ChipDropdownOption, type ChipDropdownProps, type ChipProps, type ChipSize, CoralBanner, type CoralBannerButton, type CoralBannerProps, type CoralBannerSlide, DEFAULT_AWARDS, DEFAULT_CULTURE_CARDS, DEFAULT_EXCHANGE_RATE_WS_URL, DEFAULT_SYMBOLS_ENDPOINT, DayNightTransition, type DayNightTransitionProps, DotLottieInView, type DotLottieInViewProps, DownloadBadge, type DownloadBadgeColorScheme, type DownloadBadgePlatform, type DownloadBadgeProps, DownloadBanner, type DownloadBannerProps, type DownloadBannerStyle, DynamicTable, type DynamicTableColumnDef, type DynamicTableProps, type DynamicTableRowData, type DynamicTableVariant, FEATURE_AWARDS_TEXT_CONTENT, FEATURE_BLOG_CATEGORIES_TEXT_CONTENT, FEATURE_BLOG_TEXT_CONTENT, FEATURE_OFFICES_TEXT_CONTENT, FEATURE_SCROLL_DATA, FaqAccordion, type FaqAccordionColorScheme, type FaqAccordionProps, type FaqItem, FeatureAwards, type FeatureAwardsProps, FeatureBlog, type FeatureBlogAuthor, FeatureBlogCategories, type FeatureBlogCategoriesProps, type FeatureBlogCategoryPost, type FeatureBlogCategoryTab, type FeatureBlogContentBlock, type FeatureBlogContentBlockType, FeatureBlogPage, type FeatureBlogPageProps, type FeatureBlogPost, type FeatureBlogProps, type FeatureBlogSharePlatform, FeatureBullets, type FeatureBulletsProps, type FeatureCardIconItem, type FeatureCardItem, FeatureCards, FeatureCardsIcon, type FeatureCardsIconProps, type FeatureCardsProps, type FeatureOffice, type FeatureOfficeRegion, FeatureOffices, type FeatureOfficesProps, FeatureScroll, type FeatureScrollItem, type FeatureScrollProps, FeatureSplit, type FeatureSplitImagePosition, type FeatureSplitProps, Footer, type FooterAiSummaryItem, type FooterAiSummaryProps, type FooterAppBadge, type FooterDerivGoProps, type FooterLinkItem, type FooterNavSection, type FooterProps, type FooterSocialLink, type FormulaBlock, Header, type HeaderButtonProps, type HeaderProps, type HeaderVariant, type HelpCenterContentBlock, type HelpCenterContentBlockType, HelpCenterPage, type HelpCenterPageProps, type HelpCenterQuestionItem, HelpCentreCategories, type HelpCentreCategoriesProps, type HelpCentreCategoryItem, HelpCentreSubCategories, type HelpCentreSubCategoriesProps, type HelpCentreSubCategoryItem, Hero, type HeroButtonProps, type HeroProps, type HeroVariant, IMAGE_BANNER_CHIPS_DEFAULT_IMAGE, ImageBanner, type ImageBannerProps, type ImageBannerVariant, type LanguageItem, type LeaderItem, Leaders, type LeadersProps, Link, type LinkColorScheme, type LinkProps, type LogoItem, LogoMarquee, type LogoMarqueeProps, MasterPartner, type MasterPartnerNote, type MasterPartnerProps, type MasterPartnerStep, type NavDropdownColumn, type NavDropdownFeature, type NavDropdownItem, type NavItem, Navbar, type NavbarProps, PARALLAX_BANNER_TEXT_CONTENT, Pagination, type PaginationProps, ParallaxBanner, type ParallaxBannerCultureCard, type ParallaxBannerProps, type PartnerPayoutItem, PartnersPayout, type PartnersPayoutProps, PeopleGrid, type PeopleGridProps, type PersonItem, RESOURCE_BANNER_DERIV_CONTENT, ResourceBanner, type ResourceBannerHeadingLevel, type ResourceBannerLink, type ResourceBannerProps, STEPS_DATA, SearchField, type SearchFieldProps, type SearchFieldStatus, type StatItem, Stats, type StatsAward, type StatsProps, StatsSimple, type StatsSimpleProps, type StepItem, Steps, type StepsImagePosition, type StepsProps, type StickyCardItem, type StickyCardTheme, type StickyMarketCardItem, type StickyMarketCardTheme, StickyMarketCards, type StickyMarketCardsProps, StickyStackedCards, type StickyStackedCardsProps, type SwapCalculationMode, TEXT_CONTENT, type TabItem, Table, type TableColumnDef, type TableColumnWidth, type TableProps, type TableRowData, Tabs, type TabsProps, Tag, type TagFontWeight, type TagProps, type TagSize, type TagVariant, Testimonial, type TestimonialItem, type TestimonialProps, TextField, type TextFieldProps, type TextFieldStatus, type TextFieldVariant, TextScroll, type TextScrollProps, type TierAccent, type TierItem, Tiers, type TiersProps, TradingCalculator, TradingCalculatorHowTo, type TradingCalculatorHowToProps, type TradingCalculatorHowToVariant, type TradingCalculatorProps, type TradingCalculatorResults, type TradingCalculatorVariant, type TradingSymbolSpec, dayNightTransitionV2Preset };
|
package/dist/index.d.ts
CHANGED
|
@@ -31,15 +31,17 @@ interface LinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
|
|
|
31
31
|
colorScheme?: LinkColorScheme;
|
|
32
32
|
/** Link label text */
|
|
33
33
|
label?: string;
|
|
34
|
-
/** Optional
|
|
34
|
+
/** Optional icon. When provided, the chevron is hidden and the label underlines on hover/active. */
|
|
35
35
|
icon?: ReactNode;
|
|
36
|
+
/** Which side the `icon` sits on. Only takes effect when `icon` is provided. */
|
|
37
|
+
iconPosition?: "left" | "right";
|
|
36
38
|
/** Show trailing chevron arrow. Active only when no icon is provided. */
|
|
37
39
|
showChevron?: boolean;
|
|
38
40
|
/** Disabled state — prevents interaction and reduces opacity */
|
|
39
41
|
disabled?: boolean;
|
|
40
42
|
}
|
|
41
43
|
|
|
42
|
-
declare const Link: ({ colorScheme, label, icon, showChevron, disabled, children, className, onClick, ...props }: LinkProps) => react_jsx_runtime.JSX.Element;
|
|
44
|
+
declare const Link: ({ colorScheme, label, icon, iconPosition, showChevron, disabled, children, className, onClick, ...props }: LinkProps) => react_jsx_runtime.JSX.Element;
|
|
43
45
|
|
|
44
46
|
type ChipSize = "sm" | "md" | "lg";
|
|
45
47
|
interface ChipProps extends ButtonHTMLAttributes<HTMLButtonElement> {
|
|
@@ -2287,4 +2289,52 @@ interface MasterPartnerProps {
|
|
|
2287
2289
|
*/
|
|
2288
2290
|
declare const MasterPartner: ({ title, description, note, closingText, ctaLabel, ctaHref, onCtaClick, image, imageAlt, steps, }: MasterPartnerProps) => react_jsx_runtime.JSX.Element;
|
|
2289
2291
|
|
|
2290
|
-
|
|
2292
|
+
type ResourceBannerHeadingLevel = "h2" | "h3" | "h4";
|
|
2293
|
+
interface ResourceBannerLink {
|
|
2294
|
+
/** Unique key for the link (falls back to array index) */
|
|
2295
|
+
id?: string | number;
|
|
2296
|
+
/** Link label text */
|
|
2297
|
+
label: string;
|
|
2298
|
+
/** Destination URL */
|
|
2299
|
+
href: string;
|
|
2300
|
+
/**
|
|
2301
|
+
* Opens in a new tab and shows the external-link icon.
|
|
2302
|
+
* The reference section (deriv.com/fraud-prevention) sets this on every link.
|
|
2303
|
+
* @default true
|
|
2304
|
+
*/
|
|
2305
|
+
external?: boolean;
|
|
2306
|
+
}
|
|
2307
|
+
interface ResourceBannerProps extends HTMLAttributes<HTMLElement> {
|
|
2308
|
+
/** Heading text */
|
|
2309
|
+
title?: string;
|
|
2310
|
+
/** Supporting paragraph below the heading */
|
|
2311
|
+
description?: string;
|
|
2312
|
+
/**
|
|
2313
|
+
* Resource links, rendered as a vertical stack on every breakpoint.
|
|
2314
|
+
* Any number is supported — there is no fixed maximum.
|
|
2315
|
+
*/
|
|
2316
|
+
links?: ResourceBannerLink[];
|
|
2317
|
+
/**
|
|
2318
|
+
* Heading tag to render. Use a lower level when the surrounding page
|
|
2319
|
+
* already owns the heading hierarchy.
|
|
2320
|
+
* @default "h2"
|
|
2321
|
+
*/
|
|
2322
|
+
headingLevel?: ResourceBannerHeadingLevel;
|
|
2323
|
+
}
|
|
2324
|
+
|
|
2325
|
+
/**
|
|
2326
|
+
* Real deriv.com copy, exported for consumers who want to reproduce the
|
|
2327
|
+
* exact reference section (deriv.com/fraud-prevention → `.section_fraud_resources`).
|
|
2328
|
+
*
|
|
2329
|
+
* Opt-in only — the component's defaults and the Storybook stories both use
|
|
2330
|
+
* generic placeholder copy (design-system Rule 6). Import this when you want
|
|
2331
|
+
* the reference content specifically; don't treat it as the template's content.
|
|
2332
|
+
*/
|
|
2333
|
+
declare const RESOURCE_BANNER_DERIV_CONTENT: {
|
|
2334
|
+
title: string;
|
|
2335
|
+
description: string;
|
|
2336
|
+
links: ResourceBannerLink[];
|
|
2337
|
+
};
|
|
2338
|
+
declare const ResourceBanner: ({ title, description, links, headingLevel: HeadingTag, className, ...props }: ResourceBannerProps) => react_jsx_runtime.JSX.Element;
|
|
2339
|
+
|
|
2340
|
+
export { AVATAR_DATA, Accordion, type AccordionProps, ArticleHero, type ArticleHeroArticle, type ArticleHeroColumn, type ArticleHeroProps, ArticleSection, type ArticleSectionItem, type ArticleSectionProps, type ArticleSectionVariant, AvatarGrid, type AvatarGridProps, type AvatarItem, type AvatarPosition, type AwardItem, BottomSheet, type BottomSheetAction, type BottomSheetProps, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, type BreadcrumbSize, Button, type ButtonColorScheme, type ButtonIconPosition, type ButtonProps, type ButtonVariant, COL_ONE_LOGOS, COL_TWO_LOGOS, CORAL_BANNER_DERIV_SLIDES, CTABanner, type CTABannerProps, type CalculationToken, Card, type CardPrimaryStyle, type CardProps, type CardTag, type CardThumbnailType, Chip, ChipDropdown, type ChipDropdownOption, type ChipDropdownProps, type ChipProps, type ChipSize, CoralBanner, type CoralBannerButton, type CoralBannerProps, type CoralBannerSlide, DEFAULT_AWARDS, DEFAULT_CULTURE_CARDS, DEFAULT_EXCHANGE_RATE_WS_URL, DEFAULT_SYMBOLS_ENDPOINT, DayNightTransition, type DayNightTransitionProps, DotLottieInView, type DotLottieInViewProps, DownloadBadge, type DownloadBadgeColorScheme, type DownloadBadgePlatform, type DownloadBadgeProps, DownloadBanner, type DownloadBannerProps, type DownloadBannerStyle, DynamicTable, type DynamicTableColumnDef, type DynamicTableProps, type DynamicTableRowData, type DynamicTableVariant, FEATURE_AWARDS_TEXT_CONTENT, FEATURE_BLOG_CATEGORIES_TEXT_CONTENT, FEATURE_BLOG_TEXT_CONTENT, FEATURE_OFFICES_TEXT_CONTENT, FEATURE_SCROLL_DATA, FaqAccordion, type FaqAccordionColorScheme, type FaqAccordionProps, type FaqItem, FeatureAwards, type FeatureAwardsProps, FeatureBlog, type FeatureBlogAuthor, FeatureBlogCategories, type FeatureBlogCategoriesProps, type FeatureBlogCategoryPost, type FeatureBlogCategoryTab, type FeatureBlogContentBlock, type FeatureBlogContentBlockType, FeatureBlogPage, type FeatureBlogPageProps, type FeatureBlogPost, type FeatureBlogProps, type FeatureBlogSharePlatform, FeatureBullets, type FeatureBulletsProps, type FeatureCardIconItem, type FeatureCardItem, FeatureCards, FeatureCardsIcon, type FeatureCardsIconProps, type FeatureCardsProps, type FeatureOffice, type FeatureOfficeRegion, FeatureOffices, type FeatureOfficesProps, FeatureScroll, type FeatureScrollItem, type FeatureScrollProps, FeatureSplit, type FeatureSplitImagePosition, type FeatureSplitProps, Footer, type FooterAiSummaryItem, type FooterAiSummaryProps, type FooterAppBadge, type FooterDerivGoProps, type FooterLinkItem, type FooterNavSection, type FooterProps, type FooterSocialLink, type FormulaBlock, Header, type HeaderButtonProps, type HeaderProps, type HeaderVariant, type HelpCenterContentBlock, type HelpCenterContentBlockType, HelpCenterPage, type HelpCenterPageProps, type HelpCenterQuestionItem, HelpCentreCategories, type HelpCentreCategoriesProps, type HelpCentreCategoryItem, HelpCentreSubCategories, type HelpCentreSubCategoriesProps, type HelpCentreSubCategoryItem, Hero, type HeroButtonProps, type HeroProps, type HeroVariant, IMAGE_BANNER_CHIPS_DEFAULT_IMAGE, ImageBanner, type ImageBannerProps, type ImageBannerVariant, type LanguageItem, type LeaderItem, Leaders, type LeadersProps, Link, type LinkColorScheme, type LinkProps, type LogoItem, LogoMarquee, type LogoMarqueeProps, MasterPartner, type MasterPartnerNote, type MasterPartnerProps, type MasterPartnerStep, type NavDropdownColumn, type NavDropdownFeature, type NavDropdownItem, type NavItem, Navbar, type NavbarProps, PARALLAX_BANNER_TEXT_CONTENT, Pagination, type PaginationProps, ParallaxBanner, type ParallaxBannerCultureCard, type ParallaxBannerProps, type PartnerPayoutItem, PartnersPayout, type PartnersPayoutProps, PeopleGrid, type PeopleGridProps, type PersonItem, RESOURCE_BANNER_DERIV_CONTENT, ResourceBanner, type ResourceBannerHeadingLevel, type ResourceBannerLink, type ResourceBannerProps, STEPS_DATA, SearchField, type SearchFieldProps, type SearchFieldStatus, type StatItem, Stats, type StatsAward, type StatsProps, StatsSimple, type StatsSimpleProps, type StepItem, Steps, type StepsImagePosition, type StepsProps, type StickyCardItem, type StickyCardTheme, type StickyMarketCardItem, type StickyMarketCardTheme, StickyMarketCards, type StickyMarketCardsProps, StickyStackedCards, type StickyStackedCardsProps, type SwapCalculationMode, TEXT_CONTENT, type TabItem, Table, type TableColumnDef, type TableColumnWidth, type TableProps, type TableRowData, Tabs, type TabsProps, Tag, type TagFontWeight, type TagProps, type TagSize, type TagVariant, Testimonial, type TestimonialItem, type TestimonialProps, TextField, type TextFieldProps, type TextFieldStatus, type TextFieldVariant, TextScroll, type TextScrollProps, type TierAccent, type TierItem, Tiers, type TiersProps, TradingCalculator, TradingCalculatorHowTo, type TradingCalculatorHowToProps, type TradingCalculatorHowToVariant, type TradingCalculatorProps, type TradingCalculatorResults, type TradingCalculatorVariant, type TradingSymbolSpec, dayNightTransitionV2Preset };
|
package/dist/index.js
CHANGED
|
@@ -79,6 +79,8 @@ __export(index_exports, {
|
|
|
79
79
|
ParallaxBanner: () => ParallaxBanner,
|
|
80
80
|
PartnersPayout: () => PartnersPayout,
|
|
81
81
|
PeopleGrid: () => PeopleGrid,
|
|
82
|
+
RESOURCE_BANNER_DERIV_CONTENT: () => RESOURCE_BANNER_DERIV_CONTENT,
|
|
83
|
+
ResourceBanner: () => ResourceBanner,
|
|
82
84
|
STEPS_DATA: () => STEPS_DATA,
|
|
83
85
|
SearchField: () => SearchField,
|
|
84
86
|
Stats: () => Stats,
|
|
@@ -149,6 +151,7 @@ var Link = ({
|
|
|
149
151
|
colorScheme = "coral",
|
|
150
152
|
label,
|
|
151
153
|
icon,
|
|
154
|
+
iconPosition = "left",
|
|
152
155
|
showChevron = true,
|
|
153
156
|
disabled = false,
|
|
154
157
|
children,
|
|
@@ -180,8 +183,9 @@ var Link = ({
|
|
|
180
183
|
onClick: handleClick,
|
|
181
184
|
...props,
|
|
182
185
|
children: [
|
|
183
|
-
hasIcon && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "icon", children: icon }),
|
|
186
|
+
hasIcon && iconPosition === "left" && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "icon", children: icon }),
|
|
184
187
|
/* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "label", children: label ?? children }),
|
|
188
|
+
hasIcon && iconPosition === "right" && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "icon", children: icon }),
|
|
185
189
|
!hasIcon && showChevron && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)("span", { className: "chevron", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(ChevronIcon, {}) })
|
|
186
190
|
]
|
|
187
191
|
}
|
|
@@ -8335,6 +8339,66 @@ var MasterPartner = ({
|
|
|
8335
8339
|
] }, index)) })
|
|
8336
8340
|
] }) });
|
|
8337
8341
|
};
|
|
8342
|
+
|
|
8343
|
+
// templates/ResourceBanner/ResourceBanner.tsx
|
|
8344
|
+
var import_jsx_runtime62 = require("react/jsx-runtime");
|
|
8345
|
+
var DEFAULT_LINKS = [{ label: "Learn more", href: "#" }];
|
|
8346
|
+
var RESOURCE_BANNER_DERIV_CONTENT = {
|
|
8347
|
+
title: "Learn more about staying safe",
|
|
8348
|
+
description: "Read our guide on secure and responsible trading for more on protecting your account.",
|
|
8349
|
+
links: [
|
|
8350
|
+
{
|
|
8351
|
+
id: "responsible",
|
|
8352
|
+
label: "Secure and responsible trading",
|
|
8353
|
+
href: "/responsible",
|
|
8354
|
+
external: true
|
|
8355
|
+
}
|
|
8356
|
+
]
|
|
8357
|
+
};
|
|
8358
|
+
var ExternalLinkIcon2 = () => /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("svg", { viewBox: "0 0 16 16", fill: "none", "aria-hidden": "true", focusable: "false", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
|
|
8359
|
+
"path",
|
|
8360
|
+
{
|
|
8361
|
+
d: "M4.5 11.5 11.5 4.5M5.5 4.5h6v6",
|
|
8362
|
+
stroke: "currentColor",
|
|
8363
|
+
strokeWidth: "1.75",
|
|
8364
|
+
strokeLinecap: "round",
|
|
8365
|
+
strokeLinejoin: "round"
|
|
8366
|
+
}
|
|
8367
|
+
) });
|
|
8368
|
+
var ResourceBanner = ({
|
|
8369
|
+
title = "Section title goes here",
|
|
8370
|
+
description = "Explain how this specific feature helps your user.",
|
|
8371
|
+
links,
|
|
8372
|
+
headingLevel: HeadingTag = "h2",
|
|
8373
|
+
className,
|
|
8374
|
+
...props
|
|
8375
|
+
}) => {
|
|
8376
|
+
const resolvedLinks = links && links.length > 0 ? links : DEFAULT_LINKS;
|
|
8377
|
+
const rootClass = ["rsb", className].filter(Boolean).join(" ");
|
|
8378
|
+
return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("section", { className: rootClass, ...props, children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: "rsb__inner", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("div", { className: "rsb__card", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: "rsb__grid", children: [
|
|
8379
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsxs)("div", { className: "rsb__content", children: [
|
|
8380
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)(HeadingTag, { className: "rsb__title", children: title }),
|
|
8381
|
+
description && /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("p", { className: "rsb__description", children: description })
|
|
8382
|
+
] }),
|
|
8383
|
+
/* @__PURE__ */ (0, import_jsx_runtime62.jsx)("ul", { className: "rsb__links", children: resolvedLinks.map((link, i) => {
|
|
8384
|
+
const isExternal = link.external ?? true;
|
|
8385
|
+
return /* @__PURE__ */ (0, import_jsx_runtime62.jsx)("li", { className: "rsb__links-item", children: /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(
|
|
8386
|
+
Link,
|
|
8387
|
+
{
|
|
8388
|
+
className: "rsb__link",
|
|
8389
|
+
colorScheme: "white",
|
|
8390
|
+
href: link.href,
|
|
8391
|
+
label: link.label,
|
|
8392
|
+
icon: isExternal ? /* @__PURE__ */ (0, import_jsx_runtime62.jsx)(ExternalLinkIcon2, {}) : void 0,
|
|
8393
|
+
iconPosition: "right",
|
|
8394
|
+
showChevron: !isExternal,
|
|
8395
|
+
target: isExternal ? "_blank" : void 0,
|
|
8396
|
+
rel: isExternal ? "noopener noreferrer" : void 0
|
|
8397
|
+
}
|
|
8398
|
+
) }, link.id ?? i);
|
|
8399
|
+
}) })
|
|
8400
|
+
] }) }) }) });
|
|
8401
|
+
};
|
|
8338
8402
|
// Annotate the CommonJS export names for ESM import in node:
|
|
8339
8403
|
0 && (module.exports = {
|
|
8340
8404
|
AVATAR_DATA,
|
|
@@ -8396,6 +8460,8 @@ var MasterPartner = ({
|
|
|
8396
8460
|
ParallaxBanner,
|
|
8397
8461
|
PartnersPayout,
|
|
8398
8462
|
PeopleGrid,
|
|
8463
|
+
RESOURCE_BANNER_DERIV_CONTENT,
|
|
8464
|
+
ResourceBanner,
|
|
8399
8465
|
STEPS_DATA,
|
|
8400
8466
|
SearchField,
|
|
8401
8467
|
Stats,
|