@evenicanpm/storefront-core 1.0.6 → 1.2.0

package/src/pages-v2/checkout/checkout-alt-form/types.ts

@@ -1,20 +1,20 @@
 export interface Address {
-  id: number;
-  name: string;
-  phone: string;
-  street1: string;
-  street2: string;
+	id: number;
+	name: string;
+	phone: string;
+	street1: string;
+	street2: string;
 }
 
 export interface InitialValues {
-  card: string;
-  date: string;
-  time: string;
-  address: string;
-  voucher: string;
-  cardCVC: string;
-  cardYear: string;
-  cardMonth: string;
-  cardNumber: string;
-  cardHolderName: string;
+	card: string;
+	date: string;
+	time: string;
+	address: string;
+	voucher: string;
+	cardCVC: string;
+	cardYear: string;
+	cardMonth: string;
+	cardNumber: string;
+	cardHolderName: string;
 }

package/src/pages-v2/checkout/checkout-alt-summary/cart-item.tsx

@@ -3,70 +3,70 @@
 import React, { createContext, useContext, ReactNode } from "react";
 import { FlexBetween } from "@evenicanpm/storefront-core/src/components-v2/flex-box/index";
 import {
-  Paragraph,
-  Span,
+	Paragraph,
+	Span,
 } from "@evenicanpm/storefront-core/src/components-v2/Typography";
-import useCurrencyFormatter from "@/lib/currency-formatter";
-import { CartLine } from "@/api-manager/schemas/cart.schema";
+import useCurrencyFormatter from "@evenicanpm/storefront-core/src/lib/currency-formatter";
+import { CartLine } from "@evenicanpm/storefront-core/src/api-manager/schemas/cart.schema";
 
 interface CartItemContextValue {
-  cartLine: CartLine;
-  formatCurrency: (value: number) => string;
+	cartLine: CartLine;
+	formatCurrency: (value: number) => string;
 }
 const CartItemContext = createContext<CartItemContextValue | null>(null);
 interface CartItemProps {
-  cartLine: CartLine;
-  children?: ReactNode;
+	cartLine: CartLine;
+	children?: ReactNode;
 }
 const CartItem = ({ cartLine, children }: CartItemProps) => {
-  const { formatCurrency } = useCurrencyFormatter();
-  return (
-    <CartItemContext.Provider value={{ cartLine, formatCurrency }}>
-      <FlexBetween mb={1.5}>
-        {children ?? (
-          <>
-            <CartItem.Description />
-            <CartItem.Price />
-          </>
-        )}
-      </FlexBetween>
-    </CartItemContext.Provider>
-  );
+	const { formatCurrency } = useCurrencyFormatter();
+	return (
+		<CartItemContext.Provider value={{ cartLine, formatCurrency }}>
+			<FlexBetween mb={1.5}>
+				{children ?? (
+					<>
+						<CartItem.Description />
+						<CartItem.Price />
+					</>
+				)}
+			</FlexBetween>
+		</CartItemContext.Provider>
+	);
 };
 
 CartItem.Description = () => {
-  const ctx = useContext(CartItemContext);
-  if (!ctx) return null;
-  const { cartLine } = ctx;
-  return (
-    <Paragraph>
-      <Span fontWeight="700">{cartLine.Quantity}</Span> x{" "}
-      {cartLine.Product?.Name}
-    </Paragraph>
-  );
+	const ctx = useContext(CartItemContext);
+	if (!ctx) return null;
+	const { cartLine } = ctx;
+	return (
+		<Paragraph>
+			<Span fontWeight="700">{cartLine.Quantity}</Span> x{" "}
+			{cartLine.Product?.Name}
+		</Paragraph>
+	);
 };
 
 CartItem.Price = () => {
-  const ctx = useContext(CartItemContext);
-  if (!ctx) return null;
-  const { cartLine, formatCurrency } = ctx;
-  const hasDiscount = cartLine.DiscountAmount && cartLine.DiscountAmount > 0;
+	const ctx = useContext(CartItemContext);
+	if (!ctx) return null;
+	const { cartLine, formatCurrency } = ctx;
+	const hasDiscount = cartLine.DiscountAmount && cartLine.DiscountAmount > 0;
 
-  return (
-    <Paragraph>
-      {hasDiscount ? (
-        <s>{formatCurrency(cartLine.NetPrice || 0)}</s>
-      ) : (
-        formatCurrency(cartLine.TotalAmount || 0)
-      )}
-      {hasDiscount ? (
-        <Span color="error.500">
-          {" "}
-          {formatCurrency(cartLine.TotalAmount || 0)}
-        </Span>
-      ) : null}
-    </Paragraph>
-  );
+	return (
+		<Paragraph>
+			{hasDiscount ? (
+				<s>{formatCurrency(cartLine.NetPrice || 0)}</s>
+			) : (
+				formatCurrency(cartLine.TotalAmount || 0)
+			)}
+			{hasDiscount ? (
+				<Span color="error.500">
+					{" "}
+					{formatCurrency(cartLine.TotalAmount || 0)}
+				</Span>
+			) : null}
+		</Paragraph>
+	);
 };
 
 export default CartItem;

