@faststore/core 3.44.2 → 3.46.0

package/src/components/account/orders/MyAccountListOrders/styles.module.scss

@@ -0,0 +1,100 @@
+.page {
+  @import "./MyAccountListOrdersTable/styles.scss";
+  @import "./MyAccountSelectedTags/styles.scss";
+  @import "./MyAccountListOrdersEmptyState/styles.scss";
+  @import "../../components/MyAccountStatusBadge/styles.scss";
+
+  // --------------------------------------------------------
+  // Design Tokens
+  // --------------------------------------------------------
+
+  // Default properties
+  --fs-list-orders-padding                            : var(--fs-spacing-5);
+  --fs-page-height                                    : 100%;
+
+  // Title
+  --fs-list-orders-title-margin-bottom                : var(--fs-spacing-5);
+  --fs-list-orders-title-font-size                    : var(--fs-spacing-4);
+  --fs-list-orders-title-font-weight                  : var(--fs-text-weight-semibold);
+
+  // Search Filters
+  --fs-list-orders-filter-width                       : 55%;
+  --fs-list-orders-filter-margin-bottom               : var(--fs-spacing-3);
+  --fs-list-orders-filter-gap-mobile                  : var(--fs-grid-gap-0);
+  --fs-list-orders-filter-width-mobile                : 100%;
+  --fs-list-orders-filter-margin-bottom-mobile        : 0;
+
+  --fs-list-orders-filter-input-border-color-hover    : var(--fs-input-border-color-hover);
+  --fs-list-orders-filter-input-shadow-hover          : var(--fs-input-box-shadow-hover);
+
+  --fs-list-orders-filter-button-border-radius        : var(--fs-border-radius-pill);
+  --fs-list-orders-filter-button-height               : 2.375rem;
+  --fs-list-orders-filter-button-margin-left          : 0.6rem;
+
+  height: var(--fs-page-height);
+
+  [data-fs-list-orders] {
+    padding: var(--fs-list-orders-padding);
+
+    @include media("<notebook") {
+      padding-bottom: 0;
+    }
+  }
+
+  [data-fs-list-orders-title] {
+    margin-bottom: var(--fs-list-orders-title-margin-bottom);
+    font-size: var(--fs-list-orders-title-font-size);
+    font-weight: var(--fs-list-orders-title-font-weight);
+  }
+
+  [data-fs-list-orders-header] {
+    display: flex;
+    align-items: baseline;
+    justify-content: space-between;
+  }
+
+  [data-fs-list-orders-search-filters] {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    width: var(--fs-list-orders-filter-width);
+    margin-bottom: var(--fs-list-orders-filter-margin-bottom);
+
+    @include media("<notebook") {
+      flex-direction: column;
+      gap: var(--fs-list-orders-filter-gap-mobile);
+      align-items: flex-end;
+      width: var(--fs-list-orders-filter-width-mobile);
+      margin-bottom: var(--fs-list-orders-filter-margin-bottom-mobile);
+    }
+
+    [data-fs-search-input-field] {
+      [data-fs-search-input-field-input] {
+        @include media("<notebook") {
+          border: var(--fs-input-border-width) solid var(--fs-input-border-color);
+
+          @include input-focus-ring;
+
+          &:hover:not(:disabled):not(:focus-visible):not(:focus) {
+            border-color: var(--fs-list-orders-filter-input-border-color-hover);
+            box-shadow: var(--fs-list-orders-filter-input-shadow-hover);
+          }
+        }
+      }
+
+      [data-fs-icon-button][data-fs-button-variant] {
+        @include media("<notebook") {
+          position: absolute;
+          right: 0;
+        }
+      }
+    }
+
+    [data-fs-list-orders-search-filters-button] {
+      --fs-button-border-radius   : var(--fs-list-orders-filter-button-border-radius);
+      --fs-button-height          : var(--fs-list-orders-filter-button-height);
+
+      margin-left: var(--fs-list-orders-filter-button-margin-left);
+    }
+  }
+}

package/src/components/account/orders/MyAccountOrderDetails/MyAccountDeliveryCard/MyAccountDeliveryCard.tsx

