@anker-in/headless-ui 1.3.15 → 1.3.16

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.
Files changed (24) hide show
  1. package/dist/cjs/biz-components/ShelfDisplay/index.js +1 -1
  2. package/dist/cjs/biz-components/ShelfDisplay/index.js.map +3 -3
  3. package/dist/cjs/biz-components/ShelfDisplay/shelfDisplay.d.ts +11 -1
  4. package/dist/cjs/biz-components/ShelfDisplay/shelfDisplay.js +1 -1
  5. package/dist/cjs/biz-components/ShelfDisplay/shelfDisplay.js.map +3 -3
  6. package/dist/cjs/biz-components/ShelfDisplay/shelfDisplayItem.js +1 -1
  7. package/dist/cjs/biz-components/ShelfDisplay/shelfDisplayItem.js.map +3 -3
  8. package/dist/cjs/biz-components/Title/index.js +1 -1
  9. package/dist/cjs/biz-components/Title/index.js.map +2 -2
  10. package/dist/cjs/components/tabs.js +1 -1
  11. package/dist/cjs/components/tabs.js.map +2 -2
  12. package/dist/esm/biz-components/ShelfDisplay/index.js +1 -1
  13. package/dist/esm/biz-components/ShelfDisplay/index.js.map +3 -3
  14. package/dist/esm/biz-components/ShelfDisplay/shelfDisplay.d.ts +11 -1
  15. package/dist/esm/biz-components/ShelfDisplay/shelfDisplay.js +1 -1
  16. package/dist/esm/biz-components/ShelfDisplay/shelfDisplay.js.map +3 -3
  17. package/dist/esm/biz-components/ShelfDisplay/shelfDisplayItem.js +1 -1
  18. package/dist/esm/biz-components/ShelfDisplay/shelfDisplayItem.js.map +3 -3
  19. package/dist/esm/biz-components/Title/index.js +1 -1
  20. package/dist/esm/biz-components/Title/index.js.map +2 -2
  21. package/dist/esm/components/tabs.js +1 -1
  22. package/dist/esm/components/tabs.js.map +2 -2
  23. package/package.json +1 -1
  24. package/style.css +3 -0
