@anker-in/headless-ui 1.1.55 → 1.1.57
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/dist/cjs/biz-components/ActiveShelf/ProductCard.d.ts +1 -1
- package/dist/cjs/biz-components/ActiveShelf/ProductCard.js +1 -1
- package/dist/cjs/biz-components/ActiveShelf/ProductCard.js.map +2 -2
- package/dist/cjs/biz-components/ActiveShelf/index.js +1 -1
- package/dist/cjs/biz-components/ActiveShelf/index.js.map +2 -2
- package/dist/cjs/biz-components/BuyOneGetOneShelf/FreeGiftItem.js +1 -1
- package/dist/cjs/biz-components/BuyOneGetOneShelf/FreeGiftItem.js.map +2 -2
- package/dist/cjs/biz-components/BuyOneGetOneShelf/ProductCard.js +1 -1
- package/dist/cjs/biz-components/BuyOneGetOneShelf/ProductCard.js.map +2 -2
- package/dist/cjs/biz-components/BuyOneGetOneShelf/index.js +1 -1
- package/dist/cjs/biz-components/BuyOneGetOneShelf/index.js.map +2 -2
- package/dist/cjs/biz-components/Category/SwiperCategory.d.ts +2 -0
- package/dist/cjs/biz-components/Category/SwiperCategory.js +1 -1
- package/dist/cjs/biz-components/Category/SwiperCategory.js.map +3 -3
- package/dist/cjs/biz-components/Category/index.js +1 -1
- package/dist/cjs/biz-components/Category/index.js.map +3 -3
- package/dist/cjs/biz-components/CreditsShelf/ProductCard.d.ts +41 -0
- package/dist/cjs/biz-components/CreditsShelf/ProductCard.js +2 -0
- package/dist/cjs/biz-components/CreditsShelf/ProductCard.js.map +7 -0
- package/dist/cjs/biz-components/CreditsShelf/ProductsList.d.ts +20 -0
- package/dist/cjs/biz-components/CreditsShelf/ProductsList.js +2 -0
- package/dist/cjs/biz-components/CreditsShelf/ProductsList.js.map +7 -0
- package/dist/cjs/biz-components/CreditsShelf/Root.d.ts +43 -0
- package/dist/cjs/biz-components/CreditsShelf/Root.js +2 -0
- package/dist/cjs/biz-components/CreditsShelf/Root.js.map +7 -0
- package/dist/cjs/biz-components/CreditsShelf/context.d.ts +40 -0
- package/dist/cjs/biz-components/CreditsShelf/context.js +2 -0
- package/dist/cjs/biz-components/CreditsShelf/context.js.map +7 -0
- package/dist/cjs/biz-components/CreditsShelf/index.d.ts +15 -0
- package/dist/cjs/biz-components/CreditsShelf/index.js +2 -0
- package/dist/cjs/biz-components/CreditsShelf/index.js.map +7 -0
- package/dist/cjs/biz-components/CreditsShelf/types.d.ts +73 -0
- package/dist/cjs/biz-components/CreditsShelf/types.js +2 -0
- package/dist/cjs/biz-components/CreditsShelf/types.js.map +7 -0
- package/dist/cjs/biz-components/GiftBox/index.js +1 -1
- package/dist/cjs/biz-components/GiftBox/index.js.map +2 -2
- package/dist/cjs/biz-components/HeroBanner/HeroBanner.js +1 -1
- package/dist/cjs/biz-components/HeroBanner/HeroBanner.js.map +3 -3
- package/dist/cjs/biz-components/ImageOverlayShelf/ProductCard.js +1 -1
- package/dist/cjs/biz-components/ImageOverlayShelf/ProductCard.js.map +2 -2
- package/dist/cjs/biz-components/MediaPlayerBase/index.js +1 -1
- package/dist/cjs/biz-components/MediaPlayerBase/index.js.map +2 -2
- package/dist/cjs/biz-components/MediaPlayerSticky/index.js +1 -1
- package/dist/cjs/biz-components/MediaPlayerSticky/index.js.map +2 -2
- package/dist/cjs/biz-components/MediaSceneSwitcher/MediaSceneSwitcher.js +2 -2
- package/dist/cjs/biz-components/MediaSceneSwitcher/MediaSceneSwitcher.js.map +2 -2
- package/dist/cjs/biz-components/MediaSceneSwitcher/types.d.ts +1 -0
- package/dist/cjs/biz-components/MediaSceneSwitcher/types.js +1 -1
- package/dist/cjs/biz-components/MediaSceneSwitcher/types.js.map +1 -1
- package/dist/cjs/biz-components/MediaShelf/ProductCard.js +1 -1
- package/dist/cjs/biz-components/MediaShelf/ProductCard.js.map +2 -2
- package/dist/cjs/biz-components/MiniCart/CircleProgress.d.ts +38 -0
- package/dist/cjs/biz-components/MiniCart/CircleProgress.js +2 -0
- package/dist/cjs/biz-components/MiniCart/CircleProgress.js.map +7 -0
- package/dist/cjs/biz-components/MiniCart/MiniCartDialog.js +1 -1
- package/dist/cjs/biz-components/MiniCart/MiniCartDialog.js.map +1 -1
- package/dist/cjs/biz-components/MiniCart/index.d.ts +31 -1
- package/dist/cjs/biz-components/MiniCart/index.js +1 -1
- package/dist/cjs/biz-components/MiniCart/index.js.map +3 -3
- package/dist/cjs/biz-components/SceneShelf/Footer.d.ts +21 -0
- package/dist/cjs/biz-components/SceneShelf/Footer.js +2 -0
- package/dist/cjs/biz-components/SceneShelf/Footer.js.map +7 -0
- package/dist/cjs/biz-components/SceneShelf/ProductCard.d.ts +23 -0
- package/dist/cjs/biz-components/SceneShelf/ProductCard.js +2 -0
- package/dist/cjs/biz-components/SceneShelf/ProductCard.js.map +7 -0
- package/dist/cjs/biz-components/SceneShelf/ProductsPanel.d.ts +26 -0
- package/dist/cjs/biz-components/SceneShelf/ProductsPanel.js +2 -0
- package/dist/cjs/biz-components/SceneShelf/ProductsPanel.js.map +7 -0
- package/dist/cjs/biz-components/SceneShelf/Root.d.ts +20 -0
- package/dist/cjs/biz-components/SceneShelf/Root.js +2 -0
- package/dist/cjs/biz-components/SceneShelf/Root.js.map +7 -0
- package/dist/cjs/biz-components/SceneShelf/Scene.d.ts +38 -0
- package/dist/cjs/biz-components/SceneShelf/Scene.js +2 -0
- package/dist/cjs/biz-components/SceneShelf/Scene.js.map +7 -0
- package/dist/cjs/biz-components/SceneShelf/SceneImage.d.ts +14 -0
- package/dist/cjs/biz-components/SceneShelf/SceneImage.js +2 -0
- package/dist/cjs/biz-components/SceneShelf/SceneImage.js.map +7 -0
- package/dist/cjs/biz-components/SceneShelf/context.d.ts +40 -0
- package/dist/cjs/biz-components/SceneShelf/context.js +2 -0
- package/dist/cjs/biz-components/SceneShelf/context.js.map +7 -0
- package/dist/cjs/biz-components/SceneShelf/index.d.ts +21 -0
- package/dist/cjs/biz-components/SceneShelf/index.js +2 -0
- package/dist/cjs/biz-components/SceneShelf/index.js.map +7 -0
- package/dist/cjs/biz-components/SceneShelf/types.d.ts +51 -0
- package/dist/cjs/biz-components/SceneShelf/types.js +2 -0
- package/dist/cjs/biz-components/SceneShelf/types.js.map +7 -0
- package/dist/cjs/biz-components/SecondaryBanner/index.d.ts +25 -0
- package/dist/cjs/biz-components/SecondaryBanner/index.js +1 -1
- package/dist/cjs/biz-components/SecondaryBanner/index.js.map +3 -3
- package/dist/cjs/biz-components/index.d.ts +8 -1
- package/dist/cjs/biz-components/index.js +1 -1
- package/dist/cjs/biz-components/index.js.map +3 -3
- package/dist/cjs/components/Countdown.js +1 -1
- package/dist/cjs/components/Countdown.js.map +2 -2
- package/dist/cjs/components/button.js +1 -1
- package/dist/cjs/components/button.js.map +2 -2
- package/dist/cjs/components/checkbox.js +1 -1
- package/dist/cjs/components/checkbox.js.map +2 -2
- package/dist/cjs/components/text.js +1 -1
- package/dist/cjs/components/text.js.map +2 -2
- package/dist/cjs/stories/decorators/dataPropsDecorator.d.ts +16 -0
- package/dist/cjs/stories/decorators/dataPropsDecorator.js +2 -0
- package/dist/cjs/stories/decorators/dataPropsDecorator.js.map +7 -0
- package/dist/esm/biz-components/ActiveShelf/ProductCard.d.ts +1 -1
- package/dist/esm/biz-components/ActiveShelf/ProductCard.js +1 -1
- package/dist/esm/biz-components/ActiveShelf/ProductCard.js.map +2 -2
- package/dist/esm/biz-components/ActiveShelf/index.js +1 -1
- package/dist/esm/biz-components/ActiveShelf/index.js.map +2 -2
- package/dist/esm/biz-components/BuyOneGetOneShelf/FreeGiftItem.js +1 -1
- package/dist/esm/biz-components/BuyOneGetOneShelf/FreeGiftItem.js.map +2 -2
- package/dist/esm/biz-components/BuyOneGetOneShelf/ProductCard.js +1 -1
- package/dist/esm/biz-components/BuyOneGetOneShelf/ProductCard.js.map +2 -2
- package/dist/esm/biz-components/BuyOneGetOneShelf/index.js +1 -1
- package/dist/esm/biz-components/BuyOneGetOneShelf/index.js.map +2 -2
- package/dist/esm/biz-components/Category/SwiperCategory.d.ts +2 -0
- package/dist/esm/biz-components/Category/SwiperCategory.js +1 -1
- package/dist/esm/biz-components/Category/SwiperCategory.js.map +3 -3
- package/dist/esm/biz-components/Category/index.js +1 -1
- package/dist/esm/biz-components/Category/index.js.map +3 -3
- package/dist/esm/biz-components/CreditsShelf/ProductCard.d.ts +41 -0
- package/dist/esm/biz-components/CreditsShelf/ProductCard.js +2 -0
- package/dist/esm/biz-components/CreditsShelf/ProductCard.js.map +7 -0
- package/dist/esm/biz-components/CreditsShelf/ProductsList.d.ts +20 -0
- package/dist/esm/biz-components/CreditsShelf/ProductsList.js +2 -0
- package/dist/esm/biz-components/CreditsShelf/ProductsList.js.map +7 -0
- package/dist/esm/biz-components/CreditsShelf/Root.d.ts +43 -0
- package/dist/esm/biz-components/CreditsShelf/Root.js +2 -0
- package/dist/esm/biz-components/CreditsShelf/Root.js.map +7 -0
- package/dist/esm/biz-components/CreditsShelf/context.d.ts +40 -0
- package/dist/esm/biz-components/CreditsShelf/context.js +2 -0
- package/dist/esm/biz-components/CreditsShelf/context.js.map +7 -0
- package/dist/esm/biz-components/CreditsShelf/index.d.ts +15 -0
- package/dist/esm/biz-components/CreditsShelf/index.js +2 -0
- package/dist/esm/biz-components/CreditsShelf/index.js.map +7 -0
- package/dist/esm/biz-components/CreditsShelf/types.d.ts +73 -0
- package/dist/esm/biz-components/CreditsShelf/types.js +2 -0
- package/dist/esm/biz-components/CreditsShelf/types.js.map +7 -0
- package/dist/esm/biz-components/GiftBox/index.js +1 -1
- package/dist/esm/biz-components/GiftBox/index.js.map +2 -2
- package/dist/esm/biz-components/HeroBanner/HeroBanner.js +1 -1
- package/dist/esm/biz-components/HeroBanner/HeroBanner.js.map +3 -3
- package/dist/esm/biz-components/ImageOverlayShelf/ProductCard.js +1 -1
- package/dist/esm/biz-components/ImageOverlayShelf/ProductCard.js.map +2 -2
- package/dist/esm/biz-components/MediaPlayerBase/index.js +1 -1
- package/dist/esm/biz-components/MediaPlayerBase/index.js.map +2 -2
- package/dist/esm/biz-components/MediaPlayerSticky/index.js +1 -1
- package/dist/esm/biz-components/MediaPlayerSticky/index.js.map +2 -2
- package/dist/esm/biz-components/MediaSceneSwitcher/MediaSceneSwitcher.js +2 -2
- package/dist/esm/biz-components/MediaSceneSwitcher/MediaSceneSwitcher.js.map +2 -2
- package/dist/esm/biz-components/MediaSceneSwitcher/types.d.ts +1 -0
- package/dist/esm/biz-components/MediaShelf/ProductCard.js +1 -1
- package/dist/esm/biz-components/MediaShelf/ProductCard.js.map +2 -2
- package/dist/esm/biz-components/MiniCart/CircleProgress.d.ts +38 -0
- package/dist/esm/biz-components/MiniCart/CircleProgress.js +2 -0
- package/dist/esm/biz-components/MiniCart/CircleProgress.js.map +7 -0
- package/dist/esm/biz-components/MiniCart/MiniCartDialog.js +1 -1
- package/dist/esm/biz-components/MiniCart/MiniCartDialog.js.map +1 -1
- package/dist/esm/biz-components/MiniCart/index.d.ts +31 -1
- package/dist/esm/biz-components/MiniCart/index.js +1 -1
- package/dist/esm/biz-components/MiniCart/index.js.map +3 -3
- package/dist/esm/biz-components/SceneShelf/Footer.d.ts +21 -0
- package/dist/esm/biz-components/SceneShelf/Footer.js +2 -0
- package/dist/esm/biz-components/SceneShelf/Footer.js.map +7 -0
- package/dist/esm/biz-components/SceneShelf/ProductCard.d.ts +23 -0
- package/dist/esm/biz-components/SceneShelf/ProductCard.js +2 -0
- package/dist/esm/biz-components/SceneShelf/ProductCard.js.map +7 -0
- package/dist/esm/biz-components/SceneShelf/ProductsPanel.d.ts +26 -0
- package/dist/esm/biz-components/SceneShelf/ProductsPanel.js +2 -0
- package/dist/esm/biz-components/SceneShelf/ProductsPanel.js.map +7 -0
- package/dist/esm/biz-components/SceneShelf/Root.d.ts +20 -0
- package/dist/esm/biz-components/SceneShelf/Root.js +2 -0
- package/dist/esm/biz-components/SceneShelf/Root.js.map +7 -0
- package/dist/esm/biz-components/SceneShelf/Scene.d.ts +38 -0
- package/dist/esm/biz-components/SceneShelf/Scene.js +2 -0
- package/dist/esm/biz-components/SceneShelf/Scene.js.map +7 -0
- package/dist/esm/biz-components/SceneShelf/SceneImage.d.ts +14 -0
- package/dist/esm/biz-components/SceneShelf/SceneImage.js +2 -0
- package/dist/esm/biz-components/SceneShelf/SceneImage.js.map +7 -0
- package/dist/esm/biz-components/SceneShelf/context.d.ts +40 -0
- package/dist/esm/biz-components/SceneShelf/context.js +2 -0
- package/dist/esm/biz-components/SceneShelf/context.js.map +7 -0
- package/dist/esm/biz-components/SceneShelf/index.d.ts +21 -0
- package/dist/esm/biz-components/SceneShelf/index.js +2 -0
- package/dist/esm/biz-components/SceneShelf/index.js.map +7 -0
- package/dist/esm/biz-components/SceneShelf/types.d.ts +51 -0
- package/dist/esm/biz-components/SceneShelf/types.js +2 -0
- package/dist/esm/biz-components/SceneShelf/types.js.map +7 -0
- package/dist/esm/biz-components/SecondaryBanner/index.d.ts +25 -0
- package/dist/esm/biz-components/SecondaryBanner/index.js +1 -1
- package/dist/esm/biz-components/SecondaryBanner/index.js.map +3 -3
- package/dist/esm/biz-components/index.d.ts +8 -1
- package/dist/esm/biz-components/index.js +1 -1
- package/dist/esm/biz-components/index.js.map +3 -3
- package/dist/esm/components/Countdown.js +1 -1
- package/dist/esm/components/Countdown.js.map +2 -2
- package/dist/esm/components/button.js +1 -1
- package/dist/esm/components/button.js.map +2 -2
- package/dist/esm/components/checkbox.js +1 -1
- package/dist/esm/components/checkbox.js.map +2 -2
- package/dist/esm/components/text.js +1 -1
- package/dist/esm/components/text.js.map +2 -2
- package/dist/esm/stories/decorators/dataPropsDecorator.d.ts +16 -0
- package/dist/esm/stories/decorators/dataPropsDecorator.js +2 -0
- package/dist/esm/stories/decorators/dataPropsDecorator.js.map +7 -0
- package/dist/tokens/anker.css +1 -0
- package/dist/tokens/base.css +1 -0
- package/dist/tokens/eufy.css +1 -0
- package/dist/tokens/eufyMake.css +1 -0
- package/dist/tokens/solix.css +1 -0
- package/dist/tokens/soundcore.css +1 -0
- package/package.json +6 -2
- package/style.css +20 -3
- package/tailwind.config.js +1 -0
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/Countdown.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\n\nimport React, { useEffect, useRef, useState, useMemo } from 'react'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '../helpers/index.js'\n\n// \u5B9A\u4E49\u6837\u5F0F\u53D8\u4F53\nconst countdownVariants = cva(\n // \u57FA\u7840\u6837\u5F0F\uFF1A\u5012\u8BA1\u65F6\u5BB9\u5668\n 'countdown-container flex w-full items-center',\n {\n variants: {\n variant: {\n outline: 'gap-1',\n spacious: 'gap-1',\n },\n },\n defaultVariants: {\n variant: 'outline',\n },\n }\n)\n\nconst timeBlockVariants = cva(\n // \u57FA\u7840\u6837\u5F0F\uFF1A\u65F6\u95F4\u5757\n 'time-block border-box flex flex-col items-center justify-center overflow-hidden text-center text-xs',\n {\n variants: {\n variant: {\n outline:\n 'border-info-primary text-info-primary desktop:size-
|
|
5
|
-
"mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,
|
|
4
|
+
"sourcesContent": ["'use client'\n\nimport React, { useEffect, useRef, useState, useMemo } from 'react'\nimport { cva, type VariantProps } from 'class-variance-authority'\nimport { cn } from '../helpers/index.js'\n\n// \u5B9A\u4E49\u6837\u5F0F\u53D8\u4F53\nconst countdownVariants = cva(\n // \u57FA\u7840\u6837\u5F0F\uFF1A\u5012\u8BA1\u65F6\u5BB9\u5668\n 'countdown-container flex w-full items-center',\n {\n variants: {\n variant: {\n outline: 'gap-1',\n spacious: 'gap-1',\n },\n },\n defaultVariants: {\n variant: 'outline',\n },\n }\n)\n\nconst timeBlockVariants = cva(\n // \u57FA\u7840\u6837\u5F0F\uFF1A\u65F6\u95F4\u5757\n 'time-block border-box rounded-box-small flex flex-col items-center justify-center overflow-hidden text-center text-xs',\n {\n variants: {\n variant: {\n outline:\n 'border-info-primary text-info-primary desktop:size-12 desktop:p-1 size-10 border bg-transparent p-[2px]',\n spacious: 'bg-info-white text-info-primary desktop:size-12 desktop:p-1 size-10 p-[2px]',\n },\n },\n defaultVariants: {\n variant: 'outline',\n },\n }\n)\n\nconst timeNumberVariants = cva(\n 'time-number lg-desktop:text-[24px] desktop:leading-[120%] translate-y-[2px] whitespace-nowrap text-center text-[20px] font-bold leading-none'\n)\n\nconst separatorVariants = cva(\n // \u57FA\u7840\u6837\u5F0F\uFF1A\u5206\u9694\u7B26\n 'separator desktop:text-2xl text-xl font-bold',\n {\n variants: {\n variant: {\n outline: 'text-info-primary',\n spacious: 'text-info-primary',\n },\n },\n defaultVariants: {\n variant: 'outline',\n },\n }\n)\n\n/**\n * \u65F6\u95F4\u6807\u7B7E\u914D\u7F6E\u63A5\u53E3\n */\nexport interface TimeLabels {\n /** \u5929\u7684\u6807\u7B7E */\n day: string\n /** \u5C0F\u65F6\u7684\u6807\u7B7E */\n hour: string\n /** \u5206\u949F\u7684\u6807\u7B7E */\n minute: string\n /** \u79D2\u7684\u6807\u7B7E */\n second: string\n}\n\n/**\n * \u5012\u8BA1\u65F6\u7EC4\u4EF6Props\u63A5\u53E3\n */\nexport interface CountdownProps\n extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onExpire'>, VariantProps<typeof countdownVariants> {\n /** \u7ED3\u675F\u65F6\u95F4 - ISO\u683C\u5F0F\u5B57\u7B26\u4E32 */\n endDate: string\n /** \u7ED3\u675F\u65F6\u95F4\u65F6\u533A\uFF0C\u5982: America/Los_Angeles */\n endDate_tz?: string\n /** \u683C\u5F0F\u5316\u7528\u7684locale\uFF0C\u9ED8\u8BA4\u4F7F\u7528navigator.language */\n locale?: string\n /** \u65F6\u95F4\u6807\u7B7E\u914D\u7F6E\uFF0C\u7528\u4E8E\u56FD\u9645\u5316 */\n timeLabels?: TimeLabels\n /** JSON\u5B57\u7B26\u4E32\u683C\u5F0F\u7684\u65F6\u95F4\u6807\u7B7E\uFF08\u5411\u540E\u517C\u5BB9\uFF09 */\n dateFormat?: string\n /** \u5012\u8BA1\u65F6\u7ED3\u675F\u56DE\u8C03 */\n onExpire?: () => void\n /** \u5206\u9694\u7B26\u5B57\u7B26\uFF0C\u9ED8\u8BA4\u4E3A ':' */\n separator?: string\n /** \u9690\u85CF\u5DF2\u8FC7\u671F\u7684\u5012\u8BA1\u65F6\uFF0C\u9ED8\u8BA4\u4E3A true */\n hideWhenExpired?: boolean\n}\n\n/**\n * \u6570\u5B57\u8865\u96F6\u51FD\u6570\n */\nconst pad = (n: number, len = 2) => String(Math.abs(n)).padStart(len, '0')\n\n/**\n * \u9ED8\u8BA4\u65F6\u95F4\u6807\u7B7E\n */\nconst getDefaultTimeLabels = (): TimeLabels => ({\n day: 'Day',\n hour: 'Hours',\n minute: 'Mins',\n second: 'Secs',\n})\n\n/**\n * \u89E3\u6790dateFormat JSON\u5B57\u7B26\u4E32\uFF08\u5411\u540E\u517C\u5BB9\uFF09\n */\nconst safeStringToObject = (str: string): TimeLabels => {\n try {\n let jsonStr = str?.trim?.()\n if (!jsonStr?.startsWith?.('{') || !jsonStr?.endsWith?.('}')) {\n return getDefaultTimeLabels()\n }\n jsonStr = jsonStr?.replace?.(/(\\w+)\\s*:/g, '\"$1\":')\n return { ...getDefaultTimeLabels(), ...JSON.parse(jsonStr) }\n } catch (err) {\n return getDefaultTimeLabels()\n }\n}\n\n/**\n * Countdown - \u5012\u8BA1\u65F6\u539F\u5B50\u7EC4\u4EF6\n *\n * @description \u7528\u4E8E\u663E\u793A\u5012\u8BA1\u65F6\u7684\u7EC4\u4EF6\uFF0C\u652F\u6301\u5929\u3001\u65F6\u3001\u5206\u3001\u79D2\u663E\u793A\uFF0C\u652F\u6301\u591A\u79CD\u6837\u5F0F\u53D8\u4F53\u548C\u5C3A\u5BF8\n */\nconst Countdown = React.forwardRef<HTMLDivElement, CountdownProps>(\n (\n {\n className,\n endDate,\n endDate_tz,\n locale,\n timeLabels,\n dateFormat,\n onExpire,\n separator = ':',\n hideWhenExpired = true,\n variant,\n ...props\n },\n ref\n ) => {\n // \u786E\u5B9A\u6700\u7EC8\u4F7F\u7528\u7684\u65F6\u95F4\u6807\u7B7E\n const finalTimeLabels = useMemo(() => {\n if (timeLabels) return timeLabels\n if (dateFormat) return safeStringToObject(dateFormat)\n return getDefaultTimeLabels()\n }, [timeLabels, dateFormat])\n\n // \u89E3\u6790\u76EE\u6807\u65F6\u95F4\n const targetMsRef = useRef<number>(Date.parse(endDate))\n const [remainingMs, setRemainingMs] = useState<number>(() => {\n const t = targetMsRef.current\n return isNaN(t) ? 0 : Math.max(0, t - Date.now())\n })\n\n // \u5224\u65AD\u662F\u5426\u5DF2\u8FC7\u671F\n const [isExpired, setIsExpired] = useState<boolean>(() => {\n const t = targetMsRef.current\n return !isNaN(t) && t <= Date.now()\n })\n\n // \u5F53endDate\u6539\u53D8\u65F6\u66F4\u65B0\u76EE\u6807\u65F6\u95F4\n useEffect(() => {\n targetMsRef.current = Date.parse(endDate)\n const t = targetMsRef.current\n const newRemaining = isNaN(t) ? 0 : Math.max(0, t - Date.now())\n const newIsExpired = !isNaN(t) && t <= Date.now()\n\n setRemainingMs(newRemaining)\n setIsExpired(newIsExpired)\n }, [endDate])\n\n // \u542F\u52A8\u5012\u8BA1\u65F6\u5B9A\u65F6\u5668\n useEffect(() => {\n if (isExpired) return // \u5DF2\u8FC7\u671F\u5219\u4E0D\u542F\u52A8\n if (isNaN(targetMsRef.current)) return // \u65E0\u6548\u65E5\u671F\u4E0D\u542F\u52A8\n\n let expiredCalled = false\n const tick = () => {\n const now = Date.now()\n const remaining = Math.max(0, targetMsRef.current - now)\n setRemainingMs(remaining)\n\n if (remaining <= 0 && !expiredCalled) {\n expiredCalled = true\n setIsExpired(true)\n onExpire?.()\n }\n }\n\n tick() // \u7ACB\u5373\u6267\u884C\u4E00\u6B21\n const intervalId = window.setInterval(tick, 1000)\n\n return () => clearInterval(intervalId)\n }, [onExpire, isExpired, endDate])\n\n // \u8BA1\u7B97\u65F6\u95F4\u5355\u4F4D\n const totalSeconds = Math.floor(remainingMs / 1000)\n const seconds = totalSeconds % 60\n const totalMinutes = Math.floor(totalSeconds / 60)\n const minutes = totalMinutes % 60\n const totalHours = Math.floor(totalMinutes / 60)\n const hours = totalHours % 24\n const days = Math.floor(totalHours / 24)\n\n // \u5982\u679C\u5DF2\u8FC7\u671F\u4E14\u9700\u8981\u9690\u85CF\uFF0C\u5219\u8FD4\u56DEnull\n if (isExpired && hideWhenExpired) {\n return null\n }\n\n return (\n <div\n ref={ref}\n className={cn(countdownVariants({ variant }), className)}\n role=\"timer\"\n aria-live=\"polite\"\n aria-label=\"countdown timer\"\n {...props}\n >\n {/* \u5929 */}\n <div className={cn(timeBlockVariants({ variant }), 'time-days-box')}>\n <div className={timeNumberVariants()}>{pad(days, 2)}</div>\n <div className=\"truncate text-center text-[12px] font-bold\">{finalTimeLabels.day}</div>\n </div>\n\n <div className={separatorVariants({ variant })}>{separator}</div>\n\n {/* \u65F6 */}\n <div className={cn(timeBlockVariants({ variant }), 'time-hours-box')}>\n <div className={timeNumberVariants()}>{pad(hours, 2)}</div>\n <div className=\"truncate text-center text-[12px] font-bold\">{finalTimeLabels.hour}</div>\n </div>\n\n <div className={separatorVariants({ variant })}>{separator}</div>\n\n {/* \u5206 */}\n <div className={cn(timeBlockVariants({ variant }), 'time-minutes-box')}>\n <div className={timeNumberVariants()}>{pad(minutes, 2)}</div>\n <div className=\"truncate text-center text-[12px] font-bold\">{finalTimeLabels.minute}</div>\n </div>\n\n <div className={separatorVariants({ variant })}>{separator}</div>\n\n {/* \u79D2 */}\n <div className={cn(timeBlockVariants({ variant }), 'time-seconds-box')}>\n <div className={timeNumberVariants()}>{pad(seconds, 2)}</div>\n <div className=\"truncate text-center text-[12px] font-bold\">{finalTimeLabels.second}</div>\n </div>\n </div>\n )\n }\n)\n\nCountdown.displayName = 'Countdown'\n\nexport default Countdown\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["Countdown_exports", "__export", "Countdown_default", "__toCommonJS", "import_jsx_runtime", "import_react", "import_class_variance_authority", "import_helpers", "countdownVariants", "timeBlockVariants", "timeNumberVariants", "separatorVariants", "pad", "n", "len", "getDefaultTimeLabels", "safeStringToObject", "str", "jsonStr", "Countdown", "React", "className", "endDate", "endDate_tz", "locale", "timeLabels", "dateFormat", "onExpire", "separator", "hideWhenExpired", "variant", "props", "ref", "finalTimeLabels", "targetMsRef", "remainingMs", "setRemainingMs", "t", "isExpired", "setIsExpired", "newRemaining", "newIsExpired", "expiredCalled", "tick", "now", "remaining", "intervalId", "totalSeconds", "seconds", "totalMinutes", "minutes", "totalHours", "hours", "days"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";"use client";var V=Object.create;var i=Object.defineProperty;var L=Object.getOwnPropertyDescriptor;var N=Object.getOwnPropertyNames;var z=Object.getPrototypeOf,C=Object.prototype.hasOwnProperty;var E=(e,t)=>{for(var a in t)i(e,a,{get:t[a],enumerable:!0})},f=(e,t,a,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of N(t))!C.call(e,n)&&n!==a&&i(e,n,{get:()=>t[n],enumerable:!(o=L(t,n))||o.enumerable});return e};var c=(e,t,a)=>(a=e!=null?V(z(e)):{},f(t||!e||!e.__esModule?i(a,"default",{value:e,enumerable:!0}):a,e)),H=e=>f(i({},"__esModule",{value:!0}),e);var A={};E(A,{default:()=>T,sizeMap:()=>v});module.exports=H(A);var r=require("react/jsx-runtime"),M=c(require("react")),g=require("@radix-ui/react-visually-hidden"),b=require("class-variance-authority"),y=c(require("../icons/spinner.js")),m=require("../helpers/index.js");const v={sm:{width:"16",height:"16"},base:{width:"18",height:"18"},lg:{width:"20",height:"20"}},P=({size:e="base",...t})=>{const{width:a,height:o}=v[e];return(0,r.jsx)("svg",{width:a,height:o,viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",...t,children:(0,r.jsx)("path",{d:"M7.5 5L12.5 10L7.5 15",stroke:"currentColor",strokeWidth:"1.66667",strokeLinecap:"round",strokeLinejoin:"round"})})},R=(0,b.cva)("rounded-btn inline-flex cursor-pointer items-center justify-center text-sm font-bold focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none",{variants:{variant:{primary:"bg-btn-primary text-btn-primary-foreground hover:bg-btn-primary-active hover:text-btn-primary-active-foreground hover:bg-gradient-brand border-none ",secondary:"bg-btn-secondary outline-btn-primary text-btn-secondary-foreground hover:bg-btn-secondary-active hover:text-btn-secondary-active-foreground border-solid outline outline-[1.6px] outline-offset-[-1.6px]",link:"text-info-primary hover:text-btn-primary-active border-none",ghost:"text-info-primary hover:bg-btn-primary hover:text-btn-primary-foreground"},size:{sm:"px-3 py-2 text-[12px] leading-tight",base:"px-5 pb-[10px] pt-[11px] text-[14px] leading-tight",lg:"lg-desktop:px-7 lg-desktop:pb-[14px] lg-desktop:pt-[15px] lg-desktop:text-[16px] px-5 pb-[10px] pt-[11px] text-[14px] leading-tight",icon:"size-10 rounded-full leading-tight"},hoverEffect:{none:"",slide:""},state:{default:"",disabled:"",loading:""}},compoundVariants:[{variant:"primary",hoverEffect:"slide",class:'before:rounded-btn hover:!bg-btn-primary before:bg-btn-primary-active relative z-[1] overflow-hidden before:absolute before:inset-y-0 before:-z-[1] before:w-full before:-translate-x-full before:transition-transform before:duration-300 before:ease-in-out before:content-[""] hover:before:translate-x-0'},{variant:"secondary",hoverEffect:"slide",class:'before:rounded-btn hover:!bg-btn-secondary before:bg-btn-secondary-active relative z-[1] overflow-hidden before:absolute before:inset-y-0 before:-z-[1] before:w-full before:-translate-x-full before:transition-transform before:duration-300 before:ease-in-out before:content-[""] hover:before:translate-x-0'},{variant:"primary",state:"loading",class:"bg-btn-primary-active disabled:border-btn-primary-disabled-border"},{variant:"secondary",state:"loading",class:"bg-btn-secondary disabled:bg-btn-secondary-disabled disabled:text-btn-secondary-disabled-foreground disabled:border-btn-primary-disabled"},{variant:"primary",state:"disabled",class:"disabled:bg-btn-primary-disabled disabled:text-btn-primary-disabled-foreground disabled:border-btn-primary-disabled"},{variant:"secondary",state:"disabled",class:"disabled:bg-btn-secondary-disabled disabled:text-btn-secondary-disabled-foreground disabled:border-btn-secondary-disabled-border"},{variant:"link",state:"disabled",class:"disabled:text-info-quaternary"}],defaultVariants:{variant:"primary",size:"lg",hoverEffect:"none",state:"default"}}),I=(0,b.cva)("",{variants:{variant:{primary:"stroke-btn-primary-foreground",secondary:"stroke-btn-secondary-foreground",link:"stroke-primary",ghost:"stroke-primary"}},defaultVariants:{variant:"primary"}}),u=M.forwardRef(({asChild:e=!1,as:t="button",href:a,size:o="lg",children:n,variant:s,hoverEffect:h="none",className:x,disabled:l=!1,loading:d=!1,spinner:p,iconClassName:k,...w},B)=>(0,r.jsx)(t,{disabled:l||d,className:(0,m.cn)(R({variant:s,size:o,hoverEffect:h,state:d?"loading":l?"disabled":"default"}),x),ref:B,...t==="a"?{href:a}:{},...w,children:d?(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)("span",{style:{display:"contents",visibility:"hidden"},"aria-hidden":!0,children:n}),(0,r.jsx)("span",{className:"absolute",children:p||(0,r.jsx)(y.default,{className:I({variant:s})})}),(0,r.jsx)(g.VisuallyHidden,{children:n})]}):(0,r.jsxs)(r.Fragment,{children:[n,s==="link"&&o&&o!=="icon"&&(0,r.jsx)(P,{className:k,size:o})]})}));u.displayName="Button";var T=u;
|
|
1
|
+
"use strict";"use client";var V=Object.create;var i=Object.defineProperty;var L=Object.getOwnPropertyDescriptor;var N=Object.getOwnPropertyNames;var z=Object.getPrototypeOf,C=Object.prototype.hasOwnProperty;var E=(e,t)=>{for(var a in t)i(e,a,{get:t[a],enumerable:!0})},f=(e,t,a,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let n of N(t))!C.call(e,n)&&n!==a&&i(e,n,{get:()=>t[n],enumerable:!(o=L(t,n))||o.enumerable});return e};var c=(e,t,a)=>(a=e!=null?V(z(e)):{},f(t||!e||!e.__esModule?i(a,"default",{value:e,enumerable:!0}):a,e)),H=e=>f(i({},"__esModule",{value:!0}),e);var A={};E(A,{default:()=>T,sizeMap:()=>v});module.exports=H(A);var r=require("react/jsx-runtime"),M=c(require("react")),g=require("@radix-ui/react-visually-hidden"),b=require("class-variance-authority"),y=c(require("../icons/spinner.js")),m=require("../helpers/index.js");const v={sm:{width:"16",height:"16"},base:{width:"18",height:"18"},lg:{width:"20",height:"20"}},P=({size:e="base",...t})=>{const{width:a,height:o}=v[e];return(0,r.jsx)("svg",{width:a,height:o,viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",...t,children:(0,r.jsx)("path",{d:"M7.5 5L12.5 10L7.5 15",stroke:"currentColor",strokeWidth:"1.66667",strokeLinecap:"round",strokeLinejoin:"round"})})},R=(0,b.cva)("rounded-btn inline-flex cursor-pointer items-center justify-center text-sm font-bold focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none",{variants:{variant:{primary:"bg-btn-primary text-btn-primary-foreground hover:bg-btn-primary-active hover:text-btn-primary-active-foreground hover:bg-gradient-brand border-none ",secondary:"bg-btn-secondary outline-btn-primary text-btn-secondary-foreground hover:bg-btn-secondary-active hover:text-btn-secondary-active-foreground border-solid outline outline-[1.6px] outline-offset-[-1.6px]",link:"text-info-primary hover:text-btn-primary-active border-none",ghost:"text-info-primary hover:bg-btn-primary hover:text-btn-primary-foreground"},size:{sm:"px-3 py-2 text-[12px] leading-tight",base:"px-5 pb-[10px] pt-[11px] text-[14px] leading-tight",lg:"lg-desktop:px-7 lg-desktop:pb-[14px] lg-desktop:pt-[15px] lg-desktop:text-[16px] px-5 pb-[10px] pt-[11px] text-[14px] leading-tight",icon:"size-10 rounded-full leading-tight"},hoverEffect:{none:"",slide:""},state:{default:"",disabled:"",loading:""}},compoundVariants:[{variant:"primary",hoverEffect:"slide",class:'before:rounded-btn hover:!bg-btn-primary before:bg-btn-primary-active relative z-[1] overflow-hidden before:absolute before:inset-y-0 before:-z-[1] before:w-full before:-translate-x-full before:transition-transform before:duration-300 before:ease-in-out before:content-[""] hover:before:translate-x-0'},{variant:"secondary",hoverEffect:"slide",class:'before:rounded-btn hover:!bg-btn-secondary before:bg-btn-secondary-active relative z-[1] overflow-hidden before:absolute before:inset-y-0 before:-z-[1] before:w-full before:-translate-x-full before:transition-transform before:duration-300 before:ease-in-out before:content-[""] hover:before:translate-x-0'},{variant:"primary",state:"loading",class:"bg-btn-primary-active disabled:border-btn-primary-disabled-border"},{variant:"secondary",state:"loading",class:"bg-btn-secondary disabled:bg-btn-secondary-disabled disabled:text-btn-secondary-disabled-foreground disabled:border-btn-primary-disabled"},{variant:"primary",state:"disabled",class:"disabled:bg-btn-primary-disabled disabled:text-btn-primary-disabled-foreground disabled:border-btn-primary-disabled"},{variant:"secondary",state:"disabled",class:"disabled:bg-btn-secondary-disabled disabled:text-btn-secondary-disabled-foreground disabled:border-btn-secondary-disabled-border disabled:outline-btn-secondary-disabled-border"},{variant:"link",state:"disabled",class:"disabled:text-info-quaternary"}],defaultVariants:{variant:"primary",size:"lg",hoverEffect:"none",state:"default"}}),I=(0,b.cva)("",{variants:{variant:{primary:"stroke-btn-primary-foreground",secondary:"stroke-btn-secondary-foreground",link:"stroke-primary",ghost:"stroke-primary"}},defaultVariants:{variant:"primary"}}),u=M.forwardRef(({asChild:e=!1,as:t="button",href:a,size:o="lg",children:n,variant:s,hoverEffect:h="none",className:x,disabled:l=!1,loading:d=!1,spinner:p,iconClassName:k,...w},B)=>(0,r.jsx)(t,{disabled:l||d,className:(0,m.cn)(R({variant:s,size:o,hoverEffect:h,state:d?"loading":l?"disabled":"default"}),x),ref:B,...t==="a"?{href:a}:{},...w,children:d?(0,r.jsxs)(r.Fragment,{children:[(0,r.jsx)("span",{style:{display:"contents",visibility:"hidden"},"aria-hidden":!0,children:n}),(0,r.jsx)("span",{className:"absolute",children:p||(0,r.jsx)(y.default,{className:I({variant:s})})}),(0,r.jsx)(g.VisuallyHidden,{children:n})]}):(0,r.jsxs)(r.Fragment,{children:[n,s==="link"&&o&&o!=="icon"&&(0,r.jsx)(P,{className:k,size:o})]})}));u.displayName="Button";var T=u;
|
|
2
2
|
//# sourceMappingURL=button.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/button.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { VisuallyHidden } from '@radix-ui/react-visually-hidden'\nimport { type VariantProps, cva } from 'class-variance-authority'\nimport Spinner from '../icons/spinner.js'\nimport { cn } from '../helpers/index.js'\n\nexport const sizeMap = {\n sm: {\n width: '16',\n height: '16',\n },\n base: {\n width: '18',\n height: '18',\n },\n lg: {\n width: '20',\n height: '20',\n },\n}\nconst LinkButtonAppendIcon = ({ size = 'base', ...rest }: { size: 'base' | 'lg' | 'sm'; className?: string }) => {\n const { width, height } = sizeMap[size]\n return (\n <svg width={width} height={height} viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" {...rest}>\n <path\n d=\"M7.5 5L12.5 10L7.5 15\"\n stroke=\"currentColor\"\n strokeWidth=\"1.66667\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n )\n}\n\n/**\n * Button Variants\n */\n// eslint-disable-next-line tailwindcss/enforces-negative-arbitrary-values\nconst buttonVariants = cva(\n 'rounded-btn inline-flex cursor-pointer items-center justify-center text-sm font-bold focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none',\n {\n variants: {\n variant: {\n primary:\n 'bg-btn-primary text-btn-primary-foreground hover:bg-btn-primary-active hover:text-btn-primary-active-foreground hover:bg-gradient-brand border-none ',\n secondary:\n 'bg-btn-secondary outline-btn-primary text-btn-secondary-foreground hover:bg-btn-secondary-active hover:text-btn-secondary-active-foreground border-solid outline outline-[1.6px] outline-offset-[-1.6px]',\n link: 'text-info-primary hover:text-btn-primary-active border-none',\n ghost: 'text-info-primary hover:bg-btn-primary hover:text-btn-primary-foreground',\n },\n size: {\n sm: 'px-3 py-2 text-[12px] leading-tight',\n base: 'px-5 pb-[10px] pt-[11px] text-[14px] leading-tight',\n lg: 'lg-desktop:px-7 lg-desktop:pb-[14px] lg-desktop:pt-[15px] lg-desktop:text-[16px] px-5 pb-[10px] pt-[11px] text-[14px] leading-tight',\n icon: 'size-10 rounded-full leading-tight',\n },\n /** hover \u72B6\u6001\u4E0B\u7684\u52A8\u753B\u6548\u679C,\u9700\u8981\u6CE8\u610F\u4E0D\u540Cvariant \u4E0B\u7684\u6548\u679C */\n hoverEffect: {\n none: '',\n slide: '',\n },\n state: {\n default: '',\n disabled: '',\n loading: '',\n },\n },\n compoundVariants: [\n {\n variant: 'primary',\n hoverEffect: 'slide',\n class:\n 'before:rounded-btn hover:!bg-btn-primary before:bg-btn-primary-active relative z-[1] overflow-hidden before:absolute before:inset-y-0 before:-z-[1] before:w-full before:-translate-x-full before:transition-transform before:duration-300 before:ease-in-out before:content-[\"\"] hover:before:translate-x-0',\n },\n {\n variant: 'secondary',\n hoverEffect: 'slide',\n class:\n 'before:rounded-btn hover:!bg-btn-secondary before:bg-btn-secondary-active relative z-[1] overflow-hidden before:absolute before:inset-y-0 before:-z-[1] before:w-full before:-translate-x-full before:transition-transform before:duration-300 before:ease-in-out before:content-[\"\"] hover:before:translate-x-0',\n },\n {\n variant: 'primary',\n state: 'loading',\n class: 'bg-btn-primary-active disabled:border-btn-primary-disabled-border',\n },\n {\n variant: 'secondary',\n state: 'loading',\n class:\n 'bg-btn-secondary disabled:bg-btn-secondary-disabled disabled:text-btn-secondary-disabled-foreground disabled:border-btn-primary-disabled',\n },\n {\n variant: 'primary',\n state: 'disabled',\n class:\n 'disabled:bg-btn-primary-disabled disabled:text-btn-primary-disabled-foreground disabled:border-btn-primary-disabled',\n },\n {\n variant: 'secondary',\n state: 'disabled',\n class:\n 'disabled:bg-btn-secondary-disabled disabled:text-btn-secondary-disabled-foreground disabled:border-btn-secondary-disabled-border',\n },\n {\n variant: 'link',\n state: 'disabled',\n class: 'disabled:text-info-quaternary',\n },\n ],\n defaultVariants: {\n variant: 'primary',\n size: 'lg',\n hoverEffect: 'none',\n state: 'default',\n },\n }\n)\n\nconst loadingSvgVariants = cva('', {\n variants: {\n variant: {\n primary: 'stroke-btn-primary-foreground',\n secondary: 'stroke-btn-secondary-foreground',\n link: 'stroke-primary',\n ghost: 'stroke-primary',\n },\n },\n defaultVariants: {\n variant: 'primary',\n },\n})\n\nexport interface ButtonProps\n extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {\n /** \u8BBE\u7F6E\u6309\u94AE\u8F7D\u5165\u72B6\u6001 */\n loading?: boolean\n /** \u8BBE\u7F6E\u6309\u94AE\u5931\u6548\u72B6\u6001 */\n disabled?: boolean\n /** \u5B9A\u4E49\u81EA\u7EC4\u4EF6\u4F5C\u4E3A\u7236\u7EC4\u4EF6\u7684\u7C7B\u578B\uFF0C \u8BE6\u7EC6\u4F7F\u7528\u65B9\u5F0F\u8BF7\u53C2\u8003radix-ui (\u5DF2\u4F5C\u5E9F\u8BF7\u52FF\u4F7F\u7528) */\n asChild?: boolean\n /** \u5B9A\u4E49\u81EA\u7EC4\u4EF6\u4F5C\u4E3A\u7236\u7EC4\u4EF6\u7684\u7C7B\u578B\uFF0C \u8BE6\u7EC6\u4F7F\u7528\u65B9\u5F0F\u8BF7\u53C2\u8003radix-ui */\n as?: 'button' | 'a'\n href?: string\n iconClassName?: string\n /** \u81EA\u5B9A\u4E49loading */\n spinner?: React.ReactNode\n}\n\n/**\n * Button - \u6309\u94AE\n *\n * @description \u53EF\u70B9\u51FB\u7684\u4EA4\u4E92\u5F0F\u6309\u94AE\u7EC4\u4EF6\uFF0C\u652F\u6301\u591A\u79CD\u6837\u5F0F\u3001\u5927\u5C0F\u3001\u72B6\u6001\u548C\u52A0\u8F7D\u6548\u679C\n */\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n (\n {\n // eslint-disable-next-line\n asChild = false,\n as = 'button',\n href,\n size = 'lg',\n children,\n variant,\n hoverEffect = 'none',\n className,\n disabled = false,\n loading = false,\n spinner,\n iconClassName,\n ...props\n }: ButtonProps,\n ref\n ) => {\n const Comp = as\n const isInactive = disabled || loading\n const state = loading ? 'loading' : disabled ? 'disabled' : 'default'\n\n return (\n <Comp\n disabled={isInactive}\n className={cn(buttonVariants({ variant, size, hoverEffect, state }), className)}\n ref={ref as any}\n {...(as === 'a' ? { href } : {})}\n {...(props as any)}\n >\n {loading ? (\n <>\n <span style={{ display: 'contents', visibility: 'hidden' }} aria-hidden>\n {children}\n </span>\n <span className=\"absolute\">\n {spinner ? (\n spinner\n ) : (\n <Spinner\n className={loadingSvgVariants({\n variant,\n })}\n />\n )}\n </span>\n <VisuallyHidden>{children}</VisuallyHidden>\n </>\n ) : (\n <>\n {children}\n {variant === 'link' && size && size !== 'icon' && (\n <LinkButtonAppendIcon className={iconClassName} size={size} />\n )}\n </>\n )}\n </Comp>\n )\n }\n)\n\nButton.displayName = 'Button'\nexport default Button\n"],
|
|
5
|
-
"mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,EAAA,YAAAC,IAAA,eAAAC,EAAAJ,GA0BM,IAAAK,EAAA,6BAxBNC,EAAuB,oBACvBC,EAA+B,2CAC/BC,EAAuC,oCACvCC,EAAoB,kCACpBC,EAAmB,+BAEZ,MAAMP,EAAU,CACrB,GAAI,CACF,MAAO,KACP,OAAQ,IACV,EACA,KAAM,CACJ,MAAO,KACP,OAAQ,IACV,EACA,GAAI,CACF,MAAO,KACP,OAAQ,IACV,CACF,EACMQ,EAAuB,CAAC,CAAE,KAAAC,EAAO,OAAQ,GAAGC,CAAK,IAA0D,CAC/G,KAAM,CAAE,MAAAC,EAAO,OAAAC,CAAO,EAAIZ,EAAQS,CAAI,EACtC,SACE,OAAC,OAAI,MAAOE,EAAO,OAAQC,EAAQ,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAA8B,GAAGF,EACxG,mBAAC,QACC,EAAE,wBACF,OAAO,eACP,YAAY,UACZ,cAAc,QACd,eAAe,QACjB,EACF,CAEJ,EAMMG,KAAiB,OACrB,gMACA,CACE,SAAU,CACR,QAAS,CACP,QACE,uJACF,UACE,2MACF,KAAM,8DACN,MAAO,0EACT,EACA,KAAM,CACJ,GAAI,sCACJ,KAAM,qDACN,GAAI,sIACJ,KAAM,oCACR,EAEA,YAAa,CACX,KAAM,GACN,MAAO,EACT,EACA,MAAO,CACL,QAAS,GACT,SAAU,GACV,QAAS,EACX,CACF,EACA,iBAAkB,CAChB,CACE,QAAS,UACT,YAAa,QACb,MACE,8SACJ,EACA,CACE,QAAS,YACT,YAAa,QACb,MACE,mTACJ,EACA,CACE,QAAS,UACT,MAAO,UACP,MAAO,mEACT,EACA,CACE,QAAS,YACT,MAAO,UACP,MACE,0IACJ,EACA,CACE,QAAS,UACT,MAAO,WACP,MACE,qHACJ,EACA,CACE,QAAS,YACT,MAAO,WACP,MACE,
|
|
4
|
+
"sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { VisuallyHidden } from '@radix-ui/react-visually-hidden'\nimport { type VariantProps, cva } from 'class-variance-authority'\nimport Spinner from '../icons/spinner.js'\nimport { cn } from '../helpers/index.js'\n\nexport const sizeMap = {\n sm: {\n width: '16',\n height: '16',\n },\n base: {\n width: '18',\n height: '18',\n },\n lg: {\n width: '20',\n height: '20',\n },\n}\nconst LinkButtonAppendIcon = ({ size = 'base', ...rest }: { size: 'base' | 'lg' | 'sm'; className?: string }) => {\n const { width, height } = sizeMap[size]\n return (\n <svg width={width} height={height} viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" {...rest}>\n <path\n d=\"M7.5 5L12.5 10L7.5 15\"\n stroke=\"currentColor\"\n strokeWidth=\"1.66667\"\n strokeLinecap=\"round\"\n strokeLinejoin=\"round\"\n />\n </svg>\n )\n}\n\n/**\n * Button Variants\n */\n// eslint-disable-next-line tailwindcss/enforces-negative-arbitrary-values\nconst buttonVariants = cva(\n 'rounded-btn inline-flex cursor-pointer items-center justify-center text-sm font-bold focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:pointer-events-none',\n {\n variants: {\n variant: {\n primary:\n 'bg-btn-primary text-btn-primary-foreground hover:bg-btn-primary-active hover:text-btn-primary-active-foreground hover:bg-gradient-brand border-none ',\n secondary:\n 'bg-btn-secondary outline-btn-primary text-btn-secondary-foreground hover:bg-btn-secondary-active hover:text-btn-secondary-active-foreground border-solid outline outline-[1.6px] outline-offset-[-1.6px]',\n link: 'text-info-primary hover:text-btn-primary-active border-none',\n ghost: 'text-info-primary hover:bg-btn-primary hover:text-btn-primary-foreground',\n },\n size: {\n sm: 'px-3 py-2 text-[12px] leading-tight',\n base: 'px-5 pb-[10px] pt-[11px] text-[14px] leading-tight',\n lg: 'lg-desktop:px-7 lg-desktop:pb-[14px] lg-desktop:pt-[15px] lg-desktop:text-[16px] px-5 pb-[10px] pt-[11px] text-[14px] leading-tight',\n icon: 'size-10 rounded-full leading-tight',\n },\n /** hover \u72B6\u6001\u4E0B\u7684\u52A8\u753B\u6548\u679C,\u9700\u8981\u6CE8\u610F\u4E0D\u540Cvariant \u4E0B\u7684\u6548\u679C */\n hoverEffect: {\n none: '',\n slide: '',\n },\n state: {\n default: '',\n disabled: '',\n loading: '',\n },\n },\n compoundVariants: [\n {\n variant: 'primary',\n hoverEffect: 'slide',\n class:\n 'before:rounded-btn hover:!bg-btn-primary before:bg-btn-primary-active relative z-[1] overflow-hidden before:absolute before:inset-y-0 before:-z-[1] before:w-full before:-translate-x-full before:transition-transform before:duration-300 before:ease-in-out before:content-[\"\"] hover:before:translate-x-0',\n },\n {\n variant: 'secondary',\n hoverEffect: 'slide',\n class:\n 'before:rounded-btn hover:!bg-btn-secondary before:bg-btn-secondary-active relative z-[1] overflow-hidden before:absolute before:inset-y-0 before:-z-[1] before:w-full before:-translate-x-full before:transition-transform before:duration-300 before:ease-in-out before:content-[\"\"] hover:before:translate-x-0',\n },\n {\n variant: 'primary',\n state: 'loading',\n class: 'bg-btn-primary-active disabled:border-btn-primary-disabled-border',\n },\n {\n variant: 'secondary',\n state: 'loading',\n class:\n 'bg-btn-secondary disabled:bg-btn-secondary-disabled disabled:text-btn-secondary-disabled-foreground disabled:border-btn-primary-disabled',\n },\n {\n variant: 'primary',\n state: 'disabled',\n class:\n 'disabled:bg-btn-primary-disabled disabled:text-btn-primary-disabled-foreground disabled:border-btn-primary-disabled',\n },\n {\n variant: 'secondary',\n state: 'disabled',\n class:\n 'disabled:bg-btn-secondary-disabled disabled:text-btn-secondary-disabled-foreground disabled:border-btn-secondary-disabled-border disabled:outline-btn-secondary-disabled-border',\n },\n {\n variant: 'link',\n state: 'disabled',\n class: 'disabled:text-info-quaternary',\n },\n ],\n defaultVariants: {\n variant: 'primary',\n size: 'lg',\n hoverEffect: 'none',\n state: 'default',\n },\n }\n)\n\nconst loadingSvgVariants = cva('', {\n variants: {\n variant: {\n primary: 'stroke-btn-primary-foreground',\n secondary: 'stroke-btn-secondary-foreground',\n link: 'stroke-primary',\n ghost: 'stroke-primary',\n },\n },\n defaultVariants: {\n variant: 'primary',\n },\n})\n\nexport interface ButtonProps\n extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {\n /** \u8BBE\u7F6E\u6309\u94AE\u8F7D\u5165\u72B6\u6001 */\n loading?: boolean\n /** \u8BBE\u7F6E\u6309\u94AE\u5931\u6548\u72B6\u6001 */\n disabled?: boolean\n /** \u5B9A\u4E49\u81EA\u7EC4\u4EF6\u4F5C\u4E3A\u7236\u7EC4\u4EF6\u7684\u7C7B\u578B\uFF0C \u8BE6\u7EC6\u4F7F\u7528\u65B9\u5F0F\u8BF7\u53C2\u8003radix-ui (\u5DF2\u4F5C\u5E9F\u8BF7\u52FF\u4F7F\u7528) */\n asChild?: boolean\n /** \u5B9A\u4E49\u81EA\u7EC4\u4EF6\u4F5C\u4E3A\u7236\u7EC4\u4EF6\u7684\u7C7B\u578B\uFF0C \u8BE6\u7EC6\u4F7F\u7528\u65B9\u5F0F\u8BF7\u53C2\u8003radix-ui */\n as?: 'button' | 'a'\n href?: string\n iconClassName?: string\n /** \u81EA\u5B9A\u4E49loading */\n spinner?: React.ReactNode\n}\n\n/**\n * Button - \u6309\u94AE\n *\n * @description \u53EF\u70B9\u51FB\u7684\u4EA4\u4E92\u5F0F\u6309\u94AE\u7EC4\u4EF6\uFF0C\u652F\u6301\u591A\u79CD\u6837\u5F0F\u3001\u5927\u5C0F\u3001\u72B6\u6001\u548C\u52A0\u8F7D\u6548\u679C\n */\nconst Button = React.forwardRef<HTMLButtonElement, ButtonProps>(\n (\n {\n // eslint-disable-next-line\n asChild = false,\n as = 'button',\n href,\n size = 'lg',\n children,\n variant,\n hoverEffect = 'none',\n className,\n disabled = false,\n loading = false,\n spinner,\n iconClassName,\n ...props\n }: ButtonProps,\n ref\n ) => {\n const Comp = as\n const isInactive = disabled || loading\n const state = loading ? 'loading' : disabled ? 'disabled' : 'default'\n\n return (\n <Comp\n disabled={isInactive}\n className={cn(buttonVariants({ variant, size, hoverEffect, state }), className)}\n ref={ref as any}\n {...(as === 'a' ? { href } : {})}\n {...(props as any)}\n >\n {loading ? (\n <>\n <span style={{ display: 'contents', visibility: 'hidden' }} aria-hidden>\n {children}\n </span>\n <span className=\"absolute\">\n {spinner ? (\n spinner\n ) : (\n <Spinner\n className={loadingSvgVariants({\n variant,\n })}\n />\n )}\n </span>\n <VisuallyHidden>{children}</VisuallyHidden>\n </>\n ) : (\n <>\n {children}\n {variant === 'link' && size && size !== 'icon' && (\n <LinkButtonAppendIcon className={iconClassName} size={size} />\n )}\n </>\n )}\n </Comp>\n )\n }\n)\n\nButton.displayName = 'Button'\nexport default Button\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["button_exports", "__export", "button_default", "sizeMap", "__toCommonJS", "import_jsx_runtime", "React", "import_react_visually_hidden", "import_class_variance_authority", "import_spinner", "import_helpers", "LinkButtonAppendIcon", "size", "rest", "width", "height", "buttonVariants", "loadingSvgVariants", "Button", "asChild", "as", "href", "children", "variant", "hoverEffect", "className", "disabled", "loading", "spinner", "iconClassName", "props", "ref", "Spinner"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";"use client";var
|
|
1
|
+
"use strict";"use client";var p=Object.create;var a=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var m=Object.getOwnPropertyNames;var x=Object.getPrototypeOf,k=Object.prototype.hasOwnProperty;var g=(e,t)=>{for(var o in t)a(e,o,{get:t[o],enumerable:!0})},n=(e,t,o,s)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of m(t))!k.call(e,i)&&i!==o&&a(e,i,{get:()=>t[i],enumerable:!(s=h(t,i))||s.enumerable});return e};var l=(e,t,o)=>(o=e!=null?p(x(e)):{},n(t||!e||!e.__esModule?a(o,"default",{value:e,enumerable:!0}):o,e)),u=e=>n(a({},"__esModule",{value:!0}),e);var w={};g(w,{default:()=>R});module.exports=u(w);var r=require("react/jsx-runtime"),v=l(require("react")),b=l(require("@radix-ui/react-checkbox")),c=require("../helpers/index.js"),f=require("class-variance-authority");const C=e=>(0,r.jsx)("svg",{width:"20",height:"20",viewBox:"0 0 20 20",fill:"none",xmlns:"http://www.w3.org/2000/svg",...e,children:(0,r.jsx)("path",{d:"M7.5 15.8333L1.66667 10L3.75 7.91667L7.5 11.6667L16.25 3L18.3333 5.08333L7.5 15.8333Z",fill:"currentColor"})}),P=(0,f.cva)("border-primary ring-offset-background focus-visible:ring-ring data-[state=checked]:bg-brand-0 disabled:bg-btn-primary-disabled peer shrink-0 rounded-sm border focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:text-white",{variants:{size:{sm:"size-[14px]",base:"size-4",lg:"size-5"}},defaultVariants:{size:"base"}}),d=v.forwardRef(({className:e,size:t,iconClassName:o,...s},i)=>(0,r.jsx)(b.Root,{ref:i,className:(0,c.cn)(P({size:t}),e),...s,children:(0,r.jsx)(b.Indicator,{className:(0,c.cn)("flex size-full items-center justify-center text-current"),children:(0,r.jsx)(C,{width:16,height:12,className:o})})}));d.displayName="Checkbox";var R=d;
|
|
2
2
|
//# sourceMappingURL=checkbox.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/checkbox.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport * as CheckboxPrimitive from '@radix-ui/react-checkbox'\n// import { CheckIcon } from '@radix-ui/react-icons'\n\nimport { cn } from '../helpers/index.js'\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nconst CheckIcon = (props: React.SVGProps<SVGSVGElement>) => {\n return (\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" {...props}>\n <path\n d=\"M7.5 15.8333L1.66667 10L3.75 7.91667L7.5 11.6667L16.25 3L18.3333 5.08333L7.5 15.8333Z\"\n fill=\"currentColor\"\n />\n </svg>\n )\n}\n\nconst checkboxVariants = cva(\n 'border-primary ring-offset-background focus-visible:ring-ring data-[state=checked]:bg-
|
|
5
|
-
"mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAYM,IAAAI,EAAA,6BAVNC,EAAuB,oBACvBC,EAAmC,uCAGnCC,EAAmB,+BACnBC,EAAuC,oCAEvC,MAAMC,EAAaC,MAEf,OAAC,OAAI,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAA8B,GAAGA,EACjG,mBAAC,QACC,EAAE,wFACF,KAAK,eACP,EACF,EAIEC,KAAmB,OACvB,
|
|
4
|
+
"sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport * as CheckboxPrimitive from '@radix-ui/react-checkbox'\n// import { CheckIcon } from '@radix-ui/react-icons'\n\nimport { cn } from '../helpers/index.js'\nimport { cva, type VariantProps } from 'class-variance-authority'\n\nconst CheckIcon = (props: React.SVGProps<SVGSVGElement>) => {\n return (\n <svg width=\"20\" height=\"20\" viewBox=\"0 0 20 20\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\" {...props}>\n <path\n d=\"M7.5 15.8333L1.66667 10L3.75 7.91667L7.5 11.6667L16.25 3L18.3333 5.08333L7.5 15.8333Z\"\n fill=\"currentColor\"\n />\n </svg>\n )\n}\n\nconst checkboxVariants = cva(\n 'border-primary ring-offset-background focus-visible:ring-ring data-[state=checked]:bg-brand-0 disabled:bg-btn-primary-disabled peer shrink-0 rounded-sm border focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:text-white',\n {\n variants: {\n size: {\n sm: 'size-[14px]',\n base: 'size-4',\n lg: 'size-5',\n },\n },\n defaultVariants: {\n size: 'base',\n },\n }\n)\n\ninterface CheckboxProps\n extends React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>, VariantProps<typeof checkboxVariants> {\n iconClassName?: string\n}\n\n/**\n * Checkbox - \u590D\u9009\u6846\n *\n * @description \u5141\u8BB8\u7528\u6237\u8FDB\u884C\u591A\u9009\u64CD\u4F5C\u7684\u590D\u9009\u6846\u7EC4\u4EF6\uFF0C\u652F\u6301\u4E0D\u540C\u5C3A\u5BF8\u548C\u81EA\u5B9A\u4E49\u56FE\u6807\n */\nconst Checkbox = React.forwardRef<React.ElementRef<typeof CheckboxPrimitive.Root>, CheckboxProps>(\n ({ className, size, iconClassName, ...props }, ref) => (\n <CheckboxPrimitive.Root ref={ref} className={cn(checkboxVariants({ size }), className)} {...props}>\n <CheckboxPrimitive.Indicator className={cn('flex size-full items-center justify-center text-current')}>\n <CheckIcon width={16} height={12} className={iconClassName} />\n </CheckboxPrimitive.Indicator>\n </CheckboxPrimitive.Root>\n )\n)\nCheckbox.displayName = 'Checkbox'\n\nexport default Checkbox\nexport type { CheckboxProps }\n"],
|
|
5
|
+
"mappings": "ukBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,aAAAE,IAAA,eAAAC,EAAAH,GAYM,IAAAI,EAAA,6BAVNC,EAAuB,oBACvBC,EAAmC,uCAGnCC,EAAmB,+BACnBC,EAAuC,oCAEvC,MAAMC,EAAaC,MAEf,OAAC,OAAI,MAAM,KAAK,OAAO,KAAK,QAAQ,YAAY,KAAK,OAAO,MAAM,6BAA8B,GAAGA,EACjG,mBAAC,QACC,EAAE,wFACF,KAAK,eACP,EACF,EAIEC,KAAmB,OACvB,6TACA,CACE,SAAU,CACR,KAAM,CACJ,GAAI,cACJ,KAAM,SACN,GAAI,QACN,CACF,EACA,gBAAiB,CACf,KAAM,MACR,CACF,CACF,EAYMC,EAAWP,EAAM,WACrB,CAAC,CAAE,UAAAQ,EAAW,KAAAC,EAAM,cAAAC,EAAe,GAAGL,CAAM,EAAGM,OAC7C,OAACV,EAAkB,KAAlB,CAAuB,IAAKU,EAAK,aAAW,MAAGL,EAAiB,CAAE,KAAAG,CAAK,CAAC,EAAGD,CAAS,EAAI,GAAGH,EAC1F,mBAACJ,EAAkB,UAAlB,CAA4B,aAAW,MAAG,yDAAyD,EAClG,mBAACG,EAAA,CAAU,MAAO,GAAI,OAAQ,GAAI,UAAWM,EAAe,EAC9D,EACF,CAEJ,EACAH,EAAS,YAAc,WAEvB,IAAOV,EAAQU",
|
|
6
6
|
"names": ["checkbox_exports", "__export", "checkbox_default", "__toCommonJS", "import_jsx_runtime", "React", "CheckboxPrimitive", "import_helpers", "import_class_variance_authority", "CheckIcon", "props", "checkboxVariants", "Checkbox", "className", "size", "iconClassName", "ref"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use strict";var
|
|
1
|
+
"use strict";var u=Object.create;var a=Object.defineProperty;var S=Object.getOwnPropertyDescriptor;var C=Object.getOwnPropertyNames;var R=Object.getPrototypeOf,z=Object.prototype.hasOwnProperty;var L=(t,e)=>{for(var o in e)a(t,o,{get:e[o],enumerable:!0})},x=(t,e,o,p)=>{if(e&&typeof e=="object"||typeof e=="function")for(let r of C(e))!z.call(t,r)&&r!==o&&a(t,r,{get:()=>e[r],enumerable:!(p=S(e,r))||p.enumerable});return t};var E=(t,e,o)=>(o=t!=null?u(R(t)):{},x(e||!t||!t.__esModule?a(o,"default",{value:t,enumerable:!0}):o,t)),N=t=>x(a({},"__esModule",{value:!0}),t);var k={};L(k,{Text:()=>s});module.exports=N(k);var i=require("react/jsx-runtime"),V=E(require("react")),d=require("@radix-ui/react-slot"),P=require("class-variance-authority"),c=require("@payloadcms/richtext-lexical/html"),f=require("../helpers/index.js");const W=(0,P.cva)("text-pretty tracking-[-0.02em]",{variants:{size:{none:"tracking",1:"text-[12px] leading-[140%]",2:"text-[14px] leading-[140%]",3:"text-[16px] leading-[140%]",4:"text-[18px] leading-[140%]"},weight:{medium:"font-medium",semibold:"font-semibold",bold:"font-bold",extraBold:"font-extrabold",black:"font-black"},align:{left:"text-left",center:"text-center",right:"text-right"}},defaultVariants:{size:"none",weight:"bold"}}),s=V.forwardRef((t,e)=>{const{children:o,size:p="none",weight:r,align:T,className:g,asChild:h,as:y="span",color:l,html:n,...b}=t,m=n?{dangerouslySetInnerHTML:{__html:typeof n=="string"?n:(0,c.convertLexicalToHTML)({data:n})}}:null,v=l?{style:{color:l}}:null;return(0,i.jsx)(d.Slot,{...b,ref:e,className:(0,f.cn)(W({size:p,weight:r,align:T}),g),...m,...v,children:h?o:(0,i.jsx)(y,{children:m?null:o})})});s.displayName="Text";
|
|
2
2
|
//# sourceMappingURL=text.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/components/text.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as React from 'react'\nimport { Slot } from '@radix-ui/react-slot'\nimport { type VariantProps, cva } from 'class-variance-authority'\nimport { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\nimport type { SerializedEditorState, SerializedLexicalNode } from 'lexical'\nimport { cn } from '../helpers/index.js'\nimport type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js'\n\nconst textVariants = cva('text-pretty tracking-[-0.02em]', {\n variants: {\n size: {\n none: 'tracking',\n 1: 'text-[12px] leading-[140%]',\n 2: 'text-[14px] leading-[140%]',\n 3: 'text-[16px] leading-[140%]',\n 4: 'text-[18px] leading-[140%]',\n },\n weight: {\n medium: 'font-medium',\n semibold: 'font-semibold',\n bold: 'font-bold',\n extraBold: 'font-extrabold',\n black: 'font-black',\n },\n align: {\n left: 'text-left',\n center: 'text-center',\n right: 'text-right',\n },\n },\n defaultVariants: {\n size: 'none',\n weight: 'bold',\n },\n})\n\ntype TextElement = React.ElementRef<'span'>\ntype TextSpanProps = { as?: 'span' } & ComponentPropsWithout<'span', RemovedProps>\ntype TextDivProps = { as: 'div' } & ComponentPropsWithout<'div', RemovedProps>\ntype TextLabelProps = { as: 'label' } & ComponentPropsWithout<'label', RemovedProps>\ntype TextPProps = { as: 'p' } & ComponentPropsWithout<'p', RemovedProps>\n\ninterface CommonTextProps extends VariantProps<typeof textVariants> {\n as?: 'div' | 'label' | 'p' | 'span'\n asChild?: boolean\n color?: string\n /** \u76F8\u5F53\u4E8E dangerouslySetInnerHTML */\n html?: string | SerializedEditorState<SerializedLexicalNode>\n}\n\ntype TextProps = CommonTextProps & (TextSpanProps | TextDivProps | TextLabelProps | TextPProps)\n\n/**\n * Text - \u6587\u672C\u7EC4\u4EF6\n *\n * @description \u7528\u4E8E\u663E\u793A\u6587\u672C\u5185\u5BB9\u7684\u7EC4\u4EF6\uFF0C\u652F\u6301\u591A\u79CD\u5C3A\u5BF8\u3001\u5B57\u91CD\u3001\u5BF9\u9F50\u65B9\u5F0F\u548CHTML\u5185\u5BB9\n *\n * @param {object} props - \u7EC4\u4EF6\u5C5E\u6027\n * @param {1|2|3|4|\"none\"} props.size - \u6587\u5B57\u5C3A\u5BF8\n * - `1`: 12px (\u5C0F\u53F7\u6587\u5B57\uFF0C\u9002\u7528\u4E8E\u8BF4\u660E\u6587\u5B57)\n * - `2`: 14px (\u5E38\u89C4\u6587\u5B57\uFF0C\u9002\u7528\u4E8E\u6B63\u6587\u5185\u5BB9)\n * - `3`: 16px (\u4E2D\u53F7\u6587\u5B57\uFF0C\u9002\u7528\u4E8E\u91CD\u8981\u5185\u5BB9)\n * - `4`: 18px (\u5927\u53F7\u6587\u5B57\uFF0C\u9002\u7528\u4E8E\u6807\u9898\u6216\u5F3A\u8C03\u5185\u5BB9)\n * - `none`: \u65E0\u9884\u8BBE\u5927\u5C0F\uFF0C\u7EE7\u627F\u7236\u7EA7\u6837\u5F0F\n * @param {\"medium\"|\"semibold\"|\"bold\"|\"extraBold\"|\"black\"} props.weight - \u5B57\u91CD\n * @param {\"left\"|\"center\"|\"right\"} props.align - \u6587\u5B57\u5BF9\u9F50\u65B9\u5F0F\n * @param {\"div\"|\"label\"|\"p\"|\"span\"} props.as - \u6E32\u67D3\u7684 HTML \u6807\u7B7E\n * @param {boolean} props.asChild - \u662F\u5426\u4F5C\u4E3A\u5B50\u7EC4\u4EF6\u6E32\u67D3\n * @param {string} props.color - \u6587\u5B57\u989C\u8272\n * @param {string|SerializedEditorState} props.html - HTML \u5185\u5BB9\u6216\u5BCC\u6587\u672C\u7F16\u8F91\u5668\u72B6\u6001\n *\n * @example\n * ```tsx\n * // \u57FA\u7840\u7528\u6CD5\n * <Text size={2}>\u8FD9\u662F\u4E00\u6BB5\u6B63\u6587</Text>\n *\n * // \u5927\u53F7\u52A0\u7C97\u6587\u5B57\n * <Text size={4} weight=\"bold\">\u91CD\u8981\u6807\u9898</Text>\n *\n * // \u5C45\u4E2D\u5BF9\u9F50\u7684\u5C0F\u53F7\u6587\u5B57\n * <Text size={1} align=\"center\">\u8BF4\u660E\u6587\u5B57</Text>\n *\n * // \u6E32\u67D3\u4E3A\u6BB5\u843D\u6807\u7B7E\n * <Text as=\"p\" size={3}>\u6BB5\u843D\u5185\u5BB9</Text>\n * ```\n */\nconst Text = React.forwardRef<TextElement, TextProps>((props, forwardedRef) => {\n const {\n children,\n size = 'none', // \u4E3A\u4E86\u517C\u5BB9\u65E7\u7248\u672C\u6837\u5F0F\uFF0C\u9ED8\u8BA4\u503C\u4E3A none\uFF0C\u6CA1\u6709\u9ED8\u8BA4\u7684\u5B57\u4F53\u5927\u5C0F\n weight,\n align,\n className,\n asChild,\n as: Tag = 'span',\n color,\n html,\n ...textProps\n } = props\n\n const htmlContentProps = html\n ? {\n dangerouslySetInnerHTML: { __html: typeof html === 'string' ? html : convertLexicalToHTML({ data: html }) },\n }\n : null\n\n const styleProps = color\n ? {\n style: {\n color,\n },\n }\n : null\n\n return (\n <Slot\n {...textProps}\n ref={forwardedRef}\n className={cn(\n textVariants({\n size,\n weight
|
|
5
|
-
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,UAAAE,IAAA,eAAAC,EAAAH,GAiI4B,IAAAI,EAAA,6BAjI5BC,EAAuB,oBACvBC,EAAqB,gCACrBC,EAAuC,oCACvCC,EAAqC,6CAErCC,EAAmB,+BAGnB,MAAMC,KAAe,OAAI,iCAAkC,CACzD,SAAU,CACR,KAAM,CACJ,KAAM,WACN,EAAG,6BACH,EAAG,6BACH,EAAG,6BACH,EAAG,4BACL,EACA,OAAQ,CACN,OAAQ,cACR,SAAU,gBACV,KAAM,YACN,UAAW,iBACX,MAAO,YACT,EACA,MAAO,CACL,KAAM,YACN,OAAQ,cACR,MAAO,YACT,CACF,EACA,gBAAiB,CACf,KAAM,OACN,OAAQ,MACV,CACF,CAAC,EAoDKR,EAAOG,EAAM,WAAmC,CAACM,EAAOC,IAAiB,CAC7E,KAAM,CACJ,SAAAC,EACA,KAAAC,EAAO,OACP,OAAAC,EACA,MAAAC,EACA,UAAAC,EACA,QAAAC,EACA,GAAIC,EAAM,OACV,MAAAC,EACA,KAAAC,EACA,GAAGC,CACL,EAAIX,EAEEY,EAAmBF,EACrB,CACE,wBAAyB,CAAE,OAAQ,OAAOA,GAAS,SAAWA,KAAO,wBAAqB,CAAE,KAAMA,CAAK,CAAC,CAAE,CAC5G,EACA,KAEEG,EAAaJ,EACf,CACE,MAAO,CACL,MAAAA,CACF,CACF,EACA,KAEJ,SACE,OAAC,QACE,GAAGE,EACJ,IAAKV,EACL,aAAW,MACTF,EAAa,CACX,KAAAI,EACA,
|
|
4
|
+
"sourcesContent": ["import * as React from 'react'\nimport { Slot } from '@radix-ui/react-slot'\nimport { type VariantProps, cva } from 'class-variance-authority'\nimport { convertLexicalToHTML } from '@payloadcms/richtext-lexical/html'\nimport type { SerializedEditorState, SerializedLexicalNode } from 'lexical'\nimport { cn } from '../helpers/index.js'\nimport type { ComponentPropsWithout, RemovedProps } from '../helpers/component-props.js'\n\nconst textVariants = cva('text-pretty tracking-[-0.02em]', {\n variants: {\n size: {\n none: 'tracking',\n 1: 'text-[12px] leading-[140%]',\n 2: 'text-[14px] leading-[140%]',\n 3: 'text-[16px] leading-[140%]',\n 4: 'text-[18px] leading-[140%]',\n },\n weight: {\n medium: 'font-medium',\n semibold: 'font-semibold',\n bold: 'font-bold',\n extraBold: 'font-extrabold',\n black: 'font-black',\n },\n align: {\n left: 'text-left',\n center: 'text-center',\n right: 'text-right',\n },\n },\n defaultVariants: {\n size: 'none',\n weight: 'bold',\n },\n})\n\ntype TextElement = React.ElementRef<'span'>\ntype TextSpanProps = { as?: 'span' } & ComponentPropsWithout<'span', RemovedProps>\ntype TextDivProps = { as: 'div' } & ComponentPropsWithout<'div', RemovedProps>\ntype TextLabelProps = { as: 'label' } & ComponentPropsWithout<'label', RemovedProps>\ntype TextPProps = { as: 'p' } & ComponentPropsWithout<'p', RemovedProps>\n\ninterface CommonTextProps extends VariantProps<typeof textVariants> {\n as?: 'div' | 'label' | 'p' | 'span'\n asChild?: boolean\n color?: string\n /** \u76F8\u5F53\u4E8E dangerouslySetInnerHTML */\n html?: string | SerializedEditorState<SerializedLexicalNode>\n}\n\ntype TextProps = CommonTextProps & (TextSpanProps | TextDivProps | TextLabelProps | TextPProps)\n\n/**\n * Text - \u6587\u672C\u7EC4\u4EF6\n *\n * @description \u7528\u4E8E\u663E\u793A\u6587\u672C\u5185\u5BB9\u7684\u7EC4\u4EF6\uFF0C\u652F\u6301\u591A\u79CD\u5C3A\u5BF8\u3001\u5B57\u91CD\u3001\u5BF9\u9F50\u65B9\u5F0F\u548CHTML\u5185\u5BB9\n *\n * @param {object} props - \u7EC4\u4EF6\u5C5E\u6027\n * @param {1|2|3|4|\"none\"} props.size - \u6587\u5B57\u5C3A\u5BF8\n * - `1`: 12px (\u5C0F\u53F7\u6587\u5B57\uFF0C\u9002\u7528\u4E8E\u8BF4\u660E\u6587\u5B57)\n * - `2`: 14px (\u5E38\u89C4\u6587\u5B57\uFF0C\u9002\u7528\u4E8E\u6B63\u6587\u5185\u5BB9)\n * - `3`: 16px (\u4E2D\u53F7\u6587\u5B57\uFF0C\u9002\u7528\u4E8E\u91CD\u8981\u5185\u5BB9)\n * - `4`: 18px (\u5927\u53F7\u6587\u5B57\uFF0C\u9002\u7528\u4E8E\u6807\u9898\u6216\u5F3A\u8C03\u5185\u5BB9)\n * - `none`: \u65E0\u9884\u8BBE\u5927\u5C0F\uFF0C\u7EE7\u627F\u7236\u7EA7\u6837\u5F0F\n * @param {\"medium\"|\"semibold\"|\"bold\"|\"extraBold\"|\"black\"} props.weight - \u5B57\u91CD\n * @param {\"left\"|\"center\"|\"right\"} props.align - \u6587\u5B57\u5BF9\u9F50\u65B9\u5F0F\n * @param {\"div\"|\"label\"|\"p\"|\"span\"} props.as - \u6E32\u67D3\u7684 HTML \u6807\u7B7E\n * @param {boolean} props.asChild - \u662F\u5426\u4F5C\u4E3A\u5B50\u7EC4\u4EF6\u6E32\u67D3\n * @param {string} props.color - \u6587\u5B57\u989C\u8272\n * @param {string|SerializedEditorState} props.html - HTML \u5185\u5BB9\u6216\u5BCC\u6587\u672C\u7F16\u8F91\u5668\u72B6\u6001\n *\n * @example\n * ```tsx\n * // \u57FA\u7840\u7528\u6CD5\n * <Text size={2}>\u8FD9\u662F\u4E00\u6BB5\u6B63\u6587</Text>\n *\n * // \u5927\u53F7\u52A0\u7C97\u6587\u5B57\n * <Text size={4} weight=\"bold\">\u91CD\u8981\u6807\u9898</Text>\n *\n * // \u5C45\u4E2D\u5BF9\u9F50\u7684\u5C0F\u53F7\u6587\u5B57\n * <Text size={1} align=\"center\">\u8BF4\u660E\u6587\u5B57</Text>\n *\n * // \u6E32\u67D3\u4E3A\u6BB5\u843D\u6807\u7B7E\n * <Text as=\"p\" size={3}>\u6BB5\u843D\u5185\u5BB9</Text>\n * ```\n */\nconst Text = React.forwardRef<TextElement, TextProps>((props, forwardedRef) => {\n const {\n children,\n size = 'none', // \u4E3A\u4E86\u517C\u5BB9\u65E7\u7248\u672C\u6837\u5F0F\uFF0C\u9ED8\u8BA4\u503C\u4E3A none\uFF0C\u6CA1\u6709\u9ED8\u8BA4\u7684\u5B57\u4F53\u5927\u5C0F\n weight,\n align,\n className,\n asChild,\n as: Tag = 'span',\n color,\n html,\n ...textProps\n } = props\n\n const htmlContentProps = html\n ? {\n dangerouslySetInnerHTML: { __html: typeof html === 'string' ? html : convertLexicalToHTML({ data: html }) },\n }\n : null\n\n const styleProps = color\n ? {\n style: {\n color,\n },\n }\n : null\n\n return (\n <Slot\n {...textProps}\n ref={forwardedRef}\n className={cn(\n textVariants({\n size,\n weight,\n align,\n }),\n className\n )}\n {...htmlContentProps}\n {...styleProps}\n >\n {asChild ? children : <Tag>{htmlContentProps ? null : children}</Tag>}\n </Slot>\n )\n})\nText.displayName = 'Text'\n\nexport { Text }\nexport type { TextProps }\n"],
|
|
5
|
+
"mappings": "0jBAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,UAAAE,IAAA,eAAAC,EAAAH,GAiI4B,IAAAI,EAAA,6BAjI5BC,EAAuB,oBACvBC,EAAqB,gCACrBC,EAAuC,oCACvCC,EAAqC,6CAErCC,EAAmB,+BAGnB,MAAMC,KAAe,OAAI,iCAAkC,CACzD,SAAU,CACR,KAAM,CACJ,KAAM,WACN,EAAG,6BACH,EAAG,6BACH,EAAG,6BACH,EAAG,4BACL,EACA,OAAQ,CACN,OAAQ,cACR,SAAU,gBACV,KAAM,YACN,UAAW,iBACX,MAAO,YACT,EACA,MAAO,CACL,KAAM,YACN,OAAQ,cACR,MAAO,YACT,CACF,EACA,gBAAiB,CACf,KAAM,OACN,OAAQ,MACV,CACF,CAAC,EAoDKR,EAAOG,EAAM,WAAmC,CAACM,EAAOC,IAAiB,CAC7E,KAAM,CACJ,SAAAC,EACA,KAAAC,EAAO,OACP,OAAAC,EACA,MAAAC,EACA,UAAAC,EACA,QAAAC,EACA,GAAIC,EAAM,OACV,MAAAC,EACA,KAAAC,EACA,GAAGC,CACL,EAAIX,EAEEY,EAAmBF,EACrB,CACE,wBAAyB,CAAE,OAAQ,OAAOA,GAAS,SAAWA,KAAO,wBAAqB,CAAE,KAAMA,CAAK,CAAC,CAAE,CAC5G,EACA,KAEEG,EAAaJ,EACf,CACE,MAAO,CACL,MAAAA,CACF,CACF,EACA,KAEJ,SACE,OAAC,QACE,GAAGE,EACJ,IAAKV,EACL,aAAW,MACTF,EAAa,CACX,KAAAI,EACA,OAAAC,EACA,MAAAC,CACF,CAAC,EACDC,CACF,EACC,GAAGM,EACH,GAAGC,EAEH,SAAAN,EAAUL,KAAW,OAACM,EAAA,CAAK,SAAAI,EAAmB,KAAOV,EAAS,EACjE,CAEJ,CAAC,EACDX,EAAK,YAAc",
|
|
6
6
|
"names": ["text_exports", "__export", "Text", "__toCommonJS", "import_jsx_runtime", "React", "import_react_slot", "import_class_variance_authority", "import_html", "import_helpers", "textVariants", "props", "forwardedRef", "children", "size", "weight", "align", "className", "asChild", "Tag", "color", "html", "textProps", "htmlContentProps", "styleProps"]
|
|
7
7
|
}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import type { Decorator } from '@storybook/react';
|
|
2
|
+
export declare function createDataPropsDecorator(topLevelProps?: string[]): Decorator;
|
|
3
|
+
/**
|
|
4
|
+
* 预设的 Decorator 配置
|
|
5
|
+
*/
|
|
6
|
+
export declare const commonDataPropsDecorator: Decorator;
|
|
7
|
+
/**
|
|
8
|
+
* 带自定义顶层字段的 Decorator 生成器
|
|
9
|
+
*
|
|
10
|
+
* @example
|
|
11
|
+
* ```tsx
|
|
12
|
+
* // 将 visible, loading 也保持在顶层
|
|
13
|
+
* decorators: [createDataPropsDecorator(['visible', 'loading'])]
|
|
14
|
+
* ```
|
|
15
|
+
*/
|
|
16
|
+
export { createDataPropsDecorator as default };
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
"use strict";var u=Object.defineProperty;var m=Object.getOwnPropertyDescriptor;var j=Object.getOwnPropertyNames;var v=Object.prototype.hasOwnProperty;var N=(s,r)=>{for(var c in r)u(s,c,{get:r[c],enumerable:!0})},R=(s,r,c,n)=>{if(r&&typeof r=="object"||typeof r=="function")for(let o of j(r))!v.call(s,o)&&o!==c&&u(s,o,{get:()=>r[o],enumerable:!(n=m(r,o))||n.enumerable});return s};var y=s=>R(u({},"__esModule",{value:!0}),s);var T={};N(T,{commonDataPropsDecorator:()=>O,createDataPropsDecorator:()=>D,default:()=>D});module.exports=y(T);var g=require("react/jsx-runtime"),A=require("react");function L(s,r,c){const n=r.split(".");let o=s;for(let l=0;l<n.length-1;l++){const a=n[l];(!o[a]||typeof o[a]!="object")&&(o[a]={}),o=o[a]}o[n[n.length-1]]=c}function D(s=[]){const c=[...["className","classNames","style","ref","key","children"],...s],n=(o,l)=>{const{args:a}=l,f={},P={};Object.keys(a).forEach(t=>{if(t.startsWith("data.")){const i=t.substring(5);L(P,i,a[t])}else t.startsWith("on")&&typeof a[t]=="function"||c.includes(t)?f[t]=a[t]:t==="data"&&typeof a[t]=="object"||(f[t]=a[t])});function b(t,i){const p={...t};return d(t)&&d(i)&&Object.keys(i).forEach(e=>{d(i[e])&&e in t?p[e]=b(t[e],i[e]):p[e]=i[e]}),p}function d(t){return t&&typeof t=="object"&&!Array.isArray(t)}const h=b(a.data||{},P);return(0,g.jsx)(o,{args:{...f,data:{...h}}})};return n.displayName="DataPropsDecorator",n}const O=D();
|
|
2
|
+
//# sourceMappingURL=dataPropsDecorator.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../../../src/stories/decorators/dataPropsDecorator.tsx"],
|
|
4
|
+
"sourcesContent": ["import React from 'react'\nimport type { Decorator } from '@storybook/react'\n\n/**\n * Storybook Decorator: \u5904\u7406\u5D4C\u5957\u7684 data.* argTypes\uFF0C\u786E\u4FDD\u63A7\u4EF6\u4FEE\u6539\u80FD\u89E6\u53D1\u7EC4\u4EF6\u66F4\u65B0\n *\n * \u7528\u4E8E\u89E3\u51B3\u4F7F\u7528 data prop \u7684\u7EC4\u4EF6\u5728 Storybook \u4E2D\u63A7\u4EF6\u4E0D\u54CD\u5E94\u7684\u95EE\u9898\u3002\n * \u652F\u6301\u5728 Storybook \u63A7\u4EF6\u9762\u677F\u4E2D\u4FDD\u6301 'data.title' \u683C\u5F0F\u663E\u793A\u3002\n *\n * @example\n * ```tsx\n * import { createDataPropsDecorator } from '../decorators/dataPropsDecorator'\n *\n * const meta: Meta<typeof MyComponent> = {\n * component: MyComponent,\n * decorators: [createDataPropsDecorator()],\n * argTypes: {\n * // \u4FDD\u6301\u5D4C\u5957\u683C\u5F0F\uFF0C\u5728\u63A7\u4EF6\u9762\u677F\u663E\u793A\u4E3A data.title\n * 'data.title': { control: 'text' },\n * 'data.theme': { control: 'select', options: ['light', 'dark'] },\n * },\n * }\n * ```\n *\n * @param topLevelProps - \u9700\u8981\u4FDD\u6301\u5728\u9876\u5C42\u7684\u5B57\u6BB5\u540D\u6570\u7EC4\uFF08\u9ED8\u8BA4\u5305\u542B className, classNames, \u548C\u6240\u6709 on* \u4E8B\u4EF6\u5904\u7406\u5668\uFF09\n * @returns Storybook Decorator\n */\n/**\n * \u8F85\u52A9\u51FD\u6570\uFF1A\u5C06\u8DEF\u5F84\u5B57\u7B26\u4E32\u8F6C\u6362\u4E3A\u5D4C\u5957\u5BF9\u8C61\n * @example setNestedValue({}, 'primaryButton.text', 'Shop Now')\n * // => { primaryButton: { text: 'Shop Now' } }\n */\nfunction setNestedValue(obj: Record<string, any>, path: string, value: any): void {\n const keys = path.split('.')\n let current = obj\n\n for (let i = 0; i < keys.length - 1; i++) {\n const key = keys[i]\n if (!current[key] || typeof current[key] !== 'object') {\n current[key] = {}\n }\n current = current[key]\n }\n\n current[keys[keys.length - 1]] = value\n}\n\nexport function createDataPropsDecorator(topLevelProps: string[] = []): Decorator {\n // \u9ED8\u8BA4\u4FDD\u6301\u5728\u9876\u5C42\u7684\u5B57\u6BB5\n const defaultTopLevelProps = ['className', 'classNames', 'style', 'ref', 'key', 'children']\n\n const allTopLevelProps = [...defaultTopLevelProps, ...topLevelProps]\n\n const DataPropsDecorator: Decorator = (Story, context) => {\n const { args } = context\n\n // \u5206\u79BB\u9876\u5C42 props \u548C data props\n const topProps: Record<string, any> = {}\n const dataProps: Record<string, any> = {}\n\n Object.keys(args).forEach(key => {\n // \u5904\u7406\u5D4C\u5957\u7684 'data.xxx' \u683C\u5F0F\uFF08\u53EF\u80FD\u662F\u591A\u5C42\u5D4C\u5957\uFF0C\u5982 data.primaryButton.text\uFF09\n if (key.startsWith('data.')) {\n const nestedPath = key.substring(5) // \u79FB\u9664 'data.' \u524D\u7F00\n setNestedValue(dataProps, nestedPath, args[key])\n }\n // \u4E8B\u4EF6\u5904\u7406\u5668\uFF08on* \u5F00\u5934\uFF09\u4FDD\u6301\u5728\u9876\u5C42\n else if (key.startsWith('on') && typeof args[key] === 'function') {\n topProps[key] = args[key]\n }\n // \u660E\u786E\u6307\u5B9A\u7684\u9876\u5C42\u5B57\u6BB5\n else if (allTopLevelProps.includes(key)) {\n topProps[key] = args[key]\n }\n // \u5982\u679C\u5DF2\u7ECF\u6709\u5B8C\u6574\u7684 data \u5BF9\u8C61\uFF08\u6765\u81EA Story args\uFF09\uFF0C\u4FDD\u7559\u5B83\n else if (key === 'data' && typeof args[key] === 'object') {\n // \u7A0D\u540E\u5904\u7406\n }\n // \u5176\u4ED6\u5B57\u6BB5\u4E5F\u653E\u5165\u9876\u5C42\uFF08\u5982\u81EA\u5B9A\u4E49\u4E8B\u4EF6\uFF09\n else {\n topProps[key] = args[key]\n }\n })\n\n // \u6DF1\u5EA6\u5408\u5E76 data \u5BF9\u8C61\n // \u4F7F\u7528\u9012\u5F52\u5408\u5E76\u786E\u4FDD\u5D4C\u5957\u5BF9\u8C61\u6B63\u786E\u5408\u5E76\n function deepMerge(target: any, source: any): any {\n const output = { ...target }\n if (isObject(target) && isObject(source)) {\n Object.keys(source).forEach(key => {\n if (isObject(source[key])) {\n if (!(key in target)) {\n output[key] = source[key]\n } else {\n output[key] = deepMerge(target[key], source[key])\n }\n } else {\n output[key] = source[key]\n }\n })\n }\n return output\n }\n\n function isObject(item: any): boolean {\n return item && typeof item === 'object' && !Array.isArray(item)\n }\n\n // \u5408\u5E76 data: \u4F18\u5148\u4F7F\u7528\u4ECE 'data.xxx' \u89E3\u6790\u7684\u503C\uFF0C\u7136\u540E\u662F\u539F\u59CB data \u5BF9\u8C61\n const finalData = deepMerge(args.data || {}, dataProps)\n\n // \u5173\u952E\uFF1A\u6BCF\u6B21\u90FD\u521B\u5EFA\u65B0\u7684 data \u5BF9\u8C61\uFF0C\u786E\u4FDD React \u68C0\u6D4B\u5230\u53D8\u5316\n return <Story args={{ ...topProps, data: { ...finalData } }} />\n }\n\n // \u8BBE\u7F6E displayName \u4EE5\u6EE1\u8DB3 ESLint react/display-name \u89C4\u5219\n ;(DataPropsDecorator as any).displayName = 'DataPropsDecorator'\n return DataPropsDecorator\n}\n\n/**\n * \u9884\u8BBE\u7684 Decorator \u914D\u7F6E\n */\nexport const commonDataPropsDecorator = createDataPropsDecorator()\n\n/**\n * \u5E26\u81EA\u5B9A\u4E49\u9876\u5C42\u5B57\u6BB5\u7684 Decorator \u751F\u6210\u5668\n *\n * @example\n * ```tsx\n * // \u5C06 visible, loading \u4E5F\u4FDD\u6301\u5728\u9876\u5C42\n * decorators: [createDataPropsDecorator(['visible', 'loading'])]\n * ```\n */\nexport { createDataPropsDecorator as default }\n"],
|
|
5
|
+
"mappings": "yaAAA,IAAAA,EAAA,GAAAC,EAAAD,EAAA,8BAAAE,EAAA,6BAAAC,EAAA,YAAAA,IAAA,eAAAC,EAAAJ,GAgHW,IAAAK,EAAA,6BAhHXC,EAAkB,iBAgClB,SAASC,EAAeC,EAA0BC,EAAcC,EAAkB,CAChF,MAAMC,EAAOF,EAAK,MAAM,GAAG,EAC3B,IAAIG,EAAUJ,EAEd,QAASK,EAAI,EAAGA,EAAIF,EAAK,OAAS,EAAGE,IAAK,CACxC,MAAMC,EAAMH,EAAKE,CAAC,GACd,CAACD,EAAQE,CAAG,GAAK,OAAOF,EAAQE,CAAG,GAAM,YAC3CF,EAAQE,CAAG,EAAI,CAAC,GAElBF,EAAUA,EAAQE,CAAG,CACvB,CAEAF,EAAQD,EAAKA,EAAK,OAAS,CAAC,CAAC,EAAID,CACnC,CAEO,SAASP,EAAyBY,EAA0B,CAAC,EAAc,CAIhF,MAAMC,EAAmB,CAAC,GAFG,CAAC,YAAa,aAAc,QAAS,MAAO,MAAO,UAAU,EAEvC,GAAGD,CAAa,EAE7DE,EAAgC,CAACC,EAAOC,IAAY,CACxD,KAAM,CAAE,KAAAC,CAAK,EAAID,EAGXE,EAAgC,CAAC,EACjCC,EAAiC,CAAC,EAExC,OAAO,KAAKF,CAAI,EAAE,QAAQN,GAAO,CAE/B,GAAIA,EAAI,WAAW,OAAO,EAAG,CAC3B,MAAMS,EAAaT,EAAI,UAAU,CAAC,EAClCP,EAAee,EAAWC,EAAYH,EAAKN,CAAG,CAAC,CACjD,MAESA,EAAI,WAAW,IAAI,GAAK,OAAOM,EAAKN,CAAG,GAAM,YAI7CE,EAAiB,SAASF,CAAG,EAHpCO,EAASP,CAAG,EAAIM,EAAKN,CAAG,EAOjBA,IAAQ,QAAU,OAAOM,EAAKN,CAAG,GAAM,WAK9CO,EAASP,CAAG,EAAIM,EAAKN,CAAG,EAE5B,CAAC,EAID,SAASU,EAAUC,EAAaC,EAAkB,CAChD,MAAMC,EAAS,CAAE,GAAGF,CAAO,EAC3B,OAAIG,EAASH,CAAM,GAAKG,EAASF,CAAM,GACrC,OAAO,KAAKA,CAAM,EAAE,QAAQZ,GAAO,CAC7Bc,EAASF,EAAOZ,CAAG,CAAC,GAChBA,KAAOW,EAGXE,EAAOb,CAAG,EAAIU,EAAUC,EAAOX,CAAG,EAAGY,EAAOZ,CAAG,CAAC,EAGlDa,EAAOb,CAAG,EAAIY,EAAOZ,CAAG,CAE5B,CAAC,EAEIa,CACT,CAEA,SAASC,EAASC,EAAoB,CACpC,OAAOA,GAAQ,OAAOA,GAAS,UAAY,CAAC,MAAM,QAAQA,CAAI,CAChE,CAGA,MAAMC,EAAYN,EAAUJ,EAAK,MAAQ,CAAC,EAAGE,CAAS,EAGtD,SAAO,OAACJ,EAAA,CAAM,KAAM,CAAE,GAAGG,EAAU,KAAM,CAAE,GAAGS,CAAU,CAAE,EAAG,CAC/D,EAGC,OAACb,EAA2B,YAAc,qBACpCA,CACT,CAKO,MAAMf,EAA2BC,EAAyB",
|
|
6
|
+
"names": ["dataPropsDecorator_exports", "__export", "commonDataPropsDecorator", "createDataPropsDecorator", "__toCommonJS", "import_jsx_runtime", "import_react", "setNestedValue", "obj", "path", "value", "keys", "current", "i", "key", "topLevelProps", "allTopLevelProps", "DataPropsDecorator", "Story", "context", "args", "topProps", "dataProps", "nestedPath", "deepMerge", "target", "source", "output", "isObject", "item", "finalData"]
|
|
7
|
+
}
|
|
@@ -4,7 +4,7 @@ import type { BadgeProps } from '../../components/badge.js';
|
|
|
4
4
|
/**
|
|
5
5
|
* 语义化类名
|
|
6
6
|
*/
|
|
7
|
-
export type ActiveShelfSemanticName = 'root' | 'title' | 'description' | 'productCard' | 'productTitle' | 'productDescription' | 'productPriceLabel' | 'productPrice' | 'buttonGroup' | 'secondaryButton' | 'primaryButton' | 'stockBar';
|
|
7
|
+
export type ActiveShelfSemanticName = 'root' | 'title' | 'description' | 'productCard' | 'productTitle' | 'productDescription' | 'productPriceLabel' | 'productPrice' | 'buttonGroup' | 'secondaryButton' | 'primaryButton' | 'stockTrack' | 'stockBar';
|
|
8
8
|
/**
|
|
9
9
|
* 库存展示模式
|
|
10
10
|
*/
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{Fragment as O,jsx as a,jsxs as n}from"react/jsx-runtime";import*as l from"react";import{cn as t}from"../../helpers/index.js";import{Button as P,Badge as M,Card as R,CardContent as _,Picture as E,Text as u,Heading as d,Progress as I}from"../../components/index.js";const j=5;function H(e,o,s,
|
|
1
|
+
"use client";import{Fragment as O,jsx as a,jsxs as n}from"react/jsx-runtime";import*as l from"react";import{cn as t}from"../../helpers/index.js";import{Button as P,Badge as M,Card as R,CardContent as _,Picture as E,Text as u,Heading as d,Progress as I}from"../../components/index.js";const j=5;function H(e,o,s,p){if(e===void 0)return!0;switch(e){case"always":return!0;case"never":return!1;case"below-quantity":return o===void 0?!0:s<=o;case"below-percentage":return o===void 0?!0:s/p*100<=o;default:return!0}}const f=l.forwardRef(({product:e,className:o,showTags:s=!0,stockDisplayMode:p,stockThresholdValue:w,onLearnMore:S,onShopNow:h,onAddToCart:N,classNames:r,secondaryButtonText:g,secondaryButtonFun:y,primaryButtonText:b,primaryButtonFun:v,showOriginalPrice:B,copy:m,onProductImageClick:x},T)=>{const[D,L]=l.useState(!1),[F,z]=l.useState(!1),A=l.useMemo(()=>e?.availableForSale&&e?.quantityAvailable<=0?j:e?.availableForSale?(e?.quantityAvailable??0)/(e?.totalInventory??1)*100:0,[e?.availableForSale,e?.quantityAvailable,e?.totalInventory]),k=async(i,c)=>{if(!i)return;const C=c==="primary"?L:z;C(!0);try{switch(i){case"buyNow":await h?.(e);break;case"addCart":await N?.(e);break;case"learnMore":await S?.(e);break;default:break}}finally{C(!1)}},q=e.availableForSale&&e.quantityAvailable<=0;return a(R,{ref:T,className:t("bg-container-primary hover:bg-container-secondary-0 flex h-full flex-col overflow-hidden border-none",o,r?.productCard),children:n(_,{className:"desktop:p-6 relative flex flex-1 flex-col justify-between p-4",children:[a("div",{className:"lg-desktop:h-[28px] flex h-[24px] gap-1",children:s&&e.tags?.map((i,c)=>i.label?a(M,{size:"sm",variant:i.variant||"outline",className:t(i.variant==="promotional"?"ml-2":""),promotionalType:i.promotionalType,children:i.label},c):a(l.Fragment,{children:i},c))}),a("div",{className:"product-image-wrapper lg-desktop:size-[196px] mx-auto size-[138px] cursor-pointer overflow-hidden",children:a("a",{onClick:()=>x?.(e),...!x&&{href:e?.listingLink},rel:"noreferrer",children:a(E,{source:e.image,alt:e.name,className:"aspect-square size-full object-contain",imgClassName:"w-full h-full object-contain"})})}),n("div",{className:"flex h-full flex-1 grow flex-col justify-between",children:[n("div",{className:"mb-4",children:[a(d,{as:"h3",size:2,className:t("text-info-primary mb-2 line-clamp-2 min-h-[2.4em]",r?.productTitle),html:e.custom_name||e.name}),e?.description&&a(u,{size:2,className:t("text-info-secondary desktop:line-clamp-2 desktop:min-h-[2.4em] desktop:text-[16px] lg-desktop:text-[18px] line-clamp-2 min-h-[2.4em] text-[14px]",r?.productDescription),html:e.custom_description||e.description})]}),e?.priceLabel&&e?.availableForSale&&a(u,{size:4,className:t("text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] mt-2 text-[14px]",r?.productPriceLabel),children:e.priceLabel}),n("div",{children:[a("div",{className:t("mb-2",r?.productPrice),children:a("div",{className:"flex items-baseline gap-2",children:e.availableForSale?n(O,{children:[a(d,{size:2,className:"text-info-primary",as:"h6",children:e.price}),B&&e.originalPrice&&a(d,{size:2,className:"text-info-tertiary line-through",as:"h6",children:e.originalPrice})]}):a(d,{size:2,className:"text-info-tertiary",children:m?.outOfStockLabel??"Sold Out"})})}),n("div",{className:t("lg-desktop:gap-3 tablet:flex-nowrap flex flex-wrap gap-2",r?.buttonGroup),children:[g&&a(P,{variant:"secondary",size:"base",className:t("tablet:w-fit w-full",r?.secondaryButton),onClick:()=>k(y,"secondary"),disabled:!e.availableForSale&&y!=="learnMore",loading:F,children:g}),b&&a(P,{variant:"primary",size:"base",className:t("tablet:w-fit w-full",r?.primaryButton),onClick:()=>k(v,"primary"),disabled:!e.availableForSale&&v!=="learnMore",loading:D,children:b})]}),H(p,w,e?.quantityAvailable??0,e?.totalInventory??0)&&n("div",{className:"mt-4 space-y-2",children:[a(I,{value:A,max:100,min:0,size:"base",variant:"default","aria-label":"stock progress",classNames:{root:t("bg-[var(--progress-track-bg)]",r?.stockTrack),progressBar:t("bg-brand-0 transition-all duration-300 ease-in-out",r?.stockBar)}}),a(u,{size:3,className:"text-info-tertiary text-[14px]",children:q?m?.limitedStock:m?.stockDisplayText?.replace("{count}",`${e.availableForSale?e.quantityAvailable:0}`)})]})]})]})]})})});f.displayName="ActiveShelf.ProductCard";var V=f;export{f as ProductCard,V as default};
|
|
2
2
|
//# sourceMappingURL=ProductCard.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../../src/biz-components/ActiveShelf/ProductCard.tsx"],
|
|
4
|
-
"sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/index.js'\nimport { Button, Badge, Card, CardContent, Picture, Text, Heading, Progress } from '../../components/index.js'\n\nimport type { ButtonFunctionType, CopyConfig } from './types.js'\nimport type { BadgeProps } from '../../components/badge.js'\n\n/**\n * \u8D85\u5356\u65F6\u5E93\u5B58\u6761\u663E\u793A\u7684\u6700\u5C0F\u767E\u5206\u6BD4\n * \u9632\u6B62\u8D85\u5356\u65F6\u5E93\u5B58\u6761\u663E\u793A\u4E3A\u6EE1\u683C\uFF08100%\uFF09\u6216\u5B8C\u5168\u7A7A\uFF080%\uFF09\n */\nconst OVERSELLING_STOCK_PERCENTAGE = 5\n\n/**\n * \u8BED\u4E49\u5316\u7C7B\u540D\n */\nexport type ActiveShelfSemanticName =\n | 'root'\n | 'title'\n | 'description'\n | 'productCard'\n | 'productTitle'\n | 'productDescription'\n | 'productPriceLabel'\n | 'productPrice'\n | 'buttonGroup'\n | 'secondaryButton'\n | 'primaryButton'\n | 'stockBar'\n\n/**\n * \u5E93\u5B58\u5C55\u793A\u6A21\u5F0F\n */\nexport type StockDisplayMode = 'always' | 'never' | 'below-quantity' | 'below-percentage'\n\n/**\n * \u57FA\u7840\u4EA7\u54C1\u6570\u636E\u63A5\u53E3\uFF08\u6765\u81EA\u5916\u90E8\u6570\u636E\u6E90\uFF09\n */\nexport interface BaseProductData {\n sku: string\n name: string\n image: string\n value: string\n handle: string\n shopify_id: string\n custom_name?: string\n custom_description?: string\n}\n\n/**\n * Shopify \u53D8\u4F53\u6570\u636E\u63A5\u53E3\n */\nexport interface VariantData {\n /**\n * \u4EA7\u54C1\u63CF\u8FF0\n */\n description?: string\n /**\n * \u53D8\u4F53id\n */\n variantId: string\n\n /**\n * \u4EA7\u54C1\u94FE\u63A5, \u70B9\u51FB\u56FE\u7247\u7684\u65F6\u5019\u8DF3\u8F6C\u5230\u8BE5\u94FE\u63A5\n */\n listingLink: string\n /**\n * \u539F\u4EF7\n */\n originalPrice: string\n /**\n * \u73B0\u4EF7\n */\n price: string\n /**\n * \u4EF7\u683C\u4E0A\u9762\u5C55\u793A\u7684\u6807\u7B7E\u6587\u672C\n */\n priceLabel?: string\n /**\n * \u603B\u5E93\u5B58\n */\n totalInventory: number\n /**\n * \u53EF\u7528\u5E93\u5B58\u6570\u91CF\n */\n quantityAvailable: number\n /**\n * \u662F\u5426\u53EF\u552E\n */\n availableForSale: boolean\n\n /**\n * tags \u5217\u8868(\u4F1A\u5458\u4EF7\uFF0C\u6298\u6263\uFF0Cnew, hot\u7B49\u6807\u7B7E\u4FE1\u606F)\n */\n tags: Array<\n | {\n label: string\n variant: BadgeProps['variant']\n promotionalType?: BadgeProps['promotionalType']\n }\n | React.ReactNode\n >\n /**\n * \u901A\u7528\u6298\u6263\u6570\u636E\uFF0C\u5305\u62EC\u6298\u6263title, \u7C7B\u578B\u548C\u503C\n */\n coupon: any\n}\n\n/**\n * \u5B8C\u6574\u7684\u4EA7\u54C1\u5361\u7247\u6570\u636E\u63A5\u53E3\n */\nexport interface ProductCardData extends BaseProductData, VariantData {}\n\n/**\n * \u4EA7\u54C1\u5361\u7247\u7EC4\u4EF6 Props\n */\nexport interface ProductCardProps {\n /** \u4EA7\u54C1\u6570\u636E */\n product: ProductCardData\n /** \u6837\u5F0F\u7C7B\u540D */\n className?: string\n /** \u662F\u5426\u5C55\u793A\u6807\u7B7E\u7CFB\u7EDF */\n showTags?: boolean\n /** \u5E93\u5B58\u5C55\u793A\u6A21\u5F0F */\n stockDisplayMode?: StockDisplayMode\n /** \u5E93\u5B58\u9608\u503C\uFF08\u5F53\u6A21\u5F0F\u4E3A below-quantity \u6216 below-percentage \u65F6\u4F7F\u7528\uFF09 */\n stockThresholdValue?: number\n /** \u70B9\u51FB\u4E86\u89E3\u66F4\u591A\u56DE\u8C03 */\n onLearnMore?: (product: ProductCardData) => void\n /** \u70B9\u51FB\u7ACB\u5373\u8D2D\u4E70\u56DE\u8C03 */\n onShopNow?: (product: ProductCardData) => void\n /** \u70B9\u51FB\u52A0\u5165\u8D2D\u7269\u8F66\u56DE\u8C03 */\n onAddToCart?: (product: ProductCardData) => void\n /** \u8BED\u4E49\u5316\u7C7B\u540D */\n classNames?: Partial<Record<ActiveShelfSemanticName, string>>\n /** \u4E86\u89E3\u66F4\u591A\u6309\u94AE\u6587\u672C */\n secondaryButtonText?: string\n /** \u4E86\u89E3\u66F4\u591A\u6309\u94AE\u529F\u80FD */\n secondaryButtonFun?: ButtonFunctionType\n /** \u7ACB\u5373\u8D2D\u4E70\u6309\u94AE\u6587\u672C */\n primaryButtonText?: string\n /** \u7ACB\u5373\u8D2D\u4E70\u6309\u94AE\u529F\u80FD */\n primaryButtonFun?: ButtonFunctionType\n /** \u662F\u5426\u5C55\u793A\u539F\u4EF7\uFF08\u5220\u9664\u7EBF\u4EF7\u683C\uFF09 */\n showOriginalPrice?: boolean\n /** \u6587\u6848\u914D\u7F6E */\n copy?: CopyConfig\n onProductImageClick?: (product: ProductCardData) => void\n}\n\n/**\n * \u5224\u65AD\u662F\u5426\u5E94\u8BE5\u663E\u793A\u5E93\u5B58\u4FE1\u606F\n * @param stockDisplayMode \u5E93\u5B58\u5C55\u793A\u6A21\u5F0F\n * @param stockThresholdValue \u5E93\u5B58\u9608\u503C\uFF08\u5F53\u6A21\u5F0F\u4E3A below-quantity \u6216 below-percentage \u65F6\u4F7F\u7528\uFF09\n * @param quantityAvailable \u53EF\u7528\u5E93\u5B58\u6570\u91CF\n * @param totalInventory \u603B\u5E93\u5B58\n * @returns \u662F\u5426\u663E\u793A\u5E93\u5B58\u4FE1\u606F\n */\nfunction shouldShowStock(\n stockDisplayMode: StockDisplayMode | undefined,\n stockThresholdValue: number | undefined,\n quantityAvailable: number,\n totalInventory: number\n): boolean {\n // \u672A\u914D\u7F6E\u65F6\u9ED8\u8BA4\u663E\u793A\n if (stockDisplayMode === undefined) {\n return true\n }\n\n // \u6839\u636E\u5C55\u793A\u6A21\u5F0F\u5224\u65AD\n switch (stockDisplayMode) {\n case 'always':\n // \u603B\u662F\u663E\u793A\n return true\n\n case 'never':\n // \u6C38\u4E0D\u663E\u793A\n return false\n\n case 'below-quantity':\n // \u5F53\u5E93\u5B58\u6570\u91CF\u4F4E\u4E8E\u9608\u503C\u65F6\u663E\u793A\n if (stockThresholdValue === undefined) {\n return true // \u6CA1\u6709\u8BBE\u7F6E\u9608\u503C\u65F6\u9ED8\u8BA4\u663E\u793A\n }\n\n return quantityAvailable <= stockThresholdValue\n\n case 'below-percentage':\n // \u5F53\u5E93\u5B58\u767E\u5206\u6BD4\u4F4E\u4E8E\u9608\u503C\u65F6\u663E\u793A\n if (stockThresholdValue === undefined) {\n return true // \u6CA1\u6709\u8BBE\u7F6E\u9608\u503C\u65F6\u9ED8\u8BA4\u663E\u793A\n }\n return (quantityAvailable / totalInventory) * 100 <= stockThresholdValue\n\n default:\n // \u672A\u77E5\u6A21\u5F0F\u65F6\u9ED8\u8BA4\u663E\u793A\n return true\n }\n}\n\n/**\n * \u4EA7\u54C1\u5361\u7247\u7EC4\u4EF6\n */\nconst ProductCard = React.forwardRef<HTMLDivElement, ProductCardProps>(\n (\n {\n product,\n className,\n showTags = true,\n stockDisplayMode,\n stockThresholdValue,\n onLearnMore,\n onShopNow,\n onAddToCart,\n classNames,\n secondaryButtonText,\n secondaryButtonFun,\n primaryButtonText,\n primaryButtonFun,\n showOriginalPrice,\n copy,\n onProductImageClick,\n },\n ref\n ) => {\n const [primaryLoading, setPrimaryLoading] = React.useState(false)\n const [secondaryLoading, setSecondaryLoading] = React.useState(false)\n\n const stockPercentage = React.useMemo(() => {\n if (product?.availableForSale && product?.quantityAvailable <= 0) {\n return OVERSELLING_STOCK_PERCENTAGE\n }\n // \u4E0D\u53EF\u552E\u65F6\u663E\u793A0%\n if (!product?.availableForSale) {\n return 0\n }\n return ((product?.quantityAvailable ?? 0) / (product?.totalInventory ?? 1)) * 100\n }, [product?.availableForSale, product?.quantityAvailable, product?.totalInventory])\n\n // \u6839\u636E\u6309\u94AE\u529F\u80FD\u7C7B\u578B\u8C03\u7528\u76F8\u5E94\u7684\u56DE\u8C03\u51FD\u6570\n const handleButtonClick = async (buttonFun?: ButtonFunctionType, buttonType?: 'primary' | 'secondary') => {\n if (!buttonFun) return\n\n const setLoading = buttonType === 'primary' ? setPrimaryLoading : setSecondaryLoading\n setLoading(true)\n\n try {\n switch (buttonFun) {\n case 'buyNow':\n await onShopNow?.(product)\n break\n case 'addCart':\n await onAddToCart?.(product)\n break\n case 'learnMore':\n await onLearnMore?.(product)\n break\n default:\n break\n }\n } finally {\n setLoading(false)\n }\n }\n\n const overselling = product.availableForSale && product.quantityAvailable <= 0\n\n return (\n <Card\n ref={ref}\n className={cn(\n 'bg-container-primary flex h-full flex-col overflow-hidden border-none',\n className,\n classNames?.productCard\n )}\n >\n <CardContent className=\"desktop:p-6 relative flex flex-1 flex-col justify-between p-4\">\n {/* \u6807\u7B7E */}\n <div className=\"lg-desktop:h-[28px] flex h-[24px] gap-1\">\n {showTags &&\n product.tags?.map((tag: any, index) =>\n (tag as any).label ? (\n <Badge\n key={index}\n size=\"sm\"\n variant={(tag.variant as any) || 'outline'}\n className={cn(tag.variant === 'promotional' ? 'ml-2' : '')}\n promotionalType={tag.promotionalType}\n >\n {tag.label}\n </Badge>\n ) : (\n <React.Fragment key={index}>{tag}</React.Fragment>\n )\n )}\n </div>\n\n {/* \u4EA7\u54C1\u56FE\u533A\u57DF */}\n <div className=\"product-image-wrapper lg-desktop:size-[196px] mx-auto size-[138px] cursor-pointer overflow-hidden\">\n <a\n onClick={() => onProductImageClick?.(product)}\n {...(!onProductImageClick && {\n href: product?.listingLink,\n })}\n rel=\"noreferrer\"\n >\n <Picture\n source={product.image}\n alt={product.name}\n className=\"aspect-square size-full object-contain\"\n imgClassName=\"w-full h-full object-contain\"\n />\n </a>\n </div>\n\n {/* \u5185\u5BB9\u533A\u57DF */}\n <div className=\"flex h-full flex-1 grow flex-col justify-between\">\n {/* \u4EA7\u54C1\u4FE1\u606F */}\n <div className=\"mb-4\">\n <Heading\n as=\"h3\"\n size={2}\n className={cn('text-info-primary mb-2 line-clamp-2 min-h-[2.4em]', classNames?.productTitle)}\n html={product.custom_name || product.name}\n />\n {product?.description && (\n <Text\n size={2}\n className={cn(\n 'text-info-secondary desktop:line-clamp-2 desktop:min-h-[2.4em] line-clamp-2 min-h-[2.4em]',\n classNames?.productDescription\n )}\n html={product.custom_description || product.description}\n />\n )}\n </div>\n\n {/** \u4EF7\u683C\u6807\u7B7E */}\n\n {product?.priceLabel && product?.availableForSale && (\n <Text\n size={4}\n className={cn(\n 'text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] mt-2 text-[14px]',\n classNames?.productPriceLabel\n )}\n >\n {product.priceLabel}\n </Text>\n )}\n\n {/* \u4EF7\u683C\u533A\u57DF */}\n <div>\n <div className={cn('mb-2', classNames?.productPrice)}>\n <div className=\"flex items-baseline gap-2\">\n {product.availableForSale ? (\n <>\n <Heading size={2} className=\"text-info-primary\" as=\"h6\">\n {product.price}\n </Heading>\n {showOriginalPrice && product.originalPrice && (\n <Heading size={2} className=\"text-info-tertiary line-through\" as=\"h6\">\n {product.originalPrice}\n </Heading>\n )}\n </>\n ) : (\n <Heading size={2} className=\"text-info-tertiary\">\n {copy?.outOfStockLabel ?? 'Sold Out'}\n </Heading>\n )}\n </div>\n </div>\n\n {/* \u6309\u94AE\u533A\u57DF */}\n <div className={cn('lg-desktop:gap-3 tablet:flex-nowrap flex flex-wrap gap-2', classNames?.buttonGroup)}>\n {secondaryButtonText && (\n <Button\n variant=\"secondary\"\n size=\"base\"\n className={cn('tablet:w-fit w-full', classNames?.secondaryButton)}\n onClick={() => handleButtonClick(secondaryButtonFun, 'secondary')}\n disabled={!product.availableForSale && secondaryButtonFun !== 'learnMore'}\n loading={secondaryLoading}\n >\n {secondaryButtonText}\n </Button>\n )}\n {primaryButtonText && (\n <Button\n variant=\"primary\"\n size=\"base\"\n className={cn('tablet:w-fit w-full', classNames?.primaryButton)}\n onClick={() => handleButtonClick(primaryButtonFun, 'primary')}\n disabled={!product.availableForSale && primaryButtonFun !== 'learnMore'}\n loading={primaryLoading}\n >\n {primaryButtonText}\n </Button>\n )}\n </div>\n\n {/* \u5E93\u5B58\u4FE1\u606F */}\n {shouldShowStock(\n stockDisplayMode,\n stockThresholdValue,\n product?.quantityAvailable ?? 0,\n product?.totalInventory ?? 0\n ) && (\n <div className=\"mt-4 space-y-2\">\n <Progress\n value={stockPercentage}\n max={100}\n min={0}\n size=\"base\"\n variant=\"default\"\n aria-label=\"stock progress\"\n classNames={{\n progressBar: cn('bg-brand-0 transition-all duration-300 ease-in-out', classNames?.stockBar),\n }}\n />\n <Text size={3} className=\"text-info-tertiary text-[14px]\">\n {overselling\n ? copy?.limitedStock\n : copy?.stockDisplayText?.replace(\n '{count}',\n `${product.availableForSale ? product.quantityAvailable : 0}`\n )}\n </Text>\n </div>\n )}\n </div>\n </div>\n </CardContent>\n </Card>\n )\n }\n)\n\nProductCard.displayName = 'ActiveShelf.ProductCard'\n\nexport { ProductCard }\nexport default ProductCard\n"],
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["'use client'\n\nimport * as React from 'react'\nimport { cn } from '../../helpers/index.js'\nimport { Button, Badge, Card, CardContent, Picture, Text, Heading, Progress } from '../../components/index.js'\n\nimport type { ButtonFunctionType, CopyConfig } from './types.js'\nimport type { BadgeProps } from '../../components/badge.js'\n\n/**\n * \u8D85\u5356\u65F6\u5E93\u5B58\u6761\u663E\u793A\u7684\u6700\u5C0F\u767E\u5206\u6BD4\n * \u9632\u6B62\u8D85\u5356\u65F6\u5E93\u5B58\u6761\u663E\u793A\u4E3A\u6EE1\u683C\uFF08100%\uFF09\u6216\u5B8C\u5168\u7A7A\uFF080%\uFF09\n */\nconst OVERSELLING_STOCK_PERCENTAGE = 5\n\n/**\n * \u8BED\u4E49\u5316\u7C7B\u540D\n */\nexport type ActiveShelfSemanticName =\n | 'root'\n | 'title'\n | 'description'\n | 'productCard'\n | 'productTitle'\n | 'productDescription'\n | 'productPriceLabel'\n | 'productPrice'\n | 'buttonGroup'\n | 'secondaryButton'\n | 'primaryButton'\n | 'stockTrack'\n | 'stockBar'\n\n/**\n * \u5E93\u5B58\u5C55\u793A\u6A21\u5F0F\n */\nexport type StockDisplayMode = 'always' | 'never' | 'below-quantity' | 'below-percentage'\n\n/**\n * \u57FA\u7840\u4EA7\u54C1\u6570\u636E\u63A5\u53E3\uFF08\u6765\u81EA\u5916\u90E8\u6570\u636E\u6E90\uFF09\n */\nexport interface BaseProductData {\n sku: string\n name: string\n image: string\n value: string\n handle: string\n shopify_id: string\n custom_name?: string\n custom_description?: string\n}\n\n/**\n * Shopify \u53D8\u4F53\u6570\u636E\u63A5\u53E3\n */\nexport interface VariantData {\n /**\n * \u4EA7\u54C1\u63CF\u8FF0\n */\n description?: string\n /**\n * \u53D8\u4F53id\n */\n variantId: string\n\n /**\n * \u4EA7\u54C1\u94FE\u63A5, \u70B9\u51FB\u56FE\u7247\u7684\u65F6\u5019\u8DF3\u8F6C\u5230\u8BE5\u94FE\u63A5\n */\n listingLink: string\n /**\n * \u539F\u4EF7\n */\n originalPrice: string\n /**\n * \u73B0\u4EF7\n */\n price: string\n /**\n * \u4EF7\u683C\u4E0A\u9762\u5C55\u793A\u7684\u6807\u7B7E\u6587\u672C\n */\n priceLabel?: string\n /**\n * \u603B\u5E93\u5B58\n */\n totalInventory: number\n /**\n * \u53EF\u7528\u5E93\u5B58\u6570\u91CF\n */\n quantityAvailable: number\n /**\n * \u662F\u5426\u53EF\u552E\n */\n availableForSale: boolean\n\n /**\n * tags \u5217\u8868(\u4F1A\u5458\u4EF7\uFF0C\u6298\u6263\uFF0Cnew, hot\u7B49\u6807\u7B7E\u4FE1\u606F)\n */\n tags: Array<\n | {\n label: string\n variant: BadgeProps['variant']\n promotionalType?: BadgeProps['promotionalType']\n }\n | React.ReactNode\n >\n /**\n * \u901A\u7528\u6298\u6263\u6570\u636E\uFF0C\u5305\u62EC\u6298\u6263title, \u7C7B\u578B\u548C\u503C\n */\n coupon: any\n}\n\n/**\n * \u5B8C\u6574\u7684\u4EA7\u54C1\u5361\u7247\u6570\u636E\u63A5\u53E3\n */\nexport interface ProductCardData extends BaseProductData, VariantData {}\n\n/**\n * \u4EA7\u54C1\u5361\u7247\u7EC4\u4EF6 Props\n */\nexport interface ProductCardProps {\n /** \u4EA7\u54C1\u6570\u636E */\n product: ProductCardData\n /** \u6837\u5F0F\u7C7B\u540D */\n className?: string\n /** \u662F\u5426\u5C55\u793A\u6807\u7B7E\u7CFB\u7EDF */\n showTags?: boolean\n /** \u5E93\u5B58\u5C55\u793A\u6A21\u5F0F */\n stockDisplayMode?: StockDisplayMode\n /** \u5E93\u5B58\u9608\u503C\uFF08\u5F53\u6A21\u5F0F\u4E3A below-quantity \u6216 below-percentage \u65F6\u4F7F\u7528\uFF09 */\n stockThresholdValue?: number\n /** \u70B9\u51FB\u4E86\u89E3\u66F4\u591A\u56DE\u8C03 */\n onLearnMore?: (product: ProductCardData) => void\n /** \u70B9\u51FB\u7ACB\u5373\u8D2D\u4E70\u56DE\u8C03 */\n onShopNow?: (product: ProductCardData) => void\n /** \u70B9\u51FB\u52A0\u5165\u8D2D\u7269\u8F66\u56DE\u8C03 */\n onAddToCart?: (product: ProductCardData) => void\n /** \u8BED\u4E49\u5316\u7C7B\u540D */\n classNames?: Partial<Record<ActiveShelfSemanticName, string>>\n /** \u4E86\u89E3\u66F4\u591A\u6309\u94AE\u6587\u672C */\n secondaryButtonText?: string\n /** \u4E86\u89E3\u66F4\u591A\u6309\u94AE\u529F\u80FD */\n secondaryButtonFun?: ButtonFunctionType\n /** \u7ACB\u5373\u8D2D\u4E70\u6309\u94AE\u6587\u672C */\n primaryButtonText?: string\n /** \u7ACB\u5373\u8D2D\u4E70\u6309\u94AE\u529F\u80FD */\n primaryButtonFun?: ButtonFunctionType\n /** \u662F\u5426\u5C55\u793A\u539F\u4EF7\uFF08\u5220\u9664\u7EBF\u4EF7\u683C\uFF09 */\n showOriginalPrice?: boolean\n /** \u6587\u6848\u914D\u7F6E */\n copy?: CopyConfig\n onProductImageClick?: (product: ProductCardData) => void\n}\n\n/**\n * \u5224\u65AD\u662F\u5426\u5E94\u8BE5\u663E\u793A\u5E93\u5B58\u4FE1\u606F\n * @param stockDisplayMode \u5E93\u5B58\u5C55\u793A\u6A21\u5F0F\n * @param stockThresholdValue \u5E93\u5B58\u9608\u503C\uFF08\u5F53\u6A21\u5F0F\u4E3A below-quantity \u6216 below-percentage \u65F6\u4F7F\u7528\uFF09\n * @param quantityAvailable \u53EF\u7528\u5E93\u5B58\u6570\u91CF\n * @param totalInventory \u603B\u5E93\u5B58\n * @returns \u662F\u5426\u663E\u793A\u5E93\u5B58\u4FE1\u606F\n */\nfunction shouldShowStock(\n stockDisplayMode: StockDisplayMode | undefined,\n stockThresholdValue: number | undefined,\n quantityAvailable: number,\n totalInventory: number\n): boolean {\n // \u672A\u914D\u7F6E\u65F6\u9ED8\u8BA4\u663E\u793A\n if (stockDisplayMode === undefined) {\n return true\n }\n\n // \u6839\u636E\u5C55\u793A\u6A21\u5F0F\u5224\u65AD\n switch (stockDisplayMode) {\n case 'always':\n // \u603B\u662F\u663E\u793A\n return true\n\n case 'never':\n // \u6C38\u4E0D\u663E\u793A\n return false\n\n case 'below-quantity':\n // \u5F53\u5E93\u5B58\u6570\u91CF\u4F4E\u4E8E\u9608\u503C\u65F6\u663E\u793A\n if (stockThresholdValue === undefined) {\n return true // \u6CA1\u6709\u8BBE\u7F6E\u9608\u503C\u65F6\u9ED8\u8BA4\u663E\u793A\n }\n\n return quantityAvailable <= stockThresholdValue\n\n case 'below-percentage':\n // \u5F53\u5E93\u5B58\u767E\u5206\u6BD4\u4F4E\u4E8E\u9608\u503C\u65F6\u663E\u793A\n if (stockThresholdValue === undefined) {\n return true // \u6CA1\u6709\u8BBE\u7F6E\u9608\u503C\u65F6\u9ED8\u8BA4\u663E\u793A\n }\n return (quantityAvailable / totalInventory) * 100 <= stockThresholdValue\n\n default:\n // \u672A\u77E5\u6A21\u5F0F\u65F6\u9ED8\u8BA4\u663E\u793A\n return true\n }\n}\n\n/**\n * \u4EA7\u54C1\u5361\u7247\u7EC4\u4EF6\n */\nconst ProductCard = React.forwardRef<HTMLDivElement, ProductCardProps>(\n (\n {\n product,\n className,\n showTags = true,\n stockDisplayMode,\n stockThresholdValue,\n onLearnMore,\n onShopNow,\n onAddToCart,\n classNames,\n secondaryButtonText,\n secondaryButtonFun,\n primaryButtonText,\n primaryButtonFun,\n showOriginalPrice,\n copy,\n onProductImageClick,\n },\n ref\n ) => {\n const [primaryLoading, setPrimaryLoading] = React.useState(false)\n const [secondaryLoading, setSecondaryLoading] = React.useState(false)\n\n const stockPercentage = React.useMemo(() => {\n if (product?.availableForSale && product?.quantityAvailable <= 0) {\n return OVERSELLING_STOCK_PERCENTAGE\n }\n // \u4E0D\u53EF\u552E\u65F6\u663E\u793A0%\n if (!product?.availableForSale) {\n return 0\n }\n return ((product?.quantityAvailable ?? 0) / (product?.totalInventory ?? 1)) * 100\n }, [product?.availableForSale, product?.quantityAvailable, product?.totalInventory])\n\n // \u6839\u636E\u6309\u94AE\u529F\u80FD\u7C7B\u578B\u8C03\u7528\u76F8\u5E94\u7684\u56DE\u8C03\u51FD\u6570\n const handleButtonClick = async (buttonFun?: ButtonFunctionType, buttonType?: 'primary' | 'secondary') => {\n if (!buttonFun) return\n\n const setLoading = buttonType === 'primary' ? setPrimaryLoading : setSecondaryLoading\n setLoading(true)\n\n try {\n switch (buttonFun) {\n case 'buyNow':\n await onShopNow?.(product)\n break\n case 'addCart':\n await onAddToCart?.(product)\n break\n case 'learnMore':\n await onLearnMore?.(product)\n break\n default:\n break\n }\n } finally {\n setLoading(false)\n }\n }\n\n const overselling = product.availableForSale && product.quantityAvailable <= 0\n\n return (\n <Card\n ref={ref}\n className={cn(\n 'bg-container-primary hover:bg-container-secondary-0 flex h-full flex-col overflow-hidden border-none',\n className,\n classNames?.productCard\n )}\n >\n <CardContent className=\"desktop:p-6 relative flex flex-1 flex-col justify-between p-4\">\n {/* \u6807\u7B7E */}\n <div className=\"lg-desktop:h-[28px] flex h-[24px] gap-1\">\n {showTags &&\n product.tags?.map((tag: any, index) =>\n (tag as any).label ? (\n <Badge\n key={index}\n size=\"sm\"\n variant={(tag.variant as any) || 'outline'}\n className={cn(tag.variant === 'promotional' ? 'ml-2' : '')}\n promotionalType={tag.promotionalType}\n >\n {tag.label}\n </Badge>\n ) : (\n <React.Fragment key={index}>{tag}</React.Fragment>\n )\n )}\n </div>\n\n {/* \u4EA7\u54C1\u56FE\u533A\u57DF */}\n <div className=\"product-image-wrapper lg-desktop:size-[196px] mx-auto size-[138px] cursor-pointer overflow-hidden\">\n <a\n onClick={() => onProductImageClick?.(product)}\n {...(!onProductImageClick && {\n href: product?.listingLink,\n })}\n rel=\"noreferrer\"\n >\n <Picture\n source={product.image}\n alt={product.name}\n className=\"aspect-square size-full object-contain\"\n imgClassName=\"w-full h-full object-contain\"\n />\n </a>\n </div>\n\n {/* \u5185\u5BB9\u533A\u57DF */}\n <div className=\"flex h-full flex-1 grow flex-col justify-between\">\n {/* \u4EA7\u54C1\u4FE1\u606F */}\n <div className=\"mb-4\">\n <Heading\n as=\"h3\"\n size={2}\n className={cn('text-info-primary mb-2 line-clamp-2 min-h-[2.4em]', classNames?.productTitle)}\n html={product.custom_name || product.name}\n />\n {product?.description && (\n <Text\n size={2}\n className={cn(\n 'text-info-secondary desktop:line-clamp-2 desktop:min-h-[2.4em] desktop:text-[16px] lg-desktop:text-[18px] line-clamp-2 min-h-[2.4em] text-[14px]',\n classNames?.productDescription\n )}\n html={product.custom_description || product.description}\n />\n )}\n </div>\n\n {/** \u4EF7\u683C\u6807\u7B7E */}\n\n {product?.priceLabel && product?.availableForSale && (\n <Text\n size={4}\n className={cn(\n 'text-marketing-1 desktop:text-[16px] lg-desktop:text-[18px] mt-2 text-[14px]',\n classNames?.productPriceLabel\n )}\n >\n {product.priceLabel}\n </Text>\n )}\n\n {/* \u4EF7\u683C\u533A\u57DF */}\n <div>\n <div className={cn('mb-2', classNames?.productPrice)}>\n <div className=\"flex items-baseline gap-2\">\n {product.availableForSale ? (\n <>\n <Heading size={2} className=\"text-info-primary\" as=\"h6\">\n {product.price}\n </Heading>\n {showOriginalPrice && product.originalPrice && (\n <Heading size={2} className=\"text-info-tertiary line-through\" as=\"h6\">\n {product.originalPrice}\n </Heading>\n )}\n </>\n ) : (\n <Heading size={2} className=\"text-info-tertiary\">\n {copy?.outOfStockLabel ?? 'Sold Out'}\n </Heading>\n )}\n </div>\n </div>\n\n {/* \u6309\u94AE\u533A\u57DF */}\n <div className={cn('lg-desktop:gap-3 tablet:flex-nowrap flex flex-wrap gap-2', classNames?.buttonGroup)}>\n {secondaryButtonText && (\n <Button\n variant=\"secondary\"\n size=\"base\"\n className={cn('tablet:w-fit w-full', classNames?.secondaryButton)}\n onClick={() => handleButtonClick(secondaryButtonFun, 'secondary')}\n disabled={!product.availableForSale && secondaryButtonFun !== 'learnMore'}\n loading={secondaryLoading}\n >\n {secondaryButtonText}\n </Button>\n )}\n {primaryButtonText && (\n <Button\n variant=\"primary\"\n size=\"base\"\n className={cn('tablet:w-fit w-full', classNames?.primaryButton)}\n onClick={() => handleButtonClick(primaryButtonFun, 'primary')}\n disabled={!product.availableForSale && primaryButtonFun !== 'learnMore'}\n loading={primaryLoading}\n >\n {primaryButtonText}\n </Button>\n )}\n </div>\n\n {/* \u5E93\u5B58\u4FE1\u606F */}\n {shouldShowStock(\n stockDisplayMode,\n stockThresholdValue,\n product?.quantityAvailable ?? 0,\n product?.totalInventory ?? 0\n ) && (\n <div className=\"mt-4 space-y-2\">\n <Progress\n value={stockPercentage}\n max={100}\n min={0}\n size=\"base\"\n variant=\"default\"\n aria-label=\"stock progress\"\n classNames={{\n root: cn('bg-[var(--progress-track-bg)]', classNames?.stockTrack),\n progressBar: cn('bg-brand-0 transition-all duration-300 ease-in-out', classNames?.stockBar),\n }}\n />\n <Text size={3} className=\"text-info-tertiary text-[14px]\">\n {overselling\n ? copy?.limitedStock\n : copy?.stockDisplayText?.replace(\n '{count}',\n `${product.availableForSale ? product.quantityAvailable : 0}`\n )}\n </Text>\n </div>\n )}\n </div>\n </div>\n </CardContent>\n </Card>\n )\n }\n)\n\nProductCard.displayName = 'ActiveShelf.ProductCard'\n\nexport { ProductCard }\nexport default ProductCard\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": ["Fragment", "jsx", "jsxs", "React", "cn", "Button", "Badge", "Card", "CardContent", "Picture", "Text", "Heading", "Progress", "OVERSELLING_STOCK_PERCENTAGE", "shouldShowStock", "stockDisplayMode", "stockThresholdValue", "quantityAvailable", "totalInventory", "ProductCard", "product", "className", "showTags", "onLearnMore", "onShopNow", "onAddToCart", "classNames", "secondaryButtonText", "secondaryButtonFun", "primaryButtonText", "primaryButtonFun", "showOriginalPrice", "copy", "onProductImageClick", "ref", "primaryLoading", "setPrimaryLoading", "secondaryLoading", "setSecondaryLoading", "stockPercentage", "handleButtonClick", "buttonFun", "buttonType", "setLoading", "overselling", "tag", "index", "ProductCard_default"]
|
|
7
7
|
}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as
|
|
1
|
+
"use client";import{jsx as e,jsxs as k}from"react/jsx-runtime";import*as l from"react";import{cn as D}from"../../helpers/index.js";import{Text as z,Heading as H,Tabs as $,TabsList as O,TabsTrigger as V,TabsContent as j}from"../../components/index.js";import{Swiper as I,SwiperSlide as W}from"swiper/react";import{Navigation as q}from"swiper/modules";import"swiper/css";import"swiper/css/navigation";import{ProductCard as N}from"./ProductCard.js";const Z=({disabled:a})=>k("svg",{width:"56",height:"56",viewBox:"0 0 56 56",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:" lg-desktop:size-[56px] laptop:block hidden size-[40px]",children:[e("path",{d:"M0 28C0 43.464 12.536 56 28 56C43.464 56 56 43.464 56 28C56 12.536 43.464 0 28 0C12.536 0 0 12.536 0 28Z",fill:"black",fillOpacity:a?"0.2":"0.6"}),e("path",{d:"M31 22L25 28L31 34",stroke:"white",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})]}),_=({disabled:a})=>k("svg",{width:"56",height:"56",viewBox:"0 0 56 56",fill:"none",xmlns:"http://www.w3.org/2000/svg",className:"lg-desktop:size-[56px] laptop:block hidden size-[40px]",children:[e("path",{d:"M0 28C0 12.536 12.536 0 28 0C43.464 0 56 12.536 56 28C56 43.464 43.464 56 28 56C12.536 56 0 43.464 0 28Z",fill:"black",fillOpacity:a?"0.2":"0.6"}),e("path",{d:"M25 22L31 28L25 34",stroke:"white",strokeWidth:"2",strokeLinecap:"round",strokeLinejoin:"round"})]}),A=l.forwardRef(({products:a,layoutMode:o,className:x,copy:r,showTags:c,stockDisplayMode:s,stockThresholdValue:S,onLearnMore:B,onShopNow:p,onAddToCart:u,classNames:h,secondaryButtonText:g,secondaryButtonFun:m,primaryButtonText:y,primaryButtonFun:f,showOriginalPrice:b},P)=>{const T=l.useId().replace(/:/g,""),M=`swiper-button-next-custom-${T}`,L=`swiper-button-prev-custom-${T}`,[n,d]=l.useState({isBeginning:!0,isEnd:!1}),v=l.useRef(null),i=l.useCallback(()=>{const t=v.current;if(!t?.slides||t.slides.length===0)return;t.slides.forEach(C=>{C.style.height="auto"});const w=Array.from(t.slides).map(C=>C.scrollHeight),E=Math.max(...w);E>0&&t.slides.forEach(C=>{C.style.height=`${E}px`})},[]);return l.useEffect(()=>{const t=()=>{requestAnimationFrame(i)};return window.addEventListener("resize",t),()=>window.removeEventListener("resize",t)},[i]),a?.length===0?null:e("div",{ref:P,className:x,children:o==="flex"?e("div",{className:"lg-desktop:gap-4 tablet:grid-cols-2 laptop:grid-cols-3 desktop:grid-cols-4 laptop:gap-4 grid grid-cols-1 justify-start gap-3",children:a.map((t,w)=>e(N,{product:t,className:"shrink-0",showTags:c,stockDisplayMode:s,stockThresholdValue:S,onLearnMore:B,onShopNow:p,onAddToCart:u,classNames:h,secondaryButtonText:g,secondaryButtonFun:m,primaryButtonText:y,primaryButtonFun:f,showOriginalPrice:b,copy:r},t.shopify_id+"-"+t.sku||w))}):k("div",{className:"group relative",children:[e(I,{modules:[q],spaceBetween:16,slidesPerView:"auto",navigation:{nextEl:`.${M}`,prevEl:`.${L}`},onSwiper:t=>{v.current=t,d({isBeginning:t.isBeginning,isEnd:t.isEnd}),setTimeout(i,100)},onReachEnd:()=>{d(t=>({...t,isEnd:!0}))},onReachBeginning:()=>{d(t=>({...t,isBeginning:!0}))},onFromEdge:()=>{d({isBeginning:!1,isEnd:!1})},className:"!overflow-visible",children:a.map((t,w)=>e(W,{className:"tablet:!w-[288px] desktop:!w-[316px] lg-desktop:!w-[404px] !w-[296px] overflow-hidden",children:e(N,{product:t,className:"w-full max-w-full",showTags:c,stockDisplayMode:s,stockThresholdValue:S,onLearnMore:B,onShopNow:p,onAddToCart:u,classNames:h,secondaryButtonText:g,secondaryButtonFun:m,primaryButtonText:y,primaryButtonFun:f,showOriginalPrice:b,copy:r})},t.shopify_id+"-"+t.sku||w))}),e("button",{className:`${L} tablet:block absolute left-4 top-1/2 z-10 hidden -translate-y-1/2 transition-opacity ${n.isBeginning?"pointer-events-none opacity-0":"opacity-0 group-hover:opacity-100"}`,"aria-label":r?.previousSlideLabel,children:e(Z,{disabled:n.isBeginning})}),e("button",{className:`${M} tablet:block absolute right-4 top-1/2 z-10 hidden -translate-y-1/2 transition-opacity ${n.isEnd?"pointer-events-none opacity-0":"opacity-0 group-hover:opacity-100"}`,"aria-label":r?.nextSlideLabel,children:e(_,{disabled:n.isEnd})})]})})});A.displayName="ProductsList";const F=l.forwardRef(({className:a,data:o,onLearnMore:x,onShopNow:r,onAddToCart:c,classNames:s,...S},B)=>{const{theme:p="light",layoutMode:u="flex",showTags:h=!0,stockDisplayMode:g,stockThresholdValue:m,showOriginalPrice:y=!0,secondaryButtonText:f,primaryButtonText:b,secondaryButtonFun:P,primaryButtonFun:T,isShowTab:M=!0,copy:L}=o,n=L||{},d=o.productsTab&&o.productsTab.length>0,v=M&&d;return k("div",{ref:B,className:D("w-full",{"aiui-dark":p==="dark"},a,s?.root),style:{"--progress-track-bg":p==="dark"?"rgba(255, 255, 255, 0.2)":"rgba(0, 0, 0, 0.2)"},...S,children:[o.title&&e(H,{as:"h2",html:o.title,size:4,className:D("text-info-primary mb-4",s?.title)}),o.description&&e(z,{size:3,as:"p",html:o.description,className:D("text-info-primary mb-6",s?.description)}),k($,{defaultValue:o.productsTab?.[0]?.id,className:"w-full",children:[v&&e(O,{className:"mb-6",children:o.productsTab?.map(i=>e(V,{value:i.id,children:i.tab},"tab-"+i.id))}),v?o.productsTab?.map(i=>e(j,{value:i.id,children:e(A,{products:i.data,layoutMode:u,copy:n,showTags:h,stockDisplayMode:g,stockThresholdValue:m,onLearnMore:x,onShopNow:r,onAddToCart:c,classNames:s,secondaryButtonText:f,secondaryButtonFun:P,primaryButtonText:b,primaryButtonFun:T,showOriginalPrice:y})},"tab-content-"+i.id)):e(A,{products:o.productsCard,layoutMode:u,copy:n,showTags:h,stockDisplayMode:g,stockThresholdValue:m,onLearnMore:x,onShopNow:r,onAddToCart:c,classNames:s,secondaryButtonText:f,secondaryButtonFun:P,primaryButtonText:b,primaryButtonFun:T,showOriginalPrice:y})]})]})});F.displayName="ActiveShelf";const R=F;R.ProductCard=N;var tt=R;export{tt as default};
|
|
2
2
|
//# sourceMappingURL=index.js.map
|