@@ -0,0 +1,47 @@
+import type { UserOrderDeliveryOptionsData } from '@generated/graphql'
+import { camelCaseToTitle } from 'src/utils/utilities'
+import MyAccountCard from '../../../components/MyAccountCard'
+
+interface MyAccountDeliveryCardProps {
+  deliveryOptionsData?: UserOrderDeliveryOptionsData
+  fields?: Array<{
+    name: string
+    value: string
+    refId?: string
+  }>
+}
+
+export default function MyAccountDeliveryCard({
+  deliveryOptionsData,
+  fields,
+}: MyAccountDeliveryCardProps) {
+  return (
+    <MyAccountCard title="Delivery" data-fs-order-delivery-card>
+      <div data-fs-delivery-methods>
+        {deliveryOptionsData.deliveryOptions.map((option, index) => (
+          <p key={option.friendlyDeliveryOptionName} data-fs-delivery-method>
+            {option.friendlyDeliveryOptionName}
+          </p>
+        ))}
+      </div>
+
+      {deliveryOptionsData.contact && (
+        <div data-fs-delivery-contact>
+          <p data-fs-delivery-contact-name>
+            {deliveryOptionsData.contact.name}
+          </p>
+          {deliveryOptionsData.contact.phone && (
+            <p data-fs-delivery-contact-phone>
+              {deliveryOptionsData.contact.phone}
+            </p>
+          )}
+          {fields?.length > 0 && (
+            <p data-fs-delivery-contact-fields>
+              {`${camelCaseToTitle(fields[0]?.name)}: ${fields[0]?.value}`}
+            </p>
+          )}
+        </div>
+      )}
+    </MyAccountCard>
+  )
+}

package/src/components/account/orders/MyAccountOrderDetails/MyAccountDeliveryCard/index.ts

@@ -0,0 +1 @@
+export { default } from './MyAccountDeliveryCard'

package/src/components/account/orders/MyAccountOrderDetails/MyAccountDeliveryCard/styles.scss

@@ -0,0 +1,44 @@
+[data-fs-order-delivery-card] {
+  // --------------------------------------------------------
+  // Design Tokens for Delivery Card
+  // --------------------------------------------------------
+
+  // Default properties
+  --fs-ordered-by-text-size: var(--fs-text-size-2);
+  --fs-ordered-by-text-line-height: 1.5;
+  --fs-ordered-by-text-letter-spacing: -2%;
+  --fs-ordered-by-text-contact-weight: var(--fs-text-weight-regular);
+  --fs-ordered-by-text-contact-strong-weight: var(--fs-text-weight-medium);
+  --fs-ordered-by-text-delivery-options-weight: var(--fs-text-weight-semibold);
+
+  [data-fs-card-body] {
+    display: flex;
+    flex-direction: column;
+    gap: var(--fs-spacing-3);
+
+    [data-fs-delivery-methods] {
+      display: flex;
+      flex-direction: column;
+      align-items: flex-start;
+
+      [data-fs-delivery-method] {
+        font-size: var(--fs-ordered-by-text-size);
+        font-weight: var(--fs-ordered-by-text-delivery-options-weight);
+        line-height: var(--fs-ordered-by-text-line-height);
+        letter-spacing: var(--fs-ordered-by-text-letter-spacing);
+      }
+    }
+
+    [data-fs-delivery-contact] {
+      display: flex;
+      flex-direction: column;
+      gap: var(--fs-spacing-1);
+
+      [data-fs-delivery-contact-name], [data-fs-delivery-contact-phone] {
+        font-size: var(--fs-ordered-by-text-size);
+        font-weight: var(--fs-ordered-by-text-contact-weight);
+        letter-spacing: var(--fs-ordered-by-text-letter-spacing);
+      }
+    }
+  }
+}

package/src/components/account/orders/MyAccountOrderDetails/MyAccountDeliveryOptionAccordion/MyAccountDeliveryOptionAccordion.tsx

