formica-ui-lib 1.0.219 → 1.0.221

package/dist/componentProps/molecules/productinformation/colourmatchingchart/ColourMatchingChartProps.d.ts

@@ -0,0 +1,10 @@
+export type ColourMatchingChartValue = string | number;
+export type ColourMatchingChartCode = "LRV" | "RAL" | "NCS";
+export type ColourMatchingChartData = {
+    lrv?: ColourMatchingChartValue | null;
+    ral?: ColourMatchingChartValue | null;
+    ncs?: ColourMatchingChartValue | null;
+};
+export type ColourMatchingChartProps = {
+    colourMatching?: ColourMatchingChartData;
+};

package/dist/componentProps/molecules/selectors/segmentedcontrol/SegmentedControlProps.d.ts

@@ -3,10 +3,12 @@ export type SegmentedControlItem = {
     label: string;
     disabled?: boolean;
 };
+export type SegmentedControlLayoutVariant = "content" | "equalWidth";
 export type SegmentedControlProps = {
     items: SegmentedControlItem[];
     selectedId?: string;
     onSelect?: (id: string) => void;
+    layoutVariant?: SegmentedControlLayoutVariant;
     className?: string;
     buttonClassName?: string;
     disabled?: boolean;

package/dist/componentProps/organisms/account/AccountAccessPanelProps.d.ts

@@ -0,0 +1,59 @@
+import React from "react";
+export type AccountAccessPanelMode = "signIn" | "createAccount";
+export type AccountAccessPanelUserTypeValue = "architectDesigner" | "builderConstruction" | "dealerRetailer" | "distributor" | "fabricator" | "generalContractor" | "homeowner" | "mediaPress" | "other" | "postformer";
+export type AccountAccessPanelUserTypeOption = {
+    label: string;
+    value: AccountAccessPanelUserTypeValue;
+    disabled?: boolean;
+};
+export type AccountAccessPanelErrors = {
+    email?: string;
+    password?: string;
+    firstName?: string;
+    phoneNumber?: string;
+    userType?: string;
+    confirmPassword?: string;
+    termsAccepted?: string;
+};
+export type AccountAccessPanelData = {
+    mode?: AccountAccessPanelMode;
+    email?: string;
+    password?: string;
+    firstName?: string;
+    lastName?: string;
+    phoneNumber?: string;
+    userType?: AccountAccessPanelUserTypeValue | "";
+    confirmPassword?: string;
+    marketingOptIn?: boolean;
+    termsAccepted?: boolean;
+    passwordRequirementsText?: string;
+    userTypeOptions?: AccountAccessPanelUserTypeOption[];
+    errors?: AccountAccessPanelErrors;
+};
+export type AccountAccessPanelActionLabels = {
+    signInPrimary?: string;
+    createAccountPrimary?: string;
+    secondary?: string;
+};
+export type AccountAccessPanelProps = {
+    data: AccountAccessPanelData;
+    actionLabels?: AccountAccessPanelActionLabels;
+    onModeChange?: (mode: AccountAccessPanelMode) => void;
+    onEmailChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    onPasswordChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    onFirstNameChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    onLastNameChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    onPhoneNumberChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    onUserTypeChange?: (value: AccountAccessPanelUserTypeValue) => void;
+    onConfirmPasswordChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    onMarketingOptInChange?: (checked: boolean) => void;
+    onTermsAcceptedChange?: (checked: boolean) => void;
+    onEmailBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;
+    onPasswordBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;
+    onForgotPasswordClick?: (event: React.MouseEvent<HTMLAnchorElement>) => void;
+    onTermsClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
+    onPrivacyClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
+    onSignInClick?: () => void;
+    onCreateAccountClick?: () => void;
+    onSecondaryClick?: () => void;
+};

package/dist/componentProps/organisms/cart/carttotalspanel/CartTotalsPanelProps.d.ts

@@ -1,6 +1,9 @@
 import React from "react";
+export type CartDiscountCodeStatus = "idle" | "success" | "error";
 export interface CartTotalsPanelProps {
     discountCode?: string;
+    discountCodeStatus?: CartDiscountCodeStatus;
+    discountCodeMessage?: string;
     subtotalLabel?: string;
     discountLabel?: string;
     taxLabel?: string;

package/dist/componentProps/organisms/cart/checkoutsteppanel/CheckoutAccountStepProps.d.ts

@@ -1,20 +1,48 @@
 import React from "react";
+import type { AccountAccessPanelMode, AccountAccessPanelUserTypeValue } from "../../account/AccountAccessPanelProps";
 export interface CheckoutAccountStepProps {
     currentStep?: number;
     steps?: string[];
-    activeMode?: "createAccount" | "signIn";
+    activeMode?: AccountAccessPanelMode;
     email?: string;
     password?: string;
+    firstName?: string;
+    lastName?: string;
+    phoneNumber?: string;
+    userType?: AccountAccessPanelUserTypeValue | "";
+    confirmPassword?: string;
+    marketingOptIn?: boolean;
+    termsAccepted?: boolean;
+    passwordRequirementsText?: string;
     emailError?: string;
     passwordError?: string;
+    firstNameError?: string;
+    phoneNumberError?: string;
+    userTypeError?: string;
+    confirmPasswordError?: string;
+    termsAcceptedError?: string;
     emailHasError?: boolean;
     passwordHasError?: boolean;
-    onModeChange?: (mode: "createAccount" | "signIn") => void;
+    firstNameHasError?: boolean;
+    phoneNumberHasError?: boolean;
+    userTypeHasError?: boolean;
+    confirmPasswordHasError?: boolean;
+    termsAcceptedHasError?: boolean;
+    onModeChange?: (mode: AccountAccessPanelMode) => void;
     onEmailChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
     onPasswordChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    onFirstNameChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    onLastNameChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    onPhoneNumberChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    onUserTypeChange?: (value: AccountAccessPanelUserTypeValue) => void;
+    onConfirmPasswordChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    onMarketingOptInChange?: (checked: boolean) => void;
+    onTermsAcceptedChange?: (checked: boolean) => void;
     onEmailBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;
     onPasswordBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;
     onForgotPasswordClick?: (event: React.MouseEvent<HTMLAnchorElement>) => void;
+    onTermsClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
+    onPrivacyClick?: (event: React.MouseEvent<HTMLButtonElement>) => void;
     onContinue?: () => void;
     onContinueAsGuest?: () => void;
     className?: string;

package/dist/componentProps/organisms/cart/purchasepanel/PurchasePanelLeftPanelProps.d.ts

@@ -1,5 +1,6 @@
 import type { ButtonGridItem } from "../../../molecules/buttons/buttongrid/ButtonGridProps";
 import type { ReactNode } from "react";
+import type { ColourMatchingChartData } from "../../../molecules/productinformation/colourmatchingchart/ColourMatchingChartProps";
 export type SwatchPurchasePanelTab = "Sample" | "Buy Now" | string;
 export type SwatchOption = ButtonGridItem & {
     id: string;
@@ -17,6 +18,7 @@ export type PurchasePanelLeftPanelProps = {
     title?: string;
     decor?: string;
     description?: string;
+    colourMatching?: ColourMatchingChartData;
     patternRepeat?: string;
     onDownloadSwatch?: () => void;
     onDownloadFullSheet?: () => void;

package/dist/componentProps/organisms/cart/purchasepanel/PurchasePanelProps.d.ts

@@ -1,4 +1,5 @@
 import type { SwatchPurchasePanelCarousel } from "./PurchasePanelRightPanelProps";
+import type { ColourMatchingChartData } from "../../../molecules/productinformation/colourmatchingchart/ColourMatchingChartProps";
 export type PurchasePanelTab = "Sample" | "Buy Now" | string;
 export type SwatchPurchasePanelNavigateMeta = {
     kind: "availability" | "returnPolicy";
@@ -59,6 +60,7 @@ export type PurchasePanelProps = {
     decor?: string;
     title: string;
     description?: string;
+    colourMatching?: ColourMatchingChartData;
     patternRepeat?: string;
     onDownloadSwatch?: () => void;
     onDownloadFullSheet?: () => void;

package/dist/componentProps/organisms/navigation/TopNavBarProps.d.ts

@@ -29,6 +29,7 @@ export type TopNavCartSummary = {
 export type TopNavLogin = {
     label: string;
     href: string;
+    loggedIn?: boolean;
 };
 export type TopNavLogo = {
     src?: string;

package/dist/componentProps/organisms/sections/productinformationsection/ProductInformationSectionProps.d.ts

@@ -1,8 +1,10 @@
 import React from "react";
+import type { ColourMatchingChartData } from "../../../molecules/productinformation/colourmatchingchart/ColourMatchingChartProps";
 export type ProductInformationTabKey = "details" | "texture" | "sizeAndGrade";
 export type ProductDetailsData = {
     summary?: string;
     content?: React.ReactNode;
+    colourMatching?: ColourMatchingChartData;
 };
 export type TextureItem = {
     key: string;

package/dist/componentProps/templates/cartshippingtemplate/CartShippingTemplateProps.d.ts

@@ -11,5 +11,4 @@ export interface CartShippingTemplateProps {
     sameAsShipping?: boolean;
     sameAsShippingLabel?: string;
     onSameAsShippingChange?: (payload: CheckboxChangePayload) => void;
-    className?: string;
 }

package/dist/componentProps/templates/logintemplate/LoginTemplateProps.d.ts

@@ -0,0 +1,9 @@
+import type { AccountAccessPanelData, AccountAccessPanelErrors, AccountAccessPanelMode, AccountAccessPanelProps, AccountAccessPanelUserTypeOption, AccountAccessPanelUserTypeValue } from "../../organisms/account/AccountAccessPanelProps";
+export type LoginTemplateMode = AccountAccessPanelMode;
+export type LoginTemplateUserTypeValue = AccountAccessPanelUserTypeValue;
+export type LoginTemplateUserTypeOption = AccountAccessPanelUserTypeOption;
+export type LoginTemplateErrors = AccountAccessPanelErrors;
+export type LoginTemplateData = AccountAccessPanelData;
+export type LoginTemplateProps = Omit<AccountAccessPanelProps, "actionLabels" | "onSecondaryClick"> & {
+    onCancelClick?: () => void;
+};

package/dist/componentProps/templates/productdetailpagetemplate/ProductDetailPageTemplateProps.d.ts

@@ -1,6 +1,7 @@
 import { BreadcrumbsProps } from "../../molecules/selectors/breadcrumb/BreadcrumbsProps";
 import { ProductInformationTabKey, SizeAndGradeDefinition } from "../../organisms/sections/productinformationsection/ProductInformationSectionProps";
 import { CartFlyoutProps } from "../../organisms/cart/cartflyout/CartFlyoutProps";
+import type { ColourMatchingChartData } from "../../molecules/productinformation/colourmatchingchart/ColourMatchingChartProps";
 export type ProductDetailSimpleOption = {
     id: string;
     label: string;
@@ -30,6 +31,7 @@ export type ProductDetailProduct = {
     title?: string;
     brand?: string;
     description?: string;
+    colourMatching?: ColourMatchingChartData;
     sku?: string;
     patternRepeat?: string;
     currency?: string;
@@ -76,6 +78,7 @@ export type ProductDetailRange = {
     details?: {
         summary?: string;
         content?: string;
+        colourMatching?: ColourMatchingChartData;
     };
     texture?: {
         groups?: ProductDetailTextureGroup[];