package/dist/esm/biz-components/ShelfDisplay/shelfDisplayItem.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/ShelfDisplay/shelfDisplayItem.tsx"],
4
- "sourcesContent": ["import { useAiuiContext } from '../AiuiProvider/index.js'\nimport { formatVariantPrice } from './shelfDisplay.js'\nimport Picture from '../../components/picture.js'\nimport Badge from '../../components/badge.js'\nimport { cn } from '../../helpers/utils.js'\nimport { Text } from '../../components/text.js'\nimport Button from '../../components/button.js'\nimport { gaTrack } from '../../shared/track.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { Heading } from '../../components/heading.js'\nimport type { ShelfDisplayItem, ShelfDisplayType } from './shelfDisplay.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { useRef, useEffect, useMemo, useState } from 'react'\n\nconst componentType = 'image'\nconst componentName = 'product_shelf'\n\nconst SOLD_OUT_PRICE = 9999999.99\n\n// \u516C\u5171\u51FD\u6570\uFF1A\u83B7\u53D6\u4EA7\u54C1\u56FE\u7247URL\u548CaltText\nexport const getProductImage = (data: any) => {\n const sku = data?.sku\n const skuArray = data?.variants\n const findSku = skuArray?.find((item: any) => item?.sku === sku)\n const imageUrl = findSku?.image?.url || skuArray?.[0]?.image?.url || ''\n const altText = findSku?.image?.altText || skuArray?.[0]?.image?.altText || data?.custom_name || data?.title || ''\n\n return {\n imageUrl,\n altText,\n }\n}\n\nexport const ShelfDisplayWrapItem = ({ data, configuration }: { data: any; configuration?: any }) => {\n const {\n isDisplayBackImage = false,\n itemShape,\n metafields,\n isTopTag = false,\n isShowTag,\n isShowOriginalPrice,\n isShowShortTitle = false,\n } = configuration || {}\n const { locale = 'es', copyWriting, currencyDisplay } = useAiuiContext()\n const { discounts, discountsCopy } = metafields || {}\n const ref = useRef<HTMLDivElement>(null)\n const [showTags, setShowTags] = useState<string[]>([])\n const [currentPriceTag, setCurrentPriceTag] = useState<string>('')\n\n const onPrimaryButton = (params: ShelfDisplayItem, index: number, data: ShelfDisplayType, coupon: any) => {\n const { primaryFun, onAddCart, onBuyNow, onLearnMore, event } = configuration || {}\n\n // \u4F18\u5148\u4F7F\u7528 function props\uFF08\u6839\u636E primaryFun \u503C\uFF09\n if (primaryFun) {\n if (primaryFun === 'AddCart' && onAddCart) {\n return onAddCart(params, index + 1, data, coupon)\n }\n if (primaryFun === 'BuyNow' && onBuyNow) {\n return onBuyNow(params, index + 1, data, coupon)\n }\n if (primaryFun === 'LearnMore' && onLearnMore) {\n return onLearnMore(params, index + 1, data, coupon)\n }\n }\n\n // \u517C\u5BB9\u65E7\u7684 event \u903B\u8F91\n event?.primaryButton?.(params, index + 1, data, coupon)\n }\n\n const onSecondaryButton = (params: ShelfDisplayItem, index: number, data: ShelfDisplayType, coupon: any) => {\n const { secondaryFun, onAddCart, onBuyNow, onLearnMore, event } = configuration || {}\n\n // \u4F18\u5148\u4F7F\u7528 function props\uFF08\u6839\u636E secondaryFun \u503C\uFF09\n if (secondaryFun) {\n if (secondaryFun === 'AddCart' && onAddCart) {\n return onAddCart(params, index + 1, data, coupon)\n }\n if (secondaryFun === 'BuyNow' && onBuyNow) {\n return onBuyNow(params, index + 1, data, coupon)\n }\n if (secondaryFun === 'LearnMore' && onLearnMore) {\n return onLearnMore(params, index + 1, data, coupon)\n }\n }\n\n // \u517C\u5BB9\u65E7\u7684 event \u903B\u8F91\n event?.secondaryButton?.(params, index + 1, data, coupon)\n }\n\n const variant = useMemo(() => {\n const variants = data?.variants || []\n if (!variants.length) {\n return undefined\n }\n if (!data?.sku) {\n return variants?.[0]\n }\n return variants?.find?.((item: any) => item?.sku === data?.sku) || variants[0]\n }, [data?.sku, data?.variants])\n\n const variantArr = variant?.id?.split?.('/') || []\n const variantId = variantArr?.[variantArr?.length - 1]\n\n const isSoldOut =\n !variant?.availableForSale || variant?.price?.amount === SOLD_OUT_PRICE || variant?.price === SOLD_OUT_PRICE\n\n // active \u7684 \u901A\u7528\u6298\u6263\n const coupon = variant?.coupons?.[0]\n\n const shouldUseCouponPrice = Boolean(isShowOriginalPrice && coupon)\n const currencyCode = data?.price?.currencyCode || 'USD'\n\n const priceInfo = useMemo(\n () =>\n formatVariantPrice({\n locale,\n amount: shouldUseCouponPrice ? coupon?.variant_price4wscode : variant?.price,\n baseAmount: shouldUseCouponPrice ? variant?.price : 0,\n currencyCode,\n currencyDisplay,\n }),\n [currencyCode, locale, shouldUseCouponPrice, coupon?.variant_price4wscode, variant]\n )\n\n const { price, basePrice, discount, discountAmount } = priceInfo\n\n const { imageUrl, altText } = getProductImage(data)\n\n const displayTitle = data?.custom_name || data?.title\n const currentDisplayTitle = isShowShortTitle\n ? variant?.metafields?.infos?.page_short_title || displayTitle\n : displayTitle\n const displayDescription = data?.custom_description || data?.description\n\n const showPrice = () => {\n if (coupon?.value_type === 'fixed_amount') {\n const amountStr = discountAmount || ''\n const match = amountStr.match(/^(.*?)(\\d[\\d.,]*)(.*)$/)\n if (match) {\n const [, prefix, numeric, suffix] = match\n let updatedNumeric = numeric\n if (numeric.endsWith('.00')) {\n updatedNumeric = numeric.replace(/\\.00$/, '')\n } else if (numeric.endsWith(',00')) {\n updatedNumeric = numeric.replace(/,00$/, '')\n }\n return `${prefix}${updatedNumeric}${suffix}`\n }\n return amountStr\n }\n return discount || ''\n }\n\n // \u5904\u7406\u6807\u7B7E\n useEffect(() => {\n let handleTags: string[] = []\n if (discount || discountAmount) {\n const discountTag = `${showPrice()} ${discounts?.off || discountsCopy?.off || ''}`\n setCurrentPriceTag(discountTag)\n handleTags.push(discountTag)\n }\n const newTags = data?.tags\n ?.filter?.((item: string) => item?.startsWith?.('CLtag'))\n ?.map?.((item: string) => item?.replace?.('CLtag:', ''))\n ?.slice?.(0, discount ? 1 : 2)\n setShowTags(handleTags.concat(newTags))\n }, [data?.tags, discount, discountAmount, discounts?.off, discountsCopy?.off])\n\n useExposure(ref, {\n componentType,\n componentName,\n componentTitle: displayTitle,\n componentDescription: displayDescription,\n position: configuration?.index + 1,\n })\n\n const bottomContent = () => {\n return (\n <>\n {isShowTag && showTags?.length > 0 ? (\n <div className=\"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden\">\n {showTags?.map?.((item: any, index: number) => (\n <Badge key={index} className=\"shelf-items-tag\">\n {item}\n </Badge>\n ))}\n </div>\n ) : null}\n {currentDisplayTitle ? (\n <Heading\n as=\"h3\"\n title={currentDisplayTitle || ''}\n size={2}\n className=\"shelf-display-product-title lg-desktop:h-[58px] text-info-primary line-clamp-2 h-12\"\n html={currentDisplayTitle || ''}\n />\n ) : null}\n <Text\n size={2}\n className=\"lg-desktop:text-lg desktop:h-[24px] lg-desktop:h-[28px] desktop:text-base shelf-display-product-description text-info-primary line-clamp-1 h-[20px] text-sm\"\n html={displayDescription || ''}\n />\n <div className=\"mb-2 mt-4 flex items-center\">\n {isSoldOut ? (\n <div className=\"tablet:text-2xl text-info-primary text-xl font-bold\">{copyWriting?.soldOutText}</div>\n ) : (\n <>\n <div className=\"final-price tablet:text-xl text-info-primary text-xl font-bold\">\n {variant?.availableForSale ? price || '' : ''}\n </div>\n <div className=\"origin-price tablet:text-xl text-info-secondary ml-1 text-lg font-bold line-through\">\n {variant?.availableForSale ? basePrice || '' : ''}\n </div>\n </>\n )}\n </div>\n {/* \u6309\u94AE\u7EC4 */}\n <div\n className={cn(\n 'shelf-flex-button-group',\n 'lg-desktop:gap-3 flex items-center gap-2',\n configuration.direction === 'vertical' ? 'flex-col' : ''\n )}\n >\n {configuration?.secondaryButton ? (\n <Button\n disabled={isSoldOut && configuration?.secondaryFun !== 'LearnMore'}\n variant=\"secondary\"\n href={data?.custom_secondary_link}\n as={data?.custom_secondary_link ? 'a' : 'button'}\n onClick={() =>\n !data?.custom_secondary_link && onSecondaryButton(data, configuration?.index, configuration, coupon)\n }\n className={configuration.direction === 'vertical' ? 'w-full' : ''}\n >\n {configuration?.secondaryButton || ''}\n </Button>\n ) : null}\n {configuration?.primaryButton ? (\n <Button\n disabled={isSoldOut && configuration?.primaryFun !== 'LearnMore'}\n variant=\"primary\"\n href={data?.custom_primary_link}\n as={data?.custom_primary_link ? 'a' : 'button'}\n onClick={() =>\n !data?.custom_primary_link && onPrimaryButton(data, configuration?.index, configuration, coupon)\n }\n className={configuration.direction === 'vertical' ? 'w-full' : ''}\n >\n {configuration?.primaryButton || ''}\n </Button>\n ) : null}\n </div>\n </>\n )\n }\n\n const custom_bg_image = data?.custom_bg_image\n const custom_theme = data?.custom_theme\n\n return (\n <div\n ref={ref}\n key={data?.id || data?.handle}\n className={cn(\n 'box-border w-full cursor-pointer overflow-hidden duration-300',\n itemShape === 'round' ? 'rounded-2xl' : 'rounded-none',\n 'lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[480] desktop:aspect-w-[316] desktop:aspect-h-[384]',\n 'laptop:aspect-w-[288] laptop:aspect-h-[360] aspect-w-[296] aspect-h-[360] relative',\n 'md-tablet:h-[360px] shelf-display-item',\n custom_bg_image ? 'bg-cover bg-center bg-no-repeat' : 'bg-background tablet:hover:bg-info-white',\n { 'aiui-dark': custom_theme === 'dark' }\n )}\n style={custom_bg_image ? { backgroundImage: `url(${custom_bg_image})` } : undefined}\n >\n {isDisplayBackImage ? (\n <div className=\"absolute inset-0 box-border overflow-hidden\">\n <div className=\"relative inset-0 size-full\">\n <Picture\n source={imageUrl}\n alt={altText}\n className={cn('flex h-full justify-center object-cover [&_img]:w-auto', {\n 'opacity-0': custom_bg_image,\n })}\n />\n <div className=\"desktop:p-6 absolute inset-x-0 bottom-0 box-border overflow-hidden p-4\">\n {bottomContent()}\n </div>\n </div>\n </div>\n ) : (\n <div className=\"desktop:p-6 absolute inset-0 box-border flex flex-col justify-between overflow-hidden p-4\">\n {currentPriceTag && isTopTag && (\n <Badge className=\"shelf-prices-tag absolute left-4 top-4 z-10\">{currentPriceTag || ''}</Badge>\n )}\n <div\n className={cn(\n 'lg-desktop:h-[195px] shelf-display-item-image relative mb-2 inline-block h-[140px] w-full flex-1 overflow-hidden',\n { 'opacity-0': custom_bg_image }\n )}\n >\n <a\n aria-label={displayTitle}\n target={configuration?.target}\n href={trackUrlRef(\n `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}?variant=${variantId}`,\n `${componentType}_${componentName}`\n )}\n onClick={() => {\n gaTrack({\n event: 'ga4Event',\n event_name: 'select_item',\n event_parameters: {\n page_group: 'Home Page',\n item_list_name: 'Home_Page_Bundle',\n items: [\n {\n item_id: data?.sku || variant?.sku,\n item_name: data?.name,\n item_variant: variant?.name,\n price: variant?.price,\n index: configuration?.index + 1,\n },\n ],\n },\n })\n }}\n >\n <Picture\n source={imageUrl}\n alt={altText}\n className=\"flex h-full justify-center object-cover [&_img]:w-auto\"\n />\n </a>\n </div>\n {bottomContent()}\n </div>\n )}\n </div>\n )\n}\n\nexport const ShelfDisplayHorizontalItem = ({ data, configuration }: { data: any; configuration?: any }) => {\n const { itemShape, itemLength, metafields, isShowShortTitle } = configuration || {}\n const { discounts, discountsCopy } = metafields || {}\n const { locale = 'us', copyWriting, currencyDisplay } = useAiuiContext()\n const [showTags, setShowTags] = useState<string[]>([])\n const ref = useRef<HTMLDivElement>(null)\n\n const onPrimaryButton = (params: ShelfDisplayItem, index: number, data: ShelfDisplayType, coupon: any) => {\n const { primaryFun, onAddCart, onBuyNow, onLearnMore, event } = configuration || {}\n\n // \u4F18\u5148\u4F7F\u7528 function props\uFF08\u6839\u636E primaryFun \u503C\uFF09\n if (primaryFun) {\n if (primaryFun === 'AddCart' && onAddCart) {\n return onAddCart(params, index + 1, data, coupon)\n }\n if (primaryFun === 'BuyNow' && onBuyNow) {\n return onBuyNow(params, index + 1, data, coupon)\n }\n if (primaryFun === 'LearnMore' && onLearnMore) {\n return onLearnMore(params, index + 1, data, coupon)\n }\n }\n\n // \u517C\u5BB9\u65E7\u7684 event \u903B\u8F91\n event?.primaryButton?.(params, index + 1, data, coupon)\n }\n\n const onSecondaryButton = (params: ShelfDisplayItem, index: number, data: ShelfDisplayType, coupon: any) => {\n const { secondaryFun, onAddCart, onBuyNow, onLearnMore, event } = configuration || {}\n\n // \u4F18\u5148\u4F7F\u7528 function props\uFF08\u6839\u636E secondaryFun \u503C\uFF09\n if (secondaryFun) {\n if (secondaryFun === 'AddCart' && onAddCart) {\n return onAddCart(params, index + 1, data, coupon)\n }\n if (secondaryFun === 'BuyNow' && onBuyNow) {\n return onBuyNow(params, index + 1, data, coupon)\n }\n if (secondaryFun === 'LearnMore' && onLearnMore) {\n return onLearnMore(params, index + 1, data, coupon)\n }\n }\n\n // \u517C\u5BB9\u65E7\u7684 event \u903B\u8F91\n event?.secondaryButton?.(params, index + 1, data, coupon)\n }\n\n const variant = useMemo(() => {\n const variants = data?.variants || []\n if (!variants.length) {\n return undefined\n }\n if (!data?.sku) {\n return variants[0]\n }\n return variants.find((item: any) => item?.sku === data?.sku) || variants[0]\n }, [data?.sku, data?.variants])\n\n const variantArr = variant?.id?.split?.('/') || []\n const variantId = variantArr?.[variantArr?.length - 1]\n\n const isSoldOut =\n !variant?.availableForSale || variant?.price?.amount === SOLD_OUT_PRICE || variant?.price === SOLD_OUT_PRICE\n const isShowTag = configuration?.isShowTag\n const isShowOriginalPrice = configuration?.isShowOriginalPrice\n\n // active \u7684 \u901A\u7528\u6298\u6263\n const coupon = variant?.coupons?.[0]\n\n const shouldUseCouponPrice = Boolean(isShowOriginalPrice && coupon)\n const currencyCode = data?.price?.currencyCode || 'USD'\n\n const priceInfo = useMemo(\n () =>\n formatVariantPrice({\n locale,\n amount: shouldUseCouponPrice ? coupon?.variant_price4wscode : variant?.price,\n baseAmount: shouldUseCouponPrice ? variant?.price : 0,\n currencyCode,\n currencyDisplay,\n }),\n [currencyCode, locale, shouldUseCouponPrice, coupon?.variant_price4wscode, variant]\n )\n\n const { price, basePrice, discount, discountAmount } = priceInfo\n\n const { imageUrl, altText } = getProductImage(data)\n\n const displayTitle = data?.custom_name || data?.title\n const currentDisplayTitle = isShowShortTitle\n ? variant?.metafields?.infos?.page_short_title || displayTitle\n : displayTitle\n const displayDescription = data?.custom_description || data?.description\n\n useExposure(ref, {\n componentType,\n componentName,\n componentTitle: displayTitle,\n componentDescription: displayDescription,\n position: configuration?.index + 1,\n })\n\n const showSizeClass = (): {\n boxItem: string\n imgItem: string\n wrap: string\n } => {\n if (itemLength >= 2) {\n return {\n boxItem: 'lg-desktop:max-w-[401px] desktop:max-w-[292px] max-w-full',\n imgItem:\n 'm-tablet:m-auto lg-desktop:max-w-[330px] lg-desktop:max-h-[330px] desktop:max-w-[260px] desktop:max-h-[260px] max-w-[138px] max-h-[138px]',\n wrap: 'lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[480] desktop:aspect-w-[648] desktop:aspect-h-[380] laptop:aspect-w-[440] laptop:aspect-h-[356] tablet:aspect-w-[346] tablet:aspect-h-[360] md-tablet:w-full',\n }\n }\n return {\n boxItem: 'lg-desktop:max-w-[401px] desktop:max-w-[292px] laptop:max-w-[289px] max-w-[262px]',\n imgItem:\n 'md-tablet:m-auto lg-desktop:max-w-[450px] lg-desktop:max-h-[450px] desktop:max-w-[332px] desktop:max-h-[332px] max-w-[312px] max-h-[312px]',\n wrap: 'lg-desktop:aspect-w-[1664] lg-desktop:aspect-h-[480] desktop:aspect-w-[1312] desktop:aspect-h-[380] laptop:aspect-w-[896] laptop:aspect-h-[356] tablet:aspect-w-[704] tablet:aspect-h-[360] md-tablet:w-full',\n }\n }\n\n const handleWrapClass = () => {\n if (itemLength >= 2) {\n return 'flex flex-col justify-between desktop:gap-12 desktop:flex-row desktop:justify-center desktop:items-center'\n }\n return 'flex justify-center items-center gap-6 md-tablet:flex-col'\n }\n\n const showPrice = () => {\n if (coupon?.value_type === 'fixed_amount') {\n const amountStr = discountAmount || ''\n const match = amountStr.match(/^(.*?)(\\d[\\d.,]*)(.*)$/)\n if (match) {\n const [, prefix, numeric, suffix] = match\n let updatedNumeric = numeric\n if (numeric.endsWith('.00')) {\n updatedNumeric = numeric.replace(/\\.00$/, '')\n } else if (numeric.endsWith(',00')) {\n updatedNumeric = numeric.replace(/,00$/, '')\n }\n return `${prefix}${updatedNumeric}${suffix}`\n }\n return amountStr\n }\n return discount || ''\n }\n\n // \u5904\u7406\u6807\u7B7E\n useEffect(() => {\n let handleTags: string[] = []\n if (discount || discountAmount) {\n const discountTag = `${showPrice()} ${discounts?.off || discountsCopy?.off || ''}`\n handleTags.push(discountTag)\n }\n const newTags = data?.tags\n ?.filter?.((item: string) => item?.startsWith?.('CLtag'))\n ?.map?.((item: string) => item?.replace?.('CLtag:', ''))\n ?.slice?.(0, discount ? 1 : 2)\n setShowTags(handleTags.concat(newTags))\n }, [data?.tags, discount, discountAmount, discounts?.off, discountsCopy?.off])\n\n const custom_bg_image = data?.custom_bg_image\n const custom_theme = data?.custom_theme\n\n return (\n <div\n ref={ref}\n key={data?.id || data?.handle}\n className={cn(\n showSizeClass().wrap,\n itemShape === 'round' ? 'rounded-2xl' : 'rounded-none',\n 'shelf-display-item',\n 'duration-300',\n 'md-tablet:h-[360px] relative box-border w-full cursor-pointer overflow-hidden',\n custom_bg_image ? 'bg-cover bg-center bg-no-repeat' : 'bg-container-secondary-1 tablet:hover:bg-info-white',\n { 'aiui-dark': custom_theme === 'dark' }\n )}\n style={custom_bg_image ? { backgroundImage: `url(${custom_bg_image})` } : undefined}\n >\n <div className={cn(handleWrapClass(), 'desktop:p-6 absolute inset-0 box-border overflow-hidden p-4')}>\n <div\n className={cn(showSizeClass().imgItem, 'desktop:mb-0 relative mb-1 overflow-hidden', {\n 'opacity-0': custom_bg_image,\n })}\n >\n <a\n aria-label={displayTitle}\n target={configuration?.target}\n href={trackUrlRef(\n `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}?variant=${variantId}`,\n `${componentType}_${componentName}`\n )}\n onClick={() => {\n gaTrack({\n event: 'ga4Event',\n event_name: 'select_item',\n event_parameters: {\n page_group: 'Home Page',\n item_list_name: 'Home_Page_Bundle',\n items: [\n {\n item_id: data?.sku || variant?.sku,\n item_name: data?.name,\n item_variant: variant?.name,\n price: variant?.price,\n index: configuration?.index + 1,\n },\n ],\n },\n })\n }}\n >\n <Picture\n source={imageUrl}\n alt={altText}\n className=\"flex h-full justify-center object-cover [&_img]:w-auto\"\n />\n </a>\n </div>\n <div className={cn('flex flex-col items-start justify-center', showSizeClass().boxItem)}>\n {isShowTag && (\n <div className=\"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden\">\n {showTags?.length > 0 &&\n showTags?.map?.((item: any, index: number) => (\n <Badge key={index} className=\"shelf-items-tag\">\n {item}\n </Badge>\n ))}\n </div>\n )}\n {currentDisplayTitle ? (\n <Heading\n as=\"h3\"\n title={currentDisplayTitle || ''}\n size={2}\n className=\"shelf-display-product-title lg-desktop:h-[58px] text-info-primary mb-1 line-clamp-2 h-[48px]\"\n html={currentDisplayTitle || ''}\n />\n ) : null}\n {displayDescription ? (\n <Text\n size={2}\n className=\"lg-desktop:text-lg lg-desktop:h-[26px] desktop:text-base desktop:h-6 shelf-display-product-description text-info-primary line-clamp-1 h-5 text-sm\"\n html={displayDescription || ''}\n />\n ) : null}\n <div className=\"mb-2 mt-5 flex items-center\">\n {isSoldOut ? (\n <div className=\"tablet:text-2xl text-info-primary text-xl font-bold\">{copyWriting?.soldOutText}</div>\n ) : (\n <>\n <div className=\"final-price tablet:text-xl text-info-primary text-xl font-bold\">\n {variant?.availableForSale ? price || '' : ''}\n </div>\n <div className=\"origin-price tablet:text-xl text-info-secondary ml-1 text-lg font-bold line-through\">\n {variant?.availableForSale ? basePrice || '' : ''}\n </div>\n </>\n )}\n </div>\n {/* \u6309\u94AE\u7EC4 */}\n <div\n className={cn(\n 'shelf-flex-button-group',\n 'lg-desktop:gap-3 flex items-center gap-2',\n configuration.direction === 'vertical' ? 'flex-col' : ''\n )}\n >\n {configuration?.secondaryButton ? (\n <Button\n variant=\"secondary\"\n href={data?.custom_secondary_link}\n as={data?.custom_secondary_link ? 'a' : 'button'}\n onClick={() =>\n !data?.custom_secondary_link && onSecondaryButton(data, configuration?.index, configuration, coupon)\n }\n className={configuration.direction === 'vertical' ? 'w-full' : ''}\n >\n {configuration?.secondaryButton || ''}\n </Button>\n ) : null}\n {configuration?.primaryButton ? (\n <Button\n disabled={isSoldOut}\n variant=\"primary\"\n href={data?.custom_primary_link}\n as={data?.custom_primary_link ? 'a' : 'button'}\n onClick={() =>\n !data?.custom_primary_link && onPrimaryButton(data, configuration?.index, configuration, coupon)\n }\n className={configuration.direction === 'vertical' ? 'w-full' : ''}\n >\n {configuration?.primaryButton || ''}\n </Button>\n ) : null}\n </div>\n </div>\n </div>\n </div>\n )\n}\n"],
5
- "mappings": "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",
6
- "names": ["Fragment", "jsx", "jsxs", "useAiuiContext", "formatVariantPrice", "Picture", "Badge", "cn", "Text", "Button", "gaTrack", "trackUrlRef", "Heading", "useExposure", "useRef", "useEffect", "useMemo", "useState", "componentType", "componentName", "SOLD_OUT_PRICE", "getProductImage", "data", "sku", "skuArray", "findSku", "item", "imageUrl", "altText", "ShelfDisplayWrapItem", "configuration", "isDisplayBackImage", "itemShape", "metafields", "isTopTag", "isShowTag", "isShowOriginalPrice", "isShowShortTitle", "locale", "copyWriting", "currencyDisplay", "discounts", "discountsCopy", "ref", "showTags", "setShowTags", "currentPriceTag", "setCurrentPriceTag", "onPrimaryButton", "params", "index", "coupon", "primaryFun", "onAddCart", "onBuyNow", "onLearnMore", "event", "onSecondaryButton", "secondaryFun", "variant", "variants", "variantArr", "variantId", "isSoldOut", "shouldUseCouponPrice", "currencyCode", "priceInfo", "price", "basePrice", "discount", "discountAmount", "displayTitle", "currentDisplayTitle", "displayDescription", "showPrice", "amountStr", "match", "prefix", "numeric", "suffix", "updatedNumeric", "handleTags", "discountTag", "newTags", "bottomContent", "custom_bg_image", "custom_theme", "ShelfDisplayHorizontalItem", "itemLength", "showSizeClass", "handleWrapClass"]
4
+ "sourcesContent": ["import { useAiuiContext } from '../AiuiProvider/index.js'\nimport { formatVariantPrice } from './shelfDisplay.js'\nimport Picture from '../../components/picture.js'\nimport Badge from '../../components/badge.js'\nimport { cn } from '../../helpers/utils.js'\nimport { Text } from '../../components/text.js'\nimport Button from '../../components/button.js'\nimport { gaTrack } from '../../shared/track.js'\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { Heading } from '../../components/heading.js'\nimport type { ShelfDisplayItem, ShelfDisplayType } from './shelfDisplay.js'\nimport { useExposure } from '../../hooks/useExposure.js'\nimport { useRef, useEffect, useMemo, useState } from 'react'\n\nconst componentType = 'image'\nconst componentName = 'product_shelf'\n\nconst SOLD_OUT_PRICE = 9999999.99\n\n// \u516C\u5171\u51FD\u6570\uFF1A\u83B7\u53D6\u4EA7\u54C1\u56FE\u7247URL\u548CaltText\nexport const getProductImage = (data: any) => {\n const sku = data?.sku\n const skuArray = data?.variants\n const findSku = skuArray?.find((item: any) => item?.sku === sku)\n const imageUrl = findSku?.image?.url || skuArray?.[0]?.image?.url || ''\n const altText = findSku?.image?.altText || skuArray?.[0]?.image?.altText || data?.custom_name || data?.title || ''\n\n return {\n imageUrl,\n altText,\n }\n}\n\nexport const ShelfDisplayWrapItem = ({ data, configuration }: { data: any; configuration?: any }) => {\n const {\n isDisplayBackImage = false,\n itemShape,\n metafields,\n isTopTag = false,\n isShowTag,\n isShowOriginalPrice,\n isShowShortTitle = false,\n formatPrice,\n } = configuration || {}\n const { locale = 'es', copyWriting, currencyDisplay } = useAiuiContext()\n const { discounts, discountsCopy } = metafields || {}\n const ref = useRef<HTMLDivElement>(null)\n const [showTags, setShowTags] = useState<string[]>([])\n const [currentPriceTag, setCurrentPriceTag] = useState<string>('')\n\n const onPrimaryButton = (params: ShelfDisplayItem, index: number, data: ShelfDisplayType, coupon: any) => {\n const { primaryFun, onAddCart, onBuyNow, onLearnMore, event } = configuration || {}\n\n // \u4F18\u5148\u4F7F\u7528 function props\uFF08\u6839\u636E primaryFun \u503C\uFF09\n if (primaryFun) {\n if (primaryFun === 'AddCart' && onAddCart) {\n return onAddCart(params, index + 1, data, coupon)\n }\n if (primaryFun === 'BuyNow' && onBuyNow) {\n return onBuyNow(params, index + 1, data, coupon)\n }\n if (primaryFun === 'LearnMore' && onLearnMore) {\n return onLearnMore(params, index + 1, data, coupon)\n }\n }\n\n // \u517C\u5BB9\u65E7\u7684 event \u903B\u8F91\n event?.primaryButton?.(params, index + 1, data, coupon)\n }\n\n const onSecondaryButton = (params: ShelfDisplayItem, index: number, data: ShelfDisplayType, coupon: any) => {\n const { secondaryFun, onAddCart, onBuyNow, onLearnMore, event } = configuration || {}\n\n // \u4F18\u5148\u4F7F\u7528 function props\uFF08\u6839\u636E secondaryFun \u503C\uFF09\n if (secondaryFun) {\n if (secondaryFun === 'AddCart' && onAddCart) {\n return onAddCart(params, index + 1, data, coupon)\n }\n if (secondaryFun === 'BuyNow' && onBuyNow) {\n return onBuyNow(params, index + 1, data, coupon)\n }\n if (secondaryFun === 'LearnMore' && onLearnMore) {\n return onLearnMore(params, index + 1, data, coupon)\n }\n }\n\n // \u517C\u5BB9\u65E7\u7684 event \u903B\u8F91\n event?.secondaryButton?.(params, index + 1, data, coupon)\n }\n\n const variant = useMemo(() => {\n const variants = data?.variants || []\n if (!variants.length) {\n return undefined\n }\n if (!data?.sku) {\n return variants?.[0]\n }\n return variants?.find?.((item: any) => item?.sku === data?.sku) || variants[0]\n }, [data?.sku, data?.variants])\n\n const variantArr = variant?.id?.split?.('/') || []\n const variantId = variantArr?.[variantArr?.length - 1]\n\n const isSoldOut =\n !variant?.availableForSale || variant?.price?.amount === SOLD_OUT_PRICE || variant?.price === SOLD_OUT_PRICE\n\n // active \u7684 \u901A\u7528\u6298\u6263\n const coupon = variant?.coupons?.[0]\n\n const shouldUseCouponPrice = Boolean(isShowOriginalPrice && coupon)\n const currencyCode = data?.price?.currencyCode || 'USD'\n\n const priceInfo = useMemo(\n () =>\n formatVariantPrice({\n locale,\n amount: shouldUseCouponPrice ? coupon?.variant_price4wscode : variant?.price,\n baseAmount: shouldUseCouponPrice ? variant?.price : 0,\n currencyCode,\n currencyDisplay,\n customFormatPrice: formatPrice,\n }),\n [currencyCode, locale, shouldUseCouponPrice, coupon?.variant_price4wscode, variant, formatPrice]\n )\n\n const { price, basePrice, discount, discountAmount } = priceInfo\n\n const { imageUrl, altText } = getProductImage(data)\n\n const displayTitle = data?.custom_name || data?.title\n const currentDisplayTitle = isShowShortTitle\n ? variant?.metafields?.infos?.page_short_title || displayTitle\n : displayTitle\n const displayDescription = data?.custom_description || data?.description\n\n const showPrice = () => {\n if (coupon?.value_type === 'fixed_amount') {\n const amountStr = discountAmount || ''\n const match = amountStr.match(/^(.*?)(\\d[\\d.,]*)(.*)$/)\n if (match) {\n const [, prefix, numeric, suffix] = match\n let updatedNumeric = numeric\n if (numeric.endsWith('.00')) {\n updatedNumeric = numeric.replace(/\\.00$/, '')\n } else if (numeric.endsWith(',00')) {\n updatedNumeric = numeric.replace(/,00$/, '')\n }\n return `${prefix}${updatedNumeric}${suffix}`\n }\n return amountStr\n }\n return discount || ''\n }\n\n // \u5904\u7406\u6807\u7B7E\n useEffect(() => {\n let handleTags: string[] = []\n if (discount || discountAmount) {\n const discountTag = `${showPrice()} ${discounts?.off || discountsCopy?.off || ''}`\n setCurrentPriceTag(discountTag)\n handleTags.push(discountTag)\n }\n const newTags = data?.tags\n ?.filter?.((item: string) => item?.startsWith?.('CLtag'))\n ?.map?.((item: string) => item?.replace?.('CLtag:', ''))\n ?.slice?.(0, discount ? 1 : 2)\n setShowTags(handleTags.concat(newTags))\n }, [data?.tags, discount, discountAmount, discounts?.off, discountsCopy?.off])\n\n useExposure(ref, {\n componentType,\n componentName,\n componentTitle: displayTitle,\n componentDescription: displayDescription,\n position: configuration?.index + 1,\n })\n\n const bottomContent = () => {\n return (\n <>\n {isShowTag && showTags?.length > 0 ? (\n <div className=\"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden\">\n {showTags?.map?.((item: any, index: number) => (\n <Badge key={index} className=\"shelf-items-tag\">\n {item}\n </Badge>\n ))}\n </div>\n ) : null}\n {currentDisplayTitle ? (\n <Heading\n as=\"h3\"\n title={currentDisplayTitle || ''}\n size={2}\n className=\"shelf-display-product-title lg-desktop:h-[58px] text-info-primary line-clamp-2 h-12\"\n html={currentDisplayTitle || ''}\n />\n ) : null}\n <Text\n size={2}\n className=\"lg-desktop:text-lg desktop:h-[24px] lg-desktop:h-[28px] desktop:text-base shelf-display-product-description text-info-primary line-clamp-1 h-[20px] text-sm\"\n html={displayDescription || ''}\n />\n <div className=\"mb-2 mt-4 flex items-center\">\n {isSoldOut ? (\n <div className=\"tablet:text-2xl text-info-primary text-xl font-bold\">{copyWriting?.soldOutText}</div>\n ) : (\n <>\n <div className=\"final-price tablet:text-xl text-info-primary text-xl font-bold\">\n {variant?.availableForSale ? price || '' : ''}\n </div>\n <div className=\"origin-price tablet:text-xl text-info-secondary ml-1 text-lg font-bold line-through\">\n {variant?.availableForSale ? basePrice || '' : ''}\n </div>\n </>\n )}\n </div>\n {/* \u6309\u94AE\u7EC4 */}\n <div\n className={cn(\n 'shelf-flex-button-group',\n 'lg-desktop:gap-3 flex items-center gap-2',\n configuration.direction === 'vertical' ? 'flex-col' : ''\n )}\n >\n {configuration?.secondaryButton ? (\n <Button\n disabled={isSoldOut && configuration?.secondaryFun !== 'LearnMore'}\n variant=\"secondary\"\n href={data?.custom_secondary_link}\n as={data?.custom_secondary_link ? 'a' : 'button'}\n onClick={() =>\n !data?.custom_secondary_link && onSecondaryButton(data, configuration?.index, configuration, coupon)\n }\n className={configuration.direction === 'vertical' ? 'w-full' : ''}\n >\n {configuration?.secondaryButton || ''}\n </Button>\n ) : null}\n {configuration?.primaryButton ? (\n <Button\n disabled={isSoldOut && configuration?.primaryFun !== 'LearnMore'}\n variant=\"primary\"\n href={data?.custom_primary_link}\n as={data?.custom_primary_link ? 'a' : 'button'}\n onClick={() =>\n !data?.custom_primary_link && onPrimaryButton(data, configuration?.index, configuration, coupon)\n }\n className={configuration.direction === 'vertical' ? 'w-full' : ''}\n >\n {configuration?.primaryButton || ''}\n </Button>\n ) : null}\n </div>\n </>\n )\n }\n\n const custom_bg_image = data?.custom_bg_image\n const custom_theme = data?.custom_theme\n\n return (\n <div\n ref={ref}\n key={data?.id || data?.handle}\n className={cn(\n 'box-border w-full cursor-pointer overflow-hidden duration-300',\n itemShape === 'round' ? 'rounded-2xl' : 'rounded-none',\n 'lg-desktop:aspect-w-[404] lg-desktop:aspect-h-[480] desktop:aspect-w-[316] desktop:aspect-h-[384]',\n 'laptop:aspect-w-[288] laptop:aspect-h-[360] aspect-w-[296] aspect-h-[360] relative',\n 'md-tablet:h-[360px] shelf-display-item',\n custom_bg_image ? 'bg-cover bg-center bg-no-repeat' : 'bg-background tablet:hover:bg-info-white',\n { 'aiui-dark': custom_theme === 'dark' }\n )}\n style={custom_bg_image ? { backgroundImage: `url(${custom_bg_image})` } : undefined}\n >\n {isDisplayBackImage ? (\n <div className=\"absolute inset-0 box-border overflow-hidden\">\n <div className=\"relative inset-0 size-full\">\n <Picture\n source={imageUrl}\n alt={altText}\n className={cn('flex h-full justify-center object-cover [&_img]:w-auto', {\n 'opacity-0': custom_bg_image,\n })}\n />\n <div className=\"desktop:p-6 absolute inset-x-0 bottom-0 box-border overflow-hidden p-4\">\n {bottomContent()}\n </div>\n </div>\n </div>\n ) : (\n <div className=\"desktop:p-6 absolute inset-0 box-border flex flex-col justify-between overflow-hidden p-4\">\n {currentPriceTag && isTopTag && (\n <Badge className=\"shelf-prices-tag absolute left-4 top-4 z-10\">{currentPriceTag || ''}</Badge>\n )}\n <div\n className={cn(\n 'lg-desktop:h-[195px] shelf-display-item-image relative mb-2 inline-block h-[140px] w-full flex-1 overflow-hidden',\n { 'opacity-0': custom_bg_image }\n )}\n >\n <a\n aria-label={displayTitle}\n target={configuration?.target}\n href={trackUrlRef(\n `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}?variant=${variantId}`,\n `${componentType}_${componentName}`\n )}\n onClick={() => {\n gaTrack({\n event: 'ga4Event',\n event_name: 'select_item',\n event_parameters: {\n page_group: 'Home Page',\n item_list_name: 'Home_Page_Bundle',\n items: [\n {\n item_id: data?.sku || variant?.sku,\n item_name: data?.name,\n item_variant: variant?.name,\n price: variant?.price,\n index: configuration?.index + 1,\n },\n ],\n },\n })\n }}\n >\n <Picture\n source={imageUrl}\n alt={altText}\n className=\"flex h-full justify-center object-cover [&_img]:w-auto\"\n />\n </a>\n </div>\n {bottomContent()}\n </div>\n )}\n </div>\n )\n}\n\nexport const ShelfDisplayHorizontalItem = ({ data, configuration }: { data: any; configuration?: any }) => {\n const { itemShape, itemLength, metafields, isShowShortTitle, formatPrice } = configuration || {}\n const { discounts, discountsCopy } = metafields || {}\n const { locale = 'us', copyWriting, currencyDisplay } = useAiuiContext()\n const [showTags, setShowTags] = useState<string[]>([])\n const ref = useRef<HTMLDivElement>(null)\n\n const onPrimaryButton = (params: ShelfDisplayItem, index: number, data: ShelfDisplayType, coupon: any) => {\n const { primaryFun, onAddCart, onBuyNow, onLearnMore, event } = configuration || {}\n\n // \u4F18\u5148\u4F7F\u7528 function props\uFF08\u6839\u636E primaryFun \u503C\uFF09\n if (primaryFun) {\n if (primaryFun === 'AddCart' && onAddCart) {\n return onAddCart(params, index + 1, data, coupon)\n }\n if (primaryFun === 'BuyNow' && onBuyNow) {\n return onBuyNow(params, index + 1, data, coupon)\n }\n if (primaryFun === 'LearnMore' && onLearnMore) {\n return onLearnMore(params, index + 1, data, coupon)\n }\n }\n\n // \u517C\u5BB9\u65E7\u7684 event \u903B\u8F91\n event?.primaryButton?.(params, index + 1, data, coupon)\n }\n\n const onSecondaryButton = (params: ShelfDisplayItem, index: number, data: ShelfDisplayType, coupon: any) => {\n const { secondaryFun, onAddCart, onBuyNow, onLearnMore, event } = configuration || {}\n\n // \u4F18\u5148\u4F7F\u7528 function props\uFF08\u6839\u636E secondaryFun \u503C\uFF09\n if (secondaryFun) {\n if (secondaryFun === 'AddCart' && onAddCart) {\n return onAddCart(params, index + 1, data, coupon)\n }\n if (secondaryFun === 'BuyNow' && onBuyNow) {\n return onBuyNow(params, index + 1, data, coupon)\n }\n if (secondaryFun === 'LearnMore' && onLearnMore) {\n return onLearnMore(params, index + 1, data, coupon)\n }\n }\n\n // \u517C\u5BB9\u65E7\u7684 event \u903B\u8F91\n event?.secondaryButton?.(params, index + 1, data, coupon)\n }\n\n const variant = useMemo(() => {\n const variants = data?.variants || []\n if (!variants.length) {\n return undefined\n }\n if (!data?.sku) {\n return variants[0]\n }\n return variants.find((item: any) => item?.sku === data?.sku) || variants[0]\n }, [data?.sku, data?.variants])\n\n const variantArr = variant?.id?.split?.('/') || []\n const variantId = variantArr?.[variantArr?.length - 1]\n\n const isSoldOut =\n !variant?.availableForSale || variant?.price?.amount === SOLD_OUT_PRICE || variant?.price === SOLD_OUT_PRICE\n const isShowTag = configuration?.isShowTag\n const isShowOriginalPrice = configuration?.isShowOriginalPrice\n\n // active \u7684 \u901A\u7528\u6298\u6263\n const coupon = variant?.coupons?.[0]\n\n const shouldUseCouponPrice = Boolean(isShowOriginalPrice && coupon)\n const currencyCode = data?.price?.currencyCode || 'USD'\n\n const priceInfo = useMemo(\n () =>\n formatVariantPrice({\n locale,\n amount: shouldUseCouponPrice ? coupon?.variant_price4wscode : variant?.price,\n baseAmount: shouldUseCouponPrice ? variant?.price : 0,\n currencyCode,\n currencyDisplay,\n customFormatPrice: formatPrice,\n }),\n [currencyCode, locale, shouldUseCouponPrice, coupon?.variant_price4wscode, variant, formatPrice]\n )\n\n const { price, basePrice, discount, discountAmount } = priceInfo\n\n const { imageUrl, altText } = getProductImage(data)\n\n const displayTitle = data?.custom_name || data?.title\n const currentDisplayTitle = isShowShortTitle\n ? variant?.metafields?.infos?.page_short_title || displayTitle\n : displayTitle\n const displayDescription = data?.custom_description || data?.description\n\n useExposure(ref, {\n componentType,\n componentName,\n componentTitle: displayTitle,\n componentDescription: displayDescription,\n position: configuration?.index + 1,\n })\n\n const showSizeClass = (): {\n boxItem: string\n imgItem: string\n wrap: string\n } => {\n if (itemLength >= 2) {\n return {\n boxItem: 'lg-desktop:max-w-[401px] desktop:max-w-[292px] max-w-full',\n imgItem:\n 'm-tablet:m-auto lg-desktop:max-w-[330px] lg-desktop:max-h-[330px] desktop:max-w-[260px] desktop:max-h-[260px] max-w-[138px] max-h-[138px]',\n wrap: 'lg-desktop:aspect-w-[824] lg-desktop:aspect-h-[480] desktop:aspect-w-[648] desktop:aspect-h-[380] laptop:aspect-w-[440] laptop:aspect-h-[356] tablet:aspect-w-[346] tablet:aspect-h-[360] md-tablet:w-full',\n }\n }\n return {\n boxItem: 'lg-desktop:max-w-[401px] desktop:max-w-[292px] laptop:max-w-[289px] max-w-[262px]',\n imgItem:\n 'md-tablet:m-auto lg-desktop:max-w-[450px] lg-desktop:max-h-[450px] desktop:max-w-[332px] desktop:max-h-[332px] max-w-[312px] max-h-[312px]',\n wrap: 'lg-desktop:aspect-w-[1664] lg-desktop:aspect-h-[480] desktop:aspect-w-[1312] desktop:aspect-h-[380] laptop:aspect-w-[896] laptop:aspect-h-[356] tablet:aspect-w-[704] tablet:aspect-h-[360] md-tablet:w-full',\n }\n }\n\n const handleWrapClass = () => {\n if (itemLength >= 2) {\n return 'flex flex-col justify-between desktop:gap-12 desktop:flex-row desktop:justify-center desktop:items-center'\n }\n return 'flex justify-center items-center gap-6 md-tablet:flex-col'\n }\n\n const showPrice = () => {\n if (coupon?.value_type === 'fixed_amount') {\n const amountStr = discountAmount || ''\n const match = amountStr.match(/^(.*?)(\\d[\\d.,]*)(.*)$/)\n if (match) {\n const [, prefix, numeric, suffix] = match\n let updatedNumeric = numeric\n if (numeric.endsWith('.00')) {\n updatedNumeric = numeric.replace(/\\.00$/, '')\n } else if (numeric.endsWith(',00')) {\n updatedNumeric = numeric.replace(/,00$/, '')\n }\n return `${prefix}${updatedNumeric}${suffix}`\n }\n return amountStr\n }\n return discount || ''\n }\n\n // \u5904\u7406\u6807\u7B7E\n useEffect(() => {\n let handleTags: string[] = []\n if (discount || discountAmount) {\n const discountTag = `${showPrice()} ${discounts?.off || discountsCopy?.off || ''}`\n handleTags.push(discountTag)\n }\n const newTags = data?.tags\n ?.filter?.((item: string) => item?.startsWith?.('CLtag'))\n ?.map?.((item: string) => item?.replace?.('CLtag:', ''))\n ?.slice?.(0, discount ? 1 : 2)\n setShowTags(handleTags.concat(newTags))\n }, [data?.tags, discount, discountAmount, discounts?.off, discountsCopy?.off])\n\n const custom_bg_image = data?.custom_bg_image\n const custom_theme = data?.custom_theme\n\n return (\n <div\n ref={ref}\n key={data?.id || data?.handle}\n className={cn(\n showSizeClass().wrap,\n itemShape === 'round' ? 'rounded-2xl' : 'rounded-none',\n 'shelf-display-item',\n 'duration-300',\n 'md-tablet:h-[360px] relative box-border w-full cursor-pointer overflow-hidden',\n custom_bg_image ? 'bg-cover bg-center bg-no-repeat' : 'bg-container-secondary-1 tablet:hover:bg-info-white',\n { 'aiui-dark': custom_theme === 'dark' }\n )}\n style={custom_bg_image ? { backgroundImage: `url(${custom_bg_image})` } : undefined}\n >\n <div className={cn(handleWrapClass(), 'desktop:p-6 absolute inset-0 box-border overflow-hidden p-4')}>\n <div\n className={cn(showSizeClass().imgItem, 'desktop:mb-0 relative mb-1 overflow-hidden', {\n 'opacity-0': custom_bg_image,\n })}\n >\n <a\n aria-label={displayTitle}\n target={configuration?.target}\n href={trackUrlRef(\n `${locale === 'us' || !locale ? '' : `/${locale}`}/products/${data?.handle}?variant=${variantId}`,\n `${componentType}_${componentName}`\n )}\n onClick={() => {\n gaTrack({\n event: 'ga4Event',\n event_name: 'select_item',\n event_parameters: {\n page_group: 'Home Page',\n item_list_name: 'Home_Page_Bundle',\n items: [\n {\n item_id: data?.sku || variant?.sku,\n item_name: data?.name,\n item_variant: variant?.name,\n price: variant?.price,\n index: configuration?.index + 1,\n },\n ],\n },\n })\n }}\n >\n <Picture\n source={imageUrl}\n alt={altText}\n className=\"flex h-full justify-center object-cover [&_img]:w-auto\"\n />\n </a>\n </div>\n <div className={cn('flex flex-col items-start justify-center', showSizeClass().boxItem)}>\n {isShowTag && (\n <div className=\"mb-1 box-border flex h-8 flex-wrap gap-1 overflow-hidden\">\n {showTags?.length > 0 &&\n showTags?.map?.((item: any, index: number) => (\n <Badge key={index} className=\"shelf-items-tag\">\n {item}\n </Badge>\n ))}\n </div>\n )}\n {currentDisplayTitle ? (\n <Heading\n as=\"h3\"\n title={currentDisplayTitle || ''}\n size={2}\n className=\"shelf-display-product-title lg-desktop:h-[58px] text-info-primary mb-1 line-clamp-2 h-[48px]\"\n html={currentDisplayTitle || ''}\n />\n ) : null}\n {displayDescription ? (\n <Text\n size={2}\n className=\"lg-desktop:text-lg lg-desktop:h-[26px] desktop:text-base desktop:h-6 shelf-display-product-description text-info-primary line-clamp-1 h-5 text-sm\"\n html={displayDescription || ''}\n />\n ) : null}\n <div className=\"mb-2 mt-5 flex items-center\">\n {isSoldOut ? (\n <div className=\"tablet:text-2xl text-info-primary text-xl font-bold\">{copyWriting?.soldOutText}</div>\n ) : (\n <>\n <div className=\"final-price tablet:text-xl text-info-primary text-xl font-bold\">\n {variant?.availableForSale ? price || '' : ''}\n </div>\n <div className=\"origin-price tablet:text-xl text-info-secondary ml-1 text-lg font-bold line-through\">\n {variant?.availableForSale ? basePrice || '' : ''}\n </div>\n </>\n )}\n </div>\n {/* \u6309\u94AE\u7EC4 */}\n <div\n className={cn(\n 'shelf-flex-button-group',\n 'lg-desktop:gap-3 flex items-center gap-2',\n configuration.direction === 'vertical' ? 'flex-col' : ''\n )}\n >\n {configuration?.secondaryButton ? (\n <Button\n variant=\"secondary\"\n href={data?.custom_secondary_link}\n as={data?.custom_secondary_link ? 'a' : 'button'}\n onClick={() =>\n !data?.custom_secondary_link && onSecondaryButton(data, configuration?.index, configuration, coupon)\n }\n className={configuration.direction === 'vertical' ? 'w-full' : ''}\n >\n {configuration?.secondaryButton || ''}\n </Button>\n ) : null}\n {configuration?.primaryButton ? (\n <Button\n disabled={isSoldOut}\n variant=\"primary\"\n href={data?.custom_primary_link}\n as={data?.custom_primary_link ? 'a' : 'button'}\n onClick={() =>\n !data?.custom_primary_link && onPrimaryButton(data, configuration?.index, configuration, coupon)\n }\n className={configuration.direction === 'vertical' ? 'w-full' : ''}\n >\n {configuration?.primaryButton || ''}\n </Button>\n ) : null}\n </div>\n </div>\n </div>\n </div>\n )\n}\n"],
5
+ "mappings": "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",
6
+ "names": ["Fragment", "jsx", "jsxs", "useAiuiContext", "formatVariantPrice", "Picture", "Badge", "cn", "Text", "Button", "gaTrack", "trackUrlRef", "Heading", "useExposure", "useRef", "useEffect", "useMemo", "useState", "componentType", "componentName", "SOLD_OUT_PRICE", "getProductImage", "data", "sku", "skuArray", "findSku", "item", "imageUrl", "altText", "ShelfDisplayWrapItem", "configuration", "isDisplayBackImage", "itemShape", "metafields", "isTopTag", "isShowTag", "isShowOriginalPrice", "isShowShortTitle", "formatPrice", "locale", "copyWriting", "currencyDisplay", "discounts", "discountsCopy", "ref", "showTags", "setShowTags", "currentPriceTag", "setCurrentPriceTag", "onPrimaryButton", "params", "index", "coupon", "primaryFun", "onAddCart", "onBuyNow", "onLearnMore", "event", "onSecondaryButton", "secondaryFun", "variant", "variants", "variantArr", "variantId", "isSoldOut", "shouldUseCouponPrice", "currencyCode", "priceInfo", "price", "basePrice", "discount", "discountAmount", "displayTitle", "currentDisplayTitle", "displayDescription", "showPrice", "amountStr", "match", "prefix", "numeric", "suffix", "updatedNumeric", "handleTags", "discountTag", "newTags", "bottomContent", "custom_bg_image", "custom_theme", "ShelfDisplayHorizontalItem", "itemLength", "showSizeClass", "handleWrapClass"]
7
7
  }