@@ -0,0 +1,93 @@
+import type {
+  UserOrderDeliveryOption,
+  UserOrderDeliveryOptionsContact,
+} from '@generated/graphql'
+import { useState } from 'react'
+import {
+  MyAccountAccordion,
+  MyAccountAccordionButton,
+  MyAccountAccordionItem,
+  MyAccountAccordionPanel,
+} from '../../../components/MyAccountAccordion'
+import { useFormatPrice } from '../../../utils/useFormatPrice'
+import MyAccountDeliveryOptionAccordionDeliveryInfo from './MyAccountDeliveryOptionAccordionDeliveryInfo'
+import {
+  MyAccountDeliveryOptionAccordionProduct,
+  MyAccountDeliveryOptionAccordionProducts,
+} from './MyAccountDeliveryOptionAccordionProducts'
+
+interface MyAccountDeliveryOptionAccordionProps {
+  deliveryOption: UserOrderDeliveryOption
+  contact?: UserOrderDeliveryOptionsContact | null
+  currencyCode: string
+  customFields?: Array<{
+    type: string
+    id: string
+    fields?: Array<{
+      name: string
+      value: string
+      refId?: string
+    }>
+  }>
+}
+
+function MyAccountDeliveryOptionAccordion({
+  deliveryOption,
+  contact,
+  currencyCode,
+  customFields,
+}: MyAccountDeliveryOptionAccordionProps) {
+  const [indicesExpanded, setIndicesExpanded] = useState<Set<number>>(
+    new Set([])
+  )
+  const formatPrice = useFormatPrice()
+
+  const title = deliveryOption.friendlyDeliveryOptionName
+
+  const summary = `${deliveryOption.quantityOfDifferentItems} ${deliveryOption.quantityOfDifferentItems === 1 ? 'item' : 'items'} – Total ${formatPrice(deliveryOption.total ?? 0, currencyCode)}`
+
+  const onChange = (index: number) => {
+    if (indicesExpanded.has(index)) {
+      indicesExpanded.delete(index)
+      setIndicesExpanded(new Set(indicesExpanded))
+    } else {
+      setIndicesExpanded(new Set(indicesExpanded.add(index)))
+    }
+  }
+
+  return (
+    <MyAccountAccordion
+      indices={indicesExpanded}
+      onChange={onChange}
+      data-fs-delivery-option-accordion
+    >
+      <MyAccountAccordionItem index={0} key={String(0)}>
+        <MyAccountAccordionButton title={title} summary={summary} />
+        <MyAccountAccordionPanel>
+          <MyAccountDeliveryOptionAccordionDeliveryInfo
+            deliveryOption={deliveryOption}
+            contact={contact}
+          />
+          <MyAccountDeliveryOptionAccordionProducts>
+            {deliveryOption.items?.map((item, index) => (
+              <MyAccountDeliveryOptionAccordionProduct
+                key={index}
+                image={item.imageUrl || ''}
+                quantity={item.quantity}
+                name={item.name}
+                field={customFields
+                  ?.find((cf) => cf.id === item.id)
+                  ?.fields?.find((f) => f.name === 'costCenter')}
+                price={formatPrice(item.price ?? 0, currencyCode)}
+                tax={formatPrice(item.tax ?? 0, currencyCode)}
+                total={formatPrice(item.total ?? 0, currencyCode)}
+              />
+            ))}
+          </MyAccountDeliveryOptionAccordionProducts>
+        </MyAccountAccordionPanel>
+      </MyAccountAccordionItem>
+    </MyAccountAccordion>
+  )
+}
+
+export default MyAccountDeliveryOptionAccordion

package/src/components/account/orders/MyAccountOrderDetails/MyAccountDeliveryOptionAccordion/MyAccountDeliveryOptionAccordionDeliveryInfo.tsx

