@hanzo/commerce 7.3.7 → 7.3.9
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/components/cart/cart-panel/promo-code.tsx +7 -4
- package/components/checkout/payment-step-form/contact-form.tsx +3 -2
- package/components/checkout/payment-step-form/index.tsx +1 -1
- package/components/checkout/shipping-step-form.tsx +12 -9
- package/hanzo-ui.d.ts +108 -0
- package/package.json +3 -3
- package/tsconfig.json +3 -1
- package/util/promo-codes.ts +0 -2
- package/util/square-payment.ts +34 -27
- package/dist/components/Icons.d.ts +0 -18
- package/dist/components/Icons.jsx +0 -19
- package/dist/components/Icons.jsx.map +0 -1
- package/dist/components/add-to-cart-widget.d.ts +0 -11
- package/dist/components/add-to-cart-widget.jsx +0 -99
- package/dist/components/add-to-cart-widget.jsx.map +0 -1
- package/dist/components/buy/buy-card.d.ts +0 -30
- package/dist/components/buy/buy-card.jsx +0 -123
- package/dist/components/buy/buy-card.jsx.map +0 -1
- package/dist/components/buy/carousel-buy-card.d.ts +0 -12
- package/dist/components/buy/carousel-buy-card.jsx +0 -99
- package/dist/components/buy/carousel-buy-card.jsx.map +0 -1
- package/dist/components/buy/multi-family/all-variants-carousel.d.ts +0 -4
- package/dist/components/buy/multi-family/all-variants-carousel.jsx +0 -147
- package/dist/components/buy/multi-family/all-variants-carousel.jsx.map +0 -1
- package/dist/components/buy/multi-family/family-carousel/index.d.ts +0 -4
- package/dist/components/buy/multi-family/family-carousel/index.jsx +0 -34
- package/dist/components/buy/multi-family/family-carousel/index.jsx.map +0 -1
- package/dist/components/buy/multi-family/family-carousel/slide.d.ts +0 -11
- package/dist/components/buy/multi-family/family-carousel/slide.jsx +0 -41
- package/dist/components/buy/multi-family/family-carousel/slide.jsx.map +0 -1
- package/dist/components/buy/multi-family/family-carousel/state.d.ts +0 -20
- package/dist/components/buy/multi-family/family-carousel/state.js +0 -59
- package/dist/components/buy/multi-family/family-carousel/state.js.map +0 -1
- package/dist/components/buy/multi-family/index.d.ts +0 -2
- package/dist/components/buy/multi-family/index.js +0 -3
- package/dist/components/buy/multi-family/index.js.map +0 -1
- package/dist/components/buy/single-family-selector.d.ts +0 -15
- package/dist/components/buy/single-family-selector.jsx +0 -31
- package/dist/components/buy/single-family-selector.jsx.map +0 -1
- package/dist/components/buy/title-and-byline.d.ts +0 -8
- package/dist/components/buy/title-and-byline.jsx +0 -9
- package/dist/components/buy/title-and-byline.jsx.map +0 -1
- package/dist/components/cart/cart-panel/cart-line-item.d.ts +0 -11
- package/dist/components/cart/cart-panel/cart-line-item.jsx +0 -39
- package/dist/components/cart/cart-panel/cart-line-item.jsx.map +0 -1
- package/dist/components/cart/cart-panel/index.d.ts +0 -19
- package/dist/components/cart/cart-panel/index.jsx +0 -79
- package/dist/components/cart/cart-panel/index.jsx.map +0 -1
- package/dist/components/cart/cart-panel/promo-code.d.ts +0 -4
- package/dist/components/cart/cart-panel/promo-code.jsx +0 -73
- package/dist/components/cart/cart-panel/promo-code.jsx.map +0 -1
- package/dist/components/cart/cart-panel/total-area.d.ts +0 -7
- package/dist/components/cart/cart-panel/total-area.jsx +0 -37
- package/dist/components/cart/cart-panel/total-area.jsx.map +0 -1
- package/dist/components/checkout/payment-step-form/card-icon-row.d.ts +0 -2
- package/dist/components/checkout/payment-step-form/card-icon-row.jsx +0 -22
- package/dist/components/checkout/payment-step-form/card-icon-row.jsx.map +0 -1
- package/dist/components/checkout/payment-step-form/card-icons/amex.d.ts +0 -4
- package/dist/components/checkout/payment-step-form/card-icons/amex.jsx +0 -12
- package/dist/components/checkout/payment-step-form/card-icons/amex.jsx.map +0 -1
- package/dist/components/checkout/payment-step-form/card-icons/diners-club.d.ts +0 -4
- package/dist/components/checkout/payment-step-form/card-icons/diners-club.jsx +0 -10
- package/dist/components/checkout/payment-step-form/card-icons/diners-club.jsx.map +0 -1
- package/dist/components/checkout/payment-step-form/card-icons/discover.d.ts +0 -4
- package/dist/components/checkout/payment-step-form/card-icons/discover.jsx +0 -12
- package/dist/components/checkout/payment-step-form/card-icons/discover.jsx.map +0 -1
- package/dist/components/checkout/payment-step-form/card-icons/jcb.d.ts +0 -4
- package/dist/components/checkout/payment-step-form/card-icons/jcb.jsx +0 -23
- package/dist/components/checkout/payment-step-form/card-icons/jcb.jsx.map +0 -1
- package/dist/components/checkout/payment-step-form/card-icons/mastercard.d.ts +0 -4
- package/dist/components/checkout/payment-step-form/card-icons/mastercard.jsx +0 -12
- package/dist/components/checkout/payment-step-form/card-icons/mastercard.jsx.map +0 -1
- package/dist/components/checkout/payment-step-form/card-icons/visa.d.ts +0 -4
- package/dist/components/checkout/payment-step-form/card-icons/visa.jsx +0 -10
- package/dist/components/checkout/payment-step-form/card-icons/visa.jsx.map +0 -1
- package/dist/components/checkout/payment-step-form/cc-button.d.ts +0 -3
- package/dist/components/checkout/payment-step-form/cc-button.jsx +0 -9
- package/dist/components/checkout/payment-step-form/cc-button.jsx.map +0 -1
- package/dist/components/checkout/payment-step-form/contact-form.d.ts +0 -5
- package/dist/components/checkout/payment-step-form/contact-form.jsx +0 -21
- package/dist/components/checkout/payment-step-form/contact-form.jsx.map +0 -1
- package/dist/components/checkout/payment-step-form/crypto-icons/btc.d.ts +0 -4
- package/dist/components/checkout/payment-step-form/crypto-icons/btc.jsx +0 -8
- package/dist/components/checkout/payment-step-form/crypto-icons/btc.jsx.map +0 -1
- package/dist/components/checkout/payment-step-form/crypto-icons/eth.d.ts +0 -4
- package/dist/components/checkout/payment-step-form/crypto-icons/eth.jsx +0 -17
- package/dist/components/checkout/payment-step-form/crypto-icons/eth.jsx.map +0 -1
- package/dist/components/checkout/payment-step-form/crypto-icons/usdt.d.ts +0 -4
- package/dist/components/checkout/payment-step-form/crypto-icons/usdt.jsx +0 -10
- package/dist/components/checkout/payment-step-form/crypto-icons/usdt.jsx.map +0 -1
- package/dist/components/checkout/payment-step-form/index.d.ts +0 -4
- package/dist/components/checkout/payment-step-form/index.jsx +0 -85
- package/dist/components/checkout/payment-step-form/index.jsx.map +0 -1
- package/dist/components/checkout/payment-step-form/methods/bank-transfer.d.ts +0 -4
- package/dist/components/checkout/payment-step-form/methods/bank-transfer.jsx +0 -44
- package/dist/components/checkout/payment-step-form/methods/bank-transfer.jsx.map +0 -1
- package/dist/components/checkout/payment-step-form/methods/card.d.ts +0 -4
- package/dist/components/checkout/payment-step-form/methods/card.jsx +0 -182
- package/dist/components/checkout/payment-step-form/methods/card.jsx.map +0 -1
- package/dist/components/checkout/payment-step-form/methods/crypto.d.ts +0 -9
- package/dist/components/checkout/payment-step-form/methods/crypto.jsx +0 -167
- package/dist/components/checkout/payment-step-form/methods/crypto.jsx.map +0 -1
- package/dist/components/checkout/payment-step-form/methods/index.d.ts +0 -6
- package/dist/components/checkout/payment-step-form/methods/index.js +0 -21
- package/dist/components/checkout/payment-step-form/methods/index.js.map +0 -1
- package/dist/components/checkout/shipping-step-form.d.ts +0 -3
- package/dist/components/checkout/shipping-step-form.jsx +0 -105
- package/dist/components/checkout/shipping-step-form.jsx.map +0 -1
- package/dist/components/index.d.ts +0 -8
- package/dist/components/index.js +0 -9
- package/dist/components/index.js.map +0 -1
- package/dist/components/item/product-card.d.ts +0 -7
- package/dist/components/item/product-card.jsx +0 -21
- package/dist/components/item/product-card.jsx.map +0 -1
- package/dist/components/item-selector/button.d.ts +0 -4
- package/dist/components/item-selector/button.jsx +0 -65
- package/dist/components/item-selector/button.jsx.map +0 -1
- package/dist/components/item-selector/carousel/index.d.ts +0 -12
- package/dist/components/item-selector/carousel/index.jsx +0 -101
- package/dist/components/item-selector/carousel/index.jsx.map +0 -1
- package/dist/components/item-selector/carousel/slider.d.ts +0 -8
- package/dist/components/item-selector/carousel/slider.jsx +0 -11
- package/dist/components/item-selector/carousel/slider.jsx.map +0 -1
- package/dist/components/item-selector/index.d.ts +0 -2
- package/dist/components/item-selector/index.js +0 -3
- package/dist/components/item-selector/index.js.map +0 -1
- package/dist/components/item-selector/quantity-indicator.d.ts +0 -9
- package/dist/components/item-selector/quantity-indicator.jsx +0 -23
- package/dist/components/item-selector/quantity-indicator.jsx.map +0 -1
- package/dist/components/node-tabs/index.d.ts +0 -14
- package/dist/components/node-tabs/index.jsx +0 -48
- package/dist/components/node-tabs/index.jsx.map +0 -1
- package/dist/components/node-tabs/node-image.d.ts +0 -6
- package/dist/components/node-tabs/node-image.jsx +0 -12
- package/dist/components/node-tabs/node-image.jsx.map +0 -1
- package/dist/index.d.ts +0 -5
- package/dist/index.js +0 -5
- package/dist/index.js.map +0 -1
- package/dist/service/context.d.ts +0 -8
- package/dist/service/context.jsx +0 -20
- package/dist/service/context.jsx.map +0 -1
- package/dist/service/debug.d.ts +0 -10
- package/dist/service/debug.js +0 -30
- package/dist/service/debug.js.map +0 -1
- package/dist/service/impls/standalone/actual-line-item.d.ts +0 -40
- package/dist/service/impls/standalone/actual-line-item.js +0 -84
- package/dist/service/impls/standalone/actual-line-item.js.map +0 -1
- package/dist/service/impls/standalone/get-instance.d.ts +0 -2
- package/dist/service/impls/standalone/get-instance.js +0 -39
- package/dist/service/impls/standalone/get-instance.js.map +0 -1
- package/dist/service/impls/standalone/index.d.ts +0 -67
- package/dist/service/impls/standalone/index.js +0 -416
- package/dist/service/impls/standalone/index.js.map +0 -1
- package/dist/service/impls/standalone/order/firebase.d.ts +0 -2
- package/dist/service/impls/standalone/order/firebase.js +0 -13
- package/dist/service/impls/standalone/order/firebase.js.map +0 -1
- package/dist/service/impls/standalone/order/index.d.ts +0 -24
- package/dist/service/impls/standalone/order/index.js +0 -61
- package/dist/service/impls/standalone/order/index.js.map +0 -1
- package/dist/service/impls/standalone/persistence.d.ts +0 -4
- package/dist/service/impls/standalone/persistence.js +0 -22
- package/dist/service/impls/standalone/persistence.js.map +0 -1
- package/dist/service/path-utils.d.ts +0 -7
- package/dist/service/path-utils.js +0 -16
- package/dist/service/path-utils.js.map +0 -1
- package/dist/service/sep.d.ts +0 -6
- package/dist/service/sep.js +0 -6
- package/dist/service/sep.js.map +0 -1
- package/dist/types/category-node.d.ts +0 -36
- package/dist/types/category-node.js +0 -2
- package/dist/types/category-node.js.map +0 -1
- package/dist/types/checkout.d.ts +0 -33
- package/dist/types/checkout.js +0 -2
- package/dist/types/checkout.js.map +0 -1
- package/dist/types/commerce-config.d.ts +0 -11
- package/dist/types/commerce-config.js +0 -2
- package/dist/types/commerce-config.js.map +0 -1
- package/dist/types/commerce-service.d.ts +0 -109
- package/dist/types/commerce-service.js +0 -2
- package/dist/types/commerce-service.js.map +0 -1
- package/dist/types/components/Icons.d.ts +0 -18
- package/dist/types/components/add-to-cart-widget.d.ts +0 -11
- package/dist/types/components/buy/buy-card.d.ts +0 -30
- package/dist/types/components/buy/carousel-buy-card.d.ts +0 -12
- package/dist/types/components/buy/multi-family/all-variants-carousel.d.ts +0 -4
- package/dist/types/components/buy/multi-family/family-carousel/index.d.ts +0 -4
- package/dist/types/components/buy/multi-family/family-carousel/slide.d.ts +0 -11
- package/dist/types/components/buy/multi-family/family-carousel/state.d.ts +0 -20
- package/dist/types/components/buy/multi-family/index.d.ts +0 -2
- package/dist/types/components/buy/single-family-selector.d.ts +0 -15
- package/dist/types/components/buy/title-and-byline.d.ts +0 -8
- package/dist/types/components/cart/cart-panel/cart-line-item.d.ts +0 -11
- package/dist/types/components/cart/cart-panel/index.d.ts +0 -19
- package/dist/types/components/cart/cart-panel/promo-code.d.ts +0 -4
- package/dist/types/components/cart/cart-panel/total-area.d.ts +0 -7
- package/dist/types/components/checkout/payment-step-form/card-icon-row.d.ts +0 -2
- package/dist/types/components/checkout/payment-step-form/card-icons/amex.d.ts +0 -4
- package/dist/types/components/checkout/payment-step-form/card-icons/diners-club.d.ts +0 -4
- package/dist/types/components/checkout/payment-step-form/card-icons/discover.d.ts +0 -4
- package/dist/types/components/checkout/payment-step-form/card-icons/jcb.d.ts +0 -4
- package/dist/types/components/checkout/payment-step-form/card-icons/mastercard.d.ts +0 -4
- package/dist/types/components/checkout/payment-step-form/card-icons/visa.d.ts +0 -4
- package/dist/types/components/checkout/payment-step-form/cc-button.d.ts +0 -3
- package/dist/types/components/checkout/payment-step-form/contact-form.d.ts +0 -5
- package/dist/types/components/checkout/payment-step-form/crypto-icons/btc.d.ts +0 -4
- package/dist/types/components/checkout/payment-step-form/crypto-icons/eth.d.ts +0 -4
- package/dist/types/components/checkout/payment-step-form/crypto-icons/usdt.d.ts +0 -4
- package/dist/types/components/checkout/payment-step-form/index.d.ts +0 -4
- package/dist/types/components/checkout/payment-step-form/methods/bank-transfer.d.ts +0 -4
- package/dist/types/components/checkout/payment-step-form/methods/card.d.ts +0 -4
- package/dist/types/components/checkout/payment-step-form/methods/crypto.d.ts +0 -9
- package/dist/types/components/checkout/payment-step-form/methods/index.d.ts +0 -6
- package/dist/types/components/checkout/shipping-step-form.d.ts +0 -3
- package/dist/types/components/index.d.ts +0 -8
- package/dist/types/components/item/product-card.d.ts +0 -7
- package/dist/types/components/item-selector/button.d.ts +0 -4
- package/dist/types/components/item-selector/carousel/index.d.ts +0 -12
- package/dist/types/components/item-selector/carousel/slider.d.ts +0 -8
- package/dist/types/components/item-selector/index.d.ts +0 -2
- package/dist/types/components/item-selector/quantity-indicator.d.ts +0 -9
- package/dist/types/components/node-tabs/index.d.ts +0 -14
- package/dist/types/components/node-tabs/node-image.d.ts +0 -6
- package/dist/types/family.d.ts +0 -16
- package/dist/types/family.js +0 -2
- package/dist/types/family.js.map +0 -1
- package/dist/types/index.d.ts +0 -13
- package/dist/types/index.js +0 -8
- package/dist/types/index.js.map +0 -1
- package/dist/types/item-selector.d.ts +0 -72
- package/dist/types/item-selector.js +0 -2
- package/dist/types/item-selector.js.map +0 -1
- package/dist/types/line-item.d.ts +0 -14
- package/dist/types/line-item.js +0 -2
- package/dist/types/line-item.js.map +0 -1
- package/dist/types/multi-family-selector-props.d.ts +0 -16
- package/dist/types/multi-family-selector-props.js +0 -2
- package/dist/types/multi-family-selector-props.js.map +0 -1
- package/dist/types/product.d.ts +0 -15
- package/dist/types/product.js +0 -2
- package/dist/types/product.js.map +0 -1
- package/dist/types/promo.d.ts +0 -7
- package/dist/types/promo.js +0 -2
- package/dist/types/promo.js.map +0 -1
- package/dist/types/selection-ui-specifier.d.ts +0 -40
- package/dist/types/selection-ui-specifier.js +0 -2
- package/dist/types/selection-ui-specifier.js.map +0 -1
- package/dist/types/service/context.d.ts +0 -8
- package/dist/types/service/debug.d.ts +0 -10
- package/dist/types/service/impls/standalone/actual-line-item.d.ts +0 -40
- package/dist/types/service/impls/standalone/get-instance.d.ts +0 -2
- package/dist/types/service/impls/standalone/index.d.ts +0 -67
- package/dist/types/service/impls/standalone/order/firebase.d.ts +0 -2
- package/dist/types/service/impls/standalone/order/index.d.ts +0 -24
- package/dist/types/service/impls/standalone/persistence.d.ts +0 -4
- package/dist/types/service/path-utils.d.ts +0 -7
- package/dist/types/service/sep.d.ts +0 -6
- package/dist/types/string-mutator.d.ts +0 -9
- package/dist/types/string-mutator.js +0 -2
- package/dist/types/string-mutator.js.map +0 -1
- package/dist/types/token-separators.d.ts +0 -6
- package/dist/types/token-separators.js +0 -2
- package/dist/types/token-separators.js.map +0 -1
- package/dist/types/types/category-node.d.ts +0 -36
- package/dist/types/types/checkout.d.ts +0 -33
- package/dist/types/types/commerce-config.d.ts +0 -11
- package/dist/types/types/commerce-service.d.ts +0 -109
- package/dist/types/types/family.d.ts +0 -16
- package/dist/types/types/index.d.ts +0 -13
- package/dist/types/types/item-selector.d.ts +0 -72
- package/dist/types/types/line-item.d.ts +0 -14
- package/dist/types/types/multi-family-selector-props.d.ts +0 -16
- package/dist/types/types/product.d.ts +0 -15
- package/dist/types/types/promo.d.ts +0 -7
- package/dist/types/types/selection-ui-specifier.d.ts +0 -40
- package/dist/types/types/string-mutator.d.ts +0 -9
- package/dist/types/types/token-separators.d.ts +0 -6
- package/dist/types/util/analytics.d.ts +0 -9
- package/dist/types/util/countries.d.ts +0 -7
- package/dist/types/util/error.d.ts +0 -1
- package/dist/types/util/index.d.ts +0 -15
- package/dist/types/util/item-selector-options-accessor.d.ts +0 -3
- package/dist/types/util/line-item-ref.d.ts +0 -8
- package/dist/types/util/multi-family-selector-options-accessor.d.ts +0 -3
- package/dist/types/util/obs-string-mutator.d.ts +0 -8
- package/dist/types/util/product-media-accessor.d.ts +0 -29
- package/dist/types/util/promo-codes.d.ts +0 -3
- package/dist/types/util/selection-ui-specifiers.d.ts +0 -3
- package/dist/types/util/square-payment.d.ts +0 -7
- package/dist/types/util/use-sync-sku-param-w-current-item.d.ts +0 -2
- package/dist/util/analytics.d.ts +0 -9
- package/dist/util/analytics.js +0 -10
- package/dist/util/analytics.js.map +0 -1
- package/dist/util/countries.d.ts +0 -7
- package/dist/util/countries.js +0 -197
- package/dist/util/countries.js.map +0 -1
- package/dist/util/error.d.ts +0 -1
- package/dist/util/error.js +0 -22
- package/dist/util/error.js.map +0 -1
- package/dist/util/index.d.ts +0 -15
- package/dist/util/index.js +0 -54
- package/dist/util/index.js.map +0 -1
- package/dist/util/item-selector-options-accessor.d.ts +0 -3
- package/dist/util/item-selector-options-accessor.js +0 -27
- package/dist/util/item-selector-options-accessor.js.map +0 -1
- package/dist/util/line-item-ref.d.ts +0 -8
- package/dist/util/line-item-ref.js +0 -15
- package/dist/util/line-item-ref.js.map +0 -1
- package/dist/util/multi-family-selector-options-accessor.d.ts +0 -3
- package/dist/util/multi-family-selector-options-accessor.js +0 -11
- package/dist/util/multi-family-selector-options-accessor.js.map +0 -1
- package/dist/util/obs-string-mutator.d.ts +0 -8
- package/dist/util/obs-string-mutator.js +0 -15
- package/dist/util/obs-string-mutator.js.map +0 -1
- package/dist/util/product-media-accessor.d.ts +0 -29
- package/dist/util/product-media-accessor.js +0 -22
- package/dist/util/product-media-accessor.js.map +0 -1
- package/dist/util/promo-codes.d.ts +0 -3
- package/dist/util/promo-codes.js +0 -101
- package/dist/util/promo-codes.js.map +0 -1
- package/dist/util/selection-ui-specifiers.d.ts +0 -3
- package/dist/util/selection-ui-specifiers.js +0 -24
- package/dist/util/selection-ui-specifiers.js.map +0 -1
- package/dist/util/square-payment.d.ts +0 -7
- package/dist/util/square-payment.js +0 -30
- package/dist/util/square-payment.js.map +0 -1
- package/dist/util/use-sync-sku-param-w-current-item.d.ts +0 -2
- package/dist/util/use-sync-sku-param-w-current-item.js +0 -61
- package/dist/util/use-sync-sku-param-w-current-item.js.map +0 -1
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
declare const CarouselBuyCard: React.FC<{
|
|
3
|
-
skuPath: string;
|
|
4
|
-
checkoutButton: React.ReactNode;
|
|
5
|
-
clx?: string;
|
|
6
|
-
selectorClx?: string;
|
|
7
|
-
addBtnClx?: string;
|
|
8
|
-
buttonsAreaClx?: string;
|
|
9
|
-
mobile?: boolean;
|
|
10
|
-
onQuantityChanged?: (sku: string, oldV: number, newV: number) => void;
|
|
11
|
-
}>;
|
|
12
|
-
export default CarouselBuyCard;
|
|
@@ -1,99 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
import React, { useRef, useEffect, useState } from 'react';
|
|
3
|
-
import { observer } from 'mobx-react-lite';
|
|
4
|
-
import { cn } from '@hanzo/ui/util';
|
|
5
|
-
import { useCommerce } from '../../service/context';
|
|
6
|
-
import { getSelectionUISpecifier } from '../../util';
|
|
7
|
-
import { CarouselItemSelector, ButtonItemSelector } from '../item-selector';
|
|
8
|
-
import SingleFamilySelector from './single-family-selector';
|
|
9
|
-
import { FamilyCarousel, AllVariantsCarousel } from './multi-family';
|
|
10
|
-
import AddToCartWidget from '../add-to-cart-widget';
|
|
11
|
-
const SCROLL = {
|
|
12
|
-
scrollAfter: 5,
|
|
13
|
-
scrollHeightClx: 'h-[65vh]'
|
|
14
|
-
};
|
|
15
|
-
const MEDIA_CONSTRAINT = { w: 200, h: 200 };
|
|
16
|
-
const sortItems = (items, sort) => (((sort === 'asc') ?
|
|
17
|
-
items.sort((a, b) => (a.price - b.price))
|
|
18
|
-
:
|
|
19
|
-
((sort === 'desc') ?
|
|
20
|
-
items.sort((a, b) => (b.price - a.price))
|
|
21
|
-
:
|
|
22
|
-
items)));
|
|
23
|
-
const CarouselBuyCard = ({ skuPath, checkoutButton, clx = '', selectorClx = '', addBtnClx = '', buttonsAreaClx = '', mobile = false, onQuantityChanged, }) => {
|
|
24
|
-
const cmmc = useCommerce();
|
|
25
|
-
const r = useRef(undefined);
|
|
26
|
-
const [changeMeToRerender, setChangeMeToRerender] = useState(false);
|
|
27
|
-
useEffect(() => {
|
|
28
|
-
if (!skuPath || skuPath.length === 0) {
|
|
29
|
-
// The component is being hidden (w an amination)
|
|
30
|
-
// keep things the same so no layout jump
|
|
31
|
-
return;
|
|
32
|
-
}
|
|
33
|
-
const peek = cmmc.peek(skuPath);
|
|
34
|
-
if (typeof peek === 'string') {
|
|
35
|
-
throw new Error(peek);
|
|
36
|
-
}
|
|
37
|
-
if (peek.role === 'non-outermost') {
|
|
38
|
-
throw new Error(`BuyCard: skuPath ${skuPath} isn't an outermost tree node or product family!`);
|
|
39
|
-
}
|
|
40
|
-
const uiSpec = getSelectionUISpecifier(skuPath);
|
|
41
|
-
r.current = {
|
|
42
|
-
...peek,
|
|
43
|
-
node: peek.node, // else exception was thrown.
|
|
44
|
-
uiSpec,
|
|
45
|
-
};
|
|
46
|
-
if (peek.role === 'single-family') {
|
|
47
|
-
const sort = () => {
|
|
48
|
-
const options = uiSpec.singleFamily?.options ?? {};
|
|
49
|
-
const showSlider = 'showSlider' in options ? options.showSlider : true;
|
|
50
|
-
return ('sort' in options) ?
|
|
51
|
-
options.sort
|
|
52
|
-
:
|
|
53
|
-
(showSlider ? 'asc' : 'none');
|
|
54
|
-
};
|
|
55
|
-
const items = peek.family.products;
|
|
56
|
-
const Selector = (uiSpec.singleFamily?.type === 'buttons') ? ButtonItemSelector : CarouselItemSelector;
|
|
57
|
-
const selOptions = uiSpec.singleFamily?.options;
|
|
58
|
-
r.current.single = {
|
|
59
|
-
items: sortItems(items, sort()),
|
|
60
|
-
Selector,
|
|
61
|
-
selOptions,
|
|
62
|
-
scrollable: !!(items.length > SCROLL.scrollAfter),
|
|
63
|
-
showItemMedia: uiSpec.singleFamily?.type !== 'carousel'
|
|
64
|
-
};
|
|
65
|
-
const currItem = peek.item ?? r.current.single.items[0];
|
|
66
|
-
cmmc.setCurrentItem(currItem.sku);
|
|
67
|
-
}
|
|
68
|
-
else {
|
|
69
|
-
const initialFamily = peek.family ? peek.family : peek.families[0];
|
|
70
|
-
// TODO: Does this ever need to be sorted??
|
|
71
|
-
const currItem = peek.item ?? initialFamily.products[0];
|
|
72
|
-
// sets currentFamily as well
|
|
73
|
-
cmmc.setCurrentItem(currItem.sku);
|
|
74
|
-
r.current.multi = {
|
|
75
|
-
Selector: (uiSpec.multiFamily?.type === 'family-carousel') ?
|
|
76
|
-
FamilyCarousel
|
|
77
|
-
:
|
|
78
|
-
AllVariantsCarousel,
|
|
79
|
-
itemOptions: uiSpec.multiFamily?.itemOptions,
|
|
80
|
-
selectorOptions: uiSpec.multiFamily?.selectorOptions,
|
|
81
|
-
initialFamilyId: initialFamily.id
|
|
82
|
-
};
|
|
83
|
-
}
|
|
84
|
-
// Must do this since Dialog code takes this comp out of the React shadow DOM
|
|
85
|
-
// (only in prod apparently.)
|
|
86
|
-
setChangeMeToRerender(!changeMeToRerender);
|
|
87
|
-
}, [skuPath]);
|
|
88
|
-
const MultiFamilyUI = ({ Selector, itemOptions, selectorOptions, families, parent, clx = '' }) => (<Selector families={families} parent={parent} clx={clx} itemOptions={itemOptions} selectorOptions={selectorOptions} mediaConstraint={MEDIA_CONSTRAINT} mobile={mobile}/>);
|
|
89
|
-
const Buttons = observer(({ clx = '' }) => (cmmc.currentItem ? (<div className={clx}>
|
|
90
|
-
<AddToCartWidget item={cmmc.currentItem} onQuantityChanged={onQuantityChanged} variant={cmmc.cartEmpty ? 'primary' : 'outline'} className={addBtnClx}/>
|
|
91
|
-
{!cmmc.cartEmpty && checkoutButton}
|
|
92
|
-
</div>) : null));
|
|
93
|
-
return (<div className={cn('px-4 md:px-6 pt-3 pb-4 flex flex-col gap-1 items-center', r.current?.single?.scrollable ? SCROLL.scrollHeightClx : 'h-auto', clx)}>
|
|
94
|
-
{r.current?.single ? (<SingleFamilySelector {...r.current.single} mediaConstraint={MEDIA_CONSTRAINT} mobile={mobile} clx={selectorClx}/>) : (r.current?.multi && r.current.families && /* safegaurd for first render, etc. */ (<MultiFamilyUI {...r.current.multi} families={r.current.families} parent={r.current.node} clx={selectorClx}/>))}
|
|
95
|
-
<Buttons clx={cn('self-stretch mt-8 flex flex-col items-center gap-3 shrink-0 grow-0', buttonsAreaClx)}/>
|
|
96
|
-
</div>);
|
|
97
|
-
};
|
|
98
|
-
export default CarouselBuyCard;
|
|
99
|
-
//# sourceMappingURL=carousel-buy-card.jsx.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"carousel-buy-card.jsx","sourceRoot":"","sources":["../../../components/buy/carousel-buy-card.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,147 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
import React, { useCallback, useEffect, useRef, useState } from 'react';
|
|
3
|
-
import { reaction } from 'mobx';
|
|
4
|
-
import { observer } from 'mobx-react-lite';
|
|
5
|
-
import { cn } from '@hanzo/ui/util';
|
|
6
|
-
import { ApplyTypography, Carousel, CarouselContent, CarouselItem, CarouselPrevious, CarouselNext, MediaStack, } from '@hanzo/ui/primitives';
|
|
7
|
-
import { formatCurrencyValue, accessItemOptions, accessMultiSelectorOptions } from '../../../util';
|
|
8
|
-
import QuantityIndicator from '../../item-selector/quantity-indicator';
|
|
9
|
-
import { ButtonItemSelector, useCommerce } from '../../..';
|
|
10
|
-
const debugBorder = (c, disable = true) => {
|
|
11
|
-
if (disable) {
|
|
12
|
-
return '';
|
|
13
|
-
}
|
|
14
|
-
switch (c) {
|
|
15
|
-
case 'r': return ' border border-[#ffaaaa] ';
|
|
16
|
-
case 'g': return ' border border-[#aaffaa] ';
|
|
17
|
-
case 'b': return ' border border-[#aaaaff] ';
|
|
18
|
-
}
|
|
19
|
-
};
|
|
20
|
-
const DEFAULT_CONSTRAINT = { w: 250, h: 250 };
|
|
21
|
-
const AllVariantsCarousel = ({ families, parent, clx = '', itemClx = '', itemOptions, selectorOptions, mediaConstraint = DEFAULT_CONSTRAINT, mobile = false, // not relavant to any children
|
|
22
|
-
}) => {
|
|
23
|
-
const cmmc = useCommerce();
|
|
24
|
-
const r = useRef(undefined);
|
|
25
|
-
const [changeMeToRerender, setChangeMeToRerender] = useState(false);
|
|
26
|
-
// Safe, since Carousel is only render (and this method passed), once the ref is initialized.
|
|
27
|
-
const setApi = (api) => { r.current.api = api; };
|
|
28
|
-
const onSelect = useCallback((emblaApi) => {
|
|
29
|
-
if (r.current?.dontRespond) {
|
|
30
|
-
r.current.dontRespond = false;
|
|
31
|
-
return;
|
|
32
|
-
}
|
|
33
|
-
const index = emblaApi.selectedScrollSnap();
|
|
34
|
-
if (index !== -1) {
|
|
35
|
-
const item = r.current?.items[index];
|
|
36
|
-
cmmc.setCurrentItem(item?.sku); // (sets currentFamily as well)
|
|
37
|
-
}
|
|
38
|
-
if (r.current) {
|
|
39
|
-
r.current.dontRespond = false;
|
|
40
|
-
}
|
|
41
|
-
}, []);
|
|
42
|
-
useEffect(() => {
|
|
43
|
-
const items = families.map((fam) => fam.products).flat();
|
|
44
|
-
const foundIndex = cmmc.currentItem ? items.findIndex((item) => (cmmc.currentItem.sku == item.sku)) : -1;
|
|
45
|
-
r.current = {
|
|
46
|
-
items,
|
|
47
|
-
initialIndex: foundIndex === -1 ? 0 : foundIndex,
|
|
48
|
-
dontRespond: false,
|
|
49
|
-
api: undefined
|
|
50
|
-
};
|
|
51
|
-
setChangeMeToRerender(!changeMeToRerender);
|
|
52
|
-
// This responds to the swatch clicks
|
|
53
|
-
return reaction(() => (cmmc.currentItem), (item) => {
|
|
54
|
-
if (r.current && r.current.api) {
|
|
55
|
-
const index = r.current.items.findIndex((_item) => (_item.sku === item?.sku));
|
|
56
|
-
if (index && index !== -1) {
|
|
57
|
-
// no need to sync family, since ui only allows selecting within a family
|
|
58
|
-
r.current.dontRespond = true;
|
|
59
|
-
r.current.api.scrollTo(index);
|
|
60
|
-
}
|
|
61
|
-
}
|
|
62
|
-
});
|
|
63
|
-
}, []);
|
|
64
|
-
const Header = observer(({ clx = '' }) => {
|
|
65
|
-
const { showParentTitle, parentByline: parentBylineMode } = accessMultiSelectorOptions(selectorOptions);
|
|
66
|
-
const { familyTitle, showFamilyByline } = accessItemOptions(itemOptions);
|
|
67
|
-
const parentTitleDisplay = showParentTitle ? parent.label : undefined;
|
|
68
|
-
const parentBylineDisplay = (parentBylineMode === 'own-line') ? parent.subNodesLabel : '';
|
|
69
|
-
const title = (familyTitle === 'none' ?
|
|
70
|
-
undefined
|
|
71
|
-
:
|
|
72
|
-
(familyTitle === 'long' ?
|
|
73
|
-
cmmc.currentFamily?.title
|
|
74
|
-
:
|
|
75
|
-
(cmmc.currentFamily?.titleShort ?? cmmc.currentFamily?.title)));
|
|
76
|
-
let titleLinePrefix = (parentBylineMode === 'none' || parentBylineMode === 'own-line') ? '' : (parent.subNodesLabel ?? '');
|
|
77
|
-
if (titleLinePrefix.length > 0 && title && parentBylineMode === 'comma-sep') {
|
|
78
|
-
titleLinePrefix += ', ';
|
|
79
|
-
}
|
|
80
|
-
else if (titleLinePrefix.length > 0 && title && parentBylineMode === 'colon-sep') {
|
|
81
|
-
titleLinePrefix += ': ';
|
|
82
|
-
}
|
|
83
|
-
const titleDisplay = title ? (titleLinePrefix + title) : undefined;
|
|
84
|
-
const bylineDisplay = (familyTitle !== 'none') && showFamilyByline ? cmmc.currentFamily?.byline : undefined;
|
|
85
|
-
return (<ApplyTypography className={cn('flex flex-col items-center !gap-0 [&>*]:!m-0 ', clx)}>
|
|
86
|
-
{parentTitleDisplay && <h4>{parentTitleDisplay}</h4>}
|
|
87
|
-
{parentBylineDisplay && <h4>{parentBylineDisplay}</h4>}
|
|
88
|
-
{titleDisplay && <h4>{titleDisplay}</h4>}
|
|
89
|
-
{bylineDisplay && (<h6>{bylineDisplay}</h6>)}
|
|
90
|
-
</ApplyTypography>);
|
|
91
|
-
});
|
|
92
|
-
const ItemInfo = observer(({ clx = '', labelClx = '' }) => {
|
|
93
|
-
const { showPrice, showQuantity, showFamilyInOption, showByline, } = accessItemOptions(itemOptions);
|
|
94
|
-
const optionLabel = () => (showFamilyInOption ?
|
|
95
|
-
(cmmc.currentItem.familyTitle + ', ' + cmmc.currentItem.optionLabel)
|
|
96
|
-
:
|
|
97
|
-
cmmc.currentItem.optionLabel);
|
|
98
|
-
return (cmmc.currentItem && (<ApplyTypography className={cn('flex flex-col items-center [&>*]:!m-0 !gap-1 ', clx)}>
|
|
99
|
-
<div className={'flex items-center gap-1 [&>*]:!m-0 ' +
|
|
100
|
-
debugBorder('g') +
|
|
101
|
-
(showFamilyInOption ? 'flex-col' : 'flex-row')}>
|
|
102
|
-
<h6 className={cn('font-semibold', labelClx)}>
|
|
103
|
-
{optionLabel() + (showPrice && !showFamilyInOption ? ',' : '')}
|
|
104
|
-
</h6>
|
|
105
|
-
<div className={'flex items-center gap-1 [&>*]:!m-0 flex-row ' + debugBorder('b') +
|
|
106
|
-
(showFamilyInOption ? 'w-full justify-between' : '')}>
|
|
107
|
-
{showPrice && (<p>{formatCurrencyValue(cmmc.currentItem.price)}</p>)}
|
|
108
|
-
{showQuantity && (<QuantityIndicator item={cmmc.currentItem} clx='h-[22px] ml-4' iconClx='fill-foreground' digitClx='not-typography font-semibold text-primary-fg leading-none font-sans text-xs'/>)}
|
|
109
|
-
</div>
|
|
110
|
-
</div>
|
|
111
|
-
{showByline && cmmc.currentItem.byline && (<p>{cmmc.currentItem.byline}</p>)}
|
|
112
|
-
</ApplyTypography>));
|
|
113
|
-
});
|
|
114
|
-
const Swatches = observer(({ clx = '' }) => {
|
|
115
|
-
const { showItemSwatches } = accessMultiSelectorOptions(selectorOptions);
|
|
116
|
-
if (!showItemSwatches ||
|
|
117
|
-
!cmmc.currentFamily
|
|
118
|
-
//|| cmmc.currentFamily.products.length === 1
|
|
119
|
-
) {
|
|
120
|
-
return null;
|
|
121
|
-
}
|
|
122
|
-
return <ButtonItemSelector items={cmmc.currentFamily.products} selectedItemRef={cmmc} selectSku={cmmc.setCurrentItem.bind(cmmc)} clx={clx} options={{
|
|
123
|
-
buttonType: 'image',
|
|
124
|
-
horizButtons: true
|
|
125
|
-
}}/>;
|
|
126
|
-
});
|
|
127
|
-
return (<div className={cn('w-full flex flex-col items-center', clx)}>
|
|
128
|
-
<Header />
|
|
129
|
-
{r.current && /* Only render once we've set the ref fields, or else bad things! */ (<Carousel options={{ loop: true, startIndex: r.current.initialIndex }} className={'w-full px-2' + debugBorder('r')} onCarouselSelect={onSelect} setApi={setApi}>
|
|
130
|
-
<CarouselContent>
|
|
131
|
-
{r.current.items.map((item) => (<CarouselItem key={item.sku} className={cn('p-2 flex flex-col justify-center items-center', itemClx)}>
|
|
132
|
-
<MediaStack media={item} constrainTo={mediaConstraint} clx='my-4'/>
|
|
133
|
-
</CarouselItem>))}
|
|
134
|
-
</CarouselContent>
|
|
135
|
-
{r.current.items.length > 1 && (<>
|
|
136
|
-
<CarouselPrevious className='left-1'/>
|
|
137
|
-
<CarouselNext className='right-1'/>
|
|
138
|
-
</>)}
|
|
139
|
-
</Carousel>)}
|
|
140
|
-
<div className='flex flex-col items-center justify-start'>
|
|
141
|
-
<ItemInfo labelClx='!text-base font-medium'/>
|
|
142
|
-
<Swatches clx='mt-2'/>
|
|
143
|
-
</div>
|
|
144
|
-
</div>);
|
|
145
|
-
};
|
|
146
|
-
export { AllVariantsCarousel as default };
|
|
147
|
-
//# sourceMappingURL=all-variants-carousel.jsx.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"all-variants-carousel.jsx","sourceRoot":"","sources":["../../../../components/buy/multi-family/all-variants-carousel.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,34 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
import React, { useCallback, useRef } from 'react';
|
|
3
|
-
import { cn } from '@hanzo/ui/util';
|
|
4
|
-
import { Carousel, CarouselContent, CarouselItem, CarouselPrevious, CarouselNext, } from '@hanzo/ui/primitives';
|
|
5
|
-
import FamilySlide from './slide';
|
|
6
|
-
import { FamilyCarouselState } from './state';
|
|
7
|
-
import { useCommerce } from '../../../..';
|
|
8
|
-
const FamilyCarousel = ({ families, clx = '', itemClx = '', itemOptions, selectorOptions, mediaConstraint = { w: 250, h: 250 }, mobile = false, }) => {
|
|
9
|
-
const cmmc = useCommerce();
|
|
10
|
-
const stateRef = useRef(new FamilyCarouselState(families, cmmc.setCurrentItem.bind(cmmc)));
|
|
11
|
-
const onSelect = useCallback((emblaApi) => {
|
|
12
|
-
const index = emblaApi.selectedScrollSnap();
|
|
13
|
-
if (index !== -1) {
|
|
14
|
-
stateRef.current.setCurrentFamily(families[index].id);
|
|
15
|
-
}
|
|
16
|
-
}, [stateRef.current]);
|
|
17
|
-
return (<Carousel className={cn('px-2', clx)} options={{ loop: false }} onCarouselSelect={onSelect}>
|
|
18
|
-
<CarouselContent>
|
|
19
|
-
{families.map((family) => {
|
|
20
|
-
const slideState = stateRef.current.getSlideState(family.id);
|
|
21
|
-
if (!slideState) {
|
|
22
|
-
throw new Error(`FamilyCarousel: no SlideState for family '${family.id}'!`);
|
|
23
|
-
}
|
|
24
|
-
return (<CarouselItem key={family.id} className='p-2 flex flex-col justify-center items-center'>
|
|
25
|
-
<FamilySlide family={family} selectedItemRef={slideState} selectSku={slideState.selectSku.bind(slideState)} mediaConstraint={mediaConstraint} options={itemOptions} mobile={mobile} clx={itemClx}/>
|
|
26
|
-
</CarouselItem>);
|
|
27
|
-
})}
|
|
28
|
-
</CarouselContent>
|
|
29
|
-
<CarouselPrevious className='left-1'/>
|
|
30
|
-
<CarouselNext className='right-1'/>
|
|
31
|
-
</Carousel>);
|
|
32
|
-
};
|
|
33
|
-
export default FamilyCarousel;
|
|
34
|
-
//# sourceMappingURL=index.jsx.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.jsx","sourceRoot":"","sources":["../../../../../components/buy/multi-family/family-carousel/index.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;AACZ,OAAO,KAAK,EAAE,EAAE,WAAW,EAAE,MAAM,EAAE,MAAM,OAAO,CAAA;AAElD,OAAO,EAAE,EAAE,EAAE,MAAM,gBAAgB,CAAA;AAEnC,OAAO,EAEL,QAAQ,EACR,eAAe,EACf,YAAY,EACZ,gBAAgB,EAChB,YAAY,GACb,MAAM,sBAAsB,CAAA;AAI7B,OAAO,WAAW,MAAM,SAAS,CAAA;AACjC,OAAO,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAA;AAE7C,OAAO,EAAE,WAAW,EAAE,MAAM,aAAa,CAAA;AAEzC,MAAM,cAAc,GAAuC,CAAC,EAC1D,QAAQ,EACR,GAAG,GAAC,EAAE,EACN,OAAO,GAAC,EAAE,EACV,WAAW,EACX,eAAe,EACf,eAAe,GAAC,EAAC,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAC,EAChC,MAAM,GAAC,KAAK,GACb,EAAE,EAAE;IAEH,MAAM,IAAI,GAAG,WAAW,EAAE,CAAA;IAC1B,MAAM,QAAQ,GAAG,MAAM,CACrB,IAAI,mBAAmB,CAAC,QAAQ,EAAE,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAClE,CAAA;IAED,MAAM,QAAQ,GAAG,WAAW,CAAC,CAAC,QAAqB,EAAE,EAAE;QACrD,MAAM,KAAK,GAAG,QAAQ,CAAC,kBAAkB,EAAE,CAAA;QAC3C,IAAI,KAAK,KAAK,CAAC,CAAC,EAAE,CAAC;YACjB,QAAQ,CAAC,OAAO,CAAC,gBAAgB,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAA;QACvD,CAAC;IACH,CAAC,EAAE,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAC,CAAA;IAEtB,OAAO,CACL,CAAC,QAAQ,CACP,SAAS,CAAC,CAAC,EAAE,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC,CAC3B,OAAO,CAAC,CAAC,EAAC,IAAI,EAAE,KAAK,EAAC,CAAC,CACvB,gBAAgB,CAAC,CAAC,QAAQ,CAAC,CAE3B;MAAA,CAAC,eAAe,CAChB;MAAA,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE;YACvB,MAAM,UAAU,GAAG,QAAQ,CAAC,OAAO,CAAC,aAAa,CAAC,MAAM,CAAC,EAAE,CAAC,CAAA;YAC5D,IAAI,CAAC,UAAU,EAAE,CAAC;gBAChB,MAAM,IAAI,KAAK,CAAC,6CAA6C,MAAM,CAAC,EAAE,IAAI,CAAC,CAAA;YAC7E,CAAC;YACD,OAAO,CACL,CAAC,YAAY,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC,SAAS,CAAC,+CAA+C,CACrF;YAAA,CAAC,WAAW,CACV,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,eAAe,CAAC,CAAC,UAAU,CAAC,CAC5B,SAAS,CAAC,CAAC,UAAU,CAAC,SAAS,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CACjD,eAAe,CAAC,CAAC,eAAe,CAAC,CACjC,OAAO,CAAC,CAAC,WAAW,CAAC,CACrB,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,GAAG,CAAC,CAAC,OAAO,CAAC,EAEjB;UAAA,EAAE,YAAY,CAAC,CAChB,CAAA;QAAA,CAAC,CACH,CACD;MAAA,EAAE,eAAe,CACjB;MAAA,CAAC,gBAAgB,CAAC,SAAS,CAAC,QAAQ,EACpC;MAAA,CAAC,YAAY,CAAC,SAAS,CAAC,SAAS,EACnC;IAAA,EAAE,QAAQ,CAAC,CACZ,CAAA;AACH,CAAC,CAAA;AAED,eAAe,cAAc,CAAA"}
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import type { Dimensions } from '@hanzo/ui/types';
|
|
3
|
-
import type { ItemSelectorOptions, Family, ItemSelector } from '../../../../types';
|
|
4
|
-
declare const FamilySlide: React.FC<Omit<ItemSelector, 'items'> & {
|
|
5
|
-
family: Family;
|
|
6
|
-
mediaConstraint: Dimensions;
|
|
7
|
-
clx?: string;
|
|
8
|
-
mobile?: boolean;
|
|
9
|
-
options?: ItemSelectorOptions;
|
|
10
|
-
}>;
|
|
11
|
-
export default FamilySlide;
|
|
@@ -1,41 +0,0 @@
|
|
|
1
|
-
'use client';
|
|
2
|
-
import React from 'react';
|
|
3
|
-
import { ApplyTypography, MediaStack } from '@hanzo/ui/primitives';
|
|
4
|
-
import { ButtonItemSelector } from '../../..';
|
|
5
|
-
import { cn } from '@hanzo/ui/util';
|
|
6
|
-
const FamilySlide = ({ family, selectedItemRef, selectSku, mediaConstraint: cnst = { w: 200, h: 200 }, clx = '', mobile = false, options = {} }) => {
|
|
7
|
-
const titleSpec = 'title' in options ? options.title : 'short';
|
|
8
|
-
const showByline = 'showByline' in options ? options.showByline : true;
|
|
9
|
-
const title = titleSpec === 'long' ?
|
|
10
|
-
family.title
|
|
11
|
-
:
|
|
12
|
-
(titleSpec === 'short' ?
|
|
13
|
-
(family.titleShort ? family.titleShort : family.title)
|
|
14
|
-
:
|
|
15
|
-
undefined);
|
|
16
|
-
const byline = (showByline && family.byline) ? family.byline : undefined;
|
|
17
|
-
/*
|
|
18
|
-
let byline: string | undefined = undefined
|
|
19
|
-
if (showByline) {
|
|
20
|
-
if (family.byline) {
|
|
21
|
-
// if byline names another field thats a function, call it
|
|
22
|
-
if (family.byline in family && typeof (family as any)[family.byline] === 'function') {
|
|
23
|
-
byline = (family as any)[family.byline]() as string
|
|
24
|
-
}
|
|
25
|
-
else {
|
|
26
|
-
byline = family.byline
|
|
27
|
-
}
|
|
28
|
-
}
|
|
29
|
-
}
|
|
30
|
-
*/
|
|
31
|
-
return (<div className={cn('flex flex-col items-center gap-4', clx)} data-vaul-no-drag>
|
|
32
|
-
{title && (<ApplyTypography className='flex flex-col items-center !gap-1 [&>*]:!m-0' data-vaul-no-drag>
|
|
33
|
-
<h6 className='font-bold text-lg'>{title}</h6>
|
|
34
|
-
{byline && (<p className={''}>{byline}</p>)}
|
|
35
|
-
</ApplyTypography>)}
|
|
36
|
-
<MediaStack media={selectedItemRef.item} constrainTo={cnst}/>
|
|
37
|
-
<ButtonItemSelector items={family.products} selectedItemRef={selectedItemRef} selectSku={selectSku} scrollable={false} mobile={mobile} options={options} itemClx='text-sm'/>
|
|
38
|
-
</div>);
|
|
39
|
-
};
|
|
40
|
-
export default FamilySlide;
|
|
41
|
-
//# sourceMappingURL=slide.jsx.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"slide.jsx","sourceRoot":"","sources":["../../../../../components/buy/multi-family/family-carousel/slide.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;AACZ,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EACL,eAAe,EACf,UAAU,EACX,MAAM,sBAAsB,CAAA;AAI7B,OAAO,EAAE,kBAAkB,EAAE,MAAM,UAAU,CAAA;AAC7C,OAAO,EAAE,EAAE,EAAE,MAAM,gBAAgB,CAAA;AAEnC,MAAM,WAAW,GAMZ,CAAC,EACJ,MAAM,EACN,eAAe,EACf,SAAS,EACT,eAAe,EAAE,IAAI,GAAG,EAAC,CAAC,EAAE,GAAG,EAAE,CAAC,EAAE,GAAG,EAAC,EACxC,GAAG,GAAC,EAAE,EACN,MAAM,GAAC,KAAK,EACZ,OAAO,GAAC,EAAE,EACX,EAAE,EAAE;IAEH,MAAM,SAAS,GAAG,OAAO,IAAI,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,OAAO,CAAA;IAC9D,MAAM,UAAU,GAAG,YAAY,IAAI,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC,CAAC,IAAI,CAAA;IACtE,MAAM,KAAK,GAAG,SAAS,KAAK,MAAM,CAAC,CAAC;QAClC,MAAM,CAAC,KAAK;QACZ,CAAC;YACD,CACE,SAAS,KAAK,OAAO,CAAC,CAAC;gBACrB,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAE;gBACvD,CAAC;oBACD,SAAS,CACZ,CAAA;IAEH,MAAM,MAAM,GAAG,CAAC,UAAU,IAAI,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAA;IACxE;;;;;;;;;;;;;MAaE;IAEF,OAAO,CACL,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,kCAAkC,EAAE,GAAG,CAAC,CAAC,CAAE,iBAAiB,CAC7E;MAAA,CAAC,KAAK,IAAI,CACR,CAAC,eAAe,CAAC,SAAS,CAAC,8CAA8C,CAAC,iBAAiB,CACzF;UAAA,CAAC,EAAE,CAAC,SAAS,CAAC,mBAAmB,CAAC,CAAC,KAAK,CAAC,EAAE,EAAE,CAC7C;UAAA,CAAC,MAAM,IAAI,CAAC,CAAC,CAAC,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC,CAAC,CAC7C;QAAA,EAAE,eAAe,CAAC,CACnB,CACD;MAAA,CAAC,UAAU,CACT,KAAK,CAAC,CAAC,eAAe,CAAC,IAAK,CAAC,CAC7B,WAAW,CAAC,CAAC,IAAI,CAAC,EAEpB;MAAA,CAAC,kBAAkB,CACjB,KAAK,CAAC,CAAC,MAAM,CAAC,QAAsB,CAAC,CACrC,eAAe,CAAC,CAAC,eAAe,CAAC,CACjC,SAAS,CAAC,CAAC,SAAS,CAAC,CACrB,UAAU,CAAC,CAAC,KAAK,CAAC,CAClB,MAAM,CAAC,CAAC,MAAM,CAAC,CACf,OAAO,CAAC,CAAC,OAAO,CAAC,CACjB,OAAO,CAAC,SAAS,EAErB;IAAA,EAAE,GAAG,CAAC,CACP,CAAA;AACH,CAAC,CAAA;AAED,eAAe,WAAW,CAAA"}
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import type { Family, LineItem, ObsLineItemRef, Product } from '../../../../types';
|
|
2
|
-
declare class SlideState implements ObsLineItemRef {
|
|
3
|
-
_fam: Family;
|
|
4
|
-
_item: Product;
|
|
5
|
-
_syncSku: (sku: string) => void;
|
|
6
|
-
_selected: boolean;
|
|
7
|
-
constructor(fam: Family, initiallySelected: boolean, sync: (sku: string) => void);
|
|
8
|
-
selectSku: (sku: string) => void;
|
|
9
|
-
setSelected: (b: boolean) => void;
|
|
10
|
-
get id(): string;
|
|
11
|
-
get item(): LineItem | undefined;
|
|
12
|
-
}
|
|
13
|
-
declare class FamilyCarouselState {
|
|
14
|
-
_map: Map<string, SlideState>;
|
|
15
|
-
_syncSku: (sku: string) => void;
|
|
16
|
-
constructor(fams: Family[], syncSkuToCurrentSlide: (sku: string) => void);
|
|
17
|
-
setCurrentFamily: (id: string) => void;
|
|
18
|
-
getSlideState: (familyId: string) => SlideState | undefined;
|
|
19
|
-
}
|
|
20
|
-
export { SlideState, FamilyCarouselState };
|
|
@@ -1,59 +0,0 @@
|
|
|
1
|
-
import { observable, action, computed, makeObservable } from 'mobx';
|
|
2
|
-
class SlideState {
|
|
3
|
-
constructor(fam, initiallySelected, sync) {
|
|
4
|
-
this.selectSku = (sku) => {
|
|
5
|
-
if (this._item.sku === sku)
|
|
6
|
-
return;
|
|
7
|
-
const found = this._fam.products.find((i) => (i.sku === sku));
|
|
8
|
-
if (found) {
|
|
9
|
-
this._item = found;
|
|
10
|
-
if (this._selected) {
|
|
11
|
-
this._syncSku(sku);
|
|
12
|
-
}
|
|
13
|
-
}
|
|
14
|
-
else {
|
|
15
|
-
throw new Error('SlideState.selectSku(): no item found!');
|
|
16
|
-
}
|
|
17
|
-
};
|
|
18
|
-
this.setSelected = (b) => { this._selected = b; };
|
|
19
|
-
this._fam = fam;
|
|
20
|
-
this._item = fam.products[0];
|
|
21
|
-
this._selected = initiallySelected;
|
|
22
|
-
this._syncSku = sync;
|
|
23
|
-
makeObservable(this, {
|
|
24
|
-
_item: observable,
|
|
25
|
-
item: computed,
|
|
26
|
-
selectSku: action
|
|
27
|
-
});
|
|
28
|
-
}
|
|
29
|
-
get id() { return (this._fam.id); }
|
|
30
|
-
get item() {
|
|
31
|
-
return this._item;
|
|
32
|
-
}
|
|
33
|
-
}
|
|
34
|
-
class FamilyCarouselState {
|
|
35
|
-
constructor(fams,
|
|
36
|
-
// initialFamilyId: string,
|
|
37
|
-
syncSkuToCurrentSlide) {
|
|
38
|
-
this._map = new Map();
|
|
39
|
-
this.setCurrentFamily = (id) => {
|
|
40
|
-
this._map.forEach((s) => {
|
|
41
|
-
s.setSelected(s.id === id);
|
|
42
|
-
});
|
|
43
|
-
const slideState = this._map.get(id);
|
|
44
|
-
if (slideState) {
|
|
45
|
-
this._syncSku(slideState.item.sku);
|
|
46
|
-
}
|
|
47
|
-
else {
|
|
48
|
-
throw new Error(`FamilyCarouselState.setCurrentFamily: no state object for id '${id}'!`);
|
|
49
|
-
}
|
|
50
|
-
};
|
|
51
|
-
this.getSlideState = (familyId) => (this._map.get(familyId));
|
|
52
|
-
fams.forEach((f, index) => {
|
|
53
|
-
this._map.set(f.id, new SlideState(f, (index === 0), syncSkuToCurrentSlide));
|
|
54
|
-
});
|
|
55
|
-
this._syncSku = syncSkuToCurrentSlide;
|
|
56
|
-
}
|
|
57
|
-
}
|
|
58
|
-
export { SlideState, FamilyCarouselState };
|
|
59
|
-
//# sourceMappingURL=state.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"state.js","sourceRoot":"","sources":["../../../../../components/buy/multi-family/family-carousel/state.ts"],"names":[],"mappings":"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"}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../components/buy/multi-family/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,cAAc,EAAE,MAAM,mBAAmB,CAAA;AAC7D,OAAO,EAAE,OAAO,IAAI,mBAAmB,EAAE,MAAM,yBAAyB,CAAA"}
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import type { Dimensions } from '@hanzo/ui/types';
|
|
3
|
-
import type { ItemSelectorOptions, ItemSelectorProps, LineItem } from '../../types';
|
|
4
|
-
declare const SingleFamilySelector: React.FC<{
|
|
5
|
-
items: LineItem[];
|
|
6
|
-
Selector: React.ComponentType<ItemSelectorProps>;
|
|
7
|
-
selOptions: ItemSelectorOptions | undefined;
|
|
8
|
-
scrollable?: boolean;
|
|
9
|
-
showItemMedia?: boolean;
|
|
10
|
-
mediaConstraint?: Dimensions;
|
|
11
|
-
mobile?: boolean;
|
|
12
|
-
clx?: string;
|
|
13
|
-
titleAreaClx?: string;
|
|
14
|
-
}>;
|
|
15
|
-
export default SingleFamilySelector;
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { observer } from 'mobx-react-lite';
|
|
3
|
-
import { MediaStack, Skeleton } from '@hanzo/ui/primitives';
|
|
4
|
-
import { useCommerce } from '../..';
|
|
5
|
-
import TitleAndByline from './title-and-byline';
|
|
6
|
-
import { accessItemOptions } from '../../util';
|
|
7
|
-
import { cn } from '@hanzo/ui/util';
|
|
8
|
-
const DEF_MEDIA_CONSTRAINT = { w: 200, h: 200 };
|
|
9
|
-
const SingleFamilySelector = ({ items, Selector, selOptions, scrollable = false, showItemMedia = true, mediaConstraint = DEF_MEDIA_CONSTRAINT, mobile = false, clx = '', titleAreaClx = '' }) => {
|
|
10
|
-
const cmmc = useCommerce();
|
|
11
|
-
const MyTitleAndByline = observer(({ clx = '' }) => {
|
|
12
|
-
const { familyTitle, showFamilyByline } = accessItemOptions(selOptions);
|
|
13
|
-
const title = (familyTitle === 'none' ?
|
|
14
|
-
undefined
|
|
15
|
-
:
|
|
16
|
-
(familyTitle === 'long' ?
|
|
17
|
-
cmmc.currentFamily?.title
|
|
18
|
-
:
|
|
19
|
-
(cmmc.currentFamily?.titleShort ?? cmmc.currentFamily?.title)));
|
|
20
|
-
const byline = (familyTitle !== 'none') && showFamilyByline ? cmmc.currentFamily?.byline : undefined;
|
|
21
|
-
return (<TitleAndByline clx={clx} title={title} byline={byline}/>);
|
|
22
|
-
});
|
|
23
|
-
const ItemMedia = observer(() => (cmmc.currentItem ? (<MediaStack media={cmmc.currentItem} constrainTo={mediaConstraint} clx={'mb-2 ' + (scrollable ? 'shrink-0' : '')}/>) : (<Skeleton className={'w-[200px] h-[200px] my-2 ' + (scrollable ? 'shrink-0' : '')}/>)));
|
|
24
|
-
return (<div className={cn(clx, 'flex flex-col items-center', (scrollable ? 'shrink' : ''))}>
|
|
25
|
-
<MyTitleAndByline clx={cn(titleAreaClx, (scrollable ? 'shrink-0' : ''))}/>
|
|
26
|
-
{showItemMedia && (<ItemMedia />)}
|
|
27
|
-
{items && (<Selector items={items} selectedItemRef={cmmc} selectSku={cmmc.setCurrentItem.bind(cmmc)} scrollable={scrollable} mobile={mobile} options={selOptions} clx={(scrollable ? 'shrink' : '')}/>)}
|
|
28
|
-
</div>);
|
|
29
|
-
};
|
|
30
|
-
export default SingleFamilySelector;
|
|
31
|
-
//# sourceMappingURL=single-family-selector.jsx.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"single-family-selector.jsx","sourceRoot":"","sources":["../../../components/buy/single-family-selector.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import { ApplyTypography } from '@hanzo/ui/primitives';
|
|
3
|
-
import { cn } from '@hanzo/ui/util';
|
|
4
|
-
const TitleAndByline = ({ title, byline, clx = '', bylineClx = '' }) => ((title || byline) ? (<ApplyTypography className={cn('flex flex-col items-center !gap-0 [&>*]:!m-0 ', clx)}>
|
|
5
|
-
<h4>{title}</h4>
|
|
6
|
-
{byline && (<h6 className={bylineClx}>{byline}</h6>)}
|
|
7
|
-
</ApplyTypography>) : (null));
|
|
8
|
-
export default TitleAndByline;
|
|
9
|
-
//# sourceMappingURL=title-and-byline.jsx.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"title-and-byline.jsx","sourceRoot":"","sources":["../../../components/buy/title-and-byline.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAA;AAEzB,OAAO,EAAE,eAAe,EAAE,MAAM,sBAAsB,CAAA;AACtD,OAAO,EAAE,EAAE,EAAE,MAAM,gBAAgB,CAAA;AAEnC,MAAM,cAAc,GAKf,CAAC,EACJ,KAAK,EACL,MAAM,EACN,GAAG,GAAC,EAAE,EACN,SAAS,GAAC,EAAE,EACb,EAAE,EAAE,CAAC,CAAE,CAAC,KAAK,IAAI,MAAM,CAAC,CAAC,CAAC,CAAC,CACxB,CAAC,eAAe,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,+CAA+C,EAAE,GAAG,CAAC,CAAC,CACnF;MAAA,CAAC,EAAE,CAAC,CAAC,KAAK,CAAC,EAAE,EAAE,CACf;MAAA,CAAC,MAAM,IAAI,CAAC,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,EAAE,EAAE,CAAC,CAAC,CACtD;IAAA,EAAE,eAAe,CAAC,CACnB,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CACX,CAAA;AAED,eAAe,cAAc,CAAA"}
|
|
@@ -1,11 +0,0 @@
|
|
|
1
|
-
import React from 'react';
|
|
2
|
-
import type { LineItem } from '../../../types';
|
|
3
|
-
declare const CartLineItem: React.FC<{
|
|
4
|
-
item: LineItem;
|
|
5
|
-
className?: string;
|
|
6
|
-
imgSizePx?: number;
|
|
7
|
-
showPromoCode?: boolean;
|
|
8
|
-
itemClicked?: (item: LineItem) => void;
|
|
9
|
-
selected?: boolean;
|
|
10
|
-
}>;
|
|
11
|
-
export default CartLineItem;
|