package/dist/esm/biz-components/Title/index.js CHANGED
@@ -1,2 +1,2 @@
1
- "use client";import{jsx as n,jsxs as T}from"react/jsx-runtime";import rt,{useEffect as st,useRef as h,useImperativeHandle as at,useState as lt}from"react";import{gsap as k}from"gsap";import{SplitText as z}from"gsap/dist/SplitText";import{ScrollTrigger as R}from"gsap/dist/ScrollTrigger";import{cn as i}from"../../helpers/utils.js";import{cva as N}from"class-variance-authority";import{Heading as dt,Text as P,Countdown as ct}from"../../components/index.js";import{withLayout as ut}from"../../shared/Styles.js";import{trackUrlRef as mt}from"../../shared/trackUrlRef.js";import{useInView as pt}from"react-intersection-observer";const S="link",V="title",ft=N("",{variants:{theme:{light:"text-[#080A0F]",dark:"text-[#F5F6F7]"}},defaultVariants:{theme:"light"}}),ht=N("desktop:text-base desktop:mt-2 lg-desktop:text-[18px] mt-1 text-[14px] font-bold leading-[1.4] tracking-[-0.36px]",{variants:{theme:{light:"text-[#080A0F]",dark:"text-[#F5F6F7]"}},defaultVariants:{theme:"light"}}),$=({data:a,onClick:m,className:e})=>{const{theme:o="light",extensions:r,title:g,caption:x,align:p}=a;if(!r?.textLink)return null;const l=r?.link?mt(r.link,`${S}_${V}`):void 0;return T("a",{className:i({"aiui-dark":o==="dark"},"hover:text-brand-0 [&_svg_path]:hover:fill-brand-0 lg-desktop:text-base flex cursor-pointer items-center overflow-hidden text-sm font-[700] leading-[1.4] transition-all duration-[0.4s]",{"text-[#080A0F]":o==="light"},{"text-[#F5F6F7]":o==="dark"},{"justify-center mt-4":p==="center"},{"mt-1 laptop:mt-0":p==="left"},e),...l?{href:l}:{},"data-headless-type-name":`${S}#${V}`,"data-headless-title-desc-button":`${g}#${x}`,...m?{onClick:m}:{},children:[n("div",{className:"truncate whitespace-nowrap",children:r?.textLink}),n("div",{className:"lg-desktop:size-5 size-4",children:n("svg",{xmlns:"http://www.w3.org/2000/svg",width:"100%",height:"100%",viewBox:"0 0 16 16",fill:"none",children:n("path",{d:"M5.52827 3.52864C5.78862 3.26829 6.21063 3.26829 6.47098 3.52864L10.471 7.52864C10.7313 7.78899 10.7313 8.21099 10.471 8.47134L6.47098 12.4713C6.21063 12.7317 5.78862 12.7317 5.52827 12.4713C5.26792 12.211 5.26792 11.789 5.52827 11.5286L9.05692 7.99999L5.52827 4.47134C5.26792 4.21099 5.26792 3.78899 5.52827 3.52864Z",fill:o==="dark"?"#F5F6F7":"#080A0F",className:"transition-all duration-[0.4s]"})})})]})},A=rt.forwardRef(({data:a,className:m,classNames:e,as:o="h2",weight:r="bold",onButtonClick:g,...x},p)=>{const{title:l,titleSize:B=4,caption:y,subtitle:F,content:H,countdown:t,showCountdown:_=!1,theme:f="light",extensions:I,align:d="left"}=a,L=h(null),c=h(null),s=h(null),u=h(null),[j,O]=lt(!0),{ref:U,inView:D}=pt();at(p,()=>L.current);const W=()=>{O(!1)},Z=t?.targetDateTime||t?.targetDate||"",q=t?.targetDateTime_tz,G=t?.labels?{day:t.labels.days||"Day",hour:t.labels.hours||"Hours",minute:t.labels.minutes||"Mins",second:t.labels.seconds||"Secs"}:void 0;return st(()=>{k.registerPlugin(z,R);function J(){if(!c.current)return;const K=c.current?.clientHeight||80;s.current&&s.current.revert(),u.current&&u.current.kill(),s.current=new z(c.current,{type:"words",wordsClass:"word"});const w=s.current.words;k.set(w,{opacity:0}),u.current=R.create({trigger:c.current,start:"bottom bottom-=4%",end:`bottom+=${K*1.5+60}px bottom-=4%`,scrub:!0,invalidateOnRefresh:!0,onUpdate:Q=>{const X=Q.progress,M=w.length||1,Y=.5,b=1/M,C=b*(1-Y),E=(M-1)*C+b,tt=Math.min(1,E>0?X/E:0);w.forEach((et,nt)=>{const it=nt*C,ot=b;let v=(tt-it)/ot;v=Math.max(0,Math.min(1,v)),k.set(et,{opacity:v})})}})}return D&&J(),()=>{s.current&&s.current.revert(),u.current&&u.current.kill()}},[D]),T("div",{...x,id:I?.id,className:i("titleBottom title-box flex items-end justify-between gap-2 pb-6",m,e?.wrapper),ref:L,children:[T("div",{ref:U,className:i("flex-1",e?.container,{"aiui-dark":f==="dark","text-center":d==="center","text-left":d==="left"}),children:[(y||l)&&n(dt,{ref:c,as:o,size:B,html:y||l,weight:r,className:i(ft({theme:f}),e?.title)}),F&&n(P,{html:F,as:"p",className:i(ht({theme:f}),e?.subtitle)}),H&&n(P,{html:H,as:"div",size:4,className:i("title-content text-info-primary desktop:text-base desktop:mt-4 lg-desktop:text-[18px] mt-2 text-[14px] leading-[1.6]",e?.content)}),n($,{data:a,className:i({"laptop:hidden":d==="left"},e?.button)}),_&&t&&j&&n(ct,{endDate:Z,endDate_tz:q,timeLabels:G,showDays:t?.showDays,showHours:t?.showHours,showMinutes:t?.showMinutes,showSeconds:t?.showSeconds,theme:f,onExpire:W,hideWhenExpired:!0,align:d==="center"?"center":"left",className:i("mt-4",e?.countdown)})]}),n($,{data:a,className:i("hidden",{"laptop:flex":d==="left"},e?.button),onClick:g})]})});A.displayName="Title";var Lt=ut(A);export{Lt as default};
1
+ "use client";import{jsx as n,jsxs as T}from"react/jsx-runtime";import rt,{useEffect as st,useRef as g,useImperativeHandle as at,useState as lt}from"react";import{gsap as k}from"gsap";import{SplitText as z}from"gsap/dist/SplitText";import{ScrollTrigger as R}from"gsap/dist/ScrollTrigger";import{cn as i}from"../../helpers/utils.js";import{cva as N}from"class-variance-authority";import{Heading as dt,Text as P,Countdown as ct}from"../../components/index.js";import{withLayout as ut}from"../../shared/Styles.js";import{trackUrlRef as mt}from"../../shared/trackUrlRef.js";import{useInView as pt}from"react-intersection-observer";const S="link",V="title",ft=N("",{variants:{theme:{light:"text-[#080A0F]",dark:"text-[#F5F6F7]"}},defaultVariants:{theme:"light"}}),ht=N("desktop:text-base desktop:mt-2 lg-desktop:text-[18px] mt-1 text-[14px] font-bold leading-[1.4] tracking-[-0.36px]",{variants:{theme:{light:"text-[#080A0F]",dark:"text-[#F5F6F7]"}},defaultVariants:{theme:"light"}}),$=({data:a,onClick:m,className:e})=>{const{theme:o="light",extensions:r,title:p,caption:x,align:f}=a;if(!r?.textLink)return null;const l=r?.link?mt(r.link,`${S}_${V}`):void 0;return T("a",{className:i({"aiui-dark":o==="dark"},"hover:text-brand-0 [&_svg_path]:hover:fill-brand-0 lg-desktop:text-base flex cursor-pointer items-center overflow-hidden text-sm font-[700] leading-[1.4] transition-all duration-[0.4s]",{"text-[#080A0F]":o==="light"},{"text-[#F5F6F7]":o==="dark"},{"justify-center mt-4":f==="center"},{"mt-1 laptop:mt-0":f==="left"},e),...l?{href:l}:{},"data-headless-type-name":`${S}#${V}`,"data-headless-title-desc-button":`${p}#${x}`,...m?{onClick:m}:{},children:[n("div",{className:"truncate whitespace-nowrap",children:r?.textLink}),n("div",{className:"lg-desktop:size-5 size-4",children:n("svg",{xmlns:"http://www.w3.org/2000/svg",width:"100%",height:"100%",viewBox:"0 0 16 16",fill:"none",children:n("path",{d:"M5.52827 3.52864C5.78862 3.26829 6.21063 3.26829 6.47098 3.52864L10.471 7.52864C10.7313 7.78899 10.7313 8.21099 10.471 8.47134L6.47098 12.4713C6.21063 12.7317 5.78862 12.7317 5.52827 12.4713C5.26792 12.211 5.26792 11.789 5.52827 11.5286L9.05692 7.99999L5.52827 4.47134C5.26792 4.21099 5.26792 3.78899 5.52827 3.52864Z",fill:o==="dark"?"#F5F6F7":"#080A0F",className:"transition-all duration-[0.4s]"})})})]})},A=rt.forwardRef(({data:a,className:m,classNames:e,as:o="h2",weight:r="bold",onButtonClick:p,...x},f)=>{const{title:l,titleSize:_=4,caption:y,subtitle:F,content:H,countdown:t,showCountdown:B=!1,theme:h="light",extensions:I,align:d="left"}=a,L=g(null),c=g(null),s=g(null),u=g(null),[j,O]=lt(!0),{ref:U,inView:D}=pt();at(f,()=>L.current);const W=()=>{O(!1)},Z=t?.targetDateTime||t?.targetDate||"",q=t?.targetDateTime_tz,G=t?.labels?{day:t.labels.days||"Day",hour:t.labels.hours||"Hours",minute:t.labels.minutes||"Mins",second:t.labels.seconds||"Secs"}:void 0;return st(()=>{k.registerPlugin(z,R);function J(){if(!c.current)return;const K=c.current?.clientHeight||80;s.current&&s.current.revert(),u.current&&u.current.kill(),s.current=new z(c.current,{type:"words",wordsClass:"word"});const w=s.current.words;k.set(w,{opacity:0}),u.current=R.create({trigger:c.current,start:"bottom bottom-=4%",end:`bottom+=${K*1.5+60}px bottom-=4%`,scrub:!0,invalidateOnRefresh:!0,onUpdate:Q=>{const X=Q.progress,M=w.length||1,Y=.5,b=1/M,C=b*(1-Y),E=(M-1)*C+b,tt=Math.min(1,E>0?X/E:0);w.forEach((et,nt)=>{const it=nt*C,ot=b;let v=(tt-it)/ot;v=Math.max(0,Math.min(1,v)),k.set(et,{opacity:v})})}})}return D&&J(),()=>{s.current&&s.current.revert(),u.current&&u.current.kill()}},[D]),T("div",{...x,id:I?.id,className:i("titleBottom title-box flex items-end justify-between gap-2 pb-6",m,e?.wrapper),ref:L,children:[T("div",{ref:U,className:i("flex-1",e?.container,{"aiui-dark":h==="dark","text-center":d==="center","text-left":d==="left"}),children:[(y||l)&&n(dt,{ref:c,as:o,size:_,html:y||l,weight:r,className:i(ft({theme:h}),e?.title)}),F&&n(P,{html:F,as:"p",className:i(ht({theme:h}),e?.subtitle)}),H&&n(P,{html:H,as:"div",size:4,className:i("title-content text-info-primary desktop:text-base desktop:mt-4 lg-desktop:text-[18px] mt-2 text-[14px] leading-[1.6]",e?.content)}),n($,{data:a,className:i({"laptop:hidden":d==="left"},e?.button),onClick:p}),B&&t&&j&&n(ct,{endDate:Z,endDate_tz:q,timeLabels:G,showDays:t?.showDays,showHours:t?.showHours,showMinutes:t?.showMinutes,showSeconds:t?.showSeconds,theme:h,onExpire:W,hideWhenExpired:!0,align:d==="center"?"center":"left",className:i("mt-4",e?.countdown)})]}),n($,{data:a,className:i("hidden",{"laptop:flex":d==="left"},e?.button),onClick:p})]})});A.displayName="Title";var Lt=ut(A);export{Lt as default};
2
2
  //# sourceMappingURL=index.js.map