@@ -0,0 +1,86 @@
+import type { ReactNode } from 'react'
+import type {
+  UserOrderDeliveryOption,
+  UserOrderDeliveryOptionsContact,
+} from '@generated/graphql'
+
+interface InfoContainerProps {
+  title: string
+  children: ReactNode
+}
+
+function InfoContainer({ title, children }: InfoContainerProps) {
+  return (
+    <div data-fs-delivery-option-accordion-info-container>
+      <span data-fs-delivery-option-accordion-info-title>{title}</span>
+      {children}
+    </div>
+  )
+}
+
+interface MyAccountDeliveryOptionAccordionDeliveryInfoProps {
+  deliveryOption: UserOrderDeliveryOption
+  contact?: UserOrderDeliveryOptionsContact | null
+}
+
+function MyAccountDeliveryOptionAccordionDeliveryInfo({
+  deliveryOption,
+  contact,
+}: MyAccountDeliveryOptionAccordionDeliveryInfoProps) {
+  const isPickup = deliveryOption.deliveryChannel === 'pickup-in-point'
+  const address = isPickup
+    ? deliveryOption.pickupStoreInfo?.address
+    : deliveryOption.address
+
+  if (!address && !contact && !deliveryOption.deliveryWindow) {
+    return null
+  }
+
+  return (
+    <div data-fs-delivery-option-accordion-delivery-info>
+      {!isPickup && contact && (
+        <InfoContainer title="Recipient">
+          <span data-fs-delivery-option-accordion-info>
+            <strong>{contact.name}</strong>
+          </span>
+          {contact.phone && (
+            <span data-fs-delivery-option-accordion-info>{contact.phone}</span>
+          )}
+          {contact.email && (
+            <span data-fs-delivery-option-accordion-info>{contact.email}</span>
+          )}
+        </InfoContainer>
+      )}
+
+      <InfoContainer title={isPickup ? 'Store address' : 'Delivery address'}>
+        <span data-fs-delivery-option-accordion-info>
+          <strong>{address.city}</strong>
+        </span>
+        <span data-fs-delivery-option-accordion-info>{address.street}</span>
+        <span
+          data-fs-delivery-option-accordion-info
+        >{`${address.postalCode}${address.state ? `, ${address.state}` : ''}${address.country ? `, ${address.country}.` : ''}`}</span>
+      </InfoContainer>
+
+      {/* TODO: Validate this after we check the return from api  */}
+      {isPickup && deliveryOption.deliveryWindow && (
+        <InfoContainer title="Store Hours">
+          <span data-fs-delivery-option-accordion-info>
+            From:{' '}
+            {new Date(
+              deliveryOption.deliveryWindow.startDateUtc
+            ).toLocaleString()}
+          </span>
+          <span data-fs-delivery-option-accordion-info>
+            To:{' '}
+            {new Date(
+              deliveryOption.deliveryWindow.endDateUtc
+            ).toLocaleString()}
+          </span>
+        </InfoContainer>
+      )}
+    </div>
+  )
+}
+
+export default MyAccountDeliveryOptionAccordionDeliveryInfo

package/src/components/account/orders/MyAccountOrderDetails/MyAccountDeliveryOptionAccordion/MyAccountDeliveryOptionAccordionProducts.tsx

@@ -0,0 +1,74 @@
+import type { ReactNode } from 'react'
+import { camelCaseToTitle } from 'src/utils/utilities'
+
+interface MyAccountDeliveryOptionAccordionProductProps {
+  image: string
+  quantity: number
+  name: string
+  field?: {
+    name: string
+    value: string
+    refId?: string
+  }
+  price: string
+  tax: string
+  total: string
+}
+
+function MyAccountDeliveryOptionAccordionProduct({
+  image,
+  quantity,
+  name,
+  field,
+  price,
+  tax,
+  total,
+}: MyAccountDeliveryOptionAccordionProductProps) {
+  return (
+    <div data-fs-delivery-option-accordion-product>
+      <div data-fs-delivery-option-accordion-product-top>
+        <div data-fs-delivery-option-accordion-product-image>
+          <img src={image} alt={name} />
+          <span data-fs-delivery-option-accordion-product-quantity>
+            {quantity}
+          </span>
+        </div>
+        <div data-fs-delivery-option-accordion-product-details>
+          <p>{name}</p>
+          {field && (
+            <span>{`${camelCaseToTitle(field.name)}: ${field.value ?? ''}`}</span>
+          )}
+        </div>
+      </div>
+      <div data-fs-delivery-option-accordion-product-bottom>
+        <div data-fs-delivery-option-accordion-product-price>
+          <p>{price}</p>
+          <span>Each</span>
+        </div>
+        <div data-fs-delivery-option-accordion-product-tax>
+          <p>{tax}</p>
+          <span>Taxes</span>
+        </div>
+        <div data-fs-delivery-option-accordion-product-total>
+          <p>{total}</p>
+          <span>Total</span>
+        </div>
+      </div>
+    </div>
+  )
+}
+
+interface MyAccountDeliveryOptionAccordionProductsProps {
+  children: ReactNode
+}
+
+function MyAccountDeliveryOptionAccordionProducts({
+  children,
+}: MyAccountDeliveryOptionAccordionProductsProps) {
+  return <div data-fs-delivery-option-accordion-products>{children}</div>
+}
+
+export {
+  MyAccountDeliveryOptionAccordionProduct,
+  MyAccountDeliveryOptionAccordionProducts,
+}