package/src/pages-v2/checkout/checkout-alt-summary/checkout-alt-summary.tsx

@@ -10,80 +10,83 @@ import { Paragraph } from "@evenicanpm/storefront-core/src/components-v2/Typogra
 import CartItem from "@evenicanpm/storefront-core/src/pages-v2/checkout/checkout-alt-summary/cart-item";
 import ListItem from "@evenicanpm/storefront-core/src/pages-v2/checkout/checkout-alt-summary/list-item";
 // TYPES
-import { Cart, CartLine } from "@/api-manager/schemas/cart.schema";
+import {
+	Cart,
+	CartLine,
+} from "@evenicanpm/storefront-core/src/api-manager/schemas/cart.schema";
 
 interface Props {
-  cart: Cart;
-  children?: ReactNode;
+	cart: Cart;
+	children?: ReactNode;
 }
 interface CheckoutAltSummaryContextProps {
-  cart: Cart;
-  t: ReturnType<typeof useTranslations>;
+	cart: Cart;
+	t: ReturnType<typeof useTranslations>;
 }
 
 const CheckoutAltSummaryContext =
-  createContext<CheckoutAltSummaryContextProps | null>(null);
+	createContext<CheckoutAltSummaryContextProps | null>(null);
 
 const CheckoutAltSummary = ({ cart, children }: Props) => {
-  const t = useTranslations("Checkout.Summary");
+	const t = useTranslations("Checkout.Summary");
 
-  return (
-    <CheckoutAltSummaryContext.Provider value={{ cart, t }}>
-      <div>{children}</div>
-    </CheckoutAltSummaryContext.Provider>
-  );
+	return (
+		<CheckoutAltSummaryContext.Provider value={{ cart, t }}>
+			<div>{children}</div>
+		</CheckoutAltSummaryContext.Provider>
+	);
 };
 
 CheckoutAltSummary.Title = () => {
-  const ctx = useContext(CheckoutAltSummaryContext);
-  if (!ctx) return null;
-  const { t } = ctx;
-  return (
-    <Paragraph color="secondary.900" fontWeight={700} mb={2}>
-      {t("summaryTitle")}
-    </Paragraph>
-  );
+	const ctx = useContext(CheckoutAltSummaryContext);
+	if (!ctx) return null;
+	const { t } = ctx;
+	return (
+		<Paragraph color="secondary.900" fontWeight={700} mb={2}>
+			{t("summaryTitle")}
+		</Paragraph>
+	);
 };
 
 CheckoutAltSummary.CartItems = () => {
-  const ctx = useContext(CheckoutAltSummaryContext);
-  if (!ctx) return null;
-  const { cart } = ctx;
-  return (
-    <>
-      {cart.CartLines?.map((cl: CartLine) => (
-        <CartItem cartLine={cl} key={cl.LineId} />
-      ))}
-    </>
-  );
+	const ctx = useContext(CheckoutAltSummaryContext);
+	if (!ctx) return null;
+	const { cart } = ctx;
+	return (
+		<>
+			{cart.CartLines?.map((cl: CartLine) => (
+				<CartItem cartLine={cl} key={cl.LineId} />
+			))}
+		</>
+	);
 };
 
 CheckoutAltSummary.Divider = (props: { sx?: object }) => {
-  return <Box component={Divider} borderColor="grey.300" {...props} />;
+	return <Box component={Divider} borderColor="grey.300" {...props} />;
 };
 
 CheckoutAltSummary.ListItem = ({
-  cartKey,
-  titleKey,
-  color,
-  mb,
+	cartKey,
+	titleKey,
+	color,
+	mb,
 }: {
-  cartKey: keyof Cart;
-  titleKey: string;
-  color?: string;
-  mb?: number;
+	cartKey: keyof Cart;
+	titleKey: string;
+	color?: string;
+	mb?: number;
 }) => {
-  const ctx = useContext(CheckoutAltSummaryContext);
-  if (!ctx) return null;
-  const { cart, t } = ctx;
-  return (
-    <ListItem
-      title={t(titleKey)}
-      value={typeof cart[cartKey] === "number" ? cart[cartKey] : 0}
-      color={color}
-      mb={mb}
-    />
-  );
+	const ctx = useContext(CheckoutAltSummaryContext);
+	if (!ctx) return null;
+	const { cart, t } = ctx;
+	return (
+		<ListItem
+			title={t(titleKey)}
+			value={typeof cart[cartKey] === "number" ? cart[cartKey] : 0}
+			color={color}
+			mb={mb}
+		/>
+	);
 };
 
 export default CheckoutAltSummary;

