lion-make 0.2.0 → 0.3.0
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/dist/components/footer/Disclosure.d.ts +3 -2
- package/dist/components/footer/DisclosureToggleOpen.d.ts +13 -0
- package/dist/components/footer/LegalLinks.d.ts +16 -0
- package/dist/components/footer/LinksAndSocial.d.ts +25 -0
- package/dist/components/header/HeaderCTA.d.ts +9 -0
- package/dist/components/header/HeaderLogo.d.ts +10 -0
- package/dist/components/header/HeaderProduct.d.ts +10 -0
- package/dist/components/header/HeaderSectionNavigation.d.ts +12 -0
- package/dist/components/header/HeaderSectionTitle.d.ts +8 -0
- package/dist/components/header/HeaderUnderwriter.d.ts +9 -0
- package/dist/components/header/TopLevelNavigation.d.ts +13 -0
- package/dist/components/hero/CTAHeroBlock.d.ts +24 -0
- package/dist/components/hero/HeroBlock.d.ts +18 -0
- package/dist/components/hero/MultiHero.d.ts +25 -0
- package/dist/components/hero/NotAvailableHeroBlock.d.ts +22 -0
- package/dist/index.d.ts +28 -0
- package/dist/lion-make.js +991 -633
- package/dist/lion-make.umd.cjs +10 -10
- package/guidelines/Guidelines.md +46 -50
- package/guidelines/composition/constraints.md +40 -8
- package/guidelines/composition/zones.md +49 -11
- package/guidelines/content-types/footer/anklet.md +62 -0
- package/guidelines/content-types/footer/compliance.md +49 -0
- package/guidelines/content-types/footer/disclaimers.md +48 -0
- package/guidelines/content-types/footer/disclosure-toggle-open.md +51 -0
- package/guidelines/content-types/footer/disclosures.md +50 -0
- package/guidelines/content-types/footer/legal-links.md +59 -0
- package/guidelines/content-types/footer/links-and-social.md +94 -0
- package/guidelines/content-types/footer/overview.md +73 -16
- package/guidelines/content-types/general/accordion-block.md +42 -0
- package/guidelines/content-types/general/all-blogs-post-block.md +52 -0
- package/guidelines/content-types/general/background-color-block.md +42 -0
- package/guidelines/content-types/general/basic-content-block.md +43 -0
- package/guidelines/content-types/general/body-text-copy-block.md +38 -0
- package/guidelines/content-types/general/content-image-block.md +37 -0
- package/guidelines/content-types/general/cross-sell-card-block.md +45 -0
- package/guidelines/content-types/general/decorative-list-block.md +40 -0
- package/guidelines/content-types/general/email-callout-block.md +38 -0
- package/guidelines/content-types/general/embedded-video-block.md +36 -0
- package/guidelines/content-types/general/full-size-image-with-highlight-box.md +52 -0
- package/guidelines/content-types/general/horizontal-rule.md +35 -0
- package/guidelines/content-types/general/hot-jobs-block.md +52 -0
- package/guidelines/content-types/general/inline-message.md +36 -0
- package/guidelines/content-types/general/last-chance-block.md +40 -0
- package/guidelines/content-types/general/multi-step-lead-form.md +60 -0
- package/guidelines/content-types/general/multi-testimonial.md +49 -0
- package/guidelines/content-types/general/opt-in.md +42 -0
- package/guidelines/content-types/general/overview.md +134 -24
- package/guidelines/content-types/general/product-block.md +43 -0
- package/guidelines/content-types/general/pull-quote.md +36 -0
- package/guidelines/content-types/general/recent-blog-posts-block.md +48 -0
- package/guidelines/content-types/general/resource-spotlight.md +44 -0
- package/guidelines/content-types/general/rtb-descriptive.md +53 -0
- package/guidelines/content-types/general/rtb-dynamic.md +55 -0
- package/guidelines/content-types/general/rtb-highlight.md +50 -0
- package/guidelines/content-types/general/side-menu-explorer.md +62 -0
- package/guidelines/content-types/general/simple-cta-block.md +44 -0
- package/guidelines/content-types/general/spacing-block.md +40 -0
- package/guidelines/content-types/general/speed-bump.md +45 -0
- package/guidelines/content-types/general/table-block.md +55 -0
- package/guidelines/content-types/general/wahfu.md +66 -0
- package/guidelines/content-types/header/header-cta.md +41 -0
- package/guidelines/content-types/header/header-logo.md +45 -0
- package/guidelines/content-types/header/header-product.md +45 -0
- package/guidelines/content-types/header/header-section-navigation.md +55 -0
- package/guidelines/content-types/header/header-section-title.md +43 -0
- package/guidelines/content-types/header/header-underwriter.md +46 -0
- package/guidelines/content-types/header/overview.md +61 -15
- package/guidelines/content-types/header/top-level-navigation.md +70 -0
- package/guidelines/content-types/hero/cta-hero-block.md +70 -0
- package/guidelines/content-types/hero/hero-block.md +56 -0
- package/guidelines/content-types/hero/multi-hero.md +78 -0
- package/guidelines/content-types/hero/not-available-hero-block.md +64 -0
- package/guidelines/content-types/hero/overview.md +53 -18
- package/guidelines/content-types/overview.md +86 -29
- package/guidelines/discovery.md +158 -0
- package/guidelines/setup.md +90 -16
- package/package.json +1 -1
|
@@ -3,11 +3,12 @@ export interface DisclosureProps {
|
|
|
3
3
|
triggerLabel: string;
|
|
4
4
|
content: string;
|
|
5
5
|
materialId?: string;
|
|
6
|
+
defaultOpen?: boolean;
|
|
6
7
|
className?: string;
|
|
7
8
|
}
|
|
8
9
|
/**
|
|
9
|
-
* ZONE: footer only —
|
|
10
|
-
*
|
|
10
|
+
* ZONE: footer only — Disclosures subsection (closed by default).
|
|
11
|
+
* Use defaultOpen={true} for the "Disclosure Toggle Open" Mondrian content type.
|
|
11
12
|
* materialId is the compliance tracking number (Medicare Advantage / PDP).
|
|
12
13
|
*/
|
|
13
14
|
export declare const Disclosure: React.FC<DisclosureProps>;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
export interface DisclosureToggleOpenProps {
|
|
3
|
+
triggerLabel: string;
|
|
4
|
+
content: string;
|
|
5
|
+
materialId?: string;
|
|
6
|
+
className?: string;
|
|
7
|
+
}
|
|
8
|
+
/**
|
|
9
|
+
* ZONE: footer only — Disclosure Toggle Open subsection.
|
|
10
|
+
* Identical to Disclosure but starts in the open/expanded state.
|
|
11
|
+
* Use when regulatory requirements mandate that the disclosure is visible on page load.
|
|
12
|
+
*/
|
|
13
|
+
export declare const DisclosureToggleOpen: React.FC<DisclosureToggleOpenProps>;
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
export interface LegalLink {
|
|
3
|
+
label: string;
|
|
4
|
+
href: string;
|
|
5
|
+
}
|
|
6
|
+
export interface LegalLinksProps {
|
|
7
|
+
links: LegalLink[];
|
|
8
|
+
copyrightText?: string;
|
|
9
|
+
className?: string;
|
|
10
|
+
}
|
|
11
|
+
/**
|
|
12
|
+
* ZONE: footer only — Legal Links subsection.
|
|
13
|
+
* Horizontal bar of legal page links (Privacy Policy, Terms, Accessibility, etc.)
|
|
14
|
+
* and optional copyright notice. Typically the bottommost element in the footer.
|
|
15
|
+
*/
|
|
16
|
+
export declare const LegalLinks: React.FC<LegalLinksProps>;
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
export interface FooterNavColumn {
|
|
3
|
+
heading: string;
|
|
4
|
+
links: Array<{
|
|
5
|
+
label: string;
|
|
6
|
+
href: string;
|
|
7
|
+
}>;
|
|
8
|
+
}
|
|
9
|
+
export type SocialPlatform = 'facebook' | 'twitter' | 'linkedin' | 'youtube' | 'instagram' | 'x';
|
|
10
|
+
export interface SocialLink {
|
|
11
|
+
platform: SocialPlatform;
|
|
12
|
+
href: string;
|
|
13
|
+
label?: string;
|
|
14
|
+
}
|
|
15
|
+
export interface LinksAndSocialProps {
|
|
16
|
+
columns: FooterNavColumn[];
|
|
17
|
+
socialLinks?: SocialLink[];
|
|
18
|
+
className?: string;
|
|
19
|
+
}
|
|
20
|
+
/**
|
|
21
|
+
* ZONE: footer only — Links & Social subsection.
|
|
22
|
+
* Multi-column footer navigation grid plus optional social media icon links.
|
|
23
|
+
* Typically the first section in the footer, above disclaimers and compliance.
|
|
24
|
+
*/
|
|
25
|
+
export declare const LinksAndSocial: React.FC<LinksAndSocialProps>;
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
export type HeaderCTAVariant = 'button' | 'link' | 'phone';
|
|
3
|
+
export interface HeaderCTAProps {
|
|
4
|
+
label: string;
|
|
5
|
+
href: string;
|
|
6
|
+
variant?: HeaderCTAVariant;
|
|
7
|
+
className?: string;
|
|
8
|
+
}
|
|
9
|
+
export declare const HeaderCTA: React.FC<HeaderCTAProps>;
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
export interface HeaderProductProps {
|
|
3
|
+
name: string;
|
|
4
|
+
logoSrc?: string;
|
|
5
|
+
logoAlt?: string;
|
|
6
|
+
href?: string;
|
|
7
|
+
tagline?: string;
|
|
8
|
+
className?: string;
|
|
9
|
+
}
|
|
10
|
+
export declare const HeaderProduct: React.FC<HeaderProductProps>;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
export interface SectionNavItem {
|
|
3
|
+
label: string;
|
|
4
|
+
href: string;
|
|
5
|
+
isActive?: boolean;
|
|
6
|
+
}
|
|
7
|
+
export interface HeaderSectionNavigationProps {
|
|
8
|
+
items: SectionNavItem[];
|
|
9
|
+
ariaLabel?: string;
|
|
10
|
+
className?: string;
|
|
11
|
+
}
|
|
12
|
+
export declare const HeaderSectionNavigation: React.FC<HeaderSectionNavigationProps>;
|
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
export interface TopLevelNavItem {
|
|
3
|
+
label: string;
|
|
4
|
+
href: string;
|
|
5
|
+
isActive?: boolean;
|
|
6
|
+
children?: TopLevelNavItem[];
|
|
7
|
+
}
|
|
8
|
+
export interface TopLevelNavigationProps {
|
|
9
|
+
items: TopLevelNavItem[];
|
|
10
|
+
ariaLabel?: string;
|
|
11
|
+
className?: string;
|
|
12
|
+
}
|
|
13
|
+
export declare const TopLevelNavigation: React.FC<TopLevelNavigationProps>;
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
export type CTAHeroLayout = 'full-bleed' | 'split-right' | 'split-left';
|
|
3
|
+
export interface CTAHeroBlockCTA {
|
|
4
|
+
label: string;
|
|
5
|
+
href: string;
|
|
6
|
+
variant?: 'primary' | 'secondary';
|
|
7
|
+
}
|
|
8
|
+
export interface CTAHeroBlockProps {
|
|
9
|
+
heading: string;
|
|
10
|
+
subheading?: string;
|
|
11
|
+
body?: string;
|
|
12
|
+
ctas?: CTAHeroBlockCTA[];
|
|
13
|
+
imageSrc?: string;
|
|
14
|
+
imageAlt?: string;
|
|
15
|
+
layout?: CTAHeroLayout;
|
|
16
|
+
backgroundSrc?: string;
|
|
17
|
+
legalText?: string;
|
|
18
|
+
className?: string;
|
|
19
|
+
}
|
|
20
|
+
/**
|
|
21
|
+
* ZONE: hero only.
|
|
22
|
+
* Conversion-focused hero with one or two CTAs. Primary hero type for product and campaign pages.
|
|
23
|
+
*/
|
|
24
|
+
export declare const CTAHeroBlock: React.FC<CTAHeroBlockProps>;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
export type HeroBlockLayout = 'full-bleed' | 'split-right' | 'split-left' | 'minimal';
|
|
3
|
+
export interface HeroBlockProps {
|
|
4
|
+
heading: string;
|
|
5
|
+
subheading?: string;
|
|
6
|
+
body?: string;
|
|
7
|
+
imageSrc?: string;
|
|
8
|
+
imageAlt?: string;
|
|
9
|
+
layout?: HeroBlockLayout;
|
|
10
|
+
backgroundSrc?: string;
|
|
11
|
+
eyebrow?: string;
|
|
12
|
+
className?: string;
|
|
13
|
+
}
|
|
14
|
+
/**
|
|
15
|
+
* ZONE: hero only.
|
|
16
|
+
* Standard informational hero. No prominent CTA — use CTAHeroBlock when conversion is the goal.
|
|
17
|
+
*/
|
|
18
|
+
export declare const HeroBlock: React.FC<HeroBlockProps>;
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
export interface MultiHeroPanel {
|
|
3
|
+
heading: string;
|
|
4
|
+
subheading?: string;
|
|
5
|
+
body?: string;
|
|
6
|
+
imageSrc?: string;
|
|
7
|
+
imageAlt?: string;
|
|
8
|
+
ctaLabel?: string;
|
|
9
|
+
ctaHref?: string;
|
|
10
|
+
id?: string;
|
|
11
|
+
}
|
|
12
|
+
export interface MultiHeroProps {
|
|
13
|
+
panels: MultiHeroPanel[];
|
|
14
|
+
autoRotate?: boolean;
|
|
15
|
+
rotateIntervalMs?: number;
|
|
16
|
+
defaultActiveIndex?: number;
|
|
17
|
+
showIndicators?: boolean;
|
|
18
|
+
className?: string;
|
|
19
|
+
}
|
|
20
|
+
/**
|
|
21
|
+
* ZONE: hero only.
|
|
22
|
+
* Multi-panel hero with tabbed or rotating slides. Use when multiple products or messages
|
|
23
|
+
* need to share the hero zone. Min 2 panels, max 5 recommended.
|
|
24
|
+
*/
|
|
25
|
+
export declare const MultiHero: React.FC<MultiHeroProps>;
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
import { default as React } from 'react';
|
|
2
|
+
export interface NotAvailableAlternative {
|
|
3
|
+
label: string;
|
|
4
|
+
href: string;
|
|
5
|
+
}
|
|
6
|
+
export interface NotAvailableHeroBlockProps {
|
|
7
|
+
heading?: string;
|
|
8
|
+
body?: string;
|
|
9
|
+
stateName?: string;
|
|
10
|
+
alternatives?: NotAvailableAlternative[];
|
|
11
|
+
contactCtaLabel?: string;
|
|
12
|
+
contactCtaHref?: string;
|
|
13
|
+
imageSrc?: string;
|
|
14
|
+
imageAlt?: string;
|
|
15
|
+
className?: string;
|
|
16
|
+
}
|
|
17
|
+
/**
|
|
18
|
+
* ZONE: hero only.
|
|
19
|
+
* Shown when a product is not available in the user's state or region.
|
|
20
|
+
* Replaces the standard hero entirely — do not render other hero types alongside this one.
|
|
21
|
+
*/
|
|
22
|
+
export declare const NotAvailableHeroBlock: React.FC<NotAvailableHeroBlockProps>;
|
package/dist/index.d.ts
CHANGED
|
@@ -12,6 +12,28 @@ export { CorporateUniversalHeader } from './components/header/CorporateUniversal
|
|
|
12
12
|
export type { CorporateUniversalHeaderProps } from './components/header/CorporateUniversalHeader';
|
|
13
13
|
export { GlobalHeaderBar } from './components/header/GlobalHeaderBar';
|
|
14
14
|
export type { GlobalHeaderBarProps } from './components/header/GlobalHeaderBar';
|
|
15
|
+
export { HeaderCTA } from './components/header/HeaderCTA';
|
|
16
|
+
export type { HeaderCTAProps, HeaderCTAVariant } from './components/header/HeaderCTA';
|
|
17
|
+
export { HeaderLogo } from './components/header/HeaderLogo';
|
|
18
|
+
export type { HeaderLogoProps } from './components/header/HeaderLogo';
|
|
19
|
+
export { HeaderProduct } from './components/header/HeaderProduct';
|
|
20
|
+
export type { HeaderProductProps } from './components/header/HeaderProduct';
|
|
21
|
+
export { HeaderSectionNavigation } from './components/header/HeaderSectionNavigation';
|
|
22
|
+
export type { HeaderSectionNavigationProps, SectionNavItem } from './components/header/HeaderSectionNavigation';
|
|
23
|
+
export { HeaderSectionTitle } from './components/header/HeaderSectionTitle';
|
|
24
|
+
export type { HeaderSectionTitleProps } from './components/header/HeaderSectionTitle';
|
|
25
|
+
export { TopLevelNavigation } from './components/header/TopLevelNavigation';
|
|
26
|
+
export type { TopLevelNavigationProps, TopLevelNavItem } from './components/header/TopLevelNavigation';
|
|
27
|
+
export { HeaderUnderwriter } from './components/header/HeaderUnderwriter';
|
|
28
|
+
export type { HeaderUnwriterProps } from './components/header/HeaderUnderwriter';
|
|
29
|
+
export { CTAHeroBlock } from './components/hero/CTAHeroBlock';
|
|
30
|
+
export type { CTAHeroBlockProps, CTAHeroBlockCTA, CTAHeroLayout } from './components/hero/CTAHeroBlock';
|
|
31
|
+
export { HeroBlock } from './components/hero/HeroBlock';
|
|
32
|
+
export type { HeroBlockProps, HeroBlockLayout } from './components/hero/HeroBlock';
|
|
33
|
+
export { MultiHero } from './components/hero/MultiHero';
|
|
34
|
+
export type { MultiHeroProps, MultiHeroPanel } from './components/hero/MultiHero';
|
|
35
|
+
export { NotAvailableHeroBlock } from './components/hero/NotAvailableHeroBlock';
|
|
36
|
+
export type { NotAvailableHeroBlockProps, NotAvailableAlternative } from './components/hero/NotAvailableHeroBlock';
|
|
15
37
|
export { Hero } from './components/hero/Hero';
|
|
16
38
|
export type { HeroProps, HeroVariant } from './components/hero/Hero';
|
|
17
39
|
export { RTBs } from './components/general/RTBs';
|
|
@@ -88,9 +110,15 @@ export { RecentBlogPostsBlock } from './components/general/RecentBlogPostsBlock'
|
|
|
88
110
|
export type { RecentBlogPostsBlockProps, RecentPost } from './components/general/RecentBlogPostsBlock';
|
|
89
111
|
export { HotJobsBlock } from './components/general/HotJobsBlock';
|
|
90
112
|
export type { HotJobsBlockProps, JobListing } from './components/general/HotJobsBlock';
|
|
113
|
+
export { LinksAndSocial } from './components/footer/LinksAndSocial';
|
|
114
|
+
export type { LinksAndSocialProps, FooterNavColumn, SocialLink, SocialPlatform } from './components/footer/LinksAndSocial';
|
|
91
115
|
export { Disclaimer } from './components/footer/Disclaimer';
|
|
92
116
|
export type { DisclaimerProps } from './components/footer/Disclaimer';
|
|
93
117
|
export { Disclosure } from './components/footer/Disclosure';
|
|
94
118
|
export type { DisclosureProps } from './components/footer/Disclosure';
|
|
119
|
+
export { DisclosureToggleOpen } from './components/footer/DisclosureToggleOpen';
|
|
120
|
+
export type { DisclosureToggleOpenProps } from './components/footer/DisclosureToggleOpen';
|
|
95
121
|
export { ComplianceBlock } from './components/footer/ComplianceBlock';
|
|
96
122
|
export type { ComplianceBlockProps } from './components/footer/ComplianceBlock';
|
|
123
|
+
export { LegalLinks } from './components/footer/LegalLinks';
|
|
124
|
+
export type { LegalLinksProps, LegalLink } from './components/footer/LegalLinks';
|