package/src/components/account/orders/MyAccountOrderDetails/MyAccountDeliveryOptionAccordion/index.ts

@@ -0,0 +1,6 @@
+export { default as MyAccountDeliveryOptionAccordion } from './MyAccountDeliveryOptionAccordion'
+export { default as MyAccountDeliveryOptionAccordionDeliveryInfo } from './MyAccountDeliveryOptionAccordionDeliveryInfo'
+export {
+  MyAccountDeliveryOptionAccordionProduct,
+  MyAccountDeliveryOptionAccordionProducts,
+} from './MyAccountDeliveryOptionAccordionProducts'

package/src/components/account/orders/MyAccountOrderDetails/MyAccountDeliveryOptionAccordion/styles.scss

@@ -0,0 +1,193 @@
+[data-fs-delivery-option-accordion] {
+  // --------------------------------------------------------
+  // Design Tokens
+  // --------------------------------------------------------
+
+  // Product Image
+  --fs-order-product-image-size                   : 3.75rem;
+  --fs-order-product-image-radius                 : var(--fs-spacing-0);
+  --fs-order-product-image-background             : var(--fs-color-main-0);
+
+  // Product
+  --fs-orders-total-items-height                  : 1.25rem;
+  --fs-orders-total-items-min-width               : var(--fs-orders-total-items-height);
+  --fs-orders-total-items-padding                 : 0.125rem var(--fs-spacing-0);
+  --fs-orders-total-items-radius                  : var(--fs-border-radius-pill);
+  --fs-orders-total-items-bottom                  : var(--fs-spacing-0);
+  --fs-orders-total-items-right                   : var(--fs-orders-total-items-bottom);
+  --fs-orders-total-items-border                  : var(--fs-border-width) solid var(--fs-color-neutral-0);
+  --fs-orders-total-items-bkg-color              : var(--fs-color-main-4);
+  --fs-orders-total-items-color                   : var(--fs-color-text-inverse);
+  --fs-orders-total-items-weight                  : var(--fs-text-weight-medium);
+
+  // --------------------------------------------------------
+  // Structural Styles
+  // --------------------------------------------------------
+
+  [data-fs-delivery-option-accordion-delivery-info] {
+    display: grid;
+    grid-template-columns: 1fr;
+    gap: var(--fs-spacing-3);
+    padding: var(--fs-spacing-4) var(--fs-spacing-4) var(--fs-spacing-5);
+    border-bottom: var(--fs-border-width) solid var(--fs-border-color-light);
+
+    @include media(">=tablet") {
+      grid-template-columns: repeat(2, 1fr);
+    }
+
+    [data-fs-delivery-option-accordion-info-container] {
+      display: flex;
+      flex-direction: column;
+
+      [data-fs-delivery-option-accordion-info-title] {
+        font-size: var(--fs-text-size-1);
+        line-height: 1.25;
+        color: var(--fs-color-text-light);
+        letter-spacing: 1%;
+      }
+
+      span:not([data-fs-delivery-option-accordion-info-title]) {
+        font-size: var(--fs-text-size-2);
+        line-height: 1.5;
+        color: var(--fs-color-text);
+        letter-spacing: -2%;
+
+        strong {
+          font-weight: var(--fs-text-weight-medium);
+        }
+      }
+    }
+  }
+
+  [data-fs-delivery-option-accordion-products] {
+    display: flex;
+    flex-direction: column;
+    padding: var(--fs-spacing-1) var(--fs-spacing-4);
+
+    [data-fs-delivery-option-accordion-product] {
+      display: flex;
+      flex-direction: column;
+      gap: var(--fs-spacing-3);
+      padding: var(--fs-spacing-3) 0;
+      border-bottom: var(--fs-border-width) solid var(--fs-border-color-light);
+
+      &:last-child {
+        border-bottom: none;
+      }
+
+      [data-fs-delivery-option-accordion-product-top] {
+        display: flex;
+        gap: var(--fs-spacing-3);
+        align-items: center;
+        width: 100%;
+      }
+
+      [data-fs-delivery-option-accordion-product-bottom] {
+        display: grid;
+        grid-template-columns: repeat(auto-fit, minmax(6.25rem, auto)); // min = 100px
+        gap: var(--fs-spacing-0);
+      }
+
+      @include media(">=notebook") {
+        display: grid;
+        grid-template-columns: auto 1fr repeat(3, minmax(6.25rem, auto)); // min = 100px
+        grid-auto-flow: column;
+        gap: var(--fs-spacing-2);
+
+        [data-fs-delivery-option-accordion-product-top] {
+          display: contents;
+        }
+
+        [data-fs-delivery-option-accordion-product-bottom] {
+          display: contents;
+        }
+      }
+
+      [data-fs-delivery-option-accordion-product-image] {
+        position: relative;
+        display: flex;
+        flex-shrink: 0;
+        align-items: flex-start;
+        justify-content: flex-start;
+        width: var(--fs-order-product-image-size);
+        height: var(--fs-order-product-image-size);
+        overflow: hidden;
+        background-color: var(--fs-order-product-image-background);
+        border-radius: var(--fs-order-product-image-radius);
+
+        img {
+          width: inherit;
+          height: inherit;
+          object-fit: contain;
+        }
+
+        [data-fs-delivery-option-accordion-product-quantity] {
+          position: absolute;
+          right: var(--fs-orders-total-items-right);
+          bottom: var(--fs-orders-total-items-bottom);
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          min-width: var(--fs-orders-total-items-min-width);
+          height: var(--fs-orders-total-items-height);
+          padding: var(--fs-orders-total-items-padding);
+          font-size: var(--fs-text-size-0);
+          font-weight: var(--fs-orders-total-items-weight);
+          color: var(--fs-orders-total-items-color);
+          background-color: var(--fs-orders-total-items-bkg-color);
+          border: var(--fs-orders-total-items-border);
+          border-radius: var(--fs-orders-total-items-radius);
+        }
+      }
+
+      [data-fs-delivery-option-accordion-product-details] {
+        display: flex;
+        flex: 1;
+        flex-direction: column;
+        gap: var(--fs-spacing-1);
+
+        p {
+          margin: 0;
+          font-size: var(--fs-text-size-base);
+          font-weight: var(--fs-text-weight-medium);
+          line-height: 1.5;
+
+          @include truncate-title(1);
+        }
+
+        span {
+          font-size: var(--fs-text-size-1);
+          line-height: 1.5;
+          color: var(--fs-color-text-light);
+
+          @include truncate-title(1);
+        }
+      }
+
+      [data-fs-delivery-option-accordion-product-price],
+      [data-fs-delivery-option-accordion-product-tax],
+      [data-fs-delivery-option-accordion-product-total] {
+        display: flex;
+        flex-direction: column;
+        align-items: flex-start;
+
+        @include media(">=notebook") {
+          align-items: flex-end;
+        }
+
+        p {
+          margin: 0;
+          font-size: var(--fs-text-size-base);
+          font-weight: var(--fs-text-weight-medium);
+          line-height: 1.5;
+        }
+
+        span {
+          font-size: var(--fs-text-size-1);
+          line-height: 1.5;
+          color: var(--fs-color-text-light);
+        }
+      }
+    }
+  }
+}