package/src/pages-v2/checkout/checkout-alt-summary/list-item.tsx

@@ -1,73 +1,73 @@
 import { ReactNode, createContext, useContext } from "react";
 import { Paragraph } from "@evenicanpm/storefront-core/src/components-v2/Typography";
 import { FlexBetween } from "@evenicanpm/storefront-core/src/components-v2/flex-box/index";
-import useCurrencyFormatter from "@/lib/currency-formatter";
+import useCurrencyFormatter from "@evenicanpm/storefront-core/src/lib/currency-formatter";
 
 interface ListItemProps {
-  title: string;
-  value?: number;
-  mb?: number;
-  color?: string;
-  children?: ReactNode;
+	title: string;
+	value?: number;
+	mb?: number;
+	color?: string;
+	children?: ReactNode;
 }
 
 interface ListItemContextValue {
-  title: string;
-  value?: number;
-  mb: number;
-  color: string;
-  formatCurrency: (val: number) => string;
+	title: string;
+	value?: number;
+	mb: number;
+	color: string;
+	formatCurrency: (val: number) => string;
 }
 
 const ListItemContext = createContext<ListItemContextValue | null>(null);
 
 const ListItem = ({
-  title,
-  value,
-  mb = 0.5,
-  color = "grey.600",
-  children,
+	title,
+	value,
+	mb = 0.5,
+	color = "grey.600",
+	children,
 }: ListItemProps) => {
-  const { formatCurrency } = useCurrencyFormatter();
+	const { formatCurrency } = useCurrencyFormatter();
 
-  const contextValue: ListItemContextValue = {
-    title,
-    value,
-    mb,
-    color,
-    formatCurrency,
-  };
+	const contextValue: ListItemContextValue = {
+		title,
+		value,
+		mb,
+		color,
+		formatCurrency,
+	};
 
-  return (
-    <ListItemContext.Provider value={contextValue}>
-      <FlexBetween mb={mb}>
-        {children ?? (
-          <>
-            <ListItem.Title />
-            <ListItem.Value />
-          </>
-        )}
-      </FlexBetween>
-    </ListItemContext.Provider>
-  );
+	return (
+		<ListItemContext.Provider value={contextValue}>
+			<FlexBetween mb={mb}>
+				{children ?? (
+					<>
+						<ListItem.Title />
+						<ListItem.Value />
+					</>
+				)}
+			</FlexBetween>
+		</ListItemContext.Provider>
+	);
 };
 
 ListItem.Title = () => {
-  const ctx = useContext(ListItemContext);
-  if (!ctx) return null;
-  const { title, color } = ctx;
-  return <Paragraph color={color}>{title}:</Paragraph>;
+	const ctx = useContext(ListItemContext);
+	if (!ctx) return null;
+	const { title, color } = ctx;
+	return <Paragraph color={color}>{title}:</Paragraph>;
 };
 
 ListItem.Value = () => {
-  const ctx = useContext(ListItemContext);
-  if (!ctx) return null;
-  const { value, formatCurrency } = ctx;
-  return (
-    <Paragraph fontWeight="700">
-      {value ? formatCurrency(value) : "-"}
-    </Paragraph>
-  );
+	const ctx = useContext(ListItemContext);
+	if (!ctx) return null;
+	const { value, formatCurrency } = ctx;
+	return (
+		<Paragraph fontWeight="700">
+			{value ? formatCurrency(value) : "-"}
+		</Paragraph>
+	);
 };
 
 export default ListItem;