package/dist/esm/biz-components/Title/index.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../../src/biz-components/Title/index.tsx"],
4
- "sourcesContent": ["'use client'\nimport React, { useEffect, useRef, useImperativeHandle, useState } from 'react'\nimport { gsap } from 'gsap'\nimport { SplitText } from 'gsap/dist/SplitText'\nimport { ScrollTrigger } from 'gsap/dist/ScrollTrigger'\nimport { cn } from '../../helpers/utils.js'\nimport { cva } from 'class-variance-authority'\nimport { Heading, Text, Countdown, type HeadingProps } from '../../components/index.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport type { TitlePropsBase } from './types.js'\n\nexport interface TitleProps extends TitlePropsBase, Omit<React.HTMLAttributes<HTMLDivElement>, 'className' | 'title'> {}\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { useInView } from 'react-intersection-observer'\n\nconst componentType = 'link'\nconst componentName = 'title'\n\n/**\n * \u6807\u9898\u6837\u5F0F\u53D8\u4F53\n */\nconst titleHeadingVariants = cva('', {\n variants: {\n theme: {\n light: 'text-[#080A0F]',\n dark: 'text-[#F5F6F7]',\n },\n },\n defaultVariants: {\n theme: 'light',\n },\n})\n\n/**\n * \u526F\u6807\u9898\u6837\u5F0F\u53D8\u4F53\n */\nconst subtitleVariants = cva(\n 'desktop:text-base desktop:mt-2 lg-desktop:text-[18px] mt-1 text-[14px] font-bold leading-[1.4] tracking-[-0.36px]',\n {\n variants: {\n theme: {\n light: 'text-[#080A0F]',\n dark: 'text-[#F5F6F7]',\n },\n },\n defaultVariants: {\n theme: 'light',\n },\n }\n)\n\nconst TitleButton = ({\n data,\n onClick,\n className,\n}: {\n data: TitleProps['data']\n onClick?: () => void\n className?: string\n}) => {\n const { theme = 'light', extensions, title, caption, align } = data\n if (!extensions?.textLink) return null\n\n const href = extensions?.link ? trackUrlRef(extensions.link, `${componentType}_${componentName}`) : undefined\n\n return (\n <a\n className={cn(\n { 'aiui-dark': theme === 'dark' },\n 'hover:text-brand-0 [&_svg_path]:hover:fill-brand-0 lg-desktop:text-base flex cursor-pointer items-center overflow-hidden text-sm font-[700] leading-[1.4] transition-all duration-[0.4s]',\n { 'text-[#080A0F]': theme === 'light' },\n { 'text-[#F5F6F7]': theme === 'dark' },\n { 'justify-center mt-4': align === 'center' },\n { 'mt-1 laptop:mt-0': align === 'left' },\n className\n )}\n {...(href ? { href } : {})}\n data-headless-type-name={`${componentType}#${componentName}`}\n data-headless-title-desc-button={`${title}#${caption}`}\n {...(onClick ? { onClick } : {})}\n >\n <div className=\"truncate whitespace-nowrap\">{extensions?.textLink}</div>\n <div className=\"lg-desktop:size-5 size-4\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100%\" height=\"100%\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path\n d=\"M5.52827 3.52864C5.78862 3.26829 6.21063 3.26829 6.47098 3.52864L10.471 7.52864C10.7313 7.78899 10.7313 8.21099 10.471 8.47134L6.47098 12.4713C6.21063 12.7317 5.78862 12.7317 5.52827 12.4713C5.26792 12.211 5.26792 11.789 5.52827 11.5286L9.05692 7.99999L5.52827 4.47134C5.26792 4.21099 5.26792 3.78899 5.52827 3.52864Z\"\n fill={theme === 'dark' ? '#F5F6F7' : '#080A0F'}\n className=\"transition-all duration-[0.4s]\"\n />\n </svg>\n </div>\n </a>\n )\n}\n\nconst Title = React.forwardRef<HTMLDivElement, TitleProps>(\n ({ data, className, classNames, as = 'h2', weight = 'bold', onButtonClick, ...rest }, ref) => {\n const {\n title,\n titleSize = 4,\n caption,\n subtitle,\n content,\n countdown,\n showCountdown = false,\n theme = 'light',\n extensions,\n align = 'left',\n } = data\n const innerRef = useRef<HTMLDivElement>(null)\n const titleRef = useRef<HTMLHeadingElement>(null)\n const splitTextInstance = useRef<SplitText | null>(null)\n const scrollTriggerRef = useRef<ScrollTrigger | null>(null)\n\n // \u63A7\u5236\u5012\u8BA1\u65F6\u663E\u793A\u72B6\u6001\n const [isCountdownVisible, setIsCountdownVisible] = useState(true)\n\n const { ref: inViewRef, inView } = useInView()\n\n useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n\n // \u5012\u8BA1\u65F6\u7ED3\u675F\u56DE\u8C03\n const handleCountdownEnd = () => {\n setIsCountdownVisible(false)\n }\n\n // CMS field mapping: new targetDateTime > legacy targetDate\n const countdownEndDate = countdown?.targetDateTime || countdown?.targetDate || ''\n const countdownTz = countdown?.targetDateTime_tz\n // Label mapping: plural keys (Title CMS format) \u2192 atomic Countdown format\n const countdownLabels = countdown?.labels\n ? {\n day: countdown.labels.days || 'Day',\n hour: countdown.labels.hours || 'Hours',\n minute: countdown.labels.minutes || 'Mins',\n second: countdown.labels.seconds || 'Secs',\n }\n : undefined\n\n useEffect(() => {\n gsap.registerPlugin(SplitText, ScrollTrigger)\n function gsapResize() {\n if (!titleRef.current) return\n const height = titleRef.current?.clientHeight || 80\n if (splitTextInstance.current) {\n splitTextInstance.current.revert()\n }\n if (scrollTriggerRef.current) {\n scrollTriggerRef.current.kill()\n }\n splitTextInstance.current = new SplitText(titleRef.current, {\n type: 'words',\n wordsClass: 'word',\n })\n const words = splitTextInstance.current.words\n gsap.set(words, { opacity: 0 })\n scrollTriggerRef.current = ScrollTrigger.create({\n trigger: titleRef.current,\n start: 'bottom bottom-=4%',\n end: `bottom+=${height * 1.5 + 60}px bottom-=4%`,\n scrub: true,\n invalidateOnRefresh: true,\n onUpdate: (self: any) => {\n const progress = self.progress\n const total = words.length || 1\n const overlap = 0.5\n const interval = 1 / total\n const step = interval * (1 - overlap)\n const lastEnd = (total - 1) * step + interval\n const normalizedProgress = Math.min(1, lastEnd > 0 ? progress / lastEnd : 0)\n words.forEach((word: any, i: number) => {\n const start = i * step\n const width = interval\n let opacity = (normalizedProgress - start) / width\n opacity = Math.max(0, Math.min(1, opacity))\n gsap.set(word, { opacity })\n })\n },\n })\n }\n\n if (inView) {\n gsapResize()\n }\n\n return () => {\n splitTextInstance.current && splitTextInstance.current.revert()\n // ScrollTrigger.getAll().forEach((t: { kill: () => any }) => t.kill())\n scrollTriggerRef.current && scrollTriggerRef.current.kill()\n }\n }, [inView])\n\n return (\n <div\n {...rest}\n id={extensions?.id}\n className={cn(\n 'titleBottom title-box flex items-end justify-between gap-2 pb-6',\n className,\n classNames?.wrapper\n )}\n ref={innerRef}\n >\n <div\n ref={inViewRef}\n className={cn('flex-1', classNames?.container, {\n 'aiui-dark': theme === 'dark',\n 'text-center': align === 'center',\n 'text-left': align === 'left',\n })}\n >\n {(caption || title) && (\n <Heading\n ref={titleRef}\n as={as}\n size={titleSize as HeadingProps['size']}\n html={caption || title}\n weight={weight}\n className={cn(titleHeadingVariants({ theme }), classNames?.title)}\n />\n )}\n {subtitle && (\n <Text html={subtitle} as=\"p\" className={cn(subtitleVariants({ theme }), classNames?.subtitle)} />\n )}\n {content && (\n <Text\n html={content}\n as=\"div\"\n size={4}\n className={cn(\n 'title-content text-info-primary desktop:text-base desktop:mt-4 lg-desktop:text-[18px] mt-2 text-[14px] leading-[1.6]',\n classNames?.content\n )}\n />\n )}\n <TitleButton data={data} className={cn({ 'laptop:hidden': align === 'left' }, classNames?.button)} />\n {showCountdown && countdown && isCountdownVisible && (\n <Countdown\n endDate={countdownEndDate}\n endDate_tz={countdownTz}\n timeLabels={countdownLabels}\n showDays={countdown?.showDays}\n showHours={countdown?.showHours}\n showMinutes={countdown?.showMinutes}\n showSeconds={countdown?.showSeconds}\n theme={theme}\n onExpire={handleCountdownEnd}\n hideWhenExpired={true}\n align={align === 'center' ? 'center' : 'left'}\n className={cn('mt-4', classNames?.countdown)}\n />\n )}\n </div>\n <TitleButton\n data={data}\n className={cn('hidden', { ['laptop:flex']: align === 'left' }, classNames?.button)}\n onClick={onButtonClick}\n />\n </div>\n )\n }\n)\n\nTitle.displayName = 'Title'\n\nexport default withLayout(Title)\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["'use client'\nimport React, { useEffect, useRef, useImperativeHandle, useState } from 'react'\nimport { gsap } from 'gsap'\nimport { SplitText } from 'gsap/dist/SplitText'\nimport { ScrollTrigger } from 'gsap/dist/ScrollTrigger'\nimport { cn } from '../../helpers/utils.js'\nimport { cva } from 'class-variance-authority'\nimport { Heading, Text, Countdown, type HeadingProps } from '../../components/index.js'\nimport { withLayout } from '../../shared/Styles.js'\nimport type { TitlePropsBase } from './types.js'\n\nexport interface TitleProps extends TitlePropsBase, Omit<React.HTMLAttributes<HTMLDivElement>, 'className' | 'title'> {}\nimport { trackUrlRef } from '../../shared/trackUrlRef.js'\nimport { useInView } from 'react-intersection-observer'\n\nconst componentType = 'link'\nconst componentName = 'title'\n\n/**\n * \u6807\u9898\u6837\u5F0F\u53D8\u4F53\n */\nconst titleHeadingVariants = cva('', {\n variants: {\n theme: {\n light: 'text-[#080A0F]',\n dark: 'text-[#F5F6F7]',\n },\n },\n defaultVariants: {\n theme: 'light',\n },\n})\n\n/**\n * \u526F\u6807\u9898\u6837\u5F0F\u53D8\u4F53\n */\nconst subtitleVariants = cva(\n 'desktop:text-base desktop:mt-2 lg-desktop:text-[18px] mt-1 text-[14px] font-bold leading-[1.4] tracking-[-0.36px]',\n {\n variants: {\n theme: {\n light: 'text-[#080A0F]',\n dark: 'text-[#F5F6F7]',\n },\n },\n defaultVariants: {\n theme: 'light',\n },\n }\n)\n\nconst TitleButton = ({\n data,\n onClick,\n className,\n}: {\n data: TitleProps['data']\n onClick?: () => void\n className?: string\n}) => {\n const { theme = 'light', extensions, title, caption, align } = data\n if (!extensions?.textLink) return null\n\n const href = extensions?.link ? trackUrlRef(extensions.link, `${componentType}_${componentName}`) : undefined\n\n return (\n <a\n className={cn(\n { 'aiui-dark': theme === 'dark' },\n 'hover:text-brand-0 [&_svg_path]:hover:fill-brand-0 lg-desktop:text-base flex cursor-pointer items-center overflow-hidden text-sm font-[700] leading-[1.4] transition-all duration-[0.4s]',\n { 'text-[#080A0F]': theme === 'light' },\n { 'text-[#F5F6F7]': theme === 'dark' },\n { 'justify-center mt-4': align === 'center' },\n { 'mt-1 laptop:mt-0': align === 'left' },\n className\n )}\n {...(href ? { href } : {})}\n data-headless-type-name={`${componentType}#${componentName}`}\n data-headless-title-desc-button={`${title}#${caption}`}\n {...(onClick ? { onClick } : {})}\n >\n <div className=\"truncate whitespace-nowrap\">{extensions?.textLink}</div>\n <div className=\"lg-desktop:size-5 size-4\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100%\" height=\"100%\" viewBox=\"0 0 16 16\" fill=\"none\">\n <path\n d=\"M5.52827 3.52864C5.78862 3.26829 6.21063 3.26829 6.47098 3.52864L10.471 7.52864C10.7313 7.78899 10.7313 8.21099 10.471 8.47134L6.47098 12.4713C6.21063 12.7317 5.78862 12.7317 5.52827 12.4713C5.26792 12.211 5.26792 11.789 5.52827 11.5286L9.05692 7.99999L5.52827 4.47134C5.26792 4.21099 5.26792 3.78899 5.52827 3.52864Z\"\n fill={theme === 'dark' ? '#F5F6F7' : '#080A0F'}\n className=\"transition-all duration-[0.4s]\"\n />\n </svg>\n </div>\n </a>\n )\n}\n\nconst Title = React.forwardRef<HTMLDivElement, TitleProps>(\n ({ data, className, classNames, as = 'h2', weight = 'bold', onButtonClick, ...rest }, ref) => {\n const {\n title,\n titleSize = 4,\n caption,\n subtitle,\n content,\n countdown,\n showCountdown = false,\n theme = 'light',\n extensions,\n align = 'left',\n } = data\n const innerRef = useRef<HTMLDivElement>(null)\n const titleRef = useRef<HTMLHeadingElement>(null)\n const splitTextInstance = useRef<SplitText | null>(null)\n const scrollTriggerRef = useRef<ScrollTrigger | null>(null)\n\n // \u63A7\u5236\u5012\u8BA1\u65F6\u663E\u793A\u72B6\u6001\n const [isCountdownVisible, setIsCountdownVisible] = useState(true)\n\n const { ref: inViewRef, inView } = useInView()\n\n useImperativeHandle(ref, () => innerRef.current as HTMLDivElement)\n\n // \u5012\u8BA1\u65F6\u7ED3\u675F\u56DE\u8C03\n const handleCountdownEnd = () => {\n setIsCountdownVisible(false)\n }\n\n // CMS field mapping: new targetDateTime > legacy targetDate\n const countdownEndDate = countdown?.targetDateTime || countdown?.targetDate || ''\n const countdownTz = countdown?.targetDateTime_tz\n // Label mapping: plural keys (Title CMS format) \u2192 atomic Countdown format\n const countdownLabels = countdown?.labels\n ? {\n day: countdown.labels.days || 'Day',\n hour: countdown.labels.hours || 'Hours',\n minute: countdown.labels.minutes || 'Mins',\n second: countdown.labels.seconds || 'Secs',\n }\n : undefined\n\n useEffect(() => {\n gsap.registerPlugin(SplitText, ScrollTrigger)\n function gsapResize() {\n if (!titleRef.current) return\n const height = titleRef.current?.clientHeight || 80\n if (splitTextInstance.current) {\n splitTextInstance.current.revert()\n }\n if (scrollTriggerRef.current) {\n scrollTriggerRef.current.kill()\n }\n splitTextInstance.current = new SplitText(titleRef.current, {\n type: 'words',\n wordsClass: 'word',\n })\n const words = splitTextInstance.current.words\n gsap.set(words, { opacity: 0 })\n scrollTriggerRef.current = ScrollTrigger.create({\n trigger: titleRef.current,\n start: 'bottom bottom-=4%',\n end: `bottom+=${height * 1.5 + 60}px bottom-=4%`,\n scrub: true,\n invalidateOnRefresh: true,\n onUpdate: (self: any) => {\n const progress = self.progress\n const total = words.length || 1\n const overlap = 0.5\n const interval = 1 / total\n const step = interval * (1 - overlap)\n const lastEnd = (total - 1) * step + interval\n const normalizedProgress = Math.min(1, lastEnd > 0 ? progress / lastEnd : 0)\n words.forEach((word: any, i: number) => {\n const start = i * step\n const width = interval\n let opacity = (normalizedProgress - start) / width\n opacity = Math.max(0, Math.min(1, opacity))\n gsap.set(word, { opacity })\n })\n },\n })\n }\n\n if (inView) {\n gsapResize()\n }\n\n return () => {\n splitTextInstance.current && splitTextInstance.current.revert()\n // ScrollTrigger.getAll().forEach((t: { kill: () => any }) => t.kill())\n scrollTriggerRef.current && scrollTriggerRef.current.kill()\n }\n }, [inView])\n\n return (\n <div\n {...rest}\n id={extensions?.id}\n className={cn(\n 'titleBottom title-box flex items-end justify-between gap-2 pb-6',\n className,\n classNames?.wrapper\n )}\n ref={innerRef}\n >\n <div\n ref={inViewRef}\n className={cn('flex-1', classNames?.container, {\n 'aiui-dark': theme === 'dark',\n 'text-center': align === 'center',\n 'text-left': align === 'left',\n })}\n >\n {(caption || title) && (\n <Heading\n ref={titleRef}\n as={as}\n size={titleSize as HeadingProps['size']}\n html={caption || title}\n weight={weight}\n className={cn(titleHeadingVariants({ theme }), classNames?.title)}\n />\n )}\n {subtitle && (\n <Text html={subtitle} as=\"p\" className={cn(subtitleVariants({ theme }), classNames?.subtitle)} />\n )}\n {content && (\n <Text\n html={content}\n as=\"div\"\n size={4}\n className={cn(\n 'title-content text-info-primary desktop:text-base desktop:mt-4 lg-desktop:text-[18px] mt-2 text-[14px] leading-[1.6]',\n classNames?.content\n )}\n />\n )}\n <TitleButton\n data={data}\n className={cn({ 'laptop:hidden': align === 'left' }, classNames?.button)}\n onClick={onButtonClick}\n />\n {showCountdown && countdown && isCountdownVisible && (\n <Countdown\n endDate={countdownEndDate}\n endDate_tz={countdownTz}\n timeLabels={countdownLabels}\n showDays={countdown?.showDays}\n showHours={countdown?.showHours}\n showMinutes={countdown?.showMinutes}\n showSeconds={countdown?.showSeconds}\n theme={theme}\n onExpire={handleCountdownEnd}\n hideWhenExpired={true}\n align={align === 'center' ? 'center' : 'left'}\n className={cn('mt-4', classNames?.countdown)}\n />\n )}\n </div>\n <TitleButton\n data={data}\n className={cn('hidden', { ['laptop:flex']: align === 'left' }, classNames?.button)}\n onClick={onButtonClick}\n />\n </div>\n )\n }\n)\n\nTitle.displayName = 'Title'\n\nexport default withLayout(Title)\n"],
5
+ "mappings": "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",
6
6
  "names": ["jsx", "jsxs", "React", "useEffect", "useRef", "useImperativeHandle", "useState", "gsap", "SplitText", "ScrollTrigger", "cn", "cva", "Heading", "Text", "Countdown", "withLayout", "trackUrlRef", "useInView", "componentType", "componentName", "titleHeadingVariants", "subtitleVariants", "TitleButton", "data", "onClick", "className", "theme", "extensions", "title", "caption", "align", "href", "Title", "classNames", "as", "weight", "onButtonClick", "rest", "ref", "titleSize", "subtitle", "content", "countdown", "showCountdown", "innerRef", "titleRef", "splitTextInstance", "scrollTriggerRef", "isCountdownVisible", "setIsCountdownVisible", "inViewRef", "inView", "handleCountdownEnd", "countdownEndDate", "countdownTz", "countdownLabels", "gsapResize", "height", "words", "self", "progress", "total", "overlap", "interval", "step", "lastEnd", "normalizedProgress", "word", "i", "start", "width", "opacity", "Title_default"]
7
7
  }
package/dist/esm/components/tabs.js CHANGED
@@ -1,2 +1,2 @@
1
- "use client";import{jsx as n}from"react/jsx-runtime";import*as s from"react";import{cn as c}from"../helpers/index.js";import*as o from"@radix-ui/react-tabs";import{cva as b}from"class-variance-authority";const m=s.createContext({align:"left",shape:"square"}),u=s.forwardRef(({children:t,align:e="left",shape:a="default",...i},l)=>n(o.Root,{ref:l,...i,children:n(m.Provider,{value:{align:e,shape:a},children:t})}));u.displayName="Tabs";const P=b("",{variants:{shape:{default:"",rounded:"rounded-tabs",square:"rounded-none"}},defaultVariants:{shape:"default"}}),C=b("",{variants:{shape:{default:"",rounded:"rounded-tabs",square:"rounded-none"}},defaultVariants:{shape:"default"}}),h=s.forwardRef(({className:t,...e},a)=>{const{align:i,shape:l}=s.useContext(m),p=i==="center"?"flex w-full justify-center":i==="right"?"flex w-full justify-end":null,r=n(o.List,{ref:a,className:c("bg-tabs-list-bg flex w-fit max-w-full overflow-x-auto p-1",P({shape:l}),t),style:{scrollbarWidth:"none",msOverflowStyle:"none"},...e});return p?n("div",{className:p,children:r}):r});h.displayName=o.List.displayName;const g=s.forwardRef(({className:t,onClick:e,...a},i)=>{const{shape:l}=s.useContext(m),p=r=>{e?.(r);const f=r?.currentTarget,d=r?.currentTarget?.parentElement;if(f&&d){const R=f.offsetLeft,v=f.offsetWidth,y=d.offsetWidth,x=R-y/2+v/2;d.scrollTo({left:x,behavior:"smooth"})}};return n(o.Trigger,{ref:i,className:c("text-info-primary lg-desktop:text-base disabled:text-btn-secondary-disabled lg-desktop:px-[28px] lg-desktop:pt-[15px] lg-desktop:pb-[14px] shrink-0 px-5 pb-2.5 pt-[11px] text-sm font-bold data-[state=active]:bg-white data-[state=active]:text-[#080A0F]",t,C({shape:l})),onClick:p,...a})});g.displayName=o.Trigger.displayName;const T=s.forwardRef(({className:t,...e},a)=>n(o.Content,{ref:a,className:c(t),...e}));T.displayName=o.Content.displayName;export{u as Tabs,T as TabsContent,h as TabsList,g as TabsTrigger};
1
+ "use client";import{jsx as i}from"react/jsx-runtime";import*as s from"react";import{cn as c}from"../helpers/index.js";import*as o from"@radix-ui/react-tabs";import{cva as b}from"class-variance-authority";const m=s.createContext({align:"left",shape:"square"}),u=s.forwardRef(({children:t,align:e="left",shape:a="default",...r},l)=>i(o.Root,{ref:l,...r,children:i(m.Provider,{value:{align:e,shape:a},children:t})}));u.displayName="Tabs";const P=b("rounded-tabs",{variants:{shape:{default:"",rounded:"rounded-[28px]",square:"rounded-none"}},defaultVariants:{shape:"default"}}),C=b("rounded-tabs",{variants:{shape:{default:"",rounded:"rounded-[28px]",square:"rounded-none"}},defaultVariants:{shape:"default"}}),h=s.forwardRef(({className:t,...e},a)=>{const{align:r,shape:l}=s.useContext(m),p=r==="center"?"flex w-full justify-center":r==="right"?"flex w-full justify-end":null,n=i(o.List,{ref:a,className:c("bg-tabs-list-bg flex w-fit max-w-full overflow-x-auto p-1",P({shape:l}),t),style:{scrollbarWidth:"none",msOverflowStyle:"none"},...e});return p?i("div",{className:p,children:n}):n});h.displayName=o.List.displayName;const g=s.forwardRef(({className:t,onClick:e,...a},r)=>{const{shape:l}=s.useContext(m),p=n=>{e?.(n);const f=n?.currentTarget,d=n?.currentTarget?.parentElement;if(f&&d){const R=f.offsetLeft,v=f.offsetWidth,y=d.offsetWidth,x=R-y/2+v/2;d.scrollTo({left:x,behavior:"smooth"})}};return i(o.Trigger,{ref:r,className:c("text-info-primary lg-desktop:text-base disabled:text-btn-secondary-disabled lg-desktop:px-[28px] lg-desktop:pt-[15px] lg-desktop:pb-[14px] shrink-0 px-5 pb-2.5 pt-[11px] text-sm font-bold data-[state=active]:bg-white data-[state=active]:text-[#080A0F]",t,C({shape:l})),onClick:p,...a})});g.displayName=o.Trigger.displayName;const T=s.forwardRef(({className:t,...e},a)=>i(o.Content,{ref:a,className:c(t),...e}));T.displayName=o.Content.displayName;export{u as Tabs,T as TabsContent,h as TabsList,g as TabsTrigger};
2
2
  //# sourceMappingURL=tabs.js.map
package/dist/esm/components/tabs.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../../src/components/tabs.tsx"],
4
- "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../helpers/index.js'\n\nimport * as TabsPrimitive from '@radix-ui/react-tabs'\nimport { cva } from 'class-variance-authority'\nimport type { Align, Shape } from '../types/props.js'\n\ntype tabShape = Shape | 'default'\n\nconst TabListContext = React.createContext<{\n align?: Align\n shape: tabShape\n}>({\n align: 'left',\n shape: 'square',\n})\n\nconst Tabs = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Root>,\n React.ComponentPropsWithoutRef<typeof TabsPrimitive.Root> & {\n align?: Align\n shape?: tabShape\n }\n>(({ children, align = 'left', shape = 'default', ...props }, ref) => (\n <TabsPrimitive.Root ref={ref} {...props}>\n <TabListContext.Provider value={{ align, shape }}>{children}</TabListContext.Provider>\n </TabsPrimitive.Root>\n))\nTabs.displayName = 'Tabs'\n\nconst tabsListVariants = cva('', {\n variants: {\n shape: {\n default: '',\n rounded: 'rounded-tabs',\n square: 'rounded-none',\n },\n },\n defaultVariants: {\n shape: 'default',\n },\n})\n\nconst tabsTriggerVariants = cva('', {\n variants: {\n shape: {\n default: '',\n rounded: 'rounded-tabs',\n square: 'rounded-none',\n },\n },\n defaultVariants: {\n shape: 'default',\n },\n})\nconst TabsList = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.List>,\n React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>\n>(({ className, ...props }, ref) => {\n const { align: alignFromParent, shape: shapeFromParent } = React.useContext(TabListContext)\n\n const wrapperClass =\n alignFromParent === 'center'\n ? 'flex w-full justify-center'\n : alignFromParent === 'right'\n ? 'flex w-full justify-end'\n : null\n\n const list = (\n <TabsPrimitive.List\n ref={ref}\n className={cn(\n 'bg-tabs-list-bg flex w-fit max-w-full overflow-x-auto p-1',\n tabsListVariants({ shape: shapeFromParent }),\n className\n )}\n style={{\n scrollbarWidth: 'none',\n msOverflowStyle: 'none',\n }}\n {...props}\n />\n )\n\n return wrapperClass ? <div className={wrapperClass}>{list}</div> : list\n})\nTabsList.displayName = TabsPrimitive.List.displayName\n\nconst TabsTrigger = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Trigger>,\n React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>\n>(({ className, onClick, ...props }, ref) => {\n const { shape: shapeFromParent } = React.useContext(TabListContext)\n const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n onClick?.(e)\n const tabElement = e?.currentTarget\n const container = e?.currentTarget?.parentElement\n if (tabElement && container) {\n const tabLeft = tabElement.offsetLeft\n const tabWidth = tabElement.offsetWidth\n const containerWidth = container.offsetWidth\n const scrollTo = tabLeft - containerWidth / 2 + tabWidth / 2\n container.scrollTo({\n left: scrollTo,\n behavior: 'smooth',\n })\n }\n }\n return (\n <TabsPrimitive.Trigger\n ref={ref}\n className={cn(\n 'text-info-primary lg-desktop:text-base disabled:text-btn-secondary-disabled lg-desktop:px-[28px] lg-desktop:pt-[15px] lg-desktop:pb-[14px] shrink-0 px-5 pb-2.5 pt-[11px] text-sm font-bold data-[state=active]:bg-white data-[state=active]:text-[#080A0F]',\n className,\n tabsTriggerVariants({\n shape: shapeFromParent,\n })\n )}\n onClick={handleClick}\n {...props}\n />\n )\n})\nTabsTrigger.displayName = TabsPrimitive.Trigger.displayName\n\nconst TabsContent = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>\n>(({ className, ...props }, ref) => <TabsPrimitive.Content ref={ref} className={cn(className)} {...props} />)\nTabsContent.displayName = TabsPrimitive.Content.displayName\n\nexport { Tabs, TabsList, TabsTrigger, TabsContent }\n"],
5
- "mappings": "aA2BI,cAAAA,MAAA,oBAzBJ,UAAYC,MAAW,QACvB,OAAS,MAAAC,MAAU,sBAEnB,UAAYC,MAAmB,uBAC/B,OAAS,OAAAC,MAAW,2BAKpB,MAAMC,EAAiBJ,EAAM,cAG1B,CACD,MAAO,OACP,MAAO,QACT,CAAC,EAEKK,EAAOL,EAAM,WAMjB,CAAC,CAAE,SAAAM,EAAU,MAAAC,EAAQ,OAAQ,MAAAC,EAAQ,UAAW,GAAGC,CAAM,EAAGC,IAC5DX,EAACG,EAAc,KAAd,CAAmB,IAAKQ,EAAM,GAAGD,EAChC,SAAAV,EAACK,EAAe,SAAf,CAAwB,MAAO,CAAE,MAAAG,EAAO,MAAAC,CAAM,EAAI,SAAAF,EAAS,EAC9D,CACD,EACDD,EAAK,YAAc,OAEnB,MAAMM,EAAmBR,EAAI,GAAI,CAC/B,SAAU,CACR,MAAO,CACL,QAAS,GACT,QAAS,eACT,OAAQ,cACV,CACF,EACA,gBAAiB,CACf,MAAO,SACT,CACF,CAAC,EAEKS,EAAsBT,EAAI,GAAI,CAClC,SAAU,CACR,MAAO,CACL,QAAS,GACT,QAAS,eACT,OAAQ,cACV,CACF,EACA,gBAAiB,CACf,MAAO,SACT,CACF,CAAC,EACKU,EAAWb,EAAM,WAGrB,CAAC,CAAE,UAAAc,EAAW,GAAGL,CAAM,EAAGC,IAAQ,CAClC,KAAM,CAAE,MAAOK,EAAiB,MAAOC,CAAgB,EAAIhB,EAAM,WAAWI,CAAc,EAEpFa,EACJF,IAAoB,SAChB,6BACAA,IAAoB,QAClB,0BACA,KAEFG,EACJnB,EAACG,EAAc,KAAd,CACC,IAAKQ,EACL,UAAWT,EACT,4DACAU,EAAiB,CAAE,MAAOK,CAAgB,CAAC,EAC3CF,CACF,EACA,MAAO,CACL,eAAgB,OAChB,gBAAiB,MACnB,EACC,GAAGL,EACN,EAGF,OAAOQ,EAAelB,EAAC,OAAI,UAAWkB,EAAe,SAAAC,EAAK,EAASA,CACrE,CAAC,EACDL,EAAS,YAAcX,EAAc,KAAK,YAE1C,MAAMiB,EAAcnB,EAAM,WAGxB,CAAC,CAAE,UAAAc,EAAW,QAAAM,EAAS,GAAGX,CAAM,EAAGC,IAAQ,CAC3C,KAAM,CAAE,MAAOM,CAAgB,EAAIhB,EAAM,WAAWI,CAAc,EAC5DiB,EAAeC,GAA2C,CAC9DF,IAAUE,CAAC,EACX,MAAMC,EAAaD,GAAG,cAChBE,EAAYF,GAAG,eAAe,cACpC,GAAIC,GAAcC,EAAW,CAC3B,MAAMC,EAAUF,EAAW,WACrBG,EAAWH,EAAW,YACtBI,EAAiBH,EAAU,YAC3BI,EAAWH,EAAUE,EAAiB,EAAID,EAAW,EAC3DF,EAAU,SAAS,CACjB,KAAMI,EACN,SAAU,QACZ,CAAC,CACH,CACF,EACA,OACE7B,EAACG,EAAc,QAAd,CACC,IAAKQ,EACL,UAAWT,EACT,8PACAa,EACAF,EAAoB,CAClB,MAAOI,CACT,CAAC,CACH,EACA,QAASK,EACR,GAAGZ,EACN,CAEJ,CAAC,EACDU,EAAY,YAAcjB,EAAc,QAAQ,YAEhD,MAAM2B,EAAc7B,EAAM,WAGxB,CAAC,CAAE,UAAAc,EAAW,GAAGL,CAAM,EAAGC,IAAQX,EAACG,EAAc,QAAd,CAAsB,IAAKQ,EAAK,UAAWT,EAAGa,CAAS,EAAI,GAAGL,EAAO,CAAE,EAC5GoB,EAAY,YAAc3B,EAAc,QAAQ",
4
+ "sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../helpers/index.js'\n\nimport * as TabsPrimitive from '@radix-ui/react-tabs'\nimport { cva } from 'class-variance-authority'\nimport type { Align, Shape } from '../types/props.js'\n\ntype tabShape = Shape | 'default'\n\nconst TabListContext = React.createContext<{\n align?: Align\n shape: tabShape\n}>({\n align: 'left',\n shape: 'square',\n})\n\nconst Tabs = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Root>,\n React.ComponentPropsWithoutRef<typeof TabsPrimitive.Root> & {\n align?: Align\n shape?: tabShape\n }\n>(({ children, align = 'left', shape = 'default', ...props }, ref) => (\n <TabsPrimitive.Root ref={ref} {...props}>\n <TabListContext.Provider value={{ align, shape }}>{children}</TabListContext.Provider>\n </TabsPrimitive.Root>\n))\nTabs.displayName = 'Tabs'\n\nconst tabsListVariants = cva('rounded-tabs', {\n variants: {\n shape: {\n default: '',\n rounded: 'rounded-[28px]',\n square: 'rounded-none',\n },\n },\n defaultVariants: {\n shape: 'default',\n },\n})\n\nconst tabsTriggerVariants = cva('rounded-tabs', {\n variants: {\n shape: {\n default: '',\n rounded: 'rounded-[28px]',\n square: 'rounded-none',\n },\n },\n defaultVariants: {\n shape: 'default',\n },\n})\nconst TabsList = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.List>,\n React.ComponentPropsWithoutRef<typeof TabsPrimitive.List>\n>(({ className, ...props }, ref) => {\n const { align: alignFromParent, shape: shapeFromParent } = React.useContext(TabListContext)\n\n const wrapperClass =\n alignFromParent === 'center'\n ? 'flex w-full justify-center'\n : alignFromParent === 'right'\n ? 'flex w-full justify-end'\n : null\n\n const list = (\n <TabsPrimitive.List\n ref={ref}\n className={cn(\n 'bg-tabs-list-bg flex w-fit max-w-full overflow-x-auto p-1',\n tabsListVariants({ shape: shapeFromParent }),\n className\n )}\n style={{\n scrollbarWidth: 'none',\n msOverflowStyle: 'none',\n }}\n {...props}\n />\n )\n\n return wrapperClass ? <div className={wrapperClass}>{list}</div> : list\n})\nTabsList.displayName = TabsPrimitive.List.displayName\n\nconst TabsTrigger = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Trigger>,\n React.ComponentPropsWithoutRef<typeof TabsPrimitive.Trigger>\n>(({ className, onClick, ...props }, ref) => {\n const { shape: shapeFromParent } = React.useContext(TabListContext)\n const handleClick = (e: React.MouseEvent<HTMLButtonElement>) => {\n onClick?.(e)\n const tabElement = e?.currentTarget\n const container = e?.currentTarget?.parentElement\n if (tabElement && container) {\n const tabLeft = tabElement.offsetLeft\n const tabWidth = tabElement.offsetWidth\n const containerWidth = container.offsetWidth\n const scrollTo = tabLeft - containerWidth / 2 + tabWidth / 2\n container.scrollTo({\n left: scrollTo,\n behavior: 'smooth',\n })\n }\n }\n return (\n <TabsPrimitive.Trigger\n ref={ref}\n className={cn(\n 'text-info-primary lg-desktop:text-base disabled:text-btn-secondary-disabled lg-desktop:px-[28px] lg-desktop:pt-[15px] lg-desktop:pb-[14px] shrink-0 px-5 pb-2.5 pt-[11px] text-sm font-bold data-[state=active]:bg-white data-[state=active]:text-[#080A0F]',\n className,\n tabsTriggerVariants({\n shape: shapeFromParent,\n })\n )}\n onClick={handleClick}\n {...props}\n />\n )\n})\nTabsTrigger.displayName = TabsPrimitive.Trigger.displayName\n\nconst TabsContent = React.forwardRef<\n React.ElementRef<typeof TabsPrimitive.Content>,\n React.ComponentPropsWithoutRef<typeof TabsPrimitive.Content>\n>(({ className, ...props }, ref) => <TabsPrimitive.Content ref={ref} className={cn(className)} {...props} />)\nTabsContent.displayName = TabsPrimitive.Content.displayName\n\nexport { Tabs, TabsList, TabsTrigger, TabsContent }\n"],
5
+ "mappings": "aA2BI,cAAAA,MAAA,oBAzBJ,UAAYC,MAAW,QACvB,OAAS,MAAAC,MAAU,sBAEnB,UAAYC,MAAmB,uBAC/B,OAAS,OAAAC,MAAW,2BAKpB,MAAMC,EAAiBJ,EAAM,cAG1B,CACD,MAAO,OACP,MAAO,QACT,CAAC,EAEKK,EAAOL,EAAM,WAMjB,CAAC,CAAE,SAAAM,EAAU,MAAAC,EAAQ,OAAQ,MAAAC,EAAQ,UAAW,GAAGC,CAAM,EAAGC,IAC5DX,EAACG,EAAc,KAAd,CAAmB,IAAKQ,EAAM,GAAGD,EAChC,SAAAV,EAACK,EAAe,SAAf,CAAwB,MAAO,CAAE,MAAAG,EAAO,MAAAC,CAAM,EAAI,SAAAF,EAAS,EAC9D,CACD,EACDD,EAAK,YAAc,OAEnB,MAAMM,EAAmBR,EAAI,eAAgB,CAC3C,SAAU,CACR,MAAO,CACL,QAAS,GACT,QAAS,iBACT,OAAQ,cACV,CACF,EACA,gBAAiB,CACf,MAAO,SACT,CACF,CAAC,EAEKS,EAAsBT,EAAI,eAAgB,CAC9C,SAAU,CACR,MAAO,CACL,QAAS,GACT,QAAS,iBACT,OAAQ,cACV,CACF,EACA,gBAAiB,CACf,MAAO,SACT,CACF,CAAC,EACKU,EAAWb,EAAM,WAGrB,CAAC,CAAE,UAAAc,EAAW,GAAGL,CAAM,EAAGC,IAAQ,CAClC,KAAM,CAAE,MAAOK,EAAiB,MAAOC,CAAgB,EAAIhB,EAAM,WAAWI,CAAc,EAEpFa,EACJF,IAAoB,SAChB,6BACAA,IAAoB,QAClB,0BACA,KAEFG,EACJnB,EAACG,EAAc,KAAd,CACC,IAAKQ,EACL,UAAWT,EACT,4DACAU,EAAiB,CAAE,MAAOK,CAAgB,CAAC,EAC3CF,CACF,EACA,MAAO,CACL,eAAgB,OAChB,gBAAiB,MACnB,EACC,GAAGL,EACN,EAGF,OAAOQ,EAAelB,EAAC,OAAI,UAAWkB,EAAe,SAAAC,EAAK,EAASA,CACrE,CAAC,EACDL,EAAS,YAAcX,EAAc,KAAK,YAE1C,MAAMiB,EAAcnB,EAAM,WAGxB,CAAC,CAAE,UAAAc,EAAW,QAAAM,EAAS,GAAGX,CAAM,EAAGC,IAAQ,CAC3C,KAAM,CAAE,MAAOM,CAAgB,EAAIhB,EAAM,WAAWI,CAAc,EAC5DiB,EAAeC,GAA2C,CAC9DF,IAAUE,CAAC,EACX,MAAMC,EAAaD,GAAG,cAChBE,EAAYF,GAAG,eAAe,cACpC,GAAIC,GAAcC,EAAW,CAC3B,MAAMC,EAAUF,EAAW,WACrBG,EAAWH,EAAW,YACtBI,EAAiBH,EAAU,YAC3BI,EAAWH,EAAUE,EAAiB,EAAID,EAAW,EAC3DF,EAAU,SAAS,CACjB,KAAMI,EACN,SAAU,QACZ,CAAC,CACH,CACF,EACA,OACE7B,EAACG,EAAc,QAAd,CACC,IAAKQ,EACL,UAAWT,EACT,8PACAa,EACAF,EAAoB,CAClB,MAAOI,CACT,CAAC,CACH,EACA,QAASK,EACR,GAAGZ,EACN,CAEJ,CAAC,EACDU,EAAY,YAAcjB,EAAc,QAAQ,YAEhD,MAAM2B,EAAc7B,EAAM,WAGxB,CAAC,CAAE,UAAAc,EAAW,GAAGL,CAAM,EAAGC,IAAQX,EAACG,EAAc,QAAd,CAAsB,IAAKQ,EAAK,UAAWT,EAAGa,CAAS,EAAI,GAAGL,EAAO,CAAE,EAC5GoB,EAAY,YAAc3B,EAAc,QAAQ",
6
6
  "names": ["jsx", "React", "cn", "TabsPrimitive", "cva", "TabListContext", "Tabs", "children", "align", "shape", "props", "ref", "tabsListVariants", "tabsTriggerVariants", "TabsList", "className", "alignFromParent", "shapeFromParent", "wrapperClass", "list", "TabsTrigger", "onClick", "handleClick", "e", "tabElement", "container", "tabLeft", "tabWidth", "containerWidth", "scrollTo", "TabsContent"]
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@anker-in/headless-ui",
3
- "version": "1.3.15",
3
+ "version": "1.3.16",
4
4
  "type": "commonjs",
5
5
  "main": "./dist/cjs/index.js",
6
6
  "types": "./dist/cjs/index.d.ts",
package/style.css CHANGED
@@ -2445,6 +2445,9 @@ video {
2445
2445
  .rounded-\[16px\] {
2446
2446
  border-radius: 16px;
2447
2447
  }
2448
+ .rounded-\[28px\] {
2449
+ border-radius: 28px;
2450
+ }
2448
2451
  .rounded-\[2px\] {
2449
2452
  border-radius: 2px;
2450
2453
  }