package/src/components/account/orders/MyAccountOrderDetails/MyAccountMoreInformationCard/MyAccountMoreInformationCard.tsx

@@ -0,0 +1,31 @@
+import { camelCaseToTitle } from 'src/utils/utilities'
+import MyAccountCard from '../../../components/MyAccountCard'
+
+export interface MyAccountMoreInformationCardProps {
+  fields: Array<{
+    name: string
+    value: string
+    refId?: string
+  }>
+}
+
+function MyAccountMoreInformationCard({
+  fields,
+}: MyAccountMoreInformationCardProps) {
+  return (
+    <MyAccountCard title="More information" data-fs-order-more-information-card>
+      <div data-fs-order-more-information-card-content>
+        {fields.map((item) => (
+          <div key={item.name} data-fs-order-more-information-card-item>
+            <p data-fs-order-more-information-card-title>
+              {camelCaseToTitle(item.name)}
+            </p>
+            <p data-fs-order-more-information-card-value>{item.value}</p>
+          </div>
+        ))}
+      </div>
+    </MyAccountCard>
+  )
+}
+
+export default MyAccountMoreInformationCard

package/src/components/account/orders/MyAccountOrderDetails/MyAccountMoreInformationCard/index.ts

@@ -0,0 +1 @@
+export { default } from './MyAccountMoreInformationCard'