package/src/pages-v2/confirmation/address.tsx

@@ -4,44 +4,48 @@ import React, { ReactNode, createContext, useContext } from "react";
 import { useTranslations } from "next-intl";
 import { Card } from "@mui/material";
 import {
-  H5,
-  Paragraph,
+	H5,
+	Paragraph,
 } from "@evenicanpm/storefront-core/src/components-v2/Typography";
-import { Address } from "@/api-manager/schemas/address.schema";
+import { Address } from "@evenicanpm/storefront-core/src/api-manager/schemas/address.schema";
 
 const AddressContext = createContext<Address | null>(null);
 
 type Props = {
-  address: Address;
-  children?: ReactNode;
+	address: Address;
+	children?: ReactNode;
 };
 
 const OrderAddress = ({ address, children }: Props) => {
-  return (
-    <AddressContext.Provider value={address}>
-      <Card sx={{ p: 3 }}>{children}</Card>
-    </AddressContext.Provider>
-  );
+	return (
+		<AddressContext.Provider value={address}>
+			<Card sx={{ p: 3 }}>{children}</Card>
+		</AddressContext.Provider>
+	);
 };
 
 OrderAddress.Heading = ({ children }: { children?: ReactNode }) => {
-  const t = useTranslations("Address");
-  return (
-    <H5 mt={0} mb={2}>
-      {children ?? t("shippingTo")}
-    </H5>
-  );
+	const t = useTranslations("Address");
+	return (
+		<H5 mt={0} mb={2}>
+			{children ?? t("shippingTo")}
+		</H5>
+	);
 };
 
