formica-ui-lib 1.0.161 → 1.0.164
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/componentProps/atoms/input/inputProps.d.ts +1 -0
- package/dist/componentProps/atoms/text/TextProps.d.ts +1 -1
- package/dist/componentProps/molecules/card/columncarouselcard/ColumnCarouselCardProps.d.ts +22 -0
- package/dist/componentProps/molecules/card/featurecard/FeatureCardProps.d.ts +1 -0
- package/dist/componentProps/molecules/card/featureproductcard/FeaturedProductCardProps.d.ts +1 -1
- package/dist/componentProps/molecules/card/swatchcard/SwatchCardProps.d.ts +2 -1
- package/dist/componentProps/molecules/carousel/carouselarrowcontrols/CarouselArrowControlsProps.d.ts +9 -0
- package/dist/componentProps/molecules/carousel/carouseldots/CarouselDotsProps.d.ts +6 -0
- package/dist/componentProps/{organisms/banner/columnbanner → molecules/carousel/columncarousel}/ColumnCarouselProps.d.ts +5 -5
- package/dist/componentProps/molecules/searchbar/SearchBarProps.d.ts +1 -2
- package/dist/componentProps/molecules/selectors/breadcrumb/BreadcrumbsProps.d.ts +1 -1
- package/dist/componentProps/molecules/selectors/slidingtabselector/SlidingTabsSelectorProps.d.ts +1 -1
- package/dist/componentProps/organisms/banner/columnbanner/ColumnBannerProps.d.ts +3 -8
- package/dist/componentProps/organisms/banner/featurebanner/FeatureBannerProps.d.ts +8 -3
- package/dist/componentProps/organisms/banner/herobanner/CallToActionHeroProps.d.ts +1 -1
- package/dist/componentProps/organisms/cart/purchasepanel/PurchasePanelLeftPanelProps.d.ts +2 -2
- package/dist/componentProps/organisms/cart/purchasepanel/PurchasePanelProps.d.ts +2 -2
- package/dist/componentProps/organisms/documentlinkcollection/DocumentLinkCollectionProps.d.ts +5 -2
- package/dist/componentProps/organisms/featurecards/featurecardscollection/FeatureCardCollectionProps.d.ts +2 -10
- package/dist/componentProps/organisms/search/searchheader/SearchHeaderProps.d.ts +5 -0
- package/dist/componentProps/scene/proresource/ProResourceSceneProps.d.ts +12 -0
- package/dist/componentProps/{scene/articlelanding/ArticleLandingSceneProps.d.ts → templates/articlelandingpagetemplate/ArticleLandingPageTemplateProps.d.ts} +1 -1
- package/dist/componentProps/templates/productdetailpagetemplate/ProductDetailPageTemplateProps.d.ts +2 -2
- package/dist/index.cjs +8 -8
- package/dist/index.d.ts +6 -0
- package/dist/index.js +1568 -1621
- package/dist/stories/atoms/buttons/buttongrid/ButtonGrid.test.d.ts +1 -0
- package/dist/stories/atoms/buttons/iconbutton/IconButton.test.d.ts +1 -0
- package/dist/stories/atoms/buttons/radiooption/RadioOption.test.d.ts +1 -0
- package/dist/stories/atoms/checkbox/Checkbox.test.d.ts +1 -0
- package/dist/stories/atoms/htmlblock/HtmlBlock.test.d.ts +1 -0
- package/dist/stories/atoms/image/Image.test.d.ts +1 -0
- package/dist/stories/atoms/input/Input.test.d.ts +1 -0
- package/dist/stories/atoms/layout/ContentContainer/ContentContainer.test.d.ts +1 -0
- package/dist/stories/atoms/layout/ContentGrid/ContentGrid.test.d.ts +1 -0
- package/dist/stories/atoms/layout/FlowRow/FlowRow.test.d.ts +1 -0
- package/dist/stories/atoms/text/Text.test.d.ts +1 -0
- package/dist/stories/molecules/banner/articlebannercontent/ArticleBannerContent.test.d.ts +1 -0
- package/dist/stories/molecules/banner/calltoactionherocontent/CallToActionHeroContent.test.d.ts +1 -0
- package/dist/stories/molecules/banner/featuredarticlebannercontent/FeaturedArticleBannerContent.test.d.ts +1 -0
- package/dist/stories/molecules/banner/standardcopybannercontent/StandardCopyBannerContent.test.d.ts +1 -0
- package/dist/stories/molecules/card/articlerecentcard/ArticleRecentCard.test.d.ts +1 -0
- package/dist/stories/molecules/card/columncarouselcard/ColumnCarouselCard.d.ts +4 -0
- package/dist/stories/molecules/card/columncarouselcard/ColumnCarouselCard.test.d.ts +1 -0
- package/dist/stories/molecules/card/documentlinkcard/DocumentLinkCard.test.d.ts +1 -0
- package/dist/stories/molecules/card/faqcard/FaqCard.test.d.ts +1 -0
- package/dist/stories/molecules/card/featurecard/FeatureCard.test.d.ts +1 -0
- package/dist/stories/molecules/card/featureproductcard/FeaturedProductCard.test.d.ts +1 -0
- package/dist/stories/molecules/card/moreinfohighlightscard/MoreInfoHighlightsCard.test.d.ts +1 -0
- package/dist/stories/molecules/carousel/carouselarrowcontrols/CarouselArrowControls.d.ts +4 -0
- package/dist/stories/molecules/carousel/carouselarrowcontrols/CarouselArrowControls.test.d.ts +1 -0
- package/dist/stories/molecules/carousel/carouseldots/CarouselDots.d.ts +4 -0
- package/dist/stories/molecules/carousel/carouseldots/CarouselDots.test.d.ts +1 -0
- package/dist/stories/molecules/carousel/columncarousel/ColumnCarousel.d.ts +4 -0
- package/dist/stories/molecules/carousel/columncarousel/ColumnCarousel.test.d.ts +1 -0
- package/dist/stories/molecules/cart/cartactions/CartActions.test.d.ts +1 -0
- package/dist/stories/molecules/clickable/clickablecard/ClickableCard.test.d.ts +1 -0
- package/dist/stories/molecules/segmentedcontrol/SegmentedControl.test.d.ts +1 -0
- package/dist/stories/molecules/selectors/appliedoptionslist/AppliedOptionsList.test.d.ts +1 -0
- package/dist/stories/molecules/selectors/radiooptionselector/RadioOptionSelector.test.d.ts +1 -0
- package/dist/stories/molecules/selectors/verticalcheckboxlist/VerticalCheckboxList.test.d.ts +1 -0
- package/dist/stories/molecules/selectors/verticalcolorswatchlist/VerticalColorSwatchList.test.d.ts +1 -0
- package/dist/stories/molecules/selectors/verticaltablist/VerticalTabList.test.d.ts +1 -0
- package/dist/stories/organisms/banner/featurebanner/FeatureBanner.test.d.ts +1 -0
- package/dist/stories/organisms/cart/purchasepanel/PurchasePanel.d.ts +0 -8
- package/dist/stories/organisms/decorgrid/DecorGrid.test.d.ts +1 -0
- package/dist/stories/organisms/search/searchheader/SearchHeader.d.ts +4 -0
- package/dist/stories/organisms/search/searchheader/SearchHeader.test.d.ts +1 -0
- package/dist/stories/scenes/proresource/ProResourceScene.d.ts +4 -0
- package/dist/stories/templates/articlelandingpagetemplate/ArticleLandingPageTemplate.d.ts +4 -0
- package/package.json +11 -4
- package/dist/componentProps/organisms/banner/columnbanner/ColumnBannerHeaderProps.d.ts +0 -4
- package/dist/componentProps/organisms/banner/columnbanner/ColumnBannerTabsProps.d.ts +0 -10
- package/dist/componentProps/organisms/banner/columnbanner/ColumnCarouselCardProps.d.ts +0 -15
- package/dist/componentProps/scene/productdetailscene/ProductDetailSceneProps.d.ts +0 -10
- package/dist/stories/organisms/banner/columnbanner/parts/ColumnBannerHeader.d.ts +0 -4
- package/dist/stories/organisms/banner/columnbanner/parts/ColumnBannerTabs.d.ts +0 -3
- package/dist/stories/organisms/banner/columnbanner/parts/ColumnCarousel.d.ts +0 -4
- package/dist/stories/organisms/banner/columnbanner/parts/ColumnCarouselCard.d.ts +0 -4
- package/dist/stories/scenes/articlelanding/ArticleLandingScene.d.ts +0 -4
- package/dist/stories/scenes/productDetailScene/ProductDetailScene.d.ts +0 -4
|
@@ -9,5 +9,5 @@ export type TextProps<E extends React.ElementType = "p"> = {
|
|
|
9
9
|
variant?: TextVariant;
|
|
10
10
|
className?: string;
|
|
11
11
|
children: React.ReactNode;
|
|
12
|
-
} & AsProp<E> & Omit<React.ComponentPropsWithoutRef<E>, PropsToOmit<E,
|
|
12
|
+
} & AsProp<E> & Omit<React.ComponentPropsWithoutRef<E>, PropsToOmit<E, Record<never, never>>>;
|
|
13
13
|
export {};
|
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
export interface ColumnCarouselItem {
|
|
2
|
+
id: string;
|
|
3
|
+
label: string;
|
|
4
|
+
href: string;
|
|
5
|
+
source: string;
|
|
6
|
+
alt?: string;
|
|
7
|
+
description?: string;
|
|
8
|
+
}
|
|
9
|
+
export type ColumnCarouselCardProps = {
|
|
10
|
+
id: string;
|
|
11
|
+
item: ColumnCarouselItem;
|
|
12
|
+
absoluteIdx: number;
|
|
13
|
+
isActive: boolean;
|
|
14
|
+
showLabel: boolean;
|
|
15
|
+
grow: number;
|
|
16
|
+
isLoaded: boolean;
|
|
17
|
+
isFav: boolean;
|
|
18
|
+
setActiveIndex: (n: number | null) => void;
|
|
19
|
+
onLoaded: (id: string) => void;
|
|
20
|
+
onToggleFav: (item: ColumnCarouselItem) => void;
|
|
21
|
+
onItemClick?: (item: ColumnCarouselItem) => void;
|
|
22
|
+
};
|
|
@@ -1,11 +1,12 @@
|
|
|
1
1
|
export type SwatchStatus = "new" | "discontinued" | "comingSoon" | "sale";
|
|
2
2
|
export interface SwatchCardProps {
|
|
3
|
+
id?: string;
|
|
3
4
|
imageSrc: string;
|
|
4
5
|
imageAlt: string;
|
|
5
6
|
title: string;
|
|
6
7
|
brand: string;
|
|
7
8
|
product: string;
|
|
8
9
|
decorNumber: string | number;
|
|
9
|
-
|
|
10
|
+
onSwatchClick?: () => void;
|
|
10
11
|
status?: SwatchStatus;
|
|
11
12
|
}
|
package/dist/componentProps/molecules/carousel/carouselarrowcontrols/CarouselArrowControlsProps.d.ts
ADDED
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
import type { ButtonProps } from "../../../atoms/buttons/button/ButtonProps";
|
|
2
|
+
export interface CarouselArrowControlsProps {
|
|
3
|
+
onPreviousClick: () => void;
|
|
4
|
+
onNextClick: () => void;
|
|
5
|
+
prevArrowButtonProps?: Partial<ButtonProps>;
|
|
6
|
+
nextArrowButtonProps?: Partial<ButtonProps>;
|
|
7
|
+
previousLabel?: string;
|
|
8
|
+
nextLabel?: string;
|
|
9
|
+
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type { ColumnCarouselItem } from "../../card/columncarouselcard/ColumnCarouselCardProps";
|
|
2
2
|
export type ColumnCarouselProps = {
|
|
3
|
-
items:
|
|
3
|
+
items: ColumnCarouselItem[];
|
|
4
4
|
startIndex: number;
|
|
5
5
|
activeIndex: number | null;
|
|
6
6
|
setActiveIndex: (n: number | null) => void;
|
|
@@ -11,7 +11,7 @@ export type ColumnCarouselProps = {
|
|
|
11
11
|
loadedIds: Set<string>;
|
|
12
12
|
favoriteIds: Set<string>;
|
|
13
13
|
onLoaded: (id: string) => void;
|
|
14
|
-
onToggleFav: (item:
|
|
15
|
-
onItemClick?: (item:
|
|
16
|
-
getItemId?: (item:
|
|
14
|
+
onToggleFav: (item: ColumnCarouselItem) => void;
|
|
15
|
+
onItemClick?: (item: ColumnCarouselItem) => void;
|
|
16
|
+
getItemId?: (item: ColumnCarouselItem) => string;
|
|
17
17
|
};
|
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import type { ColumnCarouselItem } from "../../../molecules/card/columncarouselcard/ColumnCarouselCardProps";
|
|
1
2
|
export interface TabItem {
|
|
2
3
|
label: string;
|
|
3
4
|
columns?: ColumnGroup[];
|
|
@@ -6,14 +7,7 @@ export interface ColumnTab {
|
|
|
6
7
|
label: string;
|
|
7
8
|
items: CtaItem[];
|
|
8
9
|
}
|
|
9
|
-
export
|
|
10
|
-
id: string;
|
|
11
|
-
label: string;
|
|
12
|
-
href: string;
|
|
13
|
-
source: string;
|
|
14
|
-
alt?: string;
|
|
15
|
-
description?: string;
|
|
16
|
-
}
|
|
10
|
+
export type CtaItem = ColumnCarouselItem;
|
|
17
11
|
export interface ColumnGroup {
|
|
18
12
|
group: string;
|
|
19
13
|
title: string;
|
|
@@ -25,6 +19,7 @@ export interface ColumnBannerProps {
|
|
|
25
19
|
body?: string;
|
|
26
20
|
description?: string;
|
|
27
21
|
TabsWithColumns: TabItem[];
|
|
22
|
+
favoriteIds?: string[];
|
|
28
23
|
onFavoriteToggle?: (item: CtaItem, isFavorite: boolean) => void;
|
|
29
24
|
onItemClick?: (item: CtaItem) => void;
|
|
30
25
|
}
|
|
@@ -1,10 +1,15 @@
|
|
|
1
|
-
type
|
|
1
|
+
export type FeatureBannerAlign = "left" | "right";
|
|
2
|
+
export interface FeatureBannerButtonClickPayload {
|
|
3
|
+
buttonLabel: string;
|
|
4
|
+
buttonHref?: string;
|
|
5
|
+
}
|
|
2
6
|
export interface FeatureBannerProps {
|
|
3
7
|
imageSrc: string;
|
|
4
8
|
imageAlt?: string;
|
|
5
9
|
headline: string;
|
|
6
10
|
body: string;
|
|
7
11
|
buttonLabel: string;
|
|
8
|
-
|
|
12
|
+
buttonHref?: string;
|
|
13
|
+
align?: FeatureBannerAlign;
|
|
14
|
+
onButtonClick?: (payload: FeatureBannerButtonClickPayload) => void;
|
|
9
15
|
}
|
|
10
|
-
export {};
|
|
@@ -6,7 +6,7 @@ export type CallToActionHeroCta = {
|
|
|
6
6
|
intent?: ButtonIntent;
|
|
7
7
|
className?: string;
|
|
8
8
|
href?: string;
|
|
9
|
-
|
|
9
|
+
onCtaClick?: React.MouseEventHandler<HTMLButtonElement>;
|
|
10
10
|
};
|
|
11
11
|
export interface CallToActionHeroProps {
|
|
12
12
|
imageSrc: string;
|
|
@@ -6,7 +6,7 @@ export type SwatchOption = ButtonGridItem & {
|
|
|
6
6
|
value: string;
|
|
7
7
|
disabled?: boolean;
|
|
8
8
|
active?: boolean;
|
|
9
|
-
|
|
9
|
+
onOptionClick?: () => void;
|
|
10
10
|
};
|
|
11
11
|
export type SwatchPurchasePanelLeftPanelNavigateMeta = {
|
|
12
12
|
kind: "availability" | "returnPolicy";
|
|
@@ -35,7 +35,7 @@ export type PurchasePanelLeftPanelProps = {
|
|
|
35
35
|
notReturnableText?: string;
|
|
36
36
|
returnPolicyHref?: string;
|
|
37
37
|
returnPolicyLabel?: string;
|
|
38
|
-
|
|
38
|
+
onPurchaseInfoLinkClick?: (href: string, meta?: SwatchPurchasePanelLeftPanelNavigateMeta) => void;
|
|
39
39
|
priceLabel?: string;
|
|
40
40
|
initialQuantity?: number;
|
|
41
41
|
minQuantity?: number;
|
|
@@ -14,7 +14,7 @@ export type PurchasePanelOptionProps = {
|
|
|
14
14
|
disabled?: boolean;
|
|
15
15
|
value?: string;
|
|
16
16
|
active?: boolean;
|
|
17
|
-
|
|
17
|
+
onOptionClick?: (id: string) => void;
|
|
18
18
|
};
|
|
19
19
|
export type CartOrderProps = {
|
|
20
20
|
type: PurchasePanelTab;
|
|
@@ -84,7 +84,7 @@ export type PurchasePanelProps = {
|
|
|
84
84
|
returnPolicyHref?: string;
|
|
85
85
|
returnPolicyLabel?: string;
|
|
86
86
|
notReturnableText?: string;
|
|
87
|
-
|
|
87
|
+
onPurchaseInfoLinkClick?: (href: string, meta?: SwatchPurchasePanelNavigateMeta) => void;
|
|
88
88
|
};
|
|
89
89
|
export type GroupName = "product" | "grade" | "texture" | "size";
|
|
90
90
|
export type SelectedState = Record<GroupName, string | null>;
|
package/dist/componentProps/organisms/documentlinkcollection/DocumentLinkCollectionProps.d.ts
CHANGED
|
@@ -1,5 +1,8 @@
|
|
|
1
|
-
import { DocumentLinkCardProps } from "../../molecules/card/documentlinkcard/DocumentLinkCardProps";
|
|
1
|
+
import type { DocumentLinkCardProps } from "../../molecules/card/documentlinkcard/DocumentLinkCardProps";
|
|
2
|
+
export interface DocumentLinkCardItem extends DocumentLinkCardProps {
|
|
3
|
+
id: string;
|
|
4
|
+
}
|
|
2
5
|
export interface DocumentLinkCollectionProps {
|
|
3
6
|
title: string;
|
|
4
|
-
documentLinkCards:
|
|
7
|
+
documentLinkCards: DocumentLinkCardItem[];
|
|
5
8
|
}
|
|
@@ -1,13 +1,5 @@
|
|
|
1
|
-
import type {
|
|
2
|
-
export type FeatureCardCollectionItem =
|
|
3
|
-
imageSrc: string;
|
|
4
|
-
imageAlt?: string;
|
|
5
|
-
title: string;
|
|
6
|
-
description?: string;
|
|
7
|
-
buttonLabel?: string;
|
|
8
|
-
onCardClick?: () => void;
|
|
9
|
-
onCtaClick?: (payload: FeatureCardClickPayload) => void;
|
|
10
|
-
};
|
|
1
|
+
import type { FeatureCardProps } from "../../../molecules/card/featurecard/FeatureCardProps";
|
|
2
|
+
export type FeatureCardCollectionItem = FeatureCardProps;
|
|
11
3
|
export type FeatureCardCollectionProps = {
|
|
12
4
|
title?: string;
|
|
13
5
|
body?: string;
|
|
@@ -0,0 +1,12 @@
|
|
|
1
|
+
import type { StandardCopyHeroProps } from "../../organisms/banner/standardcopyhero/StandardCopyHeroProps";
|
|
2
|
+
import type { MultiButtonBarProps } from "../../molecules/selectors/multibuttonbar/MultiButtonBarProps";
|
|
3
|
+
import type { DocumentLinkCollectionProps } from "../../organisms/documentlinkcollection/DocumentLinkCollectionProps";
|
|
4
|
+
import type { FeatureBannerProps } from "../../organisms/banner/featurebanner/FeatureBannerProps";
|
|
5
|
+
import type { FaqCardCollectionProps } from "../../organisms/faqcardcollection/FaqCardCollectionProps";
|
|
6
|
+
export type ProResourceSceneProps = {
|
|
7
|
+
standardCopyHeroProps: StandardCopyHeroProps;
|
|
8
|
+
multiButtonBarProps: MultiButtonBarProps;
|
|
9
|
+
documentLinkCollectionProps: DocumentLinkCollectionProps;
|
|
10
|
+
featureBannerProps: FeatureBannerProps;
|
|
11
|
+
faqCardCollectionProps: FaqCardCollectionProps;
|
|
12
|
+
};
|
|
@@ -4,7 +4,7 @@ import type { FilterBarProps } from "../../molecules/selectors/filterbar/FilterB
|
|
|
4
4
|
import type { DropdownFilterProps } from "../../molecules/selectors/filterbar/DropdownFilterProps";
|
|
5
5
|
import type { FeaturedArticleBannerProps } from "../../organisms/banner/featuredarticlebanner/FeaturedArticleBannerProps";
|
|
6
6
|
import type { FeatureCardCollectionProps } from "../../organisms/featurecards/featurecardscollection/FeatureCardCollectionProps";
|
|
7
|
-
export type
|
|
7
|
+
export type ArticleLandingPageTemplateProps = {
|
|
8
8
|
standardCopyHeroProps: StandardCopyHeroProps;
|
|
9
9
|
multiButtonBarProps: MultiButtonBarProps;
|
|
10
10
|
filterBarProps: FilterBarProps;
|
package/dist/componentProps/templates/productdetailpagetemplate/ProductDetailPageTemplateProps.d.ts
CHANGED
|
@@ -218,7 +218,7 @@ export type ProductDetailOrder = {
|
|
|
218
218
|
currency?: string;
|
|
219
219
|
bigCommerceProductId?: string | number;
|
|
220
220
|
};
|
|
221
|
-
export type ProductDetailCartFlyoutProps =
|
|
221
|
+
export type ProductDetailCartFlyoutProps = CartFlyoutProps;
|
|
222
222
|
export type ProductDetailPageTemplateProps = {
|
|
223
223
|
breadcrumbsProps?: BreadcrumbsProps;
|
|
224
224
|
productData: ProductDetailData;
|
|
@@ -226,6 +226,6 @@ export type ProductDetailPageTemplateProps = {
|
|
|
226
226
|
onDownloadFullSheet?: (productData: ProductDetailData) => void;
|
|
227
227
|
onAddToWishlist?: (payload: ProductDetailWishlistPayload, productData: ProductDetailData) => void;
|
|
228
228
|
onAddToCart?: (order: ProductDetailOrder, productData: ProductDetailData) => void;
|
|
229
|
-
|
|
229
|
+
onProductNavigate?: (href: string, meta?: unknown) => void;
|
|
230
230
|
cartFlyoutProps?: ProductDetailCartFlyoutProps;
|
|
231
231
|
};
|