-OrderAddress.Field = ({ property }) => {
-  const ctx = useContext(AddressContext);
-  if (!ctx) return null;
-  const address = ctx;
-  const value = address[property];
+OrderAddress.Field = ({
+	property,
+}: {
+	property: Exclude<keyof Address, "ExtensionProperties">;
+}) => {
+	const ctx = useContext(AddressContext);
+	if (!ctx) return null;
+	const address = ctx;
+	const value = address[property];
 
-  if (!value) return null;
+	if (!value) return null;
 
-  return <Paragraph>{value}</Paragraph>;
+	return <Paragraph>{value}</Paragraph>;
 };
 
 export default OrderAddress;

package/src/pages-v2/confirmation/confirmation-summary.tsx

@@ -1,94 +1,94 @@
 "use client";
 
 import {
-  FlexBetween,
-  FlexBox,
+	FlexBetween,
+	FlexBox,
 } from "@evenicanpm/storefront-core/src/components-v2/flex-box";
 import {
-  H6,
-  Paragraph,
+	H6,
+	Paragraph,
 } from "@evenicanpm/storefront-core/src/components-v2/Typography";
 import { Card, Divider } from "@mui/material";
 import { useTranslations } from "next-intl";
-import useCurrencyFormatter from "@/lib/currency-formatter";
+import useCurrencyFormatter from "@evenicanpm/storefront-core/src/lib/currency-formatter";
 import React, { ReactNode, createContext, useContext } from "react";
-import { SalesOrder } from "@/api-manager/schemas/order.schema";
+import { SalesOrder } from "@evenicanpm/storefront-core/src/api-manager/schemas/order.schema";
 
 type SummaryValues = {
-  order: SalesOrder;
+	order: SalesOrder;
 };
 
 const SummaryContext = createContext<
-  (SummaryValues & { formatCurrency: (v: number) => string }) | null
+	(SummaryValues & { formatCurrency: (v: number) => string }) | null
 >(null);
 
 type Props = SummaryValues & { children?: ReactNode };
 
 const OrderSummary = ({ order, children }: Props) => {
-  const { formatCurrency } = useCurrencyFormatter();
+	const { formatCurrency } = useCurrencyFormatter();
 
-  return (
-    <SummaryContext.Provider value={{ order, formatCurrency }}>
-      <Card sx={{ px: 3, mb: "30px" }}>
-        {children ?? (
-          <>
-            <OrderSummary.Title />
-            <OrderSummary.Item label="subtotal" field="SubtotalAmount" />
-            <OrderSummary.Item label="shipping" field="ShippingChargeAmount" />
-            <OrderSummary.Item label="tax" field="TaxAmount" />
-            <OrderSummary.Item label="discount" field="DiscountAmount" />
-            <Divider sx={{ mb: 1 }} />
-            <OrderSummary.Item label="total" field="TotalAmount" />
-          </>
-        )}
-      </Card>
-    </SummaryContext.Provider>
-  );
+	return (
+		<SummaryContext.Provider value={{ order, formatCurrency }}>
+			<Card sx={{ px: 3, mb: "30px" }}>
+				{children ?? (
+					<>
+						<OrderSummary.Title />
+						<OrderSummary.Item label="subtotal" field="SubtotalAmount" />
+						<OrderSummary.Item label="shipping" field="ShippingChargeAmount" />
+						<OrderSummary.Item label="tax" field="TaxAmount" />
+						<OrderSummary.Item label="discount" field="DiscountAmount" />
+						<Divider sx={{ mb: 1 }} />
+						<OrderSummary.Item label="total" field="TotalAmount" />
+					</>
+				)}
+			</Card>
+		</SummaryContext.Provider>
+	);
 };
 
 type ItemProps = {
-  label: string;
-  field: keyof SalesOrder;
+	label: string;
+	field: keyof SalesOrder;
 };
 
 OrderSummary.Title = () => {
-  const t = useTranslations("Confirmation");
-  return (
-    <FlexBox
-      justifyContent="center"
-      px={3}
-      py={2}
-      borderBottom="1px solid"
-      borderColor="divider"
-    >
-      {t("orderSummary")}
-    </FlexBox>
-  );
+	const t = useTranslations("Confirmation");
+	return (
+		<FlexBox
+			justifyContent="center"
+			px={3}
+			py={2}
+			borderBottom="1px solid"
+			borderColor="divider"
+		>
+			{t("orderSummary")}
+		</FlexBox>
+	);
 };
 
 OrderSummary.Item = ({ label, field }: ItemProps) => {
-  const ctx = useContext(SummaryContext);
-  if (!ctx) return null;
-  const t = useTranslations("Checkout.Summary");
-  const { formatCurrency, order } = ctx;
-  const value = order[field];
-  const numericValue =
-    typeof value === "number"
-      ? value
-      : typeof value === "string"
-        ? parseFloat(value)
-        : 0;
+	const ctx = useContext(SummaryContext);
+	if (!ctx) return null;
+	const t = useTranslations("Checkout.Summary");
+	const { formatCurrency, order } = ctx;
+	const value = order[field];
+	const numericValue =
+		typeof value === "number"
+			? value
+			: typeof value === "string"
+				? parseFloat(value)
+				: 0;
 
-  return (
-    <FlexBetween mb={1}>
-      <Paragraph color="grey.600">{t(label)}</Paragraph>
-      <H6>{formatCurrency(numericValue)}</H6>
-    </FlexBetween>
-  );
+	return (
+		<FlexBetween mb={1}>
+			<Paragraph color="grey.600">{t(label)}</Paragraph>
+			<H6>{formatCurrency(numericValue)}</H6>
+		</FlexBetween>
+	);
 };
 
 OrderSummary.Divider = (props: { sx?: object }) => {
-  return <Divider {...props} />;
+	return <Divider {...props} />;
 };
 
 export default OrderSummary;